@govtechsg/sgds-web-component 3.5.6 → 3.5.7-rc.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (66) hide show
  1. package/Masthead/index.js +1 -1
  2. package/components/Breadcrumb/index.umd.min.js +1 -1
  3. package/components/Breadcrumb/index.umd.min.js.map +1 -1
  4. package/components/Checkbox/checkbox.js +1 -1
  5. package/components/Checkbox/index.umd.min.js +1 -1
  6. package/components/Checkbox/index.umd.min.js.map +1 -1
  7. package/components/ComboBox/index.umd.min.js +271 -258
  8. package/components/ComboBox/index.umd.min.js.map +1 -1
  9. package/components/ComboBox/sgds-combo-box-option.js +6 -0
  10. package/components/ComboBox/sgds-combo-box-option.js.map +1 -1
  11. package/components/ComboBox/sgds-combo-box.d.ts +4 -0
  12. package/components/ComboBox/sgds-combo-box.js +51 -2
  13. package/components/ComboBox/sgds-combo-box.js.map +1 -1
  14. package/components/Datepicker/index.umd.min.js +2 -2
  15. package/components/Datepicker/index.umd.min.js.map +1 -1
  16. package/components/DescriptionList/description-list.js +1 -1
  17. package/components/DescriptionList/index.umd.min.js +8 -8
  18. package/components/DescriptionList/index.umd.min.js.map +1 -1
  19. package/components/Dropdown/dropdown-menu.js +1 -1
  20. package/components/Dropdown/index.umd.min.js +1 -1
  21. package/components/Dropdown/index.umd.min.js.map +1 -1
  22. package/components/IconList/icon-list.js +1 -1
  23. package/components/IconList/index.umd.min.js +1 -1
  24. package/components/IconList/index.umd.min.js.map +1 -1
  25. package/components/Input/index.umd.min.js +1 -1
  26. package/components/Input/index.umd.min.js.map +1 -1
  27. package/components/Mainnav/index.umd.min.js +2 -2
  28. package/components/Mainnav/mainnav.js +1 -1
  29. package/components/Masthead/index.umd.min.js +1 -1
  30. package/components/Masthead/masthead.js +1 -1
  31. package/components/OverflowMenu/index.umd.min.js +1 -1
  32. package/components/OverflowMenu/index.umd.min.js.map +1 -1
  33. package/components/QuantityToggle/index.umd.min.js +1 -1
  34. package/components/QuantityToggle/index.umd.min.js.map +1 -1
  35. package/components/Select/index.umd.min.js +1 -1
  36. package/components/Select/index.umd.min.js.map +1 -1
  37. package/components/Textarea/index.umd.min.js +1 -1
  38. package/components/Textarea/index.umd.min.js.map +1 -1
  39. package/components/index.umd.min.js +25 -11
  40. package/components/index.umd.min.js.map +1 -1
  41. package/index.umd.min.js +25 -11
  42. package/index.umd.min.js.map +1 -1
  43. package/package.json +1 -1
  44. package/react/components/Checkbox/checkbox.cjs.js +1 -1
  45. package/react/components/Checkbox/checkbox.js +1 -1
  46. package/react/components/ComboBox/sgds-combo-box-option.cjs.js +6 -0
  47. package/react/components/ComboBox/sgds-combo-box-option.cjs.js.map +1 -1
  48. package/react/components/ComboBox/sgds-combo-box-option.js +6 -0
  49. package/react/components/ComboBox/sgds-combo-box-option.js.map +1 -1
  50. package/react/components/ComboBox/sgds-combo-box.cjs.js +51 -2
  51. package/react/components/ComboBox/sgds-combo-box.cjs.js.map +1 -1
  52. package/react/components/ComboBox/sgds-combo-box.js +51 -2
  53. package/react/components/ComboBox/sgds-combo-box.js.map +1 -1
  54. package/react/components/DescriptionList/description-list.cjs.js +1 -1
  55. package/react/components/DescriptionList/description-list.js +1 -1
  56. package/react/components/Dropdown/dropdown-menu.cjs.js +1 -1
  57. package/react/components/Dropdown/dropdown-menu.js +1 -1
  58. package/react/components/IconList/icon-list.cjs.js +1 -1
  59. package/react/components/IconList/icon-list.js +1 -1
  60. package/react/components/Mainnav/mainnav.cjs.js +1 -1
  61. package/react/components/Mainnav/mainnav.js +1 -1
  62. package/react/components/Masthead/masthead.cjs.js +1 -1
  63. package/react/components/Masthead/masthead.js +1 -1
  64. package/react/styles/form-text-control.cjs.js +1 -1
  65. package/react/styles/form-text-control.js +1 -1
  66. package/styles/form-text-control.js +1 -1
@@ -90,7 +90,7 @@ class extends se{constructor(t){if(super(t),t.type!==te&&t.type!==Qt&&t.type!==e
90
90
  * @license
91
91
  * Copyright 2020 Google LLC
92
92
  * SPDX-License-Identifier: BSD-3-Clause
93
- */var pe,ue=$t`.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-1);font-weight:var(--sgds-font-weight-regular)}.valid-icon{color:var(--sgds-form-success-color-default)}`,me=$t`.form-text{color:var(--sgds-form-color-subtle);font-size:var(--sgds-font-size-1);line-height:var(--sgds-line-height-20)}.form-text.disabled{opacity:var(--sgds-opacity-50)}`,fe=$t`.form-label{color:var(--sgds-form-color-default);margin-bottom:0}.form-label.disabled{opacity:var(--sgds-opacity-50)}.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}`,ge=$t`.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)}`,ve=$t`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);color:var(--sgds-body-color-default);font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-2);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-24);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:var(--sgds-icon-size-lg);margin-left:.25rem;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='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' width='24' height='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:bottom;width:var(--sgds-icon-size-lg)}::slotted(svg){vertical-align:middle}}`;class ye extends Ft{emit(t,e){const i=new CustomEvent(t,Object.assign({bubbles:!0,cancelable:!1,composed:!0,detail:{}},e));return this.dispatchEvent(i),i}static define(t,e=this,i={}){if(customElements.get(t));else try{customElements.define(t,e,i)}catch(s){customElements.define(t,class extends e{},i)}}constructor(){super(),this.ssr=Boolean(this.shadowRoot),Object.entries(this.constructor.dependencies).forEach((([t,e])=>{this.constructor.define(t,e)}))}firstUpdated(t){var e;super.firstUpdated(t),this.ssr&&(null===(e=this.shadowRoot)||void 0===e||e.querySelectorAll("slot").forEach((t=>{t.dispatchEvent(new Event("slotchange",{bubbles:!0,composed:!1,cancelable:!1}))})))}}function _e(t="",e=""){return`id-${Math.random().toString().substring(2,6)}-sgds-${t}-${e}`}ye.styles=[ve],ye.dependencies={},t([Gt({type:Boolean,reflect:!0})],ye.prototype,"ssr",void 0);class be extends ye{constructor(){super(...arguments),this.label="",this.hintText="",this.disabled=!1,this.invalid=!1,this._controlId=_e("input"),this._labelId=_e("label")}setInvalid(t){this.invalid=t,t?this.emit("sgds-invalid"):this.emit("sgds-valid")}}be.styles=[...ye.styles,ue,me,fe,ge],t([Gt({reflect:!0})],be.prototype,"label",void 0),t([Gt({reflect:!0})],be.prototype,"hintText",void 0),t([Gt({reflect:!0})],be.prototype,"name",void 0),t([Gt({type:Boolean,reflect:!0})],be.prototype,"disabled",void 0),t([Gt({type:Boolean,reflect:!0})],be.prototype,"invalid",void 0);class we{constructor(t,e){(this.host=t).addController(this),this._internals=this.host.attachInternals(),this.options=Object.assign({setInvalid:(t,e)=>{t.invalid=e},value:t=>t.value,input:t=>t.input},e)}hostConnected(){this.host.addEventListener("invalid",(t=>this.handleInvalid(t)))}hostDisconnected(){this.host.removeEventListener("invalid",(t=>this.handleInvalid(t)))}handleInvalid(t){t.preventDefault(),this.options.setInvalid(this.host,!0)}handleInput(t){const e=t.target;this.options.setInvalid(this.host,!1),this.validateInput(e)}handleChange(t){const e=t.target;this.validateInput(e),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(t,e,i){return this._internals.setValidity(t,e,i)}setFormValue(){const t=this.options.value(this.host);this._internals.setFormValue(t)}validateInput(t){if(this.options.input(this.host).disabled)return this._internals.setValidity({});const e=t.validity;if(e.valid)this._internals.setValidity({});else for(const i in e)e[i]&&(this.validationError=i.toString(),this._internals.setValidity({[this.validationError]:!0},t.validationMessage,t))}}const $e=e=>{class i extends e{constructor(){super(...arguments),this._isTouched=!1}connectedCallback(){var t;super.connectedCallback(),this._mixinShouldSkipSgdsValidation()||null!==(t=this.inputValidationController)&&void 0!==t||(this.inputValidationController=new we(this))}async firstUpdated(t){super.firstUpdated(t),this.input=this.shadowRoot.querySelector("input")||await this.sgdsInput||this.shadowRoot.querySelector("textarea")||await this.sgdsDatepickerInput,this._mixinShouldSkipSgdsValidation()||this._mixinValidate(this.input)}formResetCallback(){this._mixinResetFormControl?this._mixinResetFormControl():(this.value=this.defaultValue,this._mixinResetValidity(this.input)),this._mixinSetFormValue()}_mixinHandleChange(t){this._mixinSetFormValue(),this.inputValidationController.handleChange(t)}_mixinHandleInputChange(t){this._mixinSetFormValue(),this.inputValidationController.handleInput(t)}_mixinResetValidity(t){this.inputValidationController.resetValidity(),this.inputValidationController.updateInvalidState(),this.inputValidationController.validateInput(t),this._isTouched&&(this._isTouched=!1)}_mixinValidate(t){this.inputValidationController.validateInput(t)}_mixinSetFormValue(){this.inputValidationController.setFormValue()}_mixinCheckValidity(){return this.inputValidationController.checkValidity()}_mixinReportValidity(){return this.inputValidationController.reportValidity()}_mixinGetValidity(){return this.inputValidationController.validity}_mixinGetValidationMessage(){return this.inputValidationController.validationMessage}_mixinSetValidity(t,e,i){return this.inputValidationController.setValidity(t,e,i)}_mixinShouldSkipSgdsValidation(){const t=this.closest("form");return(null==t?void 0:t.noValidate)||this.noValidate}}return i.formAssociated=!0,t([Kt("sgds-input")],i.prototype,"sgdsInput",void 0),t([Kt("sgds-datepicker-input")],i.prototype,"sgdsDatepickerInput",void 0),i};function Se(t,e){const i=Object.assign({waitUntilFirstUpdate:!1},e);return(e,s)=>{const{update:r}=e;if(t in e){const n=t;e.update=function(t){if(t.has(n)){const e=t.get(n),r=this[n];e!==r&&(i.waitUntilFirstUpdate&&!this.hasUpdated||this[s](e,r))}r.call(this,t)}}}}var Pe,xe,Ce,ke,Te,Ve=$t`textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0;resize:vertical}textarea.form-control-group{min-height:var(--sgds-dimension-136);padding:var(--sgds-form-padding-y) var(--sgds-form-padding-x)}.textarea-resize-none{resize:none}.textarea-resize-vertical{resize:vertical}.textarea-resize-auto{height:auto;overflow-y:hidden;resize:none}.textarea-info-container{display:flex;justify-content:space-between}.word-count{margin-left:auto}`,Ee=$t`.form-control-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md)}.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;min-width:var(--sgds-dimension-256);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-size:var(--sgds-font-size-2);line-height:var(--sgds-line-height-24);outline:none;padding:0}@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-50)}.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 Ue extends($e(be)){constructor(){super(...arguments),this.value="",this.spellcheck=!1,this.rows=4,this.placeholder="Placeholder",this.invalidFeedback="",this.autofocus=!1,this.readonly=!1,this.resize="vertical",this.defaultValue="",this.hasFeedback=!1,this.required=!1,this.hintText="",this._isTouched=!1}focus(t){this.textarea.focus(t)}blur(){this.textarea.blur()}reportValidity(){return this._mixinReportValidity()}checkValidity(){return this._mixinCheckValidity()}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}select(){this.textarea.select()}_handleInvalid(t){t.preventDefault(),this.invalid=!0}_handleChange(t){this.value=this.input.value,this.emit("sgds-change"),super._mixinHandleChange(t)}_handleInputChange(t){this.value=this.input.value,this.emit("sgds-input"),super._mixinHandleInputChange(t)}_handleFocus(){this.emit("sgds-focus")}_handleBlur(){this._isTouched=!0,this.emit("sgds-blur")}_handleRowsChange(){this._setTextareaHeight()}_setTextareaHeight(){"auto"===this.resize?(this.textarea.style.height="auto",this.textarea.style.height=`${this.textarea.scrollHeight}px`):this.textarea.style.height=void 0}_handleIsTouched(){this._isTouched&&(this.invalid=!this.textarea.checkValidity())}_handleDisabledChange(){this.setInvalid(!1)}_handleValueChange(){this.updateComplete.then((()=>this._setTextareaHeight()))}_renderHintText(){const t=ce` <div id="${this._controlId}Help" class="form-text">${this.hintText}</div> `;return this.hintText&&t}_wordCount(){return ce`
93
+ */var pe,ue=$t`.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-1);font-weight:var(--sgds-font-weight-regular)}.valid-icon{color:var(--sgds-form-success-color-default)}`,me=$t`.form-text{color:var(--sgds-form-color-subtle);font-size:var(--sgds-font-size-1);line-height:var(--sgds-line-height-20)}.form-text.disabled{opacity:var(--sgds-opacity-50)}`,fe=$t`.form-label{color:var(--sgds-form-color-default);margin-bottom:0}.form-label.disabled{opacity:var(--sgds-opacity-50)}.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}`,ge=$t`.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)}`,ve=$t`:host{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:rgba(0,0,0,0);color:var(--sgds-body-color-default);font-family:var(--sgds-font-family-brand);font-size:var(--sgds-font-size-2);font-weight:var(--sgds-font-weight-regular);line-height:var(--sgds-line-height-24);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:var(--sgds-icon-size-lg);margin-left:.25rem;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='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' width='24' height='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:bottom;width:var(--sgds-icon-size-lg)}::slotted(svg){vertical-align:middle}}`;class ye extends Ft{emit(t,e){const i=new CustomEvent(t,Object.assign({bubbles:!0,cancelable:!1,composed:!0,detail:{}},e));return this.dispatchEvent(i),i}static define(t,e=this,i={}){if(customElements.get(t));else try{customElements.define(t,e,i)}catch(s){customElements.define(t,class extends e{},i)}}constructor(){super(),this.ssr=Boolean(this.shadowRoot),Object.entries(this.constructor.dependencies).forEach((([t,e])=>{this.constructor.define(t,e)}))}firstUpdated(t){var e;super.firstUpdated(t),this.ssr&&(null===(e=this.shadowRoot)||void 0===e||e.querySelectorAll("slot").forEach((t=>{t.dispatchEvent(new Event("slotchange",{bubbles:!0,composed:!1,cancelable:!1}))})))}}function _e(t="",e=""){return`id-${Math.random().toString().substring(2,6)}-sgds-${t}-${e}`}ye.styles=[ve],ye.dependencies={},t([Gt({type:Boolean,reflect:!0})],ye.prototype,"ssr",void 0);class be extends ye{constructor(){super(...arguments),this.label="",this.hintText="",this.disabled=!1,this.invalid=!1,this._controlId=_e("input"),this._labelId=_e("label")}setInvalid(t){this.invalid=t,t?this.emit("sgds-invalid"):this.emit("sgds-valid")}}be.styles=[...ye.styles,ue,me,fe,ge],t([Gt({reflect:!0})],be.prototype,"label",void 0),t([Gt({reflect:!0})],be.prototype,"hintText",void 0),t([Gt({reflect:!0})],be.prototype,"name",void 0),t([Gt({type:Boolean,reflect:!0})],be.prototype,"disabled",void 0),t([Gt({type:Boolean,reflect:!0})],be.prototype,"invalid",void 0);class we{constructor(t,e){(this.host=t).addController(this),this._internals=this.host.attachInternals(),this.options=Object.assign({setInvalid:(t,e)=>{t.invalid=e},value:t=>t.value,input:t=>t.input},e)}hostConnected(){this.host.addEventListener("invalid",(t=>this.handleInvalid(t)))}hostDisconnected(){this.host.removeEventListener("invalid",(t=>this.handleInvalid(t)))}handleInvalid(t){t.preventDefault(),this.options.setInvalid(this.host,!0)}handleInput(t){const e=t.target;this.options.setInvalid(this.host,!1),this.validateInput(e)}handleChange(t){const e=t.target;this.validateInput(e),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(t,e,i){return this._internals.setValidity(t,e,i)}setFormValue(){const t=this.options.value(this.host);this._internals.setFormValue(t)}validateInput(t){if(this.options.input(this.host).disabled)return this._internals.setValidity({});const e=t.validity;if(e.valid)this._internals.setValidity({});else for(const i in e)e[i]&&(this.validationError=i.toString(),this._internals.setValidity({[this.validationError]:!0},t.validationMessage,t))}}const $e=e=>{class i extends e{constructor(){super(...arguments),this._isTouched=!1}connectedCallback(){var t;super.connectedCallback(),this._mixinShouldSkipSgdsValidation()||null!==(t=this.inputValidationController)&&void 0!==t||(this.inputValidationController=new we(this))}async firstUpdated(t){super.firstUpdated(t),this.input=this.shadowRoot.querySelector("input")||await this.sgdsInput||this.shadowRoot.querySelector("textarea")||await this.sgdsDatepickerInput,this._mixinShouldSkipSgdsValidation()||this._mixinValidate(this.input)}formResetCallback(){this._mixinResetFormControl?this._mixinResetFormControl():(this.value=this.defaultValue,this._mixinResetValidity(this.input)),this._mixinSetFormValue()}_mixinHandleChange(t){this._mixinSetFormValue(),this.inputValidationController.handleChange(t)}_mixinHandleInputChange(t){this._mixinSetFormValue(),this.inputValidationController.handleInput(t)}_mixinResetValidity(t){this.inputValidationController.resetValidity(),this.inputValidationController.updateInvalidState(),this.inputValidationController.validateInput(t),this._isTouched&&(this._isTouched=!1)}_mixinValidate(t){this.inputValidationController.validateInput(t)}_mixinSetFormValue(){this.inputValidationController.setFormValue()}_mixinCheckValidity(){return this.inputValidationController.checkValidity()}_mixinReportValidity(){return this.inputValidationController.reportValidity()}_mixinGetValidity(){return this.inputValidationController.validity}_mixinGetValidationMessage(){return this.inputValidationController.validationMessage}_mixinSetValidity(t,e,i){return this.inputValidationController.setValidity(t,e,i)}_mixinShouldSkipSgdsValidation(){const t=this.closest("form");return(null==t?void 0:t.noValidate)||this.noValidate}}return i.formAssociated=!0,t([Kt("sgds-input")],i.prototype,"sgdsInput",void 0),t([Kt("sgds-datepicker-input")],i.prototype,"sgdsDatepickerInput",void 0),i};function Se(t,e){const i=Object.assign({waitUntilFirstUpdate:!1},e);return(e,s)=>{const{update:r}=e;if(t in e){const n=t;e.update=function(t){if(t.has(n)){const e=t.get(n),r=this[n];e!==r&&(i.waitUntilFirstUpdate&&!this.hasUpdated||this[s](e,r))}r.call(this,t)}}}}var Pe,xe,Ce,ke,Te,Ve=$t`textarea{font-family:inherit;font-size:inherit;line-height:inherit;margin:0;resize:vertical}textarea.form-control-group{min-height:var(--sgds-dimension-136);padding:var(--sgds-form-padding-y) var(--sgds-form-padding-x)}.textarea-resize-none{resize:none}.textarea-resize-vertical{resize:vertical}.textarea-resize-auto{height:auto;overflow-y:hidden;resize:none}.textarea-info-container{display:flex;justify-content:space-between}.word-count{margin-left:auto}`,Ee=$t`.form-control-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md)}.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;min-width:var(--sgds-dimension-256);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-size:var(--sgds-font-size-2);line-height:var(--sgds-line-height-24);outline:none;padding:0}.form-clearable{color:var(--sgds-neutral-color-default);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-50)}.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 Ue extends($e(be)){constructor(){super(...arguments),this.value="",this.spellcheck=!1,this.rows=4,this.placeholder="Placeholder",this.invalidFeedback="",this.autofocus=!1,this.readonly=!1,this.resize="vertical",this.defaultValue="",this.hasFeedback=!1,this.required=!1,this.hintText="",this._isTouched=!1}focus(t){this.textarea.focus(t)}blur(){this.textarea.blur()}reportValidity(){return this._mixinReportValidity()}checkValidity(){return this._mixinCheckValidity()}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}select(){this.textarea.select()}_handleInvalid(t){t.preventDefault(),this.invalid=!0}_handleChange(t){this.value=this.input.value,this.emit("sgds-change"),super._mixinHandleChange(t)}_handleInputChange(t){this.value=this.input.value,this.emit("sgds-input"),super._mixinHandleInputChange(t)}_handleFocus(){this.emit("sgds-focus")}_handleBlur(){this._isTouched=!0,this.emit("sgds-blur")}_handleRowsChange(){this._setTextareaHeight()}_setTextareaHeight(){"auto"===this.resize?(this.textarea.style.height="auto",this.textarea.style.height=`${this.textarea.scrollHeight}px`):this.textarea.style.height=void 0}_handleIsTouched(){this._isTouched&&(this.invalid=!this.textarea.checkValidity())}_handleDisabledChange(){this.setInvalid(!1)}_handleValueChange(){this.updateComplete.then((()=>this._setTextareaHeight()))}_renderHintText(){const t=ce` <div id="${this._controlId}Help" class="form-text">${this.hintText}</div> `;return this.hintText&&t}_wordCount(){return ce`
94
94
  <div
95
95
  class="form-text word-count ${re({"invalid-feedback":this.invalid&&this.hasFeedback})}"
96
96
  >