kemet-ui 4.0.2 → 5.0.0

package/dist/elements/accordion-panel.js

@@ -1,188 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-
-// src/elements/accordion-panel.ts
-var accordion_panel_exports = {};
-__export(accordion_panel_exports, {
-  default: () => KemetAccordionPanel
-});
-module.exports = __toCommonJS(accordion_panel_exports);
-var import_lit2 = require("lit");
-var import_decorators = require("lit/decorators.js");
-
-// src/utilities/events.ts
-var emitEvent = (element, name, detail, bubbles = true, composed = true) => {
-  element.dispatchEvent(
-    new CustomEvent(name, { bubbles, composed, detail })
-  );
-};
-
-// src/styles/elements/accordion.ts
-var import_lit = require("lit");
-var stylesBase = import_lit.css`
-  :host {
-    display: block;
-  }
-`;
-var stylesPanel = import_lit.css`
-  *,
-  *::before,
-  *::after {
-    box-sizing: border-box;
-  }
-
-  :host {
-    display: block;
-    padding: 1.5rem 1rem;
-    border-bottom: 1px solid rgb(var(--kemet-color-foreground));
-  }
-
-  .trigger {
-    color: inherit;
-    cursor: pointer;
-    display: grid;
-    gap: 1rem;
-    grid-template-columns: 1fr auto;
-    width: 100%;
-    text-align: left;
-    padding: 0;
-    border: none;
-    background: none;
-  }
-
-  .body {
-    overflow: hidden;
-    transition: all 300ms ease;
-  }
-
-  ::slotted([slot='body']) {
-    padding: 1rem 0;
-  }
-`;
-
-// src/elements/accordion-panel.ts
-var KemetAccordionPanel = class extends import_lit2.LitElement {
-  constructor() {
-    super(...arguments);
-    this.opened = void 0;
-    this.maxHeight = "0px";
-    this.slug = "panel";
-  }
-  firstUpdated() {
-    this.focusableSelector = "body, a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, *[tabindex], *[contenteditable]";
-    this.bodyElement = this.querySelector('[slot="body"]');
-    this.bodyElementFirst = this.bodyElement?.querySelector(":first-child");
-    this.bodyElementLast = this.bodyElement?.querySelector(":last-child");
-    if (this.bodyElementFirst) this.bodyElementFirst.style.marginTop = "0";
-    if (this.bodyElementLast) this.bodyElementLast.style.marginBottom = "0";
-  }
-  updated(prevProps) {
-    if (!prevProps.get("opened") && this.opened === true) {
-      this.maxHeight = `${this.bodyElement?.offsetHeight}px`;
-      emitEvent(this, "kemet-opened", this);
-    }
-    if (prevProps.get("opened") && this.opened === false) {
-      this.maxHeight = "0px";
-      emitEvent(this, "kemet-closed", this);
-    }
-    this.a11y();
-    this.focusableBodyElements();
-  }
-  render() {
-    return import_lit2.html`
-      <button
-        class="trigger"
-        part="trigger"
-        @click=${() => this.toggle()}
-        @keydown=${(event) => this.handleKeyDown(event)}
-      >
-        <slot name="trigger"></slot>
-        <slot name="icon"></slot>
-      </button>
-      <section class="body" part="body" style="max-height:${this.maxHeight};">
-        <slot name="body"></slot>
-      </section>
-    `;
-  }
-  toggle() {
-    this.opened = !this.opened;
-  }
-  focusableBodyElements() {
-    const focusableElements = this.bodyElement?.querySelectorAll(this.focusableSelector);
-    if (this.opened) {
-      focusableElements?.forEach((element) => {
-        element.removeAttribute("tabindex");
-      });
-    } else {
-      focusableElements?.forEach((element) => {
-        element.setAttribute("tabindex", "-1");
-      });
-    }
-  }
-  a11y() {
-    const trigger = this.shadowRoot?.querySelector(".trigger");
-    const body = this.shadowRoot?.querySelector(".body");
-    trigger?.setAttribute("id", `${this.slug}-button`);
-    trigger?.setAttribute("aria-controls", `${this.slug}-content`);
-    body?.setAttribute("id", `${this.slug}-content`);
-    body?.setAttribute("aria-labelledby", `${this.slug}-button`);
-    body?.setAttribute("aria-hidden", `${!this.opened}`);
-  }
-  handleKeyDown(event) {
-    if (event.key === "Space" || event.key === "Enter") {
-      this.toggle();
-    }
-  }
-};
-KemetAccordionPanel.styles = [stylesPanel];
-__decorateClass([
-  (0, import_decorators.property)({ type: Boolean, reflect: true })
-], KemetAccordionPanel.prototype, "opened", 2);
-__decorateClass([
-  (0, import_decorators.property)({ type: String, attribute: "max-height" })
-], KemetAccordionPanel.prototype, "maxHeight", 2);
-__decorateClass([
-  (0, import_decorators.property)({ type: String })
-], KemetAccordionPanel.prototype, "slug", 2);
-__decorateClass([
-  (0, import_decorators.property)({ type: Number })
-], KemetAccordionPanel.prototype, "index", 2);
-__decorateClass([
-  (0, import_decorators.state)()
-], KemetAccordionPanel.prototype, "focusableSelector", 2);
-__decorateClass([
-  (0, import_decorators.state)()
-], KemetAccordionPanel.prototype, "bodyElement", 2);
-__decorateClass([
-  (0, import_decorators.state)()
-], KemetAccordionPanel.prototype, "bodyElementFirst", 2);
-__decorateClass([
-  (0, import_decorators.state)()
-], KemetAccordionPanel.prototype, "bodyElementLast", 2);
-KemetAccordionPanel = __decorateClass([
-  (0, import_decorators.customElement)("kemet-accordion-panel")
-], KemetAccordionPanel);
-//# sourceMappingURL=accordion-panel.js.map

package/dist/elements/accordion-panel.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/elements/accordion-panel.ts","../../src/utilities/events.ts","../../src/styles/elements/accordion.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { emitEvent } from '../utilities/events';\nimport { stylesPanel } from '../styles/elements/accordion';\n\n/**\n * @since 1.0.0\n * @status stable\n *\n * @tagname kemet-accordion-panel\n * @summary A blade for an accordion.\n *\n * @prop {boolean} opened - Determines the opened state of the panel\n * @prop {string} maxHeight - Sets the max height of the panel's body\n * @prop {string} slug - Uniquely identifies a panel for accessibility purposes\n *\n * @slot trigger - The trigger button that opens and closes the panel.\n * @slot body - The body content of the panel.\n * @slot icon - The icon for the panel.\n *\n * @csspart trigger - Contains the trigger for the panel.\n * @csspart body - Contains the body for the panel.\n *\n * @event kemet-opened - Fires when a panel is opened\n * @event kemet-closed - Fires when a panel is closed\n *\n */\n\n@customElement('kemet-accordion-panel')\nexport default class KemetAccordionPanel extends LitElement {\n  static styles = [stylesPanel];\n\n  @property({ type: Boolean, reflect: true })\n  opened: boolean | undefined = undefined;\n\n  @property({ type: String, attribute: 'max-height' })\n  maxHeight: string = '0px';\n\n  @property({ type: String })\n  slug: string = 'panel';\n\n  @property({ type: Number })\n  index: number;\n\n  /** @internal */\n  @state()\n  focusableSelector: string;\n\n  /** @internal */\n  @state()\n  bodyElement: HTMLElement | null;\n\n  /** @internal */\n  @state()\n  bodyElementFirst: HTMLElement | null | undefined;\n\n  /** @internal */\n  @state()\n  bodyElementLast: HTMLElement | null | undefined;\n\n  firstUpdated() {\n    this.focusableSelector = 'body, a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, *[tabindex], *[contenteditable]';\n    this.bodyElement = this.querySelector('[slot=\"body\"]');\n    this.bodyElementFirst = this.bodyElement?.querySelector(':first-child');\n    this.bodyElementLast = this.bodyElement?.querySelector(':last-child');\n\n    if (this.bodyElementFirst) this.bodyElementFirst.style.marginTop = '0';\n    if (this.bodyElementLast) this.bodyElementLast.style.marginBottom = '0';\n  }\n\n  updated(prevProps: Map<string, never>) {\n    if (!prevProps.get('opened') && this.opened === true) {\n      this.maxHeight = `${this.bodyElement?.offsetHeight}px`;\n      emitEvent(this, 'kemet-opened', this);\n    }\n\n    if (prevProps.get('opened') && this.opened === false) {\n      this.maxHeight = '0px';\n      emitEvent(this, 'kemet-closed', this);\n    }\n\n    this.a11y();\n    this.focusableBodyElements();\n  }\n\n  render() {\n    return html`\n      <button\n        class=\"trigger\"\n        part=\"trigger\"\n        @click=${() => this.toggle()}\n        @keydown=${(event: KeyboardEvent) => this.handleKeyDown(event)}\n      >\n        <slot name=\"trigger\"></slot>\n        <slot name=\"icon\"></slot>\n      </button>\n      <section class=\"body\" part=\"body\" style=\"max-height:${this.maxHeight};\">\n        <slot name=\"body\"></slot>\n      </section>\n    `;\n  }\n\n  toggle() {\n    this.opened = !this.opened;\n  }\n\n  focusableBodyElements() {\n    const focusableElements = this.bodyElement?.querySelectorAll(this.focusableSelector);\n\n    if (this.opened) {\n      focusableElements?.forEach((element) => {\n        element.removeAttribute('tabindex');\n      });\n    } else {\n      focusableElements?.forEach((element) => {\n        element.setAttribute('tabindex', '-1');\n      });\n    }\n  }\n\n  a11y() {\n    const trigger = this.shadowRoot?.querySelector('.trigger');\n    const body = this.shadowRoot?.querySelector('.body');\n\n    trigger?.setAttribute('id', `${this.slug}-button`);\n    trigger?.setAttribute('aria-controls', `${this.slug}-content`);\n\n    body?.setAttribute('id', `${this.slug}-content`);\n    body?.setAttribute('aria-labelledby', `${this.slug}-button`);\n    body?.setAttribute('aria-hidden', `${!this.opened}`);\n  }\n\n  handleKeyDown(event: KeyboardEvent) {\n    if (event.key === 'Space' || event.key === 'Enter') {\n      this.toggle();\n    }\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kemet-accordion-panel': KemetAccordionPanel\n  }\n}\n","export const emitEvent = (element, name, detail, bubbles = true, composed = true) => {\n  element.dispatchEvent(\n    new CustomEvent(name, { bubbles, composed, detail }),\n  );\n};\n","import { css } from 'lit';\n\nexport const stylesBase =  css`\n  :host {\n    display: block;\n  }\n`;\n\nexport const stylesPanel = css`\n  *,\n  *::before,\n  *::after {\n    box-sizing: border-box;\n  }\n\n  :host {\n    display: block;\n    padding: 1.5rem 1rem;\n    border-bottom: 1px solid rgb(var(--kemet-color-foreground));\n  }\n\n  .trigger {\n    color: inherit;\n    cursor: pointer;\n    display: grid;\n    gap: 1rem;\n    grid-template-columns: 1fr auto;\n    width: 100%;\n    text-align: left;\n    padding: 0;\n    border: none;\n    background: none;\n  }\n\n  .body {\n    overflow: hidden;\n    transition: all 300ms ease;\n  }\n\n  ::slotted([slot='body']) {\n    padding: 1rem 0;\n  }\n`;\n"],"mappings":"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","names":["import_lit"]}

package/dist/elements/accordion-panel.mjs

@@ -1,10 +0,0 @@
-import {
-  KemetAccordionPanel
-} from "../chunk-YP7UN6IN.mjs";
-import "../chunk-TFESUHTA.mjs";
-import "../chunk-LHEY3UOF.mjs";
-import "../chunk-SAWN7RJP.mjs";
-export {
-  KemetAccordionPanel as default
-};
-//# sourceMappingURL=accordion-panel.mjs.map

package/dist/elements/accordion-panel.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/elements/accordion.d.mts

@@ -1,53 +0,0 @@
-import * as lit_html from 'lit-html';
-import * as lit from 'lit';
-import { LitElement } from 'lit';
-import KemetAccordionPanel from './accordion-panel.mjs';
-
-/**
- * @since 1.0.0
- * @status stable
- *
- * @tagname kemet-accordion
- * @summary A component that acts like a standard accordion.
- *
- * @prop {number} currentPanel - The index value for the most recently opened panel
- * @prop {boolean} togglePanels - Support for closing all inactive panels when one is opened
- *
- *
- */
-declare class KemetAccordion extends LitElement {
-    static styles: lit.CSSResult[];
-    currentPanel: number;
-    togglePanels: boolean;
-    panels: NodeListOf<KemetAccordionPanel>;
-    onKeyDown: (event: KeyboardEvent) => void;
-    currentPanelFocus: number;
-    constructor();
-    firstUpdated(): void;
-    render(): lit_html.TemplateResult<1>;
-    handleSlotChange(): void;
-    handlePanelOpened(event: CustomEvent): void;
-    navigatePanels(direction: string): void;
-    handleKeyDown(event: KeyboardEvent): void;
-    /**
-     * Expands all panels in the accordion
-     * @public
-     * @method expandAll
-     * @returns {void}
-     */
-    expandAll(): void;
-    /**
-     * Collapses all panels in the accordion
-     * @public
-     * @method collapseAll
-     * @returns {void}
-     */
-    collapseAll(): void;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'kemet-accordion': KemetAccordion;
-    }
-}
-
-export { KemetAccordion as default };

package/dist/elements/accordion.d.ts

@@ -1,53 +0,0 @@
-import * as lit_html from 'lit-html';
-import * as lit from 'lit';
-import { LitElement } from 'lit';
-import KemetAccordionPanel from './accordion-panel.js';
-
-/**
- * @since 1.0.0
- * @status stable
- *
- * @tagname kemet-accordion
- * @summary A component that acts like a standard accordion.
- *
- * @prop {number} currentPanel - The index value for the most recently opened panel
- * @prop {boolean} togglePanels - Support for closing all inactive panels when one is opened
- *
- *
- */
-declare class KemetAccordion extends LitElement {
-    static styles: lit.CSSResult[];
-    currentPanel: number;
-    togglePanels: boolean;
-    panels: NodeListOf<KemetAccordionPanel>;
-    onKeyDown: (event: KeyboardEvent) => void;
-    currentPanelFocus: number;
-    constructor();
-    firstUpdated(): void;
-    render(): lit_html.TemplateResult<1>;
-    handleSlotChange(): void;
-    handlePanelOpened(event: CustomEvent): void;
-    navigatePanels(direction: string): void;
-    handleKeyDown(event: KeyboardEvent): void;
-    /**
-     * Expands all panels in the accordion
-     * @public
-     * @method expandAll
-     * @returns {void}
-     */
-    expandAll(): void;
-    /**
-     * Collapses all panels in the accordion
-     * @public
-     * @method collapseAll
-     * @returns {void}
-     */
-    collapseAll(): void;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'kemet-accordion': KemetAccordion;
-    }
-}
-
-export { KemetAccordion as default };

package/dist/elements/accordion.js

@@ -1,209 +0,0 @@
-var __defProp = Object.defineProperty;
-var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
-var __getOwnPropNames = Object.getOwnPropertyNames;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __export = (target, all) => {
-  for (var name in all)
-    __defProp(target, name, { get: all[name], enumerable: true });
-};
-var __copyProps = (to, from, except, desc) => {
-  if (from && typeof from === "object" || typeof from === "function") {
-    for (let key of __getOwnPropNames(from))
-      if (!__hasOwnProp.call(to, key) && key !== except)
-        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
-  }
-  return to;
-};
-var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
-var __decorateClass = (decorators, target, key, kind) => {
-  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
-  for (var i = decorators.length - 1, decorator; i >= 0; i--)
-    if (decorator = decorators[i])
-      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
-  if (kind && result) __defProp(target, key, result);
-  return result;
-};
-
-// src/elements/accordion.ts
-var accordion_exports = {};
-__export(accordion_exports, {
-  default: () => KemetAccordion
-});
-module.exports = __toCommonJS(accordion_exports);
-var import_lit2 = require("lit");
-var import_decorators = require("lit/decorators.js");
-
-// src/styles/elements/accordion.ts
-var import_lit = require("lit");
-var stylesBase = import_lit.css`
-  :host {
-    display: block;
-  }
-`;
-var stylesPanel = import_lit.css`
-  *,
-  *::before,
-  *::after {
-    box-sizing: border-box;
-  }
-
-  :host {
-    display: block;
-    padding: 1.5rem 1rem;
-    border-bottom: 1px solid rgb(var(--kemet-color-foreground));
-  }
-
-  .trigger {
-    color: inherit;
-    cursor: pointer;
-    display: grid;
-    gap: 1rem;
-    grid-template-columns: 1fr auto;
-    width: 100%;
-    text-align: left;
-    padding: 0;
-    border: none;
-    background: none;
-  }
-
-  .body {
-    overflow: hidden;
-    transition: all 300ms ease;
-  }
-
-  ::slotted([slot='body']) {
-    padding: 1rem 0;
-  }
-`;
-
-// src/elements/accordion.ts
-var KemetAccordion = class extends import_lit2.LitElement {
-  constructor() {
-    super();
-    this.currentPanel = 0;
-    this.togglePanels = false;
-    this.addEventListener("kemet-opened", this.handlePanelOpened.bind(this));
-  }
-  firstUpdated() {
-    this.onKeyDown = (event) => this.handleKeyDown(event);
-  }
-  render() {
-    return import_lit2.html`<slot @slotchange=${() => this.handleSlotChange()}></slot>`;
-  }
-  handleSlotChange() {
-    this.panels = this.querySelectorAll("kemet-accordion-panel");
-    this.panels.forEach((panel, index) => {
-      panel.index = index;
-      panel.removeEventListener("keydown", this.onKeyDown);
-      panel.addEventListener("keydown", this.onKeyDown);
-    });
-  }
-  handlePanelOpened(event) {
-    this.panels?.forEach((panel) => {
-      if (panel === event.detail) {
-        this.currentPanel = panel.index;
-      }
-    });
-    if (this.togglePanels) {
-      this.panels?.forEach((panel) => {
-        if (panel !== event.detail) {
-          panel.opened = false;
-        }
-      });
-    }
-  }
-  navigatePanels(direction) {
-    switch (direction) {
-      case "home":
-        this.currentPanel = 0;
-        break;
-      case "end":
-        this.currentPanel = this.panels.length - 1;
-        break;
-      case "next":
-        this.currentPanel += 1;
-        break;
-      case "prev":
-        this.currentPanel -= 1;
-        break;
-      default:
-        this.currentPanelFocus = 0;
-        break;
-    }
-    if (this.currentPanel > this.panels.length - 1) this.currentPanel = 0;
-    if (this.currentPanel < 0) this.currentPanel = this.panels.length - 1;
-    this.panels[this.currentPanel].shadowRoot.querySelector("button").focus();
-  }
-  handleKeyDown(event) {
-    const target = event.target;
-    switch (event.key) {
-      case "Enter":
-      case "Space":
-        event.preventDefault();
-        target.click();
-        break;
-      case "ArrowLeft":
-      case "ArrowUp":
-        event.preventDefault();
-        this.navigatePanels("prev");
-        break;
-      case "ArrowRight":
-      case "ArrowDown":
-        event.preventDefault();
-        this.navigatePanels("next");
-        break;
-      case "End":
-        event.preventDefault();
-        this.navigatePanels("end");
-        break;
-      case "Home":
-        event.preventDefault();
-        this.navigatePanels("home");
-        break;
-      default:
-        break;
-    }
-  }
-  /**
-   * Expands all panels in the accordion
-   * @public
-   * @method expandAll
-   * @returns {void}
-   */
-  expandAll() {
-    this.panels.forEach((panel) => {
-      panel.opened = true;
-    });
-  }
-  /**
-   * Collapses all panels in the accordion
-   * @public
-   * @method collapseAll
-   * @returns {void}
-   */
-  collapseAll() {
-    this.panels.forEach((panel) => {
-      panel.opened = false;
-    });
-  }
-};
-KemetAccordion.styles = [stylesBase];
-__decorateClass([
-  (0, import_decorators.property)({ type: Number, attribute: "current-panel" })
-], KemetAccordion.prototype, "currentPanel", 2);
-__decorateClass([
-  (0, import_decorators.property)({ type: Boolean, attribute: "toggle-panels" })
-], KemetAccordion.prototype, "togglePanels", 2);
-__decorateClass([
-  (0, import_decorators.state)()
-], KemetAccordion.prototype, "panels", 2);
-__decorateClass([
-  (0, import_decorators.state)()
-], KemetAccordion.prototype, "onKeyDown", 2);
-__decorateClass([
-  (0, import_decorators.state)()
-], KemetAccordion.prototype, "currentPanelFocus", 2);
-KemetAccordion = __decorateClass([
-  (0, import_decorators.customElement)("kemet-accordion")
-], KemetAccordion);
-//# sourceMappingURL=accordion.js.map

package/dist/elements/accordion.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/elements/accordion.ts","../../src/styles/elements/accordion.ts"],"sourcesContent":["import { html, LitElement } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { stylesBase } from '../styles/elements/accordion';\nimport KemetAccordionPanel from './accordion-panel';\n\n/**\n * @since 1.0.0\n * @status stable\n *\n * @tagname kemet-accordion\n * @summary A component that acts like a standard accordion.\n *\n * @prop {number} currentPanel - The index value for the most recently opened panel\n * @prop {boolean} togglePanels - Support for closing all inactive panels when one is opened\n *\n *\n */\n\n@customElement('kemet-accordion')\nexport default class KemetAccordion extends LitElement {\n  static styles = [stylesBase];\n\n  @property({ type: Number, attribute: 'current-panel' })\n  currentPanel: number = 0;\n\n  @property({ type: Boolean, attribute: 'toggle-panels' })\n  togglePanels: boolean = false;\n\n  @state()\n  panels: NodeListOf<KemetAccordionPanel>;\n\n  @state()\n  onKeyDown: (event: KeyboardEvent) => void;\n\n  @state()\n  currentPanelFocus: number;\n\n  constructor() {\n    super();\n\n    // bindings\n    this.addEventListener('kemet-opened', this.handlePanelOpened.bind(this));\n  }\n\n  firstUpdated() {\n    this.onKeyDown = event => this.handleKeyDown(event);\n  }\n\n  render() {\n    return html`<slot @slotchange=${() => this.handleSlotChange()}></slot>`;\n  }\n\n  handleSlotChange() {\n    this.panels = this.querySelectorAll('kemet-accordion-panel');\n\n    this.panels.forEach((panel: KemetAccordionPanel, index) => {\n      panel.index = index;\n      panel.removeEventListener('keydown', this.onKeyDown);\n      panel.addEventListener('keydown', this.onKeyDown);\n    });\n  }\n\n  handlePanelOpened(event: CustomEvent) {\n    this.panels?.forEach((panel: KemetAccordionPanel) => {\n      if (panel === event.detail) {\n        this.currentPanel = panel.index;\n      }\n    });\n\n    if (this.togglePanels) {\n      this.panels?.forEach((panel: KemetAccordionPanel) => {\n        if (panel !== event.detail) {\n          panel.opened = false;\n        }\n      });\n    }\n  }\n\n  navigatePanels(direction: string) {\n    switch (direction) {\n      case 'home':\n        this.currentPanel = 0;\n        break;\n      case 'end':\n        this.currentPanel = this.panels.length - 1;\n        break;\n      case 'next':\n        this.currentPanel += 1;\n        break;\n      case 'prev':\n        this.currentPanel -= 1;\n        break;\n      default:\n        this.currentPanelFocus = 0;\n        break;\n    }\n\n    if (this.currentPanel > this.panels.length - 1) this.currentPanel = 0;\n    if (this.currentPanel < 0) this.currentPanel = this.panels.length - 1;\n\n    this.panels[this.currentPanel].shadowRoot.querySelector('button').focus();\n  }\n\n  handleKeyDown(event: KeyboardEvent) {\n    const target = event.target as HTMLElement;\n    switch (event.key) {\n      case 'Enter':\n      case 'Space':\n        event.preventDefault();\n        target.click();\n        break;\n      case 'ArrowLeft':\n      case 'ArrowUp':\n        event.preventDefault();\n        this.navigatePanels('prev');\n        break;\n      case 'ArrowRight':\n      case 'ArrowDown':\n        event.preventDefault();\n        this.navigatePanels('next');\n        break;\n      case 'End':\n        event.preventDefault();\n        this.navigatePanels('end');\n        break;\n      case 'Home':\n        event.preventDefault();\n        this.navigatePanels('home');\n        break;\n      default:\n        break;\n    }\n  }\n\n  /**\n   * Expands all panels in the accordion\n   * @public\n   * @method expandAll\n   * @returns {void}\n   */\n  expandAll(): void {\n    this.panels.forEach((panel) => {\n      panel.opened = true;\n    });\n  }\n\n  /**\n   * Collapses all panels in the accordion\n   * @public\n   * @method collapseAll\n   * @returns {void}\n   */\n  collapseAll(): void {\n    this.panels.forEach((panel) => {\n      panel.opened = false;\n    });\n  }\n}\n\ndeclare global {\n  interface HTMLElementTagNameMap {\n    'kemet-accordion': KemetAccordion\n  }\n}\n","import { css } from 'lit';\n\nexport const stylesBase =  css`\n  :host {\n    display: block;\n  }\n`;\n\nexport const stylesPanel = css`\n  *,\n  *::before,\n  *::after {\n    box-sizing: border-box;\n  }\n\n  :host {\n    display: block;\n    padding: 1.5rem 1rem;\n    border-bottom: 1px solid rgb(var(--kemet-color-foreground));\n  }\n\n  .trigger {\n    color: inherit;\n    cursor: pointer;\n    display: grid;\n    gap: 1rem;\n    grid-template-columns: 1fr auto;\n    width: 100%;\n    text-align: left;\n    padding: 0;\n    border: none;\n    background: none;\n  }\n\n  .body {\n    overflow: hidden;\n    transition: all 300ms ease;\n  }\n\n  ::slotted([slot='body']) {\n    padding: 1rem 0;\n  }\n`;\n"],"mappings":"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","names":["import_lit"]}

package/dist/elements/accordion.mjs

@@ -1,9 +0,0 @@
-import {
-  KemetAccordion
-} from "../chunk-GD6K7M4N.mjs";
-import "../chunk-TFESUHTA.mjs";
-import "../chunk-SAWN7RJP.mjs";
-export {
-  KemetAccordion as default
-};
-//# sourceMappingURL=accordion.mjs.map

package/dist/elements/accordion.mjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}

package/dist/elements/alert.d.mts

@@ -1,75 +0,0 @@
-import * as lit_html from 'lit-html';
-import * as lit from 'lit';
-import { LitElement } from 'lit';
-import { T as TypeStatus, a as TypeRoundedSizes } from '../constants-BEtO8uLN.mjs';
-import '../form-controller-BR0gZhrG.mjs';
-
-declare const overlayPositions: readonly ["fixed", "top-full", "bottom-full", "top-right", "top-left", "bottom-right", "bottom-left"];
-declare enum EnumOverlayPositions {
-    FIXED = "fixed",
-    TOP_FULL = "top-full",
-    BOTTOM_FULL = "bottom-full",
-    TOP_RIGHT = "top-right",
-    TOP_LEFT = "top-left",
-    BOTTOM_RIGHT = "bottom-right",
-    BOTTOM_LEFT = "bottom-left"
-}
-type TypeOverlayPositions = typeof overlayPositions[number];
-/**
- * @since 1.4.0
- * @status stable
- *
- * @tagname kemet-alert
- * @summary Calls out important messages and notifications.
- *
- * @prop {boolean} opened - Determines if the alert is opened or not.
- * @prop {boolean} reveal - Fades in the alert when opened.
- * @prop {boolean} closable - Adds a close button to the alert.
- * @prop {TypeDirection} borderStatus - Adds a border that indicates the status.
- * @prop {boolean} hidden - Hides the element from document flow.
- * @prop {TypeOverlayPositions} overlay - Fixes the alert over content in specified position.
- * @prop {TypeVariants} variant - The style of the alert.
- * @prop {TypeRoundedSizes} rounded - The rounded size of the alert.
- * @prop {boolean} filled - Determines if the alert uses the filled style.
- *
- * @slot icon - The icon of the alert.
- * @slot default - The contents of the alert.
- *
- * @event kemet-opened - Fires when alert is opened.
- * @event kemet-closed - Fires when alert is closed.
- *
- * @csspart close - Container for the close button.
- * @csspart message - Container for the alert message.
- *
- * @cssproperty --kemet-alert-padding - The padding on the alert.
- * @cssproperty --kemet-alert-border-thickness - The thickness of the border.
- * @cssproperty --kemet-alert-status-color - The status color. Default: inherit.
- * @cssproperty --kemet-alert-align-items - The alert's alignment.
- * @cssproperty --kemet-alert-border - The border around the alert.
- *
- */
-declare class KemetAlert extends LitElement {
-    static styles: lit.CSSResult[];
-    opened: boolean;
-    reveal: boolean;
-    closable: boolean;
-    status: TypeStatus;
-    borderStatus: string;
-    hidden: boolean;
-    overlay: string;
-    rounded: TypeRoundedSizes;
-    filled: boolean;
-    shouldUpdate(prevProps: Map<string, never>): boolean;
-    firstUpdated(): void;
-    updated(prevProps: Map<string, never>): void;
-    render(): lit_html.TemplateResult<1>;
-    makeCloseBtn(): lit_html.TemplateResult<1>;
-    handleMotion(): void;
-}
-declare global {
-    interface HTMLElementTagNameMap {
-        'kemet-alert': KemetAlert;
-    }
-}
-
-export { EnumOverlayPositions, type TypeOverlayPositions, KemetAlert as default, overlayPositions };