vue-devui 1.0.0-rc.0 → 1.0.0-rc.3

package/grid/index.es.js

@@ -33,15 +33,6 @@ const rowProps = {
     default: false
   }
 };
-const screenSizesProp = [Number, Object];
-const screenSizes = {
-  xs: screenSizesProp,
-  sm: screenSizesProp,
-  md: screenSizesProp,
-  lg: screenSizesProp,
-  xl: screenSizesProp,
-  xxl: screenSizesProp
-};
 const numberProp = Number;
 const colPropsBaseStyle = {
   flex: [String, Number],
@@ -53,6 +44,15 @@ const colPropsBaseClass = {
   push: numberProp,
   span: numberProp
 };
+const screenSizesProp = [Number, Object];
+const screenSizes = {
+  xs: screenSizesProp,
+  sm: screenSizesProp,
+  md: screenSizesProp,
+  lg: screenSizesProp,
+  xl: screenSizesProp,
+  xxl: screenSizesProp
+};
 const colProps = __spreadValues(__spreadValues(__spreadValues({}, colPropsBaseStyle), colPropsBaseClass), screenSizes);
 const CLASS_PREFIX$1 = "devui-col";
 function formatClass(prefix, val) {
@@ -106,20 +106,10 @@ const subscribers = /* @__PURE__ */ new Map();
 let subUid = -1;
 const screen = {};
 const results = {};
-function responesScreen(func) {
-  if (!subscribers.size) {
-    register();
-  }
-  subUid += 1;
-  subscribers.set(subUid, func);
-  func(__spreadValues({}, screen));
-  return subUid;
-}
-function removeSubscribeCb(id) {
-  subscribers.delete(id);
-  if (subscribers.size === 0) {
-    unRegister();
-  }
+function dispatch() {
+  subscribers.forEach((value) => {
+    value(__spreadValues({}, screen));
+  });
 }
 function register() {
   Object.keys(screenMedias).forEach((key) => {
@@ -139,6 +129,15 @@ function register() {
     };
   });
 }
+function responesScreen(func) {
+  if (!subscribers.size) {
+    register();
+  }
+  subUid += 1;
+  subscribers.set(subUid, func);
+  func(__spreadValues({}, screen));
+  return subUid;
+}
 function unRegister() {
   Object.keys(screenMedias).forEach((key) => {
     const handler = results[key];
@@ -146,10 +145,11 @@ function unRegister() {
   });
   subscribers.clear();
 }
-function dispatch() {
-  subscribers.forEach((value) => {
-    value(__spreadValues({}, screen));
-  });
+function removeSubscribeCb(id) {
+  subscribers.delete(id);
+  if (subscribers.size === 0) {
+    unRegister();
+  }
 }
 var row = "";
 const CLASS_PREFIX = "devui-row";
@@ -251,19 +251,13 @@ var Col = defineComponent({
     };
   }
 });
-Row.install = function(app) {
-  app.component(Row.name, Row);
-};
-Col.install = function(app) {
-  app.component(Col.name, Col);
-};
 var index = {
   title: "Grid \u6805\u683C",
   category: "\u5E03\u5C40",
   status: "100%",
   install(app) {
-    app.use(Col);
-    app.use(Row);
+    app.component(Row.name, Row);
+    app.component(Col.name, Col);
   }
 };
-export { Col, Row, index as default };
+export { Col, Row, colProps, colPropsBaseClass, colPropsBaseStyle, index as default, rowProps, screenSizes };

package/grid/index.umd.js

@@ -1 +1 @@
-var X=Object.defineProperty;var L=Object.getOwnPropertySymbols;var q=Object.prototype.hasOwnProperty,H=Object.prototype.propertyIsEnumerable;var M=(u,t,i)=>t in u?X(u,t,{enumerable:!0,configurable:!0,writable:!0,value:i}):u[t]=i,l=(u,t)=>{for(var i in t||(t={}))q.call(t,i)&&M(u,i,t[i]);if(L)for(var i of L(t))H.call(t,i)&&M(u,i,t[i]);return u};(function(u,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(u=typeof globalThis!="undefined"?globalThis:u||self,t(u.index={},u.Vue))})(this,function(u,t){"use strict";const i={align:{type:String,default:"top"},gutter:{type:[Number,Object,Array],default:0},justify:{type:String,default:"start"},wrap:{type:Boolean,default:!1}},m=[Number,Object],E={xs:m,sm:m,md:m,lg:m,xl:m,xxl:m},g=Number,T={flex:[String,Number],order:g},N={offset:g,pull:g,push:g,span:g},A=l(l(l({},T),N),E),d="devui-col";function p(e,n){return n!==void 0?` ${e}-${n}`:""}function _(e){return t.computed(()=>{const n=p(`${d}-span`,e.span),o=p(`${d}-offset`,e.offset),c=p(`${d}-pull`,e.pull),a=p(`${d}-push`,e.push);return`${n}${o}${c}${a}`})}function w(e){return` ${e.trim()}${e&&" "}`}function z(e){const n=Object.keys(e).filter(o=>o in E);return t.computed(()=>n.reduce((o,c)=>{const a=typeof e[c];if(a==="number")o=`${w(o)}${d}-${c}-span-${e[c]}`;else if(a==="object"){const s=Object.keys(e[c]).filter(r=>r in N).reduce((r,f)=>typeof e[c][f]!="number"?"":(r=`${w(r)}${d}-${c}-${f}-${e[c][f]}`,r),"");o=`${w(o)}${s}`}return o},""))}const B=["xxl","xl","lg","md","sm","xs"],j={xs:"screen and (max-width: 575px)",sm:"screen and (min-width: 576px)",md:"screen and (min-width: 768px)",lg:"screen and (min-width: 992px)",xl:"screen and (min-width: 1200px)",xxl:"screen and (min-width: 1600px)"},$=new Map;let v=-1;const C={},P={};function F(e){return $.size||V(),v+=1,$.set(v,e),e(l({},C)),v}function U(e){$.delete(e),$.size===0&&D()}function V(){Object.keys(j).forEach(e=>{const n=window.matchMedia(j[e]);n.matches&&(C[e]=!0,R());const o=c=>{C[e]=c.matches,R()};n.addEventListener("change",o),P[e]={res:n,listener:o}})}function D(){Object.keys(j).forEach(e=>{const n=P[e];n.res.removeEventListener("change",n.listener)}),$.clear()}function R(){$.forEach(e=>{e(l({},C))})}var J="";const h="devui-row";var y=t.defineComponent({name:"DRow",props:i,emits:[],setup(e,{slots:n}){const o=t.ref({}),c=t.computed(()=>{const s=p(`${h}-align`,e.align),r=p(`${h}-justify`,e.justify),f=e.wrap?` ${h}-wrap`:"";return`${s}${r}${f}`});let a;t.onMounted(()=>{a=F(s=>{o.value=s})}),t.onUnmounted(()=>{U(a)});const x=t.computed(()=>{if(!e.gutter)return{};let s=[0,0];Array.isArray(e.gutter)?s=e.gutter:typeof e.gutter=="number"?s=[e.gutter,0]:B.some(O=>{const S=e.gutter[O];return o.value[O]&&S?(typeof S=="number"?s=[S,0]:s=S,!0):!1});const r=`${(s[0]||0)/2}px`,f=`${(s[0]||0)/2}px`,I=`${(s[1]||0)/2}px`,K=`${(s[1]||0)/2}px`;return{paddingLeft:r,paddingRight:f,paddingTop:I,paddingBottom:K}});return t.provide("gutterStyle",x),()=>{var s;return t.createVNode("div",{class:`${h}${c.value}`},[(s=n.default)==null?void 0:s.call(n)])}}}),Q="",b=t.defineComponent({name:"DCol",props:A,setup(e,{slots:n}){const o=r=>typeof r=="number"?`${r} ${r} auto`:/^\d+(\.\d+)?(px|rem|em|%)$/.test(r)?`0 0 ${r}`:r,c=_(e),a=z(e),x=t.computed(()=>({flex:o(e.flex),order:e.order})),s=t.inject("gutterStyle");return()=>{var r;return t.createVNode("div",{class:`${d}${c.value}${a.value}`,style:l(l({},x.value),s.value)},[(r=n.default)==null?void 0:r.call(n)])}}});y.install=function(e){e.component(y.name,y)},b.install=function(e){e.component(b.name,b)};var G={title:"Grid \u6805\u683C",category:"\u5E03\u5C40",status:"100%",install(e){e.use(b),e.use(y)}};u.Col=b,u.Row=y,u.default=G,Object.defineProperty(u,"__esModule",{value:!0}),u[Symbol.toStringTag]="Module"});
+var X=Object.defineProperty;var M=Object.getOwnPropertySymbols;var q=Object.prototype.hasOwnProperty,H=Object.prototype.propertyIsEnumerable;var T=(n,t,i)=>t in n?X(n,t,{enumerable:!0,configurable:!0,writable:!0,value:i}):n[t]=i,l=(n,t)=>{for(var i in t||(t={}))q.call(t,i)&&T(n,i,t[i]);if(M)for(var i of M(t))H.call(t,i)&&T(n,i,t[i]);return n};(function(n,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(n=typeof globalThis!="undefined"?globalThis:n||self,t(n.index={},n.Vue))})(this,function(n,t){"use strict";const i={align:{type:String,default:"top"},gutter:{type:[Number,Object,Array],default:0},justify:{type:String,default:"start"},wrap:{type:Boolean,default:!1}},g=Number,N={flex:[String,Number],order:g},S={offset:g,pull:g,push:g,span:g},m=[Number,Object],w={xs:m,sm:m,md:m,lg:m,xl:m,xxl:m},R=l(l(l({},N),S),w),d="devui-col";function p(e,s){return s!==void 0?` ${e}-${s}`:""}function z(e){return t.computed(()=>{const s=p(`${d}-span`,e.span),u=p(`${d}-offset`,e.offset),c=p(`${d}-pull`,e.pull),a=p(`${d}-push`,e.push);return`${s}${u}${c}${a}`})}function x(e){return` ${e.trim()}${e&&" "}`}function A(e){const s=Object.keys(e).filter(u=>u in w);return t.computed(()=>s.reduce((u,c)=>{const a=typeof e[c];if(a==="number")u=`${x(u)}${d}-${c}-span-${e[c]}`;else if(a==="object"){const r=Object.keys(e[c]).filter(o=>o in S).reduce((o,f)=>typeof e[c][f]!="number"?"":(o=`${x(o)}${d}-${c}-${f}-${e[c][f]}`,o),"");u=`${x(u)}${r}`}return u},""))}const _=["xxl","xl","lg","md","sm","xs"],j={xs:"screen and (max-width: 575px)",sm:"screen and (min-width: 576px)",md:"screen and (min-width: 768px)",lg:"screen and (min-width: 992px)",xl:"screen and (min-width: 1200px)",xxl:"screen and (min-width: 1600px)"},$=new Map;let P=-1;const y={},O={};function B(){$.forEach(e=>{e(l({},y))})}function F(){Object.keys(j).forEach(e=>{const s=window.matchMedia(j[e]);s.matches&&(y[e]=!0,B());const u=c=>{y[e]=c.matches,B()};s.addEventListener("change",u),O[e]={res:s,listener:u}})}function U(e){return $.size||F(),P+=1,$.set(P,e),e(l({},y)),P}function V(){Object.keys(j).forEach(e=>{const s=O[e];s.res.removeEventListener("change",s.listener)}),$.clear()}function D(e){$.delete(e),$.size===0&&V()}var J="";const C="devui-row";var v=t.defineComponent({name:"DRow",props:i,emits:[],setup(e,{slots:s}){const u=t.ref({}),c=t.computed(()=>{const r=p(`${C}-align`,e.align),o=p(`${C}-justify`,e.justify),f=e.wrap?` ${C}-wrap`:"";return`${r}${o}${f}`});let a;t.onMounted(()=>{a=U(r=>{u.value=r})}),t.onUnmounted(()=>{D(a)});const b=t.computed(()=>{if(!e.gutter)return{};let r=[0,0];Array.isArray(e.gutter)?r=e.gutter:typeof e.gutter=="number"?r=[e.gutter,0]:_.some(L=>{const h=e.gutter[L];return u.value[L]&&h?(typeof h=="number"?r=[h,0]:r=h,!0):!1});const o=`${(r[0]||0)/2}px`,f=`${(r[0]||0)/2}px`,I=`${(r[1]||0)/2}px`,K=`${(r[1]||0)/2}px`;return{paddingLeft:o,paddingRight:f,paddingTop:I,paddingBottom:K}});return t.provide("gutterStyle",b),()=>{var r;return t.createVNode("div",{class:`${C}${c.value}`},[(r=s.default)==null?void 0:r.call(s)])}}}),Q="",E=t.defineComponent({name:"DCol",props:R,setup(e,{slots:s}){const u=o=>typeof o=="number"?`${o} ${o} auto`:/^\d+(\.\d+)?(px|rem|em|%)$/.test(o)?`0 0 ${o}`:o,c=z(e),a=A(e),b=t.computed(()=>({flex:u(e.flex),order:e.order})),r=t.inject("gutterStyle");return()=>{var o;return t.createVNode("div",{class:`${d}${c.value}${a.value}`,style:l(l({},b.value),r.value)},[(o=s.default)==null?void 0:o.call(s)])}}}),G={title:"Grid \u6805\u683C",category:"\u5E03\u5C40",status:"100%",install(e){e.component(v.name,v),e.component(E.name,E)}};n.Col=E,n.Row=v,n.colProps=R,n.colPropsBaseClass=S,n.colPropsBaseStyle=N,n.default=G,n.rowProps=i,n.screenSizes=w,Object.defineProperty(n,"__esModule",{value:!0}),n[Symbol.toStringTag]="Module"});

package/icon/index.es.js

@@ -1,75 +1,57 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {}))
-    if (__hasOwnProp.call(b, prop))
-      __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols)
-    for (var prop of __getOwnPropSymbols(b)) {
-      if (__propIsEnum.call(b, prop))
-        __defNormalProp(a, prop, b[prop]);
-    }
-  return a;
+import { defineComponent, toRefs, createVNode } from "vue";
+const iconProps = {
+  name: {
+    type: String,
+    default: "",
+    required: true
+  },
+  size: {
+    type: String,
+    default: "inherit"
+  },
+  color: {
+    type: String,
+    default: "inherit"
+  },
+  classPrefix: {
+    type: String,
+    default: "icon"
+  }
 };
-import { defineComponent, createVNode } from "vue";
 var Icon = defineComponent({
   name: "DIcon",
-  props: {
-    name: {
-      type: String,
-      required: true
-    },
-    size: {
-      type: String,
-      default: "inherit"
-    },
-    color: {
-      type: String,
-      default: "inherit"
-    },
-    classPrefix: {
-      type: String,
-      default: "icon"
-    }
-  },
+  props: iconProps,
   setup(props) {
-    return __spreadValues({}, props);
-  },
-  render() {
     const {
       name,
       size,
       color,
       classPrefix
-    } = this;
-    return /^((https?):)?\/\//.test(name) ? createVNode("img", {
-      "src": name,
-      "alt": name.split("/")[name.split("/").length - 1],
-      "style": {
-        width: size,
-        verticalAlign: "text-bottom"
-      }
-    }, null) : createVNode("i", {
-      "class": `${classPrefix} ${classPrefix}-${name}`,
-      "style": {
-        fontSize: size,
-        color
-      }
-    }, null);
+    } = toRefs(props);
+    return () => {
+      return /^((https?):)?\/\//.test(name.value) ? createVNode("img", {
+        "src": name.value,
+        "alt": name.value.split("/")[name.value.split("/").length - 1],
+        "style": {
+          width: size.value,
+          verticalAlign: "text-bottom"
+        }
+      }, null) : createVNode("i", {
+        "class": `${classPrefix.value} ${classPrefix.value}-${name.value}`,
+        "style": {
+          fontSize: size.value,
+          color: color.value
+        }
+      }, null);
+    };
   }
 });
-Icon.install = function(app) {
-  app.component(Icon.name, Icon);
-};
 var index = {
   title: "Icon \u56FE\u6807",
   category: "\u901A\u7528",
   status: "100%",
   install(app) {
-    app.use(Icon);
+    app.component(Icon.name, Icon);
   }
 };
-export { Icon, index as default };
+export { Icon, index as default, iconProps };

package/icon/index.umd.js

@@ -1 +1 @@
-var a=Object.defineProperty;var s=Object.getOwnPropertySymbols;var f=Object.prototype.hasOwnProperty,p=Object.prototype.propertyIsEnumerable;var u=(t,e,n)=>e in t?a(t,e,{enumerable:!0,configurable:!0,writable:!0,value:n}):t[e]=n,l=(t,e)=>{for(var n in e||(e={}))f.call(e,n)&&u(t,n,e[n]);if(s)for(var n of s(e))p.call(e,n)&&u(t,n,e[n]);return t};(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 n=e.defineComponent({name:"DIcon",props:{name:{type:String,required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}},setup(i){return l({},i)},render(){const{name:i,size:o,color:c,classPrefix:r}=this;return/^((https?):)?\/\//.test(i)?e.createVNode("img",{src:i,alt:i.split("/")[i.split("/").length-1],style:{width:o,verticalAlign:"text-bottom"}},null):e.createVNode("i",{class:`${r} ${r}-${i}`,style:{fontSize:o,color:c}},null)}});n.install=function(i){i.component(n.name,n)};var d={title:"Icon \u56FE\u6807",category:"\u901A\u7528",status:"100%",install(i){i.use(n)}};t.Icon=n,t.default=d,Object.defineProperty(t,"__esModule",{value:!0}),t[Symbol.toStringTag]="Module"});
+(function(e,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(e=typeof globalThis!="undefined"?globalThis:e||self,t(e.index={},e.Vue))})(this,function(e,t){"use strict";const o={name:{type:String,default:"",required:!0},size:{type:String,default:"inherit"},color:{type:String,default:"inherit"},classPrefix:{type:String,default:"icon"}};var i=t.defineComponent({name:"DIcon",props:o,setup(l){const{name:n,size:u,color:s,classPrefix:r}=t.toRefs(l);return()=>/^((https?):)?\/\//.test(n.value)?t.createVNode("img",{src:n.value,alt:n.value.split("/")[n.value.split("/").length-1],style:{width:u.value,verticalAlign:"text-bottom"}},null):t.createVNode("i",{class:`${r.value} ${r.value}-${n.value}`,style:{fontSize:u.value,color:s.value}},null)}}),a={title:"Icon \u56FE\u6807",category:"\u901A\u7528",status:"100%",install(l){l.component(i.name,i)}};e.Icon=i,e.default=a,e.iconProps=o,Object.defineProperty(e,"__esModule",{value:!0}),e[Symbol.toStringTag]="Module"});

package/image-preview/index.es.js

@@ -188,13 +188,14 @@ var imagePreview = defineComponent({
       transform.setZoomOriginal();
     }
     function onKeyDown(event) {
-      if (event.defaultPrevented)
+      if (event.defaultPrevented) {
         return;
-      if (event.code == "Escape") {
+      }
+      if (event.code === "Escape") {
         onClose();
-      } else if (event.code == "ArrowLeft") {
+      } else if (event.code === "ArrowLeft") {
         onPrev();
-      } else if (event.code == "ArrowRight") {
+      } else if (event.code === "ArrowRight") {
         onNext();
       }
     }
@@ -235,7 +236,7 @@ var imagePreview = defineComponent({
       }, [createVNode("polygon", {
         "fill": "#293040",
         "fill-rule": "nonzero",
-        "points": "8 6.58578644 12.2426407 2.34314575 13.6568542 3.75735931 9.41421356 8 13.6568542 12.2426407 12.2426407 13.6568542 8 9.41421356 3.75735931 13.6568542 2.34314575 12.2426407 6.58578644 8 2.34314575 3.75735931 3.75735931 2.34314575"
+        "points": "8 6.58578644 12.2426407 2.34314575 13.6568542 3.75735931 9.41421356 8                     13.6568542 12.2426407 12.2426407 13.6568542 8 9.41421356 3.75735931 13.6568542                      2.34314575 12.2426407 6.58578644 8 2.34314575 3.75735931 3.75735931 2.34314575"
       }, null)])])]), createVNode("button", {
         "class": "devui-image-preview-arrow-left",
         "onClick": onPrev
@@ -252,7 +253,7 @@ var imagePreview = defineComponent({
       }, [createVNode("polygon", {
         "fill": "#293040",
         "fill-rule": "nonzero",
-        "points": "10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322 2.29289322 10.7071068 3.70710678 6.41421356 8"
+        "points": "10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322                     2.29289322 10.7071068 3.70710678 6.41421356 8"
       }, null)])])]), createVNode("button", {
         "class": "devui-image-preview-arrow-right",
         "onClick": onNext
@@ -270,7 +271,7 @@ var imagePreview = defineComponent({
         "fill": "#293040",
         "fill-rule": "nonzero",
         "transform": "translate(8.146447, 8.000000) scale(-1, 1) translate(-8.146447, -8.000000) ",
-        "points": "11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322 11.7071068 3.70710678 7.41421356 8"
+        "points": "11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322                     11.7071068 3.70710678 7.41421356 8"
       }, null)])])]), createVNode("div", {
         "class": "devui-image-preview-toolbar"
       }, [createVNode("button", {
@@ -288,7 +289,7 @@ var imagePreview = defineComponent({
         "fill": "#293040",
         "fill-rule": "nonzero"
       }, [createVNode("path", {
-        "d": "M6,6 L6,4 L8,4 L8,6 L10,6 L10,8 L8,8 L8,10 L6,10 L6,8 L4,8 L4,6 L6,6 Z M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542 L11.1921711,12.6063847 C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932 0,7 C0,3.13400675 3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351 13.4815965,10.0235906 12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12 12,9.76142375 12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375 4.23857625,12 7,12 Z"
+        "d": "M6,6 L6,4 L8,4 L8,6 L10,6 L10,8 L8,8 L8,10 L6,10 L6,8 L4,8 L4,6 L6,6 Z                       M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542 L11.1921711,12.6063847                       C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932 0,7 C0,3.13400675                        3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351 13.4815965,10.0235906                         12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12 12,9.76142375                          12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375                           4.23857625,12 7,12 Z"
       }, null)])])])]), createVNode("button", {
         "onClick": onZoomOut
       }, [createVNode("svg", {
@@ -304,7 +305,7 @@ var imagePreview = defineComponent({
         "fill": "#293040",
         "fill-rule": "nonzero"
       }, [createVNode("path", {
-        "d": "M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542 L11.1921711,12.6063847 C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932 0,7 C0,3.13400675 3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351 13.4815965,10.0235906 12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12 12,9.76142375 12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375 4.23857625,12 7,12 Z M4,6 L10,6 L10,8 L4,8 L4,6 Z"
+        "d": "M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542                       L11.1921711,12.6063847 C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932                        0,7 C0,3.13400675 3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351                         13.4815965,10.0235906 12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12                          12,9.76142375 12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375                           4.23857625,12 7,12 Z M4,6 L10,6 L10,8 L4,8 L4,6 Z"
       }, null)])])])]), createVNode("button", {
         "onClick": onRotate
       }, [createVNode("svg", {
@@ -318,7 +319,7 @@ var imagePreview = defineComponent({
         "fill": "none",
         "fill-rule": "evenodd"
       }, [createVNode("path", {
-        "d": "M7.5,3.02242151 L7.5,4 L4.5,2 L7.5,0 L7.5,1.01640228 C7.66526181,1.00552468 7.83198572,1 8,1 C12.1421356,1 15.5,4.35786438 15.5,8.5 C15.5,12.6421356 12.1421356,16 8,16 C3.85786438,16 0.5,12.6421356 0.5,8.5 C0.5,6.9828355 0.950484514,5.5708873 1.72499011,4.39061882 L3.42173231,5.4510827 C2.83944149,6.32371289 2.5,7.37221604 2.5,8.5 C2.5,11.5375661 4.96243388,14 8,14 C11.0375661,14 13.5,11.5375661 13.5,8.5 C13.5,5.46243388 11.0375661,3 8,3 C7.83145515,3 7.66468102,3.00758131 7.5,3.02242151 Z M8,11 C6.61928813,11 5.5,9.88071187 5.5,8.5 C5.5,7.11928813 6.61928813,6 8,6 C9.38071187,6 10.5,7.11928813 10.5,8.5 C10.5,9.88071187 9.38071187,11 8,11 Z M8,10 C8.82842712,10 9.5,9.32842712 9.5,8.5 C9.5,7.67157288 8.82842712,7 8,7 C7.17157288,7 6.5,7.67157288 6.5,8.5 C6.5,9.32842712 7.17157288,10 8,10 Z",
+        "d": "M7.5,3.02242151 L7.5,4 L4.5,2 L7.5,0 L7.5,1.01640228 C7.66526181,1.00552468                       7.83198572,1 8,1 C12.1421356,1 15.5,4.35786438 15.5,8.5 C15.5,12.6421356                        12.1421356,16 8,16 C3.85786438,16 0.5,12.6421356 0.5,8.5 C0.5,6.9828355                         0.950484514,5.5708873 1.72499011,4.39061882 L3.42173231,5.4510827 C2.83944149,6.32371289                          2.5,7.37221604 2.5,8.5 C2.5,11.5375661 4.96243388,14 8,14 C11.0375661,14 13.5,11.5375661                           13.5,8.5 C13.5,5.46243388 11.0375661,3 8,3 C7.83145515,3 7.66468102,3.00758131 7.5,3.02242151                            Z M8,11 C6.61928813,11 5.5,9.88071187 5.5,8.5 C5.5,7.11928813 6.61928813,6 8,6 C9.38071187,6                             10.5,7.11928813 10.5,8.5 C10.5,9.88071187 9.38071187,11 8,11 Z M8,10 C8.82842712,10 9.5,9.32842712                              9.5,8.5 C9.5,7.67157288 8.82842712,7 8,7 C7.17157288,7 6.5,7.67157288 6.5,8.5 C6.5,9.32842712                               7.17157288,10 8,10 Z",
         "fill": "#293040"
       }, null)])])]), createVNode("button", {
         "onClick": onPrev
@@ -335,7 +336,7 @@ var imagePreview = defineComponent({
       }, [createVNode("polygon", {
         "fill": "#293040",
         "fill-rule": "nonzero",
-        "points": "10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322 2.29289322 10.7071068 3.70710678 6.41421356 8"
+        "points": "10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322 2.29289322                       10.7071068 3.70710678 6.41421356 8"
       }, null)])])]), createVNode("span", {
         "class": "devui-image-preview-index"
       }, [index2.value + 1, createTextVNode(":"), props.previewUrlList.length]), createVNode("button", {
@@ -355,7 +356,7 @@ var imagePreview = defineComponent({
         "fill": "#293040",
         "fill-rule": "nonzero",
         "transform": "translate(8.146447, 8.000000) scale(-1, 1) translate(-8.146447, -8.000000) ",
-        "points": "11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322 11.7071068 3.70710678 7.41421356 8"
+        "points": "11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322                       11.7071068 3.70710678 7.41421356 8"
       }, null)])])]), createVNode("button", {
         "onClick": onZoomBest
       }, [createVNode("svg", {
@@ -368,7 +369,7 @@ var imagePreview = defineComponent({
         "fill": "none",
         "fill-rule": "evenodd"
       }, [createVNode("path", {
-        "d": "M16,16 L11.429,16 L11.429,15 L14.456,15 L11.006,11.226 L11.652,10.519 L15.086,14.275 L15.086,11 L16,11 L16,16 Z M15.164,1.544 L12.009,4.994 L11.418,4.348 L14.558,0.914 L11.82,0.914 L11.82,0 L16,0 L16,4.571 L15.164,4.571 L15.164,1.544 Z M5,15 L5,16 L0,16 L0,11 L1,11 L1,14.275 L4.756,10.519 L5.463,11.226 L1.689,15 L5,15 Z M4.365,4.994 L0.914,1.544 L0.914,4.571 L3.41060513e-13,4.571 L3.41060513e-13,0 L4.571,0 L4.571,0.914 L1.578,0.914 L5.011,4.348 L4.365,4.994 Z",
+        "d": "M16,16 L11.429,16 L11.429,15 L14.456,15 L11.006,11.226 L11.652,10.519 L15.086,14.275                       L15.086,11 L16,11 L16,16 Z M15.164,1.544 L12.009,4.994 L11.418,4.348 L14.558,0.914                        L11.82,0.914 L11.82,0 L16,0 L16,4.571 L15.164,4.571 L15.164,1.544 Z M5,15 L5,16                         L0,16 L0,11 L1,11 L1,14.275 L4.756,10.519 L5.463,11.226 L1.689,15 L5,15 Z M4.365,4.994                          L0.914,1.544 L0.914,4.571 L3.41060513e-13,4.571 L3.41060513e-13,0 L4.571,0 L4.571,0.914                           L1.578,0.914 L5.011,4.348 L4.365,4.994 Z",
         "fill": "#293040",
         "fill-rule": "nonzero"
       }, null)])])]), createVNode("button", {
@@ -419,12 +420,6 @@ function getImgByEl(el) {
   const urlList = [...el.querySelectorAll("img")].map((item) => item.getAttribute("src"));
   return urlList;
 }
-function handleImgByEl(el) {
-  el.addEventListener("click", handleImg);
-}
-function removeHandle(el) {
-  el.removeEventListener("click", handleImg);
-}
 function handleImg(e) {
   var _a;
   e.stopPropagation();
@@ -441,6 +436,12 @@ function handleImg(e) {
     });
   }
 }
+function handleImgByEl(el) {
+  el.addEventListener("click", handleImg);
+}
+function removeHandle(el) {
+  el.removeEventListener("click", handleImg);
+}
 var ImagePreviewDirective = {
   mounted(el, binding) {
     if (!binding.value) {
@@ -495,4 +496,4 @@ var index = {
     app.config.globalProperties.$imagePreviewService = ImagePreviewService;
   }
 };
-export { ImagePreviewDirective, ImagePreviewService, index as default };
+export { ImagePreviewDirective, ImagePreviewService, index as default, imagePreviewProps };

package/image-preview/index.umd.js

@@ -1 +1 @@
-var S=Object.defineProperty;var O=(r,e,u)=>e in r?S(r,e,{enumerable:!0,configurable:!0,writable:!0,value:u}):r[e]=u;var n=(r,e,u)=>(O(r,typeof e!="symbol"?e+"":e,u),u);(function(r,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(r=typeof globalThis!="undefined"?globalThis:r||self,e(r.index={},r.Vue))})(this,function(r,e){"use strict";var u="";const y={url:{type:String,default:"",required:!0},previewUrlList:{type:Array,default:()=>[],required:!0},zIndex:{type:Number,required:!1},backDropZIndex:{type:Number,required:!1}};class b{constructor(o,i={}){n(this,"el");n(this,"oTransformX",0);n(this,"oTransformY",0);n(this,"transformX");n(this,"transformY");n(this,"zoom");n(this,"rotate");n(this,"STEP",.25);n(this,"MIN_SCALE",.2);n(this,"MAX_SCALE",2.5);n(this,"TRANSFORMX",0);n(this,"TRANSFORMY",0);n(this,"ZOOM",1);n(this,"ROTATE",0);this.el=o,this.transformX=i.transformX||this.TRANSFORMX,this.transformY=i.transformY||this.TRANSFORMY,this.zoom=i.zoom||this.ZOOM,this.rotate=i.rotate||this.ROTATE,this.handleDefaultDraggable(),this.onDraggable(),this.onMouseWheel()}handleDefaultDraggable(){document.body.ondragstart=()=>(window.event.returnValue=!1,!1)}onDraggable(){this.el.onmousedown=o=>{const i=o.clientX,s=o.clientY;document.onmousemove=l=>{const c=l.clientX-i,f=l.clientY-s;this.transformX=this.oTransformX+c,this.transformY=this.oTransformY+f,this.el.style.cursor="grabbing",this.setPosition()}},document.onmouseup=()=>{document.onmousemove=null,this.oTransformX=this.transformX,this.oTransformY=this.transformY,this.el.style.cursor="grab"}}onMouseWheel(){const o=this.throttle(this.setMouseWheel,100);this.el.onmousewheel=i=>{const s=-i.wheelDelta||i.deltaY||i.detail;o(s)}}throttle(o,i){let s=null;return(...l)=>{s||setTimeout(()=>{s=null,o.apply(this,l)},i)}}setMouseWheel(o){if(o<0){if(this.zoom>=this.MAX_SCALE){this.el.style.cursor="not-allowed";return}this.el.style.cursor="zoom-in",this.setZoomIn(this.STEP)}else{if(this.zoom<=this.MIN_SCALE){this.el.style.cursor="not-allowed";return}this.el.style.cursor="zoom-out",this.setZoomOut(this.STEP)}this.setPosition()}setZoomIn(o=this.STEP){this.zoom=Math.min(this.MAX_SCALE,this.zoom+o),this.setPosition()}setZoomOut(o=this.STEP){this.zoom=Math.max(this.MIN_SCALE,this.zoom-o),this.setPosition()}setZoomBest(){this.reset(),this.setPosition()}setZoomOriginal(){this.reset(),this.setPosition()}setRotate(){this.rotate+=.25,this.setPosition()}reset(){this.transformX=this.TRANSFORMX,this.transformY=this.TRANSFORMY,this.zoom=this.ZOOM}setPosition(){this.el.style.transform=`translate(${this.transformX}px, ${this.transformY}px) scale(${this.zoom}) rotate(${this.rotate}turn)`}}var V=e.defineComponent({name:"DImagePreview",props:y,emits:[],setup(t){let o=null;const i=e.ref(0),s=e.computed(()=>t.previewUrlList[i.value]),l=t.zIndex?{zIndex:t.zIndex}:{},c=t.backDropZIndex?{zIndex:t.backDropZIndex}:{};function f(){const d=document.querySelector(".devui-image-preview-main-image");o=new b(d)}function M(){i.value=t.previewUrlList.findIndex(d=>d===t.url)}function m(){i.value=i.value<=0?t.previewUrlList.length-1:i.value-1}function g(){i.value=i.value>=t.previewUrlList.length-1?0:i.value+1}function N(){a.close()}function z(){o.setZoomIn()}function P(){o.setZoomOut()}function T(){o.setRotate()}function D(){o.setZoomBest()}function A(){o.setZoomOriginal()}function C(d){d.defaultPrevented||(d.code=="Escape"?N():d.code=="ArrowLeft"?m():d.code=="ArrowRight"&&g())}function $(){document.addEventListener("keydown",C,!1)}function E(){document.removeEventListener("keydown",C,!1)}return e.onMounted(()=>{M(),f(),$()}),e.onUnmounted(()=>{E()}),()=>e.createVNode(e.Fragment,null,[e.createVNode("div",{class:"devui-image-preview",style:l},[e.createVNode("img",{class:"devui-image-preview-main-image",src:s.value},null),e.createVNode("button",{class:"devui-image-preview-close-btn",onClick:N},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"8 6.58578644 12.2426407 2.34314575 13.6568542 3.75735931 9.41421356 8 13.6568542 12.2426407 12.2426407 13.6568542 8 9.41421356 3.75735931 13.6568542 2.34314575 12.2426407 6.58578644 8 2.34314575 3.75735931 3.75735931 2.34314575"},null)])])]),e.createVNode("button",{class:"devui-image-preview-arrow-left",onClick:m},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322 2.29289322 10.7071068 3.70710678 6.41421356 8"},null)])])]),e.createVNode("button",{class:"devui-image-preview-arrow-right",onClick:g},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",transform:"translate(8.146447, 8.000000) scale(-1, 1) translate(-8.146447, -8.000000) ",points:"11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322 11.7071068 3.70710678 7.41421356 8"},null)])])]),e.createVNode("div",{class:"devui-image-preview-toolbar"},[e.createVNode("button",{onClick:z},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{fill:"#293040","fill-rule":"nonzero"},[e.createVNode("path",{d:"M6,6 L6,4 L8,4 L8,6 L10,6 L10,8 L8,8 L8,10 L6,10 L6,8 L4,8 L4,6 L6,6 Z M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542 L11.1921711,12.6063847 C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932 0,7 C0,3.13400675 3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351 13.4815965,10.0235906 12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12 12,9.76142375 12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375 4.23857625,12 7,12 Z"},null)])])])]),e.createVNode("button",{onClick:P},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{fill:"#293040","fill-rule":"nonzero"},[e.createVNode("path",{d:"M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542 L11.1921711,12.6063847 C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932 0,7 C0,3.13400675 3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351 13.4815965,10.0235906 12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12 12,9.76142375 12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375 4.23857625,12 7,12 Z M4,6 L10,6 L10,8 L4,8 L4,6 Z"},null)])])])]),e.createVNode("button",{onClick:T},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{d:"M7.5,3.02242151 L7.5,4 L4.5,2 L7.5,0 L7.5,1.01640228 C7.66526181,1.00552468 7.83198572,1 8,1 C12.1421356,1 15.5,4.35786438 15.5,8.5 C15.5,12.6421356 12.1421356,16 8,16 C3.85786438,16 0.5,12.6421356 0.5,8.5 C0.5,6.9828355 0.950484514,5.5708873 1.72499011,4.39061882 L3.42173231,5.4510827 C2.83944149,6.32371289 2.5,7.37221604 2.5,8.5 C2.5,11.5375661 4.96243388,14 8,14 C11.0375661,14 13.5,11.5375661 13.5,8.5 C13.5,5.46243388 11.0375661,3 8,3 C7.83145515,3 7.66468102,3.00758131 7.5,3.02242151 Z M8,11 C6.61928813,11 5.5,9.88071187 5.5,8.5 C5.5,7.11928813 6.61928813,6 8,6 C9.38071187,6 10.5,7.11928813 10.5,8.5 C10.5,9.88071187 9.38071187,11 8,11 Z M8,10 C8.82842712,10 9.5,9.32842712 9.5,8.5 C9.5,7.67157288 8.82842712,7 8,7 C7.17157288,7 6.5,7.67157288 6.5,8.5 C6.5,9.32842712 7.17157288,10 8,10 Z",fill:"#293040"},null)])])]),e.createVNode("button",{onClick:m},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322 2.29289322 10.7071068 3.70710678 6.41421356 8"},null)])])]),e.createVNode("span",{class:"devui-image-preview-index"},[i.value+1,e.createTextVNode(":"),t.previewUrlList.length]),e.createVNode("button",{class:"devui-next",onClick:g},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",transform:"translate(8.146447, 8.000000) scale(-1, 1) translate(-8.146447, -8.000000) ",points:"11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322 11.7071068 3.70710678 7.41421356 8"},null)])])]),e.createVNode("button",{onClick:D},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{d:"M16,16 L11.429,16 L11.429,15 L14.456,15 L11.006,11.226 L11.652,10.519 L15.086,14.275 L15.086,11 L16,11 L16,16 Z M15.164,1.544 L12.009,4.994 L11.418,4.348 L14.558,0.914 L11.82,0.914 L11.82,0 L16,0 L16,4.571 L15.164,4.571 L15.164,1.544 Z M5,15 L5,16 L0,16 L0,11 L1,11 L1,14.275 L4.756,10.519 L5.463,11.226 L1.689,15 L5,15 Z M4.365,4.994 L0.914,1.544 L0.914,4.571 L3.41060513e-13,4.571 L3.41060513e-13,0 L4.571,0 L4.571,0.914 L1.578,0.914 L5.011,4.348 L4.365,4.994 Z",fill:"#293040","fill-rule":"nonzero"},null)])])]),e.createVNode("button",{onClick:A},[e.createVNode("span",null,[e.createTextVNode("1:1")])])])]),e.createVNode("div",{class:"devui-image-preview-bg",style:c},null)])}});function k(t){return e.createApp(V,t)}class a{static open(o){this.$body=document.body,this.$div=document.createElement("div"),this.$overflow=this.$body.style.overflow,this.$body.appendChild(this.$div),k(o).mount(this.$div),this.$body.style.setProperty("overflow","hidden","important")}static close(){var o;(o=this.$body)==null||o.style.setProperty("overflow",this.$overflow),this.$overflow=null,this.$div&&this.$body.removeChild(this.$div),this.$body=null,this.$div=null}}n(a,"$body",null),n(a,"$div",null),n(a,"$overflow","");function L(t){a.open({url:t.url,previewUrlList:t.previewUrlList,zIndex:t.zIndex,backDropZIndex:t.backDropZIndex})}function w(){a.close()}function v(t){return[...t.querySelectorAll("img")].map(i=>i.getAttribute("src"))}function h(t){t.addEventListener("click",p)}function I(t){t.removeEventListener("click",p)}function p(t){var s;t.stopPropagation();const o=t.currentTarget,i=t.target;if(((s=i==null?void 0:i.nodeName)==null?void 0:s.toLowerCase())==="img"){const l=v(o),c=i.getAttribute("src");L({url:c,previewUrlList:l,zIndex:o==null?void 0:o.zIndex,backDropZIndex:o==null?void 0:o.backDropZIndex})}}var x={mounted(t,o){if(!o.value)return h(t);const{custom:i,disableDefault:s}=o.value;i instanceof Object&&(i.open=()=>{const l=v(t);L({url:l==null?void 0:l[0],previewUrlList:l,zIndex:t==null?void 0:t.zIndex,backDropZIndex:t==null?void 0:t.backDropZIndex})},i.close=()=>w()),!s&&h(t)},unmounted(){w()},updated(t,o){var i,s;if(t.zIndex=(i=o.value)==null?void 0:i.zIndex,t.backDropZIndex=(s=o.value)==null?void 0:s.backDropZIndex,o.value){const{value:{disableDefault:l},oldValue:{disableDefault:c}}=o;l!==c&&(l?I(t):h(t))}}},Z={title:"ImagePreview \u56FE\u7247\u9884\u89C8",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(t){t.directive("d-image-preview",x),t.config.globalProperties.$imagePreviewService=a}};r.ImagePreviewDirective=x,r.ImagePreviewService=a,r.default=Z,Object.defineProperty(r,"__esModule",{value:!0}),r[Symbol.toStringTag]="Module"});
+var S=Object.defineProperty;var O=(r,e,u)=>e in r?S(r,e,{enumerable:!0,configurable:!0,writable:!0,value:u}):r[e]=u;var n=(r,e,u)=>(O(r,typeof e!="symbol"?e+"":e,u),u);(function(r,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(r=typeof globalThis!="undefined"?globalThis:r||self,e(r.index={},r.Vue))})(this,function(r,e){"use strict";var u="";const L={url:{type:String,default:"",required:!0},previewUrlList:{type:Array,default:()=>[],required:!0},zIndex:{type:Number,required:!1},backDropZIndex:{type:Number,required:!1}};class b{constructor(o,i={}){n(this,"el");n(this,"oTransformX",0);n(this,"oTransformY",0);n(this,"transformX");n(this,"transformY");n(this,"zoom");n(this,"rotate");n(this,"STEP",.25);n(this,"MIN_SCALE",.2);n(this,"MAX_SCALE",2.5);n(this,"TRANSFORMX",0);n(this,"TRANSFORMY",0);n(this,"ZOOM",1);n(this,"ROTATE",0);this.el=o,this.transformX=i.transformX||this.TRANSFORMX,this.transformY=i.transformY||this.TRANSFORMY,this.zoom=i.zoom||this.ZOOM,this.rotate=i.rotate||this.ROTATE,this.handleDefaultDraggable(),this.onDraggable(),this.onMouseWheel()}handleDefaultDraggable(){document.body.ondragstart=()=>(window.event.returnValue=!1,!1)}onDraggable(){this.el.onmousedown=o=>{const i=o.clientX,s=o.clientY;document.onmousemove=l=>{const c=l.clientX-i,f=l.clientY-s;this.transformX=this.oTransformX+c,this.transformY=this.oTransformY+f,this.el.style.cursor="grabbing",this.setPosition()}},document.onmouseup=()=>{document.onmousemove=null,this.oTransformX=this.transformX,this.oTransformY=this.transformY,this.el.style.cursor="grab"}}onMouseWheel(){const o=this.throttle(this.setMouseWheel,100);this.el.onmousewheel=i=>{const s=-i.wheelDelta||i.deltaY||i.detail;o(s)}}throttle(o,i){let s=null;return(...l)=>{s||setTimeout(()=>{s=null,o.apply(this,l)},i)}}setMouseWheel(o){if(o<0){if(this.zoom>=this.MAX_SCALE){this.el.style.cursor="not-allowed";return}this.el.style.cursor="zoom-in",this.setZoomIn(this.STEP)}else{if(this.zoom<=this.MIN_SCALE){this.el.style.cursor="not-allowed";return}this.el.style.cursor="zoom-out",this.setZoomOut(this.STEP)}this.setPosition()}setZoomIn(o=this.STEP){this.zoom=Math.min(this.MAX_SCALE,this.zoom+o),this.setPosition()}setZoomOut(o=this.STEP){this.zoom=Math.max(this.MIN_SCALE,this.zoom-o),this.setPosition()}setZoomBest(){this.reset(),this.setPosition()}setZoomOriginal(){this.reset(),this.setPosition()}setRotate(){this.rotate+=.25,this.setPosition()}reset(){this.transformX=this.TRANSFORMX,this.transformY=this.TRANSFORMY,this.zoom=this.ZOOM}setPosition(){this.el.style.transform=`translate(${this.transformX}px, ${this.transformY}px) scale(${this.zoom}) rotate(${this.rotate}turn)`}}var V=e.defineComponent({name:"DImagePreview",props:L,emits:[],setup(t){let o=null;const i=e.ref(0),s=e.computed(()=>t.previewUrlList[i.value]),l=t.zIndex?{zIndex:t.zIndex}:{},c=t.backDropZIndex?{zIndex:t.backDropZIndex}:{};function f(){const d=document.querySelector(".devui-image-preview-main-image");o=new b(d)}function M(){i.value=t.previewUrlList.findIndex(d=>d===t.url)}function m(){i.value=i.value<=0?t.previewUrlList.length-1:i.value-1}function g(){i.value=i.value>=t.previewUrlList.length-1?0:i.value+1}function C(){a.close()}function z(){o.setZoomIn()}function P(){o.setZoomOut()}function T(){o.setRotate()}function D(){o.setZoomBest()}function A(){o.setZoomOriginal()}function y(d){d.defaultPrevented||(d.code==="Escape"?C():d.code==="ArrowLeft"?m():d.code==="ArrowRight"&&g())}function $(){document.addEventListener("keydown",y,!1)}function E(){document.removeEventListener("keydown",y,!1)}return e.onMounted(()=>{M(),f(),$()}),e.onUnmounted(()=>{E()}),()=>e.createVNode(e.Fragment,null,[e.createVNode("div",{class:"devui-image-preview",style:l},[e.createVNode("img",{class:"devui-image-preview-main-image",src:s.value},null),e.createVNode("button",{class:"devui-image-preview-close-btn",onClick:C},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"8 6.58578644 12.2426407 2.34314575 13.6568542 3.75735931 9.41421356 8                     13.6568542 12.2426407 12.2426407 13.6568542 8 9.41421356 3.75735931 13.6568542                      2.34314575 12.2426407 6.58578644 8 2.34314575 3.75735931 3.75735931 2.34314575"},null)])])]),e.createVNode("button",{class:"devui-image-preview-arrow-left",onClick:m},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322                     2.29289322 10.7071068 3.70710678 6.41421356 8"},null)])])]),e.createVNode("button",{class:"devui-image-preview-arrow-right",onClick:g},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",transform:"translate(8.146447, 8.000000) scale(-1, 1) translate(-8.146447, -8.000000) ",points:"11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322                     11.7071068 3.70710678 7.41421356 8"},null)])])]),e.createVNode("div",{class:"devui-image-preview-toolbar"},[e.createVNode("button",{onClick:z},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{fill:"#293040","fill-rule":"nonzero"},[e.createVNode("path",{d:"M6,6 L6,4 L8,4 L8,6 L10,6 L10,8 L8,8 L8,10 L6,10 L6,8 L4,8 L4,6 L6,6 Z                       M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542 L11.1921711,12.6063847                       C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932 0,7 C0,3.13400675                        3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351 13.4815965,10.0235906                         12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12 12,9.76142375                          12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375                           4.23857625,12 7,12 Z"},null)])])])]),e.createVNode("button",{onClick:P},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("g",{fill:"#293040","fill-rule":"nonzero"},[e.createVNode("path",{d:"M12.6063847,11.1921711 L15.6568542,14.2426407 L14.2426407,15.6568542                       L11.1921711,12.6063847 C10.0235906,13.4815965 8.5723351,14 7,14 C3.13400675,14 0,10.8659932                        0,7 C0,3.13400675 3.13400675,0 7,0 C10.8659932,0 14,3.13400675 14,7 C14,8.5723351                         13.4815965,10.0235906 12.6063847,11.1921711 L12.6063847,11.1921711 Z M7,12 C9.76142375,12                          12,9.76142375 12,7 C12,4.23857625 9.76142375,2 7,2 C4.23857625,2 2,4.23857625 2,7 C2,9.76142375                           4.23857625,12 7,12 Z M4,6 L10,6 L10,8 L4,8 L4,6 Z"},null)])])])]),e.createVNode("button",{onClick:T},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{d:"M7.5,3.02242151 L7.5,4 L4.5,2 L7.5,0 L7.5,1.01640228 C7.66526181,1.00552468                       7.83198572,1 8,1 C12.1421356,1 15.5,4.35786438 15.5,8.5 C15.5,12.6421356                        12.1421356,16 8,16 C3.85786438,16 0.5,12.6421356 0.5,8.5 C0.5,6.9828355                         0.950484514,5.5708873 1.72499011,4.39061882 L3.42173231,5.4510827 C2.83944149,6.32371289                          2.5,7.37221604 2.5,8.5 C2.5,11.5375661 4.96243388,14 8,14 C11.0375661,14 13.5,11.5375661                           13.5,8.5 C13.5,5.46243388 11.0375661,3 8,3 C7.83145515,3 7.66468102,3.00758131 7.5,3.02242151                            Z M8,11 C6.61928813,11 5.5,9.88071187 5.5,8.5 C5.5,7.11928813 6.61928813,6 8,6 C9.38071187,6                             10.5,7.11928813 10.5,8.5 C10.5,9.88071187 9.38071187,11 8,11 Z M8,10 C8.82842712,10 9.5,9.32842712                              9.5,8.5 C9.5,7.67157288 8.82842712,7 8,7 C7.17157288,7 6.5,7.67157288 6.5,8.5 C6.5,9.32842712                               7.17157288,10 8,10 Z",fill:"#293040"},null)])])]),e.createVNode("button",{onClick:m},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",points:"10.7071068 12.2928932 9.29289322 13.7071068 3.58578644 8 9.29289322 2.29289322                       10.7071068 3.70710678 6.41421356 8"},null)])])]),e.createVNode("span",{class:"devui-image-preview-index"},[i.value+1,e.createTextVNode(":"),t.previewUrlList.length]),e.createVNode("button",{class:"devui-next",onClick:g},[e.createVNode("svg",{width:"16px",height:"16px",viewBox:"0 0 16 16",version:"1.1"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("polygon",{fill:"#293040","fill-rule":"nonzero",transform:"translate(8.146447, 8.000000) scale(-1, 1) translate(-8.146447, -8.000000) ",points:"11.7071068 12.2928932 10.2928932 13.7071068 4.58578644 8 10.2928932 2.29289322                       11.7071068 3.70710678 7.41421356 8"},null)])])]),e.createVNode("button",{onClick:D},[e.createVNode("svg",{width:"18px",height:"18px",viewBox:"0 0 16 16"},[e.createVNode("g",{stroke:"none","stroke-width":"1",fill:"none","fill-rule":"evenodd"},[e.createVNode("path",{d:"M16,16 L11.429,16 L11.429,15 L14.456,15 L11.006,11.226 L11.652,10.519 L15.086,14.275                       L15.086,11 L16,11 L16,16 Z M15.164,1.544 L12.009,4.994 L11.418,4.348 L14.558,0.914                        L11.82,0.914 L11.82,0 L16,0 L16,4.571 L15.164,4.571 L15.164,1.544 Z M5,15 L5,16                         L0,16 L0,11 L1,11 L1,14.275 L4.756,10.519 L5.463,11.226 L1.689,15 L5,15 Z M4.365,4.994                          L0.914,1.544 L0.914,4.571 L3.41060513e-13,4.571 L3.41060513e-13,0 L4.571,0 L4.571,0.914                           L1.578,0.914 L5.011,4.348 L4.365,4.994 Z",fill:"#293040","fill-rule":"nonzero"},null)])])]),e.createVNode("button",{onClick:A},[e.createVNode("span",null,[e.createTextVNode("1:1")])])])]),e.createVNode("div",{class:"devui-image-preview-bg",style:c},null)])}});function k(t){return e.createApp(V,t)}class a{static open(o){this.$body=document.body,this.$div=document.createElement("div"),this.$overflow=this.$body.style.overflow,this.$body.appendChild(this.$div),k(o).mount(this.$div),this.$body.style.setProperty("overflow","hidden","important")}static close(){var o;(o=this.$body)==null||o.style.setProperty("overflow",this.$overflow),this.$overflow=null,this.$div&&this.$body.removeChild(this.$div),this.$body=null,this.$div=null}}n(a,"$body",null),n(a,"$div",null),n(a,"$overflow","");function w(t){a.open({url:t.url,previewUrlList:t.previewUrlList,zIndex:t.zIndex,backDropZIndex:t.backDropZIndex})}function v(){a.close()}function p(t){return[...t.querySelectorAll("img")].map(i=>i.getAttribute("src"))}function x(t){var s;t.stopPropagation();const o=t.currentTarget,i=t.target;if(((s=i==null?void 0:i.nodeName)==null?void 0:s.toLowerCase())==="img"){const l=p(o),c=i.getAttribute("src");w({url:c,previewUrlList:l,zIndex:o==null?void 0:o.zIndex,backDropZIndex:o==null?void 0:o.backDropZIndex})}}function h(t){t.addEventListener("click",x)}function I(t){t.removeEventListener("click",x)}var N={mounted(t,o){if(!o.value)return h(t);const{custom:i,disableDefault:s}=o.value;i instanceof Object&&(i.open=()=>{const l=p(t);w({url:l==null?void 0:l[0],previewUrlList:l,zIndex:t==null?void 0:t.zIndex,backDropZIndex:t==null?void 0:t.backDropZIndex})},i.close=()=>v()),!s&&h(t)},unmounted(){v()},updated(t,o){var i,s;if(t.zIndex=(i=o.value)==null?void 0:i.zIndex,t.backDropZIndex=(s=o.value)==null?void 0:s.backDropZIndex,o.value){const{value:{disableDefault:l},oldValue:{disableDefault:c}}=o;l!==c&&(l?I(t):h(t))}}},Z={title:"ImagePreview \u56FE\u7247\u9884\u89C8",category:"\u6570\u636E\u5C55\u793A",status:"100%",install(t){t.directive("d-image-preview",N),t.config.globalProperties.$imagePreviewService=a}};r.ImagePreviewDirective=N,r.ImagePreviewService=a,r.default=Z,r.imagePreviewProps=L,Object.defineProperty(r,"__esModule",{value:!0}),r[Symbol.toStringTag]="Module"});

package/input/index.es.js

@@ -175,15 +175,12 @@ var Input = defineComponent({
     }, null)])]);
   }
 });
-Input.install = function(app) {
-  app.component(Input.name, Input);
-};
 var index = {
   title: "Input \u8F93\u5165\u6846",
   category: "\u6570\u636E\u5F55\u5165",
   status: "100%",
   install(app) {
-    app.use(Input);
+    app.component(Input.name, Input);
   }
 };
-export { Input, index as default };
+export { Input, index as default, inputProps };

package/input/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";const v={placeholder:{type:String,default:void 0},disabled:{type:Boolean,default:!1},autoFocus:{type:Boolean,default:!1},maxLength:{type:Number,default:Number.MAX_SAFE_INTEGER},cssClass:{type:String,default:""},error:{type:Boolean,default:!1},size:{type:String,default:""},showPassword:{type:Boolean,default:!1},modelValue:{type:String,default:""},"update:modelValue":{type:Function,default:void 0},onChange:{type:Function,default:void 0},onKeydown:{type:Function,default:void 0},onFocus:{type:Function,default:void 0},onBlur:{type:Function,default:void 0}};var b="";const F=Symbol("dFormItem"),r={blur:"d.form.blur",change:"d.form.change",input:"d.form.input"};var a=e.defineComponent({name:"DInput",directives:{focus:{mounted:function(n,o){o.value&&n.focus()}}},props:v,emits:["update:modelValue","focus","blur","change","keydown"],setup(n,o){const i=e.inject(F,{}),s=Object.keys(i).length>0,p=e.computed(()=>`devui-input-${n.size}`),l=e.ref(!1),u=e.ref("text"),c=e.computed(()=>({error:n.error,[n.cssClass]:!0,"devui-input-restore":l.value,[p.value]:n.size!==""})),f=e.computed(()=>u.value==="password");return e.watch(()=>n.showPassword,d=>{u.value=d?"password":"text",l.value=n.showPassword},{immediate:!0}),{inputCls:c,inputType:u,showPreviewIcon:f,showPwdIcon:l,onInput:d=>{o.emit("update:modelValue",d.target.value),s&&i.formItemMitt.emit(r.input)},onFocus:()=>{o.emit("focus")},onBlur:()=>{o.emit("blur"),s&&i.formItemMitt.emit(r.blur)},onChange:d=>{o.emit("change",d.target.value),s&&i.formItemMitt.emit(r.change)},onKeydown:d=>{o.emit("keydown",d)},onChangeInputType:()=>{u.value=u.value==="password"?"text":"password"}}},render(){const{modelValue:n,showPreviewIcon:o,showPwdIcon:i,inputCls:s,inputType:p,maxLength:l,autoFocus:u,placeholder:c,disabled:f,onInput:m,onFocus:y,onBlur:h,onChange:w,onKeydown:g,onChangeInputType:I}=this;return e.createVNode("div",{class:"devui-input__wrap"},[e.withDirectives(e.createVNode("input",e.mergeProps({dinput:!0},{value:n,disabled:f,type:p,maxlength:l,placeholder:c,class:s,onInput:m,onFocus:y,onBlur:h,onChange:w,onKeydown:g}),null),[[e.resolveDirective("focus"),u]]),i&&e.createVNode("div",{class:"devui-input__preview",onClick:I},[o?e.createVNode(e.resolveComponent("d-icon"),{name:"preview-forbidden",size:"12px",key:1},null):e.createVNode(e.resolveComponent("d-icon"),{name:"preview",size:"12px",key:2},null)])])}});a.install=function(n){n.component(a.name,a)};var C={title:"Input \u8F93\u5165\u6846",category:"\u6570\u636E\u5F55\u5165",status:"100%",install(n){n.use(a)}};t.Input=a,t.default=C,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";const m={placeholder:{type:String,default:void 0},disabled:{type:Boolean,default:!1},autoFocus:{type:Boolean,default:!1},maxLength:{type:Number,default:Number.MAX_SAFE_INTEGER},cssClass:{type:String,default:""},error:{type:Boolean,default:!1},size:{type:String,default:""},showPassword:{type:Boolean,default:!1},modelValue:{type:String,default:""},"update:modelValue":{type:Function,default:void 0},onChange:{type:Function,default:void 0},onKeydown:{type:Function,default:void 0},onFocus:{type:Function,default:void 0},onBlur:{type:Function,default:void 0}};var b="";const F=Symbol("dFormItem"),l={blur:"d.form.blur",change:"d.form.change",input:"d.form.input"};var r=e.defineComponent({name:"DInput",directives:{focus:{mounted:function(n,o){o.value&&n.focus()}}},props:m,emits:["update:modelValue","focus","blur","change","keydown"],setup(n,o){const i=e.inject(F,{}),a=Object.keys(i).length>0,p=e.computed(()=>`devui-input-${n.size}`),s=e.ref(!1),u=e.ref("text"),c=e.computed(()=>({error:n.error,[n.cssClass]:!0,"devui-input-restore":s.value,[p.value]:n.size!==""})),f=e.computed(()=>u.value==="password");return e.watch(()=>n.showPassword,d=>{u.value=d?"password":"text",s.value=n.showPassword},{immediate:!0}),{inputCls:c,inputType:u,showPreviewIcon:f,showPwdIcon:s,onInput:d=>{o.emit("update:modelValue",d.target.value),a&&i.formItemMitt.emit(l.input)},onFocus:()=>{o.emit("focus")},onBlur:()=>{o.emit("blur"),a&&i.formItemMitt.emit(l.blur)},onChange:d=>{o.emit("change",d.target.value),a&&i.formItemMitt.emit(l.change)},onKeydown:d=>{o.emit("keydown",d)},onChangeInputType:()=>{u.value=u.value==="password"?"text":"password"}}},render(){const{modelValue:n,showPreviewIcon:o,showPwdIcon:i,inputCls:a,inputType:p,maxLength:s,autoFocus:u,placeholder:c,disabled:f,onInput:y,onFocus:h,onBlur:w,onChange:g,onKeydown:I,onChangeInputType:v}=this;return e.createVNode("div",{class:"devui-input__wrap"},[e.withDirectives(e.createVNode("input",e.mergeProps({dinput:!0},{value:n,disabled:f,type:p,maxlength:s,placeholder:c,class:a,onInput:y,onFocus:h,onBlur:w,onChange:g,onKeydown:I}),null),[[e.resolveDirective("focus"),u]]),i&&e.createVNode("div",{class:"devui-input__preview",onClick:v},[o?e.createVNode(e.resolveComponent("d-icon"),{name:"preview-forbidden",size:"12px",key:1},null):e.createVNode(e.resolveComponent("d-icon"),{name:"preview",size:"12px",key:2},null)])])}}),C={title:"Input \u8F93\u5165\u6846",category:"\u6570\u636E\u5F55\u5165",status:"100%",install(n){n.component(r.name,r)}};t.Input=r,t.default=C,t.inputProps=m,Object.defineProperty(t,"__esModule",{value:!0}),t[Symbol.toStringTag]="Module"});

package/layout/index.es.js

@@ -9,7 +9,7 @@ var Layout = defineComponent({
     return () => {
       var _a;
       const slotDefault = (_a = slots.default) == null ? void 0 : _a.call(slots);
-      const isAside = slotDefault.some((item) => item.type.name === "DAside");
+      const isAside = slotDefault.some((item) => item.name === "DAside");
       const classNames = `${isAside ? "devui-layout-aside " : ""}devui-layout`;
       return createVNode("div", {
         "class": classNames
@@ -70,31 +70,16 @@ var Aside = defineComponent({
     };
   }
 });
-Layout.install = function(app) {
-  app.component(Layout.name, Layout);
-};
-Content.install = function(app) {
-  app.component(Content.name, Content);
-};
-Header.install = function(app) {
-  app.component(Header.name, Header);
-};
-Footer.install = function(app) {
-  app.component(Footer.name, Footer);
-};
-Aside.install = function(app) {
-  app.component(Aside.name, Aside);
-};
 var index = {
   title: "Layout \u5E03\u5C40",
   category: "\u5E03\u5C40",
   status: "100%",
   install(app) {
-    app.use(Layout);
-    app.use(Content);
-    app.use(Header);
-    app.use(Footer);
-    app.use(Aside);
+    app.component(Layout.name, Layout);
+    app.component(Content.name, Content);
+    app.component(Header.name, Header);
+    app.component(Footer.name, Footer);
+    app.component(Aside.name, Aside);
   }
 };
 export { Aside, Content, Footer, Header, Layout, index as default };

package/layout/index.umd.js

@@ -1 +1 @@
-(function(i,t){typeof exports=="object"&&typeof module!="undefined"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(i=typeof globalThis!="undefined"?globalThis:i||self,t(i.index={},i.Vue))})(this,function(i,t){"use strict";var v="",d=t.defineComponent({name:"DLayout",emits:[],setup(e,{slots:n}){return()=>{var c;const a=(c=n.default)==null?void 0:c.call(n),p=`${a.some(l=>l.type.name==="DAside")?"devui-layout-aside ":""}devui-layout`;return t.createVNode("div",{class:p},[a])}}}),y="",u=t.defineComponent({name:"DContent",setup(e,{slots:n}){return()=>{var a;return t.createVNode("div",{class:"devui-content"},[(a=n.default)==null?void 0:a.call(n)])}}}),s="",o=t.defineComponent({name:"DHeader",setup(e,{slots:n}){return()=>{var a;return t.createVNode("div",{class:"devui-header"},[(a=n.default)==null?void 0:a.call(n)])}}}),C="",r=t.defineComponent({name:"DFooter",setup(e,{slots:n}){return()=>{var a;return t.createVNode("div",{class:"devui-footer"},[(a=n.default)==null?void 0:a.call(n)])}}}),f=t.defineComponent({name:"DAside",setup(e,{slots:n}){return()=>{var a;return t.createVNode("div",null,[(a=n.default)==null?void 0:a.call(n)])}}});d.install=function(e){e.component(d.name,d)},u.install=function(e){e.component(u.name,u)},o.install=function(e){e.component(o.name,o)},r.install=function(e){e.component(r.name,r)},f.install=function(e){e.component(f.name,f)};var m={title:"Layout \u5E03\u5C40",category:"\u5E03\u5C40",status:"100%",install(e){e.use(d),e.use(u),e.use(o),e.use(r),e.use(f)}};i.Aside=f,i.Content=u,i.Footer=r,i.Header=o,i.Layout=d,i.default=m,Object.defineProperty(i,"__esModule",{value:!0}),i[Symbol.toStringTag]="Module"});
+(function(d,n){typeof exports=="object"&&typeof module!="undefined"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(d=typeof globalThis!="undefined"?globalThis:d||self,n(d.index={},d.Vue))})(this,function(d,n){"use strict";var y="",o=n.defineComponent({name:"DLayout",emits:[],setup(a,{slots:e}){return()=>{var f;const t=(f=e.default)==null?void 0:f.call(e),p=`${t.some(v=>v.name==="DAside")?"devui-layout-aside ":""}devui-layout`;return n.createVNode("div",{class:p},[t])}}}),C="",i=n.defineComponent({name:"DContent",setup(a,{slots:e}){return()=>{var t;return n.createVNode("div",{class:"devui-content"},[(t=e.default)==null?void 0:t.call(e)])}}}),D="",r=n.defineComponent({name:"DHeader",setup(a,{slots:e}){return()=>{var t;return n.createVNode("div",{class:"devui-header"},[(t=e.default)==null?void 0:t.call(e)])}}}),A="",u=n.defineComponent({name:"DFooter",setup(a,{slots:e}){return()=>{var t;return n.createVNode("div",{class:"devui-footer"},[(t=e.default)==null?void 0:t.call(e)])}}}),m=n.defineComponent({name:"DAside",setup(a,{slots:e}){return()=>{var t;return n.createVNode("div",null,[(t=e.default)==null?void 0:t.call(e)])}}}),c={title:"Layout \u5E03\u5C40",category:"\u5E03\u5C40",status:"100%",install(a){a.component(o.name,o),a.component(i.name,i),a.component(r.name,r),a.component(u.name,u),a.component(m.name,m)}};d.Aside=m,d.Content=i,d.Footer=u,d.Header=r,d.Layout=o,d.default=c,Object.defineProperty(d,"__esModule",{value:!0}),d[Symbol.toStringTag]="Module"});