vue-devui 1.0.0-rc.9 → 1.0.0

package/menu/index.umd.js

@@ -0,0 +1 @@
+var Ae=Object.defineProperty;var ze=(h,n,$)=>n in h?Ae(h,n,{enumerable:!0,configurable:!0,writable:!0,value:$}):h[n]=$;var re=(h,n,$)=>(ze(h,typeof n!="symbol"?n+"":n,$),$);(function(h,n){typeof exports=="object"&&typeof module!="undefined"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(h=typeof globalThis!="undefined"?globalThis:h||self,n(h.index={},h.Vue))})(this,function(h,n){"use strict";function $(e,l,t){let s=e;return l&&(s+=`__${l}`),t&&(s+=`--${t}`),s}function S(e,l=!1){const t=l?`.devui-${e}`:`devui-${e}`;return{b:()=>$(t),e:u=>u?$(t,u):"",m:u=>u?$(t,"",u):"",em:(u,f)=>u&&f?$(t,u,f):""}}const Q=[];let U=[];const W=n.ref(24),D=S("menu"),ce=S("submenu"),R=D.b(),X=`${D.b()}-item-horizontal-wrapper`,Y=`${D.b()}-item-select`,Z=`${D.b()}-active-parent`;function de(e){W.value=e}function ue(e){Q.push(e)}function fe(){U=[],Q.forEach(t=>{U.push(t.el.parentElement)});const e=[...U],l=t=>{var s;return(s=/layer_(\d*)/gim.exec(t))==null?void 0:s[1]};for(;e.length;){const t=e.shift();if(t==null?void 0:t.classList.contains(R)){const s=t.children;e.unshift(...Array.from(s));continue}else{if(t.tagName==="DIV")if(t.classList.contains(`${D.b()}-item-vertical-wrapper`)||t.classList.contains(`${ce.b()}-menu-item-vertical-wrapper`)){const s=t.parentElement;if(e.unshift(...Array.from(t.children)),s==null?void 0:s.classList.contains(R))t.classList.add("layer_1");else{let a=l((s==null?void 0:s.classList.value)||"");a=Number(a),t.classList.add(`layer_${a}`)}}else{const s=t.parentElement;let a=l((s==null?void 0:s.classList.value)||"");a=Number(a),t.classList.add(`layer_${a}`),t.style.paddingLeft=`${(a===2?1:a-1)*W.value}px`}if(t.tagName==="UL"){const s=t.parentElement,a=t.children;for(let u=0;u<a.length;u++)e.unshift(a[u]);const c=(s==null?void 0:s.classList.value)||"";let i=l(c);(s==null?void 0:s.classList.contains(R))?(i=1,t.classList.add(`layer_${2}`)):(t.classList.add(`layer_${Number(i)+1}`),i=Number(i)+1)}if(t.tagName==="LI"){const s=t.parentElement,a=(s==null?void 0:s.classList.value)||"";let c=l(a);l(a),c=Number(c),t.style.padding=`0 ${c*W.value}px`}}}}function me(e){var s;const l=e;let t=null;for(let a=0;a<l.length;a++){const c=l[a];((s=c==null?void 0:c.classList)==null?void 0:s.contains(`${D.b()}-horizontal`))&&(t=c)}return t}function pe(e,l){let t=l.target,s=[];const{path:a}=l,c=me(a);for(s=[...Array.from(c.children)],t.tagName==="SPAN"&&(t=t.parentElement);s.length;){const i=s.shift();if((i==null?void 0:i.tagName)==="UL"||(i==null?void 0:i.classList.contains(X))){const u=i==null?void 0:i.children;s.unshift(...Array.from(u))}i!==t&&(i==null||i.classList.remove(Y),i==null||i.classList.remove(Z))}}function he(e,l){const t=[],s=l.path||l.composedPath&&l.composedPath();for(let a=0;a<s.length;a++){const c=s[a];if(!c.classList.contains(R))t.push(...Array.from(c.children));else{t.push(...Array.from(c.children));break}}for(;t.length;){const a=t.shift();((a==null?void 0:a.tagName)==="UL"||(a==null?void 0:a.classList.contains(X)))&&t.push(...Array.from(a==null?void 0:a.children)),a!==e&&((a==null?void 0:a.tagName)==="DIV"&&t.unshift(...Array.from(a==null?void 0:a.children)),a==null||a.classList.remove(Y),a==null||a.classList.remove(Z))}}function ee(e,l,t=!1){t?pe(e,l):he(e,l)}function ge(e){var s;const l=/layer_(\d{1,})/gim,t=e.className;return(s=l.exec(t))==null?void 0:s[1]}const ye={disabled:{type:Boolean,default:!1},href:{type:String,default:""},route:{type:[String,Object]}},te=S("menu");function ne(e,l,t,s){const a=n.ref(!1);return t?e.includes(l)?a.value=!0:a.value=!1:e[0]===l&&!s.value?a.value=!0:a.value=!1,a.value}function be(e){var t,s;let l=e.parentElement;for(;!l.classList.contains(te.b());)((t=l.firstElementChild)==null?void 0:t.tagName)==="DIV"&&((s=l==null?void 0:l.firstElementChild)==null||s.classList.add(`${te.b()}-active-parent`)),l=l.parentElement;return l}function ve(e,l,t,s){if(t&&l){const a=e.route||s,c=l.push(a).then(i=>i);return{route:a,routerResult:c}}}const q=S("menu");function se(e){const l=e.path;for(let t=0;t<l.length;t++){const s=l[t];if(s.classList.contains(`${q.b()}-horizontal`))break;if(s.classList.contains(`${q.b()}-item-horizontal-wrapper`))continue;s.tagName!=="SPAN"&&s.classList.add(`${q.b()}-item-select`)}}const P=S("menu"),_=`${P.b()}-item-select`,Le=`${P.b()}-item-disabled`;var F=n.defineComponent({name:"DMenuItem",props:ye,setup(e,l){var d,g;const t=n.getCurrentInstance(),s=String(t==null?void 0:t.vnode.key),a=n.inject("menuStore"),c=n.inject("mode"),i=n.inject("multiple"),u=n.inject("defaultIndent"),f=n.inject("isCollapsed"),y=n.inject("defaultSelectKey"),{disabled:A}=n.toRefs(e),b=n.ref(ne(y,s,i,A)),E=n.ref(!0),z=n.inject("rootMenuEmit"),x=n.inject("useRouter"),v=t==null?void 0:t.appContext.config.globalProperties.$router,p=n.computed(()=>({[`${P.b()}-item`]:!0,[`${P.b()}-item-isCollapsed`]:f.value,[_]:b.value,[Le]:A.value}));a.on("menuItem:clear:select",()=>{b.value=!1});const L=r=>{var V;r.stopPropagation();const o=r.currentTarget;let m;if(e.disabled&&r.preventDefault(),!e.disabled){if(!i)a.emit("menuItem:clear:select"),ee(o,r,c.value==="horizontal"),c.value==="horizontal"&&se(r),b.value=!0,m=ve(e,v,x,s);else if(o.classList.contains(_)){z("deselect",{type:"deselect",key:s,el:o,e:r}),b.value=!1;return}else b.value=!0,o.classList.add(_);m===void 0?z("select",{type:"select",key:s,el:o,e:r}):z("select",{type:"select",key:s,el:o,e:r,route:m})}if(c.value==="vertical"){const M=r.currentTarget;be(M)}if(c.value==="horizontal"){const M=(V=o.parentElement)==null?void 0:V.parentElement;M==null||M.classList.add(`${P.b()}-active-parent`)}},w=n.createVNode("span",{class:`${P.b()}-icon`},[(g=(d=l.slots).icon)==null?void 0:g.call(d)]),N=n.ref(null);return n.watch(A,()=>{i||(p.value[_]=!1)}),n.watch(()=>y,r=>{b.value=ne(r,s,i,A),p.value[_]=b.value}),n.onMounted(()=>{var m,V;let r="";const o=N.value;c.value==="vertical"&&(((V=(m=o.parentElement)==null?void 0:m.parentElement)==null?void 0:V.classList.contains(P.b()))?(E.value=!0,E.value&&(o.style.paddingRight="",o.style.paddingLeft=`${u}px`),n.watch(f,M=>{M?(o.style.padding!=="0"&&(r=o.style.padding),setTimeout(()=>{o.style.padding="0",o.style.width="",o.style.textAlign="center"},300),o.style.display="block"):(o.style.padding=`${r}`,o.style.textAlign="",o.style.display="flex")})):E.value=!1)}),()=>c.value==="vertical"?n.createVNode("div",{class:`${P.b()}-item-vertical-wrapper`},[n.createVNode("li",{class:p.value,onClick:L,ref:N},[l.slots.icon!==void 0&&w,e.href===""?n.createVNode(n.Transition,{name:"fade"},{default:()=>{var r,o;return[n.withDirectives(n.createVNode("span",null,[(o=(r=l.slots).default)==null?void 0:o.call(r)]),[[n.vShow,!f.value]])]}}):n.createVNode("a",{href:e.href},[n.createVNode(n.Transition,{name:"fade"},{default:()=>{var r,o;return[(o=(r=l.slots).default)==null?void 0:o.call(r)]}})])])]):n.createVNode("li",{class:p.value,onClick:L,ref:N},[l.slots.icon!==void 0&&w,e.href===""?n.createVNode(n.Transition,{name:"fade"},{default:()=>{var r,o;return[n.withDirectives(n.createVNode("span",null,[(o=(r=l.slots).default)==null?void 0:o.call(r)]),[[n.vShow,!f.value]])]}}):n.createVNode("a",{href:e.href},[n.createVNode(n.Transition,{name:"fade"},{default:()=>{var r,o;return[(o=(r=l.slots).default)==null?void 0:o.call(r)]}})])])}});function ae(e=8){const l="abcdefghijklmnopqrstuvwxyz0123456789";let t="";for(let s=0;s<e;s++)t+=l[parseInt((Math.random()*l.length).toString())];return t}function le(e){for(;e&&e.tagName!=="LI"&&e.tagName!=="UL";)e=e.parentElement;return e}const oe="0.3s height ease-in-out, 0.3s padding-top ease-in-out, 0.3s padding-bottom ease-in-out",j={"before-enter"(e){e.style.transition=oe,e.setAttribute("data-oldPadding",e.style.padding),e.setAttribute("data-oldMargin",e.style.margin),e.style.height="0",e.style.padding="0",e.style.margin="0"},enter(e){e.dataset.oldOverflow=e.style.overflow,e.scrollHeight!==0?e.style.height=e.scrollHeight+"px":e.style.height="",e.style.padding=e.getAttribute("data-oldPadding"),e.style.margin=e.getAttribute("data-oldMargin"),e.style.overflow="hidden"},"after-enter"(e){e.style.transition="",e.style.transition="",e.style.height="",e.style.overflow=e.getAttribute("data-overflow")},"before-leave"(e){e.dataset||(e.dataset={}),e.dataset.oldPaddingTop=e.style.paddingTop,e.dataset.oldPaddingBottom=e.style.paddingBottom,e.dataset.oldOverflow=e.style.overflow,e.style.height=e.scrollHeight+"px",e.style.overflow="hidden"},leave(e){e.scrollHeight!==0&&(e.style.transition=oe,e.style.height="0",e.style.paddingTop="0",e.style.paddingBottom="0")},"after-leave"(e){e.style.transition="",e.style.height="",e.style.overflow=e.dataset.oldOverflow,e.style.paddingTop=e.dataset.oldPaddingTop,e.style.paddingBottom=e.dataset.oldPaddingBottom}};var we=n.defineComponent({name:"DMenuTransition",setup(e,l){return()=>n.createVNode(n.Transition,{onBeforeEnter:t=>j["before-enter"](t),onBeforeLeave:t=>j["before-leave"](t),onEnter:t=>j.enter(t),onAfterEnter:t=>j["after-enter"](t),onLeave:t=>j.leave(t),onAfterLeave:t=>j["after-leave"](t)},{default:()=>{var t,s;return[(s=(t=l.slots).default)==null?void 0:s.call(t)]}})}});const Ne={title:{type:String,default:""},disabled:{type:Boolean,default:!1}},O=S("menu"),$e=S("submenu"),I=`${O.b()}-item-horizontal-wrapper-hidden`,H=`${O.b()}-item-horizontal-wrapper-show`;function k(e,l,t){const s=l.currentTarget,a=s.parentElement,c=t.children;if(t.style.padding="0 20px !important",e==="mouseenter"){if((a==null?void 0:a.tagName)==="DIV"){t.classList.add(`${O.b()}-item-horizontal-wrapper-level`);const{width:i}=s.getClientRects()[0];t.style.top="0px",t.style.left=`${i}px`}else t.style.top="26px",t.style.left="0px";t.classList.remove(I),t.classList.add(H);for(let i=0;i<c.length;i++){const u=c[i];if(u.tagName==="UL"&&u.classList.contains($e.b())){const f=u.getElementsByClassName(`${O.b()}-item-horizontal-wrapper`)[0];u.addEventListener("mouseenter",y=>{y.stopPropagation(),k("mouseenter",y,f),f.classList.remove(I),f.classList.add(H)}),u.addEventListener("mouseleave",y=>{y.stopPropagation(),k("mouseleave",y,f),f.classList.remove(H),f.classList.add(I)})}}}e==="mouseleave"&&(t.classList.remove(H),t.classList.add(I))}const G=S("menu"),T=S("submenu").b();var K=n.defineComponent({name:"DSubMenu",props:Ne,setup(e,l){const t=n.ref(!0),{vnode:{key:s}}=n.getCurrentInstance();let a=String(s);const c=n.inject("openKeys"),i=n.ref(c.value.includes(a)),u=n.inject("defaultIndent"),f=n.inject("isCollapsed"),y=n.inject("mode"),A=n.ref(null),b=n.inject("rootMenuEmit"),E=y.value==="horizontal";a==="null"&&(console.warn("[devui][menu]: Key can not be null"),a=`randomKey-${ae(16)}`);const z=d=>{d.stopPropagation();const g=le(d.target);if(!(g.classList.contains(T)&&E)&&(E&&(ee(g,d,!0),se(d)),!e.disabled&&y.value!=="horizontal")){const r=le(d.target),o=c.value.indexOf(a);o>=0&&r.tagName==="UL"?c.value.splice(o,1):r.tagName==="UL"&&c.value.push(a),i.value=c.value.indexOf(a)>=0,b("submenu-change",{type:"submenu-change",state:i.value,key:a,el:g})}},x=n.ref(null);let v;const p=n.ref(null),L=n.ref(null);let w="";const N=n.ref("");return n.watchEffect(()=>{v=x.value,ue({el:p.value})},{flush:"post"}),n.watch(()=>c,d=>{d.value.includes(a)?i.value=!0:i.value=!1},{deep:!0}),n.onMounted(()=>{var r;const d=L.value,g=p.value;fe(),N.value=`layer_${(r=Array.from(g.classList).at(-1))==null?void 0:r.replace("layer_","")}`,E&&!e.disabled&&(p.value.addEventListener("mouseenter",o=>{o.stopPropagation(),k("mouseenter",o,v)}),p.value.addEventListener("mouseleave",o=>{o.stopPropagation(),k("mouseleave",o,v)})),n.watch(f,o=>{const m=Number(ge(g));Number.isNaN(m)||m>2&&(t.value=!f.value),o?(d.style.padding!=="0"&&(w=d.style.padding),setTimeout(()=>{d.style.padding="0",d.style.width="",d.style.textAlign="center"},300),d.style.display="block"):(d.style.padding=`${w}`,d.style.textAlign="",d.style.display="flex")})}),()=>{var d,g,r,o;return n.withDirectives(n.createVNode("ul",{onClick:z,class:[T,N.value,e.disabled&&`${T}-disabled`],ref:p},[n.createVNode("div",{class:[`${T}-title`],style:`padding: 0 ${u}px`,ref:L},[n.createVNode("span",{class:`${G.b()}-icon`},[(g=(d=l.slots)==null?void 0:d.icon)==null?void 0:g.call(d)]),n.withDirectives(n.createVNode("span",{class:`${T}-title-content`},[e.title]),[[n.vShow,!f.value]]),n.withDirectives(n.createVNode("i",{class:{"icon icon-chevron-up":N.value!==`layer_${T}`,"icon icon-chevron-right":N.value===`layer_${T}`,"is-opened":i.value}},null),[[n.vShow,!f.value&&s!=="overflowContainer"]])]),E?n.withDirectives(n.createVNode("div",{class:`${G.b()}-item-horizontal-wrapper ${G.b()}-item-horizontal-wrapper-hidden`,ref:x},[(o=(r=l.slots).default)==null?void 0:o.call(r)]),[[n.vShow,!e.disabled]]):n.createVNode(we,null,{default:()=>{var m,V;return[n.withDirectives(n.createVNode("div",{class:[`${T}-menu-item-vertical-wrapper`],ref:A},[(V=(m=l.slots).default)==null?void 0:V.call(m)]),[[n.vShow,i.value]])]}})]),[[n.vShow,t.value]])}}});const Se={width:{type:String,default:""},collapsed:{type:Boolean,default:!1},collapsedIndent:{type:Number,default:24},indentSize:{type:Number,default:24},multiple:{type:Boolean,default:!1},openKeys:{type:Array,default:[]},defaultSelectKeys:{type:Array,default:[]},mode:{type:String,default:"vertical"},router:{type:Boolean,default:!1}};var Pe="";const C={};class Ce{constructor(l){re(this,"rootMenuName");this.rootMenuName=l}on(l,t){var s;((s=C==null?void 0:C[this.rootMenuName])==null?void 0:s[l])||Reflect.set(C[this.rootMenuName],l,[]),C[this.rootMenuName][l].push(t)}emit(l,...t){C[this.rootMenuName][l].forEach(s=>s(...t))}off(l,t){const s=C[this.rootMenuName][l].indexOf(t);s>=0&&C[this.rootMenuName][l].splice(s,1)}}function Ee(e){return C[e]||Reflect.set(C,e,{}),new Ce(e)}var J=n.defineComponent({name:"DMenu",props:Se,emits:["select","deselect","submenu-change"],setup(e,l){const t=S("menu"),{openKeys:s,mode:a,collapsed:c}=n.toRefs(e),i=ae(16),u=Ee(i);n.provide("menuStore",u),n.provide("isCollapsed",c),n.provide("defaultIndent",e.indentSize),n.provide("multiple",e.multiple),n.provide("openKeys",s),n.provide("defaultSelectKey",e.defaultSelectKeys),n.provide("mode",a),n.provide("collapsedIndent",e.collapsedIndent),n.provide("rootMenuEmit",l.emit),n.provide("useRouter",e.router),de(e.indentSize);const f=n.ref(null),y=n.ref(0),A=n.ref(null),b=`${t.b()}-item-select`,E=n.computed(()=>({[`${t.b()}`]:!0,[`${t.b()}-vertical`]:a.value==="vertical",[`${t.b()}-horizontal`]:a.value==="horizontal",[`${t.b()}-collapsed`]:c.value})),z=n.reactive({[b]:!1,[`${t.b()}-overflow-container`]:!0}),x=v=>{const p=Array.from(v.children);for(const L of p)if(L.classList.contains(b)){z[b]=!0;break}else z[b]=!1};return n.onMounted(()=>{var v;if(e.mode==="horizontal"){let p=!1;const L=(v=A.value)==null?void 0:v.$el,w=f.value,N=w.children,d=L.children[1],g=new IntersectionObserver(r=>{r.forEach(o=>{if(o.isIntersecting){if(!o.target.classList.contains(`${t.b()}-overflow-container`)&&o.target.style.visibility==="hidden"){g.unobserve(o.target),w.insertBefore(o.target,L),o.target.style.visibility="";const m=L.previousElementSibling;if(m&&o.boundingClientRect.width%o.target.getBoundingClientRect().width===0&&g.observe(m),m==null?void 0:m.classList.contains("devui-submenu")){const M=m,ie=m.children[1];M.addEventListener("mouseenter",B=>{B.stopPropagation(),k("mouseenter",B,ie)}),M.addEventListener("mouseleave",B=>{B.stopPropagation(),k("mouseleave",B,ie)})}y.value-=1,g.observe(o.target),d.lastChild&&d.removeChild(d.lastChild),x(d)}}else{const m=o.target.cloneNode(!0);o.target.classList.contains(`${t.b()}-overflow-container`)?p&&o.target.previousElementSibling&&d.children.length?w.appendChild(o.target.previousElementSibling):p=!0:(y.value+=1,o.target.style.visibility="hidden",L.nextSibling?w.insertBefore(o.target,L.nextSibling):w.appendChild(o.target),d.appendChild(m),x(d))}})},{root:w,threshold:1,rootMargin:"8px"});for(let r=0;r<N.length;r++)g.observe(N[r])}}),()=>{var v,p;return n.createVNode("ul",{ref:f,class:E.value,style:[e.collapsed?`width:${e.collapsedIndent*2}px`:`width: ${e.width}`]},[(p=(v=l.slots).default)==null?void 0:p.call(v),n.withDirectives(n.createVNode(K,{ref:A,key:"overflowContainer",title:"...",class:z},null),[[n.vShow,y.value>0&&a.value==="horizontal"]])])}}}),Me={title:"Menu \u83DC\u5355",category:"\u5BFC\u822A",status:"100%",install(e){e.component(J.name,J),e.component(F.name,F),e.component(K.name,K)}};h.Menu=J,h.MenuItem=F,h.SubMenu=K,h.default=Me,Object.defineProperty(h,"__esModule",{value:!0}),h[Symbol.toStringTag]="Module"});

package/menu/package.json

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

package/menu/style.css

@@ -0,0 +1 @@
+.devui-menu-vertical a,.devui-menu-vertical a:hover,.devui-menu-vertical a:active,.devui-menu-vertical a:visited,.devui-menu-horizontal a,.devui-menu-horizontal a:hover,.devui-menu-horizontal a:active,.devui-menu-horizontal a:visited{text-decoration:none}.devui-menu-vertical ul,.devui-menu-vertical li,.devui-menu-horizontal ul,.devui-menu-horizontal li{list-style:none;white-space:nowrap}.devui-menu-horizontal{display:flex;box-sizing:border-box;line-height:var(--devui-line-height-base, 1.5);background:var(--devui-global-bg-normal);padding:14px 20px}.devui-menu-horizontal .devui-menu-item{display:flex;position:relative;box-sizing:content-box;padding:0 20px!important;line-height:24px;cursor:pointer}.devui-menu-horizontal .devui-menu-item:after{content:"";display:block;position:absolute;left:20px;right:20px;bottom:0;width:auto;height:2px}.devui-menu-horizontal :after{transition:all var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1));background:transparent}.devui-menu-horizontal .devui-menu-item-select .devui-submenu-title-content,.devui-menu-horizontal .devui-menu-active-parent .devui-submenu-title-content{color:var(--devui-menu-item-hover)}.devui-menu-horizontal .devui-menu-item-select:after,.devui-menu-horizontal .devui-menu-active-parent:after{display:block;position:absolute;left:20px;right:20px;bottom:0;width:auto;height:2px;content:"";opacity:1;background:var(--devui-brand, #5e7ce0)}.devui-menu-horizontal .devui-menu-item span,.devui-menu-horizontal .devui-menu-item a{color:var(--devui-text, #252b3a)}.devui-menu-horizontal .devui-menu-item:hover span,.devui-menu-horizontal .devui-menu-item:hover a{color:var(--devui-brand, #5e7ce0)}.devui-menu-horizontal .devui-menu-item:hover:after{background:var(--devui-brand, #5e7ce0)}.devui-menu-horizontal .devui-submenu{margin:0;padding:0;position:relative}.devui-menu-horizontal .devui-submenu div.devui-submenu-title{padding:0 20px}.devui-menu-horizontal .devui-submenu div.devui-submenu-title span{margin:0}.devui-menu-horizontal .devui-submenu div.devui-submenu-title .icon-chevron-up,.devui-menu-horizontal .devui-submenu div.devui-submenu-title .icon-chevron-right{transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-menu-horizontal .devui-submenu:after{content:"";display:block;position:absolute;left:20px;right:20px;bottom:0;width:auto;height:2px}.devui-menu-horizontal .devui-submenu:hover{cursor:pointer}.devui-menu-horizontal .devui-submenu:hover:after{background:var(--devui-brand, #5e7ce0)}.devui-menu-horizontal .devui-submenu:hover>div>i.icon-chevron-up{transform:rotate(180deg)}.devui-menu-horizontal .devui-submenu:hover>div>i.icon-chevron-right{transform:rotate(180deg)}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper{transition:all var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1)),left 0 linear;background:var(--devui-global-bg-normal);z-index:var(--devui-z-index-modal, 1050)}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-show{transition:all var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1));opacity:1;visibility:visible;max-height:100vh;padding:10px 0!important;border-radius:8px;position:absolute}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-show .devui-menu-item{margin-top:5px}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-show .devui-submenu{margin:5px 0;padding:0 20px!important}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-show .devui-submenu div.devui-submenu-title{padding:0!important}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-show .devui-menu-item-horizontal-wrapper-level .devui-submenu{padding:0 20px!important}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-hidden{transition:all var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1));visibility:hidden;position:absolute;padding:0!important;max-height:0;overflow:hidden;opacity:0}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-hidden .devui-menu-item{margin-top:5px}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-hidden .devui-submenu{margin:5px 0;padding:0 20px!important}.devui-menu-horizontal .devui-submenu div.devui-menu-item-horizontal-wrapper-hidden .devui-submenu div.devui-submenu-title{padding:0!important}.devui-menu-horizontal .devui-menu-item-disabled span,.devui-menu-horizontal .devui-menu-item-disabled a,.devui-menu-horizontal .devui-submenu-disabled span,.devui-menu-horizontal .devui-submenu-disabled a{color:var(--devui-menu-disabled)!important;cursor:not-allowed}.devui-menu-horizontal .devui-menu-item-disabled:after,.devui-menu-horizontal .devui-submenu-disabled:after{content:unset!important}.devui-menu-horizontal .devui-menu-item-disabled+.devui-menu-item-horizontal-wrapper,.devui-menu-horizontal .devui-submenu-disabled+.devui-menu-item-horizontal-wrapper{display:none}.devui-submenu-menu-item-vertical-wrapper{overflow:hidden}.devui-submenu-menu-item{color:var(--devui-menu-item)}.devui-menu-vertical{padding:0;transition:width var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1)),padding var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1));border-right:var(--devui-line, #d7d8da) 1px solid;background:var(--devui-area, #f8f8f8)!important}.devui-menu-vertical :after{transition:all var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1));background:transparent}.devui-menu-vertical .layer_1{margin:0!important}.devui-menu-vertical .layer_2>div.devui-submenu-title{margin:0!important;background:var(--devui-block, #ffffff)}.devui-menu-vertical.devui-menu-collapsed .devui-menu-icon{margin:auto}.devui-menu-vertical.devui-menu-collapsed ul li{display:none!important}.devui-menu-vertical.devui-menu-collapsed .devui-submenu div.devui-submenu-title .devui-menu-icon{margin:auto}.devui-menu-vertical .devui-menu-item-vertical-wrapper{padding-left:0!important}.devui-menu-vertical .devui-menu-item{width:100%;height:40px;flex-grow:1;line-height:40px;cursor:pointer;color:var(--devui-menu-item);background:var(--devui-block, #ffffff);display:flex}.devui-menu-vertical .devui-menu-item span:nth-child(2){text-align:left}.devui-menu-vertical div:not(.devui-submenu-menu-item-vertical-wrapper){display:flex;flex:auto}.devui-menu-vertical .devui-menu-item:after{display:block;position:absolute;right:0;top:0;transform:scaleX(0);content:"";opacity:1;background:var(--devui-primary-hover, #5e7ce0)}.devui-menu-vertical ul.devui-submenu{margin:0;padding:0}.devui-menu-vertical ul.devui-submenu .devui-menu-item{display:flex;background:var(--devui-area, #f8f8f8)}.devui-menu-vertical ul.devui-submenu .devui-menu-item>span{flex:auto;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;transition:all var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1));color:var(--devui-menu-item)}.devui-menu-vertical ul.devui-submenu div.devui-submenu-title{display:flex;cursor:pointer;width:100%;height:40px;margin:4px 0;line-height:40px;padding-left:18px;align-items:center;color:var(--devui-menu-item)}.devui-menu-vertical ul.devui-submenu div.devui-submenu-title:nth-child(1){font-size:var(--devui-font-size-lg, 14px)}.devui-menu-vertical ul.devui-submenu div.devui-submenu-title span.devui-submenu-title-content{font-size:var(--devui-font-size-lg, 14px);flex:auto;color:var(--devui-menu-item)}.devui-menu-vertical ul.devui-submenu div.devui-submenu-title span.devui-menu-icon{text-align:center}.devui-menu-vertical ul.devui-submenu div.devui-submenu-title .icon-chevron-up{transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-menu-vertical ul.devui-submenu div.devui-submenu-title i.icon-chevron-up.is-opened{transform:rotate(180deg)}.devui-menu-vertical ul.devui-submenu .devui-submenu-title:hover span{color:var(--devui-menu-item-hover)!important}.devui-menu-vertical ul.devui-submenu .devui-menu-item:hover span{color:var(--devui-menu-item-hover)}.devui-menu-vertical ul.devui-submenu .devui-menu-item-select *{color:var(--devui-menu-item-hover)!important}.devui-menu-vertical .devui-menu-item-select{background:var(--devui-primary-bg, #f2f5fc)!important;position:relative}.devui-menu-vertical .devui-menu-item-select span,.devui-menu-vertical .devui-menu-item-select a{color:var(--devui-menu-item-hover)}.devui-menu-vertical .devui-menu-item-select:after{display:block;position:absolute;right:0;top:0;height:100%;width:4px;content:"";opacity:1;background:var(--devui-brand, #5e7ce0);transform:scaleX(1)}.devui-menu-vertical .devui-menu-item:hover{color:var(--devui-menu-item-hover)}.devui-menu-vertical li.devui-menu-item,.devui-menu-vertical div.devui-submenu-title{white-space:nowrap;overflow:hidden}.devui-menu-vertical li.devui-menu-item span:nth-child(2),.devui-menu-vertical div.devui-submenu-title span:nth-child(2){overflow:hidden;text-overflow:ellipsis}.devui-menu-vertical li.devui-menu-item span:nth-child(2) span,.devui-menu-vertical div.devui-submenu-title span:nth-child(2) span{overflow:hidden;text-overflow:ellipsis}.devui-menu-vertical .devui-menu-item-isCollapsed{width:fit-content}.devui-menu-vertical .devui-menu-item-isCollapsed .devui-menu-icon{margin:auto}.devui-menu-vertical ul li~ul>div{margin-top:0!important}.devui-menu-vertical .devui-menu-item-disabled *,.devui-menu-vertical .devui-submenu-disabled *{color:var(--devui-menu-disabled)!important;cursor:not-allowed!important;background:var(--devui-block, #ffffff)!important}.devui-menu-vertical .devui-menu-item-disabled:after,.devui-menu-vertical .devui-submenu-disabled:after{content:unset}.devui-menu-icon+span{margin-left:10px}.devui-menu-item-disabled:hover,.devui-submenu-disabled:hover{color:var(--devui-menu-disabled)!important;cursor:not-allowed!important}.devui-submenu-disabled:hover span{color:var(--devui-menu-disabled)!important}.fade-enter-active,.fade-leave-active{transition:opacity var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-smooth, cubic-bezier(.645, .045, .355, 1))}.fade-leave-to{display:none}.fade-enter-from,.fade-leave-to{opacity:0}.devui-menu-item-disabled,.devui-menu-item-disabled.devui-menu-vertical .devui-menu-item-disabled.devui-menu-item-select .devui-submenu-disabled,.devui-submenu-disabled.devui-menu-vertical,.devui-submenu-disabled.devui-menu-item-select{color:var(--devui-menu-disabled)!important;cursor:not-allowed!important}

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

@@ -0,0 +1,538 @@
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+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;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+import { defineComponent, toRefs, computed, createVNode, resolveDynamicComponent, mergeProps, watch, Transition, shallowReactive, createApp, onUnmounted, isVNode, reactive } from "vue";
+const isString = (val) => typeof val === "string";
+const DEFAULT_PREFIX = "icon";
+const iconProps = {
+  name: {
+    type: String,
+    default: "",
+    required: true
+  },
+  size: {
+    type: [Number, String],
+    default: "inherit"
+  },
+  color: {
+    type: String,
+    default: "inherit"
+  },
+  component: {
+    type: Object,
+    default: null
+  },
+  classPrefix: {
+    type: String,
+    default: DEFAULT_PREFIX
+  },
+  operable: {
+    type: Boolean,
+    default: false
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  rotate: {
+    type: [Number, String]
+  }
+};
+const svgIconProps = {
+  name: {
+    type: String,
+    default: "",
+    required: true
+  },
+  color: {
+    type: String,
+    default: "inherit"
+  },
+  size: {
+    type: [Number, String],
+    default: "inherit"
+  }
+};
+function createBem(namespace, element, modifier) {
+  let cls = namespace;
+  if (element) {
+    cls += `__${element}`;
+  }
+  if (modifier) {
+    cls += `--${modifier}`;
+  }
+  return cls;
+}
+function useNamespace(block, needDot = false) {
+  const namespace = needDot ? `.devui-${block}` : `devui-${block}`;
+  const b = () => createBem(namespace);
+  const e = (element) => element ? createBem(namespace, element) : "";
+  const m = (modifier) => modifier ? createBem(namespace, "", modifier) : "";
+  const em = (element, modifier) => element && modifier ? createBem(namespace, element, modifier) : "";
+  return {
+    b,
+    e,
+    m,
+    em
+  };
+}
+var icon = "";
+var svgIcon = defineComponent({
+  name: "DSvgIcon",
+  props: svgIconProps,
+  setup(props) {
+    const {
+      name,
+      color,
+      size
+    } = toRefs(props);
+    const ns2 = useNamespace("svg-icon");
+    const iconName = computed(() => `#icon-${name.value}`);
+    const iconSize = computed(() => {
+      return typeof size.value === "number" ? `${size.value}px` : size.value;
+    });
+    const styles = {
+      width: iconSize.value,
+      height: iconSize.value
+    };
+    return () => {
+      return createVNode("svg", {
+        "class": ns2.b(),
+        "style": styles
+      }, [createVNode("use", {
+        "xlink:href": iconName.value,
+        "fill": color.value
+      }, null)]);
+    };
+  }
+});
+function isUrl(value) {
+  return /^((http|https):)?\/\//.test(value);
+}
+function useIconDom(props, ctx) {
+  const {
+    component,
+    name,
+    size,
+    color,
+    classPrefix,
+    rotate
+  } = toRefs(props);
+  const ns2 = useNamespace("icon");
+  const iconSize = computed(() => {
+    return typeof size.value === "number" ? `${size.value}px` : size.value;
+  });
+  const IconComponent = component.value ? resolveDynamicComponent(component.value) : resolveDynamicComponent(svgIcon);
+  const imgIconDom = () => {
+    return createVNode("img", mergeProps({
+      "src": name.value,
+      "alt": name.value.split("/")[name.value.split("/").length - 1],
+      "class": [(rotate == null ? void 0 : rotate.value) === "infinite" && ns2.m("spin")],
+      "style": {
+        width: iconSize.value || "",
+        transform: `rotate(${rotate == null ? void 0 : rotate.value}deg)`,
+        verticalAlign: "middle"
+      }
+    }, ctx.attrs), null);
+  };
+  const svgIconDom = () => {
+    return createVNode(IconComponent, mergeProps({
+      "name": name.value,
+      "color": color.value,
+      "size": iconSize.value,
+      "class": [(rotate == null ? void 0 : rotate.value) === "infinite" && ns2.m("spin")],
+      "style": {
+        transform: `rotate(${rotate == null ? void 0 : rotate.value}deg)`
+      }
+    }, ctx.attrs), null);
+  };
+  const fontIconDom = () => {
+    const fontIconClass = /^icon-/.test(name.value) ? name.value : `${classPrefix.value}-${name.value}`;
+    return createVNode("i", mergeProps({
+      "class": [classPrefix.value, fontIconClass, (rotate == null ? void 0 : rotate.value) === "infinite" && ns2.m("spin")],
+      "style": {
+        fontSize: iconSize.value,
+        color: color.value,
+        transform: `rotate(${rotate == null ? void 0 : rotate.value}deg)`
+      }
+    }, ctx.attrs), null);
+  };
+  const iconDom = () => {
+    return component.value ? svgIconDom() : isUrl(name.value) ? imgIconDom() : fontIconDom();
+  };
+  return {
+    iconDom
+  };
+}
+var Icon = defineComponent({
+  name: "DIcon",
+  props: iconProps,
+  emits: ["click"],
+  setup(props, ctx) {
+    const {
+      disabled,
+      operable
+    } = toRefs(props);
+    const {
+      iconDom
+    } = useIconDom(props, ctx);
+    const ns2 = useNamespace("icon");
+    const wrapClassed = computed(() => ({
+      [ns2.e("container")]: true,
+      [ns2.m("disabled")]: disabled.value,
+      [ns2.m("operable")]: operable.value
+    }));
+    const onClick = (e) => {
+      if (disabled.value) {
+        return;
+      }
+      ctx.emit("click", e);
+    };
+    return () => {
+      var _a, _b, _c, _d;
+      return createVNode("div", {
+        "class": wrapClassed.value,
+        "onClick": onClick
+      }, [(_b = (_a = ctx.slots).prefix) == null ? void 0 : _b.call(_a), iconDom(), (_d = (_c = ctx.slots).suffix) == null ? void 0 : _d.call(_c)]);
+    };
+  }
+});
+var iconGroup = "";
+defineComponent({
+  name: "DIconGroup",
+  setup(_, ctx) {
+    const ns2 = useNamespace("icon-group");
+    return () => {
+      var _a, _b;
+      return createVNode("div", {
+        "class": ns2.b()
+      }, [(_b = (_a = ctx.slots).default) == null ? void 0 : _b.call(_a)]);
+    };
+  }
+});
+var Close = defineComponent({
+  emits: ["click"],
+  setup(props, {
+    emit
+  }) {
+    const ns2 = useNamespace("message");
+    return () => createVNode("div", {
+      "class": ns2.e("icon-close"),
+      "onClick": (e) => emit("click", e)
+    }, [createVNode(Icon, {
+      "name": "close",
+      "size": "14px"
+    }, null)]);
+  }
+});
+const messageProps = {
+  id: {
+    type: String,
+    default: ""
+  },
+  visible: {
+    type: Boolean,
+    default: false
+  },
+  message: {
+    type: String,
+    default: ""
+  },
+  type: {
+    type: String,
+    default: "normal"
+  },
+  bordered: {
+    type: Boolean,
+    default: true
+  },
+  shadow: {
+    type: Boolean,
+    default: true
+  },
+  duration: {
+    type: Number,
+    default: 3e3
+  },
+  showClose: {
+    type: Boolean,
+    default: false
+  },
+  onClose: {
+    type: Function
+  }
+};
+const ns = useNamespace("message");
+function SuccessIcon() {
+  return createVNode("svg", {
+    "viewBox": "0 0 1024 1024",
+    "xmlns": "http://www.w3.org/2000/svg",
+    "class": ns.e("icon")
+  }, [createVNode("path", {
+    "fill": "currentColor",
+    "d": "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm-55.808 536.384-99.52-99.584a38.4 38.4 0 1 0-54.336 54.336l126.72 126.72a38.272 38.272 0 0 0 54.336 0l262.4-262.464a38.4 38.4 0 1 0-54.272-54.336L456.192 600.384z"
+  }, null)]);
+}
+function WarningIcon() {
+  return createVNode("svg", {
+    "viewBox": "0 0 1024 1024",
+    "xmlns": "http://www.w3.org/2000/svg",
+    "class": ns.e("icon")
+  }, [createVNode("path", {
+    "fill": "currentColor",
+    "d": "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm0 192a58.432 58.432 0 0 0-58.24 63.744l23.36 256.384a35.072 35.072 0 0 0 69.76 0l23.296-256.384A58.432 58.432 0 0 0 512 256zm0 512a51.2 51.2 0 1 0 0-102.4 51.2 51.2 0 0 0 0 102.4z"
+  }, null)]);
+}
+function InfoIcon() {
+  return createVNode("svg", {
+    "viewBox": "0 0 1024 1024",
+    "xmlns": "http://www.w3.org/2000/svg",
+    "class": ns.e("icon")
+  }, [createVNode("path", {
+    "fill": "currentColor",
+    "d": "M512 64a448 448 0 1 1 0 896.064A448 448 0 0 1 512 64zm67.2 275.072c33.28 0 60.288-23.104 60.288-57.344s-27.072-57.344-60.288-57.344c-33.28 0-60.16 23.104-60.16 57.344s26.88 57.344 60.16 57.344zM590.912 699.2c0-6.848 2.368-24.64 1.024-34.752l-52.608 60.544c-10.88 11.456-24.512 19.392-30.912 17.28a12.992 12.992 0 0 1-8.256-14.72l87.68-276.992c7.168-35.136-12.544-67.2-54.336-71.296-44.096 0-108.992 44.736-148.48 101.504 0 6.784-1.28 23.68.064 33.792l52.544-60.608c10.88-11.328 23.552-19.328 29.952-17.152a12.8 12.8 0 0 1 7.808 16.128L388.48 728.576c-10.048 32.256 8.96 63.872 55.04 71.04 67.84 0 107.904-43.648 147.456-100.416z"
+  }, null)]);
+}
+function ErrorIcon() {
+  return createVNode("svg", {
+    "viewBox": "0 0 1024 1024",
+    "xmlns": "http://www.w3.org/2000/svg",
+    "class": ns.e("icon")
+  }, [createVNode("path", {
+    "fill": "currentColor",
+    "d": "M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm0 393.664L407.936 353.6a38.4 38.4 0 1 0-54.336 54.336L457.664 512 353.6 616.064a38.4 38.4 0 1 0 54.336 54.336L512 566.336 616.064 670.4a38.4 38.4 0 1 0 54.336-54.336L566.336 512 670.4 407.936a38.4 38.4 0 1 0-54.336-54.336L512 457.664z"
+  }, null)]);
+}
+var message$1 = "";
+var Message$1 = defineComponent({
+  name: "DMessage",
+  props: messageProps,
+  emits: ["destroy", "close"],
+  setup(props, {
+    emit,
+    slots
+  }) {
+    const {
+      visible,
+      message: message2,
+      type,
+      bordered,
+      shadow,
+      showClose
+    } = toRefs(props);
+    const ns2 = useNamespace("message");
+    let timer = null;
+    let timestamp;
+    const handleDestroy = () => {
+      emit("destroy");
+    };
+    const close = () => {
+      var _a;
+      timer && clearTimeout(timer);
+      timer = null;
+      (_a = props.onClose) == null ? void 0 : _a.call(props);
+    };
+    const interrupt = () => {
+      if (timer) {
+        clearTimeout(timer);
+        timer = null;
+      }
+    };
+    const removeReset = () => {
+      if (props.visible) {
+        const remainTime = props.duration - (Date.now() - timestamp);
+        timer = setTimeout(close, remainTime);
+      }
+    };
+    watch(() => props.visible, (val) => {
+      if (val) {
+        timestamp = Date.now();
+        if (props.duration) {
+          timer = setTimeout(close, props.duration);
+        }
+      }
+    });
+    const classes = computed(() => ({
+      [ns2.b()]: true,
+      [ns2.m(type.value)]: true
+    }));
+    const lastOffset = computed(() => getLastOffset(props.id));
+    const styles = computed(() => {
+      const messageStyles = {};
+      if (!bordered.value) {
+        messageStyles["border"] = "none";
+      }
+      if (!shadow.value) {
+        messageStyles["box-shadow"] = "none";
+      }
+      return __spreadProps(__spreadValues({}, messageStyles), {
+        top: `${lastOffset.value}px`
+      });
+    });
+    const renderIcon = computed(() => {
+      const iconClasses = computed(() => ({
+        [ns2.e("image")]: true,
+        [ns2.em("image", type.value)]: true
+      }));
+      return !(!type.value || type.value === "normal") && createVNode("span", {
+        "class": iconClasses.value
+      }, [type.value && (type.value === "success" && createVNode(SuccessIcon, null, null) || type.value === "info" && createVNode(InfoIcon, null, null) || type.value === "warning" && createVNode(WarningIcon, null, null) || type.value === "error" && createVNode(ErrorIcon, null, null))]);
+    });
+    const renderText = computed(() => {
+      var _a;
+      const textClasses = computed(() => ({
+        [ns2.e("content")]: true,
+        [ns2.em("content", type.value)]: true
+      }));
+      return createVNode("span", {
+        "class": textClasses.value
+      }, [message2.value ? message2.value : (_a = slots.default) == null ? void 0 : _a.call(slots)]);
+    });
+    const renderClose = computed(() => {
+      return showClose.value && createVNode("span", {
+        "class": [ns2.e("close")],
+        "onClick": close
+      }, [createVNode(Close, null, null)]);
+    });
+    return () => {
+      return createVNode(Transition, {
+        "name": "message-fade",
+        "onAfterLeave": handleDestroy
+      }, {
+        default: () => [visible.value && createVNode("div", {
+          "class": classes.value,
+          "style": __spreadValues({}, styles.value),
+          "onMouseenter": interrupt,
+          "onMouseleave": removeReset
+        }, [renderIcon.value, renderText.value, renderClose.value])]
+      });
+    };
+  }
+});
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !isVNode(s);
+}
+const instances = shallowReactive([]);
+const getLastOffset = (id) => {
+  const idx = instances.findIndex((instance) => instance.id === id);
+  return idx * 65 + 80;
+};
+const deleteInstance = (id) => {
+  const idx = instances.findIndex((instance) => instance.id === id);
+  if (idx !== -1) {
+    instances.splice(idx, 1);
+  }
+  return idx;
+};
+const initInstance = (id, props, message2) => {
+  const container = document.createElement("div");
+  container.id = id;
+  const app = createApp({
+    setup() {
+      onUnmounted(() => {
+        document.body.removeChild(container);
+      });
+      return () => createVNode(Message$1, mergeProps(props, {
+        "id": id,
+        "onDestroy": app.unmount
+      }), _isSlot(message2) ? message2 : {
+        default: () => [message2]
+      });
+    }
+  });
+  document.body.appendChild(container);
+  app.mount(container);
+  return {
+    id,
+    props
+  };
+};
+const defaultOptions = {
+  duration: 3e3,
+  type: "normal"
+};
+const normalizeOptions = (params) => {
+  const options = !params || isString(params) ? {
+    message: params
+  } : params;
+  const normalized = __spreadValues(__spreadValues({}, defaultOptions), options);
+  return normalized;
+};
+let seed = 0;
+function open(options) {
+  const originOnClose = options.onClose || null;
+  const messageContent = options.message;
+  delete options.message;
+  const props = reactive(__spreadProps(__spreadValues(__spreadValues({}, defaultOptions), options), {
+    onClose: () => {
+      props.visible = false;
+      deleteInstance(props.id);
+      originOnClose == null ? void 0 : originOnClose();
+    }
+  }));
+  seed++;
+  const id = `message_${seed}`;
+  props.id = id;
+  const messageContext = initInstance(id, props, messageContent);
+  instances.push(messageContext);
+  props.visible = true;
+}
+function message(params) {
+  const options = normalizeOptions(params);
+  open(__spreadValues({}, options));
+}
+function success(params) {
+  const options = normalizeOptions(params);
+  open(__spreadProps(__spreadValues({}, options), {
+    type: "success"
+  }));
+}
+function error(params) {
+  const options = normalizeOptions(params);
+  open(__spreadProps(__spreadValues({}, options), {
+    type: "error"
+  }));
+}
+function warning(params) {
+  const options = normalizeOptions(params);
+  open(__spreadProps(__spreadValues({}, options), {
+    type: "warning"
+  }));
+}
+function info(params) {
+  const options = normalizeOptions(params);
+  open(__spreadProps(__spreadValues({}, options), {
+    type: "info"
+  }));
+}
+const Message = Object.assign(message, {
+  success,
+  error,
+  warning,
+  info
+});
+var index = {
+  title: "Message \u5168\u5C40\u63D0\u793A",
+  category: "\u53CD\u9988",
+  status: "100%",
+  install(app) {
+    app.config.globalProperties.$message = Message;
+  }
+};
+export { Message, index as default, messageProps };

package/message/index.umd.js

@@ -0,0 +1 @@
+var ie=Object.defineProperty,ue=Object.defineProperties;var de=Object.getOwnPropertyDescriptors;var B=Object.getOwnPropertySymbols;var me=Object.prototype.hasOwnProperty,fe=Object.prototype.propertyIsEnumerable;var L=(c,e,f)=>e in c?ie(c,e,{enumerable:!0,configurable:!0,writable:!0,value:f}):c[e]=f,p=(c,e)=>{for(var f in e||(e={}))me.call(e,f)&&L(c,f,e[f]);if(B)for(var f of B(e))fe.call(e,f)&&L(c,f,e[f]);return c},b=(c,e)=>ue(c,de(e));(function(c,e){typeof exports=="object"&&typeof module!="undefined"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(c=typeof globalThis!="undefined"?globalThis:c||self,e(c.index={},c.Vue))})(this,function(c,e){"use strict";const f=n=>typeof n=="string",_={name:{type:String,default:"",required:!0},size:{type:[Number,String],default:"inherit"},color:{type:String,default:"inherit"},component:{type:Object,default:null},classPrefix:{type:String,default:"icon"},operable:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},rotate:{type:[Number,String]}},k={name:{type:String,default:"",required:!0},color:{type:String,default:"inherit"},size:{type:[Number,String],default:"inherit"}};function C(n,t,s){let o=n;return t&&(o+=`__${t}`),s&&(o+=`--${s}`),o}function v(n,t=!1){const s=t?`.devui-${n}`:`devui-${n}`;return{b:()=>C(s),e:l=>l?C(s,l):"",m:l=>l?C(s,"",l):"",em:(l,d)=>l&&d?C(s,l,d):""}}var ge="",A=e.defineComponent({name:"DSvgIcon",props:k,setup(n){const{name:t,color:s,size:o}=e.toRefs(n),r=v("svg-icon"),a=e.computed(()=>`#icon-${t.value}`),g=e.computed(()=>typeof o.value=="number"?`${o.value}px`:o.value),l={width:g.value,height:g.value};return()=>e.createVNode("svg",{class:r.b(),style:l},[e.createVNode("use",{"xlink:href":a.value,fill:s.value},null)])}});function O(n){return/^((http|https):)?\/\//.test(n)}function R(n,t){const{component:s,name:o,size:r,color:a,classPrefix:g,rotate:l}=e.toRefs(n),d=v("icon"),i=e.computed(()=>typeof r.value=="number"?`${r.value}px`:r.value),m=s.value?e.resolveDynamicComponent(s.value):e.resolveDynamicComponent(A),y=()=>e.createVNode("img",e.mergeProps({src:o.value,alt:o.value.split("/")[o.value.split("/").length-1],class:[(l==null?void 0:l.value)==="infinite"&&d.m("spin")],style:{width:i.value||"",transform:`rotate(${l==null?void 0:l.value}deg)`,verticalAlign:"middle"}},t.attrs),null),x=()=>e.createVNode(m,e.mergeProps({name:o.value,color:a.value,size:i.value,class:[(l==null?void 0:l.value)==="infinite"&&d.m("spin")],style:{transform:`rotate(${l==null?void 0:l.value}deg)`}},t.attrs),null),h=()=>{const z=/^icon-/.test(o.value)?o.value:`${g.value}-${o.value}`;return e.createVNode("i",e.mergeProps({class:[g.value,z,(l==null?void 0:l.value)==="infinite"&&d.m("spin")],style:{fontSize:i.value,color:a.value,transform:`rotate(${l==null?void 0:l.value}deg)`}},t.attrs),null)};return{iconDom:()=>s.value?x():O(o.value)?y():h()}}var j=e.defineComponent({name:"DIcon",props:_,emits:["click"],setup(n,t){const{disabled:s,operable:o}=e.toRefs(n),{iconDom:r}=R(n,t),a=v("icon"),g=e.computed(()=>({[a.e("container")]:!0,[a.m("disabled")]:s.value,[a.m("operable")]:o.value})),l=d=>{s.value||t.emit("click",d)};return()=>{var d,i,m,y;return e.createVNode("div",{class:g.value,onClick:l},[(i=(d=t.slots).prefix)==null?void 0:i.call(d),r(),(y=(m=t.slots).suffix)==null?void 0:y.call(m)])}}}),ve="";e.defineComponent({name:"DIconGroup",setup(n,t){const s=v("icon-group");return()=>{var o,r;return e.createVNode("div",{class:s.b()},[(r=(o=t.slots).default)==null?void 0:r.call(o)])}}});var E=e.defineComponent({emits:["click"],setup(n,{emit:t}){const s=v("message");return()=>e.createVNode("div",{class:s.e("icon-close"),onClick:o=>t("click",o)},[e.createVNode(j,{name:"close",size:"14px"},null)])}});const S={id:{type:String,default:""},visible:{type:Boolean,default:!1},message:{type:String,default:""},type:{type:String,default:"normal"},bordered:{type:Boolean,default:!0},shadow:{type:Boolean,default:!0},duration:{type:Number,default:3e3},showClose:{type:Boolean,default:!1},onClose:{type:Function}},V=v("message");function F(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg",class:V.e("icon")},[e.createVNode("path",{fill:"currentColor",d:"M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm-55.808 536.384-99.52-99.584a38.4 38.4 0 1 0-54.336 54.336l126.72 126.72a38.272 38.272 0 0 0 54.336 0l262.4-262.464a38.4 38.4 0 1 0-54.272-54.336L456.192 600.384z"},null)])}function U(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg",class:V.e("icon")},[e.createVNode("path",{fill:"currentColor",d:"M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm0 192a58.432 58.432 0 0 0-58.24 63.744l23.36 256.384a35.072 35.072 0 0 0 69.76 0l23.296-256.384A58.432 58.432 0 0 0 512 256zm0 512a51.2 51.2 0 1 0 0-102.4 51.2 51.2 0 0 0 0 102.4z"},null)])}function q(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg",class:V.e("icon")},[e.createVNode("path",{fill:"currentColor",d:"M512 64a448 448 0 1 1 0 896.064A448 448 0 0 1 512 64zm67.2 275.072c33.28 0 60.288-23.104 60.288-57.344s-27.072-57.344-60.288-57.344c-33.28 0-60.16 23.104-60.16 57.344s26.88 57.344 60.16 57.344zM590.912 699.2c0-6.848 2.368-24.64 1.024-34.752l-52.608 60.544c-10.88 11.456-24.512 19.392-30.912 17.28a12.992 12.992 0 0 1-8.256-14.72l87.68-276.992c7.168-35.136-12.544-67.2-54.336-71.296-44.096 0-108.992 44.736-148.48 101.504 0 6.784-1.28 23.68.064 33.792l52.544-60.608c10.88-11.328 23.552-19.328 29.952-17.152a12.8 12.8 0 0 1 7.808 16.128L388.48 728.576c-10.048 32.256 8.96 63.872 55.04 71.04 67.84 0 107.904-43.648 147.456-100.416z"},null)])}function G(){return e.createVNode("svg",{viewBox:"0 0 1024 1024",xmlns:"http://www.w3.org/2000/svg",class:V.e("icon")},[e.createVNode("path",{fill:"currentColor",d:"M512 64a448 448 0 1 1 0 896 448 448 0 0 1 0-896zm0 393.664L407.936 353.6a38.4 38.4 0 1 0-54.336 54.336L457.664 512 353.6 616.064a38.4 38.4 0 1 0 54.336 54.336L512 566.336 616.064 670.4a38.4 38.4 0 1 0 54.336-54.336L566.336 512 670.4 407.936a38.4 38.4 0 1 0-54.336-54.336L512 457.664z"},null)])}var ye="",X=e.defineComponent({name:"DMessage",props:S,emits:["destroy","close"],setup(n,{emit:t,slots:s}){const{visible:o,message:r,type:a,bordered:g,shadow:l,showClose:d}=e.toRefs(n),i=v("message");let m=null,y;const x=()=>{t("destroy")},h=()=>{var u;m&&clearTimeout(m),m=null,(u=n.onClose)==null||u.call(n)},P=()=>{m&&(clearTimeout(m),m=null)},z=()=>{if(n.visible){const u=n.duration-(Date.now()-y);m=setTimeout(h,u)}};e.watch(()=>n.visible,u=>{u&&(y=Date.now(),n.duration&&(m=setTimeout(h,n.duration)))});const oe=e.computed(()=>({[i.b()]:!0,[i.m(a.value)]:!0})),se=e.computed(()=>H(n.id)),le=e.computed(()=>{const u={};return g.value||(u.border="none"),l.value||(u["box-shadow"]="none"),b(p({},u),{top:`${se.value}px`})}),ae=e.computed(()=>{const u=e.computed(()=>({[i.e("image")]:!0,[i.em("image",a.value)]:!0}));return!(!a.value||a.value==="normal")&&e.createVNode("span",{class:u.value},[a.value&&(a.value==="success"&&e.createVNode(F,null,null)||a.value==="info"&&e.createVNode(q,null,null)||a.value==="warning"&&e.createVNode(U,null,null)||a.value==="error"&&e.createVNode(G,null,null))])}),ce=e.computed(()=>{var T;const u=e.computed(()=>({[i.e("content")]:!0,[i.em("content",a.value)]:!0}));return e.createVNode("span",{class:u.value},[r.value?r.value:(T=s.default)==null?void 0:T.call(s)])}),re=e.computed(()=>d.value&&e.createVNode("span",{class:[i.e("close")],onClick:h},[e.createVNode(E,null,null)]));return()=>e.createVNode(e.Transition,{name:"message-fade",onAfterLeave:x},{default:()=>[o.value&&e.createVNode("div",{class:oe.value,style:p({},le.value),onMouseenter:P,onMouseleave:z},[ae.value,ce.value,re.value])]})}});function W(n){return typeof n=="function"||Object.prototype.toString.call(n)==="[object Object]"&&!e.isVNode(n)}const I=e.shallowReactive([]),H=n=>I.findIndex(s=>s.id===n)*65+80,J=n=>{const t=I.findIndex(s=>s.id===n);return t!==-1&&I.splice(t,1),t},K=(n,t,s)=>{const o=document.createElement("div");o.id=n;const r=e.createApp({setup(){return e.onUnmounted(()=>{document.body.removeChild(o)}),()=>e.createVNode(X,e.mergeProps(t,{id:n,onDestroy:r.unmount}),W(s)?s:{default:()=>[s]})}});return document.body.appendChild(o),r.mount(o),{id:n,props:t}},D={duration:3e3,type:"normal"},w=n=>{const t=!n||f(n)?{message:n}:n;return p(p({},D),t)};let $=0;function N(n){const t=n.onClose||null,s=n.message;delete n.message;const o=e.reactive(b(p(p({},D),n),{onClose:()=>{o.visible=!1,J(o.id),t==null||t()}}));$++;const r=`message_${$}`;o.id=r;const a=K(r,o,s);I.push(a),o.visible=!0}function Q(n){const t=w(n);N(p({},t))}function Y(n){const t=w(n);N(b(p({},t),{type:"success"}))}function Z(n){const t=w(n);N(b(p({},t),{type:"error"}))}function ee(n){const t=w(n);N(b(p({},t),{type:"warning"}))}function ne(n){const t=w(n);N(b(p({},t),{type:"info"}))}const M=Object.assign(Q,{success:Y,error:Z,warning:ee,info:ne});var te={title:"Message \u5168\u5C40\u63D0\u793A",category:"\u53CD\u9988",status:"100%",install(n){n.config.globalProperties.$message=M}};c.Message=M,c.default=te,c.messageProps=S,Object.defineProperty(c,"__esModule",{value:!0}),c[Symbol.toStringTag]="Module"});

package/message/package.json

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

package/message/style.css

@@ -0,0 +1 @@
+.devui-icon__container{display:inline-block;color:var(--devui-icon-fill, #71757f)}.devui-icon__container>*:not(:last-child){vertical-align:middle;margin-right:8px}.devui-icon__container i{vertical-align:middle;transition:all var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--disabled{color:var(--devui-disabled-text, #adb0b8);cursor:not-allowed}.devui-icon--disabled i{color:var(--devui-disabled-text, #adb0b8)}.devui-icon--operable:not(.devui-icon--disabled){cursor:pointer;transition:color var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--operable:not(.devui-icon--disabled) i{cursor:pointer}.devui-icon--operable:hover:not(.devui-icon--disabled){color:var(--devui-icon-fill-hover, #252b3a)}.devui-icon--operable:hover:not(.devui-icon--disabled).devui-icon__container{background-color:var(--devui-icon-background-hover, var(--devui-list-item-hover-bg, #f2f2f3))}.devui-icon--operable:hover:not(.devui-icon--disabled) i{color:var(--devui-icon-fill-hover, #252b3a)}.devui-icon--operable:active:not(.devui-icon--disabled){color:var(--devui-icon-active-color, var(--devui-icon-fill-active, #252b3a))}.devui-icon--operable:active:not(.devui-icon--disabled).devui-icon__container{background-color:var(--devui-icon-background-active, var(--devui-list-item-active-bg, #f2f5fc))}.devui-icon--operable:active:not(.devui-icon--disabled) i{color:var(--devui-icon-active-color, var(--devui-icon-fill-active, #252b3a))}.devui-icon--operable.devui-icon__container{height:32px;line-height:32px;padding:0 8px;margin-left:-8px;border-radius:var(--devui-border-radius, 4px);transition:all var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-icon--spin{animation:iconSpin 2.5s linear infinite}.devui-svg-icon{vertical-align:middle}@keyframes iconSpin{0%{transform:rotate(0)}50%{transform:rotate(180deg)}to{transform:rotate(360deg)}}.devui-icon-group{display:inline-flex;align-items:center}.devui-icon-group>.devui-icon__container:not(.devui-icon--operable){padding:8px;margin-left:0}.devui-icon-group>.devui-icon__container:not(.devui-icon--operable):first-child{margin-left:-8px}.devui-icon-group>*:not(:first-child){margin-left:0}.devui-message{position:fixed;z-index:var(--devui-z-index-modal, 1079);padding:10px 15px;border-radius:var(--devui-border-radius-feedback, 4px);left:50%;transform:translate(-50%);top:80px;display:flex;align-items:center;border-width:1px;border-style:solid;border-color:var(--devui-line, #d7d8da);box-shadow:0 3px 6px -4px #0000001f,0 6px 16px #00000014,0 9px 28px 8px #0000000d;background-color:var(--devui-base-bg, #ffffff);transition:top .5s ease}.devui-message--success{background-color:var(--devui-success-bg, #edfff9);border-color:var(--devui-success-line, #50d4ab)}.devui-message--info{background-color:var(--devui-info-bg, #f2f5fc);border-color:var(--devui-info-line, #5e7ce0)}.devui-message--warning{background-color:var(--devui-warning-bg, #fff3e8);border-color:var(--devui-warning-line, #fa9841)}.devui-message--error{background-color:var(--devui-danger-bg, #ffeeed);border-color:var(--devui-danger-line, #f66f6a)}.devui-message__close{margin-left:auto;padding-left:10px;margin-top:-2px}.devui-message__image{margin-top:1px;display:inline-block;width:var(--devui-font-size-icon, 16px);min-width:var(--devui-font-size-icon, 16px);min-height:var(--devui-font-size-icon, 16px);height:var(--devui-font-size-icon, 16px);padding:0;line-height:1;margin-right:10px}.devui-message__image--success{color:var(--devui-success, #50d4ab)}.devui-message__image--info{color:var(--devui-info, #5e7ce0)}.devui-message__image--warning{color:var(--devui-warning, #fac20a)}.devui-message__image--error{color:var(--devui-danger, #f66f6a)}.devui-message__content{font-size:var(--devui-font-size-page-title, 16px);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}.devui-message__content--success{color:var(--devui-success, #50d4ab)}.devui-message__content--info{color:var(--devui-info, #5e7ce0)}.devui-message__content--warning{color:var(--devui-warning, #fac20a)}.devui-message__content--error{color:var(--devui-danger, #f66f6a)}.message-fade-enter-active,.message-fade-leave-active{transform:translate(-50%);transition:all .5s ease}.message-fade-enter-from,.message-fade-leave-to{opacity:0;transform:translate(-50%,-200%)}