@govtechsg/sgds-web-component 3.28.1-rc.0 → 3.29.0

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

@@ -88,7 +88,7 @@ de(),de(),R(),R(),U=globalThis,W=class extends g{constructor(){super(...argument
 * Copyright 2022 Google LLC
 * SPDX-License-Identifier: BSD-3-Clause
 */
-de(),R(),Ze(),Qe()}));G();var $e=l`.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-label-sm);font-weight:var(--sgds-font-weight-regular)}.valid-icon{color:var(--sgds-form-success-color-default)}`;G();var et=l`.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)}`;G();var tt=l`.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}`;G();var nt=l`.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)}`;G();var rt=l`: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}}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.1ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}::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' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='%230e0e0e' fill-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.4M12.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-.6' clip-rule='evenodd'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='%230e0e0e' fill-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.4M12.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-.6' clip-rule='evenodd'/%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}}`;function K(e,t,n,r){var i=arguments.length,a=i<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,n):r,o;if(typeof Reflect==`object`&&typeof Reflect.decorate==`function`)a=Reflect.decorate(e,t,n,r);else for(var s=e.length-1;s>=0;s--)(o=e[s])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a}G();var q=class extends W{static{this.styles=[rt]}emit(e,t){let n=new CustomEvent(e,{bubbles:!0,cancelable:!1,composed:!0,detail:{},...t});return this.dispatchEvent(n),n}static define(e,t=this,n={}){if(!customElements.get(e)){try{customElements.define(e,t,n)}catch{customElements.define(e,class extends t{},n)}return}}static{this.dependencies={}}constructor(){super(),this.ssr=!!this.shadowRoot,Object.entries(this.constructor.dependencies).forEach(([e,t])=>{this.constructor.define(e,t)})}firstUpdated(e){super.firstUpdated(e),this.ssr&&this.shadowRoot?.querySelectorAll(`slot`).forEach(e=>{e.dispatchEvent(new Event(`slotchange`,{bubbles:!0,composed:!1,cancelable:!1}))})}};K([_({type:Boolean,reflect:!0})],q.prototype,`ssr`,void 0);function it(e=``,t=``){return`id-${Math.random().toString().substring(2,6)}-sgds-${e}-${t}`}var J=class extends q{constructor(...e){super(...e),this.label=``,this.hintText=``,this.disabled=!1,this.invalid=!1,this._controlId=it(`input`),this._labelId=it(`label`)}static{this.styles=[...q.styles,$e,et,tt,nt]}setInvalid(e){this.invalid=e,e?this.emit(`sgds-invalid`):this.emit(`sgds-valid`)}};K([_({reflect:!0})],J.prototype,`label`,void 0),K([_({reflect:!0})],J.prototype,`hintText`,void 0),K([_({reflect:!0})],J.prototype,`name`,void 0),K([_({type:Boolean,reflect:!0})],J.prototype,`disabled`,void 0),K([_({type:Boolean,reflect:!0})],J.prototype,`invalid`,void 0),G();var at=l`svg{vertical-align:middle}`;G();let ot=(e=`value`)=>(t,n)=>{let r=t.constructor,i=r.prototype.attributeChangedCallback;r.prototype.attributeChangedCallback=function(t,a,o){let s=r.getPropertyOptions(e);if(t===(typeof s.attribute==`string`?s.attribute:e).toLowerCase()){let t=s.converter||m,r=(typeof t==`function`?t:t?.fromAttribute??m.fromAttribute)(o,s.type);this[e]!==r&&(this[n]=r)}i.call(this,t,a,o)}};var st=class{constructor(e,t){(this.host=e).addController(this),this._internals=e._internals||this.host.attachInternals(),this.options={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){let t=e.target;this.options.setInvalid(this.host,!1),this.validateInput(t)}handleChange(e){let 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,n){return this._internals.setValidity(e,t,n)}setFormValue(){let e=this.options.value(this.host);this._internals.setFormValue(e)}validateInput(e){if(this.options.input(this.host).disabled)return this._internals.setValidity({});let t=e.validity;if(t.valid)this._internals.setValidity({});else for(let n in t)t[n]&&(this.validationError=n.toString(),this._internals.setValidity({[this.validationError]:!0},e.validationMessage,e))}};let ct=e=>{class t extends e{static{this.formAssociated=!0}constructor(...e){super(...e),this._isTouched=!1,this._internals=this.attachInternals()}connectedCallback(){super.connectedCallback(),this.inputValidationController??=new st(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&&=!1,!this._mixinShouldSkipSgdsValidation()&&this.inputValidationController.validateInput(e)}_mixinValidate(e){this._mixinShouldSkipSgdsValidation()||this.inputValidationController.validateInput(e)}_mixinSetFormValue(){let e=this.value;this._internals.setFormValue(e)}_mixinCheckValidity(){return this._mixinShouldSkipSgdsValidation()?!0:this.inputValidationController.checkValidity()}_mixinReportValidity(){return this._mixinShouldSkipSgdsValidation()?!0:this.inputValidationController.reportValidity()}_mixinGetValidity(){return this._internals.validity}_mixinGetValidationMessage(){return this._internals.validationMessage}_mixinSetValidity(e,t,n){if(!this._mixinShouldSkipSgdsValidation())return this.inputValidationController.setValidity(e,t,n)}_mixinShouldSkipSgdsValidation(){return this.closest(`form`)?.noValidate||this.noValidate}}return K([_e(`sgds-input`)],t.prototype,`sgdsInput`,void 0),K([_e(`sgds-datepicker-input`)],t.prototype,`sgdsDatepickerInput`,void 0),t};G();var lt=l`:host{--btn-font-weight:var(--sgds-font-weight-regular);--btn-color:var(--sgds-color-fixed-light);--btn-bg:var(--sgds-primary-surface-default);--btn-hover-bg:var(--sgds-primary-surface-emphasis);--btn-border-radius:var(--sgds-border-radius-md);--btn-opacity:var(--sgds-opacity-100,1)}:host([variant=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}:host([variant=primary][tone=brand]){--btn-bg:var(--sgds-primary-surface-default);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline]){--btn-border-width:var(--sgds-border-width-1)}:host([variant=outline][tone=brand]){--btn-border-color:var(--sgds-primary-border-color-default);--btn-bg:var(--sgds-bg-transparent);--btn-color:var(--sgds-primary-color-default);--btn-hover-bg:var(--sgds-primary-bg-translucent)}:host([variant=ghost][tone=brand]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-primary-surface-translucent);--btn-color:var(--sgds-primary-color-default)}:host([variant=primary][tone=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline][tone=danger]){--btn-border-color:var(--sgds-danger-border-color-default);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-danger-surface-translucent);--btn-color:var(--sgds-danger-color-default)}:host([variant=ghost][tone=danger]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-danger-surface-translucent);--btn-color:var(--sgds-danger-color-default)}:host([variant=primary][tone=fixed-light]){--btn-bg:var(--sgds-surface-fixed-light);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark,hsla(0,0%,5%,.2)) 0%,var(--sgds-bg-translucent-fixed-dark,hsla(0,0%,5%,.2)) 100%),var(--sgds-surface-fixed-light,#fff);--btn-color:var(--sgds-color-fixed-dark)}:host([variant=outline][tone=fixed-light]){--btn-border-color:var(--sgds-border-color-fixed-light);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark) 0%,var(--sgds-bg-translucent-fixed-dark) 100%),var(--sgds-bg-transparent);--btn-color:var(--sgds-color-fixed-light)}:host([variant=ghost][tone=fixed-light]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark) 0%,var(--sgds-bg-translucent-fixed-dark) 100%),var(--sgds-bg-transparent);--btn-color:var(--sgds-color-fixed-light)}:host([variant=primary][tone=neutral]){--btn-bg:var(--sgds-surface-inverse);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-inverse) 0%,var(--sgds-bg-translucent-inverse) 100%),var(--sgds-surface-inverse);--btn-color:var(--sgds-color-inverse)}:host([variant=outline][tone=neutral]){--btn-border-color:var(--sgds-border-color-emphasis);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-inverse) 0%,var(--sgds-bg-translucent-inverse) 100%),var(--sgds-bg-translucent-subtle);--btn-color:var(--sgds-color-default)}:host([variant=ghost][tone=neutral]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-bg-translucent-subtle);--btn-color:var(--sgds-color-default)}:host([variant=ghost]) .btn,:host([variant=outline]) .btn,:host([variant=primary]) .btn{color:var(--btn-color)}:host([variant=outline]) .btn{border:var(--btn-border-width) solid var(--btn-border-color)}:host([size=lg]) .btn{font-size:var(--sgds-font-size-label-lg);height:var(--sgds-dimension-56);line-height:var(--sgds-line-height-md);min-width:var(--sgds-dimension-112);padding:var(--sgds-padding-none) var(--sgds-padding-xl)}:host([size=sm]) .btn{font-size:var(--sgds-font-size-label-sm);height:var(--sgds-dimension-40);line-height:var(--sgds-line-height-2-xs);min-width:var(--sgds-dimension-80);padding:var(--sgds-padding-none) var(--sgds-padding-md)}:host([size=xs]) .btn{font-size:var(--sgds-font-size-label-xs);height:var(--sgds-dimension-32);line-height:var(--sgds-line-height-3-xs);min-width:var(--sgds-dimension-64);padding:var(--sgds-padding-none) var(--sgds-padding-sm)}.btn{align-items:center;background-color:var(--btn-bg);border:var(--sgds-border-width-1) solid var(--sgds-border-color-transparent);border-radius:var(--btn-border-radius);color:var(--sgds-color-fixed-light);cursor:pointer;display:inline-flex;font-size:var(--sgds-font-size-label-md);font-weight:var(--btn-font-weight);gap:var(--sgds-gap-2-xs);height:var(--sgds-dimension-48);justify-content:center;line-height:var(--sgds-line-height-xs);min-width:var(--sgds-dimension-96);opacity:var(--btn-opacity);padding:var(--sgds-padding-none) var(--sgds-padding-lg);text-align:center;text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;user-select:none;vertical-align:middle;white-space:nowrap;width:inherit}.btn.active,.btn:hover{background:var(--btn-hover-bg)}.btn:focus-visible{background:var(--btn-hover-bg);border-color:transparent;outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}.btn.disabled,.btn:disabled{color:var(--btn-color);cursor:not-allowed;opacity:var(--sgds-opacity-40)}.btn.loading{cursor:default}.btn slot::slotted(*){color:var(--btn-color)}`,Y=class extends q{constructor(...e){super(...e),this.variant=`primary`,this.tone=`brand`,this.size=`md`,this.active=!1,this.disabled=!1,this.target=`_self`}static{this.styles=[...q.styles,lt]}focus(e){this.button.focus(e)}click(){this.button.click()}blur(){this.button.blur()}_handleBlur(){this.emit(`sgds-blur`)}_handleFocus(){this.emit(`sgds-focus`)}_handleClick(e){if(this.disabled||this.loading){e.preventDefault(),e.stopPropagation();return}}_handleKeydown(e){if(e.key===`Enter`&&this.loading){e.preventDefault(),e.stopPropagation();return}}_assignSpinnerSize(e){if(e===`xs`||e===`sm`)return`xs`;if(e===`md`||e===`lg`)return`sm`}_assignSpinnerTone(e,t){return e===`fixed-light`&&t===`primary`?`fixed-dark`:e===`neutral`&&t===`primary`?`inverse`:e===`fixed-light`||t===`primary`?`fixed-light`:e===`neutral`&&(t===`outline`||t===`ghost`)?`neutral`:`brand`}};K([ge(`.btn`)],Y.prototype,`button`,void 0),K([_({reflect:!0})],Y.prototype,`variant`,void 0),K([_({reflect:!0})],Y.prototype,`tone`,void 0),K([_({reflect:!0})],Y.prototype,`size`,void 0),K([_({type:Boolean,reflect:!0})],Y.prototype,`active`,void 0),K([_({type:Boolean,reflect:!0})],Y.prototype,`disabled`,void 0),K([_({type:String,reflect:!0})],Y.prototype,`href`,void 0),K([_({type:String,reflect:!0})],Y.prototype,`target`,void 0),K([_({type:String,reflect:!0})],Y.prototype,`download`,void 0),K([_({type:String})],Y.prototype,`ariaLabel`,void 0),K([_({type:Boolean})],Y.prototype,`loading`,void 0);function ut(e){if(!e)return e;let t=e.trim().toLowerCase();if(!(t.startsWith(`javascript:`)||t.startsWith(`data:`)||t.startsWith(`vbscript:`)))return e}var dt=/* @__PURE__ */ n({default:()=>ft}),ft,pt=t((()=>{G(),ft=j`
+de(),R(),Ze(),Qe()}));G();var $e=l`.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-label-sm);font-weight:var(--sgds-font-weight-regular)}.valid-icon{color:var(--sgds-form-success-color-default)}`;G();var et=l`.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)}`;G();var tt=l`.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}`;G();var nt=l`.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)}`;G();var rt=l`: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}}@media (prefers-reduced-motion:reduce){*,:after,:before{animation-duration:.1ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}::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' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='%230e0e0e' fill-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.4M12.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-.6' clip-rule='evenodd'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Cpath fill='%230e0e0e' fill-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.4M12.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-.6' clip-rule='evenodd'/%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}}`;function K(e,t,n,r){var i=arguments.length,a=i<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,n):r,o;if(typeof Reflect==`object`&&typeof Reflect.decorate==`function`)a=Reflect.decorate(e,t,n,r);else for(var s=e.length-1;s>=0;s--)(o=e[s])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a}G();var q=class extends W{static{this.styles=[rt]}emit(e,t){let n=new CustomEvent(e,{bubbles:!0,cancelable:!1,composed:!0,detail:{},...t});return this.dispatchEvent(n),n}static define(e,t=this,n={}){if(!customElements.get(e)){try{customElements.define(e,t,n)}catch{customElements.define(e,class extends t{},n)}return}}static{this.dependencies={}}constructor(){super(),this.ssr=!!this.shadowRoot,Object.entries(this.constructor.dependencies).forEach(([e,t])=>{this.constructor.define(e,t)})}firstUpdated(e){super.firstUpdated(e),this.ssr&&this.shadowRoot?.querySelectorAll(`slot`).forEach(e=>{e.dispatchEvent(new Event(`slotchange`,{bubbles:!0,composed:!1,cancelable:!1}))})}};K([_({type:Boolean,reflect:!0})],q.prototype,`ssr`,void 0);function it(e=``,t=``){return`id-${Math.random().toString().substring(2,6)}-sgds-${e}-${t}`}var J=class extends q{constructor(...e){super(...e),this.label=``,this.hintText=``,this.disabled=!1,this.invalid=!1,this._controlId=it(`input`),this._labelId=it(`label`)}static{this.styles=[...q.styles,$e,et,tt,nt]}setInvalid(e){this.invalid=e,e?this.emit(`sgds-invalid`):this.emit(`sgds-valid`)}};K([_({reflect:!0})],J.prototype,`label`,void 0),K([_({reflect:!0})],J.prototype,`hintText`,void 0),K([_({reflect:!0})],J.prototype,`name`,void 0),K([_({type:Boolean,reflect:!0})],J.prototype,`disabled`,void 0),K([_({type:Boolean,reflect:!0})],J.prototype,`invalid`,void 0),G();var at=l`svg{vertical-align:middle}`;G();let ot=(e=`value`)=>(t,n)=>{let r=t.constructor,i=r.prototype.attributeChangedCallback;r.prototype.attributeChangedCallback=function(t,a,o){let s=r.getPropertyOptions(e);if(t===(typeof s.attribute==`string`?s.attribute:e).toLowerCase()){let t=s.converter||m,r=(typeof t==`function`?t:t?.fromAttribute??m.fromAttribute)(o,s.type);this[e]!==r&&(this[n]=r)}i.call(this,t,a,o)}};var st=class{constructor(e,t){(this.host=e).addController(this),this._internals=e._internals||this.host.attachInternals(),this.options={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){let t=e.target;this.options.setInvalid(this.host,!1),this.validateInput(t)}handleChange(e){let 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,n){return this._internals.setValidity(e,t,n)}setFormValue(){let e=this.options.value(this.host);this._internals.setFormValue(e)}validateInput(e){if(this.options.input(this.host).disabled)return this._internals.setValidity({});let t=e.validity;if(t.valid)this._internals.setValidity({});else for(let n in t)t[n]&&(this.validationError=n.toString(),this._internals.setValidity({[this.validationError]:!0},e.validationMessage,e))}};let ct=e=>{class t extends e{static{this.formAssociated=!0}constructor(...e){super(...e),this._isTouched=!1,this._internals=this.attachInternals()}connectedCallback(){super.connectedCallback(),this.inputValidationController??=new st(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&&=!1,!this._mixinShouldSkipSgdsValidation()&&this.inputValidationController.validateInput(e)}_mixinValidate(e){this._mixinShouldSkipSgdsValidation()||this.inputValidationController.validateInput(e)}_mixinSetFormValue(){let e=this.value;this._internals.setFormValue(e)}_mixinCheckValidity(){return this._mixinShouldSkipSgdsValidation()?!0:this.inputValidationController.checkValidity()}_mixinReportValidity(){return this._mixinShouldSkipSgdsValidation()?!0:this.inputValidationController.reportValidity()}_mixinGetValidity(){return this._internals.validity}_mixinGetValidationMessage(){return this._internals.validationMessage}_mixinSetValidity(e,t,n){if(!this._mixinShouldSkipSgdsValidation())return this.inputValidationController.setValidity(e,t,n)}_mixinShouldSkipSgdsValidation(){return this.closest(`form`)?.noValidate||this.noValidate}}return K([_e(`sgds-input`)],t.prototype,`sgdsInput`,void 0),K([_e(`sgds-datepicker-input`)],t.prototype,`sgdsDatepickerInput`,void 0),t};G();var lt=l`:host{--btn-font-weight:var(--sgds-font-weight-regular);--btn-color:var(--sgds-color-fixed-light);--btn-bg:var(--sgds-primary-surface-default);--btn-hover-bg:var(--sgds-primary-surface-emphasis);--btn-border-radius:var(--sgds-border-radius-md);--btn-opacity:var(--sgds-opacity-100,1)}:host([variant=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}:host([variant=primary][tone=brand]){--btn-bg:var(--sgds-primary-surface-default);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline]){--btn-border-width:var(--sgds-border-width-1)}:host([variant=outline][tone=brand]){--btn-border-color:var(--sgds-primary-border-color-default);--btn-bg:var(--sgds-bg-transparent);--btn-color:var(--sgds-primary-color-default);--btn-hover-bg:var(--sgds-primary-bg-translucent)}:host([variant=ghost][tone=brand]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-primary-surface-translucent);--btn-color:var(--sgds-primary-color-default)}:host([variant=primary][tone=danger]){--btn-bg:var(--sgds-danger-surface-default);--btn-hover-bg:var(--sgds-danger-surface-emphasis);--btn-color:var(--sgds-color-fixed-light)}:host([variant=outline][tone=danger]){--btn-border-color:var(--sgds-danger-border-color-default);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-danger-surface-translucent);--btn-color:var(--sgds-danger-color-default)}:host([variant=ghost][tone=danger]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-danger-surface-translucent);--btn-color:var(--sgds-danger-color-default)}:host([variant=primary][tone=fixed-light]){--btn-bg:var(--sgds-surface-fixed-light);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark,hsla(0,0%,5%,.2)) 0%,var(--sgds-bg-translucent-fixed-dark,hsla(0,0%,5%,.2)) 100%),var(--sgds-surface-fixed-light,#fff);--btn-color:var(--sgds-color-fixed-dark)}:host([variant=outline][tone=fixed-light]){--btn-border-color:var(--sgds-border-color-fixed-light);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark) 0%,var(--sgds-bg-translucent-fixed-dark) 100%),var(--sgds-bg-transparent);--btn-color:var(--sgds-color-fixed-light)}:host([variant=ghost][tone=fixed-light]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-fixed-dark) 0%,var(--sgds-bg-translucent-fixed-dark) 100%),var(--sgds-bg-transparent);--btn-color:var(--sgds-color-fixed-light)}:host([variant=primary][tone=neutral]){--btn-bg:var(--sgds-surface-inverse);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-inverse) 0%,var(--sgds-bg-translucent-inverse) 100%),var(--sgds-surface-inverse);--btn-color:var(--sgds-color-inverse)}:host([variant=outline][tone=neutral]){--btn-border-color:var(--sgds-border-color-emphasis);--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:linear-gradient(0deg,var(--sgds-bg-translucent-inverse) 0%,var(--sgds-bg-translucent-inverse) 100%),var(--sgds-bg-translucent-subtle);--btn-color:var(--sgds-color-default)}:host([variant=ghost][tone=neutral]){--btn-bg:var(--sgds-bg-transparent);--btn-hover-bg:var(--sgds-bg-translucent-subtle);--btn-color:var(--sgds-color-default)}:host([variant=ghost]) .btn,:host([variant=outline]) .btn,:host([variant=primary]) .btn{color:var(--btn-color)}:host([variant=outline]) .btn{border:var(--btn-border-width) solid var(--btn-border-color)}:host([size=lg]) .btn{font-size:var(--sgds-font-size-label-lg);height:var(--sgds-dimension-56);line-height:var(--sgds-line-height-md);min-width:var(--sgds-dimension-112);padding:var(--sgds-padding-none) var(--sgds-padding-xl)}:host([size=sm]) .btn{font-size:var(--sgds-font-size-label-sm);height:var(--sgds-dimension-40);line-height:var(--sgds-line-height-2-xs);min-width:var(--sgds-dimension-80);padding:var(--sgds-padding-none) var(--sgds-padding-md)}:host([size=xs]) .btn{font-size:var(--sgds-font-size-label-xs);height:var(--sgds-dimension-32);line-height:var(--sgds-line-height-3-xs);min-width:var(--sgds-dimension-64);padding:var(--sgds-padding-none) var(--sgds-padding-sm)}.btn{align-items:center;background-color:var(--btn-bg);border:var(--sgds-border-width-1) solid var(--sgds-border-color-transparent);border-radius:var(--btn-border-radius);color:var(--sgds-color-fixed-light);cursor:pointer;display:inline-flex;font-size:var(--sgds-font-size-label-md);font-weight:var(--btn-font-weight);gap:var(--sgds-gap-2-xs);height:var(--sgds-dimension-48);justify-content:center;line-height:var(--sgds-line-height-xs);min-width:var(--sgds-dimension-96);opacity:var(--btn-opacity);padding:var(--sgds-padding-none) var(--sgds-padding-lg);position:relative;text-align:center;text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;user-select:none;vertical-align:middle;white-space:nowrap;width:inherit}.btn.active,.btn:hover{background:var(--btn-hover-bg)}.btn:focus-visible{background:var(--btn-hover-bg);border-color:transparent;outline:var(--sgds-outline-focus);outline-offset:var(--sgds-outline-offset-focus)}:host(:not([disabled])) .btn:active:after{background-color:var(--sgds-bg-translucent);border-radius:inherit;content:"";inset:0;position:absolute}.btn.disabled,.btn:disabled{color:var(--btn-color);cursor:not-allowed;opacity:var(--sgds-opacity-40)}.btn.loading{cursor:default}.btn slot::slotted(*){color:var(--btn-color)}`,Y=class extends q{constructor(...e){super(...e),this.variant=`primary`,this.tone=`brand`,this.size=`md`,this.active=!1,this.disabled=!1,this.target=`_self`}static{this.styles=[...q.styles,lt]}focus(e){this.button.focus(e)}click(){this.button.click()}blur(){this.button.blur()}_handleBlur(){this.emit(`sgds-blur`)}_handleFocus(){this.emit(`sgds-focus`)}_handleClick(e){if(this.disabled||this.loading){e.preventDefault(),e.stopPropagation();return}}_handleKeydown(e){if(e.key===`Enter`&&this.loading){e.preventDefault(),e.stopPropagation();return}}_assignSpinnerSize(e){if(e===`xs`||e===`sm`)return`xs`;if(e===`md`||e===`lg`)return`sm`}_assignSpinnerTone(e,t){return e===`fixed-light`&&t===`primary`?`fixed-dark`:e===`neutral`&&t===`primary`?`inverse`:e===`fixed-light`||t===`primary`?`fixed-light`:e===`neutral`&&(t===`outline`||t===`ghost`)?`neutral`:`brand`}};K([ge(`.btn`)],Y.prototype,`button`,void 0),K([_({reflect:!0})],Y.prototype,`variant`,void 0),K([_({reflect:!0})],Y.prototype,`tone`,void 0),K([_({reflect:!0})],Y.prototype,`size`,void 0),K([_({type:Boolean,reflect:!0})],Y.prototype,`active`,void 0),K([_({type:Boolean,reflect:!0})],Y.prototype,`disabled`,void 0),K([_({type:String,reflect:!0})],Y.prototype,`href`,void 0),K([_({type:String,reflect:!0})],Y.prototype,`target`,void 0),K([_({type:String,reflect:!0})],Y.prototype,`download`,void 0),K([_({type:String})],Y.prototype,`ariaLabel`,void 0),K([_({type:Boolean})],Y.prototype,`loading`,void 0);function ut(e){if(!e)return e;let t=e.trim().toLowerCase();if(!(t.startsWith(`javascript:`)||t.startsWith(`data:`)||t.startsWith(`vbscript:`)))return e}var dt=/* @__PURE__ */ n({default:()=>ft}),ft,pt=t((()=>{G(),ft=j`
   <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" viewBox="0 0 24 24">
     <path
       fill="currentColor"
@@ -2442,6 +2442,7 @@ de(),R(),Ze(),Qe()}));G();var $e=l`.invalid-feedback-container{display:flex;gap:
     `}_renderPasswordToggle(){return H`<sgds-icon
       tabIndex="0"
       role="button"
+      aria-label=${this._showPassword?`Hide password`:`Show password`}
       name=${this._showPassword?`eye-slash-fill`:`eye-fill`}
       @click=${()=>this._showPassword=!this._showPassword}
     ></sgds-icon>`}_inputType(){return this.type===`password`&&this._showPassword?`text`:this.type}_renderFeedback(){let e=this.hasFeedback===`both`||this.hasFeedback===`text`;return this.invalid&&e?H` <div class="invalid-feedback-container">