UNPKG

@wikimedia/codex

Version:

Codex Design System for Wikimedia

1 lines 123 kB
var pt=Object.getOwnPropertySymbols;var Et=Object.prototype.hasOwnProperty,Ut=Object.prototype.propertyIsEnumerable;var He=(e,t)=>{var n={};for(var l in e)Et.call(e,l)&&t.indexOf(l)<0&&(n[l]=e[l]);if(e!=null&&pt)for(var l of pt(e))t.indexOf(l)<0&&Ut.call(e,l)&&(n[l]=e[l]);return n};var De=(e,t,n)=>new Promise((l,i)=>{var m=a=>{try{r(n.next(a))}catch(c){i(c)}},f=a=>{try{r(n.throw(a))}catch(c){i(c)}},r=a=>a.done?l(a.value):Promise.resolve(a.value).then(m,f);r((n=n.apply(e,t)).next())});import{d as I,C as G,r as g,t as K,c as C,_ as z,a as R,o as h,b as x,e as o,f as N,w as v,g as P,h as xt,i as s,j as re,k as U,n as H,u as Pt,l as Rt,F as te,m as ae,p as b,q as T,s as ie,v as Te,x as Ee,y as xe,z as ce,A as Ft,B as Be,V as Ae,D as de,E as pe,G as je,H as ot,I as nt,J as Ve,K as yt,L as lt,M as $e,T as Ot,N as wt,O as qe,P as Wt,Q as Nt,R as Ce,S as Kt,U as kt,W as zt,X as jt,Y as Ge,Z as qt,$ as Gt,a0 as Ht,a1 as Qt,a2 as Jt,a3 as Yt,a4 as _t,a5 as ue,a6 as Zt,a7 as at,a8 as $t,a9 as Ct,aa as Ze,ab as Xt,ac as eo,ad as to,ae as oo,af as st,ag as It,ah as no,ai as Xe,aj as ye,ak as lo,al as ao,am as p,an as Ie,ao as Oe,ap as so,aq as We,ar as St,as as Tt,at as io,au as ro,av as le,aw as uo,ax as Bt,ay as po,az as co,aA as it,aB as mo,aC as vo,aD as fo,aE as bo,aF as go,aG as ct,aH as Ue,aI as At,aJ as ho,aK as xo,aL as yo,aM as wo,aN as mt,aO as ko,aP as _o}from"./DemoBaseLayout.vue_vue_type_style_index_0_lang-ChPp1b9F.js";import{C as q}from"./Button-DrTkl5TI.js";import{u as dt,C as vt,v as rt,a as $o}from"./data-DUL_EKtM.js";/* empty css */import{C as Ne,a as fe}from"./MenuButton-BXv1FLbE.js";import{C as Dt}from"./Tooltip-BnM8wg-B.js";/* empty css */import{C as et,a as Qe}from"./Message-ByfBfR2p.js";import{C as tt,a as Le,b as Pe}from"./Table-BeNlMuNS.js";import{C as me}from"./TextInput-i-fL9gv4.js";import{C as Se,u as Me,a as Co,b as Io,c as So,d as ft,e as To,f as Je,g as Bo}from"./useFloatingMenu-lGCYR9Tn.js";/* empty css */import{o as Ao,f as Do,s as Vo,a as Lo}from"./floating-ui.dom-G9leGyGp.js";const Mo=I({name:"CdxAccordion",components:{CdxButton:q,CdxIcon:G},props:{modelValue:{type:[Boolean,null],default:null},actionAlwaysVisible:{type:Boolean,default:!1},actionIcon:{type:[String,Object],default:null},actionButtonLabel:{type:String,default:""},headingLevel:{type:String,default:"h3"}},emits:["action-button-click","update:modelValue","toggle"],setup(e,{attrs:t,emit:n}){const l=g("open"in t),i=dt(l,K(e,"modelValue"),n),m=()=>{n("action-button-click")},f=c=>{i.value=c.newState==="open",n("toggle",i.value)},r=C(()=>e.actionIcon?i.value?!0:!!e.actionAlwaysVisible:!1),a=C(()=>({"cdx-accordion--has-icon":r.value}));return{emitActionButtonClick:m,rootClasses:a,shouldShowActionButton:r,onToggle:f,computedOpen:i}}}),Eo=["open"],Uo={class:"cdx-accordion__header__title"},Po={class:"cdx-accordion__header__description"};function Ro(e,t,n,l,i,m){const f=R("cdx-icon"),r=R("cdx-button");return h(),x("details",{class:H(["cdx-accordion",e.rootClasses]),open:e.computedOpen||void 0,onToggle:t[1]||(t[1]=(...a)=>e.onToggle&&e.onToggle(...a))},[o("summary",null,[(h(),N(xt(e.headingLevel),{class:"cdx-accordion__header"},{default:v(()=>[o("span",Uo,[P(e.$slots,"title")]),o("span",Po,[P(e.$slots,"description")])]),_:3})),e.shouldShowActionButton?(h(),N(r,{key:0,class:"cdx-accordion__action","aria-label":e.actionButtonLabel,type:"button",weight:"quiet",onClick:re(e.emitActionButtonClick,["stop"])},{default:v(()=>[s(f,{icon:e.actionIcon,"icon-label":e.actionButtonLabel,size:"medium"},null,8,["icon","icon-label"])]),_:1},8,["aria-label","onClick"])):U("v-if",!0)]),o("div",{class:"cdx-accordion__content",onClick:t[0]||(t[0]=re(()=>{},["stop"]))},[P(e.$slots,"default")])],42,Eo)}const ge=z(Mo,[["render",Ro]]),Fo=I({name:"CdxButtonGroup",components:{CdxButton:q,CdxIcon:G},props:{buttons:{type:Array,required:!0,validator:e=>Array.isArray(e)&&e.length>=1},disabled:{type:Boolean,default:!1}},emits:["click"],setup(e){const{rootElement:t,assignTemplateRef:n,onFocus:l,onBlur:i,onKeydown:m}=Pt(K(e,"buttons"));return{rootElement:t,assignTemplateRef:n,onFocus:l,onBlur:i,onKeydown:m,getButtonLabel:Rt}}}),Oo={ref:"rootElement",class:"cdx-button-group"};function Wo(e,t,n,l,i,m){const f=R("cdx-icon"),r=R("cdx-button");return h(),x("div",Oo,[(h(!0),x(te,null,ae(e.buttons,(a,c)=>(h(),N(r,{key:a.value,ref_for:!0,ref:u=>e.assignTemplateRef(u,c),disabled:a.disabled||e.disabled,"aria-label":a.ariaLabel,onClick:u=>e.$emit("click",a.value),onFocus:u=>e.onFocus(c),onBlur:e.onBlur,onKeydown:e.onKeydown},{default:v(()=>[P(e.$slots,"default",{button:a},()=>[a.icon?(h(),N(f,{key:0,icon:a.icon},null,8,["icon"])):U("v-if",!0),b(" "+T(e.getButtonLabel(a)),1)])]),_:2},1032,["disabled","aria-label","onClick","onFocus","onBlur","onKeydown"]))),128))],512)}const No=z(Fo,[["render",Wo]]),Ko=Be(Ae),zo=I({name:"CdxCombobox",components:{CdxButton:q,CdxIcon:G,CdxMenu:Se,CdxTextInput:me},inheritAttrs:!1,props:{menuItems:{type:Array,required:!0},selected:{type:[String,Number],required:!0},disabled:{type:Boolean,default:!1},menuConfig:{type:Object,default:()=>({})},status:{type:String,default:"default",validator:Ko}},emits:["update:selected","load-more","input","change","focus","blur"],setup(e,{emit:t,attrs:n,slots:l}){const i=g(),m=g(),f=g(),r=ie(),a=K(e,"selected"),c=Te(a,t,"update:selected"),u=g(!1),_=g(!1),A=C(()=>{var W,S;return(S=(W=f.value)==null?void 0:W.getHighlightedMenuItem())==null?void 0:S.id}),{computedDisabled:y,computedStatus:B}=Ee(K(e,"disabled"),K(e,"status")),k=C(()=>({"cdx-combobox--expanded":u.value,"cdx-combobox--disabled":y.value})),{rootClasses:$,rootStyle:F,otherAttrs:Q}=xe(n,k);function V(W){_.value&&u.value?u.value=!1:(e.menuItems.length>0||l["no-results"])&&(u.value=!0),t("focus",W)}function L(W){u.value=_.value&&u.value,t("blur",W)}function ee(){y.value||(_.value=!0)}function O(){var W;y.value||(W=i.value)==null||W.focus()}function Z(W){!f.value||y.value||e.menuItems.length===0||W.key===" "||f.value.delegateKeyNavigation(W)}return Me(i,f),ce(u,()=>{_.value=!1}),{input:i,inputWrapper:m,menu:f,menuId:r,modelWrapper:c,expanded:u,highlightedId:A,computedDisabled:y,computedStatus:B,onInputFocus:V,onInputBlur:L,onKeydown:Z,onButtonClick:O,onButtonMousedown:ee,cdxIconExpand:Ft,rootClasses:$,rootStyle:F,otherAttrs:Q}}}),jo={ref:"inputWrapper",class:"cdx-combobox__input-wrapper"};function qo(e,t,n,l,i,m){const f=R("cdx-text-input"),r=R("cdx-icon"),a=R("cdx-button"),c=R("cdx-menu");return h(),x("div",{class:H(["cdx-combobox",e.rootClasses]),style:pe(e.rootStyle)},[o("div",jo,[s(f,de({ref:"input",modelValue:e.modelWrapper,"onUpdate:modelValue":t[0]||(t[0]=u=>e.modelWrapper=u)},e.otherAttrs,{class:"cdx-combobox__input","aria-activedescendant":e.highlightedId,"aria-expanded":e.expanded,"aria-controls":e.menuId,disabled:e.computedDisabled,status:e.computedStatus,autocomplete:"off",role:"combobox",onKeydown:e.onKeydown,onInput:t[1]||(t[1]=u=>e.$emit("input",u)),onChange:t[2]||(t[2]=u=>e.$emit("change",u)),onFocus:e.onInputFocus,onBlur:e.onInputBlur}),null,16,["modelValue","aria-activedescendant","aria-expanded","aria-controls","disabled","status","onKeydown","onFocus","onBlur"]),s(a,{class:"cdx-combobox__expand-button","aria-hidden":"true",disabled:e.computedDisabled,tabindex:"-1",type:"button",onMousedown:e.onButtonMousedown,onClick:e.onButtonClick},{default:v(()=>[s(r,{class:"cdx-combobox__expand-icon",icon:e.cdxIconExpand},null,8,["icon"])]),_:1},8,["disabled","onMousedown","onClick"])],512),s(c,de({id:e.menuId,ref:"menu",selected:e.modelWrapper,"onUpdate:selected":t[3]||(t[3]=u=>e.modelWrapper=u),expanded:e.expanded,"onUpdate:expanded":t[4]||(t[4]=u=>e.expanded=u),"menu-items":e.menuItems},e.menuConfig,{onLoadMore:t[5]||(t[5]=u=>e.$emit("load-more"))}),{default:v(({menuItem:u})=>[P(e.$slots,"menu-item",{menuItem:u})]),"no-results":v(()=>[P(e.$slots,"no-results")]),_:3},16,["id","selected","expanded","menu-items"])],6)}const _e=z(zo,[["render",qo]]);function Go(e){const t=g({width:void 0,height:void 0});if(typeof window!="object"||!("ResizeObserver"in window)||!("ResizeObserverEntry"in window))return t;const n=new window.ResizeObserver(i=>{var f,r;const m=i==null?void 0:i[0];m&&(t.value={width:(f=m.borderBoxSize)==null?void 0:f[0].inlineSize,height:(r=m.borderBoxSize)==null?void 0:r[0].blockSize})});let l=!1;return je(()=>{l=!0,e.value&&n.observe(e.value)}),ot(()=>{l=!1,n.disconnect()}),ce(e,i=>{l&&(n.disconnect(),t.value={width:void 0,height:void 0},i&&n.observe(i))}),t}const Ho=I({name:"CdxDialog",components:{CdxButton:q,CdxIcon:G},inheritAttrs:!1,props:{open:{type:Boolean,default:!1},title:{type:String,required:!0},subtitle:{type:String,required:!1,default:null},hideTitle:{type:Boolean,default:!1},useCloseButton:{type:Boolean,default:!1},closeButtonLabel:{type:String,default:"",validator:(e,t)=>e.length>0&&!t.useCloseButton?(console.warn("[CdxDialog]: The boolean `useCloseButton` prop is required to show the close button.\n\nRefer to https://doc.wikimedia.org/codex/latest/components/demos/dialog.html#props."),!1):!0},primaryAction:{type:Object,default:null},defaultAction:{type:Object,default:null},stackedActions:{type:Boolean,default:!1},target:{type:String,default:null},renderInPlace:{type:Boolean,default:!1}},emits:["update:open","primary","default"],setup(e,{emit:t}){const n=ie(),l=g(),i=g(),m=g(),f=g(),r=g(),a=g();let c=null;const u=C(()=>e.useCloseButton||e.closeButtonLabel.length>0),_=nt(K(e,"closeButtonLabel"),"cdx-dialog-close-button-label","Close"),A=C(()=>!e.hideTitle||u.value),y=C(()=>!!e.primaryAction||!!e.defaultAction),B=Go(m),k=C(()=>{var E;return(E=B.value.height)!=null?E:0}),$=g(!1),F=C(()=>({"cdx-dialog--vertical-actions":e.stackedActions,"cdx-dialog--horizontal-actions":!e.stackedActions,"cdx-dialog--dividers":$.value})),Q=Ve("CdxTeleportTarget",void 0),V=C(()=>{var E,Y;return(Y=(E=e.target)!=null?E:Q)!=null?Y:"body"}),L=g(0);function ee(){t("update:open",!1)}let O=!1;function Z(E){O=E.target===l.value}function W(){O&&ee()}function S(){w(i.value)}function d(){w(i.value,!0)}function w(E,Y=!1){let be=Array.from(E.querySelectorAll('\n input, select, textarea, button, object, a, area,\n [contenteditable], [tabindex]:not([tabindex^="-"])\n '));Y&&(be=be.reverse());for(const M of be)if(M.focus(),document.activeElement===M)return!0;return!1}let D=[],j=[];function oe(){let E=l.value;for(;E.parentElement&&E.nodeName!=="BODY";){for(const Y of Array.from(E.parentElement.children))Y===E||Y.nodeName==="SCRIPT"||(Y.hasAttribute("aria-hidden")||(Y.setAttribute("aria-hidden","true"),D.push(Y)),Y.hasAttribute("inert")||(Y.setAttribute("inert",""),j.push(Y)));E=E.parentElement}}function se(){for(const E of D)E.removeAttribute("aria-hidden");for(const E of j)E.removeAttribute("inert");D=[],j=[]}function ne(){return De(this,null,function*(){var E;yield lt(),L.value=window.innerWidth-document.documentElement.clientWidth,document.documentElement.style.setProperty("margin-right","".concat(L.value,"px")),document.body.classList.add("cdx-dialog-open"),oe(),c=document.activeElement,w(m.value)||(E=f.value)==null||E.focus()})}function X(){document.body.classList.remove("cdx-dialog-open"),document.documentElement.style.removeProperty("margin-right"),se(),c instanceof HTMLElement&&document.contains(c)&&(c.focus(),c=null)}return je(()=>De(this,null,function*(){e.open&&(yield ne())})),ot(()=>{e.open&&X()}),ce(K(e,"open"),E=>De(this,null,function*(){E?yield ne():X()})),ce(k,()=>{m.value&&($.value=m.value.clientHeight<m.value.scrollHeight)}),{close:ee,onBackdropClick:W,onBackdropMouseDown:Z,cdxIconClose:yt,labelId:n,rootClasses:F,backdrop:l,dialogElement:i,focusTrapStart:r,focusTrapEnd:a,focusFirst:S,focusLast:d,dialogBody:m,focusHolder:f,showHeader:A,showFooterActions:y,useCloseButtonOrLabel:u,translatedCloseButtonLabel:_,computedTarget:V}}}),Qo=["aria-label","aria-labelledby"],Jo={key:0,class:"cdx-dialog__header__title-group"},Yo=["id"],Zo={key:0,class:"cdx-dialog__header__subtitle"},Xo={ref:"focusHolder",class:"cdx-dialog-focus-trap",tabindex:"-1"},en={key:0,class:"cdx-dialog__footer__text"},tn={key:1,class:"cdx-dialog__footer__actions"};function on(e,t,n,l,i,m){const f=R("cdx-icon"),r=R("cdx-button");return h(),N(wt,{to:e.computedTarget,disabled:e.renderInPlace},[s(Ot,{name:"cdx-dialog-fade",appear:""},{default:v(()=>[e.open?(h(),x("div",{key:0,ref:"backdrop",class:"cdx-dialog-backdrop",onMousedown:t[5]||(t[5]=(...a)=>e.onBackdropMouseDown&&e.onBackdropMouseDown(...a)),onClick:t[6]||(t[6]=(...a)=>e.onBackdropClick&&e.onBackdropClick(...a)),onKeyup:t[7]||(t[7]=$e((...a)=>e.close&&e.close(...a),["escape"]))},[o("div",{ref:"focusTrapStart",tabindex:"0",onFocus:t[0]||(t[0]=(...a)=>e.focusLast&&e.focusLast(...a))},null,544),o("div",de({ref:"dialogElement",class:["cdx-dialog",e.rootClasses],role:"dialog"},e.$attrs,{"aria-label":e.$slots.header||e.hideTitle?e.title:void 0,"aria-labelledby":!e.$slots.header&&!e.hideTitle?e.labelId:void 0,"aria-modal":"true",onClick:t[3]||(t[3]=re(()=>{},["stop"]))}),[e.showHeader||e.$slots.header?(h(),x("header",{key:0,class:H(["cdx-dialog__header",{"cdx-dialog__header--default":!e.$slots.header}])},[P(e.$slots,"header",{},()=>[e.hideTitle?U("v-if",!0):(h(),x("div",Jo,[o("h2",{id:e.labelId,class:"cdx-dialog__header__title"},T(e.title),9,Yo),e.subtitle?(h(),x("p",Zo,T(e.subtitle),1)):U("v-if",!0)])),e.useCloseButtonOrLabel?(h(),N(r,{key:1,class:"cdx-dialog__header__close-button",weight:"quiet",type:"button","aria-label":e.translatedCloseButtonLabel,onClick:e.close},{default:v(()=>[s(f,{icon:e.cdxIconClose},null,8,["icon"])]),_:1},8,["aria-label","onClick"])):U("v-if",!0)])],2)):U("v-if",!0),o("div",Xo,null,512),o("div",{ref:"dialogBody",class:H(["cdx-dialog__body",{"cdx-dialog__body--no-header":!(e.showHeader||e.$slots.header),"cdx-dialog__body--no-footer":!(e.showFooterActions||e.$slots.footer||e.$slots["footer-text"])}])},[P(e.$slots,"default")],2),e.showFooterActions||e.$slots.footer||e.$slots["footer-text"]?(h(),x("footer",{key:1,class:H(["cdx-dialog__footer",{"cdx-dialog__footer--default":!e.$slots.footer}])},[P(e.$slots,"footer",{},()=>[e.$slots["footer-text"]?(h(),x("p",en,[P(e.$slots,"footer-text")])):U("v-if",!0),e.showFooterActions?(h(),x("div",tn,[e.primaryAction?(h(),N(r,{key:0,class:"cdx-dialog__footer__primary-action",weight:"primary",action:e.primaryAction.actionType,disabled:e.primaryAction.disabled,onClick:t[1]||(t[1]=a=>e.$emit("primary"))},{default:v(()=>[b(T(e.primaryAction.label),1)]),_:1},8,["action","disabled"])):U("v-if",!0),e.defaultAction?(h(),N(r,{key:1,class:"cdx-dialog__footer__default-action",disabled:e.defaultAction.disabled,onClick:t[2]||(t[2]=a=>e.$emit("default"))},{default:v(()=>[b(T(e.defaultAction.label),1)]),_:1},8,["disabled"])):U("v-if",!0)])):U("v-if",!0)])],2)):U("v-if",!0)],16,Qo),o("div",{ref:"focusTrapEnd",tabindex:"0",onFocus:t[4]||(t[4]=(...a)=>e.focusFirst&&e.focusFirst(...a))},null,544)],544)):U("v-if",!0)]),_:3})],8,["to","disabled"])}const he=z(Ho,[["render",on]]),nn=Be(Ae),ln=I({name:"CdxField",components:{CdxLabel:qe,CdxMessage:et},props:{labelIcon:{type:[String,Object],default:""},optional:{type:Boolean,default:!1},optionalFlag:{type:String,default:"",validator:(e,t)=>e.length>0&&!t.optional?(console.warn("[CdxField]: The boolean `optional` prop is required to show the optional flag.\n\nRefer to https://doc.wikimedia.org/codex/latest/components/demos/field.html#props."),!1):!0},hideLabel:{type:Boolean,default:!1},isFieldset:{type:Boolean,default:!1},disabled:{type:Boolean,default:!1},status:{type:String,default:"default",validator:nn},messages:{type:Object,default:()=>({})}},setup(e,{slots:t}){const{disabled:n,status:l,isFieldset:i}=Wt(e),m=Nt(n),f=C(()=>({"cdx-field--disabled":m.value,"cdx-field--is-fieldset":i.value})),r=ie(),a=ie(),c=ie(),u=C(()=>i.value?void 0:c);Ce(Kt,u);const _=C(()=>!i.value&&t.description?a:void 0);Ce(kt,_),Ce(zt,m),Ce(jt,l);const A=C(()=>e.status!=="default"&&e.status in e.messages?e.messages[e.status]:""),y=C(()=>e.status==="default"?"notice":e.status);return{rootClasses:f,computedDisabled:m,labelId:r,descriptionId:a,inputId:c,validationMessage:A,validationMessageType:y}}}),an={class:"cdx-field__control"},sn={class:"cdx-field__help-text"},dn={key:0,class:"cdx-field__validation-message"};function rn(e,t,n,l,i,m){const f=R("cdx-label"),r=R("cdx-message");return h(),N(xt(e.isFieldset?"fieldset":"div"),{class:H(["cdx-field",e.rootClasses]),"aria-disabled":!e.isFieldset&&e.computedDisabled?!0:void 0,disabled:e.isFieldset&&e.computedDisabled?!0:void 0},{default:v(()=>[s(f,{id:e.labelId,icon:e.labelIcon,"visually-hidden":e.hideLabel,optional:e.optional,"optional-flag":e.optionalFlag,"input-id":e.inputId,"description-id":e.descriptionId,disabled:e.computedDisabled,"is-legend":e.isFieldset},Ge({default:v(()=>[P(e.$slots,"label")]),_:2},[e.$slots.description&&e.$slots.description().length>0?{name:"description",fn:v(()=>[P(e.$slots,"description")]),key:"0"}:void 0]),1032,["id","icon","visually-hidden","optional","optional-flag","input-id","description-id","disabled","is-legend"]),o("div",an,[P(e.$slots,"default")]),o("div",sn,[P(e.$slots,"help-text")]),!e.computedDisabled&&e.validationMessage||e.$slots[e.validationMessageType]?(h(),x("div",dn,[s(r,{type:e.validationMessageType,inline:!0},{default:v(()=>[e.status==="warning"&&e.$slots.warning?P(e.$slots,"warning",{key:0}):e.status==="error"&&e.$slots.error?P(e.$slots,"error",{key:1}):e.status==="success"&&e.$slots.success?P(e.$slots,"success",{key:2}):(h(),x(te,{key:3},[b(T(e.validationMessage),1)],64))]),_:3},8,["type"])])):U("v-if",!0)]),_:3},8,["class","aria-disabled","disabled"])}const Ke=z(ln,[["render",rn]]),un=I({name:"CdxImage",components:{CdxIcon:G},inheritAttrs:!1,props:{src:{type:String,default:""},alt:{type:String,required:!0,default:""},aspectRatio:{type:String,validator:qt,default:null},objectPosition:{type:String,validator:Gt,default:"center"},objectFit:{type:String,validator:Ht,default:"cover"},position:{type:String,default:""},width:{type:[String,Number],default:void 0},height:{type:[String,Number],default:void 0},loadingPriority:{type:String,default:"lazy"}},emits:["error"],setup(e,{emit:t,attrs:n}){const l=g(e.src),i=g(!1),m=g(!1),f=C(()=>{var $;return{["cdx-image__image--".concat(($=e.aspectRatio)==null?void 0:$.split(":").join("-"))]:!!e.aspectRatio,["cdx-image__image--object-position-".concat(e.objectPosition)]:!!e.objectPosition,["cdx-image__image--object-fit-".concat(e.objectFit)]:!!e.objectFit,"cdx-image__image--is-broken":i.value,"cdx-image__image--is-loading":!m.value&&!i.value}}),r=C(()=>({["cdx-image--".concat(e.position)]:!!e.position})),{rootClasses:a,rootStyle:c,otherAttrs:u}=xe(n,r),_=C(()=>({width:"".concat(e.width,"px"),height:"".concat(e.height,"px")})),A=C(()=>{var $;return{["cdx-image__placeholder--".concat(($=e.aspectRatio)==null?void 0:$.split(":").join("-"))]:!!e.aspectRatio}}),y=$=>{i.value=!0,t("error",$)},B=()=>{m.value=!0},k=C(()=>{const $=Number(e.width);return $<=32?"cdx-image__placeholder__icon--size-smallest":$<=180?"cdx-image__placeholder__icon--size-small":$<=280?"cdx-image__placeholder__icon--size-medium":"cdx-image__placeholder__icon--size-large"});return{imageSrc:l,isBroken:i,isLoaded:m,imageClasses:f,rootClasses:a,rootStyle:c,otherAttrs:u,placeholderStyles:_,handleError:y,handleLoad:B,cdxIconImage:Qt,iconSizeClass:k,placeholderClasses:A}}}),pn=["src","alt","width","height","loading"];function cn(e,t,n,l,i,m){const f=R("cdx-icon");return h(),x("div",{class:H(["cdx-image",e.rootClasses]),style:pe(e.rootStyle)},[e.src?(h(),x("img",de({key:0},e.otherAttrs,{src:e.imageSrc,alt:e.alt,width:e.width,height:e.height,loading:e.loadingPriority,class:["cdx-image__image",e.imageClasses],onLoad:t[0]||(t[0]=(...r)=>e.handleLoad&&e.handleLoad(...r)),onError:t[1]||(t[1]=(...r)=>e.handleError&&e.handleError(...r))}),null,16,pn)):U("v-if",!0),!e.src||!e.isLoaded&&!e.isBroken?(h(),x("div",{key:1,class:H(["cdx-image__placeholder",e.placeholderClasses]),style:pe(e.placeholderStyles)},[s(f,{icon:e.cdxIconImage,class:H(["cdx-image__placeholder__icon",[e.iconSizeClass]])},null,8,["icon","class"])],6)):U("v-if",!0)],6)}const bt=z(un,[["render",cn]]),mn=Be(Ae),vn=I({name:"CdxLookup",components:{CdxMenu:Se,CdxTextInput:me},inheritAttrs:!1,props:{selected:{type:[String,Number,null],required:!0},menuItems:{type:Array,required:!0},inputValue:{type:[String,Number],default:null},disabled:{type:Boolean,default:!1},menuConfig:{type:Object,default:()=>({})},status:{type:String,default:"default",validator:mn}},emits:["update:selected","update:input-value","load-more","input","change","focus","blur"],setup:(e,{emit:t,attrs:n,slots:l})=>{const i=g(),m=g(),f=g(),r=ie(),a=g(!1),c=g(!1),u=g(!1),_=g(e.menuItems),{computedDisabled:A,computedStatus:y}=Ee(K(e,"disabled"),K(e,"status")),B=K(e,"selected"),k=Te(B,t,"update:selected"),$=C(()=>{var D;return(D=f.value)==null?void 0:D.getComputedMenuItems().find(j=>j.value===k.value)}),F=C(()=>{var D,j;return(j=(D=f.value)==null?void 0:D.getHighlightedMenuItem())==null?void 0:j.id}),Q=g(""),V=dt(Q,K(e,"inputValue"),t,"update:input-value"),L=C(()=>({"cdx-lookup--disabled":A.value,"cdx-lookup--pending":a.value})),{rootClasses:ee,rootStyle:O,otherAttrs:Z}=xe(n,L);function W(D){$.value?$.value.label!==D&&$.value.value!==D&&(k.value=null):e.selected!==null&&e.selected!==D&&(k.value=null),D===""&&_.value.length===0?(c.value=!1,a.value=!1):a.value=!0,t("input",D)}function S(D){u.value=!0;const j=V.value!==null&&V.value!=="";!!(e.menuItems.length>0||l["no-results"])&&(j||_.value.length>0)&&(c.value=!0),t("focus",D)}function d(D){u.value=!1,c.value=!1,t("blur",D)}function w(D){!f.value||A.value||e.menuItems.length===0&&!l["no-results"]||D.key===" "||f.value.delegateKeyNavigation(D)}return Me(m,f),ce(k,D=>{var j;if(D!==null){const oe=$.value?(j=$.value.label)!=null?j:$.value.value:"";V.value!==oe&&(V.value=oe,t("input",oe))}}),ce(K(e,"menuItems"),D=>{u.value&&a.value&&(D.length>0||l["no-results"])&&(c.value=!0),D.length===0&&!l["no-results"]&&(c.value=!1),a.value=!1}),{rootElement:i,textInput:m,menu:f,menuId:r,highlightedId:F,computedInputValue:V,selection:k,expanded:c,computedDisabled:A,computedStatus:y,onInputBlur:d,rootClasses:ee,rootStyle:O,otherAttrs:Z,onUpdateInput:W,onInputFocus:S,onKeydown:w}}});function fn(e,t,n,l,i,m){const f=R("cdx-text-input"),r=R("cdx-menu");return h(),x("div",{ref:"rootElement",class:H(["cdx-lookup",e.rootClasses]),style:pe(e.rootStyle)},[s(f,de({ref:"textInput",modelValue:e.computedInputValue,"onUpdate:modelValue":t[0]||(t[0]=a=>e.computedInputValue=a)},e.otherAttrs,{class:"cdx-lookup__input",role:"combobox",autocomplete:"off","aria-autocomplete":"list","aria-controls":e.menuId,"aria-expanded":e.expanded,"aria-activedescendant":e.highlightedId,disabled:e.computedDisabled,status:e.computedStatus,"onUpdate:modelValue":e.onUpdateInput,onChange:t[1]||(t[1]=a=>e.$emit("change",a)),onFocus:e.onInputFocus,onBlur:e.onInputBlur,onKeydown:e.onKeydown}),null,16,["modelValue","aria-controls","aria-expanded","aria-activedescendant","disabled","status","onUpdate:modelValue","onFocus","onBlur","onKeydown"]),s(r,de({id:e.menuId,ref:"menu",selected:e.selection,"onUpdate:selected":t[2]||(t[2]=a=>e.selection=a),expanded:e.expanded,"onUpdate:expanded":t[3]||(t[3]=a=>e.expanded=a),"menu-items":e.menuItems},e.menuConfig,{onLoadMore:t[4]||(t[4]=a=>e.$emit("load-more"))}),{default:v(({menuItem:a})=>[P(e.$slots,"menu-item",{menuItem:a})]),"no-results":v(()=>[P(e.$slots,"no-results")]),_:3},16,["id","selected","expanded","menu-items"])],6)}const Vt=z(vn,[["render",fn]]),bn=I({name:"CdxPopover",components:{CdxButton:q,CdxIcon:G},inheritAttrs:!1,props:{anchor:{type:Object,default:null},open:{type:Boolean,default:!1},title:{type:String,default:""},icon:{type:[String,Object],default:""},useCloseButton:{type:Boolean,default:!1},closeButtonLabel:{type:String,default:"Close"},primaryAction:{type:Object,default:null},defaultAction:{type:Object,default:null},stackedActions:{type:Boolean,default:!1},renderInPlace:{type:Boolean,default:!1},placement:{type:String,default:"bottom"}},emits:["update:open","primary","default"],setup(e,{emit:t}){const n=K(e,"placement"),l=g(),i=K(e,"anchor"),m=g(),f=16,r=192,a=200,c=512,k=Math.sqrt(16**2+16**2)/2+4,$=C(()=>[Ao(k),Do(),Vo({padding:f,apply({availableWidth:X,availableHeight:E,elements:Y}){const be=Math.min(c,X);Object.assign(Y.floating.style,{maxWidth:"".concat(Math.max(r,be),"px"),maxHeight:"".concat(Math.max(a,E),"px")})}}),Co({element:m})]),{floatingStyles:F,middlewareData:Q,placement:V,x:L,y:ee}=Io(i,l,{whileElementsMounted:Lo,placement:n,middleware:$}),O=Jt({left:"0",top:"0",right:"0",bottom:"0",transform:"none"}),Z=C(()=>Yt[V.value]);ce([L,ee],()=>{if(Q.value.arrow){const{x:X,y:E}=Q.value.arrow;O.left=X?"".concat(X,"px"):"",O.top=E?"".concat(E,"px"):"",O.right="",O.bottom="",O[Z.value]="".concat(-16/2-1,"px");const Y={top:"rotate( 45deg )",right:"rotate( 135deg )",bottom:"rotate( 225deg )",left:"rotate( 315deg )"};O.transform=Y[Z.value]}});const W=Ve("CdxTeleportTarget",void 0),S=C(()=>W!=null?W:"body"),d=nt(K(e,"closeButtonLabel"),"cdx-popover-close-button-label","Close"),w=C(()=>!!e.title||!!e.icon||e.useCloseButton),D=C(()=>!!e.primaryAction||!!e.defaultAction),j=C(()=>({"cdx-popover__footer__actions--vertical":e.stackedActions,"cdx-popover__footer__actions--horizontal":!e.stackedActions}));function oe(){t("update:open",!1)}function se(X){X.key==="Escape"&&oe()}function ne(X){const E=So(i.value);X.target!==document.documentElement&&l.value&&!l.value.contains(X.target)&&!(E!=null&&E.contains(X.target))&&oe()}return ce(()=>e.open,X=>{X?(document.addEventListener("keydown",se),document.addEventListener("mousedown",ne),document.addEventListener("focusin",ne)):(document.removeEventListener("keydown",se),document.removeEventListener("mousedown",ne),document.removeEventListener("focusin",ne))}),je(()=>De(this,null,function*(){e.open&&(document.addEventListener("keydown",se),document.addEventListener("mousedown",ne),document.addEventListener("focusin",ne)),yield lt(),e.anchor===null&&console.warn('[CdxPopover]: The "anchor" prop must be provided to position the CdxPopover.')})),ot(()=>{document.removeEventListener("keydown",se),document.removeEventListener("mousedown",ne),document.removeEventListener("focusin",ne)}),{computedTarget:S,translatedCloseButtonLabel:d,showHeader:w,showFooter:D,footerActionsClasses:j,close:oe,cdxIconClose:yt,floating:l,floatingStyles:F,arrowRef:m,arrowStyles:O}}}),gn={key:0,class:"cdx-popover__header"},hn={key:1,class:"cdx-popover__header__title"},xn={class:"cdx-popover__header__button-wrapper"},yn={class:"cdx-popover__body"},wn={key:1,class:"cdx-popover__footer"};function kn(e,t,n,l,i,m){const f=R("cdx-icon"),r=R("cdx-button");return h(),N(wt,{to:e.computedTarget,disabled:e.renderInPlace},[e.open?(h(),x("div",de({key:0,ref:"floating",class:"cdx-popover",style:e.floatingStyles},e.$attrs),[e.showHeader||e.$slots.header?(h(),x("header",gn,[P(e.$slots,"header",{},()=>[e.icon?(h(),N(f,{key:0,class:"cdx-popover__header__icon",icon:e.icon},null,8,["icon"])):U("v-if",!0),e.title?(h(),x("div",hn,T(e.title),1)):U("v-if",!0),o("div",xn,[e.useCloseButton?(h(),N(r,{key:0,class:"cdx-popover__header__close-button",weight:"quiet",type:"button","aria-label":e.translatedCloseButtonLabel,onClick:e.close},{default:v(()=>[s(f,{icon:e.cdxIconClose},null,8,["icon"])]),_:1},8,["aria-label","onClick"])):U("v-if",!0)])])])):U("v-if",!0),o("div",yn,[P(e.$slots,"default")]),e.showFooter||e.$slots.footer?(h(),x("footer",wn,[P(e.$slots,"footer",{},()=>[o("div",{class:H(["cdx-popover__footer__actions",e.footerActionsClasses])},[e.primaryAction?(h(),N(r,{key:0,class:"cdx-popover__footer__primary-action",weight:"primary",action:e.primaryAction.actionType,disabled:e.primaryAction.disabled,onClick:t[0]||(t[0]=a=>e.$emit("primary"))},{default:v(()=>[b(T(e.primaryAction.label),1)]),_:1},8,["action","disabled"])):U("v-if",!0),e.defaultAction?(h(),N(r,{key:1,class:"cdx-popover__footer__default-action",disabled:e.defaultAction.disabled,onClick:t[1]||(t[1]=a=>e.$emit("default"))},{default:v(()=>[b(T(e.defaultAction.label),1)]),_:1},8,["disabled"])):U("v-if",!0)],2)])])):U("v-if",!0),o("div",{ref:"arrowRef",class:"cdx-popover__arrow",style:pe(e.arrowStyles)},null,4)],16)):U("v-if",!0)],8,["to","disabled"])}const Re=z(bn,[["render",kn]]),_n=I({name:"CdxProgressIndicator",components:{CdxLabel:qe},inheritAttrs:!1,props:{showLabel:{type:Boolean,default:!1}},setup(e,{slots:t,attrs:n}){var a;_t((a=t.default)==null?void 0:a.call(t),n);const l=C(()=>({"cdx-progress-indicator--has-label-visible":e.showLabel})),{rootClasses:i,rootStyle:m,otherAttrs:f}=xe(n,l),r=ie();return{rootClasses:i,rootStyle:m,progressIndicatorId:r,otherAttrs:f}}}),$n={class:"cdx-progress-indicator__indicator"},Cn=["id"];function In(e,t,n,l,i,m){var r,a;const f=R("cdx-label");return h(),x("div",{class:H(["cdx-progress-indicator",e.rootClasses]),style:pe(e.rootStyle)},[o("span",$n,[o("progress",de({id:e.progressIndicatorId,class:"cdx-progress-indicator__indicator__progress"},e.otherAttrs),null,16,Cn)]),(a=(r=e.$slots).default)!=null&&a.call(r,{})?(h(),N(f,{key:0,class:"cdx-progress-indicator__label","input-id":e.progressIndicatorId,"visually-hidden":!e.showLabel},{default:v(()=>[P(e.$slots,"default")]),_:3},8,["input-id","visually-hidden"])):U("v-if",!0)],6)}const gt=z(_n,[["render",In]]),Sn=Be(Ae),Tn=I({name:"CdxRadio",components:{CdxLabel:qe},props:{modelValue:{type:[String,Number,Boolean],default:""},inputValue:{type:[String,Number,Boolean],default:!1},name:{type:String,required:!0},disabled:{type:Boolean,default:!1},inline:{type:Boolean,default:!1},status:{type:String,default:"default",validator:Sn}},emits:["update:modelValue"],setup(e,{emit:t,slots:n,attrs:l}){var y;_t((y=n.default)==null?void 0:y.call(n),l);const{computedDisabled:i,computedStatus:m}=Ee(K(e,"disabled"),K(e,"status")),f=C(()=>({"cdx-radio--inline":e.inline,["cdx-radio--status-".concat(m.value)]:!0})),r=C(()=>({"cdx-radio__custom-input--inline":e.inline})),a=g(),c=ie(),u=ie(),_=()=>{a.value.focus()},A=Te(K(e,"modelValue"),t);return{rootClasses:f,computedDisabled:i,input:a,radioId:c,descriptionId:u,focusInput:_,wrappedModel:A,customInputClasses:r}}}),Bn={class:"cdx-radio__wrapper"},An=["id","aria-describedby","name","value","disabled"];function Dn(e,t,n,l,i,m){const f=R("cdx-label");return h(),x("div",{class:H(["cdx-radio",e.rootClasses])},[o("div",Bn,[ue(o("input",{id:e.radioId,ref:"input","onUpdate:modelValue":t[0]||(t[0]=r=>e.wrappedModel=r),class:"cdx-radio__input",type:"radio","aria-describedby":e.$slots.description&&e.$slots.description().length>0?e.descriptionId:void 0,name:e.name,value:e.inputValue,disabled:e.computedDisabled},null,8,An),[[Zt,e.wrappedModel]]),t[1]||(t[1]=o("span",{class:"cdx-radio__icon"},null,-1)),e.$slots.default&&e.$slots.default().length?(h(),N(f,{key:0,class:"cdx-radio__label","input-id":e.radioId,"description-id":e.$slots.description&&e.$slots.description().length>0?e.descriptionId:void 0,disabled:e.computedDisabled,onClick:e.focusInput},Ge({default:v(()=>[P(e.$slots,"default")]),_:2},[e.$slots.description&&e.$slots.description().length>0?{name:"description",fn:v(()=>[P(e.$slots,"description")]),key:"0"}:void 0]),1032,["input-id","description-id","disabled","onClick"])):U("v-if",!0)]),e.$slots["custom-input"]?(h(),x("div",{key:0,class:H(["cdx-radio__custom-input",e.customInputClasses])},[P(e.$slots,"custom-input")],2)):U("v-if",!0)],2)}const ze=z(Tn,[["render",Dn]]),Vn=Be(Ae),Ln=I({name:"CdxSearchInput",components:{CdxButton:q,CdxTextInput:me},inheritAttrs:!1,props:{modelValue:{type:[String,Number],default:""},useButton:{type:Boolean,default:!1},hideIcon:{type:Boolean,default:!1},clearable:{type:Boolean,default:!1},buttonLabel:{type:String,default:"",validator:(e,t)=>e.length>0&&!t.useButton?(console.warn("[CdxSearchInput]: The boolean `useButton` prop is required to show the search button.\n\nRefer to https://doc.wikimedia.org/codex/latest/components/demos/search-input.html#props."),!1):!0},disabled:{type:Boolean,default:!1},status:{type:String,default:"default",validator:Vn}},emits:["update:modelValue","submit-click","input","change","focus","blur"],setup(e,{emit:t,attrs:n}){const l=Te(K(e,"modelValue"),t),{computedDisabled:i}=Ee(K(e,"disabled")),m=C(()=>({"cdx-search-input--has-end-button":!!e.buttonLabel||e.useButton})),{rootClasses:f,rootStyle:r,otherAttrs:a}=xe(n,m),c=nt(K(e,"buttonLabel"),"cdx-search-input-search-button-label","Search"),u=C(()=>e.useButton||e.buttonLabel.length>0);return{wrappedModel:l,computedDisabled:i,rootClasses:f,rootStyle:r,otherAttrs:a,handleSubmit:()=>{t("submit-click",l.value)},searchIcon:at,translatedSearchButtonLabel:c,useButtonOrLabel:u}},methods:{focus(){this.$refs.textInput.focus()}}}),Mn={class:"cdx-search-input__input-wrapper"};function En(e,t,n,l,i,m){const f=R("cdx-text-input"),r=R("cdx-button");return h(),x("div",{class:H(["cdx-search-input",e.rootClasses]),style:pe(e.rootStyle)},[o("div",Mn,[s(f,de({ref:"textInput",modelValue:e.wrappedModel,"onUpdate:modelValue":t[0]||(t[0]=a=>e.wrappedModel=a),class:"cdx-search-input__text-input","input-type":"search","start-icon":e.hideIcon?void 0:e.searchIcon,clearable:e.clearable,disabled:e.computedDisabled,status:e.status},e.otherAttrs,{onKeydown:$e(e.handleSubmit,["enter"]),onInput:t[1]||(t[1]=a=>e.$emit("input",a)),onChange:t[2]||(t[2]=a=>e.$emit("change",a)),onFocus:t[3]||(t[3]=a=>e.$emit("focus",a)),onBlur:t[4]||(t[4]=a=>e.$emit("blur",a))}),null,16,["modelValue","start-icon","clearable","disabled","status","onKeydown"]),P(e.$slots,"default")]),e.useButtonOrLabel?(h(),N(r,{key:0,class:"cdx-search-input__end-button",disabled:e.computedDisabled,onClick:e.handleSubmit},{default:v(()=>[b(T(e.translatedSearchButtonLabel),1)]),_:1},8,["disabled","onClick"])):U("v-if",!0)],6)}const Lt=z(Ln,[["render",En]]),Un=I({name:"CdxTab",props:{name:{type:String,required:!0},label:{type:String,default:""},disabled:{type:Boolean,default:!1}},setup(e){var m;const t=Ve($t),n=Ve(Ct);if(!t||!n)throw new Error("Tab component must be used inside a Tabs component");const l=(m=t.value.get(e.name))!=null?m:{},i=C(()=>e.name===n.value);return{tab:l,isActive:i}}}),Pn=["id","aria-hidden","aria-labelledby"];function Rn(e,t,n,l,i,m){return ue((h(),x("section",{id:e.tab.id,"aria-hidden":e.isActive?void 0:!0,"aria-labelledby":"".concat(e.tab.id,"-label"),class:"cdx-tab",role:"tabpanel",tabindex:"-1"},[P(e.$slots,"default")],8,Pn)),[[Ze,e.isActive]])}const Mt=z(Un,[["render",Rn]]),Fn=I({name:"CdxTabs",components:{CdxButton:q,CdxIcon:G},props:{active:{type:String,default:null},framed:{type:Boolean,default:!1}},emits:["update:active"],setup(e,{slots:t,emit:n}){const l=g(),i=g(),m=g(),f=g(),r=Xt(l),a=C(()=>{const S=eo(t.default);if(!S.every(d=>typeof d=="object"&&to(d,Mt.name)))throw new Error("Slot content may only contain CdxTab components");if(S.length===0)throw new Error("Slot content cannot be empty");return S}),c=C(()=>a.value.reduce((S,d)=>{var w;if((w=d.props)!=null&&w.name&&typeof d.props.name=="string"){if(S.get(d.props.name))throw new Error("Tab names must be unique");S.set(d.props.name,{name:d.props.name,id:ie(),label:d.props.label||d.props.name,disabled:d.props.disabled})}return S},new Map)),u=g(Array.from(c.value.keys())[0]),_=dt(u,K(e,"active"),n,"update:active"),A=C(()=>Array.from(c.value.keys())),y=C(()=>A.value.indexOf(_.value)),B=C(()=>{var S;return(S=c.value.get(_.value))==null?void 0:S.id});Ce(Ct,_),Ce($t,c);const k=g(new Map),$=g(),F=g(),Q=ft($,{threshold:.95}),V=ft(F,{threshold:.95});function L(S,d){const w=S;w&&(k.value.set(d,w),d===0?$.value=w:d===A.value.length-1&&(F.value=w))}const ee=C(()=>({"cdx-tabs--framed":e.framed,"cdx-tabs--quiet":!e.framed}));function O(){var S;(S=k.value.get(y.value))==null||S.focus()}function Z(S){if(!i.value||!m.value||!f.value)return 0;const d=r.value==="rtl"?f.value:m.value,w=r.value==="rtl"?m.value:f.value,D=S.offsetLeft,j=D+S.clientWidth,oe=i.value.scrollLeft+d.clientWidth,se=i.value.scrollLeft+i.value.clientWidth-w.clientWidth;return D<oe?D-oe:j>se?j-se:0}function W(S){if(!i.value||!m.value||!f.value)return;const d=S==="next"&&r.value==="ltr"||S==="prev"&&r.value==="rtl"?1:-1;let w=0,D=S==="next"?i.value.firstElementChild:i.value.lastElementChild;for(;D;){const j=S==="next"?D.nextElementSibling:D.previousElementSibling;if(w=Z(D),Math.sign(w)===d){j&&Math.abs(w)<.25*i.value.clientWidth&&(w=Z(j));break}D=j}i.value.scrollBy({left:w,behavior:"smooth"}),O()}return ce(_,()=>{if(B.value===void 0||!i.value||!m.value||!f.value)return;const S=document.getElementById("".concat(B.value,"-label"));S&&i.value.scrollBy({left:Z(S),behavior:"smooth"})}),{activeTab:_,activeTabIndex:y,activeTabId:B,currentDirection:r,rootElement:l,tabListElement:i,prevScroller:m,nextScroller:f,rootClasses:ee,tabNames:A,tabsData:c,firstLabelVisible:Q,lastLabelVisible:V,assignTemplateRefForTabButton:L,scrollTabs:W,focusActiveTab:O,cdxIconPrevious:oo,cdxIconNext:st}},methods:{select(e,t){const n=this.tabsData.get(e);n&&!(n!=null&&n.disabled)&&(this.activeTab=e,t&&lt(()=>{this.focusActiveTab()}))},selectNonDisabled(e,t,n){const l=this.tabsData.get(this.tabNames[e+t]);l&&(l.disabled?this.selectNonDisabled(e+t,t,n):this.select(l.name,n))},next(e){this.selectNonDisabled(this.activeTabIndex,1,e)},prev(e){this.selectNonDisabled(this.activeTabIndex,-1,e)},onLeftArrowKeypress(){this.currentDirection==="rtl"?this.next(!0):this.prev(!0)},onRightArrowKeypress(){this.currentDirection==="rtl"?this.prev(!0):this.next(!0)},onDownArrowKeypress(){var e;this.activeTabId&&((e=document.getElementById(this.activeTabId))==null||e.focus())}}}),On={class:"cdx-tabs__header"},Wn={ref:"prevScroller",class:"cdx-tabs__prev-scroller"},Nn={ref:"tabListElement",class:"cdx-tabs__list",role:"tablist"},Kn=["id","disabled","aria-controls","aria-selected","tabindex","onClick","onKeyup"],zn={ref:"nextScroller",class:"cdx-tabs__next-scroller"},jn={class:"cdx-tabs__content"};function qn(e,t,n,l,i,m){const f=R("cdx-icon"),r=R("cdx-button");return h(),x("div",{ref:"rootElement",class:H(["cdx-tabs",e.rootClasses])},[o("div",On,[ue(o("div",Wn,[s(r,{class:"cdx-tabs__scroll-button",weight:"quiet",type:"button",tabindex:"-1","aria-hidden":!0,onMousedown:t[0]||(t[0]=re(()=>{},["prevent"])),onClick:t[1]||(t[1]=a=>e.scrollTabs("prev"))},{default:v(()=>[s(f,{icon:e.cdxIconPrevious},null,8,["icon"])]),_:1})],512),[[Ze,!e.firstLabelVisible]]),o("div",Nn,[(h(!0),x(te,null,ae(e.tabsData.values(),(a,c)=>(h(),x("button",{id:"".concat(a.id,"-label"),key:c,ref_for:!0,ref:u=>e.assignTemplateRefForTabButton(u,c),disabled:a.disabled?!0:void 0,"aria-controls":a.id,"aria-selected":a.name===e.activeTab,tabindex:a.name===e.activeTab?void 0:-1,class:"cdx-tabs__list__item",role:"tab",onClick:re(u=>e.select(a.name),["prevent"]),onKeyup:$e(u=>e.select(a.name),["enter"]),onKeydown:[t[2]||(t[2]=$e(re((...u)=>e.onRightArrowKeypress&&e.onRightArrowKeypress(...u),["prevent"]),["right"])),t[3]||(t[3]=$e(re((...u)=>e.onDownArrowKeypress&&e.onDownArrowKeypress(...u),["prevent"]),["down"])),t[4]||(t[4]=$e(re((...u)=>e.onLeftArrowKeypress&&e.onLeftArrowKeypress(...u),["prevent"]),["left"]))]},[o("span",null,T(a.label),1)],40,Kn))),128))],512),ue(o("div",zn,[s(r,{class:"cdx-tabs__scroll-button",weight:"quiet",type:"button",tabindex:"-1","aria-hidden":!0,onMousedown:t[5]||(t[5]=re(()=>{},["prevent"])),onClick:t[6]||(t[6]=a=>e.scrollTabs("next"))},{default:v(()=>[s(f,{icon:e.cdxIconNext},null,8,["icon"])]),_:1})],512),[[Ze,!e.lastLabelVisible]])]),o("div",jn,[P(e.$slots,"default")])],2)}const Gn=z(Fn,[["render",qn]]),Hn=Be(Ae),Qn=I({name:"CdxTextArea",components:{CdxIcon:G},inheritAttrs:!1,props:{modelValue:{type:String,default:""},status:{type:String,default:"default",validator:Hn},disabled:{type:Boolean,default:!1},autosize:{type:Boolean,default:!1},startIcon:{type:[String,Object],default:void 0},endIcon:{type:[String,Object],default:void 0}},emits:["update:modelValue","input","change","focus","blur","invalid"],setup(e,{attrs:t,emit:n}){const l=g(),i=Te(K(e,"modelValue"),n),m=t.id,{computedDisabled:f,computedStatus:r,computedInputId:a}=Ee(K(e,"disabled"),K(e,"status"),m),c=Ve(kt,void 0),u=C(()=>({"cdx-text-area__textarea--has-value":!!i.value,"cdx-text-area__textarea--is-autosize":e.autosize})),_=C(()=>({"cdx-text-area--status-default":r.value==="default","cdx-text-area--status-error":r.value==="error","cdx-text-area--has-start-icon":!!e.startIcon,"cdx-text-area--has-end-icon":!!e.endIcon})),{rootClasses:A,rootStyle:y,otherAttrs:B}=xe(t,_),k=C(()=>{const W=B.value,{id:O}=W;return He(W,["id"])});function $(O){l.value&&e.autosize&&(l.value.style.height="auto",l.value.style.height="".concat(l.value.scrollHeight,"px")),n("input",O)}const F=O=>{n("change",O)},Q=O=>{n("focus",O)},V=O=>{n("blur",O)},L=g(!0);return{textarea:l,rootClasses:A,rootStyle:y,wrappedModel:i,computedDisabled:f,computedInputId:a,descriptionId:c,textareaClasses:u,otherAttrsMinusId:k,onInput:$,onChange:F,onFocus:Q,onBlur:V,onInvalid:(O,Z)=>{Z&&O.preventDefault(),n("invalid",O),L.value=!0},shouldPreventDefault:L}},methods:{focus(){this.$refs.textarea.focus()},blur(){this.$refs.textarea.blur()},checkValidity(){return this.$refs.textarea.checkValidity()},reportValidity(){return this.shouldPreventDefault=!1,this.$refs.textarea.reportValidity()},setCustomValidity(e){this.$refs.textarea.setCustomValidity(e)}}}),Jn=["id","aria-describedby","disabled"];function Yn(e,t,n,l,i,m){const f=R("cdx-icon");return h(),x("div",{class:H(["cdx-text-area",e.rootClasses]),style:pe(e.rootStyle)},[ue(o("textarea",de({id:e.computedInputId,ref:"textarea"},e.otherAttrsMinusId,{"onUpdate:modelValue":t[0]||(t[0]=r=>e.wrappedModel=r),class:[e.textareaClasses,"cdx-text-area__textarea"],"aria-describedby":e.descriptionId,disabled:e.computedDisabled,onInput:t[1]||(t[1]=(...r)=>e.onInput&&e.onInput(...r)),onChange:t[2]||(t[2]=(...r)=>e.onChange&&e.onChange(...r)),onFocus:t[3]||(t[3]=(...r)=>e.onFocus&&e.onFocus(...r)),onBlur:t[4]||(t[4]=(...r)=>e.onBlur&&e.onBlur(...r)),onInvalid:t[5]||(t[5]=r=>e.onInvalid(r,e.shouldPreventDefault))}),null,16,Jn),[[It,e.wrappedModel]]),e.startIcon?(h(),N(f,{key:0,icon:e.startIcon,class:"cdx-text-area__icon-vue cdx-text-area__start-icon"},null,8,["icon"])):U("v-if",!0),e.endIcon?(h(),N(f,{key:1,icon:e.endIcon,class:"cdx-text-area__icon-vue cdx-text-area__end-icon"},null,8,["icon"])):U("v-if",!0)],6)}const Zn=z(Qn,[["render",Yn]]),Xn=I({name:"CdxTypeaheadSearch",components:{CdxIcon:G,CdxMenu:Se,CdxSearchInput:Lt},inheritAttrs:!1,props:{id:{type:String,required:!0},formAction:{type:String,required:!0},searchResults:{type:Array,required:!0},useButton:{type:Boolean,default:!1},buttonLabel:{type:String,default:"",validator:(e,t)=>e.length>0&&!t.useButton?(console.warn("[CdxTypeaheadSearch]: The boolean `useButton` prop is required to show the search button.\n\nRefer to https://doc.wikimedia.org/codex/latest/components/demos/typeahead-search.html#props."),!1):!0},initialInputValue:{type:String,default:""},searchFooterUrl:{type:String,default:""},debounceInterval:{type:Number,default:no},highlightQuery:{type:Boolean,default:!1},showThumbnail:{type:Boolean,default:!1},autoExpandWidth:{type:Boolean,default:!1},visibleItemLimit:{type:Number,default:null},showEmptyQueryResults:{type:Boolean,default:!1},isMobileView:{type:Boolean,default:!1}},emits:["input","search-result-click","submit","load-more"],setup(e,{attrs:t,emit:n,slots:l}){const i=g(),m=g(),f=ie(),r=Xe("cdx-typeahead-search-search-results-label","Search results"),a=g(!1),c=g(!1),u=g(!1),_=g(!1),A=g(e.initialInputValue),y=g(""),B=C(()=>{var M,J;return(J=(M=m.value)==null?void 0:M.getHighlightedMenuItem())==null?void 0:J.id}),k=g(null),$=C(()=>({"cdx-typeahead-search__menu-message--has-thumbnail":e.showThumbnail})),F=C(()=>e.searchResults.find(M=>M.value===k.value)),Q=C(()=>e.searchFooterUrl&&y.value.length>0?{value:ye,url:e.searchFooterUrl}:void 0),V=C(()=>({"cdx-typeahead-search--expanded":a.value,"cdx-typeahead-search--is-mobile-view":e.isMobileView,"cdx-typeahead-search--show-thumbnail":e.showThumbnail,"cdx-typeahead-search--auto-expand-width":e.showThumbnail&&e.autoExpandWidth&&!e.isMobileView})),{rootClasses:L,rootStyle:ee,otherAttrs:O}=xe(t,V);function Z(M){return M}const W=C(()=>({visibleItemLimit:e.visibleItemLimit,showThumbnail:e.showThumbnail,boldLabel:!0,hideDescriptionOverflow:!0}));let S,d;function w(M,J=!1){F.value&&F.value.label!==M&&F.value.value!==M&&(k.value=null),d!==void 0&&(clearTimeout(d),d=void 0),M===""?a.value=!1:(c.value=!0,l["search-results-pending"]&&(d=setTimeout(()=>{_.value&&(a.value=!0),u.value=!0},ao))),S!==void 0&&(clearTimeout(S),S=void 0);const ve=()=>{n("input",M)};J?ve():S=setTimeout(()=>{ve()},e.debounceInterval)}function D(M){var J;if(M===ye){k.value=null,A.value=y.value;return}k.value=M,M!==null&&(A.value=F.value?(J=F.value.label)!=null?J:String(F.value.value):"")}function j(){_.value=!0,(y.value||u.value||e.showEmptyQueryResults&&e.searchResults.length>0)&&(a.value=!0)}function oe(){_.value=!1,a.value=!1}function se(M){const ut=M,{id:J}=ut,ve=He(ut,["id"]);if(ve.value===ye){n("search-result-click",{searchResult:null,index:e.searchResults.length,numberOfResults:e.searchResults.length});return}ne(ve)}function ne(M){const J={searchResult:M,index:e.searchResults.findIndex(ve=>ve.value===M.value),numberOfResults:e.searchResults.length};n("search-result-click",J)}function X(M){var J;if(M.value===ye){A.value=y.value;return}A.value=M.value?(J=M.label)!=null?J:String(M.value):""}function E(M){var J;a.value=!1,(J=m.value)==null||J.clearActive(),se(M)}function Y(M){if(F.value)ne(F.value),M.stopPropagation(),window.location.assign(F.value.url),M.preventDefault();else{const J={searchResult:null,index:-1,numberOfResults:e.searchResults.length};n("submit",J)}}function be(M){if(!m.value||!y.value&&!e.showEmptyQueryResults||M.key===" ")return;const J=m.value.getHighlightedMenuItem(),ve=m.value.getHighlightedViaKeyboard();switch(M.key){case"Enter":J&&(J.value===ye&&ve?window.location.assign(e.searchFooterUrl):m.value.delegateKeyNavigation(M,{prevent:!1})),a.value=!1;break;case"Tab":a.value=!1;break;default:m.value.delegateKeyNavigation(M);break}}return je(()=>{e.initialInputValue&&w(e.initialInputValue,!0)}),ce(K(e,"searchResults"),()=>{y.value=A.value.trim(),(_.value&&c.value&&y.value.length>0||e.showEmptyQueryResults&&e.searchResults.length>0)&&(a.value=!0),d!==void 0&&(clearTimeout(d),d=void 0),c.value=!1,u.value=!1}),{form:i,menu:m,menuId:f,highlightedId:B,selection:k,menuMessageClass:$,footer:Q,asSearchResult:Z,inputValue:A,searchQuery:y,expanded:a,showPending:u,rootClasses:L,rootStyle:ee,otherAttrs:O,menuConfig:W,onUpdateInputValue:w,onUpdateMenuSelection:D,onFocus:j,onBlur:oe,onSearchResultClick:se,onSearchResultKeyboardNavigation:X,onSearchFooterClick:E,onSubmit:Y,onKeydown:be,MenuFooterValue:ye,articleIcon:lo,translatedSearchResultsLabel:r}},methods:{focus(){this.$refs.searchInput.focus()}}}),el=["id","action"],tl={class:"cdx-typeahead-search__menu-message__text"},ol={class:"cdx-typeahead-search__menu-message__text"},nl=["href","onClickCapture"],ll={class:"cdx-menu-item__text cdx-typeahead-search__search-footer__text"},al={class:"cdx-typeahead-search__search-footer__query"};function sl(e,t,n,l,i,m){const f=R("cdx-icon"),r=R("cdx-menu"),a=R("cdx-search-input");return h(),x("div",{class:H(["cdx-typeahead-search",e.rootClasses]),style:pe(e.rootStyle)},[o("form",{id:e.id,ref:"form",class:"cdx-typeahead-search__form",action:e.formAction,onSubmit:t[4]||(t[4]=(...c)=>e.onSubmit&&e.onSubmit(...c))},[s(a,de({ref:"searchInput",modelValue:e.inputValue,"onUpdate:modelValue":t[3]||(t[3]=c=>e.inputValue=c),"button-label":e.buttonLabel,"use-button":e.useButton&&!e.isMobileView,"hide-icon":e.isMobileView,clearable:e.isMobileView},e.otherAttrs,{class:"cdx-typeahead-search__input",name:"search",role:"combobox",autocomplete:"off","aria-autocomplete":"list","aria-owns":e.showEmptyQueryResults&&e.searchQuery.length===0?e.menuId:void 0,"aria-controls":!e.showEmptyQueryResults||e.searchQuery.length>0?e.menuId:void 0,"aria-expanded":e.expanded,"aria-activedescendant":e.highlightedId,"onUpdate:modelValue":e.onUpdateInputValue,onFocus:e.onFocus,onBlur:e.onBlur,onKeydown:e.onKeydown}),{default:v(()=>[s(r,de({id:e.menuId,ref:"menu",expanded:e.expanded,"onUpdate:expanded":t[0]||(t[0]=c=>e.expanded=c),class:"cdx-typeahead-search__menu","show-pending":e.showPending,selected:e.selection,"menu-items":e.searchResults,footer:e.footer,"search-query":e.highlightQuery?e.searchQuery:"","show-no-results-slot":e.searchQuery.length>0&&e.searchResults.length===0&&e.$slots["search-no-results-text"]&&e.$slots["search-no-results-text"]().length>0},e.menuConfig,{"aria-label":e.translatedSearchResultsLabel,"onUpdate:selected":e.onUpdateMenuSelection,onMenuItemClick:t[1]||(t[1]=c=>e.onSearchResultClick(e.asSearchResult(c))),onMenuItemKeyboardNavigation:e.onSearchResultKeyboardNavigation,onLoadMore:t[2]||(t[2]=c=>e.$emit("load-more"))}),{pending:v(()=>[o("div",{class:H(["cdx-menu-item__content cdx-typeahead-search__menu-message",e.menuMessageClass])},[o("span",tl,[P(e.$slots,"search-results-pending")])],2)]),"no-results":v(()=>[o("div",{class:H(["cdx-menu-item__content cdx-typeahead-search__menu-message",e.menuMessageClass])},[o("span",ol,[P(e.$slots,"search-no-results-text")])],2)]),default:v(({menuItem:c,active:u})=>[c.value===e.MenuFooterValue?(h(),x("a",{key:0,class:H(["cdx-menu-item__content cdx-typeahead-search__search-footer",{"cdx-typeahead-search__search-footer__active":u}]),href:e.asSearchResult(c).url,onClickCapture:re(_=>e.onSearchFooterClick(e.asSearchResult(c)),["stop"])},[s(f,{class:"cdx-menu-item__thumbnail cdx-typeahead-search__search-footer__icon",icon:e.articleIcon},null,8,["icon"]),o("span",ll,[P(e.$slots,"search-footer-text",{searchQuery:e.searchQuery}