@wikimedia/codex
Version:
Codex Design System for Wikimedia
2 lines (1 loc) • 3.76 kB
JavaScript
import{d as $,b4 as E,C as j,c as p,b5 as H,b2 as q,b6 as z,aB as F,r,ae as O,H as P,_ as w,a as m,as as T,a7 as U,b as B,o as f,f as G,g as R,e as k,h as b,n as x,t as C,x as J,v as h,y as L,z as Q,j as y,w as g,E as I,G as X}from"./DemoBaseLayout.vue_vue_type_style_index_0_lang-CZ7OyK4g.js";import{C as Y}from"./Tooltip-DrefmCK_.js";/* empty css */import{C as Z}from"./Button-BmO8KPcu.js";import{C as ee,u as te}from"./useFloatingMenu-B_pwSjl7.js";const ne={notice:F,error:z,warning:q,success:H},oe=$({name:"CdxInfoChip",components:{CdxIcon:j},directives:{tooltip:Y},props:{status:{type:String,default:"notice",validator:E},icon:{type:[String,Object],default:null}},setup(e,{slots:t}){const l=p(()=>({["cdx-info-chip--".concat(e.status)]:!0})),n=p(()=>e.status==="notice"?e.icon:ne[e.status]),a=r(),i=r(!1),s=p(()=>i.value&&a.value&&a.value.scrollWidth>a.value.clientWidth?O(t==null?void 0:t.default)[0]:null);return P(()=>{i.value=!0}),{rootClasses:l,computedIcon:n,tooltipContent:s,textElement:a}}}),ae={ref:"textElement",class:"cdx-info-chip__text"};function se(e,t,l,n,a,i){const s=m("cdx-icon"),o=T("tooltip");return U((f(),B("div",{class:x(["cdx-info-chip",e.rootClasses])},[e.computedIcon?(f(),G(s,{key:0,class:"cdx-info-chip__icon--vue",icon:e.computedIcon},null,8,["icon"])):R("v-if",!0),k("span",ae,[b(e.$slots,"default")],512)],2)),[[o,e.tooltipContent]])}const fe=w(oe,[["render",se]]),de=$({name:"CdxMenuButton",components:{CdxButton:Z,CdxMenu:ee},inheritAttrs:!1,props:{selected:{type:[String,Number,Array,null],required:!0},menuItems:{type:Array,required:!0},menuConfig:{type:Object,default:()=>({})},action:{type:String,default:"default"},weight:{type:String,default:"quiet"},disabled:{type:Boolean,default:!1},footer:{type:Object,default:null}},emits:["update:selected"],setup(e,{emit:t,attrs:l}){const n=r(),a=r(),i=C(e,"selected"),s=J(i,t,"update:selected"),o=r(!1),d=h(),S=h(),{computedDisabled:v}=L(C(e,"disabled")),{rootClasses:M,rootStyle:A,otherAttrs:K}=Q(l);let c=!1;function _(u){if(!(!n.value||v.value||e.menuItems.length===0||u.key===" ")){if(u.key==="Enter"){const N=n.value.getHighlightedMenuItem(),V=n.value.getHighlightedViaKeyboard();o.value&&N&&V?n.value.delegateKeyNavigation(u):(u.preventDefault(),o.value=!o.value),c=!0;return}n.value.delegateKeyNavigation(u)}}function W(){if(c){c=!1;return}o.value=!o.value}function D(){o.value=!1}return te(a,n,{useAvailableWidth:!0,placement:"bottom-start",offset:4}),{computedDisabled:v,expanded:o,menu:n,menuId:S,modelWrapper:s,onKeydown:_,onClick:W,onBlur:D,button:a,buttonId:d,rootClasses:M,rootStyle:A,otherAttrs:K}}}),ie={class:"cdx-menu-button__menu-wrapper"};function le(e,t,l,n,a,i){const s=m("cdx-button"),o=m("cdx-menu");return f(),B("div",{class:x(["cdx-menu-button",e.rootClasses]),style:X(e.rootStyle)},[y(s,I({id:e.buttonId,ref:"button"},e.otherAttrs,{disabled:e.computedDisabled,weight:e.weight,action:e.action,"aria-haspopup":"menu","aria-controls":e.menuId,"aria-expanded":e.expanded,onClick:e.onClick,onBlur:e.onBlur,onKeydown:e.onKeydown}),{default:g(()=>[b(e.$slots,"default")]),_:3},16,["id","disabled","weight","action","aria-controls","aria-expanded","onClick","onBlur","onKeydown"]),k("div",ie,[y(o,I({id:e.menuId,ref:"menu",selected:e.modelWrapper,"onUpdate:selected":t[0]||(t[0]=d=>e.modelWrapper=d),expanded:e.expanded,"onUpdate:expanded":t[1]||(t[1]=d=>e.expanded=d),class:"cdx-menu-button__menu","menu-items":e.menuItems},e.menuConfig,{role:"menu","aria-labelledby":e.buttonId,footer:e.footer}),{default:g(({menuItem:d})=>[b(e.$slots,"menu-item",{menuItem:d})]),_:3},16,["id","selected","expanded","menu-items","aria-labelledby","footer"])])],6)}const be=w(de,[["render",le]]);export{be as C,fe as a};