agnosticui-core 2.0.0-alpha.2

package/dist/VueTooltip.vue_vue_type_script_setup_true_lang-BGhqFxll.js

@@ -0,0 +1,48 @@
+import { defineComponent as c, ref as r, createElementBlock as h, openBlock as g, mergeProps as f, renderSlot as m } from "vue";
+import "./components/Tooltip/core/Tooltip.js";
+const u = ["content", "placement", "distance", "skidding", "trigger", ".disabled"], b = /* @__PURE__ */ c({
+  __name: "VueTooltip",
+  props: {
+    content: { default: "" },
+    placement: { default: "top" },
+    distance: { default: 8 },
+    skidding: { default: 0 },
+    trigger: { default: "hover focus" },
+    disabled: { type: Boolean, default: !1 }
+  },
+  emits: ["show", "hide"],
+  setup(e, { expose: i, emit: s }) {
+    const n = s, o = r(), l = (t) => {
+      n("show", t.detail);
+    }, a = (t) => {
+      n("hide", t.detail);
+    };
+    return i({
+      show: () => {
+        o.value?.show();
+      },
+      hide: () => {
+        o.value?.hide();
+      },
+      toggle: () => {
+        o.value?.toggle();
+      }
+    }), (t, d) => (g(), h("ag-tooltip", f({
+      ref_key: "tooltipRef",
+      ref: o,
+      content: e.content,
+      placement: e.placement,
+      distance: e.distance,
+      skidding: e.skidding,
+      trigger: e.trigger,
+      ".disabled": e.disabled,
+      onShow: l,
+      onHide: a
+    }, t.$attrs), [
+      m(t.$slots, "default")
+    ], 48, u));
+  }
+});
+export {
+  b as _
+};

package/dist/VueVisuallyHidden.vue_vue_type_script_setup_true_lang-C_9Tq_M2.js

@@ -0,0 +1,13 @@
+import { defineComponent as n, createElementBlock as o, openBlock as t, renderSlot as l } from "vue";
+import "./components/VisuallyHidden/core/VisuallyHidden.js";
+const p = /* @__PURE__ */ n({
+  __name: "VueVisuallyHidden",
+  setup(r) {
+    return (e, a) => (t(), o("ag-visually-hidden", null, [
+      l(e.$slots, "default")
+    ]));
+  }
+});
+export {
+  p as _
+};

package/dist/_commonjsHelpers-DaMA6jEr.js

@@ -0,0 +1,8 @@
+var o = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
+function l(e) {
+  return e && e.__esModule && Object.prototype.hasOwnProperty.call(e, "default") ? e.default : e;
+}
+export {
+  o as c,
+  l as g
+};

package/dist/_plugin-vue_export-helper-CHgC5LLL.js

@@ -0,0 +1,9 @@
+const s = (t, r) => {
+  const o = t.__vccOpts || t;
+  for (const [c, e] of r)
+    o[c] = e;
+  return o;
+};
+export {
+  s as _
+};

package/dist/assets/agnosticui-core.css

@@ -0,0 +1 @@
+.demo-container.svelte-1pf13wd{max-width:800px;margin:0 auto;padding:2rem;font-family:system-ui,-apple-system,sans-serif}.demo-section.svelte-1pf13wd{margin-bottom:2rem;padding:1.5rem;border:1px solid #e0e0e0;border-radius:8px;background:#fafafa}.demo-section.svelte-1pf13wd h3:where(.svelte-1pf13wd){margin:0 0 1rem;color:#333;font-size:1.1rem}.button-group.svelte-1pf13wd{display:flex;flex-wrap:wrap;gap:1rem;align-items:center}.action-log.svelte-1pf13wd{border:1px solid #ddd;border-radius:4px;padding:1rem;background:#fff;max-height:300px;overflow-y:auto}.clear-button.svelte-1pf13wd{padding:.5rem 1rem;background:#f0f0f0;border:1px solid #ccc;border-radius:4px;cursor:pointer;margin-bottom:1rem}.clear-button.svelte-1pf13wd:hover:not(:disabled){background:#e0e0e0}.clear-button.svelte-1pf13wd:disabled{opacity:.5;cursor:not-allowed}.empty-state.svelte-1pf13wd{color:#666;font-style:italic;margin:0}.action-log.svelte-1pf13wd ul:where(.svelte-1pf13wd){margin:0;padding:0;list-style:none}.action-log.svelte-1pf13wd li:where(.svelte-1pf13wd){padding:.25rem 0;border-bottom:1px solid #f0f0f0;font-family:monospace;font-size:.9rem}.action-log.svelte-1pf13wd li:where(.svelte-1pf13wd):last-child{border-bottom:none}ag-icon-button{--ag-icon-button-padding: .5rem;--ag-icon-button-border-radius: .25rem;--ag-icon-button-font-size: 1rem}ag-icon-button[variant=primary]{--ag-icon-button-background: #0066cc;--ag-icon-button-color: white;--ag-icon-button-background-hover: #0052a3}ag-icon-button[variant=danger]{--ag-icon-button-background: transparent;--ag-icon-button-color: #d73a49;--ag-icon-button-background-hover: rgba(215, 58, 73, .1);--ag-icon-button-border-hover: 1px solid #d73a49}ag-icon-button[variant=secondary]{--ag-icon-button-background: #f6f8fa;--ag-icon-button-color: #24292f;--ag-icon-button-border: 1px solid #d0d7de;--ag-icon-button-background-hover: #f3f4f6}

package/dist/components/Accordion/core/Accordion.d.ts

@@ -0,0 +1,12 @@
+import { AccordionItem } from './_Accordion.js';
+import { AccordionGroup } from './AccordionGroup.js';
+
+declare global {
+    interface HTMLElementTagNameMap {
+        'ag-accordion': AccordionGroup;
+        'ag-accordion-item': AccordionItem;
+    }
+}
+export * from './_Accordion.js';
+export { AccordionGroup } from './AccordionGroup.js';
+//# sourceMappingURL=Accordion.d.ts.map

package/dist/components/Accordion/core/Accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/core/Accordion.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAUrD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,cAAc,EAAE,cAAc,CAAC;QAC/B,mBAAmB,EAAE,aAAa,CAAC;KACpC;CACF;AAED,cAAc,iBAAiB,CAAC;AAChC,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/components/Accordion/core/Accordion.js

@@ -0,0 +1,10 @@
+import { AccordionItem as o } from "./_Accordion.js";
+import { Accordion as r } from "./_Accordion.js";
+import { AccordionGroup as e } from "./AccordionGroup.js";
+customElements.get("ag-accordion") || customElements.define("ag-accordion", e);
+customElements.get("ag-accordion-item") || customElements.define("ag-accordion-item", o);
+export {
+  r as Accordion,
+  e as AccordionGroup,
+  o as AccordionItem
+};

package/dist/components/Accordion/core/AccordionGroup.d.ts

@@ -0,0 +1,15 @@
+import { LitElement } from 'lit';
+
+interface AccordionItemElement extends HTMLElement {
+    disabled: boolean;
+    focus(): void;
+}
+export declare class AccordionGroup extends LitElement {
+    static styles: import('lit').CSSResult[];
+    constructor();
+    get accordions(): AccordionItemElement[];
+    handleAccordionKeydown: (e: Event) => void;
+    render(): import('lit').TemplateResult<1>;
+}
+export {};
+//# sourceMappingURL=AccordionGroup.d.ts.map

package/dist/components/Accordion/core/AccordionGroup.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"AccordionGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/core/AccordionGroup.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAG5C,UAAU,oBAAqB,SAAQ,WAAW;IAChD,QAAQ,EAAE,OAAO,CAAC;IAClB,KAAK,IAAI,IAAI,CAAC;CACf;AAED,qBAAa,cAAe,SAAQ,UAAU;IAC5C,MAAM,CAAC,MAAM,4BAKV;;IAMH,IAAI,UAAU,IAAI,oBAAoB,EAAE,CAOvC;IAED,sBAAsB,GAAI,GAAG,KAAK,UAiChC;IAEF,MAAM;CAGP"}

package/dist/components/Accordion/core/AccordionGroup.js

@@ -0,0 +1,46 @@
+import { LitElement as a, css as l, html as h } from "lit";
+const c = class c extends a {
+  constructor() {
+    super(), this.handleAccordionKeydown = (n) => {
+      const r = n, e = this.accordions;
+      if (e.length === 0) return;
+      const { key: i, accordionItem: d } = r.detail, o = e.indexOf(d);
+      if (o === -1) return;
+      let t = o;
+      switch (i) {
+        case "ArrowDown":
+          t = (o + 1) % e.length;
+          break;
+        case "ArrowUp":
+          t = (o - 1 + e.length) % e.length;
+          break;
+        case "Home":
+          t = 0;
+          break;
+        case "End":
+          t = e.length - 1;
+          break;
+        default:
+          return;
+      }
+      t !== o && e[t].focus();
+    }, this.addEventListener("accordion-keydown", this.handleAccordionKeydown);
+  }
+  get accordions() {
+    return Array.from(this.children).filter((n) => "disabled" in n && "focus" in n && typeof n.focus == "function" && !n.disabled);
+  }
+  render() {
+    return h`<slot></slot>`;
+  }
+};
+c.styles = [l`
+    :host {
+      display: block;
+      width: 100%;
+    }
+  `];
+let s = c;
+customElements.get("ag-accordion") || customElements.define("ag-accordion", s);
+export {
+  s as AccordionGroup
+};

package/dist/components/Accordion/core/_Accordion.d.ts

@@ -0,0 +1,106 @@
+import { LitElement } from 'lit';
+
+export interface AccordionItemToggleEventDetail {
+    open: boolean;
+}
+export type AccordionItemToggleEvent = CustomEvent<AccordionItemToggleEventDetail>;
+export interface AccordionProps {
+}
+export interface AccordionItemProps {
+    open?: boolean;
+    headingLevel?: number;
+    disabled?: boolean;
+    bordered?: boolean;
+    background?: boolean;
+    useChevron?: boolean;
+    useX?: boolean;
+    useMinus?: boolean;
+    noIndicator?: boolean;
+    onToggle?: (event: AccordionItemToggleEvent) => void;
+}
+export declare class Accordion extends LitElement implements AccordionProps {
+    static styles: import('lit').CSSResult[];
+    render(): import('lit').TemplateResult<1>;
+}
+export declare class AccordionItem extends LitElement implements AccordionItemProps {
+    static properties: {
+        open: {
+            type: BooleanConstructor;
+            reflect: boolean;
+        };
+        headingLevel: {
+            type: NumberConstructor;
+            reflect: boolean;
+            attribute: string;
+        };
+        disabled: {
+            type: BooleanConstructor;
+            reflect: boolean;
+        };
+        bordered: {
+            type: BooleanConstructor;
+            reflect: boolean;
+        };
+        background: {
+            type: BooleanConstructor;
+            reflect: boolean;
+        };
+        useChevron: {
+            type: BooleanConstructor;
+            reflect: boolean;
+            attribute: string;
+        };
+        useX: {
+            type: BooleanConstructor;
+            reflect: boolean;
+            attribute: string;
+        };
+        useMinus: {
+            type: BooleanConstructor;
+            reflect: boolean;
+            attribute: string;
+        };
+        noIndicator: {
+            type: BooleanConstructor;
+            reflect: boolean;
+            attribute: string;
+        };
+        onToggle: {
+            attribute: boolean;
+        };
+    };
+    open: boolean;
+    headingLevel: number;
+    disabled: boolean;
+    bordered: boolean;
+    background: boolean;
+    useChevron: boolean;
+    useX: boolean;
+    useMinus: boolean;
+    noIndicator: boolean;
+    onToggle?: (event: AccordionItemToggleEvent) => void;
+    private _id;
+    constructor();
+    connectedCallback(): void;
+    static styles: import('lit').CSSResult[];
+    render(): import('lit').TemplateResult<1>;
+    private _renderChevronIndicator;
+    private _renderPlusIndicator;
+    private _renderMinusIndicator;
+    private _renderIndicator;
+    private _renderHeading;
+    toggle(): void;
+    /**
+     * Focus the accordion's button (for programmatic focus management)
+     */
+    focus(): void;
+    /**
+     * Get the button element (for external focus management)
+     */
+    get buttonElement(): HTMLButtonElement | null;
+    /**
+     * Handle keyboard interactions for individual accordion items
+     */
+    private _handleKeydown;
+}
+//# sourceMappingURL=_Accordion.d.ts.map

package/dist/components/Accordion/core/_Accordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"_Accordion.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/core/_Accordion.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;;;;;;;;;;GAuBG;AAEH,OAAO,EAAE,UAAU,EAAa,MAAM,KAAK,CAAC;AAK5C,MAAM,WAAW,8BAA8B;IAC7C,IAAI,EAAE,OAAO,CAAC;CACf;AACD,MAAM,MAAM,wBAAwB,GAAG,WAAW,CAAC,8BAA8B,CAAC,CAAC;AAGnF,MAAM,WAAW,cAAc;CAE9B;AAED,MAAM,WAAW,kBAAkB;IACjC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IAErB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IAEtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,wBAAwB,KAAK,IAAI,CAAC;CACtD;AAED,qBAAa,SAAU,SAAQ,UAAW,YAAW,cAAc;IACjE,MAAM,CAAC,MAAM,4BAWV;IAEH,MAAM;CAKP;AAED,qBAAa,aAAc,SAAQ,UAAW,YAAW,kBAAkB;IACzE,MAAM,CAAC,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;MAWf;IAEM,IAAI,EAAE,OAAO,CAAC;IACd,YAAY,EAAE,MAAM,CAAC;IACrB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,OAAO,CAAC;IAClB,UAAU,EAAE,OAAO,CAAC;IACpB,UAAU,EAAE,OAAO,CAAC;IACpB,IAAI,EAAE,OAAO,CAAC;IACd,QAAQ,EAAE,OAAO,CAAC;IAClB,WAAW,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,wBAAwB,KAAK,IAAI,CAAC;IAC7D,OAAO,CAAC,GAAG,CAAsC;;IAkBjD,iBAAiB;IAOjB,MAAM,CAAC,MAAM,4BA2GV;IAEH,MAAM;IAkBN,OAAO,CAAC,uBAAuB;IAkB/B,OAAO,CAAC,oBAAoB;IAoB5B,OAAO,CAAC,qBAAqB;IAmB7B,OAAO,CAAC,gBAAgB;IAmBxB,OAAO,CAAC,cAAc;IAsCtB,MAAM;IAmBN;;OAEG;IACH,KAAK;IAKL;;OAEG;IACH,IAAI,aAAa,6BAEhB;IAED;;OAEG;IACH,OAAO,CAAC,cAAc;CAwBvB"}

package/dist/components/Accordion/core/_Accordion.js

@@ -0,0 +1,296 @@
+import { LitElement as s, css as d, html as t } from "lit";
+import { generateUniqueId as l } from "../../../utils/unique-id.js";
+const r = class r extends s {
+  render() {
+    return t`
+      <slot></slot>
+    `;
+  }
+};
+r.styles = [d`
+    :host {
+      display: block;
+    }
+    /* Progressive enhancement: Hide only after web component is defined */
+    :host(:not(:defined)) {
+      visibility: visible; /* Content visible without JS */
+    }
+    :host(:defined) {
+      visibility: visible; /* Explicit visibility once defined */
+    }
+  `];
+let a = r;
+const o = class o extends s {
+  constructor() {
+    super(), this._id = l("accordion-item"), this.open = !1, this.headingLevel = 3, this.disabled = !1, this.bordered = !1, this.background = !1, this.useChevron = !0, this.useX = !1, this.useMinus = !1, this.noIndicator = !1, this.addEventListener("keydown", this._handleKeydown.bind(this));
+  }
+  connectedCallback() {
+    super.connectedCallback(), this.setAttribute("data-enhanced", "");
+  }
+  render() {
+    return t`
+      <div class="header" part="ag-accordion-header-wrapper" @click="${this.toggle}">
+        ${this._renderHeading()}
+      </div>
+      <div
+        class="content"
+        part="ag-accordion-content"
+        role="region"
+        aria-labelledby="${this._id}-button"
+        id="${this._id}-panel"
+        ?hidden="${this.hasAttribute("data-enhanced") && !this.open}"
+      >
+        <slot name="content"></slot>
+      </div>
+    `;
+  }
+  _renderChevronIndicator() {
+    return t`
+      <svg
+        width="20"
+        height="20"
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke="currentColor"
+        stroke-width="2"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+        aria-hidden="true"
+      >
+        <path d="m6 9 6 6 6-6"></path>
+      </svg>
+    `;
+  }
+  _renderPlusIndicator() {
+    return t`
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="20"
+        height="20"
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke="currentColor"
+        stroke-width="2"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+        aria-hidden="true"
+      >
+        <path d="M12 5v14"></path>
+        <path d="M5 12h14"></path>
+      </svg>
+    `;
+  }
+  _renderMinusIndicator() {
+    return t`
+      <svg
+        xmlns="http://www.w3.org/2000/svg"
+        width="20"
+        height="20"
+        viewBox="0 0 24 24"
+        fill="none"
+        stroke="currentColor"
+        stroke-width="2"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+        aria-hidden="true"
+      >
+        <path d="M5 12h14"></path>
+      </svg>
+    `;
+  }
+  _renderIndicator() {
+    return this.noIndicator ? null : this.useX ? this._renderPlusIndicator() : this.useMinus ? this.open ? this._renderMinusIndicator() : this._renderPlusIndicator() : this._renderChevronIndicator();
+  }
+  _renderHeading() {
+    const e = t`
+      <button
+        part="ag-accordion-header"
+        aria-expanded="${this.open}"
+        aria-controls="${this._id}-panel"
+        id="${this._id}-button"
+        ?disabled="${this.disabled}"
+        aria-disabled="${this.disabled}"
+        @keydown="${this._handleKeydown}"
+      >
+        <slot name="header"></slot>
+        <span class="indicator" part="ag-accordion-indicator">
+          <slot name="indicator">
+            ${this._renderIndicator()}
+          </slot>
+        </span>
+      </button>
+    `;
+    switch (Math.max(1, Math.min(6, this.headingLevel || 3))) {
+      case 1:
+        return t`<h1 class="heading" part="ag-accordion-heading">${e}</h1>`;
+      case 2:
+        return t`<h2 class="heading" part="ag-accordion-heading">${e}</h2>`;
+      case 3:
+        return t`<h3 class="heading" part="ag-accordion-heading">${e}</h3>`;
+      case 4:
+        return t`<h4 class="heading" part="ag-accordion-heading">${e}</h4>`;
+      case 5:
+        return t`<h5 class="heading" part="ag-accordion-heading">${e}</h5>`;
+      case 6:
+        return t`<h6 class="heading" part="ag-accordion-heading">${e}</h6>`;
+    }
+  }
+  toggle() {
+    if (this.disabled) return;
+    this.open = !this.open;
+    const e = new CustomEvent("toggle", {
+      detail: { open: this.open },
+      bubbles: !0,
+      composed: !0
+    });
+    this.dispatchEvent(e), this.onToggle && this.onToggle(e);
+  }
+  /**
+   * Focus the accordion's button (for programmatic focus management)
+   */
+  focus() {
+    this.shadowRoot?.querySelector("button")?.focus();
+  }
+  /**
+   * Get the button element (for external focus management)
+   */
+  get buttonElement() {
+    return this.shadowRoot?.querySelector("button") || null;
+  }
+  /**
+   * Handle keyboard interactions for individual accordion items
+   */
+  _handleKeydown(e) {
+    if (this.disabled) return;
+    const { key: n } = e;
+    (n === "Enter" || n === " ") && e.target === this.buttonElement && (e.preventDefault(), this.toggle()), (n === "ArrowDown" || n === "ArrowUp" || n === "Home" || n === "End") && (e.preventDefault(), this.dispatchEvent(new CustomEvent("accordion-keydown", {
+      detail: { key: n, accordionItem: this },
+      bubbles: !0
+    })));
+  }
+};
+o.properties = {
+  open: { type: Boolean, reflect: !0 },
+  headingLevel: { type: Number, reflect: !0, attribute: "heading-level" },
+  disabled: { type: Boolean, reflect: !0 },
+  bordered: { type: Boolean, reflect: !0 },
+  background: { type: Boolean, reflect: !0 },
+  useChevron: { type: Boolean, reflect: !0, attribute: "use-chevron" },
+  useX: { type: Boolean, reflect: !0, attribute: "use-x" },
+  useMinus: { type: Boolean, reflect: !0, attribute: "use-minus" },
+  noIndicator: { type: Boolean, reflect: !0, attribute: "no-indicator" },
+  onToggle: { attribute: !1 }
+}, o.styles = [d`
+    :host {
+      display: block;
+    }
+    .header {
+      cursor: pointer;
+    }
+    :host([disabled]) .header {
+      cursor: not-allowed;
+      opacity: 0.6;
+    }
+    :host([background]) .header {
+      background-color: var(--ag-background-secondary);
+      color: var(--ag-text-primary);
+    }
+    .heading {
+      margin: 0;
+      padding: 0;
+    }
+
+    :host([background]) .heading {
+      margin-inline: var(--ag-space-3);
+    }
+      
+    :host([bordered]) .header button {
+      border-bottom: 1px solid var(--ag-border);
+    }
+
+    .header button {
+      background: none;
+      border: none;
+      padding-block: var(--ag-space-4);
+      margin-block-end: var(--ag-space-2);
+      font: inherit;
+      /* Ensure button inherits color as we've seen in dark mode issues with useragent keeping it color: buttontext black */
+      color: inherit;
+      cursor: pointer;
+      width: 100%;
+      text-align: start;
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+    }
+    .header button:focus-visible {
+      /* Softer focus ring using alpha channel */
+      outline: var(--ag-focus-width) solid rgba(var(--ag-focus), 0.5);
+      outline-offset: var(--ag-focus-offset);
+      transition: outline var(--ag-motion-medium) ease;
+    }
+    :host([disabled]) .header button {
+      cursor: not-allowed;
+      pointer-events: none;
+    }
+
+    /* Indicator wrapper - visible by default unless noIndicator is set */
+    .indicator {
+      display: block;
+      flex-shrink: 0;
+      transition: transform var(--ag-motion-slow) ease;
+    }
+    :host([no-indicator]) .indicator {
+      display: none;
+    }
+
+    /* Chevron indicator (default): starts pointing down, rotates 180deg to point up when open */
+    :host([use-chevron][open]) .indicator {
+      transform: rotate(180deg);
+    }
+
+    /* X indicator: starts rotated 180deg (upside-down plus), rotates to 45deg (X) when open */
+    :host([use-x]) .indicator {
+      transform: rotate(180deg);
+    }
+    :host([use-x][open]) .indicator {
+      transform: rotate(45deg);
+    }
+
+    /* Minus indicator: Plus swaps to minus icon when open - no rotation needed */
+    :host([use-minus]) .indicator {
+      /* No rotation - the icon swap from plus to minus provides the visual feedback */
+      transform: none;
+    }
+
+    /* Respect prefers-reduced-motion */
+    @media (prefers-reduced-motion: reduce) {
+      .header button:focus-visible,
+      .indicator {
+        transition: none;
+      }
+    }
+
+    /* Progressive enhancement: Content visible until JS enhanced */
+    .content {
+      display: block;
+    }
+    /* After JS enhancement, respect open/closed state */
+    :host([data-enhanced]) .content {
+      display: none;
+    }
+    :host([data-enhanced][open]) .content {
+      display: block;
+      margin-block-end: var(--ag-space-2);
+    }
+    /* Ensure hidden attribute works in all environments */
+    .content[hidden] {
+      display: none !important;
+    }
+  `];
+let i = o;
+customElements.get("ag-accordion-item") || customElements.define("ag-accordion-item", i);
+export {
+  a as Accordion,
+  i as AccordionItem
+};

package/dist/components/Accordion/react/ReactAccordion.d.ts

@@ -0,0 +1,35 @@
+import { EventName } from '@lit/react';
+import { Accordion, AccordionItem as AccordionItemElement, AccordionProps, AccordionItemProps, AccordionItemToggleEvent } from '../core/Accordion';
+import * as React from 'react';
+/**
+ * React-specific props for Accordion container
+ */
+export interface ReactAccordionProps extends AccordionProps {
+    children?: React.ReactNode;
+}
+/**
+ * React-specific props for AccordionItem
+ */
+export interface ReactAccordionItemProps extends AccordionItemProps {
+    children?: React.ReactNode;
+}
+/**
+ * Helper component for accordion item header slot
+ */
+export interface ItemHeaderProps {
+    children?: React.ReactNode;
+}
+/**
+ * Helper component for accordion item content slot
+ */
+export interface ItemContentProps {
+    children?: React.ReactNode;
+}
+export declare const ReactAccordion: import('@lit/react').ReactWebComponent<Accordion, {}>;
+export declare const AccordionItem: import('@lit/react').ReactWebComponent<AccordionItemElement, {
+    onToggle: EventName<AccordionItemToggleEvent>;
+}>;
+export declare const ItemHeader: React.FC<ItemHeaderProps>;
+export declare const ItemContent: React.FC<ItemContentProps>;
+export type { AccordionItemToggleEvent } from '../core/_Accordion';
+//# sourceMappingURL=ReactAccordion.d.ts.map

package/dist/components/Accordion/react/ReactAccordion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReactAccordion.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/react/ReactAccordion.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAmB,KAAK,SAAS,EAAE,MAAM,YAAY,CAAC;AAC7D,OAAO,EACL,SAAS,EACT,aAAa,IAAI,oBAAoB,EACrC,KAAK,cAAc,EACnB,KAAK,kBAAkB,EACvB,KAAK,wBAAwB,EAC9B,MAAM,mBAAmB,CAAC;AAE3B;;GAEG;AACH,MAAM,WAAW,mBAAoB,SAAQ,cAAc;IACzD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,WAAW,uBAAwB,SAAQ,kBAAkB;IACjE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,WAAW,eAAe;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED;;GAEG;AACH,MAAM,WAAW,gBAAgB;IAC/B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAGD,eAAO,MAAM,cAAc,uDAKzB,CAAC;AAGH,eAAO,MAAM,aAAa;cAKA,SAAS,CAAC,wBAAwB,CAAC;EAE3D,CAAC;AAGH,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,EAAE,CAAC,eAAe,CAEhD,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,gBAAgB,CAElD,CAAC;AAGF,YAAY,EAAE,wBAAwB,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/components/Accordion/react/ReactAccordion.js

@@ -0,0 +1,24 @@
+import { j as t } from "../../../jsx-runtime-BzflLqGi.js";
+import * as e from "react";
+import { o as r } from "../../../create-component-BPMDMe-q.js";
+import "../core/Accordion.js";
+import { Accordion as n, AccordionItem as c } from "../core/_Accordion.js";
+const d = r({
+  tagName: "ag-accordion",
+  elementClass: n,
+  react: e,
+  events: {}
+}), g = r({
+  tagName: "ag-accordion-item",
+  elementClass: c,
+  react: e,
+  events: {
+    onToggle: "toggle"
+  }
+}), l = ({ children: o }) => /* @__PURE__ */ t.jsx("span", { slot: "header", children: o }), p = ({ children: o }) => /* @__PURE__ */ t.jsx("div", { slot: "content", children: o });
+export {
+  g as AccordionItem,
+  p as ItemContent,
+  l as ItemHeader,
+  d as ReactAccordion
+};

package/dist/components/Accordion/react/ReactAccordion.spec.d.ts

@@ -0,0 +1,10 @@
+/**
+ * ReactAccordion Component Tests
+ * Test suite for React wrapper using @lit/react
+ *
+ * Note: Due to @lit/react compatibility issues with React 19 in test environment,
+ * prop passing cannot be tested. The component works correctly in actual usage.
+ * Verify full functionality in Storybook stories.
+ */
+export {};
+//# sourceMappingURL=ReactAccordion.spec.d.ts.map

package/dist/components/Accordion/react/ReactAccordion.spec.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ReactAccordion.spec.d.ts","sourceRoot":"","sources":["../../../../src/components/Accordion/react/ReactAccordion.spec.tsx"],"names":[],"mappings":"AAAA;;;;;;;GAOG"}