vue-devui 1.0.0-beta.10 → 1.0.0-beta.14

package/progress/index.es.js

@@ -93,13 +93,13 @@ var Progress = defineComponent({
       $slots
     } = this;
     const progressLine = createVNode("div", {
-      "className": "devui-progress--line",
+      "class": "devui-progress--line",
       "style": {
         height,
         borderRadius: height
       }
     }, [createVNode("div", {
-      "className": "devui-progress-bar",
+      "class": "devui-progress-bar",
       "style": {
         height,
         borderRadius: height,
@@ -112,21 +112,21 @@ var Progress = defineComponent({
       }
     }, [percentageText])]);
     const textElement = createVNode("span", {
-      "className": "devui-progress-circle-text"
+      "class": "devui-progress-circle-text"
     }, [percentage, createTextVNode("%")]);
     const progressCircle = createVNode("div", {
-      "className": "devui-progress-circle"
+      "class": "devui-progress-circle"
     }, [createVNode("svg", {
-      "className": "devui-progress-circle",
+      "class": "devui-progress-circle",
       "viewBox": "0 0 100 100"
     }, [createVNode("path", {
-      "className": "devui-progress-circle-trail",
+      "class": "devui-progress-circle-trail",
       "fill-opacity": "0",
       "stroke-width": strokeWidth,
       "style": data.trailPath,
       "d": data.pathString
     }, null), createVNode("path", {
-      "className": "devui-progress-circle-path",
+      "class": "devui-progress-circle-path",
       "d": data.pathString,
       "stroke-linecap": "round",
       "fill-opacity": "0",
@@ -135,7 +135,7 @@ var Progress = defineComponent({
       "style": data.strokePath
     }, null)]), showContent && ((_a = $slots.default) == null ? void 0 : _a.call($slots)), showContent && !$slots.default && textElement]);
     return createVNode("div", {
-      "className": "devui-progress"
+      "class": "devui-progress"
     }, [!isCircle ? progressLine : progressCircle]);
   }
 });

package/progress/index.umd.js

@@ -1,3 +1,3 @@
-(function(s,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(s=typeof globalThis!="undefined"?globalThis:s||self,e(s.index={},s.Vue))})(this,function(s,e){"use strict";var N="",i=e.defineComponent({name:"DProgress",props:{height:{type:String,default:"20px"},percentage:{type:Number,default:0},percentageText:{type:String,default:""},barBgColor:{type:String,default:"#5170ff"},isCircle:{type:Boolean,default:!1},strokeWidth:{type:Number,default:6},showContent:{type:Boolean,default:!0}},setup(t){const{height:n,percentage:p,percentageText:u,barBgColor:h,isCircle:l,strokeWidth:d,showContent:o}=e.toRefs(t),r=e.reactive({pathString:"",trailPath:null,strokePath:null}),g=()=>{if(!l)return;const a=50-d.value/2,k=-a,c=a*-2;r.pathString=`M 50,50 m 0,${k}
-      a ${a},${a} 0 1 1 0,${-c}
-      a ${a},${a} 0 1 1 0,${c}`;const f=Math.PI*2*a;r.trailPath={stroke:"#dfe1e6",strokeDasharray:`${f}px ${f}px`,strokeDashoffset:"0",transition:"stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s"},r.strokePath={stroke:h||null,strokeDasharray:`${p.value/100*f}px ${f}px`,strokeDashoffset:"0",transition:"stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s"}};return g(),e.watch([n,p,u,h,l,d,o],()=>{g()}),{data:r}},render(){var c;const{height:t,percentage:n,percentageText:p,barBgColor:u,isCircle:h,strokeWidth:l,showContent:d,data:o,$slots:r}=this,g=e.createVNode("div",{className:"devui-progress--line",style:{height:t,borderRadius:t}},[e.createVNode("div",{className:"devui-progress-bar",style:{height:t,borderRadius:t,width:`${n}%`,backgroundColor:u}},null),e.createVNode("span",{style:{lineHeight:t}},[p])]),a=e.createVNode("span",{className:"devui-progress-circle-text"},[n,e.createTextVNode("%")]),k=e.createVNode("div",{className:"devui-progress-circle"},[e.createVNode("svg",{className:"devui-progress-circle",viewBox:"0 0 100 100"},[e.createVNode("path",{className:"devui-progress-circle-trail","fill-opacity":"0","stroke-width":l,style:o.trailPath,d:o.pathString},null),e.createVNode("path",{className:"devui-progress-circle-path",d:o.pathString,"stroke-linecap":"round","fill-opacity":"0",stroke:u,"stroke-width":n?l:0,style:o.strokePath},null)]),d&&((c=r.default)==null?void 0:c.call(r)),d&&!r.default&&a]);return e.createVNode("div",{className:"devui-progress"},[h?k:g])}});i.install=function(t){t.component(i.name,i)};var y={title:"Progress \u8FDB\u5EA6\u6761",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(t){t.use(i)}};s.Progress=i,s.default=y,Object.defineProperty(s,"__esModule",{value:!0}),s[Symbol.toStringTag]="Module"});
+(function(s,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(s=typeof globalThis!="undefined"?globalThis:s||self,e(s.index={},s.Vue))})(this,function(s,e){"use strict";var P="",i=e.defineComponent({name:"DProgress",props:{height:{type:String,default:"20px"},percentage:{type:Number,default:0},percentageText:{type:String,default:""},barBgColor:{type:String,default:"#5170ff"},isCircle:{type:Boolean,default:!1},strokeWidth:{type:Number,default:6},showContent:{type:Boolean,default:!0}},setup(t){const{height:n,percentage:p,percentageText:u,barBgColor:h,isCircle:l,strokeWidth:d,showContent:a}=e.toRefs(t),r=e.reactive({pathString:"",trailPath:null,strokePath:null}),g=()=>{if(!l)return;const o=50-d.value/2,k=-o,c=o*-2;r.pathString=`M 50,50 m 0,${k}
+      a ${o},${o} 0 1 1 0,${-c}
+      a ${o},${o} 0 1 1 0,${c}`;const f=Math.PI*2*o;r.trailPath={stroke:"#dfe1e6",strokeDasharray:`${f}px ${f}px`,strokeDashoffset:"0",transition:"stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s"},r.strokePath={stroke:h||null,strokeDasharray:`${p.value/100*f}px ${f}px`,strokeDashoffset:"0",transition:"stroke-dashoffset .3s ease 0s, stroke-dasharray .3s ease 0s, stroke .3s, stroke-width .06s ease .3s"}};return g(),e.watch([n,p,u,h,l,d,a],()=>{g()}),{data:r}},render(){var c;const{height:t,percentage:n,percentageText:p,barBgColor:u,isCircle:h,strokeWidth:l,showContent:d,data:a,$slots:r}=this,g=e.createVNode("div",{class:"devui-progress--line",style:{height:t,borderRadius:t}},[e.createVNode("div",{class:"devui-progress-bar",style:{height:t,borderRadius:t,width:`${n}%`,backgroundColor:u}},null),e.createVNode("span",{style:{lineHeight:t}},[p])]),o=e.createVNode("span",{class:"devui-progress-circle-text"},[n,e.createTextVNode("%")]),k=e.createVNode("div",{class:"devui-progress-circle"},[e.createVNode("svg",{class:"devui-progress-circle",viewBox:"0 0 100 100"},[e.createVNode("path",{class:"devui-progress-circle-trail","fill-opacity":"0","stroke-width":l,style:a.trailPath,d:a.pathString},null),e.createVNode("path",{class:"devui-progress-circle-path",d:a.pathString,"stroke-linecap":"round","fill-opacity":"0",stroke:u,"stroke-width":n?l:0,style:a.strokePath},null)]),d&&((c=r.default)==null?void 0:c.call(r)),d&&!r.default&&o]);return e.createVNode("div",{class:"devui-progress"},[h?k:g])}});i.install=function(t){t.component(i.name,i)};var y={title:"Progress \u8FDB\u5EA6\u6761",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(t){t.use(i)}};s.Progress=i,s.default=y,Object.defineProperty(s,"__esModule",{value:!0}),s[Symbol.toStringTag]="Module"});

package/radio/index.es.js

@@ -48,7 +48,7 @@ const radioGroupProps = __spreadProps(__spreadValues({}, radioCommonProps), {
     type: Array,
     default: null
   },
-  cssStyle: {
+  direction: {
     type: String,
     default: "column"
   }
@@ -179,8 +179,8 @@ var RadioGroup = defineComponent({
   },
   render() {
     const {
-      cssStyle,
-      values
+      values,
+      direction
     } = this;
     const getContent = () => {
       const defaultSlot = this.$slots.default;
@@ -201,8 +201,8 @@ var RadioGroup = defineComponent({
     };
     return createVNode("div", {
       "class": ["devui-radio-group", {
-        "is-row": cssStyle === "row",
-        "is-column": cssStyle === "column"
+        "is-row": direction === "row",
+        "is-column": direction === "column"
       }]
     }, [getContent()]);
   }

package/radio/index.umd.js

@@ -1 +1 @@
-var w=Object.defineProperty,j=Object.defineProperties;var P=Object.getOwnPropertyDescriptors;var C=Object.getOwnPropertySymbols;var k=Object.prototype.hasOwnProperty,x=Object.prototype.propertyIsEnumerable;var V=(n,e,o)=>e in n?w(n,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):n[e]=o,p=(n,e)=>{for(var o in e||(e={}))k.call(e,o)&&V(n,o,e[o]);if(C)for(var o of C(e))x.call(e,o)&&V(n,o,e[o]);return n},y=(n,e)=>j(n,P(e));(function(n,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(n=typeof globalThis!="undefined"?globalThis:n||self,e(n.index={},n.Vue))})(this,function(n,e){"use strict";const o={modelValue:{type:String,default:null},name:{type:String,default:null},beforeChange:{type:Function,default:null},disabled:{type:Boolean,default:!1}},v=y(p({},o),{value:{type:String,required:!0,default:null}}),N=y(p({},o),{values:{type:Array,default:null},cssStyle:{type:String,default:"column"}}),b=Symbol("DRadioGroup");var D="",s=e.defineComponent({name:"DRadio",props:v,emits:["change","update:modelValue"],setup(a,{emit:d}){const t=e.inject(b,null),r=e.computed(()=>a.disabled||(t==null?void 0:t.disabled.value)),l=e.computed(()=>{const i=t?t.modelValue.value:a.modelValue;return a.value===i}),h=e.computed(()=>t?t.name.value:a.name),g=i=>{const u=a.beforeChange||(t?t.beforeChange:null);let f=Promise.resolve(!0);if(u){const m=u(i);if(typeof m=="undefined")return f;typeof m=="boolean"?f=Promise.resolve(m):f=m}return f};return{isChecked:l,radioName:h,disabled:r,handleChange:async i=>{const u=a.value;if(!await g(u)){i.preventDefault();return}t==null||t.emitChange(u),d("update:modelValue",u),d("change",u)}}},render(){var i;const{disabled:a,radioName:d,value:t,isChecked:r,$slots:l,handleChange:h}=this,g=["devui-radio",{active:r,disabled:a}];return e.createVNode("label",{class:g},[e.createVNode("input",{type:"radio",name:d,class:"devui-radio-input",disabled:a,onChange:h,value:t,checked:r},null),e.createVNode("span",{class:"devui-radio-material"},[e.createVNode("svg",{height:"100%",width:"100%",viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg"},[e.createVNode("circle",{class:"devui-radio-material-outer",cx:"512",cy:"512",r:"486.5","stroke-width":"51"},null),e.createVNode("circle",{class:"devui-radio-material-inner",cx:"512","fill-rule":"nonzero",cy:"512",r:"320"},null)])]),e.createVNode("span",{class:"devui-radio-label"},[(i=l.default)==null?void 0:i.call(l)])])}}),_="";function S(a){return typeof a=="function"||Object.prototype.toString.call(a)==="[object Object]"&&!e.isVNode(a)}var c=e.defineComponent({name:"DRadioGroup",props:N,emits:["change","update:modelValue"],setup(a,{emit:d}){const t=r=>{d("update:modelValue",r),d("change",r)};e.provide(b,{modelValue:e.toRef(a,"modelValue"),name:e.toRef(a,"name"),disabled:e.toRef(a,"disabled"),beforeChange:a.beforeChange,emitChange:t})},render(){const{cssStyle:a,values:d}=this,t=()=>{const r=this.$slots.default;return r?r():Array.isArray(d)?d.map(l=>e.createVNode(s,{key:l,value:l},S(l)?l:{default:()=>[l]})):""};return e.createVNode("div",{class:["devui-radio-group",{"is-row":a==="row","is-column":a==="column"}]},[t()])}});s.install=function(a){a.component(s.name,s)},c.install=function(a){a.component(c.name,c)};var R={title:"Radio \u5355\u9009\u6846",category:"\u6570\u636E\u5F55\u5165",status:"100%",install(a){a.use(s),a.use(c)}};n.Radio=s,n.RadioGroup=c,n.default=R,Object.defineProperty(n,"__esModule",{value:!0}),n[Symbol.toStringTag]="Module"});
+var S=Object.defineProperty,j=Object.defineProperties;var P=Object.getOwnPropertyDescriptors;var C=Object.getOwnPropertySymbols;var k=Object.prototype.hasOwnProperty,x=Object.prototype.propertyIsEnumerable;var V=(n,e,o)=>e in n?S(n,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):n[e]=o,p=(n,e)=>{for(var o in e||(e={}))k.call(e,o)&&V(n,o,e[o]);if(C)for(var o of C(e))x.call(e,o)&&V(n,o,e[o]);return n},y=(n,e)=>j(n,P(e));(function(n,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(n=typeof globalThis!="undefined"?globalThis:n||self,e(n.index={},n.Vue))})(this,function(n,e){"use strict";const o={modelValue:{type:String,default:null},name:{type:String,default:null},beforeChange:{type:Function,default:null},disabled:{type:Boolean,default:!1}},v=y(p({},o),{value:{type:String,required:!0,default:null}}),N=y(p({},o),{values:{type:Array,default:null},direction:{type:String,default:"column"}}),b=Symbol("DRadioGroup");var D="",s=e.defineComponent({name:"DRadio",props:v,emits:["change","update:modelValue"],setup(a,{emit:d}){const t=e.inject(b,null),i=e.computed(()=>a.disabled||(t==null?void 0:t.disabled.value)),l=e.computed(()=>{const r=t?t.modelValue.value:a.modelValue;return a.value===r}),h=e.computed(()=>t?t.name.value:a.name),g=r=>{const u=a.beforeChange||(t?t.beforeChange:null);let f=Promise.resolve(!0);if(u){const m=u(r);if(typeof m=="undefined")return f;typeof m=="boolean"?f=Promise.resolve(m):f=m}return f};return{isChecked:l,radioName:h,disabled:i,handleChange:async r=>{const u=a.value;if(!await g(u)){r.preventDefault();return}t==null||t.emitChange(u),d("update:modelValue",u),d("change",u)}}},render(){var r;const{disabled:a,radioName:d,value:t,isChecked:i,$slots:l,handleChange:h}=this,g=["devui-radio",{active:i,disabled:a}];return e.createVNode("label",{class:g},[e.createVNode("input",{type:"radio",name:d,class:"devui-radio-input",disabled:a,onChange:h,value:t,checked:i},null),e.createVNode("span",{class:"devui-radio-material"},[e.createVNode("svg",{height:"100%",width:"100%",viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg"},[e.createVNode("circle",{class:"devui-radio-material-outer",cx:"512",cy:"512",r:"486.5","stroke-width":"51"},null),e.createVNode("circle",{class:"devui-radio-material-inner",cx:"512","fill-rule":"nonzero",cy:"512",r:"320"},null)])]),e.createVNode("span",{class:"devui-radio-label"},[(r=l.default)==null?void 0:r.call(l)])])}}),_="";function R(a){return typeof a=="function"||Object.prototype.toString.call(a)==="[object Object]"&&!e.isVNode(a)}var c=e.defineComponent({name:"DRadioGroup",props:N,emits:["change","update:modelValue"],setup(a,{emit:d}){const t=i=>{d("update:modelValue",i),d("change",i)};e.provide(b,{modelValue:e.toRef(a,"modelValue"),name:e.toRef(a,"name"),disabled:e.toRef(a,"disabled"),beforeChange:a.beforeChange,emitChange:t})},render(){const{values:a,direction:d}=this,t=()=>{const i=this.$slots.default;return i?i():Array.isArray(a)?a.map(l=>e.createVNode(s,{key:l,value:l},R(l)?l:{default:()=>[l]})):""};return e.createVNode("div",{class:["devui-radio-group",{"is-row":d==="row","is-column":d==="column"}]},[t()])}});s.install=function(a){a.component(s.name,s)},c.install=function(a){a.component(c.name,c)};var w={title:"Radio \u5355\u9009\u6846",category:"\u6570\u636E\u5F55\u5165",status:"100%",install(a){a.use(s),a.use(c)}};n.Radio=s,n.RadioGroup=c,n.default=w,Object.defineProperty(n,"__esModule",{value:!0}),n[Symbol.toStringTag]="Module"});

package/slider/index.es.js

@@ -129,11 +129,8 @@ var Slider = defineComponent({
         inputValue.value = props.min;
         percentDispaly.value = "0%";
       } else {
-        if (inputValue.value < props.min) {
-          inputValue.value = props.min;
-        }
-        if (inputValue.value > props.max) {
-          inputValue.value = props.max;
+        if (inputValue.value < props.min || inputValue.value > props.max) {
+          return;
         }
         const re = /^(?:[1-9]?\d|100)$/;
         if (re.test(`${inputValue.value}`)) {

package/slider/index.umd.js

@@ -1 +1 @@
-(function(a,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(a=typeof globalThis!="undefined"?globalThis:a||self,t(a.index={},a.Vue))})(this,function(a,t){"use strict";const x={disabled:{type:Boolean,default:!1},max:{type:Number,default:100},min:{type:Number,default:0},modelValue:{type:Number,default:0},showInput:{type:Boolean,default:!1},step:{type:Number,default:1},tipsRenderer:{type:String,default:""}};var R="",o=t.defineComponent({name:"DSlider",props:x,emits:["update:modelValue"],setup(e,v){let m=!0,f=0,s=0;const d=t.ref(!1),V=t.ref(null),l=t.ref(e.modelValue),r=t.ref(0),h=t.ref(0),u=t.ref(""),S=()=>e.showInput?t.createVNode("div",{class:"devui-input__out-wrap"},[t.createVNode("input",{onInput:D,value:l.value+""},null)]):"";e.modelValue>e.max?u.value="100%":e.modelValue<e.min?u.value="0%":u.value=(e.modelValue-e.min)*100/(e.max-e.min)+"%",t.onMounted(()=>{const n=V.value.clientWidth;r.value=n*(l.value-e.min)/(e.max-e.min)});function M(n){d.value=!0,!e.disabled&&(n.preventDefault(),E(n),window.addEventListener("mousemove",N),window.addEventListener("mouseup",_))}function E(n){m=!1,s=n.clientX,f=r.value,h.value=f}function N(n){d.value=!0;const c=n.clientX-s;h.value=f+c,b(h.value)}function _(){d.value=!1,setTimeout(()=>{m=!0},100),window.removeEventListener("mousemove",N),window.removeEventListener("mouseup",_)}function b(n){const i=Math.round(V.value.clientWidth);n<0&&(n=0);const c=i/((e.max-e.min)/e.step),y=Math.round(n/c)*c;if(Math.round(y)>=i){r.value=i,l.value=e.max,u.value="100%",v.emit("update:modelValue",e.max);return}u.value=Math.round(y*100/i)+"%",l.value=Math.round(y*(e.max-e.min)/i)+e.min,r.value=n,v.emit("update:modelValue",l.value)}function X(n){if(!e.disabled&&m){s=n.target.getBoundingClientRect().left;const i=n.clientX;b(i-s),M(n)}else return}function D(n){l.value=parseInt(n.target.value),l.value?(l.value<e.min&&(l.value=e.min),l.value>e.max&&(l.value=e.max),/^(?:[1-9]?\d|100)$/.test(`${l.value}`)&&(u.value=(l.value-e.min)*100/(e.max-e.min)+"%",v.emit("update:modelValue",l.value))):(l.value=e.min,u.value="0%")}const w=t.computed(()=>e.disabled?" disabled":""),I=()=>t.createVNode("div",{class:"devui-slider_popover",style:{left:u.value,opacity:d.value?1:0}},[t.createVNode("div",{class:"devui-slider_popover-arrow"},null),t.createVNode("div",{class:"devui-slider_popover-content"},[l.value+" "+e.tipsRenderer])]);return()=>t.createVNode("div",{class:"devui-slider"},[t.createVNode("div",{ref:V,class:"devui-slider__runway"+w.value,onMousedown:X,onMouseout:()=>d.value=!1},[t.createVNode("div",{class:"devui-slider__bar"+w.value,style:{width:u.value}},null),t.createVNode("div",{class:"devui-slider__button"+w.value,style:{left:u.value},onMousedown:M,onMouseenter:()=>d.value=!0,onMouseout:()=>d.value=!1},null),e.tipsRenderer==="null"?"":I()]),t.createVNode("span",{class:"devui-min_count"},[e.min]),t.createVNode("span",{class:"devui-max_count"},[e.max]),S()])}});o.install=function(e){e.component(o.name,o)};var g={title:"Slider \u6ED1\u5757",category:"\u6570\u636E\u5F55\u5165",status:"100%",install(e){e.use(o)}};a.Slider=o,a.default=g,Object.defineProperty(a,"__esModule",{value:!0}),a[Symbol.toStringTag]="Module"});
+(function(a,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(a=typeof globalThis!="undefined"?globalThis:a||self,t(a.index={},a.Vue))})(this,function(a,t){"use strict";const g={disabled:{type:Boolean,default:!1},max:{type:Number,default:100},min:{type:Number,default:0},modelValue:{type:Number,default:0},showInput:{type:Boolean,default:!1},step:{type:Number,default:1},tipsRenderer:{type:String,default:""}};var R="",o=t.defineComponent({name:"DSlider",props:g,emits:["update:modelValue"],setup(e,v){let m=!0,f=0,s=0;const d=t.ref(!1),V=t.ref(null),l=t.ref(e.modelValue),r=t.ref(0),h=t.ref(0),u=t.ref(""),S=()=>e.showInput?t.createVNode("div",{class:"devui-input__out-wrap"},[t.createVNode("input",{onInput:D,value:l.value+""},null)]):"";e.modelValue>e.max?u.value="100%":e.modelValue<e.min?u.value="0%":u.value=(e.modelValue-e.min)*100/(e.max-e.min)+"%",t.onMounted(()=>{const n=V.value.clientWidth;r.value=n*(l.value-e.min)/(e.max-e.min)});function M(n){d.value=!0,!e.disabled&&(n.preventDefault(),E(n),window.addEventListener("mousemove",N),window.addEventListener("mouseup",_))}function E(n){m=!1,s=n.clientX,f=r.value,h.value=f}function N(n){d.value=!0;const c=n.clientX-s;h.value=f+c,b(h.value)}function _(){d.value=!1,setTimeout(()=>{m=!0},100),window.removeEventListener("mousemove",N),window.removeEventListener("mouseup",_)}function b(n){const i=Math.round(V.value.clientWidth);n<0&&(n=0);const c=i/((e.max-e.min)/e.step),y=Math.round(n/c)*c;if(Math.round(y)>=i){r.value=i,l.value=e.max,u.value="100%",v.emit("update:modelValue",e.max);return}u.value=Math.round(y*100/i)+"%",l.value=Math.round(y*(e.max-e.min)/i)+e.min,r.value=n,v.emit("update:modelValue",l.value)}function X(n){if(!e.disabled&&m){s=n.target.getBoundingClientRect().left;const i=n.clientX;b(i-s),M(n)}else return}function D(n){if(l.value=parseInt(n.target.value),!l.value)l.value=e.min,u.value="0%";else{if(l.value<e.min||l.value>e.max)return;/^(?:[1-9]?\d|100)$/.test(`${l.value}`)&&(u.value=(l.value-e.min)*100/(e.max-e.min)+"%",v.emit("update:modelValue",l.value))}}const w=t.computed(()=>e.disabled?" disabled":""),I=()=>t.createVNode("div",{class:"devui-slider_popover",style:{left:u.value,opacity:d.value?1:0}},[t.createVNode("div",{class:"devui-slider_popover-arrow"},null),t.createVNode("div",{class:"devui-slider_popover-content"},[l.value+" "+e.tipsRenderer])]);return()=>t.createVNode("div",{class:"devui-slider"},[t.createVNode("div",{ref:V,class:"devui-slider__runway"+w.value,onMousedown:X,onMouseout:()=>d.value=!1},[t.createVNode("div",{class:"devui-slider__bar"+w.value,style:{width:u.value}},null),t.createVNode("div",{class:"devui-slider__button"+w.value,style:{left:u.value},onMousedown:M,onMouseenter:()=>d.value=!0,onMouseout:()=>d.value=!1},null),e.tipsRenderer==="null"?"":I()]),t.createVNode("span",{class:"devui-min_count"},[e.min]),t.createVNode("span",{class:"devui-max_count"},[e.max]),S()])}});o.install=function(e){e.component(o.name,o)};var x={title:"Slider \u6ED1\u5757",category:"\u6570\u636E\u5F55\u5165",status:"100%",install(e){e.use(o)}};a.Slider=o,a.default=x,Object.defineProperty(a,"__esModule",{value:!0}),a[Symbol.toStringTag]="Module"});

package/slider/style.css

@@ -1 +1 @@
-.devui-slider{position:relative;width:90%;display:block}.devui-slider.disabled{cursor:not-allowed;background-color:var(--devui-disabled-line, #dfe1e6);border-color:var(--devui-disabled-line, #dfe1e6)}.devui-slider__runway{position:relative;width:100%;padding:4px 0;margin:4px 0;cursor:pointer;box-sizing:border-box;height:5px;display:flex;align-items:center;background-color:var(--devui-default-bg, #f3f6f8)}.devui-slider__runway.disabled{cursor:not-allowed}.devui-slider__runway .devui-slider__bar{height:6px;background-color:var(--devui-default-line, #5e7ce0);border-top-left-radius:var(--devui-border-radius, 2px);border-bottom-left-radius:var(--devui-border-radius, 2px);position:absolute}.devui-slider__runway .devui-slider__bar.disabled{background-color:var(--devui-disabled-line, #dfe1e6);border-color:var(--devui-disabled-line, #dfe1e6)}.devui-slider__runway .devui-slider__bar.disabled:hover{cursor:not-allowed}.devui-slider__runway .devui-slider__button{position:absolute;width:14px;height:14px;border:2px solid var(--devui-default-line, #5e7ce0);background-color:var(--devui-base-bg, #ffffff);border-radius:50%;margin-left:-7px;transition:transform .2s ease-in-out}.devui-slider__runway .devui-slider__button:hover{transform:scale(1.2)}.devui-slider__runway .devui-slider__button.disabled{background-color:var(--devui-base-bg, #ffffff);border-color:var(--devui-disabled-line, #dfe1e6)}.devui-slider__runway .devui-slider__button.disabled:hover{cursor:not-allowed;transform:none}.devui-slider__runway .devui-slider_popover{position:relative;bottom:26px;transform:translate(-50%);border-radius:var(--devui-border-radius-feedback, 4px);font-size:var(--devui-font-size-sm, 12px);color:var(--devui-feedback-overlay-text, #dfe1e6)}.devui-slider__runway .devui-slider_popover .devui-slider_popover-arrow{position:absolute;left:50%;margin-left:-4px;bottom:-4px;width:8px;height:8px;transform:rotate(45deg);display:block;z-index:-1;background-color:var(--devui-feedback-overlay-bg, #464d6e)}.devui-slider__runway .devui-slider_popover .devui-slider_popover-content{padding:5px 14px;text-align:center;border-radius:var(--devui-border-radius-feedback, 4px);background-color:var(--devui-feedback-overlay-bg, #464d6e)}.devui-slider .devui-min_count{position:absolute;top:15px;font-size:var(--devui-font-size, 12px);color:var(--devui-text, #252b3a)}.devui-slider .devui-max_count{position:absolute;top:15px;right:0;font-size:var(--devui-font-size, 12px);color:var(--devui-text, #252b3a)}.devui-slider .devui-input__out-wrap{font-size:var(--devui-font-size, 12px);position:absolute;right:-60px;top:-12px;padding:5px 10px;cursor:text;margin-left:20px}.devui-slider .devui-input__out-wrap input{width:40px;text-align:center}
+.devui-slider{position:relative;width:90%;display:block}.devui-slider.disabled{cursor:not-allowed;background-color:var(--devui-disabled-line, #dfe1e6);border-color:var(--devui-disabled-line, #dfe1e6)}.devui-slider__runway{position:relative;width:100%;padding:4px 0;margin:4px 0;cursor:pointer;box-sizing:border-box;height:5px;display:flex;align-items:center;background-color:var(--devui-default-bg, #f3f6f8)}.devui-slider__runway.disabled{cursor:not-allowed}.devui-slider__runway .devui-slider__bar{height:6px;background-color:var(--devui-default-line, #5e7ce0);border-top-left-radius:var(--devui-border-radius, 2px);border-bottom-left-radius:var(--devui-border-radius, 2px);position:absolute}.devui-slider__runway .devui-slider__bar.disabled{background-color:var(--devui-disabled-line, #dfe1e6);border-color:var(--devui-disabled-line, #dfe1e6)}.devui-slider__runway .devui-slider__bar.disabled:hover{cursor:not-allowed}.devui-slider__runway .devui-slider__button{position:absolute;width:14px;height:14px;border:2px solid var(--devui-default-line, #5e7ce0);background-color:var(--devui-base-bg, #ffffff);border-radius:50%;margin-left:-7px;transition:transform .2s ease-in-out}.devui-slider__runway .devui-slider__button:hover{transform:scale(1.2)}.devui-slider__runway .devui-slider__button.disabled{background-color:var(--devui-base-bg, #ffffff);border-color:var(--devui-disabled-line, #dfe1e6)}.devui-slider__runway .devui-slider__button.disabled:hover{cursor:not-allowed;transform:none}.devui-slider__runway .devui-slider_popover{position:relative;bottom:26px;transform:translate(-50%);border-radius:var(--devui-border-radius-feedback, 4px);font-size:var(--devui-font-size-sm, 12px);color:var(--devui-feedback-overlay-text, #dfe1e6)}.devui-slider__runway .devui-slider_popover .devui-slider_popover-arrow{position:absolute;left:50%;margin-left:-4px;bottom:-4px;width:8px;height:8px;transform:rotate(45deg);display:block;z-index:-1;background-color:var(--devui-feedback-overlay-bg, #464d6e)}.devui-slider__runway .devui-slider_popover .devui-slider_popover-content{padding:5px 14px;text-align:center;border-radius:var(--devui-border-radius-feedback, 4px);background-color:var(--devui-feedback-overlay-bg, #464d6e)}.devui-slider .devui-min_count{position:absolute;top:15px;left:0;font-size:var(--devui-font-size, 12px);color:var(--devui-text, #252b3a)}.devui-slider .devui-max_count{position:absolute;top:15px;right:0;font-size:var(--devui-font-size, 12px);color:var(--devui-text, #252b3a)}.devui-slider .devui-input__out-wrap{font-size:var(--devui-font-size, 12px);position:absolute;right:-60px;top:-12px;padding:5px 10px;cursor:text;margin-left:20px}.devui-slider .devui-input__out-wrap input{width:40px;text-align:center}

package/splitter/index.es.js

@@ -4,7 +4,7 @@ var __publicField = (obj, key, value) => {
   __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
   return value;
 };
-import { defineComponent, inject, reactive, ref, watch, computed, onMounted, withDirectives, createVNode, provide, onUnmounted, resolveComponent, onUpdated } from "vue";
+import { defineComponent, reactive, ref, onMounted, watch, onBeforeUnmount, renderSlot, useSlots, createVNode, inject, computed, withDirectives, provide, onUnmounted, resolveComponent, onUpdated } from "vue";
 const splitterProps = {
   orientation: {
     type: String,
@@ -23,6 +23,164 @@ const splitterProps = {
     default: true
   }
 };
+const tooltipProps = {
+  position: {
+    type: String,
+    default: "top"
+  },
+  showAnimation: {
+    type: Boolean,
+    default: true
+  },
+  content: {
+    type: String
+  },
+  mouseLeaveDelay: {
+    type: String,
+    default: "150"
+  },
+  mouseEnterDelay: {
+    type: String,
+    default: "100"
+  }
+};
+const EventListener = {
+  listen: function(target, eventType, callback) {
+    if (target.addEventListener) {
+      target.addEventListener(eventType, callback, false);
+      return {
+        remove() {
+          target.removeEventListener(target, callback, false);
+        }
+      };
+    } else {
+      target.attchEvent(eventType, callback);
+      return {
+        remove() {
+          target.detachEvent(eventType, callback);
+        }
+      };
+    }
+  }
+};
+var tooltip = "";
+var DToolTip = defineComponent({
+  name: "DTooltip",
+  props: tooltipProps,
+  setup(props, ctx) {
+    const position = reactive({
+      left: 0,
+      top: 0
+    });
+    const show = ref(false);
+    const slotElement = ref(null);
+    const tooltip2 = ref(null);
+    const arrow = ref(null);
+    const tooltipcontent = ref(null);
+    let enterEvent;
+    let leaveEvent;
+    const arrowStyle = (attr, value) => {
+      arrow.value.style[attr] = value;
+    };
+    const delayShowTrue = function(fn, delay = props.mouseEnterDelay) {
+      let start;
+      if (parseInt(delay) >= 0) {
+        return function() {
+          if (start) {
+            clearTimeout(start);
+          }
+          start = setTimeout(fn, parseInt(delay));
+        };
+      } else {
+        console.error("the value of delay is bigger than 0 and the type of delay must be string!");
+        return;
+      }
+    };
+    onMounted(() => {
+      if (!show.value) {
+        tooltip2.value.style.opacity = "0";
+      }
+      enterEvent = EventListener.listen(slotElement.value.children[0], "mouseenter", delayShowTrue(function() {
+        show.value = true;
+      }, props.mouseEnterDelay));
+      leaveEvent = EventListener.listen(slotElement.value.children[0], "mouseleave", function() {
+        if (show.value) {
+          setTimeout(function() {
+            show.value = false;
+          }, props.mouseLeaveDelay);
+        }
+      });
+    });
+    watch(show, function(newValue, oldValue) {
+      if (newValue) {
+        tooltip2.value.style.opacity = "1";
+        tooltip2.value.style.zIndex = "999";
+        arrow.value.style.border = "5px solid transparent";
+        switch (props.position) {
+          case "top":
+            position.left = slotElement.value.children[0].offsetLeft - tooltip2.value.offsetWidth / 2 + slotElement.value.children[0].offsetWidth / 2 - 5;
+            position.top = slotElement.value.children[0].offsetTop - 10 - tooltipcontent.value.offsetHeight;
+            arrowStyle("borderTop", "5px solid rgb(70, 77, 110)");
+            arrow.value.style.top = `${tooltipcontent.value.offsetHeight}px`;
+            arrow.value.style.left = `${tooltipcontent.value.offsetWidth / 2 + 5}px`;
+            break;
+          case "right":
+            position.left = slotElement.value.children[0].offsetLeft + slotElement.value.children[0].offsetWidth;
+            position.top = slotElement.value.children[0].offsetTop + slotElement.value.children[0].offsetHeight / 2 - tooltipcontent.value.offsetHeight / 2;
+            arrowStyle("borderRight", "5px solid rgb(70, 77, 110)");
+            arrow.value.style.top = `${tooltipcontent.value.offsetHeight / 2 - 5}px`;
+            arrow.value.style.left = "-0px";
+            break;
+          case "bottom":
+            position.top = slotElement.value.children[0].offsetHeight + slotElement.value.children[0].offsetTop + 10;
+            position.left = slotElement.value.children[0].offsetLeft + slotElement.value.children[0].offsetWidth / 2 - tooltipcontent.value.offsetWidth / 2 - 5;
+            arrowStyle("borderBottom", "5px solid rgb(70, 77, 110)");
+            arrow.value.style.top = "-10px";
+            arrow.value.style.left = `${tooltipcontent.value.offsetWidth / 2 + 5}px`;
+            break;
+          case "left":
+            position.top = slotElement.value.children[0].offsetTop + slotElement.value.children[0].offsetHeight / 2 - tooltipcontent.value.offsetHeight / 2;
+            position.left = slotElement.value.children[0].offsetLeft - 20 - tooltipcontent.value.offsetWidth;
+            arrowStyle("borderLeft", "5px solid rgb(70, 77, 110)");
+            arrow.value.style.left = `${tooltipcontent.value.offsetWidth + 10}px`;
+            arrow.value.style.top = `${tooltipcontent.value.offsetHeight / 2 - 5}px`;
+            break;
+          default:
+            console.error("The attribute position value is wrong, the value is one of top\u3001right\u3001left\u3001bottom");
+            break;
+        }
+        tooltip2.value.style.top = position.top + "px";
+        tooltip2.value.style.left = position.left + "px";
+      } else {
+        position.top = 0;
+        position.left = 0;
+        tooltip2.value.style.opacity = "0";
+      }
+    });
+    onBeforeUnmount(() => {
+      enterEvent.remove();
+      leaveEvent.remove();
+    });
+    return () => {
+      const defaultSlot = renderSlot(useSlots(), "default");
+      return createVNode("div", {
+        "class": "devui-tooltip"
+      }, [createVNode("div", {
+        "class": "slotElement",
+        "ref": slotElement
+      }, [defaultSlot]), createVNode("div", {
+        "class": "tooltip",
+        "ref": tooltip2
+      }, [createVNode("div", {
+        "class": "arrow",
+        "ref": arrow
+      }, null), createVNode("div", {
+        "class": "tooltipcontent",
+        "ref": tooltipcontent
+      }, [props.content])])]);
+    };
+  }
+});
 function setStyle(element, style) {
   const oldStyle = {};
   const styleKeys = Object.keys(style);
@@ -111,7 +269,6 @@ function normalizeEvent(e) {
     originalEvent: e
   };
 }
-var splitterBar = "";
 const splitterBarProps = {
   index: {
     type: Number
@@ -132,9 +289,13 @@ const splitterBarProps = {
     type: Boolean
   }
 };
+var splitterBar = "";
 var DSplitterBar = defineComponent({
   name: "DSplitterBar",
   props: splitterBarProps,
+  components: {
+    DToolTip
+  },
   setup(props) {
     const store = inject("splitterStore");
     const state = reactive({
@@ -279,21 +440,38 @@ var DSplitterBar = defineComponent({
     onMounted(() => {
       initialCollapseStatus();
     });
+    const renderCollapsedTip = () => {
+      var _a, _b, _c, _d;
+      const {
+        pane,
+        nearPane
+      } = queryPanes(props.index, props.index + 1);
+      const isCollapsed = ((_b = (_a = pane == null ? void 0 : pane.component) == null ? void 0 : _a.props) == null ? void 0 : _b.collapsed) || ((_d = (_c = nearPane == null ? void 0 : nearPane.component) == null ? void 0 : _c.props) == null ? void 0 : _d.collapsed);
+      return isCollapsed ? "\u5C55\u5F00" : "\u6536\u8D77";
+    };
     return () => {
       return withDirectives(createVNode("div", {
         "class": state.wrapperClass,
         "ref": domRef
-      }, [props.showCollapseButton ? createVNode("div", {
-        "class": ["prev", prevClass.value],
-        "onClick": () => {
-          handleCollapsePrePane();
-        }
-      }, null) : null, createVNode("div", {
+      }, [props.showCollapseButton && createVNode(DToolTip, {
+        "content": renderCollapsedTip()
+      }, {
+        default: () => [createVNode("div", {
+          "class": ["prev", prevClass.value],
+          "onClick": () => {
+            handleCollapsePrePane();
+          }
+        }, null)]
+      }), createVNode("div", {
         "class": "devui-resize-handle"
-      }, null), props.showCollapseButton ? createVNode("div", {
-        "class": ["next", nextClass.value],
-        "onClick": () => handleCollapseNextPane()
-      }, null) : null]), [[resize, resizeProp]]);
+      }, null), props.showCollapseButton && createVNode(DToolTip, {
+        "content": renderCollapsedTip()
+      }, {
+        default: () => [createVNode("div", {
+          "class": ["next", nextClass.value],
+          "onClick": () => handleCollapseNextPane()
+        }, null)]
+      })]), [[resize, resizeProp]]);
     };
   }
 });
@@ -571,8 +749,7 @@ var SplitterPane = defineComponent({
         return ele.offsetWidth;
       }
     };
-    watch(() => props.collapsed, (collapsed) => {
-      const ele = domRef.value;
+    watch([() => props.collapsed, domRef], ([collapsed, ele]) => {
       if (!ele) {
         return;
       }

package/splitter/index.umd.js

@@ -1 +1 @@
-var U=Object.defineProperty;var _=(g,o,v)=>o in g?U(g,o,{enumerable:!0,configurable:!0,writable:!0,value:v}):g[o]=v;var k=(g,o,v)=>(_(g,typeof o!="symbol"?o+"":o,v),v);(function(g,o){typeof exports=="object"&&typeof module!="undefined"?o(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],o):(g=typeof globalThis!="undefined"?globalThis:g||self,o(g.index={},g.Vue))})(this,function(g,o){"use strict";const v={orientation:{type:String,default:"horizontal"},splitBarSize:{type:String,default:"2px"},disabledBarSize:{type:String,default:"1px"},showCollapseButton:{type:Boolean,default:!0}};function b(t,e){const i={},s=Object.keys(e);return s.forEach(n=>{i[n]=t.style[n]}),s.forEach(n=>{t.style[n]=e[n]}),i}function R(t,e){return t.classList?t.classList.contains(e):` ${t.className} `.indexOf(` ${e} `)>-1}function X(t,e){t.classList?t.classList.add(e):R(t,e)||(t.className=`${t.className} ${e}`)}function y(t,e){if(t.classList)t.classList.remove(e);else if(R(t,e)){const i=t.className;t.className=` ${i} `.replace(` ${e} `," ")}}const F={mounted(t,{value:e}){t.$value=e,e.enableResize&&H(t)},unmounted(t,{value:e}){e.enableResize&&$(t,"mousedown",L)}};function H(t){N(t,"mousedown",L)}function N(t,e,i){t.addEventListener&&t.addEventListener(e,i)}function $(t,e,i){t.removeEventListener&&t.removeEventListener(e,i)}function L(t){var n;const e=(n=t==null?void 0:t.target)==null?void 0:n.$value;if(!e)return;N(document,"mousemove",i),N(document,"mouseup",s),e.onPressEvent(E(t));function i(p){e.onDragEvent(E(p))}function s(p){$(document,"mousemove",i),$(document,"mouseup",s),e.onReleaseEvent(E(p))}}function E(t){return{pageX:t.pageX,pageY:t.pageY,clientX:t.clientX,clientY:t.clientY,offsetX:t.offsetX,offsetY:t.offsetY,type:t.type,originalEvent:t}}var K="";const T={index:{type:Number},orientation:{type:String,required:!0},splitBarSize:{type:String,required:!0},disabledBarSize:{type:String,default:"1px"},showCollapseButton:{type:Boolean}};var q=o.defineComponent({name:"DSplitterBar",props:T,setup(t){const e=o.inject("splitterStore"),i=o.reactive({wrapperClass:`devui-splitter-bar devui-splitter-bar-${t.orientation}`}),s=o.ref();o.watch([()=>t.splitBarSize,s],([a,c])=>{c instanceof HTMLElement&&b(c,{flexBasis:a})},{immediate:!0}),o.watch([()=>e.state.panes,s],([a,c])=>{e.isStaticBar(t.index)?b(c,{flexBasis:t.disabledBarSize}):i.wrapperClass+=" resizable"},{deep:!0});const n={pageX:0,pageY:0,originalX:0,originalY:0};let p;const d={enableResize:!0,onPressEvent:function({originalEvent:a}){a.stopPropagation(),!!e.isResizable(t.index)&&(p=e.dragState(t.index),n.originalX=a.pageX,n.originalY=a.pageY)},onDragEvent:function({originalEvent:a}){if(a.stopPropagation(),!e.isResizable(t.index))return;n.pageX=a.pageX,n.pageY=a.pageY;let c;t.orientation==="vertical"?c=n.pageY-n.originalY:c=n.pageX-n.originalX,e.setSize(p,c)},onReleaseEvent:function({originalEvent:a}){if(a.stopPropagation(),!e.isResizable(t.index))return;n.pageX=a.pageX,n.pageY=a.pageY;let c;t.orientation==="vertical"?c=n.pageY-n.originalY:c=n.pageX-n.originalX,e.setSize(p,c)}},f=(a,c)=>{const x=e.getPane(a),h=e.getPane(c);return{pane:x,nearPane:h}},z=(a,c,x)=>{var B,M,V,j;const h=((M=(B=a==null?void 0:a.component)==null?void 0:B.props)==null?void 0:M.collapsible)&&x,C=(j=(V=a==null?void 0:a.component)==null?void 0:V.props)==null?void 0:j.collapsed,Y=c.collapsed;return{"devui-collapse":h,collapsed:C,hidden:Y}},m=o.computed(()=>{var h,C;const{pane:a,nearPane:c}=f(t.index,t.index+1),x=((C=(h=a==null?void 0:a.component)==null?void 0:h.props)==null?void 0:C.collapseDirection)!=="after"||t.index===0;return z(a,c,x)}),S=o.computed(()=>{var h,C;const{pane:a,nearPane:c}=f(t.index+1,t.index),x=((C=(h=a==null?void 0:a.component)==null?void 0:h.props)==null?void 0:C.collapseDirection)!=="before"||t.index+1===e.state.paneCount-1;return z(a,c,x)}),l=()=>{var h,C,Y,B;const{pane:a,nearPane:c}=f(t.index,t.index+1);((C=(h=a==null?void 0:a.component)==null?void 0:h.props)==null?void 0:C.collapsed)||((B=(Y=c==null?void 0:c.component)==null?void 0:Y.props)==null?void 0:B.collapsed)?X(s.value,"none-resizable"):y(s.value,"none-resizable")},r=a=>{e.tooglePane(t.index,t.index+1,a),l()},u=a=>{e.tooglePane(t.index+1,t.index,a),l()},P=()=>{r(!0),u(!0)};return o.onMounted(()=>{P()}),()=>o.withDirectives(o.createVNode("div",{class:i.wrapperClass,ref:s},[t.showCollapseButton?o.createVNode("div",{class:["prev",m.value],onClick:()=>{r()}},null):null,o.createVNode("div",{class:"devui-resize-handle"},null),t.showCollapseButton?o.createVNode("div",{class:["next",S.value],onClick:()=>u()},null):null]),[[F,d]])}});class G{constructor(){k(this,"state");this.state=o.reactive({panes:[],splitterContainerSize:0,paneCount:0})}setPanes({panes:e}){this.state.panes=e.map((i,s)=>{var n;return i.component&&(i.component.exposed.order.value=s*2),i.getPaneSize=(n=i==null?void 0:i.component)==null?void 0:n.exposed.getPaneSize,i}),this.state.paneCount=e.length}setSplitter({containerSize:e}){this.state.splitterContainerSize=e}getPane(e){if(!this.state.panes||e<0||e>=this.state.panes.length)throw new Error("no pane can return.");return this.state.panes[e]}dragState(e){const i=this.getPane(e),s=this.getPane(e+1),n=i.getPaneSize()+s.getPaneSize();return{prev:{index:e,initialSize:i.getPaneSize(),minSize:this.toPixels(i.component.props.minSize)||n-this.toPixels(s.component.props.maxSize)||0,maxSize:this.toPixels(i.component.props.maxSize)||n-this.toPixels(s.component.props.minSize)||n},next:{index:e+1,initialSize:s.getPaneSize(),minSize:this.toPixels(s.component.props.minSize)||n-this.toPixels(i.component.props.maxSize)||0,maxSize:this.toPixels(s.component.props.maxSize)||n-this.toPixels(i.component.props.minSize)||n}}}clamp(e,i,s){return Math.min(i,Math.max(e,s))}resize(e,i){const s=this.getPane(e.index),n=this.state.splitterContainerSize,p=this.clamp(e.minSize,e.maxSize,e.initialSize+i);let d="";this.isPercent(s.component.props.size)?d=p/n*100+"%":d=p+"px",s.component.props.size=d,s.component.emit("sizeChange",d)}isResizable(e){var p,d,f,z,m,S,l,r;const i=this.getPane(e),s=this.getPane(e+1),n=((d=(p=i==null?void 0:i.component)==null?void 0:p.props)==null?void 0:d.collapsed)||((z=(f=s==null?void 0:s.component)==null?void 0:f.props)==null?void 0:z.collapsed);return((S=(m=i==null?void 0:i.component)==null?void 0:m.props)==null?void 0:S.resizable)&&((r=(l=s==null?void 0:s.component)==null?void 0:l.props)==null?void 0:r.resizable)&&!n}isStaticBar(e){var n,p,d,f;const i=this.getPane(e),s=this.getPane(e+1);return!(((p=(n=i==null?void 0:i.component)==null?void 0:n.props)==null?void 0:p.resizable)&&((f=(d=s==null?void 0:s.component)==null?void 0:d.props)==null?void 0:f.resizable))}isPercent(e){return/%$/.test(e)}toPixels(e){let i=parseFloat(e);return this.isPercent(e)&&(i=this.state.splitterContainerSize*i/100),i}tooglePane(e,i,s){var d,f,z,m,S,l,r,u,P,a,c,x,h;const n=this.getPane(e),p=this.getPane(i);((f=(d=n==null?void 0:n.component)==null?void 0:d.props)==null?void 0:f.collapsible)&&(n.component.props.collapsed=s?(m=(z=n==null?void 0:n.component)==null?void 0:z.props)==null?void 0:m.collapsed:!((l=(S=n==null?void 0:n.component)==null?void 0:S.props)==null?void 0:l.collapsed),(a=(r=p==null?void 0:p.component)==null?void 0:r.exposed)==null||a.toggleNearPaneFlexGrow((P=(u=n==null?void 0:n.component)==null?void 0:u.props)==null?void 0:P.collapsed),(h=n==null?void 0:n.component)==null||h.emit("collapsedChange",(x=(c=n==null?void 0:n.component)==null?void 0:c.props)==null?void 0:x.collapsed))}setSize(e,i){const s=this.getPane(e.prev.index),n=this.getPane(e.next.index);s.component.props.size&&n.component.props.size?(this.resize(e.prev,i),this.resize(e.next,-i)):n.component.props.size?this.resize(e.next,-i):this.resize(e.prev,i)}}var A="",w=o.defineComponent({name:"DSplitter",components:{DSplitterBar:q},props:v,emits:[],setup(t,e){var f,z;const i=new G,s=o.reactive({panes:[]});s.panes=((z=(f=e.slots).DSplitterPane)==null?void 0:z.call(f))||[],i.setPanes({panes:s.panes}),o.provide("orientation",t.orientation),o.provide("splitterStore",i);const n=o.ref(),p=()=>{if(!n)return;let m=0;t.orientation==="vertical"?m=n.value.clientHeight:m=n.value.clientWidth,i.setSplitter({containerSize:m})},d=new ResizeObserver(p);return o.watch(n,m=>{!m||(p(),d.observe(n.value))}),o.onUnmounted(()=>{d.disconnect()}),()=>{const{splitBarSize:m,orientation:S,showCollapseButton:l}=t,r=["devui-splitter",`devui-splitter-${S}`];return o.createVNode("div",{class:r,ref:n},[s.panes,s.panes.filter((u,P,a)=>P!==a.length-1).map((u,P)=>o.createVNode(o.resolveComponent("d-splitter-bar"),{key:P,style:`order: ${P*2+1}`,splitBarSize:m,orientation:S,index:P,showCollapseButton:l},null))])}}});const O={size:{type:String},minSize:{type:String},maxSize:{type:String},resizable:{type:Boolean,default:!0},collapsible:{type:Boolean,default:!1},collapsed:{type:Boolean,default:!1},collapseDirection:{type:String,default:"both"},shrink:{type:Boolean,default:!1},shrinkWidth:{type:Number,default:36}};var J="",D=o.defineComponent({name:"DSplitterPane",props:O,emits:["sizeChange","collapsedChange"],setup(t,{slots:e,expose:i}){const s=o.inject("splitterStore"),n=o.ref(),p=o.ref();o.watch([p,n],([l,r])=>{!r||b(r,{order:l})});const d=(l,r)=>{if(!r)return;r.style.flexBasis=l;const u="devui-splitter-pane-fixed";l?X(r,u):y(r,u)};o.watch([()=>t.size,n],([l,r])=>{d(l,r)},{immediate:!0});const f=o.inject("orientation");let z="";o.onMounted(()=>{z=t.size,s.setPanes({panes:s.state.panes})}),o.onUpdated(()=>{s.setPanes({panes:s.state.panes})});const m=()=>{const l=n.value;if(!!l)return f==="vertical"?l.offsetHeight:l.offsetWidth};return o.watch(()=>t.collapsed,l=>{const r=n.value;if(!r)return;const u="devui-splitter-pane-hidden";l?X(r,u):y(r,u),l&&t.shrink?(y(r,u),b(r,{flexBasis:`${t.shrinkWidth}px`})):b(r,{flexBasis:z})},{immediate:!0}),i({order:p,getPaneSize:m,toggleNearPaneFlexGrow:l=>{const r=n.value;if(!(r instanceof HTMLElement))return;const u="devui-splitter-pane-grow";R(r,u)?y(r,u):l&&X(r,u)}}),()=>{var l;return o.createVNode("div",{class:"devui-splitter-pane",ref:n},[(l=e.default)==null?void 0:l.call(e)])}}});w.install=function(t){t.component(w.name,w),t.component(D.name,D)};var W={title:"Splitter \u5206\u5272\u5668",category:"\u5E03\u5C40",status:"100%",install(t){t.use(w)}};g.Splitter=w,g.default=W,Object.defineProperty(g,"__esModule",{value:!0}),g[Symbol.toStringTag]="Module"});
+var I=Object.defineProperty;var J=(v,s,C)=>s in v?I(v,s,{enumerable:!0,configurable:!0,writable:!0,value:C}):v[s]=C;var j=(v,s,C)=>(J(v,typeof s!="symbol"?s+"":s,C),C);(function(v,s){typeof exports=="object"&&typeof module!="undefined"?s(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],s):(v=typeof globalThis!="undefined"?globalThis:v||self,s(v.index={},v.Vue))})(this,function(v,s){"use strict";const C={orientation:{type:String,default:"horizontal"},splitBarSize:{type:String,default:"2px"},disabledBarSize:{type:String,default:"1px"},showCollapseButton:{type:Boolean,default:!0}},F={position:{type:String,default:"top"},showAnimation:{type:Boolean,default:!0},content:{type:String},mouseLeaveDelay:{type:String,default:"150"},mouseEnterDelay:{type:String,default:"100"}},R={listen:function(e,n,o){return e.addEventListener?(e.addEventListener(n,o,!1),{remove(){e.removeEventListener(e,o,!1)}}):(e.attchEvent(n,o),{remove(){e.detachEvent(n,o)}})}};var Q="",$=s.defineComponent({name:"DTooltip",props:F,setup(e,n){const o=s.reactive({left:0,top:0}),i=s.ref(!1),t=s.ref(null),r=s.ref(null),c=s.ref(null),p=s.ref(null);let h,m;const g=(a,u)=>{c.value.style[a]=u},d=function(a,u=e.mouseEnterDelay){let z;if(parseInt(u)>=0)return function(){z&&clearTimeout(z),z=setTimeout(a,parseInt(u))};console.error("the value of delay is bigger than 0 and the type of delay must be string!")};return s.onMounted(()=>{i.value||(r.value.style.opacity="0"),h=R.listen(t.value.children[0],"mouseenter",d(function(){i.value=!0},e.mouseEnterDelay)),m=R.listen(t.value.children[0],"mouseleave",function(){i.value&&setTimeout(function(){i.value=!1},e.mouseLeaveDelay)})}),s.watch(i,function(a,u){if(a){switch(r.value.style.opacity="1",r.value.style.zIndex="999",c.value.style.border="5px solid transparent",e.position){case"top":o.left=t.value.children[0].offsetLeft-r.value.offsetWidth/2+t.value.children[0].offsetWidth/2-5,o.top=t.value.children[0].offsetTop-10-p.value.offsetHeight,g("borderTop","5px solid rgb(70, 77, 110)"),c.value.style.top=`${p.value.offsetHeight}px`,c.value.style.left=`${p.value.offsetWidth/2+5}px`;break;case"right":o.left=t.value.children[0].offsetLeft+t.value.children[0].offsetWidth,o.top=t.value.children[0].offsetTop+t.value.children[0].offsetHeight/2-p.value.offsetHeight/2,g("borderRight","5px solid rgb(70, 77, 110)"),c.value.style.top=`${p.value.offsetHeight/2-5}px`,c.value.style.left="-0px";break;case"bottom":o.top=t.value.children[0].offsetHeight+t.value.children[0].offsetTop+10,o.left=t.value.children[0].offsetLeft+t.value.children[0].offsetWidth/2-p.value.offsetWidth/2-5,g("borderBottom","5px solid rgb(70, 77, 110)"),c.value.style.top="-10px",c.value.style.left=`${p.value.offsetWidth/2+5}px`;break;case"left":o.top=t.value.children[0].offsetTop+t.value.children[0].offsetHeight/2-p.value.offsetHeight/2,o.left=t.value.children[0].offsetLeft-20-p.value.offsetWidth,g("borderLeft","5px solid rgb(70, 77, 110)"),c.value.style.left=`${p.value.offsetWidth+10}px`,c.value.style.top=`${p.value.offsetHeight/2-5}px`;break;default:console.error("The attribute position value is wrong, the value is one of top\u3001right\u3001left\u3001bottom");break}r.value.style.top=o.top+"px",r.value.style.left=o.left+"px"}else o.top=0,o.left=0,r.value.style.opacity="0"}),s.onBeforeUnmount(()=>{h.remove(),m.remove()}),()=>{const a=s.renderSlot(s.useSlots(),"default");return s.createVNode("div",{class:"devui-tooltip"},[s.createVNode("div",{class:"slotElement",ref:t},[a]),s.createVNode("div",{class:"tooltip",ref:r},[s.createVNode("div",{class:"arrow",ref:c},null),s.createVNode("div",{class:"tooltipcontent",ref:p},[e.content])])])}}});function B(e,n){const o={},i=Object.keys(n);return i.forEach(t=>{o[t]=e.style[t]}),i.forEach(t=>{e.style[t]=n[t]}),o}function D(e,n){return e.classList?e.classList.contains(n):` ${e.className} `.indexOf(` ${n} `)>-1}function N(e,n){e.classList?e.classList.add(n):D(e,n)||(e.className=`${e.className} ${n}`)}function E(e,n){if(e.classList)e.classList.remove(n);else if(D(e,n)){const o=e.className;e.className=` ${o} `.replace(` ${n} `," ")}}const q={mounted(e,{value:n}){e.$value=n,n.enableResize&&G(e)},unmounted(e,{value:n}){n.enableResize&&Y(e,"mousedown",V)}};function G(e){X(e,"mousedown",V)}function X(e,n,o){e.addEventListener&&e.addEventListener(n,o)}function Y(e,n,o){e.removeEventListener&&e.removeEventListener(n,o)}function V(e){var t;const n=(t=e==null?void 0:e.target)==null?void 0:t.$value;if(!n)return;X(document,"mousemove",o),X(document,"mouseup",i),n.onPressEvent(T(e));function o(r){n.onDragEvent(T(r))}function i(r){Y(document,"mousemove",o),Y(document,"mouseup",i),n.onReleaseEvent(T(r))}}function T(e){return{pageX:e.pageX,pageY:e.pageY,clientX:e.clientX,clientY:e.clientY,offsetX:e.offsetX,offsetY:e.offsetY,type:e.type,originalEvent:e}}const O={index:{type:Number},orientation:{type:String,required:!0},splitBarSize:{type:String,required:!0},disabledBarSize:{type:String,default:"1px"},showCollapseButton:{type:Boolean}};var Z="",U=s.defineComponent({name:"DSplitterBar",props:O,components:{DToolTip:$},setup(e){const n=s.inject("splitterStore"),o=s.reactive({wrapperClass:`devui-splitter-bar devui-splitter-bar-${e.orientation}`}),i=s.ref();s.watch([()=>e.splitBarSize,i],([l,f])=>{f instanceof HTMLElement&&B(f,{flexBasis:l})},{immediate:!0}),s.watch([()=>n.state.panes,i],([l,f])=>{n.isStaticBar(e.index)?B(f,{flexBasis:e.disabledBarSize}):o.wrapperClass+=" resizable"},{deep:!0});const t={pageX:0,pageY:0,originalX:0,originalY:0};let r;const c={enableResize:!0,onPressEvent:function({originalEvent:l}){l.stopPropagation(),!!n.isResizable(e.index)&&(r=n.dragState(e.index),t.originalX=l.pageX,t.originalY=l.pageY)},onDragEvent:function({originalEvent:l}){if(l.stopPropagation(),!n.isResizable(e.index))return;t.pageX=l.pageX,t.pageY=l.pageY;let f;e.orientation==="vertical"?f=t.pageY-t.originalY:f=t.pageX-t.originalX,n.setSize(r,f)},onReleaseEvent:function({originalEvent:l}){if(l.stopPropagation(),!n.isResizable(e.index))return;t.pageX=l.pageX,t.pageY=l.pageY;let f;e.orientation==="vertical"?f=t.pageY-t.originalY:f=t.pageX-t.originalX,n.setSize(r,f)}},p=(l,f)=>{const y=n.getPane(l),S=n.getPane(f);return{pane:y,nearPane:S}},h=(l,f,y)=>{var P,W,M,k;const S=((W=(P=l==null?void 0:l.component)==null?void 0:P.props)==null?void 0:W.collapsible)&&y,x=(k=(M=l==null?void 0:l.component)==null?void 0:M.props)==null?void 0:k.collapsed,w=f.collapsed;return{"devui-collapse":S,collapsed:x,hidden:w}},m=s.computed(()=>{var S,x;const{pane:l,nearPane:f}=p(e.index,e.index+1),y=((x=(S=l==null?void 0:l.component)==null?void 0:S.props)==null?void 0:x.collapseDirection)!=="after"||e.index===0;return h(l,f,y)}),g=s.computed(()=>{var S,x;const{pane:l,nearPane:f}=p(e.index+1,e.index),y=((x=(S=l==null?void 0:l.component)==null?void 0:S.props)==null?void 0:x.collapseDirection)!=="before"||e.index+1===n.state.paneCount-1;return h(l,f,y)}),d=()=>{var S,x,w,P;const{pane:l,nearPane:f}=p(e.index,e.index+1);((x=(S=l==null?void 0:l.component)==null?void 0:S.props)==null?void 0:x.collapsed)||((P=(w=f==null?void 0:f.component)==null?void 0:w.props)==null?void 0:P.collapsed)?N(i.value,"none-resizable"):E(i.value,"none-resizable")},a=l=>{n.tooglePane(e.index,e.index+1,l),d()},u=l=>{n.tooglePane(e.index+1,e.index,l),d()},z=()=>{a(!0),u(!0)};s.onMounted(()=>{z()});const b=()=>{var S,x,w,P;const{pane:l,nearPane:f}=p(e.index,e.index+1);return((x=(S=l==null?void 0:l.component)==null?void 0:S.props)==null?void 0:x.collapsed)||((P=(w=f==null?void 0:f.component)==null?void 0:w.props)==null?void 0:P.collapsed)?"\u5C55\u5F00":"\u6536\u8D77"};return()=>s.withDirectives(s.createVNode("div",{class:o.wrapperClass,ref:i},[e.showCollapseButton&&s.createVNode($,{content:b()},{default:()=>[s.createVNode("div",{class:["prev",m.value],onClick:()=>{a()}},null)]}),s.createVNode("div",{class:"devui-resize-handle"},null),e.showCollapseButton&&s.createVNode($,{content:b()},{default:()=>[s.createVNode("div",{class:["next",g.value],onClick:()=>u()},null)]})]),[[q,c]])}});class _{constructor(){j(this,"state");this.state=s.reactive({panes:[],splitterContainerSize:0,paneCount:0})}setPanes({panes:n}){this.state.panes=n.map((o,i)=>{var t;return o.component&&(o.component.exposed.order.value=i*2),o.getPaneSize=(t=o==null?void 0:o.component)==null?void 0:t.exposed.getPaneSize,o}),this.state.paneCount=n.length}setSplitter({containerSize:n}){this.state.splitterContainerSize=n}getPane(n){if(!this.state.panes||n<0||n>=this.state.panes.length)throw new Error("no pane can return.");return this.state.panes[n]}dragState(n){const o=this.getPane(n),i=this.getPane(n+1),t=o.getPaneSize()+i.getPaneSize();return{prev:{index:n,initialSize:o.getPaneSize(),minSize:this.toPixels(o.component.props.minSize)||t-this.toPixels(i.component.props.maxSize)||0,maxSize:this.toPixels(o.component.props.maxSize)||t-this.toPixels(i.component.props.minSize)||t},next:{index:n+1,initialSize:i.getPaneSize(),minSize:this.toPixels(i.component.props.minSize)||t-this.toPixels(o.component.props.maxSize)||0,maxSize:this.toPixels(i.component.props.maxSize)||t-this.toPixels(o.component.props.minSize)||t}}}clamp(n,o,i){return Math.min(o,Math.max(n,i))}resize(n,o){const i=this.getPane(n.index),t=this.state.splitterContainerSize,r=this.clamp(n.minSize,n.maxSize,n.initialSize+o);let c="";this.isPercent(i.component.props.size)?c=r/t*100+"%":c=r+"px",i.component.props.size=c,i.component.emit("sizeChange",c)}isResizable(n){var r,c,p,h,m,g,d,a;const o=this.getPane(n),i=this.getPane(n+1),t=((c=(r=o==null?void 0:o.component)==null?void 0:r.props)==null?void 0:c.collapsed)||((h=(p=i==null?void 0:i.component)==null?void 0:p.props)==null?void 0:h.collapsed);return((g=(m=o==null?void 0:o.component)==null?void 0:m.props)==null?void 0:g.resizable)&&((a=(d=i==null?void 0:i.component)==null?void 0:d.props)==null?void 0:a.resizable)&&!t}isStaticBar(n){var t,r,c,p;const o=this.getPane(n),i=this.getPane(n+1);return!(((r=(t=o==null?void 0:o.component)==null?void 0:t.props)==null?void 0:r.resizable)&&((p=(c=i==null?void 0:i.component)==null?void 0:c.props)==null?void 0:p.resizable))}isPercent(n){return/%$/.test(n)}toPixels(n){let o=parseFloat(n);return this.isPercent(n)&&(o=this.state.splitterContainerSize*o/100),o}tooglePane(n,o,i){var c,p,h,m,g,d,a,u,z,b,l,f,y;const t=this.getPane(n),r=this.getPane(o);((p=(c=t==null?void 0:t.component)==null?void 0:c.props)==null?void 0:p.collapsible)&&(t.component.props.collapsed=i?(m=(h=t==null?void 0:t.component)==null?void 0:h.props)==null?void 0:m.collapsed:!((d=(g=t==null?void 0:t.component)==null?void 0:g.props)==null?void 0:d.collapsed),(b=(a=r==null?void 0:r.component)==null?void 0:a.exposed)==null||b.toggleNearPaneFlexGrow((z=(u=t==null?void 0:t.component)==null?void 0:u.props)==null?void 0:z.collapsed),(y=t==null?void 0:t.component)==null||y.emit("collapsedChange",(f=(l=t==null?void 0:t.component)==null?void 0:l.props)==null?void 0:f.collapsed))}setSize(n,o){const i=this.getPane(n.prev.index),t=this.getPane(n.next.index);i.component.props.size&&t.component.props.size?(this.resize(n.prev,o),this.resize(n.next,-o)):t.component.props.size?this.resize(n.next,-o):this.resize(n.prev,o)}}var ee="",L=s.defineComponent({name:"DSplitter",components:{DSplitterBar:U},props:C,emits:[],setup(e,n){var p,h;const o=new _,i=s.reactive({panes:[]});i.panes=((h=(p=n.slots).DSplitterPane)==null?void 0:h.call(p))||[],o.setPanes({panes:i.panes}),s.provide("orientation",e.orientation),s.provide("splitterStore",o);const t=s.ref(),r=()=>{if(!t)return;let m=0;e.orientation==="vertical"?m=t.value.clientHeight:m=t.value.clientWidth,o.setSplitter({containerSize:m})},c=new ResizeObserver(r);return s.watch(t,m=>{!m||(r(),c.observe(t.value))}),s.onUnmounted(()=>{c.disconnect()}),()=>{const{splitBarSize:m,orientation:g,showCollapseButton:d}=e,a=["devui-splitter",`devui-splitter-${g}`];return s.createVNode("div",{class:a,ref:t},[i.panes,i.panes.filter((u,z,b)=>z!==b.length-1).map((u,z)=>s.createVNode(s.resolveComponent("d-splitter-bar"),{key:z,style:`order: ${z*2+1}`,splitBarSize:m,orientation:g,index:z,showCollapseButton:d},null))])}}});const A={size:{type:String},minSize:{type:String},maxSize:{type:String},resizable:{type:Boolean,default:!0},collapsible:{type:Boolean,default:!1},collapsed:{type:Boolean,default:!1},collapseDirection:{type:String,default:"both"},shrink:{type:Boolean,default:!1},shrinkWidth:{type:Number,default:36}};var te="",H=s.defineComponent({name:"DSplitterPane",props:A,emits:["sizeChange","collapsedChange"],setup(e,{slots:n,expose:o}){const i=s.inject("splitterStore"),t=s.ref(),r=s.ref();s.watch([r,t],([d,a])=>{!a||B(a,{order:d})});const c=(d,a)=>{if(!a)return;a.style.flexBasis=d;const u="devui-splitter-pane-fixed";d?N(a,u):E(a,u)};s.watch([()=>e.size,t],([d,a])=>{c(d,a)},{immediate:!0});const p=s.inject("orientation");let h="";s.onMounted(()=>{h=e.size,i.setPanes({panes:i.state.panes})}),s.onUpdated(()=>{i.setPanes({panes:i.state.panes})});const m=()=>{const d=t.value;if(!!d)return p==="vertical"?d.offsetHeight:d.offsetWidth};return s.watch([()=>e.collapsed,t],([d,a])=>{if(!a)return;const u="devui-splitter-pane-hidden";d?N(a,u):E(a,u),d&&e.shrink?(E(a,u),B(a,{flexBasis:`${e.shrinkWidth}px`})):B(a,{flexBasis:h})},{immediate:!0}),o({order:r,getPaneSize:m,toggleNearPaneFlexGrow:d=>{const a=t.value;if(!(a instanceof HTMLElement))return;const u="devui-splitter-pane-grow";D(a,u)?E(a,u):d&&N(a,u)}}),()=>{var d;return s.createVNode("div",{class:"devui-splitter-pane",ref:t},[(d=n.default)==null?void 0:d.call(n)])}}});L.install=function(e){e.component(L.name,L),e.component(H.name,H)};var K={title:"Splitter \u5206\u5272\u5668",category:"\u5E03\u5C40",status:"100%",install(e){e.use(L)}};v.Splitter=L,v.default=K,Object.defineProperty(v,"__esModule",{value:!0}),v[Symbol.toStringTag]="Module"});

package/splitter/style.css

@@ -1 +1 @@
-.devui-splitter-bar{background-color:var(--devui-dividing-line, #dfe1e6);display:flex;position:relative;align-items:center;justify-content:center;flex-grow:0;flex-shrink:0}.devui-splitter-bar .devui-collapse{background-color:var(--devui-dividing-line, #dfe1e6);position:absolute;z-index:15;cursor:pointer}.devui-splitter-bar .devui-collapse:before,.devui-splitter-bar .devui-collapse:after{content:"";width:10px;height:2px;background:#ffffff;display:block;position:absolute}.devui-splitter-bar .devui-collapse:hover{background-color:var(--devui-brand-hover, #7693f5)}.devui-splitter-bar-horizontal .devui-collapse{width:12px;height:30px}.devui-splitter-bar-horizontal .devui-collapse.prev.hidden,.devui-splitter-bar-horizontal .devui-collapse.next.hidden{display:none}.devui-splitter-bar-horizontal .devui-collapse.prev{border-radius:0 var(--devui-border-radius-feedback, 4px) var(--devui-border-radius-feedback, 4px) 0;left:100%}.devui-splitter-bar-horizontal .devui-collapse.prev:before,.devui-splitter-bar-horizontal .devui-collapse.prev.collapsed:before{top:9px;left:1px}.devui-splitter-bar-horizontal .devui-collapse.prev:before{transform:rotate(-70deg)}.devui-splitter-bar-horizontal .devui-collapse.prev.collapsed:before{transform:rotate(70deg)}.devui-splitter-bar-horizontal .devui-collapse.prev:after,.devui-splitter-bar-horizontal .devui-collapse.prev.collapsed:after{top:18px;left:1px}.devui-splitter-bar-horizontal .devui-collapse.prev:after{transform:rotate(70deg)}.devui-splitter-bar-horizontal .devui-collapse.prev.collapsed:after{transform:rotate(-70deg)}.devui-splitter-bar-horizontal .devui-collapse.next{border-radius:var(--devui-border-radius-feedback, 4px) 0 0 var(--devui-border-radius-feedback, 4px);right:100%}.devui-splitter-bar-horizontal .devui-collapse.next:before,.devui-splitter-bar-horizontal .devui-collapse.next.collapsed:before{top:9px;right:1px}.devui-splitter-bar-horizontal .devui-collapse.next:before{transform:rotate(70deg)}.devui-splitter-bar-horizontal .devui-collapse.next.collapsed:before{transform:rotate(-70deg)}.devui-splitter-bar-horizontal .devui-collapse.next:after,.devui-splitter-bar-horizontal .devui-collapse.next.collapsed:after{top:18px;right:1px}.devui-splitter-bar-horizontal .devui-collapse.next:after{transform:rotate(-70deg)}.devui-splitter-bar-horizontal .devui-collapse.next.collapsed:after{transform:rotate(70deg)}.devui-splitter-bar-vertical .devui-collapse{height:12px;width:30px}.devui-splitter-bar-vertical .devui-collapse.prev.hidden,.devui-splitter-bar-vertical .devui-collapse.next.hidden{display:none}.devui-splitter-bar-vertical .devui-collapse.prev{border-radius:0 0 var(--devui-border-radius-feedback, 4px) var(--devui-border-radius-feedback, 4px);top:100%}.devui-splitter-bar-vertical .devui-collapse.prev:before,.devui-splitter-bar-vertical .devui-collapse.prev.collapsed:before{bottom:5px;left:5px}.devui-splitter-bar-vertical .devui-collapse.prev:before{transform:rotate(-20deg)}.devui-splitter-bar-vertical .devui-collapse.prev.collapsed:before{transform:rotate(20deg)}.devui-splitter-bar-vertical .devui-collapse.prev:after,.devui-splitter-bar-vertical .devui-collapse.prev.collapsed:after{bottom:5px;left:14px}.devui-splitter-bar-vertical .devui-collapse.prev:after{transform:rotate(20deg)}.devui-splitter-bar-vertical .devui-collapse.prev.collapsed:after{transform:rotate(-20deg)}.devui-splitter-bar-vertical .devui-collapse.next{border-radius:var(--devui-border-radius-feedback, 4px) var(--devui-border-radius-feedback, 4px) 0 0;bottom:100%}.devui-splitter-bar-vertical .devui-collapse.next:before,.devui-splitter-bar-vertical .devui-collapse.next.collapsed:before{top:5px;left:5px}.devui-splitter-bar-vertical .devui-collapse.next:before{transform:rotate(20deg)}.devui-splitter-bar-vertical .devui-collapse.next.collapsed:before{transform:rotate(-20deg);top:5px;left:5px}.devui-splitter-bar-vertical .devui-collapse.next:after,.devui-splitter-bar-vertical .devui-collapse.next.collapsed:after{top:5px;left:14px}.devui-splitter-bar-vertical .devui-collapse.next:after{transform:rotate(-20deg)}.devui-splitter-bar-vertical .devui-collapse.next.collapsed:after{transform:rotate(20deg)}.devui-splitter-bar-horizontal.resizable:not(.none-resizable):hover,.devui-splitter-bar-horizontal.resizable:not(.none-resizable):focus,.devui-splitter-bar-horizontal.resizable:not(.none-resizable):active,.devui-splitter-bar-vertical.resizable:not(.none-resizable):hover,.devui-splitter-bar-vertical.resizable:not(.none-resizable):focus,.devui-splitter-bar-vertical.resizable:not(.none-resizable):active{background-color:var(--devui-brand-hover, #7693f5)}.devui-splitter-bar-horizontal.resizable:not(.none-resizable):after,.devui-splitter-bar-vertical.resizable:not(.none-resizable):after{content:"";display:block;position:absolute;z-index:10}.devui-splitter-bar-horizontal.resizable{cursor:col-resize}.devui-splitter-bar-horizontal.resizable:after{cursor:col-resize;height:100%;width:10px;top:0}.devui-splitter-bar-vertical.resizable{cursor:row-resize}.devui-splitter-bar-vertical.resizable:after{cursor:row-resize;width:100%;height:10px;left:0}.devui-splitter{display:flex;width:100%;height:auto;position:relative;border-radius:var(--devui-border-radius, 2px)}.devui-splitter.devui-splitter-horizontal{flex-direction:row}.devui-splitter.devui-splitter-vertical{flex-direction:column}.devui-splitter-pane{position:relative;flex:1 1 auto;display:block;min-width:0;max-width:100%;min-height:0;max-height:100%}.devui-splitter-pane-fixed{flex-grow:0;flex-shrink:0}.devui-splitter-pane-hidden{flex:0!important;overflow:hidden!important}.devui-splitter-pane-grow{flex-grow:1!important}
+.devui-tooltip{box-sizing:border-box}.devui-tooltip .tooltip{box-sizing:border-box;position:absolute;width:fit-content;transition:all .5s}.devui-tooltip .tooltip .arrow{width:0;height:0;position:absolute}.devui-tooltip .tooltip .tooltipcontent{box-sizing:border-box;padding:10px;margin-left:10px;border-radius:4px;width:fit-content;background-color:var(--devui-feedback-overlay-bg, #464d6e);color:var(--devui-feedback-overlay-text, #dfe1e6)}.devui-splitter-bar{background-color:var(--devui-dividing-line, #dfe1e6);display:flex;position:relative;align-items:center;justify-content:center;flex-grow:0;flex-shrink:0}.devui-splitter-bar .devui-collapse{background-color:var(--devui-dividing-line, #dfe1e6);position:absolute;z-index:15;cursor:pointer}.devui-splitter-bar .devui-collapse:before,.devui-splitter-bar .devui-collapse:after{content:"";width:10px;height:2px;background:#ffffff;display:block;position:absolute}.devui-splitter-bar .devui-collapse:hover{background-color:var(--devui-brand-hover, #7693f5)}.devui-splitter-bar-horizontal .devui-collapse{width:12px;height:30px}.devui-splitter-bar-horizontal .devui-collapse.prev.hidden,.devui-splitter-bar-horizontal .devui-collapse.next.hidden{display:none}.devui-splitter-bar-horizontal .devui-collapse.prev{border-radius:0 var(--devui-border-radius-feedback, 4px) var(--devui-border-radius-feedback, 4px) 0;left:100%}.devui-splitter-bar-horizontal .devui-collapse.prev:before,.devui-splitter-bar-horizontal .devui-collapse.prev.collapsed:before{top:9px;left:1px}.devui-splitter-bar-horizontal .devui-collapse.prev:before{transform:rotate(-70deg)}.devui-splitter-bar-horizontal .devui-collapse.prev.collapsed:before{transform:rotate(70deg)}.devui-splitter-bar-horizontal .devui-collapse.prev:after,.devui-splitter-bar-horizontal .devui-collapse.prev.collapsed:after{top:18px;left:1px}.devui-splitter-bar-horizontal .devui-collapse.prev:after{transform:rotate(70deg)}.devui-splitter-bar-horizontal .devui-collapse.prev.collapsed:after{transform:rotate(-70deg)}.devui-splitter-bar-horizontal .devui-collapse.next{border-radius:var(--devui-border-radius-feedback, 4px) 0 0 var(--devui-border-radius-feedback, 4px);right:100%}.devui-splitter-bar-horizontal .devui-collapse.next:before,.devui-splitter-bar-horizontal .devui-collapse.next.collapsed:before{top:9px;right:1px}.devui-splitter-bar-horizontal .devui-collapse.next:before{transform:rotate(70deg)}.devui-splitter-bar-horizontal .devui-collapse.next.collapsed:before{transform:rotate(-70deg)}.devui-splitter-bar-horizontal .devui-collapse.next:after,.devui-splitter-bar-horizontal .devui-collapse.next.collapsed:after{top:18px;right:1px}.devui-splitter-bar-horizontal .devui-collapse.next:after{transform:rotate(-70deg)}.devui-splitter-bar-horizontal .devui-collapse.next.collapsed:after{transform:rotate(70deg)}.devui-splitter-bar-vertical .devui-collapse{height:12px;width:30px}.devui-splitter-bar-vertical .devui-collapse.prev.hidden,.devui-splitter-bar-vertical .devui-collapse.next.hidden{display:none}.devui-splitter-bar-vertical .devui-collapse.prev{border-radius:0 0 var(--devui-border-radius-feedback, 4px) var(--devui-border-radius-feedback, 4px);top:100%}.devui-splitter-bar-vertical .devui-collapse.prev:before,.devui-splitter-bar-vertical .devui-collapse.prev.collapsed:before{bottom:5px;left:5px}.devui-splitter-bar-vertical .devui-collapse.prev:before{transform:rotate(-20deg)}.devui-splitter-bar-vertical .devui-collapse.prev.collapsed:before{transform:rotate(20deg)}.devui-splitter-bar-vertical .devui-collapse.prev:after,.devui-splitter-bar-vertical .devui-collapse.prev.collapsed:after{bottom:5px;left:14px}.devui-splitter-bar-vertical .devui-collapse.prev:after{transform:rotate(20deg)}.devui-splitter-bar-vertical .devui-collapse.prev.collapsed:after{transform:rotate(-20deg)}.devui-splitter-bar-vertical .devui-collapse.next{border-radius:var(--devui-border-radius-feedback, 4px) var(--devui-border-radius-feedback, 4px) 0 0;bottom:100%}.devui-splitter-bar-vertical .devui-collapse.next:before,.devui-splitter-bar-vertical .devui-collapse.next.collapsed:before{top:5px;left:5px}.devui-splitter-bar-vertical .devui-collapse.next:before{transform:rotate(20deg)}.devui-splitter-bar-vertical .devui-collapse.next.collapsed:before{transform:rotate(-20deg);top:5px;left:5px}.devui-splitter-bar-vertical .devui-collapse.next:after,.devui-splitter-bar-vertical .devui-collapse.next.collapsed:after{top:5px;left:14px}.devui-splitter-bar-vertical .devui-collapse.next:after{transform:rotate(-20deg)}.devui-splitter-bar-vertical .devui-collapse.next.collapsed:after{transform:rotate(20deg)}.devui-splitter-bar-horizontal.resizable:not(.none-resizable):hover,.devui-splitter-bar-horizontal.resizable:not(.none-resizable):focus,.devui-splitter-bar-horizontal.resizable:not(.none-resizable):active,.devui-splitter-bar-vertical.resizable:not(.none-resizable):hover,.devui-splitter-bar-vertical.resizable:not(.none-resizable):focus,.devui-splitter-bar-vertical.resizable:not(.none-resizable):active{background-color:var(--devui-brand-hover, #7693f5)}.devui-splitter-bar-horizontal.resizable:not(.none-resizable):after,.devui-splitter-bar-vertical.resizable:not(.none-resizable):after{content:"";display:block;position:absolute;z-index:10}.devui-splitter-bar-horizontal.resizable{cursor:col-resize}.devui-splitter-bar-horizontal.resizable:after{cursor:col-resize;height:100%;width:10px;top:0}.devui-splitter-bar-vertical.resizable{cursor:row-resize}.devui-splitter-bar-vertical.resizable:after{cursor:row-resize;width:100%;height:10px;left:0}.devui-splitter{display:flex;width:100%;height:auto;position:relative;border-radius:var(--devui-border-radius, 2px)}.devui-splitter.devui-splitter-horizontal{flex-direction:row}.devui-splitter.devui-splitter-vertical{flex-direction:column}.devui-splitter-pane{position:relative;flex:1 1 auto;display:block;min-width:0;max-width:100%;min-height:0;max-height:100%}.devui-splitter-pane-fixed{flex-grow:0;flex-shrink:0}.devui-splitter-pane-hidden{flex:0!important;overflow:hidden!important}.devui-splitter-pane-grow{flex-grow:1!important}

package/statistic/index.es.js

@@ -24,11 +24,11 @@ const statisticProps = {
   },
   groupSeparator: {
     type: String,
-    default: ","
+    default: ""
   },
   showGroupSeparator: {
     type: Boolean,
-    default: false
+    default: true
   },
   titleStyle: {
     type: Object
@@ -205,8 +205,8 @@ class Tween {
 var statistic = "";
 var Statistic = defineComponent({
   name: "DStatistic",
-  props: statisticProps,
   inheritAttrs: false,
+  props: statisticProps,
   setup(props, ctx) {
     var _a;
     const innerValue = ref((_a = props.valueFrom) != null ? _a : props.value);
@@ -234,7 +234,7 @@ var Statistic = defineComponent({
       }
     };
     const statisticValue = computed(() => {
-      return analysisValueType(innerValue.value, props.value, props.groupSeparator, props.precision, props.showGroupSeparator, props.animation);
+      return analysisValueType(innerValue.value, props.value, props.groupSeparator, props.precision, props.showGroupSeparator);
     });
     onMounted(() => {
       if (props.animation && props.start) {

package/statistic/index.umd.js

@@ -1 +1 @@
-var q=Object.defineProperty;var B=(a,e,f)=>e in a?q(a,e,{enumerable:!0,configurable:!0,writable:!0,value:f}):a[e]=f;var s=(a,e,f)=>(B(a,typeof e!="symbol"?e+"":e,f),f);(function(a,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(a=typeof globalThis!="undefined"?globalThis:a||self,e(a.index={},a.Vue))})(this,function(a,e){"use strict";const f={title:{type:String,default:""},value:{type:[Number,String]},prefix:{type:String},suffix:{type:String},precision:{type:Number},groupSeparator:{type:String,default:","},showGroupSeparator:{type:Boolean,default:!1},titleStyle:{type:Object},contentStyle:{type:Object},animationDuration:{type:Number,default:2e3},valueFrom:{type:Number},animation:{type:Boolean,default:!1},start:{type:Boolean,default:!1},extra:{type:String,default:""},easing:{type:String,default:"easeOutCubic"},delay:{type:Number,default:0}},g=(t,i,n)=>t.replace(/\d+/,function(u){return u.replace(/(\d)(?=(\d{3})+$)/g,function(h){return h+`${n?i:""}`})}),w=t=>{if(!isNaN(t))return(t+"").indexOf(".")!==-1},C=(t,i,n,r,u)=>{const h=i.toString().indexOf(".")!==-1?i.toString().length-i.toString().indexOf(".")-1:0;return typeof t=="number"?w(t)?g(r?t.toFixed(r).toString():t.toFixed(h).toString(),n,u):g(r?t.toFixed(r).toString():t.toString(),n,u):t},c=Math.pow,v=Math.sqrt,D=function(t){return 1-c(1-t,3)},E=t=>t,V=function(t){return t===1?1:1-c(2,-10*t)},A=function(t){return t===0?0:t===1?1:t<.5?c(2,20*t-10)/2:(2-c(2,-20*t+10))/2},I=function(t){return t===0?0:c(2,10*t-10)},M=function(t){return t<.5?(1-v(1-c(2*t,2)))/2:(v(1-c(-2*t+2,2))+1)/2};var _=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",easeOutCubic:D,linear:E,easeOutExpo:V,easeInOutExpo:A,easeInExpo:I,easeInOutCirc:M});class j{constructor(i){s(this,"from");s(this,"to");s(this,"duration");s(this,"delay");s(this,"easing");s(this,"onStart");s(this,"onUpdate");s(this,"onFinish");s(this,"startTime");s(this,"started");s(this,"finished");s(this,"timer");s(this,"time");s(this,"elapsed");s(this,"keys");const{from:n,to:r,duration:u,delay:h,easing:S,onStart:l,onUpdate:d,onFinish:m}=i;for(const o in n)r[o]===void 0&&(r[o]=n[o]);for(const o in r)n[o]===void 0&&(n[o]=r[o]);this.from=n,this.to=r,this.duration=u,this.delay=h,this.easing=S,this.onStart=l,this.onUpdate=d,this.onFinish=m,this.startTime=Date.now()+this.delay,this.started=!1,this.finished=!1,this.timer=null,this.keys={}}update(){if(this.time=Date.now(),!(this.time<this.startTime)&&!this.finished){if(this.elapsed===this.duration){this.finished||(this.finished=!0,this.onFinish&&this.onFinish(this.keys));return}this.elapsed=this.time-this.startTime,this.elapsed=this.elapsed>this.duration?this.duration:this.elapsed;for(const i in this.to)this.keys[i]=this.from[i]+(this.to[i]-this.from[i])*_[this.easing](this.elapsed/this.duration);this.started||(this.onStart&&this.onStart(this.keys),this.started=!0),this.onUpdate(this.keys)}}start(){this.startTime=Date.now()+this.delay;const i=()=>{this.update(),this.timer=requestAnimationFrame(i),this.finished&&(cancelAnimationFrame(this.timer),this.timer=null)};i()}stop(){cancelAnimationFrame(this.timer),this.timer=null}}var $="",y=e.defineComponent({name:"DStatistic",props:f,inheritAttrs:!1,setup(t,i){var S;const n=e.ref((S=t.valueFrom)!=null?S:t.value),r=e.ref(null),u=(l=(m=>(m=t.valueFrom)!=null?m:0)(),d=typeof t.value=="number"?t.value:Number(t.value))=>{l!==d&&(r.value=new j({from:{value:l},to:{value:d},delay:t.delay,duration:t.animationDuration,easing:t.easing,onUpdate:o=>{n.value=o.value},onFinish:()=>{n.value=d}}),r.value.start())},h=e.computed(()=>C(n.value,t.value,t.groupSeparator,t.precision,t.showGroupSeparator,t.animation));return e.onMounted(()=>{t.animation&&t.start&&u()}),e.watch(()=>t.start,l=>{l&&!r.value&&u()}),()=>{var l,d,m,o,x,F,O,b,N,p,T,k;return e.createVNode("div",e.mergeProps({class:"devui-statistic"},i.attrs),[e.createVNode("div",{class:"devui-statistic-title",style:t.titleStyle},[((d=(l=i.slots).title)==null?void 0:d.call(l))||t.title]),e.createVNode("div",{class:"devui-statistic-content",style:t.contentStyle},[t.prefix||((o=(m=i.slots).prefix)==null?void 0:o.call(m))?e.createVNode("span",{class:"devui-statistic-prefix"},[((F=(x=i.slots).prefix)==null?void 0:F.call(x))||t.prefix]):null,e.createVNode("span",{class:"devui-statistic--value"},[h.value]),t.suffix||((b=(O=i.slots).suffix)==null?void 0:b.call(O))?e.createVNode("span",{class:"devui-statistic-suffix"},[((p=(N=i.slots).suffix)==null?void 0:p.call(N))||t.suffix]):null]),((k=(T=i.slots).extra)==null?void 0:k.call(T))||t.extra])}}});y.install=function(t){t.component(y.name,y)};var U={title:"Statistic \u7EDF\u8BA1\u6570\u503C",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(t){t.use(y)}};a.Statistic=y,a.default=U,Object.defineProperty(a,"__esModule",{value:!0}),a[Symbol.toStringTag]="Module"});
+var q=Object.defineProperty;var B=(a,e,f)=>e in a?q(a,e,{enumerable:!0,configurable:!0,writable:!0,value:f}):a[e]=f;var s=(a,e,f)=>(B(a,typeof e!="symbol"?e+"":e,f),f);(function(a,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(a=typeof globalThis!="undefined"?globalThis:a||self,e(a.index={},a.Vue))})(this,function(a,e){"use strict";const f={title:{type:String,default:""},value:{type:[Number,String]},prefix:{type:String},suffix:{type:String},precision:{type:Number},groupSeparator:{type:String,default:""},showGroupSeparator:{type:Boolean,default:!0},titleStyle:{type:Object},contentStyle:{type:Object},animationDuration:{type:Number,default:2e3},valueFrom:{type:Number},animation:{type:Boolean,default:!1},start:{type:Boolean,default:!1},extra:{type:String,default:""},easing:{type:String,default:"easeOutCubic"},delay:{type:Number,default:0}},g=(t,i,n)=>t.replace(/\d+/,function(u){return u.replace(/(\d)(?=(\d{3})+$)/g,function(h){return h+`${n?i:""}`})}),w=t=>{if(!isNaN(t))return(t+"").indexOf(".")!==-1},C=(t,i,n,r,u)=>{const h=i.toString().indexOf(".")!==-1?i.toString().length-i.toString().indexOf(".")-1:0;return typeof t=="number"?w(t)?g(r?t.toFixed(r).toString():t.toFixed(h).toString(),n,u):g(r?t.toFixed(r).toString():t.toString(),n,u):t},c=Math.pow,v=Math.sqrt,D=function(t){return 1-c(1-t,3)},E=t=>t,V=function(t){return t===1?1:1-c(2,-10*t)},A=function(t){return t===0?0:t===1?1:t<.5?c(2,20*t-10)/2:(2-c(2,-20*t+10))/2},I=function(t){return t===0?0:c(2,10*t-10)},M=function(t){return t<.5?(1-v(1-c(2*t,2)))/2:(v(1-c(-2*t+2,2))+1)/2};var _=Object.freeze({__proto__:null,[Symbol.toStringTag]:"Module",easeOutCubic:D,linear:E,easeOutExpo:V,easeInOutExpo:A,easeInExpo:I,easeInOutCirc:M});class j{constructor(i){s(this,"from");s(this,"to");s(this,"duration");s(this,"delay");s(this,"easing");s(this,"onStart");s(this,"onUpdate");s(this,"onFinish");s(this,"startTime");s(this,"started");s(this,"finished");s(this,"timer");s(this,"time");s(this,"elapsed");s(this,"keys");const{from:n,to:r,duration:u,delay:h,easing:S,onStart:l,onUpdate:d,onFinish:m}=i;for(const o in n)r[o]===void 0&&(r[o]=n[o]);for(const o in r)n[o]===void 0&&(n[o]=r[o]);this.from=n,this.to=r,this.duration=u,this.delay=h,this.easing=S,this.onStart=l,this.onUpdate=d,this.onFinish=m,this.startTime=Date.now()+this.delay,this.started=!1,this.finished=!1,this.timer=null,this.keys={}}update(){if(this.time=Date.now(),!(this.time<this.startTime)&&!this.finished){if(this.elapsed===this.duration){this.finished||(this.finished=!0,this.onFinish&&this.onFinish(this.keys));return}this.elapsed=this.time-this.startTime,this.elapsed=this.elapsed>this.duration?this.duration:this.elapsed;for(const i in this.to)this.keys[i]=this.from[i]+(this.to[i]-this.from[i])*_[this.easing](this.elapsed/this.duration);this.started||(this.onStart&&this.onStart(this.keys),this.started=!0),this.onUpdate(this.keys)}}start(){this.startTime=Date.now()+this.delay;const i=()=>{this.update(),this.timer=requestAnimationFrame(i),this.finished&&(cancelAnimationFrame(this.timer),this.timer=null)};i()}stop(){cancelAnimationFrame(this.timer),this.timer=null}}var $="",y=e.defineComponent({name:"DStatistic",inheritAttrs:!1,props:f,setup(t,i){var S;const n=e.ref((S=t.valueFrom)!=null?S:t.value),r=e.ref(null),u=(l=(m=>(m=t.valueFrom)!=null?m:0)(),d=typeof t.value=="number"?t.value:Number(t.value))=>{l!==d&&(r.value=new j({from:{value:l},to:{value:d},delay:t.delay,duration:t.animationDuration,easing:t.easing,onUpdate:o=>{n.value=o.value},onFinish:()=>{n.value=d}}),r.value.start())},h=e.computed(()=>C(n.value,t.value,t.groupSeparator,t.precision,t.showGroupSeparator));return e.onMounted(()=>{t.animation&&t.start&&u()}),e.watch(()=>t.start,l=>{l&&!r.value&&u()}),()=>{var l,d,m,o,x,F,O,b,p,N,T,k;return e.createVNode("div",e.mergeProps({class:"devui-statistic"},i.attrs),[e.createVNode("div",{class:"devui-statistic-title",style:t.titleStyle},[((d=(l=i.slots).title)==null?void 0:d.call(l))||t.title]),e.createVNode("div",{class:"devui-statistic-content",style:t.contentStyle},[t.prefix||((o=(m=i.slots).prefix)==null?void 0:o.call(m))?e.createVNode("span",{class:"devui-statistic-prefix"},[((F=(x=i.slots).prefix)==null?void 0:F.call(x))||t.prefix]):null,e.createVNode("span",{class:"devui-statistic--value"},[h.value]),t.suffix||((b=(O=i.slots).suffix)==null?void 0:b.call(O))?e.createVNode("span",{class:"devui-statistic-suffix"},[((N=(p=i.slots).suffix)==null?void 0:N.call(p))||t.suffix]):null]),((k=(T=i.slots).extra)==null?void 0:k.call(T))||t.extra])}}});y.install=function(t){t.component(y.name,y)};var U={title:"Statistic \u7EDF\u8BA1\u6570\u503C",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(t){t.use(y)}};a.Statistic=y,a.default=U,Object.defineProperty(a,"__esModule",{value:!0}),a[Symbol.toStringTag]="Module"});

package/statistic/style.css

@@ -1 +1 @@
-.devui-statistic{box-sizing:border-box;margin:0;padding:0;font-size:14px;font-variant:tabular-nums;line-height:1.5715;list-style:none}.devui-statistic-title{margin-bottom:4px;opacity:.7;font-size:14px}.devui-statistic-content{font-size:24px;display:flex;align-items:center;vertical-align:center}.devui-statistic-prefix{margin-right:6px}.devui-statistic-suffix{margin-left:6px}.devui-statistic--value{display:inline-block}
+.devui-statistic{box-sizing:border-box;margin:0;padding:0;font-size:14px;line-height:1.5715;list-style:none}.devui-statistic-title{margin-bottom:4px;opacity:.7;font-size:14px}.devui-statistic-content{font-size:24px;display:flex;align-items:center}.devui-statistic-prefix{margin-right:6px;display:flex;align-items:center}.devui-statistic-suffix{margin-left:6px;display:flex;align-items:center}.devui-statistic--value{display:inline-block}