@carbon/web-components 2.52.0 → 2.53.0

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

@@ -5,16 +5,15 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { prefix } from "../../globals/settings.js";
+import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
 import HostListener from "../../globals/decorators/host-listener.js";
 import HostListenerMixin from "../../globals/mixins/host-listener.js";
-import { NAVIGATION_DIRECTION } from "../../globals/internal/radio-group-manager.js";
+import "../../globals/internal/radio-group-manager.js";
 import tile_default from "./tile.scss.js";
 import { LitElement, html } from "lit";
 import { property } from "lit/decorators.js";
-
 //#region src/components/tile/tile-group.ts
 /**
 * Copyright IBM Corp. 2019, 2024
@@ -26,14 +25,14 @@ import { property } from "lit/decorators.js";
 * Map of navigation direction by key.
 */
 const navigationDirectionForKey = {
-	ArrowUp: NAVIGATION_DIRECTION.BACKWARD,
-	Up: NAVIGATION_DIRECTION.BACKWARD,
-	ArrowLeft: NAVIGATION_DIRECTION.BACKWARD,
-	Left: NAVIGATION_DIRECTION.BACKWARD,
-	ArrowDown: NAVIGATION_DIRECTION.FORWARD,
-	Down: NAVIGATION_DIRECTION.FORWARD,
-	ArrowRight: NAVIGATION_DIRECTION.FORWARD,
-	Right: NAVIGATION_DIRECTION.FORWARD
+	ArrowUp: -1,
+	Up: -1,
+	ArrowLeft: -1,
+	Left: -1,
+	ArrowDown: 1,
+	Down: 1,
+	ArrowRight: 1,
+	Right: 1
 };
 /**
 * Tile group.
@@ -51,7 +50,7 @@ let CDSTileGroup = class CDSTileGroup extends HostListenerMixin(LitElement) {
 			const { target, key } = event;
 			const { radioTiles, selectableTiles } = this;
 			const navigationDirection = navigationDirectionForKey[key];
-			if (target?.matches(`${prefix}-ai-label`)) return;
+			if (target?.matches(`cds-ai-label`)) return;
 			const tiles = radioTiles.length ? radioTiles : selectableTiles;
 			const nextIndex = [...tiles].findIndex((e) => e == target) + navigationDirection;
 			const nextSibling = nextIndex !== -1 ? tiles[nextIndex % tiles.length] : tiles[tiles.length - 1];
@@ -63,7 +62,7 @@ let CDSTileGroup = class CDSTileGroup extends HostListenerMixin(LitElement) {
 		};
 		this._handleFocus = (event) => {
 			const { relatedTarget, target } = event;
-			if (target?.matches(`${prefix}-ai-label`)) return;
+			if (target?.matches(`cds-ai-label`)) return;
 			if (this.radioTiles.length) {
 				if (!this.currentRadioSelection) {
 					target.toggleAttribute("selected");
@@ -77,7 +76,7 @@ let CDSTileGroup = class CDSTileGroup extends HostListenerMixin(LitElement) {
 		const { target } = event;
 		const { currentRadioSelection } = this;
 		const { eventCurrentRadioTileSelection } = this.constructor;
-		if (target.matches(`${prefix}-ai-label`)) return;
+		if (target.matches(`cds-ai-label`)) return;
 		if (!currentRadioSelection) this.currentRadioSelection = target;
 		else if (currentRadioSelection !== target) {
 			currentRadioSelection.toggleAttribute("selected");
@@ -154,7 +153,7 @@ let CDSTileGroup = class CDSTileGroup extends HostListenerMixin(LitElement) {
 		const { fieldsetClassName, disabled } = this;
 		return html`
       <fieldset class="${fieldsetClassName}" ?disabled=${disabled}>
-        <slot name="legend" class="${prefix}--label"></slot>
+        <slot name="legend" class="${"cds"}--label"></slot>
         <slot></slot>
       </fieldset>
     `;
@@ -163,25 +162,25 @@ let CDSTileGroup = class CDSTileGroup extends HostListenerMixin(LitElement) {
 	* A selector that selects a radio tile component.
 	*/
 	static get selectorRadioTile() {
-		return `${prefix}-radio-tile`;
+		return `cds-radio-tile`;
 	}
 	/**
 	* A selector that selects a selectable tile component.
 	*/
 	static get selectorSelectableTile() {
-		return `${prefix}-selectable-tile`;
+		return `cds-selectable-tile`;
 	}
 	/**
 	* The name of the custom event fired after a radio tile changes its selected state.
 	*/
 	static get eventCurrentRadioTileSelection() {
-		return `${prefix}-current-radio-tile-selection`;
+		return `cds-current-radio-tile-selection`;
 	}
 	/**
 	* The name of the custom event fired after a radio tile changes its selected state.
 	*/
 	static get eventCurrentSelectableTilesSelection() {
-		return `${prefix}-current-selectable-tile-selections`;
+		return `cds-current-selectable-tile-selections`;
 	}
 	static {
 		this.styles = tile_default;
@@ -202,9 +201,9 @@ __decorate([property()], CDSTileGroup.prototype, "currentRadioSelection", void 0
 __decorate([property()], CDSTileGroup.prototype, "currentSelections", void 0);
 __decorate([property()], CDSTileGroup.prototype, "radioTiles", void 0);
 __decorate([property()], CDSTileGroup.prototype, "selectableTiles", void 0);
-CDSTileGroup = __decorate([carbonElement(`${prefix}-tile-group`)], CDSTileGroup);
+CDSTileGroup = __decorate([carbonElement(`cds-tile-group`)], CDSTileGroup);
 var tile_group_default = CDSTileGroup;
-
 //#endregion
 export { tile_group_default as default };
+
 //# sourceMappingURL=tile-group.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"tile-group.js","names":["styles","customElement"],"sources":["../../../src/components/tile/tile-group.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2024\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 { prefix } from '../../globals/settings';\nimport { NAVIGATION_DIRECTION } from '../../globals/internal/radio-group-manager';\nimport HostListener from '../../globals/decorators/host-listener';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport styles from './tile.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  ArrowLeft: NAVIGATION_DIRECTION.BACKWARD,\n  Left: NAVIGATION_DIRECTION.BACKWARD, // IE\n  ArrowDown: NAVIGATION_DIRECTION.FORWARD,\n  Down: NAVIGATION_DIRECTION.FORWARD, // IE\n  ArrowRight: NAVIGATION_DIRECTION.FORWARD,\n  Right: NAVIGATION_DIRECTION.FORWARD, // IE\n};\n\n/**\n * Tile group.\n *\n * @element cds-tile-group\n * @fires cds-current-radio-tile-selection\n *   The name of the custom event fired after a radio tile changes its selected state.\n * @fires cds-current-selectable-tile-selections\n *   The name of the custom event fired after a selectable tile changes its selected state.\n */\n@customElement(`${prefix}-tile-group`)\nclass CDSTileGroup extends HostListenerMixin(LitElement) {\n  private _handleRadioClick(event) {\n    const { target } = event;\n    const { currentRadioSelection } = this;\n    const { eventCurrentRadioTileSelection } = this\n      .constructor as typeof CDSTileGroup;\n\n    if (target.matches(`${prefix}-ai-label`)) {\n      return;\n    }\n\n    if (!currentRadioSelection) {\n      this.currentRadioSelection = target;\n    } else if (currentRadioSelection !== target) {\n      currentRadioSelection.toggleAttribute('selected');\n      this.currentRadioSelection = target;\n    }\n\n    this.dispatchEvent(\n      new CustomEvent(eventCurrentRadioTileSelection, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          target,\n        },\n      })\n    );\n  }\n\n  /**\n   * Click listener to ensure selectability.\n   *\n   * @param event click\n   */\n  @HostListener('click')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n  // @ts-expect-error\n  private _handleTileSelect(event: Event) {\n    if (this.radioTiles.length) {\n      this._handleRadioClick(event);\n    }\n  }\n\n  /**\n   * Handle keyboard navigation for radio tiles\n   *\n   * @param nextSibling to focus on\n   */\n  private _handleKeydownRadio(nextSibling) {\n    const { currentRadioSelection } = this;\n\n    const { eventCurrentRadioTileSelection } = this\n      .constructor as typeof CDSTileGroup;\n\n    if (currentRadioSelection) {\n      currentRadioSelection.toggleAttribute('selected');\n    }\n    nextSibling.focus();\n    nextSibling.toggleAttribute('selected');\n    this.currentRadioSelection = nextSibling;\n\n    this.dispatchEvent(\n      new CustomEvent(eventCurrentRadioTileSelection, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          nextSibling,\n        },\n      })\n    );\n  }\n\n  /**\n   * Handle keyboard navigation for selectable tiles\n   *\n   * @param event to get target\n   * @param nextSibling to focus on\n   */\n  private _handleKeydownSelectable(event, nextSibling?) {\n    const { target } = event;\n    const { currentSelections } = this;\n    const { eventCurrentSelectableTilesSelection } = this\n      .constructor as typeof CDSTileGroup;\n\n    if (nextSibling) {\n      nextSibling.focus();\n    } else {\n      if (!currentSelections.includes(target)) {\n        currentSelections.push(target);\n      } else {\n        currentSelections.splice(currentSelections.indexOf(target), 1);\n      }\n\n      this.dispatchEvent(\n        new CustomEvent(eventCurrentSelectableTilesSelection, {\n          bubbles: true,\n          composed: true,\n          detail: {\n            currentSelections,\n          },\n        })\n      );\n    }\n  }\n\n  /**\n   * Keyboard listener to ensure keyboard navigation.\n   *\n   * @param event to get key pressed\n   */\n  @HostListener('keydown')\n  // @ts-expect-error: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleKeydown = (event: KeyboardEvent) => {\n    const { target, key } = event;\n    const { radioTiles, selectableTiles } = this;\n    const navigationDirection = navigationDirectionForKey[key];\n\n    if ((target as HTMLElement)?.matches(`${prefix}-ai-label`)) {\n      return;\n    }\n\n    const tiles = radioTiles.length ? radioTiles : selectableTiles;\n    const currentIndex = [...tiles].findIndex((e) => e == target);\n    const nextIndex = currentIndex + navigationDirection;\n    const nextSibling =\n      nextIndex !== -1\n        ? tiles[nextIndex % tiles.length]\n        : tiles[tiles.length - 1];\n\n    if (navigationDirection) {\n      event.preventDefault(); // Prevent default (scrolling) behavior\n\n      if (this.radioTiles.length) {\n        this._handleKeydownRadio(nextSibling);\n      } else {\n        this._handleKeydownSelectable(event, nextSibling);\n      }\n    } else if (key === ' ' || key === 'Enter') {\n      this._handleKeydownSelectable(event);\n    }\n  };\n\n  /**\n   * Focus listener to focus on selected element upon focusing\n   *\n   * @param event to get focused\n   */\n  @HostListener('focusin')\n  // @ts-expect-error: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleFocus = (event: KeyboardEvent) => {\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452\n    const { relatedTarget, target } = event as any;\n    if ((target as HTMLElement)?.matches(`${prefix}-ai-label`)) {\n      return;\n    }\n\n    if (this.radioTiles.length) {\n      if (!this.currentRadioSelection) {\n        target.toggleAttribute('selected');\n        this.currentRadioSelection = target;\n      } else if (\n        !relatedTarget?.matches(\n          (this.constructor as typeof CDSTileGroup).selectorRadioTile\n        ) &&\n        target !== this.currentRadioSelection\n      ) {\n        this.currentRadioSelection.focus();\n      }\n    }\n  };\n\n  /**\n   * Provide an optional className to be applied to the component\n   */\n  @property({ reflect: true, attribute: 'fieldset-class-name' })\n  fieldsetClassName;\n\n  /**\n   * Specify whether the group is disabled\n   */\n  @property({ reflect: true, type: Boolean })\n  disabled;\n\n  @property()\n  currentRadioSelection;\n\n  @property()\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452\n  currentSelections = [] as any;\n\n  @property()\n  radioTiles;\n\n  @property()\n  selectableTiles;\n\n  firstUpdated() {\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'group');\n    }\n\n    if (!this.radioTiles) {\n      this.radioTiles = this.querySelectorAll(\n        (this.constructor as typeof CDSTileGroup).selectorRadioTile\n      );\n      this.radioTiles.forEach((tile) => {\n        if (tile.selected) {\n          this.currentRadioSelection = tile;\n        }\n      });\n    }\n\n    if (!this.selectableTiles) {\n      this.selectableTiles = this.querySelectorAll(\n        (this.constructor as typeof CDSTileGroup).selectorSelectableTile\n      );\n    }\n\n    if (this.disabled) {\n      this.radioTiles.forEach((e) => e.toggleAttribute('disabled'));\n      this.selectableTiles.forEach((e) => e.toggleAttribute('disabled'));\n    }\n  }\n\n  render() {\n    const { fieldsetClassName, disabled } = this;\n    return html`\n      <fieldset class=\"${fieldsetClassName}\" ?disabled=${disabled}>\n        <slot name=\"legend\" class=\"${prefix}--label\"></slot>\n        <slot></slot>\n      </fieldset>\n    `;\n  }\n\n  /**\n   * A selector that selects a radio tile component.\n   */\n  static get selectorRadioTile() {\n    return `${prefix}-radio-tile`;\n  }\n\n  /**\n   * A selector that selects a selectable tile component.\n   */\n  static get selectorSelectableTile() {\n    return `${prefix}-selectable-tile`;\n  }\n\n  /**\n   * The name of the custom event fired after a radio tile changes its selected state.\n   */\n  static get eventCurrentRadioTileSelection() {\n    return `${prefix}-current-radio-tile-selection`;\n  }\n\n  /**\n   * The name of the custom event fired after a radio tile changes its selected state.\n   */\n  static get eventCurrentSelectableTilesSelection() {\n    return `${prefix}-current-selectable-tile-selections`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSTileGroup;\n"],"mappings":"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"}
+{"version":3,"file":"tile-group.js","names":["styles","customElement"],"sources":["../../../src/components/tile/tile-group.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2019, 2024\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 { prefix } from '../../globals/settings';\nimport { NAVIGATION_DIRECTION } from '../../globals/internal/radio-group-manager';\nimport HostListener from '../../globals/decorators/host-listener';\nimport HostListenerMixin from '../../globals/mixins/host-listener';\nimport styles from './tile.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  ArrowLeft: NAVIGATION_DIRECTION.BACKWARD,\n  Left: NAVIGATION_DIRECTION.BACKWARD, // IE\n  ArrowDown: NAVIGATION_DIRECTION.FORWARD,\n  Down: NAVIGATION_DIRECTION.FORWARD, // IE\n  ArrowRight: NAVIGATION_DIRECTION.FORWARD,\n  Right: NAVIGATION_DIRECTION.FORWARD, // IE\n};\n\n/**\n * Tile group.\n *\n * @element cds-tile-group\n * @fires cds-current-radio-tile-selection\n *   The name of the custom event fired after a radio tile changes its selected state.\n * @fires cds-current-selectable-tile-selections\n *   The name of the custom event fired after a selectable tile changes its selected state.\n */\n@customElement(`${prefix}-tile-group`)\nclass CDSTileGroup extends HostListenerMixin(LitElement) {\n  private _handleRadioClick(event) {\n    const { target } = event;\n    const { currentRadioSelection } = this;\n    const { eventCurrentRadioTileSelection } = this\n      .constructor as typeof CDSTileGroup;\n\n    if (target.matches(`${prefix}-ai-label`)) {\n      return;\n    }\n\n    if (!currentRadioSelection) {\n      this.currentRadioSelection = target;\n    } else if (currentRadioSelection !== target) {\n      currentRadioSelection.toggleAttribute('selected');\n      this.currentRadioSelection = target;\n    }\n\n    this.dispatchEvent(\n      new CustomEvent(eventCurrentRadioTileSelection, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          target,\n        },\n      })\n    );\n  }\n\n  /**\n   * Click listener to ensure selectability.\n   *\n   * @param event click\n   */\n  @HostListener('click')\n  // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n  // @ts-expect-error\n  private _handleTileSelect(event: Event) {\n    if (this.radioTiles.length) {\n      this._handleRadioClick(event);\n    }\n  }\n\n  /**\n   * Handle keyboard navigation for radio tiles\n   *\n   * @param nextSibling to focus on\n   */\n  private _handleKeydownRadio(nextSibling) {\n    const { currentRadioSelection } = this;\n\n    const { eventCurrentRadioTileSelection } = this\n      .constructor as typeof CDSTileGroup;\n\n    if (currentRadioSelection) {\n      currentRadioSelection.toggleAttribute('selected');\n    }\n    nextSibling.focus();\n    nextSibling.toggleAttribute('selected');\n    this.currentRadioSelection = nextSibling;\n\n    this.dispatchEvent(\n      new CustomEvent(eventCurrentRadioTileSelection, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          nextSibling,\n        },\n      })\n    );\n  }\n\n  /**\n   * Handle keyboard navigation for selectable tiles\n   *\n   * @param event to get target\n   * @param nextSibling to focus on\n   */\n  private _handleKeydownSelectable(event, nextSibling?) {\n    const { target } = event;\n    const { currentSelections } = this;\n    const { eventCurrentSelectableTilesSelection } = this\n      .constructor as typeof CDSTileGroup;\n\n    if (nextSibling) {\n      nextSibling.focus();\n    } else {\n      if (!currentSelections.includes(target)) {\n        currentSelections.push(target);\n      } else {\n        currentSelections.splice(currentSelections.indexOf(target), 1);\n      }\n\n      this.dispatchEvent(\n        new CustomEvent(eventCurrentSelectableTilesSelection, {\n          bubbles: true,\n          composed: true,\n          detail: {\n            currentSelections,\n          },\n        })\n      );\n    }\n  }\n\n  /**\n   * Keyboard listener to ensure keyboard navigation.\n   *\n   * @param event to get key pressed\n   */\n  @HostListener('keydown')\n  // @ts-expect-error: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleKeydown = (event: KeyboardEvent) => {\n    const { target, key } = event;\n    const { radioTiles, selectableTiles } = this;\n    const navigationDirection = navigationDirectionForKey[key];\n\n    if ((target as HTMLElement)?.matches(`${prefix}-ai-label`)) {\n      return;\n    }\n\n    const tiles = radioTiles.length ? radioTiles : selectableTiles;\n    const currentIndex = [...tiles].findIndex((e) => e == target);\n    const nextIndex = currentIndex + navigationDirection;\n    const nextSibling =\n      nextIndex !== -1\n        ? tiles[nextIndex % tiles.length]\n        : tiles[tiles.length - 1];\n\n    if (navigationDirection) {\n      event.preventDefault(); // Prevent default (scrolling) behavior\n\n      if (this.radioTiles.length) {\n        this._handleKeydownRadio(nextSibling);\n      } else {\n        this._handleKeydownSelectable(event, nextSibling);\n      }\n    } else if (key === ' ' || key === 'Enter') {\n      this._handleKeydownSelectable(event);\n    }\n  };\n\n  /**\n   * Focus listener to focus on selected element upon focusing\n   *\n   * @param event to get focused\n   */\n  @HostListener('focusin')\n  // @ts-expect-error: The decorator refers to this method but TS thinks this method is not referred to\n  private _handleFocus = (event: KeyboardEvent) => {\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452\n    const { relatedTarget, target } = event as any;\n    if ((target as HTMLElement)?.matches(`${prefix}-ai-label`)) {\n      return;\n    }\n\n    if (this.radioTiles.length) {\n      if (!this.currentRadioSelection) {\n        target.toggleAttribute('selected');\n        this.currentRadioSelection = target;\n      } else if (\n        !relatedTarget?.matches(\n          (this.constructor as typeof CDSTileGroup).selectorRadioTile\n        ) &&\n        target !== this.currentRadioSelection\n      ) {\n        this.currentRadioSelection.focus();\n      }\n    }\n  };\n\n  /**\n   * Provide an optional className to be applied to the component\n   */\n  @property({ reflect: true, attribute: 'fieldset-class-name' })\n  fieldsetClassName;\n\n  /**\n   * Specify whether the group is disabled\n   */\n  @property({ reflect: true, type: Boolean })\n  disabled;\n\n  @property()\n  currentRadioSelection;\n\n  @property()\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452\n  currentSelections = [] as any;\n\n  @property()\n  radioTiles;\n\n  @property()\n  selectableTiles;\n\n  firstUpdated() {\n    if (!this.hasAttribute('role')) {\n      this.setAttribute('role', 'group');\n    }\n\n    if (!this.radioTiles) {\n      this.radioTiles = this.querySelectorAll(\n        (this.constructor as typeof CDSTileGroup).selectorRadioTile\n      );\n      this.radioTiles.forEach((tile) => {\n        if (tile.selected) {\n          this.currentRadioSelection = tile;\n        }\n      });\n    }\n\n    if (!this.selectableTiles) {\n      this.selectableTiles = this.querySelectorAll(\n        (this.constructor as typeof CDSTileGroup).selectorSelectableTile\n      );\n    }\n\n    if (this.disabled) {\n      this.radioTiles.forEach((e) => e.toggleAttribute('disabled'));\n      this.selectableTiles.forEach((e) => e.toggleAttribute('disabled'));\n    }\n  }\n\n  render() {\n    const { fieldsetClassName, disabled } = this;\n    return html`\n      <fieldset class=\"${fieldsetClassName}\" ?disabled=${disabled}>\n        <slot name=\"legend\" class=\"${prefix}--label\"></slot>\n        <slot></slot>\n      </fieldset>\n    `;\n  }\n\n  /**\n   * A selector that selects a radio tile component.\n   */\n  static get selectorRadioTile() {\n    return `${prefix}-radio-tile`;\n  }\n\n  /**\n   * A selector that selects a selectable tile component.\n   */\n  static get selectorSelectableTile() {\n    return `${prefix}-selectable-tile`;\n  }\n\n  /**\n   * The name of the custom event fired after a radio tile changes its selected state.\n   */\n  static get eventCurrentRadioTileSelection() {\n    return `${prefix}-current-radio-tile-selection`;\n  }\n\n  /**\n   * The name of the custom event fired after a radio tile changes its selected state.\n   */\n  static get eventCurrentSelectableTilesSelection() {\n    return `${prefix}-current-selectable-tile-selections`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSTileGroup;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAmBA,MAAM,4BAA4B;CAChC,SAAA;CACA,IAAA;CACA,WAAA;CACA,MAAA;CACA,WAAA;CACA,MAAA;CACA,YAAA;CACA,OAAA;CACD;;;;;;;;;;AAWD,IAAA,eAAA,MACM,qBAAqB,kBAAkB,WAAW,CAAC;;;yBAgH7B,UAAyB;GACjD,MAAM,EAAE,QAAQ,QAAQ;GACxB,MAAM,EAAE,YAAY,oBAAoB;GACxC,MAAM,sBAAsB,0BAA0B;AAEtD,OAAK,QAAwB,QAAQ,eAAqB,CACxD;GAGF,MAAM,QAAQ,WAAW,SAAS,aAAa;GAE/C,MAAM,YADe,CAAC,GAAG,MAAM,CAAC,WAAW,MAAM,KAAK,OAAO,GAC5B;GACjC,MAAM,cACJ,cAAc,KACV,MAAM,YAAY,MAAM,UACxB,MAAM,MAAM,SAAS;AAE3B,OAAI,qBAAqB;AACvB,UAAM,gBAAgB;AAEtB,QAAI,KAAK,WAAW,OAClB,MAAK,oBAAoB,YAAY;QAErC,MAAK,yBAAyB,OAAO,YAAY;cAE1C,QAAQ,OAAO,QAAQ,QAChC,MAAK,yBAAyB,MAAM;;uBAWhB,UAAyB;GAE/C,MAAM,EAAE,eAAe,WAAW;AAClC,OAAK,QAAwB,QAAQ,eAAqB,CACxD;AAGF,OAAI,KAAK,WAAW;QACd,CAAC,KAAK,uBAAuB;AAC/B,YAAO,gBAAgB,WAAW;AAClC,UAAK,wBAAwB;eAE7B,CAAC,eAAe,QACb,KAAK,YAAoC,kBAC3C,IACD,WAAW,KAAK,sBAEhB,MAAK,sBAAsB,OAAO;;;2BAsBpB,EAAE;;CA3LtB,kBAA0B,OAAO;EAC/B,MAAM,EAAE,WAAW;EACnB,MAAM,EAAE,0BAA0B;EAClC,MAAM,EAAE,mCAAmC,KACxC;AAEH,MAAI,OAAO,QAAQ,eAAqB,CACtC;AAGF,MAAI,CAAC,sBACH,MAAK,wBAAwB;WACpB,0BAA0B,QAAQ;AAC3C,yBAAsB,gBAAgB,WAAW;AACjD,QAAK,wBAAwB;;AAG/B,OAAK,cACH,IAAI,YAAY,gCAAgC;GAC9C,SAAS;GACT,UAAU;GACV,QAAQ,EACN,QACD;GACF,CAAC,CACH;;;;;;;CAQH,kBAG0B,OAAc;AACtC,MAAI,KAAK,WAAW,OAClB,MAAK,kBAAkB,MAAM;;;;;;;CASjC,oBAA4B,aAAa;EACvC,MAAM,EAAE,0BAA0B;EAElC,MAAM,EAAE,mCAAmC,KACxC;AAEH,MAAI,sBACF,uBAAsB,gBAAgB,WAAW;AAEnD,cAAY,OAAO;AACnB,cAAY,gBAAgB,WAAW;AACvC,OAAK,wBAAwB;AAE7B,OAAK,cACH,IAAI,YAAY,gCAAgC;GAC9C,SAAS;GACT,UAAU;GACV,QAAQ,EACN,aACD;GACF,CAAC,CACH;;;;;;;;CASH,yBAAiC,OAAO,aAAc;EACpD,MAAM,EAAE,WAAW;EACnB,MAAM,EAAE,sBAAsB;EAC9B,MAAM,EAAE,yCAAyC,KAC9C;AAEH,MAAI,YACF,aAAY,OAAO;OACd;AACL,OAAI,CAAC,kBAAkB,SAAS,OAAO,CACrC,mBAAkB,KAAK,OAAO;OAE9B,mBAAkB,OAAO,kBAAkB,QAAQ,OAAO,EAAE,EAAE;AAGhE,QAAK,cACH,IAAI,YAAY,sCAAsC;IACpD,SAAS;IACT,UAAU;IACV,QAAQ,EACN,mBACD;IACF,CAAC,CACH;;;CA+FL,eAAe;AACb,MAAI,CAAC,KAAK,aAAa,OAAO,CAC5B,MAAK,aAAa,QAAQ,QAAQ;AAGpC,MAAI,CAAC,KAAK,YAAY;AACpB,QAAK,aAAa,KAAK,iBACpB,KAAK,YAAoC,kBAC3C;AACD,QAAK,WAAW,SAAS,SAAS;AAChC,QAAI,KAAK,SACP,MAAK,wBAAwB;KAE/B;;AAGJ,MAAI,CAAC,KAAK,gBACR,MAAK,kBAAkB,KAAK,iBACzB,KAAK,YAAoC,uBAC3C;AAGH,MAAI,KAAK,UAAU;AACjB,QAAK,WAAW,SAAS,MAAM,EAAE,gBAAgB,WAAW,CAAC;AAC7D,QAAK,gBAAgB,SAAS,MAAM,EAAE,gBAAgB,WAAW,CAAC;;;CAItE,SAAS;EACP,MAAM,EAAE,mBAAmB,aAAa;AACxC,SAAO,IAAI;yBACU,kBAAkB,cAAc,SAAS;2CACtB;;;;;;;;CAS1C,WAAW,oBAAoB;AAC7B,SAAO;;;;;CAMT,WAAW,yBAAyB;AAClC,SAAO;;;;;CAMT,WAAW,iCAAiC;AAC1C,SAAO;;;;;CAMT,WAAW,uCAAuC;AAChD,SAAO;;;gBAGOA;;;YApOf,aAAa,QAAQ,CAAA,EAAA,aAAA,WAAA,qBAAA,KAAA;YA4ErB,aAAa,UAAU,CAAA,EAAA,aAAA,WAAA,kBAAA,KAAA,EAAA;YAqCvB,aAAa,UAAU,CAAA,EAAA,aAAA,WAAA,gBAAA,KAAA,EAAA;YA2BvB,SAAS;CAAE,SAAS;CAAM,WAAW;CAAuB,CAAC,CAAA,EAAA,aAAA,WAAA,qBAAA,KAAA,EAAA;YAM7D,SAAS;CAAE,SAAS;CAAM,MAAM;CAAS,CAAC,CAAA,EAAA,aAAA,WAAA,YAAA,KAAA,EAAA;YAG1C,UAAU,CAAA,EAAA,aAAA,WAAA,yBAAA,KAAA,EAAA;YAGV,UAAU,CAAA,EAAA,aAAA,WAAA,qBAAA,KAAA,EAAA;YAIV,UAAU,CAAA,EAAA,aAAA,WAAA,cAAA,KAAA,EAAA;YAGV,UAAU,CAAA,EAAA,aAAA,WAAA,mBAAA,KAAA,EAAA;2BAlMZC,cAAc,iBAAuB,CAAA,EAAA,aAAA;AA0QtC,IAAA,qBAAe"}

package/es/components/tile/tile.js

@@ -5,14 +5,13 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { prefix } from "../../globals/settings.js";
+import "../../globals/settings.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
 import { FORM_ELEMENT_COLOR_SCHEME } from "../../globals/shared-enums.js";
 import tile_default$1 from "./tile.scss.js";
 import { LitElement, html } from "lit";
 import { property } from "lit/decorators.js";
-
 //#region src/components/tile/tile.ts
 /**
 * Copyright IBM Corp. 2019, 2023
@@ -29,7 +28,7 @@ let CDSTile = class CDSTile extends LitElement {
 	constructor(..._args) {
 		super(..._args);
 		this._hasAILabel = false;
-		this.colorScheme = FORM_ELEMENT_COLOR_SCHEME.REGULAR;
+		this.colorScheme = "";
 		this.hasRoundedCorners = false;
 	}
 	/**
@@ -59,13 +58,13 @@ let CDSTile = class CDSTile extends LitElement {
 	* TODO: remove in v12
 	*/
 	static get slugItem() {
-		return `${prefix}-slug`;
+		return `cds-slug`;
 	}
 	/**
 	* A selector that will return the AI Label item.
 	*/
 	static get aiLabelItem() {
-		return `${prefix}-ai-label`;
+		return `cds-ai-label`;
 	}
 	static {
 		this.styles = tile_default$1;
@@ -79,9 +78,9 @@ __decorate([property({
 	type: Boolean,
 	attribute: "has-rounded-corners"
 })], CDSTile.prototype, "hasRoundedCorners", void 0);
-CDSTile = __decorate([carbonElement(`${prefix}-tile`)], CDSTile);
+CDSTile = __decorate([carbonElement(`cds-tile`)], CDSTile);
 var tile_default = CDSTile;
-
 //#endregion
 export { FORM_ELEMENT_COLOR_SCHEME as TILE_COLOR_SCHEME, tile_default as default };
+
 //# sourceMappingURL=tile.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"tile.js","names":["TILE_COLOR_SCHEME","styles","customElement"],"sources":["../../../src/components/tile/tile.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 } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { TILE_COLOR_SCHEME } from './defs';\nimport styles from './tile.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport { TILE_COLOR_SCHEME };\n\n/**\n * Basic tile.\n *\n * @element cds-tile\n */\n@customElement(`${prefix}-tile`)\nclass CDSTile extends LitElement {\n  /**\n   * `true` if there is an AI Label.\n   */\n  protected _hasAILabel = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleSlotChange({ target }: Event) {\n    const hasContent = (target as HTMLSlotElement)\n      .assignedNodes()\n      .filter((elem) =>\n        (elem as HTMLElement).matches !== undefined\n          ? (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSTile).aiLabelItem\n            ) ||\n            // remove reference of slug in v12\n            (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSTile).slugItem\n            )\n          : false\n      );\n    if (hasContent.length > 0) {\n      this._hasAILabel = Boolean(hasContent);\n      (hasContent[0] as HTMLElement).setAttribute('size', 'xs');\n    }\n    this.requestUpdate();\n  }\n\n  /**\n   * The color scheme.\n   *\n   * @deprecated\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TILE_COLOR_SCHEME.REGULAR;\n\n  /**\n   * Specify if the `Tile` component should be rendered with rounded corners.\n   * Only valid when `ai-label` prop is present\n   */\n  @property({ type: Boolean, attribute: 'has-rounded-corners' })\n  hasRoundedCorners = false;\n\n  updated() {\n    if (this._hasAILabel) {\n      this.setAttribute('ai-label', '');\n    } else {\n      this.removeAttribute('ai-label');\n    }\n  }\n\n  render() {\n    return html` <slot></slot\n      ><slot name=\"decorator\" @slotchange=\"${this._handleSlotChange}\"></slot>\n      <slot name=\"ai-label\" @slotchange=\"${this._handleSlotChange}\"></slot\n      ><slot name=\"slug\" @slotchange=\"${this._handleSlotChange}\"></slot>`;\n  }\n\n  /**\n   * A selector that will return the slug item.\n   *\n   * TODO: remove in v12\n   */\n  static get slugItem() {\n    return `${prefix}-slug`;\n  }\n\n  /**\n   * A selector that will return the AI Label item.\n   */\n  static get aiLabelItem() {\n    return `${prefix}-ai-label`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSTile;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,oBACM,gBAAgB,WAAW;;;qBAIP;qBAgCVA,0BAAkB;2BAOZ;;;;;CAlCpB,AAAU,kBAAkB,EAAE,UAAiB;EAC7C,MAAM,aAAc,OACjB,eAAe,CACf,QAAQ,SACN,KAAqB,YAAY,SAC7B,KAAqB,QACnB,KAAK,YAA+B,YACtC,IAEA,KAAqB,QACnB,KAAK,YAA+B,SACtC,GACD,MACL;AACH,MAAI,WAAW,SAAS,GAAG;AACzB,QAAK,cAAc,QAAQ,WAAW;AACtC,GAAC,WAAW,GAAmB,aAAa,QAAQ,KAAK;;AAE3D,OAAK,eAAe;;CAkBtB,UAAU;AACR,MAAI,KAAK,YACP,MAAK,aAAa,YAAY,GAAG;MAEjC,MAAK,gBAAgB,WAAW;;CAIpC,SAAS;AACP,SAAO,IAAI;6CAC8B,KAAK,kBAAkB;2CACzB,KAAK,kBAAkB;wCAC1B,KAAK,kBAAkB;;;;;;;CAQ7D,WAAW,WAAW;AACpB,SAAO,GAAG,OAAO;;;;;CAMnB,WAAW,cAAc;AACvB,SAAO,GAAG,OAAO;;;gBAGHC;;;YAzCf,SAAS;CAAE,WAAW;CAAgB,SAAS;CAAM,CAAC;YAOtD,SAAS;CAAE,MAAM;CAAS,WAAW;CAAuB,CAAC;sBA3C/DC,cAAc,GAAG,OAAO,OAAO;AAgFhC,mBAAe"}
+{"version":3,"file":"tile.js","names":["styles","customElement"],"sources":["../../../src/components/tile/tile.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 } from 'lit/decorators.js';\nimport { prefix } from '../../globals/settings';\nimport { TILE_COLOR_SCHEME } from './defs';\nimport styles from './tile.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\n\nexport { TILE_COLOR_SCHEME };\n\n/**\n * Basic tile.\n *\n * @element cds-tile\n */\n@customElement(`${prefix}-tile`)\nclass CDSTile extends LitElement {\n  /**\n   * `true` if there is an AI Label.\n   */\n  protected _hasAILabel = false;\n\n  /**\n   * Handles `slotchange` event.\n   */\n  protected _handleSlotChange({ target }: Event) {\n    const hasContent = (target as HTMLSlotElement)\n      .assignedNodes()\n      .filter((elem) =>\n        (elem as HTMLElement).matches !== undefined\n          ? (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSTile).aiLabelItem\n            ) ||\n            // remove reference of slug in v12\n            (elem as HTMLElement).matches(\n              (this.constructor as typeof CDSTile).slugItem\n            )\n          : false\n      );\n    if (hasContent.length > 0) {\n      this._hasAILabel = Boolean(hasContent);\n      (hasContent[0] as HTMLElement).setAttribute('size', 'xs');\n    }\n    this.requestUpdate();\n  }\n\n  /**\n   * The color scheme.\n   *\n   * @deprecated\n   */\n  @property({ attribute: 'color-scheme', reflect: true })\n  colorScheme = TILE_COLOR_SCHEME.REGULAR;\n\n  /**\n   * Specify if the `Tile` component should be rendered with rounded corners.\n   * Only valid when `ai-label` prop is present\n   */\n  @property({ type: Boolean, attribute: 'has-rounded-corners' })\n  hasRoundedCorners = false;\n\n  updated() {\n    if (this._hasAILabel) {\n      this.setAttribute('ai-label', '');\n    } else {\n      this.removeAttribute('ai-label');\n    }\n  }\n\n  render() {\n    return html` <slot></slot\n      ><slot name=\"decorator\" @slotchange=\"${this._handleSlotChange}\"></slot>\n      <slot name=\"ai-label\" @slotchange=\"${this._handleSlotChange}\"></slot\n      ><slot name=\"slug\" @slotchange=\"${this._handleSlotChange}\"></slot>`;\n  }\n\n  /**\n   * A selector that will return the slug item.\n   *\n   * TODO: remove in v12\n   */\n  static get slugItem() {\n    return `${prefix}-slug`;\n  }\n\n  /**\n   * A selector that will return the AI Label item.\n   */\n  static get aiLabelItem() {\n    return `${prefix}-ai-label`;\n  }\n\n  static styles = styles;\n}\n\nexport default CDSTile;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,IAAA,UAAA,MACM,gBAAgB,WAAW;;;qBAIP;;2BAuCJ;;;;;CAlCpB,kBAA4B,EAAE,UAAiB;EAC7C,MAAM,aAAc,OACjB,eAAe,CACf,QAAQ,SACN,KAAqB,YAAY,KAAA,IAC7B,KAAqB,QACnB,KAAK,YAA+B,YACtC,IAEA,KAAqB,QACnB,KAAK,YAA+B,SACtC,GACD,MACL;AACH,MAAI,WAAW,SAAS,GAAG;AACzB,QAAK,cAAc,QAAQ,WAAW;AACrC,cAAW,GAAmB,aAAa,QAAQ,KAAK;;AAE3D,OAAK,eAAe;;CAkBtB,UAAU;AACR,MAAI,KAAK,YACP,MAAK,aAAa,YAAY,GAAG;MAEjC,MAAK,gBAAgB,WAAW;;CAIpC,SAAS;AACP,SAAO,IAAI;6CAC8B,KAAK,kBAAkB;2CACzB,KAAK,kBAAkB;wCAC1B,KAAK,kBAAkB;;;;;;;CAQ7D,WAAW,WAAW;AACpB,SAAO;;;;;CAMT,WAAW,cAAc;AACvB,SAAO;;;gBAGOA;;;YAzCf,SAAS;CAAE,WAAW;CAAgB,SAAS;CAAM,CAAC,CAAA,EAAA,QAAA,WAAA,eAAA,KAAA,EAAA;YAOtD,SAAS;CAAE,MAAM;CAAS,WAAW;CAAuB,CAAC,CAAA,EAAA,QAAA,WAAA,qBAAA,KAAA,EAAA;sBA3C/DC,cAAc,WAAiB,CAAA,EAAA,QAAA;AAgFhC,IAAA,eAAe"}

package/es/components/tile/tile.scss.js

@@ -6,10 +6,9 @@
  */
 
 import { css } from "lit";
-
 //#region src/components/tile/tile.scss?lit
 var tile_default = css([".cds--link,:host(cds-tile) ::slotted(.cds--link){border:0;box-sizing:border-box;font-family:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline}.cds--link *,.cds--link :after,.cds--link :before,:host(cds-tile) ::slotted(.cds--link) *,:host(cds-tile) ::slotted(.cds--link) :after,:host(cds-tile) ::slotted(.cds--link) :before{box-sizing:inherit}.cds--link,:host(cds-tile) ::slotted(.cds--link){color:var(--cds-link-text-color,var(--cds-link-primary,#0f62fe));display:inline;font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572);outline:none;text-decoration:none;transition:color 70ms cubic-bezier(.2,0,.38,.9)}.cds--link:hover,:host(cds-tile) :hover::slotted(.cds--link){color:var(--cds-link-hover-text-color,var(--cds-link-primary-hover,#0043ce));text-decoration:underline}.cds--link:active:not(.cds--link--disabled),.cds--link:active:visited,.cds--link:active:visited:hover,:host(cds-tile) :active:not(.cds--link--disabled)::slotted(.cds--link),:host(cds-tile) :active:visited::slotted(.cds--link){outline:1px solid var(--cds-focus,#0f62fe)}@media screen and (prefers-contrast){.cds--link:active:not(.cds--link--disabled),.cds--link:active:visited,.cds--link:active:visited:hover,:host(cds-tile) :active:not(.cds--link--disabled)::slotted(.cds--link),:host(cds-tile) :active:visited::slotted(.cds--link){outline-style:dotted}}.cds--link:active:not(.cds--link--disabled),.cds--link:active:visited,.cds--link:active:visited:hover,:host(cds-tile) :active:not(.cds--link--disabled)::slotted(.cds--link),:host(cds-tile) :active:visited::slotted(.cds--link){color:var(--cds-link-text-color,var(--cds-link-primary,#0f62fe));outline-color:var(--cds-link-focus-text-color,var(--cds-focus,#0f62fe));text-decoration:underline}.cds--link:focus:not(.cds--link--disabled),:host(cds-tile) :focus:not(.cds--link--disabled)::slotted(.cds--link){outline:1px solid var(--cds-focus,#0f62fe)}@media screen and (prefers-contrast){.cds--link:focus:not(.cds--link--disabled),:host(cds-tile) :focus:not(.cds--link--disabled)::slotted(.cds--link){outline-style:dotted}}.cds--link:focus:not(.cds--link--disabled),:host(cds-tile) :focus:not(.cds--link--disabled)::slotted(.cds--link){outline-color:var(--cds-link-focus-text-color,var(--cds-focus,#0f62fe));text-decoration:underline}.cds--link:visited,:host(cds-tile) :visited::slotted(.cds--link){color:var(--cds-link-text-color,var(--cds-link-primary,#0f62fe))}.cds--link:visited:hover,:host(cds-tile) :visited:hover::slotted(.cds--link){color:var(--cds-link-hover-text-color,var(--cds-link-primary-hover,#0043ce))}.cds--link--disabled,.cds--link--disabled:hover{border:0;box-sizing:border-box;font-family:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline}.cds--link--disabled *,.cds--link--disabled :after,.cds--link--disabled :before,.cds--link--disabled:hover *,.cds--link--disabled:hover :after,.cds--link--disabled:hover :before{box-sizing:inherit}.cds--link--disabled,.cds--link--disabled:hover{color:var(--cds-text-disabled,hsla(0,0%,9%,.25));cursor:not-allowed;font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);font-weight:400;letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572);text-decoration:none}.cds--link.cds--link--visited,.cds--link.cds--link--visited:visited,:host(cds-tile) .cds--link--visited::slotted(.cds--link){color:var(--cds-link-visited-text-color,var(--cds-link-visited,#8a3ffc))}.cds--link.cds--link--visited:hover,.cds--link.cds--link--visited:visited:hover,:host(cds-tile) .cds--link--visited:hover::slotted(.cds--link){color:var(--cds-link-hover-text-color,var(--cds-link-primary-hover,#0043ce))}.cds--link.cds--link--inline,:host(cds-tile) .cds--link--inline::slotted(.cds--link){display:inline;text-decoration:underline}.cds--link--disabled.cds--link--inline{text-decoration:underline}.cds--link--sm,.cds--link--sm.cds--link--disabled:hover{font-size:var(--cds-helper-text-01-font-size,.75rem);letter-spacing:var(--cds-helper-text-01-letter-spacing,.32px);line-height:var(--cds-helper-text-01-line-height,1.33333)}.cds--link--lg,.cds--link--lg.cds--link--disabled:hover{font-size:var(--cds-body-compact-02-font-size,1rem);font-weight:var(--cds-body-compact-02-font-weight,400);letter-spacing:var(--cds-body-compact-02-letter-spacing,0);line-height:var(--cds-body-compact-02-line-height,1.375)}.cds--link__icon{align-items:center;block-size:1lh;display:inline-flex;line-height:inherit;margin-inline-start:.5rem;vertical-align:text-bottom}.cds--link--lg .cds--link__icon>svg{block-size:1.25rem;inline-size:1.25rem}.cds--link--lg .cds--link__icon{block-size:1.25rem}.cds--layer-one,:root{--cds-layer:var(--cds-layer-01,#f4f4f4);--cds-layer-active:var(--cds-layer-active-01,#c6c6c6);--cds-layer-background:var(--cds-layer-background-01,#fff);--cds-layer-hover:var(--cds-layer-hover-01,#e8e8e8);--cds-layer-selected:var(--cds-layer-selected-01,#e0e0e0);--cds-layer-selected-hover:var(--cds-layer-selected-hover-01,#d1d1d1);--cds-layer-accent:var(--cds-layer-accent-01,#e0e0e0);--cds-layer-accent-hover:var(--cds-layer-accent-hover-01,#d1d1d1);--cds-layer-accent-active:var(--cds-layer-accent-active-01,#a8a8a8);--cds-field:var(--cds-field-01,#f4f4f4);--cds-field-hover:var(--cds-field-hover-01,#e8e8e8);--cds-border-subtle:var(--cds-border-subtle-00,#e0e0e0);--cds-border-subtle-selected:var(--cds-border-subtle-selected-01,#c6c6c6);--cds-border-strong:var(--cds-border-strong-01,#8d8d8d);--cds-border-tile:var(--cds-border-tile-01,#c6c6c6)}.cds--layer-two{--cds-layer:var(--cds-layer-02,#fff);--cds-layer-active:var(--cds-layer-active-02,#c6c6c6);--cds-layer-background:var(--cds-layer-background-02,#f4f4f4);--cds-layer-hover:var(--cds-layer-hover-02,#e8e8e8);--cds-layer-selected:var(--cds-layer-selected-02,#e0e0e0);--cds-layer-selected-hover:var(--cds-layer-selected-hover-02,#d1d1d1);--cds-layer-accent:var(--cds-layer-accent-02,#e0e0e0);--cds-layer-accent-hover:var(--cds-layer-accent-hover-02,#d1d1d1);--cds-layer-accent-active:var(--cds-layer-accent-active-02,#a8a8a8);--cds-field:var(--cds-field-02,#fff);--cds-field-hover:var(--cds-field-hover-02,#e8e8e8);--cds-border-subtle:var(--cds-border-subtle-01,#c6c6c6);--cds-border-subtle-selected:var(--cds-border-subtle-selected-02,#c6c6c6);--cds-border-strong:var(--cds-border-strong-02,#8d8d8d);--cds-border-tile:var(--cds-border-tile-02,#a8a8a8)}.cds--layer-three{--cds-layer:var(--cds-layer-03,#f4f4f4);--cds-layer-active:var(--cds-layer-active-03,#c6c6c6);--cds-layer-background:var(--cds-layer-background-03,#fff);--cds-layer-hover:var(--cds-layer-hover-03,#e8e8e8);--cds-layer-selected:var(--cds-layer-selected-03,#e0e0e0);--cds-layer-selected-hover:var(--cds-layer-selected-hover-03,#d1d1d1);--cds-layer-accent:var(--cds-layer-accent-03,#e0e0e0);--cds-layer-accent-hover:var(--cds-layer-accent-hover-03,#d1d1d1);--cds-layer-accent-active:var(--cds-layer-accent-active-03,#a8a8a8);--cds-field:var(--cds-field-03,#f4f4f4);--cds-field-hover:var(--cds-field-hover-03,#e8e8e8);--cds-border-subtle:var(--cds-border-subtle-02,#e0e0e0);--cds-border-subtle-selected:var(--cds-border-subtle-selected-03,#c6c6c6);--cds-border-strong:var(--cds-border-strong-03,#8d8d8d);--cds-border-tile:var(--cds-border-tile-03,#c6c6c6)}.cds--layer-one.cds--layer__with-background,.cds--layer-three.cds--layer__with-background,.cds--layer-two.cds--layer__with-background{background-color:var(--cds-layer-background)}.cds--assistive-text,.cds--visually-hidden{block-size:1px;border:0;margin:-1px;overflow:hidden;padding:0;position:absolute;clip:rect(0,0,0,0);inline-size:1px;visibility:inherit;white-space:nowrap}.cds--layout--size-xs{--cds-layout-size-height-context:var(--cds-layout-size-height-xs,1.5rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-xs{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-xs,1.5rem))}.cds--layout-constraint--size__min-xs{--cds-layout-size-height-min:var(--cds-layout-size-height-xs,1.5rem)}.cds--layout-constraint--size__max-xs{--cds-layout-size-height-max:var(--cds-layout-size-height-xs,1.5rem)}.cds--layout--size-sm{--cds-layout-size-height-context:var(--cds-layout-size-height-sm,2rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-sm{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-sm,2rem))}.cds--layout-constraint--size__min-sm{--cds-layout-size-height-min:var(--cds-layout-size-height-sm,2rem)}.cds--layout-constraint--size__max-sm{--cds-layout-size-height-max:var(--cds-layout-size-height-sm,2rem)}.cds--layout--size-md{--cds-layout-size-height-context:var(--cds-layout-size-height-md,2.5rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-md{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-md,2.5rem))}.cds--layout-constraint--size__min-md{--cds-layout-size-height-min:var(--cds-layout-size-height-md,2.5rem)}.cds--layout-constraint--size__max-md{--cds-layout-size-height-max:var(--cds-layout-size-height-md,2.5rem)}.cds--layout--size-lg{--cds-layout-size-height-context:var(--cds-layout-size-height-lg,3rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-lg{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-lg,3rem))}.cds--layout-constraint--size__min-lg{--cds-layout-size-height-min:var(--cds-layout-size-height-lg,3rem)}.cds--layout-constraint--size__max-lg{--cds-layout-size-height-max:var(--cds-layout-size-height-lg,3rem)}.cds--layout--size-xl{--cds-layout-size-height-context:var(--cds-layout-size-height-xl,4rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-xl{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-xl,4rem))}.cds--layout-constraint--size__min-xl{--cds-layout-size-height-min:var(--cds-layout-size-height-xl,4rem)}.cds--layout-constraint--size__max-xl{--cds-layout-size-height-max:var(--cds-layout-size-height-xl,4rem)}.cds--layout--size-2xl{--cds-layout-size-height-context:var(--cds-layout-size-height-2xl,5rem);--cds-layout-size-height:var(--cds-layout-size-height-context)}.cds--layout-constraint--size__default-2xl{--cds-layout-size-height:var(--cds-layout-size-height-context,var(--cds-layout-size-height-2xl,5rem))}.cds--layout-constraint--size__min-2xl{--cds-layout-size-height-min:var(--cds-layout-size-height-2xl,5rem)}.cds--layout-constraint--size__max-2xl{--cds-layout-size-height-max:var(--cds-layout-size-height-2xl,5rem)}.cds--layout--density-condensed{--cds-layout-density-padding-inline-context:var(--cds-layout-density-padding-inline-condensed,0.5rem);--cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context)}.cds--layout-constraint--density__default-condensed{--cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context,var(--cds-layout-density-padding-inline-condensed,0.5rem))}.cds--layout-constraint--density__min-condensed{--cds-layout-density-padding-inline-min:var(--cds-layout-density-padding-inline-condensed,0.5rem)}.cds--layout-constraint--density__max-condensed{--cds-layout-density-padding-inline-max:var(--cds-layout-density-padding-inline-condensed,0.5rem)}.cds--layout--density-normal{--cds-layout-density-padding-inline-context:var(--cds-layout-density-padding-inline-normal,1rem);--cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context)}.cds--layout-constraint--density__default-normal{--cds-layout-density-padding-inline:var(--cds-layout-density-padding-inline-context,var(--cds-layout-density-padding-inline-normal,1rem))}.cds--layout-constraint--density__min-normal{--cds-layout-density-padding-inline-min:var(--cds-layout-density-padding-inline-normal,1rem)}.cds--layout-constraint--density__max-normal{--cds-layout-density-padding-inline-max:var(--cds-layout-density-padding-inline-normal,1rem)}:root{--cds-layout-size-height-xs:1.5rem;--cds-layout-size-height-sm:2rem;--cds-layout-size-height-md:2.5rem;--cds-layout-size-height-lg:3rem;--cds-layout-size-height-xl:4rem;--cds-layout-size-height-2xl:5rem;--cds-layout-size-height-min:0px;--cds-layout-size-height-max:999999999px;--cds-layout-density-padding-inline-condensed:0.5rem;--cds-layout-density-padding-inline-normal:1rem;--cds-layout-density-padding-inline-min:0px;--cds-layout-density-padding-inline-max:999999999px}.cds--tile-group html,:host(cds-tile-group) html{font-size:100%}.cds--tile-group body,:host(cds-tile-group) body{font-family:IBM Plex Sans,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,sans-serif;font-weight:400;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.cds--tile-group code,:host(cds-tile-group) code{font-family:IBM Plex Mono,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,monospace}.cds--tile-group strong,:host(cds-tile-group) strong{font-weight:600}.cds--tile,:host(cds-expandable-tile),:host(cds-tile){font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572);--cds-layout-density-padding-inline-local:clamp(var(--cds-layout-density-padding-inline-min),var(--cds-layout-density-padding-inline,var(--cds-layout-density-padding-inline-normal)),var(--cds-layout-density-padding-inline-max));background-color:var(--cds-layer);display:block;min-block-size:4rem;min-inline-size:8rem;outline:2px solid transparent;outline-offset:-2px;padding:var(--cds-layout-density-padding-inline-local);position:relative}.cds--tile:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.cds--tile:focus{outline-style:dotted}}.cds--tile--light,:host(cds-expandable-tile[color-scheme=light]),:host(cds-tile[color-scheme=light]){background-color:var(--cds-layer-02,#fff)}.cds--tile--clickable,.cds--tile--selectable,:host(cds-clickable-tile) .cds--tile--clickable{border:0;box-sizing:border-box;font-family:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline}.cds--tile--clickable *,.cds--tile--clickable :after,.cds--tile--clickable :before,.cds--tile--selectable *,.cds--tile--selectable :after,.cds--tile--selectable :before,:host(cds-clickable-tile) .cds--tile--clickable *,:host(cds-clickable-tile) .cds--tile--clickable :after,:host(cds-clickable-tile) .cds--tile--clickable :before{box-sizing:inherit}.cds--tile--clickable,.cds--tile--selectable,:host(cds-clickable-tile) .cds--tile--clickable{cursor:pointer;font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572);padding:var(--cds-layout-density-padding-inline-local);transition:.15s cubic-bezier(.2,0,.38,.9)}.cds--tile--clickable:hover,.cds--tile--selectable:hover{background:var(--cds-layer-hover)}.cds--tile--clickable,:host(cds-clickable-tile) .cds--tile--clickable{color:var(--cds-text-primary,#161616);text-decoration:none}.cds--tile--clickable:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.cds--tile--clickable:focus{outline-style:dotted}}.cds--tile--clickable:focus{text-decoration:none}.cds--tile--clickable:focus .cds--tile__checkmark,.cds--tile--clickable:hover .cds--tile__checkmark{opacity:1}.cds--tile--expandable::-moz-focus-inner{border:0}.cds--tile--clickable:active,.cds--tile--clickable:hover,.cds--tile--clickable:visited,.cds--tile--clickable:visited:hover{color:var(--cds-text-primary,#161616);text-decoration:none}.cds--tile--clickable.cds--link--disabled,.cds--tile--clickable:hover.cds--link--disabled{background-color:var(--cds-layer);color:var(--cds-text-disabled,hsla(0,0%,9%,.25));cursor:not-allowed;display:block;padding:var(--cds-layout-density-padding-inline-local)}.cds--tile--clickable .cds--tile--icon,.cds--tile--clickable.cds--link--disabled .cds--tile--disabled-icon,:host(cds-clickable-tile) .cds--tile--clickable ::slotted([slot=icon]){block-size:1.25rem;inline-size:1.25rem;inset-block-end:.75rem;inset-inline-end:.75rem;position:absolute}.cds--tile--clickable .cds--tile--icon,:host(cds-clickable-tile) .cds--tile--clickable ::slotted([slot=icon]){fill:var(--cds-icon-interactive,#0f62fe)}.cds--tile--clickable.cds--link--disabled .cds--tile--disabled-icon{fill:var(--cds-icon-disabled,hsla(0,0%,9%,.25))}.cds--tile--clickable.cds--link--disabled .cds--tile--icon,:host(cds-clickable-tile) .cds--tile--clickable.cds--link--disabled ::slotted([slot=icon]){display:none}.cds--tile--selectable{border:1px solid transparent;padding-inline-end:calc(var(--cds-layout-density-padding-inline-local)*2 + 1rem)}.cds--tile__checkmark{background:transparent;block-size:1rem;border:none;inset-block-start:var(--cds-layout-density-padding-inline-local);inset-inline-end:var(--cds-layout-density-padding-inline-local);opacity:0;position:absolute;transition:.11s cubic-bezier(.2,0,.38,.9)}.cds--tile__checkmark svg{border-radius:50%;fill:var(--cds-icon-secondary,#525252)}.cds--tile__checkmark:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.cds--tile__checkmark:focus{outline-style:dotted}}.cds--tile__checkmark--persistent{opacity:1}.cds--tile__chevron,:host(cds-selectable-tile) .cds--tile__chevron{align-items:center;block-size:calc(var(--cds-layout-density-padding-inline-local)*2 + 1rem);display:flex;inline-size:calc(var(--cds-layout-density-padding-inline-local)*2 + 1rem);inset-block-end:0;inset-inline-end:0;justify-content:center;position:absolute}.cds--tile__chevron svg,:host(cds-selectable-tile) .cds--tile__chevron svg{fill:var(--cds-icon-primary,#161616);transform-origin:center;transition:.11s cubic-bezier(.2,0,.38,.9)}@media screen and (prefers-reduced-motion:reduce){.cds--tile__chevron svg,:host(cds-selectable-tile) .cds--tile__chevron svg{transition:none}}.cds--tile__chevron--interactive{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;box-sizing:border-box;cursor:pointer;display:inline-block;font-family:inherit;font-size:100%;inline-size:100%;margin:0;padding:0;text-align:start;vertical-align:baseline}.cds--tile__chevron--interactive *,.cds--tile__chevron--interactive :after,.cds--tile__chevron--interactive :before{box-sizing:inherit}.cds--tile__chevron--interactive::-moz-focus-inner{border:0}.cds--tile__chevron--interactive{align-items:center;block-size:calc(var(--cds-layout-density-padding-inline-local)*2 + 1rem);display:flex;inline-size:calc(var(--cds-layout-density-padding-inline-local)*2 + 1rem);inset-block-end:0;inset-inline-end:0;justify-content:center;position:absolute}.cds--tile__chevron--interactive:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}.cds--tile__chevron--interactive:hover{background-color:var(--cds-layer-hover);cursor:pointer}.cds--tile--expandable,:host(cds-expandable-tile){border:0;color:inherit;cursor:pointer;font-family:inherit;font-size:inherit;font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);inline-size:100%;letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572);overflow:hidden;position:relative;text-align:start;transition:max-height .15s cubic-bezier(.2,0,.38,.9)}.cds--tile--expandable:hover{background:var(--cds-layer-hover)}.cds--tile--expandable.cds--tile--expandable--interactive{border:none;cursor:default;transition:max-height .15s cubic-bezier(.2,0,.38,.9)}.cds--tile--expandable.cds--tile--expandable--interactive:hover{background-color:var(--cds-layer)}.cds--tile--expandable.cds--tile--expandable--interactive:focus{outline:none}.cds--tile--expandable--interactive:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.cds--tile--expandable--interactive:focus{outline-style:dotted}}.cds--tile-content__below-the-fold,:host(cds-expandable-tile) ::slotted(cds-tile-below-the-fold-content){display:block;opacity:0;transition:opacity .11s cubic-bezier(.2,0,.38,.9),visibility .11s cubic-bezier(.2,0,.38,.9);visibility:hidden}.cds--tile--is-expanded,:host(cds-expandable-tile[expanded]){overflow:visible;transition:max-height .11s cubic-bezier(.2,0,.38,.9)}.cds--tile--is-expanded .cds--tile__chevron svg,:host(cds-expandable-tile[expanded]) .cds--tile__chevron svg{transform:rotate(180deg)}.cds--tile--is-expanded .cds--tile-content__below-the-fold,:host(cds-expandable-tile) .cds--tile--is-expanded ::slotted(cds-tile-below-the-fold-content),:host(cds-expandable-tile[expanded]) .cds--tile-content__below-the-fold,:host(cds-expandable-tile[expanded]):host(cds-expandable-tile) ::slotted(cds-tile-below-the-fold-content){opacity:1;transition:opacity .11s cubic-bezier(.2,0,.38,.9),visibility .11s cubic-bezier(.2,0,.38,.9);visibility:inherit}@supports (hanging-punctuation:first) and (font:-apple-system-body) and (-webkit-appearance:none){.cds--tile--is-expanded .cds--tile-content__below-the-fold,:host(cds-expandable-tile) .cds--tile--is-expanded ::slotted(cds-tile-below-the-fold-content),:host(cds-expandable-tile[expanded]) .cds--tile-content__below-the-fold,:host(cds-expandable-tile[expanded]):host(cds-expandable-tile) ::slotted(cds-tile-below-the-fold-content){overflow-y:auto}}.cds--tile--is-selected{border:1px solid var(--cds-layer-selected-inverse,#161616)}.cds--tile--is-selected .cds--tile__checkmark{opacity:1}.cds--tile--is-selected .cds--tile__checkmark svg{fill:var(--cds-icon-primary,#161616)}.cds--tile-content{block-size:100%;inline-size:100%}.cds--tile-input{block-size:1px;border:0;margin:-1px;overflow:hidden;padding:0;position:absolute;clip:rect(0,0,0,0);inline-size:1px;visibility:inherit;white-space:nowrap}.cds--tile-input:focus+.cds--tile,.cds--tile-input:focus+:host(cds-expandable-tile),.cds--tile-input:focus+:host(cds-tile){outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){.cds--tile-input:focus+.cds--tile,.cds--tile-input:focus+:host(cds-expandable-tile),.cds--tile-input:focus+:host(cds-tile){outline-style:dotted}}.cds--tile--disabled.cds--tile--selectable{background-color:var(--cds-layer);color:var(--cds-text-disabled,hsla(0,0%,9%,.25));cursor:not-allowed}.cds--tile--disabled.cds--tile--selectable.cds--tile--light{background-color:var(--cds-layer-02,#fff)}.cds--tile--disabled.cds--tile--is-selected{border-color:var(--cds-border-disabled,#c6c6c6)}.cds--tile--disabled .cds--tile__checkmark svg{fill:var(--cds-icon-disabled,hsla(0,0%,9%,.25))}.cds--tile--clickable .cds--tile--ai-label-icon,.cds--tile--expandable>div>.cds--ai-label,.cds--tile--expandable>div>.cds--slug,.cds--tile--expandable>div>.cds--tile--inner-decorator>*,.cds--tile>.cds--ai-label,.cds--tile>.cds--slug,.cds--tile>.cds--tile--inner-decorator>*,:host(cds-expandable-tile)>.cds--ai-label,:host(cds-expandable-tile)>.cds--slug,:host(cds-expandable-tile)>.cds--tile--inner-decorator>*,:host(cds-expandable-tile)>div>.cds--ai-label,:host(cds-expandable-tile)>div>.cds--slug,:host(cds-expandable-tile)>div>.cds--tile--inner-decorator>*,:host(cds-tile)>.cds--ai-label,:host(cds-tile)>.cds--slug,:host(cds-tile)>.cds--tile--inner-decorator>*{inset-block-start:1rem;inset-inline-end:1rem;position:absolute}.cds--tile.cds--tile--selectable>.cds--ai-label,.cds--tile.cds--tile--selectable>.cds--slug,.cds--tile.cds--tile--selectable>.cds--tile--inner-decorator>*{inset-inline-end:2.5rem}.cds--tile.cds--tile--selectable.cds--tile--radio>.cds--ai-label,.cds--tile.cds--tile--selectable.cds--tile--radio>.cds--slug,.cds--tile.cds--tile--selectable.cds--tile--radio>.cds--tile--inner-decorator>*{inset-inline-end:1rem;inset-inline-end:2.5rem;transition:inset-inline-end .11s cubic-bezier(.2,0,.38,.9)}.cds--tile.cds--tile--selectable.cds--tile--radio.cds--tile--is-selected>.cds--ai-label,.cds--tile.cds--tile--selectable.cds--tile--radio.cds--tile--is-selected>.cds--slug,.cds--tile.cds--tile--selectable.cds--tile--radio.cds--tile--is-selected>.cds--tile--inner-decorator>*{inset-inline-end:2.5rem}.cds--tile.cds--tile--clickable>.cds--ai-label,.cds--tile.cds--tile--clickable>.cds--slug,.cds--tile.cds--tile--clickable>.cds--tile--inner-decorator>*{pointer-events:none}.cds--tile--decorator:has(.cds--ai-label).cds--tile,.cds--tile--decorator:has(.cds--tile--ai-label-icon).cds--tile,.cds--tile--slug.cds--tile{background:linear-gradient(to top,var(--cds-layer,var(--cds-ai-popover-background,#fff)) 0,var(--cds-ai-aura-start,rgba(69,137,255,.1)) 0,15%,var(--cds-ai-aura-end,hsla(0,0%,100%,0)) 50%) padding-box,linear-gradient(to top,var(--cds-layer,var(--cds-ai-popover-background,#fff)),var(--cds-layer,var(--cds-ai-popover-background,#fff))) padding-box,linear-gradient(to bottom,var(--cds-ai-border-start,rgba(166,200,255,.64)),var(--cds-ai-border-end,#78a9ff)) border-box,linear-gradient(to top,var(--cds-layer,var(--cds-ai-popover-background,#fff)),var(--cds-layer,var(--cds-ai-popover-background,#fff))) border-box;border:1px solid transparent;box-shadow:inset 0 -80px 70px -65px var(--cds-ai-inner-shadow,rgba(69,137,255,.1)),0 4px 8px 0 var(--cds-ai-drop-shadow,rgba(15,98,254,.1))}.cds--tile--decorator:has(.cds--ai-label).cds--tile--expandable:hover,.cds--tile--slug.cds--tile--expandable:hover{background:linear-gradient(to top,var(--cds-layer,var(--cds-ai-popover-background,#fff)) 0,var(--cds-ai-aura-start,rgba(69,137,255,.1)) 0,15%,var(--cds-ai-aura-end,hsla(0,0%,100%,0)) 50%) padding-box,linear-gradient(to top,var(--cds-layer,var(--cds-ai-popover-background,#fff)),var(--cds-layer,var(--cds-ai-popover-background,#fff))) padding-box,linear-gradient(to bottom,var(--cds-ai-border-start,rgba(166,200,255,.64)),var(--cds-ai-border-end,#78a9ff)) border-box,linear-gradient(to top,var(--cds-layer,var(--cds-ai-popover-background,#fff)),var(--cds-layer,var(--cds-ai-popover-background,#fff))) border-box}.cds--tile--decorator.cds--tile--clickable:before,.cds--tile--decorator.cds--tile--selectable:after,.cds--tile--decorator.cds--tile--selectable:before,.cds--tile--slug.cds--tile--clickable:before,.cds--tile--slug.cds--tile--selectable:after,.cds--tile--slug.cds--tile--selectable:before{block-size:100%;content:\"\";display:block;inline-size:100%;inset-block-start:0;inset-inline-start:0;opacity:0;position:absolute;transition:opacity .11s cubic-bezier(.2,0,.38,.9)}.cds--tile--decorator:has(.cds--ai-label).cds--tile--clickable:before,.cds--tile--decorator:has(.cds--ai-label).cds--tile--selectable:before,.cds--tile--decorator:has(.cds--tile--ai-label-icon).cds--tile--clickable:before,.cds--tile--slug.cds--tile--clickable:before,.cds--tile--slug.cds--tile--selectable:before{background:linear-gradient(to top,var(--cds-ai-aura-hover-start,rgba(69,137,255,.32)) 0,15%,var(--cds-ai-aura-hover-end,hsla(0,0%,100%,0)) 50%) padding-box,linear-gradient(to top,var(--cds-ai-aura-hover-background,#edf5ff),var(--cds-ai-aura-hover-background,#edf5ff)) padding-box,linear-gradient(to bottom,var(--cds-ai-border-start,rgba(166,200,255,.64)),var(--cds-ai-border-end,#78a9ff)) border-box,linear-gradient(to top,var(--cds-ai-aura-hover-background,#edf5ff),var(--cds-ai-aura-hover-background,#edf5ff)) border-box;box-shadow:inset 0 -80px 70px -65px var(--cds-ai-inner-shadow,rgba(69,137,255,.1)),0 4px 10px 2px var(--cds-ai-drop-shadow,rgba(15,98,254,.1))}.cds--tile--decorator.cds--tile--clickable:hover:before,.cds--tile--decorator.cds--tile--selectable:hover:before,.cds--tile--slug.cds--tile--clickable:hover:before,.cds--tile--slug.cds--tile--selectable:hover:before{opacity:1}.cds--tile--decorator.cds--tile--clickable:focus,.cds--tile--decorator.cds--tile--selectable:focus,.cds--tile--slug.cds--tile--clickable:focus,.cds--tile--slug.cds--tile--selectable:focus,.cds--tile-input:focus+.cds--tile--decorator.cds--tile,.cds--tile-input:focus+.cds--tile--slug.cds--tile{outline-offset:-1px}.cds--tile--decorator:has(.cds--tile--inner-decorator .cds--ai-label).cds--tile--selectable:after,.cds--tile--slug.cds--tile--selectable:after{background:linear-gradient(to top,var(--cds-ai-aura-start,rgba(69,137,255,.1)) 0,15%,var(--cds-ai-aura-end,hsla(0,0%,100%,0)) 50%) padding-box,linear-gradient(to top,var(--cds-layer),var(--cds-layer)) padding-box,linear-gradient(to bottom,var(--cds-border-inverse,#161616),var(--cds-border-inverse,#161616)) border-box,linear-gradient(to top,var(--cds-layer),var(--cds-layer)) border-box;box-shadow:inset 0 -80px 70px -65px var(--cds-ai-inner-shadow,rgba(69,137,255,.1)),0 4px 8px 0 var(--cds-ai-drop-shadow,rgba(15,98,254,.1))}.cds--tile--decorator.cds--tile--selectable:hover:after,.cds--tile--slug.cds--tile--selectable:hover:after{opacity:0}.cds--tile--decorator.cds--tile--is-selected:after,.cds--tile--slug.cds--tile--is-selected:after{opacity:1}.cds--tile--decorator:has(.cds--tile--inner-decorator).cds--tile--is-selected,.cds--tile--slug.cds--tile--is-selected{border-color:var(--cds-border-inverse,#161616)}.cds--tile--decorator.cds--tile--clickable .cds--tile-content,.cds--tile--decorator.cds--tile--selectable .cds--tile-content,.cds--tile--slug.cds--tile--clickable .cds--tile-content,.cds--tile--slug.cds--tile--selectable .cds--tile-content{cursor:pointer;position:relative}.cds--tile--decorator.cds--tile--clickable .cds--tile-content,.cds--tile--decorator.cds--tile--is-selected .cds--tile--inner-decorator>*,.cds--tile--decorator.cds--tile--selectable .cds--tile-content,.cds--tile--decorator.cds--tile--selectable>.cds--tile__checkmark,.cds--tile--slug.cds--tile--clickable .cds--tile-content,.cds--tile--slug.cds--tile--is-selected .cds--ai-label,.cds--tile--slug.cds--tile--is-selected .cds--slug,.cds--tile--slug.cds--tile--selectable .cds--tile-content,.cds--tile--slug.cds--tile--selectable>.cds--tile__checkmark{z-index:1}.cds--tile--decorator.cds--tile--selectable .cds--tile--inner-decorator>:has(>.cds--popover--open),.cds--tile--slug.cds--tile--selectable .cds--ai-label:has(>.cds--popover--open),.cds--tile--slug.cds--tile--selectable .cds--slug:has(>.cds--popover--open){z-index:2}.cds--tile--decorator.cds--tile--selectable>.cds--tile--inner-decorator>*,.cds--tile--decorator.cds--tile--selectable>.cds--tile__checkmark,.cds--tile--slug.cds--tile--selectable>.cds--ai-label,.cds--tile--slug.cds--tile--selectable>.cds--slug,.cds--tile--slug.cds--tile--selectable>.cds--tile__checkmark{z-index:1}.cds--tile--expandable:has(.cds--ai-label>.cds--popover--open),.cds--tile--expandable:has(.cds--slug>.cds--popover--open),.cds--tile--expandable:has(.cds--tile--inner-decorator>*>.cds--popover--open),:has(.cds--ai-label>.cds--popover--open):host(cds-expandable-tile),:has(.cds--slug>.cds--popover--open):host(cds-expandable-tile),:has(.cds--tile--inner-decorator>*>.cds--popover--open):host(cds-expandable-tile){overflow:visible}.cds--tile--clickable .cds--tile--ai-label-icon rect{stroke:var(--cds-icon-primary,#161616)}.cds--tile--clickable .cds--tile--ai-label-icon path{fill:var(--cds-icon-primary,#161616)}.cds--tile--decorator-rounded,.cds--tile--decorator-rounded.cds--tile--clickable:before,.cds--tile--decorator-rounded.cds--tile--selectable:after,.cds--tile--decorator-rounded.cds--tile--selectable:before,.cds--tile--slug-rounded,.cds--tile--slug-rounded.cds--tile--clickable:before,.cds--tile--slug-rounded.cds--tile--selectable:after,.cds--tile--slug-rounded.cds--tile--selectable:before,:host(cds-clickable-tile[ai-label][has-rounded-corners]),:host(cds-expandable-tile[ai-label][has-rounded-corners]),:host(cds-radio-tile[ai-label][has-rounded-corners]),:host(cds-selectable-tile[ai-label][has-rounded-corners]),:host(cds-tile[ai-label][has-rounded-corners]){border-radius:.5rem}.cds--tile--decorator-rounded .cds--tile__chevron,.cds--tile--slug-rounded .cds--tile__chevron,:host(cds-clickable-tile[ai-label][has-rounded-corners]) .cds--tile__chevron,:host(cds-expandable-tile[ai-label][has-rounded-corners]) .cds--tile__chevron,:host(cds-radio-tile[ai-label][has-rounded-corners]) .cds--tile__chevron,:host(cds-selectable-tile[ai-label][has-rounded-corners]) .cds--tile__chevron,:host(cds-tile[ai-label][has-rounded-corners]) .cds--tile__chevron{border-end-end-radius:.5rem}@keyframes cds--hide-feedback{0%{opacity:1;visibility:inherit}to{opacity:0;visibility:hidden}}@keyframes cds--show-feedback{0%{opacity:0;visibility:hidden}to{opacity:1;visibility:inherit}}@keyframes cds--skeleton{0%{opacity:.3;transform:scaleX(0);transform-origin:left}20%{opacity:1;transform:scaleX(1);transform-origin:left}28%{transform:scaleX(1);transform-origin:right}51%{transform:scaleX(0);transform-origin:right}58%{transform:scaleX(0);transform-origin:right}82%{transform:scaleX(1);transform-origin:right}83%{transform:scaleX(1);transform-origin:left}96%{transform:scaleX(0);transform-origin:left}to{opacity:.3;transform:scaleX(0);transform-origin:left}}input:-webkit-autofill,input:-webkit-autofill:focus,input:-webkit-autofill:hover,textarea:-webkit-autofill,textarea:-webkit-autofill:focus,textarea:-webkit-autofill:hover{box-shadow:0 0 0 1000px var(--cds-field) inset;-webkit-text-fill-color:var(--cds-text-primary,#161616)}.cds--fieldset{border:0;box-sizing:border-box;font-family:inherit;font-size:100%;margin:0;padding:0;vertical-align:baseline}.cds--fieldset *,.cds--fieldset :after,.cds--fieldset :before{box-sizing:inherit}.cds--form-item{align-items:flex-start;display:flex;flex:1 1 auto;flex-direction:column;font-size:var(--cds-body-compact-01-font-size,.875rem);font-weight:var(--cds-body-compact-01-font-weight,400);letter-spacing:var(--cds-body-compact-01-letter-spacing,.16px);line-height:var(--cds-body-compact-01-line-height,1.28572)}.cds--label html{font-size:100%}.cds--label body{font-family:IBM Plex Sans,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,sans-serif;font-weight:400;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.cds--label code{font-family:IBM Plex Mono,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,monospace}.cds--label strong{font-weight:600}.cds--label{color:var(--cds-text-secondary,#525252);display:inline-block;font-weight:var(--cds-label-01-font-weight,400);font-weight:400;line-height:var(--cds-label-01-line-height,1.33333);line-height:1rem;margin-block-end:.5rem;vertical-align:baseline}.cds--label,.cds--label .cds--toggletip-label{font-size:var(--cds-label-01-font-size,.75rem);letter-spacing:var(--cds-label-01-letter-spacing,.32px)}.cds--label .cds--toggletip-label{font-weight:var(--cds-label-01-font-weight,400);line-height:var(--cds-label-01-line-height,1.33333)}.cds--label--no-margin{margin-block-end:0}.cds--label+.cds--tooltip{inset-block-start:.2rem;inset-inline-start:.5rem;position:relative}.cds--label+.cds--tooltip .cds--tooltip__trigger{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:none;border:0;box-sizing:border-box;cursor:pointer;display:inline-block;font-family:inherit;font-size:100%;inline-size:100%;margin:0;padding:0;text-align:start;vertical-align:baseline}.cds--label+.cds--tooltip .cds--tooltip__trigger *,.cds--label+.cds--tooltip .cds--tooltip__trigger :after,.cds--label+.cds--tooltip .cds--tooltip__trigger :before{box-sizing:inherit}.cds--label+.cds--tooltip .cds--tooltip__trigger::-moz-focus-inner{border:0}.cds--label+.cds--tooltip .cds--tooltip__trigger{align-items:center;display:flex;font-size:var(--cds-label-01-font-size,.75rem);font-weight:var(--cds-label-01-font-weight,400);justify-content:center;letter-spacing:var(--cds-label-01-letter-spacing,.32px);line-height:var(--cds-label-01-line-height,1.33333)}.cds--label+.cds--tooltip .cds--tooltip__trigger:focus{outline:1px solid var(--cds-focus,#0f62fe)}.cds--label+.cds--tooltip .cds--tooltip__trigger svg{fill:var(--cds-icon-secondary,#525252)}.cds--label+.cds--tooltip .cds--tooltip__trigger svg :hover{fill:var(--cds-icon-primary,#161616)}.cds--label+.cds--toggletip{inset-block-start:.2rem;inset-inline-start:.5rem}.cds--label.cds--skeleton{background:var(--cds-skeleton-background,#e8e8e8);border:none;box-shadow:none;padding:0;pointer-events:none;position:relative}.cds--label.cds--skeleton:active,.cds--label.cds--skeleton:focus,.cds--label.cds--skeleton:hover{border:none;cursor:default;outline:none}.cds--label.cds--skeleton:before{animation:cds--skeleton 3s ease-in-out infinite;background:var(--cds-skeleton-element,#c6c6c6);block-size:100%;content:\"\";inline-size:100%;inset-inline-start:0;position:absolute;will-change:transform-origin,transform,opacity}@media (prefers-reduced-motion:reduce){.cds--label.cds--skeleton:before{animation:none}}@media (forced-colors:active),screen and (-ms-high-contrast:active){.cds--label.cds--skeleton{background:CanvasText}.cds--label.cds--skeleton:before{background:Canvas;forced-color-adjust:none}}.cds--label.cds--skeleton{block-size:.875rem;inline-size:4.6875rem}input[type=number],input[type=text].cds--number{font-family:IBM Plex Sans,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,sans-serif}.cds--combo-box[data-invalid]:not(.cds--multi-select--selected) .cds--text-input:not(:focus),.cds--list-box[data-invalid]:not(.cds--multi-select--invalid--focused,.cds--combo-box--invalid--focused),.cds--number[data-invalid] input[type=number]:not(:focus),.cds--number[data-invalid] input[type=text]:not(:focus),.cds--select-input__wrapper[data-invalid] .cds--select-input:not(:focus),.cds--text-area__wrapper[data-invalid]>.cds--text-area--invalid:not(:focus),.cds--text-input__field-wrapper[data-invalid]>.cds--text-input--invalid:not(:focus),input[data-invalid]:not(:focus){outline:2px solid var(--cds-support-error,#da1e28);outline-offset:-2px}@media screen and (prefers-contrast){.cds--combo-box[data-invalid]:not(.cds--multi-select--selected) .cds--text-input:not(:focus),.cds--list-box[data-invalid]:not(.cds--multi-select--invalid--focused,.cds--combo-box--invalid--focused),.cds--number[data-invalid] input[type=number]:not(:focus),.cds--number[data-invalid] input[type=text]:not(:focus),.cds--select-input__wrapper[data-invalid] .cds--select-input:not(:focus),.cds--text-area__wrapper[data-invalid]>.cds--text-area--invalid:not(:focus),.cds--text-input__field-wrapper[data-invalid]>.cds--text-input--invalid:not(:focus),input[data-invalid]:not(:focus){outline-style:dotted}}.cds--date-picker-input__wrapper--invalid~.cds--form-requirement,.cds--date-picker-input__wrapper--warn~.cds--form-requirement,.cds--date-picker-input__wrapper~.cds--form-requirement,.cds--list-box--warning~.cds--form-requirement,.cds--list-box[data-invalid]~.cds--form-requirement,.cds--number[data-invalid] .cds--number__input-wrapper~.cds--form-requirement,.cds--number__input-wrapper--warning~.cds--form-requirement,.cds--select--warning .cds--select-input__wrapper~.cds--form-requirement,.cds--select-input__wrapper[data-invalid]~.cds--form-requirement,.cds--text-area__wrapper--warn~.cds--form-requirement,.cds--text-area__wrapper[data-invalid]~.cds--form-requirement,.cds--text-input__field-wrapper--warning>.cds--text-input~.cds--form-requirement,.cds--text-input__field-wrapper--warning~.cds--form-requirement,.cds--text-input__field-wrapper[data-invalid]~.cds--form-requirement,.cds--time-picker--invalid~.cds--form-requirement,.cds--time-picker--warning~.cds--form-requirement,.cds--time-picker[data-invalid]~.cds--form-requirement,input[data-invalid]~.cds--form-requirement{display:block;font-weight:400;max-block-size:12.5rem;overflow:visible}.cds--select--inline.cds--select--warning .cds--select-input--inline__wrapper~.cds--form-requirement,.cds--select-input--inline__wrapper[data-invalid]~.cds--form-requirement{display:inline-flex;inline-size:100%;margin:0;margin-block-end:0;max-block-size:100%;overflow:visible;padding-inline-start:.5rem}.cds--date-picker-input__wrapper--invalid~.cds--form-requirement,.cds--date-picker-input__wrapper~.cds--form-requirement,.cds--list-box[data-invalid]~.cds--form-requirement,.cds--number[data-invalid] .cds--number__input-wrapper~.cds--form-requirement,.cds--select-input--inline__wrapper[data-invalid]~.cds--form-requirement,.cds--select-input__wrapper[data-invalid]~.cds--form-requirement,.cds--text-area__wrapper[data-invalid]~.cds--form-requirement,.cds--text-input__field-wrapper[data-invalid]~.cds--form-requirement,.cds--time-picker--invalid~.cds--form-requirement,.cds--time-picker[data-invalid]~.cds--form-requirement,input[data-invalid]~.cds--form-requirement{color:var(--cds-text-error,#da1e28)}.cds--form--fluid .cds--text-input__field-wrapper--warning,.cds--form--fluid .cds--text-input__field-wrapper[data-invalid]{display:block}.cds--form--fluid input[data-invalid]{outline:none}.cds--form--fluid .cds--form-requirement{margin:0;padding:.5rem 2.5rem .5rem 1rem}input:not(output,[data-invalid]):-moz-ui-invalid{box-shadow:none}.cds--form-requirement html{font-size:100%}.cds--form-requirement body{font-family:IBM Plex Sans,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,sans-serif;font-weight:400;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.cds--form-requirement code{font-family:IBM Plex Mono,system-ui,-apple-system,BlinkMacSystemFont,\\.SFNSText-Regular,monospace}.cds--form-requirement strong{font-weight:600}.cds--form-requirement{display:none;font-size:var(--cds-helper-text-01-font-size,.75rem);letter-spacing:var(--cds-helper-text-01-letter-spacing,.32px);line-height:var(--cds-helper-text-01-line-height,1.33333);margin:.25rem 0 0;max-block-size:0;overflow:hidden}.cds--select--inline .cds--form__helper-text{margin-block-start:0}.cds--form__helper-text{color:var(--cds-text-helper,#6f6f6f);font-size:var(--cds-helper-text-01-font-size,.75rem);inline-size:100%;letter-spacing:var(--cds-helper-text-01-letter-spacing,.32px);line-height:var(--cds-helper-text-01-line-height,1.33333);margin-block-start:.25rem;opacity:1;z-index:0}.cds--form__helper-text--disabled,.cds--label--disabled,fieldset[disabled] .cds--form__helper-text,fieldset[disabled] .cds--label{color:var(--cds-text-disabled,hsla(0,0%,9%,.25))}:host(cds-tile){--cds-layout-size-height-xs:1.5rem;--cds-layout-size-height-sm:2rem;--cds-layout-size-height-md:2.5rem;--cds-layout-size-height-lg:3rem;--cds-layout-size-height-xl:4rem;--cds-layout-size-height-2xl:5rem;--cds-layout-size-height-min:0px;--cds-layout-size-height-max:999999999px;--cds-layout-density-padding-inline-condensed:0.5rem;--cds-layout-density-padding-inline-normal:1rem;--cds-layout-density-padding-inline-min:0px;--cds-layout-density-padding-inline-max:999999999px}:host(cds-tile-group){background:transparent}:host(cds-tile-group) fieldset{border:none}:host(cds-clickable-tile){--cds-layout-size-height-xs:1.5rem;--cds-layout-size-height-sm:2rem;--cds-layout-size-height-md:2.5rem;--cds-layout-size-height-lg:3rem;--cds-layout-size-height-xl:4rem;--cds-layout-size-height-2xl:5rem;--cds-layout-size-height-min:0px;--cds-layout-size-height-max:999999999px;--cds-layout-density-padding-inline-condensed:0.5rem;--cds-layout-density-padding-inline-normal:1rem;--cds-layout-density-padding-inline-min:0px;--cds-layout-density-padding-inline-max:999999999px;display:grid;outline:none}:host(cds-clickable-tile) .cds--link--disabled{background-color:var(--cds-layer);color:var(--cds-text-disabled,hsla(0,0%,9%,.25));cursor:not-allowed;display:block;padding:density(\"padding-inline\")}:host(cds-clickable-tile) .cds--tile,:host(cds-clickable-tile) :host(cds-expandable-tile),:host(cds-clickable-tile) :host(cds-tile){outline:.125rem solid transparent;padding:1rem}:host(cds-clickable-tile) .cds--tile--clickable{display:block;transition:.15s cubic-bezier(.2,0,.38,.9)}:host(cds-clickable-tile) .cds--tile--clickable:focus{outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){:host(cds-clickable-tile) .cds--tile--clickable:focus{outline-style:dotted}}:host(cds-clickable-tile) .cds--link__icon{display:block}:host(cds-clickable-tile) ::slotted([slot=ai-label]),:host(cds-clickable-tile) ::slotted([slot=slug]){pointer-events:none}:host(cds-radio-tile){--cds-layout-size-height-xs:1.5rem;--cds-layout-size-height-sm:2rem;--cds-layout-size-height-md:2.5rem;--cds-layout-size-height-lg:3rem;--cds-layout-size-height-xl:4rem;--cds-layout-size-height-2xl:5rem;--cds-layout-size-height-min:0px;--cds-layout-size-height-max:999999999px;--cds-layout-density-padding-inline-condensed:0.5rem;--cds-layout-density-padding-inline-normal:1rem;--cds-layout-density-padding-inline-min:0px;--cds-layout-density-padding-inline-max:999999999px;display:block;margin-block-end:.5rem;outline:none;position:relative}:host(cds-radio-tile) .cds--tile,:host(cds-radio-tile) :host(cds-expandable-tile),:host(cds-radio-tile) :host(cds-tile){block-size:100%}:host(cds-selectable-tile){--cds-layout-size-height-xs:1.5rem;--cds-layout-size-height-sm:2rem;--cds-layout-size-height-md:2.5rem;--cds-layout-size-height-lg:3rem;--cds-layout-size-height-xl:4rem;--cds-layout-size-height-2xl:5rem;--cds-layout-size-height-min:0px;--cds-layout-size-height-max:999999999px;--cds-layout-density-padding-inline-condensed:0.5rem;--cds-layout-density-padding-inline-normal:1rem;--cds-layout-density-padding-inline-min:0px;--cds-layout-density-padding-inline-max:999999999px;display:block;outline:none;position:relative}:host(cds-selectable-tile) .cds--tile,:host(cds-selectable-tile) :host(cds-expandable-tile),:host(cds-selectable-tile) :host(cds-tile){block-size:100%}:host(cds-radio-tile) .cds--tile-input:checked~.cds--tile--selectable .cds--tile__checkmark,:host(cds-selectable-tile) .cds--tile-input:checked~.cds--tile--selectable .cds--tile__checkmark{opacity:1}:host(cds-clickable-tile) ::slotted(*),:host(cds-radio-tile) ::slotted(:not([slot])),:host(cds-selectable-tile) ::slotted(:not([slot])){cursor:pointer;position:relative;z-index:1}:host(cds-expandable-tile){--cds-layout-size-height-xs:1.5rem;--cds-layout-size-height-sm:2rem;--cds-layout-size-height-md:2.5rem;--cds-layout-size-height-lg:3rem;--cds-layout-size-height-xl:4rem;--cds-layout-size-height-2xl:5rem;--cds-layout-size-height-min:0px;--cds-layout-size-height-max:999999999px;--cds-layout-density-padding-inline-condensed:0.5rem;--cds-layout-density-padding-inline-normal:1rem;--cds-layout-density-padding-inline-min:0px;--cds-layout-density-padding-inline-max:999999999px}:host(cds-expandable-tile) ::slotted(cds-tile-above-the-fold-content){display:block}:host(cds-expandable-tile) .cds-ce--expandable-tile--below-the-fold-content{max-block-size:0;transition:max-height .11s cubic-bezier(.2,0,.38,.9)}:host(cds-expandable-tile[expanded]) ::slotted(cds-tile-below-the-fold-content){opacity:1;transition:.11s cubic-bezier(.2,0,.38,.9);visibility:visible}:host(cds-expandable-tile[with-interactive]){cursor:default;transition:max-height .15s cubic-bezier(.2,0,.38,.9)}:host(cds-expandable-tile[with-interactive]):hover{background-color:var(--cds-layer)}:host(cds-expandable-tile[with-interactive]):focus{outline:none}:host(cds-expandable-tile:not([with-interactive]):focus-within){outline:2px solid var(--cds-focus,#0f62fe);outline-offset:-2px}@media screen and (prefers-contrast){:host(cds-expandable-tile:not([with-interactive]):focus-within){outline-style:dotted}}:host(cds-expandable-tile:not([with-interactive])) .cds--tile__chevron{background:none;border:none;cursor:pointer;outline:none}:host(cds-clickable-tile[ai-label]) .cds--tile,:host(cds-clickable-tile[ai-label]) :host(cds-expandable-tile),:host(cds-clickable-tile[ai-label]) :host(cds-tile),:host(cds-expandable-tile[ai-label]),:host(cds-radio-tile[ai-label]) .cds--tile,:host(cds-radio-tile[ai-label]) :host(cds-expandable-tile),:host(cds-radio-tile[ai-label]) :host(cds-tile),:host(cds-selectable-tile[ai-label]) .cds--tile,:host(cds-selectable-tile[ai-label]) :host(cds-expandable-tile),:host(cds-selectable-tile[ai-label]) :host(cds-tile),:host(cds-tile[ai-label]){background:linear-gradient(to top,var(--cds-layer,var(--cds-ai-popover-background,#fff)) 0,var(--cds-ai-aura-start,rgba(69,137,255,.1)) 0,15%,var(--cds-ai-aura-end,hsla(0,0%,100%,0)) 50%) padding-box,linear-gradient(to top,var(--cds-layer,var(--cds-ai-popover-background,#fff)),var(--cds-layer,var(--cds-ai-popover-background,#fff))) padding-box,linear-gradient(to bottom,var(--cds-ai-border-start,rgba(166,200,255,.64)),var(--cds-ai-border-end,#78a9ff)) border-box,linear-gradient(to top,var(--cds-layer,var(--cds-ai-popover-background,#fff)),var(--cds-layer,var(--cds-ai-popover-background,#fff))) border-box;border:1px solid transparent;box-shadow:inset 0 -80px 70px -65px var(--cds-ai-inner-shadow,rgba(69,137,255,.1)),0 24px 40px -24px var(--cds-ai-drop-shadow,rgba(15,98,254,.1))}:host(cds-clickable-tile) ::slotted([slot=ai-label]),:host(cds-clickable-tile) ::slotted([slot=decorator]),:host(cds-clickable-tile) ::slotted([slot=slug]),:host(cds-expandable-tile) ::slotted([slot=ai-label]),:host(cds-expandable-tile) ::slotted([slot=decorator]),:host(cds-expandable-tile) ::slotted([slot=slug]),:host(cds-radio-tile) ::slotted([slot=ai-label]),:host(cds-radio-tile) ::slotted([slot=decorator]),:host(cds-radio-tile) ::slotted([slot=slug]),:host(cds-selectable-tile) ::slotted([slot=ai-label]),:host(cds-selectable-tile) ::slotted([slot=decorator]),:host(cds-selectable-tile) ::slotted([slot=slug]),:host(cds-tile) ::slotted([slot=ai-label]),:host(cds-tile) ::slotted([slot=decorator]),:host(cds-tile) ::slotted([slot=slug]){inset-block-start:1rem;inset-inline-end:1rem;position:absolute}:host(cds-radio-tile[selected]) ::slotted([slot=ai-label]),:host(cds-radio-tile[selected]) ::slotted([slot=decorator]),:host(cds-selectable-tile) ::slotted([slot=ai-label]),:host(cds-selectable-tile) ::slotted([slot=decorator]),:host(cds-selectable-tile) ::slotted([slot=slug]){inset-inline-end:2.5rem;transition:inset-inline-end .11s cubic-bezier(.2,0,.38,.9)}:host(cds-expandable-tile[ai-label]):hover{background:linear-gradient(to top,var(--cds-layer,var(--cds-ai-popover-background,#fff)) 0,var(--cds-ai-aura-start,rgba(69,137,255,.1)) 0,15%,var(--cds-ai-aura-end,hsla(0,0%,100%,0)) 50%) padding-box,linear-gradient(to top,var(--cds-layer,var(--cds-ai-popover-background,#fff)),var(--cds-layer,var(--cds-ai-popover-background,#fff))) padding-box,linear-gradient(to bottom,var(--cds-ai-border-start,rgba(166,200,255,.64)),var(--cds-ai-border-end,#78a9ff)) border-box,linear-gradient(to top,var(--cds-layer,var(--cds-ai-popover-background,#fff)),var(--cds-layer,var(--cds-ai-popover-background,#fff))) border-box}:host(cds-clickable-tile[ai-label]) .cds--tile:before,:host(cds-radio-tile[ai-label]) .cds--tile:after,:host(cds-radio-tile[ai-label]) .cds--tile:before,:host(cds-selectable-tile[ai-label]) .cds--tile:after,:host(cds-selectable-tile[ai-label]) .cds--tile:before{block-size:100%;content:\"\";display:block;inline-size:100%;inset-block-start:0;inset-inline-start:0;opacity:0;position:absolute;transition:opacity .11s cubic-bezier(.2,0,.38,.9)}:host(cds-clickable-tile[ai-label]) .cds--tile:before,:host(cds-radio-tile[ai-label]) .cds--tile:before,:host(cds-selectable-tile[ai-label]) .cds--tile:before{background:linear-gradient(to top,var(--cds-ai-aura-hover-start,rgba(69,137,255,.32)) 0,15%,var(--cds-ai-aura-hover-end,hsla(0,0%,100%,0)) 50%) padding-box,linear-gradient(to top,var(--cds-ai-aura-hover-background,#edf5ff),var(--cds-ai-aura-hover-background,#edf5ff)) padding-box,linear-gradient(to bottom,var(--cds-ai-border-start,rgba(166,200,255,.64)),var(--cds-ai-border-end,#78a9ff)) border-box,linear-gradient(to top,var(--cds-ai-aura-hover-background,#edf5ff),var(--cds-ai-aura-hover-background,#edf5ff)) border-box;box-shadow:inset 0 -80px 70px -65px var(--cds-ai-inner-shadow,rgba(69,137,255,.1))}:host(cds-clickable-tile[ai-label]) .cds--tile:hover:before,:host(cds-radio-tile[ai-label]) .cds--tile:hover:before,:host(cds-selectable-tile[ai-label]) .cds--tile:hover:before{opacity:1}:host(cds-radio-tile[ai-label]) .cds--tile--is-selected,:host(cds-selectable-tile[ai-label]) .cds--tile--is-selected{border:1px solid var(--cds-layer-selected-inverse,#161616)}:host(cds-radio-tile[ai-label]) .cds--tile--is-selected .cds--tile__checkmark,:host(cds-selectable-tile[ai-label]) .cds--tile--is-selected .cds--tile__checkmark{z-index:1}:host(cds-radio-tile[ai-label]),:host(cds-selectable-tile[ai-label]) .cds--tile--is-selected:after{background:linear-gradient(to top,var(--cds-ai-aura-start,rgba(69,137,255,.1)) 0,15%,var(--cds-ai-aura-end,hsla(0,0%,100%,0)) 50%) padding-box,linear-gradient(to top,var(--cds-layer),var(--cds-layer)) padding-box,linear-gradient(to bottom,var(--cds-border-inverse,#161616),var(--cds-border-inverse,#161616)) border-box,linear-gradient(to top,var(--cds-layer),var(--cds-layer)) border-box;box-shadow:inset 0 -80px 70px -65px var(--cds-ai-inner-shadow,rgba(69,137,255,.1))}:host(cds-expandable-tile[ai-label]){overflow:visible}:host(cds-clickable-tile[ai-label][has-rounded-corners]) .cds--tile__chevron,:host(cds-expandable-tile[ai-label][has-rounded-corners]) .cds--tile__chevron,:host(cds-radio-tile[ai-label][has-rounded-corners]) .cds--tile__chevron,:host(cds-selectable-tile[ai-label][has-rounded-corners]) .cds--tile__chevron,:host(cds-tile[ai-label][has-rounded-corners]) .cds--tile__chevron{border-end-end-radius:.5rem}"]);
-
 //#endregion
 export { tile_default as default };
+
 //# sourceMappingURL=tile.scss.js.map

package/es/components/time-picker/defs.js

@@ -6,7 +6,6 @@
  */
 
 import { FORM_ELEMENT_COLOR_SCHEME } from "../../globals/shared-enums.js";
-
 //#region src/components/time-picker/defs.ts
 /**
 * Time picker size.
@@ -26,7 +25,7 @@ let TIME_PICKER_SIZE = /* @__PURE__ */ function(TIME_PICKER_SIZE) {
 	TIME_PICKER_SIZE["LARGE"] = "lg";
 	return TIME_PICKER_SIZE;
 }({});
-
 //#endregion
 export { FORM_ELEMENT_COLOR_SCHEME as TIME_PICKER_COLOR_SCHEME, TIME_PICKER_SIZE };
+
 //# sourceMappingURL=defs.js.map

package/es/components/time-picker/defs.js.map

@@ -1 +1 @@
-{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/time-picker/defs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2020, 2025\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\nexport { FORM_ELEMENT_COLOR_SCHEME as TIME_PICKER_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/**\n * Time picker size.\n */\nexport enum TIME_PICKER_SIZE {\n  /**\n   * Small size.\n   */\n  SMALL = 'sm',\n\n  /**\n   * Regular size.\n   */\n  MEDIUM = 'md',\n\n  /**\n   * Large size.\n   */\n  LARGE = 'lg',\n}\n"],"mappings":";;;;;;;;;;;;;AAYA,IAAY,8DAAL;;;;AAIL;;;;AAKA;;;;AAKA"}
+{"version":3,"file":"defs.js","names":[],"sources":["../../../src/components/time-picker/defs.ts"],"sourcesContent":["/**\n * Copyright IBM Corp. 2020, 2025\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\nexport { FORM_ELEMENT_COLOR_SCHEME as TIME_PICKER_COLOR_SCHEME } from '../../globals/shared-enums';\n\n/**\n * Time picker size.\n */\nexport enum TIME_PICKER_SIZE {\n  /**\n   * Small size.\n   */\n  SMALL = 'sm',\n\n  /**\n   * Regular size.\n   */\n  MEDIUM = 'md',\n\n  /**\n   * Large size.\n   */\n  LARGE = 'lg',\n}\n"],"mappings":";;;;;;;;;;;;AAYA,IAAY,mBAAL,yBAAA,kBAAA;;;;AAIL,kBAAA,WAAA;;;;AAKA,kBAAA,YAAA;;;;AAKA,kBAAA,WAAA;;KACD"}

package/es/components/time-picker/time-picker-select.js

@@ -5,20 +5,19 @@
  * LICENSE file in the root directory of this source tree.
  */
 
-import { prefix } from "../../globals/settings.js";
+import "../../globals/settings.js";
 import { filter } from "../../globals/internal/collection-helpers.js";
 import { carbonElement } from "../../globals/decorators/carbon-element.js";
-import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.112.0/helpers/decorate.js";
+import { __decorate } from "../../_virtual/_@oxc-project_runtime@0.126.0/helpers/decorate.js";
 import iconLoader from "../../globals/internal/icon-loader.js";
 import FormMixin from "../../globals/mixins/form.js";
 import time_picker_default from "./time-picker.scss.js";
-import { TIME_PICKER_SIZE } from "./defs.js";
+import "./defs.js";
 import { LitElement, html } from "lit";
 import { property, query } from "lit/decorators.js";
 import { classMap } from "lit/directives/class-map.js";
 import { ifDefined } from "lit/directives/if-defined.js";
 import ChevronDown16 from "@carbon/icons/es/chevron--down/16.js";
-
 //#region src/components/time-picker/time-picker-select.ts
 /**
 * Copyright IBM Corp. 2020, 2026
@@ -42,7 +41,7 @@ let CDSTimePickerSelect = class CDSTimePickerSelect extends FormMixin(LitElement
 		this.id = "";
 		this.name = "";
 		this.value = "";
-		this.size = TIME_PICKER_SIZE.MEDIUM;
+		this.size = "md";
 		this._handleMutation = () => {
 			this.requestUpdate();
 		};
@@ -67,7 +66,7 @@ let CDSTimePickerSelect = class CDSTimePickerSelect extends FormMixin(LitElement
 	* @returns The template containing child `<option>` elements from select items.
 	*/
 	_renderItems() {
-		const selectorItem = `${prefix}-select-item`;
+		const selectorItem = `cds-select-item`;
 		return filter(this.childNodes, (item) => item.nodeType === Node.ELEMENT_NODE && item.matches(selectorItem)).map((item) => {
 			const disabled = item.hasAttribute("disabled");
 			const label = item.getAttribute("label");
@@ -115,8 +114,8 @@ let CDSTimePickerSelect = class CDSTimePickerSelect extends FormMixin(LitElement
 	render() {
 		const { ariaLabel, disabled, size, id, value, readOnly, _handleInput: handleInput } = this;
 		const inputClasses = classMap({
-			[`${prefix}--select-input`]: true,
-			[`${prefix}--select-input--${size}`]: size
+			[`cds--select-input`]: true,
+			[`cds--select-input--${size}`]: size
 		});
 		return html`
       <select
@@ -130,13 +129,13 @@ let CDSTimePickerSelect = class CDSTimePickerSelect extends FormMixin(LitElement
         ${this._renderItems()}
       </select>
       ${iconLoader(ChevronDown16, {
-			class: `${prefix}--select__arrow`,
+			class: `cds--select__arrow`,
 			"aria-hidden": "true"
 		})}
     `;
 	}
 	static get eventSelect() {
-		return `${prefix}-select-selected`;
+		return `cds-select-selected`;
 	}
 	static {
 		this.shadowRootOptions = {
@@ -163,9 +162,9 @@ __decorate([property({ reflect: true })], CDSTimePickerSelect.prototype, "id", v
 __decorate([property()], CDSTimePickerSelect.prototype, "name", void 0);
 __decorate([property({ reflect: true })], CDSTimePickerSelect.prototype, "value", void 0);
 __decorate([property({ reflect: true })], CDSTimePickerSelect.prototype, "size", void 0);
-CDSTimePickerSelect = __decorate([carbonElement(`${prefix}-time-picker-select`)], CDSTimePickerSelect);
+CDSTimePickerSelect = __decorate([carbonElement(`cds-time-picker-select`)], CDSTimePickerSelect);
 var time_picker_select_default = CDSTimePickerSelect;
-
 //#endregion
 export { time_picker_select_default as default };
+
 //# sourceMappingURL=time-picker-select.js.map

package/es/components/time-picker/time-picker-select.js.map

@@ -1 +1 @@
-{"version":3,"file":"time-picker-select.js","names":["styles","customElement"],"sources":["../../../src/components/time-picker/time-picker-select.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\nimport { html, LitElement } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { prefix } from '../../globals/settings';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport ChevronDown16 from '@carbon/icons/es/chevron--down/16.js';\nimport { filter } from '../../globals/internal/collection-helpers';\nimport styles from './time-picker.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { TIME_PICKER_SIZE } from './defs';\nimport FormMixin from '../../globals/mixins/form';\n\n/**\n * Time picker select dropdown.\n *\n * @element cds-time-picker-select\n */\n@customElement(`${prefix}-time-picker-select`)\nclass CDSTimePickerSelect extends FormMixin(LitElement) {\n  /**\n   * The mutation observer for DOM mutation.\n   */\n  private _observerMutation: MutationObserver | null = null;\n\n  /**\n   * The select element.\n   */\n  @query('select')\n  private _selectNode!: HTMLSelectElement;\n\n  /**\n   * The ARIA label for the UI control.\n   */\n  @property({ attribute: 'aria-label' })\n  ariaLabel = 'open list of options';\n\n  /**\n   * Optionally provide the default value of the select\n   */\n  @property({ attribute: 'default-value' })\n  defaultValue = '';\n\n  /**\n   * Controls the readOnly state of the select\n   */\n  @property({ type: Boolean, reflect: true })\n  readOnly = false;\n\n  /**\n   * Specify whether the control is disabled\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * Specify a custom id for the select box\n   */\n  @property({ reflect: true })\n  id = '';\n\n  /**\n   * Name for the select in the `FormData`\n   */\n  @property()\n  name = '';\n\n  /**\n   * The value of the select.\n   */\n  @property({ reflect: true })\n  value = '';\n\n  /**\n   * Size of the time picker select\n   */\n  @property({ reflect: true })\n  size = TIME_PICKER_SIZE.MEDIUM;\n\n  /**\n   * Handles `oninput` event on the `<select>`.\n   *\n   * @param event The event.\n   * @param event.target The event target.\n   */\n  private _handleInput(event: Event) {\n    const { value } = event.target as HTMLSelectElement;\n    this.value = value;\n    const { eventSelect } = this.constructor as typeof CDSTimePickerSelect;\n    this.dispatchEvent(\n      new CustomEvent(eventSelect, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          value,\n        },\n      })\n    );\n  }\n\n  /**\n   * Handles DOM mutation of select items\n   */\n  private _handleMutation = () => {\n    this.requestUpdate();\n  };\n\n  /**\n   * @returns The template containing child `<option>` elements from select items.\n   */\n  private _renderItems() {\n    const selectorItem = `${prefix}-select-item`;\n\n    return filter(\n      this.childNodes,\n      (item) =>\n        item.nodeType === Node.ELEMENT_NODE &&\n        (item as Element).matches(selectorItem)\n    ).map((item) => {\n      const disabled = item.hasAttribute('disabled');\n      const label = item.getAttribute('label');\n      const selected = item.hasAttribute('selected');\n      const value = item.getAttribute('value');\n      const { textContent } = item;\n\n      return html`\n        <option\n          ?disabled=\"${disabled}\"\n          label=\"${ifDefined(label)}\"\n          ?selected=\"${selected}\"\n          value=\"${ifDefined(value)}\">\n          ${textContent}\n        </option>\n      `;\n    });\n  }\n\n  _handleFormdata(event: Event) {\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452\n    const { formData } = event as any; // TODO: Wait for `FormDataEvent` being available in `lib.dom.d.ts`\n    const { disabled, name, value } = this;\n    if (!disabled) {\n      formData.append(name, value);\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._observerMutation = new MutationObserver(this._handleMutation);\n    this._observerMutation.observe(this, {\n      attributes: true,\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this._observerMutation) {\n      this._observerMutation.disconnect();\n      this._observerMutation = null;\n    }\n    super.disconnectedCallback();\n  }\n\n  updated(changedProperties) {\n    if (\n      changedProperties.has('defaultValue') &&\n      this.defaultValue &&\n      !this.value\n    ) {\n      this.value = this.defaultValue;\n    }\n\n    if (changedProperties.has('value')) {\n      if (this._selectNode) {\n        this._selectNode.value = this.value;\n      }\n    }\n  }\n\n  render() {\n    const {\n      ariaLabel,\n      disabled,\n      size,\n      id,\n      value,\n      readOnly,\n      _handleInput: handleInput,\n    } = this;\n\n    const inputClasses = classMap({\n      [`${prefix}--select-input`]: true,\n      [`${prefix}--select-input--${size}`]: size,\n    });\n\n    return html`\n      <select\n        id=\"${ifDefined(id)}\"\n        class=\"${inputClasses}\"\n        aria-readonly=\"${String(readOnly)}\"\n        ?disabled=\"${disabled}\"\n        aria-label=\"${ifDefined(ariaLabel)}\"\n        .value=\"${ifDefined(value)}\"\n        @input=\"${handleInput}\">\n        ${this._renderItems()}\n      </select>\n      ${iconLoader(ChevronDown16, {\n        class: `${prefix}--select__arrow`,\n        'aria-hidden': 'true',\n      })}\n    `;\n  }\n  static get eventSelect() {\n    return `${prefix}-select-selected`;\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  static styles = styles;\n}\n\nexport default CDSTimePickerSelect;\n"],"mappings":"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"}
+{"version":3,"file":"time-picker-select.js","names":["styles","customElement"],"sources":["../../../src/components/time-picker/time-picker-select.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\nimport { html, LitElement } from 'lit';\nimport { property, query } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport { ifDefined } from 'lit/directives/if-defined.js';\nimport { prefix } from '../../globals/settings';\nimport { iconLoader } from '../../globals/internal/icon-loader';\nimport ChevronDown16 from '@carbon/icons/es/chevron--down/16.js';\nimport { filter } from '../../globals/internal/collection-helpers';\nimport styles from './time-picker.scss?lit';\nimport { carbonElement as customElement } from '../../globals/decorators/carbon-element';\nimport { TIME_PICKER_SIZE } from './defs';\nimport FormMixin from '../../globals/mixins/form';\n\n/**\n * Time picker select dropdown.\n *\n * @element cds-time-picker-select\n */\n@customElement(`${prefix}-time-picker-select`)\nclass CDSTimePickerSelect extends FormMixin(LitElement) {\n  /**\n   * The mutation observer for DOM mutation.\n   */\n  private _observerMutation: MutationObserver | null = null;\n\n  /**\n   * The select element.\n   */\n  @query('select')\n  private _selectNode!: HTMLSelectElement;\n\n  /**\n   * The ARIA label for the UI control.\n   */\n  @property({ attribute: 'aria-label' })\n  ariaLabel = 'open list of options';\n\n  /**\n   * Optionally provide the default value of the select\n   */\n  @property({ attribute: 'default-value' })\n  defaultValue = '';\n\n  /**\n   * Controls the readOnly state of the select\n   */\n  @property({ type: Boolean, reflect: true })\n  readOnly = false;\n\n  /**\n   * Specify whether the control is disabled\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /**\n   * Specify a custom id for the select box\n   */\n  @property({ reflect: true })\n  id = '';\n\n  /**\n   * Name for the select in the `FormData`\n   */\n  @property()\n  name = '';\n\n  /**\n   * The value of the select.\n   */\n  @property({ reflect: true })\n  value = '';\n\n  /**\n   * Size of the time picker select\n   */\n  @property({ reflect: true })\n  size = TIME_PICKER_SIZE.MEDIUM;\n\n  /**\n   * Handles `oninput` event on the `<select>`.\n   *\n   * @param event The event.\n   * @param event.target The event target.\n   */\n  private _handleInput(event: Event) {\n    const { value } = event.target as HTMLSelectElement;\n    this.value = value;\n    const { eventSelect } = this.constructor as typeof CDSTimePickerSelect;\n    this.dispatchEvent(\n      new CustomEvent(eventSelect, {\n        bubbles: true,\n        composed: true,\n        detail: {\n          value,\n        },\n      })\n    );\n  }\n\n  /**\n   * Handles DOM mutation of select items\n   */\n  private _handleMutation = () => {\n    this.requestUpdate();\n  };\n\n  /**\n   * @returns The template containing child `<option>` elements from select items.\n   */\n  private _renderItems() {\n    const selectorItem = `${prefix}-select-item`;\n\n    return filter(\n      this.childNodes,\n      (item) =>\n        item.nodeType === Node.ELEMENT_NODE &&\n        (item as Element).matches(selectorItem)\n    ).map((item) => {\n      const disabled = item.hasAttribute('disabled');\n      const label = item.getAttribute('label');\n      const selected = item.hasAttribute('selected');\n      const value = item.getAttribute('value');\n      const { textContent } = item;\n\n      return html`\n        <option\n          ?disabled=\"${disabled}\"\n          label=\"${ifDefined(label)}\"\n          ?selected=\"${selected}\"\n          value=\"${ifDefined(value)}\">\n          ${textContent}\n        </option>\n      `;\n    });\n  }\n\n  _handleFormdata(event: Event) {\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any -- https://github.com/carbon-design-system/carbon/issues/20452\n    const { formData } = event as any; // TODO: Wait for `FormDataEvent` being available in `lib.dom.d.ts`\n    const { disabled, name, value } = this;\n    if (!disabled) {\n      formData.append(name, value);\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._observerMutation = new MutationObserver(this._handleMutation);\n    this._observerMutation.observe(this, {\n      attributes: true,\n      childList: true,\n      subtree: true,\n    });\n  }\n\n  disconnectedCallback() {\n    if (this._observerMutation) {\n      this._observerMutation.disconnect();\n      this._observerMutation = null;\n    }\n    super.disconnectedCallback();\n  }\n\n  updated(changedProperties) {\n    if (\n      changedProperties.has('defaultValue') &&\n      this.defaultValue &&\n      !this.value\n    ) {\n      this.value = this.defaultValue;\n    }\n\n    if (changedProperties.has('value')) {\n      if (this._selectNode) {\n        this._selectNode.value = this.value;\n      }\n    }\n  }\n\n  render() {\n    const {\n      ariaLabel,\n      disabled,\n      size,\n      id,\n      value,\n      readOnly,\n      _handleInput: handleInput,\n    } = this;\n\n    const inputClasses = classMap({\n      [`${prefix}--select-input`]: true,\n      [`${prefix}--select-input--${size}`]: size,\n    });\n\n    return html`\n      <select\n        id=\"${ifDefined(id)}\"\n        class=\"${inputClasses}\"\n        aria-readonly=\"${String(readOnly)}\"\n        ?disabled=\"${disabled}\"\n        aria-label=\"${ifDefined(ariaLabel)}\"\n        .value=\"${ifDefined(value)}\"\n        @input=\"${handleInput}\">\n        ${this._renderItems()}\n      </select>\n      ${iconLoader(ChevronDown16, {\n        class: `${prefix}--select__arrow`,\n        'aria-hidden': 'true',\n      })}\n    `;\n  }\n  static get eventSelect() {\n    return `${prefix}-select-selected`;\n  }\n\n  static shadowRootOptions = {\n    ...LitElement.shadowRootOptions,\n    delegatesFocus: true,\n  };\n\n  static styles = styles;\n}\n\nexport default CDSTimePickerSelect;\n"],"mappings":"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"}