@carbon/web-components 2.57.0 → 2.58.0-rc.0

package/es-custom/components/structured-list/structured-list-row.js.map

@@ -1 +1 @@
-{"version":3,"file":"structured-list-row.js","names":["styles","customElement"],"sources":["../../../src/components/structured-list/structured-list-row.ts"],"sourcesContent":["/**\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 } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { prefix } from '../../globals/settings';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport CheckmarkFilled16 from '@carbon/icons/es/checkmark--filled/16.js';\nimport HostListener from '../../globals/decorators/host-listener';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport RadioGroupManager, {\n  NAVIGATION_DIRECTION,\n  ManagedRadioButtonDelegate,\n} from '../../globals/internal/radio-group-manager';\nimport styles from './structured-list.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Map of navigation direction by key.\n */\nconst navigationDirectionForKey = {\n  ArrowUp: NAVIGATION_DIRECTION.BACKWARD,\n  Up: NAVIGATION_DIRECTION.BACKWARD, // IE\n  ArrowDown: NAVIGATION_DIRECTION.FORWARD,\n  Down: NAVIGATION_DIRECTION.FORWARD, // IE\n};\n\n/**\n * The interface for `RadioGroupManager` for structured list row.\n */\nclass StructuredListRowRadioButtonDelegate\n  implements ManagedRadioButtonDelegate\n{\n  /**\n   * The structured list row to target.\n   */\n  private _row: CDSStructuredListRow;\n\n  constructor(row: CDSStructuredListRow) {\n    this._row = row;\n  }\n\n  get checked() {\n    return this._row.selected;\n  }\n\n  set checked(checked) {\n    this._row.selected = checked;\n    this._row.tabIndex = checked ? 0 : -1;\n  }\n\n  get tabIndex() {\n    return this._row.tabIndex;\n  }\n\n  set tabIndex(tabIndex) {\n    this._row.tabIndex = tabIndex;\n  }\n\n  get name() {\n    return this._row.selectionName;\n  }\n\n  compareDocumentPosition(other: StructuredListRowRadioButtonDelegate) {\n    return this._row.compareDocumentPosition(other._row);\n  }\n\n  focus() {\n    this._row.focus();\n  }\n}\n\n/**\n * Structured list row.\n *\n * @element cds-custom-structured-list-row\n */\n@customElement(`${prefix}-structured-list-row`)\nclass CDSStructuredListRow extends HostListenerMixin(LitElement) {\n  /**\n   * The radio group manager associated with the radio button.\n   */\n  private _manager: RadioGroupManager | null = null;\n\n  /**\n   * The interface for `RadioGroupManager` for structured list row.\n   */\n  private _radioButtonDelegate = new StructuredListRowRadioButtonDelegate(this);\n\n  /**\n   * The hidden radio button.\n   */\n  @query('#input')\n  private _inputNode!: HTMLInputElement;\n\n  /**\n   * Handles `click` event on this element.\n   */\n  @HostListener('click')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleClick = () => {\n    const { _inputNode: inputNode } = this;\n    if (inputNode) {\n      this.selected = true;\n      if (this._manager) {\n        this._manager.select(this._radioButtonDelegate);\n      }\n    }\n  };\n\n  /**\n   * Handles `keydown` event on this element.\n   */\n  @HostListener('keydown')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleKeydown = (event: KeyboardEvent) => {\n    const { _inputNode: inputNode } = this;\n    const manager = this._manager;\n    if (inputNode && manager) {\n      const navigationDirection = navigationDirectionForKey[event.key];\n      if (navigationDirection) {\n        manager.select(\n          manager.navigate(this._radioButtonDelegate, navigationDirection)\n        );\n      }\n      if (event.key === ' ' || event.key === 'Enter') {\n        manager.select(this._radioButtonDelegate);\n      }\n    }\n  };\n\n  /**\n   * `true` if this structured list row should be selectable and selected.\n   */\n  @property({ type: Boolean, reflect: true })\n  selected = false;\n\n  /**\n   * The `name` attribute for the `<input>` for selection.\n   * If present, this structured list row will be a selectable one.\n   */\n  @property({ attribute: 'selection-name' })\n  selectionName = '';\n\n  /**\n   * The `value` attribute for the `<input>` for selection.\n   */\n  @property({ attribute: 'selection-value' })\n  selectionValue = '';\n\n  /**\n   * The content to put into the `<title>` attribute of the selection icon.\n   */\n  @property({ attribute: 'selection-icon-title' })\n  selectionIconTitle = '';\n\n  connectedCallback() {\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'row');\n    }\n    super.connectedCallback();\n    if (!this._manager) {\n      this._manager = RadioGroupManager.get(\n        this.getRootNode({ composed: true }) as Document\n      );\n      const { selectionName } = this;\n      if (selectionName) {\n        this._manager?.add(this._radioButtonDelegate);\n      }\n    }\n  }\n\n  disconnectedCallback() {\n    if (this._manager) {\n      this._manager.delete(this._radioButtonDelegate);\n    }\n    super.disconnectedCallback();\n  }\n\n  updated(changedProperties) {\n    const { _manager: manager, selectionName } = this;\n    if (changedProperties.has('selectionName')) {\n      if (manager) {\n        manager.delete(\n          this._radioButtonDelegate,\n          changedProperties.get('selectionName')\n        );\n        if (selectionName) {\n          manager.add(this._radioButtonDelegate);\n        }\n      }\n      this.setAttribute(\n        'tabindex',\n        !selectionName ||\n          !manager ||\n          !manager.shouldBeFocusable(this._radioButtonDelegate)\n          ? '-1'\n          : '0'\n      );\n    }\n  }\n\n  render() {\n    const { selected, selectionName, selectionValue, selectionIconTitle } =\n      this;\n    if (selectionName) {\n      // \"Selected\" style with `.${prefix}--structured-list-td` does not work somehow - Need investigation\n      return html`\n        <slot></slot>\n        <input\n          id=\"input\"\n          type=\"radio\"\n          class=\"${prefix}--structured-list-input ${prefix}--visually-hidden\"\n          .checked=${selected}\n          name=${selectionName}\n          value=${ifDefined(selectionValue)} />\n        <div\n          class=\"${prefix}--structured-list-td ${prefix}--structured-list-cell\">\n          ${iconLoader(CheckmarkFilled16, {\n            class: `${prefix}--structured-list-svg`,\n            title: selectionIconTitle,\n          })}\n        </div>\n      `;\n    }\n    return html` <slot></slot> `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSStructuredListRow;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyBA,MAAM,4BAA4B;CAChC,SAAA;CACA,IAAA;CACA,WAAA;CACA,MAAA;CACD;;;;AAKD,IAAM,uCAAN,MAEA;CAME,YAAY,KAA2B;AACrC,OAAK,OAAO;;CAGd,IAAI,UAAU;AACZ,SAAO,KAAK,KAAK;;CAGnB,IAAI,QAAQ,SAAS;AACnB,OAAK,KAAK,WAAW;AACrB,OAAK,KAAK,WAAW,UAAU,IAAI;;CAGrC,IAAI,WAAW;AACb,SAAO,KAAK,KAAK;;CAGnB,IAAI,SAAS,UAAU;AACrB,OAAK,KAAK,WAAW;;CAGvB,IAAI,OAAO;AACT,SAAO,KAAK,KAAK;;CAGnB,wBAAwB,OAA6C;AACnE,SAAO,KAAK,KAAK,wBAAwB,MAAM,KAAK;;CAGtD,QAAQ;AACN,OAAK,KAAK,OAAO;;;;;;;;AASrB,IAAA,uBAAA,MACM,6BAA6B,kBAAkB,WAAW,CAAC;;;kBAIlB;8BAKd,IAAI,qCAAqC,KAAK;4BAchD;GAC3B,MAAM,EAAE,YAAY,cAAc;AAClC,OAAI,WAAW;AACb,SAAK,WAAW;AAChB,QAAI,KAAK,SACP,MAAK,SAAS,OAAO,KAAK,qBAAqB;;;yBAW3B,UAAyB;GACjD,MAAM,EAAE,YAAY,cAAc;GAClC,MAAM,UAAU,KAAK;AACrB,OAAI,aAAa,SAAS;IACxB,MAAM,sBAAsB,0BAA0B,MAAM;AAC5D,QAAI,oBACF,SAAQ,OACN,QAAQ,SAAS,KAAK,sBAAsB,oBAAoB,CACjE;AAEH,QAAI,MAAM,QAAQ,OAAO,MAAM,QAAQ,QACrC,SAAQ,OAAO,KAAK,qBAAqB;;;kBASpC;uBAOK;wBAMC;4BAMI;;CAErB,oBAAoB;AAClB,MAAI,CAAC,KAAK,aAAa,OAAO,CAC5B,MAAK,aAAa,QAAQ,MAAM;AAElC,QAAM,mBAAmB;AACzB,MAAI,CAAC,KAAK,UAAU;AAClB,QAAK,WAAW,kBAAkB,IAChC,KAAK,YAAY,EAAE,UAAU,MAAM,CAAC,CACrC;GACD,MAAM,EAAE,kBAAkB;AAC1B,OAAI,cACF,MAAK,UAAU,IAAI,KAAK,qBAAqB;;;CAKnD,uBAAuB;AACrB,MAAI,KAAK,SACP,MAAK,SAAS,OAAO,KAAK,qBAAqB;AAEjD,QAAM,sBAAsB;;CAG9B,QAAQ,mBAAmB;EACzB,MAAM,EAAE,UAAU,SAAS,kBAAkB;AAC7C,MAAI,kBAAkB,IAAI,gBAAgB,EAAE;AAC1C,OAAI,SAAS;AACX,YAAQ,OACN,KAAK,sBACL,kBAAkB,IAAI,gBAAgB,CACvC;AACD,QAAI,cACF,SAAQ,IAAI,KAAK,qBAAqB;;AAG1C,QAAK,aACH,YACA,CAAC,iBACC,CAAC,WACD,CAAC,QAAQ,kBAAkB,KAAK,qBAAqB,GACnD,OACA,IACL;;;CAIL,SAAS;EACP,MAAM,EAAE,UAAU,eAAe,gBAAgB,uBAC/C;AACF,MAAI,cAEF,QAAO,IAAI;;;;;yBAKS,0BAAA,MAAiC;qBACtC,SAAS;iBACb,cAAc;kBACb,UAAU,eAAe,CAAC;;yBAElB,uBAAA,MAA8B;YAC5C,WAAW,mBAAmB;GAC9B,OAAO;GACP,OAAO;GACR,CAAC,CAAC;;;AAIT,SAAO,IAAI;;;gBAGGA;;;YA1If,MAAM,SAAS,CAAA,EAAA,qBAAA,WAAA,cAAA,KAAA,EAAA;YAMf,aAAa,QAAQ,CAAA,EAAA,qBAAA,WAAA,gBAAA,KAAA,EAAA;YAgBrB,aAAa,UAAU,CAAA,EAAA,qBAAA,WAAA,kBAAA,KAAA,EAAA;YAsBvB,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,qBAAA,WAAA,YAAA,KAAA,EAAA;YAO1C,SAAS,EAAE,WAAW,kBAAkB,CAAC,CAAA,EAAA,qBAAA,WAAA,iBAAA,KAAA,EAAA;YAMzC,SAAS,EAAE,WAAW,mBAAmB,CAAC,CAAA,EAAA,qBAAA,WAAA,kBAAA,KAAA,EAAA;YAM1C,SAAS,EAAE,WAAW,wBAAwB,CAAC,CAAA,EAAA,qBAAA,WAAA,sBAAA,KAAA,EAAA;mCA9EjDC,cAAc,0BAAgC,CAAA,EAAA,qBAAA;AA4J/C,IAAA,8BAAe"}
+{"version":3,"file":"structured-list-row.js","names":["styles","customElement"],"sources":["../../../src/components/structured-list/structured-list-row.ts"],"sourcesContent":["/**\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 } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { prefix } from '../../globals/settings';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport CheckmarkFilled16 from '@carbon/icons/es/checkmark--filled/16.js';\nimport HostListener from '../../globals/decorators/host-listener';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport RadioGroupManager, {\n  NAVIGATION_DIRECTION,\n  ManagedRadioButtonDelegate,\n} from '../../globals/internal/radio-group-manager';\nimport styles from './structured-list.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Map of navigation direction by key.\n */\nconst navigationDirectionForKey = {\n  ArrowUp: NAVIGATION_DIRECTION.BACKWARD,\n  Up: NAVIGATION_DIRECTION.BACKWARD, // IE\n  ArrowDown: NAVIGATION_DIRECTION.FORWARD,\n  Down: NAVIGATION_DIRECTION.FORWARD, // IE\n};\n\n/**\n * The interface for `RadioGroupManager` for structured list row.\n */\nclass StructuredListRowRadioButtonDelegate\n  implements ManagedRadioButtonDelegate\n{\n  /**\n   * The structured list row to target.\n   */\n  private _row: CDSStructuredListRow;\n\n  constructor(row: CDSStructuredListRow) {\n    this._row = row;\n  }\n\n  get checked() {\n    return this._row.selected;\n  }\n\n  set checked(checked) {\n    this._row.selected = checked;\n    this._row.tabIndex = checked ? 0 : -1;\n  }\n\n  get tabIndex() {\n    return this._row.tabIndex;\n  }\n\n  set tabIndex(tabIndex) {\n    this._row.tabIndex = tabIndex;\n  }\n\n  get name() {\n    return this._row.selectionName;\n  }\n\n  compareDocumentPosition(other: StructuredListRowRadioButtonDelegate) {\n    return this._row.compareDocumentPosition(other._row);\n  }\n\n  focus() {\n    this._row.focus();\n  }\n}\n\n/**\n * Structured list row.\n *\n * @element cds-custom-structured-list-row\n */\n@customElement(`${prefix}-structured-list-row`)\nclass CDSStructuredListRow extends HostListenerMixin(LitElement) {\n  /**\n   * The radio group manager associated with the radio button.\n   */\n  private _manager: RadioGroupManager | null = null;\n\n  /**\n   * The interface for `RadioGroupManager` for structured list row.\n   */\n  private _radioButtonDelegate = new StructuredListRowRadioButtonDelegate(this);\n\n  /**\n   * The hidden radio button.\n   */\n  @query('#input')\n  private _inputNode!: HTMLInputElement;\n\n  /**\n   * Handles `click` event on this element.\n   */\n  @HostListener('click')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleClick = () => {\n    const { _inputNode: inputNode } = this;\n    if (inputNode) {\n      this.selected = true;\n      if (this._manager) {\n        this._manager.select(this._radioButtonDelegate);\n      }\n    }\n  };\n\n  /**\n   * Handles `keydown` event on this element.\n   */\n  @HostListener('keydown')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleKeydown = (event: KeyboardEvent) => {\n    const { _inputNode: inputNode } = this;\n    const manager = this._manager;\n    if (inputNode && manager) {\n      const navigationDirection = navigationDirectionForKey[event.key];\n      if (navigationDirection) {\n        manager.select(\n          manager.navigate(this._radioButtonDelegate, navigationDirection)\n        );\n      }\n      if (event.key === ' ' || event.key === 'Enter') {\n        manager.select(this._radioButtonDelegate);\n      }\n    }\n  };\n\n  /**\n   * `true` if this structured list row should be selectable and selected.\n   */\n  @property({ type: Boolean, reflect: true })\n  selected = false;\n\n  /**\n   * The `name` attribute for the `<input>` for selection.\n   * If present, this structured list row will be a selectable one.\n   */\n  @property({ attribute: 'selection-name' })\n  selectionName = '';\n\n  /**\n   * The `value` attribute for the `<input>` for selection.\n   */\n  @property({ attribute: 'selection-value' })\n  selectionValue = '';\n\n  /**\n   * The content to put into the `<title>` attribute of the selection icon.\n   */\n  @property({ attribute: 'selection-icon-title' })\n  selectionIconTitle = '';\n\n  connectedCallback() {\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'row');\n    }\n    super.connectedCallback();\n    if (!this._manager) {\n      this._manager = RadioGroupManager.get(\n        this.getRootNode({ composed: true }) as Document\n      );\n      const { selectionName } = this;\n      if (selectionName) {\n        this._manager?.add(this._radioButtonDelegate);\n      }\n    }\n  }\n\n  disconnectedCallback() {\n    if (this._manager) {\n      this._manager.delete(this._radioButtonDelegate);\n    }\n    super.disconnectedCallback();\n  }\n\n  updated(changedProperties) {\n    const { _manager: manager, selectionName } = this;\n    if (changedProperties.has('selectionName')) {\n      if (manager) {\n        manager.delete(\n          this._radioButtonDelegate,\n          changedProperties.get('selectionName')\n        );\n        if (selectionName) {\n          manager.add(this._radioButtonDelegate);\n        }\n      }\n      this.setAttribute(\n        'tabindex',\n        !selectionName ||\n          !manager ||\n          !manager.shouldBeFocusable(this._radioButtonDelegate)\n          ? '-1'\n          : '0'\n      );\n    }\n  }\n\n  render() {\n    const { selected, selectionName, selectionValue, selectionIconTitle } =\n      this;\n    if (selectionName) {\n      // \"Selected\" style with `.${prefix}--structured-list-td` does not work somehow - Need investigation\n      return html`\n        <slot></slot>\n        <input\n          id=\"input\"\n          type=\"radio\"\n          class=\"${prefix}--structured-list-input ${prefix}--visually-hidden\"\n          .checked=${selected}\n          name=${selectionName}\n          value=${ifDefined(selectionValue)} />\n        <div\n          class=\"${prefix}--structured-list-td ${prefix}--structured-list-cell\">\n          ${iconLoader(CheckmarkFilled16, {\n            class: `${prefix}--structured-list-svg`,\n            title: selectionIconTitle,\n          })}\n        </div>\n      `;\n    }\n    return html` <slot></slot> `;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSStructuredListRow;\n"],"mappings":"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"}

package/es-custom/components/structured-list/structured-list.js

@@ -8,7 +8,7 @@
 import "../../globals/settings.js";
 import { forEach } from "../../globals/internal/collection-helpers.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import FocusMixin from "../../globals/mixins/focus.js";
 import structured_list_default$1 from "./structured-list.scss.js";
 import { LitElement, html } from "lit";

package/es-custom/components/structured-list/structured-list.js.map

@@ -1 +1 @@
-{"version":3,"file":"structured-list.js","names":["styles","customElement"],"sources":["../../../src/components/structured-list/structured-list.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\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/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { forEach } from '../../globals/internal/collection-helpers';\nimport FocusMixin from '../../globals/mixins/focus';\nimport CDSStructuredListRow from './structured-list-row';\nimport styles from './structured-list.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Structured list wrapper.\n *\n * @element cds-custom-structured-list\n */\n@customElement(`${prefix}-structured-list`)\nclass CDSStructuredList extends FocusMixin(LitElement) {\n  /**\n   * The `name` attribute for the `<input>` for selection.\n   * If present, this structured list will be a selectable one.\n   */\n  @property({ attribute: 'selection-name' })\n  selectionName = '';\n\n  /**\n   * Specify if structured list is condensed, default is false\n   */\n  @property({ type: Boolean, reflect: true })\n  condensed = false;\n\n  /**\n   * Specify if structured list is flush, default is false\n   */\n  @property({ type: Boolean, reflect: true })\n  flush = false;\n\n  connectedCallback() {\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'table');\n    }\n    super.connectedCallback();\n  }\n\n  shouldUpdate(changedProperties) {\n    if (changedProperties.has('selectionName')) {\n      // Propagate `selectionName` attribute to descendants until `:host-context()` gets supported in all major browsers\n      forEach(\n        this.querySelectorAll(\n          (this.constructor as typeof CDSStructuredList).selectorRowsWithHeader\n        ),\n        (elem) => {\n          (elem as CDSStructuredListRow).selectionName = this.selectionName;\n        }\n      );\n    }\n    return true;\n  }\n\n  updated(changedProperties) {\n    const attributes = ['condensed', 'flush'];\n    attributes.forEach((attr) => {\n      if (changedProperties.has(attr)) {\n        // Propagate watched attribute to descendants until `:host-context()` gets supported in all major browsers\n        forEach(\n          this.querySelectorAll(\n            (this.constructor as typeof CDSStructuredList)\n              .selectorRowsWithHeader\n          ),\n          (elem) => {\n            if (this[`${attr}`]) {\n              elem.setAttribute(attr, '');\n            } else {\n              elem.removeAttribute(attr);\n            }\n          }\n        );\n      }\n    });\n  }\n\n  render() {\n    const { condensed, flush, selectionName } = this;\n    const classes = classMap({\n      [`${prefix}--structured-list`]: true,\n      [`${prefix}--structured-list--selection`]: Boolean(selectionName),\n      [`${prefix}--structured-list--condensed`]: condensed,\n      [`${prefix}--structured-list--flush`]: flush,\n    });\n    return html`\n      <section id=\"section\" class=${classes}><slot></slot></section>\n    `;\n  }\n\n  /**\n   * The CSS selector to find the rows, including header rows.\n   */\n  static selectorRowsWithHeader = `${prefix}-structured-list-row,${prefix}-structured-list-header-row`;\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles;\n}\n\nexport default CDSStructuredList;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBA,IAAA,oBAAA,MACM,0BAA0B,WAAW,WAAW,CAAC;;;uBAMrC;mBAMJ;eAMJ;;CAER,oBAAoB;AAClB,MAAI,CAAC,KAAK,aAAa,OAAO,CAC5B,MAAK,aAAa,QAAQ,QAAQ;AAEpC,QAAM,mBAAmB;;CAG3B,aAAa,mBAAmB;AAC9B,MAAI,kBAAkB,IAAI,gBAAgB,CAExC,SACE,KAAK,iBACF,KAAK,YAAyC,uBAChD,GACA,SAAS;AACP,QAA8B,gBAAgB,KAAK;IAEvD;AAEH,SAAO;;CAGT,QAAQ,mBAAmB;AACN,GAAC,aAAa,QAAQ,CAC9B,SAAS,SAAS;AAC3B,OAAI,kBAAkB,IAAI,KAAK,CAE7B,SACE,KAAK,iBACF,KAAK,YACH,uBACJ,GACA,SAAS;AACR,QAAI,KAAK,GAAG,QACV,MAAK,aAAa,MAAM,GAAG;QAE3B,MAAK,gBAAgB,KAAK;KAG/B;IAEH;;CAGJ,SAAS;EACP,MAAM,EAAE,WAAW,OAAO,kBAAkB;AAO5C,SAAO,IAAI;oCANK,SAAS;IACtB,yBAA+B;IAC/B,oCAA0C,QAAQ,cAAc;IAChE,oCAA0C;IAC1C,gCAAsC;GACxC,CAAC,CAEsC;;;;gCAOV;;;2BACL;GACzB,GAAG,WAAW;GACd,gBAAgB;GACjB;;;gBACeA;;;YAhFf,SAAS,EAAE,WAAW,kBAAkB,CAAC,CAAA,EAAA,kBAAA,WAAA,iBAAA,KAAA,EAAA;YAMzC,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,aAAA,KAAA,EAAA;YAM1C,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,kBAAA,WAAA,SAAA,KAAA,EAAA;gCAlB5CC,cAAc,sBAA4B,CAAA,EAAA,kBAAA;AAyF3C,IAAA,0BAAe"}
+{"version":3,"file":"structured-list.js","names":["styles","customElement"],"sources":["../../../src/components/structured-list/structured-list.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\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/directives/class-map.js';\nimport { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { forEach } from '../../globals/internal/collection-helpers';\nimport FocusMixin from '../../globals/mixins/focus';\nimport CDSStructuredListRow from './structured-list-row';\nimport styles from './structured-list.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Structured list wrapper.\n *\n * @element cds-custom-structured-list\n */\n@customElement(`${prefix}-structured-list`)\nclass CDSStructuredList extends FocusMixin(LitElement) {\n  /**\n   * The `name` attribute for the `<input>` for selection.\n   * If present, this structured list will be a selectable one.\n   */\n  @property({ attribute: 'selection-name' })\n  selectionName = '';\n\n  /**\n   * Specify if structured list is condensed, default is false\n   */\n  @property({ type: Boolean, reflect: true })\n  condensed = false;\n\n  /**\n   * Specify if structured list is flush, default is false\n   */\n  @property({ type: Boolean, reflect: true })\n  flush = false;\n\n  connectedCallback() {\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'table');\n    }\n    super.connectedCallback();\n  }\n\n  shouldUpdate(changedProperties) {\n    if (changedProperties.has('selectionName')) {\n      // Propagate `selectionName` attribute to descendants until `:host-context()` gets supported in all major browsers\n      forEach(\n        this.querySelectorAll(\n          (this.constructor as typeof CDSStructuredList).selectorRowsWithHeader\n        ),\n        (elem) => {\n          (elem as CDSStructuredListRow).selectionName = this.selectionName;\n        }\n      );\n    }\n    return true;\n  }\n\n  updated(changedProperties) {\n    const attributes = ['condensed', 'flush'];\n    attributes.forEach((attr) => {\n      if (changedProperties.has(attr)) {\n        // Propagate watched attribute to descendants until `:host-context()` gets supported in all major browsers\n        forEach(\n          this.querySelectorAll(\n            (this.constructor as typeof CDSStructuredList)\n              .selectorRowsWithHeader\n          ),\n          (elem) => {\n            if (this[`${attr}`]) {\n              elem.setAttribute(attr, '');\n            } else {\n              elem.removeAttribute(attr);\n            }\n          }\n        );\n      }\n    });\n  }\n\n  render() {\n    const { condensed, flush, selectionName } = this;\n    const classes = classMap({\n      [`${prefix}--structured-list`]: true,\n      [`${prefix}--structured-list--selection`]: Boolean(selectionName),\n      [`${prefix}--structured-list--condensed`]: condensed,\n      [`${prefix}--structured-list--flush`]: flush,\n    });\n    return html`\n      <section id=\"section\" class=${classes}><slot></slot></section>\n    `;\n  }\n\n  /**\n   * The CSS selector to find the rows, including header rows.\n   */\n  static selectorRowsWithHeader = `${prefix}-structured-list-row,${prefix}-structured-list-header-row`;\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n  static styles = styles;\n}\n\nexport default CDSStructuredList;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsBA,IAAA,oBAAA,MACM,0BAA0B,WAAW,UAAU,CAAC,CAAC;;;uBAMrC;mBAMJ;eAMJ;;CAER,oBAAoB;EAClB,IAAI,CAAC,KAAK,aAAa,MAAM,GAC3B,KAAK,aAAa,QAAQ,OAAO;EAEnC,MAAM,kBAAkB;CAC1B;CAEA,aAAa,mBAAmB;EAC9B,IAAI,kBAAkB,IAAI,eAAe,GAEvC,QACE,KAAK,iBACF,KAAK,YAAyC,sBACjD,IACC,SAAS;GACR,KAA+B,gBAAgB,KAAK;EACtD,CACF;EAEF,OAAO;CACT;CAEA,QAAQ,mBAAmB;EAEzB,CADoB,aAAa,OACxB,CAAC,CAAC,SAAS,SAAS;GAC3B,IAAI,kBAAkB,IAAI,IAAI,GAE5B,QACE,KAAK,iBACF,KAAK,YACH,sBACL,IACC,SAAS;IACR,IAAI,KAAK,GAAG,SACV,KAAK,aAAa,MAAM,EAAE;SAE1B,KAAK,gBAAgB,IAAI;GAE7B,CACF;EAEJ,CAAC;CACH;CAEA,SAAS;EACP,MAAM,EAAE,WAAW,OAAO,kBAAkB;EAO5C,OAAO,IAAI;oCANK,SAAS;IACtB,yBAA+B;IAC/B,oCAA0C,QAAQ,aAAa;IAC/D,oCAA0C;IAC1C,gCAAsC;EACzC,CAEsC,EAAE;;CAE1C;;gCAKgC;;;2BACL;GACzB,GAAG,WAAW;GACd,gBAAgB;EAClB;;;gBACgBA;;AAClB;YAjFG,SAAS,EAAE,WAAW,iBAAiB,CAAC,CAAA,GAAA,kBAAA,WAAA,iBAAA,KAAA,CAAA;YAMxC,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,kBAAA,WAAA,aAAA,KAAA,CAAA;YAMzC,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,kBAAA,WAAA,SAAA,KAAA,CAAA;gCAlB3CC,cAAc,qBAA2B,CAAA,GAAA,iBAAA;AAyF1C,IAAA,0BAAe"}

package/es-custom/components/tabs/defs.js.map

@@ -1 +1 @@
-{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/tabs/defs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2020, 2026\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\n/**\n * The keyboard action categories for dropdown.\n */\nexport enum TABS_KEYBOARD_ACTION {\n  /**\n   * Not doing any action.\n   */\n  NONE = 'none',\n\n  /**\n   * Keyboard action to navigate back/forward.\n   */\n  NAVIGATING = 'navigating',\n\n  /**\n   * Keyboard action to Enter/Space.\n   */\n  ACTIVATING = 'activating',\n\n  /**\n   * Keyboard action to navigate to first tab using home key\n   */\n  HOME = 'home',\n\n  /**\n   * Keyboard action to navigate to last tab using end key\n   */\n  END = 'end',\n}\n\n/**\n * Tabs types.\n */\nexport enum TABS_TYPE {\n  /**\n   * Regular tabs.\n   */\n  REGULAR = '',\n\n  /**\n   * Container type.\n   */\n  CONTAINER = 'container',\n\n  /**\n   * Contained type.\n   */\n  CONTAINED = 'contained',\n}\n\n/**\n * Vertical navigation direction, associated with key symbols.\n */\nexport const VERTICAL_NAVIGATION_DIRECTION = {\n  Up: -1,\n  ArrowUp: -1,\n  Down: 1,\n  ArrowDown: 1,\n};\n\n/**\n * Tabs icon sizes.\n */\nexport enum TABS_ICON_SIZE {\n  /**\n   * Default icon size.\n   */\n  DEFAULT = 'default',\n\n  /**\n   * Large icon size.\n   */\n  LARGE = 'lg',\n}\n\n/**\n * Tabs size.\n */\nexport enum TABS_SIZE {\n  /**\n   * Small size.\n   */\n  SMALL = 'sm',\n\n  /**\n   * Medium size.\n   */\n  MEDIUM = 'md',\n\n  /**\n   * Large size.\n   */\n  LARGE = 'lg',\n\n  /**\n   * Extra large size.\n   */\n  EXTRA_LARGE = 'xl',\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAY,uBAAL,yBAAA,sBAAA;;;;AAIL,sBAAA,UAAA;;;;AAKA,sBAAA,gBAAA;;;;AAKA,sBAAA,gBAAA;;;;AAKA,sBAAA,UAAA;;;;AAKA,sBAAA,SAAA;;KACD;;;;AAKD,IAAY,YAAL,yBAAA,WAAA;;;;AAIL,WAAA,aAAA;;;;AAKA,WAAA,eAAA;;;;AAKA,WAAA,eAAA;;KACD;;;;AAKD,MAAa,gCAAgC;CAC3C,IAAI;CACJ,SAAS;CACT,MAAM;CACN,WAAW;CACZ;;;;AAKD,IAAY,iBAAL,yBAAA,gBAAA;;;;AAIL,gBAAA,aAAA;;;;AAKA,gBAAA,WAAA;;KACD;;;;AAKD,IAAY,YAAL,yBAAA,WAAA;;;;AAIL,WAAA,WAAA;;;;AAKA,WAAA,YAAA;;;;AAKA,WAAA,WAAA;;;;AAKA,WAAA,iBAAA;;KACD"}
+{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/tabs/defs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2020, 2026\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\n/**\n * The keyboard action categories for dropdown.\n */\nexport enum TABS_KEYBOARD_ACTION {\n  /**\n   * Not doing any action.\n   */\n  NONE = 'none',\n\n  /**\n   * Keyboard action to navigate back/forward.\n   */\n  NAVIGATING = 'navigating',\n\n  /**\n   * Keyboard action to Enter/Space.\n   */\n  ACTIVATING = 'activating',\n\n  /**\n   * Keyboard action to navigate to first tab using home key\n   */\n  HOME = 'home',\n\n  /**\n   * Keyboard action to navigate to last tab using end key\n   */\n  END = 'end',\n}\n\n/**\n * Tabs types.\n */\nexport enum TABS_TYPE {\n  /**\n   * Regular tabs.\n   */\n  REGULAR = '',\n\n  /**\n   * Container type.\n   */\n  CONTAINER = 'container',\n\n  /**\n   * Contained type.\n   */\n  CONTAINED = 'contained',\n}\n\n/**\n * Vertical navigation direction, associated with key symbols.\n */\nexport const VERTICAL_NAVIGATION_DIRECTION = {\n  Up: -1,\n  ArrowUp: -1,\n  Down: 1,\n  ArrowDown: 1,\n};\n\n/**\n * Tabs icon sizes.\n */\nexport enum TABS_ICON_SIZE {\n  /**\n   * Default icon size.\n   */\n  DEFAULT = 'default',\n\n  /**\n   * Large icon size.\n   */\n  LARGE = 'lg',\n}\n\n/**\n * Tabs size.\n */\nexport enum TABS_SIZE {\n  /**\n   * Small size.\n   */\n  SMALL = 'sm',\n\n  /**\n   * Medium size.\n   */\n  MEDIUM = 'md',\n\n  /**\n   * Large size.\n   */\n  LARGE = 'lg',\n\n  /**\n   * Extra large size.\n   */\n  EXTRA_LARGE = 'xl',\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAY,uBAAL,yBAAA,sBAAA;;;;CAIL,qBAAA,UAAA;;;;CAKA,qBAAA,gBAAA;;;;CAKA,qBAAA,gBAAA;;;;CAKA,qBAAA,UAAA;;;;CAKA,qBAAA,SAAA;;AACF,EAAA,CAAA,CAAA;;;;AAKA,IAAY,YAAL,yBAAA,WAAA;;;;CAIL,UAAA,aAAA;;;;CAKA,UAAA,eAAA;;;;CAKA,UAAA,eAAA;;AACF,EAAA,CAAA,CAAA;;;;AAKA,MAAa,gCAAgC;CAC3C,IAAI;CACJ,SAAS;CACT,MAAM;CACN,WAAW;AACb;;;;AAKA,IAAY,iBAAL,yBAAA,gBAAA;;;;CAIL,eAAA,aAAA;;;;CAKA,eAAA,WAAA;;AACF,EAAA,CAAA,CAAA;;;;AAKA,IAAY,YAAL,yBAAA,WAAA;;;;CAIL,UAAA,WAAA;;;;CAKA,UAAA,YAAA;;;;CAKA,UAAA,WAAA;;;;CAKA,UAAA,iBAAA;;AACF,EAAA,CAAA,CAAA"}

package/es-custom/components/tabs/stories/tabs-wrapper.js

@@ -7,7 +7,7 @@
 
 import "../../../globals/settings.js";
 import { carbonElement } from "../../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import iconLoader from "../../../globals/internal/icon-loader.js";
 import "../../button/index.js";
 import "../defs.js";

package/es-custom/components/tabs/stories/tabs-wrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs-wrapper.js","names":["customElement"],"sources":["../../../../src/components/tabs/stories/tabs-wrapper.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2026\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 } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { carbonElement as customElement } from '../../../globals/decorators/carbon-element';\nimport { prefix } from '../../../globals/settings';\nimport { TABS_TYPE } from '../tabs';\nimport { TABS_SIZE } from '../defs';\nimport { iconLoader } from '../../../globals/internal/icon-loader';\nimport Dashboard16 from '@carbon/icons/es/dashboard/16.js';\nimport CloudMonitoring16 from '@carbon/icons/es/cloud--monitoring/16.js';\nimport Activity16 from '@carbon/icons/es/activity/16.js';\nimport Settings16 from '@carbon/icons/es/settings/16.js';\nimport '../../button';\n\n/**\n * Wrapper component for dismissable tabs story with state management\n */\n@customElement('tabs-story-wrapper')\nexport class DismissableTabsWrapper extends LitElement {\n  /**\n   * Whether to render tabs with icons\n   */\n  @property({ type: Boolean, attribute: 'with-icons' })\n  withIcons = false;\n\n  private _defaultTabs = [\n    { id: 'all', label: 'Dashboard', value: 'all', icon: Dashboard16 },\n    {\n      id: 'cloudFoundry',\n      label: 'Monitoring',\n      value: 'cloudFoundry',\n      icon: CloudMonitoring16,\n    },\n    { id: 'staging', label: 'Activity', value: 'staging', icon: Activity16 },\n    {\n      id: 'dea',\n      label: 'Settings',\n      value: 'dea',\n      disabled: true,\n      icon: Settings16,\n    },\n  ];\n  /**\n   * Array of tab configurations\n   */\n  @state()\n  private _tabs = this._defaultTabs;\n\n  /**\n   * Whether tabs are disabled\n   */\n  @property({ type: Boolean })\n  disabled = false;\n\n  /**\n   * Whether tabs are contained\n   */\n  @property({ type: Boolean })\n  contained = false;\n  /**\n   * Whether the rendered Tab children should be dismissable.\n   */\n  @property({ type: Boolean })\n  dismissable = true;\n\n  /**\n   * Selection mode\n   */\n  @property({ attribute: 'selection-mode' })\n  selectionMode = 'automatic';\n\n  /**\n   * Selected index for the initially selected content\n   */\n  @property({ attribute: 'selected-index' })\n  selectedIndex = 0;\n\n  /**\n   * Size of the tabs\n   */\n  @property({ reflect: true })\n  size?: TABS_SIZE;\n\n  /**\n   * Handle tab dismissed event\n   */\n  private _handleDismissed(event: CustomEvent) {\n    const { index } = event.detail;\n    this._tabs = this._tabs.filter((_, i) => i !== index);\n  }\n\n  /**\n   * Handle before selected event\n   */\n  private _handleBeforeSelected(event: CustomEvent) {\n    if (this.disabled) {\n      event.preventDefault();\n    }\n  }\n\n  private resetTabs() {\n    this._tabs = [...this._defaultTabs];\n  }\n\n  render() {\n    const { resetTabs } = this;\n    const size =\n      this.size || (this.contained ? TABS_SIZE.LARGE : TABS_SIZE.MEDIUM);\n\n    return html`\n      <cds-custom-button style=\"margin-bottom: 3rem\" @click=\"${resetTabs}\">\n        Reset\n      </cds-custom-button>\n      <cds-custom-tabs\n        ?disabled=\"${this.disabled}\"\n        selection-mode=\"${this.selectionMode}\"\n        selected-index=\"${this.selectedIndex}\"\n        type=\"${this.contained ? TABS_TYPE.CONTAINED : TABS_TYPE.REGULAR}\"\n        ?dismissable=\"${this.dismissable}\"\n        size=\"${size}\"\n        value=\"all\"\n        @cds-custom-tab-closed=\"${this._handleDismissed}\"\n        @cds-custom-tabs-beingselected=\"${this._handleBeforeSelected}\">\n        ${this._tabs.map(\n          (tab) => html`\n            <cds-custom-tab\n              id=\"tab-${tab.id}\"\n              target=\"panel-${tab.id}\"\n              value=\"${tab.value}\"\n              ?disabled=\"${tab.disabled}\">\n              ${this.withIcons ? iconLoader(tab.icon) : ''} ${tab.label}\n            </cds-custom-tab>\n          `\n        )}\n      </cds-custom-tabs>\n      <div class=\"${prefix}-ce-demo-devenv--tab-panels\">\n        ${this._tabs.map(\n          (tab) => html`\n            <div\n              id=\"panel-${tab.id}\"\n              role=\"tabpanel\"\n              aria-labelledby=\"tab-${tab.id}\"\n              hidden>\n              ${tab.label}\n            </div>\n          `\n        )}\n      </div>\n    `;\n  }\n\n  /**\n   * Disable shadow DOM to inherit styles from parent\n   */\n  createRenderRoot() {\n    return this;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBO,IAAA,yBAAA,MAAM,+BAA+B,WAAW;;;mBAKzC;sBAEW;GACrB;IAAE,IAAI;IAAO,OAAO;IAAa,OAAO;IAAO,MAAM;IAAa;GAClE;IACE,IAAI;IACJ,OAAO;IACP,OAAO;IACP,MAAM;IACP;GACD;IAAE,IAAI;IAAW,OAAO;IAAY,OAAO;IAAW,MAAM;IAAY;GACxE;IACE,IAAI;IACJ,OAAO;IACP,OAAO;IACP,UAAU;IACV,MAAM;IACP;GACF;eAKe,KAAK;kBAMV;mBAMC;qBAKE;uBAME;uBAMA;;;;;CAWhB,iBAAyB,OAAoB;EAC3C,MAAM,EAAE,UAAU,MAAM;AACxB,OAAK,QAAQ,KAAK,MAAM,QAAQ,GAAG,MAAM,MAAM,MAAM;;;;;CAMvD,sBAA8B,OAAoB;AAChD,MAAI,KAAK,SACP,OAAM,gBAAgB;;CAI1B,YAAoB;AAClB,OAAK,QAAQ,CAAC,GAAG,KAAK,aAAa;;CAGrC,SAAS;EACP,MAAM,EAAE,cAAc;EACtB,MAAM,OACJ,KAAK,SAAS,KAAK,YAAA,OAAA;AAErB,SAAO,IAAI;wDACyC,UAAU;;;;qBAI7C,KAAK,SAAS;0BACT,KAAK,cAAc;0BACnB,KAAK,cAAc;gBAC7B,KAAK,YAAA,cAAA,GAAoD;wBACjD,KAAK,YAAY;gBACzB,KAAK;;2BAEM,KAAK,iBAAiB;mCACd,KAAK,sBAAsB;UACpD,KAAK,MAAM,KACV,QAAQ,IAAI;;wBAEC,IAAI,GAAG;8BACD,IAAI,GAAG;uBACd,IAAI,MAAM;2BACN,IAAI,SAAS;gBACxB,KAAK,YAAY,WAAW,IAAI,KAAK,GAAG,GAAG,GAAG,IAAI,MAAM;;YAG/D,CAAC;;0BAEiB;UACjB,KAAK,MAAM,KACV,QAAQ,IAAI;;0BAEG,IAAI,GAAG;;qCAEI,IAAI,GAAG;;gBAE5B,IAAI,MAAM;;YAGjB,CAAC;;;;;;;CAQR,mBAAmB;AACjB,SAAO;;;YArIR,SAAS;CAAE,MAAM;CAAS,WAAW;CAAc,CAAC,CAAA,EAAA,uBAAA,WAAA,aAAA,KAAA,EAAA;YAuBpD,OAAO,CAAA,EAAA,uBAAA,WAAA,SAAA,KAAA,EAAA;YAMP,SAAS,EAAE,MAAM,SAAS,CAAC,CAAA,EAAA,uBAAA,WAAA,YAAA,KAAA,EAAA;YAM3B,SAAS,EAAE,MAAM,SAAS,CAAC,CAAA,EAAA,uBAAA,WAAA,aAAA,KAAA,EAAA;YAK3B,SAAS,EAAE,MAAM,SAAS,CAAC,CAAA,EAAA,uBAAA,WAAA,eAAA,KAAA,EAAA;YAM3B,SAAS,EAAE,WAAW,kBAAkB,CAAC,CAAA,EAAA,uBAAA,WAAA,iBAAA,KAAA,EAAA;YAMzC,SAAS,EAAE,WAAW,kBAAkB,CAAC,CAAA,EAAA,uBAAA,WAAA,iBAAA,KAAA,EAAA;YAMzC,SAAS,EAAE,SAAS,MAAM,CAAC,CAAA,EAAA,uBAAA,WAAA,QAAA,KAAA,EAAA;qCA/D7BA,cAAc,qBAAqB,CAAA,EAAA,uBAAA"}
+{"version":3,"file":"tabs-wrapper.js","names":["customElement"],"sources":["../../../../src/components/tabs/stories/tabs-wrapper.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2026\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 } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { carbonElement as customElement } from '../../../globals/decorators/carbon-element';\nimport { prefix } from '../../../globals/settings';\nimport { TABS_TYPE } from '../tabs';\nimport { TABS_SIZE } from '../defs';\nimport { iconLoader } from '../../../globals/internal/icon-loader';\nimport Dashboard16 from '@carbon/icons/es/dashboard/16.js';\nimport CloudMonitoring16 from '@carbon/icons/es/cloud--monitoring/16.js';\nimport Activity16 from '@carbon/icons/es/activity/16.js';\nimport Settings16 from '@carbon/icons/es/settings/16.js';\nimport '../../button';\n\n/**\n * Wrapper component for dismissable tabs story with state management\n */\n@customElement('tabs-story-wrapper')\nexport class DismissableTabsWrapper extends LitElement {\n  /**\n   * Whether to render tabs with icons\n   */\n  @property({ type: Boolean, attribute: 'with-icons' })\n  withIcons = false;\n\n  private _defaultTabs = [\n    { id: 'all', label: 'Dashboard', value: 'all', icon: Dashboard16 },\n    {\n      id: 'cloudFoundry',\n      label: 'Monitoring',\n      value: 'cloudFoundry',\n      icon: CloudMonitoring16,\n    },\n    { id: 'staging', label: 'Activity', value: 'staging', icon: Activity16 },\n    {\n      id: 'dea',\n      label: 'Settings',\n      value: 'dea',\n      disabled: true,\n      icon: Settings16,\n    },\n  ];\n  /**\n   * Array of tab configurations\n   */\n  @state()\n  private _tabs = this._defaultTabs;\n\n  /**\n   * Whether tabs are disabled\n   */\n  @property({ type: Boolean })\n  disabled = false;\n\n  /**\n   * Whether tabs are contained\n   */\n  @property({ type: Boolean })\n  contained = false;\n  /**\n   * Whether the rendered Tab children should be dismissable.\n   */\n  @property({ type: Boolean })\n  dismissable = true;\n\n  /**\n   * Selection mode\n   */\n  @property({ attribute: 'selection-mode' })\n  selectionMode = 'automatic';\n\n  /**\n   * Selected index for the initially selected content\n   */\n  @property({ attribute: 'selected-index' })\n  selectedIndex = 0;\n\n  /**\n   * Size of the tabs\n   */\n  @property({ reflect: true })\n  size?: TABS_SIZE;\n\n  /**\n   * Handle tab dismissed event\n   */\n  private _handleDismissed(event: CustomEvent) {\n    const { index } = event.detail;\n    this._tabs = this._tabs.filter((_, i) => i !== index);\n  }\n\n  /**\n   * Handle before selected event\n   */\n  private _handleBeforeSelected(event: CustomEvent) {\n    if (this.disabled) {\n      event.preventDefault();\n    }\n  }\n\n  private resetTabs() {\n    this._tabs = [...this._defaultTabs];\n  }\n\n  render() {\n    const { resetTabs } = this;\n    const size =\n      this.size || (this.contained ? TABS_SIZE.LARGE : TABS_SIZE.MEDIUM);\n\n    return html`\n      <cds-custom-button style=\"margin-bottom: 3rem\" @click=\"${resetTabs}\">\n        Reset\n      </cds-custom-button>\n      <cds-custom-tabs\n        ?disabled=\"${this.disabled}\"\n        selection-mode=\"${this.selectionMode}\"\n        selected-index=\"${this.selectedIndex}\"\n        type=\"${this.contained ? TABS_TYPE.CONTAINED : TABS_TYPE.REGULAR}\"\n        ?dismissable=\"${this.dismissable}\"\n        size=\"${size}\"\n        value=\"all\"\n        @cds-custom-tab-closed=\"${this._handleDismissed}\"\n        @cds-custom-tabs-beingselected=\"${this._handleBeforeSelected}\">\n        ${this._tabs.map(\n          (tab) => html`\n            <cds-custom-tab\n              id=\"tab-${tab.id}\"\n              target=\"panel-${tab.id}\"\n              value=\"${tab.value}\"\n              ?disabled=\"${tab.disabled}\">\n              ${this.withIcons ? iconLoader(tab.icon) : ''} ${tab.label}\n            </cds-custom-tab>\n          `\n        )}\n      </cds-custom-tabs>\n      <div class=\"${prefix}-ce-demo-devenv--tab-panels\">\n        ${this._tabs.map(\n          (tab) => html`\n            <div\n              id=\"panel-${tab.id}\"\n              role=\"tabpanel\"\n              aria-labelledby=\"tab-${tab.id}\"\n              hidden>\n              ${tab.label}\n            </div>\n          `\n        )}\n      </div>\n    `;\n  }\n\n  /**\n   * Disable shadow DOM to inherit styles from parent\n   */\n  createRenderRoot() {\n    return this;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAwBO,IAAA,yBAAA,MAAM,+BAA+B,WAAW;;;mBAKzC;sBAEW;GACrB;IAAE,IAAI;IAAO,OAAO;IAAa,OAAO;IAAO,MAAM;GAAY;GACjE;IACE,IAAI;IACJ,OAAO;IACP,OAAO;IACP,MAAM;GACR;GACA;IAAE,IAAI;IAAW,OAAO;IAAY,OAAO;IAAW,MAAM;GAAW;GACvE;IACE,IAAI;IACJ,OAAO;IACP,OAAO;IACP,UAAU;IACV,MAAM;GACR;EACF;eAKgB,KAAK;kBAMV;mBAMC;qBAKE;uBAME;uBAMA;;;;;CAWhB,iBAAyB,OAAoB;EAC3C,MAAM,EAAE,UAAU,MAAM;EACxB,KAAK,QAAQ,KAAK,MAAM,QAAQ,GAAG,MAAM,MAAM,KAAK;CACtD;;;;CAKA,sBAA8B,OAAoB;EAChD,IAAI,KAAK,UACP,MAAM,eAAe;CAEzB;CAEA,YAAoB;EAClB,KAAK,QAAQ,CAAC,GAAG,KAAK,YAAY;CACpC;CAEA,SAAS;EACP,MAAM,EAAE,cAAc;EACtB,MAAM,OACJ,KAAK,SAAS,KAAK,YAAA,OAAA;EAErB,OAAO,IAAI;wDACyC,UAAU;;;;qBAI7C,KAAK,SAAS;0BACT,KAAK,cAAc;0BACnB,KAAK,cAAc;gBAC7B,KAAK,YAAA,cAAA,GAAoD;wBACjD,KAAK,YAAY;gBACzB,KAAK;;2BAEM,KAAK,iBAAiB;mCACd,KAAK,sBAAsB;UACpD,KAAK,MAAM,KACV,QAAQ,IAAI;;wBAEC,IAAI,GAAG;8BACD,IAAI,GAAG;uBACd,IAAI,MAAM;2BACN,IAAI,SAAS;gBACxB,KAAK,YAAY,WAAW,IAAI,IAAI,IAAI,GAAG,GAAG,IAAI,MAAM;;WAGhE,EAAE;;0BAEiB;UACjB,KAAK,MAAM,KACV,QAAQ,IAAI;;0BAEG,IAAI,GAAG;;qCAEI,IAAI,GAAG;;gBAE5B,IAAI,MAAM;;WAGlB,EAAE;;;CAGR;;;;CAKA,mBAAmB;EACjB,OAAO;CACT;AACF;YAvIG,SAAS;CAAE,MAAM;CAAS,WAAW;AAAa,CAAC,CAAA,GAAA,uBAAA,WAAA,aAAA,KAAA,CAAA;YAuBnD,MAAM,CAAA,GAAA,uBAAA,WAAA,SAAA,KAAA,CAAA;YAMN,SAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,GAAA,uBAAA,WAAA,YAAA,KAAA,CAAA;YAM1B,SAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,GAAA,uBAAA,WAAA,aAAA,KAAA,CAAA;YAK1B,SAAS,EAAE,MAAM,QAAQ,CAAC,CAAA,GAAA,uBAAA,WAAA,eAAA,KAAA,CAAA;YAM1B,SAAS,EAAE,WAAW,iBAAiB,CAAC,CAAA,GAAA,uBAAA,WAAA,iBAAA,KAAA,CAAA;YAMxC,SAAS,EAAE,WAAW,iBAAiB,CAAC,CAAA,GAAA,uBAAA,WAAA,iBAAA,KAAA,CAAA;YAMxC,SAAS,EAAE,SAAS,KAAK,CAAC,CAAA,GAAA,uBAAA,WAAA,QAAA,KAAA,CAAA;qCA/D5BA,cAAc,oBAAoB,CAAA,GAAA,sBAAA"}

package/es-custom/components/tabs/tab-skeleton.js

@@ -7,7 +7,7 @@
 
 import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import tabs_default from "./tabs.scss.js";
 import { LitElement, html } from "lit";
 //#region src/components/tabs/tab-skeleton.ts

package/es-custom/components/tabs/tab-skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab-skeleton.js","names":["styles","customElement"],"sources":["../../../src/components/tabs/tab-skeleton.ts"],"sourcesContent":["/**\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 } from 'lit';\nimport { prefix } from '../../globals/settings';\nimport styles from './tabs.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Skeleton of tab.\n *\n * @element cds-custom-tab-skeleton\n */\n@customElement(`${prefix}-tab-skeleton`)\nexport default class CDSTabSkeleton extends LitElement {\n  render() {\n    return html`\n      <div class=\"${prefix}--tabs__nav-link\">\n        <span></span>\n      </div>\n    `;\n  }\n\n  static styles = styles;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAkBe,IAAA,iBAAA,MAAM,uBAAuB,WAAW;CACrD,SAAS;AACP,SAAO,IAAI;0BACY;;;;;;gBAMTA;;;6BAVjBC,cAAc,mBAAyB,CAAA,EAAA,eAAA"}
+{"version":3,"file":"tab-skeleton.js","names":["styles","customElement"],"sources":["../../../src/components/tabs/tab-skeleton.ts"],"sourcesContent":["/**\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 } from 'lit';\nimport { prefix } from '../../globals/settings';\nimport styles from './tabs.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Skeleton of tab.\n *\n * @element cds-custom-tab-skeleton\n */\n@customElement(`${prefix}-tab-skeleton`)\nexport default class CDSTabSkeleton extends LitElement {\n  render() {\n    return html`\n      <div class=\"${prefix}--tabs__nav-link\">\n        <span></span>\n      </div>\n    `;\n  }\n\n  static styles = styles;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAkBe,IAAA,iBAAA,MAAM,uBAAuB,WAAW;CACrD,SAAS;EACP,OAAO,IAAI;0BACY;;;;CAIzB;;gBAEgBA;;AAClB;6BAXCC,cAAc,kBAAwB,CAAA,GAAA,cAAA"}

package/es-custom/components/tabs/tab.js

@@ -7,7 +7,7 @@
 
 import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import iconLoader from "../../globals/internal/icon-loader.js";
 import HostListener from "../../globals/decorators/host-listener.js";
 import HostListenerMixin from "../../globals/mixins/host-listener.js";

package/es-custom/components/tabs/tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.js","names":["CDSContentSwitcherItem","styles","customElement"],"sources":["../../../src/components/tabs/tab.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\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 } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { property, state, query } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport CDSContentSwitcherItem from '../content-switcher/content-switcher-item';\nimport { TABS_ICON_SIZE, TABS_TYPE } from './defs';\nimport styles from './tabs.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport HostListener from '../../globals/decorators/host-listener';\nimport '../button/button';\nimport Close16 from '@carbon/icons/es/close/16.js';\nimport iconLoader from '../../globals/internal/icon-loader';\nimport { classMap } from 'lit/directives/class-map.js';\n\n/**\n * Basic tab.\n *\n * @element cds-custom-tab\n * @fires cds-custom-tab-beingclosed\n *   The custom event fired before a tab is closed upon a user gesture.\n *   Cancellation of this event stops changing the user-initiated action.\n * @fires cds-custom-tab-closed - The custom event fired after a a tab is closed upon a user gesture.\n */\n@customElement(`${prefix}-tab`)\nexport default class CDSTab extends HostListenerMixin(CDSContentSwitcherItem) {\n  /**\n   * `true` if this tab should be highlighted.\n   * If `true`, parent `<cds-custom-tabs>` selects/deselects this tab upon keyboard interaction.\n   *\n   * @private\n   */\n  @property({ type: Boolean, reflect: true })\n  highlighted = false;\n\n  /**\n   * Tab type.\n   */\n  @property({ reflect: true })\n  type = TABS_TYPE.REGULAR;\n\n  /**\n   * `true` if the tab is in vertical orientation.\n   * This is automatically set by the parent `<cds-custom-tabs>` when it's in vertical mode.\n   */\n  @property({ type: Boolean, reflect: true })\n  vertical = false;\n\n  /**\n   * `true` if this tab is icon-only.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'icon-only' })\n  iconOnly = false;\n\n  /**\n   * Specify the icon size used by icon-only tabs.\n   */\n  @property({ attribute: 'icon-size', reflect: true })\n  iconSize?: TABS_ICON_SIZE;\n\n  /**\n   * The tab text content.\n   */\n  @property()\n  tabTitle;\n\n  /**\n   * An optional label to render under the primary tab label.\n   * Only useful for contained tabs.\n   */\n  @property({ attribute: 'secondary-label', reflect: true })\n  secondaryLabel?: string;\n\n  /**\n   * **Experimental**: Display an empty dot badge on the Tab.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'badge-indicator' })\n  badgeIndicator = false;\n\n  /**\n   * `true` if the tab text is truncated with ellipsis.\n   * This state is automatically updated when the component renders in vertical mode.\n   */\n  @state()\n  truncated = false;\n\n  /**\n   * Whether this tab should be dismissable.\n   */\n  @state()\n  _dismissable = false;\n\n  /**\n   * The index of the tab component\n   */\n  @state()\n  _index = -1;\n\n  /**\n   * Reference to the label span element (only present in vertical mode).\n   * @private\n   */\n  @query(`.${prefix}--tabs__nav-item-label`)\n  private _labelElement?: HTMLElement;\n\n  /**\n   * Checks if the text overflow ellipsis is currently applied to the label.\n   * This is useful for determining if a tooltip should be shown.\n   *\n   * @returns `true` if text is truncated/clamped, `false` otherwise or if not in vertical mode\n   */\n  isTextTruncated(): boolean {\n    if (!this.vertical || !this._labelElement) {\n      return false;\n    }\n\n    // Compare scrollHeight with clientHeight to detect if content is overflowing\n    // When line-clamp is active and text exceeds 2 lines, scrollHeight > clientHeight\n    return this._labelElement.scrollHeight > this._labelElement.clientHeight;\n  }\n\n  /**\n   * Updates the truncated state after the component has rendered.\n   */\n  updated(changedProperties: Map<PropertyKey, unknown>) {\n    super.updated(changedProperties);\n\n    // Check if text is truncated and update state when in vertical mode\n    if (this.vertical && this._labelElement) {\n      const isTruncated = this.isTextTruncated();\n      if (this.truncated !== isTruncated) {\n        this.truncated = isTruncated;\n      }\n    }\n  }\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleSlotChange({ target }: Event) {\n    // Retrieve content of the slot to use for aria-label.\n    const content = (target as HTMLSlotElement).assignedNodes();\n    const textContent = content[0]?.textContent;\n    // Normalize whitespace: trim and replace multiple spaces with single space\n    this.tabTitle = textContent?.trim().replace(/\\s+/g, ' ') || undefined;\n  }\n\n  /**\n   * Handles `keydown` event on the tab.\n   * Triggers tab close when Delete key is pressed on a dismissable tab.\n   */\n  @HostListener('keydown')\n  protected _handleKeydown(event: KeyboardEvent) {\n    const { key } = event;\n    if (\n      this._dismissable &&\n      !this.disabled &&\n      (key === 'Delete' || key === 'Backspace')\n    ) {\n      event.preventDefault();\n      this._handleClose(event);\n    }\n  }\n\n  connectedCallback() {\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'listitem');\n    }\n    super.connectedCallback();\n  }\n\n  render() {\n    const navLinkClasses = classMap({\n      [`${prefix}--tabs__nav-link`]: true,\n      [`${prefix}--tabs__nav-link--dismissable`]: this._dismissable,\n    });\n    const closeButtonClasses = classMap({\n      [`${prefix}--tabs__nav-item--close`]: this._dismissable,\n      [`${prefix}--tabs__nav-item--close--hidden`]: !this._dismissable,\n    });\n    const {\n      badgeIndicator,\n      disabled,\n      secondaryLabel,\n      selected,\n      tabTitle,\n      vertical,\n      truncated,\n      _handleSlotChange: handleSlotChange,\n      _handleClick: handleClick,\n    } = this;\n\n    const iconButton = html`\n      <cds-custom-button\n        title=\"${this.textContent?.trim()\n          ? `Remove ${this.textContent.trim()} tab`\n          : 'Remove tab'}\"\n        class=\"${closeButtonClasses}\"\n        kind=\"ghost\"\n        size=\"xs\"\n        @click=\"${handleClick}\"\n        tab-index=\"${-1}\"\n        aria-hidden=\"${this.selected && this._dismissable ? 'false' : 'true'}\"\n        ?disabled=\"${disabled}\">\n        ${iconLoader(Close16, { 'aria-label': 'close', slot: 'icon' })}\n      </cds-custom-button>\n    `;\n\n    const accessibleLabel = tabTitle || this.getAttribute('aria-label');\n    const isIconOnly =\n      this.iconOnly ||\n      this.classList.contains(`${prefix}--tabs__nav-item--icon-only`);\n    // No `href`/`tabindex` to not to make this `<a>` click-focusable\n    const tabLink = html`\n      <a\n        class=\"${navLinkClasses}\"\n        role=\"tab\"\n        aria-label=\"${ifDefined(accessibleLabel || undefined)}\"\n        tabindex=\"${selected ? 0 : -1}\"\n        ?disabled=\"${disabled}\"\n        aria-selected=\"${selected}\">\n        ${vertical\n          ? html`<span\n              class=\"${prefix}--tabs__nav-item-label\"\n              title=\"${truncated ? tabTitle.trim() : ''}\">\n              <slot @slotchange=\"${handleSlotChange}\"></slot>\n            </span>`\n          : html`\n              <span class=\"${prefix}--tabs__nav-item-label-wrapper\">\n                <slot @slotchange=\"${handleSlotChange}\"></slot>\n              </span>\n            `}\n        ${secondaryLabel\n          ? html`<span\n              class=\"${prefix}--tabs__nav-item-secondary-label\"\n              title=\"${secondaryLabel}\"\n              >${secondaryLabel}</span\n            >`\n          : ''}\n        ${!disabled && badgeIndicator\n          ? html`<cds-custom-badge-indicator></cds-custom-badge-indicator>`\n          : ''}\n      </a>\n      ${iconButton}\n    `;\n\n    if (isIconOnly && accessibleLabel && !disabled) {\n      return html`\n        <cds-custom-tooltip align=\"bottom\" class=\"${prefix}--icon-tooltip\">\n          ${tabLink}\n          <cds-custom-tooltip-content>${accessibleLabel}</cds-custom-tooltip-content>\n        </cds-custom-tooltip>\n      `;\n    }\n\n    return tabLink;\n  }\n\n  /**\n   * Handles the close action for the tab.\n   * Dispatches before-close and close events.\n   */\n  protected _handleClose(event: Event) {\n    event.stopPropagation();\n    const init = {\n      bubbles: true,\n      cancelable: true,\n      composed: true,\n      detail: {\n        index: this._index,\n      },\n    };\n    if (\n      this.dispatchEvent(\n        new CustomEvent(\n          (this.constructor as typeof CDSTab).eventBeforeClose,\n          init\n        )\n      )\n    ) {\n      this.dispatchEvent(\n        new CustomEvent((this.constructor as typeof CDSTab).eventClose, init)\n      );\n    }\n  }\n\n  /**\n   * Handles click event on the close button.\n   */\n  _handleClick(event: Event) {\n    this._handleClose(event);\n  }\n\n  /**\n   * The name of the custom event fired before a tab is closed upon a user gesture.\n   * Cancellation of this event stops changing the user-initiated action.\n   */\n  static get eventBeforeClose() {\n    return `${prefix}-tab-beingclosed`;\n  }\n\n  /**\n   * The name of the custom event fired after a a tab is closed upon a user gesture.\n   */\n  static get eventClose() {\n    return `${prefix}-tab-closed`;\n  }\n\n  static styles = styles;\n}\n"],"mappings":"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"}
+{"version":3,"file":"tab.js","names":["CDSContentSwitcherItem","styles","customElement"],"sources":["../../../src/components/tabs/tab.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\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 } from 'lit';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { property, state, query } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport CDSContentSwitcherItem from '../content-switcher/content-switcher-item';\nimport { TABS_ICON_SIZE, TABS_TYPE } from './defs';\nimport styles from './tabs.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport HostListener from '../../globals/decorators/host-listener';\nimport '../button/button';\nimport Close16 from '@carbon/icons/es/close/16.js';\nimport iconLoader from '../../globals/internal/icon-loader';\nimport { classMap } from 'lit/directives/class-map.js';\n\n/**\n * Basic tab.\n *\n * @element cds-custom-tab\n * @fires cds-custom-tab-beingclosed\n *   The custom event fired before a tab is closed upon a user gesture.\n *   Cancellation of this event stops changing the user-initiated action.\n * @fires cds-custom-tab-closed - The custom event fired after a a tab is closed upon a user gesture.\n */\n@customElement(`${prefix}-tab`)\nexport default class CDSTab extends HostListenerMixin(CDSContentSwitcherItem) {\n  /**\n   * `true` if this tab should be highlighted.\n   * If `true`, parent `<cds-custom-tabs>` selects/deselects this tab upon keyboard interaction.\n   *\n   * @private\n   */\n  @property({ type: Boolean, reflect: true })\n  highlighted = false;\n\n  /**\n   * Tab type.\n   */\n  @property({ reflect: true })\n  type = TABS_TYPE.REGULAR;\n\n  /**\n   * `true` if the tab is in vertical orientation.\n   * This is automatically set by the parent `<cds-custom-tabs>` when it's in vertical mode.\n   */\n  @property({ type: Boolean, reflect: true })\n  vertical = false;\n\n  /**\n   * `true` if this tab is icon-only.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'icon-only' })\n  iconOnly = false;\n\n  /**\n   * Specify the icon size used by icon-only tabs.\n   */\n  @property({ attribute: 'icon-size', reflect: true })\n  iconSize?: TABS_ICON_SIZE;\n\n  /**\n   * The tab text content.\n   */\n  @property()\n  tabTitle;\n\n  /**\n   * An optional label to render under the primary tab label.\n   * Only useful for contained tabs.\n   */\n  @property({ attribute: 'secondary-label', reflect: true })\n  secondaryLabel?: string;\n\n  /**\n   * **Experimental**: Display an empty dot badge on the Tab.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'badge-indicator' })\n  badgeIndicator = false;\n\n  /**\n   * `true` if the tab text is truncated with ellipsis.\n   * This state is automatically updated when the component renders in vertical mode.\n   */\n  @state()\n  truncated = false;\n\n  /**\n   * Whether this tab should be dismissable.\n   */\n  @state()\n  _dismissable = false;\n\n  /**\n   * The index of the tab component\n   */\n  @state()\n  _index = -1;\n\n  /**\n   * Reference to the label span element (only present in vertical mode).\n   * @private\n   */\n  @query(`.${prefix}--tabs__nav-item-label`)\n  private _labelElement?: HTMLElement;\n\n  /**\n   * Checks if the text overflow ellipsis is currently applied to the label.\n   * This is useful for determining if a tooltip should be shown.\n   *\n   * @returns `true` if text is truncated/clamped, `false` otherwise or if not in vertical mode\n   */\n  isTextTruncated(): boolean {\n    if (!this.vertical || !this._labelElement) {\n      return false;\n    }\n\n    // Compare scrollHeight with clientHeight to detect if content is overflowing\n    // When line-clamp is active and text exceeds 2 lines, scrollHeight > clientHeight\n    return this._labelElement.scrollHeight > this._labelElement.clientHeight;\n  }\n\n  /**\n   * Updates the truncated state after the component has rendered.\n   */\n  updated(changedProperties: Map<PropertyKey, unknown>) {\n    super.updated(changedProperties);\n\n    // Check if text is truncated and update state when in vertical mode\n    if (this.vertical && this._labelElement) {\n      const isTruncated = this.isTextTruncated();\n      if (this.truncated !== isTruncated) {\n        this.truncated = isTruncated;\n      }\n    }\n  }\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleSlotChange({ target }: Event) {\n    // Retrieve content of the slot to use for aria-label.\n    const content = (target as HTMLSlotElement).assignedNodes();\n    const textContent = content[0]?.textContent;\n    // Normalize whitespace: trim and replace multiple spaces with single space\n    this.tabTitle = textContent?.trim().replace(/\\s+/g, ' ') || undefined;\n  }\n\n  /**\n   * Handles `keydown` event on the tab.\n   * Triggers tab close when Delete key is pressed on a dismissable tab.\n   */\n  @HostListener('keydown')\n  protected _handleKeydown(event: KeyboardEvent) {\n    const { key } = event;\n    if (\n      this._dismissable &&\n      !this.disabled &&\n      (key === 'Delete' || key === 'Backspace')\n    ) {\n      event.preventDefault();\n      this._handleClose(event);\n    }\n  }\n\n  connectedCallback() {\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'listitem');\n    }\n    super.connectedCallback();\n  }\n\n  render() {\n    const navLinkClasses = classMap({\n      [`${prefix}--tabs__nav-link`]: true,\n      [`${prefix}--tabs__nav-link--dismissable`]: this._dismissable,\n    });\n    const closeButtonClasses = classMap({\n      [`${prefix}--tabs__nav-item--close`]: this._dismissable,\n      [`${prefix}--tabs__nav-item--close--hidden`]: !this._dismissable,\n    });\n    const {\n      badgeIndicator,\n      disabled,\n      secondaryLabel,\n      selected,\n      tabTitle,\n      vertical,\n      truncated,\n      _handleSlotChange: handleSlotChange,\n      _handleClick: handleClick,\n    } = this;\n\n    const iconButton = html`\n      <cds-custom-button\n        title=\"${this.textContent?.trim()\n          ? `Remove ${this.textContent.trim()} tab`\n          : 'Remove tab'}\"\n        class=\"${closeButtonClasses}\"\n        kind=\"ghost\"\n        size=\"xs\"\n        @click=\"${handleClick}\"\n        tab-index=\"${-1}\"\n        aria-hidden=\"${this.selected && this._dismissable ? 'false' : 'true'}\"\n        ?disabled=\"${disabled}\">\n        ${iconLoader(Close16, { 'aria-label': 'close', slot: 'icon' })}\n      </cds-custom-button>\n    `;\n\n    const accessibleLabel = tabTitle || this.getAttribute('aria-label');\n    const isIconOnly =\n      this.iconOnly ||\n      this.classList.contains(`${prefix}--tabs__nav-item--icon-only`);\n    // No `href`/`tabindex` to not to make this `<a>` click-focusable\n    const tabLink = html`\n      <a\n        class=\"${navLinkClasses}\"\n        role=\"tab\"\n        aria-label=\"${ifDefined(accessibleLabel || undefined)}\"\n        tabindex=\"${selected ? 0 : -1}\"\n        ?disabled=\"${disabled}\"\n        aria-selected=\"${selected}\">\n        ${vertical\n          ? html`<span\n              class=\"${prefix}--tabs__nav-item-label\"\n              title=\"${truncated ? tabTitle.trim() : ''}\">\n              <slot @slotchange=\"${handleSlotChange}\"></slot>\n            </span>`\n          : html`\n              <span class=\"${prefix}--tabs__nav-item-label-wrapper\">\n                <slot @slotchange=\"${handleSlotChange}\"></slot>\n              </span>\n            `}\n        ${secondaryLabel\n          ? html`<span\n              class=\"${prefix}--tabs__nav-item-secondary-label\"\n              title=\"${secondaryLabel}\"\n              >${secondaryLabel}</span\n            >`\n          : ''}\n        ${!disabled && badgeIndicator\n          ? html`<cds-custom-badge-indicator></cds-custom-badge-indicator>`\n          : ''}\n      </a>\n      ${iconButton}\n    `;\n\n    if (isIconOnly && accessibleLabel && !disabled) {\n      return html`\n        <cds-custom-tooltip align=\"bottom\" class=\"${prefix}--icon-tooltip\">\n          ${tabLink}\n          <cds-custom-tooltip-content>${accessibleLabel}</cds-custom-tooltip-content>\n        </cds-custom-tooltip>\n      `;\n    }\n\n    return tabLink;\n  }\n\n  /**\n   * Handles the close action for the tab.\n   * Dispatches before-close and close events.\n   */\n  protected _handleClose(event: Event) {\n    event.stopPropagation();\n    const init = {\n      bubbles: true,\n      cancelable: true,\n      composed: true,\n      detail: {\n        index: this._index,\n      },\n    };\n    if (\n      this.dispatchEvent(\n        new CustomEvent(\n          (this.constructor as typeof CDSTab).eventBeforeClose,\n          init\n        )\n      )\n    ) {\n      this.dispatchEvent(\n        new CustomEvent((this.constructor as typeof CDSTab).eventClose, init)\n      );\n    }\n  }\n\n  /**\n   * Handles click event on the close button.\n   */\n  _handleClick(event: Event) {\n    this._handleClose(event);\n  }\n\n  /**\n   * The name of the custom event fired before a tab is closed upon a user gesture.\n   * Cancellation of this event stops changing the user-initiated action.\n   */\n  static get eventBeforeClose() {\n    return `${prefix}-tab-beingclosed`;\n  }\n\n  /**\n   * The name of the custom event fired after a a tab is closed upon a user gesture.\n   */\n  static get eventClose() {\n    return `${prefix}-tab-closed`;\n  }\n\n  static styles = styles;\n}\n"],"mappings":"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"}

package/es-custom/components/tabs/tabs-skeleton.js

@@ -7,7 +7,7 @@
 
 import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import tabs_default from "./tabs.scss.js";
 import { LitElement, html } from "lit";
 import { property } from "lit/decorators.js";

package/es-custom/components/tabs/tabs-skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs-skeleton.js","names":["styles","customElement"],"sources":["../../../src/components/tabs/tabs-skeleton.ts"],"sourcesContent":["/**\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 } from 'lit';\nimport { prefix } from '../../globals/settings';\nimport styles from './tabs.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { property } from 'lit/decorators.js';\n\n/**\n * Skeleton of tabs.\n *\n * @element cds-custom-tabs-skeleton\n */\n@customElement(`${prefix}-tabs-skeleton`)\nexport default class CDSTabsSkeleton extends LitElement {\n  /**\n   * Provide the type of Tab\n   */\n  @property({ type: Boolean, reflect: true })\n  contained = false;\n  render() {\n    return html`\n      <ul class=\"${prefix}--tabs__nav\">\n        <slot></slot>\n      </ul>\n    `;\n  }\n\n  static styles = styles;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAmBe,IAAA,kBAAA,MAAM,wBAAwB,WAAW;;;mBAK1C;;CACZ,SAAS;AACP,SAAO,IAAI;yBACW;;;;;;gBAMRA;;;YAVf,SAAS;CAAE,MAAM;CAAS,SAAS;CAAM,CAAC,CAAA,EAAA,gBAAA,WAAA,aAAA,KAAA,EAAA;8BAL5CC,cAAc,oBAA0B,CAAA,EAAA,gBAAA"}
+{"version":3,"file":"tabs-skeleton.js","names":["styles","customElement"],"sources":["../../../src/components/tabs/tabs-skeleton.ts"],"sourcesContent":["/**\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 } from 'lit';\nimport { prefix } from '../../globals/settings';\nimport styles from './tabs.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { property } from 'lit/decorators.js';\n\n/**\n * Skeleton of tabs.\n *\n * @element cds-custom-tabs-skeleton\n */\n@customElement(`${prefix}-tabs-skeleton`)\nexport default class CDSTabsSkeleton extends LitElement {\n  /**\n   * Provide the type of Tab\n   */\n  @property({ type: Boolean, reflect: true })\n  contained = false;\n  render() {\n    return html`\n      <ul class=\"${prefix}--tabs__nav\">\n        <slot></slot>\n      </ul>\n    `;\n  }\n\n  static styles = styles;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAmBe,IAAA,kBAAA,MAAM,wBAAwB,WAAW;;;mBAK1C;;CACZ,SAAS;EACP,OAAO,IAAI;yBACW;;;;CAIxB;;gBAEgBA;;AAClB;YAXG,SAAS;CAAE,MAAM;CAAS,SAAS;AAAK,CAAC,CAAA,GAAA,gBAAA,WAAA,aAAA,KAAA,CAAA;8BAL3CC,cAAc,mBAAyB,CAAA,GAAA,eAAA"}

package/es-custom/components/tabs/tabs-vertical.js

@@ -7,7 +7,7 @@
 
 import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import tabs_default from "./tabs.scss.js";
 import { LitElement, html } from "lit";
 import { property } from "lit/decorators.js";

package/es-custom/components/tabs/tabs-vertical.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs-vertical.js","names":["styles","customElement"],"sources":["../../../src/components/tabs/tabs-vertical.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\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 } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { breakpoints } from '@carbon/layout';\nimport { prefix } from '../../globals/settings';\nimport styles from './tabs.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Breakpoint for switching between horizontal and vertical tab layouts.\n * Uses Carbon's md breakpoint (42rem/672px) + 0.01rem offset to avoid overlap\n * with max-width queries. This mirrors the Sass breakpoint behavior.\n * Below this breakpoint, tabs display horizontally.\n */\nconst VERTICAL_TABS_BREAKPOINT = `(min-width: calc(${breakpoints.md.width} + 0.01rem))`;\n\n/**\n * Vertical tabs container component.\n *\n * @element cds-custom-tabs-vertical\n * @slot tabs - The `<cds-custom-tabs>` navigation element.\n * @slot panel - One or more `<div role=\"tabpanel\">` elements.\n */\n@customElement(`${prefix}-tabs-vertical`)\nexport default class CDSTabsVertical extends LitElement {\n  /**\n   * Option to set a height style only if using vertical variation.\n   */\n  @property({ attribute: 'custom-height' })\n  customHeight?: string;\n\n  private _mediaQueryList: MediaQueryList | null = null;\n\n  private _handleViewportChange = (e: MediaQueryListEvent | MediaQueryList) => {\n    const tabs = this.querySelector(`${prefix}-tabs`);\n    if (e.matches) {\n      this.classList.add(`${prefix}--css-grid`);\n      if (tabs) {\n        tabs.setAttribute('vertical', '');\n        tabs.removeAttribute('type');\n        // Preserve size attribute for vertical tabs to use layout tokens\n        const size = tabs.getAttribute('size');\n        if (size) {\n          tabs.setAttribute('size', size);\n        }\n      }\n    } else {\n      this.classList.remove(`${prefix}--css-grid`);\n      if (tabs) {\n        tabs.removeAttribute('vertical');\n        tabs.setAttribute('type', 'contained');\n      }\n    }\n  };\n\n  firstUpdated() {\n    this._mediaQueryList = window.matchMedia(VERTICAL_TABS_BREAKPOINT);\n    this._handleViewportChange(this._mediaQueryList);\n    this._mediaQueryList.addEventListener('change', this._handleViewportChange);\n\n    requestAnimationFrame(() => {\n      this._applyHeight();\n    });\n\n    const panelSlot = this.shadowRoot?.querySelector('slot[name=\"panel\"]');\n    panelSlot?.addEventListener('slotchange', () => {\n      this._applyHeight();\n    });\n  }\n\n  updated(changedProperties) {\n    super.updated?.(changedProperties);\n    if (changedProperties.has('customHeight')) {\n      this._applyHeight();\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this._mediaQueryList?.removeEventListener(\n      'change',\n      this._handleViewportChange\n    );\n    this._mediaQueryList = null;\n  }\n\n  private _applyHeight() {\n    const isVertical = this.classList.contains(`${prefix}--css-grid`);\n\n    if (this.customHeight) {\n      this.style.height = this.customHeight;\n      return;\n    }\n\n    if (!isVertical) {\n      this.style.removeProperty('height');\n      return;\n    }\n\n    const panels = Array.from(\n      this.querySelectorAll<HTMLElement>('[slot=\"panel\"]')\n    );\n\n    if (panels.length === 0) {\n      return;\n    }\n\n    const hiddenStates = panels.map((panel) => panel.hidden);\n    panels.forEach((panel) => {\n      panel.hidden = false;\n    });\n\n    const tallestPanel = Math.max(...panels.map((panel) => panel.offsetHeight));\n\n    panels.forEach((panel, index) => {\n      panel.hidden = hiddenStates[index];\n    });\n\n    const tabsEl = this.querySelector<HTMLElement>(`${prefix}-tabs`);\n    const tabsHeight = tabsEl?.offsetHeight ?? 0;\n\n    const height = Math.max(tallestPanel, tabsHeight);\n    if (height > 0) {\n      this.style.height = `${height}px`;\n    } else {\n      this.style.removeProperty('height');\n    }\n  }\n\n  render() {\n    return html`\n      <slot name=\"tabs\"></slot>\n      <div class=\"${prefix}-panel-container\">\n        <slot name=\"panel\"></slot>\n      </div>\n    `;\n  }\n\n  static styles = styles;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,MAAM,2BAA2B,oBAAoB,YAAY,GAAG,MAAM;AAU3D,IAAA,kBAAA,MAAM,wBAAwB,WAAW;;;yBAOL;gCAEhB,MAA4C;GAC3E,MAAM,OAAO,KAAK,cAAc,WAAiB;AACjD,OAAI,EAAE,SAAS;AACb,SAAK,UAAU,IAAI,gBAAsB;AACzC,QAAI,MAAM;AACR,UAAK,aAAa,YAAY,GAAG;AACjC,UAAK,gBAAgB,OAAO;KAE5B,MAAM,OAAO,KAAK,aAAa,OAAO;AACtC,SAAI,KACF,MAAK,aAAa,QAAQ,KAAK;;UAG9B;AACL,SAAK,UAAU,OAAO,gBAAsB;AAC5C,QAAI,MAAM;AACR,UAAK,gBAAgB,WAAW;AAChC,UAAK,aAAa,QAAQ,YAAY;;;;;CAK5C,eAAe;AACb,OAAK,kBAAkB,OAAO,WAAW,yBAAyB;AAClE,OAAK,sBAAsB,KAAK,gBAAgB;AAChD,OAAK,gBAAgB,iBAAiB,UAAU,KAAK,sBAAsB;AAE3E,8BAA4B;AAC1B,QAAK,cAAc;IACnB;AAGF,GADkB,KAAK,YAAY,cAAc,uBAAqB,GAC3D,iBAAiB,oBAAoB;AAC9C,QAAK,cAAc;IACnB;;CAGJ,QAAQ,mBAAmB;AACzB,QAAM,UAAU,kBAAkB;AAClC,MAAI,kBAAkB,IAAI,eAAe,CACvC,MAAK,cAAc;;CAIvB,uBAAuB;AACrB,QAAM,sBAAsB;AAC5B,OAAK,iBAAiB,oBACpB,UACA,KAAK,sBACN;AACD,OAAK,kBAAkB;;CAGzB,eAAuB;EACrB,MAAM,aAAa,KAAK,UAAU,SAAS,gBAAsB;AAEjE,MAAI,KAAK,cAAc;AACrB,QAAK,MAAM,SAAS,KAAK;AACzB;;AAGF,MAAI,CAAC,YAAY;AACf,QAAK,MAAM,eAAe,SAAS;AACnC;;EAGF,MAAM,SAAS,MAAM,KACnB,KAAK,iBAA8B,mBAAiB,CACrD;AAED,MAAI,OAAO,WAAW,EACpB;EAGF,MAAM,eAAe,OAAO,KAAK,UAAU,MAAM,OAAO;AACxD,SAAO,SAAS,UAAU;AACxB,SAAM,SAAS;IACf;EAEF,MAAM,eAAe,KAAK,IAAI,GAAG,OAAO,KAAK,UAAU,MAAM,aAAa,CAAC;AAE3E,SAAO,SAAS,OAAO,UAAU;AAC/B,SAAM,SAAS,aAAa;IAC5B;EAGF,MAAM,aADS,KAAK,cAA2B,WAAiB,EACrC,gBAAgB;EAE3C,MAAM,SAAS,KAAK,IAAI,cAAc,WAAW;AACjD,MAAI,SAAS,EACX,MAAK,MAAM,SAAS,GAAG,OAAO;MAE9B,MAAK,MAAM,eAAe,SAAS;;CAIvC,SAAS;AACP,SAAO,IAAI;;0BAEY;;;;;;gBAMTA;;;YA9Gf,SAAS,EAAE,WAAW,iBAAiB,CAAC,CAAA,EAAA,gBAAA,WAAA,gBAAA,KAAA,EAAA;8BAL1CC,cAAc,oBAA0B,CAAA,EAAA,gBAAA"}
+{"version":3,"file":"tabs-vertical.js","names":["styles","customElement"],"sources":["../../../src/components/tabs/tabs-vertical.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\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 } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { breakpoints } from '@carbon/layout';\nimport { prefix } from '../../globals/settings';\nimport styles from './tabs.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\n/**\n * Breakpoint for switching between horizontal and vertical tab layouts.\n * Uses Carbon's md breakpoint (42rem/672px) + 0.01rem offset to avoid overlap\n * with max-width queries. This mirrors the Sass breakpoint behavior.\n * Below this breakpoint, tabs display horizontally.\n */\nconst VERTICAL_TABS_BREAKPOINT = `(min-width: calc(${breakpoints.md.width} + 0.01rem))`;\n\n/**\n * Vertical tabs container component.\n *\n * @element cds-custom-tabs-vertical\n * @slot tabs - The `<cds-custom-tabs>` navigation element.\n * @slot panel - One or more `<div role=\"tabpanel\">` elements.\n */\n@customElement(`${prefix}-tabs-vertical`)\nexport default class CDSTabsVertical extends LitElement {\n  /**\n   * Option to set a height style only if using vertical variation.\n   */\n  @property({ attribute: 'custom-height' })\n  customHeight?: string;\n\n  private _mediaQueryList: MediaQueryList | null = null;\n\n  private _handleViewportChange = (e: MediaQueryListEvent | MediaQueryList) => {\n    const tabs = this.querySelector(`${prefix}-tabs`);\n    if (e.matches) {\n      this.classList.add(`${prefix}--css-grid`);\n      if (tabs) {\n        tabs.setAttribute('vertical', '');\n        tabs.removeAttribute('type');\n        // Preserve size attribute for vertical tabs to use layout tokens\n        const size = tabs.getAttribute('size');\n        if (size) {\n          tabs.setAttribute('size', size);\n        }\n      }\n    } else {\n      this.classList.remove(`${prefix}--css-grid`);\n      if (tabs) {\n        tabs.removeAttribute('vertical');\n        tabs.setAttribute('type', 'contained');\n      }\n    }\n  };\n\n  firstUpdated() {\n    this._mediaQueryList = window.matchMedia(VERTICAL_TABS_BREAKPOINT);\n    this._handleViewportChange(this._mediaQueryList);\n    this._mediaQueryList.addEventListener('change', this._handleViewportChange);\n\n    requestAnimationFrame(() => {\n      this._applyHeight();\n    });\n\n    const panelSlot = this.shadowRoot?.querySelector('slot[name=\"panel\"]');\n    panelSlot?.addEventListener('slotchange', () => {\n      this._applyHeight();\n    });\n  }\n\n  updated(changedProperties) {\n    super.updated?.(changedProperties);\n    if (changedProperties.has('customHeight')) {\n      this._applyHeight();\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this._mediaQueryList?.removeEventListener(\n      'change',\n      this._handleViewportChange\n    );\n    this._mediaQueryList = null;\n  }\n\n  private _applyHeight() {\n    const isVertical = this.classList.contains(`${prefix}--css-grid`);\n\n    if (this.customHeight) {\n      this.style.height = this.customHeight;\n      return;\n    }\n\n    if (!isVertical) {\n      this.style.removeProperty('height');\n      return;\n    }\n\n    const panels = Array.from(\n      this.querySelectorAll<HTMLElement>('[slot=\"panel\"]')\n    );\n\n    if (panels.length === 0) {\n      return;\n    }\n\n    const hiddenStates = panels.map((panel) => panel.hidden);\n    panels.forEach((panel) => {\n      panel.hidden = false;\n    });\n\n    const tallestPanel = Math.max(...panels.map((panel) => panel.offsetHeight));\n\n    panels.forEach((panel, index) => {\n      panel.hidden = hiddenStates[index];\n    });\n\n    const tabsEl = this.querySelector<HTMLElement>(`${prefix}-tabs`);\n    const tabsHeight = tabsEl?.offsetHeight ?? 0;\n\n    const height = Math.max(tallestPanel, tabsHeight);\n    if (height > 0) {\n      this.style.height = `${height}px`;\n    } else {\n      this.style.removeProperty('height');\n    }\n  }\n\n  render() {\n    return html`\n      <slot name=\"tabs\"></slot>\n      <div class=\"${prefix}-panel-container\">\n        <slot name=\"panel\"></slot>\n      </div>\n    `;\n  }\n\n  static styles = styles;\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,MAAM,2BAA2B,oBAAoB,YAAY,GAAG,MAAM;AAU3D,IAAA,kBAAA,MAAM,wBAAwB,WAAW;;;yBAOL;gCAEhB,MAA4C;GAC3E,MAAM,OAAO,KAAK,cAAc,UAAgB;GAChD,IAAI,EAAE,SAAS;IACb,KAAK,UAAU,IAAI,eAAqB;IACxC,IAAI,MAAM;KACR,KAAK,aAAa,YAAY,EAAE;KAChC,KAAK,gBAAgB,MAAM;KAE3B,MAAM,OAAO,KAAK,aAAa,MAAM;KACrC,IAAI,MACF,KAAK,aAAa,QAAQ,IAAI;IAElC;GACF,OAAO;IACL,KAAK,UAAU,OAAO,eAAqB;IAC3C,IAAI,MAAM;KACR,KAAK,gBAAgB,UAAU;KAC/B,KAAK,aAAa,QAAQ,WAAW;IACvC;GACF;EACF;;CAEA,eAAe;EACb,KAAK,kBAAkB,OAAO,WAAW,wBAAwB;EACjE,KAAK,sBAAsB,KAAK,eAAe;EAC/C,KAAK,gBAAgB,iBAAiB,UAAU,KAAK,qBAAqB;EAE1E,4BAA4B;GAC1B,KAAK,aAAa;EACpB,CAAC;EAGD,CADkB,KAAK,YAAY,cAAc,sBAAoB,EAAA,EAC1D,iBAAiB,oBAAoB;GAC9C,KAAK,aAAa;EACpB,CAAC;CACH;CAEA,QAAQ,mBAAmB;EACzB,MAAM,UAAU,iBAAiB;EACjC,IAAI,kBAAkB,IAAI,cAAc,GACtC,KAAK,aAAa;CAEtB;CAEA,uBAAuB;EACrB,MAAM,qBAAqB;EAC3B,KAAK,iBAAiB,oBACpB,UACA,KAAK,qBACP;EACA,KAAK,kBAAkB;CACzB;CAEA,eAAuB;EACrB,MAAM,aAAa,KAAK,UAAU,SAAS,eAAqB;EAEhE,IAAI,KAAK,cAAc;GACrB,KAAK,MAAM,SAAS,KAAK;GACzB;EACF;EAEA,IAAI,CAAC,YAAY;GACf,KAAK,MAAM,eAAe,QAAQ;GAClC;EACF;EAEA,MAAM,SAAS,MAAM,KACnB,KAAK,iBAA8B,kBAAgB,CACrD;EAEA,IAAI,OAAO,WAAW,GACpB;EAGF,MAAM,eAAe,OAAO,KAAK,UAAU,MAAM,MAAM;EACvD,OAAO,SAAS,UAAU;GACxB,MAAM,SAAS;EACjB,CAAC;EAED,MAAM,eAAe,KAAK,IAAI,GAAG,OAAO,KAAK,UAAU,MAAM,YAAY,CAAC;EAE1E,OAAO,SAAS,OAAO,UAAU;GAC/B,MAAM,SAAS,aAAa;EAC9B,CAAC;EAGD,MAAM,aADS,KAAK,cAA2B,UACvB,CAAC,EAAE,gBAAgB;EAE3C,MAAM,SAAS,KAAK,IAAI,cAAc,UAAU;EAChD,IAAI,SAAS,GACX,KAAK,MAAM,SAAS,GAAG,OAAO;OAE9B,KAAK,MAAM,eAAe,QAAQ;CAEtC;CAEA,SAAS;EACP,OAAO,IAAI;;0BAEY;;;;CAIzB;;gBAEgBA;;AAClB;YA/GG,SAAS,EAAE,WAAW,gBAAgB,CAAC,CAAA,GAAA,gBAAA,WAAA,gBAAA,KAAA,CAAA;8BALzCC,cAAc,mBAAyB,CAAA,GAAA,eAAA"}

package/es-custom/components/tabs/tabs.js

@@ -8,7 +8,7 @@
 import "../../globals/settings.js";
 import { forEach } from "../../globals/internal/collection-helpers.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import iconLoader from "../../globals/internal/icon-loader.js";
 import HostListener from "../../globals/decorators/host-listener.js";
 import HostListenerMixin from "../../globals/mixins/host-listener.js";

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

@@ -1 +1 @@
-{"version":3,"file":"tabs.js","names":["CDSContentSwitcher","styles","customElement"],"sources":["../../../src/components/tabs/tabs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\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 { TemplateResult, html } from 'lit';\nimport { property, state, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport HostListener from '../../globals/decorators/host-listener';\nimport { forEach } from '../../globals/internal/collection-helpers';\nimport ChevronLeft16 from '@carbon/icons/es/chevron--left/16.js';\nimport ChevronRight16 from '@carbon/icons/es/chevron--right/16.js';\nimport CDSContentSwitcher, {\n  NAVIGATION_DIRECTION,\n} from '../content-switcher/content-switcher';\nimport {\n  VERTICAL_NAVIGATION_DIRECTION,\n  TABS_ICON_SIZE,\n  TABS_KEYBOARD_ACTION,\n  TABS_TYPE,\n  TABS_SIZE,\n} from './defs';\nimport CDSTab from './tab';\nimport styles from './tabs.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport {\n  NAVIGATION_DIRECTION,\n  VERTICAL_NAVIGATION_DIRECTION,\n  TABS_ICON_SIZE,\n  TABS_KEYBOARD_ACTION,\n  TABS_TYPE,\n  TABS_SIZE,\n};\n\n/**\n * Tabs.\n *\n * @element cds-custom-tabs\n * @fires cds-custom-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 cds-custom-tabs-selected - The custom event fired after a a tab is selected upon a user gesture.\n */\n@customElement(`${prefix}-tabs`)\nexport default class CDSTabs extends HostListenerMixin(CDSContentSwitcher) {\n  /**\n   * The latest status of this dropdown, for screen reader to accounce.\n   */\n  private _assistiveStatusText?: string;\n\n  /**\n   * The currently selected index\n   */\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: TS thinks this method is not referred to\n  private _currentIndex = 0;\n\n  /**\n   * Total number of tabs in the component\n   */\n  private _totalTabs = 0;\n\n  /**\n   * `true` if the tablist is scrollable\n   */\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: TS thinks this method is not referred to\n  private _isScrollable = false;\n\n  /**\n   * The DOM element for the tablist.\n   */\n  private tablist: Element | null = null;\n\n  /**\n   * The width of the overflow scroll buttons.\n   */\n  private BUTTON_WIDTH = 44;\n\n  /**\n   * Propagates the layout size token to the host and all child tabs.\n   */\n  private _syncSizeToTabs() {\n    if (this.type === TABS_TYPE.CONTAINED || this.vertical) {\n      const rawSize = this.getAttribute('size') as TABS_SIZE | null;\n      const size =\n        rawSize === TABS_SIZE.EXTRA_LARGE && !this.vertical\n          ? TABS_SIZE.LARGE\n          : rawSize;\n\n      if (size) {\n        const value = `var(--${prefix}-layout-size-height-${size})`;\n        this.style.setProperty(`--${prefix}-layout-size-height`, value);\n        this.querySelectorAll(`${prefix}-tab`).forEach((tab) => {\n          (tab as HTMLElement).style.setProperty(\n            `--${prefix}-layout-size-height`,\n            value\n          );\n        });\n      } else {\n        this.style.removeProperty(`--${prefix}-layout-size-height`);\n        this.querySelectorAll(`${prefix}-tab`).forEach((tab) => {\n          (tab as HTMLElement).style.removeProperty(\n            `--${prefix}-layout-size-height`\n          );\n        });\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   *   Defaults to `true`\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(direction: number) {\n    const immediate = this.selectionMode === 'automatic';\n    const { selectorItemHighlighted, selectorItemSelected } = this\n      .constructor as typeof CDSTabs;\n    const nextItem = this._getNextItem(\n      this.querySelector(\n        immediate ? selectorItemSelected : selectorItemHighlighted\n      ) as CDSTab,\n      direction\n    );\n    if (!nextItem) {\n      return;\n    }\n    this._handleUserInitiatedSelectItem(nextItem as CDSTab, 'keyboard');\n    if (!immediate) {\n      this.resetHighlighted(nextItem as CDSTab);\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', inline: '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  /**\n   * Resets the highlighted state of all tabs, setting only the specified tab as highlighted.\n   *\n   * @param nextItem The tab item to be highlighted. If provided, only this item will be highlighted.\n   *   If null or undefined, all tabs will have their highlighted state set to false.\n   */\n  protected resetHighlighted(nextItem?: CDSTab | null) {\n    const { selectorItem } = this.constructor as typeof CDSTabs;\n    forEach(this.querySelectorAll(selectorItem), (item) => {\n      (item as CDSTab)['highlighted'] = nextItem === item;\n    });\n  }\n\n  /**\n   * Resets the selected state of all tabs, setting only the specified tab as selected.\n   *\n   * @param nextItem The tab item to be selected. If provided, only this item will be selected.\n   *   If null or undefined, all tabs will have their selected state set to false.\n   */\n  protected resetSelected(nextItem?: CDSTab | null) {\n    const { selectorItem } = this.constructor as typeof CDSTabs;\n    forEach(this.querySelectorAll(selectorItem), (item) => {\n      (item as CDSTab)['selected'] = nextItem === item;\n    });\n  }\n\n  @HostListener('click')\n  protected _handleClick(event: MouseEvent) {\n    super._handleClick(event);\n    const currentItem = this._getCurrentItem(event.target as HTMLElement);\n    if (currentItem) {\n      this.resetHighlighted(currentItem as CDSTab);\n    }\n  }\n\n  @HostListener('keydown')\n  protected _handleKeydown(event: KeyboardEvent) {\n    const { key } = event;\n    const { selectorItemEnabled } = this.constructor as typeof CDSTabs;\n    const action = (this.constructor as typeof CDSTabs).getAction(\n      key,\n      this.vertical\n    );\n    const enabledTabs = this.querySelectorAll(selectorItemEnabled);\n    switch (action) {\n      case TABS_KEYBOARD_ACTION.HOME:\n        {\n          const [firstEnabledTab] = enabledTabs;\n          firstEnabledTab.scrollIntoView({\n            block: 'nearest',\n            inline: 'nearest',\n          });\n          if (this.selectionMode === 'manual') {\n            this.resetHighlighted(firstEnabledTab as CDSTab);\n          }\n          this._handleUserInitiatedSelectItem(\n            firstEnabledTab as CDSTab,\n            this.selectionMode !== 'manual' ? 'activation' : 'keyboard'\n          );\n          this.requestUpdate();\n        }\n        break;\n      case TABS_KEYBOARD_ACTION.END:\n        {\n          const lastEnabledTab = enabledTabs[enabledTabs.length - 1];\n          lastEnabledTab.scrollIntoView({\n            block: 'nearest',\n            inline: 'nearest',\n          });\n          if (this.selectionMode === 'manual') {\n            this.resetHighlighted(lastEnabledTab as CDSTab);\n          }\n          this._handleUserInitiatedSelectItem(\n            lastEnabledTab as CDSTab,\n            this.selectionMode !== 'manual' ? 'activation' : 'keyboard'\n          );\n          this.requestUpdate();\n        }\n        break;\n      case TABS_KEYBOARD_ACTION.NAVIGATING:\n        {\n          event.preventDefault();\n          // Get direction based on orientation\n          const direction = this.vertical\n            ? VERTICAL_NAVIGATION_DIRECTION[key]\n            : NAVIGATION_DIRECTION[key];\n          if (direction) {\n            this._navigate(direction);\n          }\n        }\n        break;\n      case TABS_KEYBOARD_ACTION.ACTIVATING:\n        {\n          const focusedTab: CDSTab | null = this.querySelector(\n            `${prefix}-tab[highlighted]`\n          );\n          if (focusedTab) {\n            this._handleUserInitiatedSelectItem(\n              focusedTab as CDSTab,\n              'activation'\n            );\n            this.requestUpdate();\n          }\n        }\n        break;\n      default:\n        break;\n    }\n  }\n\n  @HostListener('cds-custom-tab-closed')\n  protected _handleTabClosed(event: CustomEvent) {\n    const {\n      selectorItem,\n      selectorItemEnabled,\n      selectorItemSelected,\n      selectorItemHighlighted,\n    } = this.constructor as typeof CDSTabs;\n    const { index } = event.detail;\n    const allTabs = this.querySelectorAll<CDSTab>(selectorItem);\n    const enabledTabsBeforeRemoval =\n      this.querySelectorAll<CDSTab>(selectorItemEnabled);\n    const indexInEnabledTabs = Array.from(enabledTabsBeforeRemoval).indexOf(\n      allTabs[index]\n    );\n    const activeItem = this.querySelector<CDSTab>(selectorItemSelected);\n    const activeItemId = activeItem?.id;\n    const highlightedItem = this.querySelector<CDSTab>(selectorItemHighlighted);\n    const highlightedItemId = highlightedItem?.id;\n    requestAnimationFrame(() => {\n      const enabledTabs = Array.from(\n        this.querySelectorAll<CDSTab>(selectorItemEnabled)\n      );\n\n      const tabWithActiveId = enabledTabs.find(\n        (tab) => tab.id === activeItemId\n      );\n      const tabWithHighlightedId = enabledTabs.find(\n        (tab) => tab.id === highlightedItemId\n      );\n      const nextHighlightedIndex =\n        !tabWithActiveId && !tabWithHighlightedId && indexInEnabledTabs - 1 >= 0\n          ? indexInEnabledTabs - 1\n          : 0;\n      if (enabledTabs.length > 0) {\n        const nextSelectedItem = tabWithActiveId || enabledTabs[0];\n        const nextHighlightedItem =\n          tabWithHighlightedId || enabledTabs[nextHighlightedIndex];\n        this.resetSelected(nextSelectedItem);\n        this.resetHighlighted(nextHighlightedItem);\n        this.value = nextSelectedItem.value;\n\n        nextHighlightedItem.shadowRoot\n          ?.querySelector<HTMLElement>(\n            `.${prefix}--tabs__nav-link--dismissable`\n          )\n          ?.focus();\n        nextHighlightedItem.scrollIntoView({\n          block: 'nearest',\n          inline: 'nearest',\n        });\n      } else {\n        this.value = '';\n        return;\n      }\n    });\n  }\n\n  /**\n   * Handles click on overflow scroll buttons.\n   *\n   * @param _ Event object\n   * @param [options] The options.\n   * @param [options.direction] `-1` to scroll forward, `1` to scroll backward.\n   */\n  protected _handleScrollButtonClick(_, { direction }) {\n    if (!this.tablist) {\n      return;\n    }\n    const { scrollLeft, clientWidth, scrollWidth } =\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      this._contentContainerNode!;\n    switch (direction) {\n      case -1:\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n        this._contentContainerNode!.scrollLeft = Math.max(\n          scrollLeft - (scrollWidth / this._totalTabs) * 1.5,\n          0\n        );\n        break;\n      case 1:\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n        this._contentContainerNode!.scrollLeft =\n          Math.min(\n            scrollLeft + (scrollWidth / this._totalTabs) * 1.5,\n            scrollWidth - clientWidth\n          ) + 1;\n        break;\n      default:\n        break;\n    }\n  }\n\n  private _syncSecondaryLabels() {\n    const hasSecondaryLabels = Array.from(\n      this.querySelectorAll(`${prefix}-tab`)\n    ).some((tab) => tab.hasAttribute('secondary-label'));\n    if (hasSecondaryLabels) {\n      this.setAttribute('has-secondary-labels', '');\n    } else {\n      this.removeAttribute('has-secondary-labels');\n    }\n  }\n\n  _handleSlotchange() {\n    // Call super to preserve content-switcher slot handling\n    super._handleSlotchange?.();\n    const { selectorItemSelected } = this.constructor as typeof CDSTabs;\n    const selectedItem = this.querySelector(selectorItemSelected);\n    const nextItem = this._getNextItem(selectedItem as CDSTab, 1);\n\n    // Specifies child `<cds-custom-tab>` to hide its divider instead of using CSS,\n    // until `:host-context()` gets supported in all major browsers\n    if (nextItem) {\n      (nextItem as CDSTab).hideDivider = true;\n    }\n\n    // Set vertical attribute on all tabs if this tabs component is vertical\n    this._updateTabsVerticalAttribute();\n    this._syncSecondaryLabels();\n    this._updateTabsState();\n    this._syncSizeToTabs();\n  }\n\n  /**\n   * Updates the vertical attribute on all child tabs based on the vertical property.\n   */\n  private _updateTabsVerticalAttribute() {\n    const { selectorItem } = this.constructor as typeof CDSTabs;\n    forEach(this.querySelectorAll(selectorItem), (tab) => {\n      if (this.vertical) {\n        (tab as CDSTab).setAttribute('vertical', '');\n      } else {\n        (tab as CDSTab).removeAttribute('vertical');\n      }\n    });\n  }\n\n  protected _selectionDidChange(\n    itemToSelect: CDSTab,\n    interactionType?: 'mouse' | 'keyboard' | undefined\n  ) {\n    super._selectionDidChange(itemToSelect, interactionType);\n    this._assistiveStatusText = this.selectedItemAssistiveText;\n  }\n\n  /**\n   * The scrolling container.\n   */\n  @query(`.${prefix}--tabs-nav-content-container`)\n  private _contentContainerNode?: HTMLElement;\n\n  /**\n   * The scrolling content.\n   */\n  @query(`.${prefix}--tabs-nav-content`)\n  private _contentNode?: HTMLElement;\n\n  /**\n   * The current scroll position.\n   */\n  @state()\n  private _currentScrollPosition = 0;\n\n  /**\n   * The left-hand sentinel to track intersection with the host element.\n   * If they intersect, the left-hand paginator button should be hidden.\n   */\n  @query(`.${prefix}--sub-content-left`)\n  private _intersectionLeftSentinelNode?: HTMLElement;\n\n  /**\n   * The right-hand sentinel to track intersection with the host element.\n   * If they intersect, the right-hand paginator button should be hidden.\n   */\n  @query(`.${prefix}--sub-content-right`)\n  private _intersectionRightSentinelNode?: HTMLElement;\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  /**\n   * `true` if the tabs are in vertical orientation.\n   * This is automatically set by `cds-custom-tabs-vertical`.\n   */\n  @property({ type: Boolean })\n  vertical = false;\n  /**\n   * Whether the rendered Tab children should be dismissable.\n   */\n  @property({ type: Boolean, reflect: true })\n  dismissable;\n\n  /**\n   * Specify the size of the tabs.\n   *\n   * Supports `sm` and `md` for line tabs.\n   * Supports `sm`, `md`, and `lg` for contained tabs.\n   * Supports `xl` only when `vertical` is set; otherwise `xl` falls back to `lg`.\n   */\n  @property({ reflect: true })\n  // @ts-expect-error - TABS_SIZE extends CONTENT_SWITCHER_SIZE with additional 'md' value\n  declare size: TABS_SIZE;\n\n  /**\n   * Specify the icon size used by icon-only tabs.\n   */\n  @property({ attribute: 'icon-size', reflect: true })\n  iconSize?: TABS_ICON_SIZE;\n\n  /**\n   * Used for tabs within a grid, this makes it so tabs span the full container width and have the same width. Only available on contained tabs with <9 children\n   */\n  @property({ type: Boolean, attribute: 'full-width', reflect: true })\n  fullWidth = false;\n\n  /**\n   * `true` if left-hand scroll intersection sentinel intersects with the host element.\n   * In this condition, the left-hand paginator button should be hidden.\n   */\n  @state()\n  private _isIntersectionLeftTrackerInContent = true;\n\n  /**\n   * `true` if right-hand scroll intersection sentinel intersects with the host element.\n   * In this condition, the right-hand paginator button should be hidden.\n   */\n  @state()\n  private _isIntersectionRightTrackerInContent = true;\n\n  /**\n   * The observer for the intersection of left-side content edge.\n   */\n  private _observerIntersection: IntersectionObserver | null = null;\n\n  /**\n   * The intersection observer callback for the scrolling container.\n   *\n   * @param records The intersection observer records.\n   */\n  private _observeIntersectionContainer = (records) => {\n    const {\n      _intersectionLeftSentinelNode: intersectionLeftSentinelNode,\n      _intersectionRightSentinelNode: intersectionRightSentinelNode,\n    } = this;\n\n    records.forEach(({ isIntersecting, target }) => {\n      if (target === intersectionLeftSentinelNode) {\n        this._isIntersectionLeftTrackerInContent = isIntersecting;\n      }\n      if (target === intersectionRightSentinelNode) {\n        this._isIntersectionRightTrackerInContent = isIntersecting;\n      }\n    });\n  };\n\n  /**\n   * Cleans-up and creates the intersection observer for the scrolling container.\n   *\n   * @param [options] The options.\n   * @param [options.create] `true` to create the new intersection observer.\n   */\n  private _cleanAndCreateIntersectionObserverContainer({\n    create,\n  }: { create?: boolean } = {}) {\n    const {\n      _intersectionLeftSentinelNode: intersectionLeftSentinelNode,\n      _intersectionRightSentinelNode: intersectionRightSentinelNode,\n    } = this;\n\n    if (this._observerIntersection) {\n      this._observerIntersection.disconnect();\n      this._observerIntersection = null;\n    }\n\n    if (create) {\n      this._observerIntersection = new IntersectionObserver(\n        this._observeIntersectionContainer,\n        {\n          root: this,\n          threshold: 0,\n        }\n      );\n\n      if (intersectionLeftSentinelNode) {\n        this._observerIntersection.observe(intersectionLeftSentinelNode);\n      }\n      if (intersectionRightSentinelNode) {\n        this._observerIntersection.observe(intersectionRightSentinelNode);\n      }\n    }\n  }\n\n  disconnectedCallback() {\n    this._cleanAndCreateIntersectionObserverContainer();\n    super.disconnectedCallback();\n  }\n\n  shouldUpdate(changedProperties) {\n    super.shouldUpdate(changedProperties);\n    if (this.tablist) {\n      const { clientWidth, scrollWidth } = this.tablist;\n      this._isScrollable = scrollWidth > clientWidth;\n    }\n    const { selectorItem } = this.constructor as typeof CDSTabs;\n    if (\n      changedProperties.has('type') ||\n      changedProperties.has('iconSize') ||\n      changedProperties.has('size')\n    ) {\n      this._totalTabs = 0;\n      forEach(this.querySelectorAll(selectorItem), (elem) => {\n        this._totalTabs++;\n        (elem as CDSTab).type = this.type;\n        (elem as CDSTab).iconSize = this.iconSize;\n      });\n    }\n    return true;\n  }\n\n  firstUpdated() {\n    // Call super to run content-switcher init logic (initial selection)\n    super.firstUpdated();\n    this._tabInitialLoad();\n    this._cleanAndCreateIntersectionObserverContainer({ create: true });\n    this._syncSecondaryLabels();\n    this._syncSizeToTabs();\n  }\n\n  updated(changedProperties) {\n    // Call super to keep selection/value in sync\n    super.updated?.(changedProperties);\n    if (changedProperties.has('size') || changedProperties.has('type')) {\n      this._syncSizeToTabs();\n    }\n\n    if (changedProperties.has('vertical')) {\n      this._updateTabsVerticalAttribute();\n    }\n\n    if (changedProperties.has('value')) {\n      const tab = this.querySelector(\n        `${prefix}-tab[value=\"${this.value}\"]`\n      ) as HTMLElement;\n      if (tab) {\n        const { width: tabWidth } = tab?.getBoundingClientRect() ?? {};\n        const start = tab.offsetLeft ?? 0;\n        const end = tab.offsetLeft + tabWidth;\n\n        // The start and end of the visible area of the tablist\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n        const visibleStart = this.tablist!.scrollLeft + this.BUTTON_WIDTH;\n        const visibleEnd =\n          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n          this.tablist!.scrollLeft +\n          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n          this.tablist!.clientWidth -\n          this.BUTTON_WIDTH;\n\n        // The beginning of the tab is clipped and not visible\n        if (start < visibleStart) {\n          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n          this.tablist!.scrollLeft = start - this.BUTTON_WIDTH;\n        }\n\n        // The end of the tab is clipped and not visible\n        if (end > visibleEnd) {\n          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n          this.tablist!.scrollLeft =\n            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n            end + this.BUTTON_WIDTH - this.tablist!.clientWidth;\n        }\n      }\n    }\n\n    if (changedProperties.has('_currentScrollPosition')) {\n      if (this._contentNode) {\n        this._contentNode.style.insetInlineStart = `-${this._currentScrollPosition}px`;\n      }\n    }\n\n    if (changedProperties.has('dismissable')) {\n      this._updateTabsState();\n    }\n  }\n\n  /**\n   * Render the previous button if tablist is wider than container.\n   */\n  protected renderPreviousButton(): TemplateResult | null {\n    const {\n      _isIntersectionLeftTrackerInContent: isIntersectionLeftTrackerInContent,\n    } = this;\n    const previousButtonClasses = classMap({\n      [`${prefix}--tab--overflow-nav-button`]: true,\n      [`${prefix}--tabs__nav-caret-left`]: true,\n      [`${prefix}--tab--overflow-nav-button--previous`]: true,\n      [`${prefix}--tab--overflow-nav-button--hidden`]:\n        isIntersectionLeftTrackerInContent,\n    });\n    return html`\n      <button\n        part=\"prev-button\"\n        tabindex=\"-1\"\n        aria-hidden=\"true\"\n        class=\"${previousButtonClasses}\"\n        @click=${(_) =>\n          this._handleScrollButtonClick(_, {\n            direction: NAVIGATION_DIRECTION.Left,\n          })}>\n        ${iconLoader(ChevronLeft16)}\n      </button>\n    `;\n  }\n\n  /**\n   * Render the next button if tablist is wider than container.\n   */\n  protected renderNextButton(): TemplateResult | null {\n    const {\n      _isIntersectionRightTrackerInContent: isIntersectionRightTrackerInContent,\n    } = this;\n    const nextButtonClasses = classMap({\n      [`${prefix}--tab--overflow-nav-button`]: true,\n      [`${prefix}--tabs__nav-caret-right`]: true,\n      [`${prefix}--tab--overflow-nav-button--next`]: true,\n      [`${prefix}--tab--overflow-nav-button--hidden`]:\n        isIntersectionRightTrackerInContent,\n    });\n    return html`\n      <button\n        part=\"next-button\"\n        tabindex=\"-1\"\n        aria-hidden=\"true\"\n        class=\"${nextButtonClasses}\"\n        @click=${(_) =>\n          this._handleScrollButtonClick(_, {\n            direction: NAVIGATION_DIRECTION.Right,\n          })}>\n        ${iconLoader(ChevronRight16)}\n      </button>\n    `;\n  }\n\n  render() {\n    const {\n      _assistiveStatusText: assistiveStatusText,\n      _handleSlotchange: handleSlotchange,\n    } = this;\n\n    return html`\n      ${this.renderPreviousButton()}\n      <div class=\"${prefix}--tabs-nav-content-container\">\n        <div class=\"${prefix}--tabs-nav-content\">\n          <div class=\"${prefix}--tabs-nav\">\n            <div id=\"tablist\" role=\"tablist\" class=\"${prefix}--tab--list\">\n              <div class=\"${prefix}--sub-content-left\"></div>\n              <slot @slotchange=${handleSlotchange}></slot>\n              <div class=\"${prefix}--sub-content-right\"></div>\n            </div>\n          </div>\n        </div>\n      </div>\n      ${this.renderNextButton()}\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  protected _updateTabsState() {\n    const { selectorItem } = this.constructor as typeof CDSTabs;\n    const tabs = this.querySelectorAll<CDSTab>(selectorItem);\n    tabs.forEach((tab, index) => {\n      tab._dismissable = this.dismissable;\n      tab._index = index;\n    });\n  }\n\n  protected _tabInitialLoad() {\n    const { selectorTablist, selectorItemEnabled } = this\n      .constructor as typeof CDSTabs;\n    const { selectionMode, selectedIndex } = this;\n    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n    const tablist = this.shadowRoot!.querySelector(selectorTablist)!;\n    this.tablist = tablist;\n    const firstItem =\n      this.querySelectorAll<CDSTab>(selectorItemEnabled)[selectedIndex];\n    if (firstItem) {\n      if (selectionMode === 'manual') {\n        firstItem.highlighted = true;\n      }\n      firstItem.selected = true;\n      this.value = firstItem.value;\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   * A selector that returns the tablist\n   */\n  static get selectorTablist() {\n    return `.${prefix}--tab--list`;\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 isVertical Whether the tabs are in vertical orientation.\n   * @returns A action for tabs for the given key symbol.\n   */\n  static getAction(key: string, isVertical = false) {\n    if (key === 'Home') {\n      return TABS_KEYBOARD_ACTION.HOME;\n    }\n    if (key === 'End') {\n      return TABS_KEYBOARD_ACTION.END;\n    }\n    // Check for navigation keys based on orientation\n    const navigationKeys = isVertical\n      ? VERTICAL_NAVIGATION_DIRECTION\n      : NAVIGATION_DIRECTION;\n    if (key in navigationKeys) {\n      return TABS_KEYBOARD_ACTION.NAVIGATING;\n    }\n    if (key === 'Enter' || key === ' ') {\n      return TABS_KEYBOARD_ACTION.ACTIVATING;\n    }\n    return TABS_KEYBOARD_ACTION.NONE;\n  }\n}\n"],"mappings":"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"}
+{"version":3,"file":"tabs.js","names":["CDSContentSwitcher","styles","customElement"],"sources":["../../../src/components/tabs/tabs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2026\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 { TemplateResult, html } from 'lit';\nimport { property, state, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { prefix } from '../../globals/settings';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport HostListener from '../../globals/decorators/host-listener';\nimport { forEach } from '../../globals/internal/collection-helpers';\nimport ChevronLeft16 from '@carbon/icons/es/chevron--left/16.js';\nimport ChevronRight16 from '@carbon/icons/es/chevron--right/16.js';\nimport CDSContentSwitcher, {\n  NAVIGATION_DIRECTION,\n} from '../content-switcher/content-switcher';\nimport {\n  VERTICAL_NAVIGATION_DIRECTION,\n  TABS_ICON_SIZE,\n  TABS_KEYBOARD_ACTION,\n  TABS_TYPE,\n  TABS_SIZE,\n} from './defs';\nimport CDSTab from './tab';\nimport styles from './tabs.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport {\n  NAVIGATION_DIRECTION,\n  VERTICAL_NAVIGATION_DIRECTION,\n  TABS_ICON_SIZE,\n  TABS_KEYBOARD_ACTION,\n  TABS_TYPE,\n  TABS_SIZE,\n};\n\n/**\n * Tabs.\n *\n * @element cds-custom-tabs\n * @fires cds-custom-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 cds-custom-tabs-selected - The custom event fired after a a tab is selected upon a user gesture.\n */\n@customElement(`${prefix}-tabs`)\nexport default class CDSTabs extends HostListenerMixin(CDSContentSwitcher) {\n  /**\n   * The latest status of this dropdown, for screen reader to accounce.\n   */\n  private _assistiveStatusText?: string;\n\n  /**\n   * The currently selected index\n   */\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: TS thinks this method is not referred to\n  private _currentIndex = 0;\n\n  /**\n   * Total number of tabs in the component\n   */\n  private _totalTabs = 0;\n\n  /**\n   * `true` if the tablist is scrollable\n   */\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment -- https://github.com/carbon-design-system/carbon/issues/20452\n  // @ts-ignore: TS thinks this method is not referred to\n  private _isScrollable = false;\n\n  /**\n   * The DOM element for the tablist.\n   */\n  private tablist: Element | null = null;\n\n  /**\n   * The width of the overflow scroll buttons.\n   */\n  private BUTTON_WIDTH = 44;\n\n  /**\n   * Propagates the layout size token to the host and all child tabs.\n   */\n  private _syncSizeToTabs() {\n    if (this.type === TABS_TYPE.CONTAINED || this.vertical) {\n      const rawSize = this.getAttribute('size') as TABS_SIZE | null;\n      const size =\n        rawSize === TABS_SIZE.EXTRA_LARGE && !this.vertical\n          ? TABS_SIZE.LARGE\n          : rawSize;\n\n      if (size) {\n        const value = `var(--${prefix}-layout-size-height-${size})`;\n        this.style.setProperty(`--${prefix}-layout-size-height`, value);\n        this.querySelectorAll(`${prefix}-tab`).forEach((tab) => {\n          (tab as HTMLElement).style.setProperty(\n            `--${prefix}-layout-size-height`,\n            value\n          );\n        });\n      } else {\n        this.style.removeProperty(`--${prefix}-layout-size-height`);\n        this.querySelectorAll(`${prefix}-tab`).forEach((tab) => {\n          (tab as HTMLElement).style.removeProperty(\n            `--${prefix}-layout-size-height`\n          );\n        });\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   *   Defaults to `true`\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(direction: number) {\n    const immediate = this.selectionMode === 'automatic';\n    const { selectorItemHighlighted, selectorItemSelected } = this\n      .constructor as typeof CDSTabs;\n    const nextItem = this._getNextItem(\n      this.querySelector(\n        immediate ? selectorItemSelected : selectorItemHighlighted\n      ) as CDSTab,\n      direction\n    );\n    if (!nextItem) {\n      return;\n    }\n    this._handleUserInitiatedSelectItem(nextItem as CDSTab, 'keyboard');\n    if (!immediate) {\n      this.resetHighlighted(nextItem as CDSTab);\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', inline: '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  /**\n   * Resets the highlighted state of all tabs, setting only the specified tab as highlighted.\n   *\n   * @param nextItem The tab item to be highlighted. If provided, only this item will be highlighted.\n   *   If null or undefined, all tabs will have their highlighted state set to false.\n   */\n  protected resetHighlighted(nextItem?: CDSTab | null) {\n    const { selectorItem } = this.constructor as typeof CDSTabs;\n    forEach(this.querySelectorAll(selectorItem), (item) => {\n      (item as CDSTab)['highlighted'] = nextItem === item;\n    });\n  }\n\n  /**\n   * Resets the selected state of all tabs, setting only the specified tab as selected.\n   *\n   * @param nextItem The tab item to be selected. If provided, only this item will be selected.\n   *   If null or undefined, all tabs will have their selected state set to false.\n   */\n  protected resetSelected(nextItem?: CDSTab | null) {\n    const { selectorItem } = this.constructor as typeof CDSTabs;\n    forEach(this.querySelectorAll(selectorItem), (item) => {\n      (item as CDSTab)['selected'] = nextItem === item;\n    });\n  }\n\n  @HostListener('click')\n  protected _handleClick(event: MouseEvent) {\n    super._handleClick(event);\n    const currentItem = this._getCurrentItem(event.target as HTMLElement);\n    if (currentItem) {\n      this.resetHighlighted(currentItem as CDSTab);\n    }\n  }\n\n  @HostListener('keydown')\n  protected _handleKeydown(event: KeyboardEvent) {\n    const { key } = event;\n    const { selectorItemEnabled } = this.constructor as typeof CDSTabs;\n    const action = (this.constructor as typeof CDSTabs).getAction(\n      key,\n      this.vertical\n    );\n    const enabledTabs = this.querySelectorAll(selectorItemEnabled);\n    switch (action) {\n      case TABS_KEYBOARD_ACTION.HOME:\n        {\n          const [firstEnabledTab] = enabledTabs;\n          firstEnabledTab.scrollIntoView({\n            block: 'nearest',\n            inline: 'nearest',\n          });\n          if (this.selectionMode === 'manual') {\n            this.resetHighlighted(firstEnabledTab as CDSTab);\n          }\n          this._handleUserInitiatedSelectItem(\n            firstEnabledTab as CDSTab,\n            this.selectionMode !== 'manual' ? 'activation' : 'keyboard'\n          );\n          this.requestUpdate();\n        }\n        break;\n      case TABS_KEYBOARD_ACTION.END:\n        {\n          const lastEnabledTab = enabledTabs[enabledTabs.length - 1];\n          lastEnabledTab.scrollIntoView({\n            block: 'nearest',\n            inline: 'nearest',\n          });\n          if (this.selectionMode === 'manual') {\n            this.resetHighlighted(lastEnabledTab as CDSTab);\n          }\n          this._handleUserInitiatedSelectItem(\n            lastEnabledTab as CDSTab,\n            this.selectionMode !== 'manual' ? 'activation' : 'keyboard'\n          );\n          this.requestUpdate();\n        }\n        break;\n      case TABS_KEYBOARD_ACTION.NAVIGATING:\n        {\n          event.preventDefault();\n          // Get direction based on orientation\n          const direction = this.vertical\n            ? VERTICAL_NAVIGATION_DIRECTION[key]\n            : NAVIGATION_DIRECTION[key];\n          if (direction) {\n            this._navigate(direction);\n          }\n        }\n        break;\n      case TABS_KEYBOARD_ACTION.ACTIVATING:\n        {\n          const focusedTab: CDSTab | null = this.querySelector(\n            `${prefix}-tab[highlighted]`\n          );\n          if (focusedTab) {\n            this._handleUserInitiatedSelectItem(\n              focusedTab as CDSTab,\n              'activation'\n            );\n            this.requestUpdate();\n          }\n        }\n        break;\n      default:\n        break;\n    }\n  }\n\n  @HostListener('cds-custom-tab-closed')\n  protected _handleTabClosed(event: CustomEvent) {\n    const {\n      selectorItem,\n      selectorItemEnabled,\n      selectorItemSelected,\n      selectorItemHighlighted,\n    } = this.constructor as typeof CDSTabs;\n    const { index } = event.detail;\n    const allTabs = this.querySelectorAll<CDSTab>(selectorItem);\n    const enabledTabsBeforeRemoval =\n      this.querySelectorAll<CDSTab>(selectorItemEnabled);\n    const indexInEnabledTabs = Array.from(enabledTabsBeforeRemoval).indexOf(\n      allTabs[index]\n    );\n    const activeItem = this.querySelector<CDSTab>(selectorItemSelected);\n    const activeItemId = activeItem?.id;\n    const highlightedItem = this.querySelector<CDSTab>(selectorItemHighlighted);\n    const highlightedItemId = highlightedItem?.id;\n    requestAnimationFrame(() => {\n      const enabledTabs = Array.from(\n        this.querySelectorAll<CDSTab>(selectorItemEnabled)\n      );\n\n      const tabWithActiveId = enabledTabs.find(\n        (tab) => tab.id === activeItemId\n      );\n      const tabWithHighlightedId = enabledTabs.find(\n        (tab) => tab.id === highlightedItemId\n      );\n      const nextHighlightedIndex =\n        !tabWithActiveId && !tabWithHighlightedId && indexInEnabledTabs - 1 >= 0\n          ? indexInEnabledTabs - 1\n          : 0;\n      if (enabledTabs.length > 0) {\n        const nextSelectedItem = tabWithActiveId || enabledTabs[0];\n        const nextHighlightedItem =\n          tabWithHighlightedId || enabledTabs[nextHighlightedIndex];\n        this.resetSelected(nextSelectedItem);\n        this.resetHighlighted(nextHighlightedItem);\n        this.value = nextSelectedItem.value;\n\n        nextHighlightedItem.shadowRoot\n          ?.querySelector<HTMLElement>(\n            `.${prefix}--tabs__nav-link--dismissable`\n          )\n          ?.focus();\n        nextHighlightedItem.scrollIntoView({\n          block: 'nearest',\n          inline: 'nearest',\n        });\n      } else {\n        this.value = '';\n        return;\n      }\n    });\n  }\n\n  /**\n   * Handles click on overflow scroll buttons.\n   *\n   * @param _ Event object\n   * @param [options] The options.\n   * @param [options.direction] `-1` to scroll forward, `1` to scroll backward.\n   */\n  protected _handleScrollButtonClick(_, { direction }) {\n    if (!this.tablist) {\n      return;\n    }\n    const { scrollLeft, clientWidth, scrollWidth } =\n      // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n      this._contentContainerNode!;\n    switch (direction) {\n      case -1:\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n        this._contentContainerNode!.scrollLeft = Math.max(\n          scrollLeft - (scrollWidth / this._totalTabs) * 1.5,\n          0\n        );\n        break;\n      case 1:\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n        this._contentContainerNode!.scrollLeft =\n          Math.min(\n            scrollLeft + (scrollWidth / this._totalTabs) * 1.5,\n            scrollWidth - clientWidth\n          ) + 1;\n        break;\n      default:\n        break;\n    }\n  }\n\n  private _syncSecondaryLabels() {\n    const hasSecondaryLabels = Array.from(\n      this.querySelectorAll(`${prefix}-tab`)\n    ).some((tab) => tab.hasAttribute('secondary-label'));\n    if (hasSecondaryLabels) {\n      this.setAttribute('has-secondary-labels', '');\n    } else {\n      this.removeAttribute('has-secondary-labels');\n    }\n  }\n\n  _handleSlotchange() {\n    // Call super to preserve content-switcher slot handling\n    super._handleSlotchange?.();\n    const { selectorItemSelected } = this.constructor as typeof CDSTabs;\n    const selectedItem = this.querySelector(selectorItemSelected);\n    const nextItem = this._getNextItem(selectedItem as CDSTab, 1);\n\n    // Specifies child `<cds-custom-tab>` to hide its divider instead of using CSS,\n    // until `:host-context()` gets supported in all major browsers\n    if (nextItem) {\n      (nextItem as CDSTab).hideDivider = true;\n    }\n\n    // Set vertical attribute on all tabs if this tabs component is vertical\n    this._updateTabsVerticalAttribute();\n    this._syncSecondaryLabels();\n    this._updateTabsState();\n    this._syncSizeToTabs();\n  }\n\n  /**\n   * Updates the vertical attribute on all child tabs based on the vertical property.\n   */\n  private _updateTabsVerticalAttribute() {\n    const { selectorItem } = this.constructor as typeof CDSTabs;\n    forEach(this.querySelectorAll(selectorItem), (tab) => {\n      if (this.vertical) {\n        (tab as CDSTab).setAttribute('vertical', '');\n      } else {\n        (tab as CDSTab).removeAttribute('vertical');\n      }\n    });\n  }\n\n  protected _selectionDidChange(\n    itemToSelect: CDSTab,\n    interactionType?: 'mouse' | 'keyboard' | undefined\n  ) {\n    super._selectionDidChange(itemToSelect, interactionType);\n    this._assistiveStatusText = this.selectedItemAssistiveText;\n  }\n\n  /**\n   * The scrolling container.\n   */\n  @query(`.${prefix}--tabs-nav-content-container`)\n  private _contentContainerNode?: HTMLElement;\n\n  /**\n   * The scrolling content.\n   */\n  @query(`.${prefix}--tabs-nav-content`)\n  private _contentNode?: HTMLElement;\n\n  /**\n   * The current scroll position.\n   */\n  @state()\n  private _currentScrollPosition = 0;\n\n  /**\n   * The left-hand sentinel to track intersection with the host element.\n   * If they intersect, the left-hand paginator button should be hidden.\n   */\n  @query(`.${prefix}--sub-content-left`)\n  private _intersectionLeftSentinelNode?: HTMLElement;\n\n  /**\n   * The right-hand sentinel to track intersection with the host element.\n   * If they intersect, the right-hand paginator button should be hidden.\n   */\n  @query(`.${prefix}--sub-content-right`)\n  private _intersectionRightSentinelNode?: HTMLElement;\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  /**\n   * `true` if the tabs are in vertical orientation.\n   * This is automatically set by `cds-custom-tabs-vertical`.\n   */\n  @property({ type: Boolean })\n  vertical = false;\n  /**\n   * Whether the rendered Tab children should be dismissable.\n   */\n  @property({ type: Boolean, reflect: true })\n  dismissable;\n\n  /**\n   * Specify the size of the tabs.\n   *\n   * Supports `sm` and `md` for line tabs.\n   * Supports `sm`, `md`, and `lg` for contained tabs.\n   * Supports `xl` only when `vertical` is set; otherwise `xl` falls back to `lg`.\n   */\n  @property({ reflect: true })\n  // @ts-expect-error - TABS_SIZE extends CONTENT_SWITCHER_SIZE with additional 'md' value\n  declare size: TABS_SIZE;\n\n  /**\n   * Specify the icon size used by icon-only tabs.\n   */\n  @property({ attribute: 'icon-size', reflect: true })\n  iconSize?: TABS_ICON_SIZE;\n\n  /**\n   * Used for tabs within a grid, this makes it so tabs span the full container width and have the same width. Only available on contained tabs with <9 children\n   */\n  @property({ type: Boolean, attribute: 'full-width', reflect: true })\n  fullWidth = false;\n\n  /**\n   * `true` if left-hand scroll intersection sentinel intersects with the host element.\n   * In this condition, the left-hand paginator button should be hidden.\n   */\n  @state()\n  private _isIntersectionLeftTrackerInContent = true;\n\n  /**\n   * `true` if right-hand scroll intersection sentinel intersects with the host element.\n   * In this condition, the right-hand paginator button should be hidden.\n   */\n  @state()\n  private _isIntersectionRightTrackerInContent = true;\n\n  /**\n   * The observer for the intersection of left-side content edge.\n   */\n  private _observerIntersection: IntersectionObserver | null = null;\n\n  /**\n   * The intersection observer callback for the scrolling container.\n   *\n   * @param records The intersection observer records.\n   */\n  private _observeIntersectionContainer = (records) => {\n    const {\n      _intersectionLeftSentinelNode: intersectionLeftSentinelNode,\n      _intersectionRightSentinelNode: intersectionRightSentinelNode,\n    } = this;\n\n    records.forEach(({ isIntersecting, target }) => {\n      if (target === intersectionLeftSentinelNode) {\n        this._isIntersectionLeftTrackerInContent = isIntersecting;\n      }\n      if (target === intersectionRightSentinelNode) {\n        this._isIntersectionRightTrackerInContent = isIntersecting;\n      }\n    });\n  };\n\n  /**\n   * Cleans-up and creates the intersection observer for the scrolling container.\n   *\n   * @param [options] The options.\n   * @param [options.create] `true` to create the new intersection observer.\n   */\n  private _cleanAndCreateIntersectionObserverContainer({\n    create,\n  }: { create?: boolean } = {}) {\n    const {\n      _intersectionLeftSentinelNode: intersectionLeftSentinelNode,\n      _intersectionRightSentinelNode: intersectionRightSentinelNode,\n    } = this;\n\n    if (this._observerIntersection) {\n      this._observerIntersection.disconnect();\n      this._observerIntersection = null;\n    }\n\n    if (create) {\n      this._observerIntersection = new IntersectionObserver(\n        this._observeIntersectionContainer,\n        {\n          root: this,\n          threshold: 0,\n        }\n      );\n\n      if (intersectionLeftSentinelNode) {\n        this._observerIntersection.observe(intersectionLeftSentinelNode);\n      }\n      if (intersectionRightSentinelNode) {\n        this._observerIntersection.observe(intersectionRightSentinelNode);\n      }\n    }\n  }\n\n  disconnectedCallback() {\n    this._cleanAndCreateIntersectionObserverContainer();\n    super.disconnectedCallback();\n  }\n\n  shouldUpdate(changedProperties) {\n    super.shouldUpdate(changedProperties);\n    if (this.tablist) {\n      const { clientWidth, scrollWidth } = this.tablist;\n      this._isScrollable = scrollWidth > clientWidth;\n    }\n    const { selectorItem } = this.constructor as typeof CDSTabs;\n    if (\n      changedProperties.has('type') ||\n      changedProperties.has('iconSize') ||\n      changedProperties.has('size')\n    ) {\n      this._totalTabs = 0;\n      forEach(this.querySelectorAll(selectorItem), (elem) => {\n        this._totalTabs++;\n        (elem as CDSTab).type = this.type;\n        (elem as CDSTab).iconSize = this.iconSize;\n      });\n    }\n    return true;\n  }\n\n  firstUpdated() {\n    // Call super to run content-switcher init logic (initial selection)\n    super.firstUpdated();\n    this._tabInitialLoad();\n    this._cleanAndCreateIntersectionObserverContainer({ create: true });\n    this._syncSecondaryLabels();\n    this._syncSizeToTabs();\n  }\n\n  updated(changedProperties) {\n    // Call super to keep selection/value in sync\n    super.updated?.(changedProperties);\n    if (changedProperties.has('size') || changedProperties.has('type')) {\n      this._syncSizeToTabs();\n    }\n\n    if (changedProperties.has('vertical')) {\n      this._updateTabsVerticalAttribute();\n    }\n\n    if (changedProperties.has('value')) {\n      const tab = this.querySelector(\n        `${prefix}-tab[value=\"${this.value}\"]`\n      ) as HTMLElement;\n      if (tab) {\n        const { width: tabWidth } = tab?.getBoundingClientRect() ?? {};\n        const start = tab.offsetLeft ?? 0;\n        const end = tab.offsetLeft + tabWidth;\n\n        // The start and end of the visible area of the tablist\n        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n        const visibleStart = this.tablist!.scrollLeft + this.BUTTON_WIDTH;\n        const visibleEnd =\n          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n          this.tablist!.scrollLeft +\n          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n          this.tablist!.clientWidth -\n          this.BUTTON_WIDTH;\n\n        // The beginning of the tab is clipped and not visible\n        if (start < visibleStart) {\n          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n          this.tablist!.scrollLeft = start - this.BUTTON_WIDTH;\n        }\n\n        // The end of the tab is clipped and not visible\n        if (end > visibleEnd) {\n          // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n          this.tablist!.scrollLeft =\n            // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n            end + this.BUTTON_WIDTH - this.tablist!.clientWidth;\n        }\n      }\n    }\n\n    if (changedProperties.has('_currentScrollPosition')) {\n      if (this._contentNode) {\n        this._contentNode.style.insetInlineStart = `-${this._currentScrollPosition}px`;\n      }\n    }\n\n    if (changedProperties.has('dismissable')) {\n      this._updateTabsState();\n    }\n  }\n\n  /**\n   * Render the previous button if tablist is wider than container.\n   */\n  protected renderPreviousButton(): TemplateResult | null {\n    const {\n      _isIntersectionLeftTrackerInContent: isIntersectionLeftTrackerInContent,\n    } = this;\n    const previousButtonClasses = classMap({\n      [`${prefix}--tab--overflow-nav-button`]: true,\n      [`${prefix}--tabs__nav-caret-left`]: true,\n      [`${prefix}--tab--overflow-nav-button--previous`]: true,\n      [`${prefix}--tab--overflow-nav-button--hidden`]:\n        isIntersectionLeftTrackerInContent,\n    });\n    return html`\n      <button\n        part=\"prev-button\"\n        tabindex=\"-1\"\n        aria-hidden=\"true\"\n        class=\"${previousButtonClasses}\"\n        @click=${(_) =>\n          this._handleScrollButtonClick(_, {\n            direction: NAVIGATION_DIRECTION.Left,\n          })}>\n        ${iconLoader(ChevronLeft16)}\n      </button>\n    `;\n  }\n\n  /**\n   * Render the next button if tablist is wider than container.\n   */\n  protected renderNextButton(): TemplateResult | null {\n    const {\n      _isIntersectionRightTrackerInContent: isIntersectionRightTrackerInContent,\n    } = this;\n    const nextButtonClasses = classMap({\n      [`${prefix}--tab--overflow-nav-button`]: true,\n      [`${prefix}--tabs__nav-caret-right`]: true,\n      [`${prefix}--tab--overflow-nav-button--next`]: true,\n      [`${prefix}--tab--overflow-nav-button--hidden`]:\n        isIntersectionRightTrackerInContent,\n    });\n    return html`\n      <button\n        part=\"next-button\"\n        tabindex=\"-1\"\n        aria-hidden=\"true\"\n        class=\"${nextButtonClasses}\"\n        @click=${(_) =>\n          this._handleScrollButtonClick(_, {\n            direction: NAVIGATION_DIRECTION.Right,\n          })}>\n        ${iconLoader(ChevronRight16)}\n      </button>\n    `;\n  }\n\n  render() {\n    const {\n      _assistiveStatusText: assistiveStatusText,\n      _handleSlotchange: handleSlotchange,\n    } = this;\n\n    return html`\n      ${this.renderPreviousButton()}\n      <div class=\"${prefix}--tabs-nav-content-container\">\n        <div class=\"${prefix}--tabs-nav-content\">\n          <div class=\"${prefix}--tabs-nav\">\n            <div id=\"tablist\" role=\"tablist\" class=\"${prefix}--tab--list\">\n              <div class=\"${prefix}--sub-content-left\"></div>\n              <slot @slotchange=${handleSlotchange}></slot>\n              <div class=\"${prefix}--sub-content-right\"></div>\n            </div>\n          </div>\n        </div>\n      </div>\n      ${this.renderNextButton()}\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  protected _updateTabsState() {\n    const { selectorItem } = this.constructor as typeof CDSTabs;\n    const tabs = this.querySelectorAll<CDSTab>(selectorItem);\n    tabs.forEach((tab, index) => {\n      tab._dismissable = this.dismissable;\n      tab._index = index;\n    });\n  }\n\n  protected _tabInitialLoad() {\n    const { selectorTablist, selectorItemEnabled } = this\n      .constructor as typeof CDSTabs;\n    const { selectionMode, selectedIndex } = this;\n    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion -- https://github.com/carbon-design-system/carbon/issues/20452\n    const tablist = this.shadowRoot!.querySelector(selectorTablist)!;\n    this.tablist = tablist;\n    const firstItem =\n      this.querySelectorAll<CDSTab>(selectorItemEnabled)[selectedIndex];\n    if (firstItem) {\n      if (selectionMode === 'manual') {\n        firstItem.highlighted = true;\n      }\n      firstItem.selected = true;\n      this.value = firstItem.value;\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   * A selector that returns the tablist\n   */\n  static get selectorTablist() {\n    return `.${prefix}--tab--list`;\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 isVertical Whether the tabs are in vertical orientation.\n   * @returns A action for tabs for the given key symbol.\n   */\n  static getAction(key: string, isVertical = false) {\n    if (key === 'Home') {\n      return TABS_KEYBOARD_ACTION.HOME;\n    }\n    if (key === 'End') {\n      return TABS_KEYBOARD_ACTION.END;\n    }\n    // Check for navigation keys based on orientation\n    const navigationKeys = isVertical\n      ? VERTICAL_NAVIGATION_DIRECTION\n      : NAVIGATION_DIRECTION;\n    if (key in navigationKeys) {\n      return TABS_KEYBOARD_ACTION.NAVIGATING;\n    }\n    if (key === 'Enter' || key === ' ') {\n      return TABS_KEYBOARD_ACTION.ACTIVATING;\n    }\n    return TABS_KEYBOARD_ACTION.NONE;\n  }\n}\n"],"mappings":"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"}

package/es-custom/components/tag/defs.js.map

@@ -1 +1 @@
-{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/tag/defs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2020, 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\n/**\n * Tag size.\n */\nexport enum TAG_SIZE {\n  /**\n   * Large size.\n   */\n  LARGE = 'lg',\n\n  /**\n   * Medium size (default).\n   */\n  MEDIUM = 'md',\n\n  /**\n   * Small size.\n   */\n  SMALL = 'sm',\n}\n\nexport enum TAG_TYPE {\n  /**\n   * Red color.\n   */\n  RED = 'red',\n\n  /**\n   * Magenta color.\n   */\n  MAGENTA = 'magenta',\n\n  /**\n   * Purple color.\n   */\n  PURPLE = 'purple',\n\n  /**\n   * Blue color.\n   */\n  BLUE = 'blue',\n\n  /**\n   * Cyan color.\n   */\n  CYAN = 'cyan',\n\n  /**\n   * Teal color.\n   */\n  TEAL = 'teal',\n\n  /**\n   * Green color.\n   */\n  GREEN = 'green',\n\n  /**\n   * Gray color.\n   */\n  GRAY = 'gray',\n\n  /**\n   * Cool gray color.\n   */\n  'COOL-GRAY' = 'cool-gray',\n\n  /**\n   * Warn gray color.\n   */\n  'WARM-GRAY' = 'warm-gray',\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAY,WAAL,yBAAA,UAAA;;;;AAIL,UAAA,WAAA;;;;AAKA,UAAA,YAAA;;;;AAKA,UAAA,WAAA;;KACD;AAED,IAAY,WAAL,yBAAA,UAAA;;;;AAIL,UAAA,SAAA;;;;AAKA,UAAA,aAAA;;;;AAKA,UAAA,YAAA;;;;AAKA,UAAA,UAAA;;;;AAKA,UAAA,UAAA;;;;AAKA,UAAA,UAAA;;;;AAKA,UAAA,WAAA;;;;AAKA,UAAA,UAAA;;;;AAKA,UAAA,eAAA;;;;AAKA,UAAA,eAAA;;KACD"}
+{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/tag/defs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2020, 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\n/**\n * Tag size.\n */\nexport enum TAG_SIZE {\n  /**\n   * Large size.\n   */\n  LARGE = 'lg',\n\n  /**\n   * Medium size (default).\n   */\n  MEDIUM = 'md',\n\n  /**\n   * Small size.\n   */\n  SMALL = 'sm',\n}\n\nexport enum TAG_TYPE {\n  /**\n   * Red color.\n   */\n  RED = 'red',\n\n  /**\n   * Magenta color.\n   */\n  MAGENTA = 'magenta',\n\n  /**\n   * Purple color.\n   */\n  PURPLE = 'purple',\n\n  /**\n   * Blue color.\n   */\n  BLUE = 'blue',\n\n  /**\n   * Cyan color.\n   */\n  CYAN = 'cyan',\n\n  /**\n   * Teal color.\n   */\n  TEAL = 'teal',\n\n  /**\n   * Green color.\n   */\n  GREEN = 'green',\n\n  /**\n   * Gray color.\n   */\n  GRAY = 'gray',\n\n  /**\n   * Cool gray color.\n   */\n  'COOL-GRAY' = 'cool-gray',\n\n  /**\n   * Warn gray color.\n   */\n  'WARM-GRAY' = 'warm-gray',\n}\n"],"mappings":";;;;;;;;;;;;;;;;;AAUA,IAAY,WAAL,yBAAA,UAAA;;;;CAIL,SAAA,WAAA;;;;CAKA,SAAA,YAAA;;;;CAKA,SAAA,WAAA;;AACF,EAAA,CAAA,CAAA;AAEA,IAAY,WAAL,yBAAA,UAAA;;;;CAIL,SAAA,SAAA;;;;CAKA,SAAA,aAAA;;;;CAKA,SAAA,YAAA;;;;CAKA,SAAA,UAAA;;;;CAKA,SAAA,UAAA;;;;CAKA,SAAA,UAAA;;;;CAKA,SAAA,WAAA;;;;CAKA,SAAA,UAAA;;;;CAKA,SAAA,eAAA;;;;CAKA,SAAA,eAAA;;AACF,EAAA,CAAA,CAAA"}

package/es-custom/components/tag/dismissible-tag.js

@@ -7,7 +7,7 @@
 
 import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.135.0/helpers/esm/decorate.js";
 import iconLoader from "../../globals/internal/icon-loader.js";
 import FocusMixin from "../../globals/mixins/focus.js";
 import HostListener from "../../globals/decorators/host-listener.js";