vue-devui 1.6.10 → 1.6.12

package/editable-select/style.css

@@ -1 +1 @@
-.devui-fixed-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--devui-shadow, rgba(37, 43, 58, .24));opacity:1;z-index:1050}.devui-fixed-overlay--fade-enter-active,.devui-fixed-overlay--fade-leave-active{transition:opacity .1s cubic-bezier(0,0,1,1)}.devui-fixed-overlay--fade-enter-from,.devui-fixed-overlay--fade-leave-to{opacity:0}.devui-flexible-overlay{position:fixed;border-radius:var(--devui-border-radius, 2px);background-color:var(--devui-connected-overlay-bg, #ffffff);box-shadow:var(--devui-shadow-length-connected-overlay, 0 2px 12px 0) var(--devui-shadow, rgba(37, 43, 58, .24));z-index:1000}.devui-flexible-overlay__arrow{position:absolute;width:8px;height:8px;transform:rotate(45deg);background-color:inherit}@keyframes devui-busy-spinner-anim{0%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(1.5)}to{transform:rotate(360deg) scale(1)}}.devui-loading__mask{z-index:var(--devui-z-index-full-page-overlay, 1080);position:absolute;left:0;right:0;bottom:0;top:0;background-color:var(--devui-line, #d7d8da);opacity:.3}.devui-loading__wrapper{text-align:center}.devui-loading--full{position:fixed;left:0;right:0;bottom:0;top:0;z-index:var(--devui-z-index-full-page-overlay, 1080)}.devui-loading--hidden{overflow:hidden}.devui-loading__text{margin-left:10px}.devui-loading__area{position:absolute;transform:translate(-50%,-50%);padding:12px 14px;background:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius-card, 6px)}.devui-loading__busy-default-spinner{position:relative;display:inline-block;width:15px;height:15px;animation:devui-busy-spinner-anim 1s linear infinite}.devui-loading__busy-default-spinner div{position:absolute;left:44.5%;top:37%;width:6px;height:6px;border-radius:50%}.devui-loading__busy-default-spinner .devui-loading__bar1{top:0;left:0;background:#5e7ce0;background:var(--devui-brand, #5e7ce0)}.devui-loading__busy-default-spinner .devui-loading__bar2{top:0;left:9px;background:#859bff;background:var(--devui-brand-foil, #859bff)}.devui-loading__busy-default-spinner .devui-loading__bar3{top:9px;left:0;background:#859bff;background:var(--devui-brand-foil, #859bff)}.devui-loading__busy-default-spinner .devui-loading__bar4{top:9px;left:9px;background:#5e7ce0;background:var(--devui-brand, #5e7ce0)}.devui-editable-select-input{height:32px;font-size:var(--devui-font-size, 12px)}.devui-editable-select-input--sm{height:24px;font-size:var(--devui-font-size-sm, 12px)}.devui-editable-select-input--lg{height:40px;font-size:var(--devui-font-size-lg, 14px)}.devui-editable-select-input--open .devui-editable-select__arrow-icon{transform:rotate(180deg)}.devui-editable-select-input__wrapper{display:flex;align-items:center;justify-content:center;position:relative;height:100%;padding:0 8px;border:1px solid var(--devui-form-control-line, #d7d8da);border-radius:var(--devui-border-radius, 2px);background-color:var(--devui-form-control-bg, #ffffff);transition:border-color .3s var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),box-shadow var(--devui-animation-duration-base, .2s) var(--devui-animation-ease-in, cubic-bezier(.5, 0, .84, .25))}.devui-editable-select-input__wrapper:not(.devui-editable-select-input__wrapper--disabled):not(.devui-editable-select-input__wrapper--focus):hover{border-color:var(--devui-form-control-line-hover, #9b9fa8)}.devui-editable-select-input__wrapper--focus{border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-editable-select-input__wrapper--focus.devui-editable-select-input__wrapper--glow-style{box-shadow:0 0 0 4px var(--devui-form-control-interactive-outline, rgba(94, 124, 224, .08));border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-editable-select-input__wrapper--disabled{color:var(--devui-disabled-text, #cfd0d3);border-color:var(--devui-disabled-line, #dfe1e6);background-color:var(--devui-disabled-bg, #f5f5f5);cursor:not-allowed}.devui-editable-select-input__wrapper--disabled:hover{border-color:var(--devui-disabled-line, #dfe1e6)}.devui-editable-select-input__wrapper--disabled .devui-editable-select-input__inner{color:var(--devui-disabled-text, #cfd0d3);cursor:not-allowed}.devui-editable-select-input__wrapper--glow-style:not(.devui-editable-select-input__wrapper--disabled,.devui-editable-select-input__wrapper--focus):hover{box-shadow:0 0 0 4px var(--devui-form-control-interactive-outline, rgba(94, 124, 224, .08));border-color:var(--devui-form-control-line, #d7d8da)!important}.devui-editable-select-input__inner{width:100%;height:100%;padding:4px 0;border:none;background:none;outline:none}.devui-editable-select-input__placeholder{width:calc(100% - 16px);position:absolute;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transform:translateY(-50%);top:50%}.devui-editable-select-input__suffix{height:100%;display:inline-flex;align-items:center;justify-content:center;font-size:var(--devui-font-size, 12px)}.devui-editable-select-input__suffix>span{align-items:center}.devui-editable-select-input__suffix .devui-editable-select__clear-icon{pointer-events:auto;display:flex;cursor:pointer}.devui-editable-select-input__suffix .devui-editable-select__clear-icon svg path{fill:var(--devui-shape-icon-fill, #d7d8da);transition:all var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)) var(--devui-animation-duration-slow, .3s)}.devui-editable-select-input__suffix .devui-editable-select__clear-icon svg:hover path{fill:var(--devui-shape-icon-fill-hover, #babbc0)}.devui-editable-select-input__suffix .devui-editable-select__arrow-icon{display:flex;transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-editable-select-input__suffix .devui-editable-select__arrow-icon svg path{fill:var(--devui-icon-text, #71757f)}.devui-editable-select__dropdown{margin:8px 0}.devui-editable-select__inner{padding:12px;margin:0;list-style:none;overflow-y:auto}.devui-editable-select__item{cursor:pointer;user-select:none;line-height:20px;padding:8px 12px;border:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.devui-editable-select__item:not(:first-child){margin-top:4px}.devui-editable-select__item--disabled{cursor:not-allowed;color:var(--devui-disabled-text, #cfd0d3)}.devui-editable-select__item--selected:not(.devui-editable-select__item--disabled):not(.devui-editable-select__item--no-data-tip){color:var(--devui-list-item-active-text, #252b3a);background-color:var(--devui-list-item-active-bg, #f2f5fc)}.devui-editable-select__item--last-selected{background:var(--devui-list-item-hover-bg, #f2f2f3);color:var(--devui-list-item-hover-text, #252b3a)}.devui-editable-select__item--hover:not(.devui-editable-select__item--selected){background-color:var(--devui-list-item-hover-bg, #f2f2f3);color:var(--devui-list-item-hover-text, #252b3a)}.devui-editable-select__item:not(.devui-editable-select__item--disabled):not(.devui-editable-select__item--selected):not(.devui-editable-select__item--no-data-tip):hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3);color:var(--devui-list-item-hover-text, #252b3a)}.devui-editable-select__item--no-data-tip{text-align:center;cursor:not-allowed;user-select:none;color:var(--devui-disabled-text, #cfd0d3);font-size:var(--devui-font-size, 12px);line-height:22px;padding:0}.devui-editable-select--fade-bottom-enter-from,.devui-editable-select--fade-bottom-leave-to{opacity:.8;transform:scaleY(.8) translateY(-4px)}.devui-editable-select--fade-bottom-enter-to,.devui-editable-select--fade-bottom-leave-from{opacity:1;transform:scaleY(.9999) translateY(0)}.devui-editable-select--fade-bottom-enter-active{transition:transform .2s cubic-bezier(.16,.75,.5,1),opacity .2s cubic-bezier(.16,.75,.5,1)}.devui-editable-select--fade-bottom-leave-active{transition:transform .2s cubic-bezier(.5,0,.84,.25),opacity .2s cubic-bezier(.5,0,.84,.25)}.devui-editable-select--fade-top-enter-from,.devui-editable-select--fade-top-leave-to{opacity:.8;transform:scaleY(.8) translateY(4px)}.devui-editable-select--fade-top-enter-to,.devui-editable-select--fade-top-leave-from{opacity:1;transform:scaleY(.9999) translateY(0)}.devui-editable-select--fade-top-enter-active{transition:transform .2s cubic-bezier(.16,.75,.5,1),opacity .2s cubic-bezier(.16,.75,.5,1)}.devui-editable-select--fade-top-leave-active{transition:transform .2s cubic-bezier(.5,0,.84,.25),opacity .2s cubic-bezier(.5,0,.84,.25)}
+.devui-fixed-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:var(--devui-shadow, rgba(37, 43, 58, .24));opacity:1;z-index:1050}.devui-fixed-overlay--fade-enter-active,.devui-fixed-overlay--fade-leave-active{transition:opacity .1s cubic-bezier(0,0,1,1)}.devui-fixed-overlay--fade-enter-from,.devui-fixed-overlay--fade-leave-to{opacity:0}.devui-flexible-overlay{position:fixed;border-radius:var(--devui-border-radius, 2px);background-color:var(--devui-connected-overlay-bg, #ffffff);box-shadow:var(--devui-shadow-length-connected-overlay, 0 2px 12px 0) var(--devui-shadow, rgba(37, 43, 58, .24));z-index:1000}.devui-flexible-overlay__arrow{position:absolute;width:8px;height:8px;transform:rotate(45deg);background-color:inherit}@keyframes devui-busy-spinner-anim{0%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(1.5)}to{transform:rotate(360deg) scale(1)}}.devui-loading__mask{z-index:var(--devui-z-index-full-page-overlay, 1080);position:absolute;left:0;right:0;bottom:0;top:0;background-color:var(--devui-line, #d7d8da);opacity:.3}.devui-loading__wrapper{text-align:center}.devui-loading--full{position:fixed;left:0;right:0;bottom:0;top:0;z-index:var(--devui-z-index-full-page-overlay, 1080)}.devui-loading--hidden{overflow:hidden}.devui-loading__text{margin-left:10px}.devui-loading__area{position:absolute;transform:translate(-50%,-50%);padding:12px 14px;background:var(--devui-base-bg, #ffffff);border-radius:var(--devui-border-radius-card, 6px)}.devui-loading__busy-default-spinner{position:relative;display:inline-block;width:15px;height:15px;animation:devui-busy-spinner-anim 1s linear infinite}.devui-loading__busy-default-spinner div{position:absolute;left:44.5%;top:37%;width:6px;height:6px;border-radius:50%}.devui-loading__busy-default-spinner .devui-loading__bar1{top:0;left:0;background:#5e7ce0;background:var(--devui-brand, #5e7ce0)}.devui-loading__busy-default-spinner .devui-loading__bar2{top:0;left:9px;background:#859bff;background:var(--devui-brand-foil, #859bff)}.devui-loading__busy-default-spinner .devui-loading__bar3{top:9px;left:0;background:#859bff;background:var(--devui-brand-foil, #859bff)}.devui-loading__busy-default-spinner .devui-loading__bar4{top:9px;left:9px;background:#5e7ce0;background:var(--devui-brand, #5e7ce0)}.devui-editable-select-input{height:32px;font-size:var(--devui-font-size, 12px)}.devui-editable-select-input--sm{height:24px;font-size:var(--devui-font-size-sm, 12px)}.devui-editable-select-input--lg{height:40px;font-size:var(--devui-font-size-lg, 14px)}.devui-editable-select-input--open .devui-editable-select__arrow-icon{transform:rotate(180deg)}.devui-editable-select-input__wrapper{display:flex;align-items:center;justify-content:center;position:relative;height:100%;padding:0 8px;border:1px solid var(--devui-form-control-line, #d7d8da);border-radius:var(--devui-border-radius, 2px);background-color:var(--devui-form-control-bg, #ffffff);transition:border-color .3s var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)),box-shadow var(--devui-animation-duration-base, .2s) var(--devui-animation-ease-in, cubic-bezier(.5, 0, .84, .25))}.devui-editable-select-input__wrapper:not(.devui-editable-select-input__wrapper--disabled):not(.devui-editable-select-input__wrapper--focus):hover{border-color:var(--devui-form-control-line-hover, #9b9fa8)}.devui-editable-select-input__wrapper--focus{border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-editable-select-input__wrapper--focus.devui-editable-select-input__wrapper--glow-style{box-shadow:0 0 0 4px var(--devui-form-control-interactive-outline, rgba(94, 124, 224, .08));border-color:var(--devui-form-control-line-active, #5e7ce0)}.devui-editable-select-input__wrapper--disabled{color:var(--devui-disabled-text, #cfd0d3);border-color:var(--devui-disabled-line, #dfe1e6);background-color:var(--devui-disabled-bg, #f5f5f5);cursor:not-allowed}.devui-editable-select-input__wrapper--disabled:hover{border-color:var(--devui-disabled-line, #dfe1e6)}.devui-editable-select-input__wrapper--disabled .devui-editable-select-input__inner{color:var(--devui-disabled-text, #cfd0d3);cursor:not-allowed}.devui-editable-select-input__wrapper--glow-style:not(.devui-editable-select-input__wrapper--disabled,.devui-editable-select-input__wrapper--focus):hover{box-shadow:0 0 0 4px var(--devui-form-control-interactive-outline, rgba(94, 124, 224, .08));border-color:var(--devui-form-control-line, #d7d8da)!important}.devui-editable-select-input__inner{width:100%;height:100%;padding:4px 0;border:none;background:none;outline:none}.devui-editable-select-input__placeholder{width:calc(100% - 16px);position:absolute;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;transform:translateY(-50%);top:50%}.devui-editable-select-input__suffix{height:100%;display:inline-flex;align-items:center;justify-content:center;font-size:var(--devui-font-size, 12px)}.devui-editable-select-input__suffix>span{align-items:center}.devui-editable-select-input__suffix .devui-editable-select__clear-icon{pointer-events:auto;display:flex;cursor:pointer}.devui-editable-select-input__suffix .devui-editable-select__clear-icon svg path{fill:var(--devui-shape-icon-fill, #d7d8da);transition:all var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1)) var(--devui-animation-duration-slow, .3s)}.devui-editable-select-input__suffix .devui-editable-select__clear-icon svg:hover path{fill:var(--devui-shape-icon-fill-hover, #babbc0)}.devui-editable-select-input__suffix .devui-editable-select__arrow-icon{display:flex;transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-editable-select-input__suffix .devui-editable-select__arrow-icon svg path{fill:var(--devui-icon-text, #71757f)}.devui-editable-select__inner{padding:12px;margin:0;list-style:none;overflow-y:auto}.devui-editable-select__item{cursor:pointer;user-select:none;line-height:20px;padding:8px 12px;border:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.devui-editable-select__item:not(:first-child){margin-top:4px}.devui-editable-select__item--disabled{cursor:not-allowed;color:var(--devui-disabled-text, #cfd0d3)}.devui-editable-select__item--selected:not(.devui-editable-select__item--disabled):not(.devui-editable-select__item--no-data-tip){color:var(--devui-list-item-active-text, #252b3a);background-color:var(--devui-list-item-active-bg, #f2f5fc)}.devui-editable-select__item--last-selected{background:var(--devui-list-item-hover-bg, #f2f2f3);color:var(--devui-list-item-hover-text, #252b3a)}.devui-editable-select__item--hover:not(.devui-editable-select__item--selected){background-color:var(--devui-list-item-hover-bg, #f2f2f3);color:var(--devui-list-item-hover-text, #252b3a)}.devui-editable-select__item:not(.devui-editable-select__item--disabled):not(.devui-editable-select__item--selected):not(.devui-editable-select__item--no-data-tip):hover{background-color:var(--devui-list-item-hover-bg, #f2f2f3);color:var(--devui-list-item-hover-text, #252b3a)}.devui-editable-select__item--no-data-tip{text-align:center;cursor:not-allowed;user-select:none;color:var(--devui-disabled-text, #cfd0d3);font-size:var(--devui-font-size, 12px);line-height:22px;padding:0}.devui-editable-select--fade-bottom-enter-from,.devui-editable-select--fade-bottom-leave-to{opacity:.8;transform:scaleY(.8) translateY(-4px)}.devui-editable-select--fade-bottom-enter-to,.devui-editable-select--fade-bottom-leave-from{opacity:1;transform:scaleY(.9999) translateY(0)}.devui-editable-select--fade-bottom-enter-active{transition:transform .2s cubic-bezier(.16,.75,.5,1),opacity .2s cubic-bezier(.16,.75,.5,1)}.devui-editable-select--fade-bottom-leave-active{transition:transform .2s cubic-bezier(.5,0,.84,.25),opacity .2s cubic-bezier(.5,0,.84,.25)}.devui-editable-select--fade-top-enter-from,.devui-editable-select--fade-top-leave-to{opacity:.8;transform:scaleY(.8) translateY(4px)}.devui-editable-select--fade-top-enter-to,.devui-editable-select--fade-top-leave-from{opacity:1;transform:scaleY(.9999) translateY(0)}.devui-editable-select--fade-top-enter-active{transition:transform .2s cubic-bezier(.16,.75,.5,1),opacity .2s cubic-bezier(.16,.75,.5,1)}.devui-editable-select--fade-top-leave-active{transition:transform .2s cubic-bezier(.5,0,.84,.25),opacity .2s cubic-bezier(.5,0,.84,.25)}

package/menu/index.es.js

@@ -570,6 +570,26 @@ function useShowSubMenu(eventName, e, wrapper) {
     wrapper.classList.add(menuItemHorizontalWrapperHidden);
   }
 }
+function SelectArrowIcon() {
+  return createVNode("svg", {
+    "width": "16px",
+    "height": "16px",
+    "viewBox": "0 0 16 16",
+    "version": "1.1",
+    "xmlns": "http://www.w3.org/2000/svg"
+  }, [createVNode("g", {
+    "stroke": "none",
+    "stroke-width": "1",
+    "fill": "none",
+    "fill-rule": "evenodd"
+  }, [createVNode("path", {
+    "d": `M3.64644661,5.64644661 C3.82001296,5.47288026 4.08943736,5.45359511 4.2843055,5.58859116 L4.35355339,5.64644661 
+          L8,9.293 L11.6464466,5.64644661 C11.820013,5.47288026 12.0894374,5.45359511 12.2843055,5.58859116 L12.3535534,5.64644661 
+          C12.5271197,5.82001296 12.5464049,6.08943736 12.4114088,6.2843055 L12.3535534,6.35355339 L8.35355339,10.3535534 
+          C8.17998704,10.5271197 7.91056264,10.5464049 7.7156945,10.4114088 L7.64644661,10.3535534 L3.64644661,6.35355339 
+          C3.45118446,6.15829124 3.45118446,5.84170876 3.64644661,5.64644661 Z`
+  }, null)])]);
+}
 const ns = useNamespace("menu");
 const subNs = useNamespace("submenu");
 const subMenuClass = subNs.b();
@@ -698,9 +718,13 @@ var SubMenu = defineComponent({
         "class": `${ns.b()}-icon`
       }, [(_b = (_a = ctx.slots) == null ? void 0 : _a.icon) == null ? void 0 : _b.call(_a)]), withDirectives(createVNode("span", {
         "class": `${subMenuClass}-title-content`
-      }, [props.title]), [[vShow, !isCollapsed.value]]), withDirectives(createVNode("i", {
+      }, [props.title]), [[vShow, !isCollapsed.value]]), withDirectives(createVNode(SelectArrowIcon, {
+        "class": [ns.e("arrow-icon"), {
+          "is-opened": isOpen.value
+        }]
+      }, null), [[vShow, !isCollapsed.value && key !== "overflowContainer" && class_layer.value !== `layer_${subMenuClass}`]]), withDirectives(createVNode("i", {
         "class": {
-          "icon icon-chevron-up": class_layer.value !== `layer_${subMenuClass}`,
+          "icon icon-chevron-up": false,
           "icon icon-chevron-right": class_layer.value === `layer_${subMenuClass}`,
           "is-opened": isOpen.value
         }

package/menu/index.umd.js

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

package/menu/style.css

@@ -1 +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}.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;transition:background-color var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-menu-vertical .devui-menu-item:hover{color:var(--devui-list-item-hover-text, #252b3a);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.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}.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);transition:background-color var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-menu-vertical ul.devui-submenu div.devui-submenu-title:hover{color:var(--devui-list-item-hover-text, #252b3a);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.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}
+.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}.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;margin:4px 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;transition:background-color var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-menu-vertical .devui-menu-item:hover{color:var(--devui-list-item-hover-text, #252b3a);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.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}.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;line-height:40px;padding-left:18px;align-items:center;color:var(--devui-menu-item);transition:background-color var(--devui-animation-duration-fast, .1s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-menu-vertical ul.devui-submenu div.devui-submenu-title:hover{color:var(--devui-list-item-hover-text, #252b3a);background-color:var(--devui-list-item-hover-bg, #f2f2f3)}.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-vertical .devui-menu__arrow-icon{width:16px;height:16px;transition:transform var(--devui-animation-duration-slow, .3s) var(--devui-animation-ease-in-out-smooth, cubic-bezier(.645, .045, .355, 1))}.devui-menu-vertical .devui-menu__arrow-icon path{fill:var(--devui-text-weak, #575d6c)}.devui-menu-vertical .devui-menu__arrow-icon.is-opened{transform:rotate(180deg)}.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/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vue-devui",
-  "version": "1.6.10",
+  "version": "1.6.12",
   "license": "MIT",
   "description": "DevUI components based on Vite and Vue3",
   "keywords": [

package/pagination/index.es.js

@@ -29,7 +29,11 @@ var __objRest = (source, exclude) => {
     }
   return target;
 };
-import { defineComponent, watch, provide, reactive, toRefs, createVNode, onUnmounted, Transition, mergeProps, ref, unref, nextTick, withModifiers, Comment, Text, h, Fragment, inject, withDirectives, cloneVNode, computed, onMounted, Teleport, createTextVNode, onBeforeUnmount, toRef, onBeforeMount, vShow, resolveComponent, getCurrentInstance, resolveDirective } from "vue";
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+import { defineComponent, watch, provide, reactive, toRefs, createVNode, onUnmounted, Transition, mergeProps, ref, unref, nextTick, withModifiers, Comment, Text, h, Fragment, inject, withDirectives, cloneVNode, computed, onMounted, Teleport, createTextVNode, onBeforeUnmount, toRef, onBeforeMount, vShow, resolveComponent, getCurrentInstance, render, resolveDirective } from "vue";
 import { onClickOutside } from "@vueuse/core";
 import "clipboard";
 import { offset, autoPlacement, arrow, shift, computePosition } from "@floating-ui/dom";
@@ -4069,7 +4073,7 @@ var lodash = { exports: {} };
       function isElement(value) {
         return isObjectLike(value) && value.nodeType === 1 && !isPlainObject(value);
       }
-      function isEmpty(value) {
+      function isEmpty2(value) {
         if (value == null) {
           return true;
         }
@@ -5199,7 +5203,7 @@ var lodash = { exports: {} };
       lodash2.isBuffer = isBuffer;
       lodash2.isDate = isDate;
       lodash2.isElement = isElement;
-      lodash2.isEmpty = isEmpty;
+      lodash2.isEmpty = isEmpty2;
       lodash2.isEqual = isEqual;
       lodash2.isEqualWith = isEqualWith;
       lodash2.isError = isError;
@@ -7562,7 +7566,7 @@ var Schema = /* @__PURE__ */ function() {
       complete(results);
     }, source);
   };
-  _proto.getType = function getType(rule) {
+  _proto.getType = function getType2(rule) {
     if (rule.type === void 0 && rule.pattern instanceof RegExp) {
       rule.type = "pattern";
     }
@@ -8088,7 +8092,7 @@ function useSelect(props, selectRef, ctx2, focus, blur, isSelectFocus, t) {
       return label.toString().toLocaleLowerCase().includes(filterQuery.value.toLocaleLowerCase().trim());
     }).length;
     if (isLoading.value) {
-      return props.loadingText || t("loadingText");
+      return "";
     }
     if (isSupportFilter.value && filterQuery.value && injectOptionsArray.value.length > 0 && visibleOptionsCount === 0) {
       return props.noMatchText || t("noMatchText");
@@ -8312,8 +8316,7 @@ const commonProps = {
     default: void 0
   },
   size: {
-    type: String,
-    default: "md"
+    type: String
   },
   showGlowStyle: {
     type: Boolean,
@@ -8513,7 +8516,7 @@ function useCheckboxGroup(props, ctx2) {
     formItemContext == null ? void 0 : formItemContext.validate("change").catch(() => {
     });
   }, { deep: true });
-  const checkboxGroupSize = computed(() => props.size || (formContext == null ? void 0 : formContext.size) || "");
+  const checkboxGroupSize = computed(() => props.size || (formContext == null ? void 0 : formContext.size) || "md");
   provide(checkboxGroupInjectionKey, {
     disabled: toRef(props, "disabled"),
     isShowTitle: toRef(props, "isShowTitle"),
@@ -9384,8 +9387,216 @@ function useSelectFunction(props, selectRef) {
   return { isSelectFocus, focus, blur };
 }
 var select = "";
+class View {
+  constructor() {
+    __publicField(this, "top", "50%");
+    __publicField(this, "left", "50%");
+  }
+}
+const loadingProps = {
+  message: String,
+  backdrop: Boolean,
+  view: {
+    type: Object,
+    default: () => new View()
+  },
+  zIndex: Number,
+  isFull: {
+    type: Boolean,
+    default: false
+  }
+};
+class LoadingOptions {
+  constructor() {
+    __publicField(this, "target");
+    __publicField(this, "message");
+    __publicField(this, "loadingTemplateRef");
+    __publicField(this, "backdrop", true);
+    __publicField(this, "positionType", "relative");
+    __publicField(this, "view", new View());
+    __publicField(this, "zIndex");
+  }
+}
+var loading = "";
+var Loading = defineComponent({
+  name: "Loading",
+  inheritAttrs: false,
+  props: loadingProps,
+  setup(props) {
+    const style = {
+      top: props.view.top,
+      left: props.view.left,
+      zIndex: props.zIndex
+    };
+    if (!props.message) {
+      style.background = "none";
+    }
+    const isShow = ref(false);
+    const open = () => {
+      isShow.value = true;
+    };
+    const close = () => {
+      isShow.value = false;
+    };
+    return {
+      style,
+      isShow,
+      open,
+      close
+    };
+  },
+  render() {
+    var _a;
+    const {
+      isShow,
+      isFull,
+      backdrop,
+      style,
+      message,
+      $slots
+    } = this;
+    const ns2 = useNamespace$1("loading");
+    return isShow && createVNode("div", {
+      "class": [ns2.b(), isFull ? ns2.m("full") : ""]
+    }, [((_a = $slots.default) == null ? void 0 : _a.call($slots)) || createVNode("div", {
+      "class": ns2.e("wrapper")
+    }, [backdrop ? createVNode("div", {
+      "class": ns2.e("mask")
+    }, null) : null, createVNode("div", {
+      "style": style,
+      "class": ns2.e("area")
+    }, [createVNode("div", {
+      "class": ns2.e("busy-default-spinner")
+    }, [createVNode("div", {
+      "class": ns2.e("bar1")
+    }, null), createVNode("div", {
+      "class": ns2.e("bar2")
+    }, null), createVNode("div", {
+      "class": ns2.e("bar3")
+    }, null), createVNode("div", {
+      "class": ns2.e("bar4")
+    }, null)]), message ? createVNode("span", {
+      "class": ns2.e("text")
+    }, [message]) : null])])]);
+  }
+});
+const COMPONENT_CONTAINER_SYMBOL = Symbol("dev_component_container");
+function createComponent(component, props, children = null) {
+  const vnode = h(component, __spreadValues({}, props), children);
+  const container = document.createElement("div");
+  vnode[COMPONENT_CONTAINER_SYMBOL] = container;
+  render(vnode, container);
+  return vnode.component;
+}
+function unmountComponent(ComponnetInstance) {
+  render(null, ComponnetInstance == null ? void 0 : ComponnetInstance.vnode[COMPONENT_CONTAINER_SYMBOL]);
+}
+const loadingConstructor = defineComponent(Loading);
+const cacheInstance = /* @__PURE__ */ new WeakSet();
+const isEmpty = (val) => {
+  if (!val) {
+    return true;
+  }
+  if (Array.isArray(val)) {
+    return val.length === 0;
+  }
+  if (val instanceof Set || val instanceof Map) {
+    return val.size === 0;
+  }
+  if (val instanceof Promise) {
+    return false;
+  }
+  if (typeof val === "object") {
+    try {
+      return Object.keys(val).length === 0;
+    } catch (e) {
+      return false;
+    }
+  }
+  return false;
+};
+const getType = (vari) => {
+  return Object.prototype.toString.call(vari).slice(8, -1).toLowerCase();
+};
+const isPromise = (value) => {
+  const type4 = getType(value);
+  switch (type4) {
+    case "promise":
+      return [value];
+    case "array":
+      if (value.some((val) => getType(val) !== "promise")) {
+        console.error(new TypeError("Binding values should all be of type Promise"));
+        return "error";
+      }
+      return value;
+    default:
+      return false;
+  }
+};
+const unmount = (el) => {
+  cacheInstance.delete(el);
+  el.instance.proxy.close();
+  unmountComponent(el.instance);
+};
+const toggleLoading = (el, binding) => {
+  var _a, _b, _c;
+  if (binding.value) {
+    const vals = isPromise(binding.value);
+    if (vals === "error") {
+      return;
+    }
+    (_c = (_b = (_a = el == null ? void 0 : el.instance) == null ? void 0 : _a.proxy) == null ? void 0 : _b.open) == null ? void 0 : _c.call(_b);
+    el.appendChild(el.mask);
+    cacheInstance.add(el);
+    if (vals) {
+      Promise.all(vals).catch((err) => {
+        console.error(new Error("Promise handling errors"), err);
+      }).finally(() => {
+        unmount(el);
+      });
+    }
+  } else {
+    unmount(el);
+  }
+};
+const removeAttribute = (el) => {
+  el.removeAttribute("zindex");
+  el.removeAttribute("positiontype");
+  el.removeAttribute("backdrop");
+  el.removeAttribute("message");
+  el.removeAttribute("view");
+  el.removeAttribute("loadingtemplateref");
+};
+const handleProps = (el, vprops) => {
+  var _a;
+  const props = __spreadValues(__spreadValues({}, new LoadingOptions()), vprops);
+  const loadingTemplateRef = props.loadingTemplateRef;
+  const loadingInstance = createComponent(loadingConstructor, __spreadValues({}, props), loadingTemplateRef ? () => loadingTemplateRef : null);
+  el.style.position = props.positionType || "relative";
+  el.options = props;
+  el.instance = loadingInstance;
+  el.mask = (_a = loadingInstance == null ? void 0 : loadingInstance.proxy) == null ? void 0 : _a.$el;
+};
+const LoadingDirective = {
+  mounted: function(el, binding, vnode) {
+    handleProps(el, vnode.props);
+    removeAttribute(el);
+    !isEmpty(binding.value) && toggleLoading(el, binding);
+  },
+  updated: function(el, binding, vnode) {
+    if (!isEmpty(binding.value) && cacheInstance.has(el) || isEmpty(binding.value) && !cacheInstance.has(el)) {
+      return;
+    }
+    !cacheInstance.has(el) && handleProps(el, vnode.props);
+    removeAttribute(el);
+    toggleLoading(el, binding);
+  }
+};
 var Select = defineComponent({
   name: "DSelect",
+  directives: {
+    dLoading: LoadingDirective
+  },
   props: selectProps,
   emits: ["toggle-change", "value-change", "update:modelValue", "focus", "blur", "remove-tag", "clear", "input-change"],
   setup(props, ctx2) {
@@ -9515,7 +9726,7 @@ var Select = defineComponent({
           }, {
             default: () => {
               var _a, _b, _c, _d;
-              return [createVNode("div", {
+              return [withDirectives(createVNode("div", {
                 "class": dropdownCls,
                 "style": {
                   width: `${dropdownWidth.value}`
@@ -9543,9 +9754,9 @@ var Select = defineComponent({
                   "label": item.name,
                   "disabled": isDisabled(item)
                 }, null) : item.name || item.value]
-              }))]), [[vShow, !isLoading.value]]), isShowEmptyText.value && createVNode("div", null, [((_c = ctx2.slots) == null ? void 0 : _c.empty) && ctx2.slots.empty(), !((_d = ctx2.slots) == null ? void 0 : _d.empty) && createVNode("p", {
+              }))]), [[vShow, !isLoading.value]]), (isLoading.value || isShowEmptyText.value) && createVNode("div", null, [((_c = ctx2.slots) == null ? void 0 : _c.empty) && ctx2.slots.empty(), !((_d = ctx2.slots) == null ? void 0 : _d.empty) && createVNode("p", {
                 "class": dropdownEmptyCls
-              }, [emptyText.value])])])];
+              }, [emptyText.value])])]), [[resolveDirective("dLoading"), isLoading.value]])];
             }
           }), [[vShow, isOpen.value]])]
         })]