@redvars/peacock 3.8.2 → 3.8.4

package/dist/accordion-item.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 {
@@ -179,7 +180,7 @@ var AccordionItem_1;
  * @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
@@ -228,7 +229,7 @@ let AccordionItem = AccordionItem_1 = class AccordionItem extends i$1 {
         if (this.disabled)
             return;
         this.open = !this.open;
-        this.dispatchEvent(new CustomEvent('accordion-item:toggle', {
+        this.dispatchEvent(new CustomEvent('accordion-item-toggle', {
             bubbles: true,
             composed: true,
             detail: { open: this.open },
@@ -270,12 +271,16 @@ let AccordionItem = AccordionItem_1 = class AccordionItem extends i$1 {
           ?disabled=${this.disabled}
           @click=${this._handleToggle}
         >
-          ${this.togglePosition === 'before' ? this._renderToggleIcon() : A}
+          ${this.togglePosition === 'before'
+            ? this._renderToggleIcon()
+            : A}
           <span class="header-label">
             <span part="title" class="panel-title">
               <slot
                 name="heading"
-                @slotchange=${(e) => AccordionItem_1._onSlotChange(e, v => { this._hasHeadingSlot = v; })}
+                @slotchange=${(e) => AccordionItem_1._onSlotChange(e, v => {
+            this._hasHeadingSlot = v;
+        })}
               ></slot>
             </span>
             <span
@@ -285,12 +290,16 @@ let AccordionItem = AccordionItem_1 = class AccordionItem extends i$1 {
             >
               <slot
                 name="description"
-                @slotchange=${(e) => AccordionItem_1._onSlotChange(e, v => { this._hasDescriptionSlot = v; })}
+                @slotchange=${(e) => AccordionItem_1._onSlotChange(e, v => {
+            this._hasDescriptionSlot = v;
+        })}
               ></slot>
             </span>
           </span>
           <slot name="header-actions" class="header-actions"></slot>
-          ${this.togglePosition === 'after' ? this._renderToggleIcon() : A}
+          ${this.togglePosition === 'after'
+            ? this._renderToggleIcon()
+            : A}
         </button>
         <div
           id=${`panel-content-${__classPrivateFieldGet(this, _AccordionItem_id, "f")}`}

package/dist/accordion-item.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion-item.js","sources":["../../src/accordion/accordion-item.ts"],"sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport styles from './accordion-item.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Accordion Item\n * @tag wc-accordion-item\n * @rawTag accordion-item\n * @summary An expansion panel with a header that reveals or hides associated content.\n *\n * @slot - The body content revealed when the panel is expanded.\n * @slot heading - The panel title. Renders as `body-large` text.\n * @slot description - Optional subtitle rendered below the title. Renders as `body-small` text.\n * @slot header-actions - Actions (e.g. icon buttons) placed at the trailing end of the header, before the toggle icon.\n *\n * @part header - The header `<button>` element.\n * @part title - The title text container.\n * @part description - The description text container.\n * @part content - The expandable content region wrapper.\n *\n * @fires {CustomEvent<{ open: boolean }>} accordion-item:toggle - Fired when the panel is expanded or collapsed.\n *\n * @example\n * ```html\n * <wc-accordion-item>\n *   <span slot=\"heading\">Personal information</span>\n *   <span slot=\"description\">Fill in your details</span>\n *   <p>Content goes here.</p>\n * </wc-accordion-item>\n * ```\n * @tags display\n */\n@IndividualComponent\nexport class AccordionItem extends LitElement {\n  static styles = [styles];\n\n  #id = crypto.randomUUID();\n\n  /**\n   * Whether the user cannot interact with the panel.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled: boolean = false;\n\n  /**\n   * Whether the panel is expanded.\n   */\n  @property({ type: Boolean, reflect: true })\n  open: boolean = false;\n\n  /**\n   * Whether to hide the expand/collapse toggle indicator icon.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-toggle' })\n  hideToggle: boolean = false;\n\n  /**\n   * Position of the toggle icon relative to the panel title.\n   * `'after'` places it at the trailing end (default, matches M3).\n   * `'before'` places it at the leading start.\n   */\n  @property({ type: String, reflect: true, attribute: 'toggle-position' })\n  togglePosition: 'before' | 'after' = 'after';\n\n  /** True when the `description` slot contains at least one non-empty node. */\n  @state()\n  private _hasDescriptionSlot = false;\n\n  /** True when the `heading` slot contains at least one non-empty node. */\n  @state()\n  private _hasHeadingSlot = false;\n\n  @query('.header-button')\n  private readonly buttonElement!: HTMLElement | null;\n\n  override focus() {\n    this.buttonElement?.focus();\n  }\n\n  override blur() {\n    this.buttonElement?.blur();\n  }\n\n  private _handleToggle() {\n    if (this.disabled) return;\n    this.open = !this.open;\n    this.dispatchEvent(\n      new CustomEvent('accordion-item:toggle', {\n        bubbles: true,\n        composed: true,\n        detail: { open: this.open },\n      }),\n    );\n  }\n\n  private static _onSlotChange(e: Event, setter: (v: boolean) => void) {\n    const slot = e.target as HTMLSlotElement;\n    const nodes = slot.assignedNodes({ flatten: true });\n    setter(\n      nodes.some(n =>\n        n.nodeType === Node.TEXT_NODE\n          ? (n.textContent?.trim() ?? '') !== ''\n          : true,\n      ),\n    );\n  }\n\n  private _renderToggleIcon() {\n    if (this.hideToggle) return nothing;\n    return html`<wc-icon\n      class=\"toggle-icon\"\n      name=\"keyboard_arrow_down\"\n      aria-hidden=\"true\"\n    ></wc-icon>`;\n  }\n\n  render() {\n    return html`\n      <div\n        class=${classMap({\n          'expansion-panel': true,\n          open: this.open,\n          disabled: this.disabled,\n        })}\n      >\n        <button\n          id=${`panel-header-${this.#id}`}\n          part=\"header\"\n          class=\"header-button\"\n          tabindex=${this.disabled ? '-1' : '0'}\n          aria-controls=${`panel-content-${this.#id}`}\n          aria-disabled=${this.disabled}\n          aria-expanded=${this.open}\n          ?disabled=${this.disabled}\n          @click=${this._handleToggle}\n        >\n          ${this.togglePosition === 'before' ? this._renderToggleIcon() : nothing}\n          <span class=\"header-label\">\n            <span part=\"title\" class=\"panel-title\">\n              <slot\n                name=\"heading\"\n                @slotchange=${(e: Event) => AccordionItem._onSlotChange(e, v => { this._hasHeadingSlot = v; })}\n              ></slot>\n            </span>\n            <span\n              part=\"description\"\n              class=\"panel-description\"\n              ?hidden=${!this._hasDescriptionSlot}\n            >\n              <slot\n                name=\"description\"\n                @slotchange=${(e: Event) => AccordionItem._onSlotChange(e, v => { this._hasDescriptionSlot = v; })}\n              ></slot>\n            </span>\n          </span>\n          <slot name=\"header-actions\" class=\"header-actions\"></slot>\n          ${this.togglePosition === 'after' ? this._renderToggleIcon() : nothing}\n        </button>\n        <div\n          id=${`panel-content-${this.#id}`}\n          part=\"content\"\n          class=\"panel-content\"\n          role=\"region\"\n          aria-labelledby=${`panel-header-${this.#id}`}\n        >\n          <div class=\"content-inner\">\n            <slot></slot>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","nothing","html","classMap","styles","property","state","query"],"mappings":"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"}
+{"version":3,"file":"accordion-item.js","sources":["../../src/accordion/accordion-item.ts"],"sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property, query, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport styles from './accordion-item.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Accordion Item\n * @tag wc-accordion-item\n * @rawTag accordion-item\n * @summary An expansion panel with a header that reveals or hides associated content.\n *\n * @slot - The body content revealed when the panel is expanded.\n * @slot heading - The panel title. Renders as `body-large` text.\n * @slot description - Optional subtitle rendered below the title. Renders as `body-small` text.\n * @slot header-actions - Actions (e.g. icon buttons) placed at the trailing end of the header, before the toggle icon.\n *\n * @part header - The header `<button>` element.\n * @part title - The title text container.\n * @part description - The description text container.\n * @part content - The expandable content region wrapper.\n *\n * @fires {CustomEvent<{ open: boolean }>} accordion-item-toggle - Fired when the panel is expanded or collapsed.\n *\n * @example\n * ```html\n * <wc-accordion-item>\n *   <span slot=\"heading\">Personal information</span>\n *   <span slot=\"description\">Fill in your details</span>\n *   <p>Content goes here.</p>\n * </wc-accordion-item>\n * ```\n * @tags display\n */\n@IndividualComponent\nexport class AccordionItem extends LitElement {\n  static styles = [styles];\n\n  #id = crypto.randomUUID();\n\n  /**\n   * Whether the user cannot interact with the panel.\n   */\n  @property({ type: Boolean, reflect: true })\n  disabled: boolean = false;\n\n  /**\n   * Whether the panel is expanded.\n   */\n  @property({ type: Boolean, reflect: true })\n  open: boolean = false;\n\n  /**\n   * Whether to hide the expand/collapse toggle indicator icon.\n   */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-toggle' })\n  hideToggle: boolean = false;\n\n  /**\n   * Position of the toggle icon relative to the panel title.\n   * `'after'` places it at the trailing end (default, matches M3).\n   * `'before'` places it at the leading start.\n   */\n  @property({ type: String, reflect: true, attribute: 'toggle-position' })\n  togglePosition: 'before' | 'after' = 'after';\n\n  /** True when the `description` slot contains at least one non-empty node. */\n  @state()\n  private _hasDescriptionSlot = false;\n\n  /** True when the `heading` slot contains at least one non-empty node. */\n  @state()\n  private _hasHeadingSlot = false;\n\n  @query('.header-button')\n  private readonly buttonElement!: HTMLElement | null;\n\n  override focus() {\n    this.buttonElement?.focus();\n  }\n\n  override blur() {\n    this.buttonElement?.blur();\n  }\n\n  private _handleToggle() {\n    if (this.disabled) return;\n    this.open = !this.open;\n    this.dispatchEvent(\n      new CustomEvent('accordion-item-toggle', {\n        bubbles: true,\n        composed: true,\n        detail: { open: this.open },\n      }),\n    );\n  }\n\n  private static _onSlotChange(e: Event, setter: (v: boolean) => void) {\n    const slot = e.target as HTMLSlotElement;\n    const nodes = slot.assignedNodes({ flatten: true });\n    setter(\n      nodes.some(n =>\n        n.nodeType === Node.TEXT_NODE\n          ? (n.textContent?.trim() ?? '') !== ''\n          : true,\n      ),\n    );\n  }\n\n  private _renderToggleIcon() {\n    if (this.hideToggle) return nothing;\n    return html`<wc-icon\n      class=\"toggle-icon\"\n      name=\"keyboard_arrow_down\"\n      aria-hidden=\"true\"\n    ></wc-icon>`;\n  }\n\n  render() {\n    return html`\n      <div\n        class=${classMap({\n          'expansion-panel': true,\n          open: this.open,\n          disabled: this.disabled,\n        })}\n      >\n        <button\n          id=${`panel-header-${this.#id}`}\n          part=\"header\"\n          class=\"header-button\"\n          tabindex=${this.disabled ? '-1' : '0'}\n          aria-controls=${`panel-content-${this.#id}`}\n          aria-disabled=${this.disabled}\n          aria-expanded=${this.open}\n          ?disabled=${this.disabled}\n          @click=${this._handleToggle}\n        >\n          ${this.togglePosition === 'before'\n            ? this._renderToggleIcon()\n            : nothing}\n          <span class=\"header-label\">\n            <span part=\"title\" class=\"panel-title\">\n              <slot\n                name=\"heading\"\n                @slotchange=${(e: Event) =>\n                  AccordionItem._onSlotChange(e, v => {\n                    this._hasHeadingSlot = v;\n                  })}\n              ></slot>\n            </span>\n            <span\n              part=\"description\"\n              class=\"panel-description\"\n              ?hidden=${!this._hasDescriptionSlot}\n            >\n              <slot\n                name=\"description\"\n                @slotchange=${(e: Event) =>\n                  AccordionItem._onSlotChange(e, v => {\n                    this._hasDescriptionSlot = v;\n                  })}\n              ></slot>\n            </span>\n          </span>\n          <slot name=\"header-actions\" class=\"header-actions\"></slot>\n          ${this.togglePosition === 'after'\n            ? this._renderToggleIcon()\n            : nothing}\n        </button>\n        <div\n          id=${`panel-content-${this.#id}`}\n          part=\"content\"\n          class=\"panel-content\"\n          role=\"region\"\n          aria-labelledby=${`panel-header-${this.#id}`}\n        >\n          <div class=\"content-inner\">\n            <slot></slot>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","nothing","html","classMap","styles","property","state","query"],"mappings":"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"}

package/dist/accordion.js

@@ -10,6 +10,7 @@ import './directive-ZPhl09Yt.js';
 
 var css_248z = i`* {
   box-sizing: border-box;
+  -webkit-tap-highlight-color: transparent;
 }
 
 .screen-reader-only {
@@ -30,10 +31,10 @@ var css_248z = i`* {
   gap: var(--spacing-100);
 }
 
-:host([display-mode=flat]) .accordion {
+:host([variant=flat]) .accordion {
   gap: 0;
 }
-:host([display-mode=flat]) slot::slotted(wc-accordion-item) {
+:host([variant=flat]) slot::slotted(wc-accordion-item) {
   --_accordion-item-border: none;
   --_accordion-item-background: transparent;
 }`;
@@ -67,25 +68,25 @@ let Accordion = class Accordion extends i$1 {
          * Whether multiple panels can be expanded simultaneously.
          * When `false` (default), expanding one panel collapses all others.
          */
-        this.multi = false;
+        this.multiple = false;
         /**
-         * 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.
          */
-        this.displayMode = 'default';
+        this.variant = 'default';
     }
     connectedCallback() {
         super.connectedCallback();
         // @ts-ignore
         // eslint-disable-next-line wc/require-listener-teardown
-        this.addEventListener('accordion-item:toggle', this._onItemToggle);
+        this.addEventListener('accordion-item-toggle', this._onItemToggle);
         this.addEventListener('keydown', this._onKeyDown);
     }
     disconnectedCallback() {
         super.disconnectedCallback();
         // @ts-ignore
-        this.removeEventListener('accordion-item:toggle', this._onItemToggle);
+        this.removeEventListener('accordion-item-toggle', this._onItemToggle);
         this.removeEventListener('keydown', this._onKeyDown);
     }
     _onItemToggle(e) {
@@ -93,7 +94,7 @@ let Accordion = class Accordion extends i$1 {
         // Ignore events from nested accordions — only handle direct children
         if (targetItem.parentElement !== this)
             return;
-        if (!this.multi && targetItem.open) {
+        if (!this.multiple && targetItem.open) {
             this.items.forEach(item => {
                 if (item !== targetItem && item.open) {
                     // eslint-disable-next-line no-param-reassign
@@ -144,10 +145,10 @@ Accordion.styles = [css_248z];
 Accordion.Item = AccordionItem;
 __decorate([
     n({ type: Boolean, reflect: true })
-], Accordion.prototype, "multi", void 0);
+], Accordion.prototype, "multiple", void 0);
 __decorate([
-    n({ type: String, reflect: true, attribute: 'display-mode' })
-], Accordion.prototype, "displayMode", void 0);
+    n({ type: String, reflect: true })
+], Accordion.prototype, "variant", void 0);
 __decorate([
     o({ selector: 'wc-accordion-item' })
 ], Accordion.prototype, "items", void 0);

package/dist/accordion.js.map

@@ -1 +1 @@
-{"version":3,"file":"accordion.js","sources":["../../src/accordion/accordion.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, queryAssignedElements } from 'lit/decorators.js';\nimport styles from './accordion.scss';\nimport { AccordionItem } from './accordion-item.js';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Accordion\n * @tag wc-accordion\n * @rawTag accordion\n * @summary A vertically stacked set of expansion panels.\n *\n * @example\n * ```html\n * <wc-accordion>\n *   <wc-accordion-item>\n *     <span slot=\"heading\">Panel 1</span>\n *     <span slot=\"description\">Summary text</span>\n *     Content\n *   </wc-accordion-item>\n *   <wc-accordion-item>\n *     <span slot=\"heading\">Panel 2</span>\n *     Content\n *   </wc-accordion-item>\n * </wc-accordion>\n * ```\n * @tags display\n */\n@IndividualComponent\nexport class Accordion extends LitElement {\n  static styles = [styles];\n\n  /**\n   * Whether multiple panels can be expanded simultaneously.\n   * When `false` (default), expanding one panel collapses all others.\n   */\n  @property({ type: Boolean, reflect: true })\n  multi = false;\n\n  /**\n   * Display mode for the accordion.\n   * `'default'` renders panels with a subtle background on expand and dividers between items.\n   * `'flat'` renders panels without borders or background changes — suitable for use inside cards.\n   */\n  @property({ type: String, reflect: true, attribute: 'display-mode' })\n  displayMode: 'default' | 'flat' = 'default';\n\n  @queryAssignedElements({ selector: 'wc-accordion-item' })\n  items!: Array<AccordionItem>;\n\n  connectedCallback() {\n    super.connectedCallback();\n    // @ts-ignore\n    // eslint-disable-next-line wc/require-listener-teardown\n    this.addEventListener('accordion-item:toggle', this._onItemToggle);\n    this.addEventListener('keydown', this._onKeyDown);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    // @ts-ignore\n    this.removeEventListener('accordion-item:toggle', this._onItemToggle);\n    this.removeEventListener('keydown', this._onKeyDown);\n  }\n\n  private _onItemToggle(e: CustomEvent) {\n    const targetItem = e.target as AccordionItem;\n\n    // Ignore events from nested accordions — only handle direct children\n    if (targetItem.parentElement !== this) return;\n\n    if (!this.multi && targetItem.open) {\n      this.items.forEach(item => {\n        if (item !== targetItem && item.open) {\n          // eslint-disable-next-line no-param-reassign\n          item.open = false;\n        }\n      });\n    }\n  }\n\n  private _onKeyDown(e: KeyboardEvent) {\n    const focusedItemIndex = this.items.findIndex(item => {\n      const root = item.shadowRoot;\n      return root?.activeElement?.classList.contains('header-button');\n    });\n\n    if (focusedItemIndex === -1) return;\n\n    let nextIndex = -1;\n\n    // eslint-disable-next-line default-case\n    switch (e.key) {\n      case 'ArrowDown':\n        e.preventDefault();\n        nextIndex = (focusedItemIndex + 1) % this.items.length;\n        break;\n      case 'ArrowUp':\n        e.preventDefault();\n        nextIndex =\n          (focusedItemIndex - 1 + this.items.length) % this.items.length;\n        break;\n      case 'Home':\n        e.preventDefault();\n        nextIndex = 0;\n        break;\n      case 'End':\n        e.preventDefault();\n        nextIndex = this.items.length - 1;\n        break;\n    }\n\n    if (nextIndex !== -1) {\n      const itemToFocus = this.items[nextIndex];\n      const button = itemToFocus.shadowRoot?.querySelector(\n        '.header-button',\n      ) as HTMLElement;\n      button?.focus();\n    }\n  }\n\n  render() {\n    return html`<div class=\"accordion\"><slot></slot></div>`;\n  }\n\n  static Item = AccordionItem;\n}\n"],"names":["LitElement","html","styles","property","queryAssignedElements"],"mappings":"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"}
+{"version":3,"file":"accordion.js","sources":["../../src/accordion/accordion.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { property, queryAssignedElements } from 'lit/decorators.js';\nimport styles from './accordion.scss';\nimport { AccordionItem } from './accordion-item.js';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Accordion\n * @tag wc-accordion\n * @rawTag accordion\n * @summary A vertically stacked set of expansion panels.\n *\n * @example\n * ```html\n * <wc-accordion>\n *   <wc-accordion-item>\n *     <span slot=\"heading\">Panel 1</span>\n *     <span slot=\"description\">Summary text</span>\n *     Content\n *   </wc-accordion-item>\n *   <wc-accordion-item>\n *     <span slot=\"heading\">Panel 2</span>\n *     Content\n *   </wc-accordion-item>\n * </wc-accordion>\n * ```\n * @tags display\n */\n@IndividualComponent\nexport class Accordion extends LitElement {\n  static styles = [styles];\n\n  /**\n   * Whether multiple panels can be expanded simultaneously.\n   * When `false` (default), expanding one panel collapses all others.\n   */\n  @property({ type: Boolean, reflect: true })\n  multiple = false;\n\n  /**\n   * Variant for the accordion.\n   * `'default'` renders panels with a subtle background on expand and dividers between items.\n   * `'flat'` renders panels without borders or background changes — suitable for use inside cards.\n   */\n  @property({ type: String, reflect: true })\n  variant: 'default' | 'flat' = 'default';\n\n  @queryAssignedElements({ selector: 'wc-accordion-item' })\n  items!: Array<AccordionItem>;\n\n  connectedCallback() {\n    super.connectedCallback();\n    // @ts-ignore\n    // eslint-disable-next-line wc/require-listener-teardown\n    this.addEventListener('accordion-item-toggle', this._onItemToggle);\n    this.addEventListener('keydown', this._onKeyDown);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    // @ts-ignore\n    this.removeEventListener('accordion-item-toggle', this._onItemToggle);\n    this.removeEventListener('keydown', this._onKeyDown);\n  }\n\n  private _onItemToggle(e: CustomEvent) {\n    const targetItem = e.target as AccordionItem;\n\n    // Ignore events from nested accordions — only handle direct children\n    if (targetItem.parentElement !== this) return;\n\n    if (!this.multiple && targetItem.open) {\n      this.items.forEach(item => {\n        if (item !== targetItem && item.open) {\n          // eslint-disable-next-line no-param-reassign\n          item.open = false;\n        }\n      });\n    }\n  }\n\n  private _onKeyDown(e: KeyboardEvent) {\n    const focusedItemIndex = this.items.findIndex(item => {\n      const root = item.shadowRoot;\n      return root?.activeElement?.classList.contains('header-button');\n    });\n\n    if (focusedItemIndex === -1) return;\n\n    let nextIndex = -1;\n\n    // eslint-disable-next-line default-case\n    switch (e.key) {\n      case 'ArrowDown':\n        e.preventDefault();\n        nextIndex = (focusedItemIndex + 1) % this.items.length;\n        break;\n      case 'ArrowUp':\n        e.preventDefault();\n        nextIndex =\n          (focusedItemIndex - 1 + this.items.length) % this.items.length;\n        break;\n      case 'Home':\n        e.preventDefault();\n        nextIndex = 0;\n        break;\n      case 'End':\n        e.preventDefault();\n        nextIndex = this.items.length - 1;\n        break;\n    }\n\n    if (nextIndex !== -1) {\n      const itemToFocus = this.items[nextIndex];\n      const button = itemToFocus.shadowRoot?.querySelector(\n        '.header-button',\n      ) as HTMLElement;\n      button?.focus();\n    }\n  }\n\n  render() {\n    return html`<div class=\"accordion\"><slot></slot></div>`;\n  }\n\n  static Item = AccordionItem;\n}\n"],"names":["LitElement","html","styles","property","queryAssignedElements"],"mappings":"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"}

package/dist/alert.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/alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert.js","sources":["../../src/alert/alert.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './alert.scss';\n\ntype AlertVariant = 'note' | 'info' | 'success' | 'warning' | 'error';\n\nconst VARIANT_LABELS: Record<AlertVariant, string> = {\n  note: 'Note',\n  info: 'Info',\n  success: 'Success',\n  warning: 'Warning',\n  error: 'Error',\n};\n\nconst VARIANT_ICONS: Record<AlertVariant, string> = {\n  note: 'star',\n  info: 'info',\n  success: 'check_circle',\n  warning: 'warning',\n  error: 'error',\n};\n\n/**\n * @label Alert\n * @tag wc-alert\n * @rawTag alert\n * @summary Alerts show short, prominent contextual messages with optional icon and description.\n *\n * @cssprop --alert-container-color - Background color of the alert container.\n * @cssprop --alert-label-text-color - Label text color.\n * @cssprop --alert-description-text-color - Description text color.\n * @cssprop --alert-icon-color - Icon color.\n * @cssprop --alert-border-radius - Border radius of the alert surface.\n *\n * @example\n * ```html\n * <wc-alert variant=\"note\" description=\"Use semantic roles that preserve a 3:1 contrast ratio.\"></wc-alert>\n * ```\n * @tags display, feedback\n */\n@IndividualComponent\nexport class Alert extends LitElement {\n  static styles = [styles];\n\n  /**\n   * Visual intent of the alert.\n   */\n  @property({ type: String, reflect: true })\n  variant: AlertVariant = 'note';\n\n  /**\n   * Optional explicit label text. Falls back to a variant-based label.\n   */\n  @property({ type: String })\n  label?: string;\n\n  /**\n   * Optional explicit icon name. Falls back to a variant-based icon.\n   */\n  @property({ type: String })\n  icon?: string;\n\n  /**\n   * Optional description text when a default slot is not provided.\n   */\n  @property({ type: String })\n  description = '';\n\n  private get resolvedLabel() {\n    return this.label || VARIANT_LABELS[this.variant];\n  }\n\n  private get resolvedIcon() {\n    return this.icon || VARIANT_ICONS[this.variant];\n  }\n\n  render() {\n    return html`\n      <div class=${classMap({ 'alert': true, [this.variant]: true })} role=\"status\" aria-live=\"polite\">\n        <div class=\"alert-icon\" aria-hidden=\"true\">\n          <slot name=\"icon\">\n            <wc-icon name=${this.resolvedIcon}></wc-icon>\n          </slot>\n        </div>\n\n        <div class=${classMap({ 'alert-content': true, [this.variant]: true })}>\n          <div class=\"alert-label\">\n            <slot name=\"label\">${this.resolvedLabel}:</slot>\n          </div>\n\n          <div class=\"alert-description\">\n            <slot>${this.description || nothing}</slot>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","classMap","nothing","styles","property"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,cAAc,GAAiC;AACnD,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,KAAK,EAAE,OAAO;CACf;AAED,MAAM,aAAa,GAAiC;AAClD,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,OAAO,EAAE,cAAc;AACvB,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,KAAK,EAAE,OAAO;CACf;AAED;;;;;;;;;;;;;;;;;AAiBG;AAEI,IAAM,KAAK,GAAX,MAAM,KAAM,SAAQA,GAAU,CAAA;AAA9B,IAAA,WAAA,GAAA;;AAGL;;AAEG;QAEH,IAAA,CAAA,OAAO,GAAiB,MAAM;AAc9B;;AAEG;QAEH,IAAA,CAAA,WAAW,GAAG,EAAE;IA+BlB;AA7BE,IAAA,IAAY,aAAa,GAAA;QACvB,OAAO,IAAI,CAAC,KAAK,IAAI,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC;IACnD;AAEA,IAAA,IAAY,YAAY,GAAA;QACtB,OAAO,IAAI,CAAC,IAAI,IAAI,aAAa,CAAC,IAAI,CAAC,OAAO,CAAC;IACjD;IAEA,MAAM,GAAA;AACJ,QAAA,OAAOC,CAAI,CAAA;AACI,iBAAA,EAAAC,CAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,IAAI,CAAC,OAAO,GAAG,IAAI,EAAE,CAAC,CAAA;;;AAGxC,0BAAA,EAAA,IAAI,CAAC,YAAY,CAAA;;;;AAIxB,mBAAA,EAAAA,CAAQ,CAAC,EAAE,eAAe,EAAE,IAAI,EAAE,CAAC,IAAI,CAAC,OAAO,GAAG,IAAI,EAAE,CAAC,CAAA;;AAE7C,+BAAA,EAAA,IAAI,CAAC,aAAa,CAAA;;;;oBAI/B,IAAI,CAAC,WAAW,IAAIC,CAAO,CAAA;;;;KAI1C;IACH;;AAtDO,KAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAMxB,UAAA,CAAA;IADCC,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AACV,CAAA,EAAA,KAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAM/B,UAAA,CAAA;AADC,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE;AACX,CAAA,EAAA,KAAA,CAAA,SAAA,EAAA,OAAA,EAAA,MAAA,CAAA;AAMf,UAAA,CAAA;AADC,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE;AACZ,CAAA,EAAA,KAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAMd,UAAA,CAAA;AADC,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE;AACT,CAAA,EAAA,KAAA,CAAA,SAAA,EAAA,aAAA,EAAA,MAAA,CAAA;AAzBN,KAAK,GAAA,UAAA,CAAA;IADjB;AACY,CAAA,EAAA,KAAK,CAwDjB;;;;"}
+{"version":3,"file":"alert.js","sources":["../../src/alert/alert.ts"],"sourcesContent":["import { LitElement, html, nothing } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\n\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './alert.scss';\n\ntype AlertVariant = 'note' | 'info' | 'success' | 'warning' | 'error';\n\nconst VARIANT_LABELS: Record<AlertVariant, string> = {\n  note: 'Note',\n  info: 'Info',\n  success: 'Success',\n  warning: 'Warning',\n  error: 'Error',\n};\n\nconst VARIANT_ICONS: Record<AlertVariant, string> = {\n  note: 'star',\n  info: 'info',\n  success: 'check_circle',\n  warning: 'warning',\n  error: 'error',\n};\n\n/**\n * @label Alert\n * @tag wc-alert\n * @rawTag alert\n * @summary Alerts show short, prominent contextual messages with optional icon and description.\n *\n * @cssprop --alert-container-color - Background color of the alert container.\n * @cssprop --alert-label-text-color - Label text color.\n * @cssprop --alert-description-text-color - Description text color.\n * @cssprop --alert-icon-color - Icon color.\n * @cssprop --alert-border-radius - Border radius of the alert surface.\n *\n * @example\n * ```html\n * <wc-alert variant=\"note\" description=\"Use semantic roles that preserve a 3:1 contrast ratio.\"></wc-alert>\n * ```\n * @tags display, feedback\n */\n@IndividualComponent\nexport class Alert extends LitElement {\n  static styles = [styles];\n\n  /**\n   * Visual intent of the alert.\n   */\n  @property({ type: String, reflect: true })\n  variant: AlertVariant = 'note';\n\n  /**\n   * Optional explicit label text. Falls back to a variant-based label.\n   */\n  @property({ type: String })\n  label?: string;\n\n  /**\n   * Optional explicit icon name. Falls back to a variant-based icon.\n   */\n  @property({ type: String })\n  icon?: string;\n\n  /**\n   * Optional description text when a default slot is not provided.\n   */\n  @property({ type: String })\n  description = '';\n\n  private get resolvedLabel() {\n    return this.label || VARIANT_LABELS[this.variant];\n  }\n\n  private get resolvedIcon() {\n    return this.icon || VARIANT_ICONS[this.variant];\n  }\n\n  render() {\n    return html`\n      <div class=${classMap({ 'alert': true, [this.variant]: true })} role=\"status\" aria-live=\"polite\">\n        <div class=\"alert-icon\" aria-hidden=\"true\">\n          <slot name=\"icon\">\n            <wc-icon name=${this.resolvedIcon}></wc-icon>\n          </slot>\n        </div>\n\n        <div class=${classMap({ 'alert-content': true, [this.variant]: true })}>\n          <div class=\"alert-label\">\n            <slot name=\"label\">${this.resolvedLabel}:</slot>\n          </div>\n\n          <div class=\"alert-description\">\n            <slot>${this.description || nothing}</slot>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","html","classMap","nothing","styles","property"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,cAAc,GAAiC;AACnD,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,KAAK,EAAE,OAAO;CACf;AAED,MAAM,aAAa,GAAiC;AAClD,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,IAAI,EAAE,MAAM;AACZ,IAAA,OAAO,EAAE,cAAc;AACvB,IAAA,OAAO,EAAE,SAAS;AAClB,IAAA,KAAK,EAAE,OAAO;CACf;AAED;;;;;;;;;;;;;;;;;AAiBG;AAEI,IAAM,KAAK,GAAX,MAAM,KAAM,SAAQA,GAAU,CAAA;AAA9B,IAAA,WAAA,GAAA;;AAGL;;AAEG;QAEH,IAAA,CAAA,OAAO,GAAiB,MAAM;AAc9B;;AAEG;QAEH,IAAA,CAAA,WAAW,GAAG,EAAE;IA+BlB;AA7BE,IAAA,IAAY,aAAa,GAAA;QACvB,OAAO,IAAI,CAAC,KAAK,IAAI,cAAc,CAAC,IAAI,CAAC,OAAO,CAAC;IACnD;AAEA,IAAA,IAAY,YAAY,GAAA;QACtB,OAAO,IAAI,CAAC,IAAI,IAAI,aAAa,CAAC,IAAI,CAAC,OAAO,CAAC;IACjD;IAEA,MAAM,GAAA;AACJ,QAAA,OAAOC,CAAI,CAAA;AACI,iBAAA,EAAAC,CAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,IAAI,CAAC,OAAO,GAAG,IAAI,EAAE,CAAC,CAAA;;;AAGxC,0BAAA,EAAA,IAAI,CAAC,YAAY,CAAA;;;;AAIxB,mBAAA,EAAAA,CAAQ,CAAC,EAAE,eAAe,EAAE,IAAI,EAAE,CAAC,IAAI,CAAC,OAAO,GAAG,IAAI,EAAE,CAAC,CAAA;;AAE7C,+BAAA,EAAA,IAAI,CAAC,aAAa,CAAA;;;;oBAI/B,IAAI,CAAC,WAAW,IAAIC,CAAO,CAAA;;;;KAI1C;IACH;;AAtDO,KAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAMxB,UAAA,CAAA;IADCC,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AACV,CAAA,EAAA,KAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAM/B,UAAA,CAAA;AADC,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE;AACX,CAAA,EAAA,KAAA,CAAA,SAAA,EAAA,OAAA,EAAA,MAAA,CAAA;AAMf,UAAA,CAAA;AADC,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE;AACZ,CAAA,EAAA,KAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAMd,UAAA,CAAA;AADC,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE;AACT,CAAA,EAAA,KAAA,CAAA,SAAA,EAAA,aAAA,EAAA,MAAA,CAAA;AAzBN,KAAK,GAAA,UAAA,CAAA;IADjB;AACY,CAAA,EAAA,KAAK,CAwDjB;;;;"}

package/dist/app-bar.js

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

package/dist/app-bar.js.map

@@ -1 +1 @@
-{"version":3,"file":"app-bar.js","sources":["../../src/app-bar/app-bar.ts"],"sourcesContent":["import { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './app-bar.scss';\nimport colorStyles from './app-bar-colors.scss';\n\n/**\n * @label App Bar\n * @tag wc-app-bar\n * @rawTag app-bar\n *\n * @summary A top app bar for page-level navigation and actions.\n * @overview\n * <p>The app bar component implements the top app bar pattern. It provides a\n * consistent header for screens, housing a navigation icon, a page title/headline, and\n * optional trailing action icons.</p>\n *\n * <p>Four size variants are available: <strong>small</strong> (64dp, single-row),\n * <strong>center-aligned</strong> (64dp, centred headline), <strong>medium</strong>\n * (112dp, headline below the row), and <strong>large</strong> (152dp, large headline).</p>\n *\n * <p>Use the <code>leading</code> slot for a navigation icon (e.g. a hamburger or back\n * button), the default slot for the headline text, and the <code>trailing</code> slot for\n * action icon buttons.</p>\n *\n * @slot leading - Navigation icon placed at the start of the bar.\n * @slot - Headline / title text.\n * @slot trailing - Trailing action icon buttons placed at the end of the bar.\n *\n * @cssprop --app-bar-container-color - Background color of the app bar.\n * @cssprop --app-bar-container-height - Height of the bar in small / center-aligned variants.\n * @cssprop --app-bar-headline-color - Color of the headline text.\n * @cssprop --app-bar-leading-icon-color - Color of the leading slot icons.\n * @cssprop --app-bar-trailing-icon-color - Color of the trailing slot icons.\n * @cssprop --app-bar-shadow - Box-shadow applied when the bar is scrolled / elevated.\n *\n * @example\n * ```html\n * <!-- Small app bar (default) -->\n * <wc-app-bar>\n *   <wc-icon-button slot=\"leading\" variant=\"text\"><wc-icon name=\"menu\"></wc-icon></wc-icon-button>\n *   Page Title\n *   <wc-icon-button slot=\"trailing\" variant=\"text\"><wc-icon name=\"search\"></wc-icon></wc-icon-button>\n *   <wc-icon-button slot=\"trailing\" variant=\"text\"><wc-icon name=\"more_vert\"></wc-icon></wc-icon-button>\n * </wc-app-bar>\n * ```\n *\n * @example\n * ```html\n * <!-- Center-aligned app bar -->\n * <wc-app-bar variant=\"center-aligned\">\n *   <wc-icon-button slot=\"leading\" variant=\"text\"><wc-icon name=\"arrow_back\"></wc-icon></wc-icon-button>\n *   Details\n *   <wc-icon-button slot=\"trailing\" variant=\"text\"><wc-icon name=\"more_vert\"></wc-icon></wc-icon-button>\n * </wc-app-bar>\n * ```\n *\n * @example\n * ```html\n * <!-- Medium app bar -->\n * <wc-app-bar variant=\"medium\">\n *   <wc-icon-button slot=\"leading\" variant=\"text\"><wc-icon name=\"menu\"></wc-icon></wc-icon-button>\n *   Medium Headline\n *   <wc-icon-button slot=\"trailing\" variant=\"text\"><wc-icon name=\"search\"></wc-icon></wc-icon-button>\n * </wc-app-bar>\n * ```\n *\n * @example\n * ```html\n * <!-- Large app bar -->\n * <wc-app-bar variant=\"large\">\n *   <wc-icon-button slot=\"leading\" variant=\"text\"><wc-icon name=\"arrow_back\"></wc-icon></wc-icon-button>\n *   Large Headline\n *   <wc-icon-button slot=\"trailing\" variant=\"text\"><wc-icon name=\"more_vert\"></wc-icon></wc-icon-button>\n * </wc-app-bar>\n * ```\n * @tags navigation display\n */\n@IndividualComponent\nexport class AppBar extends LitElement {\n  static styles = [styles, colorStyles];\n\n  /**\n   * Visual variant of the app bar.\n   * - `\"small\"`: 64dp single-row bar with leading, title, and trailing (default).\n   * - `\"center-aligned\"`: 64dp single-row bar with a centred headline.\n   * - `\"medium\"`: Two-row bar (64dp top row + 48dp headline row).\n   * - `\"large\"`: Two-row bar with a larger headline (64dp top row + 88dp headline row).\n   */\n  @property({ type: String, reflect: true })\n  variant: 'small' | 'center-aligned' | 'medium' | 'large' = 'small';\n\n  /**\n   * Whether the bar is in its scrolled state, which adds a shadow and optionally\n   * changes the container color to indicate elevation above page content.\n   */\n  @property({ type: Boolean, reflect: true })\n  scrolled: boolean = false;\n\n  override render() {\n    const isTwoRow = this.variant === 'medium' || this.variant === 'large';\n\n    const cssClasses = {\n      'app-bar': true,\n      [`variant-${this.variant}`]: true,\n      scrolled: this.scrolled,\n    };\n\n    if (isTwoRow) {\n      return this.__renderTwoRow(cssClasses);\n    }\n    return this.__renderSingleRow(cssClasses);\n  }\n\n  private __renderSingleRow(cssClasses: Record<string, boolean>) {\n    return html`\n      <header class=${classMap(cssClasses)} role=\"banner\">\n        <div class=\"background\"></div>\n        <div class=\"row row-top\">\n          <div class=\"leading\">\n            <slot name=\"leading\"></slot>\n          </div>\n          <div class=\"headline\">\n            <slot></slot>\n          </div>\n          <div class=\"trailing\">\n            <slot name=\"trailing\"></slot>\n          </div>\n        </div>\n      </header>\n    `;\n  }\n\n  private __renderTwoRow(cssClasses: Record<string, boolean>) {\n    return html`\n      <header class=${classMap(cssClasses)} role=\"banner\">\n        <div class=\"background\"></div>\n        <div class=\"row row-top\">\n          <div class=\"leading\">\n            <slot name=\"leading\"></slot>\n          </div>\n          <div class=\"trailing\">\n            <slot name=\"trailing\"></slot>\n          </div>\n        </div>\n        <div class=\"row row-bottom\">\n          <div class=\"headline\">\n            <slot></slot>\n          </div>\n        </div>\n      </header>\n    `;\n  }\n}\n"],"names":["LitElement","html","classMap","styles","colorStyles","property"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuEG;AAEI,IAAM,MAAM,GAAZ,MAAM,MAAO,SAAQA,GAAU,CAAA;AAA/B,IAAA,WAAA,GAAA;;AAGL;;;;;;AAMG;QAEH,IAAA,CAAA,OAAO,GAAoD,OAAO;AAElE;;;AAGG;QAEH,IAAA,CAAA,QAAQ,GAAY,KAAK;IAwD3B;IAtDW,MAAM,GAAA;AACb,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,OAAO,KAAK,QAAQ,IAAI,IAAI,CAAC,OAAO,KAAK,OAAO;AAEtE,QAAA,MAAM,UAAU,GAAG;AACjB,YAAA,SAAS,EAAE,IAAI;AACf,YAAA,CAAC,WAAW,IAAI,CAAC,OAAO,CAAA,CAAE,GAAG,IAAI;YACjC,QAAQ,EAAE,IAAI,CAAC,QAAQ;SACxB;QAED,IAAI,QAAQ,EAAE;AACZ,YAAA,OAAO,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC;QACxC;AACA,QAAA,OAAO,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAAC;IAC3C;AAEQ,IAAA,iBAAiB,CAAC,UAAmC,EAAA;AAC3D,QAAA,OAAOC,CAAI,CAAA;sBACOC,CAAQ,CAAC,UAAU,CAAC,CAAA;;;;;;;;;;;;;;KAcrC;IACH;AAEQ,IAAA,cAAc,CAAC,UAAmC,EAAA;AACxD,QAAA,OAAOD,CAAI,CAAA;sBACOC,CAAQ,CAAC,UAAU,CAAC,CAAA;;;;;;;;;;;;;;;;KAgBrC;IACH;;AAxEO,MAAA,CAAA,MAAM,GAAG,CAACC,UAAM,EAAEC,QAAW,CAAC;AAUrC,UAAA,CAAA;IADCC,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AAC0B,CAAA,EAAA,MAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAOnE,UAAA,CAAA;IADCA,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAChB,CAAA,EAAA,MAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AAlBf,MAAM,GAAA,UAAA,CAAA;IADlB;AACY,CAAA,EAAA,MAAM,CA0ElB;;;;"}
+{"version":3,"file":"app-bar.js","sources":["../../src/app-bar/app-bar.ts"],"sourcesContent":["import { LitElement, html } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport IndividualComponent from '@/IndividualComponent.js';\nimport styles from './app-bar.scss';\nimport colorStyles from './app-bar-colors.scss';\n\n/**\n * @label App Bar\n * @tag wc-app-bar\n * @rawTag app-bar\n *\n * @summary A top app bar for page-level navigation and actions.\n * @overview\n * <p>The app bar component implements the top app bar pattern. It provides a\n * consistent header for screens, housing a navigation icon, a page title/headline, and\n * optional trailing action icons.</p>\n *\n * <p>Four size variants are available: <strong>small</strong> (64dp, single-row),\n * <strong>center-aligned</strong> (64dp, centred headline), <strong>medium</strong>\n * (112dp, headline below the row), and <strong>large</strong> (152dp, large headline).</p>\n *\n * <p>Use the <code>leading</code> slot for a navigation icon (e.g. a hamburger or back\n * button), the default slot for the headline text, and the <code>trailing</code> slot for\n * action icon buttons.</p>\n *\n * @slot leading - Navigation icon placed at the start of the bar.\n * @slot - Headline / title text.\n * @slot trailing - Trailing action icon buttons placed at the end of the bar.\n *\n * @cssprop --app-bar-container-color - Background color of the app bar.\n * @cssprop --app-bar-container-height - Height of the bar in small / center-aligned variants.\n * @cssprop --app-bar-headline-color - Color of the headline text.\n * @cssprop --app-bar-leading-icon-color - Color of the leading slot icons.\n * @cssprop --app-bar-trailing-icon-color - Color of the trailing slot icons.\n * @cssprop --app-bar-shadow - Box-shadow applied when the bar is scrolled / elevated.\n *\n * @example\n * ```html\n * <!-- Small app bar (default) -->\n * <wc-app-bar>\n *   <wc-icon-button slot=\"leading\" variant=\"text\"><wc-icon name=\"menu\"></wc-icon></wc-icon-button>\n *   Page Title\n *   <wc-icon-button slot=\"trailing\" variant=\"text\"><wc-icon name=\"search\"></wc-icon></wc-icon-button>\n *   <wc-icon-button slot=\"trailing\" variant=\"text\"><wc-icon name=\"more_vert\"></wc-icon></wc-icon-button>\n * </wc-app-bar>\n * ```\n *\n * @example\n * ```html\n * <!-- Center-aligned app bar -->\n * <wc-app-bar variant=\"center-aligned\">\n *   <wc-icon-button slot=\"leading\" variant=\"text\"><wc-icon name=\"arrow_back\"></wc-icon></wc-icon-button>\n *   Details\n *   <wc-icon-button slot=\"trailing\" variant=\"text\"><wc-icon name=\"more_vert\"></wc-icon></wc-icon-button>\n * </wc-app-bar>\n * ```\n *\n * @example\n * ```html\n * <!-- Medium app bar -->\n * <wc-app-bar variant=\"medium\">\n *   <wc-icon-button slot=\"leading\" variant=\"text\"><wc-icon name=\"menu\"></wc-icon></wc-icon-button>\n *   Medium Headline\n *   <wc-icon-button slot=\"trailing\" variant=\"text\"><wc-icon name=\"search\"></wc-icon></wc-icon-button>\n * </wc-app-bar>\n * ```\n *\n * @example\n * ```html\n * <!-- Large app bar -->\n * <wc-app-bar variant=\"large\">\n *   <wc-icon-button slot=\"leading\" variant=\"text\"><wc-icon name=\"arrow_back\"></wc-icon></wc-icon-button>\n *   Large Headline\n *   <wc-icon-button slot=\"trailing\" variant=\"text\"><wc-icon name=\"more_vert\"></wc-icon></wc-icon-button>\n * </wc-app-bar>\n * ```\n * @tags navigation display\n */\n@IndividualComponent\nexport class AppBar extends LitElement {\n  static styles = [styles, colorStyles];\n\n  /**\n   * Visual variant of the app bar.\n   * - `\"small\"`: 64dp single-row bar with leading, title, and trailing (default).\n   * - `\"center-aligned\"`: 64dp single-row bar with a centred headline.\n   * - `\"medium\"`: Two-row bar (64dp top row + 48dp headline row).\n   * - `\"large\"`: Two-row bar with a larger headline (64dp top row + 88dp headline row).\n   */\n  @property({ type: String, reflect: true })\n  variant: 'small' | 'center-aligned' | 'medium' | 'large' = 'small';\n\n  /**\n   * Whether the bar is in its scrolled state, which adds a shadow and optionally\n   * changes the container color to indicate elevation above page content.\n   */\n  @property({ type: Boolean, reflect: true })\n  scrolled: boolean = false;\n\n  override render() {\n    const isTwoRow = this.variant === 'medium' || this.variant === 'large';\n\n    const cssClasses = {\n      'app-bar': true,\n      [`variant-${this.variant}`]: true,\n      scrolled: this.scrolled,\n    };\n\n    if (isTwoRow) {\n      return this.__renderTwoRow(cssClasses);\n    }\n    return this.__renderSingleRow(cssClasses);\n  }\n\n  private __renderSingleRow(cssClasses: Record<string, boolean>) {\n    return html`\n      <header class=${classMap(cssClasses)} role=\"banner\">\n        <div class=\"background\"></div>\n        <div class=\"row row-top\">\n          <div class=\"leading\">\n            <slot name=\"leading\"></slot>\n          </div>\n          <div class=\"headline\">\n            <slot></slot>\n          </div>\n          <div class=\"trailing\">\n            <slot name=\"trailing\"></slot>\n          </div>\n        </div>\n      </header>\n    `;\n  }\n\n  private __renderTwoRow(cssClasses: Record<string, boolean>) {\n    return html`\n      <header class=${classMap(cssClasses)} role=\"banner\">\n        <div class=\"background\"></div>\n        <div class=\"row row-top\">\n          <div class=\"leading\">\n            <slot name=\"leading\"></slot>\n          </div>\n          <div class=\"trailing\">\n            <slot name=\"trailing\"></slot>\n          </div>\n        </div>\n        <div class=\"row row-bottom\">\n          <div class=\"headline\">\n            <slot></slot>\n          </div>\n        </div>\n      </header>\n    `;\n  }\n}\n"],"names":["LitElement","html","classMap","styles","colorStyles","property"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuEG;AAEI,IAAM,MAAM,GAAZ,MAAM,MAAO,SAAQA,GAAU,CAAA;AAA/B,IAAA,WAAA,GAAA;;AAGL;;;;;;AAMG;QAEH,IAAA,CAAA,OAAO,GAAoD,OAAO;AAElE;;;AAGG;QAEH,IAAA,CAAA,QAAQ,GAAY,KAAK;IAwD3B;IAtDW,MAAM,GAAA;AACb,QAAA,MAAM,QAAQ,GAAG,IAAI,CAAC,OAAO,KAAK,QAAQ,IAAI,IAAI,CAAC,OAAO,KAAK,OAAO;AAEtE,QAAA,MAAM,UAAU,GAAG;AACjB,YAAA,SAAS,EAAE,IAAI;AACf,YAAA,CAAC,WAAW,IAAI,CAAC,OAAO,CAAA,CAAE,GAAG,IAAI;YACjC,QAAQ,EAAE,IAAI,CAAC,QAAQ;SACxB;QAED,IAAI,QAAQ,EAAE;AACZ,YAAA,OAAO,IAAI,CAAC,cAAc,CAAC,UAAU,CAAC;QACxC;AACA,QAAA,OAAO,IAAI,CAAC,iBAAiB,CAAC,UAAU,CAAC;IAC3C;AAEQ,IAAA,iBAAiB,CAAC,UAAmC,EAAA;AAC3D,QAAA,OAAOC,CAAI,CAAA;sBACOC,CAAQ,CAAC,UAAU,CAAC,CAAA;;;;;;;;;;;;;;KAcrC;IACH;AAEQ,IAAA,cAAc,CAAC,UAAmC,EAAA;AACxD,QAAA,OAAOD,CAAI,CAAA;sBACOC,CAAQ,CAAC,UAAU,CAAC,CAAA;;;;;;;;;;;;;;;;KAgBrC;IACH;;AAxEO,MAAA,CAAA,MAAM,GAAG,CAACC,UAAM,EAAEC,QAAW,CAAC;AAUrC,UAAA,CAAA;IADCC,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AAC0B,CAAA,EAAA,MAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAOnE,UAAA,CAAA;IADCA,CAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE;AAChB,CAAA,EAAA,MAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AAlBf,MAAM,GAAA,UAAA,CAAA;IADlB;AACY,CAAA,EAAA,MAAM,CA0ElB;;;;"}

package/dist/assets/components.css

@@ -1,2 +1,2 @@
-*{box-sizing:border-box}.screen-reader-only{display:none !important}[hidden]{display:none !important}.text-display{font-family:var(--typography-display-medium-font-family) !important;font-size:var(--typography-display-medium-font-size) !important;font-weight:var(--typography-display-medium-font-weight) !important;line-height:var(--typography-display-medium-line-height) !important;letter-spacing:var(--typography-display-medium-letter-spacing) !important}.text-display-emphasized{font-family:var(--typography-display-medium-emphasized-font-family) !important;font-size:var(--typography-display-medium-emphasized-font-size) !important;font-weight:var(--typography-display-medium-emphasized-font-weight) !important;line-height:var(--typography-display-medium-emphasized-line-height) !important;letter-spacing:var(--typography-display-medium-emphasized-letter-spacing) !important}.text-display-large{font-family:var(--typography-display-large-font-family) !important;font-size:var(--typography-display-large-font-size) !important;font-weight:var(--typography-display-large-font-weight) !important;line-height:var(--typography-display-large-line-height) !important;letter-spacing:var(--typography-display-large-letter-spacing) !important}.text-display-large-emphasized{font-family:var(--typography-display-large-emphasized-font-family) !important;font-size:var(--typography-display-large-emphasized-font-size) !important;font-weight:var(--typography-display-large-emphasized-font-weight) !important;line-height:var(--typography-display-large-emphasized-line-height) !important;letter-spacing:var(--typography-display-large-emphasized-letter-spacing) !important}.text-display-medium{font-family:var(--typography-display-medium-font-family) !important;font-size:var(--typography-display-medium-font-size) !important;font-weight:var(--typography-display-medium-font-weight) !important;line-height:var(--typography-display-medium-line-height) !important;letter-spacing:var(--typography-display-medium-letter-spacing) !important}.text-display-medium-emphasized{font-family:var(--typography-display-medium-emphasized-font-family) !important;font-size:var(--typography-display-medium-emphasized-font-size) !important;font-weight:var(--typography-display-medium-emphasized-font-weight) !important;line-height:var(--typography-display-medium-emphasized-line-height) !important;letter-spacing:var(--typography-display-medium-emphasized-letter-spacing) !important}.text-display-small{font-family:var(--typography-display-small-font-family) !important;font-size:var(--typography-display-small-font-size) !important;font-weight:var(--typography-display-small-font-weight) !important;line-height:var(--typography-display-small-line-height) !important;letter-spacing:var(--typography-display-small-letter-spacing) !important}.text-display-small-emphasized{font-family:var(--typography-display-small-emphasized-font-family) !important;font-size:var(--typography-display-small-emphasized-font-size) !important;font-weight:var(--typography-display-small-emphasized-font-weight) !important;line-height:var(--typography-display-small-emphasized-line-height) !important;letter-spacing:var(--typography-display-small-emphasized-letter-spacing) !important}.text-headline{font-family:var(--typography-headline-medium-font-family) !important;font-size:var(--typography-headline-medium-font-size) !important;font-weight:var(--typography-headline-medium-font-weight) !important;line-height:var(--typography-headline-medium-line-height) !important;letter-spacing:var(--typography-headline-medium-letter-spacing) !important}.text-headline-emphasized{font-family:var(--typography-headline-medium-emphasized-font-family) !important;font-size:var(--typography-headline-medium-emphasized-font-size) !important;font-weight:var(--typography-headline-medium-emphasized-font-weight) !important;line-height:var(--typography-headline-medium-emphasized-line-height) !important;letter-spacing:var(--typography-headline-medium-emphasized-letter-spacing) !important}.text-headline-large{font-family:var(--typography-headline-large-font-family) !important;font-size:var(--typography-headline-large-font-size) !important;font-weight:var(--typography-headline-large-font-weight) !important;line-height:var(--typography-headline-large-line-height) !important;letter-spacing:var(--typography-headline-large-letter-spacing) !important}.text-headline-large-emphasized{font-family:var(--typography-headline-large-emphasized-font-family) !important;font-size:var(--typography-headline-large-emphasized-font-size) !important;font-weight:var(--typography-headline-large-emphasized-font-weight) !important;line-height:var(--typography-headline-large-emphasized-line-height) !important;letter-spacing:var(--typography-headline-large-emphasized-letter-spacing) !important}.text-headline-medium{font-family:var(--typography-headline-medium-font-family) !important;font-size:var(--typography-headline-medium-font-size) !important;font-weight:var(--typography-headline-medium-font-weight) !important;line-height:var(--typography-headline-medium-line-height) !important;letter-spacing:var(--typography-headline-medium-letter-spacing) !important}.text-headline-medium-emphasized{font-family:var(--typography-headline-medium-emphasized-font-family) !important;font-size:var(--typography-headline-medium-emphasized-font-size) !important;font-weight:var(--typography-headline-medium-emphasized-font-weight) !important;line-height:var(--typography-headline-medium-emphasized-line-height) !important;letter-spacing:var(--typography-headline-medium-emphasized-letter-spacing) !important}.text-headline-small{font-family:var(--typography-headline-small-font-family) !important;font-size:var(--typography-headline-small-font-size) !important;font-weight:var(--typography-headline-small-font-weight) !important;line-height:var(--typography-headline-small-line-height) !important;letter-spacing:var(--typography-headline-small-letter-spacing) !important}.text-headline-small-emphasized{font-family:var(--typography-headline-small-emphasized-font-family) !important;font-size:var(--typography-headline-small-emphasized-font-size) !important;font-weight:var(--typography-headline-small-emphasized-font-weight) !important;line-height:var(--typography-headline-small-emphasized-line-height) !important;letter-spacing:var(--typography-headline-small-emphasized-letter-spacing) !important}.text-body{font-family:var(--typography-body-medium-font-family) !important;font-size:var(--typography-body-medium-font-size) !important;font-weight:var(--typography-body-medium-font-weight) !important;line-height:var(--typography-body-medium-line-height) !important;letter-spacing:var(--typography-body-medium-letter-spacing) !important}.text-body-emphasized{font-family:var(--typography-body-medium-emphasized-font-family) !important;font-size:var(--typography-body-medium-emphasized-font-size) !important;font-weight:var(--typography-body-medium-emphasized-font-weight) !important;line-height:var(--typography-body-medium-emphasized-line-height) !important;letter-spacing:var(--typography-body-medium-emphasized-letter-spacing) !important}.text-body-large{font-family:var(--typography-body-large-font-family) !important;font-size:var(--typography-body-large-font-size) !important;font-weight:var(--typography-body-large-font-weight) !important;line-height:var(--typography-body-large-line-height) !important;letter-spacing:var(--typography-body-large-letter-spacing) !important}.text-body-large-emphasized{font-family:var(--typography-body-large-emphasized-font-family) !important;font-size:var(--typography-body-large-emphasized-font-size) !important;font-weight:var(--typography-body-large-emphasized-font-weight) !important;line-height:var(--typography-body-large-emphasized-line-height) !important;letter-spacing:var(--typography-body-large-emphasized-letter-spacing) !important}.text-body-medium{font-family:var(--typography-body-medium-font-family) !important;font-size:var(--typography-body-medium-font-size) !important;font-weight:var(--typography-body-medium-font-weight) !important;line-height:var(--typography-body-medium-line-height) !important;letter-spacing:var(--typography-body-medium-letter-spacing) !important}.text-body-medium-emphasized{font-family:var(--typography-body-medium-emphasized-font-family) !important;font-size:var(--typography-body-medium-emphasized-font-size) !important;font-weight:var(--typography-body-medium-emphasized-font-weight) !important;line-height:var(--typography-body-medium-emphasized-line-height) !important;letter-spacing:var(--typography-body-medium-emphasized-letter-spacing) !important}.text-body-small{font-family:var(--typography-body-small-font-family) !important;font-size:var(--typography-body-small-font-size) !important;font-weight:var(--typography-body-small-font-weight) !important;line-height:var(--typography-body-small-line-height) !important;letter-spacing:var(--typography-body-small-letter-spacing) !important}.text-body-small-emphasized{font-family:var(--typography-body-small-emphasized-font-family) !important;font-size:var(--typography-body-small-emphasized-font-size) !important;font-weight:var(--typography-body-small-emphasized-font-weight) !important;line-height:var(--typography-body-small-emphasized-line-height) !important;letter-spacing:var(--typography-body-small-emphasized-letter-spacing) !important}.text-code{font-family:var(--typography-code-medium-font-family) !important;font-size:var(--typography-code-medium-font-size) !important;font-weight:var(--typography-code-medium-font-weight) !important;line-height:var(--typography-code-medium-line-height) !important;letter-spacing:var(--typography-code-medium-letter-spacing) !important}.text-code-emphasized{font-family:var(--typography-code-medium-emphasized-font-family) !important;font-size:var(--typography-code-medium-emphasized-font-size) !important;font-weight:var(--typography-code-medium-emphasized-font-weight) !important;line-height:var(--typography-code-medium-emphasized-line-height) !important;letter-spacing:var(--typography-code-medium-emphasized-letter-spacing) !important}.text-code-large{font-family:var(--typography-code-large-font-family) !important;font-size:var(--typography-code-large-font-size) !important;font-weight:var(--typography-code-large-font-weight) !important;line-height:var(--typography-code-large-line-height) !important;letter-spacing:var(--typography-code-large-letter-spacing) !important}.text-code-large-emphasized{font-family:var(--typography-code-large-emphasized-font-family) !important;font-size:var(--typography-code-large-emphasized-font-size) !important;font-weight:var(--typography-code-large-emphasized-font-weight) !important;line-height:var(--typography-code-large-emphasized-line-height) !important;letter-spacing:var(--typography-code-large-emphasized-letter-spacing) !important}.text-code-medium{font-family:var(--typography-code-medium-font-family) !important;font-size:var(--typography-code-medium-font-size) !important;font-weight:var(--typography-code-medium-font-weight) !important;line-height:var(--typography-code-medium-line-height) !important;letter-spacing:var(--typography-code-medium-letter-spacing) !important}.text-code-medium-emphasized{font-family:var(--typography-code-medium-emphasized-font-family) !important;font-size:var(--typography-code-medium-emphasized-font-size) !important;font-weight:var(--typography-code-medium-emphasized-font-weight) !important;line-height:var(--typography-code-medium-emphasized-line-height) !important;letter-spacing:var(--typography-code-medium-emphasized-letter-spacing) !important}.text-code-small{font-family:var(--typography-code-small-font-family) !important;font-size:var(--typography-code-small-font-size) !important;font-weight:var(--typography-code-small-font-weight) !important;line-height:var(--typography-code-small-line-height) !important;letter-spacing:var(--typography-code-small-letter-spacing) !important}.text-code-small-emphasized{font-family:var(--typography-code-small-emphasized-font-family) !important;font-size:var(--typography-code-small-emphasized-font-size) !important;font-weight:var(--typography-code-small-emphasized-font-weight) !important;line-height:var(--typography-code-small-emphasized-line-height) !important;letter-spacing:var(--typography-code-small-emphasized-letter-spacing) !important}.text-label{font-family:var(--typography-label-medium-font-family) !important;font-size:var(--typography-label-medium-font-size) !important;font-weight:var(--typography-label-medium-font-weight) !important;line-height:var(--typography-label-medium-line-height) !important;letter-spacing:var(--typography-label-medium-letter-spacing) !important}.text-label-emphasized{font-family:var(--typography-label-medium-emphasized-font-family) !important;font-size:var(--typography-label-medium-emphasized-font-size) !important;font-weight:var(--typography-label-medium-emphasized-font-weight) !important;line-height:var(--typography-label-medium-emphasized-line-height) !important;letter-spacing:var(--typography-label-medium-emphasized-letter-spacing) !important}.text-label-large{font-family:var(--typography-label-large-font-family) !important;font-size:var(--typography-label-large-font-size) !important;font-weight:var(--typography-label-large-font-weight) !important;line-height:var(--typography-label-large-line-height) !important;letter-spacing:var(--typography-label-large-letter-spacing) !important}.text-label-large-emphasized{font-family:var(--typography-label-large-emphasized-font-family) !important;font-size:var(--typography-label-large-emphasized-font-size) !important;font-weight:var(--typography-label-large-emphasized-font-weight) !important;line-height:var(--typography-label-large-emphasized-line-height) !important;letter-spacing:var(--typography-label-large-emphasized-letter-spacing) !important}.text-label-medium{font-family:var(--typography-label-medium-font-family) !important;font-size:var(--typography-label-medium-font-size) !important;font-weight:var(--typography-label-medium-font-weight) !important;line-height:var(--typography-label-medium-line-height) !important;letter-spacing:var(--typography-label-medium-letter-spacing) !important}.text-label-medium-emphasized{font-family:var(--typography-label-medium-emphasized-font-family) !important;font-size:var(--typography-label-medium-emphasized-font-size) !important;font-weight:var(--typography-label-medium-emphasized-font-weight) !important;line-height:var(--typography-label-medium-emphasized-line-height) !important;letter-spacing:var(--typography-label-medium-emphasized-letter-spacing) !important}.text-label-small{font-family:var(--typography-label-small-font-family) !important;font-size:var(--typography-label-small-font-size) !important;font-weight:var(--typography-label-small-font-weight) !important;line-height:var(--typography-label-small-line-height) !important;letter-spacing:var(--typography-label-small-letter-spacing) !important}.text-label-small-emphasized{font-family:var(--typography-label-small-emphasized-font-family) !important;font-size:var(--typography-label-small-emphasized-font-size) !important;font-weight:var(--typography-label-small-emphasized-font-weight) !important;line-height:var(--typography-label-small-emphasized-line-height) !important;letter-spacing:var(--typography-label-small-emphasized-letter-spacing) !important}.text-title{font-family:var(--typography-title-medium-font-family) !important;font-size:var(--typography-title-medium-font-size) !important;font-weight:var(--typography-title-medium-font-weight) !important;line-height:var(--typography-title-medium-line-height) !important;letter-spacing:var(--typography-title-medium-letter-spacing) !important}.text-title-emphasized{font-family:var(--typography-title-medium-emphasized-font-family) !important;font-size:var(--typography-title-medium-emphasized-font-size) !important;font-weight:var(--typography-title-medium-emphasized-font-weight) !important;line-height:var(--typography-title-medium-emphasized-line-height) !important;letter-spacing:var(--typography-title-medium-emphasized-letter-spacing) !important}.text-title-large{font-family:var(--typography-title-large-font-family) !important;font-size:var(--typography-title-large-font-size) !important;font-weight:var(--typography-title-large-font-weight) !important;line-height:var(--typography-title-large-line-height) !important;letter-spacing:var(--typography-title-large-letter-spacing) !important}.text-title-large-emphasized{font-family:var(--typography-title-large-emphasized-font-family) !important;font-size:var(--typography-title-large-emphasized-font-size) !important;font-weight:var(--typography-title-large-emphasized-font-weight) !important;line-height:var(--typography-title-large-emphasized-line-height) !important;letter-spacing:var(--typography-title-large-emphasized-letter-spacing) !important}.text-title-medium{font-family:var(--typography-title-medium-font-family) !important;font-size:var(--typography-title-medium-font-size) !important;font-weight:var(--typography-title-medium-font-weight) !important;line-height:var(--typography-title-medium-line-height) !important;letter-spacing:var(--typography-title-medium-letter-spacing) !important}.text-title-medium-emphasized{font-family:var(--typography-title-medium-emphasized-font-family) !important;font-size:var(--typography-title-medium-emphasized-font-size) !important;font-weight:var(--typography-title-medium-emphasized-font-weight) !important;line-height:var(--typography-title-medium-emphasized-line-height) !important;letter-spacing:var(--typography-title-medium-emphasized-letter-spacing) !important}.text-title-small{font-family:var(--typography-title-small-font-family) !important;font-size:var(--typography-title-small-font-size) !important;font-weight:var(--typography-title-small-font-weight) !important;line-height:var(--typography-title-small-line-height) !important;letter-spacing:var(--typography-title-small-letter-spacing) !important}.text-title-small-emphasized{font-family:var(--typography-title-small-emphasized-font-family) !important;font-size:var(--typography-title-small-emphasized-font-size) !important;font-weight:var(--typography-title-small-emphasized-font-weight) !important;line-height:var(--typography-title-small-emphasized-line-height) !important;letter-spacing:var(--typography-title-small-emphasized-letter-spacing) !important}.text-code-block{background-color:var(--color-surface-variant);text-shadow:0 1px 1px var(--color-surface-variant);color:var(--color-on-surface);border-radius:var(--shape-corner-extra-small);padding:var(--spacing-050);font-family:var(--font-family-monospace);display:inline-block;max-width:100%;white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere;vertical-align:middle}*{box-sizing:border-box}.screen-reader-only{display:none !important}[hidden]{display:none !important}.link{border-radius:inherit;corner-shape:inherit;color:var(--color-primary);--icon-color: currentColor;text-decoration:none}.link:hover,.link:focus-visible{text-decoration:underline}.link.inherit{color:inherit;text-decoration:none !important}.link.with-icon{display:inline-flex;align-items:center;gap:.5em}
+*{box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.screen-reader-only{display:none !important}[hidden]{display:none !important}.text-display{font-family:var(--typography-display-medium-font-family) !important;font-size:var(--typography-display-medium-font-size) !important;font-weight:var(--typography-display-medium-font-weight) !important;line-height:var(--typography-display-medium-line-height) !important;letter-spacing:var(--typography-display-medium-letter-spacing) !important}.text-display-emphasized{font-family:var(--typography-display-medium-emphasized-font-family) !important;font-size:var(--typography-display-medium-emphasized-font-size) !important;font-weight:var(--typography-display-medium-emphasized-font-weight) !important;line-height:var(--typography-display-medium-emphasized-line-height) !important;letter-spacing:var(--typography-display-medium-emphasized-letter-spacing) !important}.text-display-large{font-family:var(--typography-display-large-font-family) !important;font-size:var(--typography-display-large-font-size) !important;font-weight:var(--typography-display-large-font-weight) !important;line-height:var(--typography-display-large-line-height) !important;letter-spacing:var(--typography-display-large-letter-spacing) !important}.text-display-large-emphasized{font-family:var(--typography-display-large-emphasized-font-family) !important;font-size:var(--typography-display-large-emphasized-font-size) !important;font-weight:var(--typography-display-large-emphasized-font-weight) !important;line-height:var(--typography-display-large-emphasized-line-height) !important;letter-spacing:var(--typography-display-large-emphasized-letter-spacing) !important}.text-display-medium{font-family:var(--typography-display-medium-font-family) !important;font-size:var(--typography-display-medium-font-size) !important;font-weight:var(--typography-display-medium-font-weight) !important;line-height:var(--typography-display-medium-line-height) !important;letter-spacing:var(--typography-display-medium-letter-spacing) !important}.text-display-medium-emphasized{font-family:var(--typography-display-medium-emphasized-font-family) !important;font-size:var(--typography-display-medium-emphasized-font-size) !important;font-weight:var(--typography-display-medium-emphasized-font-weight) !important;line-height:var(--typography-display-medium-emphasized-line-height) !important;letter-spacing:var(--typography-display-medium-emphasized-letter-spacing) !important}.text-display-small{font-family:var(--typography-display-small-font-family) !important;font-size:var(--typography-display-small-font-size) !important;font-weight:var(--typography-display-small-font-weight) !important;line-height:var(--typography-display-small-line-height) !important;letter-spacing:var(--typography-display-small-letter-spacing) !important}.text-display-small-emphasized{font-family:var(--typography-display-small-emphasized-font-family) !important;font-size:var(--typography-display-small-emphasized-font-size) !important;font-weight:var(--typography-display-small-emphasized-font-weight) !important;line-height:var(--typography-display-small-emphasized-line-height) !important;letter-spacing:var(--typography-display-small-emphasized-letter-spacing) !important}.text-headline{font-family:var(--typography-headline-medium-font-family) !important;font-size:var(--typography-headline-medium-font-size) !important;font-weight:var(--typography-headline-medium-font-weight) !important;line-height:var(--typography-headline-medium-line-height) !important;letter-spacing:var(--typography-headline-medium-letter-spacing) !important}.text-headline-emphasized{font-family:var(--typography-headline-medium-emphasized-font-family) !important;font-size:var(--typography-headline-medium-emphasized-font-size) !important;font-weight:var(--typography-headline-medium-emphasized-font-weight) !important;line-height:var(--typography-headline-medium-emphasized-line-height) !important;letter-spacing:var(--typography-headline-medium-emphasized-letter-spacing) !important}.text-headline-large{font-family:var(--typography-headline-large-font-family) !important;font-size:var(--typography-headline-large-font-size) !important;font-weight:var(--typography-headline-large-font-weight) !important;line-height:var(--typography-headline-large-line-height) !important;letter-spacing:var(--typography-headline-large-letter-spacing) !important}.text-headline-large-emphasized{font-family:var(--typography-headline-large-emphasized-font-family) !important;font-size:var(--typography-headline-large-emphasized-font-size) !important;font-weight:var(--typography-headline-large-emphasized-font-weight) !important;line-height:var(--typography-headline-large-emphasized-line-height) !important;letter-spacing:var(--typography-headline-large-emphasized-letter-spacing) !important}.text-headline-medium{font-family:var(--typography-headline-medium-font-family) !important;font-size:var(--typography-headline-medium-font-size) !important;font-weight:var(--typography-headline-medium-font-weight) !important;line-height:var(--typography-headline-medium-line-height) !important;letter-spacing:var(--typography-headline-medium-letter-spacing) !important}.text-headline-medium-emphasized{font-family:var(--typography-headline-medium-emphasized-font-family) !important;font-size:var(--typography-headline-medium-emphasized-font-size) !important;font-weight:var(--typography-headline-medium-emphasized-font-weight) !important;line-height:var(--typography-headline-medium-emphasized-line-height) !important;letter-spacing:var(--typography-headline-medium-emphasized-letter-spacing) !important}.text-headline-small{font-family:var(--typography-headline-small-font-family) !important;font-size:var(--typography-headline-small-font-size) !important;font-weight:var(--typography-headline-small-font-weight) !important;line-height:var(--typography-headline-small-line-height) !important;letter-spacing:var(--typography-headline-small-letter-spacing) !important}.text-headline-small-emphasized{font-family:var(--typography-headline-small-emphasized-font-family) !important;font-size:var(--typography-headline-small-emphasized-font-size) !important;font-weight:var(--typography-headline-small-emphasized-font-weight) !important;line-height:var(--typography-headline-small-emphasized-line-height) !important;letter-spacing:var(--typography-headline-small-emphasized-letter-spacing) !important}.text-body{font-family:var(--typography-body-medium-font-family) !important;font-size:var(--typography-body-medium-font-size) !important;font-weight:var(--typography-body-medium-font-weight) !important;line-height:var(--typography-body-medium-line-height) !important;letter-spacing:var(--typography-body-medium-letter-spacing) !important}.text-body-emphasized{font-family:var(--typography-body-medium-emphasized-font-family) !important;font-size:var(--typography-body-medium-emphasized-font-size) !important;font-weight:var(--typography-body-medium-emphasized-font-weight) !important;line-height:var(--typography-body-medium-emphasized-line-height) !important;letter-spacing:var(--typography-body-medium-emphasized-letter-spacing) !important}.text-body-large{font-family:var(--typography-body-large-font-family) !important;font-size:var(--typography-body-large-font-size) !important;font-weight:var(--typography-body-large-font-weight) !important;line-height:var(--typography-body-large-line-height) !important;letter-spacing:var(--typography-body-large-letter-spacing) !important}.text-body-large-emphasized{font-family:var(--typography-body-large-emphasized-font-family) !important;font-size:var(--typography-body-large-emphasized-font-size) !important;font-weight:var(--typography-body-large-emphasized-font-weight) !important;line-height:var(--typography-body-large-emphasized-line-height) !important;letter-spacing:var(--typography-body-large-emphasized-letter-spacing) !important}.text-body-medium{font-family:var(--typography-body-medium-font-family) !important;font-size:var(--typography-body-medium-font-size) !important;font-weight:var(--typography-body-medium-font-weight) !important;line-height:var(--typography-body-medium-line-height) !important;letter-spacing:var(--typography-body-medium-letter-spacing) !important}.text-body-medium-emphasized{font-family:var(--typography-body-medium-emphasized-font-family) !important;font-size:var(--typography-body-medium-emphasized-font-size) !important;font-weight:var(--typography-body-medium-emphasized-font-weight) !important;line-height:var(--typography-body-medium-emphasized-line-height) !important;letter-spacing:var(--typography-body-medium-emphasized-letter-spacing) !important}.text-body-small{font-family:var(--typography-body-small-font-family) !important;font-size:var(--typography-body-small-font-size) !important;font-weight:var(--typography-body-small-font-weight) !important;line-height:var(--typography-body-small-line-height) !important;letter-spacing:var(--typography-body-small-letter-spacing) !important}.text-body-small-emphasized{font-family:var(--typography-body-small-emphasized-font-family) !important;font-size:var(--typography-body-small-emphasized-font-size) !important;font-weight:var(--typography-body-small-emphasized-font-weight) !important;line-height:var(--typography-body-small-emphasized-line-height) !important;letter-spacing:var(--typography-body-small-emphasized-letter-spacing) !important}.text-code{font-family:var(--typography-code-medium-font-family) !important;font-size:var(--typography-code-medium-font-size) !important;font-weight:var(--typography-code-medium-font-weight) !important;line-height:var(--typography-code-medium-line-height) !important;letter-spacing:var(--typography-code-medium-letter-spacing) !important}.text-code-emphasized{font-family:var(--typography-code-medium-emphasized-font-family) !important;font-size:var(--typography-code-medium-emphasized-font-size) !important;font-weight:var(--typography-code-medium-emphasized-font-weight) !important;line-height:var(--typography-code-medium-emphasized-line-height) !important;letter-spacing:var(--typography-code-medium-emphasized-letter-spacing) !important}.text-code-large{font-family:var(--typography-code-large-font-family) !important;font-size:var(--typography-code-large-font-size) !important;font-weight:var(--typography-code-large-font-weight) !important;line-height:var(--typography-code-large-line-height) !important;letter-spacing:var(--typography-code-large-letter-spacing) !important}.text-code-large-emphasized{font-family:var(--typography-code-large-emphasized-font-family) !important;font-size:var(--typography-code-large-emphasized-font-size) !important;font-weight:var(--typography-code-large-emphasized-font-weight) !important;line-height:var(--typography-code-large-emphasized-line-height) !important;letter-spacing:var(--typography-code-large-emphasized-letter-spacing) !important}.text-code-medium{font-family:var(--typography-code-medium-font-family) !important;font-size:var(--typography-code-medium-font-size) !important;font-weight:var(--typography-code-medium-font-weight) !important;line-height:var(--typography-code-medium-line-height) !important;letter-spacing:var(--typography-code-medium-letter-spacing) !important}.text-code-medium-emphasized{font-family:var(--typography-code-medium-emphasized-font-family) !important;font-size:var(--typography-code-medium-emphasized-font-size) !important;font-weight:var(--typography-code-medium-emphasized-font-weight) !important;line-height:var(--typography-code-medium-emphasized-line-height) !important;letter-spacing:var(--typography-code-medium-emphasized-letter-spacing) !important}.text-code-small{font-family:var(--typography-code-small-font-family) !important;font-size:var(--typography-code-small-font-size) !important;font-weight:var(--typography-code-small-font-weight) !important;line-height:var(--typography-code-small-line-height) !important;letter-spacing:var(--typography-code-small-letter-spacing) !important}.text-code-small-emphasized{font-family:var(--typography-code-small-emphasized-font-family) !important;font-size:var(--typography-code-small-emphasized-font-size) !important;font-weight:var(--typography-code-small-emphasized-font-weight) !important;line-height:var(--typography-code-small-emphasized-line-height) !important;letter-spacing:var(--typography-code-small-emphasized-letter-spacing) !important}.text-label{font-family:var(--typography-label-medium-font-family) !important;font-size:var(--typography-label-medium-font-size) !important;font-weight:var(--typography-label-medium-font-weight) !important;line-height:var(--typography-label-medium-line-height) !important;letter-spacing:var(--typography-label-medium-letter-spacing) !important}.text-label-emphasized{font-family:var(--typography-label-medium-emphasized-font-family) !important;font-size:var(--typography-label-medium-emphasized-font-size) !important;font-weight:var(--typography-label-medium-emphasized-font-weight) !important;line-height:var(--typography-label-medium-emphasized-line-height) !important;letter-spacing:var(--typography-label-medium-emphasized-letter-spacing) !important}.text-label-large{font-family:var(--typography-label-large-font-family) !important;font-size:var(--typography-label-large-font-size) !important;font-weight:var(--typography-label-large-font-weight) !important;line-height:var(--typography-label-large-line-height) !important;letter-spacing:var(--typography-label-large-letter-spacing) !important}.text-label-large-emphasized{font-family:var(--typography-label-large-emphasized-font-family) !important;font-size:var(--typography-label-large-emphasized-font-size) !important;font-weight:var(--typography-label-large-emphasized-font-weight) !important;line-height:var(--typography-label-large-emphasized-line-height) !important;letter-spacing:var(--typography-label-large-emphasized-letter-spacing) !important}.text-label-medium{font-family:var(--typography-label-medium-font-family) !important;font-size:var(--typography-label-medium-font-size) !important;font-weight:var(--typography-label-medium-font-weight) !important;line-height:var(--typography-label-medium-line-height) !important;letter-spacing:var(--typography-label-medium-letter-spacing) !important}.text-label-medium-emphasized{font-family:var(--typography-label-medium-emphasized-font-family) !important;font-size:var(--typography-label-medium-emphasized-font-size) !important;font-weight:var(--typography-label-medium-emphasized-font-weight) !important;line-height:var(--typography-label-medium-emphasized-line-height) !important;letter-spacing:var(--typography-label-medium-emphasized-letter-spacing) !important}.text-label-small{font-family:var(--typography-label-small-font-family) !important;font-size:var(--typography-label-small-font-size) !important;font-weight:var(--typography-label-small-font-weight) !important;line-height:var(--typography-label-small-line-height) !important;letter-spacing:var(--typography-label-small-letter-spacing) !important}.text-label-small-emphasized{font-family:var(--typography-label-small-emphasized-font-family) !important;font-size:var(--typography-label-small-emphasized-font-size) !important;font-weight:var(--typography-label-small-emphasized-font-weight) !important;line-height:var(--typography-label-small-emphasized-line-height) !important;letter-spacing:var(--typography-label-small-emphasized-letter-spacing) !important}.text-title{font-family:var(--typography-title-medium-font-family) !important;font-size:var(--typography-title-medium-font-size) !important;font-weight:var(--typography-title-medium-font-weight) !important;line-height:var(--typography-title-medium-line-height) !important;letter-spacing:var(--typography-title-medium-letter-spacing) !important}.text-title-emphasized{font-family:var(--typography-title-medium-emphasized-font-family) !important;font-size:var(--typography-title-medium-emphasized-font-size) !important;font-weight:var(--typography-title-medium-emphasized-font-weight) !important;line-height:var(--typography-title-medium-emphasized-line-height) !important;letter-spacing:var(--typography-title-medium-emphasized-letter-spacing) !important}.text-title-large{font-family:var(--typography-title-large-font-family) !important;font-size:var(--typography-title-large-font-size) !important;font-weight:var(--typography-title-large-font-weight) !important;line-height:var(--typography-title-large-line-height) !important;letter-spacing:var(--typography-title-large-letter-spacing) !important}.text-title-large-emphasized{font-family:var(--typography-title-large-emphasized-font-family) !important;font-size:var(--typography-title-large-emphasized-font-size) !important;font-weight:var(--typography-title-large-emphasized-font-weight) !important;line-height:var(--typography-title-large-emphasized-line-height) !important;letter-spacing:var(--typography-title-large-emphasized-letter-spacing) !important}.text-title-medium{font-family:var(--typography-title-medium-font-family) !important;font-size:var(--typography-title-medium-font-size) !important;font-weight:var(--typography-title-medium-font-weight) !important;line-height:var(--typography-title-medium-line-height) !important;letter-spacing:var(--typography-title-medium-letter-spacing) !important}.text-title-medium-emphasized{font-family:var(--typography-title-medium-emphasized-font-family) !important;font-size:var(--typography-title-medium-emphasized-font-size) !important;font-weight:var(--typography-title-medium-emphasized-font-weight) !important;line-height:var(--typography-title-medium-emphasized-line-height) !important;letter-spacing:var(--typography-title-medium-emphasized-letter-spacing) !important}.text-title-small{font-family:var(--typography-title-small-font-family) !important;font-size:var(--typography-title-small-font-size) !important;font-weight:var(--typography-title-small-font-weight) !important;line-height:var(--typography-title-small-line-height) !important;letter-spacing:var(--typography-title-small-letter-spacing) !important}.text-title-small-emphasized{font-family:var(--typography-title-small-emphasized-font-family) !important;font-size:var(--typography-title-small-emphasized-font-size) !important;font-weight:var(--typography-title-small-emphasized-font-weight) !important;line-height:var(--typography-title-small-emphasized-line-height) !important;letter-spacing:var(--typography-title-small-emphasized-letter-spacing) !important}.text-code-block{background-color:var(--color-surface-variant);text-shadow:0 1px 1px var(--color-surface-variant);color:var(--color-on-surface);border-radius:var(--shape-corner-extra-small);padding:var(--spacing-050);font-family:var(--font-family-monospace);display:inline-block;max-width:100%;white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere;vertical-align:middle}*{box-sizing:border-box;-webkit-tap-highlight-color:rgba(0,0,0,0)}.screen-reader-only{display:none !important}[hidden]{display:none !important}.link{border-radius:inherit;corner-shape:inherit;color:var(--color-primary);--icon-color: currentColor;text-decoration:none}.link:hover,.link:focus-visible{text-decoration:underline}.link.inherit{color:inherit;text-decoration:none !important}.link.with-icon{display:inline-flex;align-items:center;gap:.5em}
 /*# sourceMappingURL=components.css.map */

package/dist/assets/components.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["file:///home/runner/work/peacock/peacock/components/scss/mixin.scss","file:///home/runner/work/peacock/peacock/components/src/text/text.css-component.scss","file:///home/runner/work/peacock/peacock/components/src/link/link.css-component.scss"],"names":[],"mappings":"AACE,EACE,sBAGF,oBACE,wBAGF,SACE,wBCFF,cD8BA,oEACA,gEACA,oEACA,oEACA,0EC9BA,yBD0BA,+EACA,2EACA,+EACA,+EACA,qFClCA,oBD8BA,mEACA,+DACA,mEACA,mEACA,yEC9BA,+BD0BA,8EACA,0EACA,8EACA,8EACA,oFClCA,qBD8BA,oEACA,gEACA,oEACA,oEACA,0EC9BA,gCD0BA,+EACA,2EACA,+EACA,+EACA,qFClCA,oBD8BA,mEACA,+DACA,mEACA,mEACA,yEC9BA,+BD0BA,8EACA,0EACA,8EACA,8EACA,oFClCA,eD8BA,qEACA,iEACA,qEACA,qEACA,2EC9BA,0BD0BA,gFACA,4EACA,gFACA,gFACA,sFClCA,qBD8BA,oEACA,gEACA,oEACA,oEACA,0EC9BA,gCD0BA,+EACA,2EACA,+EACA,+EACA,qFClCA,sBD8BA,qEACA,iEACA,qEACA,qEACA,2EC9BA,iCD0BA,gFACA,4EACA,gFACA,gFACA,sFClCA,qBD8BA,oEACA,gEACA,oEACA,oEACA,0EC9BA,gCD0BA,+EACA,2EACA,+EACA,+EACA,qFClCA,WD8BA,iEACA,6DACA,iEACA,iEACA,uEC9BA,sBD0BA,4EACA,wEACA,4EACA,4EACA,kFClCA,iBD8BA,gEACA,4DACA,gEACA,gEACA,sEC9BA,4BD0BA,2EACA,uEACA,2EACA,2EACA,iFClCA,kBD8BA,iEACA,6DACA,iEACA,iEACA,uEC9BA,6BD0BA,4EACA,wEACA,4EACA,4EACA,kFClCA,iBD8BA,gEACA,4DACA,gEACA,gEACA,sEC9BA,4BD0BA,2EACA,uEACA,2EACA,2EACA,iFClCA,WD8BA,iEACA,6DACA,iEACA,iEACA,uEC9BA,sBD0BA,4EACA,wEACA,4EACA,4EACA,kFClCA,iBD8BA,gEACA,4DACA,gEACA,gEACA,sEC9BA,4BD0BA,2EACA,uEACA,2EACA,2EACA,iFClCA,kBD8BA,iEACA,6DACA,iEACA,iEACA,uEC9BA,6BD0BA,4EACA,wEACA,4EACA,4EACA,kFClCA,iBD8BA,gEACA,4DACA,gEACA,gEACA,sEC9BA,4BD0BA,2EACA,uEACA,2EACA,2EACA,iFClCA,YD8BA,kEACA,8DACA,kEACA,kEACA,wEC9BA,uBD0BA,6EACA,yEACA,6EACA,6EACA,mFClCA,kBD8BA,iEACA,6DACA,iEACA,iEACA,uEC9BA,6BD0BA,4EACA,wEACA,4EACA,4EACA,kFClCA,mBD8BA,kEACA,8DACA,kEACA,kEACA,wEC9BA,8BD0BA,6EACA,yEACA,6EACA,6EACA,mFClCA,kBD8BA,iEACA,6DACA,iEACA,iEACA,uEC9BA,6BD0BA,4EACA,wEACA,4EACA,4EACA,kFClCA,YD8BA,kEACA,8DACA,kEACA,kEACA,wEC9BA,uBD0BA,6EACA,yEACA,6EACA,6EACA,mFClCA,kBD8BA,iEACA,6DACA,iEACA,iEACA,uEC9BA,6BD0BA,4EACA,wEACA,4EACA,4EACA,kFClCA,mBD8BA,kEACA,8DACA,kEACA,kEACA,wEC9BA,8BD0BA,6EACA,yEACA,6EACA,6EACA,mFClCA,kBD8BA,iEACA,6DACA,iEACA,iEACA,uEC9BA,6BD0BA,4EACA,wEACA,4EACA,4EACA,kFCVF,iBACE,8CACA,mDACA,8BACA,8CACA,2BACA,yCAEA,qBACA,eACA,qBACA,sBACA,uBACA,sBD5CA,EACE,sBAGF,oBACE,wBAGF,SACE,wBENJ,MACE,sBACA,qBAEA,2BACA,2BACA,qBAEA,gCACE,0BAGF,cACE,cACA,gCAGF,gBACE,oBACA,mBACA","sourcesContent":["@mixin base-styles {\n  * {\n    box-sizing: border-box;\n  }\n\n  .screen-reader-only {\n    display: none !important;\n  }\n\n  [hidden] {\n    display: none !important;\n  }\n}\n\n@mixin reset-button-styles {\n  background: transparent;\n  border: none;\n  appearance: none;\n  margin: 0;\n  outline: none;\n  padding: 0;\n}\n\n@mixin reset-link-styles {\n  text-decoration: none;\n  color: inherit;\n  cursor: pointer;\n\n  &:link,\n  &:visited,\n  &:hover,\n  &:active {\n    text-decoration: none;\n    color: inherit;\n  }\n}\n\n@mixin get-typography($name) {\n  font-family: var(--typography-#{$name}-font-family) !important;\n  font-size: var(--typography-#{$name}-font-size) !important;\n  font-weight: var(--typography-#{$name}-font-weight) !important;\n  line-height: var(--typography-#{$name}-line-height) !important;\n  letter-spacing: var(--typography-#{$name}-letter-spacing) !important;\n}\n\n@mixin get-typography-not-important($name) {\n  font-family: var(--typography-#{$name}-font-family);\n  font-size: var(--typography-#{$name}-font-size);\n  font-weight: var(--typography-#{$name}-font-weight);\n  line-height: var(--typography-#{$name}-line-height);\n  letter-spacing: var(--typography-#{$name}-letter-spacing);\n}\n\n@mixin focus-ring($color: var(--color-black)) {\n  outline: 2px solid $color;\n}\n\n@mixin for-phone-only {\n  @media (max-width: 671px) {\n    @content;\n  }\n}\n\n@mixin for-tablet-portrait-up {\n  @media (min-width: 672px) {\n    @content;\n  }\n}\n\n@mixin for-tablet-landscape-up {\n  @media (min-width: 1056px) {\n    @content;\n  }\n}\n\n@mixin for-desktop-up {\n  @media (min-width: 1312px) {\n    @content;\n  }\n}\n\n@mixin for-big-desktop-up {\n  @media (min-width: 1584px) {\n    @content;\n  }\n}\n\n// Layers\n@mixin layer-background {\n}\n\n// NOTE: `apply-container-shape` and `copy-container-shape` were removed.\n// These helpers previously copied container-shape custom properties and\n// applied them as physical border radii. They are intentionally deleted\n// because the loader now manages container shape via CSS custom properties\n// directly. If you need to reintroduce shape helpers, add small, focused\n// utilities instead of the previous macros.\n","@use \"../../scss/mixin\";\n\n@include mixin.base-styles;\n\n/// Mixin to define text classes for a specific type and value-type\n/// @param {String} $type - The type name to be used in the class name (e.g., .text-#{$type})\n/// @param {String} $value-type - The value-type name to be passed to get-typography\n@mixin define-text-classes($type, $value-type) {\n  .text-#{$type} {\n    @include mixin.get-typography(#{$value-type});\n  }\n\n  .text-#{$type}-emphasized {\n    @include mixin.get-typography(#{$value-type}-emphasized);\n  }\n}\n\n\n/// List of typography types\n$types: \"display\", \"headline\", \"body\", 'code', 'label', 'title';\n\n/// List of typography sizes\n$sizes: \"large\", \"medium\", 'small';\n\n/// Generate text classes for each type and size\n@each $type in $types {\n  @include define-text-classes($type, #{$type}-medium);\n  @each $size in $sizes {\n    @include define-text-classes(#{$type}-#{$size}, #{$type}-#{$size});\n  }\n}\n\n.text-code-block {\n  background-color: var(--color-surface-variant);\n  text-shadow: 0 1px 1px var(--color-surface-variant);\n  color: var(--color-on-surface);\n  border-radius: var(--shape-corner-extra-small);\n  padding: var(--spacing-050);\n  font-family: var(--font-family-monospace);\n\n  display: inline-block;\n  max-width: 100%;\n  white-space: pre-wrap;\n  word-break: break-word;\n  overflow-wrap: anywhere;\n  vertical-align: middle;\n}\n","@use \"../../scss/mixin\";\n\n@include mixin.base-styles;\n\n.link {\n  border-radius: inherit;\n  corner-shape: inherit;\n\n  color: var(--color-primary);\n  --icon-color: currentColor;\n  text-decoration: none;\n\n  &:hover, &:focus-visible {\n    text-decoration: underline;\n  }\n\n  &.inherit {\n    color: inherit;\n    text-decoration: none !important;\n  }\n\n  &.with-icon {\n    display: inline-flex;\n    align-items: center;\n    gap: 0.5em;\n  }\n}\n"]}
+{"version":3,"sourceRoot":"","sources":["file:///home/runner/work/peacock/peacock/components/scss/mixin.scss","file:///home/runner/work/peacock/peacock/components/src/text/text.css-component.scss","file:///home/runner/work/peacock/peacock/components/src/link/link.css-component.scss"],"names":[],"mappings":"AACE,EACE,sBACA,0CAGF,oBACE,wBAGF,SACE,wBCHF,cDgCA,oEACA,gEACA,oEACA,oEACA,0EChCA,yBD4BA,+EACA,2EACA,+EACA,+EACA,qFCpCA,oBDgCA,mEACA,+DACA,mEACA,mEACA,yEChCA,+BD4BA,8EACA,0EACA,8EACA,8EACA,oFCpCA,qBDgCA,oEACA,gEACA,oEACA,oEACA,0EChCA,gCD4BA,+EACA,2EACA,+EACA,+EACA,qFCpCA,oBDgCA,mEACA,+DACA,mEACA,mEACA,yEChCA,+BD4BA,8EACA,0EACA,8EACA,8EACA,oFCpCA,eDgCA,qEACA,iEACA,qEACA,qEACA,2EChCA,0BD4BA,gFACA,4EACA,gFACA,gFACA,sFCpCA,qBDgCA,oEACA,gEACA,oEACA,oEACA,0EChCA,gCD4BA,+EACA,2EACA,+EACA,+EACA,qFCpCA,sBDgCA,qEACA,iEACA,qEACA,qEACA,2EChCA,iCD4BA,gFACA,4EACA,gFACA,gFACA,sFCpCA,qBDgCA,oEACA,gEACA,oEACA,oEACA,0EChCA,gCD4BA,+EACA,2EACA,+EACA,+EACA,qFCpCA,WDgCA,iEACA,6DACA,iEACA,iEACA,uEChCA,sBD4BA,4EACA,wEACA,4EACA,4EACA,kFCpCA,iBDgCA,gEACA,4DACA,gEACA,gEACA,sEChCA,4BD4BA,2EACA,uEACA,2EACA,2EACA,iFCpCA,kBDgCA,iEACA,6DACA,iEACA,iEACA,uEChCA,6BD4BA,4EACA,wEACA,4EACA,4EACA,kFCpCA,iBDgCA,gEACA,4DACA,gEACA,gEACA,sEChCA,4BD4BA,2EACA,uEACA,2EACA,2EACA,iFCpCA,WDgCA,iEACA,6DACA,iEACA,iEACA,uEChCA,sBD4BA,4EACA,wEACA,4EACA,4EACA,kFCpCA,iBDgCA,gEACA,4DACA,gEACA,gEACA,sEChCA,4BD4BA,2EACA,uEACA,2EACA,2EACA,iFCpCA,kBDgCA,iEACA,6DACA,iEACA,iEACA,uEChCA,6BD4BA,4EACA,wEACA,4EACA,4EACA,kFCpCA,iBDgCA,gEACA,4DACA,gEACA,gEACA,sEChCA,4BD4BA,2EACA,uEACA,2EACA,2EACA,iFCpCA,YDgCA,kEACA,8DACA,kEACA,kEACA,wEChCA,uBD4BA,6EACA,yEACA,6EACA,6EACA,mFCpCA,kBDgCA,iEACA,6DACA,iEACA,iEACA,uEChCA,6BD4BA,4EACA,wEACA,4EACA,4EACA,kFCpCA,mBDgCA,kEACA,8DACA,kEACA,kEACA,wEChCA,8BD4BA,6EACA,yEACA,6EACA,6EACA,mFCpCA,kBDgCA,iEACA,6DACA,iEACA,iEACA,uEChCA,6BD4BA,4EACA,wEACA,4EACA,4EACA,kFCpCA,YDgCA,kEACA,8DACA,kEACA,kEACA,wEChCA,uBD4BA,6EACA,yEACA,6EACA,6EACA,mFCpCA,kBDgCA,iEACA,6DACA,iEACA,iEACA,uEChCA,6BD4BA,4EACA,wEACA,4EACA,4EACA,kFCpCA,mBDgCA,kEACA,8DACA,kEACA,kEACA,wEChCA,8BD4BA,6EACA,yEACA,6EACA,6EACA,mFCpCA,kBDgCA,iEACA,6DACA,iEACA,iEACA,uEChCA,6BD4BA,4EACA,wEACA,4EACA,4EACA,kFCZF,iBACE,8CACA,mDACA,8BACA,8CACA,2BACA,yCAEA,qBACA,eACA,qBACA,sBACA,uBACA,sBD5CA,EACE,sBACA,0CAGF,oBACE,wBAGF,SACE,wBEPJ,MACE,sBACA,qBAEA,2BACA,2BACA,qBAEA,gCACE,0BAGF,cACE,cACA,gCAGF,gBACE,oBACA,mBACA","sourcesContent":["@mixin base-styles {\n  * {\n    box-sizing: border-box;\n    -webkit-tap-highlight-color: transparent;\n  }\n\n  .screen-reader-only {\n    display: none !important;\n  }\n\n  [hidden] {\n    display: none !important;\n  }\n}\n\n@mixin reset-button-styles {\n  background: transparent;\n  border: none;\n  appearance: none;\n  margin: 0;\n  outline: none;\n  padding: 0;\n}\n\n@mixin reset-link-styles {\n  text-decoration: none;\n  color: inherit;\n  cursor: pointer;\n  outline: none;\n\n  &:link,\n  &:visited,\n  &:hover,\n  &:active {\n    text-decoration: none;\n    color: inherit;\n  }\n}\n\n@mixin get-typography($name) {\n  font-family: var(--typography-#{$name}-font-family) !important;\n  font-size: var(--typography-#{$name}-font-size) !important;\n  font-weight: var(--typography-#{$name}-font-weight) !important;\n  line-height: var(--typography-#{$name}-line-height) !important;\n  letter-spacing: var(--typography-#{$name}-letter-spacing) !important;\n}\n\n@mixin get-typography-not-important($name) {\n  font-family: var(--typography-#{$name}-font-family);\n  font-size: var(--typography-#{$name}-font-size);\n  font-weight: var(--typography-#{$name}-font-weight);\n  line-height: var(--typography-#{$name}-line-height);\n  letter-spacing: var(--typography-#{$name}-letter-spacing);\n}\n\n@mixin focus-ring($color: var(--color-black)) {\n  outline: 2px solid $color;\n}\n\n@mixin for-phone-only {\n  @media (max-width: 671px) {\n    @content;\n  }\n}\n\n@mixin for-tablet-portrait-up {\n  @media (min-width: 672px) {\n    @content;\n  }\n}\n\n@mixin for-tablet-landscape-up {\n  @media (min-width: 1056px) {\n    @content;\n  }\n}\n\n@mixin for-desktop-up {\n  @media (min-width: 1312px) {\n    @content;\n  }\n}\n\n@mixin for-big-desktop-up {\n  @media (min-width: 1584px) {\n    @content;\n  }\n}\n\n// Layers\n@mixin layer-background {\n}\n\n// NOTE: `apply-container-shape` and `copy-container-shape` were removed.\n// These helpers previously copied container-shape custom properties and\n// applied them as physical border radii. They are intentionally deleted\n// because the loader now manages container shape via CSS custom properties\n// directly. If you need to reintroduce shape helpers, add small, focused\n// utilities instead of the previous macros.\n","@use \"../../scss/mixin\";\n\n@include mixin.base-styles;\n\n/// Mixin to define text classes for a specific type and value-type\n/// @param {String} $type - The type name to be used in the class name (e.g., .text-#{$type})\n/// @param {String} $value-type - The value-type name to be passed to get-typography\n@mixin define-text-classes($type, $value-type) {\n  .text-#{$type} {\n    @include mixin.get-typography(#{$value-type});\n  }\n\n  .text-#{$type}-emphasized {\n    @include mixin.get-typography(#{$value-type}-emphasized);\n  }\n}\n\n\n/// List of typography types\n$types: \"display\", \"headline\", \"body\", 'code', 'label', 'title';\n\n/// List of typography sizes\n$sizes: \"large\", \"medium\", 'small';\n\n/// Generate text classes for each type and size\n@each $type in $types {\n  @include define-text-classes($type, #{$type}-medium);\n  @each $size in $sizes {\n    @include define-text-classes(#{$type}-#{$size}, #{$type}-#{$size});\n  }\n}\n\n.text-code-block {\n  background-color: var(--color-surface-variant);\n  text-shadow: 0 1px 1px var(--color-surface-variant);\n  color: var(--color-on-surface);\n  border-radius: var(--shape-corner-extra-small);\n  padding: var(--spacing-050);\n  font-family: var(--font-family-monospace);\n\n  display: inline-block;\n  max-width: 100%;\n  white-space: pre-wrap;\n  word-break: break-word;\n  overflow-wrap: anywhere;\n  vertical-align: middle;\n}\n","@use \"../../scss/mixin\";\n\n@include mixin.base-styles;\n\n.link {\n  border-radius: inherit;\n  corner-shape: inherit;\n\n  color: var(--color-primary);\n  --icon-color: currentColor;\n  text-decoration: none;\n\n  &:hover, &:focus-visible {\n    text-decoration: underline;\n  }\n\n  &.inherit {\n    color: inherit;\n    text-decoration: none !important;\n  }\n\n  &.with-icon {\n    display: inline-flex;\n    align-items: center;\n    gap: 0.5em;\n  }\n}\n"]}