@tokis/core 1.0.1 → 1.1.0

package/dist/cjs/__tests__/tabs.test.js

@@ -0,0 +1,148 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const vitest_1 = require("vitest");
+const tabs_machine_js_1 = require("../primitives/tabs/tabs.machine");
+// ─── Fixtures ──────────────────────────────────────────────────────────────
+function makeCtx(overrides = {}) {
+    return {
+        tabIds: ['tab-1', 'tab-2', 'tab-3'],
+        activeTabId: 'tab-1',
+        focusedTabId: 'tab-1',
+        activationMode: 'automatic',
+        orientation: 'horizontal',
+        loop: true,
+        ...overrides,
+    };
+}
+// ─── Machine tests ─────────────────────────────────────────────────────────
+(0, vitest_1.describe)('tabsMachine', () => {
+    (0, vitest_1.it)('starts in idle state', () => {
+        (0, vitest_1.expect)(tabs_machine_js_1.tabsMachine.initialState).toBe('idle');
+    });
+    (0, vitest_1.it)('stays in idle on any event (all context work is done by helpers)', () => {
+        (0, vitest_1.expect)(tabs_machine_js_1.tabsMachine.transition('idle', 'SELECT_TAB')).toBe('idle');
+        (0, vitest_1.expect)(tabs_machine_js_1.tabsMachine.transition('idle', 'NEXT_TAB')).toBe('idle');
+        (0, vitest_1.expect)(tabs_machine_js_1.tabsMachine.transition('idle', 'PREV_TAB')).toBe('idle');
+    });
+});
+// ─── Navigation helpers ────────────────────────────────────────────────────
+(0, vitest_1.describe)('getNextTabId', () => {
+    (0, vitest_1.it)('moves from first → second tab', () => {
+        const ctx = makeCtx({ focusedTabId: 'tab-1' });
+        (0, vitest_1.expect)((0, tabs_machine_js_1.getNextTabId)(ctx)).toBe('tab-2');
+    });
+    (0, vitest_1.it)('moves from second → third tab', () => {
+        const ctx = makeCtx({ focusedTabId: 'tab-2' });
+        (0, vitest_1.expect)((0, tabs_machine_js_1.getNextTabId)(ctx)).toBe('tab-3');
+    });
+    (0, vitest_1.it)('wraps from last → first when loop=true', () => {
+        const ctx = makeCtx({ focusedTabId: 'tab-3', loop: true });
+        (0, vitest_1.expect)((0, tabs_machine_js_1.getNextTabId)(ctx)).toBe('tab-1');
+    });
+    (0, vitest_1.it)('stays at last tab when loop=false', () => {
+        const ctx = makeCtx({ focusedTabId: 'tab-3', loop: false });
+        (0, vitest_1.expect)((0, tabs_machine_js_1.getNextTabId)(ctx)).toBe('tab-3');
+    });
+    (0, vitest_1.it)('returns first tab when current focus is not in tabIds', () => {
+        const ctx = makeCtx({ focusedTabId: 'unknown' });
+        (0, vitest_1.expect)((0, tabs_machine_js_1.getNextTabId)(ctx)).toBe('tab-1');
+    });
+});
+(0, vitest_1.describe)('getPrevTabId', () => {
+    (0, vitest_1.it)('moves from third → second tab', () => {
+        const ctx = makeCtx({ focusedTabId: 'tab-3' });
+        (0, vitest_1.expect)((0, tabs_machine_js_1.getPrevTabId)(ctx)).toBe('tab-2');
+    });
+    (0, vitest_1.it)('wraps from first → last when loop=true', () => {
+        const ctx = makeCtx({ focusedTabId: 'tab-1', loop: true });
+        (0, vitest_1.expect)((0, tabs_machine_js_1.getPrevTabId)(ctx)).toBe('tab-3');
+    });
+    (0, vitest_1.it)('stays at first tab when loop=false', () => {
+        const ctx = makeCtx({ focusedTabId: 'tab-1', loop: false });
+        (0, vitest_1.expect)((0, tabs_machine_js_1.getPrevTabId)(ctx)).toBe('tab-1');
+    });
+});
+// ─── reduceTabsContext ─────────────────────────────────────────────────────
+(0, vitest_1.describe)('reduceTabsContext', () => {
+    (0, vitest_1.it)('SELECT_TAB with payload sets activeTabId and focusedTabId', () => {
+        const ctx = makeCtx();
+        const patch = (0, tabs_machine_js_1.reduceTabsContext)(ctx, 'SELECT_TAB', { tabId: 'tab-2' });
+        (0, vitest_1.expect)(patch).toEqual({ activeTabId: 'tab-2', focusedTabId: 'tab-2' });
+    });
+    (0, vitest_1.it)('SELECT_TAB without payload uses current focusedTabId', () => {
+        const ctx = makeCtx({ focusedTabId: 'tab-3' });
+        const patch = (0, tabs_machine_js_1.reduceTabsContext)(ctx, 'SELECT_TAB');
+        (0, vitest_1.expect)(patch).toEqual({ activeTabId: 'tab-3', focusedTabId: 'tab-3' });
+    });
+    (0, vitest_1.it)('FOCUS_TAB in automatic mode also updates activeTabId', () => {
+        const ctx = makeCtx({ activationMode: 'automatic' });
+        const patch = (0, tabs_machine_js_1.reduceTabsContext)(ctx, 'FOCUS_TAB', { tabId: 'tab-2' });
+        (0, vitest_1.expect)(patch.focusedTabId).toBe('tab-2');
+        (0, vitest_1.expect)(patch.activeTabId).toBe('tab-2');
+    });
+    (0, vitest_1.it)('FOCUS_TAB in manual mode only updates focusedTabId', () => {
+        const ctx = makeCtx({ activationMode: 'manual' });
+        const patch = (0, tabs_machine_js_1.reduceTabsContext)(ctx, 'FOCUS_TAB', { tabId: 'tab-2' });
+        (0, vitest_1.expect)(patch.focusedTabId).toBe('tab-2');
+        (0, vitest_1.expect)(patch.activeTabId).toBeUndefined();
+    });
+    (0, vitest_1.it)('NEXT_TAB advances focus in automatic mode', () => {
+        const ctx = makeCtx({ focusedTabId: 'tab-1', activationMode: 'automatic' });
+        const patch = (0, tabs_machine_js_1.reduceTabsContext)(ctx, 'NEXT_TAB');
+        (0, vitest_1.expect)(patch.focusedTabId).toBe('tab-2');
+        (0, vitest_1.expect)(patch.activeTabId).toBe('tab-2');
+    });
+    (0, vitest_1.it)('PREV_TAB moves focus backward', () => {
+        const ctx = makeCtx({ focusedTabId: 'tab-2' });
+        const patch = (0, tabs_machine_js_1.reduceTabsContext)(ctx, 'PREV_TAB');
+        (0, vitest_1.expect)(patch.focusedTabId).toBe('tab-1');
+    });
+    (0, vitest_1.it)('FIRST_TAB jumps to first tab', () => {
+        const ctx = makeCtx({ focusedTabId: 'tab-3' });
+        const patch = (0, tabs_machine_js_1.reduceTabsContext)(ctx, 'FIRST_TAB');
+        (0, vitest_1.expect)(patch.focusedTabId).toBe('tab-1');
+    });
+    (0, vitest_1.it)('LAST_TAB jumps to last tab', () => {
+        const ctx = makeCtx({ focusedTabId: 'tab-1' });
+        const patch = (0, tabs_machine_js_1.reduceTabsContext)(ctx, 'LAST_TAB');
+        (0, vitest_1.expect)(patch.focusedTabId).toBe('tab-3');
+    });
+    (0, vitest_1.it)('unknown event returns empty patch (no-op)', () => {
+        const ctx = makeCtx();
+        // @ts-expect-error — intentional unknown event
+        const patch = (0, tabs_machine_js_1.reduceTabsContext)(ctx, 'UNKNOWN_EVENT');
+        (0, vitest_1.expect)(patch).toEqual({});
+    });
+});
+// ─── ARIA helpers ──────────────────────────────────────────────────────────
+(0, vitest_1.describe)('getTabAriaProps', () => {
+    (0, vitest_1.it)('returns correct ARIA attributes for the active tab', () => {
+        const ctx = makeCtx({ activeTabId: 'tab-1' });
+        const props = (0, tabs_machine_js_1.getTabAriaProps)(ctx, 'tab-1', 'panel-1');
+        (0, vitest_1.expect)(props.role).toBe('tab');
+        (0, vitest_1.expect)(props['aria-selected']).toBe(true);
+        (0, vitest_1.expect)(props['aria-controls']).toBe('panel-1');
+        (0, vitest_1.expect)(props.tabIndex).toBe(0);
+    });
+    (0, vitest_1.it)('marks non-active tabs as not selected with tabIndex -1', () => {
+        const ctx = makeCtx({ activeTabId: 'tab-1' });
+        const props = (0, tabs_machine_js_1.getTabAriaProps)(ctx, 'tab-2', 'panel-2');
+        (0, vitest_1.expect)(props['aria-selected']).toBe(false);
+        (0, vitest_1.expect)(props.tabIndex).toBe(-1);
+    });
+});
+(0, vitest_1.describe)('getTabPanelAriaProps', () => {
+    (0, vitest_1.it)('returns correct ARIA attributes for the visible panel', () => {
+        const ctx = makeCtx({ activeTabId: 'tab-1' });
+        const props = (0, tabs_machine_js_1.getTabPanelAriaProps)(ctx, 'panel-1', 'tab-1');
+        (0, vitest_1.expect)(props.role).toBe('tabpanel');
+        (0, vitest_1.expect)(props.hidden).toBe(false);
+        (0, vitest_1.expect)(props['aria-labelledby']).toBe('tab-1');
+        (0, vitest_1.expect)(props.tabIndex).toBe(0);
+    });
+    (0, vitest_1.it)('marks non-visible panels as hidden', () => {
+        const ctx = makeCtx({ activeTabId: 'tab-1' });
+        const props = (0, tabs_machine_js_1.getTabPanelAriaProps)(ctx, 'panel-2', 'tab-2');
+        (0, vitest_1.expect)(props.hidden).toBe(true);
+    });
+});

package/dist/cjs/index.js

@@ -14,11 +14,20 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+// Primitives — headless state machines per component
 __exportStar(require("./primitives/button/index"), exports);
+__exportStar(require("./primitives/dialog/index"), exports);
+__exportStar(require("./primitives/tabs/index"), exports);
+__exportStar(require("./primitives/accordion/index"), exports);
+__exportStar(require("./primitives/menu/index"), exports);
+__exportStar(require("./primitives/popover/index"), exports);
+// Focus management
 __exportStar(require("./focus/focus-trap"), exports);
 __exportStar(require("./focus/roving-tabindex"), exports);
 __exportStar(require("./focus/use-focus-visible"), exports);
+// Accessibility helpers
 __exportStar(require("./a11y/aria-helpers"), exports);
 __exportStar(require("./a11y/id-generator"), exports);
+// State utilities
 __exportStar(require("./state/controllable-state"), exports);
 __exportStar(require("./state/create-machine"), exports);

package/dist/cjs/primitives/accordion/accordion.machine.js

@@ -0,0 +1,109 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.accordionMachine = void 0;
+exports.reduceAccordionContext = reduceAccordionContext;
+exports.isAccordionItemOpen = isAccordionItemOpen;
+exports.getAccordionTriggerAriaProps = getAccordionTriggerAriaProps;
+exports.getAccordionPanelAriaProps = getAccordionPanelAriaProps;
+const create_machine_js_1 = require("../../state/create-machine");
+/**
+ * Accordion state machine.
+ *
+ * Like tabs, the macro-state is always 'idle'. Open/closed state per item
+ * lives in context.openItemIds. Use `reduceAccordionContext` in adapters.
+ */
+exports.accordionMachine = (0, create_machine_js_1.createMachine)({
+    id: 'accordion',
+    initial: 'idle',
+    context: {
+        itemIds: [],
+        openItemIds: new Set(),
+        multiple: false,
+        collapsible: true,
+    },
+    states: {
+        idle: {},
+    },
+});
+// ─── Pure context helpers ──────────────────────────────────────────────────
+/**
+ * Reduces an accordion event into a new openItemIds set.
+ * Returns the full updated context for easy spreading.
+ */
+function reduceAccordionContext(ctx, event, payload) {
+    const open = new Set(ctx.openItemIds);
+    switch (event) {
+        case 'TOGGLE_ITEM': {
+            const id = payload?.itemId;
+            if (!id)
+                return {};
+            if (open.has(id)) {
+                // Prevent closing the last item when collapsible=false
+                if (!ctx.collapsible && open.size === 1)
+                    return {};
+                open.delete(id);
+            }
+            else {
+                if (!ctx.multiple)
+                    open.clear(); // exclusive mode
+                open.add(id);
+            }
+            return { openItemIds: open };
+        }
+        case 'OPEN_ITEM': {
+            const id = payload?.itemId;
+            if (!id)
+                return {};
+            if (!ctx.multiple) {
+                const next = new Set();
+                next.add(id);
+                return { openItemIds: next };
+            }
+            open.add(id);
+            return { openItemIds: open };
+        }
+        case 'CLOSE_ITEM': {
+            const id = payload?.itemId;
+            if (!id)
+                return {};
+            if (!ctx.collapsible && open.size === 1 && open.has(id))
+                return {};
+            open.delete(id);
+            return { openItemIds: open };
+        }
+        case 'OPEN_ALL': {
+            if (!ctx.multiple)
+                return {}; // no-op for exclusive mode
+            return { openItemIds: new Set(ctx.itemIds) };
+        }
+        case 'CLOSE_ALL': {
+            if (!ctx.collapsible)
+                return {}; // no-op: cannot close when not collapsible
+            return { openItemIds: new Set() };
+        }
+        default:
+            return {};
+    }
+}
+/** Returns whether a specific item is currently open. */
+function isAccordionItemOpen(ctx, itemId) {
+    return ctx.openItemIds.has(itemId);
+}
+/** Returns ARIA attributes for an accordion trigger button. */
+function getAccordionTriggerAriaProps(ctx, itemId, panelId) {
+    const expanded = isAccordionItemOpen(ctx, itemId);
+    return {
+        role: 'button',
+        'aria-expanded': expanded,
+        'aria-controls': panelId,
+    };
+}
+/** Returns ARIA attributes for an accordion panel. */
+function getAccordionPanelAriaProps(ctx, panelId, triggerId) {
+    return {
+        role: 'region',
+        id: panelId,
+        'aria-labelledby': triggerId,
+        hidden: !isAccordionItemOpen(ctx, triggerId.replace('-trigger', '')),
+    };
+}

package/dist/cjs/primitives/accordion/accordion.types.js

@@ -0,0 +1,6 @@
+"use strict";
+/**
+ * Accordion state machine types.
+ * Implements the WAI-ARIA Accordion pattern (role="button" triggers on headings).
+ */
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/primitives/accordion/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./accordion.machine"), exports);
+__exportStar(require("./accordion.types"), exports);

package/dist/cjs/primitives/dialog/dialog.machine.js

@@ -0,0 +1,62 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.dialogMachine = void 0;
+exports.isDialogMounted = isDialogMounted;
+exports.isDialogOpen = isDialogOpen;
+const create_machine_js_1 = require("../../state/create-machine");
+/**
+ * Dialog state machine.
+ *
+ * Transition table:
+ *
+ *   closed  + OPEN          → opening  (animated) | open (no animation)
+ *   opening + ANIMATION_END → open
+ *   open    + CLOSE         → closing  (animated) | closed (no animation)
+ *   open    + TOGGLE        → closing  (animated) | closed (no animation)
+ *   closing + ANIMATION_END → closed
+ *   closed  + TOGGLE        → opening  (animated) | open (no animation)
+ *
+ * When `animated` is false the intermediate opening/closing states are
+ * skipped — callers simply never fire ANIMATION_END and can treat
+ * open/closed as the only two live states.
+ */
+exports.dialogMachine = (0, create_machine_js_1.createMachine)({
+    id: 'dialog',
+    initial: 'closed',
+    context: {
+        id: 'dialog',
+        modal: true,
+        closeOnOverlayClick: true,
+        closeOnEscape: true,
+        animated: true,
+    },
+    states: {
+        closed: {
+            OPEN: 'opening',
+            TOGGLE: 'opening',
+        },
+        opening: {
+            ANIMATION_END: 'open',
+            // Immediately cancel if closed before animation completes
+            CLOSE: 'closed',
+        },
+        open: {
+            CLOSE: 'closing',
+            TOGGLE: 'closing',
+        },
+        closing: {
+            ANIMATION_END: 'closed',
+            // Re-open before close animation completes
+            OPEN: 'opening',
+            TOGGLE: 'opening',
+        },
+    },
+});
+/** Derive if the dialog DOM node should be mounted (present in the DOM) */
+function isDialogMounted(state) {
+    return state === 'open' || state === 'opening' || state === 'closing';
+}
+/** Derive aria-expanded / open prop */
+function isDialogOpen(state) {
+    return state === 'open' || state === 'opening';
+}

package/dist/cjs/primitives/dialog/dialog.types.js

@@ -0,0 +1,6 @@
+"use strict";
+/**
+ * Dialog state machine types.
+ * Drives all dialog/modal variants: Dialog, AlertDialog, Drawer, Sheet.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/primitives/dialog/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./dialog.machine"), exports);
+__exportStar(require("./dialog.types"), exports);

package/dist/cjs/primitives/menu/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./menu.machine"), exports);
+__exportStar(require("./menu.types"), exports);

package/dist/cjs/primitives/menu/menu.machine.js

@@ -0,0 +1,135 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.menuMachine = void 0;
+exports.reduceMenuContext = reduceMenuContext;
+exports.getMenuTriggerAriaProps = getMenuTriggerAriaProps;
+exports.getMenuAriaProps = getMenuAriaProps;
+exports.getMenuItemAriaProps = getMenuItemAriaProps;
+const create_machine_js_1 = require("../../state/create-machine");
+/**
+ * Menu state machine.
+ *
+ * Transition table:
+ *   closed + OPEN   → open
+ *   closed + TOGGLE → open
+ *   open   + CLOSE  → closed
+ *   open   + TOGGLE → closed
+ *   open   + SELECT_ITEM → closed
+ *   (all other events keep current state, context mutated via helpers)
+ */
+exports.menuMachine = (0, create_machine_js_1.createMachine)({
+    id: 'menu',
+    initial: 'closed',
+    context: {
+        triggerId: 'menu-trigger',
+        items: [],
+        activeItemId: null,
+        searchBuffer: '',
+        loop: true,
+    },
+    states: {
+        closed: {
+            OPEN: 'open',
+            TOGGLE: 'open',
+        },
+        open: {
+            CLOSE: 'closed',
+            TOGGLE: 'closed',
+            SELECT_ITEM: 'closed',
+        },
+    },
+});
+// ─── Pure context helpers ──────────────────────────────────────────────────
+function enabledItems(items) {
+    return items.filter((i) => !i.disabled);
+}
+function getActiveIndex(ctx) {
+    if (!ctx.activeItemId)
+        return -1;
+    return enabledItems(ctx.items).findIndex((i) => i.id === ctx.activeItemId);
+}
+/** Handles navigation and search events, returning updated context fields. */
+function reduceMenuContext(ctx, event, payload) {
+    const enabled = enabledItems(ctx.items);
+    switch (event) {
+        case 'OPEN': {
+            // Focus first item on open
+            const first = enabled[0];
+            return { activeItemId: first?.id ?? null, searchBuffer: '' };
+        }
+        case 'CLOSE':
+        case 'TOGGLE': {
+            return { activeItemId: null, searchBuffer: '' };
+        }
+        case 'FOCUS_ITEM': {
+            return { activeItemId: payload?.itemId ?? null };
+        }
+        case 'SELECT_ITEM': {
+            return { activeItemId: null, searchBuffer: '' };
+        }
+        case 'NEXT_ITEM': {
+            const idx = getActiveIndex(ctx);
+            let next = idx + 1;
+            if (next >= enabled.length)
+                next = ctx.loop ? 0 : enabled.length - 1;
+            return { activeItemId: enabled[next]?.id ?? null };
+        }
+        case 'PREV_ITEM': {
+            const idx = getActiveIndex(ctx);
+            let prev = idx - 1;
+            if (prev < 0)
+                prev = ctx.loop ? enabled.length - 1 : 0;
+            return { activeItemId: enabled[prev]?.id ?? null };
+        }
+        case 'FIRST_ITEM': {
+            return { activeItemId: enabled[0]?.id ?? null };
+        }
+        case 'LAST_ITEM': {
+            return { activeItemId: enabled[enabled.length - 1]?.id ?? null };
+        }
+        case 'SEARCH': {
+            const char = (payload?.char ?? '').toLowerCase();
+            if (!char)
+                return {};
+            // Accumulate typeahead buffer (cleared by timeout in adapter)
+            const buffer = ctx.searchBuffer + char;
+            const currentIdx = getActiveIndex(ctx);
+            // Find next item starting with buffer, searching from after current
+            const startIdx = currentIdx + 1;
+            const rotated = [...enabled.slice(startIdx), ...enabled.slice(0, startIdx)];
+            const match = rotated.find((i) => i.label.toLowerCase().startsWith(buffer));
+            return {
+                searchBuffer: buffer,
+                activeItemId: match?.id ?? ctx.activeItemId,
+            };
+        }
+        default:
+            return {};
+    }
+}
+/** ARIA attributes for the menu trigger button. */
+function getMenuTriggerAriaProps(state, ctx, menuId) {
+    return {
+        'aria-haspopup': 'menu',
+        'aria-expanded': state === 'open',
+        'aria-controls': menuId,
+        id: ctx.triggerId,
+    };
+}
+/** ARIA attributes for the menu container (ul element). */
+function getMenuAriaProps(ctx, menuId) {
+    return {
+        role: 'menu',
+        id: menuId,
+        'aria-labelledby': ctx.triggerId,
+    };
+}
+/** ARIA attributes for a single menu item. */
+function getMenuItemAriaProps(ctx, item) {
+    return {
+        role: 'menuitem',
+        id: item.id,
+        'aria-disabled': item.disabled ?? false,
+        tabIndex: ctx.activeItemId === item.id ? 0 : -1,
+    };
+}

package/dist/cjs/primitives/menu/menu.types.js

@@ -0,0 +1,6 @@
+"use strict";
+/**
+ * Menu / DropdownMenu state machine types.
+ * Implements the WAI-ARIA Menu Button pattern.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/primitives/popover/index.js

@@ -0,0 +1,18 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./popover.machine"), exports);
+__exportStar(require("./popover.types"), exports);

package/dist/cjs/primitives/popover/popover.machine.js

@@ -0,0 +1,87 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.popoverMachine = void 0;
+exports.isPopoverMounted = isPopoverMounted;
+exports.isPopoverOpen = isPopoverOpen;
+exports.getPopoverDataState = getPopoverDataState;
+exports.getPopoverTriggerAriaProps = getPopoverTriggerAriaProps;
+exports.getPopoverAriaProps = getPopoverAriaProps;
+const create_machine_js_1 = require("../../state/create-machine");
+/**
+ * Popover state machine.
+ *
+ * Mirrors the Dialog machine's animated open/close cycle but without
+ * modal focus trapping — the popover is non-modal by default.
+ *
+ * Transition table:
+ *   closed  + OPEN          → opening  (animated) | open  (instant)
+ *   opening + ANIMATION_END → open
+ *   opening + CLOSE         → closed   (cancel open)
+ *   open    + CLOSE         → closing  (animated) | closed (instant)
+ *   open    + TOGGLE        → closing  (animated) | closed (instant)
+ *   closing + ANIMATION_END → closed
+ *   closing + OPEN          → opening  (re-open mid-close)
+ *   closing + TOGGLE        → opening  (re-open mid-close)
+ *   closed  + TOGGLE        → opening  (animated) | open  (instant)
+ */
+exports.popoverMachine = (0, create_machine_js_1.createMachine)({
+    id: 'popover',
+    initial: 'closed',
+    context: {
+        id: 'popover',
+        triggerId: 'popover-trigger',
+        placement: 'bottom',
+        closeOnClickOutside: true,
+        closeOnEscape: true,
+        animated: true,
+    },
+    states: {
+        closed: {
+            OPEN: 'opening',
+            TOGGLE: 'opening',
+        },
+        opening: {
+            ANIMATION_END: 'open',
+            CLOSE: 'closed',
+        },
+        open: {
+            CLOSE: 'closing',
+            TOGGLE: 'closing',
+        },
+        closing: {
+            ANIMATION_END: 'closed',
+            OPEN: 'opening',
+            TOGGLE: 'opening',
+        },
+    },
+});
+// ─── Derived state helpers ─────────────────────────────────────────────────
+/** Whether the popover DOM node should be present (mounted). */
+function isPopoverMounted(state) {
+    return state === 'open' || state === 'opening' || state === 'closing';
+}
+/** Whether the popover is visible (aria-expanded). */
+function isPopoverOpen(state) {
+    return state === 'open' || state === 'opening';
+}
+/** `data-state` attribute value for CSS animation hooks. */
+function getPopoverDataState(state) {
+    return isPopoverOpen(state) ? 'open' : 'closed';
+}
+/** ARIA attributes for the trigger element. */
+function getPopoverTriggerAriaProps(state, ctx) {
+    return {
+        id: ctx.triggerId,
+        'aria-expanded': isPopoverOpen(state),
+        'aria-controls': ctx.id,
+        'aria-haspopup': 'dialog',
+    };
+}
+/** ARIA attributes for the popover container element. */
+function getPopoverAriaProps(ctx) {
+    return {
+        id: ctx.id,
+        role: 'dialog',
+        'aria-labelledby': ctx.triggerId,
+    };
+}

package/dist/cjs/primitives/popover/popover.types.js

@@ -0,0 +1,7 @@
+"use strict";
+/**
+ * Popover state machine types.
+ * Implements the WAI-ARIA Disclosure / Popover pattern.
+ * Also used by Tooltip, ColorPicker, and floating panel variants.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });