@ailuracode/alpine-accordion 0.1.0 → 2.0.0

package/README.md

@@ -1,23 +1,184 @@
 # @ailuracode/alpine-accordion
 
-Headless accessible accordion store for Alpine.js — single or multiple open panels, keyboard focus, and ARIA helpers.
-
-**[Full documentation →](../../docs/plugins/accordion.md)**
+Headless accordion store with **single** or **multiple** open panels, optional **default open** items, keyboard focus management, and ARIA helpers.
 
 ## Install
 
 ```bash
-npm install @ailuracode/alpine-accordion alpinejs
+pnpm add @ailuracode/alpine-accordion @ailuracode/alpine-core alpinejs
+```
+
+Open panel state is backed by an inline lightweight state — no extra dependency.
+
+## Quick start
+
+```js
+import Alpine from "alpinejs";
+import { accordionPlugin } from "@ailuracode/alpine-accordion";
+
+Alpine.plugin(accordionPlugin());
+Alpine.start();
 ```
 
 ## Store API
 
+| Method | Description |
+|--------|-------------|
+| `register(accordionId, options?)` | Create a group (`mode`, `defaultOpen`, `onChange`) |
+| `registerItem(accordionId, itemId, disabled?)` | Register a panel trigger |
+| `open(accordionId, itemId)` / `close` / `toggle` | Panel visibility |
+| `isOpen(accordionId, itemId)` | Whether a panel is expanded |
+| `openIds(accordionId)` | Array of currently open item ids |
+| `activeItem(accordionId)` | Focused trigger id |
+| `handleKeydown(accordionId, event)` | `ArrowUp`/`ArrowDown`/`Home`/`End` |
+| `triggerProps(accordionId, itemId)` | `aria-expanded`, `aria-controls`, `tabindex` |
+| `panelProps(accordionId, itemId)` | `role`, `aria-labelledby`, `aria-hidden` |
+
+## Options
+
+| Option | Default | Description |
+|--------|---------|-------------|
+| `mode` | `'single'` | `'single'` closes other panels when one opens; `'multiple'` allows several open |
+| `defaultOpen` | — | Item id or array of ids open after `registerItem` |
+| `onChange` | — | `(openIds: string[]) => void` when open state changes |
+| `storeKey` | `'accordion'` | `$store` key the Alpine plugin registers under |
+| `magicKey` | `'accordion'` (or `storeKey` when renamed) | `$accordion` magic key the Alpine plugin registers under |
+
+In **single** mode, only the **first** id in `defaultOpen` is used when an array is passed.
+
+### Avoiding name collisions
+
+If your application already owns a `$store.accordion` or another toolkit plugin registers on that name, rename the integration surface without touching the controller:
+
+```ts
+Alpine.plugin(accordionPlugin({
+  storeKey: "faq",            // → $store.faq
+  // magicKey follows storeKey by default → $faq
+  magicKey: "disclosure",     // explicit override → $disclosure
+}));
+```
+
+`storeKey` is the only argument most hosts need. `magicKey` moves independently only when both names must be freed. The exposed constants `DEFAULT_ACCORDION_STORE_KEY` and `DEFAULT_ACCORDION_MAGIC_KEY` keep the rename discoverable from TypeScript.
+
+## Single mode
+
+Only one panel open at a time.
+
+```js
+$store.accordion.register("faq", { mode: "single" });
+["item-1", "item-2"].forEach((id) => $store.accordion.registerItem("faq", id));
+```
+
+```html
+<div
+  x-data
+  x-init="
+    $store.accordion.register('faq', { mode: 'single' });
+    ['item-1','item-2'].forEach(id => $store.accordion.registerItem('faq', id));
+  "
+  @keydown="$store.accordion.handleKeydown('faq', $event)"
+>
+  <template x-for="id in ['item-1','item-2']" :key="id">
+    <div>
+      <button
+        x-bind="$store.accordion.triggerProps('faq', id)"
+        @click="$store.accordion.toggle('faq', id)"
+        x-text="id"
+      ></button>
+      <div
+        class="overflow-hidden"
+        x-show="$store.accordion.isOpen('faq', id)"
+        x-collapse
+        x-bind="$store.accordion.panelProps('faq', id)"
+      >
+        <p class="px-4 py-3">Answer for <span x-text="id"></span></p>
+      </div>
+    </div>
+  </template>
+</div>
+```
+
+## Multiple mode
+
+Several panels can stay open.
+
+```js
+$store.accordion.register("settings", { mode: "multiple" });
+["notifications", "privacy"].forEach((id) => $store.accordion.registerItem("settings", id));
+```
+
+```html
+<div
+  x-init="
+    $store.accordion.register('settings', { mode: 'multiple' });
+    ['notifications','privacy'].forEach(id => $store.accordion.registerItem('settings', id));
+  "
+>
+  <!-- same markup as single mode -->
+</div>
+```
+
+## Default open
+
+Pass `defaultOpen` when registering. Panels open automatically when their item is registered.
+
 ```js
-$store.accordion.register("faq", { mode: "single", defaultOpen: "item-1" });
-$store.accordion.open("faq", "item-1");
-$store.accordion.toggle("faq", "item-1");
-$store.accordion.isOpen("faq", "item-1");
-$store.accordion.openIds("faq");
+// Single — one panel open on init
+$store.accordion.register("faq", {
+  mode: "single",
+  defaultOpen: "item-2",
+});
+
+// Multiple — several panels open on init
+$store.accordion.register("settings", {
+  mode: "multiple",
+  defaultOpen: ["notifications", "integrations"],
+});
+
+["item-1", "item-2", "item-3"].forEach((id) => $store.accordion.registerItem("faq", id));
 ```
 
-Modes: `single` (one panel open) or `multiple` (several panels). Use `defaultOpen` with a string or string array. Animate panels with `@alpinejs/collapse` (`x-show` + `x-collapse` on an outer wrapper; put padding on an inner element).
+Read open ids reactively:
+
+```html
+<span x-text="$store.accordion.openIds('faq').join(', ')"></span>
+```
+
+## Panel animation
+
+`@ailuracode/alpine-accordion` is headless — it does not animate panels. Use the official [`@alpinejs/collapse`](https://alpinejs.dev/plugins/collapse) plugin: `x-collapse` must sit on the **same element** as `x-show`.
+
+```bash
+pnpm add @alpinejs/collapse
+```
+
+```js
+import collapse from "@alpinejs/collapse";
+
+Alpine.plugin(collapse);
+```
+
+```html
+<div
+  x-show="$store.accordion.isOpen('faq', id)"
+  x-collapse
+  x-bind="$store.accordion.panelProps('faq', id)"
+  class="overflow-hidden"
+>
+  <div class="px-4 py-3">Panel content</div>
+</div>
+```
+
+Put padding on an **inner** wrapper — vertical padding on the same node as `x-collapse` prevents height from reaching `0` and the close animation can appear stuck.
+
+Optional modifiers: `x-collapse.duration.300ms`, `x-collapse.min.50px`. See the [Collapse plugin docs](https://alpinejs.dev/plugins/collapse).
+
+`panelProps()` does not set `hidden` — visibility is driven by `x-show` on the client.
+
+## SSR
+
+Safe when panels start collapsed; visibility is controlled with `x-show` on the client. Use `defaultOpen` only when markup is hydrated on the client.
+
+## License
+
+MIT

package/dist/global.d.ts

@@ -1,10 +1,12 @@
 /// <reference types="@types/alpinejs" />
 
-export type AccordionMode = "single" | "multiple";
+import type { AccordionGroup, AccordionGroupOptions } from "./types";
+
+export type { AccordionGroup, AccordionGroupOptions, AccordionMode } from "./types";
 
 export interface AccordionStore {
-  groups: Record<string, import("./store.js").AccordionGroup>;
-  register(accordionId: string, options?: import("./store.js").AccordionGroupOptions): void;
+  readonly groups: Record<string, AccordionGroup>;
+  register(accordionId: string, options?: AccordionGroupOptions): void;
   unregister(accordionId: string): void;
   registerItem(accordionId: string, itemId: string, disabled?: boolean): void;
   unregisterItem(accordionId: string, itemId: string): void;
@@ -24,7 +26,7 @@ export interface AccordionStore {
   destroy(): void;
 }
 
-export function createAccordionStore(): AccordionStore;
+export function createAccordionController(id?: string): import("./types").AccordionController;
 
 export default function accordionPlugin(): import("alpinejs").PluginCallback;
 

package/dist/index.d.ts

@@ -1,16 +1,29 @@
-import AlpineType from 'alpinejs';
+import { Alpine, PluginCallback, BaseController } from '@ailuracode/alpine-core';
+export { Unsubscribe } from '@ailuracode/alpine-core';
+import { Alpine as Alpine$1 } from 'alpinejs';
 
+/**
+ * Public type contracts for `@ailuracode/alpine-accordion`.
+ *
+ * Every public type lives in a `types.ts` module so consumers can import
+ * them without pulling the implementation. The shape IS the contract.
+ */
+
+/** Accordion display mode. */
 type AccordionMode = "single" | "multiple";
+/** An accordion item's registration state. */
 type AccordionItem = {
     id: string;
     disabled: boolean;
 };
+/** Options passed when registering an accordion group. */
 type AccordionGroupOptions = {
-    mode?: AccordionMode;
+    readonly mode?: AccordionMode;
     /** Item id or ids open on init. In `single` mode only the first id is used. */
-    defaultOpen?: string | string[];
-    onChange?: (openIds: string[]) => void;
+    readonly defaultOpen?: string | string[];
+    readonly onChange?: (openIds: string[]) => void;
 };
+/** Internal representation of an accordion group. */
 type AccordionGroup = {
     mode: AccordionMode;
     open: Record<string, boolean>;
@@ -19,9 +32,17 @@ type AccordionGroup = {
     defaultOpen: string[];
     onChange?: (openIds: string[]) => void;
 };
-type AccordionStore = {
-    /** Reactive registry of accordion groups. */
-    groups: Record<string, AccordionGroup>;
+/** Discriminator for change events. */
+type AccordionChangeSource = "user" | "initialization";
+/** Detail payload for the `change` event. */
+interface AccordionChangeDetail {
+    readonly groupId: string;
+    readonly openIds: string[];
+    readonly source: AccordionChangeSource;
+}
+/** Alpine-facing store surface. */
+interface AccordionStore {
+    readonly groups: Record<string, AccordionGroup>;
     register(accordionId: string, options?: AccordionGroupOptions): void;
     unregister(accordionId: string): void;
     registerItem(accordionId: string, itemId: string, disabled?: boolean): void;
@@ -37,21 +58,132 @@ type AccordionStore = {
     triggerProps(accordionId: string, itemId: string): Record<string, string | number | boolean | undefined>;
     panelProps(accordionId: string, itemId: string): Record<string, string | boolean | undefined>;
     destroy(): void;
+}
+/** Options accepted by the accordion plugin factory. */
+interface CreateAccordionOptions {
+    readonly id?: string;
+    /**
+     * `$store` key the Alpine plugin registers under. Defaults to
+     * {@link DEFAULT_ACCORDION_STORE_KEY}. Set when the host already
+     * owns an `accordion` store or another toolkit plugin would
+     * collide on that name — the rename avoids the collision without
+     * touching the controller. Ignored by the standalone
+     * `createAccordionController` factory.
+     */
+    readonly storeKey?: string;
+    /**
+     * `$accordion` magic key the Alpine plugin registers under.
+     * Defaults to {@link DEFAULT_ACCORDION_MAGIC_KEY}, or to `storeKey`
+     * when that is renamed (the magic follows the store so consumers
+     * only rename one). Ignored by the standalone factory.
+     */
+    readonly magicKey?: string;
+}
+/** Default `$store` key registered by {@link accordionPlugin}. */
+declare const DEFAULT_ACCORDION_STORE_KEY = "accordion";
+/** Default `$accordion` magic key registered by {@link accordionPlugin}. */
+declare const DEFAULT_ACCORDION_MAGIC_KEY = "accordion";
+/** Typed view of `Alpine` the accordion plugin uses internally. */
+type AccordionAlpine = Alpine<{
+    accordion: AccordionStore;
+}> & {
+    cleanup?(callback: () => void): void;
 };
-/** Creates the headless accordion store. */
-declare function createAccordionStore(): AccordionStore;
+/** `Alpine.plugin()` callback signature. */
+type AccordionPluginCallback = PluginCallback<Alpine$1>;
 
-/** Alpine.js accordion plugin. Registers `$store.accordion`. */
-declare function accordionPlugin(): AlpineType.PluginCallback;
-declare global {
-    namespace Alpine {
-        interface Stores {
-            accordion: AccordionStore;
-        }
-        interface Magics<T> {
-            $accordion: AccordionStore;
-        }
-    }
+/**
+ * Strongly-typed event map for the accordion controller.
+ */
+
+/**
+ * Event map for accordion state changes. Single-key contract:
+ * every transition emits `change` with the same
+ * {@link AccordionChangeDetail} payload.
+ */
+interface AccordionEvents extends Record<string, unknown> {
+    change: AccordionChangeDetail;
 }
 
-export { type AccordionGroupOptions, type AccordionMode, type AccordionStore, createAccordionStore, accordionPlugin as default };
+/**
+ * Accordion controller — the framework-agnostic core of
+ * `@ailuracode/alpine-accordion`. Manages accordion groups with
+ * open/close state, keyboard navigation, and ARIA props.
+ *
+ * Emits a typed `change` event on every open/close transition so
+ * consumers can react programmatically.
+ *
+ * Selection state is a plain per-group object — no controller class,
+ * no event emission. The full `@ailuracode/alpine-selection`
+ * dependency was dropped in favour of this lightweight state to keep
+ * the bundle slim.
+ */
+
+/**
+ * Headless accordion controller. Manages multiple accordion groups
+ * with open/close state, keyboard navigation, and ARIA props.
+ */
+declare class AccordionController extends BaseController<AccordionEvents> {
+    #private;
+    constructor(id?: string);
+    /** Whether a group is registered. */
+    hasGroup(accordionId: string): boolean;
+    /**
+     * Returns shallow snapshots of all groups for adapter sync.
+     * Mutating the returned objects does not affect controller state.
+     */
+    snapshotGroups(): Record<string, AccordionGroup>;
+    register(accordionId: string, options?: AccordionGroupOptions): void;
+    unregister(accordionId: string): void;
+    registerItem(accordionId: string, itemId: string, disabled?: boolean): void;
+    unregisterItem(accordionId: string, itemId: string): void;
+    open(accordionId: string, itemId: string): void;
+    close(accordionId: string, itemId: string): void;
+    toggle(accordionId: string, itemId: string): void;
+    isOpen(accordionId: string, itemId: string): boolean;
+    openIds(accordionId: string): string[];
+    activeItem(accordionId: string): string | null;
+    setActiveItem(accordionId: string, itemId: string | null): void;
+    handleKeydown(accordionId: string, event: KeyboardEvent): void;
+    triggerProps(accordionId: string, itemId: string): Record<string, string | number | boolean | undefined>;
+    panelProps(accordionId: string, itemId: string): Record<string, string | boolean | undefined>;
+    /**
+     * Returns a store-shaped object for Alpine's `$store.accordion`.
+     * Prefer {@link createAccordionStore} for new code.
+     *
+     * @deprecated Use `createAccordionStore()` or `createAccordionStoreFromController()`.
+     */
+    toStore(): AccordionStore;
+}
+/**
+ * Creates an AccordionController and returns a store-shaped object.
+ * Convenience for non-Alpine consumers.
+ */
+declare function createAccordionController(id?: string): AccordionController;
+
+/**
+ * Alpine.js integration for `@ailuracode/alpine-accordion`.
+ *
+ * Thin adapter that wires {@link AccordionController} into
+ * `$store.accordion` and the `$accordion` magic.
+ */
+
+/**
+ * Plugin factory — returns the `Alpine.plugin()` callback. Pass
+ * {@link CreateAccordionOptions} to configure the controller,
+ * or `{}` for the package defaults.
+ */
+declare function accordionPlugin(options?: CreateAccordionOptions): AccordionPluginCallback;
+/** Builds typed accordion plugin options. */
+declare function accordionOptions<const T extends CreateAccordionOptions>(options: T): T;
+
+/**
+ * Store factory for `@ailuracode/alpine-accordion`.
+ */
+
+/** Builds an {@link AccordionStore} backed by a new {@link AccordionController}. */
+declare function createAccordionStore(): AccordionStore;
+/** Builds an {@link AccordionStore} that mirrors the given controller. */
+declare function createAccordionStoreFromController(controller: AccordionController): AccordionStore;
+
+export { type AccordionAlpine, type AccordionChangeDetail, type AccordionChangeSource, AccordionController, type AccordionEvents, type AccordionGroup, type AccordionGroupOptions, type AccordionItem, type AccordionMode, type AccordionPluginCallback, type AccordionStore, type CreateAccordionOptions, DEFAULT_ACCORDION_MAGIC_KEY, DEFAULT_ACCORDION_STORE_KEY, accordionOptions, accordionPlugin, createAccordionController, createAccordionStore, createAccordionStoreFromController, accordionPlugin as default };

package/dist/index.js

@@ -1,194 +1 @@
-// src/store.ts
-function enabledItems(group) {
-  return group.items.filter((item) => !item.disabled);
-}
-function itemIndex(group, itemId) {
-  return enabledItems(group).findIndex((item) => item.id === itemId);
-}
-function notify(group) {
-  group.onChange?.(
-    Object.entries(group.open).filter(([, isOpen]) => isOpen).map(([id]) => id)
-  );
-}
-function normalizeDefaultOpen(mode, value) {
-  if (!value) {
-    return [];
-  }
-  const ids = Array.isArray(value) ? value : [value];
-  return mode === "single" && ids.length > 0 ? [ids[0]] : ids;
-}
-function createGroup(options = {}) {
-  const mode = options.mode ?? "single";
-  return {
-    mode,
-    open: {},
-    activeItemId: null,
-    items: [],
-    defaultOpen: normalizeDefaultOpen(mode, options.defaultOpen),
-    onChange: options.onChange
-  };
-}
-function createAccordionStore() {
-  function getOrCreate(store2, accordionId) {
-    store2.groups[accordionId] ??= createGroup();
-    return store2.groups[accordionId];
-  }
-  const store = {
-    groups: {},
-    register(accordionId, options = {}) {
-      this.groups[accordionId] = createGroup(options);
-    },
-    unregister(accordionId) {
-      delete this.groups[accordionId];
-    },
-    registerItem(accordionId, itemId, disabled = false) {
-      const group = getOrCreate(this, accordionId);
-      const existing = group.items.find((item) => item.id === itemId);
-      if (existing) {
-        existing.disabled = disabled;
-        return;
-      }
-      group.items.push({ id: itemId, disabled });
-      if (group.defaultOpen.includes(itemId) && !disabled) {
-        this.open(accordionId, itemId);
-        group.activeItemId ??= itemId;
-      }
-    },
-    unregisterItem(accordionId, itemId) {
-      const group = this.groups[accordionId];
-      if (!group) {
-        return;
-      }
-      group.items = group.items.filter((item) => item.id !== itemId);
-      delete group.open[itemId];
-    },
-    open(accordionId, itemId) {
-      const group = this.groups[accordionId];
-      const item = group?.items.find((entry) => entry.id === itemId);
-      if (!(group && item) || item.disabled) {
-        return;
-      }
-      if (group.mode === "single") {
-        for (const id of Object.keys(group.open)) {
-          if (group.open[id]) {
-            group.open[id] = false;
-          }
-        }
-        group.open[itemId] = true;
-      } else {
-        group.open[itemId] = true;
-      }
-      notify(group);
-    },
-    close(accordionId, itemId) {
-      const group = this.groups[accordionId];
-      if (!group?.open[itemId]) {
-        return;
-      }
-      group.open[itemId] = false;
-      notify(group);
-    },
-    toggle(accordionId, itemId) {
-      if (this.isOpen(accordionId, itemId)) {
-        this.close(accordionId, itemId);
-      } else {
-        this.open(accordionId, itemId);
-      }
-    },
-    isOpen(accordionId, itemId) {
-      return this.groups[accordionId]?.open[itemId] ?? false;
-    },
-    openIds(accordionId) {
-      const open = this.groups[accordionId]?.open ?? {};
-      return Object.entries(open).filter(([, isOpen]) => isOpen).map(([id]) => id);
-    },
-    activeItem(accordionId) {
-      return this.groups[accordionId]?.activeItemId ?? null;
-    },
-    setActiveItem(accordionId, itemId) {
-      const group = this.groups[accordionId];
-      if (!group) {
-        return;
-      }
-      if (itemId === null) {
-        group.activeItemId = null;
-        return;
-      }
-      const item = group.items.find((entry) => entry.id === itemId);
-      if (item && !item.disabled) {
-        group.activeItemId = itemId;
-      }
-    },
-    handleKeydown(accordionId, event) {
-      const group = this.groups[accordionId];
-      if (!group) {
-        return;
-      }
-      const items = enabledItems(group);
-      if (items.length === 0) {
-        return;
-      }
-      if (!group.activeItemId) {
-        group.activeItemId = items[0]?.id ?? null;
-      }
-      const currentIndex = group.activeItemId ? itemIndex(group, group.activeItemId) : 0;
-      switch (event.key) {
-        case "ArrowDown":
-          event.preventDefault();
-          group.activeItemId = items[(currentIndex + 1) % items.length]?.id ?? null;
-          break;
-        case "ArrowUp":
-          event.preventDefault();
-          group.activeItemId = items[(currentIndex - 1 + items.length) % items.length]?.id ?? null;
-          break;
-        case "Home":
-          event.preventDefault();
-          group.activeItemId = items[0]?.id ?? null;
-          break;
-        case "End":
-          event.preventDefault();
-          group.activeItemId = items[items.length - 1]?.id ?? null;
-          break;
-        default:
-          break;
-      }
-    },
-    triggerProps(accordionId, itemId) {
-      const open = this.isOpen(accordionId, itemId);
-      const active = this.activeItem(accordionId) === itemId;
-      return {
-        "aria-expanded": open,
-        "aria-controls": `${accordionId}-panel-${itemId}`,
-        id: `${accordionId}-trigger-${itemId}`,
-        tabindex: active ? 0 : -1
-      };
-    },
-    panelProps(accordionId, itemId) {
-      const open = this.isOpen(accordionId, itemId);
-      return {
-        id: `${accordionId}-panel-${itemId}`,
-        role: "region",
-        "aria-labelledby": `${accordionId}-trigger-${itemId}`,
-        "aria-hidden": open ? void 0 : true
-      };
-    },
-    destroy() {
-      this.groups = {};
-    }
-  };
-  return store;
-}
-
-// src/index.ts
-function accordionPlugin() {
-  return function registerAccordion(Alpine) {
-    const store = createAccordionStore();
-    Alpine.store("accordion", store);
-    Alpine.magic("accordion", () => Alpine.store("accordion"));
-  };
-}
-export {
-  createAccordionStore,
-  accordionPlugin as default
-};
-//# sourceMappingURL=index.js.map
+import{BaseController as C,generateId as I}from"@ailuracode/alpine-core";function K(r,e){return r==="single"?{mode:r,value:typeof e=="string"?e:null,selectedKeys:[],keys:[],disabledKeys:new Set}:{mode:r,value:null,selectedKeys:Array.isArray(e)?[...e]:[],keys:[],disabledKeys:new Set}}function x(r,e,n){r.keys=e,r.disabledKeys=new Set(n),r.value!==null&&(!r.keys.includes(r.value)||r.disabledKeys.has(r.value))&&(r.value=null),r.selectedKeys.some(o=>!r.keys.includes(o)||r.disabledKeys.has(o))&&(r.selectedKeys=r.selectedKeys.filter(o=>r.keys.includes(o)&&!r.disabledKeys.has(o)))}function h(r){return r.items.filter(e=>!e.disabled)}function G(r,e){return h(r).findIndex(n=>n.id===e)}function S(r,e){if(!e)return[];let n=Array.isArray(e)?e:[e];return r==="single"&&n.length>0?[n[0]]:n}function y(r={}){let e=r.mode??"single";return{mode:e,open:{},activeItemId:null,items:[],defaultOpen:S(e,r.defaultOpen),onChange:r.onChange}}function k(r){return{...r,open:{...r.open},items:r.items.map(e=>({...e})),defaultOpen:[...r.defaultOpen]}}function g(r){return r.mode==="single"?r.value===null?[]:[r.value]:r.selectedKeys}function a(r,e){let n=new Set(g(e)),o={};for(let t of r.items)o[t.id]=n.has(t.id);r.open=o}var p=class extends C{#e={};#o={};constructor(e){super(e??I("accordion"))}hasGroup(e){return e in this.#e}snapshotGroups(){let e={};for(let[n,o]of Object.entries(this.#e))e[n]=k(o);return e}register(e,n={}){if(this.isDestroyed)return;let o=y(n);this.#e[e]=o;let t=o.mode==="single"?o.defaultOpen[0]??null:o.defaultOpen,i=K(o.mode,t);this.#o[e]=i,this.#r(e),a(o,i),this.#n(e,"initialization")}unregister(e){this.isDestroyed||(this.#n(e,"initialization"),delete this.#o[e],delete this.#e[e])}registerItem(e,n,o=!1){if(this.isDestroyed)return;let t=this.#t(e),i=t.items.find(d=>d.id===n);if(i){i.disabled=o,this.#n(e,"user");return}if(t.items.push({id:n,disabled:o}),this.#r(e),t.defaultOpen.includes(n)&&!o){this.open(e,n),t.activeItemId??=n;return}this.#n(e,"user")}unregisterItem(e,n){if(this.isDestroyed)return;let o=this.#e[e],t=this.#o[e];o&&t&&(o.items=o.items.filter(i=>i.id!==n),this.#r(e),a(o,t),this.#n(e,"user"))}open(e,n){if(this.isDestroyed)return;let o=this.#e[e],t=this.#o[e],i=o?.items.find(d=>d.id===n);!(o&&t&&i)||i.disabled||(o.mode==="single"?(t.mode="single",t.value=n,t.selectedKeys=[]):g(t).includes(n)||(t.mode="multiple",t.value=null,t.selectedKeys=[...g(t),n]),a(o,t),this.#n(e,"user"),o.onChange?.(this.openIds(e)))}close(e,n){if(this.isDestroyed)return;let o=this.#e[e],t=this.#o[e];o&&t&&o.open[n]&&(o.mode==="single"?(t.value=null,t.selectedKeys=[]):t.selectedKeys=g(t).filter(i=>i!==n),a(o,t),this.#n(e,"user"),o.onChange?.(this.openIds(e)))}toggle(e,n){this.#e[e]&&(this.isOpen(e,n)?this.close(e,n):this.open(e,n))}isOpen(e,n){let o=this.#o[e];return o?o.mode==="single"?o.value===n:o.selectedKeys.includes(n):!1}openIds(e){let n=this.#o[e];return n?[...g(n)]:[]}activeItem(e){return this.#e[e]?.activeItemId??null}setActiveItem(e,n){if(this.isDestroyed)return;let o=this.#e[e];if(!o)return;if(n===null){o.activeItemId=null,this.#n(e,"user");return}let t=o.items.find(i=>i.id===n);t&&!t.disabled&&(o.activeItemId=n,this.#n(e,"user"))}handleKeydown(e,n){let o=this.#e[e];if(!o)return;let t=h(o);if(t.length===0)return;o.activeItemId||(o.activeItemId=t[0]?.id??null);let i=o.activeItemId?G(o,o.activeItemId):0;switch(n.key){case"ArrowDown":n.preventDefault(),o.activeItemId=t[(i+1)%t.length]?.id??null;break;case"ArrowUp":n.preventDefault(),o.activeItemId=t[(i-1+t.length)%t.length]?.id??null;break;case"Home":n.preventDefault(),o.activeItemId=t[0]?.id??null;break;case"End":n.preventDefault(),o.activeItemId=t[t.length-1]?.id??null;break;default:break}this.#n(e,"user")}triggerProps(e,n){let o=this.isOpen(e,n),t=this.activeItem(e)===n;return{"aria-expanded":o,"aria-controls":`${e}-panel-${n}`,id:`${e}-trigger-${n}`,tabindex:t?0:-1}}panelProps(e,n){let o=this.isOpen(e,n);return{id:`${e}-panel-${n}`,role:"region","aria-labelledby":`${e}-trigger-${n}`,"aria-hidden":o?void 0:!0}}toStore(){return{groups:this.#e,register:(e,n)=>this.register(e,n),unregister:e=>this.unregister(e),registerItem:(e,n,o)=>this.registerItem(e,n,o),unregisterItem:(e,n)=>this.unregisterItem(e,n),open:(e,n)=>this.open(e,n),close:(e,n)=>this.close(e,n),toggle:(e,n)=>this.toggle(e,n),isOpen:(e,n)=>this.isOpen(e,n),openIds:e=>this.openIds(e),activeItem:e=>this.activeItem(e),setActiveItem:(e,n)=>this.setActiveItem(e,n),handleKeydown:(e,n)=>this.handleKeydown(e,n),triggerProps:(e,n)=>this.triggerProps(e,n),panelProps:(e,n)=>this.panelProps(e,n),destroy:()=>this.destroy()}}#t(e){return this.#e[e]??=y(),this.#e[e]}#n(e,n){this.emit("change",{groupId:e,openIds:this.openIds(e),source:n})}#r(e){let n=this.#e[e],o=this.#o[e];if(!(n&&o))return;let t=n.items.map(d=>d.id),i=n.items.filter(d=>d.disabled).map(d=>d.id);x(o,t,i)}};function D(r){return new p(r)}import{bridgeControllerStore as R}from"@ailuracode/alpine-core";var A="accordion",f="accordion";function m(r={}){let e=r.storeKey??A,n=r.magicKey??r.storeKey??f;return function(t){let i=t,d=new p(r.id),v={...d.toStore(),groups:{}};R({alpine:i,storeKey:e,magicKey:n,store:v,controller:d,packageName:"accordion",subscribe:l=>(l.isOpen=(s,c)=>l.groups[s]?.open[c]??!1,l.openIds=s=>{let c=l.groups[s]?.open??{};return Object.entries(c).filter(([,u])=>u).map(([u])=>u)},l.activeItem=s=>l.groups[s]?.activeItemId??null,l.triggerProps=(s,c)=>{let u=l.isOpen(s,c),O=l.activeItem(s)===c;return{"aria-expanded":u,"aria-controls":`${s}-panel-${c}`,id:`${s}-trigger-${c}`,tabindex:O?0:-1}},l.panelProps=(s,c)=>{let u=l.isOpen(s,c);return{id:`${s}-panel-${c}`,role:"region","aria-labelledby":`${s}-trigger-${c}`,"aria-hidden":u?void 0:!0}},d.on("change",()=>{let s=d.snapshotGroups();for(let c of Object.keys(s))l.groups[c]=s[c];for(let c of Object.keys(l.groups))c in s||delete l.groups[c]}))})}}function E(r){return r}function P(r,e){for(let n of Object.keys(e))r[n]=e[n];for(let n of Object.keys(r))n in e||delete r[n]}function _(){return b(new p)}function b(r){let e={},n={...r.toStore(),groups:e};return r.on("change",()=>{P(e,r.snapshotGroups())}),n}export{p as AccordionController,f as DEFAULT_ACCORDION_MAGIC_KEY,A as DEFAULT_ACCORDION_STORE_KEY,E as accordionOptions,m as accordionPlugin,D as createAccordionController,_ as createAccordionStore,b as createAccordionStoreFromController,m as default};

package/package.json

@@ -1,10 +1,11 @@
 {
   "name": "@ailuracode/alpine-accordion",
-  "version": "0.1.0",
+  "version": "2.0.0",
   "description": "Alpine.js headless accessible accordion store",
   "type": "module",
   "license": "MIT",
   "author": "ailuracode",
+  "sideEffects": false,
   "publishConfig": {
     "access": "public"
   },
@@ -31,7 +32,13 @@
     }
   },
   "types": "./dist/global.d.ts",
+  "devDependencies": {
+    "@types/alpinejs": "^3.13.11",
+    "alpinejs": "^3.15.12",
+    "@ailuracode/alpine-core": "0.3.0"
+  },
   "peerDependencies": {
+    "@ailuracode/alpine-core": "^0.3.0",
     "alpinejs": "^3.0.0",
     "@types/alpinejs": "^3.13.11"
   },
@@ -48,8 +55,30 @@
     "accessibility",
     "headless"
   ],
+  "toolkit": {
+    "bundleBudget": {
+      "category": "small-feature"
+    }
+  },
+  "size-limit": [
+    {
+      "name": "full surface",
+      "path": "dist/index.js",
+      "import": "*",
+      "ignore": [
+        "alpinejs",
+        "@ailuracode/alpine-core",
+        "@types/alpinejs"
+      ],
+      "gzip": true,
+      "brotli": true,
+      "limit": "2.3 kB"
+    }
+  ],
   "scripts": {
-    "build": "tsup src/index.ts --format esm --dts --clean --sourcemap --out-dir dist && cp src/global.d.ts dist/global.d.ts",
-    "test": "vitest run --config ../../vitest.config.ts test"
+    "build": "tsup src/index.ts --format esm --dts --clean --out-dir dist --minify && cp src/global.d.ts dist/global.d.ts",
+    "size": "size-limit",
+    "test": "vitest run --config ../../vitest.config.ts packages/accordion",
+    "test:e2e": "playwright test --config playwright.config.ts"
   }
 }

package/dist/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/store.ts","../src/index.ts"],"sourcesContent":["export type AccordionMode = \"single\" | \"multiple\";\n\nexport type AccordionItem = {\n  id: string;\n  disabled: boolean;\n};\n\nexport type AccordionGroupOptions = {\n  mode?: AccordionMode;\n  /** Item id or ids open on init. In `single` mode only the first id is used. */\n  defaultOpen?: string | string[];\n  onChange?: (openIds: string[]) => void;\n};\n\nexport type AccordionGroup = {\n  mode: AccordionMode;\n  open: Record<string, boolean>;\n  activeItemId: string | null;\n  items: AccordionItem[];\n  defaultOpen: string[];\n  onChange?: (openIds: string[]) => void;\n};\n\nexport type AccordionStore = {\n  /** Reactive registry of accordion groups. */\n  groups: Record<string, AccordionGroup>;\n  register(accordionId: string, options?: AccordionGroupOptions): void;\n  unregister(accordionId: string): void;\n  registerItem(accordionId: string, itemId: string, disabled?: boolean): void;\n  unregisterItem(accordionId: string, itemId: string): void;\n  open(accordionId: string, itemId: string): void;\n  close(accordionId: string, itemId: string): void;\n  toggle(accordionId: string, itemId: string): void;\n  isOpen(accordionId: string, itemId: string): boolean;\n  openIds(accordionId: string): string[];\n  activeItem(accordionId: string): string | null;\n  setActiveItem(accordionId: string, itemId: string | null): void;\n  handleKeydown(accordionId: string, event: KeyboardEvent): void;\n  triggerProps(\n    accordionId: string,\n    itemId: string\n  ): Record<string, string | number | boolean | undefined>;\n  panelProps(accordionId: string, itemId: string): Record<string, string | boolean | undefined>;\n  destroy(): void;\n};\n\nfunction enabledItems(group: AccordionGroup): AccordionItem[] {\n  return group.items.filter((item) => !item.disabled);\n}\n\nfunction itemIndex(group: AccordionGroup, itemId: string): number {\n  return enabledItems(group).findIndex((item) => item.id === itemId);\n}\n\nfunction notify(group: AccordionGroup): void {\n  group.onChange?.(\n    Object.entries(group.open)\n      .filter(([, isOpen]) => isOpen)\n      .map(([id]) => id)\n  );\n}\n\nfunction normalizeDefaultOpen(mode: AccordionMode, value?: string | string[]): string[] {\n  if (!value) {\n    return [];\n  }\n\n  const ids = Array.isArray(value) ? value : [value];\n  return mode === \"single\" && ids.length > 0 ? [ids[0]] : ids;\n}\n\nfunction createGroup(options: AccordionGroupOptions = {}): AccordionGroup {\n  const mode = options.mode ?? \"single\";\n  return {\n    mode,\n    open: {},\n    activeItemId: null,\n    items: [],\n    defaultOpen: normalizeDefaultOpen(mode, options.defaultOpen),\n    onChange: options.onChange,\n  };\n}\n\n/** Creates the headless accordion store. */\nexport function createAccordionStore(): AccordionStore {\n  function getOrCreate(store: AccordionStore, accordionId: string): AccordionGroup {\n    store.groups[accordionId] ??= createGroup();\n    return store.groups[accordionId];\n  }\n\n  const store: AccordionStore = {\n    groups: {},\n\n    register(accordionId, options = {}) {\n      this.groups[accordionId] = createGroup(options);\n    },\n\n    unregister(accordionId) {\n      delete this.groups[accordionId];\n    },\n\n    registerItem(accordionId, itemId, disabled = false) {\n      const group = getOrCreate(this, accordionId);\n      const existing = group.items.find((item) => item.id === itemId);\n      if (existing) {\n        existing.disabled = disabled;\n        return;\n      }\n      group.items.push({ id: itemId, disabled });\n\n      if (group.defaultOpen.includes(itemId) && !disabled) {\n        this.open(accordionId, itemId);\n        group.activeItemId ??= itemId;\n      }\n    },\n\n    unregisterItem(accordionId, itemId) {\n      const group = this.groups[accordionId];\n      if (!group) {\n        return;\n      }\n\n      group.items = group.items.filter((item) => item.id !== itemId);\n      delete group.open[itemId];\n    },\n\n    open(accordionId, itemId) {\n      const group = this.groups[accordionId];\n      const item = group?.items.find((entry) => entry.id === itemId);\n      if (!(group && item) || item.disabled) {\n        return;\n      }\n\n      if (group.mode === \"single\") {\n        for (const id of Object.keys(group.open)) {\n          if (group.open[id]) {\n            group.open[id] = false;\n          }\n        }\n        group.open[itemId] = true;\n      } else {\n        group.open[itemId] = true;\n      }\n\n      notify(group);\n    },\n\n    close(accordionId, itemId) {\n      const group = this.groups[accordionId];\n      if (!group?.open[itemId]) {\n        return;\n      }\n\n      group.open[itemId] = false;\n      notify(group);\n    },\n\n    toggle(accordionId, itemId) {\n      if (this.isOpen(accordionId, itemId)) {\n        this.close(accordionId, itemId);\n      } else {\n        this.open(accordionId, itemId);\n      }\n    },\n\n    isOpen(accordionId, itemId) {\n      return this.groups[accordionId]?.open[itemId] ?? false;\n    },\n\n    openIds(accordionId) {\n      const open = this.groups[accordionId]?.open ?? {};\n      return Object.entries(open)\n        .filter(([, isOpen]) => isOpen)\n        .map(([id]) => id);\n    },\n\n    activeItem(accordionId) {\n      return this.groups[accordionId]?.activeItemId ?? null;\n    },\n\n    setActiveItem(accordionId, itemId) {\n      const group = this.groups[accordionId];\n      if (!group) {\n        return;\n      }\n\n      if (itemId === null) {\n        group.activeItemId = null;\n        return;\n      }\n\n      const item = group.items.find((entry) => entry.id === itemId);\n      if (item && !item.disabled) {\n        group.activeItemId = itemId;\n      }\n    },\n\n    handleKeydown(accordionId, event) {\n      const group = this.groups[accordionId];\n      if (!group) {\n        return;\n      }\n\n      const items = enabledItems(group);\n      if (items.length === 0) {\n        return;\n      }\n\n      if (!group.activeItemId) {\n        group.activeItemId = items[0]?.id ?? null;\n      }\n\n      const currentIndex = group.activeItemId ? itemIndex(group, group.activeItemId) : 0;\n\n      switch (event.key) {\n        case \"ArrowDown\":\n          event.preventDefault();\n          group.activeItemId = items[(currentIndex + 1) % items.length]?.id ?? null;\n          break;\n        case \"ArrowUp\":\n          event.preventDefault();\n          group.activeItemId = items[(currentIndex - 1 + items.length) % items.length]?.id ?? null;\n          break;\n        case \"Home\":\n          event.preventDefault();\n          group.activeItemId = items[0]?.id ?? null;\n          break;\n        case \"End\":\n          event.preventDefault();\n          group.activeItemId = items[items.length - 1]?.id ?? null;\n          break;\n        default:\n          break;\n      }\n    },\n\n    triggerProps(accordionId, itemId) {\n      const open = this.isOpen(accordionId, itemId);\n      const active = this.activeItem(accordionId) === itemId;\n      return {\n        \"aria-expanded\": open,\n        \"aria-controls\": `${accordionId}-panel-${itemId}`,\n        id: `${accordionId}-trigger-${itemId}`,\n        tabindex: active ? 0 : -1,\n      };\n    },\n\n    panelProps(accordionId, itemId) {\n      const open = this.isOpen(accordionId, itemId);\n      return {\n        id: `${accordionId}-panel-${itemId}`,\n        role: \"region\",\n        \"aria-labelledby\": `${accordionId}-trigger-${itemId}`,\n        \"aria-hidden\": open ? undefined : true,\n      };\n    },\n\n    destroy() {\n      this.groups = {};\n    },\n  };\n\n  return store;\n}\n","import type AlpineType from \"alpinejs\";\nimport { type AccordionStore, createAccordionStore } from \"./store.js\";\n\nexport {\n  type AccordionGroupOptions,\n  type AccordionMode,\n  type AccordionStore,\n  createAccordionStore,\n} from \"./store.js\";\n\n/** Alpine.js accordion plugin. Registers `$store.accordion`. */\nexport default function accordionPlugin(): AlpineType.PluginCallback {\n  return function registerAccordion(Alpine) {\n    const store = createAccordionStore();\n    Alpine.store(\"accordion\", store);\n    Alpine.magic(\"accordion\", () => Alpine.store(\"accordion\"));\n  };\n}\n\ndeclare global {\n  namespace Alpine {\n    interface Stores {\n      accordion: AccordionStore;\n    }\n    interface Magics<T> {\n      $accordion: AccordionStore;\n    }\n  }\n}\n"],"mappings":"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","names":["store"]}