@diwacopilot/components 1.2.0 → 1.2.1

package/dist/types/stencil-public-runtime.d.ts

@@ -1,4 +1,6 @@
-declare type CustomMethodDecorator<T> = (target: Object, propertyKey: string | symbol, descriptor: TypedPropertyDescriptor<T>) => TypedPropertyDescriptor<T> | void;
+type CustomMethodDecorator<T> = (target: object, propertyKey: string | symbol, descriptor: TypedPropertyDescriptor<T>) => TypedPropertyDescriptor<T> | void;
+type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (k: infer I) => void ? I : never;
+type MixinInstance<F> = F extends (base: MixedInCtor) => MixedInCtor<infer I> ? I : never;
 export interface ComponentDecorator {
     (opts?: ComponentOptions): ClassDecorator;
 }
@@ -61,6 +63,12 @@ export interface ShadowRootOptions {
      * focusable part is given focus, and the shadow host is given any available `:focus` styling.
      */
     delegatesFocus?: boolean;
+    /**
+     * Sets the slot assignment mode for the shadow root. When set to `'manual'`, enables imperative
+     * slotting using the `HTMLSlotElement.assign()` method. Defaults to `'named'` for standard
+     * declarative slotting behavior.
+     */
+    slotAssignment?: 'manual' | 'named';
 }
 export interface ModeStyles {
     [modeName: string]: string | string[];
@@ -117,12 +125,34 @@ export interface EventOptions {
      */
     composed?: boolean;
 }
+export interface AttachInternalsOptions {
+    /**
+     * Initial custom states to set on the ElementInternals.states CustomStateSet.
+     * Each key is the state name and the value is the initial boolean state.
+     *
+     * These states can be targeted with the CSS `:state()` pseudo-class.
+     *
+     * @example
+     * ```tsx
+     * @AttachInternals({ states: { open: true, active: false } })
+     * internals: ElementInternals;
+     * ```
+     *
+     * @see https://developer.mozilla.org/en-US/docs/Web/API/CustomStateSet
+     */
+    states?: {
+        [stateName: string]: boolean;
+    };
+}
 export interface AttachInternalsDecorator {
-    (): PropertyDecorator;
+    (opts?: AttachInternalsOptions): PropertyDecorator;
 }
 export interface ListenDecorator {
     (eventName: string, opts?: ListenOptions): CustomMethodDecorator<any>;
 }
+export interface ResolveVarFunction {
+    <T>(variable: T): string;
+}
 export interface ListenOptions {
     /**
      * Handlers can also be registered for an event other than the host itself.
@@ -151,7 +181,15 @@ export interface StateDecorator {
     (): PropertyDecorator;
 }
 export interface WatchDecorator {
-    (propName: string): CustomMethodDecorator<any>;
+    (propName: any, watchOptions?: {
+        immediate?: boolean;
+    }): CustomMethodDecorator<(newValue?: any, oldValue?: any, propName?: any, ...args: any[]) => any | void>;
+}
+export interface PropSerializeDecorator {
+    (propName: any): CustomMethodDecorator<(newValue?: any, propName?: string, ...args: any[]) => string | null>;
+}
+export interface AttrDeserializeDecorator {
+    (propName: any): CustomMethodDecorator<(newValue?: any, propName?: string, ...args: any[]) => any>;
 }
 export interface UserBuildConditionals {
     isDev: boolean;
@@ -200,6 +238,24 @@ export declare const AttachInternals: AttachInternalsDecorator;
  * https://stenciljs.com/docs/events#listen-decorator
  */
 export declare const Listen: ListenDecorator;
+/**
+ * The `resolveVar()` function is a compile-time utility that resolves const variables
+ * and object properties to their string literal values. This allows variables to be
+ * used in `@Listen` and `@Event` decorators instead of hardcoded strings.
+ *
+ * @example
+ * ```ts
+ * const MY_EVENT = 'myEvent';
+ * @Listen(resolveVar(MY_EVENT))
+ * ```
+ *
+ * @example
+ * ```ts
+ * const EVENTS = { MY_EVENT: 'myEvent' } as const;
+ * @Event({ eventName: resolveVar(EVENTS.MY_EVENT) })
+ * ```
+ */
+export declare const resolveVar: ResolveVarFunction;
 /**
  * The `@Method()` decorator is used to expose methods on the public API.
  * Class methods decorated with the @Method() decorator can be called directly
@@ -233,6 +289,14 @@ export declare const State: StateDecorator;
  * https://stenciljs.com/docs/reactive-data#watch-decorator
  */
 export declare const Watch: WatchDecorator;
+/**
+ * Decorator to serialize a property to an attribute string.
+ */
+export declare const PropSerialize: PropSerializeDecorator;
+/**
+ * Decorator to deserialize an attribute string to a property.
+ */
+export declare const AttrDeserialize: AttrDeserializeDecorator;
 export type ResolutionHandler = (elm: HTMLElement) => string | undefined | null;
 export type ErrorHandler = (err: any, element?: HTMLElement) => void;
 /**
@@ -260,6 +324,25 @@ export declare function setPlatformHelpers(helpers: {
  * @returns the base path
  */
 export declare function getAssetPath(path: string): string;
+/**
+ * Method to render a virtual DOM tree to a container element.
+ *
+ * @example
+ * ```tsx
+ * import { render } from '@stencil/core';
+ *
+ * const vnode = (
+ *   <div>
+ *     <h1>Hello, world!</h1>
+ *   </div>
+ * );
+ * render(vnode, document.body);
+ * ```
+ *
+ * @param vnode - The virtual DOM tree to render
+ * @param container - The container element to render the virtual DOM tree to
+ */
+export declare function render(vnode: VNode, container: Element): void;
 /**
  * Used to manually set the base path where assets can be found. For lazy-loaded
  * builds the asset path is automatically set and assets copied to the correct
@@ -330,6 +413,58 @@ export declare function readTask(task: RafCallback): void;
  * Unhandled exception raised while rendering, during event handling, or lifecycles will trigger the custom event handler.
  */
 export declare const setErrorHandler: (handler: ErrorHandler) => void;
+export type TagTransformer = (tag: string) => string;
+/**
+ * Sets a tag transformer to be used when rendering your custom elements.
+ * ```ts
+ * setTagTransformer((tag) => {
+ *  if (tag.startsWith('my-')) return `new-${tag}`
+ *  return tag;
+ * });
+ * ```
+ * Will mean all your components that start with `my-` are defined instead with `new-my-` prefix.
+ *
+ * @param transformer the transformer function to use which must return a string.
+ */
+export declare function setTagTransformer(transformer: TagTransformer): void;
+/**
+ * Transforms a tag name using a transformer set via `setTagTransformer`
+ *
+ * @param tag - the tag to transform e.g. `my-tag`
+ * @returns the transformed tag e.g. `new-my-tag`
+ */
+export declare function transformTag(tag: string): string;
+/**
+ * @deprecated - Use `MixedInCtor` instead:
+ * ```ts
+ * import { MixedInCtor } from '@stencil/core';
+ *
+ * const AFactoryFn = <B extends MixedInCtor>(Base: B) => {class A extends Base { propA = A }; return A;}
+ * ```
+ */
+export type MixinFactory = (base: MixedInCtor) => MixedInCtor;
+export type MixedInCtor<T = {}> = new (...args: any[]) => T;
+/**
+ * Compose multiple mixin classes into a single constructor.
+ * The resulting class has the combined instance types of all mixed-in classes.
+ *
+ * Example:
+ * ```ts
+ * import { Mixin, MixedInCtor } from '@stencil/core';
+ *
+ * const AWrap = <B extends MixedInCtor>(Base: B) => {class A extends Base { propA = A }; return A;}
+ * const BWrap = <B extends MixedInCtor>(Base: B) => {class B extends Base { propB = B }; return B;}
+ * const CWrap = <B extends MixedInCtor>(Base: B) => {class C extends Base { propC = C }; return C;}
+ *
+ * class X extends Mixin(AWrap, BWrap, CWrap) {
+ *   render() { return <div>{this.propA} {this.propB} {this.propC}</div>; }
+ * }
+ * ```
+ *
+ * @param mixinFactories mixin factory functions that return a class which extends from the provided class.
+ * @returns a class that is composed from extending each of the provided classes in the order they were provided.
+ */
+export declare function Mixin<const TMixins extends readonly MixinFactory[]>(...mixinFactories: TMixins): abstract new (...args: any[]) => UnionToIntersection<MixinInstance<TMixins[number]>>;
 /**
  * This file gets copied to all distributions of stencil component collections.
  * - no imports
@@ -502,7 +637,7 @@ export interface FunctionalUtilities {
     map: (children: VNode[], cb: (vnode: ChildNode, index: number, array: ChildNode[]) => ChildNode) => VNode[];
 }
 export interface FunctionalComponent<T = {}> {
-    (props: T, children: VNode[], utils: FunctionalUtilities): VNode | VNode[];
+    (props: T, children: VNode[], utils: FunctionalUtilities): VNode | VNode[] | null;
 }
 /**
  * A Child VDOM node
@@ -544,6 +679,7 @@ export declare namespace h {
     function h(sel: any, data: VNodeData | null, text: string): VNode;
     function h(sel: any, data: VNodeData | null, children: Array<VNode | undefined | null>): VNode;
     function h(sel: any, data: VNodeData | null, children: VNode): VNode;
+    function h(sel: any, data: VNodeData | null, ...children: (VNode | string | number)[]): VNode;
     namespace JSX {
         interface IntrinsicElements extends LocalJSX.IntrinsicElements, JSXBase.IntrinsicElements {
             [tagName: string]: any;
@@ -558,6 +694,36 @@ export declare function h(sel: any, children: Array<VNode | undefined | null>):
 export declare function h(sel: any, data: VNodeData | null, text: string): VNode;
 export declare function h(sel: any, data: VNodeData | null, children: Array<VNode | undefined | null>): VNode;
 export declare function h(sel: any, data: VNodeData | null, children: VNode): VNode;
+export declare function h(sel: any, data: VNodeData | null, ...children: (VNode | string | number)[]): VNode;
+/**
+ * Automatic JSX runtime functions for TypeScript's react-jsx mode.
+ * These functions are called automatically by TypeScript when using "jsx": "react-jsx".
+ * @param type type of node
+ * @param props properties of node
+ * @param key optional key for the node
+ * @returns a jsx vnode
+ */
+export declare function jsx(type: any, props: any, key?: string): VNode;
+/**
+ * Automatic JSX runtime functions for TypeScript's react-jsxmode with multiple children.
+ * @param type type of node
+ * @param props properties of node
+ * @param key optional key for the node
+ * @returns a jsx vnode
+ */
+export declare function jsxs(type: any, props: any, key?: string): VNode;
+/**
+ * Automatic JSX runtime functions for TypeScript's react-jsxdev mode.
+ * These functions are called automatically by TypeScript when using "jsx": "react-jsxdev".
+ * @param type type of node
+ * @param props properties of node
+ * @param key optional key for the node
+ * @param isStaticChildren indicates if the children are static
+ * @param source source information
+ * @param self reference to the component instance
+ * @returns a jsx vnode
+ */
+export declare function jsxDEV(type: any, props: any, key?: string | number, isStaticChildren?: boolean, source?: any, self?: any): VNode;
 /**
  * A virtual DOM node
  */
@@ -587,7 +753,7 @@ declare namespace LocalJSX {
 export { LocalJSX as JSX };
 export declare namespace JSXBase {
     interface IntrinsicElements {
-        slot: JSXBase.SlotAttributes;
+        slot: JSXBase.SlotAttributes<HTMLSlotElement>;
         a: JSXBase.AnchorHTMLAttributes<HTMLAnchorElement>;
         abbr: JSXBase.HTMLAttributes;
         address: JSXBase.HTMLAttributes;
@@ -757,7 +923,7 @@ export declare namespace JSXBase {
         use: JSXBase.SVGAttributes;
         view: JSXBase.SVGAttributes;
     }
-    interface SlotAttributes extends JSXAttributes {
+    interface SlotAttributes<T = HTMLSlotElement> extends JSXAttributes<T> {
         name?: string;
         slot?: string;
         onSlotchange?: (event: Event) => void;
@@ -813,6 +979,9 @@ export declare namespace JSXBase {
         popoverTargetAction?: string;
         popoverTargetElement?: Element | null;
         popoverTarget?: string;
+        command?: string;
+        commandFor?: string;
+        commandfor?: string;
     }
     interface CanvasHTMLAttributes<T> extends HTMLAttributes<T> {
         height?: number | string;
@@ -826,7 +995,8 @@ export declare namespace JSXBase {
     }
     interface DetailsHTMLAttributes<T> extends HTMLAttributes<T> {
         open?: boolean;
-        onToggle?: (event: Event) => void;
+        name?: string;
+        onToggle?: (event: ToggleEvent) => void;
     }
     interface DelHTMLAttributes<T> extends HTMLAttributes<T> {
         cite?: string;
@@ -1532,6 +1702,13 @@ export declare namespace JSXBase {
         z?: number | string;
         zoomAndPan?: string;
     }
+    /** [MDN Reference](https://developer.mozilla.org/docs/Web/API/ToggleEvent) */
+    interface ToggleEvent extends Event {
+        /** [MDN Reference](https://developer.mozilla.org/docs/Web/API/ToggleEvent/newState) */
+        readonly newState: string;
+        /** [MDN Reference](https://developer.mozilla.org/docs/Web/API/ToggleEvent/oldState) */
+        readonly oldState: string;
+    }
     interface DOMAttributes<T> extends JSXAttributes<T> {
         slot?: string;
         part?: string;
@@ -1548,6 +1725,10 @@ export declare namespace JSXBase {
         onCompositionstartCapture?: (event: CompositionEvent) => void;
         onCompositionupdate?: (event: CompositionEvent) => void;
         onCompositionupdateCapture?: (event: CompositionEvent) => void;
+        onBeforeToggle?: (event: ToggleEvent) => void;
+        onBeforeToggleCapture?: (event: ToggleEvent) => void;
+        onToggle?: (event: ToggleEvent) => void;
+        onToggleCapture?: (event: ToggleEvent) => void;
         onFocus?: (event: FocusEvent) => void;
         onFocusCapture?: (event: FocusEvent) => void;
         onFocusin?: (event: FocusEvent) => void;
@@ -1566,10 +1747,6 @@ export declare namespace JSXBase {
         onSubmitCapture?: (event: Event) => void;
         onInvalid?: (event: Event) => void;
         onInvalidCapture?: (event: Event) => void;
-        onBeforeToggle?: (event: Event) => void;
-        onBeforeToggleCapture?: (event: Event) => void;
-        onToggle?: (event: Event) => void;
-        onToggleCapture?: (event: Event) => void;
         onLoad?: (event: Event) => void;
         onLoadCapture?: (event: Event) => void;
         onError?: (event: Event) => void;
@@ -1581,7 +1758,7 @@ export declare namespace JSXBase {
         onKeyUp?: (event: KeyboardEvent) => void;
         onKeyUpCapture?: (event: KeyboardEvent) => void;
         onAuxClick?: (event: MouseEvent) => void;
-        onClick?: (event: MouseEvent) => void;
+        onClick?: (event: PointerEvent) => void;
         onClickCapture?: (event: MouseEvent) => void;
         onContextMenu?: (event: MouseEvent) => void;
         onContextMenuCapture?: (event: MouseEvent) => void;
@@ -1661,6 +1838,8 @@ export declare namespace JSXBase {
         onTransitionRunCapture?: (event: TransitionEvent) => void;
         onTransitionStart?: (event: TransitionEvent) => void;
         onTransitionStartCapture?: (event: TransitionEvent) => void;
+        [key: `aria-${string}`]: string | boolean | undefined;
+        [key: `aria${string}`]: string | boolean | undefined;
     }
 }
 export interface JSXAttributes<T = Element> {
@@ -1671,6 +1850,7 @@ export interface CustomElementsDefineOptions {
     exclude?: string[];
     resourcesUrl?: string;
     syncQueue?: boolean;
+    /** @deprecated in-favour of `setTagTransformer` and `transformTag` */
     transformTagName?: (tagName: string) => string;
     jmp?: (c: Function) => any;
     raf?: (c: FrameRequestCallback) => number;

package/dist-custom-elements/diwa-accordion.js

@@ -1,244 +1 @@
-import { p as proxyCustomElement, H, c as createEvent, h, d as Host } from './p-5eacc7d0.js';
-import { g as getFocusStyle, a as getReducedMotionStyle } from './p-70bbb21a.js';
-import { d as defineCustomElement$2 } from './p-473ec48f.js';
-
-/**
- * diwa-accordion-styles.ts
- * =========================
- * CSS-in-JS styles for <diwa-accordion>.
- *
- * Animation technique: CSS `grid-template-rows: 0fr ↔ 1fr` — smoothly
- * collapses/expands the content without requiring fixed heights.
- *
- * The inner wrapper uses `visibility: hidden` when closed so keyboard focus
- * cannot reach interactive content inside a collapsed panel.
- */
-const getComponentCss = () => `
-
-  /* ── Host ──────────────────────────────────────────────────────────── */
-
-  :host {
-    display: block;
-    border-bottom: var(--diwa-border-width-thin) solid var(--diwa-border);
-    outline: none;
-  }
-
-  :host([hidden]) {
-    display: none;
-  }
-
-  /* ── Heading wrapper (h2…h6) ─────────────────────────────────────── */
-
-  .heading {
-    margin: 0;
-    padding: 0;
-    font-size: inherit;
-    font-weight: inherit;
-  }
-
-  /* ── Toggle button ───────────────────────────────────────────────── */
-
-  .header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    gap: var(--diwa-space-9);
-    width: 100%;
-    background: transparent;
-    border: none;
-    padding: var(--diwa-space-4) var(--diwa-space-2);
-    margin: 0;
-    cursor: pointer;
-    font-family: inherit;
-    font-size: var(--diwa-font-size-lg, 16px);
-    font-weight: var(--diwa-font-weight-semibold);
-    line-height: 1.3;
-    color: var(--diwa-text-primary);
-    text-align: start;
-    -webkit-appearance: none;
-    appearance: none;
-    -webkit-font-smoothing: antialiased;
-    outline: none;
-    border-radius: var(--diwa-radius-sm);
-  }
-
-  :host([compact]) .header {
-    padding: var(--diwa-space-0-5) var(--diwa-space-1);
-    font-size: var(--diwa-font-size-base);
-    font-weight: var(--diwa-font-weight-medium);
-  }
-
-  /* ── Focus ring ─────────────────────────────────────────────────── */
-
-  ${getFocusStyle('.header')}
-
-  /* ── Hover / active ─────────────────────────────────────────────── */
-
-  .header:hover {
-    background-color: var(--diwa-bg-hover);
-  }
-
-  .header:active {
-    background-color: var(--diwa-bg-active);
-  }
-
-  /* Heading text sits above ::before */
-  .heading-text {
-    position: relative;
-    flex: 1;
-    min-width: 0;
-  }
-
-  /* ── Chevron container ──────────────────────────────────────────── */
-
-  /* Wrap the icon so we can apply the rotation transform to a real DOM
-     element rather than to the shadow host of diwa-icon itself. */
-  .chevron-container {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    flex-shrink: 0;
-    position: relative;
-    transition: transform var(--diwa-transition-slow, 0.25s ease);
-  }
-
-  :host([open]) .chevron-container {
-    transform: rotate(180deg);
-  }
-
-  /* ── Collapsible panel ──────────────────────────────────────────── */
-
-  /* grid trick: 0fr collapses the row to zero height without display:none,
-     so CSS transitions can animate smoothly between 0fr and 1fr. */
-  .collapsible {
-    display: grid;
-    grid-template-rows: 0fr;
-    visibility: hidden;
-    transition:
-      grid-template-rows var(--diwa-transition-slow, 0.25s ease),
-      visibility 0s linear var(--diwa-transition-slow, 0.25s);
-  }
-
-  :host([open]) .collapsible {
-    grid-template-rows: 1fr;
-    visibility: inherit;
-    transition:
-      grid-template-rows var(--diwa-transition-slow, 0.25s ease),
-      visibility 0s;
-  }
-
-  /* Inner must have overflow: hidden and min-height: 0 for the grid trick.
-     Negative margin/padding ensures focus rings from slotted content are
-     fully visible (matching PDS accordion inner div treatment). */
-  .inner {
-    overflow: hidden;
-    min-height: 0;
-    padding: var(--diwa-space-1);
-    margin: calc(-1 * var(--diwa-space-1));
-  }
-
-  /* Switch to overflow: visible when panel is open so slotted content
-     like dropdowns and select menus are not clipped. Use an animation
-     to keep overflow hidden for the duration of the closing transition. */
-  :host([open]) .inner {
-    overflow: visible;
-  }
-
-  .content {
-    padding-bottom: var(--diwa-space-9);
-    padding-inline: var(--diwa-space-2);
-  }
-
-  :host([compact]) .content {
-    padding-bottom: var(--diwa-space-5);
-    padding-inline: var(--diwa-space-1);
-  }
-
-  /* ── Reduced motion ─────────────────────────────────────────────── */
-
-  ${getReducedMotionStyle('.chevron-container', '.collapsible', '.inner')}
-`;
-
-/** Monotonically increasing counter to guarantee unique IDs per instance. */
-let accordionCount = 0;
-const DiwaAccordion$1 = /*@__PURE__*/ proxyCustomElement(class DiwaAccordion extends H {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        this.update = createEvent(this, "update", 1);
-        // ──────────────────────────────────────────────────────────────
-        // Instance identity
-        // ──────────────────────────────────────────────────────────────
-        this.uid = `diwa-accordion-${++accordionCount}`;
-        // ──────────────────────────────────────────────────────────────
-        // Props
-        // ──────────────────────────────────────────────────────────────
-        /** Per-component theme override (`light` / `dark`). */
-        this.theme = 'dark';
-        /** Visible heading text rendered inside the toggle button. */
-        this.heading = '';
-        /** Semantic heading level for the toggle button wrapper. */
-        this.headingTag = 'h2';
-        /**
-         * Whether the accordion panel is currently open.
-         *
-         * This is a **controlled** prop: the component always reflects
-         * its `open` state outward via the `update` event, but never
-         * mutates the prop internally. The consumer must update it.
-         */
-        this.open = false;
-        /** Reduces padding and font size for denser UI contexts. */
-        this.compact = false;
-        // ──────────────────────────────────────────────────────────────
-        // Private helpers
-        // ──────────────────────────────────────────────────────────────
-        this.handleToggle = () => {
-            this.update.emit({ open: !this.open });
-        };
-    }
-    get buttonId() { return `${this.uid}-btn`; }
-    get panelId() { return `${this.uid}-panel`; }
-    // ──────────────────────────────────────────────────────────────
-    // Render
-    // ──────────────────────────────────────────────────────────────
-    render() {
-        const HeadingTag = this.headingTag;
-        const iconSize = this.compact ? 16 : 20;
-        return (h(Host, { key: 'd0e5725cdcbc18b1140ad2c20a0656959f67602c', "data-theme": this.theme }, h("style", { key: 'cf359da775a262093aa7ea4579c36898fc569584', innerHTML: getComponentCss() }), h(HeadingTag, { key: '7f9c400334f128d0adc07bed26231eb544c88199', class: "heading" }, h("button", { key: '0d3e2f484bd7492a1d675631b77231097a1509ef', class: "header", id: this.buttonId, "aria-expanded": String(this.open), "aria-controls": this.panelId, onClick: this.handleToggle }, h("span", { key: '9a55d56f77c938f232b4ce6a22783fb757cc02e0', class: "heading-text" }, this.heading), h("span", { key: '69aa73b20f083383e9f62578f702af727730a25f', class: "chevron-container" }, h("diwa-icon", { key: 'b156ff3b3225baf2392df24c669e30329dd19820', name: "chevron-down", size: iconSize })))), h("div", { key: '2d6bf29a7209e1e7f89eb0d5f6cebb38007d4937', id: this.panelId, class: "collapsible", role: "region", "aria-labelledby": this.buttonId }, h("div", { key: '63984cab316da69de9be6f59c6e2b1483313b99e', class: "inner" }, h("div", { key: '27b4225e6edd6a7fce9caa00d97c850d946349b9', class: "content" }, h("slot", { key: '79cf969a2fac8d3904e024465b53a59c0e658835' }))))));
-    }
-    static get delegatesFocus() { return true; }
-    get host() { return this; }
-}, [17, "diwa-accordion", {
-        "theme": [513],
-        "heading": [1],
-        "headingTag": [1, "heading-tag"],
-        "open": [516],
-        "compact": [516]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["diwa-accordion", "diwa-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "diwa-accordion":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, DiwaAccordion$1);
-            }
-            break;
-        case "diwa-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-defineCustomElement$1();
-
-const DiwaAccordion = DiwaAccordion$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { DiwaAccordion, defineCustomElement };
-
-//# sourceMappingURL=diwa-accordion.js.map
+import{t as n,p as e,H as i,c as a,h as t,a as o}from"./index.js";import{b as s,a as r}from"./p-C8h0Vfqp.js";import{d}from"./p-DOo0FY37.js";let c=0;const l=e(class extends i{constructor(n){super(),!1!==n&&this.__registerHost(),this.__attachShadow(),this.update=a(this,"update",1),this.uid="diwa-accordion-"+ ++c,this.theme="dark",this.heading="",this.headingTag="h2",this.open=!1,this.compact=!1,this.handleToggle=()=>{this.update.emit({open:!this.open})}}get buttonId(){return this.uid+"-btn"}get panelId(){return this.uid+"-panel"}render(){const n=this.headingTag,e=this.compact?16:20;return t(o,{key:"d0e5725cdcbc18b1140ad2c20a0656959f67602c","data-theme":this.theme},t("style",{key:"cf359da775a262093aa7ea4579c36898fc569584",innerHTML:`\n\n  /* ── Host ──────────────────────────────────────────────────────────── */\n\n  :host {\n    display: block;\n    border-bottom: var(--diwa-border-width-thin) solid var(--diwa-border);\n    outline: none;\n  }\n\n  :host([hidden]) {\n    display: none;\n  }\n\n  /* ── Heading wrapper (h2…h6) ─────────────────────────────────────── */\n\n  .heading {\n    margin: 0;\n    padding: 0;\n    font-size: inherit;\n    font-weight: inherit;\n  }\n\n  /* ── Toggle button ───────────────────────────────────────────────── */\n\n  .header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--diwa-space-9);\n    width: 100%;\n    background: transparent;\n    border: none;\n    padding: var(--diwa-space-4) var(--diwa-space-2);\n    margin: 0;\n    cursor: pointer;\n    font-family: inherit;\n    font-size: var(--diwa-font-size-lg, 16px);\n    font-weight: var(--diwa-font-weight-semibold);\n    line-height: 1.3;\n    color: var(--diwa-text-primary);\n    text-align: start;\n    -webkit-appearance: none;\n    appearance: none;\n    -webkit-font-smoothing: antialiased;\n    outline: none;\n    border-radius: var(--diwa-radius-sm);\n  }\n\n  :host([compact]) .header {\n    padding: var(--diwa-space-0-5) var(--diwa-space-1);\n    font-size: var(--diwa-font-size-base);\n    font-weight: var(--diwa-font-weight-medium);\n  }\n\n  /* ── Focus ring ─────────────────────────────────────────────────── */\n\n  ${s(".header")}\n\n  /* ── Hover / active ─────────────────────────────────────────────── */\n\n  .header:hover {\n    background-color: var(--diwa-bg-hover);\n  }\n\n  .header:active {\n    background-color: var(--diwa-bg-active);\n  }\n\n  /* Heading text sits above ::before */\n  .heading-text {\n    position: relative;\n    flex: 1;\n    min-width: 0;\n  }\n\n  /* ── Chevron container ──────────────────────────────────────────── */\n\n  /* Wrap the icon so we can apply the rotation transform to a real DOM\n     element rather than to the shadow host of diwa-icon itself. */\n  .chevron-container {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    flex-shrink: 0;\n    position: relative;\n    transition: transform var(--diwa-transition-slow, 0.25s ease);\n  }\n\n  :host([open]) .chevron-container {\n    transform: rotate(180deg);\n  }\n\n  /* ── Collapsible panel ──────────────────────────────────────────── */\n\n  /* grid trick: 0fr collapses the row to zero height without display:none,\n     so CSS transitions can animate smoothly between 0fr and 1fr. */\n  .collapsible {\n    display: grid;\n    grid-template-rows: 0fr;\n    visibility: hidden;\n    transition:\n      grid-template-rows var(--diwa-transition-slow, 0.25s ease),\n      visibility 0s linear var(--diwa-transition-slow, 0.25s);\n  }\n\n  :host([open]) .collapsible {\n    grid-template-rows: 1fr;\n    visibility: inherit;\n    transition:\n      grid-template-rows var(--diwa-transition-slow, 0.25s ease),\n      visibility 0s;\n  }\n\n  /* Inner must have overflow: hidden and min-height: 0 for the grid trick.\n     Negative margin/padding ensures focus rings from slotted content are\n     fully visible (matching PDS accordion inner div treatment). */\n  .inner {\n    overflow: hidden;\n    min-height: 0;\n    padding: var(--diwa-space-1);\n    margin: calc(-1 * var(--diwa-space-1));\n  }\n\n  /* Switch to overflow: visible when panel is open so slotted content\n     like dropdowns and select menus are not clipped. Use an animation\n     to keep overflow hidden for the duration of the closing transition. */\n  :host([open]) .inner {\n    overflow: visible;\n  }\n\n  .content {\n    padding-bottom: var(--diwa-space-9);\n    padding-inline: var(--diwa-space-2);\n  }\n\n  :host([compact]) .content {\n    padding-bottom: var(--diwa-space-5);\n    padding-inline: var(--diwa-space-1);\n  }\n\n  /* ── Reduced motion ─────────────────────────────────────────────── */\n\n  ${r(".chevron-container",".collapsible",".inner")}\n`}),t(n,{key:"7f9c400334f128d0adc07bed26231eb544c88199",class:"heading"},t("button",{key:"0d3e2f484bd7492a1d675631b77231097a1509ef",class:"header",id:this.buttonId,"aria-expanded":this.open+"","aria-controls":this.panelId,onClick:this.handleToggle},t("span",{key:"9a55d56f77c938f232b4ce6a22783fb757cc02e0",class:"heading-text"},this.heading),t("span",{key:"69aa73b20f083383e9f62578f702af727730a25f",class:"chevron-container"},t("diwa-icon",{key:"b156ff3b3225baf2392df24c669e30329dd19820",name:"chevron-down",size:e})))),t("div",{key:"2d6bf29a7209e1e7f89eb0d5f6cebb38007d4937",id:this.panelId,class:"collapsible",role:"region","aria-labelledby":this.buttonId},t("div",{key:"63984cab316da69de9be6f59c6e2b1483313b99e",class:"inner"},t("div",{key:"27b4225e6edd6a7fce9caa00d97c850d946349b9",class:"content"},t("slot",{key:"79cf969a2fac8d3904e024465b53a59c0e658835"})))))}static get delegatesFocus(){return!0}get host(){return this}},[273,"diwa-accordion",{theme:[513],heading:[1],headingTag:[1,"heading-tag"],open:[516],compact:[516]}]);function h(){"undefined"!=typeof customElements&&["diwa-accordion","diwa-icon"].forEach((e=>{switch(e){case"diwa-accordion":customElements.get(n(e))||customElements.define(n(e),l);break;case"diwa-icon":customElements.get(n(e))||d()}}))}h();const p=l,f=h;export{p as DiwaAccordion,f as defineCustomElement}