@ukic/web-components 2.0.0-alpha.125 → 2.0.1

package/dist/components/ic-radio-option.js.map

@@ -1 +1 @@
-{"file":"ic-radio-option.js","mappings":"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","names":[],"sources":["./src/components/ic-radio-option/ic-radio-option.css?tag=ic-radio-option&encapsulation=shadow","./src/components/ic-radio-option/ic-radio-option.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n  display: block;\n  margin-bottom: var(--ic-space-sm);\n  width: fit-content;\n}\n\n:host([dense]) {\n  margin-bottom: 10px;\n}\n\n:host([additional-field-display=\"static\"]) ::slotted(ic-textfield) {\n  margin-top: var(--ic-space-xs);\n  margin-left: var(--ic-space-xl);\n}\n\n/* The label turns grey when disabled  */\n:host([inactive]) {\n  color: var(--ic-architectural-200);\n}\n\n/* Focus states */\n\n.container input:focus + span.checkmark,\n:host(:focus) .container input:checked + span.checkmark {\n  box-shadow: var(--ic-border-focus);\n  outline: none;\n}\n\n.container input:focus-visible {\n  outline: none;\n}\n\n/* The container */\n.container {\n  display: inline-flex;\n  position: relative;\n  cursor: pointer;\n  align-items: center;\n  gap: var(--ic-space-xs);\n  margin-left: 5px;\n}\n\n.container.disabled,\n.container.disabled input:disabled {\n  cursor: default;\n}\n\n/* Hide the browser's default radio button */\n.container input {\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n  display: inline-block;\n  position: absolute;\n  cursor: pointer;\n  top: 0;\n  left: 0;\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n  border-radius: 50%;\n  border: none;\n}\n\n/* Create a custom radio button */\n.checkmark {\n  display: block;\n  position: relative;\n  top: 0;\n  left: 0;\n  height: 20px;\n  width: 20px;\n  background-color: transparent;\n  border: 1px solid #a7acb3;\n  border-radius: 50%;\n  transition: var(--ic-easing-transition-fast);\n}\n\n/* Show the indicator (dot/circle) when checked */\n.container input:checked ~ .checkmark::after {\n  display: inline-block;\n}\n\n/* On mouse-over, add a light blue background color */\n.container:hover input ~ .checkmark {\n  background-color: var(--ic-action-default-bg-hover);\n  box-shadow: 0 0 0 4px var(--ic-action-default-bg-hover);\n  border: 1px solid var(--ic-action-default);\n}\n\n/* When pressed, adds the active colours */\n.container:active input ~ .checkmark {\n  background-color: var(--ic-action-default-bg-active);\n  border: 1px solid var(--ic-action-default-active);\n  box-shadow: 0 0 0 4px var(--ic-action-default-bg-active);\n}\n\n/* When pressed, adds the active colours */\n.container:active input:checked ~ .checkmark {\n  background-color: var(--ic-action-default-bg-active);\n  border: 2px solid var(--ic-action-default-active);\n  box-shadow: 0 0 0 4px var(--ic-action-default-bg-active);\n}\n\n/* When pressed and selected, adds the active colours */\n.container:active input:checked ~ .checkmark::after {\n  background-color: var(--ic-action-default-active);\n}\n\n/* When the radio button is checked */\n.container input:checked ~ .checkmark {\n  border: 2px solid var(--ic-action-default);\n  margin: -1px;\n  margin-bottom: 1px;\n}\n\n/* When the radio button is checked and disabled */\n.container input:checked:disabled ~ .checkmark {\n  background-color: transparent;\n  border: 2px solid var(--ic-architectural-200);\n}\n\n/* When the radio button is disabled */\n.container input:disabled ~ .checkmark {\n  border: 1px dashed var(--ic-architectural-200);\n}\n\n/* When the radio button is disabled */\n.container input:disabled ~ .checkmark::after {\n  background: var(--ic-architectural-200);\n}\n\n/* On mouse-over inactive */\n.container:hover input:disabled ~ .checkmark {\n  background-color: transparent;\n  box-shadow: none;\n  border: 2px solid none;\n}\n\n.container:active input:disabled ~ .checkmark::after {\n  background-color: var(--ic-architectural-200);\n}\n\n/* Style the indicator (dot/circle) */\n.container .checkmark::after {\n  content: \"\";\n  position: absolute;\n  display: none;\n  top: 2px;\n  left: 2px;\n  width: 16px;\n  height: 16px;\n  border-radius: 50%;\n  background: var(--ic-action-default);\n}\n\n.radio-label {\n  font-size: 16px;\n  font-weight: 400;\n  margin-left: var(--ic-space-sm);\n}\n\n.addition-field-wrapper {\n  margin-left: 44px;\n}\n\n/* The line */\n.branch-corner {\n  color: var(--ic-action-default);\n  height: var(--ic-space-md);\n  width: var(--ic-space-xl);\n  border-radius: 0 0 0 3px;\n  border-bottom: 2px solid var(--ic-action-default);\n  border-left: 2px solid var(--ic-action-default);\n  margin-left: -1px;\n}\n\n/* The dynamic container */\n.dynamic-container {\n  display: flex;\n  position: relative;\n  margin-left: var(--ic-space-md);\n  margin-top: 6px;\n  gap: var(--ic-space-xs);\n}\n\n.dynamic-container.hidden {\n  display: none;\n}\n\n.dynamic-text {\n  color: var(--ic-action-default);\n  margin-top: 5px;\n  margin-bottom: var(--ic-space-xs);\n  border-radius: 2%;\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  Listen,\n  Watch,\n} from \"@stencil/core\";\nimport { IcAdditionalFieldTypes } from \"../../utils/types\";\nimport {\n  getSlotContent,\n  onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcValueEventDetail } from \"../../interface\";\n@Component({\n  tag: \"ic-radio-option\",\n  styleUrl: \"ic-radio-option.css\",\n  shadow: true,\n})\nexport class RadioOption {\n  private radioElement: HTMLInputElement;\n  /**\n   * Determines whether the radio should be in selected state.\n   */\n  @Prop({ reflect: true }) selected?: boolean = false;\n  /**\n   * Determines whether the radio should be in disabled state.\n   */\n  @Prop() disabled?: boolean = false;\n  /**\n   * Provide a label for the input.\n   */\n  @Prop() label?: string;\n  /**\n   * Provide a value for the input.\n   */\n  @Prop() value!: string;\n  /**\n   * Provide a name for the input.\n   */\n  @Prop() name: string;\n  /**\n   * Provide a group label for the input.\n   */\n  @Prop() groupLabel: string;\n  /**\n   * Provide a text prop for the dynamic text.\n   */\n  @Prop() dynamicText: string = \"This selection requires additional answers\";\n\n  /** Determines type of additional text field in relation to radio option */\n\n  @Prop({ reflect: true }) additionalFieldDisplay: IcAdditionalFieldTypes =\n    \"static\";\n\n  @Element() host: HTMLIcRadioOptionElement;\n\n  /**\n   * Emitted when radio is checked\n   */\n  @Event() icCheck!: EventEmitter<void>;\n\n  /**\n   * Emitted when a radio is selected.\n   */\n  @Event() radioOptionSelect: EventEmitter<IcValueEventDetail>;\n\n  @Watch(\"selected\")\n  selectedChangeHandler(selected: boolean): void {\n    if (selected) {\n      this.handleClick();\n    }\n  }\n\n  private defaultRadioValue: string = \"\";\n\n  private handleClick = () => {\n    if (!this.disabled) {\n      this.radioElement.focus();\n\n      if (this.hasAdditionalField) {\n        const textfield = this.host.querySelector(\"ic-text-field\");\n        this.value =\n          textfield.value !== \"\" ? textfield.value : this.defaultRadioValue;\n      }\n\n      this.radioOptionSelect.emit({\n        value: this.value,\n      });\n    }\n  };\n\n  private swallowClick = (event: MouseEvent) => {\n    event.stopPropagation();\n  };\n\n  private hasAdditionalField: boolean = false;\n  componentWillLoad(): void {\n    const additonalFieldContent = getSlotContent(this.host, \"additional-field\");\n\n    if (additonalFieldContent !== null) {\n      this.hasAdditionalField = true;\n      const Element = additonalFieldContent[0] as HTMLElement;\n      if (Element.tagName === \"IC-TEXT-FIELD\") {\n        const textField = Element as HTMLIcTextFieldElement;\n        textField.hiddenInput = false;\n      }\n    }\n\n    this.defaultRadioValue = this.value;\n  }\n\n  @Listen(\"icChange\")\n  textfieldValueHandler(event: CustomEvent<{ value: string }>): void {\n    const textFieldValue = event.detail.value;\n\n    if (this.selected) {\n      if (textFieldValue !== \"\") {\n        this.value = event.detail.value;\n        this.radioOptionSelect.emit({\n          value: this.value,\n        });\n      } else {\n        this.value = this.defaultRadioValue;\n        this.radioOptionSelect.emit({\n          value: this.defaultRadioValue,\n        });\n      }\n    }\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.value, propName: \"value\" }],\n      \"Radio Option\"\n    );\n  }\n\n  componentDidRender(): void {\n    if (this.additionalFieldDisplay === \"static\") {\n      const textfield = this.host.querySelector(\"ic-text-field\");\n      if (!this.selected) {\n        textfield && textfield.setAttribute(\"disabled\", \"\");\n      } else {\n        textfield && textfield.removeAttribute(\"disabled\");\n      }\n    }\n  }\n\n  render() {\n    const id = `ic-radio-option-${\n      this.label !== undefined ? this.label : this.value\n    }-${this.groupLabel}`;\n\n    return (\n      <Host onClick={this.handleClick}>\n        <div class={{ [\"container\"]: true, [\"disabled\"]: this.disabled }}>\n          <input\n            role=\"radio\"\n            tabindex={this.selected ? \"0\" : \"-1\"}\n            type=\"radio\"\n            name={this.name}\n            id={id}\n            value={this.value}\n            disabled={this.disabled ? true : null}\n            checked={this.selected}\n            ref={(el) => (this.radioElement = el)}\n          ></input>\n          <span class=\"checkmark\"></span>\n          <ic-typography class=\"radio-label\" variant=\"body\">\n            <label htmlFor={id}>{this.label}</label>\n          </ic-typography>\n        </div>\n\n        {this.hasAdditionalField && (\n          <div\n            onClick={this.swallowClick}\n            class={{\n              \"dynamic-container\": true,\n              hidden:\n                this.additionalFieldDisplay === \"dynamic\" && !this.selected,\n            }}\n          >\n            {this.additionalFieldDisplay === \"dynamic\" && (\n              <div class=\"branch-corner\"></div>\n            )}\n            <div>\n              {this.additionalFieldDisplay === \"dynamic\" && (\n                <ic-typography variant=\"caption\">\n                  <p class=\"dynamic-text\">{this.dynamicText}</p>\n                </ic-typography>\n              )}\n              <div\n                class={{\n                  \"addition-field-wrapper\":\n                    this.additionalFieldDisplay === \"static\",\n                }}\n              >\n                <slot name=\"additional-field\"></slot>\n              </div>\n            </div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"ic-radio-option.js","mappings":"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","names":[],"sources":["./src/components/ic-radio-option/ic-radio-option.css?tag=ic-radio-option&encapsulation=shadow","./src/components/ic-radio-option/ic-radio-option.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host {\n  display: block;\n  margin-bottom: var(--ic-space-sm);\n  width: fit-content;\n}\n\n:host([small]) {\n  margin-bottom: 10px;\n}\n\n:host([additional-field-display=\"static\"]) ::slotted(ic-textfield) {\n  margin-top: var(--ic-space-xs);\n  margin-left: var(--ic-space-xl);\n}\n\n/* The label turns grey when disabled  */\n:host([disabled]) {\n  color: var(--ic-architectural-200);\n}\n\n/* Focus states */\n\n.container input:focus + span.checkmark,\n:host(:focus) .container input:checked + span.checkmark {\n  box-shadow: var(--ic-border-focus);\n  outline: none;\n}\n\n.container input:focus-visible {\n  outline: none;\n}\n\n/* The container */\n.container {\n  display: inline-flex;\n  position: relative;\n  cursor: pointer;\n  align-items: center;\n  gap: var(--ic-space-xs);\n  margin-left: 5px;\n}\n\n.container.disabled,\n.container.disabled input:disabled {\n  cursor: default;\n}\n\n/* Hide the browser's default radio button */\n.container input {\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n  display: inline-block;\n  position: absolute;\n  cursor: pointer;\n  top: 0;\n  left: 0;\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n  border-radius: 50%;\n  border: none;\n}\n\n/* Create a custom radio button */\n.checkmark {\n  display: block;\n  position: relative;\n  top: 0;\n  left: 0;\n  height: 20px;\n  width: 20px;\n  background-color: transparent;\n  border: 1px solid #a7acb3;\n  border-radius: 50%;\n  transition: var(--ic-easing-transition-fast);\n}\n\n/* Show the indicator (dot/circle) when checked */\n.container input:checked ~ .checkmark::after {\n  display: inline-block;\n}\n\n/* On mouse-over, add a light blue background color */\n.container:hover input ~ .checkmark {\n  background-color: var(--ic-action-default-bg-hover);\n  box-shadow: 0 0 0 4px var(--ic-action-default-bg-hover);\n  border: 1px solid var(--ic-action-default);\n}\n\n/* When pressed, adds the active colours */\n.container:active input ~ .checkmark {\n  background-color: var(--ic-action-default-bg-active);\n  border: 1px solid var(--ic-action-default-active);\n  box-shadow: 0 0 0 4px var(--ic-action-default-bg-active);\n}\n\n/* When pressed, adds the active colours */\n.container:active input:checked ~ .checkmark {\n  background-color: var(--ic-action-default-bg-active);\n  border: 2px solid var(--ic-action-default-active);\n  box-shadow: 0 0 0 4px var(--ic-action-default-bg-active);\n}\n\n/* When pressed and selected, adds the active colours */\n.container:active input:checked ~ .checkmark::after {\n  background-color: var(--ic-action-default-active);\n}\n\n/* When the radio button is checked */\n.container input:checked ~ .checkmark {\n  border: 2px solid var(--ic-action-default);\n  margin: -1px;\n  margin-bottom: 1px;\n}\n\n/* When the radio button is checked and disabled */\n.container input:checked:disabled ~ .checkmark {\n  background-color: transparent;\n  border: 2px solid var(--ic-architectural-200);\n}\n\n/* When the radio button is disabled */\n.container input:disabled ~ .checkmark {\n  border: 1px dashed var(--ic-architectural-200);\n}\n\n/* When the radio button is disabled */\n.container input:disabled ~ .checkmark::after {\n  background: var(--ic-architectural-200);\n}\n\n/* On mouse-over inactive */\n.container:hover input:disabled ~ .checkmark {\n  background-color: transparent;\n  box-shadow: none;\n  border: 2px solid none;\n}\n\n.container:active input:disabled ~ .checkmark::after {\n  background-color: var(--ic-architectural-200);\n}\n\n/* Style the indicator (dot/circle) */\n.container .checkmark::after {\n  content: \"\";\n  position: absolute;\n  display: none;\n  top: 2px;\n  left: 2px;\n  width: 16px;\n  height: 16px;\n  border-radius: 50%;\n  background: var(--ic-action-default);\n}\n\n.radio-label {\n  font-size: 16px;\n  font-weight: 400;\n  margin-left: var(--ic-space-sm);\n}\n\n.addition-field-wrapper {\n  margin-left: 44px;\n}\n\n/* The line */\n.branch-corner {\n  color: var(--ic-action-default);\n  height: var(--ic-space-md);\n  width: var(--ic-space-xl);\n  border-radius: 0 0 0 3px;\n  border-bottom: 2px solid var(--ic-action-default);\n  border-left: 2px solid var(--ic-action-default);\n  margin-left: -1px;\n}\n\n/* The dynamic container */\n.dynamic-container {\n  display: flex;\n  position: relative;\n  margin-left: var(--ic-space-md);\n  margin-top: 6px;\n  gap: var(--ic-space-xs);\n}\n\n.dynamic-container.hidden {\n  display: none;\n}\n\n.dynamic-text {\n  color: var(--ic-action-default);\n  margin-top: 5px;\n  margin-bottom: var(--ic-space-xs);\n  border-radius: 2%;\n}\n\n@media (max-width: 576px) {\n  ::slotted(ic-text-field) {\n    --input-width: 100%;\n  }\n}\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  Event,\n  EventEmitter,\n  Listen,\n  Watch,\n  State,\n} from \"@stencil/core\";\nimport { IcAdditionalFieldTypes } from \"../../utils/types\";\nimport {\n  getSlotContent,\n  onComponentRequiredPropUndefined,\n  addFormResetListener,\n  removeFormResetListener,\n} from \"../../utils/helpers\";\nimport { IcValueEventDetail } from \"../../interface\";\n@Component({\n  tag: \"ic-radio-option\",\n  styleUrl: \"ic-radio-option.css\",\n  shadow: true,\n})\nexport class RadioOption {\n  private radioElement: HTMLInputElement;\n  /**\n   * Determines whether the radio should be in selected state.\n   */\n  @Prop({ reflect: true, mutable: true }) selected?: boolean = false;\n  /**\n   * Determines whether the radio should be in disabled state.\n   */\n  @Prop() disabled?: boolean = false;\n  /**\n   * Provide a label for the input.\n   */\n  @Prop() label?: string;\n  /**\n   * Provide a value for the input.\n   */\n  @Prop({ mutable: true }) value!: string;\n  /**\n   * Provide a name for the input.\n   */\n  @Prop() name: string;\n  /**\n   * Provide a group label for the input.\n   */\n  @Prop() groupLabel: string;\n  /**\n   * Provide a text prop for the dynamic text.\n   */\n  @Prop() dynamicText: string = \"This selection requires additional answers\";\n\n  /** Determines type of additional text field in relation to radio option */\n\n  @Prop({ reflect: true }) additionalFieldDisplay: IcAdditionalFieldTypes =\n    \"static\";\n\n  @State() initiallySelected = this.selected;\n\n  @Element() host: HTMLIcRadioOptionElement;\n\n  /**\n   * Emitted when radio is checked\n   */\n  @Event() icCheck!: EventEmitter<void>;\n\n  /**\n   * Emitted when a radio is selected.\n   */\n  @Event() radioOptionSelect: EventEmitter<IcValueEventDetail>;\n\n  @Watch(\"selected\")\n  selectedChangeHandler(selected: boolean): void {\n    if (selected) {\n      this.handleClick();\n    }\n  }\n\n  private defaultRadioValue: string = \"\";\n  private skipFocus = false;\n\n  private handleClick = () => {\n    if (!this.disabled) {\n      if (this.skipFocus === false) {\n        this.radioElement.focus();\n      }\n      this.skipFocus = false;\n\n      if (this.hasAdditionalField) {\n        const textfield = this.host.querySelector(\"ic-text-field\");\n        this.value =\n          textfield.value !== \"\" ? textfield.value : this.defaultRadioValue;\n      }\n\n      this.radioOptionSelect.emit({\n        value: this.value,\n      });\n    }\n  };\n\n  private swallowClick = (event: MouseEvent) => {\n    event.stopPropagation();\n  };\n\n  private hasAdditionalField: boolean = false;\n  componentWillLoad(): void {\n    const additonalFieldContent = getSlotContent(this.host, \"additional-field\");\n\n    if (additonalFieldContent !== null) {\n      this.hasAdditionalField = true;\n      const Element = additonalFieldContent[0] as HTMLElement;\n      if (Element.tagName === \"IC-TEXT-FIELD\") {\n        const textField = Element as HTMLIcTextFieldElement;\n        textField.hiddenInput = false;\n      }\n    }\n\n    this.defaultRadioValue = this.value;\n\n    addFormResetListener(this.host, this.handleFormReset);\n  }\n\n  private handleFormReset = (): void => {\n    this.skipFocus = true;\n    this.selected = this.initiallySelected;\n  };\n\n  @Listen(\"icChange\")\n  textfieldValueHandler(event: CustomEvent<{ value: string }>): void {\n    const textFieldValue = event.detail.value;\n\n    if (this.selected) {\n      if (textFieldValue !== \"\") {\n        this.value = event.detail.value;\n        this.radioOptionSelect.emit({\n          value: this.value,\n        });\n      } else {\n        this.value = this.defaultRadioValue;\n        this.radioOptionSelect.emit({\n          value: this.defaultRadioValue,\n        });\n      }\n    }\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.value, propName: \"value\" }],\n      \"Radio Option\"\n    );\n  }\n\n  componentDidRender(): void {\n    if (this.additionalFieldDisplay === \"static\") {\n      const textfield = this.host.querySelector(\"ic-text-field\");\n      if (!this.selected) {\n        textfield && textfield.setAttribute(\"disabled\", \"\");\n      } else {\n        textfield && textfield.removeAttribute(\"disabled\");\n      }\n    }\n  }\n\n  disconnectedCallback(): void {\n    removeFormResetListener(this.host, this.handleFormReset);\n  }\n\n  render() {\n    const id = `ic-radio-option-${\n      this.label !== undefined ? this.label : this.value\n    }-${this.groupLabel}`;\n\n    return (\n      <Host onClick={this.handleClick}>\n        <div class={{ [\"container\"]: true, [\"disabled\"]: this.disabled }}>\n          <input\n            role=\"radio\"\n            tabindex={this.selected ? \"0\" : \"-1\"}\n            type=\"radio\"\n            name={this.name}\n            id={id}\n            value={this.value}\n            disabled={this.disabled ? true : null}\n            checked={this.selected}\n            ref={(el) => (this.radioElement = el)}\n          ></input>\n          <span class=\"checkmark\"></span>\n          <ic-typography class=\"radio-label\" variant=\"body\">\n            <label htmlFor={id}>{this.label}</label>\n          </ic-typography>\n        </div>\n\n        {this.hasAdditionalField && (\n          <div\n            onClick={this.swallowClick}\n            class={{\n              \"dynamic-container\": true,\n              hidden:\n                this.additionalFieldDisplay === \"dynamic\" && !this.selected,\n            }}\n          >\n            {this.additionalFieldDisplay === \"dynamic\" && (\n              <div class=\"branch-corner\"></div>\n            )}\n            <div>\n              {this.additionalFieldDisplay === \"dynamic\" && (\n                <ic-typography variant=\"caption\">\n                  <p class=\"dynamic-text\">{this.dynamicText}</p>\n                </ic-typography>\n              )}\n              <div\n                class={{\n                  \"addition-field-wrapper\":\n                    this.additionalFieldDisplay === \"static\",\n                }}\n              >\n                <slot name=\"additional-field\"></slot>\n              </div>\n            </div>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/ic-search-bar.js

@@ -1,5 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { q as handleHiddenFormButtonClick, t as getFilteredMenuOptions, u as debounceEvent, v as getLabelFromValue, a as onComponentRequiredPropUndefined, d as getInputDescribedByText, r as renderHiddenInput, I as IcThemeForegroundEnum } from './helpers.js';
+import { I as IcThemeForegroundEnum } from './types.js';
+import { t as handleHiddenFormButtonClick, u as getFilteredMenuOptions, v as debounceEvent, w as getLabelFromValue, a as onComponentRequiredPropUndefined, f as getInputDescribedByText, d as renderHiddenInput } from './helpers.js';
 import { d as defineCustomElement$b } from './ic-button2.js';
 import { d as defineCustomElement$a } from './ic-input-component-container2.js';
 import { d as defineCustomElement$9 } from './ic-input-container2.js';
@@ -20,7 +21,7 @@ const searchIcon = `<svg width="20" height="20" viewBox="0 0 20 20" fill="none"
     <path d="M13.1292 11.8792H12.4708L12.2375 11.6542C13.0542 10.7042 13.5458 9.47083 13.5458 8.12916C13.5458 5.13749 11.1208 2.71249 8.12916 2.71249C5.13749 2.71249 2.71249 5.13749 2.71249 8.12916C2.71249 11.1208 5.13749 13.5458 8.12916 13.5458C9.47083 13.5458 10.7042 13.0542 11.6542 12.2375L11.8792 12.4708V13.1292L16.0458 17.2875L17.2875 16.0458L13.1292 11.8792ZM8.12916 11.8792C6.05416 11.8792 4.37916 10.2042 4.37916 8.12916C4.37916 6.05416 6.05416 4.37916 8.12916 4.37916C10.2042 4.37916 11.8792 6.05416 11.8792 8.12916C11.8792 10.2042 10.2042 11.8792 8.12916 11.8792Z" fill="currentColor"/>
 </svg>`;
 
-const icSearchBarCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host(.search){--divider-height:24px}:host(.search.dense){--divider-height:16px}:host(.fullwidth){width:100%}:host(.search) .disabled:hover{border-color:var(--ic-architectural-200)}:host(.search.disabled) .disabled svg{color:var(--ic-architectural-200)}:host(.search) .disabled svg{color:var(--ic-architectural-400)}.clear-button-container{align-items:center;margin-right:1px;display:none;visibility:hidden}.clear-button{border-radius:var(--ic-border-radius);transition:box-shadow var(--ic-easing-transition),\n    border-radius var(--ic-easing-transition)}.clear-button:focus{background-color:var(--ic-focus-blue);box-shadow:inset 0 0 0 2px var(--ic-focus-glow);border-radius:4px}.clear-button:focus *{fill:white}.clear-button-visible{visibility:visible;display:flex}.search-submit-button-container{display:flex;align-items:center}.search-submit-button-disabled .ic-tooltip-container{display:none !important}.search-submit-button:focus{background-color:var(--ic-focus-blue) !important;box-shadow:inset 0 0 0 2px var(--ic-focus-glow) !important;border-radius:var(--ic-space-xxs);height:var(--ic-space-xl);margin-top:var(--ic-space-xxxs)}.search-submit-button:focus *{fill:white}.divider{width:1px;background-color:var(--ic-action-dark-active);height:var(--divider-height)}:host(.dark) .divider{background-color:var(--ic-architectural-200)}.menu-container{width:var(--input-width, 320px);position:relative;top:var(--ic-space-xxxs)}.menu-container.fullwidth{width:100%}ic-menu{transition:var(--ic-easing-transition-slow)}.no-results{cursor:not-allowed}.search-results-status{border:0;clip:rect(0, 0, 0, 0, 0);height:1px;margin-bottom:-1px;margin-right:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}";
+const icSearchBarCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}:host(.search){--divider-height:24px}:host(.search.small){--divider-height:16px}:host(.fullwidth){width:100%}:host(.search) .disabled:hover{border-color:var(--ic-architectural-200)}:host(.search.disabled) .disabled svg{color:var(--ic-architectural-200)}:host(.search) .disabled svg{color:var(--ic-architectural-400)}.clear-button-container{align-items:center;margin-right:1px;display:none;visibility:hidden}.clear-button{border-radius:var(--ic-border-radius);transition:box-shadow var(--ic-easing-transition),\n    border-radius var(--ic-easing-transition)}.clear-button:focus{background-color:var(--ic-focus-blue);box-shadow:inset 0 0 0 2px var(--ic-focus-glow);border-radius:4px}.clear-button:focus *{fill:white}.clear-button-visible{visibility:visible;display:flex}.search-submit-button-container{display:flex;align-items:center}.search-submit-button-disabled .ic-tooltip-container{display:none !important}.search-submit-button:focus{background-color:var(--ic-focus-blue) !important;box-shadow:inset 0 0 0 2px var(--ic-focus-glow) !important;border-radius:var(--ic-space-xxs);height:var(--ic-space-xl);margin-top:var(--ic-space-xxxs)}.search-submit-button:focus *{fill:white}.divider{width:1px;background-color:var(--ic-action-dark-active);height:var(--divider-height)}:host(.dark) .divider{background-color:var(--ic-architectural-200)}.menu-container{width:var(--input-width, 320px);position:relative;top:var(--ic-space-xxxs)}.menu-container.fullwidth{width:100%}ic-menu{transition:var(--ic-easing-transition-slow)}.no-results{cursor:not-allowed}.search-results-status{border:0;clip:rect(0, 0, 0, 0, 0);height:1px;margin-bottom:-1px;margin-right:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}";
 
 let inputIds = 0;
 const SearchBar = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
@@ -202,7 +203,7 @@ const SearchBar = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.disableFilter = false;
     this.hideLabel = false;
     this.helperText = "";
-    this.dense = false;
+    this.small = false;
     this.value = "";
     this.autocapitalize = "off";
     this.autocomplete = "off";
@@ -213,7 +214,6 @@ const SearchBar = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.spellcheck = false;
     this.options = [];
     this.focusOnLoad = false;
-    this.dark = false;
     this.hintText = "When autocomplete results are available use the up and down arrows to choose and press enter to select";
     this.emptyOptionListText = "No results found";
     this.charactersUntilSuggestion = 2;
@@ -323,7 +323,7 @@ const SearchBar = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     }
   }
   render() {
-    const { inputId, name, label, required, dense, placeholder, helperText, disabled, value, readonly, spellcheck, fullWidth, options, open, hideLabel, menuId, ariaActiveDescendant, dark, truncateValue, autofocus, autocapitalize, autocomplete, filteredOptions, } = this;
+    const { inputId, name, label, required, small, placeholder, helperText, disabled, value, readonly, spellcheck, fullWidth, options, open, hideLabel, menuId, ariaActiveDescendant, truncateValue, autofocus, autocapitalize, autocomplete, filteredOptions, } = this;
     const disabledMode = readonly || disabled ? true : false;
     const describedBy = getInputDescribedByText(inputId, helperText !== "", false).trim();
     let describedById;
@@ -361,30 +361,29 @@ const SearchBar = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     return (h(Host, { class: {
         ["search"]: true,
         ["fullwidth"]: fullWidth,
-        ["dark"]: dark,
         ["disabled"]: disabled,
-        ["dense"]: dense,
-      }, onFocus: this.handleHostFocus, onBlur: this.handleHostBlur }, h("ic-text-field", { ref: (el) => (this.inputEl = el), inputId: inputId, label: label, helperText: helperText, required: required, disabled: disabledText, readonly: readonly, dense: dense, hideLabel: hideLabel, fullWidth: fullWidth, name: name, truncateValue: truncateValue, dark: dark, value: options && !!getLabelFromValue(value, options)
+        ["small"]: small,
+      }, onFocus: this.handleHostFocus, onBlur: this.handleHostBlur }, h("ic-text-field", { ref: (el) => (this.inputEl = el), inputId: inputId, label: label, helperText: helperText, required: required, disabled: disabledText, readonly: readonly, small: small, hideLabel: hideLabel, fullWidth: fullWidth, name: name, truncateValue: truncateValue, value: options && !!getLabelFromValue(value, options)
         ? getLabelFromValue(value, options)
         : value, placeholder: placeholder, onInput: this.onInput, onBlur: this.onInputBlur, onFocus: this.onInputFocus, "aria-label": hideLabel ? label : "", "aria-describedby": describedById, "aria-owns": hasSuggestedSearch ? menuId : undefined, "aria-haspopup": options.length > 0 ? "listbox" : undefined, ariaExpanded: expanded, ariaActiveDescendant: ariaActiveDescendant, "aria-autocomplete": hasSuggestedSearch ? "list" : undefined, role: hasSuggestedSearch ? "combobox" : undefined, autocomplete: autocomplete, autocapitalize: autocapitalize, autoFocus: autofocus, spellcheck: spellcheck, inputmode: "search" }, h("div", { class: {
         "clear-button-container": true,
         "clear-button-visible": value && !disabledMode && this.showClearButton,
-      }, slot: "clear-button" }, h("ic-button", { id: "clear-button", class: "clear-button", "aria-label": "Clear", innerHTML: clearIcon, onClick: this.handleClear, size: dense ? "dense" : "default", onFocus: this.handleFocusClearButton, onBlur: this.handleClearBlur, onKeyDown: this.handleClear, type: "submit", variant: "icon", buttonStyle: this.clearButtonFocused
+      }, slot: "clear-button" }, h("ic-button", { id: "clear-button", class: "clear-button", "aria-label": "Clear", innerHTML: clearIcon, onClick: this.handleClear, size: small ? "small" : "default", onFocus: this.handleFocusClearButton, onBlur: this.handleClearBlur, onKeyDown: this.handleClear, type: "submit", variant: "icon", appearance: this.clearButtonFocused
         ? IcThemeForegroundEnum.Light
         : IcThemeForegroundEnum.Dark }), h("div", { class: "divider" })), h("div", { class: {
         "search-submit-button-container": true,
         "search-submit-button-disabled": valueNotSet || disabled || hadNoOptions,
       }, slot: "search-submit-button" }, h("ic-button", { id: "search-submit-button", "aria-label": "Search", ref: (el) => (this.searchSubmitButton = el), class: {
         ["search-submit-button"]: true,
-        ["search-submit-button-dense"]: !!dense,
-      }, disabled: valueNotSet || disabled || hadNoOptions, innerHTML: searchIcon, size: dense ? "dense" : "default", onClick: this.handleSubmitSearch, onBlur: this.handleSubmitSearchBlur, onFocus: this.handleSubmitSearchFocus, type: "submit", variant: "icon", buttonStyle: this.searchSubmitFocused
+        ["search-submit-button-small"]: !!small,
+      }, disabled: valueNotSet || disabled || hadNoOptions, innerHTML: searchIcon, size: small ? "small" : "default", onClick: this.handleSubmitSearch, onBlur: this.handleSubmitSearchBlur, onFocus: this.handleSubmitSearchFocus, type: "submit", variant: "icon", appearance: this.searchSubmitFocused
         ? IcThemeForegroundEnum.Light
         : IcThemeForegroundEnum.Default })), h("div", { class: {
         "menu-container": true,
         fullwidth: fullWidth,
       }, slot: "menu" }, menuOpen && value.length >= this.charactersUntilSuggestion && (h("ic-menu", { class: {
         "no-results": hadNoOptions,
-      }, activationType: "manual", anchorEl: this.anchorEl, autoFocusOnSelected: false, inputEl: this.inputEl, inputLabel: label, ref: (el) => (this.menu = el), dense: dense, fullWidth: fullWidth, menuId: menuId, open: true, options: filteredOptions, onOptionSelect: this.handleOptionSelect, onMenuChange: this.handleMenuChange, parentEl: this.el, value: value })))), h("div", { "aria-live": "polite", role: "status", class: "search-results-status" })));
+      }, activationType: "manual", anchorEl: this.anchorEl, autoFocusOnSelected: false, inputEl: this.inputEl, inputLabel: label, ref: (el) => (this.menu = el), small: small, fullWidth: fullWidth, menuId: menuId, open: true, options: filteredOptions, onOptionSelect: this.handleOptionSelect, onMenuChange: this.handleMenuChange, parentEl: this.el, value: value })))), h("div", { "aria-live": "polite", role: "status", class: "search-results-status" })));
   }
   get el() { return this; }
   static get watchers() { return {
@@ -403,7 +402,7 @@ const SearchBar = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     "disableFilter": [4, "disable-filter"],
     "hideLabel": [4, "hide-label"],
     "helperText": [1, "helper-text"],
-    "dense": [4],
+    "small": [4],
     "value": [1537],
     "autocapitalize": [1],
     "autocomplete": [1],
@@ -414,7 +413,6 @@ const SearchBar = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     "spellcheck": [4],
     "options": [16],
     "focusOnLoad": [4, "focus-on-load"],
-    "dark": [4],
     "hintText": [1, "hint-text"],
     "emptyOptionListText": [1, "empty-option-list-text"],
     "charactersUntilSuggestion": [2, "characters-until-suggestion"],

package/dist/components/ic-search-bar.js.map

@@ -1 +1 @@
-{"file":"ic-search-bar.js","mappings":"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","names":[],"sources":["./src/components/ic-search-bar/ic-search-bar.css?tag=ic-search-bar&encapsulation=shadow","./src/components/ic-search-bar/ic-search-bar.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host(.search) {\n  --divider-height: 24px;\n}\n\n:host(.search.dense) {\n  --divider-height: 16px;\n}\n\n:host(.fullwidth) {\n  width: 100%;\n}\n\n:host(.search) .disabled:hover {\n  border-color: var(--ic-architectural-200);\n}\n\n:host(.search.disabled) .disabled svg {\n  color: var(--ic-architectural-200);\n}\n\n:host(.search) .disabled svg {\n  color: var(--ic-architectural-400);\n}\n\n/* CLEAR */\n\n.clear-button-container {\n  align-items: center;\n  margin-right: 1px;\n  display: none;\n  visibility: hidden;\n}\n\n.clear-button {\n  border-radius: var(--ic-border-radius);\n  transition: box-shadow var(--ic-easing-transition),\n    border-radius var(--ic-easing-transition);\n}\n\n.clear-button:focus {\n  background-color: var(--ic-focus-blue);\n  box-shadow: inset 0 0 0 2px var(--ic-focus-glow);\n  border-radius: 4px;\n}\n\n.clear-button:focus * {\n  fill: white;\n}\n\n.clear-button-visible {\n  visibility: visible;\n  display: flex;\n}\n\n.search-submit-button-container {\n  display: flex;\n  align-items: center;\n}\n\n.search-submit-button-disabled .ic-tooltip-container {\n  display: none !important;\n}\n\n.search-submit-button:focus {\n  background-color: var(--ic-focus-blue) !important;\n  box-shadow: inset 0 0 0 2px var(--ic-focus-glow) !important;\n  border-radius: var(--ic-space-xxs);\n  height: var(--ic-space-xl);\n  margin-top: var(--ic-space-xxxs);\n}\n\n.search-submit-button:focus * {\n  fill: white;\n}\n\n.divider {\n  width: 1px;\n  background-color: var(--ic-action-dark-active);\n  height: var(--divider-height);\n}\n\n:host(.dark) .divider {\n  background-color: var(--ic-architectural-200);\n}\n\n.menu-container {\n  width: var(--input-width, 320px);\n  position: relative;\n  top: var(--ic-space-xxxs);\n}\n\n.menu-container.fullwidth {\n  width: 100%;\n}\n\nic-menu {\n  transition: var(--ic-easing-transition-slow);\n}\n\n.no-results {\n  cursor: not-allowed;\n}\n\n.search-results-status {\n  border: 0;\n  clip: rect(0, 0, 0, 0, 0);\n  height: 1px;\n  margin-bottom: -1px;\n  margin-right: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n  Method,\n  h,\n} from \"@stencil/core\";\n\nimport {\n  IcAutocompleteTypes,\n  IcAutocorrectStates,\n  IcThemeForegroundEnum,\n  IcMenuOption,\n} from \"../../utils/types\";\nimport {\n  debounceEvent,\n  getInputDescribedByText,\n  renderHiddenInput,\n  handleHiddenFormButtonClick,\n  getLabelFromValue,\n  onComponentRequiredPropUndefined,\n  getFilteredMenuOptions,\n} from \"../../utils/helpers\";\nimport { IcSearchBarBlurEventDetail } from \"./ic-search-bar.types\";\nimport { IcValueEventDetail, IcBlurEventDetail } from \"../../interface\";\nimport {\n  IcMenuChangeEventDetail,\n  IcOptionSelectEventDetail,\n} from \"../ic-menu/ic-menu.types\";\n\nimport clearIcon from \"../../assets/clear-icon.svg\";\nimport searchIcon from \"../../assets/search-icon.svg\";\n\nlet inputIds = 0;\n\n@Component({\n  tag: \"ic-search-bar\",\n  styleUrl: \"ic-search-bar.css\",\n  shadow: true,\n})\nexport class SearchBar {\n  @Element() el: HTMLIcSearchBarElement;\n\n  private inputId = `ic-search-bar-input-${inputIds++}`;\n  private inputEl: HTMLIcTextFieldElement;\n\n  private menuId = `${this.inputId}-menu`;\n  private searchSubmitButton: HTMLIcButtonElement;\n  private menu: HTMLIcMenuElement;\n  private menuCloseFromMenuChangeEvent: boolean = false;\n\n  private anchorEl: HTMLElement;\n  private truncateValue = false;\n\n  private assistiveHintEl: HTMLSpanElement = null;\n  private preventSubmit: boolean = false;\n\n  /**\n   * Provide a label for the input.\n   */\n  @Prop() label!: string;\n\n  /**\n   * Specify if the input requires a value.\n   */\n  @Prop() required?: boolean = false;\n  /**\n   * Specify whether the input is disabled.\n   */\n  @Prop() disabled?: boolean = false;\n\n  /**\n   * Specify whether the input is read only.\n   */\n  @Prop() readonly?: boolean = false;\n\n  /**\n   * Provide a placeholder value to display.\n   */\n  @Prop() placeholder?: string = \"Search\";\n\n  /**\n   * Specify whether the component fills the full width of the container.\n   * If true, this overrides the --input-width css prop.\n   */\n  @Prop() fullWidth?: boolean = false;\n\n  /**\n   * Specify whether to disable the built in filtering. For example, if options will already be filtered from external source.\n   * If true, all options provided will be displayed.\n   */\n  @Prop() disableFilter?: boolean = false;\n\n  /**\n   * Hides the label and applies the required label value as an aria-label.\n   */\n  @Prop() hideLabel?: boolean = false;\n\n  /**\n   * Provide helper text to display additional field guidance.\n   */\n  @Prop() helperText?: string = \"\";\n\n  /**\n   * Specify whether dense styling is to be applied to the element.\n   */\n  @Prop() dense?: boolean = false;\n\n  /**\n   * Value of Search input.\n   */\n  @Prop({ reflect: true, mutable: true }) value: string = \"\";\n\n  /**\n   * Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user.\n   * Available options: \"off\", \"none\", \"on\", \"sentences\", \"words\", \"characters\".\n   */\n  @Prop() autocapitalize = \"off\";\n\n  /**\n   * Indicates whether the value of the control can be automatically completed by the browser.\n   */\n  @Prop() autocomplete?: IcAutocompleteTypes = \"off\";\n\n  /**\n   * Whether auto correction should be enabled when the user is entering/editing the text value.\n   */\n  @Prop() autocorrect?: IcAutocorrectStates = \"off\";\n\n  /**\n   * This Boolean attribute lets you specify that a form control should have input focus when the page loads.\n   */\n  @Prop() autofocus = false;\n\n  /**\n   * Set the amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.\n   */\n  @Prop({ mutable: true }) debounce?: number = 0;\n\n  @Watch(\"debounce\")\n  private debounceChanged() {\n    this.icChange = debounceEvent(this.icChange, this.debounce);\n  }\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name: string = this.inputId;\n\n  /**\n   * If `true`, the element will have its spelling and grammar checked.\n   */\n  @Prop() spellcheck: boolean = false;\n  /**\n   * Provide the suggested search options\n   */\n  @Prop() options?: IcMenuOption[] = [];\n\n  @Watch(\"options\")\n  watchOptionsHandler(newOptions: IcMenuOption[]): void {\n    if (this.disableFilter) {\n      this.filteredOptions = newOptions;\n    }\n  }\n\n  /**\n   * Specify whether the input should be focussed when component loaded.\n   */\n  @Prop() focusOnLoad?: boolean = false;\n\n  /**\n   * Determines whether the dark variant of the search bar should be displayed.\n   */\n  @Prop() dark?: boolean = false;\n\n  /**\n   * Provide hint text for hidden assistive description element.\n   */\n  @Prop() hintText?: string =\n    \"When autocomplete results are available use the up and down arrows to choose and press enter to select\";\n\n  /**\n   * Provide text for empty results list\n   */\n  @Prop() emptyOptionListText = \"No results found\";\n\n  /**\n   * Number of characters until suggestions appear\n   */\n  @Prop() charactersUntilSuggestion: number = 2;\n\n  @Watch(\"value\")\n  watchValueHandler(newValue: string): void {\n    if (\n      this.inputEl &&\n      this.options &&\n      !!getLabelFromValue(newValue, this.options)\n    ) {\n      this.inputEl.value = getLabelFromValue(newValue, this.options);\n    } else if (this.inputEl && this.inputEl.value !== newValue) {\n      this.inputEl.value = newValue;\n    }\n\n    this.icChange.emit({ value: newValue });\n  }\n\n  /**\n   * Sets focus on the native `input`\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    if (this.inputEl) {\n      this.inputEl.setFocus();\n    }\n  }\n\n  @Listen(\"icKeydown\", {})\n  handleKeyDown(ev: CustomEvent): void {\n    const keyEv: KeyboardEvent = ev.detail.event;\n    if (this.menu && this.open) {\n      this.menu.handleKeyboardOpen(keyEv);\n    }\n  }\n\n  @Listen(\"keyup\", {})\n  handleKeyUp(ev: KeyboardEvent): void {\n    if (ev.key === \"Enter\") {\n      if (this.preventSubmit) {\n        return;\n      }\n\n      this.handleSubmitSearch();\n      this.setMenuChange(false);\n    }\n\n    if (ev.key === \"Escape\") {\n      this.setMenuChange(false);\n    }\n\n    if (this.preventSubmit) {\n      this.preventSubmit = false;\n    }\n  }\n\n  private handleSubmitSearch = () => {\n    this.icSubmitSearch.emit({ value: this.value });\n\n    const form: HTMLFormElement = this.el.closest(\"FORM\");\n\n    if (this.searchSubmitButton && !!form && !this.preventSubmit) {\n      handleHiddenFormButtonClick(form, this.searchSubmitButton);\n    }\n  };\n\n  /**\n   * Emitted when a keyboard input occurred.\n   */\n  @Event() icInput: EventEmitter<IcValueEventDetail>;\n  private onInput = (ev: Event) => {\n    this.value = (ev.target as HTMLInputElement).value;\n\n    if (this.options.length > 0) {\n      this.setMenuChange(true);\n\n      if (this.disableFilter === false) {\n        const rawFilteredOptions = getFilteredMenuOptions(\n          this.options,\n          false,\n          this.value,\n          \"anywhere\"\n        );\n\n        const noOptions = [{ label: this.emptyOptionListText, value: \"\" }];\n\n        this.filteredOptions =\n          rawFilteredOptions.length > 0 ? rawFilteredOptions : noOptions;\n      }\n    }\n\n    if (!this.showClearButton) {\n      this.handleShowClearButton(true);\n    }\n\n    this.debounceAriaLiveUpdate();\n\n    this.icInput.emit({ value: this.value });\n  };\n\n  private debounceAriaLiveUpdate() {\n    clearTimeout(this.debounce);\n\n    this.debounce = window.setTimeout(() => {\n      this.updateSearchResultAriaLive();\n    }, 500);\n  }\n\n  /**\n   * Emitted when input loses focus.\n   */\n  @Event() icInputBlur: EventEmitter<IcSearchBarBlurEventDetail>;\n  private onInputBlur = (ev: Event) => {\n    const value = (ev.target as HTMLInputElement).value;\n    const nextFocus = (ev as FocusEvent).relatedTarget;\n\n    this.icInputBlur.emit({ value: value, relatedTarget: nextFocus });\n  };\n\n  /**\n   * Emitted when input gains focus.\n   */\n  @Event() icInputFocus: EventEmitter<IcValueEventDetail>;\n  private onInputFocus = (ev: Event) => {\n    const value = (ev.target as HTMLInputElement).value;\n    this.icInputFocus.emit({ value: value });\n\n    this.handleShowClearButton(true);\n  };\n\n  /**\n   * Emitted when the value has changed.\n   */\n  @Event() icChange: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when value is cleared with clear button\n   */\n  @Event() icClear: EventEmitter<void>;\n  private handleClear = (ev: Event) => {\n    const keyboardEvent = ev as KeyboardEvent;\n    const mouseEvent = ev as MouseEvent;\n\n    if (\n      mouseEvent.type === \"click\" ||\n      keyboardEvent.code === \"Enter\" ||\n      keyboardEvent.code === \"Space\"\n    ) {\n      this.value = \"\";\n      this.inputEl.value = \"\";\n      this.el.setFocus();\n\n      this.icClear.emit();\n      ev.preventDefault();\n\n      this.preventSubmit = true;\n    }\n  };\n\n  /**\n   * Emitted when the search value has been submitted\n   */\n  @Event() icSubmitSearch: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when option is highlighted within the menu\n   */\n  @Event() icOptionSelect: EventEmitter<IcOptionSelectEventDetail>;\n\n  /**\n   * Emitted when the state of the menu changes (i.e. open or close)\n   */\n  @Event() icMenuChange: EventEmitter<IcMenuChangeEventDetail>;\n  /**\n   * @internal - Emitted when blur is invoked from clear button\n   */\n  @Event() icClearBlur: EventEmitter<IcBlurEventDetail>;\n  private handleClearBlur = (ev: Event) => {\n    const nextFocus = (ev as FocusEvent).relatedTarget;\n\n    this.icClearBlur.emit({ relatedTarget: nextFocus });\n\n    this.clearButtonFocused = false;\n  };\n\n  /**\n   * @internal - Emitted when blur is invoked from search submit button\n   */\n  @Event() icSubmitSearchBlur: EventEmitter<IcBlurEventDetail>;\n  private handleSubmitSearchBlur = (ev: Event) => {\n    const nextFocus = (ev as FocusEvent).relatedTarget;\n\n    this.icSubmitSearchBlur.emit({ relatedTarget: nextFocus });\n\n    this.searchSubmitFocused = false;\n  };\n\n  private handleSubmitSearchFocus = () => {\n    this.handleMenuCloseFromMenuChange(true);\n    this.searchSubmitFocused = true;\n  };\n\n  /**\n   * Emitted when blur is invoked from ic-search-bar\n   */\n  @Event() icSearchBarBlur: EventEmitter<IcSearchBarBlurEventDetail>;\n\n  /**\n   * Emitted when focus is invoked from ic-search-bar\n   */\n  @Event() icSearchBarFocus: EventEmitter<void>;\n\n  @State() open: boolean = false;\n  @State() filteredOptions: IcMenuOption[] = [];\n  @State() ariaActiveDescendant: string;\n  @State() showClearButton: boolean = false;\n  @State() clearButtonFocused: boolean = false;\n  @State() searchSubmitFocused: boolean = false;\n  @State() prevNoOption: boolean = false;\n\n  private handleOptionSelect = (ev: CustomEvent) => {\n    if (ev.detail.label === this.emptyOptionListText) {\n      this.el.setFocus();\n      return;\n    }\n\n    this.value = ev.detail.value;\n    this.icOptionSelect.emit({ value: this.value });\n  };\n\n  private handleMenuChange = (ev: CustomEvent) => {\n    this.setMenuChange(ev.detail.open);\n  };\n\n  private setMenuChange = (open: boolean) => {\n    if (this.open !== open) {\n      this.open = open;\n      this.icMenuChange.emit({ open });\n    }\n  };\n\n  private handleHostFocus = () => {\n    if (this.options && this.value && !this.menuCloseFromMenuChangeEvent) {\n      this.setMenuChange(true);\n    }\n    this.handleTruncateValue(false);\n\n    this.icSearchBarFocus.emit();\n  };\n\n  private handleHostBlur = (ev: Event) => {\n    const nextFocus = (ev as FocusEvent).relatedTarget;\n    if (this.open && this.options && nextFocus !== this.menu) {\n      this.setMenuChange(false);\n    }\n\n    this.handleShowClearButton(false);\n    this.handleMenuCloseFromMenuChange(false);\n    this.handleTruncateValue(true);\n    this.icSearchBarBlur.emit({ relatedTarget: nextFocus, value: this.value });\n  };\n\n  @Listen(\"menuChange\", {})\n  onMenuClose(ev: CustomEvent): void {\n    if (!ev.detail.open) {\n      this.handleMenuCloseFromMenuChange(true);\n      if (ev.detail.focusInput === undefined || ev.detail.focusInput) {\n        this.el.setFocus();\n      }\n    }\n  }\n\n  @Listen(\"menuOptionId\")\n  onMenuOptionHighlighted(ev: CustomEvent): void {\n    if (ev.detail.optionId) {\n      this.ariaActiveDescendant = ev.detail.optionId;\n    } else {\n      this.ariaActiveDescendant = undefined;\n    }\n  }\n\n  private handleShowClearButton = (visible: boolean): void => {\n    this.showClearButton = visible;\n  };\n\n  private handleFocusClearButton = (): void => {\n    this.clearButtonFocused = true;\n  };\n\n  private handleMenuCloseFromMenuChange = (fromEvent: boolean): void => {\n    this.menuCloseFromMenuChangeEvent = fromEvent;\n  };\n\n  private handleTruncateValue = (truncate: boolean): void => {\n    this.truncateValue = truncate;\n  };\n\n  private renderAssistiveHintEl = (): void => {\n    const input = this.el.shadowRoot\n      .querySelector(\"ic-text-field\")\n      ?.shadowRoot?.querySelector(`#${this.inputId}`);\n\n    if (\n      input &&\n      Object.keys(input).length > 0 &&\n      this.hasOptionsOrFilterDisabled()\n    ) {\n      this.assistiveHintEl = document.createElement(\"span\");\n      this.assistiveHintEl.innerText = this.hintText;\n      this.assistiveHintEl.id = `${this.inputId}-assistive-hint`;\n      this.assistiveHintEl.style.display = \"none\";\n      if (input.after !== undefined) {\n        input.after(this.assistiveHintEl);\n      }\n    }\n  };\n\n  private updateSearchResultAriaLive = (): void => {\n    const searchResultsStatusEl = this.el.shadowRoot.querySelector(\n      \".search-results-status\"\n    ) as HTMLParagraphElement;\n\n    if (!this.open || this.value === \"\") {\n      searchResultsStatusEl.innerText = \"\";\n    } else if (\n      this.options.length > 0 &&\n      this.filteredOptions.length > 0 &&\n      this.open &&\n      searchResultsStatusEl\n    ) {\n      searchResultsStatusEl.innerText = `${this.filteredOptions.length} result${\n        this.filteredOptions.length > 1 ? \"s\" : \"\"\n      } available`;\n    }\n  };\n\n  private hasOptionsOrFilterDisabled = (): boolean =>\n    this.options.length > 0 || this.disableFilter;\n\n  private highlightFirstOptionAfterNoResults = () => {\n    if (this.prevNoOption && this.menu) {\n      this.menu.handleSetFirstOption();\n      this.prevNoOption = false;\n    }\n    const prevNoOptionsList = this.filteredOptions.find(\n      (filteredOption) => filteredOption.label === this.emptyOptionListText\n    );\n    if (prevNoOptionsList) {\n      this.prevNoOption = true;\n    }\n  };\n\n  connectedCallback(): void {\n    this.debounceChanged();\n  }\n\n  componentWillRender(): void {\n    this.highlightFirstOptionAfterNoResults();\n  }\n\n  componentWillLoad(): void {\n    this.watchValueHandler(this.value);\n  }\n\n  componentDidLoad(): void {\n    if (this.focusOnLoad) {\n      this.el.setFocus();\n    }\n\n    if (this.hasOptionsOrFilterDisabled()) {\n      this.renderAssistiveHintEl();\n      if (this.disableFilter) {\n        this.filteredOptions = this.options;\n      }\n    }\n\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Search Bar\"\n    );\n\n    this.anchorEl = this.inputEl.shadowRoot.querySelector(\n      \"ic-input-component-container\"\n    );\n  }\n\n  disconnectedCallback(): void {\n    if (this.assistiveHintEl) {\n      this.assistiveHintEl.remove();\n    }\n  }\n\n  render() {\n    const {\n      inputId,\n      name,\n      label,\n      required,\n      dense,\n      placeholder,\n      helperText,\n      disabled,\n      value,\n      readonly,\n      spellcheck,\n      fullWidth,\n      options,\n      open,\n      hideLabel,\n      menuId,\n      ariaActiveDescendant,\n      dark,\n      truncateValue,\n      autofocus,\n      autocapitalize,\n      autocomplete,\n      filteredOptions,\n    } = this;\n\n    const disabledMode = readonly || disabled ? true : false;\n\n    const describedBy = getInputDescribedByText(\n      inputId,\n      helperText !== \"\",\n      false\n    ).trim();\n\n    let describedById;\n\n    if (describedBy !== \"\" && this.hasOptionsOrFilterDisabled()) {\n      describedById = `${describedBy} ${this.inputId}-assistive-hint`;\n    } else if (this.hasOptionsOrFilterDisabled()) {\n      describedById = `${this.inputId}-assistive-hint`;\n    } else if (describedBy !== \"\") {\n      describedById = describedBy;\n    } else {\n      describedById = undefined;\n    }\n\n    const disabledText = disabledMode && !readonly;\n    const hasSuggestedSearch = value && options.length > 0;\n    const valueNotSet = value === undefined || value === null || value === \"\";\n    const menuOpen = hasSuggestedSearch && open && filteredOptions.length > 0;\n\n    const hadNoOptions =\n      filteredOptions.length > 0 &&\n      filteredOptions[0].label === this.emptyOptionListText;\n\n    let expanded;\n\n    if (options.length > 0) {\n      if (menuOpen) {\n        expanded = \"true\";\n      } else {\n        expanded = \"false\";\n      }\n    } else {\n      expanded = undefined;\n    }\n\n    renderHiddenInput(true, this.el, name, value, disabledMode);\n\n    return (\n      <Host\n        class={{\n          [\"search\"]: true,\n          [\"fullwidth\"]: fullWidth,\n          [\"dark\"]: dark,\n          [\"disabled\"]: disabled,\n          [\"dense\"]: dense,\n        }}\n        onFocus={this.handleHostFocus}\n        onBlur={this.handleHostBlur}\n      >\n        <ic-text-field\n          ref={(el) => (this.inputEl = el)}\n          inputId={inputId}\n          label={label}\n          helperText={helperText}\n          required={required}\n          disabled={disabledText}\n          readonly={readonly}\n          dense={dense}\n          hideLabel={hideLabel}\n          fullWidth={fullWidth}\n          name={name}\n          truncateValue={truncateValue}\n          dark={dark}\n          value={\n            options && !!getLabelFromValue(value, options)\n              ? getLabelFromValue(value, options)\n              : value\n          }\n          placeholder={placeholder}\n          onInput={this.onInput}\n          onBlur={this.onInputBlur}\n          onFocus={this.onInputFocus}\n          aria-label={hideLabel ? label : \"\"}\n          aria-describedby={describedById}\n          aria-owns={hasSuggestedSearch ? menuId : undefined}\n          aria-haspopup={options.length > 0 ? \"listbox\" : undefined}\n          ariaExpanded={expanded}\n          ariaActiveDescendant={ariaActiveDescendant}\n          aria-autocomplete={hasSuggestedSearch ? \"list\" : undefined}\n          role={hasSuggestedSearch ? \"combobox\" : undefined}\n          autocomplete={autocomplete}\n          autocapitalize={autocapitalize}\n          autoFocus={autofocus}\n          spellcheck={spellcheck}\n          inputmode=\"search\"\n        >\n          <div\n            class={{\n              \"clear-button-container\": true,\n              \"clear-button-visible\":\n                value && !disabledMode && this.showClearButton,\n            }}\n            slot=\"clear-button\"\n          >\n            <ic-button\n              id=\"clear-button\"\n              class=\"clear-button\"\n              aria-label=\"Clear\"\n              innerHTML={clearIcon}\n              onClick={this.handleClear}\n              size={dense ? \"dense\" : \"default\"}\n              onFocus={this.handleFocusClearButton}\n              onBlur={this.handleClearBlur}\n              onKeyDown={this.handleClear}\n              type=\"submit\"\n              variant=\"icon\"\n              buttonStyle={\n                this.clearButtonFocused\n                  ? IcThemeForegroundEnum.Light\n                  : IcThemeForegroundEnum.Dark\n              }\n            ></ic-button>\n            <div class=\"divider\"></div>\n          </div>\n          <div\n            class={{\n              \"search-submit-button-container\": true,\n              \"search-submit-button-disabled\":\n                valueNotSet || disabled || hadNoOptions,\n            }}\n            slot=\"search-submit-button\"\n          >\n            <ic-button\n              id=\"search-submit-button\"\n              aria-label=\"Search\"\n              ref={(el) => (this.searchSubmitButton = el)}\n              class={{\n                [\"search-submit-button\"]: true,\n                [\"search-submit-button-dense\"]: !!dense,\n              }}\n              disabled={valueNotSet || disabled || hadNoOptions}\n              innerHTML={searchIcon}\n              size={dense ? \"dense\" : \"default\"}\n              onClick={this.handleSubmitSearch}\n              onBlur={this.handleSubmitSearchBlur}\n              onFocus={this.handleSubmitSearchFocus}\n              type=\"submit\"\n              variant=\"icon\"\n              buttonStyle={\n                this.searchSubmitFocused\n                  ? IcThemeForegroundEnum.Light\n                  : IcThemeForegroundEnum.Default\n              }\n            ></ic-button>\n          </div>\n          <div\n            class={{\n              \"menu-container\": true,\n              fullwidth: fullWidth,\n            }}\n            slot=\"menu\"\n          >\n            {menuOpen && value.length >= this.charactersUntilSuggestion && (\n              <ic-menu\n                class={{\n                  \"no-results\": hadNoOptions,\n                }}\n                activationType=\"manual\"\n                anchorEl={this.anchorEl}\n                autoFocusOnSelected={false}\n                inputEl={this.inputEl}\n                inputLabel={label}\n                ref={(el) => (this.menu = el)}\n                dense={dense}\n                fullWidth={fullWidth}\n                menuId={menuId}\n                open={true}\n                options={filteredOptions}\n                onOptionSelect={this.handleOptionSelect}\n                onMenuChange={this.handleMenuChange}\n                parentEl={this.el}\n                value={value}\n              ></ic-menu>\n            )}\n          </div>\n        </ic-text-field>\n        <div\n          aria-live=\"polite\"\n          role=\"status\"\n          class=\"search-results-status\"\n        ></div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"ic-search-bar.js","mappings":"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","names":[],"sources":["./src/components/ic-search-bar/ic-search-bar.css?tag=ic-search-bar&encapsulation=shadow","./src/components/ic-search-bar/ic-search-bar.tsx"],"sourcesContent":["@import \"../../global/normalise.css\";\n\n:host(.search) {\n  --divider-height: 24px;\n}\n\n:host(.search.small) {\n  --divider-height: 16px;\n}\n\n:host(.fullwidth) {\n  width: 100%;\n}\n\n:host(.search) .disabled:hover {\n  border-color: var(--ic-architectural-200);\n}\n\n:host(.search.disabled) .disabled svg {\n  color: var(--ic-architectural-200);\n}\n\n:host(.search) .disabled svg {\n  color: var(--ic-architectural-400);\n}\n\n/* CLEAR */\n\n.clear-button-container {\n  align-items: center;\n  margin-right: 1px;\n  display: none;\n  visibility: hidden;\n}\n\n.clear-button {\n  border-radius: var(--ic-border-radius);\n  transition: box-shadow var(--ic-easing-transition),\n    border-radius var(--ic-easing-transition);\n}\n\n.clear-button:focus {\n  background-color: var(--ic-focus-blue);\n  box-shadow: inset 0 0 0 2px var(--ic-focus-glow);\n  border-radius: 4px;\n}\n\n.clear-button:focus * {\n  fill: white;\n}\n\n.clear-button-visible {\n  visibility: visible;\n  display: flex;\n}\n\n.search-submit-button-container {\n  display: flex;\n  align-items: center;\n}\n\n.search-submit-button-disabled .ic-tooltip-container {\n  display: none !important;\n}\n\n.search-submit-button:focus {\n  background-color: var(--ic-focus-blue) !important;\n  box-shadow: inset 0 0 0 2px var(--ic-focus-glow) !important;\n  border-radius: var(--ic-space-xxs);\n  height: var(--ic-space-xl);\n  margin-top: var(--ic-space-xxxs);\n}\n\n.search-submit-button:focus * {\n  fill: white;\n}\n\n.divider {\n  width: 1px;\n  background-color: var(--ic-action-dark-active);\n  height: var(--divider-height);\n}\n\n:host(.dark) .divider {\n  background-color: var(--ic-architectural-200);\n}\n\n.menu-container {\n  width: var(--input-width, 320px);\n  position: relative;\n  top: var(--ic-space-xxxs);\n}\n\n.menu-container.fullwidth {\n  width: 100%;\n}\n\nic-menu {\n  transition: var(--ic-easing-transition-slow);\n}\n\n.no-results {\n  cursor: not-allowed;\n}\n\n.search-results-status {\n  border: 0;\n  clip: rect(0, 0, 0, 0, 0);\n  height: 1px;\n  margin-bottom: -1px;\n  margin-right: -1px;\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Host,\n  Listen,\n  Prop,\n  State,\n  Watch,\n  Method,\n  h,\n} from \"@stencil/core\";\n\nimport {\n  IcAutocompleteTypes,\n  IcAutocorrectStates,\n  IcThemeForegroundEnum,\n  IcMenuOption,\n} from \"../../utils/types\";\nimport {\n  debounceEvent,\n  getInputDescribedByText,\n  renderHiddenInput,\n  handleHiddenFormButtonClick,\n  getLabelFromValue,\n  onComponentRequiredPropUndefined,\n  getFilteredMenuOptions,\n} from \"../../utils/helpers\";\nimport { IcSearchBarBlurEventDetail } from \"./ic-search-bar.types\";\nimport { IcValueEventDetail, IcBlurEventDetail } from \"../../interface\";\nimport {\n  IcMenuChangeEventDetail,\n  IcOptionSelectEventDetail,\n} from \"../ic-menu/ic-menu.types\";\n\nimport clearIcon from \"../../assets/clear-icon.svg\";\nimport searchIcon from \"../../assets/search-icon.svg\";\n\nlet inputIds = 0;\n\n@Component({\n  tag: \"ic-search-bar\",\n  styleUrl: \"ic-search-bar.css\",\n  shadow: true,\n})\nexport class SearchBar {\n  @Element() el: HTMLIcSearchBarElement;\n\n  private inputId = `ic-search-bar-input-${inputIds++}`;\n  private inputEl: HTMLIcTextFieldElement;\n\n  private menuId = `${this.inputId}-menu`;\n  private searchSubmitButton: HTMLIcButtonElement;\n  private menu: HTMLIcMenuElement;\n  private menuCloseFromMenuChangeEvent: boolean = false;\n\n  private anchorEl: HTMLElement;\n  private truncateValue = false;\n\n  private assistiveHintEl: HTMLSpanElement = null;\n  private preventSubmit: boolean = false;\n\n  /**\n   * Provide a label for the input.\n   */\n  @Prop() label!: string;\n\n  /**\n   * Specify if the input requires a value.\n   */\n  @Prop() required?: boolean = false;\n  /**\n   * Specify whether the input is disabled.\n   */\n  @Prop() disabled?: boolean = false;\n\n  /**\n   * Specify whether the input is read only.\n   */\n  @Prop() readonly?: boolean = false;\n\n  /**\n   * Provide a placeholder value to display.\n   */\n  @Prop() placeholder?: string = \"Search\";\n\n  /**\n   * Specify whether the component fills the full width of the container.\n   * If true, this overrides the --input-width css prop.\n   */\n  @Prop() fullWidth?: boolean = false;\n\n  /**\n   * Specify whether to disable the built in filtering. For example, if options will already be filtered from external source.\n   * If true, all options provided will be displayed.\n   */\n  @Prop() disableFilter?: boolean = false;\n\n  /**\n   * Hides the label and applies the required label value as an aria-label.\n   */\n  @Prop() hideLabel?: boolean = false;\n\n  /**\n   * Provide helper text to display additional field guidance.\n   */\n  @Prop() helperText?: string = \"\";\n\n  /**\n   * Specify whether small styling is to be applied to the element.\n   */\n  @Prop() small?: boolean = false;\n\n  /**\n   * Value of Search input.\n   */\n  @Prop({ reflect: true, mutable: true }) value: string = \"\";\n\n  /**\n   * Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user.\n   * Available options: \"off\", \"none\", \"on\", \"sentences\", \"words\", \"characters\".\n   */\n  @Prop() autocapitalize = \"off\";\n\n  /**\n   * Indicates whether the value of the control can be automatically completed by the browser.\n   */\n  @Prop() autocomplete?: IcAutocompleteTypes = \"off\";\n\n  /**\n   * Whether auto correction should be enabled when the user is entering/editing the text value.\n   */\n  @Prop() autocorrect?: IcAutocorrectStates = \"off\";\n\n  /**\n   * This Boolean attribute lets you specify that a form control should have input focus when the page loads.\n   */\n  @Prop() autofocus = false;\n\n  /**\n   * Set the amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.\n   */\n  @Prop({ mutable: true }) debounce?: number = 0;\n\n  @Watch(\"debounce\")\n  private debounceChanged() {\n    this.icChange = debounceEvent(this.icChange, this.debounce);\n  }\n\n  /**\n   * The name of the control, which is submitted with the form data.\n   */\n  @Prop() name: string = this.inputId;\n\n  /**\n   * If `true`, the element will have its spelling and grammar checked.\n   */\n  @Prop() spellcheck: boolean = false;\n  /**\n   * Provide the suggested search options\n   */\n  @Prop() options?: IcMenuOption[] = [];\n\n  @Watch(\"options\")\n  watchOptionsHandler(newOptions: IcMenuOption[]): void {\n    if (this.disableFilter) {\n      this.filteredOptions = newOptions;\n    }\n  }\n\n  /**\n   * Specify whether the input should be focussed when component loaded.\n   */\n  @Prop() focusOnLoad?: boolean = false;\n\n  /**\n   * Provide hint text for hidden assistive description element.\n   */\n  @Prop() hintText?: string =\n    \"When autocomplete results are available use the up and down arrows to choose and press enter to select\";\n\n  /**\n   * Provide text for empty results list\n   */\n  @Prop() emptyOptionListText = \"No results found\";\n\n  /**\n   * Number of characters until suggestions appear\n   */\n  @Prop() charactersUntilSuggestion: number = 2;\n\n  @Watch(\"value\")\n  watchValueHandler(newValue: string): void {\n    if (\n      this.inputEl &&\n      this.options &&\n      !!getLabelFromValue(newValue, this.options)\n    ) {\n      this.inputEl.value = getLabelFromValue(newValue, this.options);\n    } else if (this.inputEl && this.inputEl.value !== newValue) {\n      this.inputEl.value = newValue;\n    }\n\n    this.icChange.emit({ value: newValue });\n  }\n\n  /**\n   * Sets focus on the native `input`\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    if (this.inputEl) {\n      this.inputEl.setFocus();\n    }\n  }\n\n  @Listen(\"icKeydown\", {})\n  handleKeyDown(ev: CustomEvent): void {\n    const keyEv: KeyboardEvent = ev.detail.event;\n    if (this.menu && this.open) {\n      this.menu.handleKeyboardOpen(keyEv);\n    }\n  }\n\n  @Listen(\"keyup\", {})\n  handleKeyUp(ev: KeyboardEvent): void {\n    if (ev.key === \"Enter\") {\n      if (this.preventSubmit) {\n        return;\n      }\n\n      this.handleSubmitSearch();\n      this.setMenuChange(false);\n    }\n\n    if (ev.key === \"Escape\") {\n      this.setMenuChange(false);\n    }\n\n    if (this.preventSubmit) {\n      this.preventSubmit = false;\n    }\n  }\n\n  private handleSubmitSearch = () => {\n    this.icSubmitSearch.emit({ value: this.value });\n\n    const form: HTMLFormElement = this.el.closest(\"FORM\");\n\n    if (this.searchSubmitButton && !!form && !this.preventSubmit) {\n      handleHiddenFormButtonClick(form, this.searchSubmitButton);\n    }\n  };\n\n  /**\n   * Emitted when a keyboard input occurred.\n   */\n  @Event() icInput: EventEmitter<IcValueEventDetail>;\n  private onInput = (ev: Event) => {\n    this.value = (ev.target as HTMLInputElement).value;\n\n    if (this.options.length > 0) {\n      this.setMenuChange(true);\n\n      if (this.disableFilter === false) {\n        const rawFilteredOptions = getFilteredMenuOptions(\n          this.options,\n          false,\n          this.value,\n          \"anywhere\"\n        );\n\n        const noOptions = [{ label: this.emptyOptionListText, value: \"\" }];\n\n        this.filteredOptions =\n          rawFilteredOptions.length > 0 ? rawFilteredOptions : noOptions;\n      }\n    }\n\n    if (!this.showClearButton) {\n      this.handleShowClearButton(true);\n    }\n\n    this.debounceAriaLiveUpdate();\n\n    this.icInput.emit({ value: this.value });\n  };\n\n  private debounceAriaLiveUpdate() {\n    clearTimeout(this.debounce);\n\n    this.debounce = window.setTimeout(() => {\n      this.updateSearchResultAriaLive();\n    }, 500);\n  }\n\n  /**\n   * Emitted when input loses focus.\n   */\n  @Event() icInputBlur: EventEmitter<IcSearchBarBlurEventDetail>;\n  private onInputBlur = (ev: Event) => {\n    const value = (ev.target as HTMLInputElement).value;\n    const nextFocus = (ev as FocusEvent).relatedTarget;\n\n    this.icInputBlur.emit({ value: value, relatedTarget: nextFocus });\n  };\n\n  /**\n   * Emitted when input gains focus.\n   */\n  @Event() icInputFocus: EventEmitter<IcValueEventDetail>;\n  private onInputFocus = (ev: Event) => {\n    const value = (ev.target as HTMLInputElement).value;\n    this.icInputFocus.emit({ value: value });\n\n    this.handleShowClearButton(true);\n  };\n\n  /**\n   * Emitted when the value has changed.\n   */\n  @Event() icChange: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when value is cleared with clear button\n   */\n  @Event() icClear: EventEmitter<void>;\n  private handleClear = (ev: Event) => {\n    const keyboardEvent = ev as KeyboardEvent;\n    const mouseEvent = ev as MouseEvent;\n\n    if (\n      mouseEvent.type === \"click\" ||\n      keyboardEvent.code === \"Enter\" ||\n      keyboardEvent.code === \"Space\"\n    ) {\n      this.value = \"\";\n      this.inputEl.value = \"\";\n      this.el.setFocus();\n\n      this.icClear.emit();\n      ev.preventDefault();\n\n      this.preventSubmit = true;\n    }\n  };\n\n  /**\n   * Emitted when the search value has been submitted\n   */\n  @Event() icSubmitSearch: EventEmitter<IcValueEventDetail>;\n\n  /**\n   * Emitted when option is highlighted within the menu\n   */\n  @Event() icOptionSelect: EventEmitter<IcOptionSelectEventDetail>;\n\n  /**\n   * Emitted when the state of the menu changes (i.e. open or close)\n   */\n  @Event() icMenuChange: EventEmitter<IcMenuChangeEventDetail>;\n  /**\n   * @internal - Emitted when blur is invoked from clear button\n   */\n  @Event() icClearBlur: EventEmitter<IcBlurEventDetail>;\n  private handleClearBlur = (ev: Event) => {\n    const nextFocus = (ev as FocusEvent).relatedTarget;\n\n    this.icClearBlur.emit({ relatedTarget: nextFocus });\n\n    this.clearButtonFocused = false;\n  };\n\n  /**\n   * @internal - Emitted when blur is invoked from search submit button\n   */\n  @Event() icSubmitSearchBlur: EventEmitter<IcBlurEventDetail>;\n  private handleSubmitSearchBlur = (ev: Event) => {\n    const nextFocus = (ev as FocusEvent).relatedTarget;\n\n    this.icSubmitSearchBlur.emit({ relatedTarget: nextFocus });\n\n    this.searchSubmitFocused = false;\n  };\n\n  private handleSubmitSearchFocus = () => {\n    this.handleMenuCloseFromMenuChange(true);\n    this.searchSubmitFocused = true;\n  };\n\n  /**\n   * Emitted when blur is invoked from ic-search-bar\n   */\n  @Event() icSearchBarBlur: EventEmitter<IcSearchBarBlurEventDetail>;\n\n  /**\n   * Emitted when focus is invoked from ic-search-bar\n   */\n  @Event() icSearchBarFocus: EventEmitter<void>;\n\n  @State() open: boolean = false;\n  @State() filteredOptions: IcMenuOption[] = [];\n  @State() ariaActiveDescendant: string;\n  @State() showClearButton: boolean = false;\n  @State() clearButtonFocused: boolean = false;\n  @State() searchSubmitFocused: boolean = false;\n  @State() prevNoOption: boolean = false;\n\n  private handleOptionSelect = (ev: CustomEvent) => {\n    if (ev.detail.label === this.emptyOptionListText) {\n      this.el.setFocus();\n      return;\n    }\n\n    this.value = ev.detail.value;\n    this.icOptionSelect.emit({ value: this.value });\n  };\n\n  private handleMenuChange = (ev: CustomEvent) => {\n    this.setMenuChange(ev.detail.open);\n  };\n\n  private setMenuChange = (open: boolean) => {\n    if (this.open !== open) {\n      this.open = open;\n      this.icMenuChange.emit({ open });\n    }\n  };\n\n  private handleHostFocus = () => {\n    if (this.options && this.value && !this.menuCloseFromMenuChangeEvent) {\n      this.setMenuChange(true);\n    }\n    this.handleTruncateValue(false);\n\n    this.icSearchBarFocus.emit();\n  };\n\n  private handleHostBlur = (ev: Event) => {\n    const nextFocus = (ev as FocusEvent).relatedTarget;\n    if (this.open && this.options && nextFocus !== this.menu) {\n      this.setMenuChange(false);\n    }\n\n    this.handleShowClearButton(false);\n    this.handleMenuCloseFromMenuChange(false);\n    this.handleTruncateValue(true);\n    this.icSearchBarBlur.emit({ relatedTarget: nextFocus, value: this.value });\n  };\n\n  @Listen(\"menuChange\", {})\n  onMenuClose(ev: CustomEvent): void {\n    if (!ev.detail.open) {\n      this.handleMenuCloseFromMenuChange(true);\n      if (ev.detail.focusInput === undefined || ev.detail.focusInput) {\n        this.el.setFocus();\n      }\n    }\n  }\n\n  @Listen(\"menuOptionId\")\n  onMenuOptionHighlighted(ev: CustomEvent): void {\n    if (ev.detail.optionId) {\n      this.ariaActiveDescendant = ev.detail.optionId;\n    } else {\n      this.ariaActiveDescendant = undefined;\n    }\n  }\n\n  private handleShowClearButton = (visible: boolean): void => {\n    this.showClearButton = visible;\n  };\n\n  private handleFocusClearButton = (): void => {\n    this.clearButtonFocused = true;\n  };\n\n  private handleMenuCloseFromMenuChange = (fromEvent: boolean): void => {\n    this.menuCloseFromMenuChangeEvent = fromEvent;\n  };\n\n  private handleTruncateValue = (truncate: boolean): void => {\n    this.truncateValue = truncate;\n  };\n\n  private renderAssistiveHintEl = (): void => {\n    const input = this.el.shadowRoot\n      .querySelector(\"ic-text-field\")\n      ?.shadowRoot?.querySelector(`#${this.inputId}`);\n\n    if (\n      input &&\n      Object.keys(input).length > 0 &&\n      this.hasOptionsOrFilterDisabled()\n    ) {\n      this.assistiveHintEl = document.createElement(\"span\");\n      this.assistiveHintEl.innerText = this.hintText;\n      this.assistiveHintEl.id = `${this.inputId}-assistive-hint`;\n      this.assistiveHintEl.style.display = \"none\";\n      if (input.after !== undefined) {\n        input.after(this.assistiveHintEl);\n      }\n    }\n  };\n\n  private updateSearchResultAriaLive = (): void => {\n    const searchResultsStatusEl = this.el.shadowRoot.querySelector(\n      \".search-results-status\"\n    ) as HTMLParagraphElement;\n\n    if (!this.open || this.value === \"\") {\n      searchResultsStatusEl.innerText = \"\";\n    } else if (\n      this.options.length > 0 &&\n      this.filteredOptions.length > 0 &&\n      this.open &&\n      searchResultsStatusEl\n    ) {\n      searchResultsStatusEl.innerText = `${this.filteredOptions.length} result${\n        this.filteredOptions.length > 1 ? \"s\" : \"\"\n      } available`;\n    }\n  };\n\n  private hasOptionsOrFilterDisabled = (): boolean =>\n    this.options.length > 0 || this.disableFilter;\n\n  private highlightFirstOptionAfterNoResults = () => {\n    if (this.prevNoOption && this.menu) {\n      this.menu.handleSetFirstOption();\n      this.prevNoOption = false;\n    }\n    const prevNoOptionsList = this.filteredOptions.find(\n      (filteredOption) => filteredOption.label === this.emptyOptionListText\n    );\n    if (prevNoOptionsList) {\n      this.prevNoOption = true;\n    }\n  };\n\n  connectedCallback(): void {\n    this.debounceChanged();\n  }\n\n  componentWillRender(): void {\n    this.highlightFirstOptionAfterNoResults();\n  }\n\n  componentWillLoad(): void {\n    this.watchValueHandler(this.value);\n  }\n\n  componentDidLoad(): void {\n    if (this.focusOnLoad) {\n      this.el.setFocus();\n    }\n\n    if (this.hasOptionsOrFilterDisabled()) {\n      this.renderAssistiveHintEl();\n      if (this.disableFilter) {\n        this.filteredOptions = this.options;\n      }\n    }\n\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Search Bar\"\n    );\n\n    this.anchorEl = this.inputEl.shadowRoot.querySelector(\n      \"ic-input-component-container\"\n    );\n  }\n\n  disconnectedCallback(): void {\n    if (this.assistiveHintEl) {\n      this.assistiveHintEl.remove();\n    }\n  }\n\n  render() {\n    const {\n      inputId,\n      name,\n      label,\n      required,\n      small,\n      placeholder,\n      helperText,\n      disabled,\n      value,\n      readonly,\n      spellcheck,\n      fullWidth,\n      options,\n      open,\n      hideLabel,\n      menuId,\n      ariaActiveDescendant,\n      truncateValue,\n      autofocus,\n      autocapitalize,\n      autocomplete,\n      filteredOptions,\n    } = this;\n\n    const disabledMode = readonly || disabled ? true : false;\n\n    const describedBy = getInputDescribedByText(\n      inputId,\n      helperText !== \"\",\n      false\n    ).trim();\n\n    let describedById;\n\n    if (describedBy !== \"\" && this.hasOptionsOrFilterDisabled()) {\n      describedById = `${describedBy} ${this.inputId}-assistive-hint`;\n    } else if (this.hasOptionsOrFilterDisabled()) {\n      describedById = `${this.inputId}-assistive-hint`;\n    } else if (describedBy !== \"\") {\n      describedById = describedBy;\n    } else {\n      describedById = undefined;\n    }\n\n    const disabledText = disabledMode && !readonly;\n    const hasSuggestedSearch = value && options.length > 0;\n    const valueNotSet = value === undefined || value === null || value === \"\";\n    const menuOpen = hasSuggestedSearch && open && filteredOptions.length > 0;\n\n    const hadNoOptions =\n      filteredOptions.length > 0 &&\n      filteredOptions[0].label === this.emptyOptionListText;\n\n    let expanded;\n\n    if (options.length > 0) {\n      if (menuOpen) {\n        expanded = \"true\";\n      } else {\n        expanded = \"false\";\n      }\n    } else {\n      expanded = undefined;\n    }\n\n    renderHiddenInput(true, this.el, name, value, disabledMode);\n\n    return (\n      <Host\n        class={{\n          [\"search\"]: true,\n          [\"fullwidth\"]: fullWidth,\n          [\"disabled\"]: disabled,\n          [\"small\"]: small,\n        }}\n        onFocus={this.handleHostFocus}\n        onBlur={this.handleHostBlur}\n      >\n        <ic-text-field\n          ref={(el) => (this.inputEl = el)}\n          inputId={inputId}\n          label={label}\n          helperText={helperText}\n          required={required}\n          disabled={disabledText}\n          readonly={readonly}\n          small={small}\n          hideLabel={hideLabel}\n          fullWidth={fullWidth}\n          name={name}\n          truncateValue={truncateValue}\n          value={\n            options && !!getLabelFromValue(value, options)\n              ? getLabelFromValue(value, options)\n              : value\n          }\n          placeholder={placeholder}\n          onInput={this.onInput}\n          onBlur={this.onInputBlur}\n          onFocus={this.onInputFocus}\n          aria-label={hideLabel ? label : \"\"}\n          aria-describedby={describedById}\n          aria-owns={hasSuggestedSearch ? menuId : undefined}\n          aria-haspopup={options.length > 0 ? \"listbox\" : undefined}\n          ariaExpanded={expanded}\n          ariaActiveDescendant={ariaActiveDescendant}\n          aria-autocomplete={hasSuggestedSearch ? \"list\" : undefined}\n          role={hasSuggestedSearch ? \"combobox\" : undefined}\n          autocomplete={autocomplete}\n          autocapitalize={autocapitalize}\n          autoFocus={autofocus}\n          spellcheck={spellcheck}\n          inputmode=\"search\"\n        >\n          <div\n            class={{\n              \"clear-button-container\": true,\n              \"clear-button-visible\":\n                value && !disabledMode && this.showClearButton,\n            }}\n            slot=\"clear-button\"\n          >\n            <ic-button\n              id=\"clear-button\"\n              class=\"clear-button\"\n              aria-label=\"Clear\"\n              innerHTML={clearIcon}\n              onClick={this.handleClear}\n              size={small ? \"small\" : \"default\"}\n              onFocus={this.handleFocusClearButton}\n              onBlur={this.handleClearBlur}\n              onKeyDown={this.handleClear}\n              type=\"submit\"\n              variant=\"icon\"\n              appearance={\n                this.clearButtonFocused\n                  ? IcThemeForegroundEnum.Light\n                  : IcThemeForegroundEnum.Dark\n              }\n            ></ic-button>\n            <div class=\"divider\"></div>\n          </div>\n          <div\n            class={{\n              \"search-submit-button-container\": true,\n              \"search-submit-button-disabled\":\n                valueNotSet || disabled || hadNoOptions,\n            }}\n            slot=\"search-submit-button\"\n          >\n            <ic-button\n              id=\"search-submit-button\"\n              aria-label=\"Search\"\n              ref={(el) => (this.searchSubmitButton = el)}\n              class={{\n                [\"search-submit-button\"]: true,\n                [\"search-submit-button-small\"]: !!small,\n              }}\n              disabled={valueNotSet || disabled || hadNoOptions}\n              innerHTML={searchIcon}\n              size={small ? \"small\" : \"default\"}\n              onClick={this.handleSubmitSearch}\n              onBlur={this.handleSubmitSearchBlur}\n              onFocus={this.handleSubmitSearchFocus}\n              type=\"submit\"\n              variant=\"icon\"\n              appearance={\n                this.searchSubmitFocused\n                  ? IcThemeForegroundEnum.Light\n                  : IcThemeForegroundEnum.Default\n              }\n            ></ic-button>\n          </div>\n          <div\n            class={{\n              \"menu-container\": true,\n              fullwidth: fullWidth,\n            }}\n            slot=\"menu\"\n          >\n            {menuOpen && value.length >= this.charactersUntilSuggestion && (\n              <ic-menu\n                class={{\n                  \"no-results\": hadNoOptions,\n                }}\n                activationType=\"manual\"\n                anchorEl={this.anchorEl}\n                autoFocusOnSelected={false}\n                inputEl={this.inputEl}\n                inputLabel={label}\n                ref={(el) => (this.menu = el)}\n                small={small}\n                fullWidth={fullWidth}\n                menuId={menuId}\n                open={true}\n                options={filteredOptions}\n                onOptionSelect={this.handleOptionSelect}\n                onMenuChange={this.handleMenuChange}\n                parentEl={this.el}\n                value={value}\n              ></ic-menu>\n            )}\n          </div>\n        </ic-text-field>\n        <div\n          aria-live=\"polite\"\n          role=\"status\"\n          class=\"search-results-status\"\n        ></div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/ic-select.js

@@ -1,5 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { v as getLabelFromValue, t as getFilteredMenuOptions, k as inheritAttributes, a as onComponentRequiredPropUndefined, r as renderHiddenInput, d as getInputDescribedByText, h as hasValidationStatus, w as isMobileOrTablet, I as IcThemeForegroundEnum, l as IC_INHERITED_ARIA, x as IcInformationStatus } from './helpers.js';
+import { w as getLabelFromValue, u as getFilteredMenuOptions, l as inheritAttributes, b as addFormResetListener, a as onComponentRequiredPropUndefined, r as removeFormResetListener, d as renderHiddenInput, f as getInputDescribedByText, h as hasValidationStatus, x as isMobileOrTablet, m as IC_INHERITED_ARIA } from './helpers.js';
+import { I as IcThemeForegroundEnum, a as IcInformationStatus } from './types.js';
 import { d as defineCustomElement$a } from './ic-button2.js';
 import { d as defineCustomElement$9 } from './ic-input-component-container2.js';
 import { d as defineCustomElement$8 } from './ic-input-container2.js';
@@ -20,7 +21,7 @@ const Clear = `<svg width="16" height="16" viewBox="0 0 16 16" xmlns="http://www
 </svg>
 `;
 
-const icSelectCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}ic-input-component-container:hover{--border-color:var(--ic-action-dark-hover)}ic-input-component-container:active{--border-color:var(--ic-action-dark-active);color:var(--ic-action-dark-active)}ic-input-component-container.menu-open{--border-color:var(--ic-architectural-400);color:var(--ic-action-dark)}ic-input-validation .status-icon,ic-input-validation .statustext{visibility:visible}ic-input-validation.menu-open .status-icon,ic-input-validation.menu-open .statustext{visibility:hidden;transition:visibility 0s}ic-input-label{margin-bottom:var(--ic-space-xs) !important}select{border:0;border-radius:var(--ic-border-radius);background-color:var(--ic-architectural-white);color:var(--ic-color-primary-text);line-height:1.5rem;letter-spacing:0.005rem;width:100%;height:100%;padding-left:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-repeat:no-repeat;background-position:right 6px center;background-image:url(\"data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>\")}select option,.select-option-selected{color:var(--ic-color-primary-text)}select:disabled{color:var(--ic-architectural-200);background-image:url(\"data:image/svg+xml;utf8,<svg fill='grey' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>\")}select:focus{border:0;outline:0}select:not([disabled]){cursor:pointer}.select-container{width:100%;display:flex;align-items:center}.select-input{width:100%;height:100%;padding:0 6px;display:flex;cursor:pointer;align-items:center;justify-content:space-between;background:none;border:none}.select-input:focus{outline:none}:host(:not([disabled])) ic-input-component-container:hover .select-input{background-color:var(--ic-architectural-white)}:host([disabled]) .select-input{pointer-events:none}:host([searchable]) .select-input{cursor:auto}.searchable-select-container{align-items:center;display:flex;width:100%}.expand-icon{height:var(--ic-space-lg);padding-left:var(--ic-space-xs);color:var(--expand-icon-hover, var(--ic-architectural-400))}:host([disabled]) .expand-icon,:host([disabled]) .expand-icon>svg>path{color:var(--ic-architectural-200)}:host([searchable]) .expand-icon{padding-left:var(--ic-space-xxs);height:36px}:host([searchable]) .expand-icon>svg{height:36px;padding:0 6px}:host([searchable]:not([disabled])) .expand-icon>svg{cursor:pointer}.expand-icon-open{color:var(--ic-action-dark)}.expand-icon-filled{color:var(--ic-action-dark)}.expand-icon-open,:host([searchable]) .expand-icon-open{transform:rotateX(180deg)}:host([disabled]) .value-text,.placeholder{color:var(--ic-color-tertiary-text)}.select-input-end{display:flex;align-items:center}.clear-button-container{display:flex;gap:var(--ic-space-xxs);padding-left:38px}:host([dense]) .clear-button-container{padding-left:30px}.divider{width:1px;background-color:var(--ic-architectural-400);margin:var(--ic-space-xxs) 0;border-radius:1px;height:var(--ic-space-lg)}:host([dense]) .divider{height:var(--ic-space-md)}.clear-button{position:absolute;right:44px;border-radius:var(--ic-border-radius);transition:box-shadow var(--ic-easing-transition),\n    border-radius var(--ic-easing-transition)}.clear-button:focus{background-color:var(--ic-focus-blue);box-shadow:inset 0 0 0 2px var(--ic-focus-glow);border-radius:4px}.clear-button:focus *{fill:white}.searchable-select-results-status{border:0;clip:rect(0, 0, 0, 0, 0);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}";
+const icSelectCss = "/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-webkit-text-size-adjust:100%;}body{margin:0}main{display:block}h1{font-size:2em;margin:0.67em 0}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace, monospace;font-size:1em;}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace, monospace;font-size:1em;}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible}button,select{text-transform:none}button,[type=\"button\"],[type=\"reset\"],[type=\"submit\"]{-webkit-appearance:button}button::-moz-focus-inner,[type=\"button\"]::-moz-focus-inner,[type=\"reset\"]::-moz-focus-inner,[type=\"submit\"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=\"button\"]:-moz-focusring,[type=\"reset\"]:-moz-focusring,[type=\"submit\"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:0.35em 0.75em 0.625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline}textarea{overflow:auto}[type=\"checkbox\"],[type=\"radio\"]{box-sizing:border-box;padding:0;}[type=\"number\"]::-webkit-inner-spin-button,[type=\"number\"]::-webkit-outer-spin-button{height:auto}[type=\"search\"]{-webkit-appearance:textfield;outline-offset:-2px;}[type=\"search\"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font-style:inherit;vertical-align:baseline}ic-input-component-container:hover{--border-color:var(--ic-action-dark-hover)}ic-input-component-container:active{--border-color:var(--ic-action-dark-active);color:var(--ic-action-dark-active)}ic-input-component-container.menu-open{--border-color:var(--ic-architectural-400);color:var(--ic-action-dark)}ic-input-validation .status-icon,ic-input-validation .statustext{visibility:visible}ic-input-validation.menu-open .status-icon,ic-input-validation.menu-open .statustext{visibility:hidden;transition:visibility 0s}ic-input-label{margin-bottom:var(--ic-space-xs) !important}select{border:0;border-radius:var(--ic-border-radius);background-color:var(--ic-architectural-white);color:var(--ic-color-primary-text);line-height:1.5rem;letter-spacing:0.005rem;width:100%;height:100%;padding-left:6px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-repeat:no-repeat;background-position:right 6px center;background-image:url(\"data:image/svg+xml;utf8,<svg fill='black' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>\")}select option,.select-option-selected{color:var(--ic-color-primary-text)}select:disabled{color:var(--ic-architectural-200);background-image:url(\"data:image/svg+xml;utf8,<svg fill='grey' height='24' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>\")}select:focus{border:0;outline:0}select:not([disabled]){cursor:pointer}.select-container{width:100%;display:flex;align-items:center}.select-input{width:100%;height:100%;padding:0 6px;display:flex;cursor:pointer;align-items:center;justify-content:space-between;background:none;border:none}.select-input:focus{outline:none}:host(:not([disabled])) ic-input-component-container:hover .select-input{background-color:var(--ic-architectural-white)}:host([disabled]) .select-input{pointer-events:none}:host([searchable]) .select-input{cursor:auto}.searchable-select-container{align-items:center;display:flex;width:100%}.expand-icon{height:var(--ic-space-lg);padding-left:var(--ic-space-xs);color:var(--expand-icon-hover, var(--ic-architectural-400))}:host([disabled]) .expand-icon,:host([disabled]) .expand-icon>svg>path{color:var(--ic-architectural-200)}:host([searchable]) .expand-icon{padding-left:var(--ic-space-xxs);height:36px}:host([searchable]) .expand-icon>svg{height:36px;padding:0 6px}:host([searchable]:not([disabled])) .expand-icon>svg{cursor:pointer}.expand-icon-open{color:var(--ic-action-dark)}.expand-icon-filled{color:var(--ic-action-dark)}.expand-icon-open,:host([searchable]) .expand-icon-open{transform:rotateX(180deg)}:host([disabled]) .value-text,.placeholder{color:var(--ic-color-tertiary-text)}.select-input-end{display:flex;align-items:center}.clear-button-container{display:flex;gap:var(--ic-space-xxs);padding-left:38px}:host([small]) .clear-button-container{padding-left:30px}.divider{width:1px;background-color:var(--ic-architectural-400);margin:var(--ic-space-xxs) 0;border-radius:1px;height:var(--ic-space-lg)}:host([small]) .divider{height:var(--ic-space-md)}.clear-button{position:absolute;right:44px;border-radius:var(--ic-border-radius);transition:box-shadow var(--ic-easing-transition),\n    border-radius var(--ic-easing-transition)}.clear-button:focus{background-color:var(--ic-focus-blue);box-shadow:inset 0 0 0 2px var(--ic-focus-glow);border-radius:4px}.clear-button:focus *{fill:white}.searchable-select-results-status{border:0;clip:rect(0, 0, 0, 0, 0);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}";
 
 let inputIds = 0;
 const Select = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
@@ -244,6 +245,12 @@ const Select = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       }
       this.icBlur.emit();
     };
+    this.handleFormReset = () => {
+      this.value = this.initialValue;
+      if (this.searchable) {
+        this.searchableSelectInputValue = null;
+      }
+    };
     this.label = undefined;
     this.options = [];
     this.required = false;
@@ -252,7 +259,7 @@ const Select = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.readonly = false;
     this.placeholder = "Select an option";
     this.helperText = "";
-    this.dense = false;
+    this.small = false;
     this.fullWidth = false;
     this.validationStatus = "";
     this.validationText = "";
@@ -271,6 +278,7 @@ const Select = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     this.filteredOptions = this.options;
     this.ariaActiveDescendant = undefined;
     this.noOptions = null;
+    this.initialValue = this.value;
   }
   watchOptionsHandler() {
     this.setOptionsValuesFromLabels();
@@ -303,6 +311,7 @@ const Select = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
       "title",
     ]);
     this.setOptionsValuesFromLabels();
+    addFormResetListener(this.host, this.handleFormReset);
   }
   componentDidRender() {
     if (this.nativeSelectElement && !this.disabled) {
@@ -312,12 +321,15 @@ const Select = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   componentDidLoad() {
     onComponentRequiredPropUndefined([{ prop: this.label, propName: "label" }], "Select");
   }
+  disconnectedCallback() {
+    removeFormResetListener(this.host, this.handleFormReset);
+  }
   render() {
-    const { dense, disabled, fullWidth, helperText, hideLabel, label, menuId, name, options, placeholder, readonly, required, searchable, showClearButton, validationStatus, validationText, value, } = this;
+    const { small, disabled, fullWidth, helperText, hideLabel, label, menuId, name, options, placeholder, readonly, required, searchable, showClearButton, validationStatus, validationText, value, } = this;
     renderHiddenInput(true, this.host, name, value, disabled);
     const invalid = validationStatus === IcInformationStatus.Error ? "true" : "false";
     const describedBy = getInputDescribedByText(this.inputId, helperText !== "", hasValidationStatus(this.validationStatus, this.disabled)).trim();
-    return (h(Host, null, h("ic-input-container", { readonly: readonly }, !hideLabel && (h("ic-input-label", { for: this.inputId, label: label, helperText: helperText, required: required, disabled: disabled, readonly: readonly })), h("ic-input-component-container", { ref: (el) => (this.anchorEl = el), class: { "menu-open": this.open }, dense: dense, fullWidth: fullWidth, disabled: disabled, readonly: readonly, validationStatus: validationStatus }, readonly ? (h("ic-typography", null, h("p", null, this.getLabelFromValue(value)))) : isMobileOrTablet() ? (h("select", Object.assign({ ref: (el) => (this.nativeSelectElement = el), disabled: disabled, onChange: this.handleNativeSelectChange, required: required, id: this.inputId, "aria-label": label, "aria-describedby": describedBy, "aria-invalid": invalid, onBlur: this.onBlur, onFocus: this.onFocus }, this.inheritedAttributes), h("option", { value: "", selected: true, disabled: !showClearButton }, placeholder), options.map((option) => {
+    return (h(Host, null, h("ic-input-container", { readonly: readonly }, !hideLabel && (h("ic-input-label", { for: this.inputId, label: label, helperText: helperText, required: required, disabled: disabled, readonly: readonly })), h("ic-input-component-container", { ref: (el) => (this.anchorEl = el), class: { "menu-open": this.open }, small: small, fullWidth: fullWidth, disabled: disabled, readonly: readonly, validationStatus: validationStatus }, readonly ? (h("ic-typography", null, h("p", null, this.getLabelFromValue(value)))) : isMobileOrTablet() ? (h("select", Object.assign({ ref: (el) => (this.nativeSelectElement = el), disabled: disabled, onChange: this.handleNativeSelectChange, required: required, id: this.inputId, "aria-label": label, "aria-describedby": describedBy, "aria-invalid": invalid, onBlur: this.onBlur, onFocus: this.onFocus }, this.inheritedAttributes), h("option", { value: "", selected: true, disabled: !showClearButton }, placeholder), options.map((option) => {
       if (option.children) {
         return (h("optgroup", { label: option.label }, option.children.map((option) => (h("option", { value: option.value, disabled: option.disabled, selected: option.value === value }, option.label)))));
       }
@@ -327,7 +339,7 @@ const Select = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     }))) : searchable ? (h("div", { class: "searchable-select-container" }, h("input", { class: "select-input", role: "combobox", "aria-label": label, "aria-describedby": describedBy, "aria-activedescendant": this.ariaActiveDescendant, "aria-autocomplete": "list", "aria-expanded": this.open ? "true" : "false", "aria-invalid": invalid, "aria-required": required ? "true" : "false", "aria-controls": menuId, ref: (el) => (this.searchableSelectElement = el), id: this.inputId, value: this.searchableSelectInputValue, placeholder: placeholder, disabled: disabled, onInput: this.handleSearchableSelectInput, onClick: this.handleClick, onKeyDown: this.handleKeyDown, onFocus: this.onFocus, onBlur: this.onBlur }), this.searchableSelectInputValue &&
       (showClearButton || searchable) && (h("div", { class: "clear-button-container" }, h("ic-button", { id: "clear-button", ref: (el) => (this.clearButton = el), "aria-label": this.searchableSelectInputValue && value === null
         ? "Clear input"
-        : "Clear selection", class: "clear-button", innerHTML: Clear, onClick: this.handleClear, onFocus: this.handleClearButtonFocus, onBlur: this.handleClearButtonBlur, size: dense ? "dense" : "default", variant: "icon", buttonStyle: this.clearButtonFocused
+        : "Clear selection", class: "clear-button", innerHTML: Clear, onClick: this.handleClear, onFocus: this.handleClearButtonFocus, onBlur: this.handleClearButtonBlur, size: small ? "small" : "default", variant: "icon", appearance: this.clearButtonFocused
         ? IcThemeForegroundEnum.Light
         : IcThemeForegroundEnum.Dark }), h("div", { class: "divider" }))), h("span", { onMouseDown: this.handleExpandIconMouseDown, class: {
         "expand-icon": true,
@@ -341,13 +353,13 @@ const Select = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
         "expand-icon": true,
         "expand-icon-open": this.open,
         "expand-icon-filled": !(value == null || value === ""),
-      }, innerHTML: Expand, "aria-hidden": "true" }))), value && showClearButton && (h("ic-button", { id: "clear-button", "aria-label": "Clear selection", class: "clear-button", innerHTML: Clear, onClick: this.handleClear, onFocus: this.handleClearButtonFocus, onBlur: this.handleClearButtonBlur, size: dense ? "dense" : "default", variant: "icon", buttonStyle: this.clearButtonFocused
+      }, innerHTML: Expand, "aria-hidden": "true" }))), value && showClearButton && (h("ic-button", { id: "clear-button", "aria-label": "Clear selection", class: "clear-button", innerHTML: Clear, onClick: this.handleClear, onFocus: this.handleClearButtonFocus, onBlur: this.handleClearButtonBlur, size: small ? "small" : "default", variant: "icon", appearance: this.clearButtonFocused
         ? IcThemeForegroundEnum.Light
         : IcThemeForegroundEnum.Dark }))))), !isMobileOrTablet() && (h("ic-menu", { class: {
         "no-results": this.noOptions !== null,
       }, ref: (el) => (this.menu = el), inputEl: searchable
         ? this.searchableSelectElement
-        : this.customSelectElement, inputLabel: label, anchorEl: this.anchorEl, dense: dense, menuId: menuId, open: this.open, options: searchable ? this.filteredOptions : options, value: value, fullWidth: fullWidth, onMenuChange: this.handleMenuChange, onOptionSelect: this.handleCustomSelectChange, parentEl: this.host })), h("ic-input-validation", { class: { "menu-open": this.open }, ariaLiveMode: "polite", status: hasValidationStatus(this.validationStatus, this.disabled) ===
+        : this.customSelectElement, inputLabel: label, anchorEl: this.anchorEl, small: small, menuId: menuId, open: this.open, options: searchable ? this.filteredOptions : options, value: value, fullWidth: fullWidth, onMenuChange: this.handleMenuChange, onOptionSelect: this.handleCustomSelectChange, parentEl: this.host })), h("ic-input-validation", { class: { "menu-open": this.open }, ariaLiveMode: "polite", status: hasValidationStatus(this.validationStatus, this.disabled) ===
         false
         ? ""
         : validationStatus, message: hasValidationStatus(this.validationStatus, this.disabled)
@@ -368,11 +380,11 @@ const Select = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     "readonly": [4],
     "placeholder": [1],
     "helperText": [1, "helper-text"],
-    "dense": [4],
+    "small": [4],
     "fullWidth": [4, "full-width"],
     "validationStatus": [1, "validation-status"],
     "validationText": [1, "validation-text"],
-    "value": [1],
+    "value": [1025],
     "name": [1],
     "showClearButton": [4, "show-clear-button"],
     "searchable": [4],
@@ -387,6 +399,7 @@ const Select = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
     "filteredOptions": [32],
     "ariaActiveDescendant": [32],
     "noOptions": [32],
+    "initialValue": [32],
     "setFocus": [64]
   }]);
 function defineCustomElement$1() {