@astryxdesign/core 0.1.7-canary.fb9c68c → 0.1.7

package/src/Table/plugins/rowExpansion/useTableRowExpansion.test.tsx

@@ -1,7 +1,7 @@
 // Copyright (c) Meta Platforms, Inc. and affiliates.
 
 import {describe, it, expect, vi, beforeEach} from 'vitest';
-import {render, renderHook, screen, fireEvent} from '@testing-library/react';
+import {render, screen, fireEvent} from '@testing-library/react';
 import {useState} from 'react';
 import {Table} from '../../Table';
 import type {TableColumn} from '../../types';
@@ -153,92 +153,3 @@ describe('useTableRowExpansion', () => {
     expect(screen.queryByText('File B1')).not.toBeInTheDocument();
   });
 });
-
-describe('useTableRowExpansionState cycle guard', () => {
-  /** A row whose children array contains the row itself (plus a real child). */
-  function makeSelfReferential(): TreeItem[] {
-    const x: TreeItem = {id: 'x', name: 'Self', children: []};
-    const y: TreeItem = {id: 'y', name: 'Leaf Y', children: []};
-    x.children.push(x, y);
-    return [x];
-  }
-
-  /** root -> child -> grand, where grand's children point back at root. */
-  function makeDeepCycle(): TreeItem[] {
-    const root: TreeItem = {id: 'root', name: 'Root', children: []};
-    const child: TreeItem = {id: 'child', name: 'Child', children: []};
-    const grand: TreeItem = {id: 'grand', name: 'Grand', children: []};
-    root.children.push(child);
-    child.children.push(grand);
-    grand.children.push(root);
-    return [root];
-  }
-
-  function renderState(baseData: TreeItem[], expandedKeys: Set<string>) {
-    const setExpandedKeys = vi.fn();
-    const hook = renderHook(() =>
-      useTableRowExpansionState<TreeItem>({
-        baseData,
-        getChildren: item => item.children,
-        getRowKey: item => item.id,
-        expandedKeys,
-        setExpandedKeys,
-      }),
-    );
-    return {hook, setExpandedKeys};
-  }
-
-  it('terminates on a self-referential expanded row and flattens each key once', () => {
-    const {hook} = renderState(makeSelfReferential(), new Set(['x']));
-    const {data, expansionConfig} = hook.result.current;
-    expect(data.map(item => item.id)).toEqual(['x', 'y']);
-    expect(expansionConfig.getDepth?.(data[0])).toBe(0);
-    expect(expansionConfig.getDepth?.(data[1])).toBe(1);
-  });
-
-  it('terminates on a deeper cycle back to the root and flattens each key once', () => {
-    const {hook} = renderState(
-      makeDeepCycle(),
-      new Set(['root', 'child', 'grand']),
-    );
-    const {data, expansionConfig} = hook.result.current;
-    expect(data.map(item => item.id)).toEqual(['root', 'child', 'grand']);
-    expect(expansionConfig.getDepth?.(data[0])).toBe(0);
-    expect(expansionConfig.getDepth?.(data[1])).toBe(1);
-    expect(expansionConfig.getDepth?.(data[2])).toBe(2);
-    // The cycle guard keeps isAllExpanded computable — true, not a crash.
-    expect(expansionConfig.isAllExpanded).toBe(true);
-  });
-
-  it('terminates when collecting allExpandableKeys on cyclic data with nothing expanded', () => {
-    const {hook, setExpandedKeys} = renderState(
-      makeDeepCycle(),
-      new Set<string>(),
-    );
-    const {data, expansionConfig} = hook.result.current;
-    expect(data.map(item => item.id)).toEqual(['root']);
-    expansionConfig.onToggleExpandAll?.(true);
-    const nextKeys = setExpandedKeys.mock.calls[0][0] as Set<string>;
-    expect(Array.from(nextKeys)).toEqual(['root', 'child', 'grand']);
-  });
-
-  it('re-walks a shared child under each expanded parent (ancestor-path, not visited-set, semantics)', () => {
-    const leaf: TreeItem = {id: 'leaf', name: 'Leaf', children: []};
-    const shared: TreeItem = {id: 's', name: 'Shared', children: [leaf]};
-    const p1: TreeItem = {id: 'p1', name: 'Parent 1', children: [shared]};
-    const p2: TreeItem = {id: 'p2', name: 'Parent 2', children: [shared]};
-    const {hook} = renderState([p1, p2], new Set(['p1', 'p2', 's']));
-    // 's' is on neither parent's ancestor path, so it must flatten under
-    // both — the guard only skips true cycles, matching pre-guard behavior
-    // for acyclic (DAG-shaped) data.
-    const {data} = hook.result.current;
-    expect(data.map(item => item.id)).toEqual([
-      'p1',
-      's',
-      'leaf',
-      'p2',
-      's',
-      'leaf',
-    ]);
-  });
-});

package/src/Table/plugins/rowExpansion/useTableRowExpansion.tsx

@@ -141,19 +141,12 @@ export function useTableRowExpansionState<T extends Record<string, unknown>>({
 
   const depthMap = useMemo(() => {
     const map = new Map<string, number>();
-    // Ancestor keys on the current walk path — guards against cyclic data.
-    const path = new Set<string>();
     function walk(items: T[], depth: number) {
       for (const item of items) {
         const key = getRowKey(item);
-        if (path.has(key)) {
-          continue; // cyclic edge — skip
-        }
         map.set(key, depth);
         if (expandedKeys.has(key)) {
-          path.add(key);
           walk(getChildren(item), depth + 1);
-          path.delete(key);
         }
       }
     }
@@ -163,19 +156,12 @@ export function useTableRowExpansionState<T extends Record<string, unknown>>({
 
   const data = useMemo(() => {
     const result: T[] = [];
-    // Ancestor keys on the current walk path — guards against cyclic data.
-    const path = new Set<string>();
     function walk(items: T[]) {
       for (const item of items) {
-        const key = getRowKey(item);
-        if (path.has(key)) {
-          continue; // cyclic edge — skip
-        }
         result.push(item);
+        const key = getRowKey(item);
         if (expandedKeys.has(key)) {
-          path.add(key);
           walk(getChildren(item));
-          path.delete(key);
         }
       }
     }
@@ -186,19 +172,11 @@ export function useTableRowExpansionState<T extends Record<string, unknown>>({
   // Every expandable key across the whole tree (drives expand-all).
   const allExpandableKeys = useMemo(() => {
     const keys: string[] = [];
-    // Ancestor keys on the current walk path — guards against cyclic data.
-    const path = new Set<string>();
     function walk(items: T[]) {
       for (const item of items) {
-        const key = getRowKey(item);
-        if (path.has(key)) {
-          continue; // cyclic edge — skip
-        }
         if (isExpandable(item)) {
-          keys.push(key);
-          path.add(key);
+          keys.push(getRowKey(item));
           walk(getChildren(item));
-          path.delete(key);
         }
       }
     }
@@ -421,11 +399,7 @@ export function useTableRowExpansion<T extends Record<string, unknown>>(
           <ExpansionChevron
             isExpanded={isExpanded}
             onToggle={() => onToggle(key)}
-            ariaLabel={
-              isExpanded
-                ? t('@astryx.tableRowExpansion.collapseRow')
-                : t('@astryx.tableRowExpansion.expandRow')
-            }
+            ariaLabel={isExpanded ? t('@astryx.tableRowExpansion.collapseRow') : t('@astryx.tableRowExpansion.expandRow')}
           />
         );
       },
@@ -483,11 +457,7 @@ export function useTableRowExpansion<T extends Record<string, unknown>>(
                 <ExpansionChevron
                   isExpanded={isExpanded}
                   onToggle={() => onToggle(key)}
-                  ariaLabel={
-                    isExpanded
-                      ? t('@astryx.tableRowExpansion.collapseRow')
-                      : t('@astryx.tableRowExpansion.expandRow')
-                  }
+                  ariaLabel={isExpanded ? t('@astryx.tableRowExpansion.collapseRow') : t('@astryx.tableRowExpansion.expandRow')}
                 />
               ) : (
                 <span {...stylex.props(expansionStyles.placeholder)} />
@@ -529,9 +499,7 @@ export function useTableRowExpansion<T extends Record<string, unknown>>(
                 {...stylex.props(expansionStyles.chevronButton)}
                 onClick={() => onToggleExpandAll(!allExpanded)}
                 aria-label={
-                  allExpanded
-                    ? t('@astryx.tableRowExpansion.collapseAllRows')
-                    : t('@astryx.tableRowExpansion.expandAllRows')
+                  allExpanded ? t('@astryx.tableRowExpansion.collapseAllRows') : t('@astryx.tableRowExpansion.expandAllRows')
                 }>
                 <span
                   {...stylex.props(

package/src/Table/plugins/sortable/useTableSortable.test.tsx

@@ -12,9 +12,11 @@ import {render, screen, fireEvent} from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import {useState} from 'react';
 import {Table} from '../../Table';
-import {InternationalizationProvider} from '../../../i18n';
 import type {TableColumn} from '../../types';
-import {useTableSortable, type TableSortState} from './useTableSortable';
+import {
+  useTableSortable,
+  type TableSortState,
+} from './useTableSortable';
 
 // =============================================================================
 // Test Data
@@ -71,7 +73,9 @@ function SortableTable({
     isMultiSortEnabled,
   });
 
-  return <Table data={data} columns={columns} plugins={{sort: sortPlugin}} />;
+  return (
+    <Table data={data} columns={columns} plugins={{sort: sortPlugin}} />
+  );
 }
 
 // =============================================================================
@@ -668,15 +672,11 @@ describe('useTableSortable — context menu actions', () => {
 
     // Apply ascending → "Clear sort" now appears.
     fireEvent.click(
-      screen.getAllByRole('menuitem', {
-        name: 'Sort ascending',
-        hidden: true,
-      })[0],
+      screen.getAllByRole('menuitem', {name: 'Sort ascending', hidden: true})[0],
     );
     fireEvent.contextMenu(screen.getByText('Name'));
     expect(
-      screen.getAllByRole('menuitem', {name: 'Clear sort', hidden: true})
-        .length,
+      screen.getAllByRole('menuitem', {name: 'Clear sort', hidden: true}).length,
     ).toBeGreaterThan(0);
   });
 
@@ -709,89 +709,3 @@ describe('useTableSortable — context menu actions', () => {
     expect(onSortChange).toHaveBeenLastCalledWith([]);
   });
 });
-
-// =============================================================================
-// i18n (header-button aria-labels route through the catalog)
-// =============================================================================
-
-describe('useTableSortable — i18n', () => {
-  it('localizes the unsorted sort-by aria-label via @astryx.table.sort.sortBy', () => {
-    render(
-      <InternationalizationProvider
-        locale="fr"
-        overrides={{
-          fr: {'@astryx.table.sort.sortBy': 'Trier par {label}'},
-        }}>
-        <SortableTable />
-      </InternationalizationProvider>,
-    );
-
-    expect(
-      screen.getByRole('button', {name: 'Trier par Name'}),
-    ).toBeInTheDocument();
-    expect(
-      screen.getByRole('button', {name: 'Trier par Age'}),
-    ).toBeInTheDocument();
-  });
-
-  it('localizes the multi-sort priority aria-label with ICU number args', () => {
-    render(
-      <InternationalizationProvider
-        locale="fr"
-        overrides={{
-          fr: {
-            '@astryx.table.sort.sortedByWithPriority':
-              'Trier par {label}, tri {direction}, priorité {rank, number} sur {total, number}',
-            '@astryx.table.sort.direction.ascending': 'croissant',
-            '@astryx.table.sort.direction.descending': 'décroissant',
-          },
-        }}>
-        <SortableTable
-          isMultiSortEnabled
-          initialSort={[
-            {sortKey: 'name', direction: 'ascending'},
-            {sortKey: 'age', direction: 'descending'},
-          ]}
-        />
-      </InternationalizationProvider>,
-    );
-
-    // The overridden direction words deliberately differ from the raw enum
-    // values ('ascending'/'descending'), so an implementation interpolating
-    // the enum without translating it cannot pass — for either direction.
-    expect(
-      screen.getByRole('button', {
-        name: 'Trier par Name, tri croissant, priorité 1 sur 2',
-      }),
-    ).toBeInTheDocument();
-    expect(
-      screen.getByRole('button', {
-        name: 'Trier par Age, tri décroissant, priorité 2 sur 2',
-      }),
-    ).toBeInTheDocument();
-  });
-
-  it('localizes the sorted aria-label and direction word via their own keys', () => {
-    render(
-      <InternationalizationProvider
-        locale="fr"
-        overrides={{
-          fr: {
-            '@astryx.table.sort.sortedBy': 'Trié par {label}, {direction}',
-            '@astryx.table.sort.direction.ascending': 'croissant',
-          },
-        }}>
-        <SortableTable
-          initialSort={[{sortKey: 'name', direction: 'ascending'}]}
-        />
-      </InternationalizationProvider>,
-    );
-
-    // Both the composed template and the direction word resolve through
-    // their own catalog keys; 'croissant' differs from the raw enum value,
-    // so neither a hardcoded English frame nor raw-enum interpolation passes.
-    expect(
-      screen.getByRole('button', {name: 'Trié par Name, croissant'}),
-    ).toBeInTheDocument();
-  });
-});

package/src/Table/plugins/sortable/useTableSortable.tsx

@@ -4,7 +4,7 @@
 
 /**
  * @file useTableSortable.tsx
- * @input React, types, Icon, theme tokens, i18n (useTranslator)
+ * @input React, types, Icon, theme tokens
  * @output Exports useTableSortable hook and sort-related types
  * @position Sortable plugin; consumed by Table via plugins prop
  *
@@ -18,7 +18,7 @@ import * as stylex from '@stylexjs/stylex';
 import {colorVars, spacingVars, radiusVars} from '../../../theme/tokens.stylex';
 import {Icon} from '../../../Icon';
 import {resolveContextActions} from '../../tableContextMenu';
-import {useTranslator, type TranslatorFn} from '../../../i18n';
+import {useTranslator} from '../../../i18n';
 import type {
   TablePlugin,
   HeaderCellRenderProps,
@@ -184,7 +184,6 @@ function getHeaderLabel<T extends Record<string, unknown>>(
 }
 
 function buildAriaLabel<T extends Record<string, unknown>>(
-  t: TranslatorFn,
   column: TableColumn<T>,
   direction: TableSortDirection | null,
   rank: number | null,
@@ -192,21 +191,13 @@ function buildAriaLabel<T extends Record<string, unknown>>(
 ): string {
   const label = getHeaderLabel(column);
   if (direction == null) {
-    return t('@astryx.table.sort.sortBy', {label});
+    return `Sort by ${label}`;
   }
-  const directionLabel =
-    direction === 'ascending'
-      ? t('@astryx.table.sort.direction.ascending')
-      : t('@astryx.table.sort.direction.descending');
+  let ariaLabel = `Sort by ${label}, sorted ${direction}`;
   if (rank != null && total > 1) {
-    return t('@astryx.table.sort.sortedByWithPriority', {
-      label,
-      direction: directionLabel,
-      rank,
-      total,
-    });
+    ariaLabel += `, priority ${rank} of ${total}`;
   }
-  return t('@astryx.table.sort.sortedBy', {label, direction: directionLabel});
+  return ariaLabel;
 }
 
 function getNextDirection(
@@ -236,7 +227,6 @@ function SortHeaderButton<T extends Record<string, unknown>>({
   children: ReactNode;
   configRef: React.RefObject<UseTableSortableConfig>;
 }) {
-  const t = useTranslator();
   const config = configRef.current;
   const sortKey = resolveSortKey(column) ?? '';
   const entryIndex = config.sort.findIndex(e => e.sortKey === sortKey);
@@ -254,13 +244,7 @@ function SortHeaderButton<T extends Record<string, unknown>>({
         ? 'arrowDown'
         : 'arrowsUpDown';
 
-  const ariaLabel = buildAriaLabel(
-    t,
-    column,
-    direction,
-    rank,
-    config.sort.length,
-  );
+  const ariaLabel = buildAriaLabel(column, direction, rank, config.sort.length);
 
   const handleClick = (e: React.MouseEvent | React.KeyboardEvent) => {
     const cfg = configRef.current;

package/src/Table/useBaseTablePlugins.ts

@@ -18,15 +18,12 @@
  * Canonical order:
  *   1. columnSettings — column filtering (future: transformColumns)
  *   2. sort           — header cell sort controls
- *   3. tree           — indent + expander on the tree column
- *   4. selection      — checkbox column + row selection
- *   5. pagination     — pagination controls around the table
+ *   3. selection      — checkbox column + row selection
+ *   4. pagination     — pagination controls around the table
  *
  * Rationale:
  * - columnSettings filters columns before sort/selection see them
  * - sort adds header cell UI before selection adds its header column
- * - tree wraps the first *user* column before selection prepends its
- *   checkbox column, so the expander never lands in the checkbox column
  * - selection adds its column after sort so the checkbox header
  *   doesn't get a sort button
  * - pagination wraps the table in context last (outermost provider)
@@ -49,7 +46,6 @@ import type {TablePlugin} from './types';
 const PLUGIN_ORDER: ReadonlyArray<string> = [
   'columnSettings',
   'sort',
-  'tree',
   'selection',
   'pagination',
 ];

package/src/TextArea/TextArea.doc.mjs

@@ -116,7 +116,7 @@ export const docs = {
       name: 'startIcon',
       type: 'IconType',
       description:
-        'Icon component rendered inside the leading edge of the textarea wrapper. See `astryx docs icons` for valid semantic names.',
+        'Icon component rendered inside the leading edge of the textarea wrapper. See `npx astryx docs icons` for valid semantic names.',
     },
     {
       name: 'hasSpellCheck',

package/src/TextInput/TextInput.doc.mjs

@@ -106,7 +106,7 @@ export const docs = {
       name: 'startIcon',
       type: 'IconType',
       description:
-        'SVG icon component displayed at the start of the input. See `astryx docs icons` for valid semantic names.',
+        'SVG icon component displayed at the start of the input. See `npx astryx docs icons` for valid semantic names.',
     },
     {
       name: 'status',

package/src/Toolbar/Toolbar.tsx

@@ -239,7 +239,6 @@ export function Toolbar({
   const hasCenterContent = centerContent != null;
   const hasStartContent = startContent != null;
   const hasEndContent = endContent != null;
-  const hasBottomDivider = dividers?.includes('bottom') ?? false;
 
   const gapVar = spacingVars[spacingStepToVar[gap]] as string;
 
@@ -317,15 +316,9 @@ export function Toolbar({
               orientation === 'vertical' && styles.vertical,
               sizeStyles.base,
               dynamicStyles.gap(gapVar),
-              // Only drop the tab indicator through the toolbar's block padding
-              // onto the rail when a bottom divider is actually present.
-              // Without a divider, leave `--_tab-indicator-bottom` unset so a
-              // nested TabList's indicator keeps its own default (hugging the
-              // tab) instead of floating down into the toolbar's padding.
-              hasBottomDivider &&
-                dynamicStyles.tabIndicatorBottom(
-                  `calc(-1 * (${blockPaddingVarForSize[size]} + 1px))`,
-                ),
+              dynamicStyles.tabIndicatorBottom(
+                `calc(-1 * (${blockPaddingVarForSize[size]}${dividers?.includes('bottom') ? ' + 1px' : ''}))`,
+              ),
             ),
           )}
           {...props}>

package/src/theme/Theme.doc.mjs

@@ -39,12 +39,12 @@ export const docs = {
   },
   usage: {
     description:
-      'Wraps a subtree with a specific Astryx theme. For static production themes, use `astryx theme build` and import the generated CSS plus built theme object for first-paint and SSR performance. Use runtime `defineTheme()` when themes are dynamic or for prototyping.\n\n`defineTheme` accepts a `tokens` object whose keys are CSS custom property names (always prefixed with `--`). Common token names include `--color-accent`, `--color-background-surface`, `--color-background-body`, `--color-text-primary`, `--color-text-secondary`, `--radius-container`, `--spacing-1` through `--spacing-6`. Values can be a string (same for light/dark) or a `[light, dark]` tuple.\n\nExample:\n```ts\nimport {defineTheme} from \'@astryxdesign/core/theme\';\nconst myTheme = defineTheme({\n  name: \'ocean\',\n  tokens: {\n    \'--color-accent\': [\'#0077B6\', \'#48CAE4\'],\n    \'--color-background-surface\': [\'#F0F8FF\', \'#0A1628\'],\n    \'--color-text-primary\': [\'#0A1317\', \'#FFFFFF\'],\n    \'--radius-container\': \'16px\',\n  },\n});\n```',
+      'Wraps a subtree with a specific Astryx theme. For static production themes, use `npx astryx theme build` and import the generated CSS plus built theme object for first-paint and SSR performance. Use runtime `defineTheme()` when themes are dynamic or for prototyping.\n\n`defineTheme` accepts a `tokens` object whose keys are CSS custom property names (always prefixed with `--`). Common token names include `--color-accent`, `--color-background-surface`, `--color-background-body`, `--color-text-primary`, `--color-text-secondary`, `--radius-container`, `--spacing-1` through `--spacing-6`. Values can be a string (same for light/dark) or a `[light, dark]` tuple.\n\nExample:\n```ts\nimport {defineTheme} from \'@astryxdesign/core/theme\';\nconst myTheme = defineTheme({\n  name: \'ocean\',\n  tokens: {\n    \'--color-accent\': [\'#0077B6\', \'#48CAE4\'],\n    \'--color-background-surface\': [\'#F0F8FF\', \'#0A1628\'],\n    \'--color-text-primary\': [\'#0A1317\', \'#FFFFFF\'],\n    \'--radius-container\': \'16px\',\n  },\n});\n```',
     bestPractices: [
       {
         guidance: true,
         description:
-          'Build app themes that are known ahead of time with `astryx theme build`, then import the generated CSS and built theme object.',
+          'Build app themes that are known ahead of time with `npx astryx theme build`, then import the generated CSS and built theme object.',
       },
       {
         guidance: true,
@@ -90,12 +90,12 @@ export const docs = {
 export const docsDense = {
   usage: {
     description:
-      'Wraps subtree w/ specific Astryx theme. For static production themes, use `astryx theme build` + generated CSS + built theme object for first-paint/SSR performance. Use runtime `defineTheme()` for dynamic themes or prototyping. Token names always start with `--` (e.g. `--color-accent`, `--color-background-surface`).',
+      'Wraps subtree w/ specific Astryx theme. For static production themes, use `npx astryx theme build` + generated CSS + built theme object for first-paint/SSR performance. Use runtime `defineTheme()` for dynamic themes or prototyping. Token names always start with `--` (e.g. `--color-accent`, `--color-background-surface`).',
     bestPractices: [
       {
         guidance: true,
         description:
-          'Build app themes known ahead of time w/ `astryx theme build`; import generated CSS + built theme object.',
+          'Build app themes known ahead of time w/ `npx astryx theme build`; import generated CSS + built theme object.',
       },
       {
         guidance: true,

package/src/theme/Theme.tsx

@@ -127,7 +127,7 @@ function useThemeStyleInjection(theme: DefinedTheme): void {
           `For better performance, use the pre-built theme:\n\n` +
           `  import {${theme.name}Theme} from '@astryxdesign/theme-${theme.name}/built';\n` +
           `  import '@astryxdesign/theme-${theme.name}/theme.css';\n\n` +
-          `For custom themes, run \`npx @astryxdesign/cli theme build <file>\` to generate ` +
+          `For custom themes, run \`npx astryx theme build <file>\` to generate ` +
           `the built artifacts.`,
       );
     }

package/src/theme/defineTheme.ts

@@ -5,7 +5,7 @@
  *
  * Two distribution modes:
  * - Unbuilt: Theme generates CSS and injects a <style> tag at runtime
- * - Built: `astryx theme build` pre-compiles to a CSS file; Theme just
+ * - Built: `npx astryx theme build` pre-compiles to a CSS file; Theme just
  *   sets the data-astryx-theme attribute
  *
  * Token values can be:

package/src/theme/hct.ts

@@ -114,6 +114,10 @@ export function toneToY(tone: number): number {
   return labFInv((tone + 16) / 116);
 }
 
+export function yToTone(y: number): number {
+  return 116 * labF(y) - 16;
+}
+
 // =============================================================================
 // Hex <-> RGB
 // =============================================================================

package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts

@@ -1,89 +0,0 @@
-/**
- * @file DropdownMenuCheckboxItem.tsx
- * @input React, stylex, Item + Icon + DropdownMenu context + tokens from core
- * @output DropdownMenuCheckboxItem — a standalone checkable menu item.
- * @position Sub-component; used inside DropdownMenu.
- *
- * A menu item that toggles an independent boolean (role="menuitemcheckbox").
- * Unlike CheckboxInput, there is no nested native <input>: the row itself owns
- * the role and aria-checked, per the WAI-ARIA menuitemcheckbox pattern.
- * Keyboard navigation (arrows/typeahead) and Enter/Space activation come from
- * the parent DropdownMenu's useListFocus + activation path, which matches
- * menuitemcheckbox alongside plain menuitem rows.
- *
- * The square checkbox visual is decorative (aria-hidden) — the row owns the
- * checked state. Its size is derived from the menu's item size (a `sm` menu
- * gets the compact control; `md`/`lg` get the standard one) and it swaps to the
- * inline-end of the row on coarse-pointer (touch) devices via CSS `order`, so
- * it lands where selection toggles are conventionally placed on mobile. The
- * checkmark uses the `check` icon from the active theme's icon registry.
- */
-import { type ReactNode } from 'react';
-import { type IconType } from '../Icon';
-import type { BaseProps } from '../BaseProps';
-export interface DropdownMenuCheckboxItemProps extends Omit<BaseProps, 'onChange' | 'role' | 'aria-checked' | 'tabIndex'> {
-    /**
-     * Primary label text identifying the item.
-     */
-    label: ReactNode;
-    /**
-     * Secondary description text displayed below the label.
-     */
-    description?: ReactNode;
-    /**
-     * Icon to display before the label. Accepts a semantic icon name (see
-     * `npx astryx docs icons`) or a rendered node.
-     */
-    icon?: ReactNode | IconType;
-    /**
-     * Whether the item is checked. Controlled — pair with `onChange`.
-     */
-    value: boolean;
-    /**
-     * Callback fired with the next checked state when the item is toggled.
-     */
-    onChange?: (checked: boolean) => void;
-    /**
-     * Whether the item is disabled. Disabled items stay focusable (via
-     * `aria-disabled`) so they remain discoverable by keyboard and assistive
-     * technology, but activation is blocked.
-     * @default false
-     */
-    isDisabled?: boolean;
-    /**
-     * Whether toggling the item closes the menu. Checkbox items default to
-     * staying open so several can be toggled in a single session, unlike radio
-     * items which default to closing on selection.
-     * @default false
-     */
-    hasCloseOnSelect?: boolean;
-    /**
-     * Content to render after the label and description, such as a keyboard
-     * shortcut hint or badge.
-     */
-    endContent?: ReactNode;
-}
-/**
- * A checkable dropdown menu item (role="menuitemcheckbox").
- *
- * Must be used inside a DropdownMenu. Toggles an independent boolean; for a
- * one-of-N choice use DropdownMenuRadioGroup + DropdownMenuRadioItem instead.
- *
- * @example
- * ```
- *  * import {DropdownMenuCheckboxItem} from '@astryxdesign/core/DropdownMenu';
- *
- * <DropdownMenu button={{label: 'View'}}>
- *   <DropdownMenuCheckboxItem
- *     label="Show archived"
- *     value={showArchived}
- *     onChange={setShowArchived}
- *   />
- * </DropdownMenu>
- * ```
- */
-export declare function DropdownMenuCheckboxItem({ label, description, icon, value, onChange, isDisabled, hasCloseOnSelect, endContent, xstyle, className, style, ...rest }: DropdownMenuCheckboxItemProps): import("react").JSX.Element;
-export declare namespace DropdownMenuCheckboxItem {
-    var displayName: string;
-}
-//# sourceMappingURL=DropdownMenuCheckboxItem.d.ts.map

package/dist/DropdownMenu/DropdownMenuCheckboxItem.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DropdownMenuCheckboxItem.d.ts","sourceRoot":"","sources":["../../src/DropdownMenu/DropdownMenuCheckboxItem.tsx"],"names":[],"mappings":"AAIA;;;;;;;;;;;;;;;;;;;GAmBG;AAEH,OAAO,EAAc,KAAK,SAAS,EAAC,MAAM,OAAO,CAAC;AAElD,OAAO,EAAuB,KAAK,QAAQ,EAAC,MAAM,SAAS,CAAC;AAY5D,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,cAAc,CAAC;AA6D5C,MAAM,WAAW,6BAA8B,SAAQ,IAAI,CACzD,SAAS,EACT,UAAU,GAAG,MAAM,GAAG,cAAc,GAAG,UAAU,CAClD;IACC;;OAEG;IACH,KAAK,EAAE,SAAS,CAAC;IACjB;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;;OAGG;IACH,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,CAAC;IAC5B;;OAEG;IACH,KAAK,EAAE,OAAO,CAAC;IACf;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC;;;;;OAKG;IACH,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB;;;;;OAKG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B;;;OAGG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;CACxB;AAED;;;;;;;;;;;;;;;;;;GAkBG;AACH,wBAAgB,wBAAwB,CAAC,EACvC,KAAK,EACL,WAAW,EACX,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,UAAkB,EAClB,gBAAwB,EACxB,UAAU,EACV,MAAM,EACN,SAAS,EACT,KAAK,EACL,GAAG,IAAI,EACR,EAAE,6BAA6B,+BAwD/B;yBArEe,wBAAwB"}