@govtechsg/sgds-web-component 3.23.0-rc.5 → 3.23.0-rc.6

package/components/Radio/sgds-radio-group.js

@@ -40,7 +40,6 @@ class SgdsRadioGroup extends SgdsFormValidatorMixin(FormControlElement) {
         this._isTouched = false;
     }
     _handleValueChange() {
-        this.emit("sgds-change", { detail: { value: this.value } });
         this._updateCheckedRadio();
     }
     _handleInvalidChange() {
@@ -90,6 +89,7 @@ class SgdsRadioGroup extends SgdsFormValidatorMixin(FormControlElement) {
             return;
         }
         this.value = target.value;
+        this.emit("sgds-change", { detail: { value: this.value } });
         this._updateInputValue();
         const radios = this._radios;
         radios.forEach(radio => {
@@ -125,6 +125,7 @@ class SgdsRadioGroup extends SgdsFormValidatorMixin(FormControlElement) {
             radio.tabIndex = -1;
         });
         this.value = radios[index].value;
+        this.emit("sgds-change", { detail: { value: this.value } });
         this._updateInputValue();
         radios[index].checked = true;
         radios[index].tabIndex = 0;

package/components/Radio/sgds-radio-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"sgds-radio-group.js","sources":["../../../src/components/Radio/sgds-radio-group.ts"],"sourcesContent":["import { html, nothing, PropertyValueMap } from \"lit\";\nimport { property, query, queryAssignedElements, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { live } from \"lit/directives/live.js\";\nimport FormControlElement from \"../../base/form-control-element\";\nimport { SgdsFormValidatorMixin } from \"../../utils/validatorMixin\";\nimport { watch } from \"../../utils/watch\";\nimport radioGroupStyles from \"./radio-group.css\";\nimport SgdsRadio from \"./sgds-radio\";\nimport type { ISgdsRadioGroupChangeEventDetail } from \"./types\";\nexport type { ISgdsRadioGroupChangeEventDetail };\n\n/**\n * @summary RadioGroup group multiple radios so they function as a single form control.\n *\n * @slot default - The default slot where sgds-radio are placed.\n * @slot invalidIcon - The slot for invalid icon\n *\n * @event sgds-change - Emitted when the radio group's selected value changes.\n * @eventDetail {ISgdsRadioGroupChangeEventDetail} sgds-change\n * @event sgds-invalid - Emitted when the radio group's invalid state is set to true.\n * @event sgds-valid - Emitted when the radio group's invalid state is set to false.\n *\n */\nexport class SgdsRadioGroup extends SgdsFormValidatorMixin(FormControlElement) {\n  static styles = [...FormControlElement.styles, radioGroupStyles];\n\n  /**@internal */\n  @query(\"slot:not([name])\") defaultSlot: HTMLSlotElement;\n\n  /**@internal */\n  @state() defaultValue = \"\";\n\n  /** The selected value of the control. */\n  @property({ reflect: true }) value = \"\";\n\n  /**Feedback text for error state when validated */\n  @property({ type: String, reflect: true }) invalidFeedback = \"\";\n\n  /** Allows invalidFeedback, invalid and valid styles to be visible with the input */\n  @property({ type: Boolean, reflect: true }) hasFeedback = false;\n\n  /** Makes the input as a required field. */\n  @property({ type: Boolean, reflect: true }) required = false;\n\n  /** Disables native and sgds validation for the radio group. */\n  @property({ type: Boolean, reflect: true }) noValidate = false;\n\n  /** Automatically focuses the selected radio input in the group when it becomes checked. */\n  @property({ type: Boolean, reflect: true }) autofocus = false;\n\n  @watch(\"value\", { waitUntilFirstUpdate: true })\n  _handleValueChange() {\n    this.emit<ISgdsRadioGroupChangeEventDetail>(\"sgds-change\", { detail: { value: this.value } });\n    this._updateCheckedRadio();\n  }\n  @watch(\"invalid\", { waitUntilFirstUpdate: true })\n  _handleInvalidChange() {\n    this._radios.forEach(r => (r.invalid = this.invalid));\n  }\n\n  @state() private _isTouched = false;\n  /**\n   * radio requries a custom _mixinResetFormControl as the update of input value\n   * requires to fire a reset event manually\n   * */\n  private _mixinResetFormControl() {\n    this.value = this.input.value = this.defaultValue;\n    this._updateInputValue(\"reset\");\n    this._mixinResetValidity(this.input);\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.defaultValue = this.value;\n    this.addEventListener(\"sgds-blur\", () => {\n      this._isTouched = true;\n    });\n  }\n\n  firstUpdated(changedProperties: PropertyValueMap<this>) {\n    super.firstUpdated(changedProperties);\n    const radios = this._radios;\n    radios.forEach((item, index) => {\n      if (radios.length > 1) {\n        switch (index) {\n          case 0:\n            item.setAttribute(\"first-of-type\", \"\");\n            break;\n\n          case radios.length - 1:\n            item.setAttribute(\"last-of-type\", \"\");\n            break;\n\n          default:\n            item.setAttribute(\"nth-of-type\", \"\");\n        }\n      }\n    });\n    if (this.value) {\n      this._updateInputValue(\"change\");\n    }\n  }\n\n  @queryAssignedElements()\n  private _radios!: Array<SgdsRadio>;\n\n  private _handleRadioClick(event: MouseEvent) {\n    event.preventDefault();\n    const target = event.target as SgdsRadio;\n\n    if (target.disabled) {\n      return;\n    }\n\n    this.value = target.value;\n\n    this._updateInputValue();\n\n    const radios = this._radios;\n\n    radios.forEach(radio => {\n      return (radio.checked = radio === target);\n    });\n  }\n  /**\n   * when input value is set programatically, need to manually dispatch a change event\n   * In order to prevent race conditions and ensure sequence of events, set input's value here instead of binding to value prop of input\n   */\n  private _updateInputValue(eventName = \"change\") {\n    this.input.value = this.value;\n    this.input.dispatchEvent(new InputEvent(eventName));\n  }\n\n  private _handleKeyDown(event: KeyboardEvent) {\n    if (![\"ArrowUp\", \"ArrowDown\", \"ArrowLeft\", \"ArrowRight\", \" \"].includes(event.key)) {\n      return;\n    }\n\n    const radios = this._radios.filter(radio => !radio.disabled);\n    const checkedRadio = radios.find(radio => radio.checked) ?? radios[0];\n    //if eventkey is space, index increment is 0, if eventkey arrowup/arrowleft, index is -1, arrowright/arrowdown, index incr is 1\n    const incr = event.key === \" \" ? 0 : [\"ArrowUp\", \"ArrowLeft\"].includes(event.key) ? -1 : 1;\n    let index = radios.indexOf(checkedRadio) + incr;\n    if (index < 0) {\n      index = radios.length - 1;\n    }\n    if (index > radios.length - 1) {\n      index = 0;\n    }\n\n    this._radios.forEach(radio => {\n      radio.checked = false;\n      radio.tabIndex = -1;\n    });\n\n    this.value = radios[index].value;\n    this._updateInputValue();\n    radios[index].checked = true;\n    radios[index].tabIndex = 0;\n    // preventDefault at the end to allow Tab\n    event.preventDefault();\n  }\n\n  private _handleSlotChange() {\n    const radios = this._radios;\n\n    radios.forEach(radio => {\n      radio.autofocus = this.autofocus;\n      radio.checked = radio.value === this.value;\n\n      return radio;\n    });\n    this._disabledChildRadios();\n    if (!radios.some(radio => radio.checked)) {\n      if (radios[0]) radios[0].tabIndex = 0;\n    }\n  }\n\n  private _updateCheckedRadio() {\n    const radios = this._radios;\n    radios.forEach(radio => (radio.checked = radio.value === this.value));\n  }\n\n  protected _renderHintText() {\n    const hintTextTemplate = html` <div id=\"${this._controlId}Help\" class=\"form-text\">${this.hintText}</div> `;\n    return this.hintText && hintTextTemplate;\n  }\n  /**\n   * Checks for validity. Under the hood, HTMLFormElement's reportValidity method calls this method to check for component's validity state\n   * Note that the native error popup is prevented for SGDS form components by default. Instead the validation message shows up in the feedback container of SgdsInput\n   */\n  public reportValidity(): boolean {\n    return this._mixinReportValidity();\n  }\n  /**\n   * Checks for validity without any native error popup message\n   */\n  public checkValidity(): boolean {\n    return this._mixinCheckValidity();\n  }\n\n  /**\n   * Returns the ValidityState object\n   */\n  public get validity(): ValidityState {\n    return this._mixinGetValidity();\n  }\n  /**\n   * Returns the validation message based on the ValidityState\n   */\n  public get validationMessage() {\n    return this._mixinGetValidationMessage();\n  }\n\n  @watch(\"_isTouched\", { waitUntilFirstUpdate: true })\n  _handleIsTouched() {\n    if (this._mixinShouldSkipSgdsValidation()) return;\n    if (this._isTouched) {\n      this.invalid = !this.input.checkValidity();\n    }\n  }\n\n  @watch(\"disabled\", { waitUntilFirstUpdate: true })\n  _handleDisabledChange() {\n    // Disabled form controls are always valid, so we need to recheck validity when the state changes\n    this.setInvalid(false);\n    this._disabledChildRadios();\n  }\n\n  private _disabledChildRadios() {\n    if (this.disabled) {\n      const radios = this._radios;\n      radios.forEach(radio => (radio.disabled = this.disabled));\n    }\n  }\n\n  render() {\n    const defaultSlot = html`\n      <slot\n        class=\"radio-container\"\n        @click=${this._handleRadioClick}\n        @keydown=${this._handleKeyDown}\n        @slotchange=${this._handleSlotChange}\n        role=\"presentation\"\n      ></slot>\n    `;\n    return html`\n      <fieldset name=${this.name}>\n        <div class=\"label-hint-container\">\n          <label\n            class=${classMap({\n              \"form-label\": true,\n              required: this.required\n            })}\n          >\n            ${this.label}\n          </label>\n          ${this._renderHintText()}\n        </div>\n        ${defaultSlot}\n        <input\n          type=\"text\"\n          class=\"radio-group-validation-input ${classMap({\n            \"is-invalid\": this.hasFeedback && this.invalid\n          })}\"\n          ?required=${this.required}\n          tabindex=\"-1\"\n          @change=${(e: Event) => super._mixinHandleChange(e)}\n          .value=${live(this.value)}\n          aria-describedby=${this.invalid && this.hasFeedback ? \"radio-group-feedback\" : `${this._controlId}Help`}\n        />\n        ${this.invalid && this.hasFeedback\n          ? html`\n              <div class=\"invalid-feedback-container\">\n                <slot name=\"invalidIcon\">\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n                    <path\n                      d=\"M17.5 10C17.5 14.1421 14.1421 17.5 10 17.5C5.85786 17.5 2.5 14.1421 2.5 10C2.5 5.85786 5.85786 2.5 10 2.5C14.1421 2.5 17.5 5.85786 17.5 10ZM10 6.25C9.49805 6.25 9.10584 6.68339 9.15578 7.18285L9.48461 10.4711C9.51109 10.7359 9.7339 10.9375 10 10.9375C10.2661 10.9375 10.4889 10.7359 10.5154 10.4711L10.8442 7.18285C10.8942 6.68339 10.5019 6.25 10 6.25ZM10.0014 11.875C9.48368 11.875 9.06394 12.2947 9.06394 12.8125C9.06394 13.3303 9.48368 13.75 10.0014 13.75C10.5192 13.75 10.9389 13.3303 10.9389 12.8125C10.9389 12.2947 10.5192 11.875 10.0014 11.875Z\"\n                      fill=\"currentColor\"\n                    />\n                  </svg>\n                </slot>\n                <div id=\"radio-group-feedback\" class=\"invalid-feedback\">\n                  ${this.invalidFeedback ? this.invalidFeedback : this.input.validationMessage}\n                </div>\n              </div>\n            `\n          : nothing}\n      </fieldset>\n    `;\n  }\n}\n\nexport default SgdsRadioGroup;\n"],"names":["radioGroupStyles"],"mappings":"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"}
+{"version":3,"file":"sgds-radio-group.js","sources":["../../../src/components/Radio/sgds-radio-group.ts"],"sourcesContent":["import { html, nothing, PropertyValueMap } from \"lit\";\nimport { property, query, queryAssignedElements, state } from \"lit/decorators.js\";\nimport { classMap } from \"lit/directives/class-map.js\";\nimport { live } from \"lit/directives/live.js\";\nimport FormControlElement from \"../../base/form-control-element\";\nimport { SgdsFormValidatorMixin } from \"../../utils/validatorMixin\";\nimport { watch } from \"../../utils/watch\";\nimport radioGroupStyles from \"./radio-group.css\";\nimport SgdsRadio from \"./sgds-radio\";\nimport type { ISgdsRadioGroupChangeEventDetail } from \"./types\";\nexport type { ISgdsRadioGroupChangeEventDetail };\n\n/**\n * @summary RadioGroup group multiple radios so they function as a single form control.\n *\n * @slot default - The default slot where sgds-radio are placed.\n * @slot invalidIcon - The slot for invalid icon\n *\n * @event sgds-change - Emitted when the radio group's selected value changes.\n * @eventDetail {ISgdsRadioGroupChangeEventDetail} sgds-change\n * @event sgds-invalid - Emitted when the radio group's invalid state is set to true.\n * @event sgds-valid - Emitted when the radio group's invalid state is set to false.\n *\n */\nexport class SgdsRadioGroup extends SgdsFormValidatorMixin(FormControlElement) {\n  static styles = [...FormControlElement.styles, radioGroupStyles];\n\n  /**@internal */\n  @query(\"slot:not([name])\") defaultSlot: HTMLSlotElement;\n\n  /**@internal */\n  @state() defaultValue = \"\";\n\n  /** The selected value of the control. */\n  @property({ reflect: true }) value = \"\";\n\n  /**Feedback text for error state when validated */\n  @property({ type: String, reflect: true }) invalidFeedback = \"\";\n\n  /** Allows invalidFeedback, invalid and valid styles to be visible with the input */\n  @property({ type: Boolean, reflect: true }) hasFeedback = false;\n\n  /** Makes the input as a required field. */\n  @property({ type: Boolean, reflect: true }) required = false;\n\n  /** Disables native and sgds validation for the radio group. */\n  @property({ type: Boolean, reflect: true }) noValidate = false;\n\n  /** Automatically focuses the selected radio input in the group when it becomes checked. */\n  @property({ type: Boolean, reflect: true }) autofocus = false;\n\n  @watch(\"value\", { waitUntilFirstUpdate: true })\n  _handleValueChange() {\n    this._updateCheckedRadio();\n  }\n  @watch(\"invalid\", { waitUntilFirstUpdate: true })\n  _handleInvalidChange() {\n    this._radios.forEach(r => (r.invalid = this.invalid));\n  }\n\n  @state() private _isTouched = false;\n  /**\n   * radio requries a custom _mixinResetFormControl as the update of input value\n   * requires to fire a reset event manually\n   * */\n  private _mixinResetFormControl() {\n    this.value = this.input.value = this.defaultValue;\n    this._updateInputValue(\"reset\");\n    this._mixinResetValidity(this.input);\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.defaultValue = this.value;\n    this.addEventListener(\"sgds-blur\", () => {\n      this._isTouched = true;\n    });\n  }\n\n  firstUpdated(changedProperties: PropertyValueMap<this>) {\n    super.firstUpdated(changedProperties);\n    const radios = this._radios;\n    radios.forEach((item, index) => {\n      if (radios.length > 1) {\n        switch (index) {\n          case 0:\n            item.setAttribute(\"first-of-type\", \"\");\n            break;\n\n          case radios.length - 1:\n            item.setAttribute(\"last-of-type\", \"\");\n            break;\n\n          default:\n            item.setAttribute(\"nth-of-type\", \"\");\n        }\n      }\n    });\n    if (this.value) {\n      this._updateInputValue(\"change\");\n    }\n  }\n\n  @queryAssignedElements()\n  private _radios!: Array<SgdsRadio>;\n\n  private _handleRadioClick(event: MouseEvent) {\n    event.preventDefault();\n    const target = event.target as SgdsRadio;\n\n    if (target.disabled) {\n      return;\n    }\n\n    this.value = target.value;\n    this.emit<ISgdsRadioGroupChangeEventDetail>(\"sgds-change\", { detail: { value: this.value } });\n\n    this._updateInputValue();\n\n    const radios = this._radios;\n\n    radios.forEach(radio => {\n      return (radio.checked = radio === target);\n    });\n  }\n  /**\n   * when input value is set programatically, need to manually dispatch a change event\n   * In order to prevent race conditions and ensure sequence of events, set input's value here instead of binding to value prop of input\n   */\n  private _updateInputValue(eventName = \"change\") {\n    this.input.value = this.value;\n    this.input.dispatchEvent(new InputEvent(eventName));\n  }\n\n  private _handleKeyDown(event: KeyboardEvent) {\n    if (![\"ArrowUp\", \"ArrowDown\", \"ArrowLeft\", \"ArrowRight\", \" \"].includes(event.key)) {\n      return;\n    }\n\n    const radios = this._radios.filter(radio => !radio.disabled);\n    const checkedRadio = radios.find(radio => radio.checked) ?? radios[0];\n    //if eventkey is space, index increment is 0, if eventkey arrowup/arrowleft, index is -1, arrowright/arrowdown, index incr is 1\n    const incr = event.key === \" \" ? 0 : [\"ArrowUp\", \"ArrowLeft\"].includes(event.key) ? -1 : 1;\n    let index = radios.indexOf(checkedRadio) + incr;\n    if (index < 0) {\n      index = radios.length - 1;\n    }\n    if (index > radios.length - 1) {\n      index = 0;\n    }\n\n    this._radios.forEach(radio => {\n      radio.checked = false;\n      radio.tabIndex = -1;\n    });\n\n    this.value = radios[index].value;\n    this.emit<ISgdsRadioGroupChangeEventDetail>(\"sgds-change\", { detail: { value: this.value } });\n    this._updateInputValue();\n    radios[index].checked = true;\n    radios[index].tabIndex = 0;\n    // preventDefault at the end to allow Tab\n    event.preventDefault();\n  }\n\n  private _handleSlotChange() {\n    const radios = this._radios;\n\n    radios.forEach(radio => {\n      radio.autofocus = this.autofocus;\n      radio.checked = radio.value === this.value;\n\n      return radio;\n    });\n    this._disabledChildRadios();\n    if (!radios.some(radio => radio.checked)) {\n      if (radios[0]) radios[0].tabIndex = 0;\n    }\n  }\n\n  private _updateCheckedRadio() {\n    const radios = this._radios;\n    radios.forEach(radio => (radio.checked = radio.value === this.value));\n  }\n\n  protected _renderHintText() {\n    const hintTextTemplate = html` <div id=\"${this._controlId}Help\" class=\"form-text\">${this.hintText}</div> `;\n    return this.hintText && hintTextTemplate;\n  }\n  /**\n   * Checks for validity. Under the hood, HTMLFormElement's reportValidity method calls this method to check for component's validity state\n   * Note that the native error popup is prevented for SGDS form components by default. Instead the validation message shows up in the feedback container of SgdsInput\n   */\n  public reportValidity(): boolean {\n    return this._mixinReportValidity();\n  }\n  /**\n   * Checks for validity without any native error popup message\n   */\n  public checkValidity(): boolean {\n    return this._mixinCheckValidity();\n  }\n\n  /**\n   * Returns the ValidityState object\n   */\n  public get validity(): ValidityState {\n    return this._mixinGetValidity();\n  }\n  /**\n   * Returns the validation message based on the ValidityState\n   */\n  public get validationMessage() {\n    return this._mixinGetValidationMessage();\n  }\n\n  @watch(\"_isTouched\", { waitUntilFirstUpdate: true })\n  _handleIsTouched() {\n    if (this._mixinShouldSkipSgdsValidation()) return;\n    if (this._isTouched) {\n      this.invalid = !this.input.checkValidity();\n    }\n  }\n\n  @watch(\"disabled\", { waitUntilFirstUpdate: true })\n  _handleDisabledChange() {\n    // Disabled form controls are always valid, so we need to recheck validity when the state changes\n    this.setInvalid(false);\n    this._disabledChildRadios();\n  }\n\n  private _disabledChildRadios() {\n    if (this.disabled) {\n      const radios = this._radios;\n      radios.forEach(radio => (radio.disabled = this.disabled));\n    }\n  }\n\n  render() {\n    const defaultSlot = html`\n      <slot\n        class=\"radio-container\"\n        @click=${this._handleRadioClick}\n        @keydown=${this._handleKeyDown}\n        @slotchange=${this._handleSlotChange}\n        role=\"presentation\"\n      ></slot>\n    `;\n    return html`\n      <fieldset name=${this.name}>\n        <div class=\"label-hint-container\">\n          <label\n            class=${classMap({\n              \"form-label\": true,\n              required: this.required\n            })}\n          >\n            ${this.label}\n          </label>\n          ${this._renderHintText()}\n        </div>\n        ${defaultSlot}\n        <input\n          type=\"text\"\n          class=\"radio-group-validation-input ${classMap({\n            \"is-invalid\": this.hasFeedback && this.invalid\n          })}\"\n          ?required=${this.required}\n          tabindex=\"-1\"\n          @change=${(e: Event) => super._mixinHandleChange(e)}\n          .value=${live(this.value)}\n          aria-describedby=${this.invalid && this.hasFeedback ? \"radio-group-feedback\" : `${this._controlId}Help`}\n        />\n        ${this.invalid && this.hasFeedback\n          ? html`\n              <div class=\"invalid-feedback-container\">\n                <slot name=\"invalidIcon\">\n                  <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\">\n                    <path\n                      d=\"M17.5 10C17.5 14.1421 14.1421 17.5 10 17.5C5.85786 17.5 2.5 14.1421 2.5 10C2.5 5.85786 5.85786 2.5 10 2.5C14.1421 2.5 17.5 5.85786 17.5 10ZM10 6.25C9.49805 6.25 9.10584 6.68339 9.15578 7.18285L9.48461 10.4711C9.51109 10.7359 9.7339 10.9375 10 10.9375C10.2661 10.9375 10.4889 10.7359 10.5154 10.4711L10.8442 7.18285C10.8942 6.68339 10.5019 6.25 10 6.25ZM10.0014 11.875C9.48368 11.875 9.06394 12.2947 9.06394 12.8125C9.06394 13.3303 9.48368 13.75 10.0014 13.75C10.5192 13.75 10.9389 13.3303 10.9389 12.8125C10.9389 12.2947 10.5192 11.875 10.0014 11.875Z\"\n                      fill=\"currentColor\"\n                    />\n                  </svg>\n                </slot>\n                <div id=\"radio-group-feedback\" class=\"invalid-feedback\">\n                  ${this.invalidFeedback ? this.invalidFeedback : this.input.validationMessage}\n                </div>\n              </div>\n            `\n          : nothing}\n      </fieldset>\n    `;\n  }\n}\n\nexport default SgdsRadioGroup;\n"],"names":["radioGroupStyles"],"mappings":"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"}

package/components/index.umd.min.js

@@ -2515,7 +2515,7 @@ class extends We{constructor(e){if(super(e),e.type!==qe&&e.type!==Ne&&e.type!==Y
               </div>
             </div>
           `:ae}
-    `}}Aa.styles=[...ka.styles,$a,Ma],Aa.dependencies={"sgds-icon":Lt},t([De({type:String,reflect:!0})],Aa.prototype,"value",void 0),t([De({type:Boolean,reflect:!0})],Aa.prototype,"checked",void 0),t([De({type:String,reflect:!0})],Aa.prototype,"hasFeedback",void 0),t([_a("checked")],Aa.prototype,"defaultChecked",void 0),t([De({type:Boolean,reflect:!0})],Aa.prototype,"indeterminate",void 0),t([De({type:Boolean,reflect:!0})],Aa.prototype,"required",void 0),t([De({type:Boolean,reflect:!0})],Aa.prototype,"noValidate",void 0),t([De({type:String,reflect:!0})],Aa.prototype,"invalidFeedback",void 0),t([Ee()],Aa.prototype,"_isTouched",void 0),t([nt("disabled",{waitUntilFirstUpdate:!0})],Aa.prototype,"_handleDisabledChange",null),t([nt("_isTouched",{waitUntilFirstUpdate:!0})],Aa.prototype,"_handleIsTouched",null);var Va=r`:host{--sgds-checkbox-group-gap:var(--sgds-spacer-2)}fieldset{border:0;gap:var(--sgds-form-gap-md);margin:0;min-width:0;padding:0}.label-hint-container,fieldset{display:flex;flex-direction:column}.label-hint-container{gap:var(--sgds-form-gap-sm)}.label-hint-container .form-label{color:var(--sgds-form-color-default);font-size:var(--sgds-font-size-label-md);font-weight:var(--sgds-font-weight-semibold)}.checkbox-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md);padding:var(--sgds-form-padding-inline-sm) 0}.checkbox-group-validation-input{display:none}:host([disabled]) .label-hint-container{cursor:not-allowed;opacity:var(--sgds-opacity-40)}`;class Da extends(Sa(ka)){constructor(){super(...arguments),this.label="",this.invalidFeedback="Please tick at least one box if you want to proceed",this.hasFeedback=!1,this.hintText="",this.required=!1,this.noValidate=!1,this.value="",this._isTouched=!1,this.defaultValue="",this._blurredCheckboxes=new Set}connectedCallback(){super.connectedCallback(),this.addEventListener("sgds-check",e=>{const{value:t}=e.detail;!this.value.includes(t)&&this._addValue(t)}),this.addEventListener("sgds-uncheck",e=>{const{value:t}=e.detail;this._removeValue(t)}),this.addEventListener("sgds-blur",e=>{const t=e.target;this._blurredCheckboxes.add(t),Array.from(this._blurredCheckboxes).length===this._checkboxes.length&&(this._isTouched=!0,this._blurredCheckboxes.clear())})}firstUpdated(e){super.firstUpdated(e),this.value&&this._updateInputValue(),this.invalid&&this._updateInvalid()}_renderHintText(){const e=te` <div class="form-text" id="${this._controlId}Help">${this.hintText}</div> `;return this.hintText&&e}_addValue(e){const t=this.value?this.value.split(";"):[];t.push(e),this.value=t.join(";")}_removeValue(e){const t=(this.value?this.value.split(";"):[]).filter(t=>t!==e);this.value=t.join(";")}_sanitizeSlot(){this._checkboxes.forEach(e=>{e.checked=e.defaultChecked=this.value.includes(e.value),e.hasFeedback=this.hasFeedback?"style":null,e.required&&(console.error("Checkboxes in a group cannot have required or hasFeedback prop set to true"),e.remove())}),this._disabledChildCheckboxes()}_disabledChildCheckboxes(){if(this.disabled){this._checkboxes.forEach(e=>e.disabled=this.disabled)}}_handleValueChange(){if("reset"===this.formEvent&&this.value===this.defaultValue)return void(this.formEvent=null);this.emit("sgds-change");this._checkboxes.forEach(e=>{e.checked=this.value.includes(e.value)}),this._updateInputValue(),this._updateInvalid()}_handleIsTouched(){this._mixinShouldSkipSgdsValidation()||this._isTouched&&(this.invalid=!this.input.checkValidity(),this._updateInvalid())}_updateInvalid(){this._checkboxes.forEach(e=>e.invalid=this.invalid)}reportValidity(){return this._mixinReportValidity()}checkValidity(){return this._mixinCheckValidity()}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}_mixinResetFormControl(){this.value=this.input.value=this.defaultValue,this._updateInputValue("reset"),this._mixinResetValidity(this.input)}async _updateInputValue(e="change"){this.input.value=this.value,this.input.dispatchEvent(new InputEvent(e)),this.formEvent=e}render(){return te`
+    `}}Aa.styles=[...ka.styles,$a,Ma],Aa.dependencies={"sgds-icon":Lt},t([De({type:String,reflect:!0})],Aa.prototype,"value",void 0),t([De({type:Boolean,reflect:!0})],Aa.prototype,"checked",void 0),t([De({type:String,reflect:!0})],Aa.prototype,"hasFeedback",void 0),t([_a("checked")],Aa.prototype,"defaultChecked",void 0),t([De({type:Boolean,reflect:!0})],Aa.prototype,"indeterminate",void 0),t([De({type:Boolean,reflect:!0})],Aa.prototype,"required",void 0),t([De({type:Boolean,reflect:!0})],Aa.prototype,"noValidate",void 0),t([De({type:String,reflect:!0})],Aa.prototype,"invalidFeedback",void 0),t([Ee()],Aa.prototype,"_isTouched",void 0),t([nt("disabled",{waitUntilFirstUpdate:!0})],Aa.prototype,"_handleDisabledChange",null),t([nt("_isTouched",{waitUntilFirstUpdate:!0})],Aa.prototype,"_handleIsTouched",null);var Va=r`:host{--sgds-checkbox-group-gap:var(--sgds-spacer-2)}fieldset{border:0;gap:var(--sgds-form-gap-md);margin:0;min-width:0;padding:0}.label-hint-container,fieldset{display:flex;flex-direction:column}.label-hint-container{gap:var(--sgds-form-gap-sm)}.label-hint-container .form-label{color:var(--sgds-form-color-default);font-size:var(--sgds-font-size-label-md);font-weight:var(--sgds-font-weight-semibold)}.checkbox-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md);padding:var(--sgds-form-padding-inline-sm) 0}.checkbox-group-validation-input{display:none}:host([disabled]) .label-hint-container{cursor:not-allowed;opacity:var(--sgds-opacity-40)}`;class Da extends(Sa(ka)){constructor(){super(...arguments),this.label="",this.invalidFeedback="Please tick at least one box if you want to proceed",this.hasFeedback=!1,this.hintText="",this.required=!1,this.noValidate=!1,this.value="",this._isTouched=!1,this.defaultValue="",this._blurredCheckboxes=new Set}connectedCallback(){super.connectedCallback(),this.addEventListener("sgds-check",e=>{const{value:t}=e.detail;!this.value.includes(t)&&this._addValue(t)}),this.addEventListener("sgds-uncheck",e=>{const{value:t}=e.detail;this._removeValue(t)}),this.addEventListener("sgds-blur",e=>{const t=e.target;this._blurredCheckboxes.add(t),Array.from(this._blurredCheckboxes).length===this._checkboxes.length&&(this._isTouched=!0,this._blurredCheckboxes.clear())})}firstUpdated(e){super.firstUpdated(e),this.value&&this._updateInputValue(),this.invalid&&this._updateInvalid()}_renderHintText(){const e=te` <div class="form-text" id="${this._controlId}Help">${this.hintText}</div> `;return this.hintText&&e}_addValue(e){const t=this.value?this.value.split(";"):[];t.push(e),this.value=t.join(";"),this._updateInputValue(),this.emit("sgds-change",{detail:{value:this.value}})}_removeValue(e){const t=(this.value?this.value.split(";"):[]).filter(t=>t!==e);this.value=t.join(";"),this._updateInputValue(),this.emit("sgds-change",{detail:{value:this.value}})}_sanitizeSlot(){this._checkboxes.forEach(e=>{e.checked=e.defaultChecked=this.value.includes(e.value),e.hasFeedback=this.hasFeedback?"style":null,e.required&&(console.error("Checkboxes in a group cannot have required or hasFeedback prop set to true"),e.remove())}),this._disabledChildCheckboxes()}_disabledChildCheckboxes(){if(this.disabled){this._checkboxes.forEach(e=>e.disabled=this.disabled)}}_handleValueChange(){this._checkboxes.forEach(e=>{e.checked=this.value.includes(e.value)}),this._updateInputValue(),this._updateInvalid()}_handleIsTouched(){this._mixinShouldSkipSgdsValidation()||this._isTouched&&(this.invalid=!this.input.checkValidity(),this._updateInvalid())}_updateInvalid(){this._checkboxes.forEach(e=>e.invalid=this.invalid)}reportValidity(){return this._mixinReportValidity()}checkValidity(){return this._mixinCheckValidity()}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}_mixinResetFormControl(){this.value=this.input.value=this.defaultValue,this._updateInputValue("reset"),this._mixinResetValidity(this.input)}async _updateInputValue(e="change"){this.input.value=this.value,this.input.dispatchEvent(new InputEvent(e))}render(){return te`
       <fieldset>
         <div class="label-hint-container">
           <label class="form-label">${this.label}</label>
@@ -2544,7 +2544,7 @@ class extends We{constructor(e){if(super(e),e.type!==qe&&e.type!==Ne&&e.type!==Y
               </div>
             `:ae}
       </fieldset>
-    `}}Da.styles=[...ka.styles,Va],Da.dependencies={"sgds-icon":Lt},t([De({reflect:!0})],Da.prototype,"label",void 0),t([De({type:String,reflect:!0})],Da.prototype,"invalidFeedback",void 0),t([De({type:Boolean,reflect:!0})],Da.prototype,"hasFeedback",void 0),t([De({reflect:!0})],Da.prototype,"hintText",void 0),t([De({type:Boolean,reflect:!0})],Da.prototype,"required",void 0),t([De({type:Boolean,reflect:!0})],Da.prototype,"noValidate",void 0),t([De({reflect:!0})],Da.prototype,"value",void 0),t([Ee()],Da.prototype,"_isTouched",void 0),t([_a()],Da.prototype,"defaultValue",void 0),t([Ee()],Da.prototype,"_blurredCheckboxes",void 0),t([Ee()],Da.prototype,"formEvent",void 0),t([Te()],Da.prototype,"_checkboxes",void 0),t([nt("value",{waitUntilFirstUpdate:!0})],Da.prototype,"_handleValueChange",null),t([nt("_isTouched",{waitUntilFirstUpdate:!0})],Da.prototype,"_handleIsTouched",null),t([nt("invalid",{waitUntilFirstUpdate:!0})],Da.prototype,"_updateInvalid",null);var Ea=r`.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)}`,Ia=r`.empty-menu,.loading-menu{padding:var(--sgds-padding-sm) var(--sgds-padding-lg,20px);pointer-events:none}.loading-menu{align-items:center;display:flex;gap:var(--sgds-gap-xs)}`;class Ba extends(Sa(Ui)){setInvalid(e){this.invalid=e,e?this.emit("sgds-invalid"):this.emit("sgds-valid")}constructor(){super(),this.label="",this.hintText="",this.autofocus=!1,this.disabled=!1,this.required=!1,this.loading=!1,this.value="",this.displayValue="",this.defaultValue="",this.hasFeedback=!1,this.invalidFeedback="",this.invalid=!1,this.autocomplete="on",this.menuList=[],this.selectedItems=[],this.filteredList=[],this._isTouched=!1,this._controlId=Oi("input"),this._labelId=Oi("label"),this.floatingOpts={middleware:[Zi({apply({rects:e,elements:t}){t.floating.style.width=`${e.reference.width}px`}})]}}connectedCallback(){super.connectedCallback(),this.addEventListener("blur",async e=>{var t;if(this._mixinShouldSkipSgdsValidation())return;const s=this.constructor.childName,i=(null===(t=e.relatedTarget)||void 0===t?void 0:t.tagName.toLowerCase())===s;this.invalid=!i&&!this._mixinReportValidity()})}reportValidity(){return this._mixinReportValidity()}setValidity(e,t,s){return this._mixinSetValidity(e,t,s)}checkValidity(){return this._mixinCheckValidity()}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}_renderFeedback(){return this.invalid&&this.hasFeedback?te` <div class="invalid-feedback-container">
+    `}}Da.styles=[...ka.styles,Va],Da.dependencies={"sgds-icon":Lt},t([De({reflect:!0})],Da.prototype,"label",void 0),t([De({type:String,reflect:!0})],Da.prototype,"invalidFeedback",void 0),t([De({type:Boolean,reflect:!0})],Da.prototype,"hasFeedback",void 0),t([De({reflect:!0})],Da.prototype,"hintText",void 0),t([De({type:Boolean,reflect:!0})],Da.prototype,"required",void 0),t([De({type:Boolean,reflect:!0})],Da.prototype,"noValidate",void 0),t([De({reflect:!0})],Da.prototype,"value",void 0),t([Ee()],Da.prototype,"_isTouched",void 0),t([_a()],Da.prototype,"defaultValue",void 0),t([Ee()],Da.prototype,"_blurredCheckboxes",void 0),t([Te()],Da.prototype,"_checkboxes",void 0),t([nt("value",{waitUntilFirstUpdate:!0})],Da.prototype,"_handleValueChange",null),t([nt("_isTouched",{waitUntilFirstUpdate:!0})],Da.prototype,"_handleIsTouched",null),t([nt("invalid",{waitUntilFirstUpdate:!0})],Da.prototype,"_updateInvalid",null);var Ea=r`.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)}`,Ia=r`.empty-menu,.loading-menu{padding:var(--sgds-padding-sm) var(--sgds-padding-lg,20px);pointer-events:none}.loading-menu{align-items:center;display:flex;gap:var(--sgds-gap-xs)}`;class Ba extends(Sa(Ui)){setInvalid(e){this.invalid=e,e?this.emit("sgds-invalid"):this.emit("sgds-valid")}constructor(){super(),this.label="",this.hintText="",this.autofocus=!1,this.disabled=!1,this.required=!1,this.loading=!1,this.value="",this.displayValue="",this.defaultValue="",this.hasFeedback=!1,this.invalidFeedback="",this.invalid=!1,this.autocomplete="on",this.menuList=[],this.selectedItems=[],this.filteredList=[],this._isTouched=!1,this._controlId=Oi("input"),this._labelId=Oi("label"),this.floatingOpts={middleware:[Zi({apply({rects:e,elements:t}){t.floating.style.width=`${e.reference.width}px`}})]}}connectedCallback(){super.connectedCallback(),this.addEventListener("blur",async e=>{var t;if(this._mixinShouldSkipSgdsValidation())return;const s=this.constructor.childName,i=(null===(t=e.relatedTarget)||void 0===t?void 0:t.tagName.toLowerCase())===s;this.invalid=!i&&!this._mixinReportValidity()})}reportValidity(){return this._mixinReportValidity()}setValidity(e,t,s){return this._mixinSetValidity(e,t,s)}checkValidity(){return this._mixinCheckValidity()}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}_renderFeedback(){return this.invalid&&this.hasFeedback?te` <div class="invalid-feedback-container">
           <slot name="invalidIcon">
             <sgds-icon name="exclamation-circle-fill" size="md"></sgds-icon>
           </slot>
@@ -2594,7 +2594,7 @@ const Pa=(e,t,s)=>{const i=new Map;for(let a=t;a<=s;a++)i.set(e[a],a);return i};
     `}}Ra.styles=[...He.styles,da,za],t([De({type:String,reflect:!0})],Ra.prototype,"variant",void 0),t([De({type:String,reflect:!0})],Ra.prototype,"tone",void 0),t([De({type:String,reflect:!0})],Ra.prototype,"size",void 0),t([De({reflect:!0,type:String})],Ra.prototype,"label",void 0),t([De({type:String,reflect:!0})],Ra.prototype,"orientation",void 0);class Oa extends Ba{constructor(){super(...arguments),this.multiSelect=!1,this.badgeFullWidth=!1,this.clearable=!1,this.noValidate=!1,this.async=!1,this.emptyMenuAsync=!1,this.scrollBottomOffset=0,this.filterFunction=(e,t)=>t.label.toLowerCase().startsWith(e.toLowerCase()),this.optionList=[],this.emptyMenuAfterFiltering=!1,this.isFocused=!1,this.isScrollEnd=!1,this.suffixIconTemplate=te`<sgds-icon
     name=${this.menuIsOpen?"chevron-up":"chevron-down"}
     size="md"
-  ></sgds-icon>`,this.prefixIconTemplate=te`${ae}`}connectedCallback(){super.connectedCallback(),this.addEventListener("focus",async()=>{this.isFocused=!0}),this.addEventListener("blur",async()=>{this.isFocused=!1}),this.addEventListener("keydown",e=>{var t,s;"Enter"===e.key&&(null===(s=null===(t=e.target.shadowRoot)||void 0===t?void 0:t.querySelector(".form-clearable"))||void 0===s?void 0:s.matches(":focus"))&&this._handleClear()}),this.addEventListener("sgds-hide",async e=>{if(!e.detail.isOutside){(await this._input).focus()}this.options.forEach(e=>e.removeAttribute("hidden")),this.emptyMenuAfterFiltering=!1})}async firstUpdated(e){super.firstUpdated(e),this.async&&(this.filterFunction=()=>!0),this.menuList.forEach(e=>{const t=document.createElement("sgds-combo-box-option");t.innerText=e.label,t.value=e.value,t.checkbox=this.multiSelect,t.active=this.value.includes(e.value),this.appendChild(t)}),this._setupValidation(this.menuList),this.menuIsOpen&&await this.updateFloatingPosition()}async _handleDefaultSlotChange(e){const t=e.target.assignedElements({flatten:!0});t.forEach(e=>!e.hasAttribute("disabled")&&(!e.clickEventAdded&&(e.addEventListener("click",e=>{e.preventDefault();const t=e.target;return this.multiSelect&&t.active?this._handleItemUnselect(e):this._handleItemSelected(e),!1}),e.clickEventAdded=!0,void e.addEventListener("keydown",e=>{if("Enter"===e.key){this.close="outside";e.target.click()}})))),await this.updateComplete,this.optionList=await this._getMenuListFromOptions(t),this._setupValidation(this.optionList)}async _setupValidation(e){var t;if(this.value&&e.length>0){const s=this.value.split(";"),i=e.filter(({value:e})=>s.includes(e));this.selectedItems=[...i,...this.selectedItems],this.multiSelect||(this.displayValue=null===(t=i[0])||void 0===t?void 0:t.label)}this.multiSelect?this.input=await this._multiSelectInput:this.input=await this._input,this._mixinValidate(this.input)}async _handleValueChange(){this.emit("sgds-change"),this.options.forEach(e=>e.removeAttribute("hidden")),this.value&&this.emit("sgds-select");const e=await this._input;this._mixinSetFormValue(),this.multiSelect?this._mixinValidate(this.input):this._mixinValidate(e);this.selectedItems.map(e=>e.value).join(";")!==this.value&&this._updateValueAndDisplayValue(this.optionList),(this._isTouched||""!==this.value)&&(this._mixinShouldSkipSgdsValidation()||(this.invalid=!this._mixinReportValidity()))}_handleOptionListChange(){this._updateValueAndDisplayValue(this.optionList)}_handleMenuListChange(){const e=this.menuList.map(e=>{const t=document.createElement("sgds-combo-box-option");return t.innerText=e.label,t.value=e.value,t.checkbox=this.multiSelect,t.active=this.value.includes(e.value),t});this.replaceChildren(...e)}_updateValueAndDisplayValue(e){var t;const s=this.value.split(";"),i=e.filter(({value:e})=>s.includes(e));this.selectedItems=[...i];const a=i.map(e=>e.value).join(";");a!==this.value&&(this.value=a),this.multiSelect||this.async||(this.displayValue=(null===(t=i[0])||void 0===t?void 0:t.label)||""),this.options.forEach(e=>e.active=s.includes(e.value))}async _handleInputChange(e){const t=e.target;this.displayValue=t.value,this.emit("sgds-input",{detail:{displayValue:this.displayValue}}),this.invalid=!1,this.showMenu(),""!==this.displayValue||this.multiSelect||(this.selectedItems=[],this.value=this.selectedItems.join(";"),this.options.forEach(e=>e.active=!1));const s=this.options.map(e=>({value:e.value,label:e.textContent.trim()}));this.filteredList=s.filter(e=>this.filterFunction(this.displayValue,e)),this.emptyMenuAfterFiltering=0===this.filteredList.length;const i=this.filteredList.map(e=>e.value);this.options.forEach(e=>{i.includes(e.value)?e.hidden=!1:e.hidden=!0})}async _handleItemSelected(e){var t,s,i;const a=e.target;if(a.disabled)return;const o=null!==(s=null===(t=a.textContent)||void 0===t?void 0:t.trim())&&void 0!==s?s:"",n=null!==(i=a.getAttribute("value"))&&void 0!==i?i:o,r=this.filteredList.find(e=>e.value.toString()===n)||{label:o,value:n};this.multiSelect?(this.selectedItems.some(e=>e.value===r.value)||(this.selectedItems=[...this.selectedItems,r]),this.value=this.selectedItems.map(e=>e.value).join(";"),a.active=!0):0!==this.selectedItems.length&&this.selectedItems[0].value===r.value||(this.options.forEach(e=>e.active=!1),a.active=!0,this.selectedItems=[r],this.value=r.value.toString(),this.displayValue=r.label,this.hideMenu())}_handleItemUnselect(e){var t,s,i;const a=e.target;if(a.disabled)return;a.removeAttribute("active");const o=null!==(s=null===(t=a.textContent)||void 0===t?void 0:t.trim())&&void 0!==s?s:"",n=null!==(i=a.getAttribute("value"))&&void 0!==i?i:o,r=this.filteredList.find(e=>e.value.toString()===n)||{label:o,value:n};this.selectedItems=this.selectedItems.filter(e=>e.value!==r.value),this.value=this.selectedItems.map(e=>e.value).join(";")}async _handleBadgeDismissed(e,t){var s;e.preventDefault();const i=t.value;null===(s=this.options)||void 0===s||s.forEach(e=>e.value===i?e.active=!1:null),this.selectedItems=this.selectedItems.filter(e=>e.value!==t.value),this.value=this.selectedItems.map(e=>e.value).join(";")}async _handleMultiSelectKeyDown(e){var t;if(this.multiSelect&&"Backspace"===e.key&&this.multiSelect&&""===this.displayValue.trim()&&this.selectedItems.length>0){const e=this.selectedItems[this.selectedItems.length-1].value;null===(t=this.options)||void 0===t||t.forEach(t=>t.value===e?t.active=!1:null),this.selectedItems=this.selectedItems.slice(0,-1),this.value=this.selectedItems.map(e=>e.value).join(";")}}_handleFocus(){this.emit("sgds-focus")}async _handleInputBlur(e){if(e.preventDefault(),this.emit("sgds-blur"),this.multiSelect){this.selectedItems.filter(({label:e})=>this.displayValue===e).length<=0&&(this.displayValue="")}else this.selectedItems.length>0?this.displayValue=this.selectedItems[0].label:this.displayValue=""}async _handleClear(){var e;this.value=this.displayValue="",null===(e=this.options)||void 0===e||e.forEach(e=>e.active=!1);(await this._input).focus(),this.showMenu()}async _mixinResetFormControl(){if(this.value=this.defaultValue,this.multiSelect){const e=this.value.split(";");this.options.forEach(t=>{t.active=e.includes(t.value)});const t=this.options.filter(t=>e.includes(t.value));this.selectedItems=t.map(e=>({value:e.value,label:e.textContent.trim()})),this._mixinResetValidity(await this._multiSelectInput)}else{this.options.forEach(e=>{e.active=e.value===this.value});const e=this.options.filter(e=>e.value===this.value);e.length<=0?this.displayValue="":this.displayValue=e[0].textContent.trim(),this._mixinResetValidity(await this._input)}}async _handleScroll(e){const t=e.target;if(t){const e=t.scrollHeight-t.clientHeight,s=Math.max(0,this.scrollBottomOffset);t.scrollTop>=e-s?(this.isScrollEnd||this.emit("sgds-scroll-end"),this.isScrollEnd=!0):this.isScrollEnd=!1}}_renderInput(e){const t=this.hasFeedback,s=e;return te`
+  ></sgds-icon>`,this.prefixIconTemplate=te`${ae}`}connectedCallback(){super.connectedCallback(),this.addEventListener("focus",async()=>{this.isFocused=!0}),this.addEventListener("blur",async()=>{this.isFocused=!1}),this.addEventListener("keydown",e=>{var t,s;"Enter"===e.key&&(null===(s=null===(t=e.target.shadowRoot)||void 0===t?void 0:t.querySelector(".form-clearable"))||void 0===s?void 0:s.matches(":focus"))&&this._handleClear()}),this.addEventListener("sgds-hide",async e=>{if(!e.detail.isOutside){(await this._input).focus()}this.options.forEach(e=>e.removeAttribute("hidden")),this.emptyMenuAfterFiltering=!1})}async firstUpdated(e){super.firstUpdated(e),this.async&&(this.filterFunction=()=>!0),this.menuList.forEach(e=>{const t=document.createElement("sgds-combo-box-option");t.innerText=e.label,t.value=e.value,t.checkbox=this.multiSelect,t.active=this.value.includes(e.value),this.appendChild(t)}),this._setupValidation(this.menuList),this.menuIsOpen&&await this.updateFloatingPosition()}async _handleDefaultSlotChange(e){const t=e.target.assignedElements({flatten:!0});t.forEach(e=>!e.hasAttribute("disabled")&&(!e.clickEventAdded&&(e.addEventListener("click",e=>{e.preventDefault();const t=e.target;return this.multiSelect&&t.active?this._handleItemUnselect(e):this._handleItemSelected(e),!1}),e.clickEventAdded=!0,void e.addEventListener("keydown",e=>{if("Enter"===e.key){this.close="outside";e.target.click()}})))),await this.updateComplete,this.optionList=await this._getMenuListFromOptions(t),this._setupValidation(this.optionList)}async _setupValidation(e){var t;if(this.value&&e.length>0){const s=this.value.split(";"),i=e.filter(({value:e})=>s.includes(e));this.selectedItems=[...i,...this.selectedItems],this.multiSelect||(this.displayValue=null===(t=i[0])||void 0===t?void 0:t.label)}this.multiSelect?this.input=await this._multiSelectInput:this.input=await this._input,this._mixinValidate(this.input)}async _handleValueChange(){this.options.forEach(e=>e.removeAttribute("hidden"));const e=await this._input;this._mixinSetFormValue(),this.multiSelect?this._mixinValidate(this.input):this._mixinValidate(e);this.selectedItems.map(e=>e.value).join(";")!==this.value&&this._updateValueAndDisplayValue(this.optionList),(this._isTouched||""!==this.value)&&(this._mixinShouldSkipSgdsValidation()||(this.invalid=!this._mixinReportValidity()))}_emitChangeEvents(){this._mixinSetFormValue(),this.emit("sgds-change"),this.value&&this.emit("sgds-select")}_handleOptionListChange(){this._updateValueAndDisplayValue(this.optionList)}_handleMenuListChange(){const e=this.menuList.map(e=>{const t=document.createElement("sgds-combo-box-option");return t.innerText=e.label,t.value=e.value,t.checkbox=this.multiSelect,t.active=this.value.includes(e.value),t});this.replaceChildren(...e)}_updateValueAndDisplayValue(e){var t;const s=this.value.split(";"),i=e.filter(({value:e})=>s.includes(e));this.selectedItems=[...i];const a=i.map(e=>e.value).join(";");a!==this.value&&(this.value=a),this.multiSelect||this.async||(this.displayValue=(null===(t=i[0])||void 0===t?void 0:t.label)||""),this.options.forEach(e=>e.active=s.includes(e.value))}async _handleInputChange(e){const t=e.target;this.displayValue=t.value,this.emit("sgds-input",{detail:{displayValue:this.displayValue}}),this.invalid=!1,this.showMenu(),""!==this.displayValue||this.multiSelect||(this.selectedItems=[],this.value=this.selectedItems.join(";"),this.options.forEach(e=>e.active=!1),this._emitChangeEvents());const s=this.options.map(e=>({value:e.value,label:e.textContent.trim()}));this.filteredList=s.filter(e=>this.filterFunction(this.displayValue,e)),this.emptyMenuAfterFiltering=0===this.filteredList.length;const i=this.filteredList.map(e=>e.value);this.options.forEach(e=>{i.includes(e.value)?e.hidden=!1:e.hidden=!0})}async _handleItemSelected(e){var t,s,i;const a=e.target;if(a.disabled)return;const o=null!==(s=null===(t=a.textContent)||void 0===t?void 0:t.trim())&&void 0!==s?s:"",n=null!==(i=a.getAttribute("value"))&&void 0!==i?i:o,r=this.filteredList.find(e=>e.value.toString()===n)||{label:o,value:n};this.multiSelect?(this.selectedItems.some(e=>e.value===r.value)||(this.selectedItems=[...this.selectedItems,r]),this.value=this.selectedItems.map(e=>e.value).join(";"),a.active=!0):0!==this.selectedItems.length&&this.selectedItems[0].value===r.value||(this.options.forEach(e=>e.active=!1),a.active=!0,this.selectedItems=[r],this.value=r.value.toString(),this.displayValue=r.label,this.hideMenu()),this._emitChangeEvents()}_handleItemUnselect(e){var t,s,i;const a=e.target;if(a.disabled)return;a.removeAttribute("active");const o=null!==(s=null===(t=a.textContent)||void 0===t?void 0:t.trim())&&void 0!==s?s:"",n=null!==(i=a.getAttribute("value"))&&void 0!==i?i:o,r=this.filteredList.find(e=>e.value.toString()===n)||{label:o,value:n};this.selectedItems=this.selectedItems.filter(e=>e.value!==r.value),this.value=this.selectedItems.map(e=>e.value).join(";"),this._emitChangeEvents()}async _handleBadgeDismissed(e,t){var s;e.preventDefault();const i=t.value;null===(s=this.options)||void 0===s||s.forEach(e=>e.value===i?e.active=!1:null),this.selectedItems=this.selectedItems.filter(e=>e.value!==t.value),this.value=this.selectedItems.map(e=>e.value).join(";"),this._emitChangeEvents()}async _handleMultiSelectKeyDown(e){var t;if(this.multiSelect&&"Backspace"===e.key&&this.multiSelect&&""===this.displayValue.trim()&&this.selectedItems.length>0){const e=this.selectedItems[this.selectedItems.length-1].value;null===(t=this.options)||void 0===t||t.forEach(t=>t.value===e?t.active=!1:null),this.selectedItems=this.selectedItems.slice(0,-1),this.value=this.selectedItems.map(e=>e.value).join(";"),this._emitChangeEvents()}}_handleFocus(){this.emit("sgds-focus")}async _handleInputBlur(e){if(e.preventDefault(),this.emit("sgds-blur"),this.multiSelect){this.selectedItems.filter(({label:e})=>this.displayValue===e).length<=0&&(this.displayValue="")}else this.selectedItems.length>0?this.displayValue=this.selectedItems[0].label:this.displayValue=""}async _handleClear(){var e;this.value=this.displayValue="",null===(e=this.options)||void 0===e||e.forEach(e=>e.active=!1),this._emitChangeEvents();(await this._input).focus(),this.showMenu()}async _mixinResetFormControl(){if(this.value=this.defaultValue,this.multiSelect){const e=this.value.split(";");this.options.forEach(t=>{t.active=e.includes(t.value)});const t=this.options.filter(t=>e.includes(t.value));this.selectedItems=t.map(e=>({value:e.value,label:e.textContent.trim()})),this._mixinResetValidity(await this._multiSelectInput)}else{this.options.forEach(e=>{e.active=e.value===this.value});const e=this.options.filter(e=>e.value===this.value);e.length<=0?this.displayValue="":this.displayValue=e[0].textContent.trim(),this._mixinResetValidity(await this._input)}}async _handleScroll(e){const t=e.target;if(t){const e=t.scrollHeight-t.clientHeight,s=Math.max(0,this.scrollBottomOffset);t.scrollTop>=e-s?(this.isScrollEnd||this.emit("sgds-scroll-end"),this.isScrollEnd=!0):this.isScrollEnd=!1}}_renderInput(e){const t=this.hasFeedback,s=e;return te`
       <div
         ${rs(this.myDropdown)}
         class="form-control-group ${Ke({disabled:this.disabled,readonly:this.readonly,"is-invalid":this.invalid&&t})}"
@@ -3705,7 +3705,7 @@ const Yl="important",jl=" !"+Yl;const Wl=je(class extends We{constructor(e){if(s
           <slot></slot>
         </label>
       </div>
-    `}}ed.styles=[...He.styles,$a,ya,Jl],t([De({type:Boolean,reflect:!0})],ed.prototype,"checked",void 0),t([De()],ed.prototype,"value",void 0),t([De({type:Boolean,reflect:!0})],ed.prototype,"disabled",void 0),t([De({type:Boolean,reflect:!0})],ed.prototype,"invalid",void 0),t([De({type:Boolean,reflect:!1})],ed.prototype,"autofocus",void 0),t([Ze("input")],ed.prototype,"input",void 0),t([nt("checked")],ed.prototype,"handleCheckedChange",null),t([nt("disabled",{waitUntilFirstUpdate:!0})],ed.prototype,"handleDisabledChange",null);var td=r`fieldset{border:0;gap:var(--sgds-form-gap-md);margin:0;min-width:0;padding:0}.label-hint-container,fieldset{display:flex;flex-direction:column}.label-hint-container{gap:var(--sgds-form-gap-sm)}.radio-group-validation-input{display:none}.radio-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md)}:host([disabled]) .label-hint-container{cursor:not-allowed;opacity:var(--sgds-opacity-40)}`;class sd extends(Sa(ka)){constructor(){super(...arguments),this.defaultValue="",this.value="",this.invalidFeedback="",this.hasFeedback=!1,this.required=!1,this.noValidate=!1,this.autofocus=!1,this._isTouched=!1}_handleValueChange(){this.emit("sgds-change",{detail:{value:this.value}}),this._updateCheckedRadio()}_handleInvalidChange(){this._radios.forEach(e=>e.invalid=this.invalid)}_mixinResetFormControl(){this.value=this.input.value=this.defaultValue,this._updateInputValue("reset"),this._mixinResetValidity(this.input)}connectedCallback(){super.connectedCallback(),this.defaultValue=this.value,this.addEventListener("sgds-blur",()=>{this._isTouched=!0})}firstUpdated(e){super.firstUpdated(e);const t=this._radios;t.forEach((e,s)=>{if(t.length>1)switch(s){case 0:e.setAttribute("first-of-type","");break;case t.length-1:e.setAttribute("last-of-type","");break;default:e.setAttribute("nth-of-type","")}}),this.value&&this._updateInputValue("change")}_handleRadioClick(e){e.preventDefault();const t=e.target;if(t.disabled)return;this.value=t.value,this._updateInputValue();this._radios.forEach(e=>e.checked=e===t)}_updateInputValue(e="change"){this.input.value=this.value,this.input.dispatchEvent(new InputEvent(e))}_handleKeyDown(e){var t;if(!["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"," "].includes(e.key))return;const s=this._radios.filter(e=>!e.disabled),i=null!==(t=s.find(e=>e.checked))&&void 0!==t?t:s[0],a=" "===e.key?0:["ArrowUp","ArrowLeft"].includes(e.key)?-1:1;let o=s.indexOf(i)+a;o<0&&(o=s.length-1),o>s.length-1&&(o=0),this._radios.forEach(e=>{e.checked=!1,e.tabIndex=-1}),this.value=s[o].value,this._updateInputValue(),s[o].checked=!0,s[o].tabIndex=0,e.preventDefault()}_handleSlotChange(){const e=this._radios;e.forEach(e=>(e.autofocus=this.autofocus,e.checked=e.value===this.value,e)),this._disabledChildRadios(),e.some(e=>e.checked)||e[0]&&(e[0].tabIndex=0)}_updateCheckedRadio(){this._radios.forEach(e=>e.checked=e.value===this.value)}_renderHintText(){const e=te` <div id="${this._controlId}Help" class="form-text">${this.hintText}</div> `;return this.hintText&&e}reportValidity(){return this._mixinReportValidity()}checkValidity(){return this._mixinCheckValidity()}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}_handleIsTouched(){this._mixinShouldSkipSgdsValidation()||this._isTouched&&(this.invalid=!this.input.checkValidity())}_handleDisabledChange(){this.setInvalid(!1),this._disabledChildRadios()}_disabledChildRadios(){if(this.disabled){this._radios.forEach(e=>e.disabled=this.disabled)}}render(){const e=te`
+    `}}ed.styles=[...He.styles,$a,ya,Jl],t([De({type:Boolean,reflect:!0})],ed.prototype,"checked",void 0),t([De()],ed.prototype,"value",void 0),t([De({type:Boolean,reflect:!0})],ed.prototype,"disabled",void 0),t([De({type:Boolean,reflect:!0})],ed.prototype,"invalid",void 0),t([De({type:Boolean,reflect:!1})],ed.prototype,"autofocus",void 0),t([Ze("input")],ed.prototype,"input",void 0),t([nt("checked")],ed.prototype,"handleCheckedChange",null),t([nt("disabled",{waitUntilFirstUpdate:!0})],ed.prototype,"handleDisabledChange",null);var td=r`fieldset{border:0;gap:var(--sgds-form-gap-md);margin:0;min-width:0;padding:0}.label-hint-container,fieldset{display:flex;flex-direction:column}.label-hint-container{gap:var(--sgds-form-gap-sm)}.radio-group-validation-input{display:none}.radio-container{display:flex;flex-direction:column;gap:var(--sgds-form-gap-md)}:host([disabled]) .label-hint-container{cursor:not-allowed;opacity:var(--sgds-opacity-40)}`;class sd extends(Sa(ka)){constructor(){super(...arguments),this.defaultValue="",this.value="",this.invalidFeedback="",this.hasFeedback=!1,this.required=!1,this.noValidate=!1,this.autofocus=!1,this._isTouched=!1}_handleValueChange(){this._updateCheckedRadio()}_handleInvalidChange(){this._radios.forEach(e=>e.invalid=this.invalid)}_mixinResetFormControl(){this.value=this.input.value=this.defaultValue,this._updateInputValue("reset"),this._mixinResetValidity(this.input)}connectedCallback(){super.connectedCallback(),this.defaultValue=this.value,this.addEventListener("sgds-blur",()=>{this._isTouched=!0})}firstUpdated(e){super.firstUpdated(e);const t=this._radios;t.forEach((e,s)=>{if(t.length>1)switch(s){case 0:e.setAttribute("first-of-type","");break;case t.length-1:e.setAttribute("last-of-type","");break;default:e.setAttribute("nth-of-type","")}}),this.value&&this._updateInputValue("change")}_handleRadioClick(e){e.preventDefault();const t=e.target;if(t.disabled)return;this.value=t.value,this.emit("sgds-change",{detail:{value:this.value}}),this._updateInputValue();this._radios.forEach(e=>e.checked=e===t)}_updateInputValue(e="change"){this.input.value=this.value,this.input.dispatchEvent(new InputEvent(e))}_handleKeyDown(e){var t;if(!["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"," "].includes(e.key))return;const s=this._radios.filter(e=>!e.disabled),i=null!==(t=s.find(e=>e.checked))&&void 0!==t?t:s[0],a=" "===e.key?0:["ArrowUp","ArrowLeft"].includes(e.key)?-1:1;let o=s.indexOf(i)+a;o<0&&(o=s.length-1),o>s.length-1&&(o=0),this._radios.forEach(e=>{e.checked=!1,e.tabIndex=-1}),this.value=s[o].value,this.emit("sgds-change",{detail:{value:this.value}}),this._updateInputValue(),s[o].checked=!0,s[o].tabIndex=0,e.preventDefault()}_handleSlotChange(){const e=this._radios;e.forEach(e=>(e.autofocus=this.autofocus,e.checked=e.value===this.value,e)),this._disabledChildRadios(),e.some(e=>e.checked)||e[0]&&(e[0].tabIndex=0)}_updateCheckedRadio(){this._radios.forEach(e=>e.checked=e.value===this.value)}_renderHintText(){const e=te` <div id="${this._controlId}Help" class="form-text">${this.hintText}</div> `;return this.hintText&&e}reportValidity(){return this._mixinReportValidity()}checkValidity(){return this._mixinCheckValidity()}get validity(){return this._mixinGetValidity()}get validationMessage(){return this._mixinGetValidationMessage()}_handleIsTouched(){this._mixinShouldSkipSgdsValidation()||this._isTouched&&(this.invalid=!this.input.checkValidity())}_handleDisabledChange(){this.setInvalid(!1),this._disabledChildRadios()}_disabledChildRadios(){if(this.disabled){this._radios.forEach(e=>e.disabled=this.disabled)}}render(){const e=te`
       <slot
         class="radio-container"
         @click=${this._handleRadioClick}