@justanarthur/modo-ui 0.2.0 → 0.3.0

package/README.md

@@ -142,7 +142,7 @@ positioning) are ported.
 | `lib/` | FF's shared system files (upstream `lib/`, `hooks/` and the fluid-hover highlight, flat, upstream names), imported relatively by items. modo only scans the tier folders, so it never mistakes them for items. |
 | `modo.components.tsx` | Components only the docs site uses: the `Icon`, `Select` and `DocsNav` shell-slot adapters and the `ThemeSwitcher` panel item, picked in `modo.config.ts` by export name (`./modo.components.tsx#Select`). |
 | `primitives/<id>/` | FF's "System" pages: `index.tsx` (component + TSDoc prose) and `examples.mdx`, pulled in by `@example {@include ./examples.mdx}`. |
-| `components/[<group>/]<id>/` | FF's "Components" pages, same shape. The `inputs/`, `navigation/` and `overlays/` group folders become sidebar sub-groups and overview sections; the core display items stay ungrouped. |
+| `components/[<group>/]<id>/` | FF's "Components" pages, same shape. The `AI/`, `inputs/` (with `inputs/date-time/`), `navigation/` and `overlays/` group folders become sidebar sub-groups and overview sections; the core display items stay ungrouped. |
 | `blocks/<id>/` | Compositions of several items, same shape: `sidebar-app`, FF's sidebar preset `sa1FQfCxH6` as an app shell, with the header and footer blocks it is built from beside it. |
 
 ## Upstream → local file map
@@ -223,13 +223,13 @@ only what is specific to it:
 
 | Item | Upstream | Local | Specific modifications |
 |---|---|---|---|
-| `Accordion` | `registry/base/accordion.tsx` | `components/navigation/accordion/index.tsx` | open state runs through `useControllableState` (see [Behavior additions](#behavior-additions)); standalone `Accordion` accepts `highlight` and passes it to its items as their default; the panel morphs out of its row (a shape grows from the press point into the item, content clipped by it, layout height on its bottom edge; the `"item"` tint is that shape melted into the row through `GooFilter`), `effect` / `tier` on `Accordion.Content`; the group's hover highlight and focus ring snap with reflowed rows; statics `.Group/.Item/.Trigger/.Content` |
+| `Accordion` | `registry/base/accordion.tsx` | `components/accordion/index.tsx` | open state runs through `useControllableState` (see [Behavior additions](#behavior-additions)); standalone `Accordion` accepts `highlight` and passes it to its items as their default; the panel morphs out of its row (a shape grows from the press point into the item, content clipped by it, layout height on its bottom edge; the `"item"` tint is that shape melted into the row through `GooFilter`), `effect` / `tier` on `Accordion.Content`; the group's hover highlight and focus ring snap with reflowed rows; statics `.Group/.Item/.Trigger/.Content` |
 | `AlertDialog` | — (local) | `components/overlays/alert-dialog/index.tsx` | Base UI AlertDialog root (always modal, no outside-press dismissal) over Dialog's own parts and `DialogState`, so it morphs like Dialog; `AlertDialog.Content` drops the ✕ by default; statics as Dialog's |
 | `Badge` | `registry/default/badge.tsx` | `components/badge/index.tsx` | `variant` re-declared (it came from cva's `VariantProps` upstream); changes animate: a new label or variant springs the width (inner content span, `spring.moderate`) while the label blur-crossfades, a new color fades, the dot scales in and out; "Changes" example over a local `change-demo.tsx` stage |
 | `Button` | `registry/base/button.tsx` | `components/button/index.tsx` | `variant`/`disabled`/`children` re-declared; extra Sizes / Active / As-child / Loading morph examples; `loading` folds the surface into a circle around the spinner and back (`spring.moderate`, box unchanged), label and spinner crossfade, `aria-busy`, the disabled dim fades; "Loading morph" example over a local `loading-demo.tsx` stage; also serves modo's chrome Button (`shell.Button`) |
 | `Calendar` | — (local, on react-day-picker) | `components/inputs/date-time/calendar/index.tsx` (+ `use-month-window.ts`) | DayPicker props pass through (as shadcn's Calendar); styled through `classNames` and custom `Month` / `Day` / `DayButton` (no react-day-picker stylesheet); one scrolling list of months rendered as a 25-month window that moves as you scroll; a pinned weekday row, muted weekends, today's dot; FF's fills (the pick `bg-foreground text-background` like the primary button, a range `bg-active`, its preview `bg-hover`); month and year columns that mark the month being read and jump on click, before or after the days (`columnsSide`), turning into strips when narrow; `extraColumns` / `extraColumnsSide` for the date picker's time |
 | `Card` | `registry/default/card.tsx` | `components/card/index.tsx` | `next/link` → plain anchors (stretched card link, `CardButton`'s `href` form); statics `.Group/.Header/.Title/.Description/.Action/.Content/.Footer/.Media/.Image/.Eyebrow/.Feature/.Button` |
-| `CheckboxGroup` | `registry/base/checkbox-group.tsx` | `components/inputs/checkbox-group/index.tsx` | uncontrolled mode + group-level callback; item `checked`/`onToggle` optional, falling back to group context; arrow-key focus guarded for `noUncheckedIndexedAccess`; shared `useSelectionRuns`, picks melt and split through the goo; static `.Item` |
+| `Checkbox` (upstream `CheckboxItem`), `Checkbox.Group` (upstream `CheckboxGroup`) | `registry/base/checkbox-group.tsx` | `components/inputs/checkbox/index.tsx` | renamed; the row stands alone too (own state from `defaultChecked`, `onCheckedChange`, own hover and focus ring, `size`); rows numbered by the group (`lib/row-index.tsx`), so `index` is optional; uncontrolled mode + group-level callback; item `checked`/`onToggle` optional, falling back to group context; arrow-key focus guarded for `noUncheckedIndexedAccess`; shared `useSelectionRuns`, picks melt and split through the goo |
 | `ColorPicker` | `registry/default/color-picker.tsx` | `components/inputs/color-picker/index.tsx` | `@/registry/radix/{slider,tooltip}` → the Base siblings `../slider` / `../../overlays/tooltip`; `noUncheckedIndexedAccess` guards on regex captures, `rgb()`/`hsl()`/`oklch()` parts, `itemRects[i]` and the Slider's array value; static `.Popover`; uncontrolled support was already upstream (verified, kept); `ColorPicker.Popover` (goo on `spring.goo`; `from` / `effect` / `hideSource` / `tier`) and the format menu morph out of their triggers, replacing the motion wrappers and the ignored `actionsRef` |
 | `Combobox` | `registry/base/combobox.tsx` | `components/inputs/combobox/index.tsx` | root de-generified (the parser needs a plain function plus a same-file `interface ComboboxProps`): items gained an index signature, `value`/`defaultValue` are `string \| string[]` and `onValueChange` is a union of the two handler shapes; `ComboboxValue<Multiple>` still exported; `creatable` added; `React.*` type refs replaced by named type imports; statics `.Input/.Chips/.Content/.List/.Item/.Empty`; the popup morphs out of the field (morph layer, goo on `spring.goo`; `from` / `effect` / `hideSource` / `tier` on `Combobox.Content`), replacing the `scaleY` wrapper and the `actionsRef` deferred unmount |
 | `Command` | — (local) | `components/overlays/command/index.tsx` | Base UI Autocomplete rendered inline in Dialog's panel (`position="top"`, no ✕), morphing from its trigger with goo; grouped/flat command data filtered by label + keywords; one fluid highlight follows Base UI's highlight; ⌘K/Ctrl+K `hotkey` (one palette answers a press); fresh palette per open; statics `.Trigger/.Content/.Palette/.Shortcut`; `CommandList`/`CommandListRoot` exported for Search |
@@ -239,23 +239,23 @@ only what is specific to it:
 | `DatePicker`, `DateRangePicker`, `TimePicker`, `DurationPicker`, `MonthPicker` | — (local; props after shadcn's date picker and utegsk/ui's pickers) | `components/inputs/date-time/<id>/index.tsx` (+ the group's `picker-shell.tsx`, `time-columns.tsx`) | a field on the field ladder whose panel morphs out of it with Combobox's options (goo by default; `from` / `effect` / `hideSource` / `tier`, in place with `effect="morph"` + `hideSource`), or a bottom `Sheet` under 640px; one hour column with AM/PM on a 12-hour clock; `columnsSide` / `timeColumnsSide`; the panel header types the value in the locale's formats; `value` / `defaultValue` / `onValueChange` with `null` for empty — a `Date`, react-day-picker's `DateRange`, `"HH:mm"`, a date-fns `Duration`, a month's first day; `locale` is a react-day-picker locale throughout |
 | — | `registry/default/menu-item.tsx` | `components/overlays/dropdown/menu-item.tsx` | a row with no `checked` derives it from a self-managed panel and toggles the panel's state; `sourceIndex` carries the authored index so selection survives filter re-indexing |
 | — | `registry/default/dropdown-search.tsx` | `components/overlays/dropdown/dropdown-search.tsx` | `filter` mode: `value`/`onValueChange` optional, the field reads and writes the query held by the panel (`DropdownFilterContext`) |
-| `InputCopy` | `registry/default/input-copy.tsx` | `components/inputs/input-copy/index.tsx` | `@/registry/radix/tooltip` → `../../overlays/tooltip`; `useRef<ReturnType<typeof setTimeout> \| null>(null)` (React 18 overloads); defaults spelled into the prop prose; the tooltip comment's "Radix" reads "Base UI"; the copied state morphs: the glyph's two sheets melt through the goo filter into a status-tinted disc behind the check (✕ on failure) and split back |
+| `Copy` (upstream `InputCopy`) | `registry/default/input-copy.tsx` | `components/copy/index.tsx` | renamed, out of the inputs group; `@/registry/radix/tooltip` → `../overlays/tooltip`; `useRef<ReturnType<typeof setTimeout> \| null>(null)` (React 18 overloads); defaults spelled into the prop prose; the tooltip comment's "Radix" reads "Base UI"; the copied state morphs: the glyph's two sheets melt through the goo filter into a status-tinted disc behind the check (✕ on failure) and split back |
 | `Input`, `Label`, `InputGroup` | `registry/default/input-group.tsx` | `components/inputs/input/index.tsx` | `InputField` split into `Input` (the ringed box, standalone: own hover outside a group, `invalid`, `size`) and `Label` (a plain `<label>`, rendered through `Field.Label` in a field), composed back by `InputGroup.Field`; item renamed `input`, `Input` the default export; uncontrolled mode (`InputHTMLAttributes`' own `defaultValue` omitted in favour of the local one); static `.Field` |
-| `InputMessage` | `registry/default/input-message.tsx` | `components/inputs/input-message/index.tsx` | uncontrolled twins for value, files, queue and status (below); `FilePreviewTile` turned into a `forwardRef` (it exits inside `<AnimatePresence mode="popLayout">`, which measures through a ref); guards on `queue[0]`, `history[i]`, `suggestions[i]` and the `moveQueued` swap; FF's Playground section skipped and the surrounding transcript dropped (`ChatMessage` is not ported) |
-| — | `registry/default/file-thumbnail.tsx` | `components/inputs/input-message/file-thumbnail.tsx` | the lazy `import("pdfjs-dist")` is kept as-is — verified against modo's esbuild settings, it lands in a ~790 kB chunk fetched only when a PDF is attached; the worker still comes from jsDelivr, so no bundler-side worker config is needed; the `@next/next/no-img-element` eslint-disable dropped |
+| `InputMessage` | `registry/default/input-message.tsx` | `components/AI/input-message/index.tsx` | uncontrolled twins for value, files, queue and status (below); `FilePreviewTile` turned into a `forwardRef` (it exits inside `<AnimatePresence mode="popLayout">`, which measures through a ref); guards on `queue[0]`, `history[i]`, `suggestions[i]` and the `moveQueued` swap; FF's Playground section skipped and the surrounding transcript dropped (`ChatMessage` is not ported) |
+| — | `registry/default/file-thumbnail.tsx` | `components/AI/input-message/file-thumbnail.tsx` | the lazy `import("pdfjs-dist")` is kept as-is — verified against modo's esbuild settings, it lands in a ~790 kB chunk fetched only when a PDF is attached; the worker still comes from jsDelivr, so no bundler-side worker config is needed; the `@next/next/no-img-element` eslint-disable dropped |
 | `Popover` | — (local; after beUI's gooey popover and motion-primitives' morphing popover, see [Morph sources](#morph-sources)) | `components/overlays/popover/index.tsx` | Base UI Popover with the morph layer (goo by default); `openOnHover` on the trigger; statics `.Trigger/.Content/.Title/.Description/.Close` |
 | `PreviewCard` | — (local; after beUI's gooey popover, see [Morph sources](#morph-sources)) | `components/overlays/preview-card/index.tsx` | Base UI PreviewCard with the morph layer (goo from the link on `spring.goo`); `delay` / `closeDelay` / `render` on the trigger, a token-styled link by default; `from` without `'pointer'`; statics `.Trigger/.Content` |
-| `RadioGroup` | `registry/base/radio-group.tsx` | `components/inputs/radio-group/index.tsx` | uncontrolled index and value modes; group context carries a `selectIndex` setter every item calls, so items need no `selected`/`onSelect`; arrow-key focus guarded; selected background is a `GooIndicator`; static `.Item` |
+| `Radio` (upstream `RadioItem`), `Radio.Group` (upstream `RadioGroup`) | `registry/base/radio-group.tsx` | `components/inputs/radio/index.tsx` | renamed; rows numbered by the group (`lib/row-index.tsx`), so `index` is optional; uncontrolled index and value modes; group context carries a `selectIndex` setter every item calls, so items need no `selected`/`onSelect`; arrow-key focus guarded; selected background is a `GooIndicator` |
 | `Search` | — (local; after beUI's morphing search, see [Morph sources](#morph-sources)) | `components/inputs/search/index.tsx` | pill or icon button springing its own width in place (`spring.slow`), growing over its neighbors (`align`); with `items`, Autocomplete suggestions ooze out of the field via the morph layer (goo on `spring.goo`, `effect`/`tier`) with Command's rows; Escape closes → clears → collapses; blur collapses when empty; `shortcut`; `<search>` landmark + form, `onSubmit` |
 | `Select` | `registry/base/select.tsx` | `components/inputs/select/index.tsx` | members re-declared one per line (the parser drops members whose type spans lines); upstream's uncontrolled `defaultValue` verified and kept rather than rerouted through `useControllableState`; expando statics `.Trigger/.Content/.Item/.Group/.Label/.Separator`; the popup morphs out of its trigger (morph layer, goo on `spring.goo`; `from` / `effect` / `hideSource` / `tier` on `Select.Content`), replacing the `scaleY` wrapper and the `actionsRef` deferred unmount |
 | `Sheet` | — (local; replaces beUI's bottom sheet and drawer, see [Morph sources](#morph-sources)) | `components/overlays/sheet/index.tsx` | Base UI Drawer (swipe to dismiss, snap points, `Drawer.Viewport` for the swipe) with the morph growing from the sheet's own edge; a swipe-dismissed sheet slides on off its edge from the release point (the morph's `exit`); `side`, `snapPoints`, `defaultSnapPoint`; Dialog's parts and `DialogState` (Base UI's Drawer parts are Dialog's); statics as Dialog's plus `.Provider` / `.Indent` |
 | `Sidebar` | `registry/base/sidebar.tsx` (+ `registry/default/sidebar-core.tsx`, `sidebar-menu.tsx`; `app/globals.css` `.scroll-divider`) | `components/navigation/sidebar/index.tsx` (+ `sidebar-core.tsx`, `sidebar-menu.tsx`, `sidebar.css`) | the mobile sheet is the DS's `Sheet` (goo from its edge, swipe to dismiss) instead of a Dialog with a framer slide; no collapsed peek: `openOnHover` on the provider opens the sidebar in flow while the pointer is between its edge and the far side of a trigger beside it, the trigger switching between open and on hover (`panel-*-dashed` glyphs added to the icon context); the active row backgrounds are `GooIndicator`s and the hover highlight the liquid `FluidHoverHighlight`; uncontrolled selection (`value` on the buttons, `value` / `defaultValue` / `onValueChange` on `Sidebar`) and collapsible rows (`Sidebar.MenuItem collapsible`, below); statics `.Provider/.Trigger/.Rail/.Inset/.Input/.Header/.Content/.Footer/.Separator/.Group/.GroupLabel/.GroupAction/.GroupActions/.GroupContent/.Menu/.MenuItem/.MenuButton/.MenuAction/.MenuActions/.MenuBadge/.MenuSkeleton/.MenuSub/.MenuSubItem/.MenuSubButton` through a `SidebarComponent` cast; `fontVariationSettings` → `weight-*`, `text-[Npx]` → type roles, hex focus ring → `ring-focus-ring`, `duration-80\|160\|240` → tiers |
 | `Slider` | `registry/base/slider.tsx` | `components/inputs/slider/index.tsx` | `var(--color-accent)` → `var(--accent)` (no `--color-*` aliases here); uncontrolled support on the public wrapper, with both engines still fully controlled; `SliderProps extends Omit<SliderEngineProps, "value" \| "onChange">`; React 18 ref types (`MutableRefObject`); indexed reads of the value/step/pip arrays asserted |
-| `Switch` | `registry/base/switch.tsx` | `components/inputs/switch/index.tsx` | uncontrolled support; every in-body read goes through the resolved `isChecked` and a `toggle()` that also calls `onToggle`; the thumb is a `GooIndicator` in Base UI's Thumb (stretches as it travels), dragged x held in state |
+| `Switch` | `registry/base/switch.tsx` | `components/inputs/switch/index.tsx` | uncontrolled support; every in-body read goes through the resolved `isChecked` and a `toggle()` that also calls `onToggle`; the thumb is a `GooIndicator` in Base UI's Thumb (stretches as it travels), dragged x held in state; local `description` (muted line, `aria-describedby`) and `trackSide`; local `Switch.Group`: switches as settings rows (track at the end) in one outlined fieldset, after an outlined `Card.Group` (shared hairlines dropped around the fluid hover highlight), rows numbered by the group |
 | `Table` | `registry/default/table.tsx` | `components/table/index.tsx` | statics `.Header/.Body/.Row/.Head/.Cell`; `TableProps` / `TableRowProps` exported |
 | `Tabs` | `registry/base/tabs.tsx` | `components/navigation/tabs/index.tsx` | `defaultSelectedIndex` added as the index-mode twin of the existing `defaultValue`; indicator and hover pill are `GooIndicator`s (the hover pill returns to the active tab as it fades); statics `.List/.Item/.Panel` |
 | `TabsSubtle` | `registry/base/tabs-subtle.tsx` | `components/navigation/tabs-subtle/index.tsx` | uncontrolled mode; panels may be authored inside the root (below); the tab list's ref write goes through `MutableRefObject`; selected and hover pills are `GooIndicator`s; statics `.Item/.Panel` |
-| `ThinkingIndicator` | `registry/default/thinking-indicator.tsx` | `components/thinking-indicator/index.tsx` | upstream prop JSDoc kept (it already matches the FF API table); the `.shimmer-text` rule it rides lives in `base.css`; local `variant="goo"` (three dots merging and splitting through `GooFilter`, plain label; default stays `shimmer`); reduced motion also follows MotionConfig |
+| `ThinkingIndicator` | `registry/default/thinking-indicator.tsx` | `components/AI/thinking-indicator/index.tsx` | upstream prop JSDoc kept (it already matches the FF API table); the `.shimmer-text` rule it rides lives in `base.css`; local `variant="goo"` (three dots merging and splitting through `GooFilter`, plain label; default stays `shimmer`); reduced motion also follows MotionConfig |
 | `Toast` | — (local; after Sileo, see [Morph sources](#morph-sources)) | `components/overlays/toast/index.tsx` | Base UI Toast (queue, timers, swipe, announcements) with Sileo's pill melting into a body through the shared `GooFilter`; autopilot expand/collapse, six states on the `--status-*` tokens, promise toasts; `Toast` is the provider + viewport, `Toast.Trigger` shows one, `useToast()` the imperative API |
 | `Tooltip` | `registry/base/tooltip.tsx` | `components/overlays/tooltip/index.tsx` | `className`/`children` docs filled in; statics `.Provider` / `.PortalContainer`; the slide + fade replaced by the morph layer (goo from the trigger on `spring.goo`, `from` / `effect` / `tier` props; `followCursor` tooltips fade); a hand-off between grouped tooltips skips the morph (Base UI's `data-instant`) |
 
@@ -317,8 +317,10 @@ becomes the one block.
 | primitives | `code` (Code) | — (local, sugar-high) | — |
 | primitives | `morph` (Morph) | — (local, `lib/use-morph.ts`) | — |
 | primitives | `craft` (Craft) | — (local, bad/good pairs) | skill (before/after) |
-| components | accordion, button, checkbox-group, combobox, dialog, dropdown, radio-group, select, slider, switch, tabs, tabs-subtle, tooltip | `registry/base/<id>.tsx` | same slug |
-| components | badge, card, color-picker, input-copy, input-message, table, thinking-indicator | `registry/default/<id>.tsx` | same slug |
+| components | accordion, button, combobox, dialog, dropdown, select, slider, switch, tabs, tabs-subtle, tooltip | `registry/base/<id>.tsx` | same slug |
+| components | `checkbox` (Checkbox, `.Group`), `radio` (Radio, `.Group`) | `registry/base/checkbox-group.tsx`, `radio-group.tsx` | checkbox-group, radio-group |
+| components | badge, card, color-picker, input-message, table, thinking-indicator | `registry/default/<id>.tsx` | same slug |
+| components | `copy` (Copy) | `registry/default/input-copy.tsx` | input-copy |
 | components | `input` (Input, Label, InputGroup) | `registry/default/input-group.tsx` | input-group |
 | components | alert-dialog, command, context-menu, popover, preview-card, search, sheet, toast | — (local, see [Morph sources](#morph-sources)) | — |
 | components | calendar, date-picker, date-range-picker, time-picker, duration-picker, month-picker (group `inputs/date-time`) | — (local, on react-day-picker) | — |
@@ -460,11 +462,12 @@ was added and the item's own state props became optional.
 | Item | Controlled prop | Added uncontrolled prop | Added change callback |
 |---|---|---|---|
 | Accordion, Accordion.Group | `value` | `defaultValue` (semantics fixed, below) | — (`onValueChange` now also fires uncontrolled) |
-| CheckboxGroup | `checkedIndices` (now optional) | `defaultCheckedIndices` (`Set` or array) | `onCheckedIndicesChange` |
+| Checkbox | `checked` (now optional) | `defaultChecked` (standalone) | `onCheckedChange` |
+| Checkbox.Group | `checkedIndices` (now optional) | `defaultCheckedIndices` (`Set` or array) | `onCheckedIndicesChange` |
 | Dropdown, Dropdown.Content | `checkedIndex`, `checkedIndices` | `defaultCheckedIndex`, `defaultCheckedIndices` | `onCheckedIndexChange`, `onCheckedIndicesChange` |
 | Input, InputGroup.Field | `value`, `onChange` (now optional) | `defaultValue` | — |
 | InputMessage | `value`, `files`, `queue`, `status` | `defaultValue`, `defaultFiles`, `defaultQueue`, `defaultStatus` | `onValueChange` optional; `onStatusChange` added |
-| RadioGroup | `selectedIndex`, `value` | `defaultSelectedIndex`, `defaultValue` | `onSelectedIndexChange` (`onValueChange` now also fires uncontrolled) |
+| Radio.Group | `selectedIndex`, `value` | `defaultSelectedIndex`, `defaultValue` | `onSelectedIndexChange` (`onValueChange` now also fires uncontrolled) |
 | Slider | `value`, `onChange` (now optional) | `defaultValue` | — |
 | Switch | `checked`, `onToggle` (now optional) | `defaultChecked` | `onCheckedChange` |
 | Sidebar | `value` (new: the row whose `value` is selected) | `defaultValue` | `onValueChange` |
@@ -485,8 +488,8 @@ Notable local behavior changes beyond the `default*` props:
 | Item | Change |
 |---|---|
 | Accordion | Upstream treated the presence of `onValueChange` as "controlled", so an uncontrolled accordion with a listener never opened. Now `value` alone controls, and `defaultValue` seeds an accordion that still reports changes. |
-| RadioGroup | The group context carries a `selectIndex` setter that every item selection calls (after its own `onValueChange` / `onSelect`), so items need no `selected` / `onSelect` of their own. |
-| CheckboxGroup | The group context carries the checked set plus a setter; an item's toggle always reports to the group as well. |
+| Radio.Group | The group context carries a `selectIndex` setter that every item selection calls (after its own `onValueChange` / `onSelect`), so items need no `selected` / `onSelect` of their own. |
+| Checkbox.Group | The group context carries the checked set plus a setter; an item's toggle always reports to the group as well. |
 | TabsSubtle | Panels may now be written inside `<TabsSubtle>`: the root partitions its children, keeps the tabs inside the tab list and renders the panels as its siblings right after it (the root element *is* the `role="tablist"`, so panels cannot nest in it). A panel with no `selectedIndex` / `idPrefix` reads both from context, the prefix falling back to a `useId()` one; a panel rendered outside `<TabsSubtle>` still takes them as props. |
 | Dropdown | `Dropdown.Search` with `filter` hands the query to the panel, which drops the `Dropdown.Item` rows whose `label` doesn't match, re-indexes the survivors for fluid hover, and shows `Dropdown.Empty` only when nothing matched — the work the controlled form asks the consumer to do. Selection stays keyed on the authored index (`sourceIndex`), so it survives re-indexing. |
 | Combobox | `creatable` offers the create row with no callback and the component keeps the items it makes (merged into `items`, deduped by value), so a combobox can grow its own list; `onCreate` is unchanged and still wins when it returns an item. The root is also no longer generic — see the file map. |

package/dist/blocks/sidebar-app/index.js

@@ -1,20 +1,20 @@
 import {
   SidebarApp2
-} from "../../shared/components-njzgqdwy.js";
-import"../../shared/components-ca2c898n.js";
+} from "../../shared/components-2n3whx7z.js";
+import"../../shared/components-nb87fjy4.js";
 import"../../shared/components-c6s6b43g.js";
 import"../../shared/components-mhd39z7x.js";
-import"../../shared/components-ng72k97e.js";
 import"../../shared/components-rr7a6ja9.js";
-import"../../shared/components-nh8tma1n.js";
-import"../../shared/components-5xc2j8jz.js";
+import"../../shared/components-ng72k97e.js";
 import"../../shared/components-zfnmn5d4.js";
 import"../../shared/components-3ky44908.js";
+import"../../shared/components-a86dytt0.js";
+import"../../shared/components-5xc2j8jz.js";
 import"../../shared/components-zrkzcayz.js";
 import"../../shared/components-0q0sqfh4.js";
 import"../../shared/components-kvr7f9hy.js";
-import"../../shared/components-59efxjd9.js";
 import"../../shared/components-chacnk61.js";
+import"../../shared/components-59efxjd9.js";
 import"../../shared/components-hqeq3w9q.js";
 import"../../shared/components-jjw69c4c.js";
 import"../../shared/components-b2wyq2cq.js";

package/dist/components/{inputs → AI}/input-message/index.js

@@ -2,13 +2,13 @@ import {
   FileThumbnail2,
   InputMessage2,
   input_message_default
-} from "../../../shared/components-yh3kwdhr.js";
+} from "../../../shared/components-d6xtjht3.js";
 import"../../../shared/components-ng72k97e.js";
 import"../../../shared/components-zrkzcayz.js";
 import"../../../shared/components-0q0sqfh4.js";
 import"../../../shared/components-kvr7f9hy.js";
-import"../../../shared/components-59efxjd9.js";
 import"../../../shared/components-chacnk61.js";
+import"../../../shared/components-59efxjd9.js";
 import"../../../shared/components-hqeq3w9q.js";
 import"../../../shared/components-jjw69c4c.js";
 import"../../../shared/components-b2wyq2cq.js";

package/dist/components/AI/thinking-indicator/index.js

@@ -0,0 +1,13 @@
+import {
+  ThinkingIndicator2,
+  thinking_indicator_default
+} from "../../../shared/components-27nnvrwe.js";
+import"../../../shared/components-0q0sqfh4.js";
+import"../../../shared/components-hqeq3w9q.js";
+import"../../../shared/components-men63rwj.js";
+import"../../../shared/components-0sn7ypjw.js";
+import"../../../shared/components-ezxhrmer.js";
+export {
+  ThinkingIndicator2 as ThinkingIndicator,
+  thinking_indicator_default as default
+};

package/dist/components/accordion/index.js

@@ -0,0 +1,28 @@
+import {
+  AccordionGroup2,
+  Accordion2,
+  AccordionItem2,
+  AccordionTrigger2,
+  AccordionContent2,
+  accordion_default
+} from "../../shared/components-b3c5et5b.js";
+import"../../shared/components-zrkzcayz.js";
+import"../../shared/components-0q0sqfh4.js";
+import"../../shared/components-kvr7f9hy.js";
+import"../../shared/components-chacnk61.js";
+import"../../shared/components-59efxjd9.js";
+import"../../shared/components-hqeq3w9q.js";
+import"../../shared/components-jjw69c4c.js";
+import"../../shared/components-n7mjr357.js";
+import"../../shared/components-men63rwj.js";
+import"../../shared/components-0sn7ypjw.js";
+import"../../shared/components-cv16mryv.js";
+import"../../shared/components-ezxhrmer.js";
+export {
+  Accordion2 as Accordion,
+  AccordionContent2 as AccordionContent,
+  AccordionGroup2 as AccordionGroup,
+  AccordionItem2 as AccordionItem,
+  AccordionTrigger2 as AccordionTrigger,
+  accordion_default as default
+};

package/dist/components/card/index.js

@@ -13,11 +13,11 @@ import {
   CardFeature2,
   CardButton2,
   card_default
-} from "../../shared/components-apdwtweq.js";
+} from "../../shared/components-jbbmdr74.js";
 import"../../shared/components-zrkzcayz.js";
 import"../../shared/components-kvr7f9hy.js";
-import"../../shared/components-59efxjd9.js";
 import"../../shared/components-chacnk61.js";
+import"../../shared/components-59efxjd9.js";
 import"../../shared/components-hqeq3w9q.js";
 import"../../shared/components-jjw69c4c.js";
 import"../../shared/components-men63rwj.js";

package/dist/components/{inputs/input-copy → copy}/index.d.ts

@@ -2,9 +2,9 @@ import { HTMLAttributes } from "react";
 type SizeVariant = "default" | "compact";
 import { ForwardRefExoticComponent as ForwardRefExoticComponent_tcubfn } from "react";
 import { RefAttributes as RefAttributes_miuf56 } from "react";
-type InputCopyVariant = "icon" | "button";
-type InputCopyAlign = "right" | "left";
-interface InputCopyProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
+type CopyVariant = "icon" | "button";
+type CopyAlign = "right" | "left";
+interface CopyProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"> {
 	/** The text value to display and copy to clipboard. */
 	value: string;
 	/** Optional label displayed above the input. */
@@ -14,9 +14,9 @@ interface InputCopyProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"
 	/** Disables the input and copy button. Defaults to `false`. */
 	disabled?: boolean;
 	/** Icon-only with tooltip, or button with visible label. Defaults to `"icon"`. */
-	variant?: InputCopyVariant;
+	variant?: CopyVariant;
 	/** Position of the copy action relative to the value. Defaults to `"right"`. */
-	align?: InputCopyAlign;
+	align?: CopyAlign;
 	/** Pins the field to one step of the size ladder (default 36px, compact 28px — see Sizes). Omitted, it follows the surrounding SizeProvider. */
 	size?: SizeVariant;
 	/** Extra classes for the wrapper around the label and the field. */
@@ -40,5 +40,5 @@ interface InputCopyProps extends Omit<HTMLAttributes<HTMLDivElement>, "children"
 *
 * @example {@include ./examples.mdx}
 */
-declare const InputCopy: ForwardRefExoticComponent_tcubfn<InputCopyProps & RefAttributes_miuf56<HTMLDivElement>>;
-export { InputCopy, InputCopyAlign, InputCopyProps, InputCopyVariant, InputCopy as default };
+declare const Copy: ForwardRefExoticComponent_tcubfn<CopyProps & RefAttributes_miuf56<HTMLDivElement>>;
+export { Copy, CopyAlign, CopyProps, CopyVariant, Copy as default };

package/dist/components/copy/index.js

@@ -0,0 +1,16 @@
+import {
+  Copy2,
+  copy_default
+} from "../../shared/components-s083f38z.js";
+import"../../shared/components-ng72k97e.js";
+import"../../shared/components-zrkzcayz.js";
+import"../../shared/components-0q0sqfh4.js";
+import"../../shared/components-hqeq3w9q.js";
+import"../../shared/components-men63rwj.js";
+import"../../shared/components-0sn7ypjw.js";
+import"../../shared/components-cv16mryv.js";
+import"../../shared/components-ezxhrmer.js";
+export {
+  Copy2 as Copy,
+  copy_default as default
+};

package/dist/components/inputs/checkbox/index.d.ts

@@ -0,0 +1,62 @@
+import { ForwardRefExoticComponent, HTMLAttributes, ReactNode, RefAttributes } from "react";
+type SizeVariant = "default" | "compact";
+interface CheckboxGroupProps extends HTMLAttributes<HTMLDivElement> {
+	/** `Checkbox` rows. */
+	children: ReactNode;
+	/** Set of checked item indices; drives the merged background across contiguous picks. Controlled — pair it with `onCheckedIndicesChange` (or per-item `onToggle`). */
+	checkedIndices?: Set<number>;
+	/** Checked indices on first render when uncontrolled (a Set or an array). Defaults to none. */
+	defaultCheckedIndices?: Set<number> | number[];
+	/** Called with the next checked set whenever an item is toggled. */
+	onCheckedIndicesChange?: (checkedIndices: Set<number>) => void;
+	/** Pins the group's rows to one step of the size ladder (default 36px, compact 28px). Defaults to the surrounding SizeProvider. */
+	size?: SizeVariant;
+}
+declare const CheckboxGroup: ForwardRefExoticComponent<CheckboxGroupProps & RefAttributes<HTMLDivElement>>;
+interface CheckboxProps extends HTMLAttributes<HTMLDivElement> {
+	/** Text label for the checkbox. */
+	label: string;
+	/** Whether the checkbox is checked (controlled). Defaults to the group's checked set inside a `Checkbox.Group`, else its own state. */
+	checked?: boolean;
+	/** Whether a standalone checkbox starts checked (uncontrolled). Defaults to `false`. */
+	defaultChecked?: boolean;
+	/** Called with the new state whenever the checkbox is toggled, in a group or not. */
+	onCheckedChange?: (checked: boolean) => void;
+	/** Called when the checkbox is toggled (a group's `onCheckedIndicesChange` fires too). */
+	onToggle?: () => void;
+	/** Position within a `Checkbox.Group`: the row's key in `checkedIndices`. Defaults to its order among the group's rows. */
+	index?: number;
+	/** Pins the checkbox to one step of the size ladder (see Sizes). Defaults to the surrounding SizeProvider (a group's `size`). */
+	size?: SizeVariant;
+}
+type CheckboxComponent = ForwardRefExoticComponent<CheckboxProps & RefAttributes<HTMLDivElement>> & {
+	Group: typeof CheckboxGroup;
+};
+/**
+* Checkbox with a self-drawing check, alone or in a group with merged
+* backgrounds for contiguous picks.
+*
+* The whole row is the hit target; Space or Enter toggles it, the check mark
+* draws itself in, and the checked label animates to semibold without
+* shifting its width. A standalone checkbox keeps its own state from
+* `defaultChecked`, or is controlled with `checked`; `onCheckedChange`
+* reports every toggle.
+*
+* In a `Checkbox.Group`, contiguous checked rows share one background: a
+* checked row's background grows out of its center and melts into its
+* neighbours, an unchecked one pinches off and shrinks away (the liquid
+* indicators in Morph). A fluid hover highlight melts from row to row, and
+* Arrow Up/Down, Home and End move focus. The group numbers its rows in
+* order, so they need no `index`; pass one to key a row explicitly.
+*
+* Statics:
+* - `Checkbox.Group` — the list: uncontrolled with `defaultCheckedIndices`
+*   (a Set or an array of row indices), or controlled with `checkedIndices`
+*   plus `onCheckedIndicesChange`; `size` pins every row to one step of the
+*   size ladder. A row's own `checked` / `onToggle` still override the group
+*   for that row.
+*
+* @example {@include ./examples.mdx}
+*/
+declare const Checkbox: CheckboxComponent;
+export { Checkbox, CheckboxGroup, CheckboxGroupProps, CheckboxProps, Checkbox as default };

package/dist/components/inputs/{checkbox-group → checkbox}/index.js

@@ -1,12 +1,13 @@
 import {
   CheckboxGroup2,
-  CheckboxItem2,
-  checkbox_group_default
-} from "../../../shared/components-ytb2tefr.js";
+  Checkbox2,
+  checkbox_default
+} from "../../../shared/components-hyq23phv.js";
+import"../../../shared/components-ta7shw28.js";
 import"../../../shared/components-5xc2j8jz.js";
 import"../../../shared/components-kvr7f9hy.js";
-import"../../../shared/components-59efxjd9.js";
 import"../../../shared/components-chacnk61.js";
+import"../../../shared/components-59efxjd9.js";
 import"../../../shared/components-hqeq3w9q.js";
 import"../../../shared/components-jjw69c4c.js";
 import"../../../shared/components-n7mjr357.js";
@@ -15,7 +16,7 @@ import"../../../shared/components-0sn7ypjw.js";
 import"../../../shared/components-cv16mryv.js";
 import"../../../shared/components-ezxhrmer.js";
 export {
+  Checkbox2 as Checkbox,
   CheckboxGroup2 as CheckboxGroup,
-  CheckboxItem2 as CheckboxItem,
-  checkbox_group_default as default
+  checkbox_default as default
 };

package/dist/components/inputs/color-picker/index.js

@@ -7,14 +7,14 @@ import {
   ColorPicker2,
   ColorPickerPopover2,
   color_picker_default
-} from "../../../shared/components-3k8xpnpq.js";
+} from "../../../shared/components-jthe1pwb.js";
 import"../../../shared/components-wvp1m52g.js";
 import"../../../shared/components-ng72k97e.js";
 import"../../../shared/components-zrkzcayz.js";
 import"../../../shared/components-0q0sqfh4.js";
 import"../../../shared/components-kvr7f9hy.js";
-import"../../../shared/components-59efxjd9.js";
 import"../../../shared/components-chacnk61.js";
+import"../../../shared/components-59efxjd9.js";
 import"../../../shared/components-hqeq3w9q.js";
 import"../../../shared/components-jjw69c4c.js";
 import"../../../shared/components-n7mjr357.js";

package/dist/components/inputs/combobox/index.d.ts

@@ -73,7 +73,7 @@ type Element_12xgc2 = JSX_1kxb2["Element"];
 * (the input keeps focus while the arrows move a highlight through the rows),
 * the positioning and the hidden form input stay with Base UI. On top of that
 * sit the fluid-hover highlight, the merged selection background of
-* `CheckboxGroup`, and a list that oozes out of the field and back through the
+* `Checkbox.Group`, and a list that oozes out of the field and back through the
 * shared morph (see Morph), goo by default. `multiple` turns the picks into a
 * `string[]` and pairs with `Combobox.Chips`: one chip per pick, Backspace in
 * an empty field drops the last one. Uncontrolled with `defaultValue`, or

package/dist/components/inputs/combobox/index.js

@@ -7,7 +7,7 @@ import {
   ComboboxItem2,
   ComboboxEmpty2,
   combobox_default
-} from "../../../shared/components-3gae8nta.js";
+} from "../../../shared/components-8ey44d79.js";
 import {
   fieldVariants
 } from "../../../shared/components-mhd39z7x.js";
@@ -15,8 +15,8 @@ import"../../../shared/components-5xc2j8jz.js";
 import"../../../shared/components-zrkzcayz.js";
 import"../../../shared/components-0q0sqfh4.js";
 import"../../../shared/components-kvr7f9hy.js";
-import"../../../shared/components-59efxjd9.js";
 import"../../../shared/components-chacnk61.js";
+import"../../../shared/components-59efxjd9.js";
 import"../../../shared/components-hqeq3w9q.js";
 import"../../../shared/components-jjw69c4c.js";
 import"../../../shared/components-men63rwj.js";

package/dist/components/inputs/date-time/calendar/index.js

@@ -1,11 +1,11 @@
 import {
   Calendar2,
   calendar_default
-} from "../../../../shared/components-1rfwbyyc.js";
-import"../../../../shared/components-9jvzzvt1.js";
+} from "../../../../shared/components-1z6tdadk.js";
+import"../../../../shared/components-gz8zf3ec.js";
 import"../../../../shared/components-kvr7f9hy.js";
-import"../../../../shared/components-59efxjd9.js";
 import"../../../../shared/components-chacnk61.js";
+import"../../../../shared/components-59efxjd9.js";
 import"../../../../shared/components-hqeq3w9q.js";
 import"../../../../shared/components-jjw69c4c.js";
 import"../../../../shared/components-men63rwj.js";

package/dist/components/inputs/date-time/date-picker/index.js

@@ -1,12 +1,12 @@
 import {
   DatePicker2,
   date_picker_default
-} from "../../../../shared/components-v7wtz8hk.js";
-import"../../../../shared/components-1rfwbyyc.js";
-import"../../../../shared/components-q4daerx0.js";
+} from "../../../../shared/components-2nhgyh31.js";
+import"../../../../shared/components-1z6tdadk.js";
+import"../../../../shared/components-mjthm1kf.js";
 import"../../../../shared/components-7btqt08d.js";
 import"../../../../shared/components-gvr9w41t.js";
-import"../../../../shared/components-9jvzzvt1.js";
+import"../../../../shared/components-gz8zf3ec.js";
 import"../../../../shared/components-c6s6b43g.js";
 import"../../../../shared/components-mhd39z7x.js";
 import"../../../../shared/components-rr7a6ja9.js";
@@ -15,8 +15,8 @@ import"../../../../shared/components-3ky44908.js";
 import"../../../../shared/components-zrkzcayz.js";
 import"../../../../shared/components-0q0sqfh4.js";
 import"../../../../shared/components-kvr7f9hy.js";
-import"../../../../shared/components-59efxjd9.js";
 import"../../../../shared/components-chacnk61.js";
+import"../../../../shared/components-59efxjd9.js";
 import"../../../../shared/components-hqeq3w9q.js";
 import"../../../../shared/components-jjw69c4c.js";
 import"../../../../shared/components-b2wyq2cq.js";

package/dist/components/inputs/date-time/date-range-picker/index.js

@@ -1,11 +1,11 @@
 import {
   DateRangePicker2,
   date_range_picker_default
-} from "../../../../shared/components-cbxjn9p8.js";
-import"../../../../shared/components-1rfwbyyc.js";
+} from "../../../../shared/components-k809mbn0.js";
+import"../../../../shared/components-1z6tdadk.js";
 import"../../../../shared/components-7btqt08d.js";
 import"../../../../shared/components-gvr9w41t.js";
-import"../../../../shared/components-9jvzzvt1.js";
+import"../../../../shared/components-gz8zf3ec.js";
 import"../../../../shared/components-c6s6b43g.js";
 import"../../../../shared/components-mhd39z7x.js";
 import"../../../../shared/components-rr7a6ja9.js";
@@ -14,8 +14,8 @@ import"../../../../shared/components-3ky44908.js";
 import"../../../../shared/components-zrkzcayz.js";
 import"../../../../shared/components-0q0sqfh4.js";
 import"../../../../shared/components-kvr7f9hy.js";
-import"../../../../shared/components-59efxjd9.js";
 import"../../../../shared/components-chacnk61.js";
+import"../../../../shared/components-59efxjd9.js";
 import"../../../../shared/components-hqeq3w9q.js";
 import"../../../../shared/components-jjw69c4c.js";
 import"../../../../shared/components-b2wyq2cq.js";

package/dist/components/inputs/date-time/duration-picker/index.js

@@ -1,11 +1,11 @@
 import {
   DurationPicker2,
   duration_picker_default
-} from "../../../../shared/components-7ans7ce5.js";
-import"../../../../shared/components-q4daerx0.js";
+} from "../../../../shared/components-re6rs21k.js";
+import"../../../../shared/components-mjthm1kf.js";
 import"../../../../shared/components-7btqt08d.js";
 import"../../../../shared/components-gvr9w41t.js";
-import"../../../../shared/components-9jvzzvt1.js";
+import"../../../../shared/components-gz8zf3ec.js";
 import"../../../../shared/components-c6s6b43g.js";
 import"../../../../shared/components-mhd39z7x.js";
 import"../../../../shared/components-rr7a6ja9.js";
@@ -14,8 +14,8 @@ import"../../../../shared/components-3ky44908.js";
 import"../../../../shared/components-zrkzcayz.js";
 import"../../../../shared/components-0q0sqfh4.js";
 import"../../../../shared/components-kvr7f9hy.js";
-import"../../../../shared/components-59efxjd9.js";
 import"../../../../shared/components-chacnk61.js";
+import"../../../../shared/components-59efxjd9.js";
 import"../../../../shared/components-hqeq3w9q.js";
 import"../../../../shared/components-jjw69c4c.js";
 import"../../../../shared/components-b2wyq2cq.js";

package/dist/components/inputs/date-time/month-picker/index.js

@@ -1,10 +1,10 @@
 import {
   MonthPicker2,
   month_picker_default
-} from "../../../../shared/components-4cnjmgex.js";
+} from "../../../../shared/components-3fbbvq5j.js";
 import"../../../../shared/components-7btqt08d.js";
 import"../../../../shared/components-gvr9w41t.js";
-import"../../../../shared/components-9jvzzvt1.js";
+import"../../../../shared/components-gz8zf3ec.js";
 import"../../../../shared/components-c6s6b43g.js";
 import"../../../../shared/components-mhd39z7x.js";
 import"../../../../shared/components-rr7a6ja9.js";
@@ -13,8 +13,8 @@ import"../../../../shared/components-3ky44908.js";
 import"../../../../shared/components-zrkzcayz.js";
 import"../../../../shared/components-0q0sqfh4.js";
 import"../../../../shared/components-kvr7f9hy.js";
-import"../../../../shared/components-59efxjd9.js";
 import"../../../../shared/components-chacnk61.js";
+import"../../../../shared/components-59efxjd9.js";
 import"../../../../shared/components-hqeq3w9q.js";
 import"../../../../shared/components-jjw69c4c.js";
 import"../../../../shared/components-b2wyq2cq.js";

package/dist/components/inputs/date-time/time-picker/index.js

@@ -1,11 +1,11 @@
 import {
   TimePicker2,
   time_picker_default
-} from "../../../../shared/components-ez65vtbq.js";
-import"../../../../shared/components-q4daerx0.js";
+} from "../../../../shared/components-bshdmf75.js";
+import"../../../../shared/components-mjthm1kf.js";
 import"../../../../shared/components-7btqt08d.js";
 import"../../../../shared/components-gvr9w41t.js";
-import"../../../../shared/components-9jvzzvt1.js";
+import"../../../../shared/components-gz8zf3ec.js";
 import"../../../../shared/components-c6s6b43g.js";
 import"../../../../shared/components-mhd39z7x.js";
 import"../../../../shared/components-rr7a6ja9.js";
@@ -14,8 +14,8 @@ import"../../../../shared/components-3ky44908.js";
 import"../../../../shared/components-zrkzcayz.js";
 import"../../../../shared/components-0q0sqfh4.js";
 import"../../../../shared/components-kvr7f9hy.js";
-import"../../../../shared/components-59efxjd9.js";
 import"../../../../shared/components-chacnk61.js";
+import"../../../../shared/components-59efxjd9.js";
 import"../../../../shared/components-hqeq3w9q.js";
 import"../../../../shared/components-jjw69c4c.js";
 import"../../../../shared/components-b2wyq2cq.js";