vue-devui 1.0.0-beta.4 → 1.0.0-beta.8

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, onMounted, watch, computed, withDirectives, createVNode, provide, resolveComponent, onUpdated } from "vue";
+import { defineComponent, inject, reactive, ref, watch, computed, onMounted, withDirectives, createVNode, provide, resolveComponent, onUpdated } from "vue";
 const splitterProps = {
   orientation: {
     type: String,
@@ -141,28 +141,26 @@ var DSplitterBar = defineComponent({
       wrapperClass: `devui-splitter-bar devui-splitter-bar-${props.orientation}`
     });
     const domRef = ref();
-    onMounted(() => {
-      watch([() => props.splitBarSize, domRef], ([curSplitBarSize, ele]) => {
-        if (!(ele instanceof HTMLElement)) {
-          return;
-        }
+    watch([() => props.splitBarSize, domRef], ([curSplitBarSize, ele]) => {
+      if (!(ele instanceof HTMLElement)) {
+        return;
+      }
+      setStyle(ele, {
+        flexBasis: curSplitBarSize
+      });
+    }, {
+      immediate: true
+    });
+    watch([() => store.state.panes, domRef], ([panes, ele]) => {
+      if (!store.isStaticBar(props.index)) {
+        state.wrapperClass += " resizable";
+      } else {
         setStyle(ele, {
-          flexBasis: curSplitBarSize
+          flexBasis: props.disabledBarSize
         });
-      }, {
-        immediate: true
-      });
-      watch([() => store.state.panes, domRef], ([panes, ele]) => {
-        if (!store.isStaticBar(props.index)) {
-          state.wrapperClass += " resizable";
-        } else {
-          setStyle(ele, {
-            flexBasis: props.disabledBarSize
-          });
-        }
-      }, {
-        deep: true
-      });
+      }
+    }, {
+      deep: true
     });
     const coordinate = {
       pageX: 0,
@@ -522,8 +520,7 @@ var SplitterPane = defineComponent({
         order
       });
     });
-    const setSizeStyle = (curSize) => {
-      const ele = domRef.value;
+    const setSizeStyle = (curSize, ele) => {
       if (!ele) {
         return;
       }
@@ -535,7 +532,9 @@ var SplitterPane = defineComponent({
         removeClass(ele, paneFixedClass);
       }
     };
-    watch(() => props.size, setSizeStyle, {
+    watch([() => props.size, domRef], ([size, ele]) => {
+      setSizeStyle(size, ele);
+    }, {
       immediate: true
     });
     const orientation = inject("orientation");
@@ -619,7 +618,7 @@ Splitter.install = function(app) {
 var index = {
   title: "Splitter \u5206\u5272\u5668",
   category: "\u5E03\u5C40",
-  status: "\u5DF2\u5B8C\u6210",
+  status: "100%",
   install(app) {
     app.use(Splitter);
   }

package/splitter/index.umd.js

@@ -1 +1 @@
-var _=Object.defineProperty;var K=(g,o,C)=>o in g?_(g,o,{enumerable:!0,configurable:!0,writable:!0,value:C}):g[o]=C;var k=(g,o,C)=>(K(g,typeof o!="symbol"?o+"":o,C),C);(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 C={orientation:{type:String,default:"horizontal"},splitBarSize:{type:String,default:"2px"},disabledBarSize:{type:String,default:"1px"},showCollapseButton:{type:Boolean,default:!0}};function y(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 N(t,e){return t.classList?t.classList.contains(e):` ${t.className} `.indexOf(` ${e} `)>-1}function B(t,e){t.classList?t.classList.add(e):N(t,e)||(t.className=`${t.className} ${e}`)}function b(t,e){if(t.classList)t.classList.remove(e);else if(N(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",D)}};function H(t){R(t,"mousedown",D)}function R(t,e,i){t.addEventListener&&t.addEventListener(e,i)}function $(t,e,i){t.removeEventListener&&t.removeEventListener(e,i)}function D(t){var n;const e=(n=t==null?void 0:t.target)==null?void 0:n.$value;if(!e)return;R(document,"mousemove",i),R(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 U="";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.onMounted(()=>{o.watch([()=>t.splitBarSize,s],([a,c])=>{c instanceof HTMLElement&&y(c,{flexBasis:a})},{immediate:!0}),o.watch([()=>e.state.panes,s],([a,c])=>{e.isStaticBar(t.index)?y(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)}},u=(a,c)=>{const S=e.getPane(a),h=e.getPane(c);return{pane:S,nearPane:h}},f=(a,c,S)=>{var w,M,V,j;const h=((M=(w=a==null?void 0:a.component)==null?void 0:w.props)==null?void 0:M.collapsible)&&S,P=(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:P,hidden:Y}},z=o.computed(()=>{var h,P;const{pane:a,nearPane:c}=u(t.index,t.index+1),S=((P=(h=a==null?void 0:a.component)==null?void 0:h.props)==null?void 0:P.collapseDirection)!=="after"||t.index===0;return f(a,c,S)}),x=o.computed(()=>{var h,P;const{pane:a,nearPane:c}=u(t.index+1,t.index),S=((P=(h=a==null?void 0:a.component)==null?void 0:h.props)==null?void 0:P.collapseDirection)!=="before"||t.index+1===e.state.paneCount-1;return f(a,c,S)}),l=()=>{var h,P,Y,w;const{pane:a,nearPane:c}=u(t.index,t.index+1);((P=(h=a==null?void 0:a.component)==null?void 0:h.props)==null?void 0:P.collapsed)||((w=(Y=c==null?void 0:c.component)==null?void 0:Y.props)==null?void 0:w.collapsed)?B(s.value,"none-resizable"):b(s.value,"none-resizable")},r=a=>{e.tooglePane(t.index,t.index+1,a),l()},m=a=>{e.tooglePane(t.index+1,t.index,a),l()},X=()=>{r(!0),m(!0)};return o.onMounted(()=>{X()}),()=>o.withDirectives(o.createVNode("div",{class:i.wrapperClass,ref:s},[t.showCollapseButton?o.createVNode("div",{class:["prev",z.value],onClick:()=>{r()}},null):null,o.createVNode("div",{class:"devui-resize-handle"},null),t.showCollapseButton?o.createVNode("div",{class:["next",x.value],onClick:()=>m()},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,u,f,z,x,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)||((f=(u=s==null?void 0:s.component)==null?void 0:u.props)==null?void 0:f.collapsed);return((x=(z=i==null?void 0:i.component)==null?void 0:z.props)==null?void 0:x.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,u;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)&&((u=(d=s==null?void 0:s.component)==null?void 0:d.props)==null?void 0:u.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,u,f,z,x,l,r,m,X,a,c,S,h;const n=this.getPane(e),p=this.getPane(i);((u=(d=n==null?void 0:n.component)==null?void 0:d.props)==null?void 0:u.collapsible)&&(n.component.props.collapsed=s?(z=(f=n==null?void 0:n.component)==null?void 0:f.props)==null?void 0:z.collapsed:!((l=(x=n==null?void 0:n.component)==null?void 0:x.props)==null?void 0:l.collapsed),(a=(r=p==null?void 0:p.component)==null?void 0:r.exposed)==null||a.toggleNearPaneFlexGrow((X=(m=n==null?void 0:n.component)==null?void 0:m.props)==null?void 0:X.collapsed),(h=n==null?void 0:n.component)==null||h.emit("collapsedChange",(S=(c=n==null?void 0:n.component)==null?void 0:c.props)==null?void 0:S.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="",v=o.defineComponent({name:"DSplitter",components:{DSplitterBar:q},props:C,emits:[],setup(t,e){var p,d;const i=new G,s=o.reactive({panes:[]});s.panes=((d=(p=e.slots).DSplitterPane)==null?void 0:d.call(p))||[],i.setPanes({panes:s.panes}),o.provide("orientation",t.orientation),o.provide("splitterStore",i);const n=o.ref();return o.watch(n,u=>{if(!u)return;let f=0;t.orientation==="vertical"?f=u.clientHeight:f=u.clientWidth,i.setSplitter({containerSize:f})}),()=>{const{splitBarSize:u,orientation:f,showCollapseButton:z}=t,x=["devui-splitter",`devui-splitter-${f}`];return o.createVNode("div",{class:x,ref:n},[s.panes,s.panes.filter((l,r,m)=>r!==m.length-1).map((l,r)=>o.createVNode(o.resolveComponent("d-splitter-bar"),{key:r,style:`order: ${r*2+1}`,splitBarSize:u,orientation:f,index:r,showCollapseButton:z},null))])}}});const W={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="",L=o.defineComponent({name:"DSplitterPane",props:W,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||y(r,{order:l})});const d=l=>{const r=n.value;if(!r)return;r.style.flexBasis=l;const m="devui-splitter-pane-fixed";l?B(r,m):b(r,m)};o.watch(()=>t.size,d,{immediate:!0});const u=o.inject("orientation");let f="";o.onMounted(()=>{f=t.size,s.setPanes({panes:s.state.panes})}),o.onUpdated(()=>{s.setPanes({panes:s.state.panes})});const z=()=>{const l=n.value;if(!!l)return u==="vertical"?l.offsetHeight:l.offsetWidth};return o.watch(()=>t.collapsed,l=>{const r=n.value;if(!r)return;const m="devui-splitter-pane-hidden";l?B(r,m):b(r,m),l&&t.shrink?(b(r,m),y(r,{flexBasis:`${t.shrinkWidth}px`})):y(r,{flexBasis:f})},{immediate:!0}),i({order:p,getPaneSize:z,toggleNearPaneFlexGrow:l=>{const r=n.value;if(!(r instanceof HTMLElement))return;const m="devui-splitter-pane-grow";N(r,m)?b(r,m):l&&B(r,m)}}),()=>{var l;return o.createVNode("div",{class:"devui-splitter-pane",ref:n},[(l=e.default)==null?void 0:l.call(e)])}}});v.install=function(t){t.component(v.name,v),t.component(L.name,L)};var O={title:"Splitter \u5206\u5272\u5668",category:"\u5E03\u5C40",status:"\u5DF2\u5B8C\u6210",install(t){t.use(v)}};g.Splitter=v,g.default=O,Object.defineProperty(g,"__esModule",{value:!0}),g[Symbol.toStringTag]="Module"});
+var _=Object.defineProperty;var K=(g,o,C)=>o in g?_(g,o,{enumerable:!0,configurable:!0,writable:!0,value:C}):g[o]=C;var k=(g,o,C)=>(K(g,typeof o!="symbol"?o+"":o,C),C);(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 C={orientation:{type:String,default:"horizontal"},splitBarSize:{type:String,default:"2px"},disabledBarSize:{type:String,default:"1px"},showCollapseButton:{type:Boolean,default:!0}};function y(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 N(t,e){return t.classList?t.classList.contains(e):` ${t.className} `.indexOf(` ${e} `)>-1}function B(t,e){t.classList?t.classList.add(e):N(t,e)||(t.className=`${t.className} ${e}`)}function b(t,e){if(t.classList)t.classList.remove(e);else if(N(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){R(t,"mousedown",L)}function R(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;R(document,"mousemove",i),R(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 U="";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&&y(c,{flexBasis:a})},{immediate:!0}),o.watch([()=>e.state.panes,s],([a,c])=>{e.isStaticBar(t.index)?y(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)}},u=(a,c)=>{const S=e.getPane(a),h=e.getPane(c);return{pane:S,nearPane:h}},f=(a,c,S)=>{var w,M,V,j;const h=((M=(w=a==null?void 0:a.component)==null?void 0:w.props)==null?void 0:M.collapsible)&&S,P=(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:P,hidden:Y}},z=o.computed(()=>{var h,P;const{pane:a,nearPane:c}=u(t.index,t.index+1),S=((P=(h=a==null?void 0:a.component)==null?void 0:h.props)==null?void 0:P.collapseDirection)!=="after"||t.index===0;return f(a,c,S)}),x=o.computed(()=>{var h,P;const{pane:a,nearPane:c}=u(t.index+1,t.index),S=((P=(h=a==null?void 0:a.component)==null?void 0:h.props)==null?void 0:P.collapseDirection)!=="before"||t.index+1===e.state.paneCount-1;return f(a,c,S)}),l=()=>{var h,P,Y,w;const{pane:a,nearPane:c}=u(t.index,t.index+1);((P=(h=a==null?void 0:a.component)==null?void 0:h.props)==null?void 0:P.collapsed)||((w=(Y=c==null?void 0:c.component)==null?void 0:Y.props)==null?void 0:w.collapsed)?B(s.value,"none-resizable"):b(s.value,"none-resizable")},r=a=>{e.tooglePane(t.index,t.index+1,a),l()},m=a=>{e.tooglePane(t.index+1,t.index,a),l()},X=()=>{r(!0),m(!0)};return o.onMounted(()=>{X()}),()=>o.withDirectives(o.createVNode("div",{class:i.wrapperClass,ref:s},[t.showCollapseButton?o.createVNode("div",{class:["prev",z.value],onClick:()=>{r()}},null):null,o.createVNode("div",{class:"devui-resize-handle"},null),t.showCollapseButton?o.createVNode("div",{class:["next",x.value],onClick:()=>m()},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,u,f,z,x,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)||((f=(u=s==null?void 0:s.component)==null?void 0:u.props)==null?void 0:f.collapsed);return((x=(z=i==null?void 0:i.component)==null?void 0:z.props)==null?void 0:x.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,u;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)&&((u=(d=s==null?void 0:s.component)==null?void 0:d.props)==null?void 0:u.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,u,f,z,x,l,r,m,X,a,c,S,h;const n=this.getPane(e),p=this.getPane(i);((u=(d=n==null?void 0:n.component)==null?void 0:d.props)==null?void 0:u.collapsible)&&(n.component.props.collapsed=s?(z=(f=n==null?void 0:n.component)==null?void 0:f.props)==null?void 0:z.collapsed:!((l=(x=n==null?void 0:n.component)==null?void 0:x.props)==null?void 0:l.collapsed),(a=(r=p==null?void 0:p.component)==null?void 0:r.exposed)==null||a.toggleNearPaneFlexGrow((X=(m=n==null?void 0:n.component)==null?void 0:m.props)==null?void 0:X.collapsed),(h=n==null?void 0:n.component)==null||h.emit("collapsedChange",(S=(c=n==null?void 0:n.component)==null?void 0:c.props)==null?void 0:S.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="",v=o.defineComponent({name:"DSplitter",components:{DSplitterBar:q},props:C,emits:[],setup(t,e){var p,d;const i=new G,s=o.reactive({panes:[]});s.panes=((d=(p=e.slots).DSplitterPane)==null?void 0:d.call(p))||[],i.setPanes({panes:s.panes}),o.provide("orientation",t.orientation),o.provide("splitterStore",i);const n=o.ref();return o.watch(n,u=>{if(!u)return;let f=0;t.orientation==="vertical"?f=u.clientHeight:f=u.clientWidth,i.setSplitter({containerSize:f})}),()=>{const{splitBarSize:u,orientation:f,showCollapseButton:z}=t,x=["devui-splitter",`devui-splitter-${f}`];return o.createVNode("div",{class:x,ref:n},[s.panes,s.panes.filter((l,r,m)=>r!==m.length-1).map((l,r)=>o.createVNode(o.resolveComponent("d-splitter-bar"),{key:r,style:`order: ${r*2+1}`,splitBarSize:u,orientation:f,index:r,showCollapseButton:z},null))])}}});const W={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:W,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||y(r,{order:l})});const d=(l,r)=>{if(!r)return;r.style.flexBasis=l;const m="devui-splitter-pane-fixed";l?B(r,m):b(r,m)};o.watch([()=>t.size,n],([l,r])=>{d(l,r)},{immediate:!0});const u=o.inject("orientation");let f="";o.onMounted(()=>{f=t.size,s.setPanes({panes:s.state.panes})}),o.onUpdated(()=>{s.setPanes({panes:s.state.panes})});const z=()=>{const l=n.value;if(!!l)return u==="vertical"?l.offsetHeight:l.offsetWidth};return o.watch(()=>t.collapsed,l=>{const r=n.value;if(!r)return;const m="devui-splitter-pane-hidden";l?B(r,m):b(r,m),l&&t.shrink?(b(r,m),y(r,{flexBasis:`${t.shrinkWidth}px`})):y(r,{flexBasis:f})},{immediate:!0}),i({order:p,getPaneSize:z,toggleNearPaneFlexGrow:l=>{const r=n.value;if(!(r instanceof HTMLElement))return;const m="devui-splitter-pane-grow";N(r,m)?b(r,m):l&&B(r,m)}}),()=>{var l;return o.createVNode("div",{class:"devui-splitter-pane",ref:n},[(l=e.default)==null?void 0:l.call(e)])}}});v.install=function(t){t.component(v.name,v),t.component(D.name,D)};var O={title:"Splitter \u5206\u5272\u5668",category:"\u5E03\u5C40",status:"100%",install(t){t.use(v)}};g.Splitter=v,g.default=O,Object.defineProperty(g,"__esModule",{value:!0}),g[Symbol.toStringTag]="Module"});

package/status/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/status/index.es.js

@@ -34,7 +34,7 @@ Status.install = function(app) {
 var index = {
   title: "Status \u72B6\u6001",
   category: "\u901A\u7528",
-  status: "\u5DF2\u5B8C\u6210",
+  status: "100%",
   install(app) {
     app.use(Status);
   }

package/status/index.umd.js

@@ -1 +1 @@
-(function(t,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(t=typeof globalThis!="undefined"?globalThis:t||self,e(t.index={},t.Vue))})(this,function(t,e){"use strict";var l="",u=e.defineComponent({name:"DStatus",props:{type:{default:"initial",type:String}},setup(n,o){const r=e.computed(()=>{const{type:s}=n,i=["success","error","initial","warning","waiting","running","invalid"];let a="devui-status devui-status-bg-invalid";return i.includes(s)&&(a=`devui-status devui-status-bg-${s}`),a});return()=>{var s,i;return e.createVNode("span",{class:r.value},[(i=(s=o.slots).default)==null?void 0:i.call(s)])}}});u.install=function(n){n.component(u.name,u)};var d={title:"Status \u72B6\u6001",category:"\u901A\u7528",status:"\u5DF2\u5B8C\u6210",install(n){n.use(u)}};t.Status=u,t.default=d,Object.defineProperty(t,"__esModule",{value:!0}),t[Symbol.toStringTag]="Module"});
+(function(t,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(t=typeof globalThis!="undefined"?globalThis:t||self,e(t.index={},t.Vue))})(this,function(t,e){"use strict";var l="",n=e.defineComponent({name:"DStatus",props:{type:{default:"initial",type:String}},setup(u,o){const r=e.computed(()=>{const{type:s}=u,i=["success","error","initial","warning","waiting","running","invalid"];let a="devui-status devui-status-bg-invalid";return i.includes(s)&&(a=`devui-status devui-status-bg-${s}`),a});return()=>{var s,i;return e.createVNode("span",{class:r.value},[(i=(s=o.slots).default)==null?void 0:i.call(s)])}}});n.install=function(u){u.component(n.name,n)};var d={title:"Status \u72B6\u6001",category:"\u901A\u7528",status:"100%",install(u){u.use(n)}};t.Status=n,t.default=d,Object.defineProperty(t,"__esModule",{value:!0}),t[Symbol.toStringTag]="Module"});

package/steps-guide/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/steps-guide/index.es.js

@@ -1,7 +1,11 @@
-import { computed, ref, reactive, nextTick, defineComponent, onMounted, createVNode, Teleport } from "vue";
+import { ref, reactive, nextTick, computed, defineComponent, onMounted, createVNode, Teleport } from "vue";
 var stepsGuide = "";
 const stepsGuideProps = {
   steps: Array,
+  stepIndex: {
+    type: Number,
+    default: void 0
+  },
   showClose: {
     type: Boolean,
     default: true
@@ -9,22 +13,33 @@ const stepsGuideProps = {
   showDots: {
     type: Boolean,
     default: true
+  },
+  scrollToTargetSwitch: {
+    type: Boolean,
+    default: true
+  },
+  zIndex: {
+    type: Number,
+    default: 1100
+  },
+  stepChange: {
+    type: Function,
+    default() {
+      return true;
+    }
   }
 };
-function useStepsGuideNav(steps, stepIndex) {
-  const currentStep = computed(() => {
-    const _step = steps[stepIndex.value];
-    _step.position = _step.position || "top";
-    return _step;
-  });
+function useStepsGuidePosition(props, currentStep) {
   const guideClassList = ["devui-steps-guide"];
   const stepsRef = ref(null);
   const guidePosition = reactive({
     left: "",
     top: "",
-    zIndex: 1100
+    zIndex: props.zIndex
   });
   const updateGuidePosition = () => {
+    if (!currentStep.value)
+      return;
     const baseTop = window.pageYOffset - document.documentElement.clientTop;
     const baseLeft = window.pageXOffset - document.documentElement.clientLeft;
     const currentStepPosition = currentStep.value.position;
@@ -70,96 +85,97 @@ function useStepsGuideNav(steps, stepIndex) {
     }
     guidePosition.left = _left + "px";
     guidePosition.top = _top + "px";
-    nextTick(() => {
-      stepGuideElement.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
-    });
+    if (props.scrollToTargetSwitch) {
+      nextTick(() => {
+        stepGuideElement.scrollIntoView({ behavior: "smooth", block: "nearest", inline: "nearest" });
+      });
+    }
   };
   return {
-    currentStep,
     stepsRef,
     guidePosition,
     guideClassList,
     updateGuidePosition
   };
 }
-function useStepsGuideCtrl(stepsCount, stepIndex, updateGuidePosition) {
-  const showSteps = ref(true);
-  const closeSteps = () => {
-    showSteps.value = false;
+function useStepsGuideCtrl(props, ctx, updateGuidePosition, stepIndex) {
+  const stepsCount = computed(() => props.steps.length);
+  const closeGuide = () => {
+    const _index = stepIndex.value;
+    stepIndex.value = -1;
+    nextTick(() => {
+      ctx.emit("guide-close", _index);
+    });
   };
   const setCurrentIndex = (index2) => {
-    if (index2 > stepsCount.value || index2 < 0)
-      index2 = 0;
-    stepIndex.value = index2;
-    if (!showSteps.value) {
-      showSteps.value = true;
-      nextTick(() => {
-        updateGuidePosition();
-      });
-    } else {
-      updateGuidePosition();
+    if (index2 !== -1 && props.stepChange()) {
+      if (index2 > -1 && index2 < stepsCount.value) {
+        stepIndex.value = index2;
+        console.log(stepIndex.value, index2, stepsCount.value);
+        nextTick(() => {
+          console.log(stepIndex.value, index2, stepsCount.value);
+          updateGuidePosition();
+        });
+      } else {
+        console.error(`stepIndex is not within the value range`);
+      }
     }
+    if (index2 === -1)
+      closeGuide();
   };
   return {
-    showSteps,
-    closeSteps,
+    stepsCount,
+    closeGuide,
     setCurrentIndex
   };
 }
 var StepsGuide = defineComponent({
   name: "DStepsGuide",
   props: stepsGuideProps,
-  emits: [],
+  emits: ["guide-close", "update:stepIndex"],
   setup(props, ctx) {
-    const stepsCount = computed(() => props.steps.length - 1);
-    const stepIndex = ref(0);
+    var _a;
+    const stepIndexData = ref((_a = props.stepIndex) != null ? _a : 0);
+    const stepIndex = computed({
+      set: (val) => {
+        if (props.stepIndex != null) {
+          ctx.emit("update:stepIndex", val);
+        }
+        stepIndexData.value = val;
+      },
+      get: () => stepIndexData.value
+    });
+    const currentStep = computed(() => {
+      const _step = props.steps[stepIndex.value];
+      if (_step)
+        _step.position = _step.position || "top";
+      return _step;
+    });
     const {
-      currentStep,
       stepsRef,
       guidePosition,
       guideClassList,
       updateGuidePosition
-    } = useStepsGuideNav(props.steps, stepIndex);
+    } = useStepsGuidePosition(props, currentStep);
     const {
-      showSteps,
-      closeSteps,
+      stepsCount,
+      closeGuide,
       setCurrentIndex
-    } = useStepsGuideCtrl(stepsCount, stepIndex, updateGuidePosition);
+    } = useStepsGuideCtrl(props, ctx, updateGuidePosition, stepIndex);
     onMounted(() => {
       updateGuidePosition();
     });
-    return {
-      stepsCount,
-      stepIndex,
-      showSteps,
-      guidePosition,
-      guideClassList,
-      stepsRef,
-      currentStep,
-      setCurrentIndex,
-      closeSteps
-    };
-  },
-  render(props) {
-    const {
-      showSteps,
-      guidePosition,
-      guideClassList,
-      currentStep,
-      stepIndex,
-      stepsCount,
-      setCurrentIndex,
-      closeSteps,
-      showClose,
-      showDots
-    } = props;
-    return showSteps ? createVNode(Teleport, {
+    ctx.expose({
+      closeGuide,
+      setCurrentIndex
+    });
+    return () => stepIndex.value > -1 && stepsCount.value > 0 ? createVNode(Teleport, {
       "to": "body"
     }, {
       default: () => [createVNode("div", {
         "style": guidePosition,
         "class": guideClassList,
-        "ref": "stepsRef"
+        "ref": stepsRef
       }, [createVNode("div", {
         "class": "devui-shining-dot"
       }, null), createVNode("div", {
@@ -170,45 +186,52 @@ var StepsGuide = defineComponent({
         "class": "devui-guide-container"
       }, [createVNode("p", {
         "class": "devui-title"
-      }, [currentStep.title]), showClose ? createVNode("div", {
+      }, [currentStep.value.title]), props.showClose ? createVNode("div", {
         "class": "icon icon-close",
-        "onClick": closeSteps
+        "onClick": closeGuide
       }, null) : null, createVNode("div", {
         "class": "devui-content"
-      }, [currentStep.content]), createVNode("div", {
+      }, [currentStep.value.content]), createVNode("div", {
         "class": "devui-ctrl"
-      }, [showDots ? createVNode("div", {
+      }, [props.showDots ? createVNode("div", {
         "class": "devui-dots"
       }, [props.steps.map((step, index2) => {
         return createVNode("em", {
-          "class": ["icon icon-dot-status", currentStep === step ? "devui-active" : ""],
+          "class": ["icon icon-dot-status", currentStep.value === step ? "devui-active" : ""],
           "key": index2
         }, null);
       })]) : null, createVNode("div", {
         "class": "devui-guide-btn"
-      }, [stepIndex > 0 ? createVNode("div", {
+      }, [stepIndex.value > 0 ? createVNode("div", {
         "class": "devui-prev-step",
-        "onClick": () => setCurrentIndex(--props.stepIndex)
-      }, ["\u4E0A\u4E00\u6B65"]) : null, stepIndex === stepsCount ? createVNode("div", {
-        "onClick": closeSteps
+        "onClick": () => setCurrentIndex(stepIndex.value - 1)
+      }, ["\u4E0A\u4E00\u6B65"]) : null, stepIndex.value === stepsCount.value - 1 ? createVNode("div", {
+        "onClick": closeGuide
       }, ["\u6211\u77E5\u9053\u5566"]) : createVNode("div", {
         "class": "devui-next-step",
         "onClick": () => {
-          setCurrentIndex(++props.stepIndex);
+          setCurrentIndex(stepIndex.value + 1);
         }
       }, ["\u6211\u77E5\u9053\u5566,\u7EE7\u7EED"])])])])])]
     }) : null;
   }
 });
+var StepsGuideDirective = {
+  mounted(el, binding, vNode) {
+  },
+  updated(el, binding) {
+  }
+};
 StepsGuide.install = function(app) {
   app.component(StepsGuide.name, StepsGuide);
 };
 var index = {
   title: "StepsGuide \u64CD\u4F5C\u6307\u5F15",
   category: "\u5BFC\u822A",
-  status: "50%",
+  status: "80%",
   install(app) {
     app.use(StepsGuide);
+    app.directive("StepsGuide", StepsGuideDirective);
   }
 };
 export { StepsGuide, index as default };

package/steps-guide/index.umd.js

@@ -1 +1 @@
-(function(d,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(d=typeof globalThis!="undefined"?globalThis:d||self,e(d.index={},d.Vue))})(this,function(d,e){"use strict";var y="";const V={steps:Array,showClose:{type:Boolean,default:!0},showDots:{type:Boolean,default:!0}};function N(t,h){const o=e.computed(()=>{const l=t[h.value];return l.position=l.position||"top",l}),i=["devui-steps-guide"],r=e.ref(null),u=e.reactive({left:"",top:"",zIndex:1100});return{currentStep:o,stepsRef:r,guidePosition:u,guideClassList:i,updateGuidePosition:()=>{const l=window.pageYOffset-document.documentElement.clientTop,g=window.pageXOffset-document.documentElement.clientLeft,f=o.value.position,s=r.value;let c,p;if(typeof f!="string"){const{top:C=0,left:n=0,type:v="top"}=f;i.splice(1,1,v),c=n,p=C}else{i.splice(1,1,f);const C=o.value.target||o.value.trigger,n=document.querySelector(C),v=n.getBoundingClientRect();c=v.left+n.clientWidth/2-s.clientWidth/2+g,p=v.top+n.clientHeight/2-s.clientHeight/2+l;const S=f.split("-");switch(S[0]){case"top":p+=-s.clientHeight/2-n.clientHeight;break;case"bottom":p+=s.clientHeight/2+n.clientHeight;break;case"left":p+=s.clientHeight/2-n.clientHeight,c+=-s.clientWidth/2-n.clientWidth/2;break;case"right":p+=s.clientHeight/2-n.clientHeight,c+=s.clientWidth/2+n.clientWidth/2;break}switch(S[1]){case"left":c+=s.clientWidth/2-n.clientWidth/2;break;case"right":c+=-s.clientWidth/2+n.clientWidth/2;break}}u.left=c+"px",u.top=p+"px",e.nextTick(()=>{s.scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"})})}}}function b(t,h,o){const i=e.ref(!0);return{showSteps:i,closeSteps:()=>{i.value=!1},setCurrentIndex:a=>{(a>t.value||a<0)&&(a=0),h.value=a,i.value?o():(i.value=!0,e.nextTick(()=>{o()}))}}}var m=e.defineComponent({name:"DStepsGuide",props:V,emits:[],setup(t,h){const o=e.computed(()=>t.steps.length-1),i=e.ref(0),{currentStep:r,stepsRef:u,guidePosition:a,guideClassList:l,updateGuidePosition:g}=N(t.steps,i),{showSteps:f,closeSteps:s,setCurrentIndex:c}=b(o,i,g);return e.onMounted(()=>{g()}),{stepsCount:o,stepIndex:i,showSteps:f,guidePosition:a,guideClassList:l,stepsRef:u,currentStep:r,setCurrentIndex:c,closeSteps:s}},render(t){const{showSteps:h,guidePosition:o,guideClassList:i,currentStep:r,stepIndex:u,stepsCount:a,setCurrentIndex:l,closeSteps:g,showClose:f,showDots:s}=t;return h?e.createVNode(e.Teleport,{to:"body"},{default:()=>[e.createVNode("div",{style:o,class:i,ref:"stepsRef"},[e.createVNode("div",{class:"devui-shining-dot"},null),e.createVNode("div",{class:"devui-shining-plus"},null),e.createVNode("div",{class:"devui-arrow"},null),e.createVNode("div",{class:"devui-guide-container"},[e.createVNode("p",{class:"devui-title"},[r.title]),f?e.createVNode("div",{class:"icon icon-close",onClick:g},null):null,e.createVNode("div",{class:"devui-content"},[r.content]),e.createVNode("div",{class:"devui-ctrl"},[s?e.createVNode("div",{class:"devui-dots"},[t.steps.map((c,p)=>e.createVNode("em",{class:["icon icon-dot-status",r===c?"devui-active":""],key:p},null))]):null,e.createVNode("div",{class:"devui-guide-btn"},[u>0?e.createVNode("div",{class:"devui-prev-step",onClick:()=>l(--t.stepIndex)},["\u4E0A\u4E00\u6B65"]):null,u===a?e.createVNode("div",{onClick:g},["\u6211\u77E5\u9053\u5566"]):e.createVNode("div",{class:"devui-next-step",onClick:()=>{l(++t.stepIndex)}},["\u6211\u77E5\u9053\u5566,\u7EE7\u7EED"])])])])])]}):null}});m.install=function(t){t.component(m.name,m)};var w={title:"StepsGuide \u64CD\u4F5C\u6307\u5F15",category:"\u5BFC\u822A",status:"50%",install(t){t.use(m)}};d.StepsGuide=m,d.default=w,Object.defineProperty(d,"__esModule",{value:!0}),d[Symbol.toStringTag]="Module"});
+(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";var k="";const b={steps:Array,stepIndex:{type:Number,default:void 0},showClose:{type:Boolean,default:!0},showDots:{type:Boolean,default:!0},scrollToTargetSwitch:{type:Boolean,default:!0},zIndex:{type:Number,default:1100},stepChange:{type:Function,default(){return!0}}};function y(i,c){const r=["devui-steps-guide"],n=e.ref(null),o=e.reactive({left:"",top:"",zIndex:i.zIndex});return{stepsRef:n,guidePosition:o,guideClassList:r,updateGuidePosition:()=>{if(!c.value)return;const m=window.pageYOffset-document.documentElement.clientTop,l=window.pageXOffset-document.documentElement.clientLeft,p=c.value.position,s=n.value;let d,u;if(typeof p!="string"){const{top:f=0,left:t=0,type:g="top"}=p;r.splice(1,1,g),d=t,u=f}else{r.splice(1,1,p);const f=c.value.target||c.value.trigger,t=document.querySelector(f),g=t.getBoundingClientRect();d=g.left+t.clientWidth/2-s.clientWidth/2+l,u=g.top+t.clientHeight/2-s.clientHeight/2+m;const C=p.split("-");switch(C[0]){case"top":u+=-s.clientHeight/2-t.clientHeight;break;case"bottom":u+=s.clientHeight/2+t.clientHeight;break;case"left":u+=s.clientHeight/2-t.clientHeight,d+=-s.clientWidth/2-t.clientWidth/2;break;case"right":u+=s.clientHeight/2-t.clientHeight,d+=s.clientWidth/2+t.clientWidth/2;break}switch(C[1]){case"left":d+=s.clientWidth/2-t.clientWidth/2;break;case"right":d+=-s.clientWidth/2+t.clientWidth/2;break}}o.left=d+"px",o.top=u+"px",i.scrollToTargetSwitch&&e.nextTick(()=>{s.scrollIntoView({behavior:"smooth",block:"nearest",inline:"nearest"})})}}}function N(i,c,r,n){const o=e.computed(()=>i.steps.length),v=()=>{const l=n.value;n.value=-1,e.nextTick(()=>{c.emit("guide-close",l)})};return{stepsCount:o,closeGuide:v,setCurrentIndex:l=>{l!==-1&&i.stepChange()&&(l>-1&&l<o.value?(n.value=l,console.log(n.value,l,o.value),e.nextTick(()=>{console.log(n.value,l,o.value),r()})):console.error("stepIndex is not within the value range")),l===-1&&v()}}}var h=e.defineComponent({name:"DStepsGuide",props:b,emits:["guide-close","update:stepIndex"],setup(i,c){var f;const r=e.ref((f=i.stepIndex)!=null?f:0),n=e.computed({set:t=>{i.stepIndex!=null&&c.emit("update:stepIndex",t),r.value=t},get:()=>r.value}),o=e.computed(()=>{const t=i.steps[n.value];return t&&(t.position=t.position||"top"),t}),{stepsRef:v,guidePosition:m,guideClassList:l,updateGuidePosition:p}=y(i,o),{stepsCount:s,closeGuide:d,setCurrentIndex:u}=N(i,c,p,n);return e.onMounted(()=>{p()}),c.expose({closeGuide:d,setCurrentIndex:u}),()=>n.value>-1&&s.value>0?e.createVNode(e.Teleport,{to:"body"},{default:()=>[e.createVNode("div",{style:m,class:l,ref:v},[e.createVNode("div",{class:"devui-shining-dot"},null),e.createVNode("div",{class:"devui-shining-plus"},null),e.createVNode("div",{class:"devui-arrow"},null),e.createVNode("div",{class:"devui-guide-container"},[e.createVNode("p",{class:"devui-title"},[o.value.title]),i.showClose?e.createVNode("div",{class:"icon icon-close",onClick:d},null):null,e.createVNode("div",{class:"devui-content"},[o.value.content]),e.createVNode("div",{class:"devui-ctrl"},[i.showDots?e.createVNode("div",{class:"devui-dots"},[i.steps.map((t,g)=>e.createVNode("em",{class:["icon icon-dot-status",o.value===t?"devui-active":""],key:g},null))]):null,e.createVNode("div",{class:"devui-guide-btn"},[n.value>0?e.createVNode("div",{class:"devui-prev-step",onClick:()=>u(n.value-1)},["\u4E0A\u4E00\u6B65"]):null,n.value===s.value-1?e.createVNode("div",{onClick:d},["\u6211\u77E5\u9053\u5566"]):e.createVNode("div",{class:"devui-next-step",onClick:()=>{u(n.value+1)}},["\u6211\u77E5\u9053\u5566,\u7EE7\u7EED"])])])])])]}):null}}),V={mounted(i,c,r){},updated(i,c){}};h.install=function(i){i.component(h.name,h)};var G={title:"StepsGuide \u64CD\u4F5C\u6307\u5F15",category:"\u5BFC\u822A",status:"80%",install(i){i.use(h),i.directive("StepsGuide",V)}};a.StepsGuide=h,a.default=G,Object.defineProperty(a,"__esModule",{value:!0}),a[Symbol.toStringTag]="Module"});

package/sticky/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;