st-comp 0.0.147 → 0.0.149

package/es/el-menu-item-78b858f2.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("vue"),ne=require("./el-scrollbar-d1c3e7f7.cjs"),S=require("./use-form-common-props-1b84d8f4.cjs"),y=require("./index-3bf8d597.cjs"),l=require("./base-ec05f348.cjs"),K=require("./el-popper-746070ba.cjs"),oe=require("./index-eea0bcb3.cjs"),se=require("./el-tag-c51a6490.cjs"),le=require("./typescript-b63f8e83.cjs"),ae=require("./vnode-7fbc61e1.cjs"),ue=e.defineComponent({name:"ElCollapseTransition"}),re=e.defineComponent({...ue,setup(t){const s=l.useNamespace("collapse-transition"),o=n=>{n.style.maxHeight="",n.style.overflow=n.dataset.oldOverflow,n.style.paddingTop=n.dataset.oldPaddingTop,n.style.paddingBottom=n.dataset.oldPaddingBottom},d={beforeEnter(n){n.dataset||(n.dataset={}),n.dataset.oldPaddingTop=n.style.paddingTop,n.dataset.oldPaddingBottom=n.style.paddingBottom,n.style.height&&(n.dataset.elExistsHeight=n.style.height),n.style.maxHeight=0,n.style.paddingTop=0,n.style.paddingBottom=0},enter(n){requestAnimationFrame(()=>{n.dataset.oldOverflow=n.style.overflow,n.dataset.elExistsHeight?n.style.maxHeight=n.dataset.elExistsHeight:n.scrollHeight!==0?n.style.maxHeight=`${n.scrollHeight}px`:n.style.maxHeight=0,n.style.paddingTop=n.dataset.oldPaddingTop,n.style.paddingBottom=n.dataset.oldPaddingBottom,n.style.overflow="hidden"})},afterEnter(n){n.style.maxHeight="",n.style.overflow=n.dataset.oldOverflow},enterCancelled(n){o(n)},beforeLeave(n){n.dataset||(n.dataset={}),n.dataset.oldPaddingTop=n.style.paddingTop,n.dataset.oldPaddingBottom=n.style.paddingBottom,n.dataset.oldOverflow=n.style.overflow,n.style.maxHeight=`${n.scrollHeight}px`,n.style.overflow="hidden"},leave(n){n.scrollHeight!==0&&(n.style.maxHeight=0,n.style.paddingTop=0,n.style.paddingBottom=0)},afterLeave(n){o(n)},leaveCancelled(n){o(n)}};return(n,C)=>(e.openBlock(),e.createBlock(e.Transition,e.mergeProps({name:e.unref(s).b()},e.toHandlers(d)),{default:e.withCtx(()=>[e.renderSlot(n.$slots,"default")]),_:3},16,["name"]))}});var ie=l._export_sfc(re,[["__file","collapse-transition.vue"]]);const ce=l.withInstall(ie);let de=class{constructor(s,o){this.parent=s,this.domNode=o,this.subIndex=0,this.subIndex=0,this.init()}init(){this.subMenuItems=this.domNode.querySelectorAll("li"),this.addListeners()}gotoSubIndex(s){s===this.subMenuItems.length?s=0:s<0&&(s=this.subMenuItems.length-1),this.subMenuItems[s].focus(),this.subIndex=s}addListeners(){const s=this.parent.domNode;Array.prototype.forEach.call(this.subMenuItems,o=>{o.addEventListener("keydown",d=>{let n=!1;switch(d.code){case y.EVENT_CODE.down:{this.gotoSubIndex(this.subIndex+1),n=!0;break}case y.EVENT_CODE.up:{this.gotoSubIndex(this.subIndex-1),n=!0;break}case y.EVENT_CODE.tab:{y.triggerEvent(s,"mouseleave");break}case y.EVENT_CODE.enter:case y.EVENT_CODE.numpadEnter:case y.EVENT_CODE.space:{n=!0,d.currentTarget.click();break}}return n&&(d.preventDefault(),d.stopPropagation()),!1})})}},pe=class{constructor(s,o){this.domNode=s,this.submenu=null,this.submenu=null,this.init(o)}init(s){this.domNode.setAttribute("tabindex","0");const o=this.domNode.querySelector(`.${s}-menu`);o&&(this.submenu=new de(this,o)),this.addListeners()}addListeners(){this.domNode.addEventListener("keydown",s=>{let o=!1;switch(s.code){case y.EVENT_CODE.down:{y.triggerEvent(s.currentTarget,"mouseenter"),this.submenu&&this.submenu.gotoSubIndex(0),o=!0;break}case y.EVENT_CODE.up:{y.triggerEvent(s.currentTarget,"mouseenter"),this.submenu&&this.submenu.gotoSubIndex(this.submenu.subMenuItems.length-1),o=!0;break}case y.EVENT_CODE.tab:{y.triggerEvent(s.currentTarget,"mouseleave");break}case y.EVENT_CODE.enter:case y.EVENT_CODE.numpadEnter:case y.EVENT_CODE.space:{o=!0,s.currentTarget.click();break}}o&&s.preventDefault()})}},me=class{constructor(s,o){this.domNode=s,this.init(o)}init(s){const o=this.domNode.childNodes;Array.from(o).forEach(d=>{d.nodeType===1&&new pe(d,s)})}};const ve=e.defineComponent({name:"ElMenuCollapseTransition",setup(){const t=l.useNamespace("menu");return{listeners:{onBeforeEnter:o=>o.style.opacity="0.2",onEnter(o,d){l.addClass(o,`${t.namespace.value}-opacity-transition`),o.style.opacity="1",d()},onAfterEnter(o){l.removeClass(o,`${t.namespace.value}-opacity-transition`),o.style.opacity=""},onBeforeLeave(o){o.dataset||(o.dataset={}),l.hasClass(o,t.m("collapse"))?(l.removeClass(o,t.m("collapse")),o.dataset.oldOverflow=o.style.overflow,o.dataset.scrollWidth=o.clientWidth.toString(),l.addClass(o,t.m("collapse"))):(l.addClass(o,t.m("collapse")),o.dataset.oldOverflow=o.style.overflow,o.dataset.scrollWidth=o.clientWidth.toString(),l.removeClass(o,t.m("collapse"))),o.style.width=`${o.scrollWidth}px`,o.style.overflow="hidden"},onLeave(o){l.addClass(o,"horizontal-collapse-transition"),o.style.width=`${o.dataset.scrollWidth}px`}}}}});function fe(t,s,o,d,n,C){return e.openBlock(),e.createBlock(e.Transition,e.mergeProps({mode:"out-in"},t.listeners),{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default")]),_:3},16)}var he=l._export_sfc(ve,[["render",fe],["__file","menu-collapse-transition.vue"]]);function Q(t,s){const o=e.computed(()=>{let n=t.parent;const C=[s.value];for(;n.type.name!=="ElMenu";)n.props.index&&C.unshift(n.props.index),n=n.parent;return C});return{parentMenu:e.computed(()=>{let n=t.parent;for(;n&&!["ElMenu","ElSubMenu"].includes(n.type.name);)n=n.parent;return n}),indexPath:o}}function ge(t){return e.computed(()=>{const o=t.backgroundColor;return o?new oe.TinyColor(o).shade(20).toString():""})}const X=(t,s)=>{const o=l.useNamespace("menu");return e.computed(()=>o.cssVarBlock({"text-color":t.textColor||"","hover-text-color":t.textColor||"","bg-color":t.backgroundColor||"","hover-bg-color":ge(t).value||"","active-color":t.activeTextColor||"",level:`${s}`}))},be=l.buildProps({index:{type:String,required:!0},showTimeout:Number,hideTimeout:Number,popperClass:String,disabled:Boolean,teleported:{type:Boolean,default:void 0},popperOffset:Number,expandCloseIcon:{type:S.iconPropType},expandOpenIcon:{type:S.iconPropType},collapseCloseIcon:{type:S.iconPropType},collapseOpenIcon:{type:S.iconPropType}}),G="ElSubMenu";var J=e.defineComponent({name:G,props:be,setup(t,{slots:s,expose:o}){const d=e.getCurrentInstance(),{indexPath:n,parentMenu:C}=Q(d,e.computed(()=>t.index)),v=l.useNamespace("menu"),E=l.useNamespace("sub-menu"),i=e.inject("rootMenu");i||l.throwError(G,"can not inject root menu");const m=e.inject(`subMenu:${C.value.uid}`);m||l.throwError(G,"can not inject sub menu");const f=e.ref({}),b=e.ref({});let I;const N=e.ref(!1),j=e.ref(),H=e.ref(null),w=e.computed(()=>k.value==="horizontal"&&_.value?"bottom-start":"right-start"),P=e.computed(()=>k.value==="horizontal"&&_.value||k.value==="vertical"&&!i.props.collapse?t.expandCloseIcon&&t.expandOpenIcon?x.value?t.expandOpenIcon:t.expandCloseIcon:S.arrow_down_default:t.collapseCloseIcon&&t.collapseOpenIcon?x.value?t.collapseOpenIcon:t.collapseCloseIcon:S.arrow_right_default),_=e.computed(()=>m.level===0),D=e.computed(()=>{const r=t.teleported;return r===void 0?_.value:r}),W=e.computed(()=>i.props.collapse?`${v.namespace.value}-zoom-in-left`:`${v.namespace.value}-zoom-in-top`),F=e.computed(()=>k.value==="horizontal"&&_.value?["bottom-start","bottom-end","top-start","top-end","right-start","left-start"]:["right-start","right","right-end","left-start","bottom-start","bottom-end","top-start","top-end"]),x=e.computed(()=>i.openedMenus.includes(t.index)),$=e.computed(()=>{let r=!1;return Object.values(f.value).forEach(p=>{p.active&&(r=!0)}),Object.values(b.value).forEach(p=>{p.active&&(r=!0)}),r}),k=e.computed(()=>i.props.mode),B=e.reactive({index:t.index,indexPath:n,active:$}),A=X(i.props,m.level+1),q=e.computed(()=>{var r;return(r=t.popperOffset)!=null?r:i.props.popperOffset}),z=e.computed(()=>{var r;return(r=t.popperClass)!=null?r:i.props.popperClass}),L=e.computed(()=>{var r;return(r=t.showTimeout)!=null?r:i.props.showTimeout}),R=e.computed(()=>{var r;return(r=t.hideTimeout)!=null?r:i.props.hideTimeout}),a=()=>{var r,p,M;return(M=(p=(r=H.value)==null?void 0:r.popperRef)==null?void 0:p.popperInstanceRef)==null?void 0:M.destroy()},u=r=>{r||a()},c=()=>{i.props.menuTrigger==="hover"&&i.props.mode==="horizontal"||i.props.collapse&&i.props.mode==="vertical"||t.disabled||i.handleSubMenuClick({index:t.index,indexPath:n.value,active:$.value})},h=(r,p=L.value)=>{var M;if(r.type!=="focus"){if(i.props.menuTrigger==="click"&&i.props.mode==="horizontal"||!i.props.collapse&&i.props.mode==="vertical"||t.disabled){m.mouseInChild.value=!0;return}m.mouseInChild.value=!0,I==null||I(),{stop:I}=l.useTimeoutFn(()=>{i.openMenu(t.index,n.value)},p),D.value&&((M=C.value.vnode.el)==null||M.dispatchEvent(new MouseEvent("mouseenter")))}},g=(r=!1)=>{var p;if(i.props.menuTrigger==="click"&&i.props.mode==="horizontal"||!i.props.collapse&&i.props.mode==="vertical"){m.mouseInChild.value=!1;return}I==null||I(),m.mouseInChild.value=!1,{stop:I}=l.useTimeoutFn(()=>!N.value&&i.closeMenu(t.index,n.value),R.value),D.value&&r&&((p=m.handleMouseleave)==null||p.call(m,!0))};e.watch(()=>i.props.collapse,r=>u(!!r));{const r=M=>{b.value[M.index]=M},p=M=>{delete b.value[M.index]};e.provide(`subMenu:${d.uid}`,{addSubMenu:r,removeSubMenu:p,handleMouseleave:g,mouseInChild:N,level:m.level+1})}return o({opened:x}),e.onMounted(()=>{i.addSubMenu(B),m.addSubMenu(B)}),e.onBeforeUnmount(()=>{m.removeSubMenu(B),i.removeSubMenu(B)}),()=>{var r;const p=[(r=s.title)==null?void 0:r.call(s),e.h(S.ElIcon,{class:E.e("icon-arrow"),style:{transform:x.value?t.expandCloseIcon&&t.expandOpenIcon||t.collapseCloseIcon&&t.collapseOpenIcon&&i.props.collapse?"none":"rotateZ(180deg)":"none"}},{default:()=>l.isString(P.value)?e.h(d.appContext.components[P.value]):e.h(P.value)})],M=i.isMenuPopup?e.h(K.ElTooltip,{ref:H,visible:x.value,effect:"light",pure:!0,offset:q.value,showArrow:!1,persistent:!0,popperClass:z.value,placement:w.value,teleported:D.value,fallbackPlacements:F.value,transition:W.value,gpuAcceleration:!1},{content:()=>{var T;return e.h("div",{class:[v.m(k.value),v.m("popup-container"),z.value],onMouseenter:O=>h(O,100),onMouseleave:()=>g(!0),onFocus:O=>h(O,100)},[e.h("ul",{class:[v.b(),v.m("popup"),v.m(`popup-${w.value}`)],style:A.value},[(T=s.default)==null?void 0:T.call(s)])])},default:()=>e.h("div",{class:E.e("title"),onClick:c},p)}):e.h(e.Fragment,{},[e.h("div",{class:E.e("title"),ref:j,onClick:c},p),e.h(ce,{},{default:()=>{var T;return e.withDirectives(e.h("ul",{role:"menu",class:[v.b(),v.m("inline")],style:A.value},[(T=s.default)==null?void 0:T.call(s)]),[[e.vShow,x.value]])}})]);return e.h("li",{class:[E.b(),E.is("active",$.value),E.is("opened",x.value),E.is("disabled",t.disabled)],role:"menuitem",ariaHaspopup:!0,ariaExpanded:x.value,onMouseenter:h,onMouseleave:()=>g(),onFocus:h},[M])}}});const Me=l.buildProps({mode:{type:String,values:["horizontal","vertical"],default:"vertical"},defaultActive:{type:String,default:""},defaultOpeneds:{type:l.definePropType(Array),default:()=>le.mutable([])},uniqueOpened:Boolean,router:Boolean,menuTrigger:{type:String,values:["hover","click"],default:"hover"},collapse:Boolean,backgroundColor:String,textColor:String,activeTextColor:String,closeOnClickOutside:Boolean,collapseTransition:{type:Boolean,default:!0},ellipsis:{type:Boolean,default:!0},popperOffset:{type:Number,default:6},ellipsisIcon:{type:S.iconPropType,default:()=>S.more_default},popperEffect:{type:l.definePropType(String),default:"dark"},popperClass:String,showTimeout:{type:Number,default:300},hideTimeout:{type:Number,default:300}}),U=t=>l.isArray(t)&&t.every(s=>l.isString(s)),ye={close:(t,s)=>l.isString(t)&&U(s),open:(t,s)=>l.isString(t)&&U(s),select:(t,s,o,d)=>l.isString(t)&&U(s)&&l.isObject(o)&&(d===void 0||d instanceof Promise)};var Ee=e.defineComponent({name:"ElMenu",props:Me,emits:ye,setup(t,{emit:s,slots:o,expose:d}){const n=e.getCurrentInstance(),C=n.appContext.config.globalProperties.$router,v=e.ref(),E=l.useNamespace("menu"),i=l.useNamespace("sub-menu"),m=e.ref(-1),f=e.ref(t.defaultOpeneds&&!t.collapse?t.defaultOpeneds.slice(0):[]),b=e.ref(t.defaultActive),I=e.ref({}),N=e.ref({}),j=e.computed(()=>t.mode==="horizontal"||t.mode==="vertical"&&t.collapse),H=()=>{const a=b.value&&I.value[b.value];if(!a||t.mode==="horizontal"||t.collapse)return;a.indexPath.forEach(c=>{const h=N.value[c];h&&w(c,h.indexPath)})},w=(a,u)=>{f.value.includes(a)||(t.uniqueOpened&&(f.value=f.value.filter(c=>u.includes(c))),f.value.push(a),s("open",a,u))},P=a=>{const u=f.value.indexOf(a);u!==-1&&f.value.splice(u,1)},_=(a,u)=>{P(a),s("close",a,u)},D=({index:a,indexPath:u})=>{f.value.includes(a)?_(a,u):w(a,u)},W=a=>{(t.mode==="horizontal"||t.collapse)&&(f.value=[]);const{index:u,indexPath:c}=a;if(!(l.isNil(u)||l.isNil(c)))if(t.router&&C){const h=a.route||u,g=C.push(h).then(r=>(r||(b.value=u),r));s("select",u,c,{index:u,indexPath:c,route:h},g)}else b.value=u,s("select",u,c,{index:u,indexPath:c})},F=a=>{const u=I.value,c=u[a]||b.value&&u[b.value]||u[t.defaultActive];c?b.value=c.index:b.value=a},x=a=>{const u=getComputedStyle(a),c=Number.parseInt(u.marginLeft,10),h=Number.parseInt(u.marginRight,10);return a.offsetWidth+c+h||0},$=()=>{var a,u;if(!v.value)return-1;const c=Array.from((u=(a=v.value)==null?void 0:a.childNodes)!=null?u:[]).filter(V=>V.nodeName!=="#text"||V.nodeValue),h=64,g=getComputedStyle(v.value),r=Number.parseInt(g.paddingLeft,10),p=Number.parseInt(g.paddingRight,10),M=v.value.clientWidth-r-p;let T=0,O=0;return c.forEach((V,te)=>{V.nodeName!=="#comment"&&(T+=x(V),T<=M-h&&(O=te+1))}),O===c.length?-1:O},k=a=>N.value[a].indexPath,B=(a,u=33.34)=>{let c;return()=>{c&&clearTimeout(c),c=setTimeout(()=>{a()},u)}};let A=!0;const q=()=>{if(m.value===$())return;const a=()=>{m.value=-1,e.nextTick(()=>{m.value=$()})};A?a():B(a)(),A=!1};e.watch(()=>t.defaultActive,a=>{I.value[a]||(b.value=""),F(a)}),e.watch(()=>t.collapse,a=>{a&&(f.value=[])}),e.watch(I.value,H);let z;e.watchEffect(()=>{t.mode==="horizontal"&&t.ellipsis?z=ne.useResizeObserver(v,q).stop:z==null||z()});const L=e.ref(!1);{const a=g=>{N.value[g.index]=g},u=g=>{delete N.value[g.index]},c=g=>{I.value[g.index]=g},h=g=>{delete I.value[g.index]};e.provide("rootMenu",e.reactive({props:t,openedMenus:f,items:I,subMenus:N,activeIndex:b,isMenuPopup:j,addMenuItem:c,removeMenuItem:h,addSubMenu:a,removeSubMenu:u,openMenu:w,closeMenu:_,handleMenuItemClick:W,handleSubMenuClick:D})),e.provide(`subMenu:${n.uid}`,{addSubMenu:a,removeSubMenu:u,mouseInChild:L,level:0})}e.onMounted(()=>{t.mode==="horizontal"&&new me(n.vnode.el,E.namespace.value)}),d({open:u=>{const{indexPath:c}=N.value[u];c.forEach(h=>w(h,c))},close:P,handleResize:q});const R=X(t,0);return()=>{var a,u;let c=(u=(a=o.default)==null?void 0:a.call(o))!=null?u:[];const h=[];if(t.mode==="horizontal"&&v.value){const p=ae.flattedChildren(c),M=m.value===-1?p:p.slice(0,m.value),T=m.value===-1?[]:p.slice(m.value);T!=null&&T.length&&t.ellipsis&&(c=M,h.push(e.h(J,{index:"sub-menu-more",class:i.e("hide-arrow"),popperOffset:t.popperOffset},{title:()=>e.h(S.ElIcon,{class:i.e("icon-more")},{default:()=>e.h(t.ellipsisIcon)}),default:()=>T})))}const g=t.closeOnClickOutside?[[se.ClickOutside,()=>{f.value.length&&(L.value||(f.value.forEach(p=>s("close",p,k(p))),f.value=[]))}]]:[],r=e.withDirectives(e.h("ul",{key:String(t.collapse),role:"menubar",ref:v,style:R.value,class:{[E.b()]:!0,[E.m(t.mode)]:!0,[E.m("collapse")]:t.collapse}},[...c,...h]),g);return t.collapseTransition&&t.mode==="vertical"?e.h(he,()=>r):r}}});const Ce=l.buildProps({index:{type:l.definePropType([String,null]),default:null},route:{type:l.definePropType([String,Object])},disabled:Boolean}),Ie={click:t=>l.isString(t.index)&&l.isArray(t.indexPath)},Z="ElMenuItem",Te=e.defineComponent({name:Z,components:{ElTooltip:K.ElTooltip},props:Ce,emits:Ie,setup(t,{emit:s}){const o=e.getCurrentInstance(),d=e.inject("rootMenu"),n=l.useNamespace("menu"),C=l.useNamespace("menu-item");d||l.throwError(Z,"can not inject root menu");const{parentMenu:v,indexPath:E}=Q(o,e.toRef(t,"index")),i=e.inject(`subMenu:${v.value.uid}`);i||l.throwError(Z,"can not inject sub menu");const m=e.computed(()=>t.index===d.activeIndex),f=e.reactive({index:t.index,indexPath:E,active:m}),b=()=>{t.disabled||(d.handleMenuItemClick({index:t.index,indexPath:E.value,route:t.route}),s("click",f))};return e.onMounted(()=>{i.addSubMenu(f),d.addMenuItem(f)}),e.onBeforeUnmount(()=>{i.removeSubMenu(f),d.removeMenuItem(f)}),{parentMenu:v,rootMenu:d,active:m,nsMenu:n,nsMenuItem:C,handleClick:b}}});function xe(t,s,o,d,n,C){const v=e.resolveComponent("el-tooltip");return e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass([t.nsMenuItem.b(),t.nsMenuItem.is("active",t.active),t.nsMenuItem.is("disabled",t.disabled)]),role:"menuitem",tabindex:"-1",onClick:t.handleClick},[t.parentMenu.type.name==="ElMenu"&&t.rootMenu.props.collapse&&t.$slots.title?(e.openBlock(),e.createBlock(v,{key:0,effect:t.rootMenu.props.popperEffect,placement:"right","fallback-placements":["left"],persistent:""},{content:e.withCtx(()=>[e.renderSlot(t.$slots,"title")]),default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(t.nsMenu.be("tooltip","trigger"))},[e.renderSlot(t.$slots,"default")],2)]),_:3},8,["effect"])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.renderSlot(t.$slots,"default"),e.renderSlot(t.$slots,"title")],64))],10,["onClick"])}var Y=l._export_sfc(Te,[["render",xe],["__file","menu-item.vue"]]);const Se={title:String},Ne="ElMenuItemGroup",we=e.defineComponent({name:Ne,props:Se,setup(){return{ns:l.useNamespace("menu-item-group")}}});function _e(t,s,o,d,n,C){return e.openBlock(),e.createElementBlock("li",{class:e.normalizeClass(t.ns.b())},[e.createElementVNode("div",{class:e.normalizeClass(t.ns.e("title"))},[t.$slots.title?e.renderSlot(t.$slots,"title",{key:1}):(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.createTextVNode(e.toDisplayString(t.title),1)],64))],2),e.createElementVNode("ul",null,[e.renderSlot(t.$slots,"default")])],2)}var ee=l._export_sfc(we,[["render",_e],["__file","menu-item-group.vue"]]);const ke=l.withInstall(Ee,{MenuItem:Y,MenuItemGroup:ee,SubMenu:J}),Oe=l.withNoopInstall(Y);l.withNoopInstall(ee);l.withNoopInstall(J);exports.ElMenu=ke;exports.ElMenuItem=Oe;