@alexgorbatchev/shadcn 0.0.47 → 0.0.49

package/llms/components/navigation/ActionsMenu.md

@@ -0,0 +1,143 @@
+# ActionsMenu
+
+Story: @alexgorbatchev/shadcn/navigation/ActionsMenu
+Source: src/components/stories/navigation/ActionsMenu.stories.tsx
+
+[Full source and local helpers](https://github.com/alexgorbatchev/shadcn/blob/main/src/components/stories/navigation/ActionsMenu.stories.tsx)
+
+## Public imports
+
+```tsx
+import { ActionsMenu, ActionsMenuContextTarget, ActionsMenuContextContent, ActionsMenuTrigger, MenuGroup, MenuItem, MenuLinkItem, MenuLabel, MenuSeparator, MenuSub, MenuSubContent, MenuSubTrigger, Button } from "@alexgorbatchev/shadcn";
+import { Tree, TreeItem, useTree, syncDataLoaderFeature, hotkeysCoreFeature, selectionFeature } from "@alexgorbatchev/shadcn/tree";
+```
+
+## Supporting imports
+
+```tsx
+import type { ReactElement } from "react";
+```
+
+## Default component
+
+```tsx
+ActionsMenu
+```
+
+## Default args
+
+```tsx
+{
+    label: "Track actions",
+    items: (<MenuGroup>
+        <MenuItem onClick={() => fixture_menuAction("track-42")}>Inspect track</MenuItem>
+      </MenuGroup>),
+}
+```
+
+## Examples
+
+Storybook CSF excerpts. Default args and render apply unless overridden. Local helpers, fixtures, decorators, and providers may be required; these are reference excerpts, not standalone consumer modules. Interaction tests are omitted.
+
+### RegisteredTree
+
+```tsx
+{
+    render: () => <RegisteredTreeExample />
+}
+```
+
+### Dropdown
+
+```tsx
+{}
+```
+
+### BothEntryPoints
+
+```tsx
+{
+    args: { contextTarget: <section aria-label="Track"/> },
+    render: (args) => (<ActionsMenu {...args}>
+      <p>Selected track</p>
+      <ActionsMenuTrigger />
+    </ActionsMenu>)
+}
+```
+
+### NativeTableRow
+
+```tsx
+{
+    render: (args) => (<table>
+      <tbody>
+        <ActionsMenu {...args}>
+          <ActionsMenuContextTarget render={<tr ref={fixture_menuTargetRef}/>}>
+            <td>Track title</td>
+            <td>
+              <ActionsMenuTrigger />
+              <ActionsMenuContextContent />
+            </td>
+          </ActionsMenuContextTarget>
+        </ActionsMenu>
+      </tbody>
+    </table>)
+}
+```
+
+### Disabled
+
+```tsx
+{
+    args: { disabled: true, contextTarget: <section aria-label="Protected track"/> }
+}
+```
+
+### Submenu
+
+```tsx
+{
+    args: {
+        trigger: <Button variant="outline"/>,
+        contextTarget: <section aria-label="Playlist track"/>,
+        items: (<>
+        <MenuGroup>
+          <MenuLabel>Track</MenuLabel>
+          <MenuItem disabled>Unavailable action</MenuItem>
+        </MenuGroup>
+        <MenuSeparator />
+        <MenuGroup>
+          <MenuSub>
+            <MenuSubTrigger>Playlist</MenuSubTrigger>
+            <MenuSubContent>
+              <MenuGroup>
+                <MenuItem onClick={() => fixture_menuAction("playlist-7", "track-42")}>Add to favorites</MenuItem>
+              </MenuGroup>
+            </MenuSubContent>
+          </MenuSub>
+        </MenuGroup>
+      </>),
+    },
+    render: (args) => (<ActionsMenu {...args}>
+      <ActionsMenuTrigger>Track options</ActionsMenuTrigger>
+    </ActionsMenu>)
+}
+```
+
+### NativeLink
+
+```tsx
+{
+    args: {
+        size: "sm",
+        items: (<MenuGroup>
+        <MenuLinkItem href="#details" onClick={(event) => {
+                fixture_menuAction(event.currentTarget.hash);
+                event.preventDefault();
+            }}>
+          View details
+        </MenuLinkItem>
+      </MenuGroup>),
+    }
+}
+```

package/llms/components/overlays/ConfirmationDialog.md

@@ -70,8 +70,38 @@ Storybook CSF excerpts. Default args and render apply unless overridden. Local h
 {
     args: {
         onConfirm: async () => {
-            throw new Error("Could not remove image");
+            throw new Error("Private removal diagnostic");
         },
     }
 }
 ```
+
+### AuthoredFailureAndRetry
+
+```tsx
+{
+    args: {
+        onConfirm: fn(),
+        renderError: () => "The image is in use. Close the editor and retry.",
+    }
+}
+```
+
+### LongDescription
+
+```tsx
+{
+    args: { description: "Review this irreversible image removal carefully. ".repeat(300) }
+}
+```
+
+### Pending
+
+```tsx
+{
+    beforeEach: () => {
+        fixture_confirmation.pending = Promise.withResolvers<void>();
+    },
+    args: { onConfirm: fn(() => fixture_confirmation.pending.promise) }
+}
+```

package/llms/components/overlays/FormDialog.md

@@ -0,0 +1,102 @@
+# FormDialog
+
+Story: @alexgorbatchev/shadcn/components/overlays/FormDialog
+Source: src/components/stories/overlays/FormDialog.stories.tsx
+
+[Full source and local helpers](https://github.com/alexgorbatchev/shadcn/blob/main/src/components/stories/overlays/FormDialog.stories.tsx)
+
+## Public imports
+
+```tsx
+import { FormDialog, Input, Button } from "@alexgorbatchev/shadcn";
+```
+
+## Supporting imports
+
+```tsx
+import { useState, type ReactElement } from "react";
+```
+
+## Default component
+
+```tsx
+FormDialog
+```
+
+## Default args
+
+```tsx
+{
+    open: false,
+    onOpenChange: fn(),
+    title: "Edit project",
+    description: "Change the project name.",
+    submitLabel: "Save project",
+    onSubmit: fn((event) => event.preventDefault()),
+    children: <Input aria-label="Project name" defaultValue="Example"/>,
+}
+```
+
+## Default render
+
+```tsx
+function Example(args): ReactElement {
+    const [open, setOpen] = useState(false);
+    return (<>
+        <Button onClick={() => setOpen(true)}>Edit project</Button>
+        <FormDialog {...args} open={open} onOpenChange={(next) => {
+            args.onOpenChange(next);
+            setOpen(next);
+        }}/>
+      </>);
+}
+```
+
+## Examples
+
+Storybook CSF excerpts. Default args and render apply unless overridden. Local helpers, fixtures, decorators, and providers may be required; these are reference excerpts, not standalone consumer modules. Interaction tests are omitted.
+
+### Submit
+
+```tsx
+{}
+```
+
+### Busy
+
+```tsx
+{
+    args: { isBusy: true }
+}
+```
+
+### ConsentOnly
+
+```tsx
+{
+    args: {
+        onSubmit: undefined,
+        submitLabel: undefined,
+        primaryAction: <Button onClick={fixture_formDialogAction}>Review changes</Button>,
+    }
+}
+```
+
+### DoneOnly
+
+```tsx
+{
+    args: { onSubmit: undefined, submitLabel: undefined, cancelLabel: "Done" }
+}
+```
+
+### LongContent
+
+```tsx
+{
+    args: {
+        children: Array.from({ length: 60 }, (_, index) => <p key={index}>Project detail {index + 1}</p>),
+        error: "Save failed. Retry after checking the project.",
+    }
+}
+```

package/llms/setup.md

@@ -261,8 +261,10 @@ The npm package includes the same index at `llms.txt` in its root and its linked
 | Area                     | Components                                                                                                                                                                                    |
 | :----------------------- | :-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
 | Actions and status       | Alert, Badge, Button, ButtonGroup, ButtonLink, Sonner, Toast, Toggle, ToggleGroup                                                                                                             |
-| Forms and selections     | Calendar, Checkbox, Combobox, Command, Field, Input, InputGroup, InputOTP, Label, NativeSelect, Questionnaire, RadioGroup, Select, Slider, Switch, Textarea                                   |
+| Forms and selections     | AuthForm, Calendar, Checkbox, Combobox, Command, EmailCodeAuthForm, Field, Input, InputGroup, InputOTP, Label, NativeSelect, Questionnaire, RadioGroup, Select, Slider, Switch, Textarea      |
 | Structure and navigation | Accordion, AspectRatio, Avatar, Breadcrumb, Card, Carousel, Chart, Collapsible, Empty, Item, Kbd, Menubar, NavigationMenu, Pagination, Resizable, ScrollArea, Separator, Sidebar, Table, Tabs |
+| Layout and typography    | AppShell, Container, Grid, GridItem, Heading, PageHeader, Stack, Text                                                                                                                         |
+| Data display             | WeatherForecast, WeatherSummary                                                                                                                                                               |
 | Overlays                 | AlertDialog, ContextMenu, Dialog, Drawer, DropdownMenu, HoverCard, Popover, Sheet, Tooltip                                                                                                    |
 | Loading                  | Progress, Skeleton, Spinner                                                                                                                                                                   |
 | Conversations            | Attachment, Bubble, Marker, Message, MessageScroller                                                                                                                                          |
@@ -316,7 +318,7 @@ Compose data tables with the exported Table parts and `@tanstack/react-table@9.2
 
 Compose `Sidebar` and `SidebarInset` inside `SidebarProvider`. Use Header, Content, Group, Menu, and Footer parts to organize navigation, and `SidebarTrigger` or `SidebarRail` to toggle it. `useSidebar` exposes desktop and mobile state. Desktop collapse supports `offcanvas`, `icon`, and `none`; the mobile panel uses a titled Sheet with Escape dismissal and focus restoration. Menu buttons accept native custom elements through `render`; use anchors for navigation and keep their accessible text when collapsed. Cmd/Ctrl+B toggles the sidebar while focus is inside its provider. Set `open`/`onOpenChange` for controlled desktop state, or observe changes without supplying `open`. Persist changes in your application through `onOpenChange`, and restore them through `defaultOpen` or controlled `open`. Set widths through the typed `SidebarStyle` variables `--sidebar-width`, `--sidebar-width-mobile`, and `--sidebar-width-icon`. Sidebar colors follow the palette of the subtree they render in; set `--sidebar`, `--sidebar-foreground`, `--sidebar-primary`, `--sidebar-primary-foreground`, `--sidebar-accent`, `--sidebar-accent-foreground`, `--sidebar-border`, or `--sidebar-ring` to give the sidebar its own colors.
 
-`InputOTP` uses one real input for typing, selection, paste, and autofill. Compose its visual slots inside `InputOTPGroup`; supply `maxLength` and an accessible label. Use `defaultValue` to initialize an uncontrolled code, or `value` and `onChange` to control it. Changing `defaultValue` after mounting preserves the current input. Import the OTP parts together from `@alexgorbatchev/shadcn/input-otp`; its bundled implementation owns their context. `Calendar` supports single, multiple, and range selection. `ResizablePanelGroup` sizes use explicit percentage strings such as `defaultSize="50%"`; numeric sizes are pixels. `CommandDialog` supplies the modal title and description; set `Command`'s `label` to name its search input.
+`InputOTP` uses one real input for typing, selection, paste, and autofill. Compose its visual slots inside `InputOTPGroup`; supply `maxLength` and an accessible label. Use `defaultValue` to initialize an uncontrolled code, or `value` and `onChange` to control it. Changing `defaultValue` after mounting preserves the current input. Import the OTP parts together from `@alexgorbatchev/shadcn/input-otp`; its bundled implementation owns their context. `EmailCodeAuthForm` from the same entry point is passwordless sign-in in two steps: the email step calls `onRequestCode(email)`, and the code step collects a numeric code of `codeLength` digits (default 6) and calls `onVerifyCode(email, code)` when the code is complete or submitted. It offers Resend code and Use a different email, shows pending state while a handler runs, and shows a rejected handler's message without leaving the current step. `Calendar` supports single, multiple, and range selection. `ResizablePanelGroup` sizes use explicit percentage strings such as `defaultSize="50%"`; numeric sizes are pixels. `CommandDialog` supplies the modal title and description; set `Command`'s `label` to name its search input.
 
 Use the Theme toolbar to select light, dark, or system palettes; Docs and example frames follow that selection. Local and routed previews can run on separate ports with independent dependency caches. Reload an open preview after restarting it on a different port.
 
@@ -358,9 +360,69 @@ Bun 1.4.0's CSS bundler lowers logical positioning to language-based selectors.
 
 Compose `QuestionnaireItem`, `QuestionnaireTitle`, and answer controls inside `Questionnaire`, which renders a native form. `QuestionnaireChoice` supplies native radios or, with `multiple`, checkboxes; label every `QuestionnaireInput`. Read answers with `FormData.get()` or `getAll()`. `QuestionnaireProgress` and the Previous, Skip, Next, and Submit parts follow the active item. Optional steps need an answer or an explicit skip; observe `onStatusChange` to distinguish skipped answers. Letter and number shortcuts select answers without advancing. Use `item`/`onItemChange` for controlled navigation and `invalid` for external validation. Draft defaults and native reset restore initial answers and navigation. These parts accept density overrides and native render/ref props where supported. See the [upstream composition guide](https://ui.shadcn.com/docs/components/base/questionnaire).
 
+# Page layout
+
+Compose screens from layout components instead of utility classes. Each one accepts `render` for a semantic element, such as `render={<section aria-label="Members" />}`, `<ul />`, `<li />`, `<form />`, or `<main />`; props, handlers, and refs merge with the rendered element.
+
+- `Stack` arranges children along one axis. `direction` is `vertical` (default) or `horizontal`, or a breakpoint map such as `{ base: "vertical", md: "horizontal" }`. `gap` and `padding` take the density-aware spacing tokens `none`, `control`, `panel-sm`, `panel`, `field`, and `section`. `align`, `justify`, and `wrap` position children. `grow` takes the remaining space of a parent `Stack` and lets its content shrink; `height` is `auto`, `full`, `viewport`, or `min-viewport`.
+- `Grid` lays out equal columns: `columns` is 1–6 or 12, or a breakpoint map such as `{ base: 1, md: 2, xl: 4 }`. `minColumnWidth` (`xs`, `sm`, `md`, `lg`) instead fits as many columns as the grid's own width allows, so card grids adapt inside narrow panes. `GridItem span` widens a cell; `span="full"` always spans every column.
+- `Container` centers a column with a maximum `width` (`xs` 20rem, `sm` 24rem, `md` 42rem, `lg` 64rem, `xl` 80rem, or `full`).
+- `Text` renders body copy as a paragraph with semantic `size`, `tone`, `weight`, `align`, `truncate`, and `tabular` options; use `render={<span />}` for inline text. `Heading` renders `h1`–`h6` from its required `level`, with a `size` chosen independently of the outline level.
+- `ScrollArea grow` scrolls inside the remaining space of a parent `Stack`.
+
+A header row with trailing actions, a two-column form, and a centered sign-in page:
+
+```tsx
+import {
+  AuthForm,
+  Button,
+  Container,
+  Field,
+  FieldLabel,
+  Grid,
+  GridItem,
+  Heading,
+  Input,
+  Stack,
+  Textarea,
+} from "@alexgorbatchev/shadcn";
+
+<Stack direction="horizontal" justify="between" align="center" gap="control" wrap render={<header />}>
+  <Heading level={2}>Members</Heading>
+  <Button>Invite</Button>
+</Stack>;
+
+<Grid columns={{ base: 1, md: 2 }} gap="field" render={<form onSubmit={save} />}>
+  <Field>
+    <FieldLabel htmlFor="first-name">First name</FieldLabel>
+    <Input id="first-name" />
+  </Field>
+  <Field>
+    <FieldLabel htmlFor="last-name">Last name</FieldLabel>
+    <Input id="last-name" />
+  </Field>
+  <GridItem span="full">
+    <Field>
+      <FieldLabel htmlFor="notes">Notes</FieldLabel>
+      <Textarea id="notes" />
+    </Field>
+  </GridItem>
+</Grid>;
+
+<Stack height="min-viewport" align="center" justify="center" padding="panel" render={<main />}>
+  <Container width="sm">
+    <AuthForm onSubmit={signIn} />
+  </Container>
+</Stack>;
+```
+
+`AppShell` navigation items take either `href` or `render`, a router link element such as `{ id: "plans", label: "Plans", render: <Link to="/plans" />, active: true }`; the router element owns its destination and client-side navigation while the item keeps its active state, `aria-current="page"`, and activation analytics. `content="scroll"` (default) places children in a padded scrolling column; `content="fill"` gives them the remaining area without padding or scrolling, for full-height screens that manage their own scroll regions.
+
+`WeatherSummary` shows one day's forecast: a `label`, a `condition` from `clear`, `partly-cloudy`, `cloudy`, `fog`, `drizzle`, `rain`, `snow`, or `thunderstorm` with its icon, `high` and `low` temperatures in `unit` (`celsius` by default), and an optional `precipitationProbability` from 0 to 100. Values are rounded and formatted with `Intl` for `locale`; `conditionLabel` localizes the condition name. `WeatherForecast` renders several days, each with an `id`, as a list named by `label`: `variant="strip"` (default) wraps compact days side by side, and `variant="list"` shows one detailed day per row.
+
 # Inline editing and ratings
 
-`InlineEdit` mounts an edit session with a controlled `value`, `onValueChange`, `onCommit`, and `onCancel`. Mount it in place of the displayed label. Its input focuses and selects its text by default; `shouldSelectOnMount={false}` preserves the initial caret. Enter or blur commits once, Escape cancels without committing, and asynchronous saves disable the input until completion. Rejected saves display an error and allow retry.
+`InlineEdit` mounts an edit session with a controlled `value`, `onValueChange`, `onCommit`, and `onCancel`. Mount it in place of the displayed label. Its input focuses and selects its text by default; `shouldSelectOnMount={false}` preserves the initial caret. Enter or blur commits once, Escape cancels without committing, and asynchronous saves disable the input until completion. Set `hasChanges={false}` to cancel an unchanged edit before calling `onCommit`; the caller owns normalization and comparison. It defaults to true, so creation sessions can commit their initial value. Rejected saves display a generic error and allow retry; `renderError` can map the unknown failure to application-authored guidance.
 
 `VirtualTable` renders a bounded, dynamically measured set of native table rows using TanStack Virtual. Supply `items`, stable `getItemKey`, `header`, `label`, and `renderRow`; spread the supplied measurement props onto each native row. Optional `columns` accepts a `TableColumnGroup`; responsive columns keep their widths aligned with cells that share their `visibleFrom`. `maxHeight` defaults to `65vh`, `estimateRowHeight` to 80 pixels, and `overscan` to five rows. `retainedKeys` keeps editing rows mounted; the focused row is retained automatically. Filtering and selection belong to the consumer.
 
@@ -370,6 +432,10 @@ Column `meta.filter` offers a column in `DataGridFilters`, hidden columns includ
 
 Import `DataGridSelectHeader` and `DataGridSelectCell` from `@alexgorbatchev/shadcn/data-grid`. Pass the current `useTable` result as `table` to both controls, and pass `row` and an accessible `label` to each cell. The header selects selectable filtered rows across all pages and preserves selections hidden by filters. It shows a mixed state when some of those rows are selected and disables itself when none are selectable. Its default label is "Select all filtered rows"; provide `label` to name the scope in your application. Cells follow native row selection rules, including disabled rows and partially selected parents. The controls observe selection changes without requiring the parent table selector to include selection state.
 
+`ActionsMenu` shares one `items` definition between a dropdown action and an optional context menu. Supply an accessible `label`; the default trigger is a ghost icon button. `size="sm"` displays the label, and `variant`, `disabled`, and `trigger` customize the action. Supplying `contextTarget` composes the native context trigger with that element and adds its popup. Compose items with `MenuItem`, `MenuLinkItem`, checkbox/radio parts, groups, labels, separators, shortcuts, and submenu parts; dropdown and context menus share these implementations. `MenuLinkItem` retains its native anchor and menu keyboard semantics.
+
+For nested layouts, compose `ActionsMenuTrigger`, `ActionsMenuContextTarget`, and `ActionsMenuContextContent` explicitly inside `ActionsMenu`. The dropdown trigger owns its local native dropdown root and popup; the context target and content share an independent context root. A tree row can use `TreeItem render={<ActionsMenuContextTarget />}` and put the trigger in its action slot. For a table row, render the context target as the actual `tr`, then place the dropdown trigger and context content inside a `td`: native popup portals insert focus guards at their declaration, which must remain valid table children.
+
 `TreeItem linkProps` places the registered tree item, roving focus, and native drag handlers on an anchor. Pass `href` and anchor events directly, or compose a router link through `linkProps.render`. The outer `render` and `ref` remain available for row overlays; disclosure and `endEnhancer` controls remain siblings of the link. Enter and modified clicks retain native link behavior, while tree arrows retain navigation and expansion behavior. Optional `dropHint={{ content, open, side }}` displays caller-controlled drag feedback without adding a focus target.
 
 Embedded actions, links, menus, editable fields, and media controls retain their own keyboard behavior. Registered anchor and button rows still participate in tree navigation; rename and search inputs retain their completion and cancellation shortcuts.
@@ -380,9 +446,11 @@ Embedded actions, links, menus, editable fields, and media controls retain their
 
 `DialogContent size="wide"` uses a desktop maximum width of 576px; `size="narrow"` uses 192px, and the default uses 384px. Dialogs remain bounded by the viewport. `FieldGroup columns={2}` arranges fields in two columns on desktop and one on mobile.
 
+`FormDialog` supplies a controlled dialog with a fixed heading and footer around a scrolling body. Supply `open`, `onOpenChange`, `title`, and children; `description`, `size`, and `density` are optional. With `onSubmit`, the body and actions use a native form: the caller handles `preventDefault`, validation, submission, and pending state. `submitLabel` adds the stock submit button, with optional `submitVariant` and `submitDisabled`; `primaryAction` supplies a custom action instead. Without `onSubmit`, custom actions can request consent without introducing a form. Without a primary action, `cancelLabel="Done"` gives a close-only footer. `isBusy` blocks native dismissal and disables the stock actions; callers disable their own inputs and custom actions. Pass already-rendered safe guidance through `error`.
+
 `ImagePicker` displays a 256px square preview with upload and unset buttons. Supply the existing `src`, a staged `file` (`undefined` for the existing image, `null` for removal), and `onFileChange`/`onClear` callbacks. It accepts PNG, JPEG, and GIF files and releases local preview URLs when they change or unmount. The consumer owns saving and removal confirmation.
 
-`ConfirmationDialog` uses an alert dialog with Cancel and a destructive confirmation button. Supply `open`, `onOpenChange`, `title`, `description`, `confirmLabel`, and `onConfirm`. It waits for asynchronous work, keeps the dialog open on failure, and prevents cancellation while that work is pending.
+`ConfirmationDialog` uses an alert dialog with Cancel and a destructive confirmation button. Supply `open`, `onOpenChange`, `title`, `description`, `confirmLabel`, and `onConfirm`. It waits for asynchronous work, keeps the dialog open on failure, and prevents cancellation while that work is pending. Its body scrolls within the viewport while the heading and actions stay visible. Failures display generic guidance by default; `renderError` maps unknown failures to application-authored messages.
 
 # Split views
 

package/llms.txt

@@ -143,11 +143,11 @@ Generated from the public package exports and Storybook sources.
 - [NumberRollDigit](./llms/components/assistant-ui/elements/data-visualization/NumberRollDigit.md)
 - [NumberRollPart](./llms/components/assistant-ui/elements/data-visualization/NumberRollPart.md)
 - [NumberTicker](./llms/components/assistant-ui/elements/data-visualization/NumberTicker.md)
-- [RecommendationCard](./llms/components/assistant-ui/elements/data-visualization/RecommendationCard.md)
+- [RecommendationCard](./llms/components/assistant-ui/elements/data-visualization/RecommendationCard.md): RecommendationCard presents one suggestion. Each action renders only when its handler is supplied: `onReject` (`rejectLabel`, default "Not this"), `onAlternatives` (`alternativesLabel`, default "Alternatives"), and `onAccept` (`acceptLabel`, default "Accept"). The `accepted` and `rejected` states replace the actions with `acceptedLabel` or `rejectedLabel` and keep keyboard focus on the card. Omit `confidenceLabel` to hide the confidence indicator; `fullWidth` spans the container.
 - [ScoreBreakdown](./llms/components/assistant-ui/elements/data-visualization/ScoreBreakdown.md)
 - [ShareMeter](./llms/components/assistant-ui/elements/data-visualization/ShareMeter.md)
 - [SpecSheet](./llms/components/assistant-ui/elements/data-visualization/SpecSheet.md)
-- [Timeline](./llms/components/assistant-ui/elements/data-visualization/Timeline.md)
+- [Timeline](./llms/components/assistant-ui/elements/data-visualization/Timeline.md): Timeline renders events as an ordered list. Each event has an `id`, a `title`, and optional `time`, `detail`, `meta` (such as badges), `actions` (such as a menu button), and `connector`, an annotation for the segment to the next visible event, such as travel time. `when` marks past, now (announced as the current step), or future progress; omit it for neutral entries. `visibleCount` reveals only the leading events and defaults to all of them. `fullWidth` spans the container instead of the compact card width. The time column is omitted when no visible event has a time.
 - [TraceWaterfall](./llms/components/assistant-ui/elements/data-visualization/TraceWaterfall.md)
 
 ## assistant-ui/elements/media-voice
@@ -339,6 +339,7 @@ Generated from the public package exports and Storybook sources.
 - [DataGridSelectCell](./llms/components/data-display/DataGridSelectCell.md)
 - [DataGridSelectHeader](./llms/components/data-display/DataGridSelectHeader.md)
 - [DataViewer](./llms/components/data-display/DataViewer.md)
+- [Heading](./llms/components/data-display/Heading.md): Heading renders `h1`–`h6` from the required `level` so the document outline stays correct, while `size` (sm, base, lg, xl) sets the visual size independently. Sizes default by level: 1 xl, 2 lg, 3 base, 4–6 sm. `truncate` keeps one line.
 - [Item](./llms/components/data-display/Item.md)
 - [JsonRender](./llms/components/data-display/JsonRender.md)
 - [JsonViewer](./llms/components/data-display/JsonViewer.md)
@@ -348,8 +349,11 @@ Generated from the public package exports and Storybook sources.
 - [StatCard](./llms/components/data-display/StatCard.md)
 - [StatusTracker](./llms/components/data-display/StatusTracker.md)
 - [Table](./llms/components/data-display/Table.md)
+- [Text](./llms/components/data-display/Text.md): Text renders body copy as a paragraph with semantic `size` (xs, sm, base, lg), `tone` (default, muted, faint, primary, success, warning, destructive), `weight`, and `align`. `truncate` keeps one line with an ellipsis; otherwise long words wrap. `tabular` aligns digits. Use `render={<span />}` for inline text, or another element such as `<li />` or `<time />`.
 - [VirtualDataGrid](./llms/components/data-display/VirtualDataGrid.md)
 - [VirtualTable](./llms/components/data-display/VirtualTable.md)
+- [WeatherForecast](./llms/components/data-display/WeatherForecast.md): WeatherForecast renders several WeatherSummary days as a list named by `label`. Each day takes an `id` plus the WeatherSummary day fields; `unit` and `locale` apply to every day. `variant="strip"` (default) shows compact days side by side and wraps them to the available width; `variant="list"` shows one detailed day per row.
+- [WeatherSummary](./llms/components/data-display/WeatherSummary.md): WeatherSummary shows one day's forecast: a `label` such as a date, a `condition` from the closed set clear, partly-cloudy, cloudy, fog, drizzle, rain, snow, and thunderstorm with its icon, `high` and `low` temperatures in `unit` (celsius by default), and an optional `precipitationProbability` from 0 to 100. Numbers are rounded and formatted with Intl for `locale`. `conditionLabel` localizes the condition name. The icon is decorative; screen readers hear the condition, high, low, and precipitation chance. `variant="compact"` hides the condition name visually. Use `render` to choose the element, such as `<li />`.
 
 ## dates
 
@@ -380,6 +384,7 @@ Generated from the public package exports and Storybook sources.
 - [Checkbox](./llms/components/forms/Checkbox.md)
 - [ColorPicker](./llms/components/forms/ColorPicker.md)
 - [Combobox](./llms/components/forms/Combobox.md)
+- [EmailCodeAuthForm](./llms/components/forms/EmailCodeAuthForm.md): EmailCodeAuthForm is passwordless sign-in in two steps. Import it from `@alexgorbatchev/shadcn/input-otp`. The email step calls `onRequestCode(email)`; when it resolves, the code step shows an InputOTP for a numeric code of `codeLength` digits (default 6) with one-time-code autofill. Completing the code or pressing Verify calls `onVerifyCode(email, code)` once. Resend code calls `onRequestCode` again and announces the new code; Use a different email returns to the first step. Rejected promises show their message and keep the current step; buttons show pending state while a handler runs. The consumer owns sending, verifying, rate limits, and navigation after success.
 - [EventForm](./llms/components/forms/EventForm.md)
 - [Field](./llms/components/forms/Field.md)
 - [FileUpload](./llms/components/forms/FileUpload.md)
@@ -413,12 +418,15 @@ Generated from the public package exports and Storybook sources.
 - [BillingUsage](./llms/components/layout/BillingUsage.md)
 - [Card](./llms/components/layout/Card.md)
 - [Collapsible](./llms/components/layout/Collapsible.md)
+- [Container](./llms/components/layout/Container.md): Container centers a column with a maximum width: xs 20rem, sm 24rem, md 42rem, lg 64rem (default), xl 80rem, or full. `padding` uses the density-aware spacing tokens. For a centered single-column page such as sign-in, wrap it in a `Stack` with `height="min-viewport"`, `align="center"`, and `justify="center"`, and render the page landmark with `render={<main />}`.
 - [DashboardLayout](./llms/components/layout/DashboardLayout.md)
+- [Grid](./llms/components/layout/Grid.md): Grid lays out equal columns without consumer classes. `columns` is 1–6 or 12, or a viewport breakpoint map such as `{ base: 1, md: 2, xl: 4 }`. `minColumnWidth` (xs 8rem, sm 12rem, md 16rem, lg 22rem) instead fits as many columns as the grid's own width allows, which suits card grids inside panes of any size. `gap` defaults to the density-aware `panel` token. GridItem `span` (1–6 or `full`, optionally per breakpoint) widens a cell; `full` always spans every column. Both accept `render` for semantic elements such as `<ul />` and `<li />`.
 - [PageHeader](./llms/components/layout/PageHeader.md)
 - [Resizable](./llms/components/layout/Resizable.md)
 - [ScrollArea](./llms/components/layout/ScrollArea.md)
 - [Separator](./llms/components/layout/Separator.md)
 - [SplitView](./llms/components/layout/SplitView.md)
+- [Stack](./llms/components/layout/Stack.md): Stack arranges children along one axis without consumer classes. `gap` and `padding` accept the density-aware tokens none, control, panel-sm, panel, field, and section. `direction` is vertical or horizontal, or a breakpoint map such as `{ base: "vertical", md: "horizontal" }`. `align` and `justify` position children; `wrap` lets a row wrap. `grow` takes the remaining space of a parent Stack and lets content shrink, and `height` is auto, full (the parent's height), viewport, or min-viewport. Pass `render={<section />}`, `<ul />`, `<li />`, `<form />`, or `<main />` for semantic elements; props, handlers, and refs merge.
 
 ## messaging
 
@@ -431,6 +439,7 @@ Generated from the public package exports and Storybook sources.
 ## navigation
 
 - [AccountMenu](./llms/components/navigation/AccountMenu.md)
+- [ActionsMenu](./llms/components/navigation/ActionsMenu.md)
 - [Breadcrumb](./llms/components/navigation/Breadcrumb.md)
 - [Command](./llms/components/navigation/Command.md)
 - [ContextMenu](./llms/components/navigation/ContextMenu.md)
@@ -449,6 +458,7 @@ Generated from the public package exports and Storybook sources.
 - [ConfirmationDialog](./llms/components/overlays/ConfirmationDialog.md)
 - [Dialog](./llms/components/overlays/Dialog.md)
 - [Drawer](./llms/components/overlays/Drawer.md)
+- [FormDialog](./llms/components/overlays/FormDialog.md)
 - [HoverCard](./llms/components/overlays/HoverCard.md)
 - [Popover](./llms/components/overlays/Popover.md)
 - [Sheet](./llms/components/overlays/Sheet.md)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@alexgorbatchev/shadcn",
-  "version": "0.0.47",
+  "version": "0.0.49",
   "description": "Sharp, monospace React components with compact and comfortable densities.",
   "license": "MIT",
   "repository": {

package/templates/prototype/src/components/ScenarioContent.tsx

@@ -8,6 +8,7 @@ import {
   EmptyTitle,
   EmptyDescription,
   Spinner,
+  Stack,
 } from "@alexgorbatchev/shadcn";
 import type { Scenario } from "../types";
 
@@ -16,10 +17,10 @@ type ScenarioContentProps = { scenario: Scenario; children: ReactNode };
 export function ScenarioContent({ scenario, children }: ScenarioContentProps): ReactElement {
   if (scenario === "loading")
     return (
-      <div role="status" className="flex items-center gap-2">
+      <Stack role="status" direction="horizontal" align="center" gap="control">
         <Spinner />
         Loading sample data…
-      </div>
+      </Stack>
     );
   if (scenario === "error")
     return (

package/templates/prototype/src/prototypes/dashboard/components/Dashboard.tsx

@@ -10,6 +10,7 @@ import {
   Field,
   FieldGroup,
   FieldLabel,
+  Grid,
   NativeSelect,
   NativeSelectOption,
   PageHeader,
@@ -42,10 +43,10 @@ export function Dashboard({ scenario }: PrototypeProps): ReactElement {
             </NativeSelect>
           </Field>
         </FieldGroup>
-        <div className="grid gap-4 sm:grid-cols-2">
+        <Grid columns={{ base: 1, sm: 2 }} gap="panel">
           <StatCard label="Active projects" value={visible.length} />
           <StatCard label="Ready for review" value={visible.filter((delivery) => delivery.status === "Ready").length} />
-        </div>
+        </Grid>
         <Card>
           <CardHeader>
             <CardTitle>Delivery queue</CardTitle>

package/dist/chunk-4710gn6d.js

@@ -1,15 +0,0 @@
-import {
-  useAnalyticsCallback
-} from "./chunk-5mydsjp3.js";
-
-// src/components/analytics/AnalyticsLink.tsx
-import { jsx } from "react/jsx-runtime";
-function AnalyticsLink({ component, analytics, ...props }) {
-  const onClick = useAnalyticsCallback(component, analytics, { name: "ui.activate" }, props.onClick);
-  return /* @__PURE__ */ jsx("a", {
-    ...props,
-    onClick
-  });
-}
-
-export { AnalyticsLink };

package/dist/chunk-dg14mg3y.js

@@ -1,56 +0,0 @@
-import {
-  cn2
-} from "./chunk-cp2m7y7v.js";
-import {
-  take
-} from "./chunk-v8ks0cfq.js";
-import {
-  paper,
-  mono
-} from "./chunk-fgmcbtyt.js";
-
-// src/components/assistant-ui/elements/Timeline.tsx
-import { jsx, jsxs } from "react/jsx-runtime";
-function Timeline2({ events, visibleCount, className, ...props }) {
-  return /* @__PURE__ */ jsx("div", {
-    "data-testid": "Timeline",
-    "data-slot": "timeline",
-    className: cn2(cn2(paper, "flex w-full max-w-sm flex-col rounded-md p-4"), className),
-    ...props,
-    children: take(events, visibleCount).map((event, i, shown) => /* @__PURE__ */ jsxs("div", {
-      className: "fade-in slide-in-from-left-1 animate-in fill-mode-both grid grid-cols-[3.5rem_1rem_minmax(0,1fr)] gap-x-2 duration-300",
-      children: [
-        /* @__PURE__ */ jsx("span", {
-          className: cn2(mono, "text-muted-foreground pt-[3px] text-end tabular-nums"),
-          children: event.time
-        }),
-        /* @__PURE__ */ jsxs("span", {
-          className: "flex flex-col items-center",
-          children: [
-            /* @__PURE__ */ jsx("span", {
-              className: cn2("mt-1 size-2 shrink-0 rounded-full", event.when === "now" && "bg-primary ring-4 ring-primary/15 bg-primary forced-colors:bg-[Highlight]", event.when === "past" && "bg-muted-foreground forced-colors:bg-[CanvasText]", event.when === "future" && "border-muted-foreground border bg-transparent")
-            }),
-            i < shown.length - 1 && /* @__PURE__ */ jsx("span", {
-              className: cn2("w-px flex-1", event.when === "future" ? "bg-foreground/[0.08]" : "bg-foreground/15")
-            })
-          ]
-        }),
-        /* @__PURE__ */ jsxs("div", {
-          className: cn2("flex flex-col gap-0.5", i < shown.length - 1 && "pb-3"),
-          children: [
-            /* @__PURE__ */ jsx("span", {
-              className: cn2("text-base break-words", event.when === "future" ? "text-muted-foreground" : "text-foreground", event.when === "now" && "font-medium"),
-              children: event.title
-            }),
-            event.detail && /* @__PURE__ */ jsx("span", {
-              className: "text-muted-foreground text-sm leading-relaxed break-words",
-              children: event.detail
-            })
-          ]
-        })
-      ]
-    }, event.id))
-  });
-}
-
-export { Timeline2 };