vue-devui 1.0.0-rc.4 → 1.0.0-rc.5

package/table/index.umd.js

@@ -0,0 +1 @@
+var ct=Object.defineProperty,ut=Object.defineProperties;var ft=Object.getOwnPropertyDescriptors;var ie=Object.getOwnPropertySymbols;var mt=Object.prototype.hasOwnProperty,ht=Object.prototype.propertyIsEnumerable;var I=(C,t,N)=>t in C?ct(C,t,{enumerable:!0,configurable:!0,writable:!0,value:N}):C[t]=N,O=(C,t)=>{for(var N in t||(t={}))mt.call(t,N)&&I(C,N,t[N]);if(ie)for(var N of ie(t))ht.call(t,N)&&I(C,N,t[N]);return C},E=(C,t)=>ut(C,ft(t));var T=(C,t,N)=>(I(C,typeof t!="symbol"?t+"":t,N),N);(function(C,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue"),require("@floating-ui/dom"),require("@vueuse/core")):typeof define=="function"&&define.amd?define(["exports","vue","@floating-ui/dom","@vueuse/core"],t):(C=typeof globalThis!="undefined"?globalThis:C||self,t(C.index={},C.Vue,C.dom,C.core))})(this,function(C,t,N,de){"use strict";const ce={data:{type:Array,default:[]},striped:{type:Boolean,default:!1},scrollable:{type:Boolean,default:!1},maxWidth:{type:String},maxHeight:{type:String},tableWidth:{type:String},tableHeight:{type:String},size:{type:String,validator(e){return e==="sm"||e==="md"||e==="lg"},default:"sm"},rowHoveredHighlight:{type:Boolean,default:!0},fixHeader:{type:Boolean,default:!1},checkable:{type:Boolean,default:!1},tableLayout:{type:String,default:"fixed",validator(e){return e==="fixed"||e==="auto"}},showLoading:{type:Boolean,default:!1},headerBg:{type:Boolean,default:!1},spanMethod:{type:Function},borderType:{type:String,default:""}},A=Symbol();function j(e,n,o){let l=e;return n&&(l+=`__${n}`),o&&(l+=`--${o}`),l}function L(e){const n=`devui-${e}`;return{b:()=>j(n),e:a=>a?j(n,a):"",m:a=>a?j(n,"",a):"",em:(a,i)=>a&&i?j(n,a,i):""}}function ue(e){const n=L("table"),o=t.computed(()=>({[n.e("view")]:!0,[n.m("striped")]:e.striped,[n.m("header-bg")]:e.headerBg,[n.m("layout-auto")]:e.tableLayout==="auto",[n.m(`${e.size}`)]:!0,[n.m(`${e.borderType}`)]:Boolean(e.borderType)})),l=t.computed(()=>({maxHeight:e.maxHeight,maxWidth:e.maxWidth,height:e.tableHeight,width:e.tableWidth}));return{classes:o,style:l}}const W=e=>{const n=L("table"),o=t.computed(()=>({[n.e("checkable-cell")]:e.value.type==="checkable",[n.m("sticky-cell")]:Boolean(e.value.fixedLeft)||Boolean(e.value.fixedRight)})),l=t.computed(()=>({left:e.value.fixedLeft,right:e.value.fixedRight}));return{stickyClass:o,stickyStyle:l}};function U(e,n){return e.map(o=>{var l;return o.id===n.id?n:(((l=o.children)==null?void 0:l.length)&&(o.children=U(o.children,n)),o)})}function z(e){const n=[];return e.forEach(o=>{o.children?n.push.apply(n,z(o.children)):n.push(o)}),n}const fe=()=>{const e=t.ref([]),n=t.ref([]),o=()=>{e.value.sort((a,i)=>a.order-i.order)};return{_columns:e,flatColumns:n,insertColumn:(a,i)=>{const d=t.unref(e);let c=[];i?(i&&!i.children&&(i.children=[]),i.children.push(a),c=U(d,i)):(d.push(a),c=d),o(),e.value=c},removeColumn:a=>{const i=e.value.findIndex(d=>d===a);i!==-1&&e.value.splice(i,1)},sortColumn:o,updateColumns:()=>{n.value=[].concat(z(e.value))}}},me=(e,n)=>{const o=t.ref([]),l=t.ref(!1),s=t.computed({get:()=>l.value,set:i=>{l.value=i;for(let d=0;d<o.value.length;d++)o.value[d]=i}}),r=t.ref(!1);return t.watch(e,i=>{o.value=new Array(i.length).fill(!1)},{deep:!0,immediate:!0}),t.watch(o,i=>{if(i.length===0)return;let d=!0,c=!0;for(let u=0;u<i.length;u++)d&&(d=i[u]),c&&(c=!i[u]);l.value=d,r.value=!(c||d)},{immediate:!0,deep:!0}),{_checkList:o,_checkAll:s,_halfChecked:r,getCheckedRows:()=>n.value.filter((i,d)=>o.value[d])}},he=(e,n)=>({sortData:(s,r)=>{s==="ASC"?n.value=n.value.sort((a,i)=>r?r(a,i)?1:-1:0):s==="DESC"?n.value=n.value.sort((a,i)=>r?r(a,i)?-1:1:0):n.value=[...e.value]},thList:[]}),pe=(e,n)=>{const o=new Set;return{filterData:(r,a)=>{o.add(r);const i=[...o];n.value=e.value.filter(d=>i.reduce((c,u)=>c&&a.indexOf(d[u])!==-1,!0))},resetFilterData:()=>{o.clear(),n.value=[...e.value]}}},ye=e=>({isFixedLeft:t.computed(()=>e.value.reduce((o,l)=>o||!!l.fixedLeft,!1))});function ge(e){const n=t.ref([]);t.watch(e,y=>{n.value=[...y]},{deep:!0,immediate:!0});const{_columns:o,flatColumns:l,insertColumn:s,removeColumn:r,sortColumn:a,updateColumns:i}=fe(),{_checkAll:d,_checkList:c,_halfChecked:u,getCheckedRows:f}=me(e,n),{sortData:m,thList:h}=he(e,n),{filterData:p,resetFilterData:b}=pe(e,n),{isFixedLeft:v}=ye(o);return{states:{_data:n,_columns:o,flatColumns:l,_checkList:c,_checkAll:d,_halfChecked:u,isFixedLeft:v,thList:h},insertColumn:s,sortColumn:a,removeColumn:r,updateColumns:i,getCheckedRows:f,sortData:m,filterData:p,resetFilterData:b}}var F=t.defineComponent({name:"DColGroup",setup(){const e=t.inject(A),n=e==null?void 0:e.store.states._columns;return()=>(e==null?void 0:e.props.fixHeader)?t.createVNode("colgroup",null,[n==null?void 0:n.value.map((o,l)=>t.createVNode("col",{key:l,width:o.realWidth},null))]):null}});const be={sortDirection:{type:String,default:""}};var pt="",ve=t.defineComponent({props:be,emits:["sort"],setup(e,n){const o={ASC:"DESC",DESC:"",default:"ASC"},l=()=>{n.emit("sort",o[e.sortDirection||"default"])};return()=>t.createVNode("span",{onClick:l,class:"sort-clickable"},[t.createVNode("i",{class:["datatable-svg",{"sort-icon-default":!e.sortDirection,"sort-icon-asc":e.sortDirection==="ASC","sort-icon-desc":e.sortDirection==="DESC"}]},[t.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg"},[t.createVNode("defs",null,[t.createVNode("circle",{id:"sort-svg-path-1",cx:"8",cy:"8",r:"8"},null),t.createVNode("filter",{x:"-34.4%",y:"-21.9%",width:"168.8%",height:"168.8%",filterUnits:"objectBoundingBox",id:"filter-2"},[t.createVNode("feOffset",{dx:"0",dy:"2",in:"SourceAlpha",result:"shadowOffsetOuter1"},null),t.createVNode("feGaussianBlur",{stdDeviation:"1.5",in:"shadowOffsetOuter1",result:"shadowBlurOuter1"},null),t.createVNode("feColorMatrix",{values:"0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.085309222 0",type:"matrix",in:"shadowBlurOuter1"},null)])]),t.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[t.createVNode("use",{"fill-rule":"evenodd","xlink:href":"#sort-svg-path-1"},null),t.createVNode("polygon",{points:"8 4 11 7 5 7"},null),t.createVNode("polygon",{points:"8 12 5 9 11 9"},null)])])])])}});const we={visible:{type:Boolean,default:!1},trigger:{type:String,default:"click"},closeScope:{type:String,default:"all"},position:{type:Array,default:["bottom"]},align:{type:String,default:null},offset:{type:[Number,Object],default:4},shiftOffset:{type:Number},closeOnMouseLeaveMenu:{type:Boolean,default:!1},showAnimation:{type:Boolean,default:!0},overlayClass:{type:String,default:""},destroyOnHide:{type:Boolean,default:!0}};function Ce(e){return e instanceof Element?e:e&&typeof e=="object"&&e.$el instanceof Element?e.$el:null}const x=new Map;function D(e,n,o){return e==null||e.addEventListener(n,o),()=>{e==null||e.removeEventListener(n,o)}}const Ve=({id:e,isOpen:n,origin:o,dropdownRef:l,props:s,emit:r})=>{let a=!1,i=!1;const{trigger:d,closeScope:c,closeOnMouseLeaveMenu:u}=t.toRefs(s),f=h=>{n.value=h,r("toggle",n.value)},m=async(h,p)=>{await new Promise(b=>setTimeout(b,50)),!(h==="origin"&&a||h==="dropdown"&&i)&&(p&&[...x.values()].reverse().forEach(b=>{setTimeout(()=>{var v;(v=b.toggle)==null||v.call(b)},0)}),f(!1))};t.watch([d,o,l],([h,p,b],v,y)=>{const k=Ce(p),B=[];setTimeout(()=>{B.push(D(document,"click",g=>{const w=[...x.values()];!n.value||c.value==="none"||b.contains(g.target)&&c.value==="blank"||w.some(V=>{var S;return(S=V.toggleEl)==null?void 0:S.contains(g.target)})&&w.some(V=>{var S;return(S=V.menuEl)==null?void 0:S.contains(g.target)})||([...x.values()].reverse().forEach(V=>{setTimeout(()=>{var S,P;((S=V.toggleEl)==null?void 0:S.contains(g.target))||(P=V.toggle)==null||P.call(V)},0)}),a=!1)}))},0),h==="click"?B.push(D(k,"click",()=>f(!n.value)),D(b,"mouseleave",g=>{var w;u.value&&!((w=x.get(e).child)==null?void 0:w.contains(g.relatedTarget))&&m("dropdown",!0)})):h==="hover"&&B.push(D(k,"mouseenter",()=>{i=!0,f(!0)}),D(k,"mouseleave",()=>{i=!1,m("origin")}),D(b,"mouseenter",()=>{a=!0,n.value=!0}),D(b,"mouseleave",g=>{var w;a=!1,!(g.relatedTarget&&((k==null?void 0:k.contains(g.relatedTarget))||((w=x.get(e).child)==null?void 0:w.contains(g.relatedTarget))))&&m("dropdown",!0)})),y(()=>B.forEach(g=>g()))})};function ke(e,n,o,l,s,r,a){const i=d=>{const c=d.offsetHeight;window.innerHeight-l.value.getBoundingClientRect().bottom>=c?r.value="bottom":r.value="top"};t.watch(n,(d,c)=>{c!==void 0&&(o.value=d,a("toggle",o.value))},{immediate:!0}),t.watch([o,s],([d,c])=>{var u;if(d){x.set(e,E(O({},x.get(e)),{menuEl:c,toggle:()=>{o.value=!1,a("toggle",o.value)}}));for(const f of x.values())((u=f.menuEl)==null?void 0:u.contains(l.value))&&(f.child=c)}c&&i(c)}),t.onMounted(()=>{x.set(e,{toggleEl:l.value})}),t.onUnmounted(()=>{x.delete(e)})}function Ne(e,n,o){const{showAnimation:l,overlayClass:s,destroyOnHide:r}=t.toRefs(e),a=t.ref(!1),i=t.ref(!1),d=t.computed(()=>({transformOrigin:n.value==="top"?"0% 100%":"0% 0%"})),c=t.computed(()=>({"fade-in-bottom":l.value&&o.value&&n.value==="bottom","fade-in-top":l.value&&o.value&&n.value==="top",[`${s.value}`]:!0})),u=f=>{n.value=f.includes("top")||f.includes("end")?"top":"bottom"};return t.watch(o,f=>{a.value=r.value?f:!0,i.value=f}),{overlayModelValue:a,overlayShowValue:i,styles:d,classes:c,handlePositionChange:u}}var yt="";function Se(e){return typeof e=="function"||Object.prototype.toString.call(e)==="[object Object]"&&!t.isVNode(e)}const xe=t.defineComponent({setup(e,n){return()=>{let o;return t.createVNode(t.Teleport,{to:"#d-overlay-anchor"},{default:()=>[t.createVNode(t.Transition,{name:"devui-overlay-fade"},Se(o=t.renderSlot(n.slots,"default"))?o:{default:()=>[o]})]})}}}),Be=E(O({},{visible:{type:Boolean},backgroundBlock:{type:Boolean,default:!1},backgroundClass:{type:String,default:""},backgroundStyle:{type:[String,Object]},onBackdropClick:{type:Function},backdropClose:{type:Boolean,default:!0},hasBackdrop:{type:Boolean,default:!0}}),{overlayStyle:{type:[String,Object],default:void 0}}),Oe=["update:visible","backdropClick"];function Te(e,n){const o=t.computed(()=>["devui-overlay-background",e.backgroundClass,e.hasBackdrop?"devui-overlay-background__color":"devui-overlay-background__disabled"]),l=t.computed(()=>"devui-overlay"),s=a=>{var i;a.preventDefault(),(i=e.onBackdropClick)==null||i.call(e),e.backdropClose&&n.emit("update:visible",!1)},r=a=>a.cancelBubble=!0;return t.onMounted(()=>{const a=document.body,i=a.style.overflow,d=a.style.position;t.watch([()=>e.visible,()=>e.backgroundBlock],([c,u])=>{if(u){const f=a.getBoundingClientRect().y;c?(a.style.overflowY="scroll",a.style.position=c?"fixed":"",a.style.top=`${f}px`):(a.style.overflowY=i,a.style.position=d,a.style.top="",window.scrollTo(0,-f))}}),t.onUnmounted(()=>{document.body.style.overflow=i})}),{backgroundClass:o,overlayClass:l,handleBackdropClick:s,handleOverlayBubbleCancel:r}}var bt="";t.defineComponent({name:"DFixedOverlay",props:Be,emits:Oe,setup(e,n){const{backgroundClass:o,overlayClass:l,handleBackdropClick:s,handleOverlayBubbleCancel:r}=Te(e,n);return()=>t.createVNode(xe,null,{default:()=>[e.visible&&t.createVNode("div",{class:o.value,style:e.backgroundStyle,onClick:s},[t.createVNode("div",{class:l.value,style:e.overlayStyle,onClick:r},[t.renderSlot(n.slots,"default")])])]})}});const Ae={modelValue:{type:Boolean,default:!1},origin:{type:Object,require:!0},position:{type:Array,default:["bottom"]},offset:{type:[Number,Object],default:8},shiftOffset:{type:Number},align:{type:String,default:null},showArrow:{type:Boolean,default:!1},isArrowCenter:{type:Boolean,default:!0}};function De(e){const n=/(auto|scroll|hidden)/;for(let o=e;o=o.parentElement;o.parentElement!==document.body){const l=window.getComputedStyle(o);if(n.test(l.overflow+l.overflowX+l.overflowY))return o}return window}function Le(e,n,o,l){let{x:s,y:r}=n;if(!e){const{width:a,height:i}=l;s&&o.includes("start")&&(s=12),s&&o.includes("end")&&(s=Math.round(a-24)),r&&o.includes("start")&&(r=10),r&&o.includes("end")&&(r=i-14)}return{x:s,y:r}}function Ee(e,n){const o=t.ref(),l=t.ref();let s=null;const r=(i,d,c,u)=>{const{x:f,y:m}=Le(e.isArrowCenter,c,d,u.getBoundingClientRect()),h={top:"bottom",right:"left",bottom:"top",left:"right"}[d.split("-")[0]];Object.assign(i.style,{left:f?`${f}px`:"",top:m?`${m}px`:"",right:"",bottom:"",[h]:"-4px"})},a=async()=>{const i=e.origin,d=t.unref(o.value),c=t.unref(l.value),u=[N.offset(e.offset),N.autoPlacement({alignment:e.align,allowedPlacements:e.position})];e.showArrow&&u.push(N.arrow({element:c})),e.shiftOffset!==void 0&&u.push(N.shift());const{x:f,y:m,placement:h,middlewareData:p}=await N.computePosition(i,d,{strategy:"fixed",middleware:u});let b=f,v=m;if(e.shiftOffset!==void 0){const{x:y,y:k}=p.shift;y<0&&(b-=e.shiftOffset),y>0&&(b+=e.shiftOffset),k<0&&(v-=e.shiftOffset),k>0&&(v+=e.shiftOffset)}n("positionChange",h),Object.assign(d.style,{top:`${v}px`,left:`${b}px`}),e.showArrow&&r(c,h,p.arrow,d)};return t.watch(()=>e.modelValue,()=>{e.modelValue&&e.origin?(s=De(e.origin),t.nextTick(a),s==null||s.addEventListener("scroll",a),s!==window&&window.addEventListener("scroll",a),window.addEventListener("resize",a)):(s==null||s.removeEventListener("scroll",a),s!==window&&window.removeEventListener("scroll",a),window.removeEventListener("resize",a))}),t.onUnmounted(()=>{s==null||s.removeEventListener("scroll",a),s!==window&&window.removeEventListener("scroll",a),window.removeEventListener("resize",a)}),{arrowRef:l,overlayRef:o,updatePosition:a}}var vt="";const q=t.defineComponent({name:"DFlexibleOverlay",inheritAttrs:!1,props:Ae,emits:["update:modelValue","positionChange"],setup(e,{slots:n,attrs:o,emit:l,expose:s}){const{arrowRef:r,overlayRef:a,updatePosition:i}=Ee(e,l);return s({updatePosition:i}),()=>{var d;return e.modelValue&&t.createVNode("div",t.mergeProps({ref:a,class:"devui-flexible-overlay"},o),[(d=n.default)==null?void 0:d.call(n),e.showArrow&&t.createVNode("div",{ref:r,class:"devui-flexible-overlay-arrow"},null)])}}});var wt="";let Re=1;var Pe=t.defineComponent({name:"DDropdown",inheritAttrs:!1,props:we,emits:["toggle"],setup(e,{slots:n,attrs:o,emit:l,expose:s}){const{visible:r,position:a,align:i,offset:d,destroyOnHide:c,showAnimation:u}=t.toRefs(e),f=t.ref(),m=t.ref(),h=t.ref(),p=`dropdown_${Re++}`,b=t.ref(!1),v=t.ref("bottom");Ve({id:p,isOpen:b,origin:f,dropdownRef:m,props:e,emit:l}),ke(p,r,b,f,m,v,l);const{overlayModelValue:y,overlayShowValue:k,styles:B,classes:g,handlePositionChange:w}=Ne(e,v,b);return t.watch(k,V=>{t.nextTick(()=>{!c.value&&V&&h.value.updatePosition()})}),s({updatePosition:()=>h.value.updatePosition()}),()=>{var V;return t.createVNode(t.Fragment,null,[t.createVNode("div",{ref:f,class:"devui-dropdown-toggle"},[(V=n.default)==null?void 0:V.call(n)]),t.createVNode(t.Teleport,{to:"body"},{default:()=>[t.createVNode(t.Transition,{name:u.value?`devui-dropdown-fade-${v.value}`:""},{default:()=>[t.withDirectives(t.createVNode(q,{modelValue:y.value,"onUpdate:modelValue":S=>y.value=S,ref:h,origin:f.value,position:a.value,align:i.value,offset:d.value,onPositionChange:w,class:g.value,style:B.value},{default:()=>{var S;return[t.createVNode("div",t.mergeProps({ref:m,class:"devui-dropdown-menu-wrap"},o),[(S=n.menu)==null?void 0:S.call(n)])]}}),[[t.vShow,k.value]])]})]})])}}});const je={modelValue:{type:Boolean,default:!1},origin:{type:Object,require:!0},position:{type:Array,default:["bottom"]},align:{type:String,default:null},offset:{type:[Number,Object],default:4},clickOutside:{type:Function,default:()=>!0},showAnimation:{type:Boolean,default:!0},overlayClass:{type:String,default:""}};t.defineComponent({name:"DDropdownMenu",inheritAttrs:!1,props:je,emits:["update:modelValue"],setup(e,{slots:n,attrs:o,emit:l}){const{modelValue:s,origin:r,position:a,align:i,offset:d,clickOutside:c,showAnimation:u,overlayClass:f}=t.toRefs(e),m=t.ref(null);de.onClickOutside(m,v=>{var y,k;((y=c.value)==null?void 0:y.call(c))&&!((k=r==null?void 0:r.value)==null?void 0:k.contains(v.target))&&l("update:modelValue",!1)});const h=t.ref("bottom"),p=v=>{h.value=v.split("-")[0]==="top"?"top":"bottom"},b=t.computed(()=>({transformOrigin:h.value==="top"?"0% 100%":"0% 0%"}));return()=>t.createVNode(t.Teleport,{to:"body"},{default:()=>[t.createVNode(t.Transition,{name:u.value?`devui-dropdown-fade-${h.value}`:""},{default:()=>[t.createVNode(q,{modelValue:s.value,"onUpdate:modelValue":v=>s.value=v,origin:r==null?void 0:r.value,position:a.value,align:i.value,offset:d.value,onPositionChange:p,class:f.value,style:b.value},{default:()=>{var v;return[t.createVNode("div",t.mergeProps({ref:m,class:"devui-dropdown-menu-wrap"},o),[(v=n.default)==null?void 0:v.call(n)])]}})]})]})}});var Ct="";const Y={name:{type:String,default:void 0},halfchecked:{type:Boolean,default:!1},isShowTitle:{type:Boolean,default:!0},title:{type:String},color:{type:String,default:void 0},showAnimation:{type:Boolean,default:!0},disabled:{type:Boolean,default:!1},beforeChange:{type:Function,default:void 0}},Me=E(O({},Y),{halfchecked:{type:Boolean,default:!1},checked:{type:Boolean,default:!1},value:{type:String},label:{type:String,default:void 0},title:{type:String,default:void 0},"onUpdate:checked":{type:Function,default:void 0},onChange:{type:Function,default:void 0},modelValue:{type:Boolean},"onUpdate:modelValue":{type:Function}}),Fe=E(O({},Y),{modelValue:{type:Array,required:!0},direction:{type:String,default:"column"},itemWidth:{type:Number,default:void 0},options:{type:Array,default:()=>[]},onChange:{type:Function,default:void 0},"onUpdate:modelValue":{type:Function,default:void 0}}),K=Symbol("d-checkbox-group");var M=t.defineComponent({name:"DCheckbox",props:Me,emits:["change","update:checked","update:modelValue"],setup(e,n){const o=t.inject(K,null),l=t.computed(()=>e.checked||e.modelValue),s=t.computed(()=>(o==null?void 0:o.disabled.value)||e.disabled),r=t.computed(()=>{var p,b;return(b=(p=o==null?void 0:o.isItemChecked)==null?void 0:p.call(o,e.value))!=null?b:l.value}),a=t.computed(()=>{var p;return(p=o==null?void 0:o.isShowTitle.value)!=null?p:e.isShowTitle}),i=t.computed(()=>{var p;return(p=o==null?void 0:o.showAnimation.value)!=null?p:e.showAnimation}),d=t.computed(()=>{var p;return(p=o==null?void 0:o.color.value)!=null?p:e.color}),c=o==null?void 0:o.itemWidth.value,u=o==null?void 0:o.direction.value,f=(p,b)=>{var y;if(s.value)return Promise.resolve(!1);const v=(y=e.beforeChange)!=null?y:o==null?void 0:o.beforeChange;if(v){const k=v(p,b);return typeof k=="boolean"?Promise.resolve(k):k}return Promise.resolve(!0)},m=()=>{const p=!l.value;o==null||o.toggleGroupVal(e.value),n.emit("update:checked",p),n.emit("update:modelValue",p),n.emit("change",p)};return{itemWidth:c,direction:u,mergedColor:d,mergedDisabled:s,mergedIsShowTitle:a,mergedChecked:r,mergedShowAnimation:i,handleClick:()=>{f(!l.value,e.label).then(p=>p&&m())}}},render(){var P;const{itemWidth:e,direction:n,mergedChecked:o,mergedDisabled:l,mergedIsShowTitle:s,mergedShowAnimation:r,halfchecked:a,title:i,label:d,handleClick:c,name:u,value:f,mergedColor:m,$slots:h}=this,p={"devui-checkbox-column-margin":n==="column","devui-checkbox-wrap":typeof e!="undefined"},b=e?[`width: ${e}px`]:[],v={"devui-checkbox":!0,active:o,halfchecked:a,disabled:l,unchecked:!o},y=s?i||d:"",k=m&&a||m?`linear-gradient(${m}, ${m})`:"",B=[`border-color:${(o||a)&&m?m:""}`,`background-image:${k}`,`background-color:${m&&a?m:""}`],g={"devui-checkbox-material":!0,"custom-color":m,"devui-checkbox-no-label":!d&&!h.default,"devui-no-animation":!r,"devui-checkbox-default-background":!a},w={"devui-tick":!0,"devui-no-animation":!r},V=dt=>dt.stopPropagation(),S={indeterminate:a};return t.createVNode("div",{class:p,style:b},[t.createVNode("div",{class:v},[t.createVNode("label",{title:y,onClick:c},[t.createVNode("input",t.mergeProps({name:u||f,class:"devui-checkbox-input",type:"checkbox"},S,{checked:o,disabled:l,onClick:V,onChange:V}),null),t.createVNode("span",{style:B,class:g},[t.createVNode("span",{class:"devui-checkbox-halfchecked-bg"},null),t.createVNode("svg",{viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg",class:"devui-checkbox-tick"},[t.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[t.createVNode("polygon",{"fill-rule":"nonzero",points:"5.17391304 6.56521739 7.7173913 9.10869565 11.826087 5 13 6.17391304 7.7173913 11.4565217 4 7.73913043",class:w},null)])])]),d||((P=h.default)==null?void 0:P.call(h))])])])}}),Vt="";t.defineComponent({name:"DCheckboxGroup",props:Fe,emits:["change","update:modelValue"],setup(e,n){const o=t.toRef(e,"modelValue"),l={checked:!1,isShowTitle:!0,halfchecked:!1,showAnimation:!0,disabled:!1},s=a=>{let i=-1;if(typeof o.value[0]=="string"?i=o.value.findIndex(d=>d===a):typeof o.value[0]=="object"&&(i=o.value.findIndex(d=>d.value===a)),i===-1){if(typeof e.options[0]=="object"){const c=e.options.find(f=>f.value===a),u=[...o.value,c];n.emit("update:modelValue",u),n.emit("change",u);return}const d=[...o.value,a];n.emit("update:modelValue",d),n.emit("change",d);return}o.value.splice(i,1),n.emit("update:modelValue",o.value),n.emit("change",o.value)},r=a=>{if(typeof o.value[0]=="string")return o.value.includes(a);if(typeof o.value[0]=="object")return o.value.some(i=>i.value===a)};return t.provide(K,{disabled:t.toRef(e,"disabled"),isShowTitle:t.toRef(e,"isShowTitle"),color:t.toRef(e,"color"),showAnimation:t.toRef(e,"showAnimation"),beforeChange:e.beforeChange,isItemChecked:r,toggleGroupVal:s,itemWidth:t.toRef(e,"itemWidth"),direction:t.toRef(e,"direction")}),{defaultOpt:l}},render(){var r;const{direction:e,$slots:n,defaultOpt:o,options:l}=this;let s=(r=n.default)==null?void 0:r.call(n);return(l==null?void 0:l.length)>0&&(s=l.map(a=>{let i=null;return typeof a=="string"?i=Object.assign({},o,{label:a,value:a}):typeof a=="object"&&(i=Object.assign({},o,E(O({},a),{label:a.name}))),t.createVNode(M,i,null)})),t.createVNode("div",{class:"devui-checkbox-group"},[t.createVNode("div",{class:{"devui-checkbox-list-inline":e==="row"}},[s])])}});var kt="";const _e=t.defineComponent({props:{modelValue:{type:Array,default:[]},"onUpdate:modelValue":{type:Function},customTemplate:{type:Function},filterList:{type:Array,required:!0},filterMultiple:{type:Boolean,default:!0}},emits:["update:modelValue"],setup(e){const n=t.ref(null),o=(r,a)=>{const i=e.modelValue,d=e["onUpdate:modelValue"],c=!!i.find(u=>u===r.value);a&&!c?d==null||d([...i,r.value]):!a&&c&&(d==null||d(i.filter(u=>r.value!==u)))},l=r=>{var a;(a=e["onUpdate:modelValue"])==null||a.call(e,[r.value])},s=t.computed(()=>{const r=e.modelValue,a=i=>!!r.find(d=>d===i.value);return()=>t.createVNode("ul",{class:"devui-dropdown-menu data-table-column-filter-content",style:"padding:10px"},[e.filterList.map((i,d)=>t.createVNode("li",{style:d>0?"margin-top:10px":""},[e.filterMultiple?t.createVNode(M,{modelValue:a(i),"onUpdate:modelValue":c=>o(i,c)},{default:()=>[i.name]}):t.createVNode("span",{onClick:()=>l(i)},[i.name])]))])});return()=>t.createVNode(t.Fragment,null,[t.createVNode("span",{ref:n},[t.createVNode("i",{class:["filter-icon",{"filter-icon-active":!0}]},[t.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1",xmlns:"http://www.w3.org/2000/svg","xmlns:xlink":"http://www.w3.org/1999/xlink"},[t.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[t.createVNode("g",null,[t.createVNode("polygon",{points:"10.0085775 7 10.0085775 15 6 13 6 7 2 3 2 1 14 1 14 3"},null)])])])])]),t.createVNode(Pe,{origin:n.value,closeScope:"blank"},{default:()=>{var r,a;return[(a=(r=e.customTemplate)==null?void 0:r.call(e,{value:e.modelValue,onChange:e["onUpdate:modelValue"]}))!=null?a:s.value()]}})])}}),$e=e=>{const n=t.inject(A),o=n.store,l=t.ref(e.value.sortDirection),s=t.computed(()=>({"sort-active":Boolean(l.value)})),r=t.getCurrentInstance();r&&o.states.thList.push(r),t.onMounted(()=>{var c;e.value.sortable&&e.value.sortDirection&&((c=o.sortData)==null||c.call(o,l.value,e.value.sortMethod))});const a=()=>{o.states.thList.forEach(c=>{var u,f;c!==r&&((f=(u=c.exposed)==null?void 0:u.clearSortOrder)==null||f.call(u))})};return{direction:l,sortClass:s,handleSort:c=>{var u;l.value=c,a(),(u=o.sortData)==null||u.call(o,l.value,e.value.sortMethod),n.emit("sort-change",{field:e.value.field,direction:l.value})},clearSortOrder:()=>{l.value=""}}},He=(e,n)=>{const o=t.shallowRef();return t.watch(o,l=>{e.filterData(n.value.field,l)}),o};var Ie=t.defineComponent({name:"DTableHeaderTh",props:{column:{type:Object,required:!0}},setup(e,{expose:n}){const l=t.inject(A).store,{column:s}=t.toRefs(e),{direction:r,sortClass:a,handleSort:i,clearSortOrder:d}=$e(s),c=He(l,s),{stickyClass:u,stickyStyle:f}=W(s);return n({clearSortOrder:d}),()=>{var m,h;return t.createVNode("th",{class:[u.value,a.value],style:f.value},[t.createVNode("div",{class:"header-container"},[(h=(m=s.value).renderHeader)==null?void 0:h.call(m,s.value,l),s.value.filterable&&t.createVNode(_e,{modelValue:c.value,"onUpdate:modelValue":p=>c.value=p,filterList:e.column.filterList,customTemplate:e.column.customFilterTemplate},null),s.value.sortable&&t.createVNode(ve,{"sort-direction":r.value,onSort:i},null)])])}}});function X(e){const n=[];return e.forEach(o=>{o.children?(n.push(o),n.push.apply(n,X(o.children))):n.push(o)}),n}function We(e){let n=1;const o=(r,a)=>{if(a&&(r.level=a.level+1,n<r.level&&(n=r.level)),r.children){let i=0;r.children.forEach(d=>{o(d,r),i+=d.colSpan}),r.colSpan=i}else r.colSpan=1};e.forEach(r=>{r.level=1,o(r,void 0)});const l=[];for(let r=0;r<n;r++)l.push([]);return X(e).forEach(r=>{r.children?(r.rowSpan=1,r.children.forEach(a=>a.isSubColumn=!0)):r.rowSpan=n-r.level+1,l[r.level-1].push(r)}),l}function Ue(){const e=t.inject(A);return{headerRows:t.computed(()=>We(e==null?void 0:e.store.states._columns.value))}}var Nt="",St="",J=t.defineComponent({name:"DTableHeader",setup(){const e=L("table"),{headerRows:n}=Ue();return()=>t.createVNode("thead",{class:e.e("thead")},[n.value.map(o=>t.createVNode("tr",null,[o.map((l,s)=>t.createVNode(Ie,{key:s,column:l,colspan:l.colSpan,rowspan:l.rowSpan},null))]))])}}),ze=t.defineComponent({name:"DTableBodyTd",props:{column:{type:Object,default:()=>({})},row:{type:Object,default:()=>({})},index:{type:Number,default:0}},setup(e){const n=t.inject(A),o=t.toRef(e,"column"),{stickyClass:l,stickyStyle:s}=W(o);return()=>{var r,a;return t.createVNode("td",{class:l.value,style:s.value},[(a=(r=o.value).renderCell)==null?void 0:a.call(r,e.row,o.value,n.store,e.index)])}}});function qe(){const e=t.inject(A),{_data:n,_columns:o}=e.store.states,l=(a,i,d,c)=>{const u=e==null?void 0:e.props.spanMethod;let f=1,m=1;if(typeof u=="function"){const h=u({row:a,column:i,rowIndex:d,columnIndex:c});Array.isArray(h)?(f=h[0],m=h[1]):typeof h=="object"&&(f=h.rowspan,m=h.colspan)}return{rowspan:f,colspan:m}},s=t.computed(()=>{const a={};return(e==null?void 0:e.props.spanMethod)&&n.value.forEach((i,d)=>{o.value.forEach((c,u)=>{const{rowspan:f,colspan:m}=l(i,c,d,u);(f>1||m>1)&&(a[`${d}-${u}`]=[f,m])})}),a}),r=t.computed(()=>{const a=[];for(const i of Object.keys(s.value)){const d=i.split("-").map(u=>Number(u)),c=s.value[i];for(let u=1;u<c[0];u++){a.push(`${d[0]+u}-${d[1]}`);for(let f=1;f<c[1];f++)a.push(`${d[0]+u}-${d[1]+f}`)}for(let u=1;u<c[1];u++)a.push(`${d[0]}-${d[1]+u}`)}return a});return{tableSpans:s,removeCells:r}}var Q=t.defineComponent({name:"DTableBody",setup(){const e=t.inject(A),{_data:n,flatColumns:o}=e.store.states,l=L("table"),s=t.computed(()=>e.props.rowHoveredHighlight),{tableSpans:r,removeCells:a}=qe();return()=>t.createVNode("tbody",{class:l.e("tbody")},[n.value.map((i,d)=>t.createVNode("tr",{key:d,class:{"hover-enabled":s.value}},[o.value.map((c,u)=>{var p;const f=`${d}-${u}`,[m,h]=(p=r.value[f])!=null?p:[1,1];return a.value.includes(f)?null:t.createVNode(ze,{column:c,index:d,row:i,rowspan:m,colspan:h},null)})]))])}}),Ye=t.defineComponent({props:{classes:{type:Object,default:()=>({})},isEmpty:{type:Boolean}},setup(e){const n=L("table");return()=>t.createVNode("div",{class:n.e("fix-header")},[t.createVNode("div",{style:"overflow:hidden scroll;"},[t.createVNode("table",{class:e.classes,cellpadding:"0",cellspacing:"0"},[t.createVNode(F,null,null),t.createVNode(J,null,null)])]),t.createVNode("div",{class:n.e("scroll-view")},[t.createVNode("table",{class:e.classes,cellpadding:"0",cellspacing:"0"},[t.createVNode(F,null,null),!e.isEmpty&&t.createVNode(Q,{style:"flex: 1"},null)])])])}}),Ke=t.defineComponent({props:{classes:{type:Object,default:()=>({})},isEmpty:{type:Boolean}},setup(e){return()=>t.createVNode("table",{class:e.classes,cellpadding:"0",cellspacing:"0"},[t.createVNode(F,null,null),t.createVNode(J,{style:"position:relative"},null),!e.isEmpty&&t.createVNode(Q,null,null)])}});class Z{constructor(){T(this,"top","50%");T(this,"left","50%")}}const Xe={message:String,backdrop:Boolean,view:{type:Object,default:()=>new Z},zIndex:Number,isFull:{type:Boolean,default:!1}};class Je{constructor(){T(this,"target");T(this,"message");T(this,"loadingTemplateRef");T(this,"backdrop",!0);T(this,"positionType","relative");T(this,"view",new Z);T(this,"zIndex")}}var xt="",G=t.defineComponent({name:"DLoading",inheritAttrs:!1,props:Xe,setup(e){const n={top:e.view.top,left:e.view.left,zIndex:e.zIndex};e.message||(n.background="none");const o=t.ref(!1);return{style:n,isShow:o,open:()=>{o.value=!0},close:()=>{o.value=!1}}},render(){var a;const{isShow:e,isFull:n,backdrop:o,style:l,message:s,$slots:r}=this;return e&&t.createVNode("div",{class:["devui-loading-contanier",n?"devui-loading--full":""]},[((a=r.default)==null?void 0:a.call(r))||t.createVNode("div",{class:"devui-loading-wrapper"},[o?t.createVNode("div",{class:"devui-loading-mask"},null):null,t.createVNode("div",{style:l,class:"devui-loading-area"},[t.createVNode("div",{class:"devui-busy-default-spinner"},[t.createVNode("div",{class:"devui-loading-bar1"},null),t.createVNode("div",{class:"devui-loading-bar2"},null),t.createVNode("div",{class:"devui-loading-bar3"},null),t.createVNode("div",{class:"devui-loading-bar4"},null)]),s?t.createVNode("span",{class:"devui-loading-text"},[s]):null])])])}});const ee=Symbol("dev_component_container");function Qe(e,n,o=null){const l=t.h(e,O({},n),o),s=document.createElement("div");return l[ee]=s,t.render(l,s),l.component}function Ze(e){t.render(null,e==null?void 0:e.vnode[ee])}const Ge=t.defineComponent(G),R=new WeakSet,_=e=>{if(!e)return!0;if(Array.isArray(e))return e.length===0;if(e instanceof Set||e instanceof Map)return e.size===0;if(e instanceof Promise)return!1;if(typeof e=="object")try{return Object.keys(e).length===0}catch{return!1}return!1},te=e=>Object.prototype.toString.call(e).slice(8,-1).toLowerCase(),et=e=>{switch(te(e)){case"promise":return[e];case"array":return e.some(o=>te(o)!=="promise")?(console.error(new TypeError("Binding values should all be of type Promise")),"error"):e;default:return!1}},oe=e=>{R.delete(e),e.instance.proxy.close(),Ze(e.instance)},ne=(e,n)=>{var o,l,s;if(n.value){const r=et(n.value);if(r==="error")return;(s=(l=(o=e==null?void 0:e.instance)==null?void 0:o.proxy)==null?void 0:l.open)==null||s.call(l),e.appendChild(e.mask),R.add(e),r&&Promise.all(r).catch(a=>{console.error(new Error("Promise handling errors"),a)}).finally(()=>{oe(e)})}else oe(e)},le=e=>{e.removeAttribute("zindex"),e.removeAttribute("positiontype"),e.removeAttribute("backdrop"),e.removeAttribute("message"),e.removeAttribute("view"),e.removeAttribute("loadingtemplateref")},ae=(e,n)=>{var r;const o=O(O({},new Je),n),l=o.loadingTemplateRef,s=Qe(Ge,O({},o),l?()=>l:null);e.style.position=o.positionType,e.options=o,e.instance=s,e.mask=(r=s==null?void 0:s.proxy)==null?void 0:r.$el},tt={mounted:function(e,n,o){ae(e,o.props),le(e),!_(n.value)&&ne(e,n)},updated:function(e,n,o){!_(n.value)&&R.has(e)||_(n.value)&&!R.has(e)||(!R.has(e)&&ae(e,o.props),le(e),ne(e,n))}};t.defineComponent(G);var Bt="";let ot=1;var $=t.defineComponent({name:"DTable",directives:{dLoading:tt},props:ce,emits:["sort-change"],setup(e,n){const o=t.getCurrentInstance(),l=ge(t.toRef(e,"data")),s=`devui-table_${ot++}`;o.tableId=s,o.store=l,t.provide(A,o);const{classes:r,style:a}=ue(e),i=t.computed(()=>e.data.length===0),d=L("table"),c=t.ref(null);return o.hiddenColumns=c,n.expose({getCheckedRows(){return l.getCheckedRows()}}),t.onMounted(async()=>{await t.nextTick(),l.updateColumns()}),()=>{var u,f;return t.withDirectives(t.createVNode("div",{class:d.b(),style:a.value},[t.createVNode("div",{ref:c,class:"hidden-columns"},[(f=(u=n.slots).default)==null?void 0:f.call(u)]),e.fixHeader?t.createVNode(Ye,{classes:r.value,"is-empty":i.value},null):t.createVNode(Ke,{classes:r.value,"is-empty":i.value},null),i.value&&t.createVNode("div",{class:d.e("empty")},[t.createTextVNode("No Data")])]),[[t.resolveDirective("dLoading"),e.showLoading]])}}});const nt={type:{type:String,default:""},header:{type:String},field:{type:String,default:""},width:{type:[String,Number],default:""},minWidth:{type:[String,Number],default:80},formatter:{type:Function},order:{type:Number,default:0},sortable:{type:Boolean,default:!1},sortDirection:{type:String,default:""},sortMethod:{type:Function},filterable:{type:Boolean,default:!1},filterMultiple:{type:Boolean,default:!1},filterList:{type:Array,default:[]},fixedLeft:{type:String},fixedRight:{type:String}};function re(e){return typeof e=="number"?e:parseInt(e,10)||0}function lt(e){return re(e)||80}const se={checkable:{renderHeader(e,n){return t.h(M,{modelValue:n.states._checkAll.value,halfchecked:n.states._halfChecked.value,onChange:o=>{n.states._checkAll.value=o}})},renderCell(e,n,o,l){return t.h(M,{modelValue:o.states._checkList.value[l],onChange:s=>{o.states._checkList.value[l]=s}})}},index:{renderHeader(e){var n;return t.h("span",{class:"title"},(n=e.header)!=null?n:"#")},renderCell(e,n,o,l){return l+1}},default:{renderHeader(e){var n;return t.h("span",{class:"title"},(n=e.header)!=null?n:"")},renderCell(e,n,o,l){var r,a;const s=n.field?e[n.field]:"";return n.formatter?n.formatter(e,n,s,l):(a=(r=s==null?void 0:s.toString)==null?void 0:r.call(s))!=null?a:""}}};function at(e,n){const{type:o,field:l,header:s,sortable:r,sortDirection:a,width:i,minWidth:d,formatter:c,sortMethod:u,filterable:f,filterList:m,filterMultiple:h,order:p,fixedLeft:b,fixedRight:v}=e,y=t.reactive({});y.type=o.value;function k(g,w){return n.header?n.header(g):se[o.value||"default"].renderHeader(g,w)}function B(g,w,V,S){return n.default?n.default({row:g,rowIndex:S}):se[o.value||"default"].renderCell(g,w,V,S)}return t.watch([l,s,p],([g,w,V])=>{y.field=g,y.header=w,y.order=V},{immediate:!0}),t.watch([r,a,u],([g,w,V])=>{y.sortable=g,y.sortDirection=w,y.sortMethod=V},{immediate:!0}),t.watch([f,m,h],([g,w,V])=>{y.filterable=g,y.filterMultiple=V,y.filterList=w},{immediate:!0}),t.watch([b,v],([g,w])=>{y.fixedLeft=g,y.fixedRight=w},{immediate:!0}),t.watch([i,d],([g,w])=>{y.width=re(g),y.minWidth=lt(w),y.realWidth=y.width||y.minWidth}),t.onBeforeMount(()=>{y.renderHeader=k,y.renderCell=B,y.formatter=c==null?void 0:c.value,y.customFilterTemplate=n.customFilterTemplate,y.subColumns=n.subColumns}),y}function rt(){const e=t.getCurrentInstance();return{columnOrTableParent:t.computed(()=>{let l=e==null?void 0:e.parent;for(;l&&!l.tableId&&!l.columnId;)l=l.parent;return l}),getColumnIndex:(l,s)=>Array.prototype.indexOf.call(l,s)}}let st=1;var H=t.defineComponent({name:"DColumn",props:nt,setup(e,n){const o=t.getCurrentInstance(),l=at(t.toRefs(e),n.slots),s=t.inject(A),r=t.ref(!1);let a="";const{columnOrTableParent:i,getColumnIndex:d}=rt(),c=i.value;a=`${c.tableId||c.columnId}_column_${st++}`,t.onBeforeMount(()=>{r.value=s!==c,l.id=a}),t.onMounted(()=>{var m;const u=r.value?c.vnode.el.children:(m=s==null?void 0:s.hiddenColumns.value)==null?void 0:m.children;d(u||[],o.vnode.el)>-1&&(s==null||s.store.insertColumn(l,r.value?c.columnConfig:null))}),t.watch(()=>l.order,()=>{s==null||s.store.sortColumn()}),t.onBeforeUnmount(()=>{s==null||s.store.removeColumn(l)}),o.columnId=a,o.columnConfig=l},render(){var e,n;try{const o=(n=(e=this.$slots).default)==null?void 0:n.call(e,{row:{},column:{},$index:-1}),l=[];if(Array.isArray(o))for(const r of o)r.type.name==="DColumn"&&l.push(r);return t.h("div",l)}catch{return t.h("div",[])}}}),it={title:"Table \u8868\u683C",category:"\u6570\u636E\u5C55\u793A",status:"20%",install(e){e.component($.name,$),e.component(H.name,H)}};C.Column=H,C.Table=$,C.default=it,Object.defineProperty(C,"__esModule",{value:!0}),C[Symbol.toStringTag]="Module"});

package/table/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "table",
+  "version": "0.0.0",
+  "main": "index.umd.js",
+  "module": "index.es.js",
+  "style": "style.css"
+}

package/table/style.css

@@ -0,0 +1 @@
+.sort-clickable{cursor:pointer;position:absolute;top:-16px;left:50%;transform:translate(-50%);padding:8px;line-height:20px}.sort-icon-default>svg g use{fill:var(--devui-dividing-line, #dfe1e6)}.sort-icon-default>svg g polygon{fill:var(--devui-icon-bg, #ffffff)}.sort-icon-default:hover>svg g use{fill:var(--devui-icon-fill-active-hover, #526ecc)}.sort-icon-asc>svg g use,.sort-icon-desc>svg g use{fill:var(--devui-icon-fill-active, #5e7ce0)}.sort-icon-asc>svg g polygon,.sort-icon-desc>svg g polygon{fill:var(--devui-icon-bg, #ffffff)}.sort-icon-asc:hover>svg g use,.sort-icon-desc:hover>svg g use{fill:var(--devui-icon-fill-active-hover, #526ecc)}.sort-icon-asc>svg g polygon:last-of-type{opacity:.3}.sort-icon-desc>svg g polygon:first-of-type{opacity:.3}@keyframes d-overlay-fade{0%{opacity:0}to{opacity:1}}.devui-overlay-fade-enter{opacity:0}.devui-overlay-fade-enter-active{animation-name:d-overlay-fade;animation-duration:.3s}.devui-overlay-fade-leave{opacity:1}.devui-overlay-fade-leave-active{animation-name:d-overlay-fade;animation-duration:.3s;animation-direction:reverse}.devui-overlay-background{position:fixed;top:0;left:0;height:100vh;width:100vw;display:flex}.devui-overlay-background__color{background:rgba(0,0,0,.4)}.devui-overlay-background .devui-overlay{position:relative;z-index:1000;pointer-events:auto}.devui-overlay-background__disabled{pointer-events:none}.devui-flexible-overlay{position:fixed;border-radius:var(--devui-border-radius, 2px);background-color:var(--devui-connected-overlay-bg, #ffffff);box-shadow:var(--devui-shadow-connected-overlay, 0 2px 8px 0) var(--devui-shadow, rgba(0, 0, 0, .2));z-index:1000}.devui-flexible-overlay-arrow{position:absolute;width:8px;height:8px;transform:rotate(45deg);background-color:inherit}.devui-dropdown-toggle{display:inline-block}.devui-dropdown span.icon-chevron-down,.devui-dropdown span.icon-select-arrow{display:inline-block;vertical-align:text-top}.devui-dropdown-menu-wrap .devui-dropdown-menu{width:100%}.devui-dropdown-animation span.icon-chevron-down,.devui-dropdown-animation span.icon-select-arrow{transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-dropdown.open span.icon-chevron-down,.devui-dropdown.open span.icon-select-arrow{transform:rotate(180deg)}.fade-in-top{animation:fadeInTop .2s cubic-bezier(.16,.75,.5,1)}.fade-in-bottom{animation:fadeInBottom .2s cubic-bezier(.16,.75,.5,1)}@keyframes fadeInTop{0%{opacity:.8;transform:scaleY(.8) translateY(4px)}to{opacity:1;transform:scaleY(.9999) translateY(0)}}@keyframes fadeInBottom{0%{opacity:.8;transform:scaleY(.8) translateY(-4px)}to{opacity:1;transform:scaleY(.9999) translateY(0)}}.devui-dropdown-fade-bottom-enter-from,.devui-dropdown-fade-bottom-leave-to{opacity:.8;transform:scaleY(.8) translateY(-4px)}.devui-dropdown-fade-bottom-enter-to,.devui-dropdown-fade-bottom-leave-from{opacity:1;transform:scaleY(.9999) translateY(0)}.devui-dropdown-fade-bottom-enter-active{transition:transform .2s cubic-bezier(.16,.75,.5,1),opacity .2s cubic-bezier(.16,.75,.5,1)}.devui-dropdown-fade-bottom-leave-active{transition:transform .2s cubic-bezier(.5,0,.84,.25),opacity .2s cubic-bezier(.5,0,.84,.25)}.devui-dropdown-fade-top-enter-from,.devui-dropdown-fade-top-leave-to{opacity:.8;transform:scaleY(.8) translateY(4px)}.devui-dropdown-fade-top-enter-to,.devui-dropdown-fade-top-leave-from{opacity:1;transform:scaleY(.9999) translateY(0)}.devui-dropdown-fade-top-enter-active{transition:transform .2s cubic-bezier(.16,.75,.5,1),opacity .2s cubic-bezier(.16,.75,.5,1)}.devui-dropdown-fade-top-leave-active{transition:transform .2s cubic-bezier(.5,0,.84,.25),opacity .2s cubic-bezier(.5,0,.84,.25)}.devui-checkbox{position:relative;display:flex;display:-ms-flexbox;align-items:center;-ms-flex-align:center;height:100%;margin:0}.devui-checkbox .devui-checkbox-tick{position:absolute}.devui-checkbox .devui-checkbox-tick .devui-tick{fill:var(--devui-light-text, #ffffff);stroke-dashoffset:50;opacity:0;transform:scale(0);transform-origin:50% 50%;transition:stroke-dashoffset .2s ease-in-out,opacity .2s ease-in-out,transform .2s ease-in-out}.devui-checkbox.active:not(.halfchecked) .devui-tick{opacity:1;stroke-dashoffset:0;transform:scale(1);transition:stroke-dashoffset .3s cubic-bezier(.755,.05,.855,.06),opacity .2s cubic-bezier(.755,.05,.855,.06)}.devui-checkbox.active:not(.disabled) .devui-checkbox-material:not(.custom-color),.devui-checkbox.halfchecked:not(.disabled) .devui-checkbox-material:not(.custom-color){border-color:var(--devui-brand, #5e7ce0)}.devui-checkbox.active:not(.disabled) .devui-checkbox-material{background-size:100% 100%;transition:background-size .2s ease-in-out,border-color .2s ease-in-out}.devui-checkbox.unchecked:not(.disabled) .devui-checkbox-material:not(.custom-color){background-size:0% 0%;transition:background-size .2s ease-in-out,border-color .2s ease-in-out}.devui-checkbox.unchecked:not(.disabled) .devui-checkbox-material:not(.custom-color):hover{border-color:var(--devui-icon-fill-active, #5e7ce0)}.devui-checkbox.unchecked:not(.disabled) .devui-checkbox-material.custom-color{background-size:0% 0%;transition:background-size .2s ease-in-out,border-color .2s ease-in-out}.devui-checkbox.halfchecked .devui-checkbox-material:not(.custom-color){background-color:var(--devui-brand, #5e7ce0)}.devui-checkbox.halfchecked .devui-checkbox-material:not(.custom-color)>.devui-checkbox-halfchecked-bg{opacity:1;transform:scale(.4288);transition:transform .2s cubic-bezier(.755,.05,.855,.06);background-color:var(--devui-light-text, #ffffff)}.devui-checkbox.halfchecked .devui-checkbox-material.custom-color>.devui-checkbox-halfchecked-bg{opacity:1;transform:scale(.4288);transition:transform .2s cubic-bezier(.755,.05,.855,.06);background-color:var(--devui-light-text, #ffffff)}.devui-checkbox .devui-checkbox-material{text-align:initial;height:14px;width:14px;position:relative;user-select:none;border:1px solid var(--devui-line, #adb0b8);border-radius:var(--devui-border-radius, 2px);background:linear-gradient(var(--devui-brand, #5e7ce0),var(--devui-brand, #5e7ce0)) no-repeat center/0%;margin-right:8px;vertical-align:text-bottom}.devui-checkbox .devui-checkbox-material.devui-checkbox-default-background{background-color:var(--devui-base-bg, #ffffff)}.devui-checkbox .devui-checkbox-material.devui-checkbox-no-label{margin-right:0}.devui-checkbox .devui-checkbox-material>.devui-checkbox-halfchecked-bg{display:inline-block;position:absolute;content:"";background-color:var(--devui-light-text, #ffffff);top:0;left:0;height:100%;width:100%;transform:scale(1);opacity:0}.devui-checkbox .devui-checkbox-material>svg{width:14px;height:14px}.devui-checkbox:not(.disabled).halfchecked .devui-checkbox-material:not(.custom-color):focus,.devui-checkbox:not(.disabled).halfchecked .devui-checkbox-material:not(.custom-color):active,.devui-checkbox:not(.disabled).halfchecked .devui-checkbox-material:not(.custom-color):hover{background-color:var(--devui-icon-fill-active, #5e7ce0)}.devui-checkbox:not(.disabled).halfchecked .devui-checkbox-material:not(.custom-color):active,.devui-checkbox:not(.disabled).halfchecked .devui-checkbox-material:not(.custom-color):focus,.devui-checkbox:not(.disabled).halfchecked .devui-checkbox-material:not(.custom-color):hover:active,.devui-checkbox:not(.disabled).halfchecked .devui-checkbox-material:not(.custom-color):hover:focus{background-color:var(--devui-brand-active-focus, #344899)}.devui-checkbox-input{opacity:0;position:absolute;margin:0;z-index:-1;width:0;height:0;overflow:hidden;left:0;pointer-events:none}.devui-checkbox label{position:relative;font-weight:400;height:16px;line-height:16px;cursor:pointer;color:var(--devui-text, #252b3a);margin:0;display:block}.devui-checkbox label>span{display:inline-block;box-sizing:content-box;vertical-align:top}.devui-checkbox.disabled label{cursor:not-allowed;color:var(--devui-disabled-text, #adb0b8)}.devui-checkbox.disabled .devui-checkbox-material{border-color:var(--devui-icon-fill-active-disabled, #beccfa);background-color:var(--devui-icon-fill-active-disabled, #beccfa)}.devui-checkbox.disabled.unchecked .devui-checkbox-material{border-color:var(--devui-disabled-line, #dfe1e6);background-color:var(--devui-disabled-bg, #f5f5f6)}.devui-checkbox.disabled.halfchecked .devui-checkbox-material{background-color:var(--devui-disabled-bg, #f5f5f6)}.devui-checkbox.disabled.halfchecked .devui-checkbox-material .devui-checkbox-halfchecked-bg{transform:scale(.4288);background-color:var(--devui-disabled-text, #adb0b8);opacity:1}.devui-checkbox.disabled.active svg polygon{fill:var(--devui-light-text, #ffffff)}.devui-no-animation{transition:none!important}.devui-checkbox-column-margin{height:28px;line-height:28px}.devui-checkbox-wrap .devui-checkbox label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}:host{display:block}.devui-checkbox-list-inline{min-height:28px;line-height:28px;display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;margin:-8px 0 0}.devui-checkbox-list-inline div:not(:last-child){margin-right:20px}.devui-checkbox-list-inline>*{margin-top:8px}.data-table-column-filter-content{background:var(--devui-connected-overlay-bg, #ffffff);border-radius:var(--devui-border-radius, 2px);box-sizing:content-box}.data-table-column-filter-content .drop-down-item{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.data-table-column-filter-content .line{width:calc(100% - 20px);margin-left:10px}.data-table-column-filter-content>.filter-options>d-checkbox{height:30px;padding:0 10px}.data-table-column-filter-content .checkbox-group{padding:0 10px}.filter-content-hidden{display:none!important}.line{height:1px;background:var(--devui-dividing-line, #dfe1e6);margin-top:5px;margin-bottom:5px}.checkbox-group{height:30px}.button-style{display:inline-block;width:45%;font-size:var(--devui-font-size, 12px);color:var(--devui-text, #252b3a);text-align:center;line-height:20px;cursor:pointer}.button-style:hover{color:var(--devui-brand, #5e7ce0)}.normal-filter-list-container{overflow-y:auto}.icon-filter-style{color:var(--devui-dividing-line, #dfe1e6);cursor:pointer;margin-left:20px}.label-style{font-size:var(--devui-font-size, 12px);color:var(--devui-text, #252b3a);letter-spacing:0;margin-left:10px}.email-style{font-size:var(--devui-font-size, 12px);color:var(--devui-placeholder, #8a8e99);letter-spacing:0;margin-left:10px}.overlay-mask{position:fixed;top:0;bottom:0;right:0;left:0;z-index:9}.drop-down-item{padding:0 10px;height:30px;line-height:30px;cursor:pointer}.drop-down-item:hover{background:var(--devui-list-item-hover-bg, #f2f5fc);color:var(--devui-list-item-hover-text, #526ecc)}.filter-item-active{background:var(--devui-list-item-active-bg, #5e7ce0);color:var(--devui-list-item-active-text, #ffffff)}.edit-padding-fix{margin-top:-6px;margin-bottom:-6px}.filter-icon{display:inline-block;vertical-align:middle;cursor:pointer;height:16px;margin-top:-1px}.filter-icon>svg g{fill:var(--devui-dividing-line, #dfe1e6)}.filter-icon:hover>svg g{fill:var(--devui-icon-fill-active-hover, #526ecc)}.filter-icon-active{visibility:visible!important}.filter-icon-active>svg g{fill:var(--devui-icon-fill-active, #5e7ce0)}.filter-icon-active:hover>svg g{fill:var(--devui-icon-fill-active-hover, #526ecc)}.devui-table__thead tr{border:none;background-color:var(--devui-base-bg, #ffffff)}.devui-table__thead tr th{display:table-cell;text-align:left;padding:0 0 0 18px;border:none;border-bottom:1px solid var(--devui-line, #adb0b8)}.devui-table__thead tr .sort-active{background-color:var(--devui-list-item-hover-bg, #f2f5fc);border-radius:var(--devui-border-radius, 2px) 0 0 var(--devui-border-radius, 2px)}.devui-table__thead .header-container{position:relative;display:flex;align-items:center;padding-left:2px;padding-right:8px}.devui-table__thead .header-container .title{display:inline-block;font-size:var(--devui-font-size, 12px);color:var(--devui-text, #252b3a);font-weight:700;line-height:36px;vertical-align:middle;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;cursor:default}.devui-table--header-bg thead.devui-table__thead tr{background:var(--devui-list-item-hover-bg, #f2f5fc)}.devui-table__tbody tr{font-size:var(--devui-font-size, 12px);color:var(--devui-text, #252b3a);background-color:var(--devui-base-bg, #ffffff);border:none}.devui-table__tbody tr.hover-enabled:hover{background-color:var(--devui-list-item-hover-bg, #f2f5fc)}.devui-table__tbody tr td{background-clip:padding-box;vertical-align:middle;word-wrap:break-word;word-break:normal;line-height:24px;border:none;border-bottom:1px solid var(--devui-dividing-line, #dfe1e6)}.devui-table--sticky-cell{position:sticky;z-index:5;background-color:inherit}.devui-table--sticky-cell.left{box-shadow:#0000000d var(--devui-shadow-length-slide-right, 2px 0 8px 0)}.devui-table--sticky-cell.right{box-shadow:#0000000d var(--devui-shadow-length-slide-left, -2px 0 8px 0)}@keyframes devui-busy-spinner-anim{0%{transform:rotate(0) scale(1)}50%{transform:rotate(135deg) scale(1.5)}to{transform:rotate(270deg) scale(1)}}.devui-loading-mask{position:absolute;left:0;right:0;bottom:0;top:0;background-color:var(--devui-line, #adb0b8);opacity:.3}.devui-loading-wrapper{text-align:center}.devui-loading--full{position:fixed;left:0;right:0;bottom:0;top:0;z-index:9999}.devui-loading--hidden{overflow:hidden}.devui-loading-text{margin-left:10px}.devui-loading-area{position:absolute;transform:translate(-50%,-50%);padding:12px 14px;background:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius-card, 6px)}.devui-busy-default-spinner{position:relative;display:inline-block;width:15px;height:15px;animation:devui-busy-spinner-anim 1s linear infinite}.devui-busy-default-spinner div{position:absolute;left:44.5%;top:37%;width:6px;height:6px;border-radius:50%}.devui-busy-default-spinner .devui-loading-bar1{top:0;left:0;background:#5e7ce0;background:var(--devui-brand, #5e7ce0)}.devui-busy-default-spinner .devui-loading-bar2{top:0;left:9px;background:#859bff;background:var(--devui-brand-foil, #859bff)}.devui-busy-default-spinner .devui-loading-bar3{top:9px;left:0;background:#859bff;background:var(--devui-brand-foil, #859bff)}.devui-busy-default-spinner .devui-loading-bar4{top:9px;left:9px;background:#5e7ce0;background:var(--devui-brand, #5e7ce0)}.devui-table{position:relative;width:100%;overflow-x:auto;padding-top:8px}.devui-table .hidden-columns{position:absolute;visibility:hidden;z-index:-1}.devui-table__view{display:table;table-layout:fixed;width:100%;border-spacing:0;border-collapse:collapse;border:none;margin:0;padding:0}.devui-table--striped tbody tr:nth-child(even){background-color:var(--devui-list-item-strip-bg, #f2f5fc)}.devui-table__empty{width:100%;font-size:var(--devui-font-size, 12px);text-align:center}.devui-table__fix-header{display:flex;flex-direction:column;position:relative;height:100%}.devui-table__scroll-view{flex:1;overflow:scroll}.devui-table--layout-auto{table-layout:auto}.devui-table--sm tbody>tr>td{padding:7px 20px 8px}.devui-table--sm tbody>tr>td.devui-table__checkable-cell{padding:8px}.devui-table--sm thead>tr>th.devui-table__checkable-cell{padding:8px}.devui-table--md tbody>tr>td{padding:11px 20px 12px}.devui-table--md thead>tr>th.devui-table__checkable-cell{padding:8px 20px}.devui-table--lg tbody>tr>td{padding:15px 20px 16px}.devui-table--lg thead>tr>th.devui-table__checkable-cell{padding:8px 20px}.devui-table--borderless tbody>tr>td{border-bottom:none}.devui-table--bordered tr{border-left:1px solid var(--devui-dividing-line, #dfe1e6)}.devui-table--bordered tr td{border-right:1px solid var(--devui-dividing-line, #dfe1e6)}.devui-table--bordered thead tr th:first-child{border-left:1px solid var(--devui-dividing-line, #dfe1e6)}.devui-table--bordered thead tr th{border-top:1px solid var(--devui-dividing-line, #dfe1e6);border-right:1px solid var(--devui-dividing-line, #dfe1e6)}

package/tabs/index.d.ts

@@ -0,0 +1,7 @@
+import { App } from 'vue';
+  declare function install(app: App): void
+  declare const _default: {
+      install: typeof install;
+      version: string;
+  };
+  export default _default;

package/tabs/index.es.js

@@ -0,0 +1,194 @@
+import { defineComponent, ref, reactive, provide, onUpdated, onBeforeMount, onMounted, createVNode, inject } from "vue";
+const tabsProps = {
+  modelValue: {
+    type: [String, Number],
+    default: null
+  },
+  type: {
+    type: String,
+    default: "tabs"
+  },
+  showContent: {
+    type: Boolean,
+    default: true
+  },
+  vertical: {
+    type: Boolean,
+    default: false
+  },
+  reactivable: {
+    type: Boolean,
+    default: true
+  },
+  customWidth: {
+    type: String,
+    default: ""
+  },
+  cssClass: {
+    type: String,
+    default: ""
+  },
+  beforeChange: {
+    type: Function,
+    default: null
+  }
+};
+var tabs = "";
+var Tabs = defineComponent({
+  name: "DTabs",
+  props: tabsProps,
+  emits: ["update:modelValue", "active-tab-change"],
+  setup(props, {
+    emit,
+    slots
+  }) {
+    const tabsEle = ref(null);
+    const data = reactive({
+      offsetLeft: 0,
+      offsetWidth: 0,
+      id: null
+    });
+    const state = reactive({
+      data: [],
+      active: props.modelValue,
+      showContent: props.showContent,
+      slots: []
+    });
+    provide("tabs", {
+      state
+    });
+    const canChange = function(currentTab) {
+      let changeResult = Promise.resolve(true);
+      if (typeof props.beforeChange === "function") {
+        const result = props.beforeChange(currentTab);
+        if (typeof result !== "undefined") {
+          if (result.then) {
+            changeResult = result;
+          } else {
+            changeResult = Promise.resolve(result);
+          }
+        }
+      }
+      return changeResult;
+    };
+    const activeClick = function(item, tabEl) {
+      if (!props.reactivable && props.modelValue === item.id) {
+        return;
+      }
+      canChange(item.id).then((change) => {
+        if (!change) {
+          return;
+        }
+        const tab = state.data.find((itemOption) => itemOption.id === item.id);
+        if (tab && !tab.disabled) {
+          state.active = item.id;
+          emit("update:modelValue", tab.id);
+          if (props.type === "slider" && tabEl && tabsEle) {
+            this.offsetLeft = tabEl.getBoundingClientRect().left - this.tabsEle.nativeElement.getBoundingClientRect().left;
+            this.offsetWidth = tabEl.getBoundingClientRect().width;
+          }
+          emit("active-tab-change", tab.id);
+        }
+      });
+    };
+    const ulClass = [props.type];
+    props.cssClass && ulClass.push(props.cssClass);
+    props.vertical && ulClass.push("devui-nav-stacked");
+    onUpdated(() => {
+      if (props.type === "slider") {
+        setTimeout(() => {
+          const tabEle = tabsEle.value.querySelector("#" + props.modelValue + ".active");
+          if (tabEle) {
+            data.offsetLeft = tabEle.getBoundingClientRect().left - tabsEle.value.getBoundingClientRect().left;
+            data.offsetWidth = tabEle.getBoundingClientRect().width;
+          }
+        });
+      }
+    });
+    onBeforeMount(() => {
+      if (props.type !== "slider" && props.modelValue === void 0 && state.data.length > 0) {
+        activeClick(state.data[0]);
+      }
+    });
+    onMounted(() => {
+      if (props.type === "slider" && props.modelValue === void 0 && state.data.length > 0 && state.data[0]) {
+        activeClick(state.data[0].tabsEle.value.getElementById(state.data[0].tabId));
+      }
+    });
+    return () => {
+      return createVNode("div", {
+        "class": "devui-tabs"
+      }, [createVNode("ul", {
+        "ref": tabsEle,
+        "role": "tablist",
+        "class": `devui-nav devui-nav-${ulClass.join(" ")}`
+      }, [state.data.map((item, i) => {
+        return createVNode("li", {
+          "role": "presentation",
+          "onClick": () => {
+            activeClick(item);
+          },
+          "class": (props.modelValue === (item.id || item.tabId) ? "active" : "") + " " + (item.disabled ? "disabled" : ""),
+          "id": item.id || item.tabId
+        }, [createVNode("a", {
+          "role": "tab",
+          "data-toggle": item.id,
+          "aria-expanded": props.modelValue === (item.id || item.tabId)
+        }, [state.slots[i] ? state.slots[i]() : createVNode("span", null, [item.title])])]);
+      }), createVNode("div", {
+        "class": `devui-nav-${props.type}-animation`,
+        "style": {
+          left: data.offsetLeft + "px",
+          width: data.offsetWidth + "px"
+        }
+      }, null)]), slots.default()]);
+    };
+  }
+});
+const tabProps = {
+  title: {
+    type: [String, Number],
+    default: null
+  },
+  id: {
+    type: String,
+    default: null
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  }
+};
+var Tab = defineComponent({
+  name: "DTab",
+  props: tabProps,
+  setup(props, {
+    slots
+  }) {
+    const tabs2 = inject("tabs");
+    tabs2.state.slots.push(slots.title);
+    tabs2.state.data.push(props);
+    return () => {
+      const {
+        id
+      } = props;
+      const content = tabs2.state.showContent && tabs2.state.active === id ? createVNode("div", {
+        "class": "devui-tab-content"
+      }, [createVNode("div", {
+        "role": "tabpanel",
+        "class": "devui-tab-pane in active"
+      }, [slots.default()])]) : null;
+      return content;
+    };
+  }
+});
+var index = {
+  title: "Tabs \u9009\u9879\u5361",
+  category: "\u5BFC\u822A",
+  status: "60%",
+  install(app) {
+    app.component(Tabs.name, Tabs);
+    app.component(Tab.name, Tab);
+  }
+};
+export { Tab, Tabs, index as default, tabsProps };

package/tabs/index.umd.js

@@ -0,0 +1 @@
+(function(d,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(d=typeof globalThis!="undefined"?globalThis:d||self,t(d.index={},d.Vue))})(this,function(d,t){"use strict";const y={modelValue:{type:[String,Number],default:null},type:{type:String,default:"tabs"},showContent:{type:Boolean,default:!0},vertical:{type:Boolean,default:!1},reactivable:{type:Boolean,default:!0},customWidth:{type:String,default:""},cssClass:{type:String,default:""},beforeChange:{type:Function,default:null}};var B="",r=t.defineComponent({name:"DTabs",props:y,emits:["update:modelValue","active-tab-change"],setup(e,{emit:u,slots:i}){const s=t.ref(null),f=t.reactive({offsetLeft:0,offsetWidth:0,id:null}),n=t.reactive({data:[],active:e.modelValue,showContent:e.showContent,slots:[]});t.provide("tabs",{state:n});const m=function(a){let l=Promise.resolve(!0);if(typeof e.beforeChange=="function"){const o=e.beforeChange(a);typeof o!="undefined"&&(o.then?l=o:l=Promise.resolve(o))}return l},h=function(a,l){!e.reactivable&&e.modelValue===a.id||m(a.id).then(o=>{if(!o)return;const c=n.data.find(V=>V.id===a.id);c&&!c.disabled&&(n.active=a.id,u("update:modelValue",c.id),e.type==="slider"&&l&&s&&(this.offsetLeft=l.getBoundingClientRect().left-this.tabsEle.nativeElement.getBoundingClientRect().left,this.offsetWidth=l.getBoundingClientRect().width),u("active-tab-change",c.id))})},g=[e.type];return e.cssClass&&g.push(e.cssClass),e.vertical&&g.push("devui-nav-stacked"),t.onUpdated(()=>{e.type==="slider"&&setTimeout(()=>{const a=s.value.querySelector("#"+e.modelValue+".active");a&&(f.offsetLeft=a.getBoundingClientRect().left-s.value.getBoundingClientRect().left,f.offsetWidth=a.getBoundingClientRect().width)})}),t.onBeforeMount(()=>{e.type!=="slider"&&e.modelValue===void 0&&n.data.length>0&&h(n.data[0])}),t.onMounted(()=>{e.type==="slider"&&e.modelValue===void 0&&n.data.length>0&&n.data[0]&&h(n.data[0].tabsEle.value.getElementById(n.data[0].tabId))}),()=>t.createVNode("div",{class:"devui-tabs"},[t.createVNode("ul",{ref:s,role:"tablist",class:`devui-nav devui-nav-${g.join(" ")}`},[n.data.map((a,l)=>t.createVNode("li",{role:"presentation",onClick:()=>{h(a)},class:(e.modelValue===(a.id||a.tabId)?"active":"")+" "+(a.disabled?"disabled":""),id:a.id||a.tabId},[t.createVNode("a",{role:"tab","data-toggle":a.id,"aria-expanded":e.modelValue===(a.id||a.tabId)},[n.slots[l]?n.slots[l]():t.createVNode("span",null,[a.title])])])),t.createVNode("div",{class:`devui-nav-${e.type}-animation`,style:{left:f.offsetLeft+"px",width:f.offsetWidth+"px"}},null)]),i.default()])}});const v={title:{type:[String,Number],default:null},id:{type:String,default:null},disabled:{type:Boolean,default:!1}};var b=t.defineComponent({name:"DTab",props:v,setup(e,{slots:u}){const i=t.inject("tabs");return i.state.slots.push(u.title),i.state.data.push(e),()=>{const{id:s}=e;return i.state.showContent&&i.state.active===s?t.createVNode("div",{class:"devui-tab-content"},[t.createVNode("div",{role:"tabpanel",class:"devui-tab-pane in active"},[u.default()])]):null}}}),C={title:"Tabs \u9009\u9879\u5361",category:"\u5BFC\u822A",status:"60%",install(e){e.component(r.name,r),e.component(b.name,b)}};d.Tab=b,d.Tabs=r,d.default=C,d.tabsProps=y,Object.defineProperty(d,"__esModule",{value:!0}),d[Symbol.toStringTag]="Module"});

package/tabs/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "tabs",
+  "version": "0.0.0",
+  "main": "index.umd.js",
+  "module": "index.es.js",
+  "style": "style.css"
+}

package/tabs/style.css

@@ -0,0 +1 @@
+:host{display:block}.devui-nav-tabs,.devui-nav-pills{font-size:var(--devui-font-size, 12px);background:transparent;font-weight:700;list-style:none}.devui-nav-tabs li,.devui-nav-pills li{cursor:pointer;border:2px solid transparent}.devui-nav-tabs li a,.devui-nav-pills li a{cursor:pointer;border:none;line-height:30px;background-color:transparent;padding:0;text-decoration:none;color:var(--devui-text, #252b3a)}.devui-nav-tabs li a:hover,.devui-nav-tabs li a:focus,.devui-nav-tabs li a:active,.devui-nav-pills li a:hover,.devui-nav-pills li a:focus,.devui-nav-pills li a:active{outline:none}.devui-nav-tabs li.disabled a,.devui-nav-pills li.disabled a{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-nav-tabs li.active a,.devui-nav-tabs li:hover:not(.disabled) a,.devui-nav-pills li.active a,.devui-nav-pills li:hover:not(.disabled) a{color:var(--devui-brand, #5e7ce0)}.devui-nav-tabs li:after,.devui-nav-pills li:after{content:"";display:block;margin:auto;height:2px;width:0;background:transparent;transition:width .3s ease-out,background-color .3s ease-out}.devui-nav-tabs li.active:after,.devui-nav-pills li.active:after{width:100%;background:var(--devui-brand, #5e7ce0)}.devui-nav-options{font-size:var(--devui-font-size, 12px);background:transparent;border:none;border-radius:var(--devui-border-radius, 2px)}.devui-nav-options>li:last-of-type{border-radius:0 var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0}.devui-nav-options>li{cursor:pointer;border:1px solid var(--devui-line, #adb0b8);border-left-width:0;background-color:var(--devui-base-bg, #ffffff);float:left}.devui-nav-options>li:first-child{border-left-width:1px;border-radius:var(--devui-border-radius, 2px) 0 0 var(--devui-border-radius, 2px)}.devui-nav-options>li:last-child{border-radius:0 var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0}.devui-nav-options>li>a{cursor:pointer;border:none;color:var(--devui-text, #252b3a);line-height:26px;padding:0 15px}.devui-nav-options>li>a:hover,.devui-nav-options>li>a:focus,.devui-nav-options>li>a:active{outline:none}.devui-nav-options>li.disabled{border-color:var(--devui-disabled-line, #dfe1e6)}.devui-nav-options>li.disabled a{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-nav-options>li.active>a,.devui-nav-options>li:hover:not(.disabled)>a{color:var(--devui-light-text, #ffffff)}.devui-nav-options>li.active>a:hover,.devui-nav-options>li:hover:not(.disabled)>a:hover{color:var(--devui-light-text, #ffffff);background:transparent}.devui-nav-options>li.active{background-color:var(--devui-brand, #5e7ce0);border-color:var(--devui-brand, #5e7ce0)}.devui-nav-options>li.active:not(:first-child):before{background-color:var(--devui-brand, #5e7ce0)}.devui-nav-options>li.active+li:before{background-color:var(--devui-brand, #5e7ce0)}.devui-nav-options>li:hover:not(.active):not(.disabled){background-color:var(--devui-brand-active, #526ecc);border-color:var(--devui-brand-active, #526ecc)}.devui-nav-options>li:hover:not(.active):not(.disabled):not(:first-child):before{background-color:var(--devui-brand-active, #526ecc)}.devui-nav-slider{font-size:var(--devui-font-size, 12px);border:none;border-radius:var(--devui-border-radius, 2px);background:var(--devui-list-item-hover-bg, #f2f5fc);width:fit-content;display:flex!important;align-items:center;position:relative}.devui-nav-slider>li{cursor:pointer;margin:2px;float:left;position:relative;z-index:1}.devui-nav-slider>li:first-child{border-left-width:1px;border-radius:var(--devui-border-radius, 2px) 0 0 var(--devui-border-radius, 2px)}.devui-nav-slider>li:last-child{border-radius:0 var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0}.devui-nav-slider>li a{cursor:pointer;border:none;color:var(--devui-text, #252b3a);line-height:28px;padding:0 15px}.devui-nav-slider>li a:hover,.devui-nav-slider>li a:focus,.devui-nav-slider>li a:active{outline:none}.devui-nav-slider>li.disabled{border-color:var(--devui-disabled-line, #dfe1e6)}.devui-nav-slider>li.disabled a{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-nav-slider>li.active a,.devui-nav-slider>li:hover:not(.disabled) a{color:var(--devui-brand-active, #526ecc)}.devui-nav-slider>li.active a:hover,.devui-nav-slider>li:hover:not(.disabled) a:hover{color:var(--devui-brand-active, #526ecc);background:transparent}.devui-nav-slider>li.active:not(:first-child):before,.devui-nav-slider>li:hover:not(.disabled):not(:first-child):before{content:"";display:block;top:-1px;left:-1px;width:1px;height:"calc(100% + 2px)";position:absolute}.devui-nav-slider>li.active{text-shadow:0 0 .7px var(--devui-brand, #5e7ce0)}.devui-nav-slider>li.active:not(:first-child):before{background-color:var(--devui-brand, #5e7ce0)}.devui-nav-slider>li.active+li:before{background-color:var(--devui-brand, #5e7ce0)}.devui-nav-slider>li:hover:not(.active):not(.disabled){color:var(--devui-brand-active, #526ecc)}.devui-nav-slider>li:hover:not(.active):not(.disabled):not(:first-child):before{background-color:var(--devui-brand-active, #526ecc)}.devui-nav-wrapped{font-size:var(--devui-font-size, 12px);background:transparent;border-bottom:1px solid var(--devui-dividing-line, #dfe1e6);background-color:var(--devui-base-bg, #ffffff)}.devui-nav-wrapped>li{cursor:pointer;float:left;position:relative;padding:8px 16px}.devui-nav-wrapped>li a{cursor:pointer;border:none;color:var(--devui-text, #252b3a);border-radius:var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0 0}.devui-nav-wrapped>li a:hover,.devui-nav-wrapped>li a:focus,.devui-nav-wrapped>li a:active{outline:none}.devui-nav-wrapped>li.disabled{border-color:var(--devui-disabled-line, #dfe1e6)}.devui-nav-wrapped>li.disabled a{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-nav-wrapped>li.active{border:1px solid var(--devui-dividing-line, #dfe1e6);background:var(--devui-global-bg, #f3f6f8);border-radius:var(--devui-border-radius, 2px) var(--devui-border-radius, 2px) 0 0;font-weight:700;margin:-1px;border-bottom-color:transparent}.devui-nav-wrapped>li.active a{color:var(--devui-brand-active, #526ecc)}.devui-nav-wrapped>li:hover:not(.active):not(.disabled) a{color:var(--devui-brand, #5e7ce0)}.devui-nav{list-style:none;padding-left:0}.devui-nav li a{text-decoration:none}.devui-nav li a.custom-width{display:inline-block;padding:0;text-align:center}.devui-nav-tabs:not(.devui-nav-stacked){border-bottom:1px var(--devui-line, #adb0b8) solid}.devui-nav-tabs:not(.devui-nav-stacked) li{float:left;margin-left:32px;margin-bottom:-3px}.devui-nav-tabs:not(.devui-nav-stacked) li:first-child{margin-left:0}.devui-nav-pills:not(.devui-nav-stacked)>li{float:left;margin-left:32px}.devui-nav-pills:not(.devui-nav-stacked)>li:first-child{margin-left:0}.devui-nav:before,.devui-nav:after{content:" ";display:table}.devui-nav:after{clear:both}.devui-tab-content{margin-top:20px}.devui-nav-slider-animation{position:absolute;z-index:0;background-color:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius, 2px);box-shadow:0 2px 4px 0 var(--devui-light-shadow, rgba(0, 0, 0, .1));top:1px;height:30px;transition:left .3s cubic-bezier(.645,.045,.355,1),width .3s cubic-bezier(.645,.045,.355,1)}

package/tooltip/index.d.ts

@@ -0,0 +1,7 @@
+import { App } from 'vue';
+  declare function install(app: App): void
+  declare const _default: {
+      install: typeof install;
+      version: string;
+  };
+  export default _default;