vue-devui/timeline/index.umd.js

DevUI components based on Vite and Vue3

(function(f,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(f=typeof globalThis!="undefined"?globalThis:f||self,e(f.index={},f.Vue))})(this,function(f,e){"use strict";const b={direction:{type:String,default:"vertical"},center:{type:Boolean,default:!1},mode:{type:String,default:"normal"},timePosition:{type:String,default:"left"}},z={name:{type:String,default:"",required:!0},size:{type:[Number,String],default:"inherit"},color:{type:String,default:"inherit"},component:{type:Object,default:null},classPrefix:{type:String,default:"icon"},operable:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},rotate:{type:[Number,String]}},x={name:{type:String,default:"",required:!0},color:{type:String,default:"inherit"},size:{type:[Number,String],default:"inherit"}};function y(n,r,s){let i=n;return r&&(i+=`__${r}`),s&&(i+=`--${s}`),i}function $(n,r=!1){const s=r?`.devui-${n}`:`devui-${n}`;return{b:()=>y(s),e:t=>t?y(s,t):"",m:t=>t?y(s,"",t):"",em:(t,a)=>t&&a?y(s,t,a):""}}var L="",F=e.defineComponent({name:"DSvgIcon",props:x,setup(n){const{name:r,color:s,size:i}=e.toRefs(n),m=$("svg-icon"),o=e.computed(()=>`#icon-${r.value}`),d=e.computed(()=>typeof i.value=="number"?`${i.value}px`:i.value),t={width:d.value,height:d.value};return()=>e.createVNode("svg",{class:m.b(),style:t},[e.createVNode("use",{"xlink:href":o.value,fill:s.value},null)])}});function k(n){return/^((http|https):)?\/\//.test(n)}function q(n,r){const{component:s,name:i,size:m,color:o,classPrefix:d,rotate:t}=e.toRefs(n),a=$("icon"),l=e.computed(()=>typeof m.value=="number"?`${m.value}px`:m.value),u=s.value?e.resolveDynamicComponent(s.value):e.resolveDynamicComponent(F),p=()=>e.createVNode("img",e.mergeProps({src:i.value,alt:i.value.split("/")[i.value.split("/").length-1],class:[(t==null?void 0:t.value)==="infinite"&&a.m("spin")],style:{width:l.value||"",transform:`rotate(${t==null?void 0:t.value}deg)`,verticalAlign:"middle"}},r.attrs),null),h=()=>e.createVNode(u,e.mergeProps({name:i.value,color:o.value,size:l.value,class:[(t==null?void 0:t.value)==="infinite"&&a.m("spin")],style:{transform:`rotate(${t==null?void 0:t.value}deg)`}},r.attrs),null),c=()=>{const S=/^icon-/.test(i.value)?i.value:`${d.value}-${i.value}`;return e.createVNode("i",e.mergeProps({class:[d.value,S,(t==null?void 0:t.value)==="infinite"&&a.m("spin")],style:{fontSize:l.value,color:o.value,transform:`rotate(${t==null?void 0:t.value}deg)`}},r.attrs),null)};return{iconDom:()=>s.value?h():k(i.value)?p():c()}}var E=e.defineComponent({name:"DIcon",props:z,emits:["click"],setup(n,r){const{disabled:s,operable:i}=e.toRefs(n),{iconDom:m}=q(n,r),o=$("icon"),d=e.computed(()=>({[o.e("container")]:!0,[o.m("disabled")]:s.value,[o.m("operable")]:i.value,[o.m("no-slots")]:!Object.keys(r.slots).length})),t=a=>{s.value||r.emit("click",a)};return()=>{var a,l,u,p;return e.createVNode("div",{class:d.value,onClick:t},[(l=(a=r.slots).prefix)==null?void 0:l.call(a),m(),(p=(u=r.slots).suffix)==null?void 0:p.call(u)])}}});const R={time:{type:String},dotColor:{type:String},lineStyle:{type:String,default:"solid"},lineColor:{type:String},position:{type:String},timePosition:{type:String,default:"left"},type:{type:String,default:"primary"}};var g=e.defineComponent({name:"DTimelineItem",components:{DIcon:E},props:R,emits:[],setup(n,r){const s=e.inject("timeAxis"),i="devui-timeline-item",m=()=>{var l,u;return e.createVNode("div",{class:`${i}-time`},[r.slots.time?(u=(l=r.slots).time)==null?void 0:u.call(l):n.time])},o=()=>{var l,u;return e.createVNode("div",{class:`${i}-content`},[(u=(l=r.slots).default)==null?void 0:u.call(l,n)])},d=l=>l.includes(n.position)?o():s.props.direction==="horizontal"||n.timePosition==="left"?m():"",t=l=>l==="primary"?"":e.createVNode("i",{class:`icon-${l==="success"?"right":l}-o`},null),a=()=>{var l,u;return r.slots.dot?e.createVNode("div",{style:{color:n.dotColor},class:`${i}-dot`},[" ",(u=(l=r.slots).dot)==null?void 0:u.call(l)]):e.createVNode("div",{class:`${i}-dot ${i}-type-${n.type}`,style:{borderColor:n.dotColor}},[t(n.type)])};return()=>e.createVNode("div",{class:i},[e.createVNode("div",{class:`${i}-data-left ${i}-data-top`},[d(["top","left"])]),e.createVNode("div",{class:`${i}-axis`},[a(),s.props.direction==="vertical"&&n.timePosition==="bottom"?m():"",e.createVNode("div",{class:`${i}-line ${i}-line-style-${n.lineStyle}`,style:{borderColor:n.lineColor}},[r.slots.extra?e.createVNode("div",{class:`${i}-line-extra`},[r.slots.extra()]):""])]),e.createVNode("div",{class:`${i}-data-right ${i}-data-bottom`},[d(["right","bottom"])])])}}),M="",N=e.defineComponent({name:"DTimeline",components:{TimelineItem:g},props:b,emits:[],setup(n,r){e.provide("timeAxis",{ctx:r,props:n});const s=e.ref(),i=e.reactive({marginLeft:"0px",height:"auto"}),m=()=>{i.height="auto",i.marginLeft="0px",n.direction==="horizontal"&&e.nextTick(()=>{var d;const o=s.value;n.center&&(i.marginLeft=(((d=o==null?void 0:o.firstElementChild)==null?void 0:d.clientWidth)||0)/2+"px"),i.height=Math.max(...Array.from(o==null?void 0:o.querySelectorAll(".devui-timeline-item-data-top")).map(t=>t.clientHeight),...Array.from(o==null?void 0:o.querySelectorAll(".devui-timeline-item-data-bottom")).map(t=>t.clientHeight))*2+Math.max(...Array.from(o==null?void 0:o.querySelectorAll(".devui-timeline-item-axis")).map(t=>t.clientHeight))+"px"})};return e.onMounted(()=>{m()}),e.watch(e.toRef(n,"direction"),()=>{m()}),()=>{const o=(a,l)=>l?e.createVNode(a,{position:l},null):e.createVNode(a,null,null),d=()=>{var u,p,h;const a=(h=(p=(u=r.slots).default)==null?void 0:p.call(u))!=null?h:[];let l;return a.length===1&&a[0].type===e.Fragment?l=a[0].children||[]:l=a,l.map((c,v)=>{var S,V,C,P,I,D,A,T;return v+1===l.length&&!((S=c.props)==null?void 0:S.lineStyle)&&!((V=c.props)==null?void 0:V["line-style"])&&(c=e.createVNode(c,{"line-style":"none"},null)),!((C=c.props)==null?void 0:C.timePosition)&&!((P=c.props)==null?void 0:P["time-position"])&&(c=e.createVNode(c,{"time-position":n.timePosition?n.timePosition:"left"},null)),n.direction==="horizontal"?((I=c.props)==null?void 0:I.position)==="top"||((D=c.props)==null?void 0:D.position)==="bottom"?c:n.mode==="alternative"?o(c,v%2===0?"bottom":"top"):o(c,"bottom"):((A=c.props)==null?void 0:A.position)==="left"||((T=c.props)==null?void 0:T.position)==="right"?c:n.mode==="alternative"?o(c,v%2===0?"left":"right"):o(c,"right")})},t=()=>n.direction==="horizontal"?"horizontal":"vertical";return e.createVNode("div",{class:`devui-timeline devui-timeline-${t()}  ${n.center?"devui-timeline-"+t()+"-center":""} `,ref:s,style:i},[d()])}}}),_={title:"Timeline \u65F6\u95F4\u8F74",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(n){n.component(N.name,N),n.component(g.name,g)}};f.Timeline=N,f.TimelineItem=g,f.default=_,f.timeAxisProps=b,Object.defineProperty(f,"__esModule",{value:!0}),f[Symbol.toStringTag]="Module"});