vexip-ui
Version:
A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good
3 lines (2 loc) • 2.16 kB
JavaScript
"use strict";const e=require("vue"),c=require("@vexip-ui/config"),y=require("./props.cjs"),i=require("./symbol.cjs"),g=e.defineComponent({name:"TimelineItem",__name:"timeline-item",props:y.timelineItemProps,setup(u,{expose:d}){const m=u,o=c.useProps("timelineItem",m,{type:{default:"primary",validator:l=>i.timelineItemTypes.includes(l)},color:"",label:{default:null,static:!0},dashed:null,lineColor:null,spacing:null}),n=e.inject(i.TIMELINE_STATE,null),r=c.useNameHelper("timeline"),s=e.ref(o.label),a=e.ref(),p=e.computed(()=>({[r.be("item")]:!0,[r.bem("item",o.type)]:i.timelineItemTypes.includes(o.type)})),f=e.computed(()=>{const l=o.spacing||o.spacing===0?o.spacing:n==null?void 0:n.spacing,t={[r.cv("item-span")]:typeof l=="number"?`${l}px`:l};return o.color&&(t[r.cv("pointer-color")]=o.color,t[r.cv("pointer-b-color")]=o.color),t}),v=e.computed(()=>{const l=o.dashed??(n==null?void 0:n.dashed)??!1,t=o.lineColor??(n==null?void 0:n.lineColor);return{borderInlineStartStyle:l?"dashed":void 0,borderInlineStartColor:t}});if(d({currentLabel:s,content:a}),n){let l=function(){requestAnimationFrame(()=>{n!=null&&n.horizontal&&a.value&&(t.height=a.value.scrollHeight)})};const t=e.reactive({label:s,index:0,total:0,height:0});n.increaseItem(t),e.watch(()=>n.alternate,l),e.watch(()=>n.horizontal,l),e.onMounted(l),e.onUpdated(l),e.onBeforeUnmount(()=>{n.decreaseItem(t)})}function h(){c.emitEvent(o.onSignalClick,s.value),n==null||n.handleSignalClick(s.value)}return(l,t)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(p.value),style:e.normalizeStyle(f.value)},[e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("signal")),onClick:h},[e.renderSlot(l.$slots,"signal",{},()=>[e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("pointer"))},null,2)])],2),e.createElementVNode("div",{class:e.normalizeClass(e.unref(r).be("line")),style:e.normalizeStyle(v.value)},[e.renderSlot(l.$slots,"line")],6),e.createElementVNode("div",{ref_key:"content",ref:a,class:e.normalizeClass(e.unref(r).be("content"))},[e.renderSlot(l.$slots,"default")],2)],6))}});module.exports=g;
//# sourceMappingURL=timeline-item.vue2.cjs.map