UNPKG

@wikimedia/codex

Version:

Codex Design System for Wikimedia

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