@nexub/mcp 0.0.0-stage → 1.8.0

package/dist/skill/references/components/text.md

@@ -0,0 +1,45 @@
+# Text
+
+Paragraph text component with size, tone, and weight variants.
+
+- Package: `@nexub/react` · Category: Typography · Status: stable
+- Import: `import { Text } from '@nexub/react';`
+- Docs: https://nexub-ds-docs.pages.dev/components/text
+
+## Props
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `size` | `'body-lg' \| 'body' \| 'body-sm' \| 'caption' \| 'label'` | `'body'` | Controls the font size and line height. |
+| `tone` | `'default' \| 'secondary' \| 'muted' \| 'subtle' \| 'inverse'` |  | Color tone applied to the text. |
+| `weight` | `'regular' \| 'medium' \| 'semibold' \| 'bold'` |  | Font weight of the text. |
+| `truncate` | `boolean` |  | Truncates text with an ellipsis when it overflows. |
+| `lineClamp` | `number` |  | Clamps the text to a maximum number of lines. |
+| `asChild` | `boolean` |  | Merges props onto the immediate child element (Radix Slot). |
+
+## Example: Default
+
+```tsx
+<Text>The Nexub design system provides accessible, token-driven components.</Text>
+```
+
+## Example: Sizes
+
+```tsx
+<div style={{ display: 'flex', flexDirection: 'column', gap: '8px' }}>
+  <Text size="body-lg">Body large — ideal for introductory paragraphs.</Text>
+  <Text size="body">Body — the default reading size.</Text>
+  <Text size="body-sm">Body small — secondary content and descriptions.</Text>
+  <Text size="caption">Caption — metadata and timestamps.</Text>
+</div>
+```
+
+## Example: Tones
+
+```tsx
+<div style={{ display: 'flex', flexDirection: 'column', gap: '8px' }}>
+  <Text tone="default">Default tone</Text>
+  <Text tone="secondary">Secondary tone</Text>
+  <Text tone="muted">Muted tone</Text>
+</div>
+```

package/dist/skill/references/components/textarea.md

@@ -0,0 +1,40 @@
+# Textarea
+
+A multi-line text input with configurable resize behaviour, size, and validation states.
+
+- Package: `@nexub/react` · Category: Form & Input · Status: stable
+- Import: `import { Textarea } from '@nexub/react';`
+- Docs: https://nexub-ds-docs.pages.dev/components/textarea
+
+## Props
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `placeholder` | `string` |  | Placeholder text shown when the field is empty. |
+| `disabled` | `boolean` |  | Disables the textarea. |
+| `invalid` | `boolean` |  | Applies error styling to indicate a validation failure. |
+| `rows` | `number` |  | Initial visible row count. |
+| `resize` | `'none' \| 'vertical' \| 'horizontal' \| 'both'` | `'vertical'` | Controls resize handle visibility. |
+| `size` | `'sm' \| 'md' \| 'lg'` | `'md'` | Controls font size and padding. |
+
+## Example: Default
+
+```tsx
+<Textarea placeholder="Enter your message…" />
+```
+
+## Example: Sizes
+
+```tsx
+<div style={{ display: 'flex', flexDirection: 'column', gap: '12px' }}>
+  <Textarea size="sm" placeholder="Small textarea" />
+  <Textarea size="md" placeholder="Medium textarea" />
+  <Textarea size="lg" placeholder="Large textarea" />
+</div>
+```
+
+## Example: Invalid
+
+```tsx
+<Textarea invalid placeholder="This field has an error" />
+```

package/dist/skill/references/components/thinking-indicator.md

@@ -0,0 +1,50 @@
+# Thinking Indicator
+
+Shows the assistant is working before the first token arrives: a morphing shape and a shimmering label.
+
+- Package: `@nexub/react` · Category: AI · Status: beta
+- Import: `import { ThinkingIndicator } from '@nexub/react';`
+- Docs: https://nexub-ds-docs.pages.dev/components/thinking-indicator
+
+## When to use
+
+- The gap between sending a prompt and the first token of the reply.
+- Tool calls or retrieval steps inside a reply, with a label naming the step.
+
+## When not to use
+
+- Once text is streaming: StreamingText’s caret already shows progress. Replace the indicator, don’t stack them.
+- General loading outside AI surfaces: use Spinner or Skeleton.
+
+## Props
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `label` | `ReactNode \| null` | `messages.thinking ('Thinking')` | Visible text. `null` hides it; "Thinking" is still announced. |
+| `size` | `'sm' \| 'md'` | `'md'` | Shape and text size. |
+| `messages` | `Partial<{ thinking: string }>` |  | Local override for the default text. |
+
+## Example: Default
+
+```tsx
+<ThinkingIndicator />
+```
+
+## Example: Custom label and sizes
+
+Name the step when you know it. `label={null}` keeps only the shape.
+
+```tsx
+<ThinkingIndicator label="Searching 4 sources" />
+<ThinkingIndicator size="sm" />
+<ThinkingIndicator size="sm" label={null} />
+```
+
+## Accessibility
+
+- Roles: status
+- A polite live region: the label is announced once when it mounts. Changing the label announces the new step.
+- Render it only while waiting and remove it when tokens start, so it is not announced again.
+- With reduced motion the shape and shimmer are static.
+
+Related: [streaming-text](streaming-text.md), [spinner](spinner.md), [conversation](conversation.md)

package/dist/skill/references/components/toast.md

@@ -0,0 +1,141 @@
+# Toast
+
+Imperative toast notifications using the toast object. Render <Toaster /> once in your layout.
+
+- Package: `@nexub/react` · Category: Feedback · Status: stable
+- Import: `import { Toast } from '@nexub/react';`
+- Docs: https://nexub-ds-docs.pages.dev/components/toast
+
+## When to use
+
+- Confirming a non-blocking action (file saved, message sent)
+- Reporting a background event the user should know about
+- Providing brief feedback that disappears automatically
+- Offering an undo action immediately after a destructive operation
+
+## When not to use
+
+- Critical errors that block the user — use Alert or AlertDialog
+- Information the user must read and acknowledge — use Dialog
+- Persistent status that should remain visible — use Banner or Alert
+- Long messages with multiple lines of text
+
+## Props
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `Toaster expand` | `boolean` | `false` | Always show toasts as a list. By default they collapse into a stack that fans out on hover or focus, which also pauses their timers. |
+| `Toaster visibleToasts` | `number` | `3` | How many toasts show at once. Older ones are hidden visually but stay in the live region. |
+| `toast.success(title, opts?)` (required) | `string` |  | Show a success toast with an optional options object. |
+| `toast.error(title, opts?)` (required) | `string` |  | Show an error toast. |
+| `toast.warning(title, opts?)` (required) | `string` |  | Show a warning toast. |
+| `toast.info(title, opts?)` (required) | `string` |  | Show an info toast. |
+| `toast.custom(title, opts?)` (required) | `string` |  | Show a default/custom toast. |
+| `toast.undoable(title, opts)` (required) | `UndoableToastOptions` |  | A toast with an Undo action (beta, 1.7.0). Undo calls `opts.onUndo`; any other close (timer, swipe, close button, `toast.dismiss`) calls `opts.onCommit`, exactly once. Returns the toast id. |
+| `undoable opts` | `{ onUndo; onCommit?; undoLabel?; description?; duration? }` |  | `undoLabel` defaults to the `undo` message ("Undo"). Commit the change in `onCommit`, not before showing the toast. |
+| `opts.description` | `string` |  | Secondary supporting text below the title. |
+| `opts.duration` | `number` | `5000` | Time in ms before auto-dismiss. Use Infinity to persist. |
+| `opts.action` | `{ label: string; onClick: () => void }` |  | Renders an action button inside the toast. |
+
+## Example: Default
+
+```tsx
+function DefaultToast() {
+  return (
+    <>
+      <Toaster />
+      <Button
+        variant="outline"
+        onClick={() => toast.custom('Changes saved', { description: 'Your profile has been updated.' })}
+      >
+        Show toast
+      </Button>
+    </>
+  );
+}
+```
+
+## Example: Variants
+
+```tsx
+function ToastVariants() {
+  return (
+    <>
+      <Toaster />
+      <div style={{ display: 'flex', gap: '8px', flexWrap: 'wrap' }}>
+        <Button variant="outline" onClick={() => toast.custom('Default notification')}>
+          Default
+        </Button>
+        <Button variant="outline" onClick={() => toast.success('Saved successfully')}>
+          Success
+        </Button>
+        <Button variant="outline" onClick={() => toast.error('Something went wrong')}>
+          Error
+        </Button>
+        <Button variant="outline" onClick={() => toast.warning('Proceed with caution')}>
+          Warning
+        </Button>
+        <Button variant="outline" onClick={() => toast.info('New update available')}>
+          Info
+        </Button>
+      </div>
+    </>
+  );
+}
+```
+
+## Example: With action
+
+```tsx
+function ToastWithAction() {
+  return (
+    <>
+      <Toaster />
+      <Button
+        variant="outline"
+        onClick={() =>
+          toast.custom('Message sent', {
+            description: 'Your message has been delivered to the team.',
+            action: {
+              label: 'Undo',
+              onClick: () => {},
+            },
+          })
+        }
+      >
+        Send message
+      </Button>
+    </>
+  );
+}
+```
+
+## Example: Undoable delete
+
+Hide the item right away; delete it for real only when the toast closes without Undo.
+
+```tsx
+function UndoableDelete() {
+  const [hidden, setHidden] = React.useState(false);
+
+  function remove() {
+    setHidden(true);
+    toast.undoable('Invoice deleted', {
+      description: 'INV-2041',
+      onUndo: () => setHidden(false),
+      onCommit: () => deleteInvoice('INV-2041'),
+    });
+  }
+
+  return (
+    <>
+      <Toaster />
+      {hidden ? (
+        <Button variant="text" onClick={() => setHidden(false)}>Restore demo</Button>
+      ) : (
+        <Button variant="outline" tone="danger" onClick={remove}>Delete INV-2041</Button>
+      )}
+    </>
+  );
+}
+```

package/dist/skill/references/components/toggle-group.md

@@ -0,0 +1,35 @@
+# Toggle Group
+
+Group of toggle buttons where one or many can be active.
+
+- Package: `@nexub/react` · Category: Interactive · Status: stable
+- Import: `import { ToggleGroup } from '@nexub/react';`
+- Docs: https://nexub-ds-docs.pages.dev/components/toggle-group
+
+## Props
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `type` (required) | `'single' \| 'multiple'` |  | Controls whether one or multiple items can be active at a time. |
+| `value` | `string \| string[]` |  | The controlled active value(s). |
+| `variant` | `'default' \| 'outline'` |  | Visual style applied to all toggle items in the group. |
+
+## Example: Single
+
+```tsx
+<ToggleGroup.Root type="single" defaultValue="left">
+  <ToggleGroup.Item value="left">Left</ToggleGroup.Item>
+  <ToggleGroup.Item value="center">Center</ToggleGroup.Item>
+  <ToggleGroup.Item value="right">Right</ToggleGroup.Item>
+</ToggleGroup.Root>
+```
+
+## Example: Multiple
+
+```tsx
+<ToggleGroup.Root type="multiple" defaultValue={["bold", "italic"]}>
+  <ToggleGroup.Item value="bold">Bold</ToggleGroup.Item>
+  <ToggleGroup.Item value="italic">Italic</ToggleGroup.Item>
+  <ToggleGroup.Item value="underline">Underline</ToggleGroup.Item>
+</ToggleGroup.Root>
+```

package/dist/skill/references/components/toggle.md

@@ -0,0 +1,32 @@
+# Toggle
+
+Pressable toggle button built on Radix UI Toggle.
+
+- Package: `@nexub/react` · Category: Interactive · Status: stable
+- Import: `import { Toggle } from '@nexub/react';`
+- Docs: https://nexub-ds-docs.pages.dev/components/toggle
+
+## Props
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `pressed` | `boolean` |  | The controlled pressed state. |
+| `defaultPressed` | `boolean` |  | The initial pressed state when uncontrolled. |
+| `variant` | `'default' \| 'outline'` |  | Visual style of the toggle button. |
+| `size` | `'sm' \| 'md' \| 'lg'` |  | Size of the toggle button. |
+| `disabled` | `boolean` |  | Disables the toggle when true. |
+
+## Example: Default
+
+```tsx
+<Toggle>Bold</Toggle>
+```
+
+## Example: Outline variants
+
+```tsx
+<div style={{ display: 'flex', gap: '8px' }}>
+  <Toggle variant="outline">Unpressed</Toggle>
+  <Toggle variant="outline" defaultPressed>Pressed</Toggle>
+</div>
+```

package/dist/skill/references/components/tooltip.md

@@ -0,0 +1,34 @@
+# Tooltip
+
+Floating label that appears on hover. Built on Radix UI Tooltip.
+
+- Package: `@nexub/react` · Category: Overlays · Status: stable
+- Import: `import { Tooltip } from '@nexub/react';`
+- Docs: https://nexub-ds-docs.pages.dev/components/tooltip
+
+## Props
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `content` (required) | `React.ReactNode` |  | Content shown inside the tooltip. |
+| `side` | `'top' \| 'right' \| 'bottom' \| 'left'` | `'top'` | Preferred side to open. |
+| `delayDuration` | `number` | `700` | Delay in ms before tooltip opens. |
+
+## Example: Default
+
+```tsx
+<Tooltip content="This is a tooltip">
+  <Button variant="outline">Hover me</Button>
+</Tooltip>
+```
+
+## Example: Sides
+
+```tsx
+<div style={{ display: 'flex', gap: '12px' }}>
+  <Tooltip content="Top" side="top"><Button size="sm">Top</Button></Tooltip>
+  <Tooltip content="Right" side="right"><Button size="sm">Right</Button></Tooltip>
+  <Tooltip content="Bottom" side="bottom"><Button size="sm">Bottom</Button></Tooltip>
+  <Tooltip content="Left" side="left"><Button size="sm">Left</Button></Tooltip>
+</div>
+```

package/dist/skill/references/components/user-card.md

@@ -0,0 +1,27 @@
+# UserCard
+
+User profile card displaying avatar, name, role, and optional actions.
+
+- Package: `@nexub/patterns` · Category: People · Status: stable
+- Import: `import { UserCard } from '@nexub/patterns';`
+- Docs: https://nexub-ds-docs.pages.dev/patterns/user-card
+
+## Props
+
+| Prop | Type | Default | Description |
+| --- | --- | --- | --- |
+| `name` (required) | `string` |  | User display name. |
+| `email` | `string` |  | User email address. |
+| `role` | `string` |  | Job title or role label. |
+| `avatar` | `string` |  | URL for avatar image. |
+| `actions` | `React.ReactNode` |  | Action buttons or menu. |
+
+## Example: Default
+
+```tsx
+<UserCard
+  name="Alex Morgan"
+  email="alex@nexub.io"
+  role="Design Lead"
+/>
+```

package/dist/skill/references/components.md

@@ -0,0 +1,192 @@
+# Component index
+
+Nexub DS v1.8.0. Open `components/<slug>.md` for props, examples and accessibility notes.
+Never use a component marked deprecated.
+
+## Components — Actions
+
+- [Button](components/button.md) `@nexub/react`: Triggers an action or event. Supports multiple variants, sizes, and semantic tones.
+- [Button Group](components/button-group.md) `@nexub/react`: Groups related buttons together with optional attachment and orientation.
+- [Icon Button](components/icon-button.md) `@nexub/react`: A square button designed to hold a single icon, with an accessible label.
+- [Split Button](components/split-button.md) `@nexub/react`: A primary action with related secondary actions behind a chevron, as one connected control.
+
+## Components — AI
+
+- [Citation](components/citation.md) `@nexub/react`: Numbered source markers for running text, with a hover preview, plus SourceChip and SourceList for the sources under a reply.
+- [Message Bubble](components/message-bubble.md) `@nexub/react`: One message in a conversation. User messages sit in a bubble at the end; assistant replies run full width. MessageActions adds copy, feedback and regenerate.
+- [Prompt Input](components/prompt-input.md) `@nexub/react`: The composer for a chat: an auto-growing text field with Send, which turns into Stop while a reply streams.
+- [Streaming Text](components/streaming-text.md) `@nexub/react`: Assistant text as it arrives: new chunks fade in, text already shown stays still, and a caret marks the end.
+- [Thinking Indicator](components/thinking-indicator.md) `@nexub/react`: Shows the assistant is working before the first token arrives: a morphing shape and a shimmering label.
+
+## Components — Avatar
+
+- [Avatar](components/avatar.md) `@nexub/react`: Displays a user's profile picture with initials fallback.
+- [Avatar Group](components/avatar-group.md) `@nexub/react`: Stacked group of avatars with overflow count.
+
+## Components — Data Display
+
+- [Amount](components/amount.md) `@nexub/react`: Honest money: Intl formatting, tabular numerals, the currency’s minor unit and a true minus sign.
+- [Data Table](components/data-table.md) `@nexub/react`: Feature-rich data table with sorting and row selection powered by TanStack Table.
+- [Empty State](components/empty-state.md) `@nexub/react`: Placeholder UI shown when a list or page has no content.
+- [Error State](components/error-state.md) `@nexub/react`: Full-page or section error view with retry action.
+- [Number Ticker](components/number-ticker.md) `@nexub/react`: A number whose digits roll to new values on the spatial spring. The first render never animates.
+- [Table](components/table.md) `@nexub/react`: Semantic HTML table with styled variants.
+
+## Components — Disclosure
+
+- [Accordion](components/accordion.md) `@nexub/react`: Vertically stacked list of collapsible sections.
+- [Collapsible](components/collapsible.md) `@nexub/react`: Toggle visibility of content with smooth animation.
+- [Scroll Area](components/scroll-area.md) `@nexub/react`: Scrollable container with custom styled scrollbars.
+
+## Components — Dividers
+
+- [Gradient Divider](components/gradient-divider.md) `@nexub/react`: A decorative gradient-faded horizontal rule.
+- [Separator](components/separator.md) `@nexub/react`: A horizontal or vertical visual divider.
+
+## Components — Feedback
+
+- [Alert](components/alert.md) `@nexub/react`: Inline contextual message with optional title, icon, and dismiss action.
+- [Banner](components/banner.md) `@nexub/react` **(deprecated)**: Deprecated — use Alert. Full-width announcement banner, typically used at the top of a page.
+- [Callout](components/callout.md) `@nexub/react` **(deprecated)**: Deprecated — use Alert. Highlighted content block for tips, warnings, or notes.
+- [Spinner](components/spinner.md) `@nexub/react`: Animated loading indicator. Inherits color from context.
+- [Toast](components/toast.md) `@nexub/react`: Imperative toast notifications using the toast object. Render <Toaster /> once in your layout.
+
+## Components — Form & Input
+
+- [Date Picker](components/date-picker.md) `@nexub/react`: Calendar date picker with text input.
+- [Date Range Picker](components/date-range-picker.md) `@nexub/react`: Dual-calendar date range selector.
+- [Form Field](components/form-field.md) `@nexub/react`: Wraps Label, Input, HelperText and FormError into a single accessible group.
+- [Helper Text](components/helper-text.md) `@nexub/react`: Small supporting text placed beneath a form field to provide hints or validation feedback.
+- [Input](components/input.md) `@nexub/react`: Text input field for forms. Supports size variants, icons, addons, and validation states.
+- [Label](components/label.md) `@nexub/react`: An accessible form label that optionally shows a required asterisk and links to an input via htmlFor.
+- [Money Input](components/money-input.md) `@nexub/react`: An amount field: locale-aware parsing as you type, grouped on blur, the currency symbol leading.
+- [Number Input](components/number-input.md) `@nexub/react`: A numeric input with increment and decrement controls, supporting min/max clamping and step.
+- [Password Input](components/password-input.md) `@nexub/react`: A password field with a built-in toggle to reveal or hide the entered value.
+- [Search Input](components/search-input.md) `@nexub/react`: A text input pre-wired with a search icon and a clear button for filtering content.
+- [Textarea](components/textarea.md) `@nexub/react`: A multi-line text input with configurable resize behaviour, size, and validation states.
+
+## Components — Form Controls
+
+- [Autocomplete](components/autocomplete.md) `@nexub/react`: Type-to-search input with matching options dropdown.
+- [Checkbox](components/checkbox.md) `@nexub/react`: Binary checkbox input built on Radix UI.
+- [Checkbox Card](components/checkbox-card.md) `@nexub/react`: A checkbox drawn as a whole card: title, description and optional icon. Pick any number.
+- [Combobox](components/combobox.md) `@nexub/react`: Command-palette style searchable dropdown built on cmdk.
+- [Radio Card](components/radio-card.md) `@nexub/react`: A radio group where each option is a whole card: title, description and optional icon, one choice.
+- [Radio Group](components/radio-group.md) `@nexub/react`: Group of mutually exclusive radio inputs.
+- [Select](components/select.md) `@nexub/react`: Accessible dropdown select built on Radix UI. Supports groups and search.
+- [Switch](components/switch.md) `@nexub/react`: Toggle control for binary on/off settings. Built on Radix UI Switch.
+
+## Components — Inline Primitives
+
+- [Code](components/code-inline.md) `@nexub/react`: Inline code span for technical terms and short code snippets.
+- [Kbd](components/kbd.md) `@nexub/react`: Keyboard key display — renders a styled <kbd> element.
+- [Link](components/link.md) `@nexub/react`: Styled anchor link with variant and external support.
+- [Text Gradient](components/text-gradient.md) `@nexub/react`: Renders text with a brand gradient fill.
+
+## Components — Interactive
+
+- [Rating](components/rating.md) `@nexub/react`: Star rating input, supports controlled and read-only modes.
+- [Segmented Control](components/segmented-control.md) `@nexub/react`: Tab-style control for mutually exclusive selections.
+- [Slider](components/slider.md) `@nexub/react`: Range slider built on Radix UI Slider.
+- [Toggle](components/toggle.md) `@nexub/react`: Pressable toggle button built on Radix UI Toggle.
+- [Toggle Group](components/toggle-group.md) `@nexub/react`: Group of toggle buttons where one or many can be active.
+
+## Components — Labels & Badges
+
+- [Badge](components/badge.md) `@nexub/react`: Small status indicator or label. Communicates state, category, or count.
+- [Chip](components/chip.md) `@nexub/react`: Compact label chip, optionally dismissible.
+- [Eyebrow Chip](components/eyebrow-chip.md) `@nexub/react`: A compact eyebrow label, typically used above headings.
+- [Filter Chip](components/filter-chip.md) `@nexub/react`: Interactive chip for filtering, supports selected/unselected state.
+- [Status Pill](components/status-pill.md) `@nexub/react` **(deprecated)**: Deprecated — use Badge. A pill indicator for status values like active, pending, error.
+- [Tag](components/tag.md) `@nexub/react` **(deprecated)**: Deprecated — use Badge. Non-interactive label tag for categorisation.
+
+## Components — Layout
+
+- [Box](components/box.md) `@nexub/react`: Generic container primitive with style token props.
+- [Card](components/card.md) `@nexub/react`: Surface container for grouping related content. Supports flat, surface, and interactive variants.
+- [Flex](components/flex.md) `@nexub/react`: Flexbox layout primitive.
+- [Grid](components/grid.md) `@nexub/react`: CSS Grid layout primitive.
+- [Media Card](components/media-card.md) `@nexub/react`: An image card with a glass caption over a soft scrim. With `href`, the whole card is one link.
+- [Stack](components/stack.md) `@nexub/react`: Vertical stack layout with configurable gap.
+
+## Components — Loading States
+
+- [Progress](components/progress.md) `@nexub/react`: Horizontal progress bar with optional tone and animation.
+- [Skeleton](components/skeleton.md) `@nexub/react`: Placeholder loading animation that mimics content layout.
+
+## Components — Motion
+
+- [Collapse](components/motion-collapse.md) `@nexub/react`: Expands and collapses content along the block axis.
+- [Fade](components/motion-fade.md) `@nexub/react`: Animates opacity between 0 and 1 based on the `in` prop.
+- [Scale](components/motion-scale.md) `@nexub/react`: Scales content in/out from its center.
+- [Slide](components/motion-slide.md) `@nexub/react`: Slides content in from a direction based on the `in` prop.
+
+## Components — Navigation
+
+- [Breadcrumb](components/breadcrumb.md) `@nexub/react`: Hierarchical navigation trail showing page location.
+- [Navigation Rail](components/navigation-rail.md) `@nexub/react`: Navigation for medium-width windows: icons over labels, with an active pill behind the icon.
+- [Pagination](components/pagination.md) `@nexub/react`: Page navigation control with prev/next and page number buttons.
+- [Tabs](components/tabs.md) `@nexub/react`: Layered content panels switched by tab triggers. Built on Radix UI Tabs.
+
+## Components — Overlays
+
+- [Alert Dialog](components/alert-dialog.md) `@nexub/react`: Confirmation dialog that requires an explicit user action before proceeding.
+- [Dialog](components/dialog.md) `@nexub/react`: Modal dialog built on Radix UI. Fully accessible with focus trapping and ARIA roles.
+- [Drawer](components/drawer.md) `@nexub/react`: Slide-in panel from any edge of the screen.
+- [Hover Card](components/hover-card.md) `@nexub/react`: Rich tooltip card revealed on hover.
+- [Popover](components/popover.md) `@nexub/react`: Floating content panel anchored to a trigger element.
+- [Sheet](components/sheet.md) `@nexub/react`: Alias for Drawer — slide-in sheet panel.
+- [Tooltip](components/tooltip.md) `@nexub/react`: Floating label that appears on hover. Built on Radix UI Tooltip.
+
+## Components — Typography
+
+- [Heading](components/heading.md) `@nexub/react`: Semantic heading component with size, weight, and tone control.
+- [Text](components/text.md) `@nexub/react`: Paragraph text component with size, tone, and weight variants.
+
+## Patterns — AI
+
+- [Conversation](components/conversation.md) `@nexub/patterns`: Chat layout: a scrolling message list that follows new content, with a sticky composer underneath.
+
+## Patterns — Auth
+
+- [AuthCard](components/auth-card.md) `@nexub/patterns`: Authentication layout pattern. Wraps sign-in, sign-up, and reset flows in a centered card.
+
+## Patterns — Data
+
+- [ActivityFeed](components/activity-feed.md) `@nexub/patterns`: Chronological list of activity events with avatar, description, and timestamp.
+- [FilterBar](components/filter-bar.md) `@nexub/patterns`: Search + filter toolbar pattern for data-heavy list or table views.
+- [InfoList](components/info-list.md) `@nexub/patterns`: Key–value list for displaying structured metadata or details.
+- [StatCard](components/stat-card.md) `@nexub/patterns`: Metric display card showing a KPI value, label, optional delta, and icon.
+
+## Patterns — Feedback
+
+- [NotificationItem](components/notification-item.md) `@nexub/patterns`: Single notification row for notification panels or dropdowns.
+
+## Patterns — Forms
+
+- [Error Summary](components/error-summary.md) `@nexub/patterns`: Lists a form’s errors after a failed submit, with a link to each field. useFormErrors wires the fields to their messages.
+
+## Patterns — Layout
+
+- [Bento Grid](components/bento-grid.md) `@nexub/patterns`: A grid of card tiles in mixed sizes. Responds to its own width: 1 column, 2 at 480px, 4 at 768px.
+- [List Detail](components/list-detail.md) `@nexub/patterns`: The list-detail layout: side by side at 720px+ of its own width (a container query), one pane at a time below.
+- [SettingsSection](components/settings-section.md) `@nexub/patterns`: Grouped settings panel with title, description, and action area.
+
+## Patterns — Marketing
+
+- [PlanCard](components/plan-card.md) `@nexub/patterns`: Pricing plan card with feature checklist, badge, and CTA button.
+
+## Patterns — Navigation
+
+- [StepIndicator](components/step-indicator.md) `@nexub/patterns`: Visual progress indicator for multi-step flows like onboarding or checkout.
+
+## Patterns — People
+
+- [UserCard](components/user-card.md) `@nexub/patterns`: User profile card displaying avatar, name, role, and optional actions.
+
+## Exported without a reference page
+
+These exist; read their TypeScript props in `node_modules/<package>/dist/index.d.ts`.
+
+- `@nexub/react`: AppShell, AspectRatio, CheckList, Code, CommandPalette, Container, ContextMenu, CountryBadge, DropdownMenu, FileUpload, Flag, FormError, KeyboardShortcut, Logo, Menubar, Motion, NavigationMenu, NexubProvider, PageHeader, Section, Sidebar, ThemeProvider, Toolbar, TopNav, VisuallyHidden
+- `@nexub/patterns`: AppHeader, AppLauncher, SettingsLayout