@ukic/web-components 2.1.0-beta.16 → 2.1.0-beta.18

package/dist/core/p-b0685167.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icSearchBarCss","inputIds","SearchBar","this","inputId","menuId","menuCloseFromMenuChangeEvent","truncateValue","assistiveHintEl","preventSubmit","prevNoOption","hasTimedOut","preLoad","retryButtonClick","handleSubmitSearch","highlightedValue","value","undefined","icSubmitSearch","emit","form","el","closest","searchSubmitButton","handleHiddenFormButtonClick","handleSubmitSearchKeyDown","ev","key","preventDefault","handleRetry","retryViaKeyPress","detail","keyPressed","icRetryLoad","triggerLoading","loadingOption","label","loadingLabel","loading","filteredOptions","timeout","timeoutTimer","window","setTimeout","loadingErrorLabel","timedOut","onInput","target","noOptions","emptyOptionListText","options","length","setMenuChange","disableFilter","rawFilteredOptions","getFilteredMenuOptions","showClearButton","handleShowClearButton","debounceAriaLiveUpdate","onInputBlur","nextFocus","relatedTarget","icInputBlur","onInputFocus","icInputFocus","handleClear","keyboardEvent","mouseEvent","type","code","inputEl","clearTimeout","setFocus","icClear","handleMouseDown","handleClearBlur","icClearBlur","clearButtonFocused","handleSubmitSearchBlur","icSubmitSearchBlur","searchSubmitFocused","handleSubmitSearchFocus","handleOptionSelect","icOptionSelect","handleMenuOptionHighlight","optionValue","_a","optionId","replace","ariaActiveDescendant","handleMenuChange","open","handleMenuCloseFromMenuChange","focusInput","icMenuChange","handleHostFocus","handleTruncateValue","icSearchBarFocus","handleHostBlur","menu","icSearchBarBlur","visible","handleFocusClearButton","fromEvent","truncate","renderAssistiveHintEl","input","_b","shadowRoot","querySelector","Object","keys","hasOptionsOrFilterDisabled","document","createElement","innerText","hintText","id","style","display","after","updateSearchResultAriaLive","searchResultsStatusEl","charactersUntilSuggestion","hadNoOptions","isSubmitDisabled","valueNotSet","valueLengthLess","disabled","highlightFirstOptionAfterNoResults","handleSetFirstOption","prevNoOptionsList","find","filteredOption","loadingHandler","newValue","filteredOptionsHandler","newOptions","some","opt","watchOptionsHandler","watchValueHandler","getLabelFromValue","async","handleKeyDown","keyEv","event","handleKeyboardOpen","handleKeyUp","debounceAriaLive","componentWillRender","componentWillLoad","removeDisabledFalse","componentDidLoad","focusOnLoad","onComponentRequiredPropUndefined","prop","propName","anchorEl","disconnectedCallback","remove","render","name","required","small","placeholder","helperText","readonly","spellcheck","fullWidth","hideLabel","autofocus","autocapitalize","autocomplete","disabledMode","describedBy","getInputDescribedByText","trim","describedById","disabledText","hasSuggestedSearch","menuOpen","isOrHasLoaded","expanded","renderHiddenInput","h","Host","class","onFocus","onBlur","ref","ariaExpanded","role","autoFocus","inputmode","debounce","slot","innerHTML","clearIcon","onClick","onMouseDown","size","onKeyDown","variant","appearance","IcThemeForegroundEnum","Light","Dark","searchIcon","Default","fullwidth","activationType","autoFocusOnSelected","inputLabel","onMenuOptionSelect","onMenuStateChange","onMenuOptionId","onRetryButtonClicked","parentEl"],"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/normalize.css\";\n\n/**\n * @prop --ic-z-index-menu: z-index of search bar menu\n */\n\n:host(.search) {\n  --divider-height: 1.5rem;\n}\n\n:host(.search.small) {\n  --divider-height: 1rem;\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: var(--ic-space-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.clear-button:active {\n  background-color: var(--ic-focus-blue);\n  box-shadow: inset 0 0 0 0.125rem var(--ic-focus-glow);\n  border-radius: 0.25rem;\n}\n\n.clear-button:focus,\n.clear-button:active * {\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.search-submit-button:active {\n  background-color: var(--ic-focus-blue) !important;\n  box-shadow: inset 0 0 0 0.125rem var(--ic-focus-glow) !important;\n  border-radius: var(--ic-space-xxs);\n}\n\n.search-submit-button:focus,\n.search-submit-button:active * {\n  fill: white;\n}\n\n.divider {\n  width: var(--ic-space-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, 20rem);\n  position: relative;\n  top: var(--ic-space-xxxs);\n}\n\n.menu-container.fullwidth {\n  width: 100%;\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: var(--ic-space-1px);\n  margin-bottom: calc(-1 * var(--ic-space-1px));\n  margin-right: calc(-1 * var(--ic-space-1px));\n  overflow: hidden;\n  padding: 0;\n  position: absolute;\n  white-space: nowrap;\n  width: var(--ic-space-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  getInputDescribedByText,\n  renderHiddenInput,\n  handleHiddenFormButtonClick,\n  getLabelFromValue,\n  onComponentRequiredPropUndefined,\n  getFilteredMenuOptions,\n  removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport { IcSearchBarBlurEventDetail } from \"./ic-search-bar.types\";\nimport { IcValueEventDetail, IcBlurEventDetail } from \"../../utils/types\";\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: {\n    delegatesFocus: true,\n  },\n})\n// eslint-disable-next-line @typescript-eslint/no-unused-vars\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  private debounceAriaLive: number;\n\n  private timeoutTimer: number;\n  private prevNoOption: boolean = false;\n  private hasTimedOut = false;\n  private preLoad = true;\n  private retryViaKeyPress: boolean;\n  private retryButtonClick: boolean = false;\n\n  /**\n   * The label for the search bar.\n   */\n  @Prop() label!: string;\n\n  /**\n   * If `true`, the search bar will require a value.\n   */\n  @Prop() required?: boolean = false;\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop() disabled?: boolean = false;\n\n  /**\n   * If `true`, the readonly state will be set.\n   */\n  @Prop() readonly?: boolean = false;\n\n  /**\n   * The placeholder value to display.\n   */\n  @Prop() placeholder?: string = \"Search\";\n\n  /**\n   * Specify whether the search bar fills the full width of the container.\n   * If `true`, this overrides the --input-width CSS variable.\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   * If `true`, the label will be hidden and the required label value will be applied as an aria-label.\n   */\n  @Prop() hideLabel?: boolean = false;\n\n  /**\n   * The helper text that will be displayed for additional field guidance.\n   */\n  @Prop() helperText?: string = \"\";\n\n  /**\n   * If `true`, the small styling will be applied to the search bar.\n   */\n  @Prop() small?: boolean = false;\n\n  /**\n   * The value of the search input.\n   */\n  @Prop({ reflect: true, mutable: true }) value: string = \"\";\n\n  /**\n   * The automatic capitalisation of the text value 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   * The state of autocompletion the browser can apply on the text value.\n   */\n  @Prop() autocomplete?: IcAutocompleteTypes = \"off\";\n\n  /**\n   * The state of autocorrection the browser can apply when the user is entering/editing the text value.\n   */\n  @Prop() autocorrect?: IcAutocorrectStates = \"off\";\n\n  /**\n   * If `true`, the form control will have input focus when the page loads.\n   */\n  @Prop() autofocus = false;\n\n  /**\n   * The amount of time, in milliseconds, to wait to trigger the `icChange` event after each keystroke.\n   */\n  @Prop() debounce?: number = 0;\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 value of the search will have its spelling and grammar checked.\n   */\n  @Prop() spellcheck: boolean = false;\n  /**\n   * The suggested search options.\n   */\n  @Prop() options?: IcMenuOption[] = [];\n\n  /**\n   * If using external filtering, set a timeout for when loading takes too long.\n   */\n  @Prop() timeout?: number;\n\n  /**\n   * Change the message displayed whilst the options are being loaded externally.\n   */\n  @Prop() loadingLabel?: string = \"Loading...\";\n\n  /**\n   * Change the message displayed when external loading times out.\n   */\n  @Prop() loadingErrorLabel?: string = \"Loading Error\";\n\n  /**\n   * Trigger loading state when fetching options asyncronously\n   */\n  @Prop({ mutable: true }) loading?: boolean = false;\n\n  @Watch(\"loading\")\n  loadingHandler(newValue: boolean): void {\n    if (newValue && !this.hasTimedOut) {\n      this.preLoad = false;\n      this.triggerLoading();\n    }\n  }\n\n  @Watch(\"filteredOptions\")\n  filteredOptionsHandler(newOptions: IcMenuOption[]): void {\n    this.hasTimedOut = newOptions.some((opt) => opt.timedOut);\n  }\n\n  @Watch(\"options\")\n  watchOptionsHandler(newOptions: IcMenuOption[]): void {\n    if (this.disableFilter && !this.hasTimedOut) {\n      this.loading = false;\n      clearTimeout(this.timeoutTimer);\n      if (newOptions.length > 0) {\n        this.filteredOptions = newOptions;\n      } else {\n        if (this.hadNoOptions()) {\n          return;\n        }\n        this.setMenuChange(true);\n        !this.preLoad &&\n          (this.filteredOptions = [\n            { label: this.emptyOptionListText, value: \"\" },\n          ]);\n        this.preLoad = true;\n      }\n    }\n    this.debounceAriaLiveUpdate();\n  }\n\n  /**\n   * If `true`, the search bar will be focused when component loaded.\n   */\n  @Prop() focusOnLoad?: boolean = false;\n\n  /**\n   * The hint text for the 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   * The text displayed when there are no options in the option list.\n   */\n  @Prop() emptyOptionListText = \"No results found\";\n\n  /**\n   * The 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\n  /**\n   * Sets focus on the native `input`.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    this.retryViaKeyPress = false;\n    this.retryButtonClick = false;\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 || this.isSubmitDisabled()) {\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.highlightedValue && (this.value = this.highlightedValue);\n    this.highlightedValue = undefined;\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  private handleSubmitSearchKeyDown = (ev: KeyboardEvent) => {\n    if (ev.key === \" \") {\n      ev.preventDefault();\n      this.handleSubmitSearch();\n    }\n  };\n\n  private handleRetry = (ev: CustomEvent<IcValueEventDetail>) => {\n    this.retryViaKeyPress = ev.detail.keyPressed === \"Enter\";\n    this.icRetryLoad.emit({ value: ev.detail.value });\n    this.triggerLoading();\n    this.retryButtonClick = true;\n  };\n\n  private triggerLoading = () => {\n    const loadingOption: IcMenuOption[] = [\n      { label: this.loadingLabel, value: \"\", loading: true },\n    ];\n    if (this.filteredOptions !== loadingOption)\n      this.filteredOptions = loadingOption;\n    if (this.timeout) {\n      this.timeoutTimer = window.setTimeout(() => {\n        this.filteredOptions = [\n          { label: this.loadingErrorLabel, value: \"\", timedOut: true },\n        ];\n      }, this.timeout);\n    }\n  };\n\n  // The icInput event is defined here so that it appears as an event for search bar\n  // The actual event is emitted from the child ic-text-field\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    const noOptions = [{ label: this.emptyOptionListText, 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        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\n  private debounceAriaLiveUpdate() {\n    clearTimeout(this.debounceAriaLive);\n\n    this.debounceAriaLive = window.setTimeout(() => {\n      this.updateSearchResultAriaLive();\n    }, 500);\n  }\n\n  /**\n   * @deprecated This event should not be used anymore. Use icSearchBarBlur instead.\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   * @deprecated This event should not be used anymore. Use icSearchBarFocus instead.\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  // The icChange event is defined here so that it appears as an event for search bar\n  // The actual event is emitted from the child ic-text-field\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.loading = false;\n      clearTimeout(this.timeoutTimer);\n      this.filteredOptions = this.options;\n      this.el.setFocus();\n\n      this.icClear.emit();\n      ev.preventDefault();\n\n      this.preventSubmit = true;\n    }\n  };\n\n  private handleMouseDown = (ev: Event) => {\n    ev.preventDefault();\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.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  /**\n   * Emitted when the 'retry loading' button is clicked\n   */\n  @Event() icRetryLoad: EventEmitter<IcValueEventDetail>;\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() highlightedValue: string;\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 handleMenuOptionHighlight = (ev: CustomEvent) => {\n    const optionValue = ev.detail.optionId?.replace(`${this.menuId}-`, \"\");\n    optionValue && (this.highlightedValue = optionValue);\n    if (ev.detail.optionId) {\n      this.ariaActiveDescendant = ev.detail.optionId;\n    } else {\n      this.ariaActiveDescendant = undefined;\n    }\n  };\n\n  private handleMenuChange = (ev: CustomEvent) => {\n    this.setMenuChange(ev.detail.open);\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  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 (\n      this.open &&\n      this.options &&\n      nextFocus !== this.menu &&\n      !this.retryViaKeyPress &&\n      !this.retryButtonClick\n    ) {\n      this.setMenuChange(false);\n    }\n\n    if (this.retryButtonClick || this.retryViaKeyPress) {\n      this.inputEl.setFocus();\n    }\n\n    this.handleShowClearButton(false);\n    this.handleMenuCloseFromMenuChange(false);\n    this.handleTruncateValue(true);\n    this.icSearchBarBlur.emit({ relatedTarget: nextFocus, value: this.value });\n    this.retryViaKeyPress = false;\n    this.retryButtonClick = false;\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 (\n      !this.open ||\n      this.value === \"\" ||\n      this.value.length < this.charactersUntilSuggestion\n    ) {\n      searchResultsStatusEl.innerText = \"\";\n    } else if (\n      this.hasOptionsOrFilterDisabled() &&\n      this.filteredOptions.length > 0 &&\n      this.open &&\n      searchResultsStatusEl &&\n      !this.filteredOptions[0].loading\n    ) {\n      if (this.hadNoOptions()) {\n        searchResultsStatusEl.innerText = this.emptyOptionListText;\n      } else {\n        searchResultsStatusEl.innerText = `${\n          this.filteredOptions.length\n        } result${this.filteredOptions.length > 1 ? \"s\" : \"\"} available`;\n      }\n    }\n  };\n\n  private hasOptionsOrFilterDisabled = (): boolean =>\n    this.options.length > 0 || this.disableFilter;\n\n  private hadNoOptions = (): boolean =>\n    this.filteredOptions.length === 1 &&\n    this.filteredOptions[0].label === this.emptyOptionListText;\n\n  private isSubmitDisabled = (): boolean => {\n    const valueNotSet =\n      this.value === undefined || this.value === null || this.value === \"\";\n    const valueLengthLess = this.value.length < this.charactersUntilSuggestion;\n    return (\n      valueNotSet ||\n      valueLengthLess ||\n      this.disabled ||\n      this.hadNoOptions() ||\n      this.hasTimedOut ||\n      this.loading\n    );\n  };\n\n  private highlightFirstOptionAfterNoResults = () => {\n    if (this.prevNoOption && this.menu && !this.hasTimedOut) {\n      this.menu.handleSetFirstOption();\n      this.prevNoOption = false;\n    }\n    const prevNoOptionsList = this.filteredOptions.find(\n      (filteredOption) =>\n        filteredOption.label === this.emptyOptionListText ||\n        filteredOption.label === this.loadingErrorLabel ||\n        filteredOption.label === this.loadingLabel\n    );\n    if (prevNoOptionsList) {\n      this.prevNoOption = true;\n    }\n  };\n\n  componentWillRender(): void {\n    this.highlightFirstOptionAfterNoResults();\n  }\n\n  componentWillLoad(): void {\n    this.watchValueHandler(this.value);\n\n    removeDisabledFalse(this.disabled, this.el);\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    if (this.inputEl !== undefined) {\n      this.anchorEl = this.inputEl.shadowRoot.querySelector(\n        \"ic-input-component-container\"\n      );\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 && this.hasOptionsOrFilterDisabled();\n    const menuOpen = hasSuggestedSearch && open && filteredOptions.length > 0;\n    const isOrHasLoaded =\n      this.filteredOptions.length === 1 &&\n      (this.filteredOptions[0].label === this.loadingLabel ||\n        filteredOptions[0].label === this.loadingErrorLabel);\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          debounce={this.debounce}\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              onMouseDown={this.handleMouseDown}\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\": this.isSubmitDisabled(),\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={this.isSubmitDisabled()}\n              innerHTML={searchIcon}\n              size={small ? \"small\" : \"default\"}\n              onClick={this.handleSubmitSearch}\n              onMouseDown={this.handleMouseDown}\n              onBlur={this.handleSubmitSearchBlur}\n              onFocus={this.handleSubmitSearchFocus}\n              onKeyDown={this.handleSubmitSearchKeyDown}\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\": this.hadNoOptions() || isOrHasLoaded,\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                onMenuOptionSelect={this.handleOptionSelect}\n                onMenuStateChange={this.handleMenuChange}\n                onMenuOptionId={this.handleMenuOptionHighlight}\n                onRetryButtonClicked={this.handleRetry}\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"],"mappings":"0vCAAA,MAAMA,EAAiB,8pICuCvB,IAAIC,EAAW,E,MAUFC,EAAS,M,wkBAGZC,KAAAC,QAAU,uBAAuBH,MAGjCE,KAAAE,OAAS,GAAGF,KAAKC,eAGjBD,KAAAG,6BAAwC,MAGxCH,KAAAI,cAAgB,MAEhBJ,KAAAK,gBAAmC,KACnCL,KAAAM,cAAyB,MAIzBN,KAAAO,aAAwB,MACxBP,KAAAQ,YAAc,MACdR,KAAAS,QAAU,KAEVT,KAAAU,iBAA4B,MAmO5BV,KAAAW,mBAAqB,KAC3BX,KAAKY,mBAAqBZ,KAAKa,MAAQb,KAAKY,kBAC5CZ,KAAKY,iBAAmBE,UACxBd,KAAKe,eAAeC,KAAK,CAAEH,MAAOb,KAAKa,QAEvC,MAAMI,EAAwBjB,KAAKkB,GAAGC,QAAQ,QAE9C,GAAInB,KAAKoB,sBAAwBH,IAASjB,KAAKM,cAAe,CAC5De,EAA4BJ,EAAMjB,KAAKoB,mB,GAInCpB,KAAAsB,0BAA6BC,IACnC,GAAIA,EAAGC,MAAQ,IAAK,CAClBD,EAAGE,iBACHzB,KAAKW,oB,GAIDX,KAAA0B,YAAeH,IACrBvB,KAAK2B,iBAAmBJ,EAAGK,OAAOC,aAAe,QACjD7B,KAAK8B,YAAYd,KAAK,CAAEH,MAAOU,EAAGK,OAAOf,QACzCb,KAAK+B,iBACL/B,KAAKU,iBAAmB,IAAI,EAGtBV,KAAA+B,eAAiB,KACvB,MAAMC,EAAgC,CACpC,CAAEC,MAAOjC,KAAKkC,aAAcrB,MAAO,GAAIsB,QAAS,OAElD,GAAInC,KAAKoC,kBAAoBJ,EAC3BhC,KAAKoC,gBAAkBJ,EACzB,GAAIhC,KAAKqC,QAAS,CAChBrC,KAAKsC,aAAeC,OAAOC,YAAW,KACpCxC,KAAKoC,gBAAkB,CACrB,CAAEH,MAAOjC,KAAKyC,kBAAmB5B,MAAO,GAAI6B,SAAU,MACvD,GACA1C,KAAKqC,Q,GAUJrC,KAAA2C,QAAWpB,IACjBvB,KAAKa,MAASU,EAAGqB,OAA4B/B,MAE7C,MAAMgC,EAAY,CAAC,CAAEZ,MAAOjC,KAAK8C,oBAAqBjC,MAAO,KAE7D,GAAIb,KAAK+C,QAAQC,OAAS,EAAG,CAC3BhD,KAAKiD,cAAc,MAEnB,GAAIjD,KAAKkD,gBAAkB,MAAO,CAChC,MAAMC,EAAqBC,EACzBpD,KAAK+C,QACL,MACA/C,KAAKa,MACL,YAGFb,KAAKoC,gBACHe,EAAmBH,OAAS,EAAIG,EAAqBN,C,EAI3D,IAAK7C,KAAKqD,gBAAiB,CACzBrD,KAAKsD,sBAAsB,K,CAG7BtD,KAAKuD,wBAAwB,EAevBvD,KAAAwD,YAAejC,IACrB,MAAMV,EAASU,EAAGqB,OAA4B/B,MAC9C,MAAM4C,EAAalC,EAAkBmC,cAErC1D,KAAK2D,YAAY3C,KAAK,CAAEH,MAAOA,EAAO6C,cAAeD,GAAY,EAO3DzD,KAAA4D,aAAgBrC,IACtB,MAAMV,EAASU,EAAGqB,OAA4B/B,MAC9Cb,KAAK6D,aAAa7C,KAAK,CAAEH,MAAOA,IAEhCb,KAAKsD,sBAAsB,KAAK,EAc1BtD,KAAA8D,YAAevC,IACrB,MAAMwC,EAAgBxC,EACtB,MAAMyC,EAAazC,EAEnB,GACEyC,EAAWC,OAAS,SACpBF,EAAcG,OAAS,SACvBH,EAAcG,OAAS,QACvB,CACAlE,KAAKa,MAAQ,GACbb,KAAKmE,QAAQtD,MAAQ,GACrBb,KAAKmC,QAAU,MACfiC,aAAapE,KAAKsC,cAClBtC,KAAKoC,gBAAkBpC,KAAK+C,QAC5B/C,KAAKkB,GAAGmD,WAERrE,KAAKsE,QAAQtD,OACbO,EAAGE,iBAEHzB,KAAKM,cAAgB,I,GAIjBN,KAAAuE,gBAAmBhD,IACzBA,EAAGE,gBAAgB,EAqBbzB,KAAAwE,gBAAmBjD,IACzB,MAAMkC,EAAalC,EAAkBmC,cAErC1D,KAAKyE,YAAYzD,KAAK,CAAE0C,cAAeD,IAEvCzD,KAAK0E,mBAAqB,KAAK,EAOzB1E,KAAA2E,uBAA0BpD,IAChC,MAAMkC,EAAalC,EAAkBmC,cAErC1D,KAAK4E,mBAAmB5D,KAAK,CAAE0C,cAAeD,IAE9CzD,KAAK6E,oBAAsB,KAAK,EAG1B7E,KAAA8E,wBAA0B,KAChC9E,KAAK6E,oBAAsB,IAAI,EA0BzB7E,KAAA+E,mBAAsBxD,IAC5B,GAAIA,EAAGK,OAAOK,QAAUjC,KAAK8C,oBAAqB,CAChD9C,KAAKkB,GAAGmD,WACR,M,CAGFrE,KAAKa,MAAQU,EAAGK,OAAOf,MACvBb,KAAKgF,eAAehE,KAAK,CAAEH,MAAOb,KAAKa,OAAQ,EAGzCb,KAAAiF,0BAA6B1D,I,MACnC,MAAM2D,GAAcC,EAAA5D,EAAGK,OAAOwD,YAAQ,MAAAD,SAAA,SAAAA,EAAEE,QAAQ,GAAGrF,KAAKE,UAAW,IACnEgF,IAAgBlF,KAAKY,iBAAmBsE,GACxC,GAAI3D,EAAGK,OAAOwD,SAAU,CACtBpF,KAAKsF,qBAAuB/D,EAAGK,OAAOwD,Q,KACjC,CACLpF,KAAKsF,qBAAuBxE,S,GAIxBd,KAAAuF,iBAAoBhE,IAC1BvB,KAAKiD,cAAc1B,EAAGK,OAAO4D,MAC7B,IAAKjE,EAAGK,OAAO4D,KAAM,CACnBxF,KAAKyF,8BAA8B,MACnC,GAAIlE,EAAGK,OAAO8D,aAAe5E,WAAaS,EAAGK,OAAO8D,WAAY,CAC9D1F,KAAKkB,GAAGmD,U,IAKNrE,KAAAiD,cAAiBuC,IACvB,GAAIxF,KAAKwF,OAASA,EAAM,CACtBxF,KAAKwF,KAAOA,EACZxF,KAAK2F,aAAa3E,KAAK,CAAEwE,Q,GAIrBxF,KAAA4F,gBAAkB,KACxB,GAAI5F,KAAK+C,SAAW/C,KAAKa,QAAUb,KAAKG,6BAA8B,CACpEH,KAAKiD,cAAc,K,CAErBjD,KAAK6F,oBAAoB,OAEzB7F,KAAK8F,iBAAiB9E,MAAM,EAGtBhB,KAAA+F,eAAkBxE,IACxB,MAAMkC,EAAalC,EAAkBmC,cACrC,GACE1D,KAAKwF,MACLxF,KAAK+C,SACLU,IAAczD,KAAKgG,OAClBhG,KAAK2B,mBACL3B,KAAKU,iBACN,CACAV,KAAKiD,cAAc,M,CAGrB,GAAIjD,KAAKU,kBAAoBV,KAAK2B,iBAAkB,CAClD3B,KAAKmE,QAAQE,U,CAGfrE,KAAKsD,sBAAsB,OAC3BtD,KAAKyF,8BAA8B,OACnCzF,KAAK6F,oBAAoB,MACzB7F,KAAKiG,gBAAgBjF,KAAK,CAAE0C,cAAeD,EAAW5C,MAAOb,KAAKa,QAClEb,KAAK2B,iBAAmB,MACxB3B,KAAKU,iBAAmB,KAAK,EAGvBV,KAAAsD,sBAAyB4C,IAC/BlG,KAAKqD,gBAAkB6C,CAAO,EAGxBlG,KAAAmG,uBAAyB,KAC/BnG,KAAK0E,mBAAqB,IAAI,EAGxB1E,KAAAyF,8BAAiCW,IACvCpG,KAAKG,6BAA+BiG,CAAS,EAGvCpG,KAAA6F,oBAAuBQ,IAC7BrG,KAAKI,cAAgBiG,CAAQ,EAGvBrG,KAAAsG,sBAAwB,K,QAC9B,MAAMC,GAAQC,GAAArB,EAAAnF,KAAKkB,GAAGuF,WACnBC,cAAc,oBAAgB,MAAAvB,SAAA,SAAAA,EAC7BsB,cAAU,MAAAD,SAAA,SAAAA,EAAEE,cAAc,IAAI1G,KAAKC,WAEvC,GACEsG,GACAI,OAAOC,KAAKL,GAAOvD,OAAS,GAC5BhD,KAAK6G,6BACL,CACA7G,KAAKK,gBAAkByG,SAASC,cAAc,QAC9C/G,KAAKK,gBAAgB2G,UAAYhH,KAAKiH,SACtCjH,KAAKK,gBAAgB6G,GAAK,GAAGlH,KAAKC,yBAClCD,KAAKK,gBAAgB8G,MAAMC,QAAU,OACrC,GAAIb,EAAMc,QAAUvG,UAAW,CAC7ByF,EAAMc,MAAMrH,KAAKK,gB,IAKfL,KAAAsH,2BAA6B,KACnC,MAAMC,EAAwBvH,KAAKkB,GAAGuF,WAAWC,cAC/C,0BAGF,IACG1G,KAAKwF,MACNxF,KAAKa,QAAU,IACfb,KAAKa,MAAMmC,OAAShD,KAAKwH,0BACzB,CACAD,EAAsBP,UAAY,E,MAC7B,GACLhH,KAAK6G,8BACL7G,KAAKoC,gBAAgBY,OAAS,GAC9BhD,KAAKwF,MACL+B,IACCvH,KAAKoC,gBAAgB,GAAGD,QACzB,CACA,GAAInC,KAAKyH,eAAgB,CACvBF,EAAsBP,UAAYhH,KAAK8C,mB,KAClC,CACLyE,EAAsBP,UAAY,GAChChH,KAAKoC,gBAAgBY,gBACbhD,KAAKoC,gBAAgBY,OAAS,EAAI,IAAM,c,IAKhDhD,KAAA6G,2BAA6B,IACnC7G,KAAK+C,QAAQC,OAAS,GAAKhD,KAAKkD,cAE1BlD,KAAAyH,aAAe,IACrBzH,KAAKoC,gBAAgBY,SAAW,GAChChD,KAAKoC,gBAAgB,GAAGH,QAAUjC,KAAK8C,oBAEjC9C,KAAA0H,iBAAmB,KACzB,MAAMC,EACJ3H,KAAKa,QAAUC,WAAad,KAAKa,QAAU,MAAQb,KAAKa,QAAU,GACpE,MAAM+G,EAAkB5H,KAAKa,MAAMmC,OAAShD,KAAKwH,0BACjD,OACEG,GACAC,GACA5H,KAAK6H,UACL7H,KAAKyH,gBACLzH,KAAKQ,aACLR,KAAKmC,OAAO,EAIRnC,KAAA8H,mCAAqC,KAC3C,GAAI9H,KAAKO,cAAgBP,KAAKgG,OAAShG,KAAKQ,YAAa,CACvDR,KAAKgG,KAAK+B,uBACV/H,KAAKO,aAAe,K,CAEtB,MAAMyH,EAAoBhI,KAAKoC,gBAAgB6F,MAC5CC,GACCA,EAAejG,QAAUjC,KAAK8C,qBAC9BoF,EAAejG,QAAUjC,KAAKyC,mBAC9ByF,EAAejG,QAAUjC,KAAKkC,eAElC,GAAI8F,EAAmB,CACrBhI,KAAKO,aAAe,I,sCAhlBK,M,cAIA,M,cAKA,M,iBAKE,S,eAMD,M,mBAMI,M,eAKJ,M,gBAKA,G,WAKJ,M,WAK8B,G,oBAM/B,M,kBAKoB,M,iBAKD,M,eAKxB,M,cAKQ,E,UAKLP,KAAKC,Q,gBAKE,M,aAIK,G,yCAUH,a,uBAKK,gB,aAKQ,M,iBAwCb,M,cAM9B,yG,yBAK4B,mB,+BAKc,E,UA+PnB,M,qBACkB,G,yDAEP,M,wBACG,M,yBACC,M,gCAzTxCkI,eAAeC,GACb,GAAIA,IAAapI,KAAKQ,YAAa,CACjCR,KAAKS,QAAU,MACfT,KAAK+B,gB,EAKTsG,uBAAuBC,GACrBtI,KAAKQ,YAAc8H,EAAWC,MAAMC,GAAQA,EAAI9F,U,CAIlD+F,oBAAoBH,GAClB,GAAItI,KAAKkD,gBAAkBlD,KAAKQ,YAAa,CAC3CR,KAAKmC,QAAU,MACfiC,aAAapE,KAAKsC,cAClB,GAAIgG,EAAWtF,OAAS,EAAG,CACzBhD,KAAKoC,gBAAkBkG,C,KAClB,CACL,GAAItI,KAAKyH,eAAgB,CACvB,M,CAEFzH,KAAKiD,cAAc,OAClBjD,KAAKS,UACHT,KAAKoC,gBAAkB,CACtB,CAAEH,MAAOjC,KAAK8C,oBAAqBjC,MAAO,MAE9Cb,KAAKS,QAAU,I,EAGnBT,KAAKuD,wB,CAyBPmF,kBAAkBN,GAChB,GACEpI,KAAKmE,SACLnE,KAAK+C,WACH4F,EAAkBP,EAAUpI,KAAK+C,SACnC,CACA/C,KAAKmE,QAAQtD,MAAQ8H,EAAkBP,EAAUpI,KAAK+C,Q,MACjD,GAAI/C,KAAKmE,SAAWnE,KAAKmE,QAAQtD,QAAUuH,EAAU,CAC1DpI,KAAKmE,QAAQtD,MAAQuH,C,EAQzBQ,iBACE5I,KAAK2B,iBAAmB,MACxB3B,KAAKU,iBAAmB,MACxB,GAAIV,KAAKmE,QAAS,CAChBnE,KAAKmE,QAAQE,U,EAKjBwE,cAActH,GACZ,MAAMuH,EAAuBvH,EAAGK,OAAOmH,MACvC,GAAI/I,KAAKgG,MAAQhG,KAAKwF,KAAM,CAC1BxF,KAAKgG,KAAKgD,mBAAmBF,E,EAKjCG,YAAY1H,GACV,GAAIA,EAAGC,MAAQ,QAAS,CACtB,GAAIxB,KAAKM,eAAiBN,KAAK0H,mBAAoB,CACjD,M,CAGF1H,KAAKW,qBACLX,KAAKiD,cAAc,M,CAGrB,GAAI1B,EAAGC,MAAQ,SAAU,CACvBxB,KAAKiD,cAAc,M,CAGrB,GAAIjD,KAAKM,cAAe,CACtBN,KAAKM,cAAgB,K,EA+EjBiD,yBACNa,aAAapE,KAAKkJ,kBAElBlJ,KAAKkJ,iBAAmB3G,OAAOC,YAAW,KACxCxC,KAAKsH,4BAA4B,GAChC,I,CA2SL6B,sBACEnJ,KAAK8H,oC,CAGPsB,oBACEpJ,KAAK0I,kBAAkB1I,KAAKa,OAE5BwI,EAAoBrJ,KAAK6H,SAAU7H,KAAKkB,G,CAG1CoI,mBACE,GAAItJ,KAAKuJ,YAAa,CACpBvJ,KAAKkB,GAAGmD,U,CAGV,GAAIrE,KAAK6G,6BAA8B,CACrC7G,KAAKsG,wBACL,GAAItG,KAAKkD,cAAe,CACtBlD,KAAKoC,gBAAkBpC,KAAK+C,O,EAIhCyG,EACE,CAAC,CAAEC,KAAMzJ,KAAKiC,MAAOyH,SAAU,UAC/B,cAGF,GAAI1J,KAAKmE,UAAYrD,UAAW,CAC9Bd,KAAK2J,SAAW3J,KAAKmE,QAAQsC,WAAWC,cACtC,+B,EAKNkD,uBACE,GAAI5J,KAAKK,gBAAiB,CACxBL,KAAKK,gBAAgBwJ,Q,EAIzBC,SACE,MAAM7J,QACJA,EAAO8J,KACPA,EAAI9H,MACJA,EAAK+H,SACLA,EAAQC,MACRA,EAAKC,YACLA,EAAWC,WACXA,EAAUtC,SACVA,EAAQhH,MACRA,EAAKuJ,SACLA,EAAQC,WACRA,EAAUC,UACVA,EAASvH,QACTA,EAAOyC,KACPA,EAAI+E,UACJA,EAASrK,OACTA,EAAMoF,qBACNA,EAAoBlF,cACpBA,EAAaoK,UACbA,EAASC,eACTA,EAAcC,aACdA,EAAYtI,gBACZA,GACEpC,KAEJ,MAAM2K,EAAeP,GAAYvC,EAAW,KAAO,MAEnD,MAAM+C,EAAcC,EAClB5K,EACAkK,IAAe,GACf,OACAW,OAEF,IAAIC,EAEJ,GAAIH,IAAgB,IAAM5K,KAAK6G,6BAA8B,CAC3DkE,EAAgB,GAAGH,KAAe5K,KAAKC,wB,MAClC,GAAID,KAAK6G,6BAA8B,CAC5CkE,EAAgB,GAAG/K,KAAKC,wB,MACnB,GAAI2K,IAAgB,GAAI,CAC7BG,EAAgBH,C,KACX,CACLG,EAAgBjK,S,CAGlB,MAAMkK,EAAeL,IAAiBP,EACtC,MAAMa,EAAqBpK,GAASb,KAAK6G,6BACzC,MAAMqE,EAAWD,GAAsBzF,GAAQpD,EAAgBY,OAAS,EACxE,MAAMmI,EACJnL,KAAKoC,gBAAgBY,SAAW,IAC/BhD,KAAKoC,gBAAgB,GAAGH,QAAUjC,KAAKkC,cACtCE,EAAgB,GAAGH,QAAUjC,KAAKyC,mBAEtC,IAAI2I,EAEJ,GAAIrI,EAAQC,OAAS,EAAG,CACtB,GAAIkI,EAAU,CACZE,EAAW,M,KACN,CACLA,EAAW,O,MAER,CACLA,EAAWtK,S,CAGbuK,EAAkB,KAAMrL,KAAKkB,GAAI6I,EAAMlJ,EAAO8J,GAE9C,OACEW,EAACC,EAAI,CACHC,MAAO,CACL,CAAC,UAAW,KACZ,CAAC,aAAclB,EACf,CAAC,YAAazC,EACd,CAAC,SAAUoC,GAEbwB,QAASzL,KAAK4F,gBACd8F,OAAQ1L,KAAK+F,gBAEbuF,EAAA,iBACEK,IAAMzK,GAAQlB,KAAKmE,QAAUjD,EAC7BjB,QAASA,EACTgC,MAAOA,EACPkI,WAAYA,EACZH,SAAUA,EACVnC,SAAUmD,EACVZ,SAAUA,EACVH,MAAOA,EACPM,UAAWA,EACXD,UAAWA,EACXP,KAAMA,EACN3J,cAAeA,EACfS,MACEkC,KAAa4F,EAAkB9H,EAAOkC,GAClC4F,EAAkB9H,EAAOkC,GACzBlC,EAENqJ,YAAaA,EACbvH,QAAS3C,KAAK2C,QACd+I,OAAQ1L,KAAKwD,YACbiI,QAASzL,KAAK4D,aAAY,aACd2G,EAAYtI,EAAQ,GAAE,mBAChB8I,EAAa,YACpBE,EAAqB/K,EAASY,UAAS,gBACnCiC,EAAQC,OAAS,EAAI,UAAYlC,UAChD8K,aAAcR,EACd9F,qBAAsBA,EAAoB,oBACvB2F,EAAqB,OAASnK,UACjD+K,KAAMZ,EAAqB,WAAanK,UACxC4J,aAAcA,EACdD,eAAgBA,EAChBqB,UAAWtB,EACXH,WAAYA,EACZ0B,UAAU,SACVC,SAAUhM,KAAKgM,UAEfV,EAAA,OACEE,MAAO,CACL,yBAA0B,KAC1B,uBACE3K,IAAU8J,GAAgB3K,KAAKqD,iBAEnC4I,KAAK,gBAELX,EAAA,aACEpE,GAAG,eACHsE,MAAM,eAAc,aACT,QACXU,UAAWC,EACXC,QAASpM,KAAK8D,YACduI,YAAarM,KAAKuE,gBAClB+H,KAAMrC,EAAQ,QAAU,UACxBwB,QAASzL,KAAKmG,uBACduF,OAAQ1L,KAAKwE,gBACb+H,UAAWvM,KAAK8D,YAChBG,KAAK,SACLuI,QAAQ,OACRC,WACEzM,KAAK0E,mBACDgI,EAAsBC,MACtBD,EAAsBE,OAG9BtB,EAAA,OAAKE,MAAM,aAEbF,EAAA,OACEE,MAAO,CACL,iCAAkC,KAClC,gCAAiCxL,KAAK0H,oBAExCuE,KAAK,wBAELX,EAAA,aACEpE,GAAG,uBAAsB,aACd,SACXyE,IAAMzK,GAAQlB,KAAKoB,mBAAqBF,EACxCsK,MAAO,CACL,CAAC,wBAAyB,KAC1B,CAAC,gCAAiCvB,GAEpCpC,SAAU7H,KAAK0H,mBACfwE,UAAWW,EACXP,KAAMrC,EAAQ,QAAU,UACxBmC,QAASpM,KAAKW,mBACd0L,YAAarM,KAAKuE,gBAClBmH,OAAQ1L,KAAK2E,uBACb8G,QAASzL,KAAK8E,wBACdyH,UAAWvM,KAAKsB,0BAChB2C,KAAK,SACLuI,QAAQ,OACRC,WACEzM,KAAK6E,oBACD6H,EAAsBC,MACtBD,EAAsBI,WAIhCxB,EAAA,OACEE,MAAO,CACL,iBAAkB,KAClBuB,UAAWzC,GAEb2B,KAAK,QAEJf,GAAYrK,EAAMmC,QAAUhD,KAAKwH,2BAChC8D,EAAA,WACEE,MAAO,CACL,aAAcxL,KAAKyH,gBAAkB0D,GAEvC6B,eAAe,SACfrD,SAAU3J,KAAK2J,SACfsD,oBAAqB,MACrB9I,QAASnE,KAAKmE,QACd+I,WAAYjL,EACZ0J,IAAMzK,GAAQlB,KAAKgG,KAAO9E,EAC1B+I,MAAOA,EACPK,UAAWA,EACXpK,OAAQA,EACRsF,KAAM,KACNzC,QAASX,EACT+K,mBAAoBnN,KAAK+E,mBACzBqI,kBAAmBpN,KAAKuF,iBACxB8H,eAAgBrN,KAAKiF,0BACrBqI,qBAAsBtN,KAAK0B,YAC3B6L,SAAUvN,KAAKkB,GACfL,MAAOA,MAKfyK,EAAA,mBACY,SACVO,KAAK,SACLL,MAAM,0B"}

package/dist/core/p-b35a9909.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icNavigationGroupCss","NavigationGroup","this","DYNAMIC_GROUPED_LINKS_HEIGHT_MS","IC_NAVIGATION_ITEM","nodeName","mouseGate","sideNavExpandHandler","setTimeout","setInitialGroupedLinksWrapperHeight","topNavResizedHandler","ev","newSize","detail","size","deviceSize","inTopNavSideMenu","DEVICE_SIZES","L","setGroupedNavItemTabIndex","tabIndexValue","el","querySelectorAll","forEach","navigationItem","navItem","shadowRoot","querySelector","setAttribute","toggleGroupedLinkWrapperHeight","wrapper","expanded","getNavigationChildItemsHeight","toggleExpanded","linkWrapper","handleClick","navigationType","toggleDropdown","handleBlur","target","relatedTarget","contains","hideDropdown","handleTopNavKeydown","key","handleKeydown","preventDefault","handleMouseLeave","relTarget","dropdown","document","activeElement","dropdownOpen","handleMouseEnter","addEventListener","showDropdown","renderDropdownGroupedLinks","h","class","onMouseLeave","ref","renderGroupedLinks","navigationItemLength","length","parseInt","getComputedStyle","height","renderNavigationItems","expandable","XL","getThemeForegroundColor","childBlurHandler","navItemClickHandler","themeChangeHandler","theme","focusStyle","mode","async","groupEl","focus","removeEventListener","componentWillLoad","getCurrentDeviceSize","navParentDetails","getNavItemParentDetails","navType","parentEl","parent","componentDidLoad","disconnectedCallback","render","label","NavigationGroupElement","Host","collapsed","role","onMouseEnter","tabindex","onBlur","onClick","onKeyDown","variant","innerHTML","chevronIcon"],"sources":["./src/components/ic-navigation-group/ic-navigation-group.css?tag=ic-navigation-group&encapsulation=shadow","./src/components/ic-navigation-group/ic-navigation-group.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n/**\n * @prop --ic-z-index-navigation-item: z-index of navigation group item\n */\n\n:host {\n  display: block;\n}\n\n:host(.in-side-menu) {\n  border-bottom: var(--ic-space-1px) solid var(--ic-architectural-200);\n  padding: var(--ic-space-md) 0;\n}\n\n:host .navigation-group {\n  height: 100%;\n  width: fit-content;\n  color: var(--ic-theme-text);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0 var(--ic-space-md);\n  transition: var(--ic-easing-transition-slow);\n  position: relative;\n  background: none;\n  border: none;\n}\n\n:host(.in-side-menu) .navigation-group {\n  height: 2.5rem;\n  width: 100%;\n  text-align: left;\n}\n\n:host(.in-side-menu) .navigation-group .ic-typography-label {\n  width: 11.875rem;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu {\n  color: var(--ic-action-default);\n  justify-content: flex-start;\n  padding: 0 var(--ic-space-md) 0 var(--ic-space-md);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-collapsed,\n:host(.in-side-menu) .navigation-group-side-menu-expanded {\n  color: var(--ic-action-default);\n  justify-content: flex-start;\n  padding-left: var(--ic-space-md);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded {\n  margin-bottom: var(--ic-space-xs);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-collapsed::after,\n:host(.in-side-menu) .navigation-group-side-menu-expanded::after {\n  border-style: solid;\n  border-width: 0.125em 0.125em 0 0;\n  content: \"\";\n  display: inline-block;\n  height: 0.45em;\n  left: 0.75em;\n  position: relative;\n  top: -0.1em;\n  transform: rotate(135deg);\n  vertical-align: top;\n  width: 0.45em;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded::after {\n  top: 0.15em;\n  transform: rotate(-45deg);\n}\n\n:host .navigation-group:hover,\n:host .navigation-group:active,\n:host .selected {\n  background-color: var(--ic-architectural-20);\n  color: var(--ic-color-primary-text);\n  outline: none;\n  cursor: pointer;\n}\n\n:host(:not(.in-side-menu)) .navigation-group:focus {\n  box-shadow: var(--ic-border-focus);\n  border-radius: var(--ic-border-radius);\n  outline: var(--ic-hc-focus-outline);\n  z-index: var(--ic-z-index-navigation-item);\n  transition: box-shadow var(--ic-easing-transition-fast);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu:hover,\n:host(.in-side-menu) .navigation-group-side-menu:active,\n:host(.in-side-menu) .navigation-group-side-menu:focus {\n  background-color: var(--ic-architectural-20);\n  color: var(--ic-action-default);\n  cursor: auto;\n  box-shadow: none;\n  outline: none;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu:focus {\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded:hover:not(:focus),\n:host(.in-side-menu) .navigation-group-side-menu-collapsed:hover:not(:focus) {\n  background-color: var(--ic-action-dark-bg-hover);\n  color: var(--ic-action-default);\n  cursor: pointer;\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded:active:not(:focus),\n:host(.in-side-menu) .navigation-group-side-menu-collapsed:active:not(:focus) {\n  background-color: var(--ic-action-dark-bg-active);\n  color: var(--ic-action-default);\n}\n\n:host(.in-side-menu) .navigation-group-side-menu-expanded:focus,\n:host(.in-side-menu) .navigation-group-side-menu-collapsed:focus {\n  color: var(--ic-action-default);\n  box-shadow: var(--ic-border-focus-inset);\n  border-radius: var(--ic-border-radius-inset);\n  outline: var(--ic-hc-focus-outline);\n}\n\n:host .navigation-group-dropdown {\n  background-color: var(--ic-architectural-20);\n  border-bottom: var(--ic-border-default);\n  position: absolute;\n  left: 0;\n  right: 0;\n  padding: var(--ic-space-xs) var(--ic-space-md);\n  box-shadow: 0 0.375rem 0.5rem -0.375rem rgba(0 0 0 / 20%);\n  z-index: calc(var(--ic-z-index-navigation-item) - 1);\n}\n\n:host .navigation-group-dropdown-items-list {\n  list-style: none;\n  display: flex;\n  flex-flow: column wrap;\n  align-content: flex-start;\n  padding-left: var(--ic-space-md);\n  max-height: 16.5rem;\n}\n\n:host .chevron-toggle-icon-wrapper {\n  display: flex;\n  align-items: center;\n}\n\n:host .chevron-toggle-icon-wrapper svg {\n  transform: rotate(90deg);\n  height: var(--ic-space-lg);\n  width: var(--ic-space-lg);\n}\n\n:host .chevron-toggle-icon-closed svg {\n  transform: rotate(-90deg);\n}\n\n:host(.expanded) .grouped-links-wrapper {\n  height: var(--navigation-child-items-height, auto);\n  transition: var(--ic-easing-transition-slow);\n  overflow: hidden;\n}\n\n:host(.collapsed) .grouped-links-wrapper {\n  height: var(--navigation-child-items-height, 0);\n  transition: var(--ic-easing-transition-slow);\n  overflow: hidden;\n}\n\n:host(.navigation-group-side-nav) .navigation-group {\n  height: var(--navigation-group-height);\n  width: var(--navigation-group-width);\n  justify-content: var(--navigation-group-justify-content);\n  padding-right: var(--navigation-group-expand-toggle-padding);\n}\n\n:host(.navigation-group-side-nav) .navigation-group:hover,\n:host(.navigation-group-side-nav) .navigation-group:active,\n:host(.navigation-group-side-nav) .selected {\n  background-color: var(--navigation-group-hover);\n  color: var(--navigation-group-text-hover);\n}\n\n:host(.navigation-group-side-nav) .navigation-group:focus {\n  box-shadow: var(--ic-border-focus-inset);\n  border-radius: var(--ic-border-radius-inset);\n  background: none;\n}\n\n:host(.navigation-group-side-nav) .ic-typography-caption {\n  position: var(--navigation-group-title-position);\n  left: var(--navigation-group-title-position-left);\n  white-space: nowrap;\n}\n\n.menu-visibility-visible {\n  visibility: visible;\n}\n\n.menu-visibility-hidden {\n  visibility: hidden;\n}\n","import {\n  Component,\n  Element,\n  Host,\n  Prop,\n  State,\n  Listen,\n  h,\n  Method,\n} from \"@stencil/core\";\n\nimport {\n  DEVICE_SIZES,\n  getCurrentDeviceSize,\n  getThemeForegroundColor,\n  getNavItemParentDetails,\n} from \"../../utils/helpers\";\nimport { IcNavType, IcTheme } from \"../../utils/types\";\n\nimport chevronIcon from \"../../assets/chevron-icon.svg\";\n\n@Component({\n  tag: \"ic-navigation-group\",\n  styleUrl: \"ic-navigation-group.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class NavigationGroup {\n  @Element() el: HTMLIcNavigationGroupElement;\n\n  /**\n   * The label to display on the group.\n   */\n  @Prop() label: string;\n\n  /**\n   *  If `true`, the group will be expandable in the side menu.\n   */\n  @Prop() expandable: boolean = false;\n\n  @State() dropdownOpen: boolean = false;\n\n  @State() inTopNavSideMenu: boolean = false;\n\n  @State() deviceSize: number = DEVICE_SIZES.XL;\n\n  @State() focusStyle = getThemeForegroundColor();\n\n  @State() navigationType: IcNavType | \"\";\n\n  @State() parentEl: HTMLElement;\n\n  @State() expanded: boolean = true;\n\n  private groupEl: HTMLElement;\n  private dropdown: HTMLElement;\n  private DYNAMIC_GROUPED_LINKS_HEIGHT_MS = 50;\n  private IC_NAVIGATION_ITEM = \"ic-navigation-item\";\n  private nodeName = \"IC-NAVIGATION-GROUP\";\n  private mouseGate: boolean = false;\n\n  @Listen(\"childBlur\")\n  childBlurHandler(): void {\n    this.hideDropdown();\n  }\n\n  @Listen(\"navItemClicked\")\n  navItemClickHandler(): void {\n    this.hideDropdown();\n  }\n\n  @Listen(\"themeChange\", { target: \"document\" })\n  themeChangeHandler(ev: CustomEvent): void {\n    const theme: IcTheme = ev.detail;\n    this.focusStyle = theme.mode;\n  }\n\n  /**\n   * Sets focus on the nav item.\n   */\n  @Method()\n  async setFocus(): Promise<void> {\n    if (this.groupEl) {\n      this.groupEl.focus();\n    }\n  }\n\n  private sideNavExpandHandler = (): void => {\n    setTimeout(\n      () => this.setInitialGroupedLinksWrapperHeight(),\n      this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS\n    );\n  };\n\n  private topNavResizedHandler = (ev: CustomEvent): void => {\n    const newSize = ev.detail.size;\n    if (newSize !== this.deviceSize) {\n      this.deviceSize = newSize;\n      this.inTopNavSideMenu = newSize <= DEVICE_SIZES.L;\n    }\n  };\n\n  private toggleDropdown() {\n    this.dropdownOpen = !this.dropdownOpen;\n  }\n\n  private setGroupedNavItemTabIndex = (tabIndexValue: string) => {\n    this.el\n      .querySelectorAll(this.IC_NAVIGATION_ITEM)\n      .forEach((navigationItem) => {\n        const navItem =\n          navigationItem.shadowRoot.querySelector(\"a\") ||\n          navigationItem.querySelector(\"a\");\n        if (navItem) {\n          navItem.setAttribute(\"tabindex\", tabIndexValue);\n        }\n      });\n  };\n\n  private toggleGroupedLinkWrapperHeight = (\n    wrapper: HTMLElement,\n    expanded: boolean\n  ) => {\n    if (wrapper) {\n      if (expanded) {\n        wrapper.setAttribute(\n          \"style\",\n          `--navigation-child-items-height: ${this.getNavigationChildItemsHeight()}`\n        );\n        this.setGroupedNavItemTabIndex(\"0\");\n      } else {\n        wrapper.setAttribute(\"style\", `--navigation-child-items-height: 0`);\n        this.setGroupedNavItemTabIndex(\"-1\");\n      }\n    }\n  };\n\n  private toggleExpanded = () => {\n    this.expanded = !this.expanded;\n    const linkWrapper = this.el.shadowRoot.querySelector(\n      \".grouped-links-wrapper\"\n    ) as HTMLElement;\n    this.toggleGroupedLinkWrapperHeight(linkWrapper, this.expanded);\n  };\n\n  private showDropdown() {\n    if (!this.dropdownOpen) {\n      this.toggleDropdown();\n    }\n  }\n\n  private hideDropdown() {\n    document.removeEventListener(\"keydown\", this.handleKeydown);\n    if (this.dropdownOpen) {\n      this.toggleDropdown();\n    }\n  }\n\n  private handleClick = (ev: MouseEvent) => {\n    if (this.navigationType === \"top\" && ev.detail) {\n      this.toggleDropdown();\n    } else {\n      this.toggleExpanded();\n    }\n  };\n\n  private handleBlur = (ev: FocusEvent) => {\n    const target = ev.relatedTarget as HTMLElement;\n    if (!this.el.contains(target)) {\n      this.hideDropdown();\n    }\n  };\n\n  private handleTopNavKeydown = (ev: KeyboardEvent) => {\n    if (ev.key === \" \" || ev.key === \"Enter\") {\n      this.toggleDropdown();\n    } else if (!this.inTopNavSideMenu && ev.key === \"Escape\") {\n      this.hideDropdown();\n    }\n  };\n\n  private handleKeydown = (ev: KeyboardEvent) => {\n    if (ev.key === \"Enter\" || ev.key === \" \" || ev.key === \"Escape\") {\n      switch (this.navigationType) {\n        case \"top\":\n          this.handleTopNavKeydown(ev as KeyboardEvent);\n          break;\n        case \"side\":\n          this.toggleExpanded();\n          ev.preventDefault();\n          break;\n        default:\n          this.toggleExpanded();\n          break;\n      }\n    }\n  };\n\n  private handleMouseLeave = (ev: MouseEvent) => {\n    const relTarget = ev.relatedTarget as HTMLElement;\n\n    this.mouseGate = false;\n\n    if (\n      !this.el.contains(relTarget) &&\n      relTarget !== this.dropdown &&\n      document.activeElement !== this.el &&\n      !this.el.contains(document.activeElement) &&\n      relTarget.nodeName === this.nodeName &&\n      this.dropdownOpen === true\n    ) {\n      this.mouseGate = true;\n      this.hideDropdown();\n    } else if (\n      !this.el.contains(relTarget) &&\n      relTarget !== this.dropdown &&\n      !this.el.contains(document.activeElement)\n    ) {\n      this.mouseGate = false;\n      setTimeout(() => {\n        this.dropdownOpen ? this.hideDropdown() : null;\n      }, 500);\n    }\n  };\n\n  private handleMouseEnter = (ev: MouseEvent) => {\n    const relTarget = ev.relatedTarget as HTMLElement;\n    document.addEventListener(\"keydown\", this.handleKeydown);\n\n    if (relTarget.nodeName === this.nodeName && this.mouseGate === true) {\n      this.showDropdown();\n    } else if (\n      this.dropdownOpen === false &&\n      relTarget !== null &&\n      this.mouseGate === false\n    ) {\n      this.mouseGate = true;\n      setTimeout(() => {\n        this.mouseGate && this.showDropdown();\n      }, 500);\n    }\n  };\n\n  private renderDropdownGroupedLinks = (): HTMLDivElement => (\n    <div\n      class={{\n        [\"navigation-group-dropdown\"]: !this.inTopNavSideMenu,\n        [\"navigation-group-dropdown-side-menu\"]: this.inTopNavSideMenu,\n        [\"selected\"]: this.dropdownOpen && !this.inTopNavSideMenu,\n      }}\n      onMouseLeave={!this.inTopNavSideMenu ? this.handleMouseLeave : null}\n      ref={(el) => (this.dropdown = el)}\n    >\n      <nav\n        class={{\n          [\"navigation-group-dropdown-items\"]: !this.inTopNavSideMenu,\n        }}\n      >\n        <ul>\n          <slot></slot>\n        </ul>\n      </nav>\n    </div>\n  );\n\n  private renderGroupedLinks = (): HTMLDivElement => (\n    <ul class=\"grouped-links-wrapper\">\n      <slot></slot>\n    </ul>\n  );\n\n  /**\n   * Gets the total height of navigation links to improve\n   * smoothness of expand/collapse animations\n   */\n  private getNavigationChildItemsHeight = (): string => {\n    const navigationItemLength =\n      this.el.querySelectorAll(this.IC_NAVIGATION_ITEM).length || 0;\n    const navigationItem =\n      this.el.querySelector(this.IC_NAVIGATION_ITEM) || null;\n\n    if (\n      this.navigationType === \"side\" &&\n      !!navigationItemLength &&\n      navigationItem\n    ) {\n      return `${\n        parseInt(getComputedStyle(navigationItem).height) * navigationItemLength\n      }px`;\n    }\n\n    return \"auto\";\n  };\n\n  private setInitialGroupedLinksWrapperHeight = () => {\n    const linkWrapper = this.el.shadowRoot.querySelector(\n      \".grouped-links-wrapper\"\n    ) as HTMLElement;\n\n    if (linkWrapper && this.expanded) {\n      linkWrapper.setAttribute(\n        \"style\",\n        `--navigation-child-items-height: ${this.getNavigationChildItemsHeight()}`\n      );\n    }\n  };\n\n  private renderNavigationItems = (): HTMLDivElement | null => {\n    if (this.dropdownOpen || (this.inTopNavSideMenu && !this.expandable)) {\n      return this.renderDropdownGroupedLinks();\n    }\n\n    if (this.navigationType !== \"top\") {\n      return this.renderGroupedLinks();\n    }\n\n    return null;\n  };\n\n  componentWillLoad(): void {\n    this.deviceSize = getCurrentDeviceSize();\n    const navParentDetails = getNavItemParentDetails(this.el);\n    this.navigationType = navParentDetails.navType;\n    this.parentEl = navParentDetails.parent;\n    if (this.deviceSize <= DEVICE_SIZES.L && this.navigationType === \"top\") {\n      this.inTopNavSideMenu = true;\n    }\n\n    if (this.navigationType === \"side\") {\n      this.parentEl.addEventListener(\n        \"sideNavExpanded\",\n        this.sideNavExpandHandler\n      );\n    } else if (this.navigationType === \"top\") {\n      this.parentEl.addEventListener(\n        \"topNavResized\",\n        this.topNavResizedHandler\n      );\n    }\n  }\n\n  componentDidLoad(): void {\n    /**\n     * debounce is required as the incorrect height was retrieved instantly after\n     * componentDidLoad is invoked.\n     */\n    setTimeout(\n      () => this.setInitialGroupedLinksWrapperHeight(),\n      this.DYNAMIC_GROUPED_LINKS_HEIGHT_MS\n    );\n  }\n\n  disconnectedCallback(): void {\n    if (this.navigationType === \"side\") {\n      this.parentEl.removeEventListener(\n        \"sideNavExpanded\",\n        this.sideNavExpandHandler\n      );\n    } else if (this.navigationType === \"top\") {\n      this.parentEl.removeEventListener(\n        \"topNavResized\",\n        this.topNavResizedHandler\n      );\n    }\n  }\n\n  render() {\n    const { label, dropdownOpen, inTopNavSideMenu, expandable } = this;\n\n    const NavigationGroupElement =\n      !inTopNavSideMenu || expandable ? \"button\" : \"div\";\n\n    return (\n      <Host\n        class={{\n          [\"in-side-menu\"]: inTopNavSideMenu,\n          expanded: this.expanded,\n          collapsed: !this.expanded,\n          [\"navigation-group-side-nav\"]: this.navigationType === \"side\",\n        }}\n        role=\"listitem\"\n      >\n        <NavigationGroupElement\n          onMouseEnter={\n            !inTopNavSideMenu &&\n            this.navigationType === \"top\" &&\n            this.handleMouseEnter\n          }\n          onMouseLeave={this.navigationType === \"top\" && this.handleMouseLeave}\n          tabindex={inTopNavSideMenu && !expandable ? \"-1\" : \"0\"}\n          onBlur={this.handleBlur}\n          onClick={expandable ? this.handleClick : null}\n          onKeyDown={this.handleKeydown}\n          class={{\n            [\"navigation-group\"]: true,\n            [this.focusStyle]: !inTopNavSideMenu,\n            [\"navigation-group-side-menu\"]: inTopNavSideMenu && !expandable,\n            [\"navigation-group-side-menu-collapsed\"]:\n              inTopNavSideMenu && expandable && !dropdownOpen,\n            [\"navigation-group-side-menu-expanded\"]:\n              inTopNavSideMenu && expandable && dropdownOpen,\n            [\"selected\"]: dropdownOpen && !inTopNavSideMenu,\n          }}\n          ref={(el) => (this.groupEl = el)}\n          aria-expanded={dropdownOpen || this.expanded ? \"true\" : \"false\"}\n          aria-haspopup={\n            !inTopNavSideMenu && this.navigationType === \"top\"\n              ? \"true\"\n              : \"false\"\n          }\n        >\n          <ic-typography\n            variant={this.navigationType === \"side\" ? \"caption\" : \"label\"}\n          >\n            {label}\n          </ic-typography>\n          {this.navigationType === \"side\" && expandable && (\n            <div\n              class={{\n                \"chevron-toggle-icon-wrapper\": true,\n                \"chevron-toggle-icon-closed\": this.expanded,\n              }}\n              innerHTML={chevronIcon}\n            ></div>\n          )}\n        </NavigationGroupElement>\n        {this.renderNavigationItems()}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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"}

package/dist/core/p-bad10f6c.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icInputLabelCss","InputLabel","componentDidLoad","onComponentRequiredPropUndefined","prop","this","label","propName","render","disabled","readonly","required","helperText","error","dark","labelText","labelContent","h","htmlFor","for","id","getInputHelperTextID","Host","class","variant","icInputValidationCss","icon","IcInformationStatus","Warning","warningIcon","Error","errorIcon","Success","successIcon","InputValidation","message","displayIcon","status","getInputValidationTextID","fullWidth","innerHTML","ariaLiveMode","name"],"sources":["./src/components/ic-input-label/ic-input-label.css?tag=ic-input-label","./src/components/ic-input-label/ic-input-label.tsx","./src/components/ic-input-validation/ic-input-validation.css?tag=ic-input-validation","./src/components/ic-input-validation/ic-input-validation.tsx"],"sourcesContent":["ic-input-label {\n  margin-bottom: var(--ic-space-xs);\n}\n\nic-input-label.with-helper {\n  margin-bottom: var(--ic-space-xxxs);\n}\n\nic-input-label.disabled {\n  color: var(--ic-color-tertiary-text);\n}\n\nic-input-label.readonly {\n  color: var(--ic-color-tertiary-text);\n}\n\nic-input-label .helpertext {\n  margin-top: var(--ic-space-xxxs);\n}\n\nic-input-label .helpertext-normal {\n  color: var(--ic-color-secondary-text);\n}\n\nic-input-label .helpertext-readonly {\n  color: var(--ic-color-tertiary-text);\n}\n\nic-input-label .readonly-label {\n  color: var(--ic-color-secondary-text);\n}\n\nic-input-label .error-label {\n  color: var(--ic-status-error);\n}\n\nic-input-label .dark {\n  color: var(--ic-architectural-white);\n}\n","import { Component, Host, Prop, h } from \"@stencil/core\";\n\nimport {\n  getInputHelperTextID,\n  onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\n\n@Component({\n  tag: \"ic-input-label\",\n  styleUrl: \"./ic-input-label.css\",\n})\nexport class InputLabel {\n  /**\n   * The ID of the form element the label is bound to.\n   */\n  @Prop() for: string;\n  /**\n   * If `true`, the input label will require a value.\n   */\n  @Prop() required: boolean = false;\n  /**\n   * The helper text that will be displayed.\n   */\n  @Prop() helperText: string = \"\";\n  /**\n   * The text content of the label.\n   */\n  @Prop() label!: string;\n  /**\n   * If `true`, the disabled state will be set.\n   */\n  @Prop() disabled: boolean = false;\n  /**\n   * If `true`, the readonly state will be set.\n   */\n  @Prop() readonly: boolean = false;\n  /**\n   * If `true`, the input label will display with error styling.\n   */\n  @Prop() error?: boolean = false;\n  /**\n   * If `true`, the dark variant of the input label will be displayed.\n   */\n  @Prop() dark?: boolean = false;\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Input Label\"\n    );\n  }\n\n  render() {\n    const { disabled, readonly, label, required, helperText, error, dark } =\n      this;\n    const labelText = required ? label + \" *\" : label;\n    const labelContent = readonly ? (\n      `${labelText}`\n    ) : (\n      <label htmlFor={this.for}>{labelText}</label>\n    );\n\n    const id = getInputHelperTextID(this.for);\n\n    return (\n      <Host\n        class={{\n          [\"disabled\"]: disabled,\n          [\"readonly\"]: readonly,\n          [\"with-helper\"]: helperText !== \"\",\n        }}\n      >\n        <ic-typography\n          variant=\"label\"\n          class={{\n            [\"readonly-label\"]: readonly,\n            [\"error-label\"]: error && !(readonly || disabled),\n            [\"dark\"]: dark,\n          }}\n        >\n          {labelContent}\n        </ic-typography>\n\n        {helperText !== \"\" && (\n          <ic-typography\n            variant=\"caption\"\n            class={{\n              [\"helpertext\"]: true,\n              [\"helpertext-normal\"]: !disabled && !readonly,\n              [\"helpertext-readonly\"]: readonly,\n            }}\n          >\n            <span id={id}>{helperText}</span>\n          </ic-typography>\n        )}\n      </Host>\n    );\n  }\n}\n","ic-input-validation {\n  width: var(--input-width, 20rem);\n  margin-top: var(--ic-space-xs);\n  display: flex;\n}\n\nic-input-validation.fullwidth {\n  width: 100%;\n}\n\nic-input-validation span.status-icon {\n  padding-right: var(--ic-space-xxs);\n}\n\nic-input-validation span.status-icon > svg {\n  height: 1.25rem;\n  width: 1.25rem;\n}\n\nic-input-validation span.icon-success > svg {\n  fill: var(--ic-status-success);\n}\n\nic-input-validation span.icon-error > svg {\n  fill: var(--ic-status-error);\n}\n\nic-input-validation span.icon-warning > svg {\n  fill: var(--ic-status-warning-mid);\n}\n\nic-input-validation .statustext {\n  flex-grow: 1;\n}\n","import { Element, Component, Host, Prop, h } from \"@stencil/core\";\n\nimport {\n  IcInformationStatus,\n  IcInformationStatusOrEmpty,\n} from \"../../utils/types\";\nimport errorIcon from \"../../assets/error-icon.svg\";\nimport successIcon from \"../../assets/success-icon.svg\";\nimport warningIcon from \"../../assets/warning-icon.svg\";\n\nimport {\n  getInputValidationTextID,\n  onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcAriaLiveModeVariants } from \"./ic-input-validation.types\";\n\nconst icon = {\n  [IcInformationStatus.Warning]: warningIcon,\n  [IcInformationStatus.Error]: errorIcon,\n  [IcInformationStatus.Success]: successIcon,\n};\n\n/**\n * @slot validation-message-adornment - Content will be placed to the right of the validation message.\n */\n@Component({\n  tag: \"ic-input-validation\",\n  styleUrl: \"ic-input-validation.css\",\n})\nexport class InputValidation {\n  @Element() el: HTMLIcInputValidationElement;\n\n  /**\n   * The validation message to display.\n   */\n  @Prop() message!: string;\n  /**\n   * The ID of the form element the validation is bound to.\n   */\n  @Prop() for: string;\n  /**\n   * The status of the validation - e.g. 'error' | 'warning' | 'success'.\n   */\n  @Prop() status: IcInformationStatusOrEmpty = \"\";\n  /**\n   *  If `true`, the input validation will fill the width of the container.\n   */\n  @Prop() fullWidth: boolean = false;\n  /**\n   *  The ARIA live mode to apply to the message.\n   */\n  @Prop() ariaLiveMode: IcAriaLiveModeVariants = \"polite\";\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.message, propName: \"message\" }],\n      \"Input Validation\"\n    );\n  }\n\n  render() {\n    const displayIcon = this.status !== \"\" ? icon[this.status] : \"\";\n    const id = getInputValidationTextID(this.for);\n    return (\n      <Host\n        class={{\n          [this.status]: this.status !== \"\",\n          [\"fullwidth\"]: this.fullWidth,\n        }}\n      >\n        {displayIcon !== \"\" && (\n          <span\n            class={{\n              [\"status-icon\"]: true,\n              [`icon-${this.status}`]: true,\n            }}\n            innerHTML={displayIcon}\n          />\n        )}\n\n        <ic-typography variant=\"caption\" class=\"statustext\">\n          <span aria-live={this.ariaLiveMode} id={id}>\n            {this.message}\n          </span>\n        </ic-typography>\n\n        <slot name=\"validation-message-adornment\"></slot>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oKAAA,MAAMA,EAAkB,ymB,MCWXC,EAAU,M,0DAQO,M,gBAIC,G,mCAQD,M,cAIA,M,WAIF,M,UAID,K,CAEzBC,mBACEC,EACE,CAAC,CAAEC,KAAMC,KAAKC,MAAOC,SAAU,UAC/B,c,CAIJC,SACE,MAAMC,SAAEA,EAAQC,SAAEA,EAAQJ,MAAEA,EAAKK,SAAEA,EAAQC,WAAEA,EAAUC,MAAEA,EAAKC,KAAEA,GAC9DT,KACF,MAAMU,EAAYJ,EAAWL,EAAQ,KAAOA,EAC5C,MAAMU,EAAeN,EAAQ,GACxBK,IAEHE,EAAA,SAAOC,QAASb,KAAKc,KAAMJ,GAG7B,MAAMK,EAAKC,EAAqBhB,KAAKc,KAErC,OACEF,EAACK,EAAI,CACHC,MAAO,CACL,CAAC,YAAad,EACd,CAAC,YAAaC,EACd,CAAC,eAAgBE,IAAe,KAGlCK,EAAA,iBACEO,QAAQ,QACRD,MAAO,CACL,CAAC,kBAAmBb,EACpB,CAAC,eAAgBG,KAAWH,GAAYD,GACxC,CAAC,QAASK,IAGXE,GAGFJ,IAAe,IACdK,EAAA,iBACEO,QAAQ,UACRD,MAAO,CACL,CAAC,cAAe,KAChB,CAAC,sBAAuBd,IAAaC,EACrC,CAAC,uBAAwBA,IAG3BO,EAAA,QAAMG,GAAIA,GAAKR,I,aC5F3B,MAAMa,EAAuB,4hBCgB7B,MAAMC,EAAO,CACX,CAACC,EAAoBC,SAAUC,EAC/B,CAACF,EAAoBG,OAAQC,EAC7B,CAACJ,EAAoBK,SAAUC,G,MAUpBC,EAAe,M,+EAcmB,G,eAIhB,M,kBAIkB,Q,CAE/ChC,mBACEC,EACE,CAAC,CAAEC,KAAMC,KAAK8B,QAAS5B,SAAU,YACjC,mB,CAIJC,SACE,MAAM4B,EAAc/B,KAAKgC,SAAW,GAAKX,EAAKrB,KAAKgC,QAAU,GAC7D,MAAMjB,EAAKkB,EAAyBjC,KAAKc,KACzC,OACEF,EAACK,EAAI,CACHC,MAAO,CACL,CAAClB,KAAKgC,QAAShC,KAAKgC,SAAW,GAC/B,CAAC,aAAchC,KAAKkC,YAGrBH,IAAgB,IACfnB,EAAA,QACEM,MAAO,CACL,CAAC,eAAgB,KACjB,CAAC,QAAQlB,KAAKgC,UAAW,MAE3BG,UAAWJ,IAIfnB,EAAA,iBAAeO,QAAQ,UAAUD,MAAM,cACrCN,EAAA,oBAAiBZ,KAAKoC,aAAcrB,GAAIA,GACrCf,KAAK8B,UAIVlB,EAAA,QAAMyB,KAAK,iC"}

package/dist/core/p-bda4414e.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icDataRowCss","DataRow","this","resizeObserver","hasEndComponent","runResizeObserver","ResizeObserver","checkLabelAbove","observe","el","DEVICE_SIZES","XL","rowSize","_a","shadowRoot","querySelector","clientWidth","S","entitySize","M","labelEndComponent","component","querySelectorAll","forEach","child","setAttribute","label","componentWillLoad","deviceSize","getCurrentDeviceSize","slotHasContent","componentDidLoad","checkResizeObserver","disconnectedCallback","disconnect","render","value","small","h","Host","class","role","name","variant"],"sources":["./src/components/ic-data-row/ic-data-row.css?tag=ic-data-row&encapsulation=shadow","./src/components/ic-data-row/ic-data-row.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  position: relative;\n  display: block;\n}\n\n.data {\n  display: flex;\n  align-items: center;\n}\n\n.text-cells {\n  display: flex;\n  flex-grow: 1;\n  min-width: 0;\n}\n\n.label {\n  width: 12.5rem;\n  min-width: 12.5rem;\n  margin-right: var(--ic-space-md);\n  color: var(--ic-color-tertiary-text);\n}\n\n.value {\n  flex-grow: 1;\n}\n\nslot[name=\"value\"]::slotted(ic-text-field[readonly][hide-label]) {\n  margin-top: calc(var(--ic-space-xs) * -1);\n}\n\nslot[name=\"value\"]::slotted(ic-text-field[small][readonly][hide-label]) {\n  margin-top: calc(var(--ic-space-xxs) * -1);\n}\n\nslot[name=\"value\"]::slotted(ic-text-field[readonly][hide-label][rows]) {\n  margin-top: calc(var(--ic-space-xxs) * -1 - var(--ic-space-xxxs));\n}\n\n.end-component {\n  width: fit-content;\n  margin-left: 3.5rem;\n}\n\n.divider {\n  margin-top: var(--ic-space-md);\n  height: var(--ic-space-1px);\n  background-color: var(--ic-architectural-300);\n}\n\n:host(.small) .divider {\n  margin-top: var(--ic-space-xs);\n}\n\n:host(.breakpoint-medium) .label {\n  width: 10rem;\n  min-width: 10rem;\n}\n\n:host(.breakpoint-xs) .text-cells {\n  flex-direction: column;\n}\n\n:host(.breakpoint-xs) .label {\n  width: 8rem;\n  margin-bottom: var(--ic-space-xs);\n}\n\n:host(.breakpoint-xs) .value {\n  max-width: 95%;\n}\n\n:host(.breakpoint-xs) .end-component {\n  margin-left: 0;\n}\n\n@media (forced-colors: active) {\n  .divider {\n    background-color: canvastext;\n  }\n}\n","import { Component, Element, Host, Prop, h, State } from \"@stencil/core\";\nimport {\n  checkResizeObserver,\n  DEVICE_SIZES,\n  getCurrentDeviceSize,\n  slotHasContent,\n} from \"../../utils/helpers\";\n\n/**\n * @slot label - Content will be rendered in the leftmost cell.\n * @slot value - Content will be rendered to the right of the label.\n * @slot end-component - Content will be displayed in the rightmost cell.\n */\n@Component({\n  tag: \"ic-data-row\",\n  styleUrl: \"ic-data-row.css\",\n  shadow: true,\n})\nexport class DataRow {\n  @Element() el: HTMLIcDataRowElement;\n\n  /**\n   * The label in the leftmost cell of the row.\n   */\n  @Prop() label: string;\n\n  /**\n   * The value of the middle (right if no end-component supplied) cell of the row.\n   */\n  @Prop() value: string;\n\n  /**\n   * If `true`, the small styling will be applied to the row. This is automatically applied if small is set on the parent data heading.\n   */\n  @Prop() small: boolean = false;\n\n  @State() deviceSize: number = DEVICE_SIZES.XL;\n\n  @State() entitySize: \"xl\" | \"m\" | \"xs\";\n\n  private resizeObserver: ResizeObserver = null;\n\n  private hasEndComponent: boolean = false;\n\n  private runResizeObserver = () => {\n    this.resizeObserver = new ResizeObserver(() => {\n      this.checkLabelAbove();\n    });\n\n    this.resizeObserver.observe(this.el);\n  };\n\n  private checkLabelAbove() {\n    const rowSize = this.el.shadowRoot.querySelector(\".data\")?.clientWidth;\n    if (rowSize) {\n      if (rowSize + 46 < DEVICE_SIZES.S) {\n        this.entitySize = \"xs\";\n      } else if (rowSize + 46 < DEVICE_SIZES.M) {\n        this.entitySize = \"m\";\n      } else {\n        this.entitySize = \"xl\";\n      }\n    }\n  }\n\n  private labelEndComponent(): void {\n    const component = this.el.shadowRoot.querySelectorAll(\n      \"slot[name=end-component]\"\n    );\n\n    component.forEach((child: HTMLElement) =>\n      child.setAttribute(\"aria-label\", \"for \" + this.label + \" row\")\n    );\n  }\n\n  componentWillLoad(): void {\n    this.deviceSize = getCurrentDeviceSize();\n    this.hasEndComponent = slotHasContent(this.el, \"end-component\");\n    this.checkLabelAbove();\n  }\n\n  componentDidLoad(): void {\n    checkResizeObserver(this.runResizeObserver);\n    if (this.hasEndComponent) {\n      this.labelEndComponent();\n    }\n  }\n\n  disconnectedCallback(): void {\n    if (this.resizeObserver !== null) {\n      this.resizeObserver.disconnect();\n    }\n  }\n\n  render() {\n    const { label, value, small } = this;\n\n    return (\n      <Host\n        class={{\n          [\"small\"]: small,\n          [\"breakpoint-medium\"]: this.entitySize === \"m\",\n          [\"breakpoint-xs\"]: this.entitySize === \"xs\",\n        }}\n        role=\"listitem\"\n      >\n        <div class=\"data\">\n          <div class=\"text-cells\">\n            <div class=\"label\">\n              <slot name=\"label\">\n                <ic-typography\n                  variant={\n                    this.entitySize === \"xs\" ? \"label\" : \"subtitle-large\"\n                  }\n                >\n                  {label}\n                </ic-typography>\n              </slot>\n            </div>\n            <div class=\"value\">\n              <slot name=\"value\">\n                <ic-typography variant=\"body\">{value}</ic-typography>\n              </slot>\n            </div>\n          </div>\n          {this.hasEndComponent && (\n            <div class=\"end-component\">\n              <div role=\"cell\">\n                <slot name=\"end-component\"></slot>\n              </div>\n            </div>\n          )}\n        </div>\n        <div class=\"divider\" />\n      </Host>\n    );\n  }\n}\n"],"mappings":"qIAAA,MAAMA,EAAe,mhH,MCkBRC,EAAO,M,yBAsBVC,KAAAC,eAAiC,KAEjCD,KAAAE,gBAA2B,MAE3BF,KAAAG,kBAAoB,KAC1BH,KAAKC,eAAiB,IAAIG,gBAAe,KACvCJ,KAAKK,iBAAiB,IAGxBL,KAAKC,eAAeK,QAAQN,KAAKO,GAAG,E,qDAfb,M,gBAEKC,EAAaC,G,0BAgBnCJ,kB,MACN,MAAMK,GAAUC,EAAAX,KAAKO,GAAGK,WAAWC,cAAc,YAAQ,MAAAF,SAAA,SAAAA,EAAEG,YAC3D,GAAIJ,EAAS,CACX,GAAIA,EAAU,GAAKF,EAAaO,EAAG,CACjCf,KAAKgB,WAAa,I,MACb,GAAIN,EAAU,GAAKF,EAAaS,EAAG,CACxCjB,KAAKgB,WAAa,G,KACb,CACLhB,KAAKgB,WAAa,I,GAKhBE,oBACN,MAAMC,EAAYnB,KAAKO,GAAGK,WAAWQ,iBACnC,4BAGFD,EAAUE,SAASC,GACjBA,EAAMC,aAAa,aAAc,OAASvB,KAAKwB,MAAQ,S,CAI3DC,oBACEzB,KAAK0B,WAAaC,IAClB3B,KAAKE,gBAAkB0B,EAAe5B,KAAKO,GAAI,iBAC/CP,KAAKK,iB,CAGPwB,mBACEC,EAAoB9B,KAAKG,mBACzB,GAAIH,KAAKE,gBAAiB,CACxBF,KAAKkB,mB,EAITa,uBACE,GAAI/B,KAAKC,iBAAmB,KAAM,CAChCD,KAAKC,eAAe+B,Y,EAIxBC,SACE,MAAMT,MAAEA,EAAKU,MAAEA,EAAKC,MAAEA,GAAUnC,KAEhC,OACEoC,EAACC,EAAI,CACHC,MAAO,CACL,CAAC,SAAUH,EACX,CAAC,qBAAsBnC,KAAKgB,aAAe,IAC3C,CAAC,iBAAkBhB,KAAKgB,aAAe,MAEzCuB,KAAK,YAELH,EAAA,OAAKE,MAAM,QACTF,EAAA,OAAKE,MAAM,cACTF,EAAA,OAAKE,MAAM,SACTF,EAAA,QAAMI,KAAK,SACTJ,EAAA,iBACEK,QACEzC,KAAKgB,aAAe,KAAO,QAAU,kBAGtCQ,KAIPY,EAAA,OAAKE,MAAM,SACTF,EAAA,QAAMI,KAAK,SACTJ,EAAA,iBAAeK,QAAQ,QAAQP,MAIpClC,KAAKE,iBACJkC,EAAA,OAAKE,MAAM,iBACTF,EAAA,OAAKG,KAAK,QACRH,EAAA,QAAMI,KAAK,qBAKnBJ,EAAA,OAAKE,MAAM,Y"}

package/dist/core/p-c0333310.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icMenuItemCss","MenuItem","this","handleClick","e","preventDefault","submenuTriggerFor","undefined","triggerPopoverMenuInstance","emit","variant","toggleChecked","handleMenuItemClick","label","hasSubMenu","el","getMenuItemAriaLabel","ariaLabel","description","keyboardShortcut","classList","contains","parentEl","getParentElement","tagName","handleHostClick","disabled","stopImmediatePropagation","componentWillLoad","removeDisabledFalse","componentDidLoad","onComponentRequiredPropUndefined","prop","propName","render","isPropDefined","MenuItemInformation","h","class","Host","role","disableTooltip","fullWidth","onClick","href","hreflang","target","rel","referrerpolicy","isSlotUsed","name","innerHTML","Check","Chevron"],"sources":["./src/components/ic-menu-item/ic-menu-item.css?tag=ic-menu-item&encapsulation=shadow","./src/components/ic-menu-item/ic-menu-item.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\nli {\n  list-style: none;\n  padding: 0;\n}\n\n:host::part(button) {\n  color: var(--ic-color-primary-text);\n  padding: calc(var(--ic-space-xxxs) / 2);\n  display: flex;\n  align-items: flex-start;\n  gap: var(--ic-space-xs);\n  border-radius: 0;\n  min-height: 2.5rem;\n  height: auto;\n}\n\n.focus-border {\n  display: flex;\n  align-items: flex-start;\n  gap: var(--ic-space-xs);\n  border-radius: var(--ic-border-radius);\n  margin: calc(var(--ic-space-xxxs) / 2);\n  padding: var(--ic-space-xxs);\n  border: var(--ic-space-xxxs) dashed transparent;\n\n  --icon-height: auto;\n}\n\n:host(.disabled)::part(button) {\n  color: var(--ic-architectural-200) !important;\n  pointer-events: none;\n}\n\n:host(.disabled) .menu-item-label,\n:host(.disabled) .shortcut,\n:host(.disabled) .menu-item-description {\n  color: var(--ic-architectural-200) !important;\n}\n\n:host([variant=\"destructive\"])::part(button) {\n  color: var(--ic-action-destructive);\n}\n\n:host::part(button):hover {\n  background-color: var(--ic-action-dark-bg-hover);\n}\n\n:host::part(button):focus-visible,\n:host::part(button):focus {\n  color: var(--ic-color-white-text);\n  background-color: var(--ic-focus-blue);\n  box-shadow: none;\n}\n\n:host(.disabled)::part(button):focus-visible,\n:host(.disabled)::part(button):focus {\n  color: var(--ic-theme-lighten-40) !important;\n}\n\n:host([variant=\"destructive\"])::part(button):focus-visible,\n:host([variant=\"destructive\"])::part(button):focus {\n  background-color: var(--ic-action-destructive);\n}\n\nic-button:focus-within .menu-item-label,\nic-button:focus-within .shortcut,\nic-button:focus-within .menu-item-description {\n  color: var(--ic-color-white-text);\n}\n\n:host(.disabled) ic-button:focus-within .focus-border {\n  border-color: var(--ic-architectural-white);\n}\n\n:host(.disabled) ic-button:focus-within .menu-item-label,\n:host(.disabled) ic-button:focus-within .shortcut,\n:host(.disabled) ic-button:focus-within .menu-item-description {\n  color: var(--ic-theme-lighten-40) !important;\n}\n\n:host::part(button):active {\n  background-color: var(--ic-action-dark-bg-active);\n  color: var(--ic-color-primary-text) !important;\n}\n\n:host([variant=\"destructive\"])::part(button):active {\n  background-color: var(--ic-action-dark-bg-active);\n  color: var(--ic-action-destructive) !important;\n}\n\n.menu-item-info {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  align-items: baseline;\n  white-space: pre-line;\n  text-align: left;\n}\n\n.menu-labels {\n  display: flex;\n  align-items: baseline;\n  gap: var(--ic-space-xs);\n}\n\n.menu-item-description {\n  color: var(--ic-color-secondary-text);\n}\n\n.shortcut {\n  color: var(--ic-color-tertiary-text);\n  display: flex;\n  flex: min-content;\n}\n\n:host([variant=\"destructive\"]) .menu-item-label {\n  text-transform: uppercase;\n  font-weight: 600;\n  letter-spacing: 0.025em;\n}\n\nic-button:active .menu-item-label {\n  color: var(--ic-color-primary-text);\n}\n\nic-button:active .menu-item-description {\n  color: var(--ic-color-secondary-text);\n}\n\nic-button:active .shortcut {\n  color: var(--ic-color-tertiary-text);\n}\n\n:host([variant=\"destructive\"]) ic-button:active .menu-item-label {\n  color: var(--ic-action-destructive) !important;\n}\n\n.icon,\n.check-icon,\n.submenu-icon,\n.icon ::slotted(svg),\n.check-icon svg,\n.submenu-icon svg {\n  width: var(--ic-space-lg);\n  height: var(--ic-space-lg);\n}\n\n.check-icon.hide {\n  visibility: hidden;\n}\n\n/** High Contrast **/\n@media (forced-colors: active) {\n  :host::part(button) {\n    border: canvas;\n  }\n\n  :host::part(button):focus-visible {\n    outline: var(--ic-space-xxxs) solid transparent;\n  }\n\n  .focus-border {\n    border-color: canvas;\n  }\n\n  :host(.disabled) ic-button:focus-within .focus-border {\n    border-color: GrayText;\n  }\n\n  :host(.disabled) .menu-item-info,\n  :host(.disabled) .menu-item-label,\n  :host(.disabled) .shortcut,\n  :host(.disabled) .menu-item-description,\n  :host(.disabled) ic-button:focus-within .menu-item-info,\n  :host(.disabled) ic-button:focus-within .menu-item-label,\n  :host(.disabled) ic-button:focus-within .shortcut,\n  :host(.disabled) ic-button:focus-within .menu-item-description {\n    color: GrayText !important;\n  }\n\n  :host(.disabled)::part(button):focus-visible,\n  :host(.disabled)::part(button):focus {\n    outline-color: GrayText !important;\n  }\n}\n","import {\n  Component,\n  Element,\n  Host,\n  Prop,\n  h,\n  State,\n  Event,\n  EventEmitter,\n  Listen,\n} from \"@stencil/core\";\nimport {\n  getParentElement,\n  isSlotUsed,\n  onComponentRequiredPropUndefined,\n  removeDisabledFalse,\n} from \"../../utils/helpers\";\nimport { IcMenuItemVariants } from \"./ic-menu-item.types\";\nimport Check from \"../../assets/check-icon.svg\";\nimport Chevron from \"../../assets/chevron-icon.svg\";\n\n/**\n * @slot icon - Content will be placed to the left of the menu item label.\n */\n\n@Component({\n  tag: \"ic-menu-item\",\n  styleUrl: \"ic-menu-item.css\",\n  shadow: {\n    delegatesFocus: true,\n  },\n})\nexport class MenuItem {\n  @Element() el: HTMLIcMenuItemElement;\n\n  /**\n   * The variant of the menu item.\n   */\n  @Prop({ mutable: true, reflect: true }) variant: IcMenuItemVariants =\n    \"default\";\n  /**\n   * The label to display in the menu item.\n   */\n  @Prop() label!: string;\n  /**\n   * The description displayed in the menu item, below the label.\n   */\n  @Prop() description?: string;\n  /**\n   * If `true`, the menu item will be in disabled state.\n   */\n  @Prop() disabled?: boolean = false;\n  /**\n   * The URL that the link points to. This will render the menu item as an \"a\" tag.\n   */\n  @Prop() href?: string;\n  /**\n   * The place to display the linked URL, as the name for a browsing context (a tab, window, or iframe).\n   */\n  @Prop() target?: string;\n  /**\n   * The relationship of the linked URL as space-separated link types.\n   */\n  @Prop() rel?: string;\n  /**\n   * The human language of the linked URL.\n   */\n  @Prop() hreflang?: string;\n  /**\n   * How much of the referrer to send when following the link.\n   */\n  @Prop() referrerpolicy?: ReferrerPolicy;\n  /**\n   * The label describing the keyboard shortcut for a menu item's action.\n   */\n  @Prop() keyboardShortcut?: string;\n  /**\n   * This references the popover menu instance that the menu item is a trigger for. If this prop is set, then the variant will always be default.\n   */\n  @Prop() submenuTriggerFor?: string;\n  /**\n   * @internal Emitted when item loses focus.\n   */\n  @Event() childBlur: EventEmitter<void>;\n  /**\n   * @internal Emitted when the user clicks a menu item that triggers a popover menu instance.\n   */\n  @Event() triggerPopoverMenuInstance: EventEmitter<void>;\n  /**\n   * @internal Emitted when the user clicks a menu item.\n   */\n  @Event() handleMenuItemClick: EventEmitter<{\n    label: string;\n    hasSubMenu: boolean;\n  }>;\n\n  @State() toggleChecked: boolean = false;\n\n  @Listen(\"click\", { capture: true })\n  handleHostClick(e: Event): void {\n    if (this.disabled) {\n      e.stopImmediatePropagation();\n    }\n  }\n\n  private handleClick = (e: Event): void => {\n    e.preventDefault();\n    if (this.submenuTriggerFor !== undefined) {\n      this.triggerPopoverMenuInstance.emit();\n    } else if (this.variant === \"toggle\") {\n      this.toggleChecked\n        ? (this.toggleChecked = false)\n        : (this.toggleChecked = true);\n    }\n    this.handleMenuItemClick.emit({\n      label: this.label,\n      hasSubMenu: !!this.el.submenuTriggerFor,\n    });\n  };\n\n  componentWillLoad(): void {\n    // This ensures that trigger menu items are always set to the default variant\n    if (this.submenuTriggerFor !== undefined && this.variant !== \"default\") {\n      this.variant = \"default\";\n    }\n\n    removeDisabledFalse(this.disabled, this.el);\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.label, propName: \"label\" }],\n      \"Menu Item\"\n    );\n  }\n\n  private getMenuItemAriaLabel = (): string => {\n    let ariaLabel = this.label;\n\n    if (this.description !== undefined) {\n      ariaLabel = `${ariaLabel}, ${this.description}`;\n    }\n\n    if (this.keyboardShortcut !== undefined) {\n      ariaLabel = `${ariaLabel}, ${this.keyboardShortcut}`;\n    }\n\n    if (this.variant === \"destructive\") {\n      ariaLabel = `${ariaLabel}, destructive`;\n    }\n\n    if (this.submenuTriggerFor !== undefined) {\n      ariaLabel = `${ariaLabel}, triggers submenu`;\n    }\n\n    if (this.el.classList.contains(\"ic-popover-submenu-back-button\")) {\n      ariaLabel = \"Go back to parent menu\";\n    }\n    const parentEl = getParentElement(this.el);\n\n    if (\n      parentEl.tagName === \"IC-MENU-GROUP\" &&\n      (parentEl as HTMLIcMenuGroupElement).label\n    ) {\n      return `${ariaLabel}, ${\n        (parentEl as HTMLIcMenuGroupElement).label\n      } menu group`;\n    } else {\n      return ariaLabel;\n    }\n  };\n\n  render() {\n    // A helper function that checks if a prop has been defined\n    const isPropDefined = (prop: string) => {\n      return prop !== undefined ? prop : null;\n    };\n\n    // A sub-component to layout the menu information correctly in ic-button\n    const MenuItemInformation = () => {\n      return (\n        <div class=\"menu-item-info\">\n          <div class=\"menu-labels\">\n            <ic-typography class=\"menu-item-label\">{this.label}</ic-typography>\n            {this.keyboardShortcut && (\n              <ic-typography variant=\"caption\" class=\"shortcut\">\n                {this.keyboardShortcut}\n              </ic-typography>\n            )}\n          </div>\n          {this.description && (\n            <ic-typography class=\"menu-item-description\" variant=\"caption\">\n              {this.description}\n            </ic-typography>\n          )}\n        </div>\n      );\n    };\n\n    return (\n      <Host\n        class={{\n          [\"disabled\"]: this.disabled,\n        }}\n      >\n        <li\n          role={this.variant === \"toggle\" ? \"menuitemcheckbox\" : \"menuitem\"}\n          aria-disabled={`${this.disabled}`}\n          aria-checked={\n            this.variant === \"toggle\" && this.toggleChecked === true\n              ? true\n              : this.variant === \"toggle\" && this.toggleChecked === false\n              ? false\n              : undefined\n          }\n        >\n          <ic-button\n            disableTooltip\n            fullWidth\n            variant=\"tertiary\"\n            onClick={this.handleClick}\n            href={isPropDefined(this.href)}\n            hreflang={isPropDefined(this.hreflang)}\n            target={isPropDefined(this.target)}\n            rel={isPropDefined(this.rel)}\n            referrerpolicy={\n              this.referrerpolicy !== undefined ? this.referrerpolicy : null\n            }\n            aria-disabled={`${this.disabled}`}\n            aria-label={this.getMenuItemAriaLabel()}\n            aria-controls={\n              this.submenuTriggerFor !== undefined\n                ? `ic-popover-submenu-${this.submenuTriggerFor}`\n                : false\n            }\n            aria-haspopup={\n              this.submenuTriggerFor !== undefined ||\n              this.el.classList.contains(\"ic-popover-submenu-back-button\")\n                ? \"menu\"\n                : false\n            }\n            aria-owns={\n              this.submenuTriggerFor !== undefined\n                ? `ic-popover-submenu-${this.submenuTriggerFor}`\n                : false\n            }\n          >\n            <div class=\"focus-border\">\n              {isSlotUsed(this.el, \"icon\") && (\n                <span class=\"icon\">\n                  <slot name=\"icon\"></slot>\n                </span>\n              )}\n              <MenuItemInformation />\n              {this.variant === \"toggle\" && (\n                <span\n                  class={{\n                    [\"check-icon\"]: true,\n                    [\"hide\"]: !this.toggleChecked,\n                  }}\n                  aria-hidden=\"true\"\n                  innerHTML={Check}\n                />\n              )}\n              {this.submenuTriggerFor !== undefined && (\n                <span\n                  class={{ [\"submenu-icon\"]: true }}\n                  aria-hidden=\"true\"\n                  innerHTML={Chevron}\n                />\n              )}\n            </div>\n          </ic-button>\n        </li>\n      </Host>\n    );\n  }\n}\n"],"mappings":"oNAAA,MAAMA,EAAgB,s+L,MCgCTC,EAAQ,M,8LAyEXC,KAAAC,YAAeC,IACrBA,EAAEC,iBACF,GAAIH,KAAKI,oBAAsBC,UAAW,CACxCL,KAAKM,2BAA2BC,M,MAC3B,GAAIP,KAAKQ,UAAY,SAAU,CACpCR,KAAKS,cACAT,KAAKS,cAAgB,MACrBT,KAAKS,cAAgB,I,CAE5BT,KAAKU,oBAAoBH,KAAK,CAC5BI,MAAOX,KAAKW,MACZC,aAAcZ,KAAKa,GAAGT,mBACtB,EAmBIJ,KAAAc,qBAAuB,KAC7B,IAAIC,EAAYf,KAAKW,MAErB,GAAIX,KAAKgB,cAAgBX,UAAW,CAClCU,EAAY,GAAGA,MAAcf,KAAKgB,a,CAGpC,GAAIhB,KAAKiB,mBAAqBZ,UAAW,CACvCU,EAAY,GAAGA,MAAcf,KAAKiB,kB,CAGpC,GAAIjB,KAAKQ,UAAY,cAAe,CAClCO,EAAY,GAAGA,gB,CAGjB,GAAIf,KAAKI,oBAAsBC,UAAW,CACxCU,EAAY,GAAGA,qB,CAGjB,GAAIf,KAAKa,GAAGK,UAAUC,SAAS,kCAAmC,CAChEJ,EAAY,wB,CAEd,MAAMK,EAAWC,EAAiBrB,KAAKa,IAEvC,GACEO,EAASE,UAAY,iBACpBF,EAAoCT,MACrC,CACA,MAAO,GAAGI,MACPK,EAAoCT,kB,KAElC,CACL,OAAOI,C,gBAjIT,U,8DAY2B,M,uMA6CK,K,CAGlCQ,gBAAgBrB,GACd,GAAIF,KAAKwB,SAAU,CACjBtB,EAAEuB,0B,EAmBNC,oBAEE,GAAI1B,KAAKI,oBAAsBC,WAAaL,KAAKQ,UAAY,UAAW,CACtER,KAAKQ,QAAU,S,CAGjBmB,EAAoB3B,KAAKwB,SAAUxB,KAAKa,G,CAG1Ce,mBACEC,EACE,CAAC,CAAEC,KAAM9B,KAAKW,MAAOoB,SAAU,UAC/B,Y,CAwCJC,SAEE,MAAMC,EAAiBH,GACdA,IAASzB,UAAYyB,EAAO,KAIrC,MAAMI,EAAsB,IAExBC,EAAA,OAAKC,MAAM,kBACTD,EAAA,OAAKC,MAAM,eACTD,EAAA,iBAAeC,MAAM,mBAAmBpC,KAAKW,OAC5CX,KAAKiB,kBACJkB,EAAA,iBAAe3B,QAAQ,UAAU4B,MAAM,YACpCpC,KAAKiB,mBAIXjB,KAAKgB,aACJmB,EAAA,iBAAeC,MAAM,wBAAwB5B,QAAQ,WAClDR,KAAKgB,cAOhB,OACEmB,EAACE,EAAI,CACHD,MAAO,CACL,CAAC,YAAapC,KAAKwB,WAGrBW,EAAA,MACEG,KAAMtC,KAAKQ,UAAY,SAAW,mBAAqB,WAAU,gBAClD,GAAGR,KAAKwB,WAAU,eAE/BxB,KAAKQ,UAAY,UAAYR,KAAKS,gBAAkB,KAChD,KACAT,KAAKQ,UAAY,UAAYR,KAAKS,gBAAkB,MACpD,MACAJ,WAGN8B,EAAA,aACEI,eAAc,KACdC,UAAS,KACThC,QAAQ,WACRiC,QAASzC,KAAKC,YACdyC,KAAMT,EAAcjC,KAAK0C,MACzBC,SAAUV,EAAcjC,KAAK2C,UAC7BC,OAAQX,EAAcjC,KAAK4C,QAC3BC,IAAKZ,EAAcjC,KAAK6C,KACxBC,eACE9C,KAAK8C,iBAAmBzC,UAAYL,KAAK8C,eAAiB,KAAI,gBAEjD,GAAG9C,KAAKwB,WAAU,aACrBxB,KAAKc,uBAAsB,gBAErCd,KAAKI,oBAAsBC,UACvB,sBAAsBL,KAAKI,oBAC3B,MAAK,gBAGTJ,KAAKI,oBAAsBC,WAC3BL,KAAKa,GAAGK,UAAUC,SAAS,kCACvB,OACA,MAAK,YAGTnB,KAAKI,oBAAsBC,UACvB,sBAAsBL,KAAKI,oBAC3B,OAGN+B,EAAA,OAAKC,MAAM,gBACRW,EAAW/C,KAAKa,GAAI,SACnBsB,EAAA,QAAMC,MAAM,QACVD,EAAA,QAAMa,KAAK,UAGfb,EAACD,EAAmB,MACnBlC,KAAKQ,UAAY,UAChB2B,EAAA,QACEC,MAAO,CACL,CAAC,cAAe,KAChB,CAAC,SAAUpC,KAAKS,eACjB,cACW,OACZwC,UAAWC,IAGdlD,KAAKI,oBAAsBC,WAC1B8B,EAAA,QACEC,MAAO,CAAE,CAAC,gBAAiB,MAAM,cACrB,OACZa,UAAWE,O"}

package/dist/core/p-c3f9fb1d.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as s,h as i,g as h}from"./p-f3053872.js";import{I as e}from"./p-6f57b13c.js";const a=class{constructor(i){t(this,i);this.tabSelect=s(this,"tabSelect",3);this.icTabSelect=s(this,"icTabSelect",3);this.newTabs=[];this.newTabPanels=[];this.linkTabs=()=>{this.tabs.forEach(((t,s)=>{const i=`ic-tab-${s}-context-${this.contextId}`;const h=`ic-tab-panel-${s}-context-${this.contextId}`;const a=`ic-tab--${s}-context-${this.contextId}`;const c="context-id";t.setAttribute("id",i);t.tabId=a;t.tabPosition=s;t.setAttribute("aria-controls",h);t.setAttribute(c,this.contextId);this.tabGroup.setAttribute(c,this.contextId);this.tabPanels[s].setAttribute("id",h);this.tabPanels[s].panelId=a;this.tabPanels[s].tabPosition=s;this.tabPanels[s].setAttribute("aria-labelledby",i);this.tabPanels[s].setAttribute(c,this.contextId);if(this.appearance===e.Light){t.appearance=this.appearance;this.tabPanels[s].appearance=this.appearance}}));if(this.appearance===e.Light){this.tabGroup.appearance=this.appearance}};this.getChildren=()=>{this.tabGroup=this.host.querySelector("ic-tab-group");this.tabs=Array.from(this.tabGroup.querySelectorAll("ic-tab"));this.tabPanels=Array.from(this.host.children).filter((t=>t.tagName==="IC-TAB-PANEL"));this.enabledTabs=this.getEnabledTabs()};this.attatchEventListeners=()=>{if(this.activationType==="automatic"){this.tabGroup.addEventListener("keydown",(t=>{this.handleKeyBoardNavAutomatic(t)}))}else{this.tabGroup.addEventListener("keydown",(t=>{this.handleKeyBoardNavManual(t)}))}};this.setControlledMode=()=>{if(this.selectedTabIndex!==undefined){this.controlledMode=true;this.selectedTab=this.selectedTabIndex}};this.setInitialTab=()=>{if(this.controlledMode){this.selectedTab=this.selectedTabIndex;this.focusedTabIndex=this.selectedTabIndex}else{const t=this.tabs.findIndex((t=>t.tabId===this.enabledTabs[0].tabId));this.selectedTab=t;this.focusedTabIndex=t}};this.configureTabs=()=>{this.enabledTabs.forEach((t=>{t.selected=t.tabPosition===this.selectedTab}));this.tabPanels.forEach((t=>{t.selectedTab=this.tabs[this.selectedTab].tabId}))};this.getEnabledTabs=()=>Array.from(this.tabs).filter((t=>!t.disabled));this.getIndexOfEnabledTab=t=>this.enabledTabs.findIndex((s=>s.tabId===this.tabs[t].tabId));this.keyboardSelectTab=t=>{const s=this.tabs.findIndex((s=>s.tabId===this.enabledTabs[t].tabId));this.enabledTabs[t].focus();if(!this.controlledMode){this.selectedTab=s}else{this.icTabSelect.emit({tabIndex:s});this.tabSelect.emit({tabIndex:s})}};this.keyboardFocusTab=t=>{const s=this.tabs.findIndex((s=>s.tabId===this.enabledTabs[t].tabId));this.enabledTabs[t].focus();this.focusedTabIndex=s};this.handleKeyBoardNavAutomatic=t=>{const s=t.key;const i=this.getIndexOfEnabledTab(this.selectedTab);let h=true;switch(s){case"Home":this.keyboardSelectTab(0);break;case"End":this.keyboardSelectTab(this.enabledTabs.length-1);break;case"ArrowRight":if(i<this.enabledTabs.length-1){this.keyboardSelectTab(i+1)}else{this.keyboardSelectTab(0)}break;case"ArrowLeft":if(i>0){this.keyboardSelectTab(i-1)}else{this.keyboardSelectTab(this.enabledTabs.length-1)}break;default:h=false}if(h)t.preventDefault()};this.handleKeyBoardNavManual=t=>{const s=t.key;const i=this.getIndexOfEnabledTab(this.focusedTabIndex);let h=true;switch(s){case"Home":this.keyboardFocusTab(0);break;case"End":this.keyboardFocusTab(this.enabledTabs.length-1);break;case"ArrowRight":if(i<this.enabledTabs.length-1){this.keyboardFocusTab(i+1)}else{this.keyboardFocusTab(0)}break;case"ArrowLeft":if(i>0){this.keyboardFocusTab(i-1)}else{this.keyboardFocusTab(this.enabledTabs.length-1)}break;case"Enter":this.keyboardSelectTab(this.focusedTabIndex);break;case" ":this.keyboardSelectTab(this.focusedTabIndex);break;default:h=false}if(h)t.preventDefault()};this.contextId="default";this.activationType="automatic";this.selectedTabIndex=undefined;this.appearance="dark";this.selectedTab=undefined}updateSelectedTab(t){this.selectedTab=t}tabClickHandler(t){if(this.selectedTabIndex===undefined&&t.detail.contextId===this.contextId){this.selectedTab=t.detail.position}this.icTabSelect.emit({tabIndex:t.detail.position});this.tabSelect.emit({tabIndex:t.detail.position});t.stopImmediatePropagation()}tabCreatedHandler(t){if(this.tabs&&this.tabPanels){(t.detail.setFocus?this.newTabs:this.newTabPanels).push(t.detail);if(this.newTabs.length===this.newTabPanels.length){this.tabs.push(...this.newTabs);this.tabPanels.push(...this.newTabPanels);this.enabledTabs=this.getEnabledTabs();this.linkTabs();this.newTabs=[];this.newTabPanels=[]}}}async tabRemovedHandler(t){this.getChildren();this.enabledTabs=this.getEnabledTabs();this.linkTabs();if(this.tabs[this.selectedTab]&&this.tabPanels[this.selectedTab]){this.tabs[this.selectedTab].selected=true;this.tabPanels[this.selectedTab].selectedTab=this.tabs[this.selectedTab].tabId}else{this.setInitialTab()}if(t){this.tabs[this.selectedTab].setFocus()}}componentDidLoad(){this.setControlledMode();this.getChildren();this.linkTabs();this.attatchEventListeners();this.setInitialTab();this.configureTabs()}componentWillUpdate(){this.configureTabs()}disconnectedCallback(){if(this.activationType==="manual"){this.tabGroup.removeEventListener("keydown",(t=>this.handleKeyBoardNavManual(t)))}else{this.tabGroup.removeEventListener("keydown",(t=>this.handleKeyBoardNavAutomatic(t)))}}render(){return i("slot",null)}get host(){return h(this)}static get watchers(){return{selectedTabIndex:["updateSelectedTab"]}}};export{a as ic_tab_context};
-//# sourceMappingURL=p-c3f9fb1d.entry.js.map

package/dist/core/p-c3f9fb1d.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["TabContext","this","newTabs","newTabPanels","linkTabs","tabs","forEach","tab","index","tabId","contextId","tabPanelId","shared","contextIdAttr","setAttribute","tabPosition","tabGroup","tabPanels","panelId","appearance","IcThemeForegroundEnum","Light","getChildren","host","querySelector","Array","from","querySelectorAll","children","filter","child","tagName","enabledTabs","getEnabledTabs","attatchEventListeners","activationType","addEventListener","event","handleKeyBoardNavAutomatic","handleKeyBoardNavManual","setControlledMode","selectedTabIndex","undefined","controlledMode","selectedTab","setInitialTab","focusedTabIndex","firstEnabledTabIndex","findIndex","configureTabs","selected","tabPanel","disabled","getIndexOfEnabledTab","allTabsIndex","keyboardSelectTab","enabledTabIndex","newIndex","focus","icTabSelect","emit","tabIndex","tabSelect","keyboardFocusTab","key","preventDefault","length","updateSelectedTab","newValue","tabClickHandler","detail","position","stopImmediatePropagation","tabCreatedHandler","ev","setFocus","push","async","hadFocus","componentDidLoad","componentWillUpdate","disconnectedCallback","removeEventListener","render","h"],"sources":["./src/components/ic-tab-context/ic-tab-context.tsx"],"sourcesContent":["import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  Listen,\n  Prop,\n  State,\n  h,\n  Watch,\n  Method,\n} from \"@stencil/core\";\nimport {\n  IcActivationTypes,\n  IcThemeForegroundNoDefault,\n  IcThemeForegroundEnum,\n} from \"../../utils/types\";\n\nimport {\n  IcTabClickEventDetail,\n  IcTabSelectEventDetail,\n} from \"../ic-tab/ic-tab.types\";\n\n@Component({\n  tag: \"ic-tab-context\",\n})\nexport class TabContext {\n  private controlledMode: boolean;\n  private tabs: HTMLIcTabElement[];\n  private enabledTabs: HTMLIcTabElement[];\n  private tabPanels: HTMLIcTabPanelElement[];\n  private tabGroup: HTMLIcTabGroupElement;\n  private focusedTabIndex: number;\n  private newTabs: HTMLIcTabElement[] = [];\n  private newTabPanels: HTMLIcTabPanelElement[] = [];\n\n  @Element() host: HTMLIcTabContextElement;\n\n  /**\n   * The unique context needed if using multiple tabs inside one another i.e. rendering another set of tabs inside a tab panel.\n   */\n  @Prop({ reflect: true }) contextId?: string = \"default\";\n\n  /**\n   * Determines whether tabs have to be manually activated (by pressing 'Enter' or 'Space') when they receive focus using keyboard navigation.\n   */\n  @Prop() activationType?: IcActivationTypes = \"automatic\";\n\n  /**\n   * The selected tab to be controlled by the user. Must be used alongside the icTabSelect event to manage tab selection.\n   */\n  @Prop() selectedTabIndex?: number;\n\n  /**\n   * The appearance of the tab context, e.g dark, or light.\n   */\n  @Prop() appearance?: IcThemeForegroundNoDefault = \"dark\";\n\n  @State() selectedTab: number | null;\n\n  @Watch(\"selectedTabIndex\")\n  updateSelectedTab(newValue: number): void {\n    this.selectedTab = newValue;\n  }\n\n  /**\n   * @deprecated This event should not be used anymore. Use icTabSelect instead.\n   */\n  @Event({ bubbles: false }) tabSelect: EventEmitter<IcTabSelectEventDetail>;\n\n  /**\n   * Emitted when a user selects a tab.\n   */\n  @Event({ bubbles: false }) icTabSelect: EventEmitter<IcTabSelectEventDetail>;\n\n  @Listen(\"tabClick\")\n  tabClickHandler(event: CustomEvent<IcTabClickEventDetail>): void {\n    if (\n      this.selectedTabIndex === undefined &&\n      event.detail.contextId === this.contextId\n    ) {\n      this.selectedTab = event.detail.position;\n    }\n    this.icTabSelect.emit({\n      tabIndex: event.detail.position,\n    });\n    this.tabSelect.emit({\n      tabIndex: event.detail.position,\n    });\n    event.stopImmediatePropagation();\n  }\n\n  @Listen(\"tabCreated\")\n  @Listen(\"tabPanelCreated\")\n  tabCreatedHandler(ev: CustomEvent) {\n    if (this.tabs && this.tabPanels) {\n      (ev.detail.setFocus ? this.newTabs : this.newTabPanels).push(ev.detail);\n      if (this.newTabs.length === this.newTabPanels.length) {\n        this.tabs.push(...this.newTabs);\n        this.tabPanels.push(...this.newTabPanels);\n        this.enabledTabs = this.getEnabledTabs();\n        this.linkTabs();\n        this.newTabs = [];\n        this.newTabPanels = [];\n      }\n    }\n  }\n\n  /**\n   * @internal Used to set tab/tab panel IDs when a tab/tab panel has been removed\n   */\n  @Method()\n  async tabRemovedHandler(hadFocus?: boolean) {\n    this.getChildren();\n    this.enabledTabs = this.getEnabledTabs();\n    this.linkTabs();\n    if (this.tabs[this.selectedTab] && this.tabPanels[this.selectedTab]) {\n      this.tabs[this.selectedTab].selected = true;\n      this.tabPanels[this.selectedTab].selectedTab =\n        this.tabs[this.selectedTab].tabId;\n    } else {\n      this.setInitialTab();\n    }\n\n    if (hadFocus) {\n      this.tabs[this.selectedTab].setFocus();\n    }\n  }\n\n  // Sets attributes to link tab-group, tabs and tab-panels\n  private linkTabs = () => {\n    this.tabs.forEach((tab, index) => {\n      const tabId = `ic-tab-${index}-context-${this.contextId}`;\n      const tabPanelId = `ic-tab-panel-${index}-context-${this.contextId}`;\n      const shared = `ic-tab--${index}-context-${this.contextId}`;\n      const contextIdAttr = \"context-id\";\n      tab.setAttribute(\"id\", tabId);\n      tab.tabId = shared;\n      tab.tabPosition = index;\n      tab.setAttribute(\"aria-controls\", tabPanelId);\n      tab.setAttribute(contextIdAttr, this.contextId);\n      this.tabGroup.setAttribute(contextIdAttr, this.contextId);\n      this.tabPanels[index].setAttribute(\"id\", tabPanelId);\n      this.tabPanels[index].panelId = shared;\n      this.tabPanels[index].tabPosition = index;\n      this.tabPanels[index].setAttribute(\"aria-labelledby\", tabId);\n      this.tabPanels[index].setAttribute(contextIdAttr, this.contextId);\n\n      if (this.appearance === IcThemeForegroundEnum.Light) {\n        tab.appearance = this.appearance;\n        this.tabPanels[index].appearance = this.appearance;\n      }\n    });\n\n    if (this.appearance === IcThemeForegroundEnum.Light) {\n      this.tabGroup.appearance = this.appearance;\n    }\n  };\n\n  // Gets tabs and tabpanels with the same context ID\n  // Using querySelector to selector the children in relation to the host\n  private getChildren = (): void => {\n    this.tabGroup = this.host.querySelector(\"ic-tab-group\");\n    this.tabs = Array.from(this.tabGroup.querySelectorAll(\"ic-tab\"));\n    this.tabPanels = Array.from(this.host.children).filter(\n      (child) => child.tagName === \"IC-TAB-PANEL\"\n    ) as HTMLIcTabPanelElement[];\n    this.enabledTabs = this.getEnabledTabs();\n  };\n\n  // Determines how keyboard navigation is to be handled based on the activation type\n  private attatchEventListeners = (): void => {\n    if (this.activationType === \"automatic\") {\n      this.tabGroup.addEventListener(\"keydown\", (event) => {\n        this.handleKeyBoardNavAutomatic(event);\n      });\n    } else {\n      this.tabGroup.addEventListener(\"keydown\", (event) => {\n        this.handleKeyBoardNavManual(event);\n      });\n    }\n  };\n\n  // Determines whether the selected tab is being controlled within the component\n  // or by the user (via selectedTabIndex and onIcTabSelect)\n  private setControlledMode = (): void => {\n    if (this.selectedTabIndex !== undefined) {\n      this.controlledMode = true;\n      this.selectedTab = this.selectedTabIndex;\n    }\n  };\n\n  // Sets the tab that is selected on initial render\n  private setInitialTab = (): void => {\n    if (this.controlledMode) {\n      this.selectedTab = this.selectedTabIndex;\n      this.focusedTabIndex = this.selectedTabIndex;\n    } else {\n      const firstEnabledTabIndex = this.tabs.findIndex(\n        (tab) => tab.tabId === this.enabledTabs[0].tabId\n      );\n      this.selectedTab = firstEnabledTabIndex;\n      this.focusedTabIndex = firstEnabledTabIndex;\n    }\n  };\n\n  // Passes the selected tab to the tab and tab panel components\n  private configureTabs = () => {\n    this.enabledTabs.forEach((tab) => {\n      tab.selected = tab.tabPosition === this.selectedTab;\n    });\n    this.tabPanels.forEach((tabPanel) => {\n      tabPanel.selectedTab = this.tabs[this.selectedTab].tabId;\n    });\n  };\n\n  private getEnabledTabs = () => {\n    return Array.from(this.tabs).filter((child) => !child.disabled);\n  };\n\n  private getIndexOfEnabledTab = (allTabsIndex: number) => {\n    return this.enabledTabs.findIndex(\n      (tab) => tab.tabId === this.tabs[allTabsIndex].tabId\n    );\n  };\n\n  // Sets focus on tab and selects it\n  private keyboardSelectTab = (enabledTabIndex: number) => {\n    const newIndex = this.tabs.findIndex(\n      (tab) => tab.tabId === this.enabledTabs[enabledTabIndex].tabId\n    );\n    this.enabledTabs[enabledTabIndex].focus();\n    if (!this.controlledMode) {\n      this.selectedTab = newIndex;\n    } else {\n      this.icTabSelect.emit({ tabIndex: newIndex });\n      this.tabSelect.emit({ tabIndex: newIndex });\n    }\n  };\n\n  // Sets focus on tab without selecting it (for manual activation)\n  private keyboardFocusTab = (enabledTabIndex: number) => {\n    const newIndex = this.tabs.findIndex(\n      (tab) => tab.tabId === this.enabledTabs[enabledTabIndex].tabId\n    );\n    this.enabledTabs[enabledTabIndex].focus();\n    this.focusedTabIndex = newIndex;\n  };\n\n  private handleKeyBoardNavAutomatic = (event: KeyboardEvent) => {\n    const key = event.key;\n    const enabledTabIndex = this.getIndexOfEnabledTab(this.selectedTab);\n    let preventDefault = true;\n    switch (key) {\n      case \"Home\":\n        this.keyboardSelectTab(0);\n        break;\n      case \"End\":\n        this.keyboardSelectTab(this.enabledTabs.length - 1);\n        break;\n      case \"ArrowRight\":\n        if (enabledTabIndex < this.enabledTabs.length - 1) {\n          this.keyboardSelectTab(enabledTabIndex + 1);\n        } else {\n          this.keyboardSelectTab(0);\n        }\n        break;\n      case \"ArrowLeft\":\n        if (enabledTabIndex > 0) {\n          this.keyboardSelectTab(enabledTabIndex - 1);\n        } else {\n          this.keyboardSelectTab(this.enabledTabs.length - 1);\n        }\n        break;\n      default:\n        preventDefault = false;\n    }\n    if (preventDefault) event.preventDefault();\n  };\n\n  private handleKeyBoardNavManual = (event: KeyboardEvent) => {\n    const key = event.key;\n    const enabledTabIndex = this.getIndexOfEnabledTab(this.focusedTabIndex);\n    let preventDefault = true;\n    switch (key) {\n      case \"Home\":\n        this.keyboardFocusTab(0);\n        break;\n      case \"End\":\n        this.keyboardFocusTab(this.enabledTabs.length - 1);\n        break;\n      case \"ArrowRight\":\n        if (enabledTabIndex < this.enabledTabs.length - 1) {\n          this.keyboardFocusTab(enabledTabIndex + 1);\n        } else {\n          this.keyboardFocusTab(0);\n        }\n        break;\n      case \"ArrowLeft\":\n        if (enabledTabIndex > 0) {\n          this.keyboardFocusTab(enabledTabIndex - 1);\n        } else {\n          this.keyboardFocusTab(this.enabledTabs.length - 1);\n        }\n        break;\n      case \"Enter\":\n        this.keyboardSelectTab(this.focusedTabIndex);\n        break;\n      case \" \":\n        this.keyboardSelectTab(this.focusedTabIndex);\n        break;\n      default:\n        preventDefault = false;\n    }\n    if (preventDefault) event.preventDefault();\n  };\n\n  componentDidLoad(): void {\n    this.setControlledMode();\n    this.getChildren();\n    this.linkTabs();\n    this.attatchEventListeners();\n    this.setInitialTab();\n    this.configureTabs();\n  }\n\n  componentWillUpdate(): void {\n    this.configureTabs();\n  }\n\n  disconnectedCallback(): void {\n    if (this.activationType === \"manual\") {\n      this.tabGroup.removeEventListener(\"keydown\", (event) =>\n        this.handleKeyBoardNavManual(event)\n      );\n    } else {\n      this.tabGroup.removeEventListener(\"keydown\", (event) =>\n        this.handleKeyBoardNavAutomatic(event)\n      );\n    }\n  }\n\n  render() {\n    return <slot></slot>;\n  }\n}\n"],"mappings":"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"}

package/dist/core/p-ca6820dc.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["icHeroCss","Hero","this","rightContent","secondaryHeading","undefined","getThemeForegroundColor","themeChangeHandler","ev","theme","detail","foregroundColor","mode","doScroll","disableBackgroundParallax","scrolltotop","document","scrollingElement","scrollTop","factor","y","scrollFactor","componentWillLoad","slotHasContent","el","componentDidLoad","onComponentRequiredPropUndefined","prop","heading","propName","componentWillRender","render","aligned","small","subheading","secondarySubheading","backgroundImage","style","h","Host","class","IcThemeForegroundEnum","Dark","fullHeight","leftContentFullWidth","name","variant"],"sources":["./src/components/ic-hero/ic-hero.css?tag=ic-hero&encapsulation=shadow","./src/components/ic-hero/ic-hero.tsx"],"sourcesContent":["@import \"../../global/normalize.css\";\n\n:host {\n  display: block;\n  background-color: var(--ic-theme-tertiary);\n  color: var(--ic-theme-text);\n\n  --hero-heading-bottom-margin: var(--ic-space-md);\n}\n\n:host(.dark) {\n  background-color: var(--ic-theme-secondary);\n}\n\n:host(.has-background-image) {\n  background-repeat: no-repeat;\n  background-position: right -6.25rem;\n  background-size: auto calc(100% + 6.25rem);\n  box-shadow: var(--ic-elevation-inset);\n}\n\n@media (prefers-reduced-motion) {\n  :host(.has-background-image) {\n    background-position: right -6.25rem !important;\n  }\n}\n\nic-typography.heading-bottom-spacing {\n  margin-bottom: var(--hero-heading-bottom-margin);\n}\n\n.section-container {\n  display: flex;\n  align-items: center;\n  height: 100%;\n}\n\n.left-container {\n  padding: var(--ic-space-xl) 0;\n}\n\n.left-container:not(.left-container-full-width) {\n  flex-basis: 50%;\n}\n\n.left-container-full-width {\n  width: 100%;\n}\n\n.right-container {\n  flex-basis: 50%;\n}\n\n.interaction-container {\n  display: flex;\n  gap: var(--ic-space-md);\n  margin-top: var(--ic-space-lg);\n  flex-wrap: wrap;\n}\n\n.secondary-container {\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  border-left: var(--ic-space-xxxs) solid var(--ic-theme-text);\n}\n\n.secondary-subheading {\n  margin-top: var(--ic-space-xxs);\n}\n\n:host([content-aligned=\"left\"]) .left-container,\n:host([content-aligned=\"left\"]) .interaction-container {\n  justify-content: flex-start;\n  text-align: left;\n}\n\n:host([content-aligned=\"center\"]) .left-container,\n:host([content-aligned=\"center\"]) .interaction-container {\n  justify-content: center;\n  text-align: center;\n}\n\n@media (min-width: 992px) {\n  .left-container-full-width {\n    width: 66.6%;\n  }\n}\n\n@media (min-width: 1044px) {\n  :host,\n  .section-container {\n    min-height: 13rem;\n  }\n\n  :host(.small),\n  :host(.small) .section-container {\n    min-height: 10.813rem;\n  }\n\n  .left-container:not(.left-container-full-width) {\n    flex-basis: 66.6%;\n  }\n\n  .left-container {\n    min-height: 9rem;\n  }\n\n  .right-container {\n    flex-basis: 33.3%;\n    margin-left: 3.125rem;\n  }\n\n  .secondary-container {\n    min-height: 9rem;\n  }\n\n  .secondary-heading,\n  .secondary-subheading {\n    margin-left: 3.938rem;\n  }\n}\n\n@media (min-width: 801px) and (max-width: 1043px) {\n  :host(.has-background-image) {\n    background-image: none !important;\n  }\n\n  :host,\n  .section-container {\n    min-height: 16rem;\n  }\n\n  :host(.small),\n  :host(.small) .section-container {\n    min-height: 15rem;\n  }\n\n  :host(.secondary-heading),\n  :host(.secondary-heading) .section-container {\n    min-height: 14rem;\n  }\n\n  .left-container {\n    min-height: 10rem;\n  }\n\n  .secondary-container {\n    min-height: 10rem;\n  }\n\n  .secondary-heading,\n  .secondary-subheading {\n    margin-left: 5.922rem;\n  }\n\n  .right-container {\n    margin-left: 3.125rem;\n  }\n}\n\n@media (min-width: 641px) and (max-width: 800px) {\n  :host(.has-background-image) {\n    background-image: none !important;\n  }\n\n  :host,\n  .section-container {\n    min-height: 16rem;\n  }\n\n  :host(.small),\n  :host(.small) .section-container {\n    min-height: 15rem;\n  }\n\n  :host(.secondary-heading),\n  :host(.secondary-heading) .section-container {\n    min-height: 14rem;\n  }\n\n  .left-container {\n    min-height: 10rem;\n  }\n\n  .secondary-container {\n    min-height: 10rem;\n  }\n\n  .secondary-heading,\n  .secondary-subheading {\n    margin-left: 2.125rem;\n  }\n\n  .right-container {\n    margin-left: 3.125rem;\n  }\n}\n\n@media (min-width: 481px) and (max-width: 640px) {\n  :host(.has-background-image) {\n    background-image: none !important;\n  }\n\n  :host,\n  .section-container {\n    min-height: 13rem;\n  }\n\n  :host(.small),\n  :host(.small) .section-container {\n    min-height: 10.813rem;\n  }\n\n  :host(.secondary-heading),\n  :host(.secondary-heading) .section-container {\n    min-height: 17.5rem;\n  }\n\n  :host(.secondary-heading) .section-container,\n  :host(.small) .section-container,\n  .section-container {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .left-container {\n    height: fit-content;\n  }\n\n  .secondary-container {\n    height: fit-content;\n    border: none;\n  }\n\n  .right-container {\n    margin-bottom: 2.5rem;\n  }\n}\n\n@media (max-width: 480px) {\n  :host(.has-background-image) {\n    background-image: none !important;\n  }\n\n  :host,\n  .section-container {\n    min-height: 12rem;\n  }\n\n  :host,\n  .right-container {\n    margin-bottom: var(--ic-space-md);\n  }\n\n  :host(.small),\n  :host(.small) .section-container {\n    min-height: 10.813rem;\n  }\n\n  :host(.secondary-heading),\n  :host(.secondary-heading) .section-container {\n    min-height: 16.5rem;\n  }\n\n  :host(.secondary-heading) .section-container,\n  :host(.small) .section-container,\n  .section-container {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n\n  .left-container {\n    height: fit-content;\n  }\n\n  .secondary-container {\n    height: fit-content;\n    border: none;\n  }\n}\n","import {\n  Component,\n  Element,\n  Host,\n  Prop,\n  h,\n  State,\n  Listen,\n} from \"@stencil/core\";\nimport {\n  IcAlignment,\n  IcTheme,\n  IcThemeForeground,\n  IcThemeForegroundEnum,\n} from \"../../utils/types\";\nimport {\n  slotHasContent,\n  getThemeForegroundColor,\n  onComponentRequiredPropUndefined,\n} from \"../../utils/helpers\";\nimport { IcHeroContentAlignments } from \"./ic-hero.types\";\n\n/**\n * @slot heading - Content will be rendered in the title area, in place of the heading.\n * @slot subheading - Content will be rendered in the title area, in place of the subheading.\n * @slot interaction - Content will be rendered in the interaction area, adjacent to the title area.\n * @slot secondary - Content will be rendered in the secondary content area.\n */\n\n@Component({\n  tag: \"ic-hero\",\n  styleUrl: \"ic-hero.css\",\n  shadow: true,\n})\nexport class Hero {\n  @Element() el: HTMLIcHeroElement;\n\n  /**\n   * The heading of the hero.\n   */\n  @Prop() heading!: string;\n\n  /**\n   * The description for the hero.\n   */\n  @Prop() subheading?: string;\n\n  /**\n   * The optional secondary heading, replaced by slotted right content.\n   */\n  @Prop() secondaryHeading?: string;\n\n  /**\n   * The optional secondary subheading, replaced by slotted right content.\n   */\n  @Prop() secondarySubheading?: string;\n\n  /**\n   * The optional background image.\n   */\n  @Prop() backgroundImage?: string;\n\n  /**\n   * If `true`, the background image (if set) will not scroll using a parallax effect.\n   */\n  @Prop() disableBackgroundParallax?: boolean = false;\n\n  /**\n   * The alignment of the hero.\n   */\n  @Prop() aligned: IcAlignment = \"left\";\n\n  /**\n   * The alignment of the hero content.\n   */\n  @Prop() contentAligned: IcHeroContentAlignments = \"left\";\n\n  /**\n   * If `true`, the small styling will be applied to the hero.\n   */\n  @Prop() small: boolean = false;\n\n  @State() rightContent: boolean = false;\n\n  @State() scrollFactor: string = \"right -100px\";\n\n  @State() leftContentFullWidth: boolean =\n    !this.rightContent && this.secondaryHeading === undefined;\n\n  @State() foregroundColor: IcThemeForeground = getThemeForegroundColor();\n\n  @Listen(\"themeChange\", { target: \"document\" })\n  themeChangeHandler(ev: CustomEvent): void {\n    const theme: IcTheme = ev.detail;\n    this.foregroundColor = theme.mode;\n  }\n\n  @Listen(\"scroll\", { target: \"document\" })\n  doScroll(): void {\n    if (this.disableBackgroundParallax) {\n      return;\n    }\n\n    const scrolltotop = document.scrollingElement.scrollTop;\n    const factor = 0.4;\n    const y = -100 + scrolltotop * factor;\n    this.scrollFactor = \"right \" + y + \"px\";\n  }\n\n  componentWillLoad(): void {\n    this.rightContent = slotHasContent(this.el, \"secondary\");\n  }\n\n  componentDidLoad(): void {\n    onComponentRequiredPropUndefined(\n      [{ prop: this.heading, propName: \"heading\" }],\n      \"Hero\"\n    );\n  }\n\n  componentWillRender(): void {\n    this.rightContent = slotHasContent(this.el, \"secondary\");\n  }\n\n  render() {\n    const {\n      aligned,\n      small,\n      heading,\n      subheading,\n      secondaryHeading,\n      secondarySubheading,\n      foregroundColor,\n      backgroundImage,\n      scrollFactor,\n    } = this;\n\n    let style = {};\n\n    if (backgroundImage !== undefined) {\n      style = {\n        \"background-image\": \"url(\" + backgroundImage + \")\",\n        \"background-position\": scrollFactor,\n      };\n    }\n\n    return (\n      <Host\n        class={{\n          [IcThemeForegroundEnum.Dark]:\n            foregroundColor === IcThemeForegroundEnum.Dark,\n          [\"has-background-image\"]: backgroundImage !== undefined,\n          [\"small\"]: small,\n          [\"secondary-heading\"]: !!secondaryHeading,\n        }}\n        style={style}\n      >\n        <ic-section-container\n          aligned={aligned}\n          fullHeight\n          class=\"section-container\"\n        >\n          <div\n            class={{\n              [\"left-container\"]: true,\n              [\"left-container-full-width\"]: this.leftContentFullWidth,\n            }}\n          >\n            <div class=\"heading\">\n              <slot name=\"heading\">\n                <ic-typography\n                  variant={small ? \"h2\" : \"h1\"}\n                  class={{ [\"heading-bottom-spacing\"]: !small }}\n                >\n                  {heading}\n                </ic-typography>\n              </slot>\n            </div>\n            <div class=\"subheading\">\n              <slot name=\"subheading\">\n                <ic-typography variant=\"body\">{subheading}</ic-typography>\n              </slot>\n            </div>\n            <div class=\"interaction-container\">\n              <slot name=\"interaction\"></slot>\n            </div>\n          </div>\n          {(secondaryHeading !== undefined || this.rightContent) && (\n            <div class=\"right-container\">\n              <slot name=\"secondary\">\n                {secondaryHeading && (\n                  <div class=\"secondary-container\">\n                    <div class=\"secondary-heading\">\n                      <ic-typography variant=\"h4\">\n                        {secondaryHeading}\n                      </ic-typography>\n                    </div>\n                    <div class=\"secondary-subheading\">\n                      <ic-typography variant=\"subtitle-small\">\n                        {secondarySubheading}\n                      </ic-typography>\n                    </div>\n                  </div>\n                )}\n              </slot>\n            </div>\n          )}\n        </ic-section-container>\n      </Host>\n    );\n  }\n}\n"],"mappings":"+IAAA,MAAMA,EAAY,mzM,MCkCLC,EAAI,M,2MA+B+B,M,aAKf,O,oBAKmB,O,WAKzB,M,kBAEQ,M,kBAED,e,2BAG7BC,KAAKC,cAAgBD,KAAKE,mBAAqBC,U,qBAEJC,G,CAG9CC,mBAAmBC,GACjB,MAAMC,EAAiBD,EAAGE,OAC1BR,KAAKS,gBAAkBF,EAAMG,I,CAI/BC,WACE,GAAIX,KAAKY,0BAA2B,CAClC,M,CAGF,MAAMC,EAAcC,SAASC,iBAAiBC,UAC9C,MAAMC,EAAS,GACf,MAAMC,GAAK,IAAML,EAAcI,EAC/BjB,KAAKmB,aAAe,SAAWD,EAAI,I,CAGrCE,oBACEpB,KAAKC,aAAeoB,EAAerB,KAAKsB,GAAI,Y,CAG9CC,mBACEC,EACE,CAAC,CAAEC,KAAMzB,KAAK0B,QAASC,SAAU,YACjC,O,CAIJC,sBACE5B,KAAKC,aAAeoB,EAAerB,KAAKsB,GAAI,Y,CAG9CO,SACE,MAAMC,QACJA,EAAOC,MACPA,EAAKL,QACLA,EAAOM,WACPA,EAAU9B,iBACVA,EAAgB+B,oBAChBA,EAAmBxB,gBACnBA,EAAeyB,gBACfA,EAAef,aACfA,GACEnB,KAEJ,IAAImC,EAAQ,GAEZ,GAAID,IAAoB/B,UAAW,CACjCgC,EAAQ,CACN,mBAAoB,OAASD,EAAkB,IAC/C,sBAAuBf,E,CAI3B,OACEiB,EAACC,EAAI,CACHC,MAAO,CACL,CAACC,EAAsBC,MACrB/B,IAAoB8B,EAAsBC,KAC5C,CAAC,wBAAyBN,IAAoB/B,UAC9C,CAAC,SAAU4B,EACX,CAAC,uBAAwB7B,GAE3BiC,MAAOA,GAEPC,EAAA,wBACEN,QAASA,EACTW,WAAU,KACVH,MAAM,qBAENF,EAAA,OACEE,MAAO,CACL,CAAC,kBAAmB,KACpB,CAAC,6BAA8BtC,KAAK0C,uBAGtCN,EAAA,OAAKE,MAAM,WACTF,EAAA,QAAMO,KAAK,WACTP,EAAA,iBACEQ,QAASb,EAAQ,KAAO,KACxBO,MAAO,CAAE,CAAC,2BAA4BP,IAErCL,KAIPU,EAAA,OAAKE,MAAM,cACTF,EAAA,QAAMO,KAAK,cACTP,EAAA,iBAAeQ,QAAQ,QAAQZ,KAGnCI,EAAA,OAAKE,MAAM,yBACTF,EAAA,QAAMO,KAAK,mBAGbzC,IAAqBC,WAAaH,KAAKC,eACvCmC,EAAA,OAAKE,MAAM,mBACTF,EAAA,QAAMO,KAAK,aACRzC,GACCkC,EAAA,OAAKE,MAAM,uBACTF,EAAA,OAAKE,MAAM,qBACTF,EAAA,iBAAeQ,QAAQ,MACpB1C,IAGLkC,EAAA,OAAKE,MAAM,wBACTF,EAAA,iBAAeQ,QAAQ,kBACpBX,Q"}

package/dist/core/p-d6694b41.entry.js

@@ -1,2 +0,0 @@
-import{r as t,c as i,h as e,H as o,g as a}from"./p-f3053872.js";import{b as r,n,r as s,p as c,a as l}from"./p-4a385752.js";import{I as d}from"./p-6f57b13c.js";import{c as h}from"./p-ec26fc38.js";const u='/*! 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{display:inline-block;--button-default:var(--ic-action-default);--button-default-hover:var(--ic-action-default-hover);--button-default-active:var(--ic-action-default-active);--button-default-background-hover:var(--ic-action-default-bg-hover);--button-default-background-active:var(--ic-action-default-bg-active);--icon-width:100%;--icon-height:100%}.button{font-family:var(--ic-font-body-family);text-decoration:none;font-weight:600;font-size:0.875rem;transition:var(--ic-easing-transition-fast);border-radius:var(--ic-border-radius);min-width:var(--min-width, 6.25rem);display:inline-flex;gap:var(--ic-space-xs);flex-direction:row;justify-content:center;align-items:center;background:none;border:none;box-sizing:border-box;white-space:nowrap;vertical-align:middle}.button:hover{cursor:pointer}.button:focus,:host .button:focus{box-shadow:var(--ic-border-focus)}:host(.light) .button:focus{box-shadow:var(--ic-border-focus)}.button:focus-visible{outline:var(--ic-hc-focus-outline)}:host(.dark) .button{--button-default:var(--ic-action-dark);--button-default-hover:var(--ic-action-dark);--button-default-active:var(--ic-action-dark);--button-default-background-hover:var(--ic-action-dark-bg-hover);--button-default-background-active:var(--ic-action-dark-bg-active)}:host(.light) .button{--button-default:var(--ic-action-light);--button-default-hover:var(--ic-action-light);--button-default-active:var(--ic-action-light);--button-default-background-hover:var(--ic-action-light-bg-hover);--button-default-background-active:var(--ic-action-light-bg-active)}:host(.button-variant-primary.light) .button{color:var(--ic-color-primary-text);--button-default-hover:var(--ic-action-light-hover);--button-default-active:var(--ic-action-light-active)}:host(.button-variant-primary.dark) .button{--button-default-hover:var(--ic-action-dark-hover);--button-default-active:var(--ic-action-dark-active)}:host(.disabled),:host(.disabled) .button,:host(.loading),:host(.loading) .button{pointer-events:none}:host(.button-variant-primary) .button{color:var(--ic-architectural-white);background-color:var(--button-default)}:host(.button-variant-primary) .button:hover:not(:focus){background-color:var(--button-default-hover)}:host(.button-variant-primary) .button:active:not(:focus),:host(.button-variant-primary.loading) .button{background-color:var(--button-default-active)}:host(.button-variant-primary.disabled) .button{background:var(--ic-architectural-200);color:var(--ic-architectural-300)}:host(.button-variant-primary.light.disabled) .button{background:var(--ic-architectural-600);color:var(--ic-architectural-500)}:host(.button-variant-secondary) .button{border:var(--ic-space-1px) solid var(--button-default);color:var(--button-default)}:host(.button-variant-secondary) .button:hover:not(:focus){background-color:var(--button-default-background-hover);border-color:var(--button-default-hover);color:var(--button-default-hover)}:host(.button-variant-secondary) .button:active:not(:focus){border-color:var(--button-default-active);background-color:var(--button-default-background-active);color:var(--button-default-active)}:host(.button-variant-secondary.loading) .button{border-color:var(--button-default-active);background-color:var(--button-default-background-active);color:var(--button-default-active)}:host(.button-variant-secondary.disabled) .button,:host(.button-variant-secondary.disabled) .button:hover,:host(.button-variant-secondary.disabled) .button:active{border-color:var(--ic-architectural-300);color:var(--ic-architectural-300);background:none}:host(.button-variant-secondary.light.disabled) .button,:host(.button-variant-secondary.light.disabled) .button:hover,:host(.button-variant-secondary.light.disabled) .button:active{border-color:var(--ic-architectural-500);color:var(--ic-architectural-500);background:none}:host(.button-variant-tertiary) .button{color:var(--button-default)}:host(.button-variant-tertiary) .button:hover:not(:focus){background-color:var(--button-default-background-hover);color:var(--button-default-hover)}:host(.button-variant-tertiary) .button:active:not(:focus),:host(.button-variant-tertiary.loading) .button{background-color:var(--button-default-background-active);color:var(--button-default-active)}:host(.button-variant-tertiary.disabled) .button,:host(.button-variant-tertiary.disabled) .button:hover,:host(.button-variant-tertiary.disabled) .button:active{border-color:var(--ic-architectural-300);color:var(--ic-architectural-300);background:none}:host(.button-variant-tertiary.light.disabled) .button,:host(.button-variant-tertiary.light.disabled) .button:hover,:host(.button-variant-tertiary.light.disabled) .button:active{border-color:var(--ic-architectural-500);color:var(--ic-architectural-500);background:none}:host(.button-variant-icon) .button{color:var(--button-default);min-width:0}:host(.button-variant-icon) .button:hover:not(:focus){background-color:var(--button-default-background-hover);color:var(--button-default-hover)}:host(.button-variant-icon) .button:active:not(:focus),:host(.button-variant-icon.loading) .button{background-color:var(--button-default-background-active);color:var(--button-default-active)}:host(.button-variant-icon.disabled) .button,:host(.button-variant-icon.disabled) .button:hover,:host(.button-variant-icon.disabled) .button:active{color:var(--ic-architectural-300);background:none}:host(.button-variant-destructive) .button{color:var(--ic-architectural-white);background-color:var(--ic-action-destructive);text-transform:uppercase}:host(.button-variant-destructive) .button:hover:not(:focus){background-color:var(--ic-action-destructive-hover)}:host(.button-variant-destructive) .button:active:not(:focus),:host(.button-variant-destructive.loading) .button{background-color:var(--ic-action-destructive-active)}:host(.button-variant-destructive.disabled) .button{background:var(--ic-architectural-200);color:var(--ic-architectural-300)}:host(.button-size-default) .button{height:2.5rem;padding:var(--ic-space-xs) var(--ic-space-md)}:host(.button-size-small) .button{height:var(--ic-space-xl);padding:var(--ic-space-xxs) var(--ic-space-md)}:host(.button-size-large) .button{height:var(--ic-space-xxl);padding:var(--ic-space-sm) var(--ic-space-md)}:host(.button-size-default.button-variant-icon) .button{height:var(--ic-space-xl);width:var(--ic-space-xl);padding:0.375rem}:host(.button-size-small.button-variant-icon) .button{height:var(--ic-space-lg);width:var(--ic-space-lg);padding:var(--ic-space-xxs)}:host(.button-size-large.button-variant-icon) .button{height:2.5rem;width:2.5rem;padding:var(--ic-space-xs)}:host(.full-width),:host(.full-width) .button{width:100%}div.loading-container{position:relative;align-items:center;width:100%}ic-loading-indicator{--outer-color:transparent}@keyframes loading-animation{0%{width:0%;left:0%}25%{width:0%;left:0%;opacity:0}50%{width:100%;left:0%;opacity:1}75%{width:0%;left:100%}100%{width:0%;left:100%;opacity:0}}div.icon-container{box-sizing:border-box;width:var(--ic-space-lg);height:var(--ic-space-lg);display:flex;justify-content:center;align-items:center}::slotted(*){width:var(--icon-width) !important;height:var(--icon-height) !important;fill:currentcolor !important;pointer-events:none}:host(.button-variant-icon) .button .icon-container{margin:0;pointer-events:none}:host(.search-submit-button) ::slotted(svg){--icon-height:1.25rem;--icon-width:1.25rem}:host(.search-submit-button-small) ::slotted(svg){--icon-height:1rem;--icon-width:1rem}:host(.clear-button){margin:0 var(--ic-space-xxs)}:host(.clear-button) .button:focus{box-shadow:none}:host(.search-submit-button) .button:focus{box-shadow:none}:host(.search-submit-button) .button:not(:active):focus{box-shadow:none;background-color:var(--ic-action-default-bg-hover)}:host(.search-submit-button){display:flex;align-items:center;margin:0 var(--ic-space-xxs)}:host(.menu-close-button) ::slotted(svg){--icon-height:0.875rem;--icon-width:0.875rem}:host(.popout-menu-button) .button{justify-content:left;border-radius:0;white-space:pre-line;text-align:start}:host(.popout-menu-button) div.icon-container{flex:none}:host(.popout-menu-button) .button:focus{box-shadow:var(--ic-border-focus-inset);border-radius:var(--ic-border-radius-inset)}.ic-button-describedby{display:none}:host .ic-tooltip{display:block}@media (forced-colors: active){.button{border:0.125rem solid transparent}}:host(.flip) ::slotted(svg){transform:scaleX(-1)}';var b=undefined&&undefined.__rest||function(t,i){var e={};for(var o in t)if(Object.prototype.hasOwnProperty.call(t,o)&&i.indexOf(o)<0)e[o]=t[o];if(t!=null&&typeof Object.getOwnPropertySymbols==="function")for(var a=0,o=Object.getOwnPropertySymbols(t);a<o.length;a++){if(i.indexOf(o[a])<0&&Object.prototype.propertyIsEnumerable.call(t,o[a]))e[o[a]]=t[o[a]]}return e};let p=0;const v=class{constructor(e){t(this,e);this.icFocus=i(this,"icFocus",7);this.icBlur=i(this,"icBlur",7);this.inheritedAttributes={};this.hasTooltip=false;this.buttonIdNum=p++;this.handleClick=()=>{if((this.el.type==="submit"||this.el.type==="reset")&&!!this.el.closest("FORM")){this.handleHiddenFormButtonClick(this.el.closest("FORM"))}};this.onFocus=()=>{this.icFocus.emit()};this.onBlur=()=>{this.icBlur.emit()};this.disabled=false;this.loading=false;this.type="button";this.href=undefined;this.target=undefined;this.rel=undefined;this.download=false;this.hreflang=undefined;this.referrerpolicy=undefined;this.variant="primary";this.size="default";this.fullWidth=false;this.disableTooltip=false;this.tooltipPlacement="bottom";this.appearance="default";this.form=undefined;this.formaction=undefined;this.formenctype=undefined;this.formmethod=undefined;this.formnovalidate=undefined;this.formtarget=undefined}handleHostClick(t){if(this.disabled||this.loading){t.stopImmediatePropagation()}}themeChangeHandler(t){const i=t.detail;this.updateTheme(i.mode)}async setFocus(){if(this.buttonEl){this.buttonEl.focus()}}async updateAriaLabel(t){if(this.hasTooltip){this.tooltipEl.label=t;this.buttonEl.setAttribute("aria-label",t)}}hasIconSlot(){const t=this.el.querySelector(`[slot="icon"]`);return t!==null}handleHiddenFormButtonClick(t){const i=document.createElement("button");i.setAttribute("type",this.el.type);i.style.display="none";t.appendChild(i);i.click();i.remove()}updateTheme(t=null){const i=r(this.el,t||null);if(i!==d.Default){this.appearance=i}}componentWillLoad(){this.inheritedAttributes=n(this.el,[...c,"aria-expanded","title"]);s(this.disabled,this.el);this.el.setAttribute("exportparts","button");const t=this.el.id;this.id=t!==undefined?t:null;this.hasTooltip=this.variant==="icon"&&this.disableTooltip===false}componentDidLoad(){this.updateTheme()}render(){const t=this.href&&"a"||"button";const i=this.inheritedAttributes,{title:a,"aria-label":r}=i,n=b(i,["title","aria-label"]);const s=t==="button"?{type:this.type,disabled:this.disabled,form:this.form,formaction:this.formaction,formenctype:this.formenctype,formmethod:this.formmethod,formnovalidate:this.formnovalidate,formtarget:this.formtarget}:{download:this.download!==false?this.download:null,href:this.href,rel:this.rel,target:this.target,referrerpolicy:this.referrerpolicy,hreflang:this.hreflang};const c=a&&a;const l=this.hasTooltip?{}:{title:c};let h="";if(this.hasTooltip){if(c!==undefined){h=c}else if(r!==null){h=r}}let u=null;let p=null;if(this.hasTooltip){p=this.id!==null?`ic-button-with-tooltip-${this.id}`:`ic-button-with-tooltip-${this.buttonIdNum}`;u=`ic-tooltip-${p}`}const v=()=>e(t,Object.assign({class:"button","aria-disabled":this.loading||this.disabled?"true":null,"aria-label":this.loading?"Loading":r},s,n,l,{onFocus:this.onFocus,onBlur:this.onBlur,ref:t=>this.buttonEl=t,id:p,"aria-describedby":u,part:"button"}),this.hasIconSlot()&&!this.loading&&e("div",{class:"icon-container"},e("slot",{name:"icon"})),this.loading?e("div",{class:"loading-container"},e("ic-loading-indicator",{type:"linear",appearance:this.variant==="primary"||this.variant==="destructive"||this.appearance===d.Dark||this.appearance===d.Light?"light":"dark"})):e("slot",null));return e(o,{class:{["disabled"]:this.disabled&&!this.loading,[`button-variant-${this.variant}`]:true,[`button-size-${this.size}`]:true,["loading"]:this.loading,["dark"]:this.appearance===d.Dark,["light"]:this.appearance===d.Light,["full-width"]:this.fullWidth},onClick:this.handleClick},this.hasTooltip&&e("ic-tooltip",{class:{["tooltip-disabled"]:this.disableTooltip},ref:t=>this.tooltipEl=t,label:h,target:p,placement:this.tooltipPlacement},e(v,null)),!this.hasTooltip&&e(v,null))}static get delegatesFocus(){return true}get el(){return a(this)}};v.style=u;const f='/*! 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{display:block;--linear-border-radius:0.25rem;--inner-color:var(--ic-action-default);--outer-color:var(--ic-architectural-100);--label-color:var(--ic-color-primary-text);--margin:none;--linear-line-height:var(--ic-space-xs)}:host(.light){--inner-color:var(--ic-architectural-white);--outer-color:var(--ic-architectural-800);--label-color:var(--ic-architectural-white)}.ic-loading-container{display:flex;flex-direction:column;justify-content:center;align-items:center}:host([size="small"]){--circular-diameter:2.5rem;--linear-line-height:var(--ic-space-xxs)}:host([size="default"]){--circular-diameter:5rem}:host([size="large"]){--circular-diameter:7.5rem}:host([size="icon"]){display:inline-block;--margin:var(--ic-space-xxxs);--circular-diameter:1.25rem}:host(.label){--margin:0 0 var(--ic-space-xs) 0}.ic-loading-label{white-space:nowrap;color:var(--label-color);margin-left:var(--label-margin-left)}.ic-loading-circular-outer{height:var(--circular-diameter);width:var(--circular-diameter)}.ic-loading-circular-outer.indeterminate{animation:circular-animation 1s linear;animation-iteration-count:infinite}@keyframes circular-animation{100%{transform:rotate(360deg)}}.ic-loading-circular-outer,.ic-loading-linear-outer{margin:var(--margin)}.ic-loading-linear-outer{background-color:var(--outer-color);height:var(--linear-line-height);width:100%;border-radius:var(--linear-border-radius);overflow:hidden}.ic-loading-linear-inner{position:relative;height:100%;background-color:var(--inner-color);border-radius:var(--linear-border-radius)}.indeterminate>.ic-loading-linear-inner{animation:linear-animation 2s infinite}.determinate>.ic-loading-linear-inner{transition:width 0.5s;width:var(--linear-width)}:host(.full-width){--linear-border-radius:none}@keyframes linear-animation{0%{width:0%;left:-1%}25%{width:0%;left:-1%}50%{width:101%;left:-1%}75%{width:0%;left:101%}100%{width:0%;left:101%}}.ic-loading-circular-svg{position:relative;width:100%;height:100%;transform:rotate(-90deg)}.ic-loading-circular-svg circle{width:100%;height:100%;fill:none;stroke:var(--outer-color);stroke-width:var(--circular-line-width);stroke-linecap:round}.ic-loading-circular-svg circle:nth-child(2){--circular-indeterminate:calc(\n    (0.25 * var(--stroke-dasharray)) - var(--stroke-dasharray)\n  );stroke-dasharray:var(--stroke-dasharray), var(--stroke-dasharray);stroke-dashoffset:var(--stroke-dashoffset, var(--circular-indeterminate));stroke:var(--compact-step-inner-color, var(--inner-color))}:host(.inner-label) .ic-loading-circular-inner{display:grid}:host(.inner-label) .ic-loading-circular-svg,.inner-text{grid-column:1;grid-row:1}:host(.not-required.compact-step-progress-indicator) .ic-loading-circular-svg circle:nth-child(2){stroke:var(--ic-architectural-300)}.inner-text{display:flex;align-items:center;justify-content:center;width:var(--ic-space-lg);height:inherit;overflow:hidden;margin:auto;color:var(--ic-status-info)}:host(.not-required.compact-step-progress-indicator) .inner-text{color:var(--ic-color-tertiary-text)}@media (forced-colors: active){.indeterminate>.ic-loading-circular-inner{forced-color-adjust:none}.ic-loading-linear-outer{border:var(--ic-hc-border)}.ic-loading-linear-inner{background-color:canvastext}.ic-loading-circular-svg circle{stroke:Background}.ic-loading-circular-svg circle:nth-child(2){stroke:canvastext}:host(.not-required.compact-step-progress-indicator) .ic-loading-circular-svg circle:nth-child(2){stroke:GrayText}}';const m=class{constructor(i){t(this,i);this.updateCircularProgressMeter=()=>{if(!this.indeterminate){this.circularMeter.style.setProperty("--progress-value",String(this.progress))}};this.getLabel=(t,i)=>new Promise((()=>{this.interval=setInterval((()=>{if(t<this.labelList.length-1){t++}else{t=0}i(this.labelList[t])}),this.labelDuration)}));this.getLabelVariant=()=>{var t;let i="h4";const e=(t=this.outerElement)===null||t===void 0?void 0:t.offsetWidth;if(this.size==="small"||this.type==="circular"&&e<60){i="label"}else if(this.size==="large"||this.type==="circular"&&e>=120){i="h2"}return i};this.setCircleLineWidth=()=>{const{offsetWidth:t}=this.outerElement;const i=this.host.classList.contains("compact-step-progress-indicator")?40:0;const e=this.host.classList.contains("toast-dismiss-timer")?20:0;if(t||i||e){this.circularLineWidth=(i||e||t)*.1;this.circularDiameter=i||e||t;this.outerElement.style.setProperty("--circular-line-width",`${this.circularLineWidth}px`)}};this.setLinearDeterminateWidth=()=>{if(!this.innerElement)return;const t=Math.min(this.max,Math.max(this.min,this.progress));const i=(t-this.min)/(this.max-this.min);this.showSecond=i>.5;if(this.showSecond){this.innerElement.classList.remove("clip")}else{this.innerElement.classList.add("clip")}this.innerElement.style.setProperty("--linear-width",`${i*100}%`)};this.calcOuterClass=()=>{let t=`ic-loading-${this.type}-outer`;t+=this.indeterminate?" indeterminate":" determinate";return t};this.updateLabel=()=>{if(this.label!==undefined){this.labelList=this.label.split("/");const t=0;this.indicatorLabel=this.labelList[t];if(this.labelList.length>1){this.getLabel(t,(t=>{this.indicatorLabel=t}))}}};this.setCircleXY=()=>{if(this.circularDiameter>0){const t=this.circularDiameter/2;const i=t;const e=t;const o=t-this.circularLineWidth/2;this.setDashSteps(o);return{x:i,y:e,r:o}}return{x:0,y:0,r:0}};this.setDashSteps=t=>{const i=2*Math.PI*t;const e=Math.min(Math.max(this.progress,this.min),this.max);const o=-1-(e-this.min)/(this.max-this.min);this.circularMeter.style.setProperty("--stroke-dasharray",`${i}px`);if(!this.indeterminate){this.circularMeter.style.setProperty("--circular-steps-max",String(this.max));this.circularMeter.style.setProperty("--stroke-dashoffset",`${o*i}px`)}};this.progress=undefined;this.min=0;this.max=100;this.label=undefined;this.description="Loading";this.innerLabel=undefined;this.labelDuration=8e3;this.size="default";this.type="circular";this.fullWidth=false;this.appearance="dark";this.indicatorLabel=undefined;this.indeterminate=undefined;this.showSecond=false;this.circularLineWidth=undefined;this.circularDiameter=undefined}watchPropHandler(){this.updateLabel()}watchProgressHandler(){if(this.type==="circular"){this.updateCircularProgressMeter()}}componentWillLoad(){this.indeterminate=this.progress===undefined;this.updateLabel()}componentDidLoad(){if(this.type==="circular"){this.setCircleLineWidth();this.circularMeter=this.host.shadowRoot.querySelector(".ic-loading-circular-svg circle:nth-child(2)");this.updateCircularProgressMeter()}if(Number(this.progress)>=0&&this.type==="linear"){this.setLinearDeterminateWidth()}}componentWillUpdate(){this.indeterminate=this.progress===undefined}componentDidUpdate(){if(Number(this.progress)>=0&&this.type==="linear"){this.setLinearDeterminateWidth()}}disconnectedCallback(){clearInterval(this.interval)}render(){const{appearance:t,label:i,description:a,size:r,fullWidth:n,innerLabel:s}=this;const{x:c,y:l,r:h}=this.setCircleXY();return e(o,{class:{["light"]:t===d.Light,["label"]:!!i,["full-width"]:n,["inner-label"]:!!s}},e("div",{class:"ic-loading-container"},e("div",{ref:t=>this.outerElement=t,class:this.calcOuterClass(),role:"progressbar","aria-labelledby":this.label&&this.size!=="icon"&&"ic-loading-label","aria-label":a,"aria-valuenow":this.progress,"aria-valuemin":this.min,"aria-valuemax":this.max},e("div",{ref:t=>this.innerElement=t,class:`ic-loading-${this.type}-inner`},this.innerLabel&&this.innerLabel!==undefined&&this.size==="small"&&e("ic-typography",{variant:"subtitle-small",class:"inner-text"},this.innerLabel),this.type==="circular"&&e("svg",{class:"ic-loading-circular-svg",viewBox:`0 0 ${this.circularDiameter||0} ${this.circularDiameter||0}`},e("circle",{cx:`${c}`,cy:`${l}`,r:`${h}`}),e("circle",{cx:`${c}`,cy:`${l}`,r:`${h}`})))),i&&r!=="icon"&&e("ic-typography",{id:"ic-loading-label",class:"ic-loading-label",role:"status",variant:this.getLabelVariant()},e("p",null,this.indicatorLabel))))}get host(){return a(this)}static get watchers(){return{label:["watchPropHandler"],progress:["watchProgressHandler"]}}};m.style=f;const g='/*! 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(.ic-tooltip) .ic-tooltip-container{background-color:var(--ic-architectural-800);color:#ffff;text-align:center;padding:var(--ic-space-xxxs) 0.625rem;border-radius:var(--ic-border-radius);border:var(--ic-space-1px) solid var(--ic-architectural-40);position:absolute;max-width:20rem;display:none;z-index:var(--ic-z-index-tooltip);box-shadow:var(--ic-elevation-overlay)}:host(.tooltip-navigation-item:not(.tooltip-navigation-item-side-nav-collapsed)) .ic-tooltip-container,:host(.tooltip-disabled) .ic-tooltip-container{display:none !important}:host(.tooltip-long-label-navigation-item-side-nav-expanded) .ic-tooltip-container[data-show]{display:block !important}:host(.ic-tooltip) .ic-tooltip-arrow,:host(.ic-tooltip) .ic-tooltip-arrow::before{position:absolute;background:inherit}:host(.ic-tooltip) .ic-tooltip-arrow{visibility:hidden;width:var(--ic-space-md);height:var(--ic-space-md)}:host(.ic-tooltip) .ic-tooltip-arrow::before{visibility:visible;content:"";border:var(--ic-space-1px) solid var(--ic-architectural-40);width:100%;height:100%}:host(.ic-tooltip) .ic-tooltip-container[data-show]{display:block}:host(.ic-tooltip) .ic-tooltip-container[data-popper-placement^="top"]>.ic-tooltip-arrow{height:var(--ic-space-xxxs)}:host(.ic-tooltip) .ic-tooltip-container[data-popper-placement^="top"]>.ic-tooltip-arrow::before{border-radius:0 0 var(--ic-border-radius) var(--ic-border-radius);left:0;top:var(--ic-space-xxxs);border-top:0}:host(.ic-tooltip) .ic-tooltip-container[data-popper-placement^="bottom"]>.ic-tooltip-arrow{top:calc(-1 * var(--ic-space-xxs));height:var(--ic-space-xxxs)}:host(.ic-tooltip) .ic-tooltip-container[data-popper-placement^="bottom"]>.ic-tooltip-arrow::before{border-radius:var(--ic-border-radius) var(--ic-border-radius) 0 0;left:0;top:var(--ic-space-1px);border-bottom:0}:host(.ic-tooltip) .ic-tooltip-container[data-popper-placement^="left"]>.ic-tooltip-arrow{width:var(--ic-space-xxxs);right:calc(-1 * var(--ic-space-1px))}:host(.ic-tooltip) .ic-tooltip-container[data-popper-placement^="left"]>.ic-tooltip-arrow::before{border-radius:0 var(--ic-border-radius) var(--ic-border-radius) 0;border-left:0;top:calc(-1 * var(--ic-space-1px))}:host(.ic-tooltip) .ic-tooltip-container[data-popper-placement^="right"]>.ic-tooltip-arrow{width:var(--ic-space-xxxs);left:calc(-1 * var(--ic-space-xxs))}:host(.ic-tooltip) .ic-tooltip-container[data-popper-placement^="right"]>.ic-tooltip-arrow::before{border-radius:var(--ic-border-radius) 0 0 var(--ic-border-radius);border-right:0;top:calc(-1 * var(--ic-space-1px))}@media (forced-colors: active){:host(.ic-tooltip) .ic-tooltip-container,:host(.ic-tooltip) .ic-tooltip-arrow::before{border:var(--ic-hc-border)}}';const y=class{constructor(i){t(this,i);this.mouseOverTool=false;this.showEvents=this.disableHover?["click"]:["mouseenter","focusin"];this.instantHideEvents=["focusout"];this.delayedHideEvents=["mouseleave"];this.persistTooltip=false;this.show=()=>{this.toolTip.setAttribute("data-show","");this.popperInstance.update()};this.hide=()=>{this.toolTip.removeAttribute("data-show");this.persistTooltip=false};this.checkCloseTooltip=()=>{setTimeout((()=>{if(!this.mouseOverTool&&!this.persistTooltip){this.hide()}}),100)};this.mouseEnterTooltip=()=>{this.mouseOverTool=true};this.mouseLeaveTooltip=()=>{this.mouseOverTool=false;this.checkCloseTooltip()};this.handleKeyDown=t=>{if(t.key==="Escape"&&!this.persistTooltip){this.hide()}};this.manageEventListeners=t=>{const i=t==="add"?"addEventListener":"removeEventListener";this.showEvents.forEach((t=>{this.el[i](t,this.show);if(this.toolTip!==undefined){this.toolTip[i](t,this.mouseEnterTooltip)}}));if(!this.persistTooltip){this.instantHideEvents.forEach((t=>{this.el[i](t,this.hide)}))}this.delayedHideEvents.forEach((t=>{this.el[i](t,this.checkCloseTooltip);if(this.toolTip!==undefined){this.toolTip[i](t,this.mouseLeaveTooltip)}}));document[i]("keydown",this.handleKeyDown)};this.screenReaderOnlyStyles={position:"absolute",left:"-10000px",top:"auto",width:"1px",height:"1px",overflow:"hidden"};this.target=undefined;this.placement="bottom";this.label=undefined;this.disableHover=false}updateLabel(t){const i=this.el.previousElementSibling;if(i!==null){i.innerText=t}}async displayTooltip(t,i){this.persistTooltip=i;t?this.show():this.hide()}componentDidLoad(){this.popperInstance=h(this.el,this.toolTip,{placement:this.placement,modifiers:[{name:"offset",options:{offset:[0,10]}},{name:"arrow",options:{element:this.arrow}},{name:"eventListeners",options:{scroll:false,resize:false}}]});this.manageEventListeners("add");l([{prop:this.label,propName:"label"}],"Tooltip");if(this.target!==undefined){const t=document.createElement("span");t.id=`ic-tooltip-${this.target}`;t.innerText=this.label;t.classList.add("ic-tooltip-label");Object.assign(t.style,this.screenReaderOnlyStyles);this.el.insertAdjacentElement("beforebegin",t)}}disconnectedCallback(){this.manageEventListeners("remove");this.popperInstance.destroy()}render(){const{label:t}=this;return e(o,{class:{"ic-tooltip":true}},e("div",{ref:t=>this.toolTip=t,role:"tooltip",class:"ic-tooltip-container"},e("ic-typography",{variant:"caption"},t),e("div",{ref:t=>this.arrow=t,class:"ic-tooltip-arrow","data-popper-arrow":true})),e("slot",null))}get el(){return a(this)}static get watchers(){return{label:["updateLabel"]}}};y.style=g;export{v as ic_button,m as ic_loading_indicator,y as ic_tooltip};
-//# sourceMappingURL=p-d6694b41.entry.js.map