@redvars/peacock 3.8.1 → 3.8.2

package/src/tabs/tab.ts

@@ -5,14 +5,15 @@ import { classMap } from 'lit/directives/class-map.js';
 import {
   dispatchActivationClick,
   isActivationClick,
-} from '@/__utils/dispatch-event-utils.js';
-import { observerSlotChangesWithCallback } from '@/__utils/observe-slot-change.js';
-import { throttle } from '@/__utils/throttle.js';
-import { isLink } from '@/__utils/is-link.js';
-import { spread } from '@/__directive/spread.js';
+} from '@/__internal/utils/dispatch-event-utils.js';
+import { observerSlotChangesWithCallback } from '@/__internal/utils/observe-slot-change.js';
+import { throttle } from '@/__internal/utils/throttle.js';
+import { isLink } from '@/__internal/utils/is-link.js';
+import { spread } from '@/__internal/directive/spread.js';
 
 import styles from './tab.scss';
 import type { Tabs } from './tabs.js';
+import IndividualComponent from '@/IndividualComponent.js';
 
 /**
  * @label Tab
@@ -29,6 +30,7 @@ import type { Tabs } from './tabs.js';
  * ```
  * @tags navigation
  */
+@IndividualComponent
 export class Tab extends LitElement {
   #id = crypto.randomUUID();
 
@@ -53,9 +55,9 @@ export class Tab extends LitElement {
   @property({ type: String, reflect: true }) href?: string;
 
   /**
-   * Sets the delay for throttle in milliseconds. Defaults to 200 milliseconds.
+   * Sets the delay for throttle in milliseconds. When null (default), no throttle is applied.
    */
-  @property() throttleDelay = 200;
+  @property() throttleDelay?: number;
 
   @state() hasFocus = false;
 
@@ -65,12 +67,6 @@ export class Tab extends LitElement {
 
   @state() slotHasBadge = false;
 
-  /**
-   * States
-   */
-  @state()
-  isPressed = false;
-
   private _tabindex = 0;
 
   @query('.tab-element') readonly tabElement!: HTMLElement | null;
@@ -86,13 +82,16 @@ export class Tab extends LitElement {
   constructor() {
     super();
     this._tabindex = 0;
+    this.addEventListener('click', this.__dispatchClickWithThrottle);
   }
 
   override firstUpdated() {
-    this.__dispatchClickWithThrottle = throttle(
-      this.__dispatchClick,
-      this.throttleDelay,
-    );
+    if (typeof this.throttleDelay === 'number') {
+      this.__dispatchClickWithThrottle = throttle(
+        this.__dispatchClick,
+        this.throttleDelay,
+      );
+    }
     observerSlotChangesWithCallback(
       this.renderRoot.querySelector('slot:not([name])'),
       hasContent => {
@@ -141,21 +140,6 @@ export class Tab extends LitElement {
     dispatchActivationClick(this.tabElement);
   };
 
-  __handlePress = (event: KeyboardEvent | MouseEvent) => {
-    if (this.disabled) return;
-    if (
-      event instanceof KeyboardEvent &&
-      event.type === 'keydown' &&
-      (event.key === 'Enter' || event.key === ' ')
-    ) {
-      this.isPressed = true;
-    } else if (event.type === 'mousedown') {
-      this.isPressed = true;
-    } else {
-      this.isPressed = false;
-    }
-  };
-
   __getParentTabsVariant(): Tabs['variant'] {
     return (this.closest('wc-tabs') as Tabs | null)?.variant ?? 'primary';
   }
@@ -176,7 +160,6 @@ export class Tab extends LitElement {
       tab: true,
       'tab-element': true,
       disabled: this.disabled,
-      pressed: this.isPressed,
       active: this.active,
       [`variant-${variant}`]: true,
       'has-content': this.slotHasContent,
@@ -189,9 +172,6 @@ export class Tab extends LitElement {
         id="button"
         class=${classMap(cssClasses)}
         tabindex="0"
-        @mousedown=${this.__handlePress}
-        @keydown=${this.__handlePress}
-        @keyup=${this.__handlePress}
         ?aria-describedby=${this.__getDisabledReasonID()}
         aria-disabled=${`${this.disabled}`}
         ?disabled=${this.disabled}
@@ -207,9 +187,6 @@ export class Tab extends LitElement {
       tabindex="0"
       href=${this.href}
       target=${this.target}
-      @mousedown=${this.__handlePress}
-      @keydown=${this.__handlePress}
-      @keyup=${this.__handlePress}
       role="button"
       ?aria-describedby=${this.__getDisabledReasonID()}
       aria-disabled=${`${this.disabled}`}

package/src/tabs/tabs.ts

@@ -2,6 +2,7 @@ import { html, LitElement } from 'lit';
 import { property } from 'lit/decorators.js';
 import styles from './tabs.scss';
 import { Tab } from './tab.js';
+import IndividualComponent from '@/IndividualComponent.js';
 
 /**
  * @label Tabs
@@ -21,6 +22,7 @@ import { Tab } from './tab.js';
  * ```
  * @tags navigation
  */
+@IndividualComponent
 export class Tabs extends LitElement {
   static styles = [styles];
 

package/src/textarea/textarea.ts

@@ -1,8 +1,8 @@
 import { html } from 'lit';
 import { property, query, state } from 'lit/decorators.js';
 
-import { redispatchEvent } from '@/__utils/dispatch-event-utils.js';
-import { spread } from '@/__directive/spread.js';
+import { redispatchEvent } from '@/__internal/utils/dispatch-event-utils.js';
+import { spread } from '@/__internal/directive/spread.js';
 
 import BaseInput from '../input/BaseInput.js';
 import styles from './textarea.scss';

package/src/time-picker/time-picker.ts

@@ -1,8 +1,8 @@
 import { html } from 'lit';
 import { property, query, state } from 'lit/decorators.js';
 
-import { redispatchEvent } from '@/__utils/dispatch-event-utils.js';
-import { spread } from '@/__directive/spread.js';
+import { redispatchEvent } from '@/__internal/utils/dispatch-event-utils.js';
+import { spread } from '@/__internal/directive/spread.js';
 
 import BaseInput from '../input/BaseInput.js';
 import styles from './time-picker.scss';

package/src/toolbar/toolbar.ts

@@ -1,4 +1,4 @@
-import { LitElement, html } from 'lit';
+import { LitElement, html } from 'lit';
 import { property } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import IndividualComponent from '@/IndividualComponent.js';
@@ -10,9 +10,9 @@ import colorStyles from './toolbar-colors.scss';
  * @tag wc-toolbar
  * @rawTag toolbar
  *
- * @summary A Material 3 toolbar / app bar for navigation and actions.
+ * @summary A toolbar / app bar for navigation and actions.
  * @overview
- * <p>The toolbar component implements the Material 3 app bar pattern. It supports a
+ * <p>The toolbar component implements the app bar pattern. It supports a
  * docked (attached) variant for bottom-panel navigation and a floating (detached pill-shaped)
  * variant. The floating variant supports both horizontal and vertical orientations.</p>
  *

package/src/tooltip/tooltip.ts

@@ -2,7 +2,8 @@ import { html, LitElement } from 'lit';
 import { property } from 'lit/decorators.js';
 import { classMap } from 'lit/directives/class-map.js';
 import styles from './tooltip.scss';
-import { FloatingController } from '../__controllers/floating-controller.js';
+import { FloatingController } from '../__internal/controllers/floating-controller.js';
+import IndividualComponent from '@/IndividualComponent.js';
 
 // Define a type for valid trigger combinations
 export type TooltipTrigger = 'hover' | 'focus' | 'click';
@@ -19,6 +20,7 @@ export type TooltipTrigger = 'hover' | 'focus' | 'click';
  * <wc-tooltip preview>Tooltip</wc-tooltip>
  * ```
  */
+@IndividualComponent
 export class Tooltip extends LitElement {
   static styles = [styles];
 
@@ -43,7 +45,12 @@ export class Tooltip extends LitElement {
 
   private _floating: FloatingController | null = null;
 
-  private resolveTrigger(): 'hover' | 'click' | 'focus' | 'manual' | 'hover-focus' {
+  private resolveTrigger():
+    | 'hover'
+    | 'click'
+    | 'focus'
+    | 'manual'
+    | 'hover-focus' {
     if (this.preview) return 'manual';
 
     const triggerTokens = this.trigger.split(' ');
@@ -77,17 +84,16 @@ export class Tooltip extends LitElement {
   }
 
   __getFocusTarget(): HTMLElement | null {
-
     if (this._focusTarget) {
       return this._focusTarget;
     }
 
     const focusTarget = document.getElementById(this.for);
-     if (focusTarget) {
-      return focusTarget
-     }
+    if (focusTarget) {
+      return focusTarget;
+    }
 
-     return this.parentElement;
+    return this.parentElement;
   }
 
   private attachListeners() {
@@ -107,7 +113,7 @@ export class Tooltip extends LitElement {
       offset: 0,
       trigger: this.resolveTrigger(),
       closeOnClickOutside: true,
-      onOpenChange: (isOpen) => {
+      onOpenChange: isOpen => {
         if (this.open === isOpen) return;
         this.open = isOpen;
       },

package/src/url-field/url-field.ts

@@ -1,7 +1,7 @@
 import { html, nothing } from 'lit';
 import { property, query, state } from 'lit/decorators.js';
 
-import { redispatchEvent } from '@/__utils/dispatch-event-utils.js';
+import { redispatchEvent } from '@/__internal/utils/dispatch-event-utils.js';
 
 import BaseInput from '../input/BaseInput.js';
 import styles from './url-field.scss';
@@ -217,7 +217,6 @@ export class UrlField extends BaseInput {
               />
             `
           : html`<div class="url-display">${this.renderDisplayValue()}</div>`}
-
         ${!this.editing && !this.disabled && !this.readonly
           ? html`
               <wc-icon-button
@@ -236,4 +235,4 @@ export class UrlField extends BaseInput {
       </wc-field>
     `;
   }
-}
+}

package/dist/ButtonConstants-D06bY4uy.js

@@ -1,114 +0,0 @@
-import { A, _ as __decorate } from './IndividualComponent-DUINtMGK.js';
-import { e, i, t } from './directive-ZPhl09Yt.js';
-import { n } from './property-1psGvXOq.js';
-
-/**
- * @license
- * Copyright 2018 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */const o=o=>o??A;
-
-class SpreadDirective extends i {
-    constructor(partInfo) {
-        super(partInfo);
-        if (partInfo.type !== t.ELEMENT) {
-            throw new Error('spread() can only be used on elements');
-        }
-    }
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    render(_props) {
-        return '';
-    }
-    update(part, [props]) {
-        if (!props)
-            return;
-        // eslint-disable-next-line guard-for-in,no-restricted-syntax
-        for (const key in props) {
-            const value = props[key];
-            if (value === undefined || value === null) {
-                part.element.removeAttribute(key);
-            }
-            else {
-                part.element.setAttribute(key, value);
-            }
-        }
-    }
-}
-const spread = e(SpreadDirective);
-
-/**
- * 2. Apply the type annotation to the variable.
- */
-const NativeButtonMixin = (superclass) => {
-    // Naming the class (BaseButtonElement) instead of using 'Mixin' or anonymous
-    // prevents the "__childPart" visibility error.
-    class ButtonElement extends superclass {
-        constructor() {
-            super(...arguments);
-            /**
-             * The type of the underlying `<button>` element. Maps to the native `type` attribute.
-             * Possible values are `"button"`, `"submit"`, `"reset"`. Defaults to `"button"`.
-             */
-            this.htmlType = 'button';
-            /**
-             * When `true`, the button is disabled and cannot be interacted with. Reflects to the `disabled` attribute. Defaults to `false`.
-             */
-            this.disabled = false;
-            /**
-             * When `true`, the button is visually styled as disabled and cannot be interacted with, but remains focusable.
-             * Use this in combination with `disabledReason` to communicate why the button is unavailable.
-             * Reflects to the `soft-disabled` attribute. Defaults to `false`.
-             */
-            this.softDisabled = false;
-            /**
-             * A human-readable explanation of why the button is disabled or soft-disabled.
-             * Rendered as a visually hidden tooltip and linked via `aria-describedby` for accessibility.
-             * Maps to the `disabled-reason` attribute.
-             */
-            this.disabledReason = '';
-            /**
-             * The `id` of the `<form>` element to associate the button with.
-             * If omitted, the button is associated with its nearest ancestor form.
-             * Maps to the native `form` attribute.
-             */
-            this.form = '';
-            /**
-             * The name of the button, submitted as part of a name/value pair when the associated form is submitted.
-             * Maps to the native `name` attribute.
-             */
-            this.name = '';
-            /**
-             * The value of the button, submitted as part of a name/value pair when the associated form is submitted.
-             * Maps to the native `value` attribute.
-             */
-            this.value = '';
-        }
-    }
-    __decorate([
-        n({ type: String })
-    ], ButtonElement.prototype, "htmlType", void 0);
-    __decorate([
-        n({ type: Boolean, reflect: true })
-    ], ButtonElement.prototype, "disabled", void 0);
-    __decorate([
-        n({ type: Boolean, reflect: true, attribute: 'soft-disabled' })
-    ], ButtonElement.prototype, "softDisabled", void 0);
-    __decorate([
-        n({ attribute: 'disabled-reason' })
-    ], ButtonElement.prototype, "disabledReason", void 0);
-    __decorate([
-        n()
-    ], ButtonElement.prototype, "form", void 0);
-    __decorate([
-        n()
-    ], ButtonElement.prototype, "name", void 0);
-    __decorate([
-        n()
-    ], ButtonElement.prototype, "value", void 0);
-    return ButtonElement;
-};
-
-const DISABLED_REASON_ID = 'button-disabled-reason';
-
-export { DISABLED_REASON_ID as D, NativeButtonMixin as N, o, spread as s };
-//# sourceMappingURL=ButtonConstants-D06bY4uy.js.map

package/dist/ButtonConstants-D06bY4uy.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ButtonConstants-D06bY4uy.js","sources":["../node_modules/lit-html/directives/if-defined.js","../../src/__directive/spread.ts","../../src/__mixins/NativeButtonMixin.ts","../../src/button/ButtonConstants.ts"],"sourcesContent":["import{nothing as t}from\"../lit-html.js\";\n/**\n * @license\n * Copyright 2018 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */const o=o=>o??t;export{o as ifDefined};\n//# sourceMappingURL=if-defined.js.map\n","import {\n  directive,\n  Directive,\n  ElementPart,\n  PartInfo,\n  PartType,\n} from 'lit/directive.js';\n\nclass SpreadDirective extends Directive {\n  constructor(partInfo: PartInfo) {\n    super(partInfo);\n    if (partInfo.type !== PartType.ELEMENT) {\n      throw new Error('spread() can only be used on elements');\n    }\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  render(_props: { [key: string]: any } | undefined) {\n    return '';\n  }\n\n  update(part: ElementPart, [props]: [{ [key: string]: any } | undefined]) {\n    if (!props) return;\n    // eslint-disable-next-line guard-for-in,no-restricted-syntax\n    for (const key in props) {\n      const value = props[key];\n      if (value === undefined || value === null) {\n        part.element.removeAttribute(key);\n      } else {\n        part.element.setAttribute(key, value);\n      }\n    }\n  }\n}\n\nexport const spread = directive(SpreadDirective);\n","import { LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport type { MixinConstructor } from './MixinConstructor.js';\n\n/**\n * 1. Define an interface for the members the mixin adds.\n * This makes the type annotation much cleaner.\n */\nexport interface NativeButtonInterface {\n  htmlType: 'button' | 'submit' | 'reset';\n  disabled: boolean;\n  softDisabled: boolean;\n  disabledReason: string;\n  form: string;\n  name: string;\n  value: string;\n}\n\n/**\n * 2. Apply the type annotation to the variable.\n */\nconst NativeButtonMixin: <T extends MixinConstructor<LitElement>>(\n  superclass: T,\n) => T & MixinConstructor<NativeButtonInterface> = <\n  T extends MixinConstructor<LitElement>,\n>(\n  superclass: T,\n) => {\n  // Naming the class (BaseButtonElement) instead of using 'Mixin' or anonymous\n  // prevents the \"__childPart\" visibility error.\n  class ButtonElement extends superclass implements NativeButtonInterface {\n    /**\n     * The type of the underlying `<button>` element. Maps to the native `type` attribute.\n     * Possible values are `\"button\"`, `\"submit\"`, `\"reset\"`. Defaults to `\"button\"`.\n     */\n    @property({ type: String }) htmlType: 'button' | 'submit' | 'reset' =\n      'button';\n\n    /**\n     * When `true`, the button is disabled and cannot be interacted with. Reflects to the `disabled` attribute. Defaults to `false`.\n     */\n    @property({ type: Boolean, reflect: true })\n    disabled: boolean = false;\n\n    /**\n     * When `true`, the button is visually styled as disabled and cannot be interacted with, but remains focusable.\n     * Use this in combination with `disabledReason` to communicate why the button is unavailable.\n     * Reflects to the `soft-disabled` attribute. Defaults to `false`.\n     */\n    @property({ type: Boolean, reflect: true, attribute: 'soft-disabled' })\n    softDisabled: boolean = false;\n\n    /**\n     * A human-readable explanation of why the button is disabled or soft-disabled.\n     * Rendered as a visually hidden tooltip and linked via `aria-describedby` for accessibility.\n     * Maps to the `disabled-reason` attribute.\n     */\n    @property({ attribute: 'disabled-reason' })\n    disabledReason: string = '';\n\n    /**\n     * The `id` of the `<form>` element to associate the button with.\n     * If omitted, the button is associated with its nearest ancestor form.\n     * Maps to the native `form` attribute.\n     */\n    @property()\n    form: string = '';\n\n    /**\n     * The name of the button, submitted as part of a name/value pair when the associated form is submitted.\n     * Maps to the native `name` attribute.\n     */\n    @property()\n    name: string = '';\n\n    /**\n     * The value of the button, submitted as part of a name/value pair when the associated form is submitted.\n     * Maps to the native `value` attribute.\n     */\n    @property()\n    value: string = '';\n  }\n\n  return ButtonElement as T & MixinConstructor<NativeButtonInterface>;\n};\n\nexport default NativeButtonMixin;\n","export const DISABLED_REASON_ID = 'button-disabled-reason';\n"],"names":["t","Directive","PartType","directive","property"],"mappings":"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","x_google_ignoreList":[0]}

package/dist/NativeHyperlinkMixin-DrYXyfMQ.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"NativeHyperlinkMixin-DrYXyfMQ.js","sources":["../../src/__utils/throttle.ts","../../src/__utils/is-link.ts","../../src/__mixins/NativeHyperlinkMixin.ts"],"sourcesContent":["export function throttle(\n  func: Function,\n  delay: number,\n  options = { leading: true, trailing: true },\n) {\n  let timerId: any;\n  let lastExec = 0;\n\n  return function (...args: any[]) {\n    // @ts-ignore\n    const context = this;\n    const now = Date.now();\n\n    const shouldCallNow = options.leading && now - lastExec >= delay;\n\n    if (shouldCallNow) {\n      func.apply(context, args);\n      lastExec = now;\n    } else if (options.trailing && !timerId) {\n      timerId = setTimeout(() => {\n        func.apply(context, args);\n        lastExec = Date.now();\n        timerId = null;\n      }, delay);\n    }\n  };\n}","export function isLink(element: any): boolean {\n  return element.href !== undefined;\n}\n","import { LitElement } from 'lit';\nimport { property } from 'lit/decorators.js';\nimport type { MixinConstructor } from './MixinConstructor.js';\n\n/**\n * 1. Define an interface for the members the mixin adds.\n * This makes the type annotation much cleaner.\n */\nexport interface NativeHyperlinkInterface {\n  href?: string;\n  target: '_self' | '_parent' | '_blank' | '_top' | string;\n  rel?: string;\n  download?: string;\n}\n\n/**\n * 2. Apply the type annotation to the variable.\n */\nconst NativeHyperlinkMixin: <T extends MixinConstructor<LitElement>>(\n  superclass: T,\n) => T & MixinConstructor<NativeHyperlinkInterface> = <\n  T extends MixinConstructor<LitElement>,\n>(\n  superclass: T,\n) => {\n  // Naming the class (BaseHyperlinkElement) instead of using 'Mixin' or anonymous\n  // prevents the \"__childPart\" visibility error.\n  class BaseHyperlinkElement\n    extends superclass\n    implements NativeHyperlinkInterface\n  {\n    /**\n     * The URL that the hyperlink points to. When set, the component renders as an `<a>` element.\n     * Maps to the native `href` attribute.\n     */\n    @property({ reflect: true })\n    href?: string;\n\n    /**\n     * Where to display the linked URL. Maps to the native `target` attribute.\n     * Possible values are `\"_self\"`, `\"_blank\"`, `\"_parent\"`, `\"_top\"`, or a custom frame name.\n     * When using `\"_blank\"`, consider setting `rel=\"noopener noreferrer\"` for security. Defaults to `\"_self\"`.\n     */\n    @property()\n    target: '_self' | '_parent' | '_blank' | '_top' | string = '_self';\n\n    /**\n     * The relationship between the current document and the linked URL.\n     * Maps to the native `rel` attribute on the rendered `<a>` element.\n     * When `target=\"_blank\"`, use `\"noopener noreferrer\"` to prevent tab-napping attacks.\n     */\n    @property()\n    rel?: string;\n\n    /**\n     * Causes the browser to download the linked URL instead of navigating to it.\n     * If a string value is provided, it is used as the suggested filename.\n     * Omit or leave undefined to preserve normal navigation behaviour.\n     * Maps to the native `download` attribute. Only applies when `href` is set.\n     */\n    @property()\n    download?: string;\n  }\n\n  return BaseHyperlinkElement as T & MixinConstructor<NativeHyperlinkInterface>;\n};\n\nexport default NativeHyperlinkMixin;\n"],"names":["property"],"mappings":";;;SAAgB,QAAQ,CACtB,IAAc,EACd,KAAa,EACb,OAAO,GAAG,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAA;AAE3C,IAAA,IAAI,OAAY;IAChB,IAAI,QAAQ,GAAG,CAAC;IAEhB,OAAO,UAAU,GAAG,IAAW,EAAA;;QAE7B,MAAM,OAAO,GAAG,IAAI;AACpB,QAAA,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE;QAEtB,MAAM,aAAa,GAAG,OAAO,CAAC,OAAO,IAAI,GAAG,GAAG,QAAQ,IAAI,KAAK;QAEhE,IAAI,aAAa,EAAE;AACjB,YAAA,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC;YACzB,QAAQ,GAAG,GAAG;QAChB;AAAO,aAAA,IAAI,OAAO,CAAC,QAAQ,IAAI,CAAC,OAAO,EAAE;AACvC,YAAA,OAAO,GAAG,UAAU,CAAC,MAAK;AACxB,gBAAA,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE,IAAI,CAAC;AACzB,gBAAA,QAAQ,GAAG,IAAI,CAAC,GAAG,EAAE;gBACrB,OAAO,GAAG,IAAI;YAChB,CAAC,EAAE,KAAK,CAAC;QACX;AACF,IAAA,CAAC;AACH;;AC1BM,SAAU,MAAM,CAAC,OAAY,EAAA;AACjC,IAAA,OAAO,OAAO,CAAC,IAAI,KAAK,SAAS;AACnC;;ACaA;;AAEG;AACH,MAAM,oBAAoB,GAE4B,CAGpD,UAAa,KACX;;;IAGF,MAAM,oBACJ,SAAQ,UAAU,CAAA;AADpB,QAAA,WAAA,GAAA;;AAWE;;;;AAIG;YAEH,IAAA,CAAA,MAAM,GAAqD,OAAO;QAkBpE;AAAC;AA1BC,IAAA,UAAA,CAAA;AADC,QAAAA,CAAQ,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE;AACb,KAAA,EAAA,oBAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAQd,IAAA,UAAA,CAAA;AADC,QAAAA,CAAQ;AAC0D,KAAA,EAAA,oBAAA,CAAA,SAAA,EAAA,QAAA,EAAA,MAAA,CAAA;AAQnE,IAAA,UAAA,CAAA;AADC,QAAAA,CAAQ;AACI,KAAA,EAAA,oBAAA,CAAA,SAAA,EAAA,KAAA,EAAA,MAAA,CAAA;AASb,IAAA,UAAA,CAAA;AADC,QAAAA,CAAQ;AACS,KAAA,EAAA,oBAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AAGpB,IAAA,OAAO,oBAAsE;AAC/E;;;;"}

package/dist/banner.js

@@ -1,186 +0,0 @@
-import { a as i, _ as __decorate, I as IndividualComponent, i as i$1, A, b } from './IndividualComponent-DUINtMGK.js';
-import { n } from './property-1psGvXOq.js';
-import { e } from './class-map-YU7g0o3B.js';
-import './directive-ZPhl09Yt.js';
-
-var css_248z = i`* {
-  box-sizing: border-box;
-}
-
-.screen-reader-only {
-  display: none !important;
-}
-
-:host {
-  display: block;
-}
-
-.banner {
-  align-items: flex-start;
-  background: var(--banner-container-color);
-  border-radius: var(--banner-border-radius);
-  display: grid;
-  gap: var(--spacing-100);
-  grid-template-columns: auto 1fr;
-  padding: var(--spacing-200);
-}
-
-.banner-icon {
-  align-items: center;
-  color: var(--banner-icon-color);
-  display: inline-flex;
-  justify-content: center;
-  --icon-size: 1.5rem;
-}
-
-.banner-content .banner-label {
-  display: inline;
-  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;
-  color: var(--banner-label-text-color);
-  margin-inline-end: var(--spacing-050);
-}
-.banner-content .banner-description {
-  display: inline;
-  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;
-  color: var(--banner-description-text-color);
-}
-
-:host {
-  --banner-container-color: var(--color-tertiary-container);
-  --banner-label-text-color: var(--color-on-tertiary-container);
-  --banner-description-text-color: var(--color-on-tertiary-container);
-  --banner-icon-color: var(--color-on-tertiary-container);
-  --banner-border-radius: var(--shape-corner-small);
-}
-
-.banner.info,
-.banner-content.info {
-  --banner-container-color: var(--color-primary-container);
-  --banner-label-text-color: var(--color-on-primary-container);
-  --banner-description-text-color: var(--color-on-primary-container);
-  --banner-icon-color: var(--color-on-primary-container);
-}
-
-.banner.success,
-.banner-content.success {
-  --banner-container-color: var(--color-success-container);
-  --banner-label-text-color: var(--color-on-success-container);
-  --banner-description-text-color: var(--color-on-success-container);
-  --banner-icon-color: var(--color-on-success-container);
-}
-
-.banner.warning,
-.banner-content.warning {
-  --banner-container-color: var(--color-warning-container);
-  --banner-label-text-color: var(--color-on-warning-container);
-  --banner-description-text-color: var(--color-on-warning-container);
-  --banner-icon-color: var(--color-on-warning-container);
-}
-
-.banner.error,
-.banner-content.error {
-  --banner-container-color: var(--color-error-container);
-  --banner-label-text-color: var(--color-on-error-container);
-  --banner-description-text-color: var(--color-on-error-container);
-  --banner-icon-color: var(--color-on-error-container);
-}`;
-
-const VARIANT_LABELS = {
-    note: 'Note',
-    info: 'Info',
-    success: 'Success',
-    warning: 'Warning',
-    error: 'Error',
-};
-const VARIANT_ICONS = {
-    note: 'star',
-    info: 'info',
-    success: 'check_circle',
-    warning: 'warning',
-    error: 'error',
-};
-/**
- * @label Banner
- * @tag wc-banner
- * @rawTag banner
- * @summary Banners show short, prominent contextual messages with optional icon and description.
- *
- * @cssprop --banner-container-color - Background color of the banner container.
- * @cssprop --banner-label-text-color - Label text color.
- * @cssprop --banner-description-text-color - Description text color.
- * @cssprop --banner-icon-color - Icon color.
- * @cssprop --banner-border-radius - Border radius of the banner surface.
- *
- * @example
- * ```html
- * <wc-banner variant="note" description="Use semantic roles that preserve a 3:1 contrast ratio."></wc-banner>
- * ```
- * @tags display, feedback
- */
-let Banner = class Banner extends i$1 {
-    constructor() {
-        super(...arguments);
-        /**
-         * Visual intent of the banner.
-         */
-        this.variant = 'note';
-        /**
-         * Optional description text when a default slot is not provided.
-         */
-        this.description = '';
-    }
-    get resolvedLabel() {
-        return this.label || VARIANT_LABELS[this.variant];
-    }
-    get resolvedIcon() {
-        return this.icon || VARIANT_ICONS[this.variant];
-    }
-    render() {
-        return b `
-      <div class=${e({ 'banner': true, [this.variant]: true })} role="status" aria-live="polite">
-        <div class="banner-icon" aria-hidden="true">
-          <slot name="icon">
-            <wc-icon name=${this.resolvedIcon}></wc-icon>
-          </slot>
-        </div>
-
-        <div class=${e({ 'banner-content': true, [this.variant]: true })}>
-          <div class="banner-label">
-            <slot name="label">${this.resolvedLabel}:</slot>
-          </div>
-
-          <div class="banner-description">
-            <slot>${this.description || A}</slot>
-          </div>
-        </div>
-      </div>
-    `;
-    }
-};
-Banner.styles = [css_248z];
-__decorate([
-    n({ type: String, reflect: true })
-], Banner.prototype, "variant", void 0);
-__decorate([
-    n({ type: String })
-], Banner.prototype, "label", void 0);
-__decorate([
-    n({ type: String })
-], Banner.prototype, "icon", void 0);
-__decorate([
-    n({ type: String })
-], Banner.prototype, "description", void 0);
-Banner = __decorate([
-    IndividualComponent
-], Banner);
-
-export { Banner };
-//# sourceMappingURL=banner.js.map

package/dist/banner.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"banner.js","sources":["../../src/banner/banner.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 './banner.scss';\n\ntype BannerVariant = 'note' | 'info' | 'success' | 'warning' | 'error';\n\nconst VARIANT_LABELS: Record<BannerVariant, string> = {\n  note: 'Note',\n  info: 'Info',\n  success: 'Success',\n  warning: 'Warning',\n  error: 'Error',\n};\n\nconst VARIANT_ICONS: Record<BannerVariant, string> = {\n  note: 'star',\n  info: 'info',\n  success: 'check_circle',\n  warning: 'warning',\n  error: 'error',\n};\n\n/**\n * @label Banner\n * @tag wc-banner\n * @rawTag banner\n * @summary Banners show short, prominent contextual messages with optional icon and description.\n *\n * @cssprop --banner-container-color - Background color of the banner container.\n * @cssprop --banner-label-text-color - Label text color.\n * @cssprop --banner-description-text-color - Description text color.\n * @cssprop --banner-icon-color - Icon color.\n * @cssprop --banner-border-radius - Border radius of the banner surface.\n *\n * @example\n * ```html\n * <wc-banner variant=\"note\" description=\"Use semantic roles that preserve a 3:1 contrast ratio.\"></wc-banner>\n * ```\n * @tags display, feedback\n */\n@IndividualComponent\nexport class Banner extends LitElement {\n  static styles = [styles];\n\n  /**\n   * Visual intent of the banner.\n   */\n  @property({ type: String, reflect: true })\n  variant: BannerVariant = '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({ 'banner': true, [this.variant]: true })} role=\"status\" aria-live=\"polite\">\n        <div class=\"banner-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({ 'banner-content': true, [this.variant]: true })}>\n          <div class=\"banner-label\">\n            <slot name=\"label\">${this.resolvedLabel}:</slot>\n          </div>\n\n          <div class=\"banner-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,GAAkC;AACpD,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,GAAkC;AACnD,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,MAAM,GAAZ,MAAM,MAAO,SAAQA,GAAU,CAAA;AAA/B,IAAA,WAAA,GAAA;;AAGL;;AAEG;QAEH,IAAA,CAAA,OAAO,GAAkB,MAAM;AAc/B;;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,QAAQ,EAAE,IAAI,EAAE,CAAC,IAAI,CAAC,OAAO,GAAG,IAAI,EAAE,CAAC,CAAA;;;AAGzC,0BAAA,EAAA,IAAI,CAAC,YAAY,CAAA;;;;AAIxB,mBAAA,EAAAA,CAAQ,CAAC,EAAE,gBAAgB,EAAE,IAAI,EAAE,CAAC,IAAI,CAAC,OAAO,GAAG,IAAI,EAAE,CAAC,CAAA;;AAE9C,+BAAA,EAAA,IAAI,CAAC,aAAa,CAAA;;;;oBAI/B,IAAI,CAAC,WAAW,IAAIC,CAAO,CAAA;;;;KAI1C;IACH;;AAtDO,MAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAMxB,UAAA,CAAA;IADCC,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AACT,CAAA,EAAA,MAAA,CAAA,SAAA,EAAA,SAAA,EAAA,MAAA,CAAA;AAMhC,UAAA,CAAA;AADC,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE;AACX,CAAA,EAAA,MAAA,CAAA,SAAA,EAAA,OAAA,EAAA,MAAA,CAAA;AAMf,UAAA,CAAA;AADC,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE;AACZ,CAAA,EAAA,MAAA,CAAA,SAAA,EAAA,MAAA,EAAA,MAAA,CAAA;AAMd,UAAA,CAAA;AADC,IAAAA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE;AACT,CAAA,EAAA,MAAA,CAAA,SAAA,EAAA,aAAA,EAAA,MAAA,CAAA;AAzBN,MAAM,GAAA,UAAA,CAAA;IADlB;AACY,CAAA,EAAA,MAAM,CAwDlB;;;;"}