@redvars/peacock 3.8.0 → 3.8.2

package/dist/element-internals-2CMts_0M.js

@@ -0,0 +1,290 @@
+import './IndividualComponent-Bdwyrvd6.js';
+
+/**
+ * Accessibility Object Model reflective aria properties.
+ */
+const ARIA_PROPERTIES = [
+    'role',
+    'ariaAtomic',
+    'ariaAutoComplete',
+    'ariaBusy',
+    'ariaChecked',
+    'ariaColCount',
+    'ariaColIndex',
+    'ariaColSpan',
+    'ariaCurrent',
+    'ariaDisabled',
+    'ariaExpanded',
+    'ariaHasPopup',
+    'ariaHidden',
+    'ariaInvalid',
+    'ariaKeyShortcuts',
+    'ariaLabel',
+    'ariaLevel',
+    'ariaLive',
+    'ariaModal',
+    'ariaMultiLine',
+    'ariaMultiSelectable',
+    'ariaOrientation',
+    'ariaPlaceholder',
+    'ariaPosInSet',
+    'ariaPressed',
+    'ariaReadOnly',
+    'ariaRequired',
+    'ariaRoleDescription',
+    'ariaRowCount',
+    'ariaRowIndex',
+    'ariaRowSpan',
+    'ariaSelected',
+    'ariaSetSize',
+    'ariaSort',
+    'ariaValueMax',
+    'ariaValueMin',
+    'ariaValueNow',
+    'ariaValueText',
+];
+/**
+ * Accessibility Object Model aria attributes.
+ */
+// eslint-disable-next-line no-use-before-define
+const ARIA_ATTRIBUTES = ARIA_PROPERTIES.map(ariaPropertyToAttribute);
+/**
+ * Checks if an attribute is one of the AOM aria attributes.
+ *
+ * @example
+ * isAriaAttribute('aria-label'); // true
+ *
+ * @param attribute The attribute to check.
+ * @return True if the attribute is an aria attribute, or false if not.
+ */
+function isAriaAttribute(attribute) {
+    return ARIA_ATTRIBUTES.includes(attribute);
+}
+/**
+ * Converts an AOM aria property into its corresponding attribute.
+ *
+ * @example
+ * ariaPropertyToAttribute('ariaLabel'); // 'aria-label'
+ *
+ * @param property The aria property.
+ * @return The aria attribute.
+ */
+function ariaPropertyToAttribute(property) {
+    return property
+        .replace('aria', 'aria-')
+        // IDREF attributes also include an "Element" or "Elements" suffix
+        .replace(/Elements?/g, '')
+        // eslint-disable-next-line no-use-before-define
+        .toLowerCase();
+}
+
+/**
+ * @license
+ * Copyright 2023 Google LLC
+ * SPDX-License-Identifier: Apache-2.0
+ */
+// Private symbols
+const privateIgnoreAttributeChangesFor = Symbol('privateIgnoreAttributeChangesFor');
+function ariaAttributeToDataAttribute(ariaAttribute) {
+    // aria-haspopup -> data-aria-haspopup
+    return `data-${ariaAttribute}`;
+}
+function ariaAttributeToDataProperty(ariaAttribute) {
+    // aria-haspopup -> dataset.ariaHaspopup
+    return ariaAttribute.replace(/-\w/, dashLetter => dashLetter[1].toUpperCase());
+}
+/**
+ * Overrides the constructor's native `ARIAMixin` properties to ensure that
+ * aria properties reflect the values that were shifted to a data attribute.
+ *
+ * @param ctor The `ReactiveElement` constructor to patch.
+ */
+function setupDelegatesAriaProperties(ctor) {
+    for (const ariaProperty of ARIA_PROPERTIES) {
+        // The casing between ariaProperty and the dataProperty may be different.
+        // ex: aria-haspopup -> ariaHasPopup
+        const ariaAttribute = ariaPropertyToAttribute(ariaProperty);
+        // ex: aria-haspopup -> data-aria-haspopup
+        const dataAttribute = ariaAttributeToDataAttribute(ariaAttribute);
+        // ex: aria-haspopup -> dataset.ariaHaspopup
+        const dataProperty = ariaAttributeToDataProperty(ariaAttribute);
+        // Call `ReactiveElement.createProperty()` so that the `aria-*` and `data-*`
+        // attributes are added to the `static observedAttributes` array. This
+        // triggers `attributeChangedCallback` for the delegates aria mixin to
+        // handle.
+        ctor.createProperty(ariaProperty, {
+            attribute: ariaAttribute,
+            noAccessor: true,
+        });
+        ctor.createProperty(Symbol(dataAttribute), {
+            attribute: dataAttribute,
+            noAccessor: true,
+        });
+        // Re-define the `ARIAMixin` properties to handle data attribute shifting.
+        // It is safe to use `Object.defineProperty` here because the properties
+        // are native and not renamed.
+        // tslint:disable-next-line:ban-unsafe-reflection
+        Object.defineProperty(ctor.prototype, ariaProperty, {
+            configurable: true,
+            enumerable: true,
+            get() {
+                return this.dataset[dataProperty] ?? null;
+            },
+            set(value) {
+                const prevValue = this.dataset[dataProperty] ?? null;
+                if (value === prevValue) {
+                    return;
+                }
+                if (value === null) {
+                    delete this.dataset[dataProperty];
+                }
+                else {
+                    this.dataset[dataProperty] = value;
+                }
+                this.requestUpdate(ariaProperty, prevValue);
+            },
+        });
+    }
+}
+/**
+ * Mixes in aria delegation for elements that delegate focus and aria to inner
+ * shadow root elements.
+ *
+ * This mixin fixes invalid aria announcements with shadow roots, caused by
+ * duplicate aria attributes on both the host and the inner shadow root element.
+ *
+ * Note: this mixin **does not yet support** ID reference attributes, such as
+ * `aria-labelledby` or `aria-controls`.
+ *
+ * @example
+ * ```ts
+ * class MyButton extends mixinDelegatesAria(LitElement) {
+ *   static shadowRootOptions = {mode: 'open', delegatesFocus: true};
+ *
+ *   render() {
+ *     return html`
+ *       <button aria-label=${this.ariaLabel || nothing}>
+ *         <slot></slot>
+ *       </button>
+ *     `;
+ *   }
+ * }
+ * ```
+ * ```html
+ * <my-button aria-label="Plus one">+1</my-button>
+ * ```
+ *
+ * Use `ARIAMixinStrict` for lit analyzer strict types, such as the "role"
+ * attribute.
+ *
+ * @example
+ * ```ts
+ * return html`
+ *   <button role=${(this as ARIAMixinStrict).role || nothing}>
+ *     <slot></slot>
+ *   </button>
+ * `;
+ * ```
+ *
+ * In the future, updates to the Accessibility Object Model (AOM) will provide
+ * built-in aria delegation features that will replace this mixin.
+ *
+ * @param base The class to mix functionality into.
+ * @return The provided class with aria delegation mixed in.
+ */
+function mixinDelegatesAria(base) {
+    var _a;
+    class WithDelegatesAriaElement extends base {
+        constructor() {
+            super(...arguments);
+            this[_a] = new Set();
+        }
+        attributeChangedCallback(name, oldValue, newValue) {
+            if (!isAriaAttribute(name)) {
+                super.attributeChangedCallback(name, oldValue, newValue);
+                return;
+            }
+            if (this[privateIgnoreAttributeChangesFor].has(name)) {
+                return;
+            }
+            // Don't trigger another `attributeChangedCallback` once we remove the
+            // aria attribute from the host. We check the explicit name of the
+            // attribute to ignore since `attributeChangedCallback` can be called
+            // multiple times out of an expected order when hydrating an element with
+            // multiple attributes.
+            this[privateIgnoreAttributeChangesFor].add(name);
+            this.removeAttribute(name);
+            this[privateIgnoreAttributeChangesFor].delete(name);
+            const dataProperty = ariaAttributeToDataProperty(name);
+            if (newValue === null) {
+                delete this.dataset[dataProperty];
+            }
+            else {
+                this.dataset[dataProperty] = newValue;
+            }
+            this.requestUpdate(ariaAttributeToDataProperty(name), oldValue);
+        }
+        getAttribute(name) {
+            if (isAriaAttribute(name)) {
+                return super.getAttribute(ariaAttributeToDataAttribute(name));
+            }
+            return super.getAttribute(name);
+        }
+        removeAttribute(name) {
+            super.removeAttribute(name);
+            if (isAriaAttribute(name)) {
+                super.removeAttribute(ariaAttributeToDataAttribute(name));
+                // Since `aria-*` attributes are already removed`, we need to request
+                // an update because `attributeChangedCallback` will not be called.
+                this.requestUpdate();
+            }
+        }
+    }
+    _a = privateIgnoreAttributeChangesFor;
+    setupDelegatesAriaProperties(WithDelegatesAriaElement);
+    return WithDelegatesAriaElement;
+}
+
+/**
+ * A unique symbol used for protected access to an instance's
+ * `ElementInternals`.
+ *
+ * @example
+ * ```ts
+ * class MyElement extends mixinElementInternals(LitElement) {
+ *   constructor() {
+ *     super();
+ *     this[internals].role = 'button';
+ *   }
+ * }
+ * ```
+ */
+const internals = Symbol('internals');
+// Private symbols
+const privateInternals = Symbol('privateInternals');
+/**
+ * Mixes in an attached `ElementInternals` instance.
+ *
+ * This mixin is only needed when other shared code needs access to a
+ * component's `ElementInternals`, such as form-associated mixins.
+ *
+ * @param base The class to mix functionality into.
+ * @return The provided class with `WithElementInternals` mixed in.
+ */
+function mixinElementInternals(base) {
+    class WithElementInternalsElement extends base {
+        get [internals]() {
+            // Create internals in getter so that it can be used in methods called on
+            // construction in `ReactiveElement`, such as `requestUpdate()`.
+            if (!this[privateInternals]) {
+                // Cast needed for closure
+                this[privateInternals] = this.attachInternals();
+            }
+            return this[privateInternals];
+        }
+    }
+    return WithElementInternalsElement;
+}
+
+export { mixinElementInternals as a, internals as i, mixinDelegatesAria as m };
+//# sourceMappingURL=element-internals-2CMts_0M.js.map

package/dist/element-internals-2CMts_0M.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"element-internals-2CMts_0M.js","sources":["../../src/__internal/aria/aria.ts","../../src/__internal/aria/delegate.ts","../../src/__internal/mixins/element-internals.ts"],"sourcesContent":["/**\n * Accessibility Object Model reflective aria property name types.\n */\n// eslint-disable-next-line no-undef\nexport type ARIAProperty = keyof ARIAMixin;\n\n/**\n * Accessibility Object Model reflective aria properties.\n */\nexport const ARIA_PROPERTIES: ARIAProperty[] = [\n  'role',\n  'ariaAtomic',\n  'ariaAutoComplete',\n  'ariaBusy',\n  'ariaChecked',\n  'ariaColCount',\n  'ariaColIndex',\n  'ariaColSpan',\n  'ariaCurrent',\n  'ariaDisabled',\n  'ariaExpanded',\n  'ariaHasPopup',\n  'ariaHidden',\n  'ariaInvalid',\n  'ariaKeyShortcuts',\n  'ariaLabel',\n  'ariaLevel',\n  'ariaLive',\n  'ariaModal',\n  'ariaMultiLine',\n  'ariaMultiSelectable',\n  'ariaOrientation',\n  'ariaPlaceholder',\n  'ariaPosInSet',\n  'ariaPressed',\n  'ariaReadOnly',\n  'ariaRequired',\n  'ariaRoleDescription',\n  'ariaRowCount',\n  'ariaRowIndex',\n  'ariaRowSpan',\n  'ariaSelected',\n  'ariaSetSize',\n  'ariaSort',\n  'ariaValueMax',\n  'ariaValueMin',\n  'ariaValueNow',\n  'ariaValueText',\n];\n\n/**\n * Accessibility Object Model aria attribute name types.\n */\n// eslint-disable-next-line no-use-before-define\nexport type ARIAAttribute = ARIAPropertyToAttribute<ARIAProperty>;\n\n/**\n * Accessibility Object Model aria attributes.\n */\n// eslint-disable-next-line no-use-before-define\nexport const ARIA_ATTRIBUTES = ARIA_PROPERTIES.map(ariaPropertyToAttribute);\n\n/**\n * Checks if an attribute is one of the AOM aria attributes.\n *\n * @example\n * isAriaAttribute('aria-label'); // true\n *\n * @param attribute The attribute to check.\n * @return True if the attribute is an aria attribute, or false if not.\n */\nexport function isAriaAttribute(attribute: string): attribute is ARIAAttribute {\n  return ARIA_ATTRIBUTES.includes(attribute as ARIAAttribute);\n}\n\n/**\n * Converts an AOM aria property into its corresponding attribute.\n *\n * @example\n * ariaPropertyToAttribute('ariaLabel'); // 'aria-label'\n *\n * @param property The aria property.\n * @return The aria attribute.\n */\nexport function ariaPropertyToAttribute<K extends ARIAProperty>(property: K) {\n  return (\n    property\n      .replace('aria', 'aria-')\n      // IDREF attributes also include an \"Element\" or \"Elements\" suffix\n      .replace(/Elements?/g, '')\n      // eslint-disable-next-line no-use-before-define\n      .toLowerCase() as ARIAPropertyToAttribute<K>\n  );\n}\n\n// Converts an `ariaFoo` string type to an `aria-foo` string type.\n// eslint-disable-next-line no-unused-vars\ntype ARIAPropertyToAttribute<K extends string> =\n  K extends `aria${infer Suffix}Element${infer OptS}` // eslint-disable-line\n    ? `aria-${Lowercase<Suffix>}`\n    : K extends `aria${infer Suffix}`\n      ? `aria-${Lowercase<Suffix>}`\n      : K;\n\n/**\n * An extension of `ARIAMixin` that enforces strict value types for aria\n * properties.\n *\n * This is needed for correct typing in render functions with lit analyzer.\n *\n * @example\n * render() {\n *   const {ariaLabel} = this as ARIAMixinStrict;\n *   return html`\n *     <button aria-label=${ariaLabel || nothing}>\n *       <slot></slot>\n *     </button>\n *   `;\n * }\n */\n// eslint-disable-next-line no-undef\nexport interface ARIAMixinStrict extends ARIAMixin {\n  ariaAtomic: 'true' | 'false' | null;\n  ariaAutoComplete: 'none' | 'inline' | 'list' | 'both' | null;\n  ariaBusy: 'true' | 'false' | null;\n  ariaChecked: 'true' | 'false' | null;\n  ariaColCount: `${number}` | null;\n  ariaColIndex: `${number}` | null;\n  ariaColSpan: `${number}` | null;\n  ariaCurrent:\n    | 'page'\n    | 'step'\n    | 'location'\n    | 'date'\n    | 'time'\n    | 'true'\n    | 'false'\n    | null;\n  ariaDisabled: 'true' | 'false' | null;\n  ariaExpanded: 'true' | 'false' | null;\n  ariaHasPopup:\n    | 'false'\n    | 'true'\n    | 'menu'\n    | 'listbox'\n    | 'tree'\n    | 'grid'\n    | 'dialog'\n    | null;\n  ariaHidden: 'true' | 'false' | null;\n  ariaInvalid: 'true' | 'false' | null;\n  ariaKeyShortcuts: string | null;\n  ariaLabel: string | null;\n  ariaLevel: `${number}` | null;\n  ariaLive: 'assertive' | 'off' | 'polite' | null;\n  ariaModal: 'true' | 'false' | null;\n  ariaMultiLine: 'true' | 'false' | null;\n  ariaMultiSelectable: 'true' | 'false' | null;\n  ariaOrientation: 'horizontal' | 'vertical' | 'undefined' | null;\n  ariaPlaceholder: string | null;\n  ariaPosInSet: `${number}` | null;\n  ariaPressed: 'true' | 'false' | null;\n  ariaReadOnly: 'true' | 'false' | null;\n  ariaRequired: 'true' | 'false' | null;\n  ariaRoleDescription: string | null;\n  ariaRowCount: `${number}` | null;\n  ariaRowIndex: `${number}` | null;\n  ariaRowSpan: `${number}` | null;\n  ariaSelected: 'true' | 'false' | null;\n  ariaSetSize: `${number}` | null;\n  ariaSort: 'ascending' | 'descending' | 'none' | 'other' | null;\n  ariaValueMax: `${number}` | null;\n  ariaValueMin: `${number}` | null;\n  ariaValueNow: `${number}` | null;\n  ariaValueText: string | null;\n  // eslint-disable-next-line no-use-before-define\n  role: ARIARole | null;\n}\n\n/**\n * Valid values for `role`.\n */\nexport type ARIARole =\n  | 'alert'\n  | 'alertdialog'\n  | 'button'\n  | 'checkbox'\n  | 'dialog'\n  | 'gridcell'\n  | 'link'\n  | 'log'\n  | 'marquee'\n  | 'menuitem'\n  | 'menuitemcheckbox'\n  | 'menuitemradio'\n  | 'option'\n  | 'progressbar'\n  | 'radio'\n  | 'scrollbar'\n  | 'searchbox'\n  | 'slider'\n  | 'spinbutton'\n  | 'status'\n  | 'switch'\n  | 'tab'\n  | 'tabpanel'\n  | 'textbox'\n  | 'timer'\n  | 'tooltip'\n  | 'treeitem'\n  | 'combobox'\n  | 'grid'\n  | 'listbox'\n  | 'menu'\n  | 'menubar'\n  | 'radiogroup'\n  | 'tablist'\n  | 'tree'\n  | 'treegrid'\n  | 'application'\n  | 'article'\n  | 'cell'\n  | 'columnheader'\n  | 'definition'\n  | 'directory'\n  | 'document'\n  | 'feed'\n  | 'figure'\n  | 'group'\n  | 'heading'\n  | 'img'\n  | 'list'\n  | 'listitem'\n  | 'math'\n  | 'none'\n  | 'note'\n  | 'presentation'\n  | 'region'\n  | 'row'\n  | 'rowgroup'\n  | 'rowheader'\n  | 'separator'\n  | 'table'\n  | 'term'\n  | 'text'\n  | 'toolbar'\n  | 'banner'\n  | 'complementary'\n  | 'contentinfo'\n  | 'form'\n  | 'main'\n  | 'navigation'\n  | 'region'\n  | 'search'\n  | 'doc-abstract'\n  | 'doc-acknowledgments'\n  | 'doc-afterword'\n  | 'doc-appendix'\n  | 'doc-backlink'\n  | 'doc-biblioentry'\n  | 'doc-bibliography'\n  | 'doc-biblioref'\n  | 'doc-chapter'\n  | 'doc-colophon'\n  | 'doc-conclusion'\n  | 'doc-cover'\n  | 'doc-credit'\n  | 'doc-credits'\n  | 'doc-dedication'\n  | 'doc-endnote'\n  | 'doc-endnotes'\n  | 'doc-epigraph'\n  | 'doc-epilogue'\n  | 'doc-errata'\n  | 'doc-example'\n  | 'doc-footnote'\n  | 'doc-foreword'\n  | 'doc-glossary'\n  | 'doc-glossref'\n  | 'doc-index'\n  | 'doc-introduction'\n  | 'doc-noteref'\n  | 'doc-notice'\n  | 'doc-pagebreak'\n  | 'doc-pagelist'\n  | 'doc-part'\n  | 'doc-preface'\n  | 'doc-prologue'\n  | 'doc-pullquote'\n  | 'doc-qna'\n  | 'doc-subtitle'\n  | 'doc-tip'\n  | 'doc-toc';\n","/**\n * @license\n * Copyright 2023 Google LLC\n * SPDX-License-Identifier: Apache-2.0\n */\n\nimport { LitElement, ReactiveElement, isServer } from 'lit';\n\nimport { MixinBase, MixinReturn } from '../mixins/mixin.js';\nimport {\n  ARIA_PROPERTIES,\n  ariaPropertyToAttribute,\n  isAriaAttribute,\n} from './aria.js';\n\n// Private symbols\nconst privateIgnoreAttributeChangesFor = Symbol(\n  'privateIgnoreAttributeChangesFor',\n);\n\nfunction ariaAttributeToDataAttribute(ariaAttribute: string) {\n  // aria-haspopup -> data-aria-haspopup\n  return `data-${ariaAttribute}`;\n}\n\nfunction ariaAttributeToDataProperty(ariaAttribute: string) {\n  // aria-haspopup -> dataset.ariaHaspopup\n  return ariaAttribute.replace(/-\\w/, dashLetter =>\n    dashLetter[1].toUpperCase(),\n  );\n}\n\n/**\n * Overrides the constructor's native `ARIAMixin` properties to ensure that\n * aria properties reflect the values that were shifted to a data attribute.\n *\n * @param ctor The `ReactiveElement` constructor to patch.\n */\nfunction setupDelegatesAriaProperties(ctor: typeof ReactiveElement) {\n  for (const ariaProperty of ARIA_PROPERTIES) {\n    // The casing between ariaProperty and the dataProperty may be different.\n    // ex: aria-haspopup -> ariaHasPopup\n    const ariaAttribute = ariaPropertyToAttribute(ariaProperty);\n    // ex: aria-haspopup -> data-aria-haspopup\n    const dataAttribute = ariaAttributeToDataAttribute(ariaAttribute);\n    // ex: aria-haspopup -> dataset.ariaHaspopup\n    const dataProperty = ariaAttributeToDataProperty(ariaAttribute);\n\n    // Call `ReactiveElement.createProperty()` so that the `aria-*` and `data-*`\n    // attributes are added to the `static observedAttributes` array. This\n    // triggers `attributeChangedCallback` for the delegates aria mixin to\n    // handle.\n    ctor.createProperty(ariaProperty, {\n      attribute: ariaAttribute,\n      noAccessor: true,\n    });\n    ctor.createProperty(Symbol(dataAttribute), {\n      attribute: dataAttribute,\n      noAccessor: true,\n    });\n\n    // Re-define the `ARIAMixin` properties to handle data attribute shifting.\n    // It is safe to use `Object.defineProperty` here because the properties\n    // are native and not renamed.\n    // tslint:disable-next-line:ban-unsafe-reflection\n    Object.defineProperty(ctor.prototype, ariaProperty, {\n      configurable: true,\n      enumerable: true,\n      get(this: ReactiveElement): string | null {\n        return this.dataset[dataProperty] ?? null;\n      },\n      set(this: ReactiveElement, value: string | null): void {\n        const prevValue = this.dataset[dataProperty] ?? null;\n        if (value === prevValue) {\n          return;\n        }\n\n        if (value === null) {\n          delete this.dataset[dataProperty];\n        } else {\n          this.dataset[dataProperty] = value;\n        }\n\n        this.requestUpdate(ariaProperty, prevValue);\n      },\n    });\n  }\n}\n\n/**\n * Mixes in aria delegation for elements that delegate focus and aria to inner\n * shadow root elements.\n *\n * This mixin fixes invalid aria announcements with shadow roots, caused by\n * duplicate aria attributes on both the host and the inner shadow root element.\n *\n * Note: this mixin **does not yet support** ID reference attributes, such as\n * `aria-labelledby` or `aria-controls`.\n *\n * @example\n * ```ts\n * class MyButton extends mixinDelegatesAria(LitElement) {\n *   static shadowRootOptions = {mode: 'open', delegatesFocus: true};\n *\n *   render() {\n *     return html`\n *       <button aria-label=${this.ariaLabel || nothing}>\n *         <slot></slot>\n *       </button>\n *     `;\n *   }\n * }\n * ```\n * ```html\n * <my-button aria-label=\"Plus one\">+1</my-button>\n * ```\n *\n * Use `ARIAMixinStrict` for lit analyzer strict types, such as the \"role\"\n * attribute.\n *\n * @example\n * ```ts\n * return html`\n *   <button role=${(this as ARIAMixinStrict).role || nothing}>\n *     <slot></slot>\n *   </button>\n * `;\n * ```\n *\n * In the future, updates to the Accessibility Object Model (AOM) will provide\n * built-in aria delegation features that will replace this mixin.\n *\n * @param base The class to mix functionality into.\n * @return The provided class with aria delegation mixed in.\n */\nexport function mixinDelegatesAria<T extends MixinBase<LitElement>>(\n  base: T,\n): MixinReturn<T> {\n  if (isServer) {\n    // Don't shift attributes when running with lit-ssr. The SSR renderer\n    // implements a subset of DOM APIs, including the methods this mixin\n    // overrides, causing errors. We don't need to shift on the server anyway\n    // since elements will shift attributes immediately once they hydrate.\n    return base;\n  }\n\n  abstract class WithDelegatesAriaElement extends base {\n    [privateIgnoreAttributeChangesFor] = new Set();\n\n    override attributeChangedCallback(\n      name: string,\n      oldValue: string | null,\n      newValue: string | null,\n    ) {\n      if (!isAriaAttribute(name)) {\n        super.attributeChangedCallback(name, oldValue, newValue);\n        return;\n      }\n\n      if (this[privateIgnoreAttributeChangesFor].has(name)) {\n        return;\n      }\n\n      // Don't trigger another `attributeChangedCallback` once we remove the\n      // aria attribute from the host. We check the explicit name of the\n      // attribute to ignore since `attributeChangedCallback` can be called\n      // multiple times out of an expected order when hydrating an element with\n      // multiple attributes.\n      this[privateIgnoreAttributeChangesFor].add(name);\n      this.removeAttribute(name);\n      this[privateIgnoreAttributeChangesFor].delete(name);\n      const dataProperty = ariaAttributeToDataProperty(name);\n      if (newValue === null) {\n        delete this.dataset[dataProperty];\n      } else {\n        this.dataset[dataProperty] = newValue;\n      }\n\n      this.requestUpdate(ariaAttributeToDataProperty(name), oldValue);\n    }\n\n    override getAttribute(name: string) {\n      if (isAriaAttribute(name)) {\n        return super.getAttribute(ariaAttributeToDataAttribute(name));\n      }\n\n      return super.getAttribute(name);\n    }\n\n    override removeAttribute(name: string) {\n      super.removeAttribute(name);\n      if (isAriaAttribute(name)) {\n        super.removeAttribute(ariaAttributeToDataAttribute(name));\n        // Since `aria-*` attributes are already removed`, we need to request\n        // an update because `attributeChangedCallback` will not be called.\n        this.requestUpdate();\n      }\n    }\n  }\n\n  setupDelegatesAriaProperties(\n    WithDelegatesAriaElement as unknown as typeof ReactiveElement,\n  );\n\n  return WithDelegatesAriaElement;\n}\n","import { LitElement } from 'lit';\n\nimport { MixinBase, MixinReturn } from './mixin.js';\n\n/**\n * A unique symbol used for protected access to an instance's\n * `ElementInternals`.\n *\n * @example\n * ```ts\n * class MyElement extends mixinElementInternals(LitElement) {\n *   constructor() {\n *     super();\n *     this[internals].role = 'button';\n *   }\n * }\n * ```\n */\nexport const internals = Symbol('internals');\n\n/**\n * An instance with an `internals` symbol property for the component's\n * `ElementInternals`.\n *\n * Use this when protected access is needed for an instance's `ElementInternals`\n * from other files. A unique symbol is used to access the internals.\n */\nexport interface WithElementInternals {\n  /**\n   * An instance's `ElementInternals`.\n   */\n  [internals]: ElementInternals;\n}\n\n// Private symbols\nconst privateInternals = Symbol('privateInternals');\n\n/**\n * Mixes in an attached `ElementInternals` instance.\n *\n * This mixin is only needed when other shared code needs access to a\n * component's `ElementInternals`, such as form-associated mixins.\n *\n * @param base The class to mix functionality into.\n * @return The provided class with `WithElementInternals` mixed in.\n */\nexport function mixinElementInternals<T extends MixinBase<LitElement>>(\n  base: T,\n): MixinReturn<T, WithElementInternals> {\n  abstract class WithElementInternalsElement\n    extends base\n    implements WithElementInternals\n  {\n    get [internals]() {\n      // Create internals in getter so that it can be used in methods called on\n      // construction in `ReactiveElement`, such as `requestUpdate()`.\n      if (!this[privateInternals]) {\n        // Cast needed for closure\n        this[privateInternals] = (this as HTMLElement).attachInternals();\n      }\n\n      return this[privateInternals];\n    }\n\n    // In preparation for ES2022, we need to declare this property to guard\n    // against the base class calling [internals] in its constructor prematurely\n    // setting this field. Without declare, once this field is defined, it would\n    // initialize to undefined and `attachInternals()` could be called again.\n    declare [privateInternals]?: ElementInternals;\n  }\n\n  return WithElementInternalsElement;\n}\n"],"names":[],"mappings":"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"}

package/dist/elevation.js

@@ -0,0 +1,94 @@
+import { i, _ as __decorate, I as IndividualComponent, a as i$1, b } from './IndividualComponent-Bdwyrvd6.js';
+
+var css_248z = i`* {
+  box-sizing: border-box;
+}
+
+.screen-reader-only {
+  display: none !important;
+}
+
+[hidden] {
+  display: none !important;
+}
+
+/**
+ * Derived from Material Design Elevation
+ * https://github.com/material-components/material-web/blob/main/elevation/internal/_elevation.scss
+ */
+:host,
+.shadow,
+.shadow::before,
+.shadow::after {
+  border-start-start-radius: var(--elevation-container-shape-start-start, var(--elevation-container-shape));
+  border-start-end-radius: var(--elevation-container-shape-start-end, var(--elevation-container-shape));
+  border-end-start-radius: var(--elevation-container-shape-end-start, var(--elevation-container-shape));
+  border-end-end-radius: var(--elevation-container-shape-end-end, var(--elevation-container-shape));
+  corner-shape: var(--elevation-container-shape-variant);
+  inset: 0;
+  position: absolute;
+  transition-duration: inherit;
+  transition-property: inherit;
+  transition-timing-function: inherit;
+}
+
+:host {
+  display: flex;
+  pointer-events: none;
+  transition-property: box-shadow, opacity;
+  --elevation-level: 0;
+  --elevation-color: var(--elevation-color-default, black);
+}
+
+.shadow::before,
+.shadow::after {
+  content: "";
+  transition-property: box-shadow, opacity;
+  --_level: var(--elevation-level);
+  --_shadow-color: var(--elevation-color);
+}
+
+.shadow::before {
+  box-shadow: 0 calc(1px * (clamp(0, var(--_level), 1) + clamp(0, var(--_level) - 3, 1) + 2 * clamp(0, var(--_level) - 4, 1))) calc(1px * (2 * clamp(0, var(--_level), 1) + clamp(0, var(--_level) - 2, 1) + clamp(0, var(--_level) - 4, 1))) 0 var(--_shadow-color);
+  opacity: 0.3;
+}
+
+.shadow::after {
+  box-shadow: 0 calc(1px * (clamp(0, var(--_level), 1) + clamp(0, var(--_level) - 1, 1) + 2 * clamp(0, var(--_level) - 2, 3))) calc(1px * (3 * clamp(0, var(--_level), 2) + 2 * clamp(0, var(--_level) - 2, 3))) calc(1px * (clamp(0, var(--_level), 4) + 2 * clamp(0, var(--_level) - 4, 1))) var(--_shadow-color);
+  opacity: 0.15;
+}`;
+
+/**
+ * @label Elevation
+ * @tag wc-elevation
+ * @rawTag elevation
+ *
+ * @summary Adds elevation to an element.
+ * @overview
+ *  - Elevation adds a shadow effect to an element to give it depth.
+ *  - It can be used to create a sense of hierarchy or to draw attention to a particular element.
+ *
+ * @cssprop --elevation-level - Controls the elevation level of the shadow.
+ * @cssprop --elevation-color - Controls the color of the shadow.
+ *
+ * @example
+ * ```html
+ *   <div style="position: relative; padding: var(--spacing-200);">
+ *     <wc-elevation style='--elevation-level: 2; --elevation-container-shape: var(--shape-corner-extra-small);'></wc-elevation>
+ *     Level 2
+ *   </div>
+ * ```
+ * @tags display
+ */
+let Elevation = class Elevation extends i$1 {
+    render() {
+        return b `<span class="shadow"></span>`;
+    }
+};
+Elevation.styles = [css_248z];
+Elevation = __decorate([
+    IndividualComponent
+], Elevation);
+
+export { Elevation };
+//# sourceMappingURL=elevation.js.map

package/dist/elevation.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"elevation.js","sources":["../../src/elevation/elevation.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport styles from './elevation.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Elevation\n * @tag wc-elevation\n * @rawTag elevation\n *\n * @summary Adds elevation to an element.\n * @overview\n *  - Elevation adds a shadow effect to an element to give it depth.\n *  - It can be used to create a sense of hierarchy or to draw attention to a particular element.\n *\n * @cssprop --elevation-level - Controls the elevation level of the shadow.\n * @cssprop --elevation-color - Controls the color of the shadow.\n *\n * @example\n * ```html\n *   <div style=\"position: relative; padding: var(--spacing-200);\">\n *     <wc-elevation style='--elevation-level: 2; --elevation-container-shape: var(--shape-corner-extra-small);'></wc-elevation>\n *     Level 2\n *   </div>\n * ```\n * @tags display\n */\n@IndividualComponent\nexport class Elevation extends LitElement {\n  static styles = [styles];\n\n  render() {\n    return html`<span class=\"shadow\"></span>`;\n  }\n}\n"],"names":["LitElement","html","styles"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA;;;;;;;;;;;;;;;;;;;;;AAqBG;AAEI,IAAM,SAAS,GAAf,MAAM,SAAU,SAAQA,GAAU,CAAA;IAGvC,MAAM,GAAA;QACJ,OAAOC,CAAI,CAAA,CAAA,4BAAA,CAA8B;IAC3C;;AAJO,SAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AADb,SAAS,GAAA,UAAA,CAAA;IADrB;AACY,CAAA,EAAA,SAAS,CAMrB;;;;"}

package/dist/empty-state.js

@@ -0,0 +1,194 @@
+import { i, _ as __decorate, I as IndividualComponent, a as i$1, A, b } from './IndividualComponent-Bdwyrvd6.js';
+import { n } from './property-B49QQ8pS.js';
+import { r } from './state-DkTK9EGF.js';
+import { e } from './class-map-DG7CA1et.js';
+import './directive-ZPhl09Yt.js';
+
+var css_248z = i`* {
+  box-sizing: border-box;
+}
+
+.screen-reader-only {
+  display: none !important;
+}
+
+[hidden] {
+  display: none !important;
+}
+
+:host {
+  display: block;
+}
+
+.empty-state {
+  container: emptystate/inline-size;
+  padding: var(--spacing-100);
+  height: 100%;
+  max-width: var(--container-lg);
+  margin: auto;
+}
+
+.empty-state-container {
+  display: flex;
+  height: 100%;
+  justify-content: center;
+  gap: var(--spacing-500);
+  align-items: center;
+}
+
+.illustration {
+  height: 100%;
+  display: flex;
+}
+.illustration .illustration-svg {
+  --icon-size: 100%;
+}
+
+.content {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+}
+.content .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;
+  margin-bottom: var(--spacing-200);
+  color: var(--color-on-surface);
+}
+.content .description {
+  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;
+  margin-bottom: var(--spacing-400);
+  color: var(--color-on-surface-variant);
+}
+
+:host(.content-center) .content {
+  align-items: center;
+  text-align: center;
+}
+
+@container emptystate (min-width: 672px) {
+  .empty-state .illustration {
+    width: 50%;
+  }
+  .empty-state .content {
+    width: 50%;
+  }
+}
+@container emptystate (max-width: 671px) {
+  .empty-state .empty-state-container {
+    flex-direction: column;
+    gap: var(--spacing-150);
+  }
+  .empty-state .empty-state-container .illustration {
+    height: auto;
+    width: 100%;
+    justify-content: center;
+  }
+  .empty-state .content .headline {
+    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;
+  }
+}`;
+
+/**
+ * @label Empty State
+ * @tag wc-empty-state
+ * @rawTag empty-state
+ * @summary A message that displays when there is no information to display.
+ * @tags display
+ *
+ * @example
+ * ```html
+ * <wc-empty-state style="width:100%" headline="No items found"></wc-empty-state>
+ * ```
+ */
+let EmptyState = class EmptyState extends i$1 {
+    constructor() {
+        super(...arguments);
+        this.illustration = 'no-document';
+        this.headline = '';
+        this.description = '';
+        /** True when the component width is below 768px; triggers a stacked layout. */
+        this.vertical = false;
+        this.handleResize = () => {
+            // Logic equivalent to Stencil's clientWidth check
+            this.vertical = this.offsetWidth < 768;
+        };
+    }
+    connectedCallback() {
+        // eslint-disable-next-line wc/guard-super-call
+        super.connectedCallback();
+        window.addEventListener('resize', this.handleResize);
+        // Initial check
+        this.handleResize();
+    }
+    disconnectedCallback() {
+        window.removeEventListener('resize', this.handleResize);
+        // eslint-disable-next-line wc/guard-super-call
+        super.disconnectedCallback();
+    }
+    __renderTitle() {
+        if (!this.headline)
+            return A;
+        return b `<div class="headline">${this.headline}</div>`;
+    }
+    __renderDescription() {
+        if (!this.description)
+            return A;
+        return b `<div class="description">${this.description}</div>`;
+    }
+    render() {
+        const classes = {
+            'empty-state': true,
+            vertical: this.vertical,
+        };
+        // Resolving asset paths in Lit typically uses import.meta.url or absolute paths
+        const illustrationPath = new URL(`./assets/images/empty-state/${this.illustration}.svg`, import.meta.url).href;
+        return b `
+      <div class="${e(classes)}">
+        <div class="empty-state-container">
+          <div class="illustration">
+            <wc-icon class="illustration-svg" src="${illustrationPath}"></wc-icon>
+          </div>
+
+          <div class="content">
+            ${this.__renderTitle()} ${this.__renderDescription()}
+            <div class="actions">
+              <slot name="actions"></slot>
+            </div>
+          </div>
+        </div>
+      </div>
+    `;
+    }
+};
+// Lit handles styles in a static property for better performance
+EmptyState.styles = [css_248z];
+__decorate([
+    n({ type: String, reflect: true })
+], EmptyState.prototype, "illustration", void 0);
+__decorate([
+    n({ type: String, reflect: true })
+], EmptyState.prototype, "headline", void 0);
+__decorate([
+    n({ type: String, reflect: true })
+], EmptyState.prototype, "description", void 0);
+__decorate([
+    r()
+], EmptyState.prototype, "vertical", void 0);
+EmptyState = __decorate([
+    IndividualComponent
+], EmptyState);
+
+export { EmptyState };
+//# sourceMappingURL=empty-state.js.map

package/dist/empty-state.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"empty-state.js","sources":["../../src/empty-state/empty-state.ts"],"sourcesContent":["import { html, LitElement, nothing } from 'lit';\nimport { property, state } from 'lit/decorators.js';\nimport { classMap } from 'lit/directives/class-map.js';\nimport styles from './empty-state.scss';\nimport IndividualComponent from '@/IndividualComponent.js';\n\n/**\n * @label Empty State\n * @tag wc-empty-state\n * @rawTag empty-state\n * @summary A message that displays when there is no information to display.\n * @tags display\n *\n * @example\n * ```html\n * <wc-empty-state style=\"width:100%\" headline=\"No items found\"></wc-empty-state>\n * ```\n */\n@IndividualComponent\nexport class EmptyState extends LitElement {\n  // Lit handles styles in a static property for better performance\n  static styles = [styles];\n\n  @property({ type: String, reflect: true })\n  illustration: 'no-document' | 'page' | 'search' = 'no-document';\n\n  @property({ type: String, reflect: true })\n  headline = '';\n\n  @property({ type: String, reflect: true })\n  description = '';\n\n  /** True when the component width is below 768px; triggers a stacked layout. */\n  @state()\n  private vertical = false;\n\n  connectedCallback() {\n    // eslint-disable-next-line wc/guard-super-call\n    super.connectedCallback();\n    window.addEventListener('resize', this.handleResize);\n    // Initial check\n    this.handleResize();\n  }\n\n  disconnectedCallback() {\n    window.removeEventListener('resize', this.handleResize);\n    // eslint-disable-next-line wc/guard-super-call\n    super.disconnectedCallback();\n  }\n\n  private handleResize = () => {\n    // Logic equivalent to Stencil's clientWidth check\n    this.vertical = this.offsetWidth < 768;\n  };\n\n  __renderTitle() {\n    if (!this.headline) return nothing;\n    return html`<div class=\"headline\">${this.headline}</div>`;\n  }\n\n  __renderDescription() {\n    if (!this.description) return nothing;\n    return html`<div class=\"description\">${this.description}</div>`;\n  }\n\n  protected render() {\n    const classes = {\n      'empty-state': true,\n      vertical: this.vertical,\n    };\n\n    // Resolving asset paths in Lit typically uses import.meta.url or absolute paths\n    const illustrationPath = new URL(\n      `./assets/images/empty-state/${this.illustration}.svg`,\n      import.meta.url,\n    ).href;\n\n    return html`\n      <div class=\"${classMap(classes)}\">\n        <div class=\"empty-state-container\">\n          <div class=\"illustration\">\n            <wc-icon class=\"illustration-svg\" src=\"${illustrationPath}\"></wc-icon>\n          </div>\n\n          <div class=\"content\">\n            ${this.__renderTitle()} ${this.__renderDescription()}\n            <div class=\"actions\">\n              <slot name=\"actions\"></slot>\n            </div>\n          </div>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"names":["LitElement","nothing","html","classMap","styles","property","state"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA;;;;;;;;;;;AAWG;AAEI,IAAM,UAAU,GAAhB,MAAM,UAAW,SAAQA,GAAU,CAAA;AAAnC,IAAA,WAAA,GAAA;;QAKL,IAAA,CAAA,YAAY,GAAsC,aAAa;QAG/D,IAAA,CAAA,QAAQ,GAAG,EAAE;QAGb,IAAA,CAAA,WAAW,GAAG,EAAE;;QAIR,IAAA,CAAA,QAAQ,GAAG,KAAK;QAgBhB,IAAA,CAAA,YAAY,GAAG,MAAK;;YAE1B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,WAAW,GAAG,GAAG;AACxC,QAAA,CAAC;IAyCH;IA1DE,iBAAiB,GAAA;;QAEf,KAAK,CAAC,iBAAiB,EAAE;QACzB,MAAM,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC;;QAEpD,IAAI,CAAC,YAAY,EAAE;IACrB;IAEA,oBAAoB,GAAA;QAClB,MAAM,CAAC,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,YAAY,CAAC;;QAEvD,KAAK,CAAC,oBAAoB,EAAE;IAC9B;IAOA,aAAa,GAAA;QACX,IAAI,CAAC,IAAI,CAAC,QAAQ;AAAE,YAAA,OAAOC,CAAO;AAClC,QAAA,OAAOC,CAAI,CAAA,CAAA,sBAAA,EAAyB,IAAI,CAAC,QAAQ,QAAQ;IAC3D;IAEA,mBAAmB,GAAA;QACjB,IAAI,CAAC,IAAI,CAAC,WAAW;AAAE,YAAA,OAAOD,CAAO;AACrC,QAAA,OAAOC,CAAI,CAAA,CAAA,yBAAA,EAA4B,IAAI,CAAC,WAAW,QAAQ;IACjE;IAEU,MAAM,GAAA;AACd,QAAA,MAAM,OAAO,GAAG;AACd,YAAA,aAAa,EAAE,IAAI;YACnB,QAAQ,EAAE,IAAI,CAAC,QAAQ;SACxB;;AAGD,QAAA,MAAM,gBAAgB,GAAG,IAAI,GAAG,CAC9B,CAAA,4BAAA,EAA+B,IAAI,CAAC,YAAY,MAAM,EACtD,MAAM,CAAC,IAAI,CAAC,GAAG,CAChB,CAAC,IAAI;AAEN,QAAA,OAAOA,CAAI,CAAA;oBACKC,CAAQ,CAAC,OAAO,CAAC,CAAA;;;qDAGgB,gBAAgB,CAAA;;;;AAIvD,YAAA,EAAA,IAAI,CAAC,aAAa,EAAE,IAAI,IAAI,CAAC,mBAAmB,EAAE;;;;;;;KAO3D;IACH;;AAzEA;AACO,UAAA,CAAA,MAAM,GAAG,CAACC,QAAM,CAAC;AAGxB,UAAA,CAAA;IADCC,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AACuB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,cAAA,EAAA,MAAA,CAAA;AAGhE,UAAA,CAAA;IADCA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AAC3B,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AAGd,UAAA,CAAA;IADCA,CAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,EAAE;AACxB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,aAAA,EAAA,MAAA,CAAA;AAIT,UAAA,CAAA;AADP,IAAAC,CAAK;AACmB,CAAA,EAAA,UAAA,CAAA,SAAA,EAAA,UAAA,EAAA,MAAA,CAAA;AAfd,UAAU,GAAA,UAAA,CAAA;IADtB;AACY,CAAA,EAAA,UAAU,CA2EtB;;;;"}

package/dist/{event-manager-D-QCmUgR.js → event-manager-DTyX2uYD.js}

@@ -1,4 +1,4 @@
-import { c as __classPrivateFieldGet } from './IndividualComponent-DUINtMGK.js';
+import { c as __classPrivateFieldGet } from './IndividualComponent-Bdwyrvd6.js';
 import { C as CalendarEvent } from './calendar-event-BrQ_SEKD.js';
 
 var _EventManager_events, _MonthEventManager_events;
@@ -110,4 +110,4 @@ class MonthEventManager {
 _MonthEventManager_events = new WeakMap();
 
 export { EventManager as E, MonthEventManager as M };
-//# sourceMappingURL=event-manager-D-QCmUgR.js.map
+//# sourceMappingURL=event-manager-DTyX2uYD.js.map