@alexgorbatchev/shadcn 0.0.19 → 0.0.20

package/llms/components/assistant-ui/elements/data-visualization/ComparisonCard.md

@@ -0,0 +1,58 @@
+# ComparisonCard
+
+Story: @alexgorbatchev/shadcn/components/assistant-ui/elements/data-visualization/ComparisonCard
+Source: src/components/stories/assistant-ui/elements/data-visualization/ComparisonCard.stories.tsx
+
+[Full source and local helpers](https://github.com/alexgorbatchev/shadcn/blob/main/src/components/stories/assistant-ui/elements/data-visualization/ComparisonCard.stories.tsx)
+
+## Public imports
+
+```tsx
+import { ComparisonCard } from "@alexgorbatchev/shadcn/assistant-ui";
+```
+
+## Default component
+
+```tsx
+ComparisonCard
+```
+
+## Default args
+
+```tsx
+{
+    traitLabels: ["Speed", "Offline"],
+    options: [
+        { id: "fast", name: "Fast", headline: "Low latency", traits: ["Quick", false] },
+        { id: "local", name: "Local", headline: "Runs on device", traits: ["Steady", "Available"] },
+    ],
+    recommendedId: "local",
+    reason: "Choose local when working offline.",
+}
+```
+
+## 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.
+
+### Recommendation
+
+```tsx
+{}
+```
+
+### NoRecommendation
+
+```tsx
+{
+    args: { recommendedId: "" }
+}
+```
+
+### Empty
+
+```tsx
+{
+    args: { options: [], reason: "No options available" }
+}
+```

package/llms/components/assistant-ui/elements/data-visualization/CostMeter.md

@@ -0,0 +1,49 @@
+# CostMeter
+
+Story: @alexgorbatchev/shadcn/components/assistant-ui/elements/data-visualization/CostMeter
+Source: src/components/stories/assistant-ui/elements/data-visualization/CostMeter.stories.tsx
+
+[Full source and local helpers](https://github.com/alexgorbatchev/shadcn/blob/main/src/components/stories/assistant-ui/elements/data-visualization/CostMeter.stories.tsx)
+
+## Public imports
+
+```tsx
+import { CostMeter } from "@alexgorbatchev/shadcn/assistant-ui";
+```
+
+## Default component
+
+```tsx
+CostMeter
+```
+
+## Default args
+
+```tsx
+{
+    runCost: "$0.04",
+    sessionCost: "$0.12",
+    lines: [
+        { model: "Planner", inputTokens: 1500, outputTokens: 500, cost: "$0.03", share: 0.75 },
+        { model: "Reviewer", inputTokens: 400, outputTokens: 100, cost: "$0.01", share: 0.25 },
+    ],
+}
+```
+
+## 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.
+
+### Breakdown
+
+```tsx
+{}
+```
+
+### Empty
+
+```tsx
+{
+    args: { runCost: "$0.00", sessionCost: "$0.00", lines: [] }
+}
+```

package/llms/components/assistant-ui/elements/data-visualization/DataTable.md

@@ -0,0 +1,240 @@
+# DataTable
+
+Story: @alexgorbatchev/shadcn/components/assistant-ui/elements/data-visualization/DataTable
+Source: src/components/stories/assistant-ui/elements/data-visualization/DataTable.stories.tsx
+
+[Full source and local helpers](https://github.com/alexgorbatchev/shadcn/blob/main/src/components/stories/assistant-ui/elements/data-visualization/DataTable.stories.tsx)
+
+## Public imports
+
+```tsx
+import { DataTable } from "@alexgorbatchev/shadcn/assistant-ui";
+```
+
+## Default component
+
+```tsx
+DataTable
+```
+
+## Default args
+
+```tsx
+{
+    caption: "Project activity",
+    rowKey: "id",
+    columns: [
+        { key: "name", label: "Name", priority: "primary" },
+        { key: "count", label: "Count", format: { kind: "number", decimals: 0 } },
+    ],
+    rows: [
+        { id: "b", name: "Bravo", count: 4 },
+        { id: "a", name: "Alpha", count: 12 },
+        { id: "c", name: "Charlie", count: null },
+    ],
+    onSortChange: fn(),
+}
+```
+
+## 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.
+
+### Sort
+
+```tsx
+{}
+```
+
+### Formats
+
+```tsx
+{
+    args: {
+        caption: "Formatted values",
+        columns: [
+            { key: "price", label: "Price", format: { kind: "currency", currency: "USD", decimals: 2 } },
+            { key: "ratio", label: "Ratio", format: { kind: "percent", decimals: 0 } },
+            { key: "change", label: "Change", format: { kind: "delta", unit: "ms", upIsGood: false } },
+            { key: "enabled", label: "Enabled", format: { kind: "boolean", trueLabel: "On", falseLabel: "Off" } },
+            { key: "status", label: "Status", format: { kind: "badge", tones: { Ready: "success" } } },
+            { key: "tags", label: "Tags", format: { kind: "list", max: 1 } },
+        ],
+        rows: [{ price: 12.5, ratio: 0.25, change: -5, enabled: true, status: "Ready", tags: ["UI", "API"] }],
+    }
+}
+```
+
+### LinksAndDates
+
+```tsx
+{
+    args: {
+        relativeTo: Date.parse("2026-10-20T12:00:00Z"),
+        columns: [
+            { key: "name", label: "Documentation", format: { kind: "link", hrefKey: "url" } },
+            { key: "date", label: "Date", format: { kind: "date", style: "relative" } },
+        ],
+        rows: [
+            { name: "Guide", url: "https://example.com/guide", date: "2026-10-19T12:00:00Z" },
+            { name: "Unsafe source", url: "javascript:alert(1)", date: "invalid" },
+        ],
+    }
+}
+```
+
+### Mobile
+
+```tsx
+{
+    decorators: [
+        (Story) => (<div className="w-80">
+        <Story />
+      </div>),
+    ]
+}
+```
+
+### Empty
+
+```tsx
+{
+    args: { rows: [], emptyMessage: "No activity yet" }
+}
+```
+
+### NumericFallbacks
+
+```tsx
+{
+    args: {
+        caption: "Unexpected numeric input",
+        columns: [
+            { key: "number", label: "Number", format: { kind: "number", compact: true, unit: "kg" } },
+            { key: "currency", label: "Currency", format: { kind: "currency", currency: "?" } },
+            { key: "percent", label: "Percent", format: { kind: "percent", basis: "unit" } },
+            { key: "delta", label: "Delta", format: { kind: "delta" } },
+        ],
+        rows: [
+            { number: "unknown mass", currency: "pending invoice", percent: "pending ratio", delta: "pending change" },
+            { number: 1200, currency: 20, percent: 25, delta: 0 },
+            { number: 2, currency: 12, percent: 100, delta: 4 },
+        ],
+    }
+}
+```
+
+### DefaultBooleanAndBadgeLabels
+
+```tsx
+{
+    args: {
+        columns: [
+            { key: "enabled", label: "Enabled", format: { kind: "boolean" } },
+            { key: "status", label: "Status", format: { kind: "badge", tones: { Failed: "danger", Caution: "warning" } } },
+            { key: "tags", label: "Tags", format: { kind: "list" } },
+        ],
+        rows: [
+            { enabled: true, status: "Failed", tags: ["One", "Two"] },
+            { enabled: false, status: "Caution", tags: [] },
+            { enabled: "Unknown", status: "Pending", tags: "Unclassified" },
+        ],
+    }
+}
+```
+
+### LocalLinksAndCalendarDates
+
+```tsx
+{
+    args: {
+        locale: "en-US",
+        columns: [
+            { key: "link", label: "Link", format: { kind: "link" } },
+            { key: "date", label: "Date", format: { kind: "date" } },
+        ],
+        rows: [
+            { link: "/guide", date: "2024-02-29" },
+            { link: 123, date: "2023-02-29" },
+        ],
+    }
+}
+```
+
+### StableDefaultSort
+
+```tsx
+{
+    args: {
+        defaultSort: { key: "count", direction: "asc" },
+        columns: [
+            { key: "name", label: "Name", sortable: false, width: "50%", align: "start" },
+            { key: "count", label: "Count" },
+        ],
+        rows: [
+            { name: "First", count: 2 },
+            { name: "Second", count: 2 },
+            { name: "Missing", count: null },
+        ],
+    }
+}
+```
+
+### ControlledSort
+
+```tsx
+{
+    args: { sort: { key: "count", direction: "desc" } }
+}
+```
+
+### EmptyMobile
+
+```tsx
+{
+    decorators: [
+        (Story) => (<div className="w-80">
+        <Story />
+      </div>),
+    ],
+    args: { rows: [] }
+}
+```
+
+### SingleColumn
+
+```tsx
+{
+    decorators: [
+        (Story) => (<div className="w-80">
+        <Story />
+      </div>),
+    ],
+    args: { columns: [{ key: "name", label: "Name" }] }
+}
+```
+
+### LiveRelativeDate
+
+```tsx
+{
+    args: {
+        caption: "",
+        columns: [{ key: "date", label: "Updated", format: { kind: "date", style: "relative" } }],
+        rows: [{ date: new Date().toISOString() }],
+    }
+}
+```
+
+### NoColumns
+
+```tsx
+{
+    decorators: [
+        (Story) => (<div className="w-80">
+        <Story />
+      </div>),
+    ],
+    args: { columns: [], rows: [{}] }
+}
+```

package/llms/components/assistant-ui/elements/data-visualization/Diagram.md

@@ -0,0 +1,77 @@
+# Diagram
+
+Story: @alexgorbatchev/shadcn/components/assistant-ui/elements/data-visualization/Diagram
+Source: src/components/stories/assistant-ui/elements/data-visualization/Diagram.stories.tsx
+
+[Full source and local helpers](https://github.com/alexgorbatchev/shadcn/blob/main/src/components/stories/assistant-ui/elements/data-visualization/Diagram.stories.tsx)
+
+## Public imports
+
+```tsx
+import { Diagram } from "@alexgorbatchev/shadcn/assistant-ui";
+```
+
+## Supporting imports
+
+```tsx
+import { useState } from "react";
+```
+
+## Default component
+
+```tsx
+Diagram
+```
+
+## Default args
+
+```tsx
+{
+    title: "Request lifecycle",
+    zoom: 1,
+    children: "Request → Service → Response",
+    onZoomIn: fn(),
+    onZoomOut: fn(),
+    onReset: fn(),
+    onExpand: fn(),
+}
+```
+
+## Default render
+
+```tsx
+function Interactive(args) {
+    const [zoom, setZoom] = useState(args.zoom);
+    return (<Diagram {...args} zoom={zoom} onZoomIn={args.onZoomIn &&
+            (() => {
+                args.onZoomIn?.();
+                setZoom((value) => value + 0.25);
+            })} onZoomOut={args.onZoomOut &&
+            (() => {
+                args.onZoomOut?.();
+                setZoom((value) => value - 0.25);
+            })} onReset={args.onReset &&
+            (() => {
+                args.onReset?.();
+                setZoom(1);
+            })}/>);
+}
+```
+
+## 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.
+
+### Controls
+
+```tsx
+{}
+```
+
+### ReadOnly
+
+```tsx
+{
+    args: { onZoomIn: undefined, onZoomOut: undefined, onReset: undefined, onExpand: undefined }
+}
+```

package/llms/components/assistant-ui/elements/data-visualization/DotMatrix.md

@@ -0,0 +1,188 @@
+# DotMatrix
+
+Story: @alexgorbatchev/shadcn/components/assistant-ui/elements/data-visualization/DotMatrix
+Source: src/components/stories/assistant-ui/elements/data-visualization/DotMatrix.stories.tsx
+
+[Full source and local helpers](https://github.com/alexgorbatchev/shadcn/blob/main/src/components/stories/assistant-ui/elements/data-visualization/DotMatrix.stories.tsx)
+
+## Public imports
+
+```tsx
+import { DotMatrix } from "@alexgorbatchev/shadcn/assistant-ui";
+```
+
+## Default component
+
+```tsx
+DotMatrix
+```
+
+## Default render
+
+```tsx
+(args) => <DotMatrix {...args}/>
+```
+
+## 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.
+
+### Loading
+
+```tsx
+{
+    args: { state: "loading", label: "Agent working" }
+}
+```
+
+### Success
+
+```tsx
+{
+    args: { state: "success" }
+}
+```
+
+### Thinking
+
+```tsx
+{
+    args: { state: "thinking" }
+}
+```
+
+### Streaming
+
+```tsx
+{
+    args: { state: "streaming" }
+}
+```
+
+### Searching
+
+```tsx
+{
+    args: { state: "searching" }
+}
+```
+
+### Syncing
+
+```tsx
+{
+    args: { state: "syncing" }
+}
+```
+
+### Connecting
+
+```tsx
+{
+    args: { state: "connecting" }
+}
+```
+
+### Waiting
+
+```tsx
+{
+    args: { state: "waiting" }
+}
+```
+
+### Uploading
+
+```tsx
+{
+    args: { state: "uploading" }
+}
+```
+
+### Downloading
+
+```tsx
+{
+    args: { state: "downloading" }
+}
+```
+
+### Listening
+
+```tsx
+{
+    args: { state: "listening" }
+}
+```
+
+### Speaking
+
+```tsx
+{
+    args: { state: "speaking" }
+}
+```
+
+### Recording
+
+```tsx
+{
+    args: { state: "recording" }
+}
+```
+
+### Error
+
+```tsx
+{
+    args: { state: "error" }
+}
+```
+
+### Warning
+
+```tsx
+{
+    args: { state: "warning" }
+}
+```
+
+### Idle
+
+```tsx
+{
+    args: { state: "idle" }
+}
+```
+
+### Info
+
+```tsx
+{
+    args: { state: "info" }
+}
+```
+
+### Paused
+
+```tsx
+{
+    args: { state: "paused" }
+}
+```
+
+### Stopped
+
+```tsx
+{
+    args: { state: "stopped" }
+}
+```
+
+### Offline
+
+```tsx
+{
+    args: { state: "offline" }
+}
+```

package/llms/components/assistant-ui/elements/data-visualization/FlowGraph.md

@@ -0,0 +1,61 @@
+# FlowGraph
+
+Story: @alexgorbatchev/shadcn/components/assistant-ui/elements/data-visualization/FlowGraph
+Source: src/components/stories/assistant-ui/elements/data-visualization/FlowGraph.stories.tsx
+
+[Full source and local helpers](https://github.com/alexgorbatchev/shadcn/blob/main/src/components/stories/assistant-ui/elements/data-visualization/FlowGraph.stories.tsx)
+
+## Public imports
+
+```tsx
+import { FlowGraph } from "@alexgorbatchev/shadcn/assistant-ui";
+```
+
+## Default component
+
+```tsx
+FlowGraph
+```
+
+## Default args
+
+```tsx
+{
+    nodes: [
+        { id: "read", label: "Read", column: 0, row: 0, state: "done" },
+        { id: "build", label: "Build", column: 1, row: 0, state: "active" },
+        { id: "verify", label: "Verify", column: 2, row: 0, state: "pending" },
+    ],
+    edges: [
+        { from: "read", to: "build" },
+        { from: "build", to: "verify" },
+    ],
+    visibleCount: 3,
+}
+```
+
+## 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.
+
+### Workflow
+
+```tsx
+{}
+```
+
+### Partial
+
+```tsx
+{
+    args: { visibleCount: 1 }
+}
+```
+
+### Empty
+
+```tsx
+{
+    args: { nodes: [], edges: [], visibleCount: 0 }
+}
+```