@redvars/peacock 3.8.3 → 3.8.4

package/dist/side-sheet.js

@@ -5,6 +5,7 @@ import './directive-ZPhl09Yt.js';
 
 var css_248z = i`* {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {

package/dist/side-sheet.js.map

@@ -1 +1 @@
-{"version":3,"file":"side-sheet.js","sources":["../../src/side-sheet/side-sheet.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport IndividualComponent from '../IndividualComponent.js';\nimport styles from './side-sheet.scss';\n\n/**\n * @label Side Sheet\n * @tag wc-side-sheet\n * @rawTag side-sheet\n * @summary Side sheets slide in from the edge of the screen to reveal supplemental content. Supports standard and modal variants.\n *\n * @cssprop --side-sheet-container-color - Background color of the sheet container.\n * @cssprop --side-sheet-scrim-color - Color of the modal scrim overlay.\n * @cssprop --side-sheet-shape - Corner radius of the leading edge.\n * @cssprop --side-sheet-width - Width of the side sheet.\n *\n * @example\n * ```html\n * Side Sheet\n\n * ```\n * @tags navigation, overlay\n */\n@IndividualComponent\nexport class SideSheet extends LitElement {\n  static styles = [styles];\n\n  /** Whether the sheet is visible. */\n  @property({ type: Boolean, reflect: true }) open = false;\n\n  /**\n   * Sheet variant.\n   * - `\"standard\"`: Coexists with page content; no scrim.\n   * - `\"modal\"`: Overlays page content with a scrim backdrop.\n   */\n  @property({ type: String, reflect: true }) variant: 'standard' | 'modal' =\n    'modal';\n\n  /**\n   * Side from which the sheet slides in.\n   * - `\"left\"`: Sheet opens from the left edge.\n   * - `\"right\"`: Sheet opens from the right edge.\n   */\n  @property({ type: String, reflect: true }) position: 'left' | 'right' =\n    'right';\n\n  show() {\n    this.open = true;\n  }\n\n  hide() {\n    this._close('programmatic');\n  }\n\n  private _close(reason: string) {\n    if (!this.open) return;\n    this.open = false;\n    this.dispatchEvent(\n      new CustomEvent('side-sheet-close', {\n        detail: { reason },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _handleScrimClick() {\n    if (this.variant === 'modal') {\n      this._close('scrim');\n    }\n  }\n\n  render() {\n    return html`\n      ${this.variant === 'modal'\n        ? html`<div\n            class=${classMap({ scrim: true, visible: this.open })}\n            @click=${this._handleScrimClick}\n          ></div>`\n        : nothing}\n\n      <div\n        class=${classMap({\n          sheet: true,\n          open: this.open,\n          [`variant-${this.variant}`]: true,\n          [`position-${this.position}`]: true,\n        })}\n        role=\"dialog\"\n        aria-modal=${this.variant === 'modal' ? 'true' : 'false'}\n        aria-hidden=${!this.open ? 'true' : 'false'}\n      >\n        <div class=\"content\" ?inert=${!this.open}>\n          <slot></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","classMap","nothing","styles","property"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA;;;;;;;;;;;;;;;;;AAiBG;AAEI,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQA,GAAU,CAAA;AAAlC,IAAA,WAAA,GAAA;;;QAIuC,IAAA,CAAA,IAAI,GAAG,KAAK;AAExD;;;;AAIG;QACwC,IAAA,CAAA,OAAO,GAChD,OAAO;AAET;;;;AAIG;QACwC,IAAA,CAAA,QAAQ,GACjD,OAAO;IAsDX;IApDE,IAAI,GAAA;AACF,QAAA,IAAI,CAAC,IAAI,GAAG,IAAI;IAClB;IAEA,IAAI,GAAA;AACF,QAAA,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC;IAC7B;AAEQ,IAAA,MAAM,CAAC,MAAc,EAAA;QAC3B,IAAI,CAAC,IAAI,CAAC,IAAI;YAAE;AAChB,QAAA,IAAI,CAAC,IAAI,GAAG,KAAK;AACjB,QAAA,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,kBAAkB,EAAE;YAClC,MAAM,EAAE,EAAE,MAAM,EAAE;AAClB,YAAA,OAAO,EAAE,IAAI;AACb,YAAA,QAAQ,EAAE,IAAI;AACf,SAAA,CAAC,CACH;IACH;IAEQ,iBAAiB,GAAA;AACvB,QAAA,IAAI,IAAI,CAAC,OAAO,KAAK,OAAO,EAAE;AAC5B,YAAA,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC;QACtB;IACF;IAEA,MAAM,GAAA;AACJ,QAAA,OAAOC,CAAI,CAAA;QACP,IAAI,CAAC,OAAO,KAAK;cACfA,CAAI,CAAA,CAAA;AACM,kBAAA,EAAAC,CAAQ,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC;AAC5C,mBAAA,EAAA,IAAI,CAAC,iBAAiB;AACzB,iBAAA;AACV,cAAEC,CAAO;;;AAGD,cAAA,EAAAD,CAAQ,CAAC;AACf,YAAA,KAAK,EAAE,IAAI;YACX,IAAI,EAAE,IAAI,CAAC,IAAI;AACf,YAAA,CAAC,WAAW,IAAI,CAAC,OAAO,CAAA,CAAE,GAAG,IAAI;AACjC,YAAA,CAAC,YAAY,IAAI,CAAC,QAAQ,CAAA,CAAE,GAAG,IAAI;SACpC,CAAC;;qBAEW,IAAI,CAAC,OAAO,KAAK,OAAO,GAAG,MAAM,GAAG,OAAO;sBAC1C,CAAC,IAAI,CAAC,IAAI,GAAG,MAAM,GAAG,OAAO;;sCAEb,CAAC,IAAI,CAAC,IAAI,CAAA;;;;KAI3C;IACH;;AAxEO,SAAA,CAAA,MAAM,GAAG,CAACE,QAAM,CAAC;AAGoB,UAAA,CAAA;IAA3CC,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAAe,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAOd,UAAA,CAAA;IAA1CA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AAC/B,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAOiC,UAAA,CAAA;IAA1CA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AAC/B,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AApBC,SAAS,GAAA,UAAA,CAAA;IADrB;AACY,CAAA,EAAA,SAAS,CA0ErB;;;;"}
+{"version":3,"file":"side-sheet.js","sources":["../../src/side-sheet/side-sheet.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport IndividualComponent from '../IndividualComponent.js';\nimport styles from './side-sheet.scss';\n\n/**\n * @label Side Sheet\n * @tag wc-side-sheet\n * @rawTag side-sheet\n * @summary Side sheets slide in from the edge of the screen to reveal supplemental content. Supports standard and modal variants.\n *\n * @cssprop --side-sheet-container-color - Background color of the sheet container.\n * @cssprop --side-sheet-scrim-color - Color of the modal scrim overlay.\n * @cssprop --side-sheet-shape - Corner radius of the leading edge.\n * @cssprop --side-sheet-width - Width of the side sheet.\n *\n * @example\n * ```html\n * Side Sheet\n\n * ```\n * @tags navigation, overlay\n */\n@IndividualComponent\nexport class SideSheet extends LitElement {\n  static styles = [styles];\n\n  /** Whether the sheet is visible. */\n  @property({ type: Boolean, reflect: true }) open = false;\n\n  /**\n   * Sheet variant.\n   * - `\"standard\"`: Coexists with page content; no scrim.\n   * - `\"modal\"`: Overlays page content with a scrim backdrop.\n   */\n  @property({ type: String, reflect: true }) variant: 'standard' | 'modal' =\n    'modal';\n\n  /**\n   * Side from which the sheet slides in.\n   * - `\"left\"`: Sheet opens from the left edge.\n   * - `\"right\"`: Sheet opens from the right edge.\n   */\n  @property({ type: String, reflect: true }) position: 'left' | 'right' =\n    'right';\n\n  show() {\n    this.open = true;\n  }\n\n  hide() {\n    this._close('programmatic');\n  }\n\n  private _close(reason: string) {\n    if (!this.open) return;\n    this.open = false;\n    this.dispatchEvent(\n      new CustomEvent('side-sheet-close', {\n        detail: { reason },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private _handleScrimClick() {\n    if (this.variant === 'modal') {\n      this._close('scrim');\n    }\n  }\n\n  render() {\n    return html`\n      ${this.variant === 'modal'\n        ? html`<div\n            class=${classMap({ scrim: true, visible: this.open })}\n            @click=${this._handleScrimClick}\n          ></div>`\n        : nothing}\n\n      <div\n        class=${classMap({\n          sheet: true,\n          open: this.open,\n          [`variant-${this.variant}`]: true,\n          [`position-${this.position}`]: true,\n        })}\n        role=\"dialog\"\n        aria-modal=${this.variant === 'modal' ? 'true' : 'false'}\n        aria-hidden=${!this.open ? 'true' : 'false'}\n      >\n        <div class=\"content\" ?inert=${!this.open}>\n          <slot></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","classMap","nothing","styles","property"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA;;;;;;;;;;;;;;;;;AAiBG;AAEI,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQA,GAAU,CAAA;AAAlC,IAAA,WAAA,GAAA;;;QAIuC,IAAA,CAAA,IAAI,GAAG,KAAK;AAExD;;;;AAIG;QACwC,IAAA,CAAA,OAAO,GAChD,OAAO;AAET;;;;AAIG;QACwC,IAAA,CAAA,QAAQ,GACjD,OAAO;IAsDX;IApDE,IAAI,GAAA;AACF,QAAA,IAAI,CAAC,IAAI,GAAG,IAAI;IAClB;IAEA,IAAI,GAAA;AACF,QAAA,IAAI,CAAC,MAAM,CAAC,cAAc,CAAC;IAC7B;AAEQ,IAAA,MAAM,CAAC,MAAc,EAAA;QAC3B,IAAI,CAAC,IAAI,CAAC,IAAI;YAAE;AAChB,QAAA,IAAI,CAAC,IAAI,GAAG,KAAK;AACjB,QAAA,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,kBAAkB,EAAE;YAClC,MAAM,EAAE,EAAE,MAAM,EAAE;AAClB,YAAA,OAAO,EAAE,IAAI;AACb,YAAA,QAAQ,EAAE,IAAI;AACf,SAAA,CAAC,CACH;IACH;IAEQ,iBAAiB,GAAA;AACvB,QAAA,IAAI,IAAI,CAAC,OAAO,KAAK,OAAO,EAAE;AAC5B,YAAA,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC;QACtB;IACF;IAEA,MAAM,GAAA;AACJ,QAAA,OAAOC,CAAI,CAAA;QACP,IAAI,CAAC,OAAO,KAAK;cACfA,CAAI,CAAA,CAAA;AACM,kBAAA,EAAAC,CAAQ,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC;AAC5C,mBAAA,EAAA,IAAI,CAAC,iBAAiB;AACzB,iBAAA;AACV,cAAEC,CAAO;;;AAGD,cAAA,EAAAD,CAAQ,CAAC;AACf,YAAA,KAAK,EAAE,IAAI;YACX,IAAI,EAAE,IAAI,CAAC,IAAI;AACf,YAAA,CAAC,WAAW,IAAI,CAAC,OAAO,CAAA,CAAE,GAAG,IAAI;AACjC,YAAA,CAAC,YAAY,IAAI,CAAC,QAAQ,CAAA,CAAE,GAAG,IAAI;SACpC,CAAC;;qBAEW,IAAI,CAAC,OAAO,KAAK,OAAO,GAAG,MAAM,GAAG,OAAO;sBAC1C,CAAC,IAAI,CAAC,IAAI,GAAG,MAAM,GAAG,OAAO;;sCAEb,CAAC,IAAI,CAAC,IAAI,CAAA;;;;KAI3C;IACH;;AAxEO,SAAA,CAAA,MAAM,GAAG,CAACE,QAAM,CAAC;AAGoB,UAAA,CAAA;IAA3CC,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAAe,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAOd,UAAA,CAAA;IAA1CA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AAC/B,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAOiC,UAAA,CAAA;IAA1CA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AAC/B,CAAA,EAAA,SAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AApBC,SAAS,GAAA,UAAA,CAAA;IADrB;AACY,CAAA,EAAA,SAAS,CA0ErB;;;;"}

package/dist/skeleton.js

@@ -3,6 +3,7 @@ import { n } from './property-B49QQ8pS.js';
 
 var css_248z = i`* {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {

package/dist/skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"skeleton.js","sources":["../../src/skeleton/skeleton.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport styles from './skeleton.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Skeleton\n * @tag wc-skeleton\n * @rawTag skeleton\n * @summary Adds a skeleton effect to an element.\n * @tags display\n *\n * @example\n * ```html\n * <wc-skeleton visible></wc-skeleton>\n * ```\n */\n@IndividualComponent\nexport class Skeleton extends LitElement {\n  static styles = [styles];\n\n  /** When true, the skeleton animation is shown. */\n  @property({ type: Boolean, reflect: true }) visible: boolean = false;\n\n  render() {\n    return html` <div class=\"skeleton\"></div>`;\n  }\n}\n"],"names":["LitElement","html","styles","property"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA;;;;;;;;;;;AAWG;AAEI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQA,GAAU,CAAA;AAAjC,IAAA,WAAA,GAAA;;;QAIuC,IAAA,CAAA,OAAO,GAAY,KAAK;IAKtE;IAHE,MAAM,GAAA;QACJ,OAAOC,CAAI,CAAA,CAAA,6BAAA,CAA+B;IAC5C;;AAPO,QAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAGoB,UAAA,CAAA;IAA3CC,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAA2B,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAJ1D,QAAQ,GAAA,UAAA,CAAA;IADpB;AACY,CAAA,EAAA,QAAQ,CASpB;;;;"}
+{"version":3,"file":"skeleton.js","sources":["../../src/skeleton/skeleton.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport styles from './skeleton.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Skeleton\n * @tag wc-skeleton\n * @rawTag skeleton\n * @summary Adds a skeleton effect to an element.\n * @tags display\n *\n * @example\n * ```html\n * <wc-skeleton visible></wc-skeleton>\n * ```\n */\n@IndividualComponent\nexport class Skeleton extends LitElement {\n  static styles = [styles];\n\n  /** When true, the skeleton animation is shown. */\n  @property({ type: Boolean, reflect: true }) visible: boolean = false;\n\n  render() {\n    return html` <div class=\"skeleton\"></div>`;\n  }\n}\n"],"names":["LitElement","html","styles","property"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA;;;;;;;;;;;AAWG;AAEI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQA,GAAU,CAAA;AAAjC,IAAA,WAAA,GAAA;;;QAIuC,IAAA,CAAA,OAAO,GAAY,KAAK;IAKtE;IAHE,MAAM,GAAA;QACJ,OAAOC,CAAI,CAAA,CAAA,6BAAA,CAA+B;IAC5C;;AAPO,QAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAGoB,UAAA,CAAA;IAA3CC,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAA2B,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAJ1D,QAAQ,GAAA,UAAA,CAAA;IADpB;AACY,CAAA,EAAA,QAAQ,CASpB;;;;"}

package/dist/snackbar.js

@@ -6,6 +6,7 @@ import './directive-ZPhl09Yt.js';
 
 var css_248z = i`* {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {

package/dist/snackbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"snackbar.js","sources":["../../src/snackbar/snackbar.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport styles from './snackbar.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\ntype SnackbarCloseReason = 'timeout' | 'dismiss' | 'action' | 'programmatic';\n\n/**\n * @label Snackbar\n * @tag wc-snackbar\n * @rawTag snackbar\n * @summary Snackbars provide brief messages about app processes at the bottom of the screen.\n *\n * @cssprop --snackbar-container-color - Container color for the snackbar.\n * @cssprop --snackbar-label-text-color - Label text color for the snackbar.\n * @cssprop --snackbar-action-text-color - Action text color.\n * @cssprop --snackbar-close-icon-color - Close icon color.\n * @cssprop --snackbar-border-radius - Border radius of the snackbar surface.\n * @cssprop --snackbar-offset-inline - Inline offset from viewport edges.\n * @cssprop --snackbar-offset-bottom - Bottom offset from viewport edge.\n * @cssprop --snackbar-z-index - Stacking order for the snackbar.\n *\n * @example\n * ```html\n * <wc-snackbar preview message=\"Message archived\" action-label=\"Undo\"></wc-snackbar>\n * ```\n * @tags display, feedback\n */\n@IndividualComponent\nexport class Snackbar extends LitElement {\n  static styles = [styles];\n\n  private static readonly GLOBAL_OPEN_EVENT = 'wc-snackbar-will-open';\n\n  private static readonly EXIT_ANIMATION_MS = 180;\n\n  /** Whether the snackbar is currently visible. */\n  @property({ type: Boolean, reflect: true }) open = false;\n\n  /** The message text to display. Can also be provided via the default slot. */\n  @property({ type: String }) message = '';\n\n  /** Label for the optional action button. When empty, no action button is rendered. */\n  @property({ type: String, attribute: 'action-label' }) actionLabel = '';\n\n  /** When true, a dismiss icon button is shown on the trailing end. */\n  @property({ type: Boolean, attribute: 'show-close-icon' })\n  showCloseIcon = false;\n\n  /** Auto-hide duration in milliseconds. Set to `0` to disable auto-hide. */\n  @property({ type: Number }) duration = 4000;\n\n  /** When true, the snackbar content is allowed to wrap to multiple lines. */\n  @property({ type: Boolean, reflect: true }) multiline = false;\n\n  /** When true, renders the snackbar in a static preview state (always visible, no animation). */\n  @property({ type: Boolean, reflect: true }) preview = false;\n\n  /** True while the exit animation is running before the snackbar fully closes. */\n  @state() private dismissing = false;\n\n  // ── Private fields ────────────────────────────────────────────────────────\n\n  /** Timer handle for the auto-hide timeout. */\n  private hideTimer: ReturnType<typeof setTimeout> | null = null;\n\n  /** Timer handle for the exit animation duration timeout. */\n  private exitTimer: ReturnType<typeof setTimeout> | null = null;\n\n  private readonly handleGlobalSnackbarOpen = (\n    event: Event,\n  ) => {\n    const { source } = (event as CustomEvent<{ source?: Snackbar }>).detail;\n    if (source && source !== this) {\n      this.hide();\n    }\n  };\n\n  connectedCallback() {\n    super.connectedCallback();\n    document.addEventListener(\n      Snackbar.GLOBAL_OPEN_EVENT,\n      this.handleGlobalSnackbarOpen,\n    );\n  }\n\n  disconnectedCallback() {\n    document.removeEventListener(\n      Snackbar.GLOBAL_OPEN_EVENT,\n      this.handleGlobalSnackbarOpen,\n    );\n    this.clearExitTimer();\n    this.clearTimer();\n    super.disconnectedCallback();\n  }\n\n  protected updated(changedProperties: Map<string, unknown>) {\n    if (changedProperties.has('open')) {\n      if (this.open) {\n        document.dispatchEvent(\n          new CustomEvent(Snackbar.GLOBAL_OPEN_EVENT, {\n            detail: { source: this },\n          }),\n        );\n      }\n\n      this.scheduleAutoHide();\n    }\n  }\n\n  // ── Public methods ────────────────────────────────────────────────────────\n\n  show() {\n    this.dismissing = false;\n    this.clearExitTimer();\n    if (!this.open) {\n      this.open = true;\n      return;\n    }\n\n    this.scheduleAutoHide();\n  }\n\n  hide() {\n    this.close('programmatic');\n  }\n\n  private close(reason: SnackbarCloseReason) {\n    if (!this.open || this.dismissing) {\n      return;\n    }\n\n    this.clearTimer();\n    this.dismissing = true;\n    this.clearExitTimer();\n    this.exitTimer = setTimeout(() => {\n      this.completeDismiss();\n    }, Snackbar.EXIT_ANIMATION_MS);\n\n    this.dispatchEvent(\n      new CustomEvent('snackbar-close', {\n        detail: { reason },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private completeDismiss() {\n    this.clearExitTimer();\n    this.dismissing = false;\n    this.open = false;\n  }\n\n  private dispatchActionEvent() {\n    this.dispatchEvent(\n      new CustomEvent('snackbar-action', {\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private handleActionClick() {\n    this.dispatchActionEvent();\n    this.close('action');\n  }\n\n  private handleCloseClick() {\n    this.close('dismiss');\n  }\n\n  private clearTimer() {\n    if (this.hideTimer !== null) {\n      clearTimeout(this.hideTimer);\n      this.hideTimer = null;\n    }\n  }\n\n  private clearExitTimer() {\n    if (this.exitTimer !== null) {\n      clearTimeout(this.exitTimer);\n      this.exitTimer = null;\n    }\n  }\n\n  private handleAnimationEnd(event: AnimationEvent) {\n    if (event.animationName === 'snackbar-exit' && this.dismissing) {\n      this.completeDismiss();\n    }\n  }\n\n  private scheduleAutoHide() {\n    this.clearTimer();\n    if (!this.open || this.duration <= 0) {\n      return;\n    }\n\n    this.hideTimer = setTimeout(() => {\n      this.close('timeout');\n    }, this.duration);\n  }\n\n  render() {\n    const liveRole =\n      this.actionLabel || this.showCloseIcon ? 'alert' : 'status';\n\n    return html`\n      <div\n        class=${classMap({\n          snackbar: true,\n          open: !this.preview && this.open,\n          preview: this.preview,\n          dismissing: this.dismissing,\n          multiline: this.multiline,\n        })}\n        role=${liveRole}\n        aria-live=\"polite\"\n        @animationend=${this.handleAnimationEnd}\n      >\n        <div class=\"label\">\n          <slot>${this.message}</slot>\n        </div>\n\n        ${this.actionLabel\n          ? html`<wc-button class=\"action\" variant='text' size='small' @click=${this.handleActionClick}>\n              ${this.actionLabel}\n            </wc-button>`\n          : nothing}\n\n        ${this.showCloseIcon\n          ? html`<wc-icon-button\n              class=\"close\"\n              variant='text' \n              size='small'\n              aria-label=\"Dismiss notification\"\n              @click=${this.handleCloseClick}\n            >\n              <wc-icon name=\"close\"></wc-icon>\n            </wc-icon-button>`\n          : nothing}\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","classMap","nothing","styles","property","state"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA;;;;;;;;;;;;;;;;;;;;AAoBG;AAEI,IAAM,QAAQ,GAAA,UAAA,GAAd,MAAM,QAAS,SAAQA,GAAU,CAAA;AAAjC,IAAA,WAAA,GAAA;;;QAQuC,IAAA,CAAA,IAAI,GAAG,KAAK;;QAG5B,IAAA,CAAA,OAAO,GAAG,EAAE;;QAGe,IAAA,CAAA,WAAW,GAAG,EAAE;;QAIvE,IAAA,CAAA,aAAa,GAAG,KAAK;;QAGO,IAAA,CAAA,QAAQ,GAAG,IAAI;;QAGC,IAAA,CAAA,SAAS,GAAG,KAAK;;QAGjB,IAAA,CAAA,OAAO,GAAG,KAAK;;QAG1C,IAAA,CAAA,UAAU,GAAG,KAAK;;;QAK3B,IAAA,CAAA,SAAS,GAAyC,IAAI;;QAGtD,IAAA,CAAA,SAAS,GAAyC,IAAI;AAE7C,QAAA,IAAA,CAAA,wBAAwB,GAAG,CAC1C,KAAY,KACV;AACF,YAAA,MAAM,EAAE,MAAM,EAAE,GAAI,KAA4C,CAAC,MAAM;AACvE,YAAA,IAAI,MAAM,IAAI,MAAM,KAAK,IAAI,EAAE;gBAC7B,IAAI,CAAC,IAAI,EAAE;YACb;AACF,QAAA,CAAC;IAwKH;IAtKE,iBAAiB,GAAA;QACf,KAAK,CAAC,iBAAiB,EAAE;QACzB,QAAQ,CAAC,gBAAgB,CACvB,UAAQ,CAAC,iBAAiB,EAC1B,IAAI,CAAC,wBAAwB,CAC9B;IACH;IAEA,oBAAoB,GAAA;QAClB,QAAQ,CAAC,mBAAmB,CAC1B,UAAQ,CAAC,iBAAiB,EAC1B,IAAI,CAAC,wBAAwB,CAC9B;QACD,IAAI,CAAC,cAAc,EAAE;QACrB,IAAI,CAAC,UAAU,EAAE;QACjB,KAAK,CAAC,oBAAoB,EAAE;IAC9B;AAEU,IAAA,OAAO,CAAC,iBAAuC,EAAA;AACvD,QAAA,IAAI,iBAAiB,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE;AACjC,YAAA,IAAI,IAAI,CAAC,IAAI,EAAE;gBACb,QAAQ,CAAC,aAAa,CACpB,IAAI,WAAW,CAAC,UAAQ,CAAC,iBAAiB,EAAE;AAC1C,oBAAA,MAAM,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE;AACzB,iBAAA,CAAC,CACH;YACH;YAEA,IAAI,CAAC,gBAAgB,EAAE;QACzB;IACF;;IAIA,IAAI,GAAA;AACF,QAAA,IAAI,CAAC,UAAU,GAAG,KAAK;QACvB,IAAI,CAAC,cAAc,EAAE;AACrB,QAAA,IAAI,CAAC,IAAI,CAAC,IAAI,EAAE;AACd,YAAA,IAAI,CAAC,IAAI,GAAG,IAAI;YAChB;QACF;QAEA,IAAI,CAAC,gBAAgB,EAAE;IACzB;IAEA,IAAI,GAAA;AACF,QAAA,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC;IAC5B;AAEQ,IAAA,KAAK,CAAC,MAA2B,EAAA;QACvC,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,UAAU,EAAE;YACjC;QACF;QAEA,IAAI,CAAC,UAAU,EAAE;AACjB,QAAA,IAAI,CAAC,UAAU,GAAG,IAAI;QACtB,IAAI,CAAC,cAAc,EAAE;AACrB,QAAA,IAAI,CAAC,SAAS,GAAG,UAAU,CAAC,MAAK;YAC/B,IAAI,CAAC,eAAe,EAAE;AACxB,QAAA,CAAC,EAAE,UAAQ,CAAC,iBAAiB,CAAC;AAE9B,QAAA,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,gBAAgB,EAAE;YAChC,MAAM,EAAE,EAAE,MAAM,EAAE;AAClB,YAAA,OAAO,EAAE,IAAI;AACb,YAAA,QAAQ,EAAE,IAAI;AACf,SAAA,CAAC,CACH;IACH;IAEQ,eAAe,GAAA;QACrB,IAAI,CAAC,cAAc,EAAE;AACrB,QAAA,IAAI,CAAC,UAAU,GAAG,KAAK;AACvB,QAAA,IAAI,CAAC,IAAI,GAAG,KAAK;IACnB;IAEQ,mBAAmB,GAAA;AACzB,QAAA,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,iBAAiB,EAAE;AACjC,YAAA,OAAO,EAAE,IAAI;AACb,YAAA,QAAQ,EAAE,IAAI;AACf,SAAA,CAAC,CACH;IACH;IAEQ,iBAAiB,GAAA;QACvB,IAAI,CAAC,mBAAmB,EAAE;AAC1B,QAAA,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC;IACtB;IAEQ,gBAAgB,GAAA;AACtB,QAAA,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC;IACvB;IAEQ,UAAU,GAAA;AAChB,QAAA,IAAI,IAAI,CAAC,SAAS,KAAK,IAAI,EAAE;AAC3B,YAAA,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC;AAC5B,YAAA,IAAI,CAAC,SAAS,GAAG,IAAI;QACvB;IACF;IAEQ,cAAc,GAAA;AACpB,QAAA,IAAI,IAAI,CAAC,SAAS,KAAK,IAAI,EAAE;AAC3B,YAAA,YAAY,CAAC,IAAI,CAAC,SAAS,CAAC;AAC5B,YAAA,IAAI,CAAC,SAAS,GAAG,IAAI;QACvB;IACF;AAEQ,IAAA,kBAAkB,CAAC,KAAqB,EAAA;QAC9C,IAAI,KAAK,CAAC,aAAa,KAAK,eAAe,IAAI,IAAI,CAAC,UAAU,EAAE;YAC9D,IAAI,CAAC,eAAe,EAAE;QACxB;IACF;IAEQ,gBAAgB,GAAA;QACtB,IAAI,CAAC,UAAU,EAAE;QACjB,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,IAAI,CAAC,EAAE;YACpC;QACF;AAEA,QAAA,IAAI,CAAC,SAAS,GAAG,UAAU,CAAC,MAAK;AAC/B,YAAA,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC;AACvB,QAAA,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC;IACnB;IAEA,MAAM,GAAA;AACJ,QAAA,MAAM,QAAQ,GACZ,IAAI,CAAC,WAAW,IAAI,IAAI,CAAC,aAAa,GAAG,OAAO,GAAG,QAAQ;AAE7D,QAAA,OAAOC,CAAI,CAAA;;AAEC,cAAA,EAAAC,CAAQ,CAAC;AACf,YAAA,QAAQ,EAAE,IAAI;YACd,IAAI,EAAE,CAAC,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,IAAI;YAChC,OAAO,EAAE,IAAI,CAAC,OAAO;YACrB,UAAU,EAAE,IAAI,CAAC,UAAU;YAC3B,SAAS,EAAE,IAAI,CAAC,SAAS;SAC1B,CAAC;eACK,QAAQ;;AAEC,sBAAA,EAAA,IAAI,CAAC,kBAAkB;;;AAG7B,gBAAA,EAAA,IAAI,CAAC,OAAO,CAAA;;;AAGpB,QAAA,EAAA,IAAI,CAAC;AACL,cAAED,CAAI,CAAA,CAAA,6DAAA,EAAgE,IAAI,CAAC,iBAAiB,CAAA;AACtF,cAAA,EAAA,IAAI,CAAC,WAAW;AACP,wBAAA;AACf,cAAEE,CAAO;;AAET,QAAA,EAAA,IAAI,CAAC;cACHF,CAAI,CAAA,CAAA;;;;;AAKO,qBAAA,EAAA,IAAI,CAAC,gBAAgB;;;AAGd,6BAAA;AACpB,cAAEE,CAAO;;KAEd;IACH;;AArNO,QAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAEA,QAAA,CAAA,iBAAiB,GAAG,uBAAH;AAEjB,QAAA,CAAA,iBAAiB,GAAG,GAAH;AAGG,UAAA,CAAA;IAA3CC,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAAe,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAG7B,UAAA,CAAA;AAA3B,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE;AAAe,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAGc,UAAA,CAAA;IAAtDA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,cAAc,EAAE;AAAmB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,aAAA,EAAA,MAAA,CAAA;AAIxE,UAAA,CAAA;IADCA,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,SAAS,EAAE,iBAAiB,EAAE;AACnC,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,eAAA,EAAA,MAAA,CAAA;AAGM,UAAA,CAAA;AAA3B,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE;AAAkB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AAGA,UAAA,CAAA;IAA3CA,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAAoB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,WAAA,EAAA,MAAA,CAAA;AAGlB,UAAA,CAAA;IAA3CA,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAAkB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAG3C,UAAA,CAAA;AAAhB,IAAAC,CAAK;AAA8B,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,YAAA,EAAA,MAAA,CAAA;AA9BzB,QAAQ,GAAA,UAAA,GAAA,UAAA,CAAA;IADpB;AACY,CAAA,EAAA,QAAQ,CAuNpB;;;;"}
+{"version":3,"file":"snackbar.js","sources":["../../src/snackbar/snackbar.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport styles from './snackbar.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\ntype SnackbarCloseReason = 'timeout' | 'dismiss' | 'action' | 'programmatic';\n\n/**\n * @label Snackbar\n * @tag wc-snackbar\n * @rawTag snackbar\n * @summary Snackbars provide brief messages about app processes at the bottom of the screen.\n *\n * @cssprop --snackbar-container-color - Container color for the snackbar.\n * @cssprop --snackbar-label-text-color - Label text color for the snackbar.\n * @cssprop --snackbar-action-text-color - Action text color.\n * @cssprop --snackbar-close-icon-color - Close icon color.\n * @cssprop --snackbar-border-radius - Border radius of the snackbar surface.\n * @cssprop --snackbar-offset-inline - Inline offset from viewport edges.\n * @cssprop --snackbar-offset-bottom - Bottom offset from viewport edge.\n * @cssprop --snackbar-z-index - Stacking order for the snackbar.\n *\n * @example\n * ```html\n * <wc-snackbar preview message=\"Message archived\" action-label=\"Undo\"></wc-snackbar>\n * ```\n * @tags display, feedback\n */\n@IndividualComponent\nexport class Snackbar extends LitElement {\n  static styles = [styles];\n\n  private static readonly GLOBAL_OPEN_EVENT = 'wc-snackbar-will-open';\n\n  private static readonly EXIT_ANIMATION_MS = 180;\n\n  /** Whether the snackbar is currently visible. */\n  @property({ type: Boolean, reflect: true }) open = false;\n\n  /** The message text to display. Can also be provided via the default slot. */\n  @property({ type: String }) message = '';\n\n  /** Label for the optional action button. When empty, no action button is rendered. */\n  @property({ type: String, attribute: 'action-label' }) actionLabel = '';\n\n  /** When true, a dismiss icon button is shown on the trailing end. */\n  @property({ type: Boolean, attribute: 'show-close-icon' })\n  showCloseIcon = false;\n\n  /** Auto-hide duration in milliseconds. Set to `0` to disable auto-hide. */\n  @property({ type: Number }) duration = 4000;\n\n  /** When true, the snackbar content is allowed to wrap to multiple lines. */\n  @property({ type: Boolean, reflect: true }) multiline = false;\n\n  /** When true, renders the snackbar in a static preview state (always visible, no animation). */\n  @property({ type: Boolean, reflect: true }) preview = false;\n\n  /** True while the exit animation is running before the snackbar fully closes. */\n  @state() private dismissing = false;\n\n  // ── Private fields ────────────────────────────────────────────────────────\n\n  /** Timer handle for the auto-hide timeout. */\n  private hideTimer: ReturnType<typeof setTimeout> | null = null;\n\n  /** Timer handle for the exit animation duration timeout. */\n  private exitTimer: ReturnType<typeof setTimeout> | null = null;\n\n  private readonly handleGlobalSnackbarOpen = (\n    event: Event,\n  ) => {\n    const { source } = (event as CustomEvent<{ source?: Snackbar }>).detail;\n    if (source && source !== this) {\n      this.hide();\n    }\n  };\n\n  connectedCallback() {\n    super.connectedCallback();\n    document.addEventListener(\n      Snackbar.GLOBAL_OPEN_EVENT,\n      this.handleGlobalSnackbarOpen,\n    );\n  }\n\n  disconnectedCallback() {\n    document.removeEventListener(\n      Snackbar.GLOBAL_OPEN_EVENT,\n      this.handleGlobalSnackbarOpen,\n    );\n    this.clearExitTimer();\n    this.clearTimer();\n    super.disconnectedCallback();\n  }\n\n  protected updated(changedProperties: Map<string, unknown>) {\n    if (changedProperties.has('open')) {\n      if (this.open) {\n        document.dispatchEvent(\n          new CustomEvent(Snackbar.GLOBAL_OPEN_EVENT, {\n            detail: { source: this },\n          }),\n        );\n      }\n\n      this.scheduleAutoHide();\n    }\n  }\n\n  // ── Public methods ────────────────────────────────────────────────────────\n\n  show() {\n    this.dismissing = false;\n    this.clearExitTimer();\n    if (!this.open) {\n      this.open = true;\n      return;\n    }\n\n    this.scheduleAutoHide();\n  }\n\n  hide() {\n    this.close('programmatic');\n  }\n\n  private close(reason: SnackbarCloseReason) {\n    if (!this.open || this.dismissing) {\n      return;\n    }\n\n    this.clearTimer();\n    this.dismissing = true;\n    this.clearExitTimer();\n    this.exitTimer = setTimeout(() => {\n      this.completeDismiss();\n    }, Snackbar.EXIT_ANIMATION_MS);\n\n    this.dispatchEvent(\n      new CustomEvent('snackbar-close', {\n        detail: { reason },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private completeDismiss() {\n    this.clearExitTimer();\n    this.dismissing = false;\n    this.open = false;\n  }\n\n  private dispatchActionEvent() {\n    this.dispatchEvent(\n      new CustomEvent('snackbar-action', {\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  private handleActionClick() {\n    this.dispatchActionEvent();\n    this.close('action');\n  }\n\n  private handleCloseClick() {\n    this.close('dismiss');\n  }\n\n  private clearTimer() {\n    if (this.hideTimer !== null) {\n      clearTimeout(this.hideTimer);\n      this.hideTimer = null;\n    }\n  }\n\n  private clearExitTimer() {\n    if (this.exitTimer !== null) {\n      clearTimeout(this.exitTimer);\n      this.exitTimer = null;\n    }\n  }\n\n  private handleAnimationEnd(event: AnimationEvent) {\n    if (event.animationName === 'snackbar-exit' && this.dismissing) {\n      this.completeDismiss();\n    }\n  }\n\n  private scheduleAutoHide() {\n    this.clearTimer();\n    if (!this.open || this.duration <= 0) {\n      return;\n    }\n\n    this.hideTimer = setTimeout(() => {\n      this.close('timeout');\n    }, this.duration);\n  }\n\n  render() {\n    const liveRole =\n      this.actionLabel || this.showCloseIcon ? 'alert' : 'status';\n\n    return html`\n      <div\n        class=${classMap({\n          snackbar: true,\n          open: !this.preview && this.open,\n          preview: this.preview,\n          dismissing: this.dismissing,\n          multiline: this.multiline,\n        })}\n        role=${liveRole}\n        aria-live=\"polite\"\n        @animationend=${this.handleAnimationEnd}\n      >\n        <div class=\"label\">\n          <slot>${this.message}</slot>\n        </div>\n\n        ${this.actionLabel\n          ? html`<wc-button class=\"action\" variant='text' size='small' @click=${this.handleActionClick}>\n              ${this.actionLabel}\n            </wc-button>`\n          : nothing}\n\n        ${this.showCloseIcon\n          ? html`<wc-icon-button\n              class=\"close\"\n              variant='text' \n              size='small'\n              aria-label=\"Dismiss notification\"\n              @click=${this.handleCloseClick}\n            >\n              <wc-icon name=\"close\"></wc-icon>\n            </wc-icon-button>`\n          : nothing}\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","classMap","nothing","styles","property","state"],"mappings":"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"}

package/dist/spinner.js

@@ -2,6 +2,7 @@ import { i, _ as __decorate, I as IndividualComponent, a as i$1, b } from './Ind
 
 var css_248z = i`* {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {

package/dist/spinner.js.map

@@ -1 +1 @@
-{"version":3,"file":"spinner.js","sources":["../../src/spinner/spinner.ts"],"sourcesContent":["import { LitElement, html, css } from 'lit';\n\nimport styles from './spinner.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Spinner\n * @tag wc-spinner\n * @rawTag spinner\n * @summary A spinner component that animates a circular shape.\n * @cssprop --spinner-track-color - The color of the track.\n * @cssprop --spinner-shape-color - The color of the shape.\n * @tags display\n *\n * @example\n * ```html\n * <wc-spinner></wc-spinner>\n * ```\n */\n@IndividualComponent\nexport class Spinner extends LitElement {\n  static styles = [styles];\n\n  render() {\n    return html`\n      <div class=\"spinner track\">\n        <div class=\"shape\"></div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","styles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA;;;;;;;;;;;;;AAaG;AAEI,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQA,GAAU,CAAA;IAGrC,MAAM,GAAA;AACJ,QAAA,OAAOC,CAAI,CAAA;;;;KAIV;IACH;;AARO,OAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AADb,OAAO,GAAA,UAAA,CAAA;IADnB;AACY,CAAA,EAAA,OAAO,CAUnB;;;;"}
+{"version":3,"file":"spinner.js","sources":["../../src/spinner/spinner.ts"],"sourcesContent":["import { LitElement, html, css } from 'lit';\n\nimport styles from './spinner.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Spinner\n * @tag wc-spinner\n * @rawTag spinner\n * @summary A spinner component that animates a circular shape.\n * @cssprop --spinner-track-color - The color of the track.\n * @cssprop --spinner-shape-color - The color of the shape.\n * @tags display\n *\n * @example\n * ```html\n * <wc-spinner></wc-spinner>\n * ```\n */\n@IndividualComponent\nexport class Spinner extends LitElement {\n  static styles = [styles];\n\n  render() {\n    return html`\n      <div class=\"spinner track\">\n        <div class=\"shape\"></div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","styles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAKA;;;;;;;;;;;;;AAaG;AAEI,IAAM,OAAO,GAAb,MAAM,OAAQ,SAAQA,GAAU,CAAA;IAGrC,MAAM,GAAA;AACJ,QAAA,OAAOC,CAAI,CAAA;;;;KAIV;IACH;;AARO,OAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AADb,OAAO,GAAA,UAAA,CAAA;IADnB;AACY,CAAA,EAAA,OAAO,CAUnB;;;;"}

package/dist/split-button.js

@@ -9,6 +9,7 @@ import './directive-ZPhl09Yt.js';
 var css_248z$2 = i`@charset "UTF-8";
 * {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {

package/dist/split-button.js.map

@@ -1 +1 @@
-{"version":3,"file":"split-button.js","sources":["../../src/split-button/split-button.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './split-button.scss';\nimport colorStyles from './split-button-colors.scss';\nimport sizeStyles from './split-button-sizes.scss';\n\n/**\n * @label Split Button\n * @tag wc-split-button\n * @rawTag split-button\n *\n * @summary A split button lets users perform a default action or choose from a set of related actions via a dropdown menu.\n * @overview\n * <p>A split button combines a primary action button with a dropdown arrow that opens a menu. Following M3 Material Design, the split button provides a default action alongside a set of secondary options, reducing clutter while keeping alternative actions accessible.</p>\n *\n * @cssprop --split-button-container-shape: Defines the border radius of the split button container shape.\n *\n * @cssprop --filled-split-button-container-color: Color of the filled split button container.\n * @cssprop --filled-split-button-label-text-color: Text color of the filled split button label.\n *\n * @cssprop --outlined-split-button-container-color: Color of the outlined split button container.\n * @cssprop --outlined-split-button-label-text-color: Text color of the outlined split button label.\n *\n * @cssprop --tonal-split-button-container-color: Color of the tonal split button container.\n * @cssprop --tonal-split-button-label-text-color: Text color of the tonal split button label.\n *\n * @fires {MouseEvent} click - Dispatched when the primary action button is clicked.\n * @fires {CustomEvent} toggle-menu - Dispatched when the dropdown menu is opened or closed.\n *\n * @example\n * ```html\n * <wc-split-button>\n *   Save\n *   <wc-menu-item slot=\"menu\">Save as draft</wc-menu-item>\n *   <wc-menu-item slot=\"menu\">Save and publish</wc-menu-item>\n * </wc-split-button>\n * ```\n * @tags controls\n */\n@IndividualComponent\nexport class SplitButton extends LitElement {\n  static override styles = [styles, colorStyles, sizeStyles];\n\n  /**\n   * Button size.\n   * Possible values are `\"xs\"`, `\"sm\"`, `\"md\"`, `\"lg\"`, `\"xl\"`. Defaults to `\"sm\"`.\n   */\n  @property({ reflect: true }) size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'sm';\n\n  /**\n   * The visual style of the split button.\n   *\n   * Possible variant values:\n   * `\"filled\"` is a filled button.\n   * `\"outlined\"` is an outlined button.\n   * `\"tonal\"` is a light color button.\n   */\n  @property({ reflect: true }) variant: 'filled' | 'tonal' | 'outlined' =\n    'filled';\n\n  /**\n   * Defines the primary color of the split button.\n   */\n  @property({ reflect: true }) color:\n    | 'primary'\n    | 'secondary'\n    | 'tertiary'\n    | 'success'\n    | 'danger'\n    | 'warning'\n    | 'surface'\n    | 'on-surface' = 'primary';\n\n  /**\n   * Whether the split button is disabled.\n   */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  @state() private _menuOpen = false;\n\n  @query('.dropdown-trigger') private readonly _dropdownButton!: HTMLElement;\n\n  @query('wc-menu') private readonly _menu!: HTMLElement & {\n    open: boolean;\n    anchorElement: HTMLElement | null;\n    show: () => void;\n    close: () => void;\n  };\n\n  private _menuId = `split-menu-${Math.random().toString(36).slice(2, 9)}`;\n\n  override focus() {\n    const btn =\n      this.shadowRoot?.querySelector<HTMLElement>('.action-button');\n    btn?.focus();\n  }\n\n  private _onActionClick(event: MouseEvent) {\n    if (this.disabled) {\n      event.stopImmediatePropagation();\n      event.preventDefault();\n      return;\n    }\n\n    // Close menu if open\n    if (this._menuOpen) {\n      this._menu?.close();\n    }\n  }\n\n  private _onDropdownClick(event: MouseEvent) {\n    event.stopPropagation();\n    if (this.disabled) return;\n\n    if (this._menuOpen) {\n      this._menu?.close();\n    } else {\n      this._menu.anchorElement = this;\n      this._menu?.show();\n    }\n  }\n\n  private _onMenuOpened = () => {\n    this._menuOpen = true;\n    this.dispatchEvent(\n      new CustomEvent('toggle-menu', {\n        detail: { open: true },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  };\n\n  private _onMenuClosed = () => {\n    this._menuOpen = false;\n    this.dispatchEvent(\n      new CustomEvent('toggle-menu', {\n        detail: { open: false },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  };\n\n  private _onKeyDown = (event: KeyboardEvent) => {\n    if (this.disabled) return;\n\n    if (\n      event.key === 'ArrowDown' &&\n      event.target === this._dropdownButton\n    ) {\n      event.preventDefault();\n      if (!this._menuOpen) {\n        this._menu.anchorElement = this;\n        this._menu?.show();\n      }\n      // Focus the menu so keyboard nav works\n      requestAnimationFrame(() => this._menu?.focus());\n    }\n\n    if (event.key === 'Escape' && this._menuOpen) {\n      this._menu?.close();\n      this._dropdownButton?.focus();\n    }\n  };\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('keydown', this._onKeyDown);\n  }\n\n  override disconnectedCallback() {\n    this.removeEventListener('keydown', this._onKeyDown);\n    super.disconnectedCallback();\n  }\n\n  override render() {\n    const actionClasses = {\n      'action-button': true,\n      disabled: this.disabled,\n    };\n\n    const dropdownClasses = {\n      'dropdown-trigger': true,\n      active: this._menuOpen,\n      disabled: this.disabled,\n    };\n\n    const containerClasses = {\n      'split-button': true,\n      [`variant-${this.variant}`]: true,\n      disabled: this.disabled,\n    };\n\n    return html`\n      <div class=${classMap(containerClasses)}>\n        <wc-button\n          class=${classMap(actionClasses)}\n          size=${this.size}\n          variant=${this.variant}\n          ?disabled=${this.disabled}\n          @click=${this._onActionClick}\n        >\n          <slot></slot>\n        </wc-button>\n\n        <wc-icon-button\n          class=${classMap(dropdownClasses)}\n          size=${this.size}\n          variant=${this.variant}\n          ?disabled=${this.disabled}\n          .configAria=${{\n            'aria-haspopup': 'menu',\n            'aria-expanded': String(this._menuOpen),\n            'aria-controls': this._menuId,\n            'aria-label': 'Open split button menu',\n          }}\n          @click=${this._onDropdownClick}\n        >\n          <wc-icon class=\"dropdown-icon\" name=\"arrow_drop_down\" aria-hidden=\"true\"></wc-icon>\n        </wc-icon-button>\n      </div>\n\n      <wc-menu\n        id=${this._menuId}\n        placement=\"bottom-end\"\n        @opened=${this._onMenuOpened}\n        @closed=${this._onMenuClosed}\n      >\n        <slot name=\"menu\"></slot>\n      </wc-menu>\n    `;\n  }\n}\n"],"names":["LitElement","html","classMap","styles","colorStyles","sizeStyles","property","state","query"],"mappings":"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"}
+{"version":3,"file":"split-button.js","sources":["../../src/split-button/split-button.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './split-button.scss';\nimport colorStyles from './split-button-colors.scss';\nimport sizeStyles from './split-button-sizes.scss';\n\n/**\n * @label Split Button\n * @tag wc-split-button\n * @rawTag split-button\n *\n * @summary A split button lets users perform a default action or choose from a set of related actions via a dropdown menu.\n * @overview\n * <p>A split button combines a primary action button with a dropdown arrow that opens a menu. Following M3 Material Design, the split button provides a default action alongside a set of secondary options, reducing clutter while keeping alternative actions accessible.</p>\n *\n * @cssprop --split-button-container-shape: Defines the border radius of the split button container shape.\n *\n * @cssprop --filled-split-button-container-color: Color of the filled split button container.\n * @cssprop --filled-split-button-label-text-color: Text color of the filled split button label.\n *\n * @cssprop --outlined-split-button-container-color: Color of the outlined split button container.\n * @cssprop --outlined-split-button-label-text-color: Text color of the outlined split button label.\n *\n * @cssprop --tonal-split-button-container-color: Color of the tonal split button container.\n * @cssprop --tonal-split-button-label-text-color: Text color of the tonal split button label.\n *\n * @fires {MouseEvent} click - Dispatched when the primary action button is clicked.\n * @fires {CustomEvent} toggle-menu - Dispatched when the dropdown menu is opened or closed.\n *\n * @example\n * ```html\n * <wc-split-button>\n *   Save\n *   <wc-menu-item slot=\"menu\">Save as draft</wc-menu-item>\n *   <wc-menu-item slot=\"menu\">Save and publish</wc-menu-item>\n * </wc-split-button>\n * ```\n * @tags controls\n */\n@IndividualComponent\nexport class SplitButton extends LitElement {\n  static override styles = [styles, colorStyles, sizeStyles];\n\n  /**\n   * Button size.\n   * Possible values are `\"xs\"`, `\"sm\"`, `\"md\"`, `\"lg\"`, `\"xl\"`. Defaults to `\"sm\"`.\n   */\n  @property({ reflect: true }) size: 'xs' | 'sm' | 'md' | 'lg' | 'xl' = 'sm';\n\n  /**\n   * The visual style of the split button.\n   *\n   * Possible variant values:\n   * `\"filled\"` is a filled button.\n   * `\"outlined\"` is an outlined button.\n   * `\"tonal\"` is a light color button.\n   */\n  @property({ reflect: true }) variant: 'filled' | 'tonal' | 'outlined' =\n    'filled';\n\n  /**\n   * Defines the primary color of the split button.\n   */\n  @property({ reflect: true }) color:\n    | 'primary'\n    | 'secondary'\n    | 'tertiary'\n    | 'success'\n    | 'danger'\n    | 'warning'\n    | 'surface'\n    | 'on-surface' = 'primary';\n\n  /**\n   * Whether the split button is disabled.\n   */\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  @state() private _menuOpen = false;\n\n  @query('.dropdown-trigger') private readonly _dropdownButton!: HTMLElement;\n\n  @query('wc-menu') private readonly _menu!: HTMLElement & {\n    open: boolean;\n    anchorElement: HTMLElement | null;\n    show: () => void;\n    close: () => void;\n  };\n\n  private _menuId = `split-menu-${Math.random().toString(36).slice(2, 9)}`;\n\n  override focus() {\n    const btn =\n      this.shadowRoot?.querySelector<HTMLElement>('.action-button');\n    btn?.focus();\n  }\n\n  private _onActionClick(event: MouseEvent) {\n    if (this.disabled) {\n      event.stopImmediatePropagation();\n      event.preventDefault();\n      return;\n    }\n\n    // Close menu if open\n    if (this._menuOpen) {\n      this._menu?.close();\n    }\n  }\n\n  private _onDropdownClick(event: MouseEvent) {\n    event.stopPropagation();\n    if (this.disabled) return;\n\n    if (this._menuOpen) {\n      this._menu?.close();\n    } else {\n      this._menu.anchorElement = this;\n      this._menu?.show();\n    }\n  }\n\n  private _onMenuOpened = () => {\n    this._menuOpen = true;\n    this.dispatchEvent(\n      new CustomEvent('toggle-menu', {\n        detail: { open: true },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  };\n\n  private _onMenuClosed = () => {\n    this._menuOpen = false;\n    this.dispatchEvent(\n      new CustomEvent('toggle-menu', {\n        detail: { open: false },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  };\n\n  private _onKeyDown = (event: KeyboardEvent) => {\n    if (this.disabled) return;\n\n    if (\n      event.key === 'ArrowDown' &&\n      event.target === this._dropdownButton\n    ) {\n      event.preventDefault();\n      if (!this._menuOpen) {\n        this._menu.anchorElement = this;\n        this._menu?.show();\n      }\n      // Focus the menu so keyboard nav works\n      requestAnimationFrame(() => this._menu?.focus());\n    }\n\n    if (event.key === 'Escape' && this._menuOpen) {\n      this._menu?.close();\n      this._dropdownButton?.focus();\n    }\n  };\n\n  override connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('keydown', this._onKeyDown);\n  }\n\n  override disconnectedCallback() {\n    this.removeEventListener('keydown', this._onKeyDown);\n    super.disconnectedCallback();\n  }\n\n  override render() {\n    const actionClasses = {\n      'action-button': true,\n      disabled: this.disabled,\n    };\n\n    const dropdownClasses = {\n      'dropdown-trigger': true,\n      active: this._menuOpen,\n      disabled: this.disabled,\n    };\n\n    const containerClasses = {\n      'split-button': true,\n      [`variant-${this.variant}`]: true,\n      disabled: this.disabled,\n    };\n\n    return html`\n      <div class=${classMap(containerClasses)}>\n        <wc-button\n          class=${classMap(actionClasses)}\n          size=${this.size}\n          variant=${this.variant}\n          ?disabled=${this.disabled}\n          @click=${this._onActionClick}\n        >\n          <slot></slot>\n        </wc-button>\n\n        <wc-icon-button\n          class=${classMap(dropdownClasses)}\n          size=${this.size}\n          variant=${this.variant}\n          ?disabled=${this.disabled}\n          .configAria=${{\n            'aria-haspopup': 'menu',\n            'aria-expanded': String(this._menuOpen),\n            'aria-controls': this._menuId,\n            'aria-label': 'Open split button menu',\n          }}\n          @click=${this._onDropdownClick}\n        >\n          <wc-icon class=\"dropdown-icon\" name=\"arrow_drop_down\" aria-hidden=\"true\"></wc-icon>\n        </wc-icon-button>\n      </div>\n\n      <wc-menu\n        id=${this._menuId}\n        placement=\"bottom-end\"\n        @opened=${this._onMenuOpened}\n        @closed=${this._onMenuClosed}\n      >\n        <slot name=\"menu\"></slot>\n      </wc-menu>\n    `;\n  }\n}\n"],"names":["LitElement","html","classMap","styles","colorStyles","sizeStyles","property","state","query"],"mappings":"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"}

package/dist/src/accordion/accordion-item.d.ts

@@ -15,7 +15,7 @@ import { LitElement } from 'lit';
  * @part description - The description text container.
  * @part content - The expandable content region wrapper.
  *
- * @fires {CustomEvent<{ open: boolean }>} accordion-item:toggle - Fired when the panel is expanded or collapsed.
+ * @fires {CustomEvent<{ open: boolean }>} accordion-item-toggle - Fired when the panel is expanded or collapsed.
  *
  * @example
  * ```html

package/dist/src/accordion/accordion.d.ts

@@ -28,13 +28,13 @@ export declare class Accordion extends LitElement {
      * Whether multiple panels can be expanded simultaneously.
      * When `false` (default), expanding one panel collapses all others.
      */
-    multi: boolean;
+    multiple: boolean;
     /**
-     * Display mode for the accordion.
+     * Variant for the accordion.
      * `'default'` renders panels with a subtle background on expand and dividers between items.
      * `'flat'` renders panels without borders or background changes — suitable for use inside cards.
      */
-    displayMode: 'default' | 'flat';
+    variant: 'default' | 'flat';
     items: Array<AccordionItem>;
     connectedCallback(): void;
     disconnectedCallback(): void;

package/dist/src/button/button/button.d.ts

@@ -48,8 +48,8 @@ export declare class Button extends Button_base {
     /** @nocollapse */ static shadowRootOptions: ShadowRootInit;
     static styles: import("lit").CSSResultGroup[];
     /**
-     * Icon alignment.
-     * Possible values are `"start"`, `"end"`. Defaults to `"end"`.
+     * When `true` (default), the icon is placed after the label (trailing).
+     * When `false`, the icon is placed before the label (leading).
      */
     trailingIcon: boolean;
     /**

package/dist/sub-menu.js

@@ -15,6 +15,7 @@ import './floating-controller-CnUZnOhK.js';
 
 var css_248z = i`* {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {

package/dist/sub-menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"sub-menu.js","sources":["../../src/menu/sub-menu/sub-menu.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, queryAssignedElements } from 'lit/decorators.js';\nimport styles from './sub-menu.scss';\nimport { MenuItem } from '../menu-item/menu-item.js';\nimport { Menu } from '../menu/menu.js';\nimport IndividualComponent from '@/IndividualComponent.js';\n\nlet subMenuIdCounter = 0;\n\n/**\n * @label Sub Menu\n * @tag wc-sub-menu\n * @rawTag sub-menu\n * @summary Connects a menu item to a nested menu.\n */\n@IndividualComponent\nexport class SubMenu extends LitElement {\n  static styles = [styles];\n\n  @property({ type: Number, attribute: 'hover-open-delay' })\n  hoverOpenDelay = 120;\n\n  @property({ type: Number, attribute: 'hover-close-delay' })\n  hoverCloseDelay = 180;\n\n  @property({ type: String, attribute: 'anchor-corner' })\n  anchorCorner = 'start-end';\n\n  @property({ type: String, attribute: 'menu-corner' })\n  menuCorner = 'start-start';\n\n  @queryAssignedElements({ slot: 'item' })\n  private readonly _items!: Element[];\n\n  @queryAssignedElements({ slot: 'menu' })\n  private readonly _menus!: Element[];\n\n  private _openTimeout?: number;\n\n  private _closeTimeout?: number;\n\n  private _resolveAnchorElement(item: MenuItem) {\n    //@ts-ignore\n    return item.itemElement?.itemElement ?? item.itemElement ?? item;\n  }\n\n  private readonly _onChildMenuOpened = () => {\n    const { item } = this;\n    if (!item) {\n      return;\n    }\n\n    item.submenuOpen = true;\n    item.setAttribute('aria-expanded', 'true');\n  };\n\n  private readonly _onChildMenuClosed = () => {\n    const { item } = this;\n    if (!item) {\n      return;\n    }\n\n    item.submenuOpen = false;\n    item.setAttribute('aria-expanded', 'false');\n  };\n\n  get item(): MenuItem | null {\n    const [candidate] = this._items ?? [];\n    return candidate instanceof MenuItem ? candidate : null;\n  }\n\n  get menu(): Menu | null {\n    const [candidate] = this._menus ?? [];\n    return candidate instanceof Menu ? candidate : null;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('mouseenter', this._onMouseEnter);\n    this.addEventListener('mouseleave', this._onMouseLeave);\n  }\n\n  disconnectedCallback() {\n    const { menu } = this;\n    menu?.removeEventListener('opened', this._onChildMenuOpened);\n    menu?.removeEventListener('closed', this._onChildMenuClosed);\n    this.removeEventListener('mouseenter', this._onMouseEnter);\n    this.removeEventListener('mouseleave', this._onMouseLeave);\n    window.clearTimeout(this._openTimeout);\n    window.clearTimeout(this._closeTimeout);\n    super.disconnectedCallback();\n  }\n\n  async show() {\n    const { item, menu } = this;\n    if (!item || !menu) {\n      return;\n    }\n\n    menu.anchorElement = this._resolveAnchorElement(item);\n    menu.isSubmenu = true;\n    menu.show();\n\n    item.hasSubmenu = true;\n    item.submenuOpen = true;\n    item.setAttribute('aria-expanded', 'true');\n  }\n\n  async close() {\n    const { item, menu } = this;\n    if (!item || !menu) {\n      return;\n    }\n\n    menu.close({ kind: 'programmatic' });\n    item.submenuOpen = false;\n    item.setAttribute('aria-expanded', 'false');\n  }\n\n  render() {\n    return html`\n      <slot\n        name=\"item\"\n        @slotchange=${this._onSlotChange}\n        @click=${this._onItemClick}\n        @keydown=${this._onItemKeyDown}\n      ></slot>\n      <slot\n        name=\"menu\"\n        @slotchange=${this._onSlotChange}\n        @close-menu=${this._onCloseMenu}\n        @keydown=${this._onMenuKeyDown}\n      ></slot>\n    `;\n  }\n\n  private _onSlotChange = () => {\n    const { item, menu } = this;\n    if (!item || !menu) {\n      return;\n    }\n\n    if (!menu.id) {\n      subMenuIdCounter += 1;\n      menu.id = `wc-sub-menu-${subMenuIdCounter}`;\n    }\n\n    item.keepOpen = true;\n    item.hasSubmenu = true;\n    item.submenuOpen = menu.open;\n    item.setAttribute('aria-haspopup', 'menu');\n    item.setAttribute('aria-expanded', String(menu.open));\n    item.setAttribute('aria-controls', menu.id);\n\n    menu.removeEventListener('opened', this._onChildMenuOpened);\n    menu.removeEventListener('closed', this._onChildMenuClosed);\n    menu.addEventListener('opened', this._onChildMenuOpened);\n    menu.addEventListener('closed', this._onChildMenuClosed);\n\n    menu.isSubmenu = true;\n    menu.anchorElement = this._resolveAnchorElement(item);\n    menu.placement =\n      getComputedStyle(this).direction === 'rtl' ? 'left-start' : 'right-start';\n    menu.offset = 4;\n  };\n\n  private _onItemClick = () => {\n    if (this.menu?.open) {\n      this.close();\n      return;\n    }\n\n    this.show();\n  };\n\n  private _onItemKeyDown = async (event: KeyboardEvent) => {\n    const isRtl = getComputedStyle(this).direction === 'rtl';\n    const arrowEnter = isRtl ? 'ArrowLeft' : 'ArrowRight';\n\n    const shouldOpen =\n      event.key === arrowEnter || event.key === 'Enter' || event.key === ' ';\n\n    if (!shouldOpen) {\n      return;\n    }\n\n    event.preventDefault();\n    if (event.key === arrowEnter) {\n      event.stopPropagation();\n    }\n\n    await this.show();\n    const firstItem = this.menu?.items.find(menuItem => !menuItem.disabled);\n    if (firstItem) {\n      firstItem.tabIndex = 0;\n      firstItem.focus();\n    }\n  };\n\n  private _onMenuKeyDown = async (event: KeyboardEvent) => {\n    const isRtl = getComputedStyle(this).direction === 'rtl';\n    const arrowExit = isRtl ? 'ArrowRight' : 'ArrowLeft';\n\n    if (event.key !== 'Escape' && event.key !== arrowExit) {\n      return;\n    }\n\n    event.preventDefault();\n    event.stopPropagation();\n\n    await this.close();\n\n    const { item } = this;\n    if (item) {\n      item.tabIndex = 0;\n      item.focus();\n    }\n  };\n\n  private _onCloseMenu = async (\n    event: CustomEvent<{ reason?: { kind?: string; key?: string } }>,\n  ) => {\n    const { reason } = event.detail ?? {};\n    const { key } = reason ?? {};\n    if (reason?.kind === 'keydown' && key === 'Escape') {\n      event.stopPropagation();\n      await this.close();\n      this.item?.focus();\n    }\n  };\n\n  private _onMouseEnter = () => {\n    window.clearTimeout(this._closeTimeout);\n    this._openTimeout = window.setTimeout(() => {\n      this.show();\n    }, this.hoverOpenDelay);\n  };\n\n  private _onMouseLeave = (event: MouseEvent) => {\n    const { relatedTarget: related } = event;\n    if (related instanceof Node && this.contains(related)) {\n      return;\n    }\n\n    window.clearTimeout(this._openTimeout);\n    this._closeTimeout = window.setTimeout(() => {\n      this.close();\n    }, this.hoverCloseDelay);\n  };\n}\n"],"names":["LitElement","html","styles","property","queryAssignedElements"],"mappings":"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"}
+{"version":3,"file":"sub-menu.js","sources":["../../src/menu/sub-menu/sub-menu.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, queryAssignedElements } from 'lit/decorators.js';\nimport styles from './sub-menu.scss';\nimport { MenuItem } from '../menu-item/menu-item.js';\nimport { Menu } from '../menu/menu.js';\nimport IndividualComponent from '@/IndividualComponent.js';\n\nlet subMenuIdCounter = 0;\n\n/**\n * @label Sub Menu\n * @tag wc-sub-menu\n * @rawTag sub-menu\n * @summary Connects a menu item to a nested menu.\n */\n@IndividualComponent\nexport class SubMenu extends LitElement {\n  static styles = [styles];\n\n  @property({ type: Number, attribute: 'hover-open-delay' })\n  hoverOpenDelay = 120;\n\n  @property({ type: Number, attribute: 'hover-close-delay' })\n  hoverCloseDelay = 180;\n\n  @property({ type: String, attribute: 'anchor-corner' })\n  anchorCorner = 'start-end';\n\n  @property({ type: String, attribute: 'menu-corner' })\n  menuCorner = 'start-start';\n\n  @queryAssignedElements({ slot: 'item' })\n  private readonly _items!: Element[];\n\n  @queryAssignedElements({ slot: 'menu' })\n  private readonly _menus!: Element[];\n\n  private _openTimeout?: number;\n\n  private _closeTimeout?: number;\n\n  private _resolveAnchorElement(item: MenuItem) {\n    //@ts-ignore\n    return item.itemElement?.itemElement ?? item.itemElement ?? item;\n  }\n\n  private readonly _onChildMenuOpened = () => {\n    const { item } = this;\n    if (!item) {\n      return;\n    }\n\n    item.submenuOpen = true;\n    item.setAttribute('aria-expanded', 'true');\n  };\n\n  private readonly _onChildMenuClosed = () => {\n    const { item } = this;\n    if (!item) {\n      return;\n    }\n\n    item.submenuOpen = false;\n    item.setAttribute('aria-expanded', 'false');\n  };\n\n  get item(): MenuItem | null {\n    const [candidate] = this._items ?? [];\n    return candidate instanceof MenuItem ? candidate : null;\n  }\n\n  get menu(): Menu | null {\n    const [candidate] = this._menus ?? [];\n    return candidate instanceof Menu ? candidate : null;\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('mouseenter', this._onMouseEnter);\n    this.addEventListener('mouseleave', this._onMouseLeave);\n  }\n\n  disconnectedCallback() {\n    const { menu } = this;\n    menu?.removeEventListener('opened', this._onChildMenuOpened);\n    menu?.removeEventListener('closed', this._onChildMenuClosed);\n    this.removeEventListener('mouseenter', this._onMouseEnter);\n    this.removeEventListener('mouseleave', this._onMouseLeave);\n    window.clearTimeout(this._openTimeout);\n    window.clearTimeout(this._closeTimeout);\n    super.disconnectedCallback();\n  }\n\n  async show() {\n    const { item, menu } = this;\n    if (!item || !menu) {\n      return;\n    }\n\n    menu.anchorElement = this._resolveAnchorElement(item);\n    menu.isSubmenu = true;\n    menu.show();\n\n    item.hasSubmenu = true;\n    item.submenuOpen = true;\n    item.setAttribute('aria-expanded', 'true');\n  }\n\n  async close() {\n    const { item, menu } = this;\n    if (!item || !menu) {\n      return;\n    }\n\n    menu.close({ kind: 'programmatic' });\n    item.submenuOpen = false;\n    item.setAttribute('aria-expanded', 'false');\n  }\n\n  render() {\n    return html`\n      <slot\n        name=\"item\"\n        @slotchange=${this._onSlotChange}\n        @click=${this._onItemClick}\n        @keydown=${this._onItemKeyDown}\n      ></slot>\n      <slot\n        name=\"menu\"\n        @slotchange=${this._onSlotChange}\n        @close-menu=${this._onCloseMenu}\n        @keydown=${this._onMenuKeyDown}\n      ></slot>\n    `;\n  }\n\n  private _onSlotChange = () => {\n    const { item, menu } = this;\n    if (!item || !menu) {\n      return;\n    }\n\n    if (!menu.id) {\n      subMenuIdCounter += 1;\n      menu.id = `wc-sub-menu-${subMenuIdCounter}`;\n    }\n\n    item.keepOpen = true;\n    item.hasSubmenu = true;\n    item.submenuOpen = menu.open;\n    item.setAttribute('aria-haspopup', 'menu');\n    item.setAttribute('aria-expanded', String(menu.open));\n    item.setAttribute('aria-controls', menu.id);\n\n    menu.removeEventListener('opened', this._onChildMenuOpened);\n    menu.removeEventListener('closed', this._onChildMenuClosed);\n    menu.addEventListener('opened', this._onChildMenuOpened);\n    menu.addEventListener('closed', this._onChildMenuClosed);\n\n    menu.isSubmenu = true;\n    menu.anchorElement = this._resolveAnchorElement(item);\n    menu.placement =\n      getComputedStyle(this).direction === 'rtl' ? 'left-start' : 'right-start';\n    menu.offset = 4;\n  };\n\n  private _onItemClick = () => {\n    if (this.menu?.open) {\n      this.close();\n      return;\n    }\n\n    this.show();\n  };\n\n  private _onItemKeyDown = async (event: KeyboardEvent) => {\n    const isRtl = getComputedStyle(this).direction === 'rtl';\n    const arrowEnter = isRtl ? 'ArrowLeft' : 'ArrowRight';\n\n    const shouldOpen =\n      event.key === arrowEnter || event.key === 'Enter' || event.key === ' ';\n\n    if (!shouldOpen) {\n      return;\n    }\n\n    event.preventDefault();\n    if (event.key === arrowEnter) {\n      event.stopPropagation();\n    }\n\n    await this.show();\n    const firstItem = this.menu?.items.find(menuItem => !menuItem.disabled);\n    if (firstItem) {\n      firstItem.tabIndex = 0;\n      firstItem.focus();\n    }\n  };\n\n  private _onMenuKeyDown = async (event: KeyboardEvent) => {\n    const isRtl = getComputedStyle(this).direction === 'rtl';\n    const arrowExit = isRtl ? 'ArrowRight' : 'ArrowLeft';\n\n    if (event.key !== 'Escape' && event.key !== arrowExit) {\n      return;\n    }\n\n    event.preventDefault();\n    event.stopPropagation();\n\n    await this.close();\n\n    const { item } = this;\n    if (item) {\n      item.tabIndex = 0;\n      item.focus();\n    }\n  };\n\n  private _onCloseMenu = async (\n    event: CustomEvent<{ reason?: { kind?: string; key?: string } }>,\n  ) => {\n    const { reason } = event.detail ?? {};\n    const { key } = reason ?? {};\n    if (reason?.kind === 'keydown' && key === 'Escape') {\n      event.stopPropagation();\n      await this.close();\n      this.item?.focus();\n    }\n  };\n\n  private _onMouseEnter = () => {\n    window.clearTimeout(this._closeTimeout);\n    this._openTimeout = window.setTimeout(() => {\n      this.show();\n    }, this.hoverOpenDelay);\n  };\n\n  private _onMouseLeave = (event: MouseEvent) => {\n    const { relatedTarget: related } = event;\n    if (related instanceof Node && this.contains(related)) {\n      return;\n    }\n\n    window.clearTimeout(this._openTimeout);\n    this._closeTimeout = window.setTimeout(() => {\n      this.close();\n    }, this.hoverCloseDelay);\n  };\n}\n"],"names":["LitElement","html","styles","property","queryAssignedElements"],"mappings":"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"}

package/dist/svg.js

@@ -7,6 +7,7 @@ import './unsafe-html-Ct0N2_UU.js';
 
 var css_248z = i`* {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {

package/dist/svg.js.map

@@ -1 +1 @@
-{"version":3,"file":"svg.js","sources":["../../src/svg/svg.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\n\nimport { sanitizeSvg } from '@/__internal/utils/sanitize-svg.js';\nimport { fetchSVG } from '../icon/datasource.js';\n\nimport styles from './svg.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label SVG\n * @tag wc-svg\n * @rawTag svg\n * @summary An SVG component with lazy loading and optional preview support.\n * @overview Renders an inline SVG fetched from a URL, with lazy loading via IntersectionObserver and an optional click-to-preview lightbox.\n *\n * @cssprop --svg-color - Controls the fill color of the SVG.\n * @cssprop [--svg-size=1rem] - Controls the size of the SVG. Defaults to \"1rem\"\n *\n * @example\n * ```html\n * <wc-svg src=\"/icons/my-icon.svg\" image-title=\"My icon\"></wc-svg>\n * ```\n */\n@IndividualComponent\nexport class Svg extends LitElement {\n  static styles = [styles];\n\n  /** URL of the SVG asset to fetch and render inline. */\n  @property({ type: String, reflect: true }) src = '';\n\n  /** Accessible title / alt text for the SVG. */\n  @property({ attribute: 'image-title' }) imageTitle = '';\n\n  /** Enable click-to-preview lightbox. */\n  @property({ type: Boolean, reflect: true }) preview = false;\n\n  /** True once the element has entered the viewport and the SVG fetch has been initiated. */\n  @state() private _loaded = false;\n\n  /** True when the lightbox preview overlay is visible. */\n  @state() private _previewOpen = false;\n\n  /** Sanitized inline SVG markup ready for rendering. */\n  @state() private _svgContent: string = '';\n\n  // ── Private fields ────────────────────────────────────────────────────────\n\n  /** Monotonically incrementing token used to discard stale fetch results. */\n  private _fetchId = 0;\n\n  /** IntersectionObserver that triggers the SVG fetch when the element enters the viewport. */\n  private _intersectionObserver: IntersectionObserver | null = null;\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this._intersectionObserver?.disconnect();\n  }\n\n  firstUpdated() {\n    this._setupIntersectionObserver();\n  }\n\n  updated(changedProperties: Map<string, unknown>) {\n    if (changedProperties.has('src')) {\n      // Reset lazy-load state so the new src is fetched when visible\n      this._loaded = false;\n      this._svgContent = '';\n      this._setupIntersectionObserver();\n    }\n  }\n\n  private _setupIntersectionObserver() {\n    this._intersectionObserver?.disconnect();\n\n    const wrapper = this.shadowRoot?.querySelector('.svg-wrapper');\n    if (!wrapper) return;\n\n    this._intersectionObserver = new IntersectionObserver(\n      entries => {\n        if (entries[0].isIntersecting) {\n          this._loaded = true;\n          this._intersectionObserver?.disconnect();\n          this._fetchSvg();\n        }\n      },\n      { rootMargin: '200px' },\n    );\n\n    this._intersectionObserver.observe(wrapper);\n  }\n\n  private async _fetchSvg() {\n    if (!this.src) return;\n\n    this._fetchId += 1;\n    const currentId = this._fetchId;\n\n    try {\n      const raw = await fetchSVG(this.src);\n      if (currentId !== this._fetchId) return;\n\n      this._svgContent = raw ? sanitizeSvg(raw) : '';\n    } catch {\n      if (currentId === this._fetchId) {\n        this._svgContent = '';\n      }\n    }\n  }\n\n  private _handleClick() {\n    if (this.preview) {\n      this._previewOpen = true;\n      // Move focus into the dialog after render\n      this.updateComplete.then(() => {\n        const closeBtn =\n          this.shadowRoot?.querySelector<HTMLElement>('.preview-close');\n        closeBtn?.focus();\n      });\n    }\n  }\n\n  private _closePreview(e: Event) {\n    e.stopPropagation();\n    const wasOpen = this._previewOpen;\n    this._previewOpen = false;\n    if (wasOpen) {\n      // Return focus to the trigger\n      const trigger =\n        this.shadowRoot?.querySelector<HTMLElement>('.svg-content');\n      trigger?.focus();\n    }\n  }\n\n  render() {\n    return html`\n      <div class=\"svg-wrapper\">\n        ${this._loaded && this._svgContent\n          ? html`<div\n              class=\"svg-content ${this.preview ? 'clickable' : ''}\"\n              role=${this.imageTitle ? 'img' : 'presentation'}\n              aria-label=${this.imageTitle || ''}\n              @click=${this._handleClick}\n            >\n              ${unsafeSVG(this._svgContent)}\n            </div>`\n          : html`<span class=\"placeholder\" aria-hidden=\"true\"></span>`}\n      </div>\n\n      <div\n        class=\"preview-overlay ${this._previewOpen ? 'open' : ''}\"\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-label=${this.imageTitle\n          ? `Preview: ${this.imageTitle}`\n          : 'SVG preview'}\n        @click=${this._closePreview}\n        @keydown=${(e: KeyboardEvent) =>\n          e.key === 'Escape' && this._closePreview(e)}\n      >\n        <button\n          class=\"preview-close\"\n          aria-label=\"Close preview\"\n          @click=${this._closePreview}\n        >\n          &#x2715;\n        </button>\n        <div\n          class=\"preview-content\"\n          @click=${(e: Event) => e.stopPropagation()}\n        >\n          ${unsafeSVG(this._svgContent)}\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","unsafeSVG","styles","property","state"],"mappings":"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"}
+{"version":3,"file":"svg.js","sources":["../../src/svg/svg.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js';\n\nimport { sanitizeSvg } from '@/__internal/utils/sanitize-svg.js';\nimport { fetchSVG } from '../icon/datasource.js';\n\nimport styles from './svg.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label SVG\n * @tag wc-svg\n * @rawTag svg\n * @summary An SVG component with lazy loading and optional preview support.\n * @overview Renders an inline SVG fetched from a URL, with lazy loading via IntersectionObserver and an optional click-to-preview lightbox.\n *\n * @cssprop --svg-color - Controls the fill color of the SVG.\n * @cssprop [--svg-size=1rem] - Controls the size of the SVG. Defaults to \"1rem\"\n *\n * @example\n * ```html\n * <wc-svg src=\"/icons/my-icon.svg\" image-title=\"My icon\"></wc-svg>\n * ```\n */\n@IndividualComponent\nexport class Svg extends LitElement {\n  static styles = [styles];\n\n  /** URL of the SVG asset to fetch and render inline. */\n  @property({ type: String, reflect: true }) src = '';\n\n  /** Accessible title / alt text for the SVG. */\n  @property({ attribute: 'image-title' }) imageTitle = '';\n\n  /** Enable click-to-preview lightbox. */\n  @property({ type: Boolean, reflect: true }) preview = false;\n\n  /** True once the element has entered the viewport and the SVG fetch has been initiated. */\n  @state() private _loaded = false;\n\n  /** True when the lightbox preview overlay is visible. */\n  @state() private _previewOpen = false;\n\n  /** Sanitized inline SVG markup ready for rendering. */\n  @state() private _svgContent: string = '';\n\n  // ── Private fields ────────────────────────────────────────────────────────\n\n  /** Monotonically incrementing token used to discard stale fetch results. */\n  private _fetchId = 0;\n\n  /** IntersectionObserver that triggers the SVG fetch when the element enters the viewport. */\n  private _intersectionObserver: IntersectionObserver | null = null;\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this._intersectionObserver?.disconnect();\n  }\n\n  firstUpdated() {\n    this._setupIntersectionObserver();\n  }\n\n  updated(changedProperties: Map<string, unknown>) {\n    if (changedProperties.has('src')) {\n      // Reset lazy-load state so the new src is fetched when visible\n      this._loaded = false;\n      this._svgContent = '';\n      this._setupIntersectionObserver();\n    }\n  }\n\n  private _setupIntersectionObserver() {\n    this._intersectionObserver?.disconnect();\n\n    const wrapper = this.shadowRoot?.querySelector('.svg-wrapper');\n    if (!wrapper) return;\n\n    this._intersectionObserver = new IntersectionObserver(\n      entries => {\n        if (entries[0].isIntersecting) {\n          this._loaded = true;\n          this._intersectionObserver?.disconnect();\n          this._fetchSvg();\n        }\n      },\n      { rootMargin: '200px' },\n    );\n\n    this._intersectionObserver.observe(wrapper);\n  }\n\n  private async _fetchSvg() {\n    if (!this.src) return;\n\n    this._fetchId += 1;\n    const currentId = this._fetchId;\n\n    try {\n      const raw = await fetchSVG(this.src);\n      if (currentId !== this._fetchId) return;\n\n      this._svgContent = raw ? sanitizeSvg(raw) : '';\n    } catch {\n      if (currentId === this._fetchId) {\n        this._svgContent = '';\n      }\n    }\n  }\n\n  private _handleClick() {\n    if (this.preview) {\n      this._previewOpen = true;\n      // Move focus into the dialog after render\n      this.updateComplete.then(() => {\n        const closeBtn =\n          this.shadowRoot?.querySelector<HTMLElement>('.preview-close');\n        closeBtn?.focus();\n      });\n    }\n  }\n\n  private _closePreview(e: Event) {\n    e.stopPropagation();\n    const wasOpen = this._previewOpen;\n    this._previewOpen = false;\n    if (wasOpen) {\n      // Return focus to the trigger\n      const trigger =\n        this.shadowRoot?.querySelector<HTMLElement>('.svg-content');\n      trigger?.focus();\n    }\n  }\n\n  render() {\n    return html`\n      <div class=\"svg-wrapper\">\n        ${this._loaded && this._svgContent\n          ? html`<div\n              class=\"svg-content ${this.preview ? 'clickable' : ''}\"\n              role=${this.imageTitle ? 'img' : 'presentation'}\n              aria-label=${this.imageTitle || ''}\n              @click=${this._handleClick}\n            >\n              ${unsafeSVG(this._svgContent)}\n            </div>`\n          : html`<span class=\"placeholder\" aria-hidden=\"true\"></span>`}\n      </div>\n\n      <div\n        class=\"preview-overlay ${this._previewOpen ? 'open' : ''}\"\n        role=\"dialog\"\n        aria-modal=\"true\"\n        aria-label=${this.imageTitle\n          ? `Preview: ${this.imageTitle}`\n          : 'SVG preview'}\n        @click=${this._closePreview}\n        @keydown=${(e: KeyboardEvent) =>\n          e.key === 'Escape' && this._closePreview(e)}\n      >\n        <button\n          class=\"preview-close\"\n          aria-label=\"Close preview\"\n          @click=${this._closePreview}\n        >\n          &#x2715;\n        </button>\n        <div\n          class=\"preview-content\"\n          @click=${(e: Event) => e.stopPropagation()}\n        >\n          ${unsafeSVG(this._svgContent)}\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","unsafeSVG","styles","property","state"],"mappings":"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"}

package/dist/tab-group.js

@@ -16,6 +16,7 @@ import './spread-B5cgadZl.js';
 
 var css_248z = i`* {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {

package/dist/tab-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab-group.js","sources":["../../src/tabs/tab-group.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport styles from './tab-group.scss';\nimport { Tabs } from './tabs.js';\nimport { TabPanel } from './tab-panel.js';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Tab Group\n * @tag wc-tab-group\n * @rawTag tab-group\n *\n * @summary The tab group component is used to display multiple panels of content in a container.\n * @overview\n * <p>The tab group component allows users to switch between different views or content sections.</p>\n *\n * @example\n * ```html\n * <wc-tab-group>\n * \n *   <wc-tabs>\n *    <wc-tab selected >Tab 1</wc-tab>\n *    <wc-tab>Tab 2</wc-tab>\n *   </wc-tabs>\n * \n *   <wc-tab-panel>Panel 1</wc-tab-panel>\n *   <wc-tab-panel>Panel 2</wc-tab-panel>\n * </wc-tab-group>\n * ```\n * @tags navigation\n */\n@IndividualComponent\nexport class TabGroup extends LitElement {\n  static styles = [styles];\n\n  static Tabs = Tabs;\n\n  static TabPanel = TabPanel;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('tab-click', this.onTabClick);\n  }\n\n  disconnectedCallback() {\n    this.removeEventListener('tab-click', this.onTabClick);\n    super.disconnectedCallback();\n  }\n\n  firstUpdated() {\n    this.initializeTabs();\n  }\n\n  private onTabClick = (event: Event) => {\n    const custom = event as CustomEvent;\n    event.stopPropagation();\n    const targetValue = custom.detail?.target || custom.detail?.value;\n    if (targetValue) {\n      this.selectTab(targetValue);\n    } else if (typeof custom.detail?.index === 'number') {\n      this.selectTabByIndex(custom.detail.index);\n    }\n  };\n\n  selectTab(target: string) {\n    const tabs = this.getTabs();\n    for (const tab of tabs) {\n      (tab as any).active = false;\n      (tab as any).selected = false;\n      tab.classList.remove('previous-tab', 'next-tab');\n    }\n\n    let selectedIndex = -1;\n    tabs.forEach((tab: HTMLElement, index: number) => {\n      const t = tab.getAttribute('target') || tab.getAttribute('value');\n      if (t === target) {\n        selectedIndex = index;\n      }\n    });\n\n    if (selectedIndex >= 0) {\n      const selectedTab = tabs[selectedIndex];\n      (selectedTab as any).active = true;\n      (selectedTab as any).selected = true;\n      if (tabs[selectedIndex - 1]) {\n        tabs[selectedIndex - 1].classList.add('previous-tab');\n      }\n      if (tabs[selectedIndex + 1]) {\n        tabs[selectedIndex + 1].classList.add('next-tab');\n      }\n    }\n\n    const panels = this.getTabPanels();\n    for (const panel of panels) {\n      const panelValue = panel.getAttribute('value');\n      (panel as any).active = panelValue === target;\n    }\n  }\n\n  selectTabByIndex(index: number) {\n    const tabs = this.getTabs();\n    for (const tab of tabs) {\n      (tab as any).active = false;\n      (tab as any).selected = false;\n      tab.classList.remove('previous-tab', 'next-tab');\n    }\n\n    if (index >= 0 && index < tabs.length) {\n      (tabs[index] as any).active = true;\n      (tabs[index] as any).selected = true;\n      if (tabs[index - 1]) tabs[index - 1].classList.add('previous-tab');\n      if (tabs[index + 1]) tabs[index + 1].classList.add('next-tab');\n    }\n\n    const panels = this.getTabPanels();\n    for (let i = 0; i < panels.length; i += 1) {\n      const panel = panels[i];\n      (panel as any).active = i === index;\n    }\n  }\n\n  private getTabs(): HTMLElement[] {\n    return Array.from(this.querySelectorAll(':scope > wc-tabs wc-tab'));\n  }\n\n  private getTabPanels(): HTMLElement[] {\n    return Array.from(this.querySelectorAll(':scope > wc-tab-panel'));\n  }\n\n  private getTabList(): HTMLElement | null {\n    return this.querySelector(':scope > wc-tabs');\n  }\n\n  private tabsHaveTarget(): boolean {\n    return !!this.querySelector(':scope > wc-tabs wc-tab[target]');\n  }\n\n  private initializeTabs() {\n    const tabs = Array.from(this.getTabs());\n    if (!this.tabsHaveTarget()) {\n      // No target/value attributes — use index-based activation\n      const selectedIndex = tabs.findIndex(\n        tab =>\n          tab.hasAttribute('active') ||\n          (tab as any).active ||\n          tab.hasAttribute('selected') ||\n          (tab as any).selected,\n      );\n      this.selectTabByIndex(selectedIndex >= 0 ? selectedIndex : 0);\n    } else {\n      const selectedTab = tabs.find(\n        tab =>\n          tab.hasAttribute('active') ||\n          (tab as any).active ||\n          tab.hasAttribute('selected') ||\n          (tab as any).selected,\n      );\n      if (selectedTab) {\n        const selectedTarget = selectedTab.getAttribute('target');\n        if (selectedTarget) this.selectTab(selectedTarget);\n      } else if (tabs.length > 0) {\n        const firstTarget = tabs[0].getAttribute('target');\n        if (firstTarget) this.selectTab(firstTarget);\n      }\n    }\n  }\n\n  render() {\n    return html`<slot></slot>`;\n  }\n}\n"],"names":["LitElement","html","styles"],"mappings":"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"}
+{"version":3,"file":"tab-group.js","sources":["../../src/tabs/tab-group.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport styles from './tab-group.scss';\nimport { Tabs } from './tabs.js';\nimport { TabPanel } from './tab-panel.js';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Tab Group\n * @tag wc-tab-group\n * @rawTag tab-group\n *\n * @summary The tab group component is used to display multiple panels of content in a container.\n * @overview\n * <p>The tab group component allows users to switch between different views or content sections.</p>\n *\n * @example\n * ```html\n * <wc-tab-group>\n * \n *   <wc-tabs>\n *    <wc-tab selected >Tab 1</wc-tab>\n *    <wc-tab>Tab 2</wc-tab>\n *   </wc-tabs>\n * \n *   <wc-tab-panel>Panel 1</wc-tab-panel>\n *   <wc-tab-panel>Panel 2</wc-tab-panel>\n * </wc-tab-group>\n * ```\n * @tags navigation\n */\n@IndividualComponent\nexport class TabGroup extends LitElement {\n  static styles = [styles];\n\n  static Tabs = Tabs;\n\n  static TabPanel = TabPanel;\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.addEventListener('tab-click', this.onTabClick);\n  }\n\n  disconnectedCallback() {\n    this.removeEventListener('tab-click', this.onTabClick);\n    super.disconnectedCallback();\n  }\n\n  firstUpdated() {\n    this.initializeTabs();\n  }\n\n  private onTabClick = (event: Event) => {\n    const custom = event as CustomEvent;\n    event.stopPropagation();\n    const targetValue = custom.detail?.target || custom.detail?.value;\n    if (targetValue) {\n      this.selectTab(targetValue);\n    } else if (typeof custom.detail?.index === 'number') {\n      this.selectTabByIndex(custom.detail.index);\n    }\n  };\n\n  selectTab(target: string) {\n    const tabs = this.getTabs();\n    for (const tab of tabs) {\n      (tab as any).active = false;\n      (tab as any).selected = false;\n      tab.classList.remove('previous-tab', 'next-tab');\n    }\n\n    let selectedIndex = -1;\n    tabs.forEach((tab: HTMLElement, index: number) => {\n      const t = tab.getAttribute('target') || tab.getAttribute('value');\n      if (t === target) {\n        selectedIndex = index;\n      }\n    });\n\n    if (selectedIndex >= 0) {\n      const selectedTab = tabs[selectedIndex];\n      (selectedTab as any).active = true;\n      (selectedTab as any).selected = true;\n      if (tabs[selectedIndex - 1]) {\n        tabs[selectedIndex - 1].classList.add('previous-tab');\n      }\n      if (tabs[selectedIndex + 1]) {\n        tabs[selectedIndex + 1].classList.add('next-tab');\n      }\n    }\n\n    const panels = this.getTabPanels();\n    for (const panel of panels) {\n      const panelValue = panel.getAttribute('value');\n      (panel as any).active = panelValue === target;\n    }\n  }\n\n  selectTabByIndex(index: number) {\n    const tabs = this.getTabs();\n    for (const tab of tabs) {\n      (tab as any).active = false;\n      (tab as any).selected = false;\n      tab.classList.remove('previous-tab', 'next-tab');\n    }\n\n    if (index >= 0 && index < tabs.length) {\n      (tabs[index] as any).active = true;\n      (tabs[index] as any).selected = true;\n      if (tabs[index - 1]) tabs[index - 1].classList.add('previous-tab');\n      if (tabs[index + 1]) tabs[index + 1].classList.add('next-tab');\n    }\n\n    const panels = this.getTabPanels();\n    for (let i = 0; i < panels.length; i += 1) {\n      const panel = panels[i];\n      (panel as any).active = i === index;\n    }\n  }\n\n  private getTabs(): HTMLElement[] {\n    return Array.from(this.querySelectorAll(':scope > wc-tabs wc-tab'));\n  }\n\n  private getTabPanels(): HTMLElement[] {\n    return Array.from(this.querySelectorAll(':scope > wc-tab-panel'));\n  }\n\n  private getTabList(): HTMLElement | null {\n    return this.querySelector(':scope > wc-tabs');\n  }\n\n  private tabsHaveTarget(): boolean {\n    return !!this.querySelector(':scope > wc-tabs wc-tab[target]');\n  }\n\n  private initializeTabs() {\n    const tabs = Array.from(this.getTabs());\n    if (!this.tabsHaveTarget()) {\n      // No target/value attributes — use index-based activation\n      const selectedIndex = tabs.findIndex(\n        tab =>\n          tab.hasAttribute('active') ||\n          (tab as any).active ||\n          tab.hasAttribute('selected') ||\n          (tab as any).selected,\n      );\n      this.selectTabByIndex(selectedIndex >= 0 ? selectedIndex : 0);\n    } else {\n      const selectedTab = tabs.find(\n        tab =>\n          tab.hasAttribute('active') ||\n          (tab as any).active ||\n          tab.hasAttribute('selected') ||\n          (tab as any).selected,\n      );\n      if (selectedTab) {\n        const selectedTarget = selectedTab.getAttribute('target');\n        if (selectedTarget) this.selectTab(selectedTarget);\n      } else if (tabs.length > 0) {\n        const firstTarget = tabs[0].getAttribute('target');\n        if (firstTarget) this.selectTab(firstTarget);\n      }\n    }\n  }\n\n  render() {\n    return html`<slot></slot>`;\n  }\n}\n"],"names":["LitElement","html","styles"],"mappings":"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"}

package/dist/tab-panel.js

@@ -3,6 +3,7 @@ import { n } from './property-B49QQ8pS.js';
 
 var css_248z = i`* {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {

package/dist/tab-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab-panel.js","sources":["../../src/tabs/tab-panel.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport styles from './tab-panel.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Tab Panel\n * @tag wc-tab-panel\n * @rawTag tab-panel\n *\n * @summary Content panel for tabs.\n * @overview\n * <p>TabPanel contains the content associated with a tab.</p>\n *\n * @example\n * ```html\n * <wc-tab-panel>Content for this tab</wc-tab-panel>\n * ```\n * @tags navigation\n */\n@IndividualComponent\nexport class TabPanel extends LitElement {\n  static styles = [styles];\n\n  @property({ reflect: true }) value?: string;\n\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  render() {\n    return html`<slot></slot>`;\n  }\n}\n"],"names":["LitElement","html","styles","property"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAKA;;;;;;;;;;;;;;AAcG;AAEI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQA,GAAU,CAAA;AAAjC,IAAA,WAAA,GAAA;;QAKuC,IAAA,CAAA,MAAM,GAAG,KAAK;IAK5D;IAHE,MAAM,GAAA;QACJ,OAAOC,CAAI,CAAA,CAAA,aAAA,CAAe;IAC5B;;AARO,QAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAEK,UAAA,CAAA;AAA5B,IAAAC,CAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE;AAAiB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,OAAA,EAAA,MAAA,CAAA;AAEA,UAAA,CAAA;IAA3CA,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAAiB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,QAAA,EAAA,MAAA,CAAA;AALhD,QAAQ,GAAA,UAAA,CAAA;IADpB;AACY,CAAA,EAAA,QAAQ,CAUpB;;;;"}
+{"version":3,"file":"tab-panel.js","sources":["../../src/tabs/tab-panel.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport styles from './tab-panel.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Tab Panel\n * @tag wc-tab-panel\n * @rawTag tab-panel\n *\n * @summary Content panel for tabs.\n * @overview\n * <p>TabPanel contains the content associated with a tab.</p>\n *\n * @example\n * ```html\n * <wc-tab-panel>Content for this tab</wc-tab-panel>\n * ```\n * @tags navigation\n */\n@IndividualComponent\nexport class TabPanel extends LitElement {\n  static styles = [styles];\n\n  @property({ reflect: true }) value?: string;\n\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  render() {\n    return html`<slot></slot>`;\n  }\n}\n"],"names":["LitElement","html","styles","property"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAKA;;;;;;;;;;;;;;AAcG;AAEI,IAAM,QAAQ,GAAd,MAAM,QAAS,SAAQA,GAAU,CAAA;AAAjC,IAAA,WAAA,GAAA;;QAKuC,IAAA,CAAA,MAAM,GAAG,KAAK;IAK5D;IAHE,MAAM,GAAA;QACJ,OAAOC,CAAI,CAAA,CAAA,aAAA,CAAe;IAC5B;;AARO,QAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAEK,UAAA,CAAA;AAA5B,IAAAC,CAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE;AAAiB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,OAAA,EAAA,MAAA,CAAA;AAEA,UAAA,CAAA;IAA3CA,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAAiB,CAAA,EAAA,QAAA,CAAA,SAAA,EAAA,QAAA,EAAA,MAAA,CAAA;AALhD,QAAQ,GAAA,UAAA,CAAA;IADpB;AACY,CAAA,EAAA,QAAQ,CAUpB;;;;"}

package/dist/tab.js

@@ -13,6 +13,7 @@ import './directive-ZPhl09Yt.js';
 
 var css_248z = i`* {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {

package/dist/tab.js.map

@@ -1 +1 @@
-{"version":3,"file":"tab.js","sources":["../../src/tabs/tab.ts"],"sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport {\n  dispatchActivationClick,\n  isActivationClick,\n} from '@/__internal/utils/dispatch-event-utils.js';\nimport { observerSlotChangesWithCallback } from '@/__internal/utils/observe-slot-change.js';\nimport { throttle } from '@/__internal/utils/throttle.js';\nimport { isLink } from '@/__internal/utils/is-link.js';\nimport { spread } from '@/__internal/directive/spread.js';\n\nimport styles from './tab.scss';\nimport type { Tabs } from './tabs.js';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Tab\n * @tag wc-tab\n * @rawTag tab\n *\n * @summary A tab component for use within tabs.\n * @overview\n * <p>Tab represents an individual tab in a tabs component.</p>\n *\n * @example\n * ```html\n * <wc-tab>Tab Label</wc-tab>\n * ```\n * @tags navigation\n */\n@IndividualComponent\nexport class Tab extends LitElement {\n  #id = crypto.randomUUID();\n\n  static styles = [styles];\n\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  @property({ type: String }) disabledReason = '';\n\n  @property({ type: String }) value?: string;\n\n  @property({ reflect: true })\n  configAria?: { [key: string]: any };\n\n  /**\n   * Sets or retrieves the window or frame at which to target content.\n   */\n  @property() target: string = '_self';\n\n  @property({ type: String, reflect: true }) href?: string;\n\n  /**\n   * Sets the delay for throttle in milliseconds. When null (default), no throttle is applied.\n   */\n  @property() throttleDelay?: number;\n\n  @state() hasFocus = false;\n\n  @state() slotHasContent = false;\n\n  @state() slotHasIcon = false;\n\n  @state() slotHasBadge = false;\n\n  private _tabindex = 0;\n\n  @query('.tab-element') readonly tabElement!: HTMLElement | null;\n\n  override focus() {\n    this.tabElement?.focus();\n  }\n\n  override blur() {\n    this.tabElement?.blur();\n  }\n\n  constructor() {\n    super();\n    this._tabindex = 0;\n    this.addEventListener('click', this.__dispatchClickWithThrottle);\n  }\n\n  override firstUpdated() {\n    if (typeof this.throttleDelay === 'number') {\n      this.__dispatchClickWithThrottle = throttle(\n        this.__dispatchClick,\n        this.throttleDelay,\n      );\n    }\n    observerSlotChangesWithCallback(\n      this.renderRoot.querySelector('slot:not([name])'),\n      hasContent => {\n        this.slotHasContent = hasContent;\n        this.requestUpdate();\n      },\n    );\n\n    observerSlotChangesWithCallback(\n      this.renderRoot.querySelector('slot[name=\"icon\"]'),\n      hasContent => {\n        this.slotHasIcon = hasContent;\n        this.requestUpdate();\n      },\n    );\n\n    observerSlotChangesWithCallback(\n      this.renderRoot.querySelector('slot[name=\"badge\"]'),\n      hasContent => {\n        this.slotHasBadge = hasContent;\n        this.requestUpdate();\n      },\n    );\n  }\n\n  __dispatchClickWithThrottle: (event: MouseEvent | KeyboardEvent) => void =\n    event => {\n      this.__dispatchClick(event);\n    };\n\n  __dispatchClick = (event: MouseEvent | KeyboardEvent) => {\n    // If the button is soft-disabled or a disabled link, we need to explicitly\n    // prevent the click from propagating to other event listeners as well as\n    // prevent the default action.\n    if (this.disabled && this.href) {\n      event.stopImmediatePropagation();\n      event.preventDefault();\n      return;\n    }\n\n    if (!isActivationClick(event) || !this.tabElement) {\n      return;\n    }\n\n    this.focus();\n    dispatchActivationClick(this.tabElement);\n  };\n\n  __getParentTabsVariant(): Tabs['variant'] {\n    return (this.closest('wc-tabs') as Tabs | null)?.variant ?? 'primary';\n  }\n\n  // private handleKeyDown(evt: KeyboardEvent) {\n  //   if (this.disabled || this.showLoader) return;\n  //   if (evt.key === 'Enter' || evt.key === ' ') {\n  //     evt.preventDefault();\n  //     this.isActive = true;\n  //     this.dispatchTabClick();\n  //   }\n  // }\n\n  render() {\n    const variant = this.__getParentTabsVariant();\n\n    const cssClasses = {\n      tab: true,\n      'tab-element': true,\n      disabled: this.disabled,\n      active: this.active,\n      [`variant-${variant}`]: true,\n      'has-content': this.slotHasContent,\n      'has-icon': this.slotHasIcon,\n      'has-badge': this.slotHasBadge,\n    };\n\n    if (!isLink(this)) {\n      return html`<button\n        id=\"button\"\n        class=${classMap(cssClasses)}\n        tabindex=\"0\"\n        ?aria-describedby=${this.__getDisabledReasonID()}\n        aria-disabled=${`${this.disabled}`}\n        ?disabled=${this.disabled}\n        ${spread(this.configAria)}\n      >\n        ${this.renderTabContent(variant)}\n      </button>`;\n    }\n\n    return html`<a\n      class=${classMap(cssClasses)}\n      id=\"button\"\n      tabindex=\"0\"\n      href=${this.href}\n      target=${this.target}\n      role=\"button\"\n      ?aria-describedby=${this.__getDisabledReasonID()}\n      aria-disabled=${`${this.disabled}`}\n      ${spread(this.configAria)}\n    >\n      ${this.renderTabContent(variant)}\n    </a>`;\n  }\n\n  renderTabContent(variant: Tabs['variant']) {\n    switch (variant) {\n      case 'secondary':\n        return this.renderSecondaryTabContent();\n      case 'contained':\n        return this.renderContainedTabContent();\n      case 'filled':\n        return this.renderFilledTabContent();\n      case 'primary':\n      default:\n        return this.renderPrimaryTabContent();\n    }\n  }\n\n  renderPrimaryTabContent() {\n    return html`\n      <wc-focus-ring class=\"focus-ring\" for=\"button\"></wc-focus-ring>\n      <wc-elevation class=\"elevation\"></wc-elevation>\n      <div class=\"background\"></div>\n      <div class=\"outline\"></div>\n      <wc-ripple class=\"ripple\"></wc-ripple>\n\n      <div class=\"tab-content\">\n        <div class=\"icon-section\">\n          <slot name=\"badge\"></slot>\n          <slot name=\"icon\"></slot>\n        </div>\n        <div class=\"slot-container\">\n          <slot></slot>\n        </div>\n\n        <div class=\"indicator\"></div>\n      </div>\n\n      ${this.__renderDisabledReason()}\n    `;\n  }\n\n  renderSecondaryTabContent() {\n    return html`\n      <wc-focus-ring class=\"focus-ring\" for=\"button\"></wc-focus-ring>\n      <wc-elevation class=\"elevation\"></wc-elevation>\n      <div class=\"background\"></div>\n      <div class=\"outline\"></div>\n      <wc-ripple class=\"ripple\"></wc-ripple>\n\n      <div class=\"tab-content\">\n        <slot name=\"icon\"></slot>\n\n        <div class=\"slot-container\">\n          <slot></slot>\n        </div>\n\n        <slot name=\"badge\"></slot>\n      </div>\n\n      <div class=\"indicator\"></div>\n\n      ${this.__renderDisabledReason()}\n    `;\n  }\n\n  renderContainedTabContent() {\n    return this.renderSegmentedTabContent();\n  }\n\n  renderFilledTabContent() {\n    return this.renderSegmentedTabContent();\n  }\n\n  renderSegmentedTabContent() {\n    return html`\n      <wc-focus-ring class=\"focus-ring\" for=\"button\"></wc-focus-ring>\n      <wc-elevation class=\"elevation\"></wc-elevation>\n      <div class=\"background\"></div>\n      <div class=\"outline\"></div>\n      <wc-ripple class=\"ripple\"></wc-ripple>\n\n      <div class=\"tab-content\">\n        <slot name=\"icon\"></slot>\n\n        <div class=\"slot-container\">\n          <slot></slot>\n        </div>\n\n        <slot name=\"badge\"></slot>\n      </div>\n\n      ${this.__renderDisabledReason()}\n    `;\n  }\n\n  __getDisabledReasonID() {\n    return this.disabled && this.disabledReason\n      ? `disabled-reason-${this.#id}`\n      : nothing;\n  }\n\n  __renderDisabledReason() {\n    const disabledReasonID = this.__getDisabledReasonID();\n    if (disabledReasonID)\n      return html`<div\n        id=\"disabled-reason-${this.#id}\"\n        role=\"tooltip\"\n        aria-label=${this.disabledReason}\n        class=\"screen-reader-only\"\n      >\n        {this.disabledReason}\n      </div>`;\n    return nothing;\n  }\n}\n"],"names":["LitElement","html","classMap","nothing","styles","property","state","query"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiBA;;;;;;;;;;;;;;AAcG;AAEI,IAAM,GAAG,GAAT,MAAM,GAAI,SAAQA,GAAU,CAAA;IAwCxB,KAAK,GAAA;AACZ,QAAA,IAAI,CAAC,UAAU,EAAE,KAAK,EAAE;IAC1B;IAES,IAAI,GAAA;AACX,QAAA,IAAI,CAAC,UAAU,EAAE,IAAI,EAAE;IACzB;AAEA,IAAA,WAAA,GAAA;AACE,QAAA,KAAK,EAAE;AAhDT,QAAA,OAAA,CAAA,GAAA,CAAA,IAAA,EAAM,MAAM,CAAC,UAAU,EAAE,CAAA;QAImB,IAAA,CAAA,MAAM,GAAG,KAAK;QAEd,IAAA,CAAA,QAAQ,GAAG,KAAK;QAEhC,IAAA,CAAA,cAAc,GAAG,EAAE;AAO/C;;AAEG;QACS,IAAA,CAAA,MAAM,GAAW,OAAO;QAS3B,IAAA,CAAA,QAAQ,GAAG,KAAK;QAEhB,IAAA,CAAA,cAAc,GAAG,KAAK;QAEtB,IAAA,CAAA,WAAW,GAAG,KAAK;QAEnB,IAAA,CAAA,YAAY,GAAG,KAAK;QAErB,IAAA,CAAA,SAAS,GAAG,CAAC;QAkDrB,IAAA,CAAA,2BAA2B,GACzB,KAAK,IAAG;AACN,YAAA,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC;AAC7B,QAAA,CAAC;AAEH,QAAA,IAAA,CAAA,eAAe,GAAG,CAAC,KAAiC,KAAI;;;;YAItD,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,IAAI,EAAE;gBAC9B,KAAK,CAAC,wBAAwB,EAAE;gBAChC,KAAK,CAAC,cAAc,EAAE;gBACtB;YACF;YAEA,IAAI,CAAC,iBAAiB,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,UAAU,EAAE;gBACjD;YACF;YAEA,IAAI,CAAC,KAAK,EAAE;AACZ,YAAA,uBAAuB,CAAC,IAAI,CAAC,UAAU,CAAC;AAC1C,QAAA,CAAC;AAzDC,QAAA,IAAI,CAAC,SAAS,GAAG,CAAC;QAClB,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,2BAA2B,CAAC;IAClE;IAES,YAAY,GAAA;AACnB,QAAA,IAAI,OAAO,IAAI,CAAC,aAAa,KAAK,QAAQ,EAAE;AAC1C,YAAA,IAAI,CAAC,2BAA2B,GAAG,QAAQ,CACzC,IAAI,CAAC,eAAe,EACpB,IAAI,CAAC,aAAa,CACnB;QACH;AACA,QAAA,+BAA+B,CAC7B,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,kBAAkB,CAAC,EACjD,UAAU,IAAG;AACX,YAAA,IAAI,CAAC,cAAc,GAAG,UAAU;YAChC,IAAI,CAAC,aAAa,EAAE;AACtB,QAAA,CAAC,CACF;AAED,QAAA,+BAA+B,CAC7B,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,mBAAmB,CAAC,EAClD,UAAU,IAAG;AACX,YAAA,IAAI,CAAC,WAAW,GAAG,UAAU;YAC7B,IAAI,CAAC,aAAa,EAAE;AACtB,QAAA,CAAC,CACF;AAED,QAAA,+BAA+B,CAC7B,IAAI,CAAC,UAAU,CAAC,aAAa,CAAC,oBAAoB,CAAC,EACnD,UAAU,IAAG;AACX,YAAA,IAAI,CAAC,YAAY,GAAG,UAAU;YAC9B,IAAI,CAAC,aAAa,EAAE;AACtB,QAAA,CAAC,CACF;IACH;IAyBA,sBAAsB,GAAA;QACpB,OAAQ,IAAI,CAAC,OAAO,CAAC,SAAS,CAAiB,EAAE,OAAO,IAAI,SAAS;IACvE;;;;;;;;;IAWA,MAAM,GAAA;AACJ,QAAA,MAAM,OAAO,GAAG,IAAI,CAAC,sBAAsB,EAAE;AAE7C,QAAA,MAAM,UAAU,GAAG;AACjB,YAAA,GAAG,EAAE,IAAI;AACT,YAAA,aAAa,EAAE,IAAI;YACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,MAAM,EAAE,IAAI,CAAC,MAAM;AACnB,YAAA,CAAC,CAAA,QAAA,EAAW,OAAO,CAAA,CAAE,GAAG,IAAI;YAC5B,aAAa,EAAE,IAAI,CAAC,cAAc;YAClC,UAAU,EAAE,IAAI,CAAC,WAAW;YAC5B,WAAW,EAAE,IAAI,CAAC,YAAY;SAC/B;AAED,QAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE;AACjB,YAAA,OAAOC,CAAI,CAAA,CAAA;;gBAEDC,GAAQ,CAAC,UAAU,CAAC;;4BAER,IAAI,CAAC,qBAAqB,EAAE;wBAChC,CAAA,EAAG,IAAI,CAAC,QAAQ,CAAA,CAAE;AACtB,kBAAA,EAAA,IAAI,CAAC,QAAQ;AACvB,QAAA,EAAA,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC;;AAEvB,QAAA,EAAA,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC;gBACxB;QACZ;AAEA,QAAA,OAAOD,CAAI,CAAA,CAAA;cACDC,GAAQ,CAAC,UAAU,CAAC;;;AAGrB,WAAA,EAAA,IAAI,CAAC,IAAI;AACP,aAAA,EAAA,IAAI,CAAC,MAAM;;0BAEA,IAAI,CAAC,qBAAqB,EAAE;sBAChC,CAAA,EAAG,IAAI,CAAC,QAAQ,CAAA,CAAE;AAChC,MAAA,EAAA,MAAM,CAAC,IAAI,CAAC,UAAU,CAAC;;AAEvB,MAAA,EAAA,IAAI,CAAC,gBAAgB,CAAC,OAAO,CAAC;SAC7B;IACP;AAEA,IAAA,gBAAgB,CAAC,OAAwB,EAAA;QACvC,QAAQ,OAAO;AACb,YAAA,KAAK,WAAW;AACd,gBAAA,OAAO,IAAI,CAAC,yBAAyB,EAAE;AACzC,YAAA,KAAK,WAAW;AACd,gBAAA,OAAO,IAAI,CAAC,yBAAyB,EAAE;AACzC,YAAA,KAAK,QAAQ;AACX,gBAAA,OAAO,IAAI,CAAC,sBAAsB,EAAE;AACtC,YAAA,KAAK,SAAS;AACd,YAAA;AACE,gBAAA,OAAO,IAAI,CAAC,uBAAuB,EAAE;;IAE3C;IAEA,uBAAuB,GAAA;AACrB,QAAA,OAAOD,CAAI,CAAA;;;;;;;;;;;;;;;;;;;QAmBP,IAAI,CAAC,sBAAsB,EAAE;KAChC;IACH;IAEA,yBAAyB,GAAA;AACvB,QAAA,OAAOA,CAAI,CAAA;;;;;;;;;;;;;;;;;;;QAmBP,IAAI,CAAC,sBAAsB,EAAE;KAChC;IACH;IAEA,yBAAyB,GAAA;AACvB,QAAA,OAAO,IAAI,CAAC,yBAAyB,EAAE;IACzC;IAEA,sBAAsB,GAAA;AACpB,QAAA,OAAO,IAAI,CAAC,yBAAyB,EAAE;IACzC;IAEA,yBAAyB,GAAA;AACvB,QAAA,OAAOA,CAAI,CAAA;;;;;;;;;;;;;;;;;QAiBP,IAAI,CAAC,sBAAsB,EAAE;KAChC;IACH;IAEA,qBAAqB,GAAA;AACnB,QAAA,OAAO,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC;AAC3B,cAAE,CAAA,gBAAA,EAAmB,sBAAA,CAAA,IAAI,eAAI,CAAA;cAC3BE,CAAO;IACb;IAEA,sBAAsB,GAAA;AACpB,QAAA,MAAM,gBAAgB,GAAG,IAAI,CAAC,qBAAqB,EAAE;AACrD,QAAA,IAAI,gBAAgB;AAClB,YAAA,OAAOF,CAAI,CAAA,CAAA;AACa,4BAAA,EAAA,sBAAA,CAAA,IAAI,EAAA,OAAA,EAAA,GAAA,CAAI,CAAA;;AAEjB,mBAAA,EAAA,IAAI,CAAC,cAAc;;;;aAI3B;AACT,QAAA,OAAOE,CAAO;IAChB;;;AAhRO,GAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAEoB,UAAA,CAAA;IAA3CC,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAAiB,CAAA,EAAA,GAAA,CAAA,SAAA,EAAA,QAAA,EAAA,MAAA,CAAA;AAEf,UAAA,CAAA;IAA3CA,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAAmB,CAAA,EAAA,GAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AAEjC,UAAA,CAAA;AAA3B,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE;AAAsB,CAAA,EAAA,GAAA,CAAA,SAAA,EAAA,gBAAA,EAAA,MAAA,CAAA;AAEpB,UAAA,CAAA;AAA3B,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE;AAAiB,CAAA,EAAA,GAAA,CAAA,SAAA,EAAA,OAAA,EAAA,MAAA,CAAA;AAG3C,UAAA,CAAA;AADC,IAAAA,CAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE;AACS,CAAA,EAAA,GAAA,CAAA,SAAA,EAAA,YAAA,EAAA,MAAA,CAAA;AAKxB,UAAA,CAAA;AAAX,IAAAA,CAAQ;AAA4B,CAAA,EAAA,GAAA,CAAA,SAAA,EAAA,QAAA,EAAA,MAAA,CAAA;AAEM,UAAA,CAAA;IAA1CA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AAAgB,CAAA,EAAA,GAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAK7C,UAAA,CAAA;AAAX,IAAAA,CAAQ;AAA0B,CAAA,EAAA,GAAA,CAAA,SAAA,EAAA,eAAA,EAAA,MAAA,CAAA;AAE1B,UAAA,CAAA;AAAR,IAAAC,CAAK;AAAoB,CAAA,EAAA,GAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AAEjB,UAAA,CAAA;AAAR,IAAAA,CAAK;AAA0B,CAAA,EAAA,GAAA,CAAA,SAAA,EAAA,gBAAA,EAAA,MAAA,CAAA;AAEvB,UAAA,CAAA;AAAR,IAAAA,CAAK;AAAuB,CAAA,EAAA,GAAA,CAAA,SAAA,EAAA,aAAA,EAAA,MAAA,CAAA;AAEpB,UAAA,CAAA;AAAR,IAAAA,CAAK;AAAwB,CAAA,EAAA,GAAA,CAAA,SAAA,EAAA,cAAA,EAAA,MAAA,CAAA;AAIE,UAAA,CAAA;IAA/BC,CAAK,CAAC,cAAc;AAA2C,CAAA,EAAA,GAAA,CAAA,SAAA,EAAA,YAAA,EAAA,MAAA,CAAA;AAtCrD,GAAG,GAAA,UAAA,CAAA;IADf;AACY,CAAA,EAAA,GAAG,CAoRf;;;;"}
+{"version":3,"file":"tab.js","sources":["../../src/tabs/tab.ts"],"sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport {\n  dispatchActivationClick,\n  isActivationClick,\n} from '@/__internal/utils/dispatch-event-utils.js';\nimport { observerSlotChangesWithCallback } from '@/__internal/utils/observe-slot-change.js';\nimport { throttle } from '@/__internal/utils/throttle.js';\nimport { isLink } from '@/__internal/utils/is-link.js';\nimport { spread } from '@/__internal/directive/spread.js';\n\nimport styles from './tab.scss';\nimport type { Tabs } from './tabs.js';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Tab\n * @tag wc-tab\n * @rawTag tab\n *\n * @summary A tab component for use within tabs.\n * @overview\n * <p>Tab represents an individual tab in a tabs component.</p>\n *\n * @example\n * ```html\n * <wc-tab>Tab Label</wc-tab>\n * ```\n * @tags navigation\n */\n@IndividualComponent\nexport class Tab extends LitElement {\n  #id = crypto.randomUUID();\n\n  static styles = [styles];\n\n  @property({ type: Boolean, reflect: true }) active = false;\n\n  @property({ type: Boolean, reflect: true }) disabled = false;\n\n  @property({ type: String }) disabledReason = '';\n\n  @property({ type: String }) value?: string;\n\n  @property({ reflect: true })\n  configAria?: { [key: string]: any };\n\n  /**\n   * Sets or retrieves the window or frame at which to target content.\n   */\n  @property() target: string = '_self';\n\n  @property({ type: String, reflect: true }) href?: string;\n\n  /**\n   * Sets the delay for throttle in milliseconds. When null (default), no throttle is applied.\n   */\n  @property() throttleDelay?: number;\n\n  @state() hasFocus = false;\n\n  @state() slotHasContent = false;\n\n  @state() slotHasIcon = false;\n\n  @state() slotHasBadge = false;\n\n  private _tabindex = 0;\n\n  @query('.tab-element') readonly tabElement!: HTMLElement | null;\n\n  override focus() {\n    this.tabElement?.focus();\n  }\n\n  override blur() {\n    this.tabElement?.blur();\n  }\n\n  constructor() {\n    super();\n    this._tabindex = 0;\n    this.addEventListener('click', this.__dispatchClickWithThrottle);\n  }\n\n  override firstUpdated() {\n    if (typeof this.throttleDelay === 'number') {\n      this.__dispatchClickWithThrottle = throttle(\n        this.__dispatchClick,\n        this.throttleDelay,\n      );\n    }\n    observerSlotChangesWithCallback(\n      this.renderRoot.querySelector('slot:not([name])'),\n      hasContent => {\n        this.slotHasContent = hasContent;\n        this.requestUpdate();\n      },\n    );\n\n    observerSlotChangesWithCallback(\n      this.renderRoot.querySelector('slot[name=\"icon\"]'),\n      hasContent => {\n        this.slotHasIcon = hasContent;\n        this.requestUpdate();\n      },\n    );\n\n    observerSlotChangesWithCallback(\n      this.renderRoot.querySelector('slot[name=\"badge\"]'),\n      hasContent => {\n        this.slotHasBadge = hasContent;\n        this.requestUpdate();\n      },\n    );\n  }\n\n  __dispatchClickWithThrottle: (event: MouseEvent | KeyboardEvent) => void =\n    event => {\n      this.__dispatchClick(event);\n    };\n\n  __dispatchClick = (event: MouseEvent | KeyboardEvent) => {\n    // If the button is soft-disabled or a disabled link, we need to explicitly\n    // prevent the click from propagating to other event listeners as well as\n    // prevent the default action.\n    if (this.disabled && this.href) {\n      event.stopImmediatePropagation();\n      event.preventDefault();\n      return;\n    }\n\n    if (!isActivationClick(event) || !this.tabElement) {\n      return;\n    }\n\n    this.focus();\n    dispatchActivationClick(this.tabElement);\n  };\n\n  __getParentTabsVariant(): Tabs['variant'] {\n    return (this.closest('wc-tabs') as Tabs | null)?.variant ?? 'primary';\n  }\n\n  // private handleKeyDown(evt: KeyboardEvent) {\n  //   if (this.disabled || this.showLoader) return;\n  //   if (evt.key === 'Enter' || evt.key === ' ') {\n  //     evt.preventDefault();\n  //     this.isActive = true;\n  //     this.dispatchTabClick();\n  //   }\n  // }\n\n  render() {\n    const variant = this.__getParentTabsVariant();\n\n    const cssClasses = {\n      tab: true,\n      'tab-element': true,\n      disabled: this.disabled,\n      active: this.active,\n      [`variant-${variant}`]: true,\n      'has-content': this.slotHasContent,\n      'has-icon': this.slotHasIcon,\n      'has-badge': this.slotHasBadge,\n    };\n\n    if (!isLink(this)) {\n      return html`<button\n        id=\"button\"\n        class=${classMap(cssClasses)}\n        tabindex=\"0\"\n        ?aria-describedby=${this.__getDisabledReasonID()}\n        aria-disabled=${`${this.disabled}`}\n        ?disabled=${this.disabled}\n        ${spread(this.configAria)}\n      >\n        ${this.renderTabContent(variant)}\n      </button>`;\n    }\n\n    return html`<a\n      class=${classMap(cssClasses)}\n      id=\"button\"\n      tabindex=\"0\"\n      href=${this.href}\n      target=${this.target}\n      role=\"button\"\n      ?aria-describedby=${this.__getDisabledReasonID()}\n      aria-disabled=${`${this.disabled}`}\n      ${spread(this.configAria)}\n    >\n      ${this.renderTabContent(variant)}\n    </a>`;\n  }\n\n  renderTabContent(variant: Tabs['variant']) {\n    switch (variant) {\n      case 'secondary':\n        return this.renderSecondaryTabContent();\n      case 'contained':\n        return this.renderContainedTabContent();\n      case 'filled':\n        return this.renderFilledTabContent();\n      case 'primary':\n      default:\n        return this.renderPrimaryTabContent();\n    }\n  }\n\n  renderPrimaryTabContent() {\n    return html`\n      <wc-focus-ring class=\"focus-ring\" for=\"button\"></wc-focus-ring>\n      <wc-elevation class=\"elevation\"></wc-elevation>\n      <div class=\"background\"></div>\n      <div class=\"outline\"></div>\n      <wc-ripple class=\"ripple\"></wc-ripple>\n\n      <div class=\"tab-content\">\n        <div class=\"icon-section\">\n          <slot name=\"badge\"></slot>\n          <slot name=\"icon\"></slot>\n        </div>\n        <div class=\"slot-container\">\n          <slot></slot>\n        </div>\n\n        <div class=\"indicator\"></div>\n      </div>\n\n      ${this.__renderDisabledReason()}\n    `;\n  }\n\n  renderSecondaryTabContent() {\n    return html`\n      <wc-focus-ring class=\"focus-ring\" for=\"button\"></wc-focus-ring>\n      <wc-elevation class=\"elevation\"></wc-elevation>\n      <div class=\"background\"></div>\n      <div class=\"outline\"></div>\n      <wc-ripple class=\"ripple\"></wc-ripple>\n\n      <div class=\"tab-content\">\n        <slot name=\"icon\"></slot>\n\n        <div class=\"slot-container\">\n          <slot></slot>\n        </div>\n\n        <slot name=\"badge\"></slot>\n      </div>\n\n      <div class=\"indicator\"></div>\n\n      ${this.__renderDisabledReason()}\n    `;\n  }\n\n  renderContainedTabContent() {\n    return this.renderSegmentedTabContent();\n  }\n\n  renderFilledTabContent() {\n    return this.renderSegmentedTabContent();\n  }\n\n  renderSegmentedTabContent() {\n    return html`\n      <wc-focus-ring class=\"focus-ring\" for=\"button\"></wc-focus-ring>\n      <wc-elevation class=\"elevation\"></wc-elevation>\n      <div class=\"background\"></div>\n      <div class=\"outline\"></div>\n      <wc-ripple class=\"ripple\"></wc-ripple>\n\n      <div class=\"tab-content\">\n        <slot name=\"icon\"></slot>\n\n        <div class=\"slot-container\">\n          <slot></slot>\n        </div>\n\n        <slot name=\"badge\"></slot>\n      </div>\n\n      ${this.__renderDisabledReason()}\n    `;\n  }\n\n  __getDisabledReasonID() {\n    return this.disabled && this.disabledReason\n      ? `disabled-reason-${this.#id}`\n      : nothing;\n  }\n\n  __renderDisabledReason() {\n    const disabledReasonID = this.__getDisabledReasonID();\n    if (disabledReasonID)\n      return html`<div\n        id=\"disabled-reason-${this.#id}\"\n        role=\"tooltip\"\n        aria-label=${this.disabledReason}\n        class=\"screen-reader-only\"\n      >\n        {this.disabledReason}\n      </div>`;\n    return nothing;\n  }\n}\n"],"names":["LitElement","html","classMap","nothing","styles","property","state","query"],"mappings":"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"}

package/dist/table.js

@@ -8,6 +8,7 @@ import './directive-ZPhl09Yt.js';
 
 var css_248z = i`* {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {