@govtechsg/sgds-web-component 3.29.0 → 3.29.1-rc.1

package/components/index.umd.min.js

@@ -2816,7 +2816,7 @@ let n=e._$AN;if(n===void 0)return!1;for(let e of n)e._$AO?.(t,!1),Fg(e,t);return
         class=${O({"form-label":!0,required:this.required})}
         >${this.label}</label
       >
-    `;return this.label&&e}_handleClick(){if(this.readonly)return null;this.menuIsOpen?this.hideMenu():this.showMenu()}async _getMenuListFromOptions(e){let t=e.map(async e=>(await e.updateComplete,e));return(await Promise.all(t))?.map(e=>({label:e.textContent?.trim()??``,value:e.getAttribute(`value`),disabled:e.disabled??void 0}))}_renderEmptyMenu(){return y` <div class="empty-menu">No options</div> `}_renderLoadingMenu(){return y`<div class="loading-menu"><sgds-spinner size="xs" tone="brand"></sgds-spinner>Loading...</div>`}};E([S({reflect:!0})],W.prototype,`label`,void 0),E([S({reflect:!0})],W.prototype,`hintText`,void 0),E([S({reflect:!0})],W.prototype,`name`,void 0),E([S({type:String,reflect:!0})],W.prototype,`placeholder`,void 0),E([S({type:Boolean,reflect:!0})],W.prototype,`autofocus`,void 0),E([S({type:Boolean,reflect:!0})],W.prototype,`disabled`,void 0),E([S({type:Boolean,reflect:!0})],W.prototype,`required`,void 0),E([S({type:Boolean,reflect:!0})],W.prototype,`loading`,void 0),E([S({type:String,reflect:!0})],W.prototype,`value`,void 0),E([C()],W.prototype,`displayValue`,void 0),E([k_()],W.prototype,`defaultValue`,void 0),E([S({type:Boolean,reflect:!0})],W.prototype,`hasFeedback`,void 0),E([S({type:String,reflect:!0})],W.prototype,`invalidFeedback`,void 0),E([S({type:Boolean,reflect:!0})],W.prototype,`invalid`,void 0),E([S({type:String,reflect:!0})],W.prototype,`autocomplete`,void 0),E([S({type:Array})],W.prototype,`menuList`,void 0),E([C()],W.prototype,`selectedItems`,void 0),E([C()],W.prototype,`filteredList`,void 0),E([at(`input.form-control`)],W.prototype,`_input`,void 0),x();var L_=u`:host{display:block;position:relative}.dropdown{display:flex;height:100%}.dropdown-menu{box-sizing:border-box;max-height:10rem;overflow-x:hidden;overflow-y:auto}.visually-hidden{clip:rect(0,0,0,0)!important;border:0!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}.combobox .form-control-group{height:unset;min-height:var(--sgds-dimension-48)}.combobox-input-container{align-items:center;display:flex;flex-wrap:wrap;gap:var(--sgds-gap-xs);padding:calc(var(--sgds-form-padding-y) - var(--sgds-form-border-width-default)) 0;width:calc(100% - var(--sgds-icon-size-md, 1.25rem))}.combobox-input-container .form-control{flex:1 1 0;min-width:10ch}slot[id=default].d-none,slot[id=default].d-none::slotted(*){display:none}.form-clearable:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}`;x();var R_=u`:host([active]) .dropdown-item{background-color:var(--sgds-bg-translucent-subtle)}.dropdown-item{background-color:var(--sgds-bg-transparent);clear:both;color:var(--sgds-form-color-default);cursor:pointer;font-size:var(--sgds-font-size-label-md);height:100%;overflow-wrap:anywhere;padding:var(--sgds-padding-sm) var(--sgds-padding-md);text-align:inherit;white-space:normal}.dropdown-item.disabled{opacity:var(--sgds-opacity-40);pointer-events:none}.dropdown-item .normal-item-content{align-items:center;display:flex;justify-content:space-between}:host([active]) .dropdown-item .normal-item-content{color:var(--sgds-form-primary-color-default)}.dropdown-item:hover{background:var(--sgds-bg-translucent-subtle)}.dropdown-item:focus-visible{background:var(--sgds-bg-translucent-subtle);outline:var(--sgds-form-outline-focus);outline-offset:var(--sgds-form-outline-offset-focus)}`;x();var z_=class extends D{constructor(...e){super(...e),this.active=!1,this.disabled=!1}static{this.styles=[R_]}connectedCallback(){super.connectedCallback(),this.setAttribute(`role`,`menuitem`),this.setAttribute(`aria-disabled`,`${this.disabled}`),this._updateAriaLabel()}_updateAriaLabel(){let e=this.textContent?.trim();e&&this.setAttribute(`aria-label`,e)}render(){let e={disabled:this.disabled,active:this.active};return y`
+    `;return this.label&&e}_handleClick(){if(this.readonly)return null;this.menuIsOpen?this.hideMenu():this.showMenu()}async _getMenuListFromOptions(e){let t=e.map(async e=>(await e.updateComplete,e));return(await Promise.all(t))?.map(e=>({label:e.textContent?.trim()??``,value:e.getAttribute(`value`),disabled:e.disabled??void 0}))}_renderEmptyMenu(){return y` <div class="empty-menu">No options</div> `}_renderLoadingMenu(){return y`<div class="loading-menu"><sgds-spinner size="xs" tone="brand"></sgds-spinner>Loading...</div>`}};E([S({reflect:!0})],W.prototype,`label`,void 0),E([S({reflect:!0})],W.prototype,`hintText`,void 0),E([S({reflect:!0})],W.prototype,`name`,void 0),E([S({type:String,reflect:!0})],W.prototype,`placeholder`,void 0),E([S({type:Boolean,reflect:!0})],W.prototype,`autofocus`,void 0),E([S({type:Boolean,reflect:!0})],W.prototype,`disabled`,void 0),E([S({type:Boolean,reflect:!0})],W.prototype,`required`,void 0),E([S({type:Boolean,reflect:!0})],W.prototype,`loading`,void 0),E([S({type:String,reflect:!0})],W.prototype,`value`,void 0),E([C()],W.prototype,`displayValue`,void 0),E([k_()],W.prototype,`defaultValue`,void 0),E([S({type:Boolean,reflect:!0})],W.prototype,`hasFeedback`,void 0),E([S({type:String,reflect:!0})],W.prototype,`invalidFeedback`,void 0),E([S({type:Boolean,reflect:!0})],W.prototype,`invalid`,void 0),E([S({type:String,reflect:!0})],W.prototype,`autocomplete`,void 0),E([S({type:Array})],W.prototype,`menuList`,void 0),E([C()],W.prototype,`selectedItems`,void 0),E([C()],W.prototype,`filteredList`,void 0),E([at(`input.form-control`)],W.prototype,`_input`,void 0),x();var L_=u`:host{display:block;position:relative}.dropdown{display:flex;height:100%}.dropdown-menu{box-sizing:border-box;max-height:10rem;overflow-x:hidden;overflow-y:auto}.visually-hidden{clip:rect(0,0,0,0)!important;border:0!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}.combobox .form-control-group{height:unset;min-height:var(--sgds-dimension-48)}.combobox-input-container{align-items:center;display:flex;flex-wrap:wrap;gap:var(--sgds-gap-xs);padding:calc(var(--sgds-form-padding-y) - var(--sgds-form-border-width-default)) 0;width:calc(100% - var(--sgds-icon-size-md, 1.25rem))}.combobox-input-container .form-control{flex:1 1 0;min-width:10ch}slot[id=default].d-none,slot[id=default].d-none::slotted(*){display:none}slot[name=create].d-none,slot[name=create].d-none::slotted(*){display:none}.create-option{color:var(--sgds-form-color-default);font-size:var(--sgds-font-size-label-md);overflow-wrap:anywhere;padding:var(--sgds-padding-sm) var(--sgds-padding-md);white-space:normal}.create-option:not(.slotted){cursor:pointer}.create-option:hover{background:var(--sgds-bg-translucent-subtle)}.create-option:focus-visible{background:var(--sgds-bg-translucent-subtle);outline:var(--sgds-form-outline-focus);outline-offset:var(--sgds-form-outline-offset-focus)}.form-clearable:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}`;x();var R_=u`:host([active]) .dropdown-item{background-color:var(--sgds-bg-translucent-subtle)}.dropdown-item{background-color:var(--sgds-bg-transparent);clear:both;color:var(--sgds-form-color-default);cursor:pointer;font-size:var(--sgds-font-size-label-md);height:100%;overflow-wrap:anywhere;padding:var(--sgds-padding-sm) var(--sgds-padding-md);text-align:inherit;white-space:normal}.dropdown-item.disabled{opacity:var(--sgds-opacity-40);pointer-events:none}.dropdown-item .normal-item-content{align-items:center;display:flex;justify-content:space-between}:host([active]) .dropdown-item .normal-item-content{color:var(--sgds-form-primary-color-default)}.dropdown-item:hover{background:var(--sgds-bg-translucent-subtle)}.dropdown-item:focus-visible{background:var(--sgds-bg-translucent-subtle);outline:var(--sgds-form-outline-focus);outline-offset:var(--sgds-form-outline-offset-focus)}`;x();var z_=class extends D{constructor(...e){super(...e),this.active=!1,this.disabled=!1}static{this.styles=[R_]}connectedCallback(){super.connectedCallback(),this.setAttribute(`role`,`menuitem`),this.setAttribute(`aria-disabled`,`${this.disabled}`),this._updateAriaLabel()}_updateAriaLabel(){let e=this.textContent?.trim();e&&this.setAttribute(`aria-label`,e)}render(){let e={disabled:this.disabled,active:this.active};return y`
       <div class="dropdown-item ${O(e)}" tabindex=${this.disabled?`-1`:`0`}>
         ${this._renderItemContent()}
       </div>
@@ -2835,10 +2835,10 @@ let n=e._$AN;if(n===void 0)return!1;for(let e of n)e._$AO?.(t,!1),Fg(e,t);return
 * Copyright 2017 Google LLC
 * SPDX-License-Identifier: BSD-3-Clause
 */
-let V_=(e,t,n)=>{let r=/* @__PURE__ */ new Map;for(let i=t;i<=n;i++)r.set(e[i],i);return r},H_=ft(class extends pt{constructor(e){if(super(e),e.type!==dt.CHILD)throw Error(`repeat() can only be used in text expressions`)}dt(e,t,n){let r;n===void 0?n=t:t!==void 0&&(r=t);let i=[],a=[],o=0;for(let t of e)i[o]=r?r(t,o):o,a[o]=n(t,o),o++;return{values:a,keys:i}}render(e,t,n){return this.dt(e,t,n).values}update(e,[t,n,r]){let i=Ng(e),{values:a,keys:o}=this.dt(t,n,r);if(!Array.isArray(i))return this.ut=o,a;let s=this.ut??=[],c=[],l,u,d=0,f=i.length-1,p=0,m=a.length-1;for(;d<=f&&p<=m;)if(i[d]===null)d++;else if(i[f]===null)f--;else if(s[d]===o[p])c[p]=Ag(i[d],a[p]),d++,p++;else if(s[f]===o[m])c[m]=Ag(i[f],a[m]),f--,m--;else if(s[d]===o[m])c[m]=Ag(i[d],a[m]),kg(e,c[m+1],i[d]),d++,m--;else if(s[f]===o[p])c[p]=Ag(i[f],a[p]),kg(e,i[d],i[f]),f--,p++;else if(l===void 0&&(l=V_(o,p,m),u=V_(s,d,f)),l.has(s[d])){if(l.has(s[f])){let t=u.get(o[p]),n=t===void 0?null:i[t];if(n===null){let t=kg(e,i[d]);Ag(t,a[p]),c[p]=t}else c[p]=Ag(n,a[p]),kg(e,i[d],n),i[t]=null;p++}else Pg(i[f]),f--}else Pg(i[d]),d++;for(;p<=m;){let t=kg(e,c[m+1]);Ag(t,a[p]),c[p++]=t}for(;d<=f;){let e=i[d++];e!==null&&Pg(e)}return this.ut=o,Mg(e,c),Fe}});x();var G=class e extends W{constructor(...e){super(...e),this.multiSelect=!1,this.badgeFullWidth=!1,this.clearable=!1,this.noValidate=!1,this.async=!1,this.emptyMenuAsync=!1,this.scrollBottomOffset=0,this.filterFunction=(e,t)=>t.label.toLowerCase().startsWith(e.toLowerCase()),this.optionList=[],this.emptyMenuAfterFiltering=!1,this.isFocused=!1,this.isScrollEnd=!1,this.suffixIconTemplate=y`<sgds-icon
+let V_=(e,t,n)=>{let r=/* @__PURE__ */ new Map;for(let i=t;i<=n;i++)r.set(e[i],i);return r},H_=ft(class extends pt{constructor(e){if(super(e),e.type!==dt.CHILD)throw Error(`repeat() can only be used in text expressions`)}dt(e,t,n){let r;n===void 0?n=t:t!==void 0&&(r=t);let i=[],a=[],o=0;for(let t of e)i[o]=r?r(t,o):o,a[o]=n(t,o),o++;return{values:a,keys:i}}render(e,t,n){return this.dt(e,t,n).values}update(e,[t,n,r]){let i=Ng(e),{values:a,keys:o}=this.dt(t,n,r);if(!Array.isArray(i))return this.ut=o,a;let s=this.ut??=[],c=[],l,u,d=0,f=i.length-1,p=0,m=a.length-1;for(;d<=f&&p<=m;)if(i[d]===null)d++;else if(i[f]===null)f--;else if(s[d]===o[p])c[p]=Ag(i[d],a[p]),d++,p++;else if(s[f]===o[m])c[m]=Ag(i[f],a[m]),f--,m--;else if(s[d]===o[m])c[m]=Ag(i[d],a[m]),kg(e,c[m+1],i[d]),d++,m--;else if(s[f]===o[p])c[p]=Ag(i[f],a[p]),kg(e,i[d],i[f]),f--,p++;else if(l===void 0&&(l=V_(o,p,m),u=V_(s,d,f)),l.has(s[d])){if(l.has(s[f])){let t=u.get(o[p]),n=t===void 0?null:i[t];if(n===null){let t=kg(e,i[d]);Ag(t,a[p]),c[p]=t}else c[p]=Ag(n,a[p]),kg(e,i[d],n),i[t]=null;p++}else Pg(i[f]),f--}else Pg(i[d]),d++;for(;p<=m;){let t=kg(e,c[m+1]);Ag(t,a[p]),c[p++]=t}for(;d<=f;){let e=i[d++];e!==null&&Pg(e)}return this.ut=o,Mg(e,c),Fe}});x();var G=class e extends W{constructor(...e){super(...e),this.multiSelect=!1,this.badgeFullWidth=!1,this.clearable=!1,this.noValidate=!1,this.async=!1,this.emptyMenuAsync=!1,this.creatable=!1,this.scrollBottomOffset=0,this.filterFunction=(e,t)=>t.label.toLowerCase().startsWith(e.toLowerCase()),this.optionList=[],this.emptyMenuAfterFiltering=!1,this.isFocused=!1,this.isScrollEnd=!1,this.suffixIconTemplate=y`<sgds-icon
     name=${this.menuIsOpen?`chevron-up`:`chevron-down`}
     size="md"
-  ></sgds-icon>`,this.prefixIconTemplate=y`${b}`}static{this.styles=[...W.styles,F_,L_]}static{this.childName=`sgds-combo-box-option`}static{this.dependencies={[e.childName]:B_,"sgds-icon":L,"sgds-badge":r_,"sgds-spinner":_m}}connectedCallback(){super.connectedCallback(),this.addEventListener(`focus`,async()=>{this.isFocused=!0}),this.addEventListener(`blur`,async()=>{this.isFocused=!1}),this.addEventListener(`keydown`,e=>{e.key===`Enter`&&e.target.shadowRoot?.querySelector(`.form-clearable`)?.matches(`:focus`)&&this._handleClear()}),this.addEventListener(`sgds-hide`,async e=>{e.detail.isOutside||(await this._input).focus(),this.options.forEach(e=>e.removeAttribute(`hidden`)),this.emptyMenuAfterFiltering=!1})}async firstUpdated(e){super.firstUpdated(e),this.async&&(this.filterFunction=()=>!0),this.menuList.forEach(e=>{let t=document.createElement(`sgds-combo-box-option`);t.innerText=e.label,t.value=e.value,t.checkbox=this.multiSelect,t.active=this.value.includes(e.value),this.appendChild(t)}),this._setupValidation(this.menuList),this.menuIsOpen&&await this.updateFloatingPosition()}async _handleDefaultSlotChange(e){let t=e.target.assignedElements({flatten:!0});t.forEach(e=>{if(e.hasAttribute(`disabled`)||e.clickEventAdded)return!1;e.addEventListener(`click`,e=>{e.preventDefault();let t=e.target;return this.multiSelect&&t.active?this._handleItemUnselect(e):this._handleItemSelected(e),!1}),e.clickEventAdded=!0,e.addEventListener(`keydown`,e=>{e.key===`Enter`&&(this.close=`outside`,e.target.click())})}),await this.updateComplete,this.optionList=await this._getMenuListFromOptions(t),this._setupValidation(this.optionList)}async _setupValidation(e){if(this.value&&e.length>0){let t=this.value.split(`;`),n=e.filter(({value:e})=>t.includes(e));this.selectedItems=[...n,...this.selectedItems],this.multiSelect||(this.displayValue=n[0]?.label)}this.input=this.multiSelect?await this._multiSelectInput:await this._input,this._mixinValidate(this.input)}async _handleValueChange(){this.options.forEach(e=>e.removeAttribute(`hidden`));let e=await this._input;this._mixinSetFormValue(),this.multiSelect?this._mixinValidate(this.input):this._mixinValidate(e),this.selectedItems.map(e=>e.value).join(`;`)!==this.value&&this._updateValueAndDisplayValue(this.optionList),(this._isTouched||this.value!==``)&&(this._mixinShouldSkipSgdsValidation()||(this.invalid=!this._mixinReportValidity()))}_emitChangeEvents(){this._mixinSetFormValue(),this.emit(`sgds-change`),this.value&&this.emit(`sgds-select`)}_handleOptionListChange(){this._updateValueAndDisplayValue(this.optionList)}_handleMenuListChange(){let e=this.menuList.map(e=>{let t=document.createElement(`sgds-combo-box-option`);return t.innerText=e.label,t.value=e.value,t.checkbox=this.multiSelect,t.active=this.value.includes(e.value),t});this.replaceChildren(...e)}_updateValueAndDisplayValue(e){let t=this.value.split(`;`),n=e.filter(({value:e})=>t.includes(e));this.selectedItems=[...n];let r=n.map(e=>e.value).join(`;`);r!==this.value&&(this.value=r),!this.multiSelect&&!this.async&&(this.displayValue=n[0]?.label||``),this.options.forEach(e=>e.active=t.includes(e.value))}async _handleInputChange(e){let t=e.target;this.displayValue=t.value,this.emit(`sgds-input`,{detail:{displayValue:this.displayValue}}),this.invalid=!1,this.showMenu(),this.displayValue===``&&!this.multiSelect&&(this.selectedItems=[],this.value=this.selectedItems.join(`;`),this.options.forEach(e=>e.active=!1),this._emitChangeEvents());let n=this.options.map(e=>({value:e.value,label:e.textContent.trim()}));this.filteredList=n.filter(e=>this.filterFunction(this.displayValue,e)),this.emptyMenuAfterFiltering=this.filteredList.length===0;let r=this.filteredList.map(e=>e.value);this.options.forEach(e=>{e.hidden=!r.includes(e.value)})}async _handleItemSelected(e){let t=e.target;if(t.disabled)return;let n=t.textContent?.trim()??``,r=t.getAttribute(`value`)??n,i=this.filteredList.find(e=>e.value.toString()===r)||{label:n,value:r};this.multiSelect?(this.selectedItems.some(e=>e.value===i.value)||(this.selectedItems=[...this.selectedItems,i]),this.value=this.selectedItems.map(e=>e.value).join(`;`),t.active=!0):(this.selectedItems.length===0||this.selectedItems[0].value!==i.value)&&(this.options.forEach(e=>e.active=!1),t.active=!0,this.selectedItems=[i],this.value=i.value.toString(),this.displayValue=i.label,this.hideMenu()),this._emitChangeEvents()}_handleItemUnselect(e){let t=e.target;if(t.disabled)return;t.removeAttribute(`active`);let n=t.textContent?.trim()??``,r=t.getAttribute(`value`)??n,i=this.filteredList.find(e=>e.value.toString()===r)||{label:n,value:r};this.selectedItems=this.selectedItems.filter(e=>e.value!==i.value),this.value=this.selectedItems.map(e=>e.value).join(`;`),this._emitChangeEvents()}async _handleBadgeDismissed(e,t){e.preventDefault();let n=t.value;this.options?.forEach(e=>e.value===n?e.active=!1:null),this.selectedItems=this.selectedItems.filter(e=>e.value!==t.value),this.value=this.selectedItems.map(e=>e.value).join(`;`),this._emitChangeEvents()}async _handleMultiSelectKeyDown(e){if(this.multiSelect&&e.key===`Backspace`&&this.multiSelect&&this.displayValue.trim()===``&&this.selectedItems.length>0){let e=this.selectedItems[this.selectedItems.length-1].value;this.options?.forEach(t=>t.value===e?t.active=!1:null),this.selectedItems=this.selectedItems.slice(0,-1),this.value=this.selectedItems.map(e=>e.value).join(`;`),this._emitChangeEvents()}}_handleFocus(){this.emit(`sgds-focus`)}async _handleInputBlur(e){e.preventDefault(),this.emit(`sgds-blur`),this.multiSelect?this.selectedItems.filter(({label:e})=>this.displayValue===e).length<=0&&(this.displayValue=``):this.displayValue=this.selectedItems.length>0?this.selectedItems[0].label:``}async _handleClear(){this.value=this.displayValue=``,this.options?.forEach(e=>e.active=!1),this._emitChangeEvents(),(await this._input).focus(),this.showMenu()}async _mixinResetFormControl(){if(this.value=this.defaultValue,this.multiSelect){let e=this.value.split(`;`);this.options.forEach(t=>{t.active=e.includes(t.value)});let t=this.options.filter(t=>e.includes(t.value));this.selectedItems=t.map(e=>({value:e.value,label:e.textContent.trim()})),this._mixinResetValidity(await this._multiSelectInput)}else{this.options.forEach(e=>{e.active=e.value===this.value});let e=this.options.filter(e=>e.value===this.value);this.displayValue=e.length<=0?``:e[0].textContent.trim(),this._mixinResetValidity(await this._input)}}async _handleScroll(e){let t=e.target;if(t){let e=t.scrollHeight-t.clientHeight,n=Math.max(0,this.scrollBottomOffset);t.scrollTop>=e-n?(this.isScrollEnd||this.emit(`sgds-scroll-end`),this.isScrollEnd=!0):this.isScrollEnd=!1}}_renderInput(e){let t=this.hasFeedback,n=e;return y`
+  ></sgds-icon>`,this.prefixIconTemplate=y`${b}`,this._createOptionSlotContent=[],this._createOptionValue=``,this._showCreateOption=!1}static{this.styles=[...W.styles,F_,L_]}static{this.childName=`sgds-combo-box-option`}static{this.dependencies={[e.childName]:B_,"sgds-icon":L,"sgds-badge":r_,"sgds-spinner":_m}}connectedCallback(){super.connectedCallback(),this.addEventListener(`focus`,async()=>{this.isFocused=!0}),this.addEventListener(`blur`,async()=>{this.isFocused=!1}),this.addEventListener(`keydown`,e=>{e.key===`Enter`&&e.target.shadowRoot?.querySelector(`.form-clearable`)?.matches(`:focus`)&&this._handleClear()}),this.addEventListener(`sgds-hide`,async e=>{e.detail.isOutside||(await this._input).focus(),this.options.forEach(e=>{e.removeAttribute(`hidden`)}),this.emptyMenuAfterFiltering=!1})}async firstUpdated(e){super.firstUpdated(e),this.async&&(this.filterFunction=()=>!0),this.menuList.forEach(e=>{let t=document.createElement(`sgds-combo-box-option`);t.innerText=e.label,t.value=e.value,t.checkbox=this.multiSelect,t.active=this.value.includes(e.value),this.appendChild(t)}),this._setupValidation(this.menuList),this.menuIsOpen&&await this.updateFloatingPosition()}async _handleDefaultSlotChange(e){let t=e.target.assignedElements({flatten:!0});t.forEach(e=>{if(e.hasAttribute(`disabled`)||e.clickEventAdded)return!1;e.addEventListener(`click`,e=>{e.preventDefault();let t=e.target;return this.multiSelect&&t.active?this._handleItemUnselect(e):this._handleItemSelected(e),!1}),e.clickEventAdded=!0,e.addEventListener(`keydown`,e=>{e.key===`Enter`&&(this.close=`outside`,e.target.click())})}),await this.updateComplete;let n=t;this.optionList=await this._getMenuListFromOptions(n),this._setupValidation(this.optionList)}async _setupValidation(e){if(this.value&&e.length>0){let t=this.value.split(`;`),n=e.filter(({value:e})=>t.includes(e));this.selectedItems=[...n],this.multiSelect||(this.displayValue=n[0]?.label)}this.input=this.multiSelect?await this._multiSelectInput:await this._input,this._mixinValidate(this.input)}async _handleValueChange(){this.options.forEach(e=>{e.removeAttribute(`hidden`)});let e=await this._input;this._mixinSetFormValue(),this.multiSelect?this._mixinValidate(this.input):this._mixinValidate(e),this.selectedItems.map(e=>e.value).join(`;`)!==this.value&&this._updateValueAndDisplayValue(this.optionList),(this._isTouched||this.value!==``)&&(this._mixinShouldSkipSgdsValidation()||(this.invalid=!this._mixinReportValidity()))}_emitChangeEvents(){this._mixinSetFormValue(),this.emit(`sgds-change`),this.value&&this.emit(`sgds-select`)}_handleOptionListChange(){this._updateValueAndDisplayValue(this.optionList)}_handleMenuListChange(){let e=this.menuList.map(e=>{let t=document.createElement(`sgds-combo-box-option`);return t.innerText=e.label,t.value=e.value,t.checkbox=this.multiSelect,t.active=this.value.includes(e.value),t});this.replaceChildren(...e)}_updateValueAndDisplayValue(e){let t=this.value.split(`;`),n=e.filter(({value:e})=>t.includes(e));this.selectedItems=[...n];let r=n.map(e=>e.value).join(`;`);r!==this.value&&!this.creatable&&(this.value=r),!this.multiSelect&&!this.async&&(this.displayValue=n[0]?.label||``),this.options.forEach(e=>e.active=t.includes(e.value))}async _handleInputChange(e){let t=e.target;this.displayValue=t.value,this.emit(`sgds-input`,{detail:{displayValue:this.displayValue}}),this.invalid=!1,this.showMenu(),this.displayValue===``&&!this.multiSelect&&(this.selectedItems=[],this.value=this.selectedItems.join(`;`),this.options.forEach(e=>e.active=!1),this._emitChangeEvents());let n=this.options.map(e=>({value:e.value,label:e.textContent.trim()}));this.filteredList=n.filter(e=>this.filterFunction(this.displayValue,e)),this.emptyMenuAfterFiltering=this.filteredList.length===0;let r=this.filteredList.map(e=>e.value);this.options.forEach(e=>{e.hidden=!r.includes(e.value)}),this._syncCreateOption()}async _handleItemSelected(e){let t=e.target;if(t.disabled)return;let n=t.textContent?.trim()??``,r=t.getAttribute(`value`)??n,i=this.filteredList.find(e=>e.value.toString()===r)||{label:n,value:r};this.multiSelect?(this.selectedItems.some(e=>e.value===i.value)||(this.selectedItems=[...this.selectedItems,i]),this.value=this.selectedItems.map(e=>e.value).join(`;`),t.active=!0,this.displayValue=``):(this.selectedItems.length===0||this.selectedItems[0].value!==i.value)&&(this.options.forEach(e=>e.active=!1),t.active=!0,this.selectedItems=[i],this.value=i.value.toString(),this.displayValue=i.label,this.hideMenu()),this._emitChangeEvents()}_handleItemUnselect(e){let t=e.target;if(t.disabled)return;t.removeAttribute(`active`);let n=t.textContent?.trim()??``,r=t.getAttribute(`value`)??n,i=this.filteredList.find(e=>e.value.toString()===r)||{label:n,value:r};this.selectedItems=this.selectedItems.filter(e=>e.value!==i.value),this.value=this.selectedItems.map(e=>e.value).join(`;`),this._emitChangeEvents()}async _handleBadgeDismissed(e,t){e.preventDefault();let n=t.value;this.options?.forEach(e=>e.value===n?e.active=!1:null),this.selectedItems=this.selectedItems.filter(e=>e.value!==t.value),this.value=this.selectedItems.map(e=>e.value).join(`;`),this._emitChangeEvents()}async _handleMultiSelectKeyDown(e){if(this.multiSelect&&e.key===`Backspace`&&this.multiSelect&&this.displayValue.trim()===``&&this.selectedItems.length>0){let e=this.selectedItems[this.selectedItems.length-1].value;this.options?.forEach(t=>t.value===e?t.active=!1:null),this.selectedItems=this.selectedItems.slice(0,-1),this.value=this.selectedItems.map(e=>e.value).join(`;`),this._emitChangeEvents()}}_handleFocus(){this.emit(`sgds-focus`)}async _handleInputBlur(e){e.preventDefault(),this.emit(`sgds-blur`);let t=e.relatedTarget;(this.creatable||this.multiSelect)&&t&&(this.contains(t)||this.shadowRoot?.contains(t))||(this.multiSelect?this.selectedItems.filter(({label:e})=>this.displayValue===e).length<=0&&(this.displayValue=``):this.displayValue=this.selectedItems.length>0?this.selectedItems[0].label:``)}async _handleClear(){this.value=this.displayValue=``,this.options?.forEach(e=>e.active=!1),this._emitChangeEvents(),(await this._input).focus(),this.showMenu()}async _mixinResetFormControl(){if(this.value=this.defaultValue,this.multiSelect){let e=this.value.split(`;`);this.options.forEach(t=>{t.active=e.includes(t.value)});let t=this.options.filter(t=>e.includes(t.value));this.selectedItems=t.map(e=>({value:e.value,label:e.textContent.trim()})),this._mixinResetValidity(await this._multiSelectInput)}else{this.options.forEach(e=>{e.active=e.value===this.value});let e=this.options.filter(e=>e.value===this.value);this.displayValue=e.length<=0?``:e[0].textContent.trim(),this._mixinResetValidity(await this._input)}}async _handleScroll(e){let t=e.target;if(t){let e=t.scrollHeight-t.clientHeight,n=Math.max(0,this.scrollBottomOffset);t.scrollTop>=e-n?(this.isScrollEnd||this.emit(`sgds-scroll-end`),this.isScrollEnd=!0):this.isScrollEnd=!1}}_renderInput(e){let t=this.hasFeedback,n=e;return y`
       <div
         ${Gg(this.myDropdown)}
         class="form-control-group ${O({disabled:this.disabled,readonly:this.readonly,"is-invalid":this.invalid&&t})}"
@@ -2892,7 +2892,7 @@ let V_=(e,t,n)=>{let r=/* @__PURE__ */ new Map;for(let i=t;i<=n;i++)r.set(e[i],i
             `:b}
         ${this.suffixIconTemplate}
       </div>
-    `}_renderFeedbackMenu(){return this.loading?this._renderLoadingMenu():this.async?this.emptyMenuAsync||this.optionList.length===0?this._renderEmptyMenu():b:this.optionList.length===0||this.emptyMenuAfterFiltering&&this.optionList.length>0?this._renderEmptyMenu():b}render(){let e=(this.isFocused||this.menuIsOpen)&&this.value!==``&&this.clearable&&!this.readonly;return y`
+    `}_syncCreateOption(){this._showCreateOption=this.creatable&&this.emptyMenuAfterFiltering&&this.displayValue!==``,this._showCreateOption&&(this._createOptionValue=this.displayValue)}_handleCreateOptionSlotChange(e){this._createOptionSlotContent=e.target.assignedElements({flatten:!0})}_handleCreateOptionClick(e){e.composedPath()[0].closest?.(`a, button`)||(this.emptyMenuAfterFiltering=!1,this._syncCreateOption(),this.hideMenu(),this.emit(`sgds-create-option`,{detail:{value:this._createOptionValue}}))}_handleCreateOptionKeydown(e){if(e.key===`Enter`){this._handleCreateOptionClick(e);return}if(e.key===`ArrowUp`){e.preventDefault();let t=this._getActiveMenuItems();t.length>0&&this._setMenuItem(t.length-1);return}e.key===`ArrowDown`&&(e.preventDefault(),this._getActiveMenuItems().length>0&&this._setMenuItem(0))}_handleKeyboardMenuItemsEvent(e){let t=this.shadowRoot?.querySelector(`.create-option`);if(!(t?.matches(`:focus`)&&e.key===`Tab`)){if(this._showCreateOption&&(e.key===`ArrowDown`||e.key===`Tab`&&!e.shiftKey)){let n=this._getActiveMenuItems();if(n.length>0&&n[n.length-1].shadowRoot?.querySelector(`.dropdown-item`)?.matches(`:focus`)){e.preventDefault(),t?.focus();return}if(n.length===0){e.preventDefault(),t?.focus();return}}super._handleKeyboardMenuItemsEvent(e)}}_renderFeedbackMenu(){return this.loading?this._renderLoadingMenu():this.async?this.emptyMenuAsync||this.optionList.length===0?this._renderEmptyMenu():b:this._showCreateOption?b:this.optionList.length===0||this.emptyMenuAfterFiltering&&this.optionList.length>0?this._renderEmptyMenu():b}render(){let e=(this.isFocused||this.menuIsOpen)&&this.value!==``&&this.clearable&&!this.readonly;return y`
       <div
         class=${O({"form-control-container":!0,"m-width-256":!0,disabled:this.disabled,combobox:!0})}
         @keydown=${this._handleMultiSelectKeyDown}
@@ -2915,6 +2915,15 @@ let V_=(e,t,n)=>{let r=/* @__PURE__ */ new Map;for(let i=t;i<=n;i++)r.set(e[i],i
             class=${O({"d-none":this.loading||this.emptyMenuAsync||this.optionList.length===0})}
             @slotchange=${this._handleDefaultSlotChange}
           ></slot>
+          ${this._showCreateOption?y`<div
+                class=${O({"create-option":!0,slotted:this._createOptionSlotContent.length>0})}
+                tabindex="0"
+                role="option"
+                @click=${this._handleCreateOptionClick}
+                @keydown=${this._handleCreateOptionKeydown}
+              >
+                ${this._createOptionSlotContent.length>0?y`<slot name="create" @slotchange=${this._handleCreateOptionSlotChange}></slot>`:`Create "${this.displayValue}"`}
+              </div>`:y`<slot name="create" class="d-none" @slotchange=${this._handleCreateOptionSlotChange}></slot>`}
           ${this._renderFeedbackMenu()}
         </div>
       </div>
@@ -2929,7 +2938,7 @@ let V_=(e,t,n)=>{let r=/* @__PURE__ */ new Map;for(let i=t;i<=n;i++)r.set(e[i],i
             aria-hidden="true"
             .autocomplete=${this.autocomplete}
           />`:b}
-    `}};E([S({type:Boolean,reflect:!0})],G.prototype,`multiSelect`,void 0),E([S({type:Boolean,reflect:!0})],G.prototype,`badgeFullWidth`,void 0),E([S({type:Boolean,reflect:!0})],G.prototype,`clearable`,void 0),E([S({type:Boolean,reflect:!0})],G.prototype,`noValidate`,void 0),E([S({type:Boolean,reflect:!0})],G.prototype,`async`,void 0),E([S({type:Boolean,reflect:!0})],G.prototype,`emptyMenuAsync`,void 0),E([S({type:Number,reflect:!0})],G.prototype,`scrollBottomOffset`,void 0),E([S()],G.prototype,`filterFunction`,void 0),E([at(`input#multi-select-input-tracker`)],G.prototype,`_multiSelectInput`,void 0),E([T({flatten:!0,selector:`sgds-combo-box-option`})],G.prototype,`options`,void 0),E([C()],G.prototype,`optionList`,void 0),E([C()],G.prototype,`emptyMenuAfterFiltering`,void 0),E([C()],G.prototype,`isFocused`,void 0),E([C()],G.prototype,`isScrollEnd`,void 0),E([F(`value`,{waitUntilFirstUpdate:!0})],G.prototype,`_handleValueChange`,null),E([F(`optionList`,{waitUntilFirstUpdate:!0})],G.prototype,`_handleOptionListChange`,null),E([F(`menuList`,{waitUntilFirstUpdate:!0})],G.prototype,`_handleMenuListChange`,null),x();var U_=u`:host{display:contents}:host([layout=fixed]) .table{table-layout:fixed}.table{border-collapse:collapse;display:table;table-layout:auto;width:100%}.table-container{overflow-x:auto}.data-table{border:var(--sgds-border-width-1) solid;border-color:var(--sgds-border-color-muted);border-radius:var(--sgds-border-radius-none);display:flex;flex-direction:column;min-height:var(--sgds-dimension-56)}.footer{align-items:center;display:flex;justify-content:space-between;padding:var(--sgds-padding-sm) var(--sgds-padding-lg)}.skeleton-row{display:table-row}.skeleton-cell{border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);display:table-cell;height:var(--sgds-dimension-56);padding:var(--sgds-padding-sm) var(--sgds-padding-md);vertical-align:middle}.skeleton-cell.control-cell{width:var(--sgds-dimension-56)}.no-data{align-items:center;color:var(--sgds-text-color-subtle);display:flex;justify-content:center;min-height:var(--sgds-dimension-128);padding:var(--sgds-padding-sm) var(--sgds-padding-md)}.active:not(.sort-icon),tr:hover:not([data-header-row]){background-color:var(--sgds-bg-translucent-subtle);transition:background-color .15s ease}td,th{border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);vertical-align:middle}th[data-sorting]{cursor:pointer}th[data-sorting]:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.data-table-cell,.data-table-head,.footer,.no-data{align-items:center;display:flex;font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-label-sm);font-style:normal;letter-spacing:var(--sgds-letter-spacing-normal);line-height:var(--sgds-line-height-2-xs);min-height:var(--sgds-dimension-56);padding:var(--sgds-padding-sm) var(--sgds-padding-md)}.data-table-head{color:var(--sgds-color-default);font-weight:var(--sgds-font-weight-semibold);gap:var(--sgds-gap-2-xs)}.data-table-head ::slotted(sgds-data-table-head){font-size:var(--sgds-font-size-label-sm);font-weight:var(--sgds-font-weight-semibold);line-height:var(--sgds-line-height-2-xs)}.data-table-cell{font-weight:var(--sgds-font-weight-regular)}.data-table-cell ::slotted(sgds-data-table-cell){font-size:var(--sgds-font-size-label-sm);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-2-xs)}.sort,.sort-button{align-items:center;display:inline-flex}.sort-button{background-color:var(--sgds-bg-transparent);border:var(--sgds-border-width-1) solid var(--sgds-border-color-transparent);border-radius:var(--sgds-form-border-radius-sm);color:var(--sgds-color-subtle);cursor:pointer;height:var(--sgds-dimension-20);justify-content:center;padding:0;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:var(--sgds-dimension-20)}.sort-button:hover{background-color:var(--sgds-bg-translucent-subtle);color:var(--sgds-color-default)}.sort-button:focus,.sort-button:focus-visible{background-color:var(--sgds-bg-translucent-subtle);border-color:transparent;outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.sort-button:disabled{background-color:var(--sgds-bg-transparent);color:var(--sgds-color-muted);cursor:not-allowed}.sort-button.active{background-color:var(--sgds-primary-surface-translucent);color:var(--sgds-primary-color-default)}.sort-icon{display:inline-flex}.data-table-cell.align-right,.data-table-head.align-right{justify-content:flex-end;text-align:right}.control-cell{width:var(--sgds-dimension-56)}:host(.checkbox-cell) .data-table-cell,:host(.checkbox-cell) .data-table-head{padding:var(--sgds-padding-sm) var(--sgds-padding-md)}:host(.expand-cell) .data-table-cell{cursor:pointer;padding:var(--sgds-padding-md)}.expandable-td{border:0;padding:0}.expandable-content{background-color:var(--sgds-surface-raised);border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);padding:var(--sgds-padding-2-xl);padding-left:var(--sgds-padding-4-xl)}.hidden{display:none}.visually-hidden{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}`;x();var W_=u`ul{margin-bottom:1rem;margin-top:0;padding-left:2rem}svg{vertical-align:middle}.pagination{display:inline-flex;gap:var(--sgds-gap-2-xs);list-style:none;padding-left:0}.page-link{align-items:center;background-color:var(--sgds-bg-transparent);border-radius:var(--sgds-border-radius-md);display:flex;height:var(--sgds-dimension-48);justify-content:center;width:var(--sgds-dimension-48)}.page-link:not(.ellipsis):focus-visible,.page-link:not(.ellipsis):hover{background-color:var(--sgds-primary-surface-translucent);color:var(--sgds-primary-color-default)}.page-link:not(.ellipsis):focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.page-item>.page-link:not(.ellipsis){cursor:pointer}.page-item.active .page-link{background-color:var(--sgds-primary-surface-default);color:var(--sgds-color-fixed-light)}.ellipsis-disabled,.page-item.disabled .page-link{opacity:var(--sgds-opacity-40)}.ellipsis-disabled{cursor:not-allowed;pointer-events:none}.pagination-sm .page-link{font-size:var(--sgds-font-size-label-sm);height:var(--sgds-dimension-40);width:var(--sgds-dimension-40)}.sr-only{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pagination-description{align-items:center;display:flex}.pagination-sm .pagination-description{font-size:var(--sgds-font-size-label-sm)}`;x();var G_=class extends D{constructor(...e){super(...e),this.dataLength=0,this.currentPage=1,this.itemsPerPage=5,this.variant=`default`,this.navigation=`icon-button`,this.size=`md`,this._limit=4,this.ellipsisContent=y`
+    `}};E([S({type:Boolean,reflect:!0})],G.prototype,`multiSelect`,void 0),E([S({type:Boolean,reflect:!0})],G.prototype,`badgeFullWidth`,void 0),E([S({type:Boolean,reflect:!0})],G.prototype,`clearable`,void 0),E([S({type:Boolean,reflect:!0})],G.prototype,`noValidate`,void 0),E([S({type:Boolean,reflect:!0})],G.prototype,`async`,void 0),E([S({type:Boolean,reflect:!0})],G.prototype,`emptyMenuAsync`,void 0),E([S({type:Boolean,reflect:!0})],G.prototype,`creatable`,void 0),E([S({type:Number,reflect:!0})],G.prototype,`scrollBottomOffset`,void 0),E([S()],G.prototype,`filterFunction`,void 0),E([at(`input#multi-select-input-tracker`)],G.prototype,`_multiSelectInput`,void 0),E([T({flatten:!0,selector:`sgds-combo-box-option`})],G.prototype,`options`,void 0),E([C()],G.prototype,`optionList`,void 0),E([C()],G.prototype,`emptyMenuAfterFiltering`,void 0),E([C()],G.prototype,`isFocused`,void 0),E([C()],G.prototype,`isScrollEnd`,void 0),E([F(`value`,{waitUntilFirstUpdate:!0})],G.prototype,`_handleValueChange`,null),E([F(`optionList`,{waitUntilFirstUpdate:!0})],G.prototype,`_handleOptionListChange`,null),E([F(`menuList`,{waitUntilFirstUpdate:!0})],G.prototype,`_handleMenuListChange`,null),E([C()],G.prototype,`_showCreateOption`,void 0),x();var U_=u`:host{display:contents}:host([layout=fixed]) .table{table-layout:fixed}.table{border-collapse:collapse;display:table;table-layout:auto;width:100%}.table-container{overflow-x:auto}.data-table{border:var(--sgds-border-width-1) solid;border-color:var(--sgds-border-color-muted);border-radius:var(--sgds-border-radius-none);display:flex;flex-direction:column;min-height:var(--sgds-dimension-56)}.footer{align-items:center;display:flex;justify-content:space-between;padding:var(--sgds-padding-sm) var(--sgds-padding-lg)}.skeleton-row{display:table-row}.skeleton-cell{border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);display:table-cell;height:var(--sgds-dimension-56);padding:var(--sgds-padding-sm) var(--sgds-padding-md);vertical-align:middle}.skeleton-cell.control-cell{width:var(--sgds-dimension-56)}.no-data{align-items:center;color:var(--sgds-text-color-subtle);display:flex;justify-content:center;min-height:var(--sgds-dimension-128);padding:var(--sgds-padding-sm) var(--sgds-padding-md)}.active:not(.sort-icon),tr:hover:not([data-header-row]){background-color:var(--sgds-bg-translucent-subtle);transition:background-color .15s ease}td,th{border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);vertical-align:middle}th[data-sorting]{cursor:pointer}th[data-sorting]:focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.data-table-cell,.data-table-head,.footer,.no-data{align-items:center;display:flex;font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-label-sm);font-style:normal;letter-spacing:var(--sgds-letter-spacing-normal);line-height:var(--sgds-line-height-2-xs);min-height:var(--sgds-dimension-56);padding:var(--sgds-padding-sm) var(--sgds-padding-md)}.data-table-head{color:var(--sgds-color-default);font-weight:var(--sgds-font-weight-semibold);gap:var(--sgds-gap-2-xs)}.data-table-head ::slotted(sgds-data-table-head){font-size:var(--sgds-font-size-label-sm);font-weight:var(--sgds-font-weight-semibold);line-height:var(--sgds-line-height-2-xs)}.data-table-cell{font-weight:var(--sgds-font-weight-regular)}.data-table-cell ::slotted(sgds-data-table-cell){font-size:var(--sgds-font-size-label-sm);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-2-xs)}.sort,.sort-button{align-items:center;display:inline-flex}.sort-button{background-color:var(--sgds-bg-transparent);border:var(--sgds-border-width-1) solid var(--sgds-border-color-transparent);border-radius:var(--sgds-form-border-radius-sm);color:var(--sgds-color-subtle);cursor:pointer;height:var(--sgds-dimension-20);justify-content:center;padding:0;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:var(--sgds-dimension-20)}.sort-button:hover{background-color:var(--sgds-bg-translucent-subtle);color:var(--sgds-color-default)}.sort-button:focus,.sort-button:focus-visible{background-color:var(--sgds-bg-translucent-subtle);border-color:transparent;outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.sort-button:disabled{background-color:var(--sgds-bg-transparent);color:var(--sgds-color-muted);cursor:not-allowed}.sort-button.active{background-color:var(--sgds-primary-surface-translucent);color:var(--sgds-primary-color-default)}.sort-icon{display:inline-flex}.data-table-cell.align-right,.data-table-head.align-right{justify-content:flex-end;text-align:right}.control-cell{width:var(--sgds-dimension-56)}:host(.checkbox-cell) .data-table-cell,:host(.checkbox-cell) .data-table-head{padding:var(--sgds-padding-sm) var(--sgds-padding-md)}:host(.expand-cell) .data-table-cell{cursor:pointer;padding:var(--sgds-padding-md)}.expandable-td{border:0;padding:0}.expandable-content{background-color:var(--sgds-surface-raised);border-bottom:var(--sgds-border-width-1) solid var(--sgds-border-color-muted);padding:var(--sgds-padding-2-xl);padding-left:var(--sgds-padding-4-xl)}.hidden{display:none}.visually-hidden{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}`;x();var W_=u`ul{margin-bottom:1rem;margin-top:0;padding-left:2rem}svg{vertical-align:middle}.pagination{display:inline-flex;gap:var(--sgds-gap-2-xs);list-style:none;padding-left:0}.page-link{align-items:center;background-color:var(--sgds-bg-transparent);border-radius:var(--sgds-border-radius-md);display:flex;height:var(--sgds-dimension-48);justify-content:center;width:var(--sgds-dimension-48)}.page-link:not(.ellipsis):focus-visible,.page-link:not(.ellipsis):hover{background-color:var(--sgds-primary-surface-translucent);color:var(--sgds-primary-color-default)}.page-link:not(.ellipsis):focus-visible{outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.page-item>.page-link:not(.ellipsis){cursor:pointer}.page-item.active .page-link{background-color:var(--sgds-primary-surface-default);color:var(--sgds-color-fixed-light)}.ellipsis-disabled,.page-item.disabled .page-link{opacity:var(--sgds-opacity-40)}.ellipsis-disabled{cursor:not-allowed;pointer-events:none}.pagination-sm .page-link{font-size:var(--sgds-font-size-label-sm);height:var(--sgds-dimension-40);width:var(--sgds-dimension-40)}.sr-only{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.pagination-description{align-items:center;display:flex}.pagination-sm .pagination-description{font-size:var(--sgds-font-size-label-sm)}`;x();var G_=class extends D{constructor(...e){super(...e),this.dataLength=0,this.currentPage=1,this.itemsPerPage=5,this.variant=`default`,this.navigation=`icon-button`,this.size=`md`,this._limit=4,this.ellipsisContent=y`
     <span aria-hidden="true">…</span>
     <span class="sr-only" role="text">Ellipsis</span>
   `,this._renderFirstEllipsis=()=>this.pages.length<=7||!(this.pages.length!==this._limit&&this.currentPage>4)?null:y`