@govtechsg/sgds-web-component 3.24.1-rc.0 → 3.24.1-rc.1

package/components/Input/index.umd.min.js

@@ -70,7 +70,7 @@ class extends Be{constructor(e){if(super(e),e.type!==Oe&&e.type!==ze&&e.type!==$
    * @license
    * Copyright 2020 Google LLC
    * SPDX-License-Identifier: BSD-3-Clause
-   */var Ne,Re=n`.invalid-feedback-container{display:flex;gap:var(--sgds-form-gap-sm)}.invalid-feedback,.invalid-feedback-container{color:var(--sgds-form-danger-color-default);line-height:var(--sgds-line-height-20)}.invalid-feedback{font-size:var(--sgds-font-size-14);font-weight:var(--sgds-font-weight-regular)}.valid-icon{color:var(--sgds-form-success-color-default)}`,De=n`.form-text{color:var(--sgds-form-color-subtle);font-size:var(--sgds-font-size-label-sm);line-height:var(--sgds-line-height-2-xs)}.form-text.disabled{opacity:var(--sgds-opacity-40)}`,Fe=n`.form-label{color:var(--sgds-form-color-default);font-weight:var(--sgds-font-weight-semibold);margin-bottom:0}.form-label.disabled{opacity:var(--sgds-opacity-40)}.form-check-label{color:var(--sgds-form-color-default)}.form-check-input:disabled~.form-check-label,.form-check-input[disabled]~.form-check-label{cursor:not-allowed}`,qe=n`.form-control::placeholder{color:var(--sgds-form-color-subtle);font-family:var(--sgds-font-family-brand);font-weight:var(--sgds-font-weight-light);line-height:var(--sgds-line-height-24)}`,We=n`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;color:var(--sgds-body-color-default,#1a1a1a);display:block;font-family:var(--sgds-font-family-brand,"Inter",system-ui,sans-serif);font-size:var(--sgds-font-size-body-md,1rem);font-weight:var(--sgds-font-weight-regular,400);line-height:var(--sgds-line-height-xs,24px);margin:0;*,:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}:disabled{cursor:not-allowed}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}::slotted(a[target=_blank]):after,a[target=_blank]:after{background-color:currentColor;content:"/";display:inline-block;height:1em;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;vertical-align:top;width:1em}::slotted(svg){vertical-align:middle}}`;class Ge extends Ze{emit(e,t){const l=new CustomEvent(e,Object.assign({bubbles:!0,cancelable:!1,composed:!0,detail:{}},t));return this.dispatchEvent(l),l}static define(e,t=this,l={}){if(customElements.get(e));else try{customElements.define(e,t,l)}catch(r){customElements.define(e,class extends t{},l)}}constructor(){super(),this.ssr=Boolean(this.shadowRoot),Object.entries(this.constructor.dependencies).forEach(([e,t])=>{this.constructor.define(e,t)})}firstUpdated(e){var t;super.firstUpdated(e),this.ssr&&(null===(t=this.shadowRoot)||void 0===t||t.querySelectorAll("slot").forEach(e=>{e.dispatchEvent(new Event("slotchange",{bubbles:!0,composed:!1,cancelable:!1}))}))}}function Je(e="",t=""){return`id-${Math.random().toString().substring(2,6)}-sgds-${e}-${t}`}Ge.styles=[We],Ge.dependencies={},e([Ve({type:Boolean,reflect:!0})],Ge.prototype,"ssr",void 0);class Ye extends Ge{constructor(){super(...arguments),this.label="",this.hintText="",this.disabled=!1,this.invalid=!1,this._controlId=Je("input"),this._labelId=Je("label")}setInvalid(e){this.invalid=e,e?this.emit("sgds-invalid"):this.emit("sgds-valid")}}Ye.styles=[...Ge.styles,Re,De,Fe,qe],e([Ve({reflect:!0})],Ye.prototype,"label",void 0),e([Ve({reflect:!0})],Ye.prototype,"hintText",void 0),e([Ve({reflect:!0})],Ye.prototype,"name",void 0),e([Ve({type:Boolean,reflect:!0})],Ye.prototype,"disabled",void 0),e([Ve({type:Boolean,reflect:!0})],Ye.prototype,"invalid",void 0);var Xe=n`.form-control-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md)}.m-width-160{min-width:var(--sgds-dimension-160)}.m-width-256{min-width:var(--sgds-dimension-256)}.form-label{color:var(--sgds-form-color-default);font-size:var(--sgds-font-size-label-md);font-weight:var(--sgds-font-weight-semibold)}.form-control-group{align-items:center;background-color:var(--sgds-form-surface-default);border:var(--sgds-form-border-width-default) solid var(--sgds-border-color-default);border-radius:var(--input-border-radius,var(--sgds-form-border-radius-md));display:flex;gap:var(--sgds-form-gap-md);height:var(--sgds-dimension-48);justify-content:center;overflow:hidden;padding:0 var(--sgds-form-padding-x);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:-webkit-fill-available;width:-moz-available}.form-control{appearance:none;background-clip:padding-box;background:none;border:none;color:var(--sgds-form-color-default);display:block;flex-grow:1;font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-label-md);line-height:var(--sgds-line-height-xs);min-width:0;outline:none;padding:0;width:100%}.form-clearable{color:var(--sgds-color-subtle);cursor:pointer}@media (prefers-reduced-motion:reduce){.form-control-group{transition:none}}.form-control-group:not(.disabled):not(.is-invalid):not(.readonly):not(:focus-within):hover{outline:var(--sgds-form-border-width-thick) solid var(--sgds-border-color-emphasis);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-group:not(.disabled):not(.is-invalid):focus-within{outline:var(--sgds-form-outline-focus);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-container.disabled{opacity:var(--sgds-opacity-40)}.form-control-group.disabled{background-color:var(--sgds-form-surface-muted);cursor:not-allowed}.form-control-group.readonly{background-color:var(--sgds-form-surface-raised)}.form-control-group.is-invalid:not(.disabled){border:var(--sgds-form-border-width-default) solid var(--sgds-form-danger-border-color-default)}.form-control-group:not(.disabled).is-invalid:focus-within{outline:var(--sgds-border-width-2) solid var(--sgds-form-danger-color-default);outline-offset:var(--sgds-form-outline-offset-focus)}`;class Ke{constructor(e,t){(this.host=e).addController(this),this._internals=e._internals||this.host.attachInternals(),this.options=Object.assign({setInvalid:(e,t)=>{e.invalid=t},value:e=>e.value,input:e=>e.input},t)}hostConnected(){this.host.addEventListener("invalid",e=>this.handleInvalid(e))}hostDisconnected(){this.host.removeEventListener("invalid",e=>this.handleInvalid(e))}handleInvalid(e){e.preventDefault(),this.options.setInvalid(this.host,!0)}handleInput(e){const t=e.target;this.options.setInvalid(this.host,!1),this.validateInput(t)}handleChange(e){const t=e.target;this.validateInput(t),this.options.setInvalid(this.host,!this.checkValidity())}get form(){return this._internals.form}get validity(){return this._internals.validity}get validationMessage(){return this._internals.validationMessage}get willValidate(){return this._internals.willValidate}updateInvalidState(){this.options.setInvalid(this.host,!this.checkValidity())}resetValidity(){return this._internals.setValidity({})}checkValidity(){return this._internals.checkValidity()}reportValidity(){return this._internals.reportValidity()}setValidity(e,t,l){return this._internals.setValidity(e,t,l)}setFormValue(){const e=this.options.value(this.host);this._internals.setFormValue(e)}validateInput(e){if(this.options.input(this.host).disabled)return this._internals.setValidity({});const t=e.validity;if(t.valid)this._internals.setValidity({});else for(const l in t)t[l]&&(this.validationError=l.toString(),this._internals.setValidity({[this.validationError]:!0},e.validationMessage,e))}}const Qe=t=>{class l extends t{constructor(...e){super(...e),this._isTouched=!1,this._internals=this.attachInternals()}connectedCallback(){var e;super.connectedCallback(),null!==(e=this.inputValidationController)&&void 0!==e||(this.inputValidationController=new Ke(this))}async firstUpdated(e){super.firstUpdated(e),this.input=this.shadowRoot.querySelector("input")||await this.sgdsInput||this.shadowRoot.querySelector("textarea")||await this.sgdsDatepickerInput,this._mixinSetFormValue(),this._mixinShouldSkipSgdsValidation()||this._mixinValidate(this.input)}formResetCallback(){this._mixinResetFormControl?this._mixinResetFormControl():(this.value=this.defaultValue,this._mixinResetValidity(this.input)),this._mixinSetFormValue()}_mixinHandleChange(e){this._mixinSetFormValue(),this._mixinShouldSkipSgdsValidation()||this.inputValidationController.handleChange(e)}_mixinHandleInputChange(e){this._mixinSetFormValue(),this._mixinShouldSkipSgdsValidation()||this.inputValidationController.handleInput(e)}_mixinResetValidity(e){this.inputValidationController.resetValidity(),this.inputValidationController.updateInvalidState(),this._isTouched&&(this._isTouched=!1),this._mixinShouldSkipSgdsValidation()||this.inputValidationController.validateInput(e)}_mixinValidate(e){this._mixinShouldSkipSgdsValidation()||this.inputValidationController.validateInput(e)}_mixinSetFormValue(){const e=this.value;this._internals.setFormValue(e)}_mixinCheckValidity(){return!!this._mixinShouldSkipSgdsValidation()||this.inputValidationController.checkValidity()}_mixinReportValidity(){return!!this._mixinShouldSkipSgdsValidation()||this.inputValidationController.reportValidity()}_mixinGetValidity(){return this._internals.validity}_mixinGetValidationMessage(){return this._internals.validationMessage}_mixinSetValidity(e,t,l){if(!this._mixinShouldSkipSgdsValidation())return this.inputValidationController.setValidity(e,t,l)}_mixinShouldSkipSgdsValidation(){const e=this.closest("form");return(null==e?void 0:e.noValidate)||this.noValidate}}return l.formAssociated=!0,e([Pe("sgds-input")],l.prototype,"sgdsInput",void 0),e([Pe("sgds-datepicker-input")],l.prototype,"sgdsDatepickerInput",void 0),l};function et(e,t){const l=Object.assign({waitUntilFirstUpdate:!1},t);return(t,r)=>{const{update:o}=t;if(e in t){const i=e;t.update=function(e){if(e.has(i)){const t=e.get(i),o=this[i];t!==o&&(l.waitUntilFirstUpdate&&!this.hasUpdated||this[r](t,o))}o.call(this,e)}}}}var tt=n`:host{--sgds-spinner-bg:var(--sgds-primary-surface-default);display:inline-flex}:host([variant=neutral]){--sgds-spinner-bg:var(--sgds-neutral-surface-default)}:host([tone=neutral]){--sgds-spinner-bg:var(--sgds-surface-inverse)}:host([tone=inverse]){--sgds-spinner-bg:var(--sgds-surface-default)}:host([tone=fixed-light]){--sgds-spinner-bg:var(--sgds-surface-fixed-light)}:host([tone=fixed-dark]){--sgds-spinner-bg:var(--sgds-surface-fixed-dark)}.spinner-wrapper{align-items:center;display:flex;flex-direction:column;gap:var(--sgds-gap-2-xs)}.spinner-wrapper.horizontal{flex-direction:row}.spinner{--border-thickness:4px;animation:spinner .75s linear infinite;border:var(--border-thickness) solid var(--sgds-bg-translucent);border-radius:50%;border-right:var(--border-thickness) solid var(--sgds-spinner-bg);color:var(--sgds-spinner-color);display:inline-flex;height:var(--sgds-dimension-32);width:var(--sgds-dimension-32)}.spinner-xs{--border-thickness:2px;height:var(--sgds-dimension-16);width:var(--sgds-dimension-16)}.spinner-sm{--border-thickness:3px;height:var(--sgds-dimension-24);width:var(--sgds-dimension-24)}.spinner-lg{--border-thickness:6px;height:var(--sgds-dimension-48);width:var(--sgds-dimension-48)}.spinner-xl{--border-thickness:8px;height:var(--sgds-dimension-64);width:var(--sgds-dimension-64)}.spinner-label{color:var(--sgds-neutral-color-default);font-size:var(--sgds-font-size-14)}@media (prefers-reduced-motion:reduce){.spinner{animation-duration:1.5s}}
+   */var Ne,Re=n`.invalid-feedback-container{display:flex;gap:var(--sgds-form-gap-sm)}.invalid-feedback,.invalid-feedback-container{color:var(--sgds-form-danger-color-default);line-height:var(--sgds-line-height-20)}.invalid-feedback{font-size:var(--sgds-font-size-14);font-weight:var(--sgds-font-weight-regular)}.valid-icon{color:var(--sgds-form-success-color-default)}`,De=n`.form-text{color:var(--sgds-form-color-subtle);font-size:var(--sgds-font-size-label-sm);line-height:var(--sgds-line-height-2-xs)}.form-text.disabled{opacity:var(--sgds-opacity-40)}`,Fe=n`.form-label{color:var(--sgds-form-color-default);font-weight:var(--sgds-font-weight-semibold);margin-bottom:0}.form-label.disabled{opacity:var(--sgds-opacity-40)}.form-check-label{color:var(--sgds-form-color-default)}.form-check-input:disabled~.form-check-label,.form-check-input[disabled]~.form-check-label{cursor:not-allowed}`,qe=n`.form-control::placeholder{color:var(--sgds-form-color-subtle);font-family:var(--sgds-font-family-brand);font-weight:var(--sgds-font-weight-light);line-height:var(--sgds-line-height-24)}`,We=n`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;color:var(--sgds-body-color-default,#1a1a1a);display:block;font-family:var(--sgds-font-family-brand,"Inter",system-ui,sans-serif);font-size:var(--sgds-font-size-body-md,1rem);font-weight:var(--sgds-font-weight-regular,400);line-height:var(--sgds-line-height-xs,24px);margin:0;*,:after,:before{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}:disabled{cursor:not-allowed}@media (prefers-reduced-motion:no-preference){:root{scroll-behavior:smooth}}::slotted(a[target=_blank]):after,a[target=_blank]:after{background-color:currentColor;content:"/";display:inline-block;height:1em;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9.774 4.4H9.8a.6.6 0 1 1 0 1.2c-.85 0-1.451 0-1.922.039-.463.038-.745.11-.968.223A2.4 2.4 0 0 0 5.861 6.91c-.113.223-.184.505-.222.968-.039.47-.04 1.072-.04 1.922v4.4c0 .85.001 1.451.04 1.922.038.463.11.745.222.968a2.4 2.4 0 0 0 1.05 1.048c.222.114.504.185.967.223.47.038 1.072.039 1.922.039h4.4c.85 0 1.451 0 1.921-.039.464-.038.746-.11.969-.223a2.4 2.4 0 0 0 1.048-1.048c.113-.223.185-.505.223-.968.038-.47.039-1.072.039-1.922a.6.6 0 1 1 1.2 0v.026c0 .818 0 1.468-.043 1.993-.044.538-.136.996-.35 1.415a3.6 3.6 0 0 1-1.573 1.574c-.42.213-.878.305-1.415.35-.525.042-1.175.042-1.993.042H9.774c-.818 0-1.469 0-1.993-.043-.538-.044-.996-.136-1.415-.35a3.6 3.6 0 0 1-1.574-1.573c-.213-.42-.305-.877-.35-1.415-.042-.525-.042-1.175-.042-1.993V9.774c0-.818 0-1.468.043-1.993.044-.538.136-.996.35-1.415a3.6 3.6 0 0 1 1.573-1.574c.42-.213.877-.305 1.415-.35C8.305 4.4 8.956 4.4 9.774 4.4ZM12.4 5a.6.6 0 0 1 .6-.6h6a.6.6 0 0 1 .6.6v6a.6.6 0 1 1-1.2 0V6.449l-5.976 5.975a.6.6 0 0 1-.848-.848L17.55 5.6H13a.6.6 0 0 1-.6-.6Z' fill='%230E0E0E'/%3E%3C/svg%3E");-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;vertical-align:top;width:1em}::slotted(svg){vertical-align:middle}}`;class Ge extends Ze{emit(e,t){const l=new CustomEvent(e,Object.assign({bubbles:!0,cancelable:!1,composed:!0,detail:{}},t));return this.dispatchEvent(l),l}static define(e,t=this,l={}){if(customElements.get(e));else try{customElements.define(e,t,l)}catch(r){customElements.define(e,class extends t{},l)}}constructor(){super(),this.ssr=Boolean(this.shadowRoot),Object.entries(this.constructor.dependencies).forEach(([e,t])=>{this.constructor.define(e,t)})}firstUpdated(e){var t;super.firstUpdated(e),this.ssr&&(null===(t=this.shadowRoot)||void 0===t||t.querySelectorAll("slot").forEach(e=>{e.dispatchEvent(new Event("slotchange",{bubbles:!0,composed:!1,cancelable:!1}))}))}}function Je(e="",t=""){return`id-${Math.random().toString().substring(2,6)}-sgds-${e}-${t}`}Ge.styles=[We],Ge.dependencies={},e([Ve({type:Boolean,reflect:!0})],Ge.prototype,"ssr",void 0);class Ye extends Ge{constructor(){super(...arguments),this.label="",this.hintText="",this.disabled=!1,this.invalid=!1,this._controlId=Je("input"),this._labelId=Je("label")}setInvalid(e){this.invalid=e,e?this.emit("sgds-invalid"):this.emit("sgds-valid")}}Ye.styles=[...Ge.styles,Re,De,Fe,qe],e([Ve({reflect:!0})],Ye.prototype,"label",void 0),e([Ve({reflect:!0})],Ye.prototype,"hintText",void 0),e([Ve({reflect:!0})],Ye.prototype,"name",void 0),e([Ve({type:Boolean,reflect:!0})],Ye.prototype,"disabled",void 0),e([Ve({type:Boolean,reflect:!0})],Ye.prototype,"invalid",void 0);var Xe=n`.form-control-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md)}.m-width-160{min-width:var(--sgds-dimension-160)}.m-width-256{min-width:var(--sgds-dimension-256)}.form-label{color:var(--sgds-form-color-default);font-size:var(--sgds-font-size-label-md);font-weight:var(--sgds-font-weight-semibold)}.form-control-group{align-items:center;background-color:var(--sgds-form-surface-default);border:var(--sgds-form-border-width-default) solid var(--sgds-border-color-default);border-radius:var(--input-border-radius,var(--sgds-form-border-radius-md));display:flex;gap:var(--sgds-form-gap-xl);height:var(--sgds-dimension-48);justify-content:center;overflow:hidden;padding:0 var(--sgds-form-padding-x);transition:border-color .15s ease-in-out,box-shadow .15s ease-in-out;width:-webkit-fill-available;width:-moz-available}.form-control{appearance:none;background-clip:padding-box;background:none;border:none;color:var(--sgds-form-color-default);display:block;flex-grow:1;font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-label-md);line-height:var(--sgds-line-height-xs);min-width:0;outline:none;padding:0;width:100%}.form-clearable{color:var(--sgds-color-subtle);cursor:pointer}@media (prefers-reduced-motion:reduce){.form-control-group{transition:none}}.form-control-group:not(.disabled):not(.is-invalid):not(.readonly):not(:focus-within):hover{outline:var(--sgds-form-border-width-thick) solid var(--sgds-border-color-emphasis);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-group:not(.disabled):not(.is-invalid):focus-within{outline:var(--sgds-form-outline-focus);outline-offset:var(--sgds-form-outline-offset-focus)}.form-control-container.disabled{opacity:var(--sgds-opacity-40)}.form-control-group.disabled{background-color:var(--sgds-form-surface-muted);cursor:not-allowed}.form-control-group.readonly{background-color:var(--sgds-form-surface-raised)}.form-control-group.is-invalid:not(.disabled){border:var(--sgds-form-border-width-default) solid var(--sgds-form-danger-border-color-default)}.form-control-group:not(.disabled).is-invalid:focus-within{outline:var(--sgds-border-width-2) solid var(--sgds-form-danger-color-default);outline-offset:var(--sgds-form-outline-offset-focus)}`;class Ke{constructor(e,t){(this.host=e).addController(this),this._internals=e._internals||this.host.attachInternals(),this.options=Object.assign({setInvalid:(e,t)=>{e.invalid=t},value:e=>e.value,input:e=>e.input},t)}hostConnected(){this.host.addEventListener("invalid",e=>this.handleInvalid(e))}hostDisconnected(){this.host.removeEventListener("invalid",e=>this.handleInvalid(e))}handleInvalid(e){e.preventDefault(),this.options.setInvalid(this.host,!0)}handleInput(e){const t=e.target;this.options.setInvalid(this.host,!1),this.validateInput(t)}handleChange(e){const t=e.target;this.validateInput(t),this.options.setInvalid(this.host,!this.checkValidity())}get form(){return this._internals.form}get validity(){return this._internals.validity}get validationMessage(){return this._internals.validationMessage}get willValidate(){return this._internals.willValidate}updateInvalidState(){this.options.setInvalid(this.host,!this.checkValidity())}resetValidity(){return this._internals.setValidity({})}checkValidity(){return this._internals.checkValidity()}reportValidity(){return this._internals.reportValidity()}setValidity(e,t,l){return this._internals.setValidity(e,t,l)}setFormValue(){const e=this.options.value(this.host);this._internals.setFormValue(e)}validateInput(e){if(this.options.input(this.host).disabled)return this._internals.setValidity({});const t=e.validity;if(t.valid)this._internals.setValidity({});else for(const l in t)t[l]&&(this.validationError=l.toString(),this._internals.setValidity({[this.validationError]:!0},e.validationMessage,e))}}const Qe=t=>{class l extends t{constructor(...e){super(...e),this._isTouched=!1,this._internals=this.attachInternals()}connectedCallback(){var e;super.connectedCallback(),null!==(e=this.inputValidationController)&&void 0!==e||(this.inputValidationController=new Ke(this))}async firstUpdated(e){super.firstUpdated(e),this.input=this.shadowRoot.querySelector("input")||await this.sgdsInput||this.shadowRoot.querySelector("textarea")||await this.sgdsDatepickerInput,this._mixinSetFormValue(),this._mixinShouldSkipSgdsValidation()||this._mixinValidate(this.input)}formResetCallback(){this._mixinResetFormControl?this._mixinResetFormControl():(this.value=this.defaultValue,this._mixinResetValidity(this.input)),this._mixinSetFormValue()}_mixinHandleChange(e){this._mixinSetFormValue(),this._mixinShouldSkipSgdsValidation()||this.inputValidationController.handleChange(e)}_mixinHandleInputChange(e){this._mixinSetFormValue(),this._mixinShouldSkipSgdsValidation()||this.inputValidationController.handleInput(e)}_mixinResetValidity(e){this.inputValidationController.resetValidity(),this.inputValidationController.updateInvalidState(),this._isTouched&&(this._isTouched=!1),this._mixinShouldSkipSgdsValidation()||this.inputValidationController.validateInput(e)}_mixinValidate(e){this._mixinShouldSkipSgdsValidation()||this.inputValidationController.validateInput(e)}_mixinSetFormValue(){const e=this.value;this._internals.setFormValue(e)}_mixinCheckValidity(){return!!this._mixinShouldSkipSgdsValidation()||this.inputValidationController.checkValidity()}_mixinReportValidity(){return!!this._mixinShouldSkipSgdsValidation()||this.inputValidationController.reportValidity()}_mixinGetValidity(){return this._internals.validity}_mixinGetValidationMessage(){return this._internals.validationMessage}_mixinSetValidity(e,t,l){if(!this._mixinShouldSkipSgdsValidation())return this.inputValidationController.setValidity(e,t,l)}_mixinShouldSkipSgdsValidation(){const e=this.closest("form");return(null==e?void 0:e.noValidate)||this.noValidate}}return l.formAssociated=!0,e([Pe("sgds-input")],l.prototype,"sgdsInput",void 0),e([Pe("sgds-datepicker-input")],l.prototype,"sgdsDatepickerInput",void 0),l};function et(e,t){const l=Object.assign({waitUntilFirstUpdate:!1},t);return(t,r)=>{const{update:o}=t;if(e in t){const i=e;t.update=function(e){if(e.has(i)){const t=e.get(i),o=this[i];t!==o&&(l.waitUntilFirstUpdate&&!this.hasUpdated||this[r](t,o))}o.call(this,e)}}}}var tt=n`:host{--sgds-spinner-bg:var(--sgds-primary-surface-default);display:inline-flex}:host([variant=neutral]){--sgds-spinner-bg:var(--sgds-neutral-surface-default)}:host([tone=neutral]){--sgds-spinner-bg:var(--sgds-surface-inverse)}:host([tone=inverse]){--sgds-spinner-bg:var(--sgds-surface-default)}:host([tone=fixed-light]){--sgds-spinner-bg:var(--sgds-surface-fixed-light)}:host([tone=fixed-dark]){--sgds-spinner-bg:var(--sgds-surface-fixed-dark)}.spinner-wrapper{align-items:center;display:flex;flex-direction:column;gap:var(--sgds-gap-2-xs)}.spinner-wrapper.horizontal{flex-direction:row}.spinner{--border-thickness:4px;animation:spinner .75s linear infinite;border:var(--border-thickness) solid var(--sgds-bg-translucent);border-radius:50%;border-right:var(--border-thickness) solid var(--sgds-spinner-bg);color:var(--sgds-spinner-color);display:inline-flex;height:var(--sgds-dimension-32);width:var(--sgds-dimension-32)}.spinner-xs{--border-thickness:2px;height:var(--sgds-dimension-16);width:var(--sgds-dimension-16)}.spinner-sm{--border-thickness:3px;height:var(--sgds-dimension-24);width:var(--sgds-dimension-24)}.spinner-lg{--border-thickness:6px;height:var(--sgds-dimension-48);width:var(--sgds-dimension-48)}.spinner-xl{--border-thickness:8px;height:var(--sgds-dimension-64);width:var(--sgds-dimension-64)}.spinner-label{color:var(--sgds-neutral-color-default);font-size:var(--sgds-font-size-14)}@media (prefers-reduced-motion:reduce){.spinner{animation-duration:1.5s}}
 
 /*! CSS Used keyframes */@keyframes spinner{to{transform:rotate(1turn)}}.sr-only{clip:rect(0,0,0,0);border:0;height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}`,lt=n`.text-primary{color:var(--sgds-primary-rgb)!important}.text-secondary{color:var(--sgds-secondary-rgb)!important}.text-success{color:var(--sgds-success-rgb)!important}.text-info{color:var(--sgds-info-rgb)!important}.text-warning{color:var(--sgds-warning-rgb)!important}.text-danger{color:var(--sgds-danger-rgb)!important}.text-light{color:var(--sgds-light-rgb)!important}.text-dark{color:var(--sgds-dark-rgb)!important}.text-muted{color:var(--sgds-secondary-color)!important}`;class rt extends Ge{constructor(){super(...arguments),this.variant="primary",this.tone="brand",this.size="md",this.orientation="vertical"}render(){return Ue`
       <div
@@ -84,7 +84,7 @@ class extends Be{constructor(e){if(super(e),e.type!==Oe&&e.type!==ze&&e.type!==$
         </div>
         ${this.label?Ue`<span class="spinner-label">${this.label}</span>`:le}
       </div>
-    `}}rt.styles=[...Ge.styles,lt,tt],e([Ve({type:String,reflect:!0})],rt.prototype,"variant",void 0),e([Ve({type:String,reflect:!0})],rt.prototype,"tone",void 0),e([Ve({type:String,reflect:!0})],rt.prototype,"size",void 0),e([Ve({reflect:!0,type:String})],rt.prototype,"label",void 0),e([Ve({type:String,reflect:!0})],rt.prototype,"orientation",void 0);var ot=n`:host{--input-border-radius:var(--sgds-form-border-radius-md);--input-min-width:var(--sgds-dimension-160)}.form-control-container{min-width:var(--input-min-width)}:host(.quantity-toggle) input::-webkit-inner-spin-button{appearance:none;margin:0}:host(.quantity-toggle) input{text-align:center}.form-control-prefix,.form-control-suffix{color:var(--sgds-form-color-subtle);display:flex;flex-shrink:0;font-weight:var(--sgds-font-weight-semibold);gap:var(--sgds-gap-xs)}.form-control-group.quantity-toggle{padding:0}sgds-icon[role=button]{cursor:pointer}sgds-icon[role=button]:focus,sgds-icon[role=button]:focus-visible{outline:var(--sgds-form-outline-focus)}.form-control-row{align-items:center;display:flex;gap:var(--sgds-gap-sm)}`;const it={announcement:()=>Promise.resolve().then(function(){return ut}),archive:()=>Promise.resolve().then(function(){return ft}),"arrow-bar-down":()=>Promise.resolve().then(function(){return wt}),"arrow-bar-left":()=>Promise.resolve().then(function(){return _t}),"arrow-bar-right":()=>Promise.resolve().then(function(){return xt}),"arrow-bar-up":()=>Promise.resolve().then(function(){return Ct}),"arrow-circle-down":()=>Promise.resolve().then(function(){return yt}),"arrow-circle-left":()=>Promise.resolve().then(function(){return Ht}),"arrow-circle-right":()=>Promise.resolve().then(function(){return zt}),"arrow-circle-up":()=>Promise.resolve().then(function(){return $t}),"arrow-clockwise":()=>Promise.resolve().then(function(){return Bt}),"arrow-down":()=>Promise.resolve().then(function(){return kt}),"arrow-left":()=>Promise.resolve().then(function(){return Lt}),"arrow-repeat":()=>Promise.resolve().then(function(){return Et}),"arrow-right":()=>Promise.resolve().then(function(){return Ut}),"arrow-square-down":()=>Promise.resolve().then(function(){return Rt}),"arrow-square-left":()=>Promise.resolve().then(function(){return Ft}),"arrow-square-right":()=>Promise.resolve().then(function(){return Wt}),"arrow-square-up":()=>Promise.resolve().then(function(){return Jt}),"arrow-up":()=>Promise.resolve().then(function(){return Xt}),"bank-fill":()=>Promise.resolve().then(function(){return Qt}),"bell-slash":()=>Promise.resolve().then(function(){return tl}),bell:()=>Promise.resolve().then(function(){return rl}),"bi-funnel":()=>Promise.resolve().then(function(){return il}),"bookmark-fill":()=>Promise.resolve().then(function(){return al}),bookmark:()=>Promise.resolve().then(function(){return sl}),"box-arrow-up-right":()=>Promise.resolve().then(function(){return dl}),"box-seam":()=>Promise.resolve().then(function(){return ul}),building:()=>Promise.resolve().then(function(){return fl}),bus:()=>Promise.resolve().then(function(){return wl}),calculator:()=>Promise.resolve().then(function(){return _l}),"calendar-check":()=>Promise.resolve().then(function(){return xl}),"calendar-heart":()=>Promise.resolve().then(function(){return Cl}),"calendar-x":()=>Promise.resolve().then(function(){return yl}),calendar:()=>Promise.resolve().then(function(){return Hl}),camera:()=>Promise.resolve().then(function(){return zl}),car:()=>Promise.resolve().then(function(){return $l}),"chat-dots":()=>Promise.resolve().then(function(){return Bl}),"chat-left-text":()=>Promise.resolve().then(function(){return kl}),chat:()=>Promise.resolve().then(function(){return Ll}),"check-circle-fill":()=>Promise.resolve().then(function(){return El}),"check-circle":()=>Promise.resolve().then(function(){return Ul}),check:()=>Promise.resolve().then(function(){return Rl}),"chevron-down":()=>Promise.resolve().then(function(){return Fl}),"chevron-left":()=>Promise.resolve().then(function(){return Wl}),"chevron-right":()=>Promise.resolve().then(function(){return Jl}),"chevron-selector-vertical":()=>Promise.resolve().then(function(){return Xl}),"chevron-up":()=>Promise.resolve().then(function(){return Ql}),clock:()=>Promise.resolve().then(function(){return tr}),"cloud-check":()=>Promise.resolve().then(function(){return rr}),"cloud-download":()=>Promise.resolve().then(function(){return ir}),"cloud-upload":()=>Promise.resolve().then(function(){return ar}),cloud:()=>Promise.resolve().then(function(){return sr}),"code-square":()=>Promise.resolve().then(function(){return dr}),"coins-hand":()=>Promise.resolve().then(function(){return ur}),compass:()=>Promise.resolve().then(function(){return fr}),copy:()=>Promise.resolve().then(function(){return wr}),"cpu-chip-ai":()=>Promise.resolve().then(function(){return _r}),cross:()=>Promise.resolve().then(function(){return xr}),"cursor-fill":()=>Promise.resolve().then(function(){return Cr}),cursor:()=>Promise.resolve().then(function(){return yr}),"dash-circle":()=>Promise.resolve().then(function(){return Hr}),"dash-square":()=>Promise.resolve().then(function(){return zr}),dash:()=>Promise.resolve().then(function(){return $r}),database:()=>Promise.resolve().then(function(){return Br}),dataflow:()=>Promise.resolve().then(function(){return kr}),download:()=>Promise.resolve().then(function(){return Lr}),edit:()=>Promise.resolve().then(function(){return Er}),"exclamation-circle-fill":()=>Promise.resolve().then(function(){return Ur}),"exclamation-circle":()=>Promise.resolve().then(function(){return Rr}),"exclamation-triangle-fill":()=>Promise.resolve().then(function(){return Fr}),"exclamation-triangle":()=>Promise.resolve().then(function(){return Wr}),exclamation:()=>Promise.resolve().then(function(){return Jr}),"eye-fill":()=>Promise.resolve().then(function(){return Xr}),"eye-slash-fill":()=>Promise.resolve().then(function(){return Qr}),"eye-slash":()=>Promise.resolve().then(function(){return to}),eye:()=>Promise.resolve().then(function(){return ro}),facebook:()=>Promise.resolve().then(function(){return io}),"file-earmark-text":()=>Promise.resolve().then(function(){return ao}),"file-pdf":()=>Promise.resolve().then(function(){return so}),"file-plus":()=>Promise.resolve().then(function(){return vo}),"file-text":()=>Promise.resolve().then(function(){return po}),file:()=>Promise.resolve().then(function(){return go}),files:()=>Promise.resolve().then(function(){return mo}),fingerprint:()=>Promise.resolve().then(function(){return Zo}),flash:()=>Promise.resolve().then(function(){return bo}),"folder-check":()=>Promise.resolve().then(function(){return Mo}),"folder-minus":()=>Promise.resolve().then(function(){return Vo}),"folder-plus":()=>Promise.resolve().then(function(){return Po}),folder:()=>Promise.resolve().then(function(){return Oo}),gear:()=>Promise.resolve().then(function(){return jo}),"geo-alt":()=>Promise.resolve().then(function(){return So}),"geo-fill":()=>Promise.resolve().then(function(){return Ao}),geo:()=>Promise.resolve().then(function(){return To}),"globe-alt":()=>Promise.resolve().then(function(){return Io}),globe:()=>Promise.resolve().then(function(){return No}),google:()=>Promise.resolve().then(function(){return Do}),"grid-fill":()=>Promise.resolve().then(function(){return qo}),"hand-thumbs-down":()=>Promise.resolve().then(function(){return Go}),"hand-thumbs-up":()=>Promise.resolve().then(function(){return Yo}),"hard-drive":()=>Promise.resolve().then(function(){return Ko}),heart:()=>Promise.resolve().then(function(){return ei}),"house-door":()=>Promise.resolve().then(function(){return li}),house:()=>Promise.resolve().then(function(){return oi}),image:()=>Promise.resolve().then(function(){return ni}),"in-box":()=>Promise.resolve().then(function(){return ci}),"info-circle-fill":()=>Promise.resolve().then(function(){return hi}),"info-circle":()=>Promise.resolve().then(function(){return vi}),instagram:()=>Promise.resolve().then(function(){return pi}),key:()=>Promise.resolve().then(function(){return gi}),"laptop-gear":()=>Promise.resolve().then(function(){return mi}),laptop:()=>Promise.resolve().then(function(){return Zi}),layers:()=>Promise.resolve().then(function(){return bi}),"layout-text-window-reverse":()=>Promise.resolve().then(function(){return Mi}),"layout-text-window":()=>Promise.resolve().then(function(){return Vi}),layout:()=>Promise.resolve().then(function(){return Pi}),"life-buoy":()=>Promise.resolve().then(function(){return Oi}),lightbulb:()=>Promise.resolve().then(function(){return ji}),link:()=>Promise.resolve().then(function(){return Si}),linkedin:()=>Promise.resolve().then(function(){return Ai}),list:()=>Promise.resolve().then(function(){return Ti}),"lock-fill":()=>Promise.resolve().then(function(){return Ii}),lock:()=>Promise.resolve().then(function(){return Ni}),login:()=>Promise.resolve().then(function(){return Di}),logout:()=>Promise.resolve().then(function(){return qi}),luggage:()=>Promise.resolve().then(function(){return Gi}),"mail-open":()=>Promise.resolve().then(function(){return Yi}),mail:()=>Promise.resolve().then(function(){return Ki}),map:()=>Promise.resolve().then(function(){return en}),meetup:()=>Promise.resolve().then(function(){return ln}),menu:()=>Promise.resolve().then(function(){return on}),microphone:()=>Promise.resolve().then(function(){return an}),monitor:()=>Promise.resolve().then(function(){return sn}),moon:()=>Promise.resolve().then(function(){return dn}),move:()=>Promise.resolve().then(function(){return un}),paperclip:()=>Promise.resolve().then(function(){return fn}),passcode:()=>Promise.resolve().then(function(){return wn}),passport:()=>Promise.resolve().then(function(){return _n}),pause:()=>Promise.resolve().then(function(){return xn}),pencil:()=>Promise.resolve().then(function(){return Cn}),"pending-circle":()=>Promise.resolve().then(function(){return yn}),"person-dash":()=>Promise.resolve().then(function(){return Hn}),"person-plus":()=>Promise.resolve().then(function(){return zn}),"person-x":()=>Promise.resolve().then(function(){return $n}),person:()=>Promise.resolve().then(function(){return Bn}),phone:()=>Promise.resolve().then(function(){return kn}),"pin-map-fill":()=>Promise.resolve().then(function(){return Ln}),pin:()=>Promise.resolve().then(function(){return En}),placeholder:()=>Promise.resolve().then(function(){return Un}),plane:()=>Promise.resolve().then(function(){return Rn}),play:()=>Promise.resolve().then(function(){return Fn}),"plus-circle":()=>Promise.resolve().then(function(){return Wn}),"plus-square":()=>Promise.resolve().then(function(){return Jn}),plus:()=>Promise.resolve().then(function(){return Xn}),printer:()=>Promise.resolve().then(function(){return Qn}),"question-circle":()=>Promise.resolve().then(function(){return ta}),rocket:()=>Promise.resolve().then(function(){return ra}),save:()=>Promise.resolve().then(function(){return ia}),search:()=>Promise.resolve().then(function(){return aa}),send:()=>Promise.resolve().then(function(){return sa}),"sg-crest":()=>Promise.resolve().then(function(){return da}),share:()=>Promise.resolve().then(function(){return ua}),"shield-tick":()=>Promise.resolve().then(function(){return fa}),"sidebar-collapse":()=>Promise.resolve().then(function(){return wa}),"sidebar-expand":()=>Promise.resolve().then(function(){return _a}),"slash-circle":()=>Promise.resolve().then(function(){return xa}),"slash-divider":()=>Promise.resolve().then(function(){return Ca}),sliders:()=>Promise.resolve().then(function(){return ya}),speedometer:()=>Promise.resolve().then(function(){return Ha}),"star-fill":()=>Promise.resolve().then(function(){return za}),star:()=>Promise.resolve().then(function(){return $a}),stoplights:()=>Promise.resolve().then(function(){return Ba}),sun:()=>Promise.resolve().then(function(){return ka}),"switch-horizontal":()=>Promise.resolve().then(function(){return La}),"switch-vertical":()=>Promise.resolve().then(function(){return Ea}),tablet:()=>Promise.resolve().then(function(){return Ua}),telegram:()=>Promise.resolve().then(function(){return Ra}),telephone:()=>Promise.resolve().then(function(){return Fa}),"three-dots-vertical":()=>Promise.resolve().then(function(){return Wa}),"three-dots":()=>Promise.resolve().then(function(){return Ja}),ticket:()=>Promise.resolve().then(function(){return Xa}),"toggle-off":()=>Promise.resolve().then(function(){return Qa}),"toggle-on":()=>Promise.resolve().then(function(){return tc}),train:()=>Promise.resolve().then(function(){return rc}),translate:()=>Promise.resolve().then(function(){return ic}),trash:()=>Promise.resolve().then(function(){return ac}),"trend-down":()=>Promise.resolve().then(function(){return sc}),"trend-up":()=>Promise.resolve().then(function(){return dc}),truck:()=>Promise.resolve().then(function(){return uc}),"twitter-x":()=>Promise.resolve().then(function(){return fc}),unlock:()=>Promise.resolve().then(function(){return wc}),upload:()=>Promise.resolve().then(function(){return _c}),"user-check":()=>Promise.resolve().then(function(){return xc}),"user-circle":()=>Promise.resolve().then(function(){return Cc}),"user-pause":()=>Promise.resolve().then(function(){return yc}),"user-square":()=>Promise.resolve().then(function(){return Hc}),users:()=>Promise.resolve().then(function(){return zc}),"video-recorder":()=>Promise.resolve().then(function(){return $c}),"volume-max":()=>Promise.resolve().then(function(){return Bc}),"volume-x":()=>Promise.resolve().then(function(){return kc}),"window-dash":()=>Promise.resolve().then(function(){return Lc}),"window-desktop":()=>Promise.resolve().then(function(){return Ec}),"window-dock":()=>Promise.resolve().then(function(){return Uc}),"window-fullscreen":()=>Promise.resolve().then(function(){return Rc}),"window-plus":()=>Promise.resolve().then(function(){return Fc}),"window-sidebar":()=>Promise.resolve().then(function(){return Wc}),"window-split":()=>Promise.resolve().then(function(){return Jc}),"window-stack":()=>Promise.resolve().then(function(){return Xc}),"window-x":()=>Promise.resolve().then(function(){return Qc}),window:()=>Promise.resolve().then(function(){return ts}),"xcircle-fill":()=>Promise.resolve().then(function(){return rs}),xcircle:()=>Promise.resolve().then(function(){return is}),youtube:()=>Promise.resolve().then(function(){return as}),"zoom-in":()=>Promise.resolve().then(function(){return ss}),"zoom-out":()=>Promise.resolve().then(function(){return ds})};var nt=n`:host{color:inherit;display:inline-flex;vertical-align:bottom}:host(.icon-left){margin-right:.25rem}:host(.icon-right){margin-left:.25rem}:host([size=xs]) svg{height:var(--sgds-icon-size-xs);width:var(--sgds-icon-size-xs)}:host([size=sm]) svg{height:var(--sgds-icon-size-sm);width:var(--sgds-icon-size-sm)}:host([size=md]) svg{height:var(--sgds-icon-size-md);width:var(--sgds-icon-size-md)}:host([size=xl]) svg{height:var(--sgds-icon-size-xl);width:var(--sgds-icon-size-xl)}:host([size="2-xl"]) svg{height:var(--sgds-icon-size-2-xl);width:var(--sgds-icon-size-2-xl)}:host([size="3-xl"]) svg{height:var(--sgds-icon-size-3-xl);width:var(--sgds-icon-size-3-xl)}svg{display:inline-block;height:var(--sgds-icon-size-lg);width:var(--sgds-icon-size-lg)}`;const at=new Map;class ct extends Ge{constructor(){super(...arguments),this.size="lg"}willUpdate(e){e.has("name")&&this._loadIcon(this.name)}async _loadIcon(e){if(!e)return void(this._icon=void 0);if(at.has(e))return void(this._icon=at.get(e));const t=it[e];if(!t)return console.warn(`Icon not found: ${e}`),void(this._icon=void 0);try{const l=await t();at.set(e,l.default),this._icon=l.default}catch(t){console.warn(`Failed to load icon: ${e}`),this._icon=void 0}}updated(){var e;const t=null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector("svg");t&&(this.ariaLabel?(t.removeAttribute("aria-hidden"),t.setAttribute("aria-label",this.ariaLabel)):(t.removeAttribute("aria-label"),t.setAttribute("aria-hidden","true")))}render(){var e;return null!==(e=this._icon)&&void 0!==e?e:le}}ct.styles=[...Ge.styles,nt],e([Ve({type:String,reflect:!0})],ct.prototype,"name",void 0),e([Ve({type:String,reflect:!0})],ct.prototype,"size",void 0),e([Ve({type:String})],ct.prototype,"ariaLabel",void 0),e([He()],ct.prototype,"_icon",void 0);class st extends(Qe(Ye)){constructor(){super(...arguments),this.type="text",this.placeholder="placeholder",this.autofocus=!1,this.readonly=!1,this.autocomplete="on",this.defaultValue="",this.valid=!1,this.loading=!1,this.required=!1,this.noValidate=!1,this.value="",this._isTouched=!1,this._showPassword=!1}focus(e){this.input.focus(e)}blur(){this.input.blur()}reportValidity(){return this._mixinReportValidity()}checkValidity(){return this._mixinCheckValidity()}setValidity(e,t,l){return this._mixinSetValidity(e,t,l)}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}_handleFocus(){this.emit("sgds-focus")}_handleBlur(){const e=this.emit("sgds-blur",{cancelable:!0});this._mixinShouldSkipSgdsValidation()||e.defaultPrevented||(this.setInvalid(!this._mixinCheckValidity()),this._isTouched=!0)}_handleClick(){this.focus()}_handleChange(e){this.value=this.input.value;this.emit("sgds-change",{cancelable:!0}).defaultPrevented||super._mixinHandleChange(e)}_handleInputChange(e){this.value=this.input.value;this.emit("sgds-input",{cancelable:!0}).defaultPrevented||super._mixinHandleInputChange(e)}_handleIsTouched(){this._mixinShouldSkipSgdsValidation()||this._isTouched&&this.setInvalid(!this._mixinCheckValidity())}_handleDisabledChange(){this.setInvalid(!1)}_renderInput(){const e="both"===this.hasFeedback||"style"===this.hasFeedback,t="both"===this.hasFeedback||"text"===this.hasFeedback,l=[this.hintText?`${this._controlId}Help`:"",this.invalid&&t?`${this._controlId}-invalid`:""].filter(Boolean).join(" ")||void 0;return Ue`
+    `}}rt.styles=[...Ge.styles,lt,tt],e([Ve({type:String,reflect:!0})],rt.prototype,"variant",void 0),e([Ve({type:String,reflect:!0})],rt.prototype,"tone",void 0),e([Ve({type:String,reflect:!0})],rt.prototype,"size",void 0),e([Ve({reflect:!0,type:String})],rt.prototype,"label",void 0),e([Ve({type:String,reflect:!0})],rt.prototype,"orientation",void 0);var ot=n`:host{--input-border-radius:var(--sgds-form-border-radius-md);--input-min-width:var(--sgds-dimension-160)}.form-control-container{min-width:var(--input-min-width)}:host(.quantity-toggle) input::-webkit-inner-spin-button{appearance:none;margin:0}:host(.quantity-toggle) input{text-align:center}.form-control-prefix,.form-control-suffix{align-items:center;color:var(--sgds-form-color-subtle);display:flex;flex-shrink:0;font-weight:var(--sgds-font-weight-semibold);gap:var(--sgds-gap-xs);height:100%;justify-content:center}.form-control-prefix{border-right:var(--sgds-form-border-width-default) solid var(--sgds-border-color-muted);padding-right:var(--sgds-form-padding-x)}.form-control-suffix{border-left:var(--sgds-form-border-width-default) solid var(--sgds-border-color-muted);padding-left:var(--sgds-form-padding-x)}.form-control-group.quantity-toggle{padding:0}sgds-icon[role=button]{cursor:pointer}sgds-icon[role=button]:focus,sgds-icon[role=button]:focus-visible{outline:var(--sgds-form-outline-focus)}.form-control-row{align-items:center;display:flex;gap:var(--sgds-gap-sm)}`;const it={announcement:()=>Promise.resolve().then(function(){return ut}),archive:()=>Promise.resolve().then(function(){return ft}),"arrow-bar-down":()=>Promise.resolve().then(function(){return wt}),"arrow-bar-left":()=>Promise.resolve().then(function(){return _t}),"arrow-bar-right":()=>Promise.resolve().then(function(){return xt}),"arrow-bar-up":()=>Promise.resolve().then(function(){return Ct}),"arrow-circle-down":()=>Promise.resolve().then(function(){return yt}),"arrow-circle-left":()=>Promise.resolve().then(function(){return Ht}),"arrow-circle-right":()=>Promise.resolve().then(function(){return zt}),"arrow-circle-up":()=>Promise.resolve().then(function(){return $t}),"arrow-clockwise":()=>Promise.resolve().then(function(){return Bt}),"arrow-down":()=>Promise.resolve().then(function(){return kt}),"arrow-left":()=>Promise.resolve().then(function(){return Lt}),"arrow-repeat":()=>Promise.resolve().then(function(){return Et}),"arrow-right":()=>Promise.resolve().then(function(){return Ut}),"arrow-square-down":()=>Promise.resolve().then(function(){return Rt}),"arrow-square-left":()=>Promise.resolve().then(function(){return Ft}),"arrow-square-right":()=>Promise.resolve().then(function(){return Wt}),"arrow-square-up":()=>Promise.resolve().then(function(){return Jt}),"arrow-up":()=>Promise.resolve().then(function(){return Xt}),"bank-fill":()=>Promise.resolve().then(function(){return Qt}),"bell-slash":()=>Promise.resolve().then(function(){return tl}),bell:()=>Promise.resolve().then(function(){return rl}),"bi-funnel":()=>Promise.resolve().then(function(){return il}),"bookmark-fill":()=>Promise.resolve().then(function(){return al}),bookmark:()=>Promise.resolve().then(function(){return sl}),"box-arrow-up-right":()=>Promise.resolve().then(function(){return dl}),"box-seam":()=>Promise.resolve().then(function(){return ul}),building:()=>Promise.resolve().then(function(){return fl}),bus:()=>Promise.resolve().then(function(){return wl}),calculator:()=>Promise.resolve().then(function(){return _l}),"calendar-check":()=>Promise.resolve().then(function(){return xl}),"calendar-heart":()=>Promise.resolve().then(function(){return Cl}),"calendar-x":()=>Promise.resolve().then(function(){return yl}),calendar:()=>Promise.resolve().then(function(){return Hl}),camera:()=>Promise.resolve().then(function(){return zl}),car:()=>Promise.resolve().then(function(){return $l}),"chat-dots":()=>Promise.resolve().then(function(){return Bl}),"chat-left-text":()=>Promise.resolve().then(function(){return kl}),chat:()=>Promise.resolve().then(function(){return Ll}),"check-circle-fill":()=>Promise.resolve().then(function(){return El}),"check-circle":()=>Promise.resolve().then(function(){return Ul}),check:()=>Promise.resolve().then(function(){return Rl}),"chevron-down":()=>Promise.resolve().then(function(){return Fl}),"chevron-left":()=>Promise.resolve().then(function(){return Wl}),"chevron-right":()=>Promise.resolve().then(function(){return Jl}),"chevron-selector-vertical":()=>Promise.resolve().then(function(){return Xl}),"chevron-up":()=>Promise.resolve().then(function(){return Ql}),clock:()=>Promise.resolve().then(function(){return tr}),"cloud-check":()=>Promise.resolve().then(function(){return rr}),"cloud-download":()=>Promise.resolve().then(function(){return ir}),"cloud-upload":()=>Promise.resolve().then(function(){return ar}),cloud:()=>Promise.resolve().then(function(){return sr}),"code-square":()=>Promise.resolve().then(function(){return dr}),"coins-hand":()=>Promise.resolve().then(function(){return ur}),compass:()=>Promise.resolve().then(function(){return fr}),copy:()=>Promise.resolve().then(function(){return wr}),"cpu-chip-ai":()=>Promise.resolve().then(function(){return _r}),cross:()=>Promise.resolve().then(function(){return xr}),"cursor-fill":()=>Promise.resolve().then(function(){return Cr}),cursor:()=>Promise.resolve().then(function(){return yr}),"dash-circle":()=>Promise.resolve().then(function(){return Hr}),"dash-square":()=>Promise.resolve().then(function(){return zr}),dash:()=>Promise.resolve().then(function(){return $r}),database:()=>Promise.resolve().then(function(){return Br}),dataflow:()=>Promise.resolve().then(function(){return kr}),download:()=>Promise.resolve().then(function(){return Lr}),edit:()=>Promise.resolve().then(function(){return Er}),"exclamation-circle-fill":()=>Promise.resolve().then(function(){return Ur}),"exclamation-circle":()=>Promise.resolve().then(function(){return Rr}),"exclamation-triangle-fill":()=>Promise.resolve().then(function(){return Fr}),"exclamation-triangle":()=>Promise.resolve().then(function(){return Wr}),exclamation:()=>Promise.resolve().then(function(){return Jr}),"eye-fill":()=>Promise.resolve().then(function(){return Xr}),"eye-slash-fill":()=>Promise.resolve().then(function(){return Qr}),"eye-slash":()=>Promise.resolve().then(function(){return to}),eye:()=>Promise.resolve().then(function(){return ro}),facebook:()=>Promise.resolve().then(function(){return io}),"file-earmark-text":()=>Promise.resolve().then(function(){return ao}),"file-pdf":()=>Promise.resolve().then(function(){return so}),"file-plus":()=>Promise.resolve().then(function(){return vo}),"file-text":()=>Promise.resolve().then(function(){return po}),file:()=>Promise.resolve().then(function(){return go}),files:()=>Promise.resolve().then(function(){return mo}),fingerprint:()=>Promise.resolve().then(function(){return Zo}),flash:()=>Promise.resolve().then(function(){return bo}),"folder-check":()=>Promise.resolve().then(function(){return Mo}),"folder-minus":()=>Promise.resolve().then(function(){return Vo}),"folder-plus":()=>Promise.resolve().then(function(){return Po}),folder:()=>Promise.resolve().then(function(){return Oo}),gear:()=>Promise.resolve().then(function(){return jo}),"geo-alt":()=>Promise.resolve().then(function(){return So}),"geo-fill":()=>Promise.resolve().then(function(){return Ao}),geo:()=>Promise.resolve().then(function(){return To}),"globe-alt":()=>Promise.resolve().then(function(){return Io}),globe:()=>Promise.resolve().then(function(){return No}),google:()=>Promise.resolve().then(function(){return Do}),"grid-fill":()=>Promise.resolve().then(function(){return qo}),"hand-thumbs-down":()=>Promise.resolve().then(function(){return Go}),"hand-thumbs-up":()=>Promise.resolve().then(function(){return Yo}),"hard-drive":()=>Promise.resolve().then(function(){return Ko}),heart:()=>Promise.resolve().then(function(){return ei}),"house-door":()=>Promise.resolve().then(function(){return li}),house:()=>Promise.resolve().then(function(){return oi}),image:()=>Promise.resolve().then(function(){return ni}),"in-box":()=>Promise.resolve().then(function(){return ci}),"info-circle-fill":()=>Promise.resolve().then(function(){return hi}),"info-circle":()=>Promise.resolve().then(function(){return vi}),instagram:()=>Promise.resolve().then(function(){return pi}),key:()=>Promise.resolve().then(function(){return gi}),"laptop-gear":()=>Promise.resolve().then(function(){return mi}),laptop:()=>Promise.resolve().then(function(){return Zi}),layers:()=>Promise.resolve().then(function(){return bi}),"layout-text-window-reverse":()=>Promise.resolve().then(function(){return Mi}),"layout-text-window":()=>Promise.resolve().then(function(){return Vi}),layout:()=>Promise.resolve().then(function(){return Pi}),"life-buoy":()=>Promise.resolve().then(function(){return Oi}),lightbulb:()=>Promise.resolve().then(function(){return ji}),link:()=>Promise.resolve().then(function(){return Si}),linkedin:()=>Promise.resolve().then(function(){return Ai}),list:()=>Promise.resolve().then(function(){return Ti}),"lock-fill":()=>Promise.resolve().then(function(){return Ii}),lock:()=>Promise.resolve().then(function(){return Ni}),login:()=>Promise.resolve().then(function(){return Di}),logout:()=>Promise.resolve().then(function(){return qi}),luggage:()=>Promise.resolve().then(function(){return Gi}),"mail-open":()=>Promise.resolve().then(function(){return Yi}),mail:()=>Promise.resolve().then(function(){return Ki}),map:()=>Promise.resolve().then(function(){return en}),meetup:()=>Promise.resolve().then(function(){return ln}),menu:()=>Promise.resolve().then(function(){return on}),microphone:()=>Promise.resolve().then(function(){return an}),monitor:()=>Promise.resolve().then(function(){return sn}),moon:()=>Promise.resolve().then(function(){return dn}),move:()=>Promise.resolve().then(function(){return un}),paperclip:()=>Promise.resolve().then(function(){return fn}),passcode:()=>Promise.resolve().then(function(){return wn}),passport:()=>Promise.resolve().then(function(){return _n}),pause:()=>Promise.resolve().then(function(){return xn}),pencil:()=>Promise.resolve().then(function(){return Cn}),"pending-circle":()=>Promise.resolve().then(function(){return yn}),"person-dash":()=>Promise.resolve().then(function(){return Hn}),"person-plus":()=>Promise.resolve().then(function(){return zn}),"person-x":()=>Promise.resolve().then(function(){return $n}),person:()=>Promise.resolve().then(function(){return Bn}),phone:()=>Promise.resolve().then(function(){return kn}),"pin-map-fill":()=>Promise.resolve().then(function(){return Ln}),pin:()=>Promise.resolve().then(function(){return En}),placeholder:()=>Promise.resolve().then(function(){return Un}),plane:()=>Promise.resolve().then(function(){return Rn}),play:()=>Promise.resolve().then(function(){return Fn}),"plus-circle":()=>Promise.resolve().then(function(){return Wn}),"plus-square":()=>Promise.resolve().then(function(){return Jn}),plus:()=>Promise.resolve().then(function(){return Xn}),printer:()=>Promise.resolve().then(function(){return Qn}),"question-circle":()=>Promise.resolve().then(function(){return ta}),rocket:()=>Promise.resolve().then(function(){return ra}),save:()=>Promise.resolve().then(function(){return ia}),search:()=>Promise.resolve().then(function(){return aa}),send:()=>Promise.resolve().then(function(){return sa}),"sg-crest":()=>Promise.resolve().then(function(){return da}),share:()=>Promise.resolve().then(function(){return ua}),"shield-tick":()=>Promise.resolve().then(function(){return fa}),"sidebar-collapse":()=>Promise.resolve().then(function(){return wa}),"sidebar-expand":()=>Promise.resolve().then(function(){return _a}),"slash-circle":()=>Promise.resolve().then(function(){return xa}),"slash-divider":()=>Promise.resolve().then(function(){return Ca}),sliders:()=>Promise.resolve().then(function(){return ya}),speedometer:()=>Promise.resolve().then(function(){return Ha}),"star-fill":()=>Promise.resolve().then(function(){return za}),star:()=>Promise.resolve().then(function(){return $a}),stoplights:()=>Promise.resolve().then(function(){return Ba}),sun:()=>Promise.resolve().then(function(){return ka}),"switch-horizontal":()=>Promise.resolve().then(function(){return La}),"switch-vertical":()=>Promise.resolve().then(function(){return Ea}),tablet:()=>Promise.resolve().then(function(){return Ua}),telegram:()=>Promise.resolve().then(function(){return Ra}),telephone:()=>Promise.resolve().then(function(){return Fa}),"three-dots-vertical":()=>Promise.resolve().then(function(){return Wa}),"three-dots":()=>Promise.resolve().then(function(){return Ja}),ticket:()=>Promise.resolve().then(function(){return Xa}),"toggle-off":()=>Promise.resolve().then(function(){return Qa}),"toggle-on":()=>Promise.resolve().then(function(){return tc}),train:()=>Promise.resolve().then(function(){return rc}),translate:()=>Promise.resolve().then(function(){return ic}),trash:()=>Promise.resolve().then(function(){return ac}),"trend-down":()=>Promise.resolve().then(function(){return sc}),"trend-up":()=>Promise.resolve().then(function(){return dc}),truck:()=>Promise.resolve().then(function(){return uc}),"twitter-x":()=>Promise.resolve().then(function(){return fc}),unlock:()=>Promise.resolve().then(function(){return wc}),upload:()=>Promise.resolve().then(function(){return _c}),"user-check":()=>Promise.resolve().then(function(){return xc}),"user-circle":()=>Promise.resolve().then(function(){return Cc}),"user-pause":()=>Promise.resolve().then(function(){return yc}),"user-square":()=>Promise.resolve().then(function(){return Hc}),users:()=>Promise.resolve().then(function(){return zc}),"video-recorder":()=>Promise.resolve().then(function(){return $c}),"volume-max":()=>Promise.resolve().then(function(){return Bc}),"volume-x":()=>Promise.resolve().then(function(){return kc}),"window-dash":()=>Promise.resolve().then(function(){return Lc}),"window-desktop":()=>Promise.resolve().then(function(){return Ec}),"window-dock":()=>Promise.resolve().then(function(){return Uc}),"window-fullscreen":()=>Promise.resolve().then(function(){return Rc}),"window-plus":()=>Promise.resolve().then(function(){return Fc}),"window-sidebar":()=>Promise.resolve().then(function(){return Wc}),"window-split":()=>Promise.resolve().then(function(){return Jc}),"window-stack":()=>Promise.resolve().then(function(){return Xc}),"window-x":()=>Promise.resolve().then(function(){return Qc}),window:()=>Promise.resolve().then(function(){return ts}),"xcircle-fill":()=>Promise.resolve().then(function(){return rs}),xcircle:()=>Promise.resolve().then(function(){return is}),youtube:()=>Promise.resolve().then(function(){return as}),"zoom-in":()=>Promise.resolve().then(function(){return ss}),"zoom-out":()=>Promise.resolve().then(function(){return ds})};var nt=n`:host{color:inherit;display:inline-flex;vertical-align:bottom}:host(.icon-left){margin-right:.25rem}:host(.icon-right){margin-left:.25rem}:host([size=xs]) svg{height:var(--sgds-icon-size-xs);width:var(--sgds-icon-size-xs)}:host([size=sm]) svg{height:var(--sgds-icon-size-sm);width:var(--sgds-icon-size-sm)}:host([size=md]) svg{height:var(--sgds-icon-size-md);width:var(--sgds-icon-size-md)}:host([size=xl]) svg{height:var(--sgds-icon-size-xl);width:var(--sgds-icon-size-xl)}:host([size="2-xl"]) svg{height:var(--sgds-icon-size-2-xl);width:var(--sgds-icon-size-2-xl)}:host([size="3-xl"]) svg{height:var(--sgds-icon-size-3-xl);width:var(--sgds-icon-size-3-xl)}svg{display:inline-block;height:var(--sgds-icon-size-lg);width:var(--sgds-icon-size-lg)}`;const at=new Map;class ct extends Ge{constructor(){super(...arguments),this.size="lg"}willUpdate(e){e.has("name")&&this._loadIcon(this.name)}async _loadIcon(e){if(!e)return void(this._icon=void 0);if(at.has(e))return void(this._icon=at.get(e));const t=it[e];if(!t)return console.warn(`Icon not found: ${e}`),void(this._icon=void 0);try{const l=await t();at.set(e,l.default),this._icon=l.default}catch(t){console.warn(`Failed to load icon: ${e}`),this._icon=void 0}}updated(){var e;const t=null===(e=this.shadowRoot)||void 0===e?void 0:e.querySelector("svg");t&&(this.ariaLabel?(t.removeAttribute("aria-hidden"),t.setAttribute("aria-label",this.ariaLabel)):(t.removeAttribute("aria-label"),t.setAttribute("aria-hidden","true")))}render(){var e;return null!==(e=this._icon)&&void 0!==e?e:le}}ct.styles=[...Ge.styles,nt],e([Ve({type:String,reflect:!0})],ct.prototype,"name",void 0),e([Ve({type:String,reflect:!0})],ct.prototype,"size",void 0),e([Ve({type:String})],ct.prototype,"ariaLabel",void 0),e([He()],ct.prototype,"_icon",void 0);class st extends(Qe(Ye)){constructor(){super(...arguments),this.type="text",this.placeholder="placeholder",this.autofocus=!1,this.readonly=!1,this.autocomplete="on",this.defaultValue="",this.valid=!1,this.loading=!1,this.required=!1,this.noValidate=!1,this.value="",this._isTouched=!1,this._showPassword=!1}focus(e){this.input.focus(e)}blur(){this.input.blur()}reportValidity(){return this._mixinReportValidity()}checkValidity(){return this._mixinCheckValidity()}setValidity(e,t,l){return this._mixinSetValidity(e,t,l)}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}_handleFocus(){this.emit("sgds-focus")}_handleBlur(){const e=this.emit("sgds-blur",{cancelable:!0});this._mixinShouldSkipSgdsValidation()||e.defaultPrevented||(this.setInvalid(!this._mixinCheckValidity()),this._isTouched=!0)}_handleClick(){this.focus()}_handleChange(e){this.value=this.input.value;this.emit("sgds-change",{cancelable:!0}).defaultPrevented||super._mixinHandleChange(e)}_handleInputChange(e){this.value=this.input.value;this.emit("sgds-input",{cancelable:!0}).defaultPrevented||super._mixinHandleInputChange(e)}_handleIsTouched(){this._mixinShouldSkipSgdsValidation()||this._isTouched&&this.setInvalid(!this._mixinCheckValidity())}_handleDisabledChange(){this.setInvalid(!1)}_renderInput(){const e="both"===this.hasFeedback||"style"===this.hasFeedback,t="both"===this.hasFeedback||"text"===this.hasFeedback,l=[this.hintText?`${this._controlId}Help`:"",this.invalid&&t?`${this._controlId}-invalid`:""].filter(Boolean).join(" ")||void 0;return Ue`
       <div
         class="form-control-group ${Se({disabled:this.disabled,readonly:this.readonly,"is-invalid":this.invalid&&e})}"
         @click=${this._handleClick}