UNPKG

@wikimedia/codex

Version:

Codex Design System for Wikimedia

2 lines (1 loc) 3.38 kB
import{d as $,C as W,b3 as D,c as p,r as u,ac as E,G as K,aA as N,b4 as _,b2 as j,b5 as q,_ as x,a as c,ar as O,a5 as T,o as m,b as h,f as U,k as z,e as w,g as f,n as B,an as F,t as C,v as P,s as b,x as G,y as R,i as y,w as v,D as I,E as H}from"./DemoBaseLayout.vue_vue_type_style_index_0_lang-ChPp1b9F.js";import{C as J}from"./Tooltip-BnM8wg-B.js";/* empty css */import{C as L,u as Q}from"./useFloatingMenu-lGCYR9Tn.js";const X={notice:N,error:_,warning:j,success:q},Y=$({name:"CdxInfoChip",components:{CdxIcon:W},directives:{tooltip:J},props:{status:{type:String,default:"notice",validator:D},icon:{type:[String,Object],default:null}},setup(e,{slots:t}){const l=p(()=>({["cdx-info-chip--".concat(e.status)]:!0})),s=p(()=>e.status==="notice"?e.icon:X[e.status]),n=u(),d=u(!1),a=p(()=>d.value&&n.value&&n.value.scrollWidth>n.value.clientWidth?E(t==null?void 0:t.default)[0]:null);return K(()=>{d.value=!0}),{rootClasses:l,computedIcon:s,tooltipContent:a,textElement:n}}}),Z={ref:"textElement",class:"cdx-info-chip__text"};function ee(e,t,l,s,n,d){const a=c("cdx-icon"),r=O("tooltip");return T((m(),h("div",{class:B(["cdx-info-chip",e.rootClasses])},[e.computedIcon?(m(),U(a,{key:0,class:"cdx-info-chip__icon--vue",icon:e.computedIcon},null,8,["icon"])):z("v-if",!0),w("span",Z,[f(e.$slots,"default")],512)],2)),[[r,e.tooltipContent]])}const re=x(Y,[["render",ee]]),te=$({name:"CdxMenuButton",components:{CdxToggleButton:F,CdxMenu:L},inheritAttrs:!1,props:{selected:{type:[String,Number,Array,null],required:!0},menuItems:{type:Array,required:!0},menuConfig:{type:Object,default:()=>({})},disabled:{type:Boolean,default:!1},footer:{type:Object,default:null}},emits:["update:selected"],setup(e,{emit:t,attrs:l}){const s=u(),n=u(),d=C(e,"selected"),a=P(d,t,"update:selected"),r=u(!1),o=b(),S=b(),{computedDisabled:g}=G(C(e,"disabled")),{rootClasses:A,rootStyle:M,otherAttrs:k}=R(l);function V(i){!s.value||g.value||e.menuItems.length===0||i.key===" "||i.key==="Enter"||s.value.delegateKeyNavigation(i)}return Q(n,s,{useAvailableWidth:!0,placement:"bottom-start",offset:4}),{computedDisabled:g,expanded:r,menu:s,menuId:S,modelWrapper:a,onKeydown:V,toggle:n,toggleId:o,rootClasses:A,rootStyle:M,otherAttrs:k}}}),oe={class:"cdx-menu-button__menu-wrapper"};function ne(e,t,l,s,n,d){const a=c("cdx-toggle-button"),r=c("cdx-menu");return m(),h("div",{class:B(["cdx-menu-button",e.rootClasses]),style:H(e.rootStyle)},[y(a,I({id:e.toggleId,ref:"toggle"},e.otherAttrs,{modelValue:e.expanded,"onUpdate:modelValue":t[0]||(t[0]=o=>e.expanded=o),disabled:e.computedDisabled,quiet:"","aria-haspopup":"menu","aria-controls":e.menuId,"aria-expanded":e.expanded,onBlur:t[1]||(t[1]=o=>e.expanded=!1),onKeydown:e.onKeydown}),{default:v(()=>[f(e.$slots,"default")]),_:3},16,["id","modelValue","disabled","aria-controls","aria-expanded","onKeydown"]),w("div",oe,[y(r,I({id:e.menuId,ref:"menu",selected:e.modelWrapper,"onUpdate:selected":t[2]||(t[2]=o=>e.modelWrapper=o),expanded:e.expanded,"onUpdate:expanded":t[3]||(t[3]=o=>e.expanded=o),"menu-items":e.menuItems},e.menuConfig,{role:"menu","aria-labelledby":e.toggleId,footer:e.footer}),{default:v(({menuItem:o})=>[f(e.$slots,"menu-item",{menuItem:o})]),_:3},16,["id","selected","expanded","menu-items","aria-labelledby","footer"])])],6)}const ue=x(te,[["render",ne]]);export{ue as C,re as a};