@carbon/web-components 1.36.1 → 1.37.0

package/es/components/tabs/tabs.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","names":["classMap","html","property","query","ChevronDown16","settings","HostListenerMixin","HostListener","find","forEach","BXContentSwitcher","NAVIGATION_DIRECTION","NAVIGATION_DIRECTION_NARROW","TABS_COLOR_SCHEME","TABS_KEYBOARD_ACTION","TABS_TYPE","styles","carbonElement","customElement","prefix","BXTabs","_decorate","_initialize","_HostListenerMixin","constructor","args","F","d","kind","key","value","decorators","_handleFocusOut","relatedTarget","contains","_handleUserInitiatedToggle","force","_open","_assistiveStatusText","selectingItemsAssistiveText","selectedItemAssistiveText","triggerContent","assistiveStatusText","_selectedItemContent","selectedItemContent","selectedItemText","textContent","requestUpdate","_clearHighlight","querySelectorAll","selectorItem","item","highlighted","_navigate","direction","immediate","selectorItemHighlighted","selectorItemSelected","nextItem","_getNextItem","querySelector","_handleUserInitiatedSelectItem","scrollIntoView","block","nextItemText","_currentIndex","_handleClick","event","target","_get","_getPrototypeOf","prototype","call","_handleKeydown","open","_triggerNode","triggerNode","narrowMode","Boolean","offsetParent","action","getAction","NAVIGATING","TRIGGERING","CLOSING","SELECTING","HOME","_totalTabs","END","highlightedItem","_selectionDidChange","itemToSelect","attribute","reflect","REGULAR","shouldUpdate","changedProperties","has","elem","type","range","ownerDocument","createRange","selectNodeContents","cloneContents","render","triggerClasses","listClasses","_t","_","String","static","Set","selectorItemEnabled","eventBeforeSelect","eventSelect","TRIGGER_KEYS","NONE"],"sources":["components/tabs/tabs.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit-html/directives/class-map';\nimport { html, property, query } from 'lit-element';\nimport ChevronDown16 from '@carbon/icons/lib/chevron--down/16';\nimport settings from 'carbon-components/es/globals/js/settings';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport HostListener from '../../globals/decorators/host-listener';\nimport { find, forEach } from '../../globals/internal/collection-helpers';\nimport BXContentSwitcher, {\n  NAVIGATION_DIRECTION,\n} from '../content-switcher/content-switcher';\nimport {\n  NAVIGATION_DIRECTION_NARROW,\n  TABS_COLOR_SCHEME,\n  TABS_KEYBOARD_ACTION,\n  TABS_TYPE,\n} from './defs';\nimport BXTab from './tab';\nimport styles from './tabs.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nconst { prefix } = settings;\n\nexport {\n  NAVIGATION_DIRECTION,\n  NAVIGATION_DIRECTION_NARROW,\n  TABS_COLOR_SCHEME,\n  TABS_KEYBOARD_ACTION,\n  TABS_TYPE,\n};\n\n/**\n * Tabs.\n *\n * @element bx-tabs\n * @fires bx-tabs-beingselected\n *   The custom event fired before a tab is selected upon a user gesture.\n *   Cancellation of this event stops changing the user-initiated selection.\n * @fires bx-tabs-selected - The custom event fired after a a tab is selected upon a user gesture.\n */\n@customElement(`${prefix}-tabs`)\nclass BXTabs extends HostListenerMixin(BXContentSwitcher) {\n  /**\n   * The latest status of this dropdown, for screen reader to accounce.\n   */\n  private _assistiveStatusText?: string;\n\n  /**\n   * `true` if the narrow mode dropdown should be open.\n   */\n  private _open = false;\n\n  /**\n   * The currently selected index\n   */\n  private _currentIndex: number = 0;\n\n  /**\n   * The content of the selected item, used in the narrow mode.\n   */\n  private _selectedItemContent: DocumentFragment | null = null;\n\n  /**\n   * Total number of tabs in the component\n   */\n  private _totalTabs: number = 0;\n\n  /**\n   * The DOM element for the trigger button in narrow mode.\n   */\n  @query('#trigger')\n  private _triggerNode!: HTMLDivElement;\n\n  /**\n   * Handles `blur` event handler on this element.\n   *\n   * @param event The event.\n   */\n  @HostListener('focusout')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleFocusOut({ relatedTarget }: FocusEvent) {\n    if (!this.contains(relatedTarget as Node)) {\n      this._handleUserInitiatedToggle(false);\n    }\n  }\n\n  /**\n   * Handles user-initiated toggling the open state.\n   *\n   * @param [force] If specified, forces the open state to the given one.\n   */\n  private _handleUserInitiatedToggle(force: boolean = !this._open) {\n    this._open = force;\n    if (this._open) {\n      this._assistiveStatusText = this.selectingItemsAssistiveText;\n    } else {\n      const {\n        selectedItemAssistiveText,\n        triggerContent,\n        _assistiveStatusText: assistiveStatusText,\n        _selectedItemContent: selectedItemContent,\n      } = this;\n      const selectedItemText =\n        (selectedItemContent && selectedItemContent.textContent) ||\n        triggerContent;\n      if (\n        selectedItemText &&\n        assistiveStatusText !== selectedItemAssistiveText\n      ) {\n        this._assistiveStatusText = selectedItemText;\n      }\n    }\n    this.requestUpdate();\n  }\n\n  /**\n   * Clears the selection of tabs.\n   */\n  private _clearHighlight() {\n    forEach(\n      this.querySelectorAll((this.constructor as typeof BXTabs).selectorItem),\n      (item) => {\n        (item as BXTab).highlighted = false;\n      }\n    );\n  }\n\n  /**\n   * Navigates through tabs.\n   *\n   * @param direction `-1` to navigate backward, `1` to navigate forward.\n   * @param [options] The options.\n   * @param [options.immediate]\n   *   `true` to make it \"immediate selection change\" mode, which does:\n   *\n   *   Starts with the selected item\n   *   Going prev/next item immediately changes the selection\n   */\n  protected _navigate(\n    direction: number,\n    { immediate }: { immediate?: boolean } = {}\n  ) {\n    const { selectorItem, selectorItemHighlighted, selectorItemSelected } = this\n      .constructor as typeof BXTabs;\n    const nextItem = this._getNextItem(\n      this.querySelector(\n        immediate ? selectorItemSelected : selectorItemHighlighted\n      ) as BXTab,\n      direction\n    );\n    if (!nextItem) {\n      return;\n    }\n\n    if (immediate) {\n      this._handleUserInitiatedSelectItem(nextItem as BXTab);\n    } else {\n      forEach(this.querySelectorAll(selectorItem), (item) => {\n        (item as BXTab)[immediate ? 'selected' : 'highlighted'] =\n          nextItem === item;\n      });\n    }\n\n    // Using `{ block: 'nearest' }` to prevent scrolling unless scrolling is absolutely necessary.\n    // `scrollIntoViewOptions` seems to work in latest Safari despite of MDN/caniuse table.\n    // IE falls back to the old behavior.\n    nextItem.scrollIntoView({ block: 'nearest' });\n\n    const nextItemText = nextItem.textContent;\n    if (nextItemText) {\n      this._assistiveStatusText = nextItemText;\n    }\n    this._currentIndex += direction;\n    this.requestUpdate();\n  }\n\n  @HostListener('click')\n  protected _handleClick(event: MouseEvent) {\n    const { target } = event;\n    if (this === target) {\n      this._handleUserInitiatedToggle();\n    } else if ((target as BXTab).value === this.value) {\n      // Clicking on selected item, simply closes the narrow mode dropdown\n      this._handleUserInitiatedToggle(false);\n    } else {\n      // Trying to select the item\n      // If the custom event of the selection is canceled, we don't close the narrow mode dropdown\n      super._handleClick(event);\n    }\n  }\n\n  @HostListener('keydown')\n  protected _handleKeydown(event: KeyboardEvent) {\n    const { _open: open, _triggerNode: triggerNode } = this;\n    const { key, target } = event;\n    const narrowMode = Boolean(triggerNode.offsetParent);\n    const action = (this.constructor as typeof BXTabs).getAction(key, {\n      narrowMode,\n    });\n    if (!open && narrowMode) {\n      // Menu closed in narrow mode\n      switch (action) {\n        case TABS_KEYBOARD_ACTION.NAVIGATING:\n          this._handleUserInitiatedToggle(true);\n          // If this menu gets open with an arrow key, resets the highlight\n          this._clearHighlight();\n          break;\n        case TABS_KEYBOARD_ACTION.TRIGGERING:\n          this._handleUserInitiatedToggle(true);\n          break;\n        default:\n          break;\n      }\n    } else {\n      switch (action) {\n        case TABS_KEYBOARD_ACTION.CLOSING:\n          this._handleUserInitiatedToggle(false);\n          break;\n        case TABS_KEYBOARD_ACTION.SELECTING:\n          this._handleUserInitiatedSelectItem(target as BXTab);\n          break;\n        case TABS_KEYBOARD_ACTION.HOME:\n          this._navigate(this._currentIndex + this._totalTabs, {\n            immediate: !narrowMode,\n          });\n          break;\n        case TABS_KEYBOARD_ACTION.END:\n          this._navigate(-this._currentIndex, { immediate: !narrowMode });\n          break;\n        case TABS_KEYBOARD_ACTION.NAVIGATING:\n          {\n            const direction = narrowMode\n              ? NAVIGATION_DIRECTION_NARROW[key]\n              : NAVIGATION_DIRECTION[key];\n            if (direction) {\n              this._navigate(direction, { immediate: !narrowMode });\n            }\n          }\n          break;\n        case TABS_KEYBOARD_ACTION.TRIGGERING:\n          {\n            const { selectorItemHighlighted } = this\n              .constructor as typeof BXTabs;\n            const highlightedItem = this.querySelector(\n              selectorItemHighlighted\n            ) as BXTab;\n            if (highlightedItem) {\n              if (highlightedItem.value === this.value) {\n                // Selecting an already-selected item, simply closes the narrow mode dropdown\n                this._handleUserInitiatedToggle(false);\n              } else {\n                // Trying to select the item\n                // If the custom event of the selection is canceled, we don't close the narrow mode dropdown\n                this._handleUserInitiatedSelectItem(highlightedItem);\n              }\n            } else {\n              this._handleUserInitiatedToggle();\n            }\n          }\n          break;\n        default:\n          break;\n      }\n    }\n  }\n\n  protected _selectionDidChange(itemToSelect: BXTab) {\n    super._selectionDidChange(itemToSelect);\n    this._assistiveStatusText = this.selectedItemAssistiveText;\n    this._handleUserInitiatedToggle(false);\n  }\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TABS_COLOR_SCHEME.REGULAR;\n\n  /**\n   * An assistive text for screen reader to announce, telling the open state.\n   */\n  @property({ attribute: 'selecting-items-assistive-text' })\n  selectingItemsAssistiveText =\n    'Selecting items. Use up and down arrow keys to navigate.';\n\n  /**\n   * An assistive text for screen reader to announce, telling that an item is selected.\n   */\n  @property({ attribute: 'selected-item-assistive-text' })\n  selectedItemAssistiveText = 'Selected an item.';\n\n  /**\n   * The content of the trigger button for narrow mode.\n   */\n  @property({ attribute: 'trigger-content' })\n  triggerContent = '';\n\n  /**\n   * Tabs type.\n   */\n  @property({ reflect: true })\n  type = TABS_TYPE.REGULAR;\n\n  shouldUpdate(changedProperties) {\n    super.shouldUpdate(changedProperties);\n    const { selectorItem } = this.constructor as typeof BXTabs;\n    if (changedProperties.has('type')) {\n      forEach(this.querySelectorAll(selectorItem), (elem) => {\n        this._totalTabs++;\n        (elem as BXTab).type = this.type;\n      });\n    }\n    if (changedProperties.has('value')) {\n      const item = find(\n        this.querySelectorAll(selectorItem),\n        (elem) => (elem as BXTab).value === this.value\n      );\n      if (item) {\n        const range = this.ownerDocument!.createRange();\n        range.selectNodeContents(item);\n        this._selectedItemContent = range.cloneContents();\n      } else {\n        this._selectedItemContent = null;\n      }\n    }\n    return true;\n  }\n\n  render() {\n    const {\n      triggerContent,\n      _assistiveStatusText: assistiveStatusText,\n      _open: open,\n      _selectedItemContent: selectedItemContent,\n    } = this;\n    const triggerClasses = classMap({\n      [`${prefix}--tabs-trigger`]: true,\n      [`${prefix}--tabs-trigger--open`]: open,\n    });\n    const listClasses = classMap({\n      [`${prefix}--tabs__nav`]: true,\n      [`${prefix}--tabs__nav--hidden`]: !open,\n    });\n    return html`\n      <div\n        id=\"trigger\"\n        role=\"button\"\n        class=\"${triggerClasses}\"\n        aria-labelledby=\"trigger-label\"\n        aria-expanded=\"${String(open)}\"\n        aria-haspopup=\"listbox\"\n        aria-owns=\"tablist\"\n        aria-controls=\"tablist\">\n        <span id=\"trigger-label\" class=\"${prefix}--tabs-trigger-text\">\n          ${selectedItemContent || triggerContent}\n        </span>\n        ${ChevronDown16({ 'aria-hidden': 'true' })}\n      </div>\n      <ul id=\"tablist\" role=\"tablist\" class=\"${listClasses}\">\n        <slot></slot>\n      </ul>\n      <div\n        class=\"${prefix}--assistive-text\"\n        role=\"status\"\n        aria-live=\"assertive\"\n        aria-relevant=\"additions text\">\n        ${assistiveStatusText}\n      </div>\n    `;\n  }\n\n  /**\n   * Symbols of keys that triggers opening/closing menu and selecting/deselecting menu item.\n   */\n  static TRIGGER_KEYS = new Set([' ', 'Enter']);\n\n  /**\n   * A selector that will return tabs.\n   */\n  static get selectorItem() {\n    return `${prefix}-tab`;\n  }\n\n  /**\n   * A selector that will return enabled tabs.\n   */\n  static get selectorItemEnabled() {\n    return `${prefix}-tab:not([disabled])`;\n  }\n\n  /**\n   * A selector that will return highlighted tabs.\n   */\n  static get selectorItemHighlighted() {\n    return `${prefix}-tab[highlighted]`;\n  }\n\n  /**\n   * A selector that will return selected tabs.\n   */\n  static get selectorItemSelected() {\n    return `${prefix}-tab[selected]`;\n  }\n\n  /**\n   * The name of the custom event fired before a tab is selected upon a user gesture.\n   * Cancellation of this event stops changing the user-initiated selection.\n   */\n  static get eventBeforeSelect() {\n    return `${prefix}-tabs-beingselected`;\n  }\n\n  /**\n   * The name of the custom event fired after a a tab is selected upon a user gesture.\n   */\n  static get eventSelect() {\n    return `${prefix}-tabs-selected`;\n  }\n\n  static styles = styles;\n\n  /**\n   * @param key The key symbol.\n   * @param [options] The options.\n   * @param [options.narrowMode] `true` to get the action for narrow mode.\n   * @returns A action for dropdown for the given key symbol.\n   */\n  static getAction(key: string, { narrowMode }: { narrowMode?: boolean }) {\n    if (key === 'Escape') {\n      return TABS_KEYBOARD_ACTION.CLOSING;\n    }\n    if (key === 'Enter') {\n      return TABS_KEYBOARD_ACTION.SELECTING;\n    }\n    if (key === 'Home') {\n      return TABS_KEYBOARD_ACTION.HOME;\n    }\n    if (key === 'End') {\n      return TABS_KEYBOARD_ACTION.END;\n    }\n    if (\n      key in (narrowMode ? NAVIGATION_DIRECTION_NARROW : NAVIGATION_DIRECTION)\n    ) {\n      return TABS_KEYBOARD_ACTION.NAVIGATING;\n    }\n    if (narrowMode && this.TRIGGER_KEYS.has(key)) {\n      return TABS_KEYBOARD_ACTION.TRIGGERING;\n    }\n    return TABS_KEYBOARD_ACTION.NONE;\n  }\n}\n\nexport default BXTabs;\n"],"mappings":"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"}
+{"version":3,"file":"tabs.js","names":["classMap","html","property","query","ChevronDown16","settings","HostListenerMixin","HostListener","find","forEach","BXContentSwitcher","NAVIGATION_DIRECTION","NAVIGATION_DIRECTION_NARROW","TABS_COLOR_SCHEME","TABS_KEYBOARD_ACTION","TABS_TYPE","styles","carbonElement","customElement","prefix","BXTabs","_decorate","_initialize","_HostListenerMixin","constructor","args","F","d","kind","key","value","decorators","_handleFocusOut","relatedTarget","contains","_handleUserInitiatedToggle","force","_open","_assistiveStatusText","selectingItemsAssistiveText","selectedItemAssistiveText","triggerContent","assistiveStatusText","_selectedItemContent","selectedItemContent","selectedItemText","textContent","requestUpdate","_clearHighlight","querySelectorAll","selectorItem","item","highlighted","_navigate","direction","immediate","selectorItemHighlighted","selectorItemSelected","nextItem","_getNextItem","querySelector","_handleUserInitiatedSelectItem","scrollIntoView","block","nextItemText","_currentIndex","_handleClick","event","target","_get","_getPrototypeOf","prototype","call","_handleKeydown","open","_triggerNode","triggerNode","narrowMode","Boolean","offsetParent","action","getAction","NAVIGATING","TRIGGERING","CLOSING","SELECTING","HOME","_totalTabs","END","highlightedItem","_selectionDidChange","itemToSelect","attribute","reflect","REGULAR","shouldUpdate","changedProperties","has","elem","type","range","ownerDocument","createRange","selectNodeContents","cloneContents","render","triggerClasses","listClasses","_t","_","String","static","Set","selectorItemEnabled","eventBeforeSelect","eventSelect","TRIGGER_KEYS","NONE"],"sources":["components/tabs/tabs.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { classMap } from 'lit-html/directives/class-map';\nimport { html, property, query } from 'lit-element';\nimport ChevronDown16 from '@carbon/icons/lib/chevron--down/16';\nimport settings from 'carbon-components/es/globals/js/settings';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport HostListener from '../../globals/decorators/host-listener';\nimport { find, forEach } from '../../globals/internal/collection-helpers';\nimport BXContentSwitcher, {\n  NAVIGATION_DIRECTION,\n} from '../content-switcher/content-switcher';\nimport {\n  NAVIGATION_DIRECTION_NARROW,\n  TABS_COLOR_SCHEME,\n  TABS_KEYBOARD_ACTION,\n  TABS_TYPE,\n} from './defs';\nimport BXTab from './tab';\nimport styles from './tabs.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nconst { prefix } = settings;\n\nexport {\n  NAVIGATION_DIRECTION,\n  NAVIGATION_DIRECTION_NARROW,\n  TABS_COLOR_SCHEME,\n  TABS_KEYBOARD_ACTION,\n  TABS_TYPE,\n};\n\n/**\n * Tabs.\n *\n * @element bx-tabs\n * @fires bx-tabs-beingselected\n *   The custom event fired before a tab is selected upon a user gesture.\n *   Cancellation of this event stops changing the user-initiated selection.\n * @fires bx-tabs-selected - The custom event fired after a a tab is selected upon a user gesture.\n */\n@customElement(`${prefix}-tabs`)\nclass BXTabs extends HostListenerMixin(BXContentSwitcher) {\n  /**\n   * The latest status of this dropdown, for screen reader to accounce.\n   */\n  private _assistiveStatusText?: string;\n\n  /**\n   * `true` if the narrow mode dropdown should be open.\n   */\n  private _open = false;\n\n  /**\n   * The currently selected index\n   */\n  private _currentIndex: number = 0;\n\n  /**\n   * The content of the selected item, used in the narrow mode.\n   */\n  private _selectedItemContent: DocumentFragment | null = null;\n\n  /**\n   * Total number of tabs in the component\n   */\n  private _totalTabs: number = 0;\n\n  /**\n   * The DOM element for the trigger button in narrow mode.\n   */\n  @query('#trigger')\n  private _triggerNode!: HTMLDivElement;\n\n  /**\n   * Handles `blur` event handler on this element.\n   *\n   * @param event The event.\n   */\n  @HostListener('focusout')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleFocusOut({ relatedTarget }: FocusEvent) {\n    if (!this.contains(relatedTarget as Node)) {\n      this._handleUserInitiatedToggle(false);\n    }\n  }\n\n  /**\n   * Handles user-initiated toggling the open state.\n   *\n   * @param [force] If specified, forces the open state to the given one.\n   */\n  private _handleUserInitiatedToggle(force: boolean = !this._open) {\n    this._open = force;\n    if (this._open) {\n      this._assistiveStatusText = this.selectingItemsAssistiveText;\n    } else {\n      const {\n        selectedItemAssistiveText,\n        triggerContent,\n        _assistiveStatusText: assistiveStatusText,\n        _selectedItemContent: selectedItemContent,\n      } = this;\n      const selectedItemText =\n        (selectedItemContent && selectedItemContent.textContent) ||\n        triggerContent;\n      if (\n        selectedItemText &&\n        assistiveStatusText !== selectedItemAssistiveText\n      ) {\n        this._assistiveStatusText = selectedItemText;\n      }\n    }\n    this.requestUpdate();\n  }\n\n  /**\n   * Clears the selection of tabs.\n   */\n  private _clearHighlight() {\n    forEach(\n      this.querySelectorAll((this.constructor as typeof BXTabs).selectorItem),\n      (item) => {\n        (item as BXTab).highlighted = false;\n      }\n    );\n  }\n\n  /**\n   * Navigates through tabs.\n   *\n   * @param direction `-1` to navigate backward, `1` to navigate forward.\n   * @param [options] The options.\n   * @param [options.immediate]\n   *   `true` to make it \"immediate selection change\" mode, which does:\n   *\n   *   Starts with the selected item\n   *   Going prev/next item immediately changes the selection\n   */\n  protected _navigate(\n    direction: number,\n    { immediate }: { immediate?: boolean } = {}\n  ) {\n    const { selectorItem, selectorItemHighlighted, selectorItemSelected } = this\n      .constructor as typeof BXTabs;\n    const nextItem = this._getNextItem(\n      this.querySelector(\n        immediate ? selectorItemSelected : selectorItemHighlighted\n      ) as BXTab,\n      direction\n    );\n    if (!nextItem) {\n      return;\n    }\n\n    if (immediate) {\n      this._handleUserInitiatedSelectItem(nextItem as BXTab);\n    } else {\n      forEach(this.querySelectorAll(selectorItem), (item) => {\n        (item as BXTab)[immediate ? 'selected' : 'highlighted'] =\n          nextItem === item;\n      });\n    }\n\n    // Using `{ block: 'nearest' }` to prevent scrolling unless scrolling is absolutely necessary.\n    // `scrollIntoViewOptions` seems to work in latest Safari despite of MDN/caniuse table.\n    // IE falls back to the old behavior.\n    nextItem.scrollIntoView({ block: 'nearest' });\n\n    const nextItemText = nextItem.textContent;\n    if (nextItemText) {\n      this._assistiveStatusText = nextItemText;\n    }\n    this._currentIndex += direction;\n    this.requestUpdate();\n  }\n\n  @HostListener('click')\n  protected _handleClick(event: MouseEvent) {\n    const { target } = event;\n    if (this === target) {\n      this._handleUserInitiatedToggle();\n    } else if ((target as BXTab).value === this.value) {\n      // Clicking on selected item, simply closes the narrow mode dropdown\n      this._handleUserInitiatedToggle(false);\n    } else {\n      // Trying to select the item\n      // If the custom event of the selection is canceled, we don't close the narrow mode dropdown\n      super._handleClick(event);\n    }\n  }\n\n  @HostListener('keydown')\n  protected _handleKeydown(event: KeyboardEvent) {\n    const { _open: open, _triggerNode: triggerNode } = this;\n    const { key, target } = event;\n    const narrowMode = Boolean(triggerNode.offsetParent);\n    const action = (this.constructor as typeof BXTabs).getAction(key, {\n      narrowMode,\n    });\n    if (!open && narrowMode) {\n      // Menu closed in narrow mode\n      switch (action) {\n        case TABS_KEYBOARD_ACTION.NAVIGATING:\n          this._handleUserInitiatedToggle(true);\n          // If this menu gets open with an arrow key, resets the highlight\n          this._clearHighlight();\n          break;\n        case TABS_KEYBOARD_ACTION.TRIGGERING:\n          this._handleUserInitiatedToggle(true);\n          break;\n        default:\n          break;\n      }\n    } else {\n      switch (action) {\n        case TABS_KEYBOARD_ACTION.CLOSING:\n          this._handleUserInitiatedToggle(false);\n          break;\n        case TABS_KEYBOARD_ACTION.SELECTING:\n          this._handleUserInitiatedSelectItem(target as BXTab);\n          break;\n        case TABS_KEYBOARD_ACTION.HOME:\n          this._navigate(this._currentIndex + this._totalTabs, {\n            immediate: !narrowMode,\n          });\n          break;\n        case TABS_KEYBOARD_ACTION.END:\n          this._navigate(-this._currentIndex, { immediate: !narrowMode });\n          break;\n        case TABS_KEYBOARD_ACTION.NAVIGATING:\n          {\n            const direction = narrowMode\n              ? NAVIGATION_DIRECTION_NARROW[key]\n              : NAVIGATION_DIRECTION[key];\n            if (direction) {\n              this._navigate(direction, { immediate: !narrowMode });\n            }\n          }\n          break;\n        case TABS_KEYBOARD_ACTION.TRIGGERING:\n          {\n            const { selectorItemHighlighted } = this\n              .constructor as typeof BXTabs;\n            const highlightedItem = this.querySelector(\n              selectorItemHighlighted\n            ) as BXTab;\n            if (highlightedItem) {\n              if (highlightedItem.value === this.value) {\n                // Selecting an already-selected item, simply closes the narrow mode dropdown\n                this._handleUserInitiatedToggle(false);\n              } else {\n                // Trying to select the item\n                // If the custom event of the selection is canceled, we don't close the narrow mode dropdown\n                this._handleUserInitiatedSelectItem(highlightedItem);\n              }\n            } else {\n              this._handleUserInitiatedToggle();\n            }\n          }\n          break;\n        default:\n          break;\n      }\n    }\n  }\n\n  protected _selectionDidChange(itemToSelect: BXTab) {\n    super._selectionDidChange(itemToSelect);\n    this._assistiveStatusText = this.selectedItemAssistiveText;\n    this._handleUserInitiatedToggle(false);\n  }\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TABS_COLOR_SCHEME.REGULAR;\n\n  /**\n   * An assistive text for screen reader to announce, telling the open state.\n   */\n  @property({ attribute: 'selecting-items-assistive-text' })\n  selectingItemsAssistiveText =\n    'Selecting items. Use up and down arrow keys to navigate.';\n\n  /**\n   * An assistive text for screen reader to announce, telling that an item is selected.\n   */\n  @property({ attribute: 'selected-item-assistive-text' })\n  selectedItemAssistiveText = 'Selected an item.';\n\n  /**\n   * The content of the trigger button for narrow mode.\n   */\n  @property({ attribute: 'trigger-content' })\n  triggerContent = '';\n\n  /**\n   * Tabs type.\n   */\n  @property({ reflect: true })\n  type = TABS_TYPE.REGULAR;\n\n  shouldUpdate(changedProperties) {\n    super.shouldUpdate(changedProperties);\n    const { selectorItem } = this.constructor as typeof BXTabs;\n    if (changedProperties.has('type')) {\n      forEach(this.querySelectorAll(selectorItem), (elem) => {\n        this._totalTabs++;\n        (elem as BXTab).type = this.type;\n      });\n    }\n    if (changedProperties.has('value')) {\n      const item = find(\n        this.querySelectorAll(selectorItem),\n        (elem) => (elem as BXTab).value === this.value\n      );\n      if (item) {\n        const range = this.ownerDocument!.createRange();\n        range.selectNodeContents(item);\n        this._selectedItemContent = range.cloneContents();\n      } else {\n        this._selectedItemContent = null;\n      }\n    }\n    return true;\n  }\n\n  render() {\n    const {\n      triggerContent,\n      _assistiveStatusText: assistiveStatusText,\n      _open: open,\n      _selectedItemContent: selectedItemContent,\n    } = this;\n    const triggerClasses = classMap({\n      [`${prefix}--tabs-trigger`]: true,\n      [`${prefix}--tabs-trigger--open`]: open,\n    });\n    const listClasses = classMap({\n      [`${prefix}--tabs__nav`]: true,\n      [`${prefix}--tabs__nav--hidden`]: !open,\n    });\n    return html`\n      <div\n        id=\"trigger\"\n        role=\"button\"\n        class=\"${triggerClasses}\"\n        aria-labelledby=\"trigger-label\"\n        aria-expanded=\"${String(open)}\"\n        aria-haspopup=\"listbox\"\n        aria-owns=\"tablist\"\n        aria-controls=\"tablist\">\n        <span id=\"trigger-label\" class=\"${prefix}--tabs-trigger-text\">\n          ${selectedItemContent || triggerContent}\n        </span>\n        ${ChevronDown16({ 'aria-hidden': 'true' })}\n      </div>\n      <ul id=\"tablist\" role=\"tablist\" class=\"${listClasses}\">\n        <slot></slot>\n      </ul>\n      <div\n        class=\"${prefix}--assistive-text\"\n        role=\"status\"\n        aria-live=\"assertive\"\n        aria-relevant=\"additions text\">\n        ${assistiveStatusText}\n      </div>\n    `;\n  }\n\n  /**\n   * Symbols of keys that triggers opening/closing menu and selecting/deselecting menu item.\n   */\n  static TRIGGER_KEYS = new Set([' ', 'Enter']);\n\n  /**\n   * A selector that will return tabs.\n   */\n  static get selectorItem() {\n    return `${prefix}-tab`;\n  }\n\n  /**\n   * A selector that will return enabled tabs.\n   */\n  static get selectorItemEnabled() {\n    return `${prefix}-tab:not([disabled])`;\n  }\n\n  /**\n   * A selector that will return highlighted tabs.\n   */\n  static get selectorItemHighlighted() {\n    return `${prefix}-tab[highlighted]`;\n  }\n\n  /**\n   * A selector that will return selected tabs.\n   */\n  static get selectorItemSelected() {\n    return `${prefix}-tab[selected]`;\n  }\n\n  /**\n   * The name of the custom event fired before a tab is selected upon a user gesture.\n   * Cancellation of this event stops changing the user-initiated selection.\n   */\n  static get eventBeforeSelect() {\n    return `${prefix}-tabs-beingselected`;\n  }\n\n  /**\n   * The name of the custom event fired after a a tab is selected upon a user gesture.\n   */\n  static get eventSelect() {\n    return `${prefix}-tabs-selected`;\n  }\n\n  static styles = styles;\n\n  /**\n   * @param key The key symbol.\n   * @param [options] The options.\n   * @param [options.narrowMode] `true` to get the action for narrow mode.\n   * @returns A action for dropdown for the given key symbol.\n   */\n  static getAction(key: string, { narrowMode }: { narrowMode?: boolean }) {\n    if (key === 'Escape') {\n      return TABS_KEYBOARD_ACTION.CLOSING;\n    }\n    if (key === 'Enter') {\n      return TABS_KEYBOARD_ACTION.SELECTING;\n    }\n    if (key === 'Home') {\n      return TABS_KEYBOARD_ACTION.HOME;\n    }\n    if (key === 'End') {\n      return TABS_KEYBOARD_ACTION.END;\n    }\n    if (\n      key in (narrowMode ? NAVIGATION_DIRECTION_NARROW : NAVIGATION_DIRECTION)\n    ) {\n      return TABS_KEYBOARD_ACTION.NAVIGATING;\n    }\n    if (narrowMode && this.TRIGGER_KEYS.has(key)) {\n      return TABS_KEYBOARD_ACTION.TRIGGERING;\n    }\n    return TABS_KEYBOARD_ACTION.NONE;\n  }\n}\n\nexport default BXTabs;\n"],"mappings":"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"}

package/es/components/tag/filter-tag.js

@@ -151,7 +151,12 @@ let BXFilterTag = _decorate([customElement(`${prefix}-filter-tag`)], function (_
         const {
           disabled
         } = this;
-        return html(_t || (_t = _` <slot></slot> <button class="${0}--tag__close-icon" ?disabled="${0}"> ${0} </button> `), prefix, disabled, Close16({
+        return html(_t || (_t = _`
+      <slot></slot>
+      <button class="${0}--tag__close-icon" ?disabled=${0}>
+        ${0}
+      </button>
+    `), prefix, disabled, Close16({
           'aria-label': this.title
         }));
       }

package/es/components/tag/filter-tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"filter-tag.js","names":["html","property","query","LitElement","settings","Close16","FocusMixin","HostListener","HostListenerMixin","TAG_SIZE","TAG_TYPE","styles","carbonElement","customElement","prefix","BXFilterTag","_decorate","_initialize","_HostListenerMixin","constructor","args","F","d","kind","decorators","key","value","event","composedPath","indexOf","_buttonNode","disabled","stopPropagation","open","init","bubbles","cancelable","composed","detail","triggeredBy","target","dispatchEvent","CustomEvent","eventBeforeClose","eventClose","type","String","reflect","Boolean","REGULAR","RED","render","_t","_","title","static","default"],"sources":["components/tag/filter-tag.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, property, query, LitElement } from 'lit-element';\nimport settings from 'carbon-components/es/globals/js/settings';\nimport Close16 from '@carbon/icons/lib/close/16';\nimport FocusMixin from '../../globals/mixins/focus';\nimport HostListener from '../../globals/decorators/host-listener';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport { TAG_SIZE, TAG_TYPE } from './defs';\nimport styles from './tag.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport { TAG_SIZE, TAG_TYPE };\n\nconst { prefix } = settings;\n\n/**\n * Filter tag.\n *\n * @element bx-filter-tag\n */\n@customElement(`${prefix}-filter-tag`)\nexport default class BXFilterTag extends HostListenerMixin(\n  FocusMixin(LitElement)\n) {\n  @query('button')\n  protected _buttonNode!: HTMLButtonElement;\n\n  /**\n   * Handles `click` event on this element.\n   *\n   * @param event The event.\n   */\n  @HostListener('shadowRoot:click')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleClick = (event: MouseEvent) => {\n    if (event.composedPath().indexOf(this._buttonNode!) >= 0) {\n      if (this.disabled) {\n        event.stopPropagation();\n      } else if (this.open) {\n        const init = {\n          bubbles: true,\n          cancelable: true,\n          composed: true,\n          detail: {\n            triggeredBy: event.target,\n          },\n        };\n        if (\n          this.dispatchEvent(\n            new CustomEvent(\n              (this.constructor as typeof BXFilterTag).eventBeforeClose,\n              init\n            )\n          )\n        ) {\n          this.open = false;\n          this.dispatchEvent(\n            new CustomEvent(\n              (this.constructor as typeof BXFilterTag).eventClose,\n              init\n            )\n          );\n        }\n      }\n    }\n  };\n\n  /**\n   * Text to show on filter tag \"clear\" buttons. Corresponds to the attribute with the same name\n   */\n  @property({ type: String, reflect: true })\n  title = 'Clear filter';\n\n  /**\n   * `true` if the tag should be disabled\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * `true` if the tag should be open.\n   */\n  @property({ type: Boolean, reflect: true })\n  open = true;\n\n  /**\n   * The size of the tag.\n   */\n  @property({ reflect: true })\n  size = TAG_SIZE.REGULAR;\n\n  /**\n   * The type of the tag.\n   */\n  @property({ reflect: true })\n  type = TAG_TYPE.RED;\n\n  render() {\n    const { disabled } = this;\n    return html`\n      <slot></slot>\n      <button class=\"${prefix}--tag__close-icon\" ?disabled=${disabled}>\n        ${Close16({ 'aria-label': this.title })}\n      </button>\n    `;\n  }\n\n  /**\n   * The name of the custom event fired before this tag is being closed upon a user gesture.\n   * Cancellation of this event stops the user-initiated action of closing this tag.\n   */\n  static get eventBeforeClose() {\n    return `${prefix}-filter-tag-beingclosed`;\n  }\n\n  /**\n   * The name of the custom event fired after this tag is closed upon a user gesture.\n   */\n  static get eventClose() {\n    return `${prefix}-filter-tag-closed`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n"],"mappings":"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"}
+{"version":3,"file":"filter-tag.js","names":["html","property","query","LitElement","settings","Close16","FocusMixin","HostListener","HostListenerMixin","TAG_SIZE","TAG_TYPE","styles","carbonElement","customElement","prefix","BXFilterTag","_decorate","_initialize","_HostListenerMixin","constructor","args","F","d","kind","decorators","key","value","event","composedPath","indexOf","_buttonNode","disabled","stopPropagation","open","init","bubbles","cancelable","composed","detail","triggeredBy","target","dispatchEvent","CustomEvent","eventBeforeClose","eventClose","type","String","reflect","Boolean","REGULAR","RED","render","_t","_","title","static","default"],"sources":["components/tag/filter-tag.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, property, query, LitElement } from 'lit-element';\nimport settings from 'carbon-components/es/globals/js/settings';\nimport Close16 from '@carbon/icons/lib/close/16';\nimport FocusMixin from '../../globals/mixins/focus';\nimport HostListener from '../../globals/decorators/host-listener';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport { TAG_SIZE, TAG_TYPE } from './defs';\nimport styles from './tag.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport { TAG_SIZE, TAG_TYPE };\n\nconst { prefix } = settings;\n\n/**\n * Filter tag.\n *\n * @element bx-filter-tag\n */\n@customElement(`${prefix}-filter-tag`)\nexport default class BXFilterTag extends HostListenerMixin(\n  FocusMixin(LitElement)\n) {\n  @query('button')\n  protected _buttonNode!: HTMLButtonElement;\n\n  /**\n   * Handles `click` event on this element.\n   *\n   * @param event The event.\n   */\n  @HostListener('shadowRoot:click')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleClick = (event: MouseEvent) => {\n    if (event.composedPath().indexOf(this._buttonNode!) >= 0) {\n      if (this.disabled) {\n        event.stopPropagation();\n      } else if (this.open) {\n        const init = {\n          bubbles: true,\n          cancelable: true,\n          composed: true,\n          detail: {\n            triggeredBy: event.target,\n          },\n        };\n        if (\n          this.dispatchEvent(\n            new CustomEvent(\n              (this.constructor as typeof BXFilterTag).eventBeforeClose,\n              init\n            )\n          )\n        ) {\n          this.open = false;\n          this.dispatchEvent(\n            new CustomEvent(\n              (this.constructor as typeof BXFilterTag).eventClose,\n              init\n            )\n          );\n        }\n      }\n    }\n  };\n\n  /**\n   * Text to show on filter tag \"clear\" buttons. Corresponds to the attribute with the same name\n   */\n  @property({ type: String, reflect: true })\n  title = 'Clear filter';\n\n  /**\n   * `true` if the tag should be disabled\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * `true` if the tag should be open.\n   */\n  @property({ type: Boolean, reflect: true })\n  open = true;\n\n  /**\n   * The size of the tag.\n   */\n  @property({ reflect: true })\n  size = TAG_SIZE.REGULAR;\n\n  /**\n   * The type of the tag.\n   */\n  @property({ reflect: true })\n  type = TAG_TYPE.RED;\n\n  render() {\n    const { disabled } = this;\n    return html`\n      <slot></slot>\n      <button class=\"${prefix}--tag__close-icon\" ?disabled=${disabled}>\n        ${Close16({ 'aria-label': this.title })}\n      </button>\n    `;\n  }\n\n  /**\n   * The name of the custom event fired before this tag is being closed upon a user gesture.\n   * Cancellation of this event stops the user-initiated action of closing this tag.\n   */\n  static get eventBeforeClose() {\n    return `${prefix}-filter-tag-beingclosed`;\n  }\n\n  /**\n   * The name of the custom event fired after this tag is closed upon a user gesture.\n   */\n  static get eventClose() {\n    return `${prefix}-filter-tag-closed`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n"],"mappings":"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"}

package/es/components/tag/tag.css.js

@@ -8,5 +8,5 @@
  */
 import { css } from 'lit-element';
 export default css([
-  "a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{padding:0;border:0;margin:0;font:inherit;font-size:100%;vertical-align:baseline}button,input,select,textarea{border-radius:0;font-family:inherit}input[type=text]::-ms-clear{display:none}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section{display:block}body{line-height:1}sup{vertical-align:super}sub{vertical-align:sub}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote::after,blockquote::before,q::after,q::before{content:\"\"}table{border-collapse:collapse;border-spacing:0}*{box-sizing:border-box}button{margin:0}html{font-size:100%}body{font-weight:400;font-family:'IBM Plex Sans','Helvetica Neue',Arial,sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}code{font-family:'IBM Plex Mono',Menlo,'DejaVu Sans Mono','Bitstream Vera Sans Mono',Courier,monospace}strong{font-weight:600}@media screen and (-ms-high-contrast:active){svg{fill:ButtonText}}h1{font-size:var(--cds-productive-heading-06-font-size,2.625rem);font-weight:var(--cds-productive-heading-06-font-weight,300);line-height:var(--cds-productive-heading-06-line-height,1.199);letter-spacing:var(--cds-productive-heading-06-letter-spacing,0)}h2{font-size:var(--cds-productive-heading-05-font-size,2rem);font-weight:var(--cds-productive-heading-05-font-weight,300);line-height:var(--cds-productive-heading-05-line-height,1.25);letter-spacing:var(--cds-productive-heading-05-letter-spacing,0)}h3{font-size:var(--cds-productive-heading-04-font-size,1.75rem);font-weight:var(--cds-productive-heading-04-font-weight,400);line-height:var(--cds-productive-heading-04-line-height,1.28572);letter-spacing:var(--cds-productive-heading-04-letter-spacing,0)}h4{font-size:var(--cds-productive-heading-03-font-size,1.25rem);font-weight:var(--cds-productive-heading-03-font-weight,400);line-height:var(--cds-productive-heading-03-line-height,1.4);letter-spacing:var(--cds-productive-heading-03-letter-spacing,0)}h5{font-size:var(--cds-productive-heading-02-font-size,1rem);font-weight:var(--cds-productive-heading-02-font-weight,600);line-height:var(--cds-productive-heading-02-line-height,1.375);letter-spacing:var(--cds-productive-heading-02-letter-spacing,0)}h6{font-size:var(--cds-productive-heading-01-font-size,.875rem);font-weight:var(--cds-productive-heading-01-font-weight,600);line-height:var(--cds-productive-heading-01-line-height,1.28572);letter-spacing:var(--cds-productive-heading-01-letter-spacing,.16px)}p{font-size:var(--cds-body-long-02-font-size,1rem);font-weight:var(--cds-body-long-02-font-weight,400);line-height:var(--cds-body-long-02-line-height,1.5);letter-spacing:var(--cds-body-long-02-letter-spacing,0)}a{color:#0f62fe}em{font-style:italic}@keyframes skeleton{0%{opacity:.3;transform:scaleX(0);transform-origin:left}20%{opacity:1;transform:scaleX(1);transform-origin:left}28%{transform:scaleX(1);transform-origin:right}51%{transform:scaleX(0);transform-origin:right}58%{transform:scaleX(0);transform-origin:right}82%{transform:scaleX(1);transform-origin:right}83%{transform:scaleX(1);transform-origin:left}96%{transform:scaleX(0);transform-origin:left}100%{opacity:.3;transform:scaleX(0);transform-origin:left}}.bx--tag,:host(bx-filter-tag),:host(bx-tag){box-sizing:border-box;padding:0;border:0;margin:0;font-family:inherit;font-size:100%;vertical-align:baseline;display:inline-block;padding:0;border:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;cursor:pointer;font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);line-height:var(--cds-label-01-line-height,1.33333);letter-spacing:var(--cds-label-01-letter-spacing,.32px);background-color:var(--cds-tag-background-gray,#e0e0e0);color:var(--cds-tag-color-gray,#393939);display:inline-flex;min-width:2rem;max-width:100%;min-height:1.5rem;align-items:center;justify-content:center;padding:.25rem .5rem;margin:.25rem;border-radius:.9375rem;cursor:default;vertical-align:middle;word-break:break-word}.bx--tag *,.bx--tag ::after,.bx--tag ::before,:host(bx-filter-tag) *,:host(bx-filter-tag) ::after,:host(bx-filter-tag) ::before,:host(bx-tag) *,:host(bx-tag) ::after,:host(bx-tag) ::before{box-sizing:inherit}.bx--tag::-moz-focus-inner{border:0}.bx--tag .bx--tag__close-icon:hover,.bx--tag.bx--tag--interactive:hover,:host(bx-filter-tag) .bx--tag__close-icon:hover,:host(bx-tag) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-gray,#c6c6c6)}.bx--tag:not(:first-child),:not(:first-child):host(bx-filter-tag),:not(:first-child):host(bx-tag){margin-left:0}.bx--tag--red,:host(bx-filter-tag[type=red]),:host(bx-tag[type=red]){background-color:var(--cds-tag-background-red,#ffd7d9);color:var(--cds-tag-color-red,#750e13)}.bx--tag--red .bx--tag__close-icon:hover,.bx--tag--red.bx--tag--interactive:hover,:host(bx-filter-tag[type=red]) .bx--tag__close-icon:hover,:host(bx-tag[type=red]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-red,#ffb3b8)}.bx--tag--magenta,:host(bx-filter-tag[type=magenta]),:host(bx-tag[type=magenta]){background-color:var(--cds-tag-background-magenta,#ffd6e8);color:var(--cds-tag-color-magenta,#740937)}.bx--tag--magenta .bx--tag__close-icon:hover,.bx--tag--magenta.bx--tag--interactive:hover,:host(bx-filter-tag[type=magenta]) .bx--tag__close-icon:hover,:host(bx-tag[type=magenta]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-magenta,#ffafd2)}.bx--tag--purple,:host(bx-filter-tag[type=purple]),:host(bx-tag[type=purple]){background-color:var(--cds-tag-background-purple,#e8daff);color:var(--cds-tag-color-purple,#491d8b)}.bx--tag--purple .bx--tag__close-icon:hover,.bx--tag--purple.bx--tag--interactive:hover,:host(bx-filter-tag[type=purple]) .bx--tag__close-icon:hover,:host(bx-tag[type=purple]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-purple,#d4bbff)}.bx--tag--blue,:host(bx-filter-tag[type=blue]),:host(bx-tag[type=blue]){background-color:var(--cds-tag-background-blue,#d0e2ff);color:var(--cds-tag-color-blue,#002d9c)}.bx--tag--blue .bx--tag__close-icon:hover,.bx--tag--blue.bx--tag--interactive:hover,:host(bx-filter-tag[type=blue]) .bx--tag__close-icon:hover,:host(bx-tag[type=blue]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-blue,#a6c8ff)}.bx--tag--cyan,:host(bx-filter-tag[type=cyan]),:host(bx-tag[type=cyan]){background-color:var(--cds-tag-background-cyan,#bae6ff);color:var(--cds-tag-color-cyan,#003a6d)}.bx--tag--cyan .bx--tag__close-icon:hover,.bx--tag--cyan.bx--tag--interactive:hover,:host(bx-filter-tag[type=cyan]) .bx--tag__close-icon:hover,:host(bx-tag[type=cyan]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-cyan,#82cfff)}.bx--tag--teal,:host(bx-filter-tag[type=teal]),:host(bx-tag[type=teal]){background-color:var(--cds-tag-background-teal,#9ef0f0);color:var(--cds-tag-color-teal,#004144)}.bx--tag--teal .bx--tag__close-icon:hover,.bx--tag--teal.bx--tag--interactive:hover,:host(bx-filter-tag[type=teal]) .bx--tag__close-icon:hover,:host(bx-tag[type=teal]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-teal,#3ddbd9)}.bx--tag--green,:host(bx-filter-tag[type=green]),:host(bx-tag[type=green]){background-color:var(--cds-tag-background-green,#a7f0ba);color:var(--cds-tag-color-green,#044317)}.bx--tag--green .bx--tag__close-icon:hover,.bx--tag--green.bx--tag--interactive:hover,:host(bx-filter-tag[type=green]) .bx--tag__close-icon:hover,:host(bx-tag[type=green]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-green,#6fdc8c)}.bx--tag--gray,:host(bx-filter-tag[type=gray]),:host(bx-tag[type=gray]){background-color:var(--cds-tag-background-gray,#e0e0e0);color:var(--cds-tag-color-gray,#393939)}.bx--tag--gray .bx--tag__close-icon:hover,.bx--tag--gray.bx--tag--interactive:hover,:host(bx-filter-tag[type=gray]) .bx--tag__close-icon:hover,:host(bx-tag[type=gray]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-gray,#c6c6c6)}.bx--tag--cool-gray,:host(bx-filter-tag[type=cool-gray]),:host(bx-tag[type=cool-gray]){background-color:var(--cds-tag-background-cool-gray,#dde1e6);color:var(--cds-tag-color-cool-gray,#343a3f)}.bx--tag--cool-gray .bx--tag__close-icon:hover,.bx--tag--cool-gray.bx--tag--interactive:hover,:host(bx-filter-tag[type=cool-gray]) .bx--tag__close-icon:hover,:host(bx-tag[type=cool-gray]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-cool-gray,#c1c7cd)}.bx--tag--warm-gray,:host(bx-filter-tag[type=warm-gray]),:host(bx-tag[type=warm-gray]){background-color:var(--cds-tag-background-warm-gray,#e5e0df);color:var(--cds-tag-color-warm-gray,#3c3838)}.bx--tag--warm-gray .bx--tag__close-icon:hover,.bx--tag--warm-gray.bx--tag--interactive:hover,:host(bx-filter-tag[type=warm-gray]) .bx--tag__close-icon:hover,:host(bx-tag[type=warm-gray]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-warm-gray,#cac5c4)}.bx--tag--high-contrast{background-color:var(--cds-inverse-02,#393939);color:var(--cds-inverse-01,#fff)}.bx--tag--high-contrast .bx--tag__close-icon:hover,.bx--tag--high-contrast.bx--tag--interactive:hover{background-color:var(--cds-inverse-hover-ui,#4c4c4c)}.bx--tag--outline{background-color:var(--cds-background,#fff);color:var(--cds-text-01,#161616);box-shadow:inset 0 0 0 1px var(--cds-inverse-02,#393939)}.bx--tag--outline .bx--tag__close-icon:hover,.bx--tag--outline.bx--tag--interactive:hover{background-color:var(--cds-hover-ui,#e5e5e5)}.bx--tag--disabled,.bx--tag--filter.bx--tag--disabled,.bx--tag--interactive.bx--tag--disabled,:host(bx-filter-tag[disabled]),:host(bx-tag[disabled]){background-color:var(--cds-disabled-01,#f4f4f4);color:var(--cds-disabled-02,#c6c6c6)}.bx--tag--disabled .bx--tag__close-icon:hover,.bx--tag--disabled.bx--tag--interactive:hover,.bx--tag--filter.bx--tag--disabled .bx--tag__close-icon:hover,.bx--tag--filter.bx--tag--disabled.bx--tag--interactive:hover,.bx--tag--interactive.bx--tag--disabled .bx--tag__close-icon:hover,.bx--tag--interactive.bx--tag--disabled.bx--tag--interactive:hover,:host(bx-filter-tag[disabled]) .bx--tag__close-icon:hover,:host(bx-tag[disabled]) .bx--tag__close-icon:hover{background-color:var(--cds-disabled-01,#f4f4f4)}.bx--tag--disabled:hover,.bx--tag--filter.bx--tag--disabled:hover,.bx--tag--interactive.bx--tag--disabled:hover{cursor:not-allowed}.bx--tag__label{overflow:hidden;max-width:100%;text-overflow:ellipsis;white-space:nowrap}.bx--tag--interactive:focus{box-shadow:inset 0 0 0 1px var(--cds-focus,#0f62fe);outline:0}.bx--tag--interactive:hover{cursor:pointer}.bx--tag--filter,:host(bx-filter-tag){padding-top:0;padding-right:0;padding-bottom:0;cursor:pointer}.bx--tag--filter:hover{outline:0}.bx--tag--interactive{transition:background-color 70ms cubic-bezier(0,0,.38,.9)}.bx--tag__close-icon{display:flex;width:1.5rem;height:1.5rem;flex-shrink:0;align-items:center;justify-content:center;padding:0;border:0;margin:0 0 0 .125rem;background-color:transparent;border-radius:50%;color:currentColor;cursor:pointer;transition:background-color 70ms cubic-bezier(.2,0,.38,.9),box-shadow 70ms cubic-bezier(.2,0,.38,.9)}.bx--tag__close-icon svg{fill:currentColor}.bx--tag__custom-icon{width:1rem;height:1rem;flex-shrink:0;padding:0;border:0;margin-right:var(--cds-spacing-02,.25rem);background-color:transparent;color:currentColor;outline:0}.bx--tag__custom-icon svg{fill:currentColor}.bx--tag--disabled .bx--tag__close-icon,:host(bx-filter-tag[disabled]) .bx--tag__close-icon,:host(bx-tag[disabled]) .bx--tag__close-icon{cursor:not-allowed}.bx--tag__close-icon:focus{border-radius:50%;box-shadow:inset 0 0 0 1px var(--cds-focus,#0f62fe);outline:0}.bx--tag--high-contrast .bx--tag__close-icon:focus{box-shadow:inset 0 0 0 1px var(--cds-inverse-focus-ui,#fff)}.bx--tag--filter.bx--tag--disabled .bx--tag__close-icon:hover{background-color:transparent}.bx--tag--filter.bx--tag--disabled svg{fill:var(--cds-disabled-02,#c6c6c6)}.bx--tag--sm,:host(bx-filter-tag[size=sm]),:host(bx-tag[size=sm]){min-height:1.125rem;padding:0 .5rem}.bx--tag--sm.bx--tag--filter{padding-right:0}.bx--tag--sm .bx--tag__close-icon,:host(bx-filter-tag[size=sm]) .bx--tag__close-icon,:host(bx-tag[size=sm]) .bx--tag__close-icon{width:1.125rem;height:1.125rem;margin-left:.3125rem}.bx--tag.bx--skeleton{position:relative;padding:0;border:none;background:var(--cds-skeleton-01,#e5e5e5);box-shadow:none;pointer-events:none;background-color:var(--cds-skeleton-01,#e5e5e5);color:var(--cds-text-01,#161616);overflow:hidden;width:3.75rem}.bx--tag.bx--skeleton:active,.bx--tag.bx--skeleton:focus,.bx--tag.bx--skeleton:hover{border:none;cursor:default;outline:0}.bx--tag.bx--skeleton::before{position:absolute;top:0;left:0;width:100%;height:100%;animation:3s ease-in-out skeleton infinite;background:var(--cds-skeleton-02,#c6c6c6);content:\"\";will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){.bx--tag.bx--skeleton::before{animation:none}}.bx--tag.bx--skeleton .bx--tag__close-icon:hover,.bx--tag.bx--skeleton.bx--tag--interactive:hover{background-color:var(--cds-skeleton-01,#e5e5e5)}@media not all and (min-resolution:0.001dpcm){@supports (-webkit-appearance:none) and (stroke-color:transparent){.bx--tag.bx--skeleton{transform:translateZ(0)}}}@media screen and (-ms-high-contrast:active),(forced-colors:active){.bx--tag,:host(bx-filter-tag),:host(bx-tag){outline:1px solid transparent}}@media screen and (-ms-high-contrast:active),(forced-colors:active){.bx--tag__close-icon svg,.bx--tag__custom-icon svg{fill:ButtonText}}@media screen and (-ms-high-contrast:active),(forced-colors:active){.bx--tag__close-icon:focus{color:Highlight;outline:1px solid Highlight}}:host(bx-filter-tag){display:none}:host(bx-filter-tag)[open]{display:inline-flex}:host(bx-filter-tag[disabled]) .bx--tag__close-icon{cursor:not-allowed}:host(bx-filter-tag[disabled]) .bx--tag__close-icon,:host(bx-filter-tag[disabled]) .bx--tag__close-icon:hover{background-color:transparent}:host(bx-filter-tag[size=sm]) .bx--tag__close-icon,:host(bx-tag[size=sm]) .bx--tag__close-icon{width:1.125rem;height:1.125rem;margin-left:.3125rem}:host(bx-filter-tag[size=sm]){padding-right:0}:host(bx-tag.bx--skeleton){position:relative;padding:0;border:none;background:var(--cds-skeleton-01,#e5e5e5);box-shadow:none;pointer-events:none;width:3.75rem;overflow:hidden}:host(bx-tag.bx--skeleton):active,:host(bx-tag.bx--skeleton):focus,:host(bx-tag.bx--skeleton):hover{border:none;cursor:default;outline:0}:host(bx-tag.bx--skeleton)::before{position:absolute;top:0;left:0;width:100%;height:100%;animation:3s ease-in-out skeleton infinite;background:var(--cds-skeleton-02,#c6c6c6);content:\"\";will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){:host(bx-tag.bx--skeleton)::before{animation:none}}",
+  "a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{padding:0;border:0;margin:0;font:inherit;font-size:100%;vertical-align:baseline}button,input,select,textarea{border-radius:0;font-family:inherit}input[type=text]::-ms-clear{display:none}article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section{display:block}body{line-height:1}sup{vertical-align:super}sub{vertical-align:sub}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote::after,blockquote::before,q::after,q::before{content:\"\"}table{border-collapse:collapse;border-spacing:0}*{box-sizing:border-box}button{margin:0}html{font-size:100%}body{font-weight:400;font-family:'IBM Plex Sans','Helvetica Neue',Arial,sans-serif;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}code{font-family:'IBM Plex Mono',Menlo,'DejaVu Sans Mono','Bitstream Vera Sans Mono',Courier,monospace}strong{font-weight:600}@media screen and (-ms-high-contrast:active){svg{fill:ButtonText}}h1{font-size:var(--cds-productive-heading-06-font-size,2.625rem);font-weight:var(--cds-productive-heading-06-font-weight,300);line-height:var(--cds-productive-heading-06-line-height,1.199);letter-spacing:var(--cds-productive-heading-06-letter-spacing,0)}h2{font-size:var(--cds-productive-heading-05-font-size,2rem);font-weight:var(--cds-productive-heading-05-font-weight,300);line-height:var(--cds-productive-heading-05-line-height,1.25);letter-spacing:var(--cds-productive-heading-05-letter-spacing,0)}h3{font-size:var(--cds-productive-heading-04-font-size,1.75rem);font-weight:var(--cds-productive-heading-04-font-weight,400);line-height:var(--cds-productive-heading-04-line-height,1.28572);letter-spacing:var(--cds-productive-heading-04-letter-spacing,0)}h4{font-size:var(--cds-productive-heading-03-font-size,1.25rem);font-weight:var(--cds-productive-heading-03-font-weight,400);line-height:var(--cds-productive-heading-03-line-height,1.4);letter-spacing:var(--cds-productive-heading-03-letter-spacing,0)}h5{font-size:var(--cds-productive-heading-02-font-size,1rem);font-weight:var(--cds-productive-heading-02-font-weight,600);line-height:var(--cds-productive-heading-02-line-height,1.375);letter-spacing:var(--cds-productive-heading-02-letter-spacing,0)}h6{font-size:var(--cds-productive-heading-01-font-size,.875rem);font-weight:var(--cds-productive-heading-01-font-weight,600);line-height:var(--cds-productive-heading-01-line-height,1.28572);letter-spacing:var(--cds-productive-heading-01-letter-spacing,.16px)}p{font-size:var(--cds-body-long-02-font-size,1rem);font-weight:var(--cds-body-long-02-font-weight,400);line-height:var(--cds-body-long-02-line-height,1.5);letter-spacing:var(--cds-body-long-02-letter-spacing,0)}a{color:#0f62fe}em{font-style:italic}@keyframes skeleton{0%{opacity:.3;transform:scaleX(0);transform-origin:left}20%{opacity:1;transform:scaleX(1);transform-origin:left}28%{transform:scaleX(1);transform-origin:right}51%{transform:scaleX(0);transform-origin:right}58%{transform:scaleX(0);transform-origin:right}82%{transform:scaleX(1);transform-origin:right}83%{transform:scaleX(1);transform-origin:left}96%{transform:scaleX(0);transform-origin:left}100%{opacity:.3;transform:scaleX(0);transform-origin:left}}.bx--tag,:host(bx-filter-tag),:host(bx-tag){box-sizing:border-box;padding:0;border:0;margin:0;font-family:inherit;font-size:100%;vertical-align:baseline;display:inline-block;padding:0;border:0;-webkit-appearance:none;-moz-appearance:none;appearance:none;background:0 0;cursor:pointer;font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);line-height:var(--cds-label-01-line-height,1.33333);letter-spacing:var(--cds-label-01-letter-spacing,.32px);background-color:var(--cds-tag-background-gray,#e0e0e0);color:var(--cds-tag-color-gray,#393939);display:inline-flex;min-width:2rem;max-width:100%;min-height:1.5rem;align-items:center;justify-content:center;padding:.25rem .5rem;margin:.25rem;border-radius:.9375rem;cursor:default;vertical-align:middle;word-break:break-word}.bx--tag *,.bx--tag ::after,.bx--tag ::before,:host(bx-filter-tag) *,:host(bx-filter-tag) ::after,:host(bx-filter-tag) ::before,:host(bx-tag) *,:host(bx-tag) ::after,:host(bx-tag) ::before{box-sizing:inherit}.bx--tag::-moz-focus-inner{border:0}.bx--tag .bx--tag__close-icon:hover,.bx--tag.bx--tag--interactive:hover,:host(bx-filter-tag) .bx--tag__close-icon:hover,:host(bx-tag) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-gray,#c6c6c6)}.bx--tag:not(:first-child),:not(:first-child):host(bx-filter-tag),:not(:first-child):host(bx-tag){margin-left:0}.bx--tag--red,:host(bx-filter-tag[type=red]),:host(bx-tag[type=red]){background-color:var(--cds-tag-background-red,#ffd7d9);color:var(--cds-tag-color-red,#750e13)}.bx--tag--red .bx--tag__close-icon:hover,.bx--tag--red.bx--tag--interactive:hover,:host(bx-filter-tag[type=red]) .bx--tag__close-icon:hover,:host(bx-tag[type=red]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-red,#ffb3b8)}.bx--tag--magenta,:host(bx-filter-tag[type=magenta]),:host(bx-tag[type=magenta]){background-color:var(--cds-tag-background-magenta,#ffd6e8);color:var(--cds-tag-color-magenta,#740937)}.bx--tag--magenta .bx--tag__close-icon:hover,.bx--tag--magenta.bx--tag--interactive:hover,:host(bx-filter-tag[type=magenta]) .bx--tag__close-icon:hover,:host(bx-tag[type=magenta]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-magenta,#ffafd2)}.bx--tag--purple,:host(bx-filter-tag[type=purple]),:host(bx-tag[type=purple]){background-color:var(--cds-tag-background-purple,#e8daff);color:var(--cds-tag-color-purple,#491d8b)}.bx--tag--purple .bx--tag__close-icon:hover,.bx--tag--purple.bx--tag--interactive:hover,:host(bx-filter-tag[type=purple]) .bx--tag__close-icon:hover,:host(bx-tag[type=purple]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-purple,#d4bbff)}.bx--tag--blue,:host(bx-filter-tag[type=blue]),:host(bx-tag[type=blue]){background-color:var(--cds-tag-background-blue,#d0e2ff);color:var(--cds-tag-color-blue,#002d9c)}.bx--tag--blue .bx--tag__close-icon:hover,.bx--tag--blue.bx--tag--interactive:hover,:host(bx-filter-tag[type=blue]) .bx--tag__close-icon:hover,:host(bx-tag[type=blue]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-blue,#a6c8ff)}.bx--tag--cyan,:host(bx-filter-tag[type=cyan]),:host(bx-tag[type=cyan]){background-color:var(--cds-tag-background-cyan,#bae6ff);color:var(--cds-tag-color-cyan,#003a6d)}.bx--tag--cyan .bx--tag__close-icon:hover,.bx--tag--cyan.bx--tag--interactive:hover,:host(bx-filter-tag[type=cyan]) .bx--tag__close-icon:hover,:host(bx-tag[type=cyan]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-cyan,#82cfff)}.bx--tag--teal,:host(bx-filter-tag[type=teal]),:host(bx-tag[type=teal]){background-color:var(--cds-tag-background-teal,#9ef0f0);color:var(--cds-tag-color-teal,#004144)}.bx--tag--teal .bx--tag__close-icon:hover,.bx--tag--teal.bx--tag--interactive:hover,:host(bx-filter-tag[type=teal]) .bx--tag__close-icon:hover,:host(bx-tag[type=teal]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-teal,#3ddbd9)}.bx--tag--green,:host(bx-filter-tag[type=green]),:host(bx-tag[type=green]){background-color:var(--cds-tag-background-green,#a7f0ba);color:var(--cds-tag-color-green,#044317)}.bx--tag--green .bx--tag__close-icon:hover,.bx--tag--green.bx--tag--interactive:hover,:host(bx-filter-tag[type=green]) .bx--tag__close-icon:hover,:host(bx-tag[type=green]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-green,#6fdc8c)}.bx--tag--gray,:host(bx-filter-tag[type=gray]),:host(bx-tag[type=gray]){background-color:var(--cds-tag-background-gray,#e0e0e0);color:var(--cds-tag-color-gray,#393939)}.bx--tag--gray .bx--tag__close-icon:hover,.bx--tag--gray.bx--tag--interactive:hover,:host(bx-filter-tag[type=gray]) .bx--tag__close-icon:hover,:host(bx-tag[type=gray]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-gray,#c6c6c6)}.bx--tag--cool-gray,:host(bx-filter-tag[type=cool-gray]),:host(bx-tag[type=cool-gray]){background-color:var(--cds-tag-background-cool-gray,#dde1e6);color:var(--cds-tag-color-cool-gray,#343a3f)}.bx--tag--cool-gray .bx--tag__close-icon:hover,.bx--tag--cool-gray.bx--tag--interactive:hover,:host(bx-filter-tag[type=cool-gray]) .bx--tag__close-icon:hover,:host(bx-tag[type=cool-gray]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-cool-gray,#c1c7cd)}.bx--tag--warm-gray,:host(bx-filter-tag[type=warm-gray]),:host(bx-tag[type=warm-gray]){background-color:var(--cds-tag-background-warm-gray,#e5e0df);color:var(--cds-tag-color-warm-gray,#3c3838)}.bx--tag--warm-gray .bx--tag__close-icon:hover,.bx--tag--warm-gray.bx--tag--interactive:hover,:host(bx-filter-tag[type=warm-gray]) .bx--tag__close-icon:hover,:host(bx-tag[type=warm-gray]) .bx--tag__close-icon:hover{background-color:var(--cds-tag-hover-warm-gray,#cac5c4)}.bx--tag--high-contrast{background-color:var(--cds-inverse-02,#393939);color:var(--cds-inverse-01,#fff)}.bx--tag--high-contrast .bx--tag__close-icon:hover,.bx--tag--high-contrast.bx--tag--interactive:hover{background-color:var(--cds-inverse-hover-ui,#4c4c4c)}.bx--tag--outline{background-color:var(--cds-background,#fff);color:var(--cds-text-01,#161616);box-shadow:inset 0 0 0 1px var(--cds-inverse-02,#393939)}.bx--tag--outline .bx--tag__close-icon:hover,.bx--tag--outline.bx--tag--interactive:hover{background-color:var(--cds-hover-ui,#e5e5e5)}.bx--tag--disabled,.bx--tag--filter.bx--tag--disabled,.bx--tag--interactive.bx--tag--disabled,:host(bx-filter-tag[disabled]),:host(bx-tag[disabled]){background-color:var(--cds-disabled-01,#f4f4f4);color:var(--cds-disabled-02,#c6c6c6)}.bx--tag--disabled .bx--tag__close-icon:hover,.bx--tag--disabled.bx--tag--interactive:hover,.bx--tag--filter.bx--tag--disabled .bx--tag__close-icon:hover,.bx--tag--filter.bx--tag--disabled.bx--tag--interactive:hover,.bx--tag--interactive.bx--tag--disabled .bx--tag__close-icon:hover,.bx--tag--interactive.bx--tag--disabled.bx--tag--interactive:hover,:host(bx-filter-tag[disabled]) .bx--tag__close-icon:hover,:host(bx-tag[disabled]) .bx--tag__close-icon:hover{background-color:var(--cds-disabled-01,#f4f4f4)}.bx--tag--disabled:hover,.bx--tag--filter.bx--tag--disabled:hover,.bx--tag--interactive.bx--tag--disabled:hover{cursor:not-allowed}.bx--tag__label{overflow:hidden;max-width:100%;text-overflow:ellipsis;white-space:nowrap}.bx--tag--interactive:focus{box-shadow:inset 0 0 0 1px var(--cds-focus,#0f62fe);outline:0}.bx--tag--interactive:hover{cursor:pointer}.bx--tag--filter,:host(bx-filter-tag){padding-top:0;padding-right:0;padding-bottom:0;cursor:pointer}.bx--tag--filter:hover{outline:0}.bx--tag--interactive{transition:background-color 70ms cubic-bezier(0,0,.38,.9)}.bx--tag__close-icon{display:flex;width:1.5rem;height:1.5rem;flex-shrink:0;align-items:center;justify-content:center;padding:0;border:0;margin:0 0 0 .125rem;background-color:transparent;border-radius:50%;color:currentColor;cursor:pointer;transition:background-color 70ms cubic-bezier(.2,0,.38,.9),box-shadow 70ms cubic-bezier(.2,0,.38,.9)}.bx--tag__close-icon svg{fill:currentColor}.bx--tag__custom-icon{width:1rem;height:1rem;flex-shrink:0;padding:0;border:0;margin-right:var(--cds-spacing-02,.25rem);background-color:transparent;color:currentColor;outline:0}.bx--tag__custom-icon svg{fill:currentColor}.bx--tag--disabled .bx--tag__close-icon,:host(bx-filter-tag[disabled]) .bx--tag__close-icon,:host(bx-tag[disabled]) .bx--tag__close-icon{cursor:not-allowed}.bx--tag__close-icon:focus{border-radius:50%;box-shadow:inset 0 0 0 1px var(--cds-focus,#0f62fe);outline:0}.bx--tag--high-contrast .bx--tag__close-icon:focus{box-shadow:inset 0 0 0 1px var(--cds-inverse-focus-ui,#fff)}.bx--tag--filter.bx--tag--disabled .bx--tag__close-icon:hover{background-color:transparent}.bx--tag--filter.bx--tag--disabled svg{fill:var(--cds-disabled-02,#c6c6c6)}.bx--tag--sm,:host(bx-filter-tag[size=sm]),:host(bx-tag[size=sm]){min-height:1.125rem;padding:0 .5rem}.bx--tag--sm.bx--tag--filter{padding-right:0}.bx--tag--sm .bx--tag__close-icon,:host(bx-filter-tag[size=sm]) .bx--tag__close-icon,:host(bx-tag[size=sm]) .bx--tag__close-icon{width:1.125rem;height:1.125rem;margin-left:.3125rem}.bx--tag.bx--skeleton{position:relative;padding:0;border:none;background:var(--cds-skeleton-01,#e5e5e5);box-shadow:none;pointer-events:none;background-color:var(--cds-skeleton-01,#e5e5e5);color:var(--cds-text-01,#161616);overflow:hidden;width:3.75rem}.bx--tag.bx--skeleton:active,.bx--tag.bx--skeleton:focus,.bx--tag.bx--skeleton:hover{border:none;cursor:default;outline:0}.bx--tag.bx--skeleton::before{position:absolute;top:0;left:0;width:100%;height:100%;animation:3s ease-in-out skeleton infinite;background:var(--cds-skeleton-02,#c6c6c6);content:\"\";will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){.bx--tag.bx--skeleton::before{animation:none}}.bx--tag.bx--skeleton .bx--tag__close-icon:hover,.bx--tag.bx--skeleton.bx--tag--interactive:hover{background-color:var(--cds-skeleton-01,#e5e5e5)}@media not all and (min-resolution:0.001dpcm){@supports (-webkit-appearance:none) and (stroke-color:transparent){.bx--tag.bx--skeleton{transform:translateZ(0)}}}@media screen and (-ms-high-contrast:active),(forced-colors:active){.bx--tag,:host(bx-filter-tag),:host(bx-tag){outline:1px solid transparent}}@media screen and (-ms-high-contrast:active),(forced-colors:active){.bx--tag__close-icon svg,.bx--tag__custom-icon svg{fill:ButtonText}}@media screen and (-ms-high-contrast:active),(forced-colors:active){.bx--tag__close-icon:focus{color:Highlight;outline:1px solid Highlight}}:host(bx-filter-tag){display:none}:host(bx-filter-tag[open]){display:inline-flex}:host(bx-filter-tag[disabled]) .bx--tag__close-icon{cursor:not-allowed}:host(bx-filter-tag[disabled]) .bx--tag__close-icon,:host(bx-filter-tag[disabled]) .bx--tag__close-icon:hover{background-color:transparent}:host(bx-filter-tag[size=sm]) .bx--tag__close-icon,:host(bx-tag[size=sm]) .bx--tag__close-icon{width:1.125rem;height:1.125rem;margin-left:.3125rem}:host(bx-filter-tag[size=sm]){padding-right:0}:host(bx-tag.bx--skeleton){position:relative;padding:0;border:none;background:var(--cds-skeleton-01,#e5e5e5);box-shadow:none;pointer-events:none;width:3.75rem;overflow:hidden}:host(bx-tag.bx--skeleton):active,:host(bx-tag.bx--skeleton):focus,:host(bx-tag.bx--skeleton):hover{border:none;cursor:default;outline:0}:host(bx-tag.bx--skeleton)::before{position:absolute;top:0;left:0;width:100%;height:100%;animation:3s ease-in-out skeleton infinite;background:var(--cds-skeleton-02,#c6c6c6);content:\"\";will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){:host(bx-tag.bx--skeleton)::before{animation:none}}",
 ]);

package/es/components/tag/tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"tag.js","names":["html","property","LitElement","settings","TAG_SIZE","TAG_TYPE","styles","carbonElement","customElement","prefix","BXTag","_decorate","_initialize","_LitElement","constructor","args","F","d","kind","decorators","type","Boolean","reflect","key","value","REGULAR","GRAY","render","_t","_","static","default"],"sources":["components/tag/tag.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, property, LitElement } from 'lit-element';\nimport settings from 'carbon-components/es/globals/js/settings';\nimport { TAG_SIZE, TAG_TYPE } from './defs';\nimport styles from './tag.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport { TAG_SIZE, TAG_TYPE };\n\nconst { prefix } = settings;\n\n/**\n * Tag.\n *\n * @element bx-tag\n */\n@customElement(`${prefix}-tag`)\nexport default class BXTag extends LitElement {\n  /**\n   * `true` if the tag should be disabled\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * The size of the tag.\n   */\n  @property({ reflect: true })\n  size = TAG_SIZE.REGULAR;\n\n  /**\n   * The type of the tag.\n   */\n  @property({ reflect: true })\n  type = TAG_TYPE.GRAY;\n\n  render() {\n    return html` <slot></slot> `;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,EAAEC,QAAQ,EAAEC,UAAU,QAAQ,aAAa;AACxD,OAAOC,QAAQ,MAAM,0CAA0C;AAC/D,SAASC,QAAQ,EAAEC,QAAQ,QAAQ,QAAQ;AAC3C,OAAOC,MAAM,MAAM,gBAAY;AAC/B,SAASC,aAAa,IAAIC,aAAa,QAAQ,yCAAyC;AAExF,SAASJ,QAAQ,EAAEC,QAAQ;AAE3B,MAAM;EAAEI;AAAO,CAAC,GAAGN,QAAQ;;AAE3B;AACA;AACA;AACA;AACA;AAJA,IAMqBO,KAAK,GAAAC,SAAA,EADzBH,aAAa,CAAE,GAAEC,MAAO,MAAK,CAAC,aAAAG,WAAA,EAAAC,WAAA;EAA/B,MACqBH,KAAK,SAAAG,WAAA,CAAoB;IAAAC,YAAA,GAAAC,IAAA;MAAA,SAAAA,IAAA;MAAAH,WAAA;IAAA;EAwB9C;EAAC;IAAAI,CAAA,EAxBoBN,KAAK;IAAAO,CAAA;MAAAC,IAAA;MAAAC,UAAA,GAIvBlB,QAAQ,CAAC;QAAEmB,IAAI,EAAEC,OAAO;QAAEC,OAAO,EAAE;MAAK,CAAC,CAAC;MAAAC,GAAA;MAAAC,MAAA;QAAA,OAChC,KAAK;MAAA;IAAA;MAAAN,IAAA;MAAAC,UAAA,GAKflB,QAAQ,CAAC;QAAEqB,OAAO,EAAE;MAAK,CAAC,CAAC;MAAAC,GAAA;MAAAC,MAAA;QAAA,OACrBpB,QAAQ,CAACqB,OAAO;MAAA;IAAA;MAAAP,IAAA;MAAAC,UAAA,GAKtBlB,QAAQ,CAAC;QAAEqB,OAAO,EAAE;MAAK,CAAC,CAAC;MAAAC,GAAA;MAAAC,MAAA;QAAA,OACrBnB,QAAQ,CAACqB,IAAI;MAAA;IAAA;MAAAR,IAAA;MAAAK,GAAA;MAAAC,KAAA;MAhBpB;AACF;AACA;;MAIE;AACF;AACA;;MAIE;AACF;AACA;;MAIE,SAAAG,OAAA,EAAS;QACP,OAAO3B,IAAI,CAAA4B,EAAA,KAAAA,EAAA,GAAAC,CAAA;MACb;IAAC;MAAAX,IAAA;MAAAY,MAAA;MAAAP,GAAA;MAAAC,MAAA;QAAA,OAEelB,MAAM;MAAA;IAAA;EAAA;AAAA,GAvBWJ,UAAU;AAAA,SAAxBQ,KAAK,IAAAqB,OAAA"}
+{"version":3,"file":"tag.js","names":["html","property","LitElement","settings","TAG_SIZE","TAG_TYPE","styles","carbonElement","customElement","prefix","BXTag","_decorate","_initialize","_LitElement","constructor","args","F","d","kind","decorators","type","Boolean","reflect","key","value","REGULAR","GRAY","render","_t","_","static","default"],"sources":["components/tag/tag.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, property, LitElement } from 'lit-element';\nimport settings from 'carbon-components/es/globals/js/settings';\nimport { TAG_SIZE, TAG_TYPE } from './defs';\nimport styles from './tag.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport { TAG_SIZE, TAG_TYPE };\n\nconst { prefix } = settings;\n\n/**\n * Tag.\n *\n * @element bx-tag\n */\n@customElement(`${prefix}-tag`)\nexport default class BXTag extends LitElement {\n  /**\n   * `true` if the tag should be disabled\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * The size of the tag.\n   */\n  @property({ reflect: true })\n  size = TAG_SIZE.REGULAR;\n\n  /**\n   * The type of the tag.\n   */\n  @property({ reflect: true })\n  type = TAG_TYPE.GRAY;\n\n  render() {\n    return html` <slot></slot> `;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,EAAEC,QAAQ,EAAEC,UAAU,QAAQ,aAAa;AACxD,OAAOC,QAAQ,MAAM,0CAA0C;AAC/D,SAASC,QAAQ,EAAEC,QAAQ,QAAQ,QAAQ;AAC3C,OAAOC,MAAM,MAAM,gBAAY;AAC/B,SAASC,aAAa,IAAIC,aAAa,QAAQ,yCAAyC;AAExF,SAASJ,QAAQ,EAAEC,QAAQ;AAE3B,MAAM;EAAEI;AAAO,CAAC,GAAGN,QAAQ;;AAE3B;AACA;AACA;AACA;AACA;AAJA,IAMqBO,KAAK,GAAAC,SAAA,EADzBH,aAAa,CAAE,GAAEC,MAAO,MAAK,CAAC,aAAAG,WAAA,EAAAC,WAAA;EAA/B,MACqBH,KAAK,SAAAG,WAAA,CAAoB;IAAAC,YAAA,GAAAC,IAAA;MAAA,SAAAA,IAAA;MAAAH,WAAA;IAAA;EAwB9C;EAAC;IAAAI,CAAA,EAxBoBN,KAAK;IAAAO,CAAA;MAAAC,IAAA;MAAAC,UAAA,GAIvBlB,QAAQ,CAAC;QAAEmB,IAAI,EAAEC,OAAO;QAAEC,OAAO,EAAE;MAAK,CAAC,CAAC;MAAAC,GAAA;MAAAC,MAAA;QAAA,OAChC,KAAK;MAAA;IAAA;MAAAN,IAAA;MAAAC,UAAA,GAKflB,QAAQ,CAAC;QAAEqB,OAAO,EAAE;MAAK,CAAC,CAAC;MAAAC,GAAA;MAAAC,MAAA;QAAA,OACrBpB,QAAQ,CAACqB,OAAO;MAAA;IAAA;MAAAP,IAAA;MAAAC,UAAA,GAKtBlB,QAAQ,CAAC;QAAEqB,OAAO,EAAE;MAAK,CAAC,CAAC;MAAAC,GAAA;MAAAC,MAAA;QAAA,OACrBnB,QAAQ,CAACqB,IAAI;MAAA;IAAA;MAAAR,IAAA;MAAAK,GAAA;MAAAC,KAAA;MAhBpB;AACF;AACA;;MAIE;AACF;AACA;;MAIE;AACF;AACA;;MAIE,SAAAG,OAAA,EAAS;QACP,OAAO3B,IAAI,CAAA4B,EAAA,KAAAA,EAAA,GAAAC,CAAC,iBAAe;MAC7B;IAAC;MAAAX,IAAA;MAAAY,MAAA;MAAAP,GAAA;MAAAC,MAAA;QAAA,OAEelB,MAAM;MAAA;IAAA;EAAA;AAAA,GAvBWJ,UAAU;AAAA,SAAxBQ,KAAK,IAAAqB,OAAA"}

package/es/components/textarea/textarea-skeleton.js

@@ -34,7 +34,10 @@ let BXTextareaSkeleton = _decorate([customElement(`${prefix}-textarea-skeleton`)
       kind: "method",
       key: "render",
       value: function render() {
-        return html(_t || (_t = _` <span class="${0}--label ${0}--skeleton"></span> <div class="${0}--skeleton ${0}--text-area"></div> `), prefix, prefix, prefix, prefix);
+        return html(_t || (_t = _`
+      <span class="${0}--label ${0}--skeleton"></span>
+      <div class="${0}--skeleton ${0}--text-area"></div>
+    `), prefix, prefix, prefix, prefix);
       }
     }, {
       kind: "field",

package/es/components/textarea/textarea-skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"textarea-skeleton.js","names":["html","LitElement","settings","styles","carbonElement","customElement","prefix","BXTextareaSkeleton","_decorate","_initialize","_LitElement","constructor","args","F","d","kind","key","value","render","_t","_","static"],"sources":["components/textarea/textarea-skeleton.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, LitElement } from 'lit-element';\nimport settings from 'carbon-components/es/globals/js/settings';\nimport styles from './textarea.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nconst { prefix } = settings;\n\n/**\n * Skeleton of text area.\n */\n@customElement(`${prefix}-textarea-skeleton`)\nclass BXTextareaSkeleton extends LitElement {\n  render() {\n    return html`\n      <span class=\"${prefix}--label ${prefix}--skeleton\"></span>\n      <div class=\"${prefix}--skeleton ${prefix}--text-area\"></div>\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default BXTextareaSkeleton;\n"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,EAAEC,UAAU,QAAQ,aAAa;AAC9C,OAAOC,QAAQ,MAAM,0CAA0C;AAC/D,OAAOC,MAAM,MAAM,qBAAiB;AACpC,SAASC,aAAa,IAAIC,aAAa,QAAQ,yCAAyC;AAExF,MAAM;EAAEC;AAAO,CAAC,GAAGJ,QAAQ;;AAE3B;AACA;AACA;AAFA,IAIMK,kBAAkB,GAAAC,SAAA,EADvBH,aAAa,CAAE,GAAEC,MAAO,oBAAmB,CAAC,aAAAG,WAAA,EAAAC,WAAA;EAA7C,MACMH,kBAAkB,SAAAG,WAAA,CAAoB;IAAAC,YAAA,GAAAC,IAAA;MAAA,SAAAA,IAAA;MAAAH,WAAA;IAAA;EAS5C;EAAC;IAAAI,CAAA,EATKN,kBAAkB;IAAAO,CAAA;MAAAC,IAAA;MAAAC,GAAA;MAAAC,KAAA,EACtB,SAAAC,OAAA,EAAS;QACP,OAAOlB,IAAI,CAAAmB,EAAA,KAAAA,EAAA,GAAAC,CAAA,0GACMd,MAAM,EAAWA,MAAM,EACxBA,MAAM,EAAcA,MAAM;MAE5C;IAAC;MAAAS,IAAA;MAAAM,MAAA;MAAAL,GAAA;MAAAC,MAAA;QAAA,OAEed,MAAM;MAAA;IAAA;EAAA;AAAA,GARSF,UAAU;AAW3C,eAAeM,kBAAkB"}
+{"version":3,"file":"textarea-skeleton.js","names":["html","LitElement","settings","styles","carbonElement","customElement","prefix","BXTextareaSkeleton","_decorate","_initialize","_LitElement","constructor","args","F","d","kind","key","value","render","_t","_","static"],"sources":["components/textarea/textarea-skeleton.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, LitElement } from 'lit-element';\nimport settings from 'carbon-components/es/globals/js/settings';\nimport styles from './textarea.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nconst { prefix } = settings;\n\n/**\n * Skeleton of text area.\n */\n@customElement(`${prefix}-textarea-skeleton`)\nclass BXTextareaSkeleton extends LitElement {\n  render() {\n    return html`\n      <span class=\"${prefix}--label ${prefix}--skeleton\"></span>\n      <div class=\"${prefix}--skeleton ${prefix}--text-area\"></div>\n    `;\n  }\n\n  static styles = styles;\n}\n\nexport default BXTextareaSkeleton;\n"],"mappings":";;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,EAAEC,UAAU,QAAQ,aAAa;AAC9C,OAAOC,QAAQ,MAAM,0CAA0C;AAC/D,OAAOC,MAAM,MAAM,qBAAiB;AACpC,SAASC,aAAa,IAAIC,aAAa,QAAQ,yCAAyC;AAExF,MAAM;EAAEC;AAAO,CAAC,GAAGJ,QAAQ;;AAE3B;AACA;AACA;AAFA,IAIMK,kBAAkB,GAAAC,SAAA,EADvBH,aAAa,CAAE,GAAEC,MAAO,oBAAmB,CAAC,aAAAG,WAAA,EAAAC,WAAA;EAA7C,MACMH,kBAAkB,SAAAG,WAAA,CAAoB;IAAAC,YAAA,GAAAC,IAAA;MAAA,SAAAA,IAAA;MAAAH,WAAA;IAAA;EAS5C;EAAC;IAAAI,CAAA,EATKN,kBAAkB;IAAAO,CAAA;MAAAC,IAAA;MAAAC,GAAA;MAAAC,KAAA,EACtB,SAAAC,OAAA,EAAS;QACP,OAAOlB,IAAI,CAAAmB,EAAA,KAAAA,EAAA,GAAAC,CAAC;AAChB,qBAAmB,CAAS,WAAQ,CAAS;AAC7C,oBAAkB,CAAS,cAAW,CAAS;AAC/C,KAAI,GAFiBd,MAAM,EAAWA,MAAM,EACxBA,MAAM,EAAcA,MAAM;MAE5C;IAAC;MAAAS,IAAA;MAAAM,MAAA;MAAAL,GAAA;MAAAC,MAAA;QAAA,OAEed,MAAM;MAAA;IAAA;EAAA;AAAA,GARSF,UAAU;AAW3C,eAAeM,kBAAkB"}

package/es/components/textarea/textarea.js

@@ -322,7 +322,38 @@ let BXTextarea = _decorate([customElement(`${prefix}-textarea`)], function (_ini
           [`${prefix}--form__helper-text`]: true,
           [`${prefix}--form__helper-text--disabled`]: this.disabled
         });
-        return html(_t || (_t = _` <label class="${0}" for="input"> <slot name="label-text"> ${0} </slot> </label> <div class="${0}--text-area__wrapper" ?data-invalid="${0}"> ${0} <textarea ?autocomplete="${0}" ?autofocus="${0}" class="${0}" cols="${0}" ?data-invalid="${0}" ?disabled="${0}" id="input" name="${0}" pattern="${0}" placeholder="${0}" ?readonly="${0}" ?required="${0}" rows="${0}" .value="${0}" @input="${0}"></textarea> </div> <div class="${0}"> <slot name="helper-text"> ${0} </slot> </div> <div class="${0}--form-requirement"> <slot name="validity-message"> ${0} </slot> </div> `), labelClasses, this.labelText, prefix, this.invalid, this.invalid ? invalidIcon : null, this.autocomplete, this.autofocus, textareaClasses, ifNonNull(this.cols), this.invalid, this.disabled, ifNonEmpty(this.name), ifNonEmpty(this.pattern), ifNonEmpty(this.placeholder), this.readonly, this.required, ifNonNull(this.rows), this.value, this._handleInput, helperTextClasses, this.helperText, prefix, this.validityMessage);
+        return html(_t || (_t = _`
+      <label class="${0}" for="input">
+        <slot name="label-text"> ${0} </slot>
+      </label>
+      <div
+        class="${0}--text-area__wrapper"
+        ?data-invalid="${0}">
+        ${0}
+        <textarea
+          ?autocomplete="${0}"
+          ?autofocus="${0}"
+          class="${0}"
+          cols="${0}"
+          ?data-invalid="${0}"
+          ?disabled="${0}"
+          id="input"
+          name="${0}"
+          pattern="${0}"
+          placeholder="${0}"
+          ?readonly="${0}"
+          ?required="${0}"
+          rows="${0}"
+          .value="${0}"
+          @input="${0}"></textarea>
+      </div>
+      <div class="${0}">
+        <slot name="helper-text"> ${0} </slot>
+      </div>
+      <div class="${0}--form-requirement">
+        <slot name="validity-message"> ${0} </slot>
+      </div>
+    `), labelClasses, this.labelText, prefix, this.invalid, this.invalid ? invalidIcon : null, this.autocomplete, this.autofocus, textareaClasses, ifNonNull(this.cols), this.invalid, this.disabled, ifNonEmpty(this.name), ifNonEmpty(this.pattern), ifNonEmpty(this.placeholder), this.readonly, this.required, ifNonNull(this.rows), this.value, this._handleInput, helperTextClasses, this.helperText, prefix, this.validityMessage);
       }
     }, {
       kind: "field",

package/es/components/textarea/textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"textarea.js","names":["LitElement","html","property","query","classMap","settings","WarningFilled16","ifNonEmpty","ifNonNull","FormMixin","ValidityMixin","TEXTAREA_COLOR_SCHEME","styles","carbonElement","customElement","prefix","BXTextarea","_decorate","_initialize","_ValidityMixin","constructor","args","F","d","kind","key","value","_handleInput","target","_handleFormdata","event","formData","disabled","name","append","decorators","type","Boolean","attribute","reflect","REGULAR","createRenderRoot","_exec","attachShadow","mode","delegatesFocus","Number","exec","navigator","userAgent","render","invalidIcon","class","textareaClasses","colorScheme","invalid","labelClasses","helperTextClasses","_t","_","labelText","autocomplete","autofocus","cols","pattern","placeholder","readonly","required","rows","helperText","validityMessage","static","default"],"sources":["components/textarea/textarea.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html, property, query } from 'lit-element';\nimport { classMap } from 'lit-html/directives/class-map';\nimport settings from 'carbon-components/es/globals/js/settings';\nimport WarningFilled16 from '@carbon/icons/lib/warning--filled/16';\nimport ifNonEmpty from '../../globals/directives/if-non-empty';\nimport ifNonNull from '../../globals/directives/if-non-null';\nimport FormMixin from '../../globals/mixins/form';\nimport ValidityMixin from '../../globals/mixins/validity';\nimport { TEXTAREA_COLOR_SCHEME } from './defs';\nimport styles from './textarea.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport { TEXTAREA_COLOR_SCHEME };\n\nconst { prefix } = settings;\n\n/**\n * Text area.\n *\n * @element bx-textarea\n * @slot helper-text - The helper text.\n * @slot label-text - The label text.\n * @slot validity-message - The validity message. If present and non-empty, this input shows the UI of its invalid state.\n */\n@customElement(`${prefix}-textarea`)\nexport default class BXTextarea extends ValidityMixin(FormMixin(LitElement)) {\n  /**\n   * Handles `oninput` event on the `<input>`.\n   *\n   * @param event The event.\n   */\n  private _handleInput({ target }: Event) {\n    this.value = (target as HTMLTextAreaElement).value;\n  }\n\n  _handleFormdata(event: Event) {\n    const { formData } = event as any; // TODO: Wait for `FormDataEvent` being available in `lib.dom.d.ts`\n    const { disabled, name, value } = this;\n    if (!disabled) {\n      formData.append(name, value);\n    }\n  }\n\n  /**\n   * May be any of the standard HTML autocomplete options\n   */\n  @property()\n  autocomplete = '';\n\n  /**\n   * Sets the textarea to be focussed automatically on page load. Defaults to false\n   */\n  @property({ type: Boolean })\n  autofocus = false;\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TEXTAREA_COLOR_SCHEME.REGULAR;\n\n  /**\n   * The number of columns for the textarea to show by default\n   */\n  @property()\n  cols = 50;\n\n  /**\n   * Controls the disabled state of the textarea\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * The helper text.\n   */\n  @property({ attribute: 'helper-text' })\n  helperText = '';\n\n  /**\n   * ID to link the `label` and `textarea`\n   */\n  @property()\n  id = '';\n\n  /**\n   * Controls the invalid state and visibility of the `validityMessage`\n   */\n  @property({ type: Boolean, reflect: true })\n  invalid = false;\n\n  /**\n   * The label text.\n   */\n  @property({ attribute: 'label-text' })\n  labelText = '';\n\n  /**\n   * Name for the textarea in the `FormData`\n   */\n  @property()\n  name = '';\n\n  /**\n   * Pattern to validate the textarea against for HTML validity checking\n   */\n  @property()\n  pattern = '';\n\n  /**\n   * Value to display when the textarea has an empty `value`\n   */\n  @property({ reflect: true })\n  placeholder = '';\n\n  /**\n   * Controls the readonly state of the textarea\n   */\n  @property({ type: Boolean, reflect: true })\n  readonly = false;\n\n  /**\n   * Boolean property to set the required status\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * The special validity message for `required`.\n   */\n  @property({ attribute: 'required-validity-message' })\n  requiredValidityMessage = 'Please fill out this field.';\n\n  /**\n   * The number of rows for the textarea to show by default\n   */\n  @property()\n  rows = 4;\n\n  /**\n   * The validity message.\n   */\n  @property({ attribute: 'validity-message' })\n  validityMessage = '';\n\n  /**\n   * The value of the text area.\n   */\n  @property()\n  value = '';\n\n  /**\n   * Get a reference to the underlying textarea so we can directly apply values.\n   * This lets us fixe a bug where after a user would clear text, the value wouldn't update programmatically\n   */\n  @query('textarea')\n  protected _textarea!: HTMLTextAreaElement;\n\n  createRenderRoot() {\n    return this.attachShadow({\n      mode: 'open',\n      delegatesFocus:\n        Number((/Safari\\/(\\d+)/.exec(navigator.userAgent) ?? ['', 0])[1]) <=\n        537,\n    });\n  }\n\n  render() {\n    const invalidIcon = WarningFilled16({\n      class: `${prefix}--text-area__invalid-icon`,\n    });\n\n    const textareaClasses = classMap({\n      [`${prefix}--text-area`]: true,\n      [`${prefix}--text-area--v2`]: true,\n      [`${prefix}--text-area--${this.colorScheme}`]: this.colorScheme,\n      [`${prefix}--text-area--invalid`]: this.invalid,\n    });\n\n    const labelClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--label--disabled`]: this.disabled,\n    });\n\n    const helperTextClasses = classMap({\n      [`${prefix}--form__helper-text`]: true,\n      [`${prefix}--form__helper-text--disabled`]: this.disabled,\n    });\n\n    return html`\n      <label class=\"${labelClasses}\" for=\"input\">\n        <slot name=\"label-text\"> ${this.labelText} </slot>\n      </label>\n      <div\n        class=\"${prefix}--text-area__wrapper\"\n        ?data-invalid=\"${this.invalid}\">\n        ${this.invalid ? invalidIcon : null}\n        <textarea\n          ?autocomplete=\"${this.autocomplete}\"\n          ?autofocus=\"${this.autofocus}\"\n          class=\"${textareaClasses}\"\n          cols=\"${ifNonNull(this.cols)}\"\n          ?data-invalid=\"${this.invalid}\"\n          ?disabled=\"${this.disabled}\"\n          id=\"input\"\n          name=\"${ifNonEmpty(this.name)}\"\n          pattern=\"${ifNonEmpty(this.pattern)}\"\n          placeholder=\"${ifNonEmpty(this.placeholder)}\"\n          ?readonly=\"${this.readonly}\"\n          ?required=\"${this.required}\"\n          rows=\"${ifNonNull(this.rows)}\"\n          .value=\"${this.value}\"\n          @input=\"${this._handleInput}\"></textarea>\n      </div>\n      <div class=\"${helperTextClasses}\">\n        <slot name=\"helper-text\"> ${this.helperText} </slot>\n      </div>\n      <div class=\"${prefix}--form-requirement\">\n        <slot name=\"validity-message\"> ${this.validityMessage} </slot>\n      </div>\n    `;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n"],"mappings":"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"}
+{"version":3,"file":"textarea.js","names":["LitElement","html","property","query","classMap","settings","WarningFilled16","ifNonEmpty","ifNonNull","FormMixin","ValidityMixin","TEXTAREA_COLOR_SCHEME","styles","carbonElement","customElement","prefix","BXTextarea","_decorate","_initialize","_ValidityMixin","constructor","args","F","d","kind","key","value","_handleInput","target","_handleFormdata","event","formData","disabled","name","append","decorators","type","Boolean","attribute","reflect","REGULAR","createRenderRoot","_exec","attachShadow","mode","delegatesFocus","Number","exec","navigator","userAgent","render","invalidIcon","class","textareaClasses","colorScheme","invalid","labelClasses","helperTextClasses","_t","_","labelText","autocomplete","autofocus","cols","pattern","placeholder","readonly","required","rows","helperText","validityMessage","static","default"],"sources":["components/textarea/textarea.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { LitElement, html, property, query } from 'lit-element';\nimport { classMap } from 'lit-html/directives/class-map';\nimport settings from 'carbon-components/es/globals/js/settings';\nimport WarningFilled16 from '@carbon/icons/lib/warning--filled/16';\nimport ifNonEmpty from '../../globals/directives/if-non-empty';\nimport ifNonNull from '../../globals/directives/if-non-null';\nimport FormMixin from '../../globals/mixins/form';\nimport ValidityMixin from '../../globals/mixins/validity';\nimport { TEXTAREA_COLOR_SCHEME } from './defs';\nimport styles from './textarea.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport { TEXTAREA_COLOR_SCHEME };\n\nconst { prefix } = settings;\n\n/**\n * Text area.\n *\n * @element bx-textarea\n * @slot helper-text - The helper text.\n * @slot label-text - The label text.\n * @slot validity-message - The validity message. If present and non-empty, this input shows the UI of its invalid state.\n */\n@customElement(`${prefix}-textarea`)\nexport default class BXTextarea extends ValidityMixin(FormMixin(LitElement)) {\n  /**\n   * Handles `oninput` event on the `<input>`.\n   *\n   * @param event The event.\n   */\n  private _handleInput({ target }: Event) {\n    this.value = (target as HTMLTextAreaElement).value;\n  }\n\n  _handleFormdata(event: Event) {\n    const { formData } = event as any; // TODO: Wait for `FormDataEvent` being available in `lib.dom.d.ts`\n    const { disabled, name, value } = this;\n    if (!disabled) {\n      formData.append(name, value);\n    }\n  }\n\n  /**\n   * May be any of the standard HTML autocomplete options\n   */\n  @property()\n  autocomplete = '';\n\n  /**\n   * Sets the textarea to be focussed automatically on page load. Defaults to false\n   */\n  @property({ type: Boolean })\n  autofocus = false;\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TEXTAREA_COLOR_SCHEME.REGULAR;\n\n  /**\n   * The number of columns for the textarea to show by default\n   */\n  @property()\n  cols = 50;\n\n  /**\n   * Controls the disabled state of the textarea\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * The helper text.\n   */\n  @property({ attribute: 'helper-text' })\n  helperText = '';\n\n  /**\n   * ID to link the `label` and `textarea`\n   */\n  @property()\n  id = '';\n\n  /**\n   * Controls the invalid state and visibility of the `validityMessage`\n   */\n  @property({ type: Boolean, reflect: true })\n  invalid = false;\n\n  /**\n   * The label text.\n   */\n  @property({ attribute: 'label-text' })\n  labelText = '';\n\n  /**\n   * Name for the textarea in the `FormData`\n   */\n  @property()\n  name = '';\n\n  /**\n   * Pattern to validate the textarea against for HTML validity checking\n   */\n  @property()\n  pattern = '';\n\n  /**\n   * Value to display when the textarea has an empty `value`\n   */\n  @property({ reflect: true })\n  placeholder = '';\n\n  /**\n   * Controls the readonly state of the textarea\n   */\n  @property({ type: Boolean, reflect: true })\n  readonly = false;\n\n  /**\n   * Boolean property to set the required status\n   */\n  @property({ type: Boolean, reflect: true })\n  required = false;\n\n  /**\n   * The special validity message for `required`.\n   */\n  @property({ attribute: 'required-validity-message' })\n  requiredValidityMessage = 'Please fill out this field.';\n\n  /**\n   * The number of rows for the textarea to show by default\n   */\n  @property()\n  rows = 4;\n\n  /**\n   * The validity message.\n   */\n  @property({ attribute: 'validity-message' })\n  validityMessage = '';\n\n  /**\n   * The value of the text area.\n   */\n  @property()\n  value = '';\n\n  /**\n   * Get a reference to the underlying textarea so we can directly apply values.\n   * This lets us fixe a bug where after a user would clear text, the value wouldn't update programmatically\n   */\n  @query('textarea')\n  protected _textarea!: HTMLTextAreaElement;\n\n  createRenderRoot() {\n    return this.attachShadow({\n      mode: 'open',\n      delegatesFocus:\n        Number((/Safari\\/(\\d+)/.exec(navigator.userAgent) ?? ['', 0])[1]) <=\n        537,\n    });\n  }\n\n  render() {\n    const invalidIcon = WarningFilled16({\n      class: `${prefix}--text-area__invalid-icon`,\n    });\n\n    const textareaClasses = classMap({\n      [`${prefix}--text-area`]: true,\n      [`${prefix}--text-area--v2`]: true,\n      [`${prefix}--text-area--${this.colorScheme}`]: this.colorScheme,\n      [`${prefix}--text-area--invalid`]: this.invalid,\n    });\n\n    const labelClasses = classMap({\n      [`${prefix}--label`]: true,\n      [`${prefix}--label--disabled`]: this.disabled,\n    });\n\n    const helperTextClasses = classMap({\n      [`${prefix}--form__helper-text`]: true,\n      [`${prefix}--form__helper-text--disabled`]: this.disabled,\n    });\n\n    return html`\n      <label class=\"${labelClasses}\" for=\"input\">\n        <slot name=\"label-text\"> ${this.labelText} </slot>\n      </label>\n      <div\n        class=\"${prefix}--text-area__wrapper\"\n        ?data-invalid=\"${this.invalid}\">\n        ${this.invalid ? invalidIcon : null}\n        <textarea\n          ?autocomplete=\"${this.autocomplete}\"\n          ?autofocus=\"${this.autofocus}\"\n          class=\"${textareaClasses}\"\n          cols=\"${ifNonNull(this.cols)}\"\n          ?data-invalid=\"${this.invalid}\"\n          ?disabled=\"${this.disabled}\"\n          id=\"input\"\n          name=\"${ifNonEmpty(this.name)}\"\n          pattern=\"${ifNonEmpty(this.pattern)}\"\n          placeholder=\"${ifNonEmpty(this.placeholder)}\"\n          ?readonly=\"${this.readonly}\"\n          ?required=\"${this.required}\"\n          rows=\"${ifNonNull(this.rows)}\"\n          .value=\"${this.value}\"\n          @input=\"${this._handleInput}\"></textarea>\n      </div>\n      <div class=\"${helperTextClasses}\">\n        <slot name=\"helper-text\"> ${this.helperText} </slot>\n      </div>\n      <div class=\"${prefix}--form-requirement\">\n        <slot name=\"validity-message\"> ${this.validityMessage} </slot>\n      </div>\n    `;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n"],"mappings":"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"}

package/es/components/tile/expandable-tile.js

@@ -140,7 +140,23 @@ let BXExpandableTile = _decorate([customElement(`${prefix}-expandable-tile`)], f
           _belowTheContentHeight: belowTheContentHeight,
           _handleSlotChangeBelowTheFoldContent: handleSlotChangeBelowTheFoldContent
         } = this;
-        return html(_t || (_t = _` <button class="${0}--tile__chevron" aria-labelledby="above-the-fold-content" aria-controls="below-the-fold-content" aria-expanded="${0}"> ${0} </button> <div id="content" class="${0}--tile-content"> <div><slot name="above-the-fold-content"></slot></div> <div class="${0}-ce--expandable-tile--below-the-fold-content" style="${0}"> <slot @slotchange="${0}"></slot> </div> </div> `), prefix, String(Boolean(expanded)), ChevronDown16({
+        return html(_t || (_t = _`
+      <button
+        class="${0}--tile__chevron"
+        aria-labelledby="above-the-fold-content"
+        aria-controls="below-the-fold-content"
+        aria-expanded="${0}">
+        ${0}
+      </button>
+      <div id="content" class="${0}--tile-content">
+        <div><slot name="above-the-fold-content"></slot></div>
+        <div
+          class="${0}-ce--expandable-tile--below-the-fold-content"
+          style="${0}">
+          <slot @slotchange="${0}"></slot>
+        </div>
+      </div>
+    `), prefix, String(Boolean(expanded)), ChevronDown16({
           id: 'icon'
         }), prefix, prefix, ifDefined(!expanded ? undefined : `max-height: ${belowTheContentHeight}px`), handleSlotChangeBelowTheFoldContent);
       }

package/es/components/tile/expandable-tile.js.map

@@ -1 +1 @@
-{"version":3,"file":"expandable-tile.js","names":["html","property","LitElement","ifDefined","ChevronDown16","settings","HostListener","FocusMixin","HostListenerMixin","TILE_COLOR_SCHEME","styles","carbonElement","customElement","prefix","BXExpandableTile","_decorate","_initialize","_HostListenerMixin","constructor","args","F","d","kind","key","value","_handleSlotChangeBelowTheFoldContent","event","_belowTheContentHeight","target","assignedNodes","reduce","acc","item","_offsetHeight","offsetHeight","requestUpdate","decorators","expanded","init","bubbles","composed","detail","beforeChangeEvent","CustomEvent","eventBeforeToggle","_objectSpread","cancelable","dispatchEvent","afterChangeEvent","eventToggle","attribute","reflect","REGULAR","type","Boolean","createRenderRoot","_exec","attachShadow","mode","delegatesFocus","Number","exec","navigator","userAgent","render","belowTheContentHeight","handleSlotChangeBelowTheFoldContent","_t","_","String","id","undefined","static"],"sources":["components/tile/expandable-tile.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, property, LitElement } from 'lit-element';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport ChevronDown16 from '@carbon/icons/lib/chevron--down/16';\nimport settings from 'carbon-components/es/globals/js/settings';\nimport HostListener from '../../globals/decorators/host-listener';\nimport FocusMixin from '../../globals/mixins/focus';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport { TILE_COLOR_SCHEME } from './defs';\nimport styles from './tile.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nconst { prefix } = settings;\n\n/**\n * Expandable tile.\n *\n * @element bx-expandable-tile\n * @fires bx-expandable-tile-beingtoggled\n *   The custom event fired before the expanded state is changed upon a user gesture.\n *   Cancellation of this event stops changing the user-initiated change in expanded state.\n * @fires bx-expandable-tile-toggled - The custom event fired after a the expanded state is changed upon a user gesture.\n */\n@customElement(`${prefix}-expandable-tile`)\nclass BXExpandableTile extends HostListenerMixin(FocusMixin(LitElement)) {\n  /**\n   * The computed height of the below-the-fold content.\n   */\n  private _belowTheContentHeight = 0;\n\n  /**\n   * Handles `slotchange` event on the below-the-fold content.\n   *\n   * @param event The event.\n   */\n  private _handleSlotChangeBelowTheFoldContent(event: Event) {\n    this._belowTheContentHeight = (event.target as HTMLSlotElement)\n      .assignedNodes()\n      .reduce(\n        (acc, item) => acc + ((item as HTMLElement).offsetHeight ?? 0),\n        0\n      );\n    this.requestUpdate();\n  }\n\n  @HostListener('click')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleClick = () => {\n    const expanded = !this.expanded;\n    const init = {\n      bubbles: true,\n      composed: true,\n      detail: {\n        expanded,\n      },\n    };\n    const constructor = this.constructor as typeof BXExpandableTile;\n    const beforeChangeEvent = new CustomEvent(constructor.eventBeforeToggle, {\n      ...init,\n      cancelable: true,\n    });\n    if (this.dispatchEvent(beforeChangeEvent)) {\n      this.expanded = expanded;\n      const afterChangeEvent = new CustomEvent(constructor.eventToggle, init);\n      this.dispatchEvent(afterChangeEvent);\n    }\n  };\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TILE_COLOR_SCHEME.REGULAR;\n\n  /**\n   * `true` to expand this expandable tile.\n   */\n  @property({ type: Boolean, reflect: true })\n  expanded = false;\n\n  createRenderRoot() {\n    return this.attachShadow({\n      mode: 'open',\n      delegatesFocus:\n        Number((/Safari\\/(\\d+)/.exec(navigator.userAgent) ?? ['', 0])[1]) <=\n        537,\n    });\n  }\n\n  render() {\n    const {\n      expanded,\n      _belowTheContentHeight: belowTheContentHeight,\n      _handleSlotChangeBelowTheFoldContent: handleSlotChangeBelowTheFoldContent,\n    } = this;\n    return html`\n      <button\n        class=\"${prefix}--tile__chevron\"\n        aria-labelledby=\"above-the-fold-content\"\n        aria-controls=\"below-the-fold-content\"\n        aria-expanded=\"${String(Boolean(expanded))}\">\n        ${ChevronDown16({\n          id: 'icon',\n        })}\n      </button>\n      <div id=\"content\" class=\"${prefix}--tile-content\">\n        <div><slot name=\"above-the-fold-content\"></slot></div>\n        <div\n          class=\"${prefix}-ce--expandable-tile--below-the-fold-content\"\n          style=\"${ifDefined(\n            !expanded ? undefined : `max-height: ${belowTheContentHeight}px`\n          )}\">\n          <slot @slotchange=\"${handleSlotChangeBelowTheFoldContent}\"></slot>\n        </div>\n      </div>\n    `;\n  }\n\n  /**\n   * The name of the custom event fired before the expanded state is changed upon a user gesture.\n   * Cancellation of this event stops changing the user-initiated change in expanded state.\n   */\n  static get eventBeforeToggle() {\n    return `${prefix}-expandable-tile-beingtoggled`;\n  }\n\n  /**\n   * The name of the custom event fired after a the expanded state is changed upon a user gesture.\n   */\n  static get eventToggle() {\n    return `${prefix}-expandable-tile-toggled`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default BXExpandableTile;\n"],"mappings":"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"}
+{"version":3,"file":"expandable-tile.js","names":["html","property","LitElement","ifDefined","ChevronDown16","settings","HostListener","FocusMixin","HostListenerMixin","TILE_COLOR_SCHEME","styles","carbonElement","customElement","prefix","BXExpandableTile","_decorate","_initialize","_HostListenerMixin","constructor","args","F","d","kind","key","value","_handleSlotChangeBelowTheFoldContent","event","_belowTheContentHeight","target","assignedNodes","reduce","acc","item","_offsetHeight","offsetHeight","requestUpdate","decorators","expanded","init","bubbles","composed","detail","beforeChangeEvent","CustomEvent","eventBeforeToggle","_objectSpread","cancelable","dispatchEvent","afterChangeEvent","eventToggle","attribute","reflect","REGULAR","type","Boolean","createRenderRoot","_exec","attachShadow","mode","delegatesFocus","Number","exec","navigator","userAgent","render","belowTheContentHeight","handleSlotChangeBelowTheFoldContent","_t","_","String","id","undefined","static"],"sources":["components/tile/expandable-tile.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, property, LitElement } from 'lit-element';\nimport { ifDefined } from 'lit-html/directives/if-defined';\nimport ChevronDown16 from '@carbon/icons/lib/chevron--down/16';\nimport settings from 'carbon-components/es/globals/js/settings';\nimport HostListener from '../../globals/decorators/host-listener';\nimport FocusMixin from '../../globals/mixins/focus';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport { TILE_COLOR_SCHEME } from './defs';\nimport styles from './tile.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nconst { prefix } = settings;\n\n/**\n * Expandable tile.\n *\n * @element bx-expandable-tile\n * @fires bx-expandable-tile-beingtoggled\n *   The custom event fired before the expanded state is changed upon a user gesture.\n *   Cancellation of this event stops changing the user-initiated change in expanded state.\n * @fires bx-expandable-tile-toggled - The custom event fired after a the expanded state is changed upon a user gesture.\n */\n@customElement(`${prefix}-expandable-tile`)\nclass BXExpandableTile extends HostListenerMixin(FocusMixin(LitElement)) {\n  /**\n   * The computed height of the below-the-fold content.\n   */\n  private _belowTheContentHeight = 0;\n\n  /**\n   * Handles `slotchange` event on the below-the-fold content.\n   *\n   * @param event The event.\n   */\n  private _handleSlotChangeBelowTheFoldContent(event: Event) {\n    this._belowTheContentHeight = (event.target as HTMLSlotElement)\n      .assignedNodes()\n      .reduce(\n        (acc, item) => acc + ((item as HTMLElement).offsetHeight ?? 0),\n        0\n      );\n    this.requestUpdate();\n  }\n\n  @HostListener('click')\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleClick = () => {\n    const expanded = !this.expanded;\n    const init = {\n      bubbles: true,\n      composed: true,\n      detail: {\n        expanded,\n      },\n    };\n    const constructor = this.constructor as typeof BXExpandableTile;\n    const beforeChangeEvent = new CustomEvent(constructor.eventBeforeToggle, {\n      ...init,\n      cancelable: true,\n    });\n    if (this.dispatchEvent(beforeChangeEvent)) {\n      this.expanded = expanded;\n      const afterChangeEvent = new CustomEvent(constructor.eventToggle, init);\n      this.dispatchEvent(afterChangeEvent);\n    }\n  };\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TILE_COLOR_SCHEME.REGULAR;\n\n  /**\n   * `true` to expand this expandable tile.\n   */\n  @property({ type: Boolean, reflect: true })\n  expanded = false;\n\n  createRenderRoot() {\n    return this.attachShadow({\n      mode: 'open',\n      delegatesFocus:\n        Number((/Safari\\/(\\d+)/.exec(navigator.userAgent) ?? ['', 0])[1]) <=\n        537,\n    });\n  }\n\n  render() {\n    const {\n      expanded,\n      _belowTheContentHeight: belowTheContentHeight,\n      _handleSlotChangeBelowTheFoldContent: handleSlotChangeBelowTheFoldContent,\n    } = this;\n    return html`\n      <button\n        class=\"${prefix}--tile__chevron\"\n        aria-labelledby=\"above-the-fold-content\"\n        aria-controls=\"below-the-fold-content\"\n        aria-expanded=\"${String(Boolean(expanded))}\">\n        ${ChevronDown16({\n          id: 'icon',\n        })}\n      </button>\n      <div id=\"content\" class=\"${prefix}--tile-content\">\n        <div><slot name=\"above-the-fold-content\"></slot></div>\n        <div\n          class=\"${prefix}-ce--expandable-tile--below-the-fold-content\"\n          style=\"${ifDefined(\n            !expanded ? undefined : `max-height: ${belowTheContentHeight}px`\n          )}\">\n          <slot @slotchange=\"${handleSlotChangeBelowTheFoldContent}\"></slot>\n        </div>\n      </div>\n    `;\n  }\n\n  /**\n   * The name of the custom event fired before the expanded state is changed upon a user gesture.\n   * Cancellation of this event stops changing the user-initiated change in expanded state.\n   */\n  static get eventBeforeToggle() {\n    return `${prefix}-expandable-tile-beingtoggled`;\n  }\n\n  /**\n   * The name of the custom event fired after a the expanded state is changed upon a user gesture.\n   */\n  static get eventToggle() {\n    return `${prefix}-expandable-tile-toggled`;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default BXExpandableTile;\n"],"mappings":"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"}

package/es/components/tile/selectable-tile.js

@@ -157,7 +157,23 @@ let BXSelectableTile = _decorate([customElement(`${prefix}-selectable-tile`)], f
           [`${prefix}--tile--selectable`]: true,
           [`${prefix}--tile--${colorScheme}`]: colorScheme
         });
-        return html(_t || (_t = _` <input type="${0}" id="input" class="${0}--tile-input" tabindex="-1" name="${0}" value="${0}" .checked="${0}" @change="${0}"> <label for="input" class="${0}" tabindex="0"> <div class="${0}--tile__checkmark"> ${0} </div> <div class="${0}--tile-content"><slot></slot></div> </label> `), inputType, prefix, ifNonNull(name), ifNonNull(value), selected, handleChange, classes, prefix, CheckmarkFilled16({
+        return html(_t || (_t = _`
+      <input
+        type="${0}"
+        id="input"
+        class="${0}--tile-input"
+        tabindex="-1"
+        name="${0}"
+        value="${0}"
+        .checked=${0}
+        @change=${0} />
+      <label for="input" class="${0}" tabindex="0">
+        <div class="${0}--tile__checkmark">
+          ${0}
+        </div>
+        <div class="${0}--tile-content"><slot></slot></div>
+      </label>
+    `), inputType, prefix, ifNonNull(name), ifNonNull(value), selected, handleChange, classes, prefix, CheckmarkFilled16({
           children: !checkmarkLabel ? undefined : svg(_t2 || (_t2 = _`<title>${0}</title>`), checkmarkLabel)
         }), prefix);
       }

package/es/components/tile/selectable-tile.js.map

@@ -1 +1 @@
-{"version":3,"file":"selectable-tile.js","names":["settings","classMap","html","svg","property","query","LitElement","CheckmarkFilled16","ifNonNull","FocusMixin","TILE_COLOR_SCHEME","styles","carbonElement","customElement","prefix","BXSelectableTile","_decorate","_initialize","_FocusMixin","constructor","args","F","d","kind","decorators","key","value","_handleChange","selected","_inputNode","checked","eventChange","dispatchEvent","CustomEvent","bubbles","composed","detail","attribute","reflect","REGULAR","type","Boolean","createRenderRoot","_exec","attachShadow","mode","delegatesFocus","Number","exec","navigator","userAgent","render","checkmarkLabel","colorScheme","name","_inputType","inputType","handleChange","classes","_t","_","children","undefined","_t2","static"],"sources":["components/tile/selectable-tile.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport settings from 'carbon-components/es/globals/js/settings';\nimport { classMap } from 'lit-html/directives/class-map';\nimport { html, svg, property, query, LitElement } from 'lit-element';\nimport CheckmarkFilled16 from '@carbon/icons/lib/checkmark--filled/16';\nimport ifNonNull from '../../globals/directives/if-non-null';\nimport FocusMixin from '../../globals/mixins/focus';\nimport { TILE_COLOR_SCHEME } from './defs';\nimport styles from './tile.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nconst { prefix } = settings;\n\n/**\n * Multi-selectable tile.\n *\n * @element bx-selectable-tile\n * @fires bx-selectable-tile-changed - The custom event fired after this selectable tile changes its selected state.\n */\n@customElement(`${prefix}-selectable-tile`)\nclass BXSelectableTile extends FocusMixin(LitElement) {\n  @query('input')\n  protected _inputNode!: HTMLInputElement;\n\n  /**\n   * The `type` attribute of the `<input>`.\n   */\n  protected _inputType = 'checkbox';\n\n  /**\n   * Handles `change` event on the `<input>` in the shadow DOM.\n   */\n  protected _handleChange() {\n    this.selected = this._inputNode.checked;\n\n    const selected = this.selected;\n    const { eventChange } = this.constructor as typeof BXSelectableTile;\n    this.dispatchEvent(\n      new CustomEvent(eventChange, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          selected,\n        },\n      })\n    );\n  }\n\n  /**\n   * The a11y text for the checkmark icon of the selected state.\n   */\n  @property({ attribute: 'checkmark-label' })\n  checkmarkLabel!: string;\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TILE_COLOR_SCHEME.REGULAR;\n\n  /**\n   * The form name.\n   */\n  @property()\n  name!: string;\n\n  /**\n   * `true` to show the selected state.\n   */\n  @property({ type: Boolean, reflect: true })\n  selected = false;\n\n  /**\n   * The form value.\n   */\n  @property()\n  value!: string;\n\n  createRenderRoot() {\n    return this.attachShadow({\n      mode: 'open',\n      delegatesFocus:\n        Number((/Safari\\/(\\d+)/.exec(navigator.userAgent) ?? ['', 0])[1]) <=\n        537,\n    });\n  }\n\n  render() {\n    const {\n      checkmarkLabel,\n      colorScheme,\n      name,\n      selected,\n      value,\n      _inputType: inputType,\n      _handleChange: handleChange,\n    } = this;\n    const classes = classMap({\n      [`${prefix}--tile`]: true,\n      [`${prefix}--tile--selectable`]: true,\n      [`${prefix}--tile--${colorScheme}`]: colorScheme,\n    });\n    return html`\n      <input\n        type=\"${inputType}\"\n        id=\"input\"\n        class=\"${prefix}--tile-input\"\n        tabindex=\"-1\"\n        name=\"${ifNonNull(name)}\"\n        value=\"${ifNonNull(value)}\"\n        .checked=${selected}\n        @change=${handleChange} />\n      <label for=\"input\" class=\"${classes}\" tabindex=\"0\">\n        <div class=\"${prefix}--tile__checkmark\">\n          ${CheckmarkFilled16({\n            children: !checkmarkLabel\n              ? undefined\n              : svg`<title>${checkmarkLabel}</title>`,\n          })}\n        </div>\n        <div class=\"${prefix}--tile-content\"><slot></slot></div>\n      </label>\n    `;\n  }\n\n  /**\n   * The name of the custom event fired after this selectable tile changes its selected state.\n   */\n  static get eventChange() {\n    return `${prefix}-selectable-tile-changed`;\n  }\n\n  static styles = styles;\n}\n\nexport default BXSelectableTile;\n"],"mappings":"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"}
+{"version":3,"file":"selectable-tile.js","names":["settings","classMap","html","svg","property","query","LitElement","CheckmarkFilled16","ifNonNull","FocusMixin","TILE_COLOR_SCHEME","styles","carbonElement","customElement","prefix","BXSelectableTile","_decorate","_initialize","_FocusMixin","constructor","args","F","d","kind","decorators","key","value","_handleChange","selected","_inputNode","checked","eventChange","dispatchEvent","CustomEvent","bubbles","composed","detail","attribute","reflect","REGULAR","type","Boolean","createRenderRoot","_exec","attachShadow","mode","delegatesFocus","Number","exec","navigator","userAgent","render","checkmarkLabel","colorScheme","name","_inputType","inputType","handleChange","classes","_t","_","children","undefined","_t2","static"],"sources":["components/tile/selectable-tile.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport settings from 'carbon-components/es/globals/js/settings';\nimport { classMap } from 'lit-html/directives/class-map';\nimport { html, svg, property, query, LitElement } from 'lit-element';\nimport CheckmarkFilled16 from '@carbon/icons/lib/checkmark--filled/16';\nimport ifNonNull from '../../globals/directives/if-non-null';\nimport FocusMixin from '../../globals/mixins/focus';\nimport { TILE_COLOR_SCHEME } from './defs';\nimport styles from './tile.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nconst { prefix } = settings;\n\n/**\n * Multi-selectable tile.\n *\n * @element bx-selectable-tile\n * @fires bx-selectable-tile-changed - The custom event fired after this selectable tile changes its selected state.\n */\n@customElement(`${prefix}-selectable-tile`)\nclass BXSelectableTile extends FocusMixin(LitElement) {\n  @query('input')\n  protected _inputNode!: HTMLInputElement;\n\n  /**\n   * The `type` attribute of the `<input>`.\n   */\n  protected _inputType = 'checkbox';\n\n  /**\n   * Handles `change` event on the `<input>` in the shadow DOM.\n   */\n  protected _handleChange() {\n    this.selected = this._inputNode.checked;\n\n    const selected = this.selected;\n    const { eventChange } = this.constructor as typeof BXSelectableTile;\n    this.dispatchEvent(\n      new CustomEvent(eventChange, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          selected,\n        },\n      })\n    );\n  }\n\n  /**\n   * The a11y text for the checkmark icon of the selected state.\n   */\n  @property({ attribute: 'checkmark-label' })\n  checkmarkLabel!: string;\n\n  /**\n   * The color scheme.\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TILE_COLOR_SCHEME.REGULAR;\n\n  /**\n   * The form name.\n   */\n  @property()\n  name!: string;\n\n  /**\n   * `true` to show the selected state.\n   */\n  @property({ type: Boolean, reflect: true })\n  selected = false;\n\n  /**\n   * The form value.\n   */\n  @property()\n  value!: string;\n\n  createRenderRoot() {\n    return this.attachShadow({\n      mode: 'open',\n      delegatesFocus:\n        Number((/Safari\\/(\\d+)/.exec(navigator.userAgent) ?? ['', 0])[1]) <=\n        537,\n    });\n  }\n\n  render() {\n    const {\n      checkmarkLabel,\n      colorScheme,\n      name,\n      selected,\n      value,\n      _inputType: inputType,\n      _handleChange: handleChange,\n    } = this;\n    const classes = classMap({\n      [`${prefix}--tile`]: true,\n      [`${prefix}--tile--selectable`]: true,\n      [`${prefix}--tile--${colorScheme}`]: colorScheme,\n    });\n    return html`\n      <input\n        type=\"${inputType}\"\n        id=\"input\"\n        class=\"${prefix}--tile-input\"\n        tabindex=\"-1\"\n        name=\"${ifNonNull(name)}\"\n        value=\"${ifNonNull(value)}\"\n        .checked=${selected}\n        @change=${handleChange} />\n      <label for=\"input\" class=\"${classes}\" tabindex=\"0\">\n        <div class=\"${prefix}--tile__checkmark\">\n          ${CheckmarkFilled16({\n            children: !checkmarkLabel\n              ? undefined\n              : svg`<title>${checkmarkLabel}</title>`,\n          })}\n        </div>\n        <div class=\"${prefix}--tile-content\"><slot></slot></div>\n      </label>\n    `;\n  }\n\n  /**\n   * The name of the custom event fired after this selectable tile changes its selected state.\n   */\n  static get eventChange() {\n    return `${prefix}-selectable-tile-changed`;\n  }\n\n  static styles = styles;\n}\n\nexport default BXSelectableTile;\n"],"mappings":"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"}

package/es/components/tile/tile-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"tile-group.js","names":["html","LitElement","settings","styles","carbonElement","customElement","prefix","BXTileGroup","_decorate","_initialize","_LitElement","constructor","args","F","d","kind","key","value","connectedCallback","hasAttribute","setAttribute","_get","_getPrototypeOf","prototype","call","render","_t","_","static"],"sources":["components/tile/tile-group.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, LitElement } from 'lit-element';\nimport settings from 'carbon-components/es/globals/js/settings';\nimport styles from './tile.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nconst { prefix } = settings;\n\n/**\n * Tile group.\n *\n * @element bx-tile-group\n */\n@customElement(`${prefix}-tile-group`)\nclass BXTileGroup extends LitElement {\n  connectedCallback() {\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'group');\n    }\n    super.connectedCallback();\n  }\n\n  render() {\n    return html` <slot></slot> `;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default BXTileGroup;\n"],"mappings":";;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,EAAEC,UAAU,QAAQ,aAAa;AAC9C,OAAOC,QAAQ,MAAM,0CAA0C;AAC/D,OAAOC,MAAM,MAAM,iBAAa;AAChC,SAASC,aAAa,IAAIC,aAAa,QAAQ,yCAAyC;AAExF,MAAM;EAAEC;AAAO,CAAC,GAAGJ,QAAQ;;AAE3B;AACA;AACA;AACA;AACA;AAJA,IAMMK,WAAW,GAAAC,SAAA,EADhBH,aAAa,CAAE,GAAEC,MAAO,aAAY,CAAC,aAAAG,WAAA,EAAAC,WAAA;EAAtC,MACMH,WAAW,SAAAG,WAAA,CAAoB;IAAAC,YAAA,GAAAC,IAAA;MAAA,SAAAA,IAAA;MAAAH,WAAA;IAAA;EAarC;EAAC;IAAAI,CAAA,EAbKN,WAAW;IAAAO,CAAA;MAAAC,IAAA;MAAAC,GAAA;MAAAC,KAAA,EACf,SAAAC,kBAAA,EAAoB;QAClB,IAAI,CAAC,IAAI,CAACC,YAAY,CAAC,MAAM,CAAC,EAAE;UAC9B,IAAI,CAACC,YAAY,CAAC,MAAM,EAAE,OAAO,CAAC;QACpC;QACAC,IAAA,CAAAC,eAAA,CALEf,WAAW,CAAAgB,SAAA,8BAAAC,IAAA;MAMf;IAAC;MAAAT,IAAA;MAAAC,GAAA;MAAAC,KAAA,EAED,SAAAQ,OAAA,EAAS;QACP,OAAOzB,IAAI,CAAA0B,EAAA,KAAAA,EAAA,GAAAC,CAAA;MACb;IAAC;MAAAZ,IAAA;MAAAa,MAAA;MAAAZ,GAAA;MAAAC,MAAA;QAAA,OAEed,MAAM;MAAA;IAAA;EAAA;AAAA,GAZEF,UAAU;AAepC,eAAeM,WAAW"}
+{"version":3,"file":"tile-group.js","names":["html","LitElement","settings","styles","carbonElement","customElement","prefix","BXTileGroup","_decorate","_initialize","_LitElement","constructor","args","F","d","kind","key","value","connectedCallback","hasAttribute","setAttribute","_get","_getPrototypeOf","prototype","call","render","_t","_","static"],"sources":["components/tile/tile-group.ts"],"sourcesContent":["/**\n * @license\n *\n * Copyright IBM Corp. 2019, 2023\n *\n * This source code is licensed under the Apache-2.0 license found in the\n * LICENSE file in the root directory of this source tree.\n */\n\nimport { html, LitElement } from 'lit-element';\nimport settings from 'carbon-components/es/globals/js/settings';\nimport styles from './tile.scss';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nconst { prefix } = settings;\n\n/**\n * Tile group.\n *\n * @element bx-tile-group\n */\n@customElement(`${prefix}-tile-group`)\nclass BXTileGroup extends LitElement {\n  connectedCallback() {\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'group');\n    }\n    super.connectedCallback();\n  }\n\n  render() {\n    return html` <slot></slot> `;\n  }\n\n  static styles = styles; // `styles` here is a `CSSResult` generated by custom WebPack loader\n}\n\nexport default BXTileGroup;\n"],"mappings":";;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,SAASA,IAAI,EAAEC,UAAU,QAAQ,aAAa;AAC9C,OAAOC,QAAQ,MAAM,0CAA0C;AAC/D,OAAOC,MAAM,MAAM,iBAAa;AAChC,SAASC,aAAa,IAAIC,aAAa,QAAQ,yCAAyC;AAExF,MAAM;EAAEC;AAAO,CAAC,GAAGJ,QAAQ;;AAE3B;AACA;AACA;AACA;AACA;AAJA,IAMMK,WAAW,GAAAC,SAAA,EADhBH,aAAa,CAAE,GAAEC,MAAO,aAAY,CAAC,aAAAG,WAAA,EAAAC,WAAA;EAAtC,MACMH,WAAW,SAAAG,WAAA,CAAoB;IAAAC,YAAA,GAAAC,IAAA;MAAA,SAAAA,IAAA;MAAAH,WAAA;IAAA;EAarC;EAAC;IAAAI,CAAA,EAbKN,WAAW;IAAAO,CAAA;MAAAC,IAAA;MAAAC,GAAA;MAAAC,KAAA,EACf,SAAAC,kBAAA,EAAoB;QAClB,IAAI,CAAC,IAAI,CAACC,YAAY,CAAC,MAAM,CAAC,EAAE;UAC9B,IAAI,CAACC,YAAY,CAAC,MAAM,EAAE,OAAO,CAAC;QACpC;QACAC,IAAA,CAAAC,eAAA,CALEf,WAAW,CAAAgB,SAAA,8BAAAC,IAAA;MAMf;IAAC;MAAAT,IAAA;MAAAC,GAAA;MAAAC,KAAA,EAED,SAAAQ,OAAA,EAAS;QACP,OAAOzB,IAAI,CAAA0B,EAAA,KAAAA,EAAA,GAAAC,CAAC,iBAAe;MAC7B;IAAC;MAAAZ,IAAA;MAAAa,MAAA;MAAAZ,GAAA;MAAAC,MAAA;QAAA,OAEed,MAAM;MAAA;IAAA;EAAA;AAAA,GAZEF,UAAU;AAepC,eAAeM,WAAW"}