@dowel-ui/react 0.2.0 → 0.4.0

package/dist/registry/components.js

@@ -2,55 +2,63 @@ import { COMPONENT_CATEGORIES, COMPONENT_STATUSES } from "./schema.js";
 import { meta } from "../components/accordion/meta.js";
 import { meta as meta$1 } from "../components/activity-feed/meta.js";
 import { meta as meta$2 } from "../components/ai-action-ledger/meta.js";
-import { meta as meta$3 } from "../components/ai-agent-status/meta.js";
-import { meta as meta$4 } from "../components/ai-conversation/meta.js";
-import { meta as meta$5 } from "../components/ai-inline-completion/meta.js";
-import { meta as meta$6 } from "../components/ai-message/meta.js";
-import { meta as meta$7 } from "../components/ai-model-selector/meta.js";
-import { meta as meta$8 } from "../components/ai-prompt-input/meta.js";
-import { meta as meta$9 } from "../components/ai-reasoning/meta.js";
-import { meta as meta$10 } from "../components/ai-response/meta.js";
-import { meta as meta$11 } from "../components/ai-sources/meta.js";
-import { meta as meta$12 } from "../components/ai-structured-output/meta.js";
-import { meta as meta$13 } from "../components/ai-token-usage/meta.js";
-import { meta as meta$14 } from "../components/ai-tool/meta.js";
-import { meta as meta$15 } from "../components/alert/meta.js";
-import { meta as meta$16 } from "../components/avatar/meta.js";
-import { meta as meta$17 } from "../components/badge/meta.js";
-import { meta as meta$18 } from "../components/button/meta.js";
-import { meta as meta$19 } from "../components/calendar/meta.js";
-import { meta as meta$20 } from "../components/card/meta.js";
-import { meta as meta$21 } from "../components/checkbox/meta.js";
-import { meta as meta$22 } from "../components/code-block/meta.js";
-import { meta as meta$23 } from "../components/combobox/meta.js";
-import { meta as meta$24 } from "../components/command/meta.js";
-import { meta as meta$25 } from "../components/data-table/meta.js";
-import { meta as meta$26 } from "../components/date-picker/meta.js";
-import { meta as meta$27 } from "../components/dialog/meta.js";
-import { meta as meta$28 } from "../components/drawer/meta.js";
-import { meta as meta$29 } from "../components/dropdown-menu/meta.js";
-import { meta as meta$30 } from "../components/empty-state/meta.js";
-import { meta as meta$31 } from "../components/form/meta.js";
-import { meta as meta$32 } from "../components/input/meta.js";
-import { meta as meta$33 } from "../components/label/meta.js";
-import { meta as meta$34 } from "../components/meter/meta.js";
-import { meta as meta$35 } from "../components/metric-delta/meta.js";
-import { meta as meta$36 } from "../components/pagination/meta.js";
-import { meta as meta$37 } from "../components/popover/meta.js";
-import { meta as meta$38 } from "../components/progress/meta.js";
-import { meta as meta$39 } from "../components/radio-group/meta.js";
-import { meta as meta$40 } from "../components/record-diff/meta.js";
-import { meta as meta$41 } from "../components/select/meta.js";
-import { meta as meta$42 } from "../components/separator/meta.js";
-import { meta as meta$43 } from "../components/sheet/meta.js";
-import { meta as meta$44 } from "../components/skeleton/meta.js";
-import { meta as meta$45 } from "../components/slider/meta.js";
-import { meta as meta$46 } from "../components/spinner/meta.js";
-import { meta as meta$47 } from "../components/switch/meta.js";
-import { meta as meta$48 } from "../components/table/meta.js";
-import { meta as meta$49 } from "../components/tabs/meta.js";
-import { meta as meta$50 } from "../components/toast/meta.js";
-import { meta as meta$51 } from "../components/tooltip/meta.js";
+import { meta as meta$3 } from "../components/ai-agent-plan/meta.js";
+import { meta as meta$4 } from "../components/ai-agent-status/meta.js";
+import { meta as meta$5 } from "../components/ai-approval-request/meta.js";
+import { meta as meta$6 } from "../components/ai-conversation/meta.js";
+import { meta as meta$7 } from "../components/ai-disclosure/meta.js";
+import { meta as meta$8 } from "../components/ai-inline-completion/meta.js";
+import { meta as meta$9 } from "../components/ai-message/meta.js";
+import { meta as meta$10 } from "../components/ai-model-selector/meta.js";
+import { meta as meta$11 } from "../components/ai-prompt-input/meta.js";
+import { meta as meta$12 } from "../components/ai-reasoning/meta.js";
+import { meta as meta$13 } from "../components/ai-response/meta.js";
+import { meta as meta$14 } from "../components/ai-sources/meta.js";
+import { meta as meta$15 } from "../components/ai-structured-output/meta.js";
+import { meta as meta$16 } from "../components/ai-token-usage/meta.js";
+import { meta as meta$17 } from "../components/ai-tool/meta.js";
+import { meta as meta$18 } from "../components/alert/meta.js";
+import { meta as meta$19 } from "../components/avatar/meta.js";
+import { meta as meta$20 } from "../components/badge/meta.js";
+import { meta as meta$21 } from "../components/button/meta.js";
+import { meta as meta$22 } from "../components/calendar/meta.js";
+import { meta as meta$23 } from "../components/card/meta.js";
+import { meta as meta$24 } from "../components/checkbox/meta.js";
+import { meta as meta$25 } from "../components/code-block/meta.js";
+import { meta as meta$26 } from "../components/combobox/meta.js";
+import { meta as meta$27 } from "../components/command/meta.js";
+import { meta as meta$28 } from "../components/data-table/meta.js";
+import { meta as meta$29 } from "../components/date-picker/meta.js";
+import { meta as meta$30 } from "../components/dialog/meta.js";
+import { meta as meta$31 } from "../components/diff-viewer/meta.js";
+import { meta as meta$32 } from "../components/drawer/meta.js";
+import { meta as meta$33 } from "../components/dropdown-menu/meta.js";
+import { meta as meta$34 } from "../components/empty-state/meta.js";
+import { meta as meta$35 } from "../components/file-upload/meta.js";
+import { meta as meta$36 } from "../components/form/meta.js";
+import { meta as meta$37 } from "../components/input/meta.js";
+import { meta as meta$38 } from "../components/label/meta.js";
+import { meta as meta$39 } from "../components/log-viewer/meta.js";
+import { meta as meta$40 } from "../components/meter/meta.js";
+import { meta as meta$41 } from "../components/metric-delta/meta.js";
+import { meta as meta$42 } from "../components/pagination/meta.js";
+import { meta as meta$43 } from "../components/popover/meta.js";
+import { meta as meta$44 } from "../components/progress/meta.js";
+import { meta as meta$45 } from "../components/radio-group/meta.js";
+import { meta as meta$46 } from "../components/record-diff/meta.js";
+import { meta as meta$47 } from "../components/select/meta.js";
+import { meta as meta$48 } from "../components/separator/meta.js";
+import { meta as meta$49 } from "../components/sheet/meta.js";
+import { meta as meta$50 } from "../components/skeleton/meta.js";
+import { meta as meta$51 } from "../components/slider/meta.js";
+import { meta as meta$52 } from "../components/spinner/meta.js";
+import { meta as meta$53 } from "../components/switch/meta.js";
+import { meta as meta$54 } from "../components/table/meta.js";
+import { meta as meta$55 } from "../components/tabs/meta.js";
+import { meta as meta$56 } from "../components/tags-input/meta.js";
+import { meta as meta$57 } from "../components/time-range-picker/meta.js";
+import { meta as meta$58 } from "../components/toast/meta.js";
+import { meta as meta$59 } from "../components/tooltip/meta.js";
 import { blockMetas } from "./blocks.js";
 //#region src/registry/components.ts
 /**
@@ -116,7 +124,15 @@ const componentMetas = [
 	meta$48,
 	meta$49,
 	meta$50,
-	meta$51
+	meta$51,
+	meta$52,
+	meta$53,
+	meta$54,
+	meta$55,
+	meta$56,
+	meta$57,
+	meta$58,
+	meta$59
 ];
 //#endregion
 export { COMPONENT_CATEGORIES, COMPONENT_STATUSES, blockMetas, componentMetas };

package/dist/registry/components.js.map

@@ -1 +1 @@
-{"version":3,"file":"components.js","names":["accordionMeta","activityFeedMeta","aiActionLedgerMeta","aiAgentStatusMeta","aiConversationMeta","aiInlineCompletionMeta","aiMessageMeta","aiModelSelectorMeta","aiPromptInputMeta","aiReasoningMeta","aiResponseMeta","aiSourcesMeta","aiStructuredOutputMeta","aiTokenUsageMeta","aiToolMeta","alertMeta","avatarMeta","badgeMeta","buttonMeta","calendarMeta","cardMeta","checkboxMeta","codeBlockMeta","comboboxMeta","commandMeta","dataTableMeta","datePickerMeta","dialogMeta","drawerMeta","dropdownMenuMeta","emptyStateMeta","formMeta","inputMeta","labelMeta","meterMeta","metricDeltaMeta","paginationMeta","popoverMeta","progressMeta","radioGroupMeta","recordDiffMeta","selectMeta","separatorMeta","sheetMeta","skeletonMeta","sliderMeta","spinnerMeta","switchMeta","tableMeta","tabsMeta","toastMeta","tooltipMeta"],"sources":["../../src/registry/components.ts"],"sourcesContent":["import type { ComponentMeta } from \"./schema\";\n\nimport { meta as accordionMeta } from \"@/components/accordion/meta\";\nimport { meta as activityFeedMeta } from \"@/components/activity-feed/meta\";\nimport { meta as aiActionLedgerMeta } from \"@/components/ai-action-ledger/meta\";\nimport { meta as aiAgentStatusMeta } from \"@/components/ai-agent-status/meta\";\nimport { meta as aiConversationMeta } from \"@/components/ai-conversation/meta\";\nimport { meta as aiInlineCompletionMeta } from \"@/components/ai-inline-completion/meta\";\nimport { meta as aiMessageMeta } from \"@/components/ai-message/meta\";\nimport { meta as aiModelSelectorMeta } from \"@/components/ai-model-selector/meta\";\nimport { meta as aiPromptInputMeta } from \"@/components/ai-prompt-input/meta\";\nimport { meta as aiReasoningMeta } from \"@/components/ai-reasoning/meta\";\nimport { meta as aiResponseMeta } from \"@/components/ai-response/meta\";\nimport { meta as aiSourcesMeta } from \"@/components/ai-sources/meta\";\nimport { meta as aiStructuredOutputMeta } from \"@/components/ai-structured-output/meta\";\nimport { meta as aiTokenUsageMeta } from \"@/components/ai-token-usage/meta\";\nimport { meta as aiToolMeta } from \"@/components/ai-tool/meta\";\nimport { meta as alertMeta } from \"@/components/alert/meta\";\nimport { meta as avatarMeta } from \"@/components/avatar/meta\";\nimport { meta as badgeMeta } from \"@/components/badge/meta\";\nimport { meta as buttonMeta } from \"@/components/button/meta\";\nimport { meta as calendarMeta } from \"@/components/calendar/meta\";\nimport { meta as cardMeta } from \"@/components/card/meta\";\nimport { meta as checkboxMeta } from \"@/components/checkbox/meta\";\nimport { meta as codeBlockMeta } from \"@/components/code-block/meta\";\nimport { meta as comboboxMeta } from \"@/components/combobox/meta\";\nimport { meta as commandMeta } from \"@/components/command/meta\";\nimport { meta as dataTableMeta } from \"@/components/data-table/meta\";\nimport { meta as datePickerMeta } from \"@/components/date-picker/meta\";\nimport { meta as dialogMeta } from \"@/components/dialog/meta\";\nimport { meta as drawerMeta } from \"@/components/drawer/meta\";\nimport { meta as dropdownMenuMeta } from \"@/components/dropdown-menu/meta\";\nimport { meta as emptyStateMeta } from \"@/components/empty-state/meta\";\nimport { meta as formMeta } from \"@/components/form/meta\";\nimport { meta as inputMeta } from \"@/components/input/meta\";\nimport { meta as labelMeta } from \"@/components/label/meta\";\nimport { meta as meterMeta } from \"@/components/meter/meta\";\nimport { meta as metricDeltaMeta } from \"@/components/metric-delta/meta\";\nimport { meta as paginationMeta } from \"@/components/pagination/meta\";\nimport { meta as popoverMeta } from \"@/components/popover/meta\";\nimport { meta as progressMeta } from \"@/components/progress/meta\";\nimport { meta as radioGroupMeta } from \"@/components/radio-group/meta\";\nimport { meta as recordDiffMeta } from \"@/components/record-diff/meta\";\nimport { meta as selectMeta } from \"@/components/select/meta\";\nimport { meta as separatorMeta } from \"@/components/separator/meta\";\nimport { meta as sheetMeta } from \"@/components/sheet/meta\";\nimport { meta as skeletonMeta } from \"@/components/skeleton/meta\";\nimport { meta as sliderMeta } from \"@/components/slider/meta\";\nimport { meta as spinnerMeta } from \"@/components/spinner/meta\";\nimport { meta as switchMeta } from \"@/components/switch/meta\";\nimport { meta as tableMeta } from \"@/components/table/meta\";\nimport { meta as tabsMeta } from \"@/components/tabs/meta\";\nimport { meta as toastMeta } from \"@/components/toast/meta\";\nimport { meta as tooltipMeta } from \"@/components/tooltip/meta\";\n\n/**\n * Every component in the registry.\n *\n * An explicit list rather than a glob: the registry build runs in plain Node,\n * where bundler-only globbing is unavailable, and a static list is also what\n * lets the bundle tree-shake. `meta.test.ts` fails if a component directory\n * exists that is missing from here, so it cannot silently fall out of date.\n *\n * Identifiers carry a `Meta` suffix because component names include reserved\n * words — `switch` cannot be a binding name.\n */\nexport const componentMetas: ComponentMeta[] = [\n  accordionMeta,\n  activityFeedMeta,\n  aiActionLedgerMeta,\n  aiAgentStatusMeta,\n  aiConversationMeta,\n  aiInlineCompletionMeta,\n  aiMessageMeta,\n  aiModelSelectorMeta,\n  aiPromptInputMeta,\n  aiReasoningMeta,\n  aiResponseMeta,\n  aiSourcesMeta,\n  aiStructuredOutputMeta,\n  aiTokenUsageMeta,\n  aiToolMeta,\n  alertMeta,\n  avatarMeta,\n  badgeMeta,\n  buttonMeta,\n  calendarMeta,\n  cardMeta,\n  checkboxMeta,\n  codeBlockMeta,\n  comboboxMeta,\n  commandMeta,\n  dataTableMeta,\n  datePickerMeta,\n  dialogMeta,\n  drawerMeta,\n  dropdownMenuMeta,\n  emptyStateMeta,\n  formMeta,\n  inputMeta,\n  labelMeta,\n  meterMeta,\n  metricDeltaMeta,\n  paginationMeta,\n  popoverMeta,\n  progressMeta,\n  radioGroupMeta,\n  recordDiffMeta,\n  selectMeta,\n  separatorMeta,\n  sheetMeta,\n  skeletonMeta,\n  sliderMeta,\n  spinnerMeta,\n  switchMeta,\n  tableMeta,\n  tabsMeta,\n  toastMeta,\n  tooltipMeta,\n];\n\n// This file is the `@dowel-ui/react/registry` entry point, so the block barrel is\n// re-exported here — the registry build reads both through one import.\nexport { blockMetas } from \"./blocks\";\nexport { COMPONENT_CATEGORIES, COMPONENT_STATUSES } from \"./schema\";\nexport type { ComponentCategory, ComponentMeta, ComponentStatus } from \"./schema\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkEA,MAAa,iBAAkC;CAC7CA;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;AACF"}
+{"version":3,"file":"components.js","names":["accordionMeta","activityFeedMeta","aiActionLedgerMeta","aiAgentPlanMeta","aiAgentStatusMeta","aiApprovalRequestMeta","aiConversationMeta","aiDisclosureMeta","aiInlineCompletionMeta","aiMessageMeta","aiModelSelectorMeta","aiPromptInputMeta","aiReasoningMeta","aiResponseMeta","aiSourcesMeta","aiStructuredOutputMeta","aiTokenUsageMeta","aiToolMeta","alertMeta","avatarMeta","badgeMeta","buttonMeta","calendarMeta","cardMeta","checkboxMeta","codeBlockMeta","comboboxMeta","commandMeta","dataTableMeta","datePickerMeta","dialogMeta","diffViewerMeta","drawerMeta","dropdownMenuMeta","emptyStateMeta","fileUploadMeta","formMeta","inputMeta","labelMeta","logViewerMeta","meterMeta","metricDeltaMeta","paginationMeta","popoverMeta","progressMeta","radioGroupMeta","recordDiffMeta","selectMeta","separatorMeta","sheetMeta","skeletonMeta","sliderMeta","spinnerMeta","switchMeta","tableMeta","tabsMeta","tagsInputMeta","timeRangePickerMeta","toastMeta","tooltipMeta"],"sources":["../../src/registry/components.ts"],"sourcesContent":["import type { ComponentMeta } from \"./schema\";\n\nimport { meta as accordionMeta } from \"@/components/accordion/meta\";\nimport { meta as activityFeedMeta } from \"@/components/activity-feed/meta\";\nimport { meta as aiActionLedgerMeta } from \"@/components/ai-action-ledger/meta\";\nimport { meta as aiAgentPlanMeta } from \"@/components/ai-agent-plan/meta\";\nimport { meta as aiAgentStatusMeta } from \"@/components/ai-agent-status/meta\";\nimport { meta as aiApprovalRequestMeta } from \"@/components/ai-approval-request/meta\";\nimport { meta as aiConversationMeta } from \"@/components/ai-conversation/meta\";\nimport { meta as aiDisclosureMeta } from \"@/components/ai-disclosure/meta\";\nimport { meta as aiInlineCompletionMeta } from \"@/components/ai-inline-completion/meta\";\nimport { meta as aiMessageMeta } from \"@/components/ai-message/meta\";\nimport { meta as aiModelSelectorMeta } from \"@/components/ai-model-selector/meta\";\nimport { meta as aiPromptInputMeta } from \"@/components/ai-prompt-input/meta\";\nimport { meta as aiReasoningMeta } from \"@/components/ai-reasoning/meta\";\nimport { meta as aiResponseMeta } from \"@/components/ai-response/meta\";\nimport { meta as aiSourcesMeta } from \"@/components/ai-sources/meta\";\nimport { meta as aiStructuredOutputMeta } from \"@/components/ai-structured-output/meta\";\nimport { meta as aiTokenUsageMeta } from \"@/components/ai-token-usage/meta\";\nimport { meta as aiToolMeta } from \"@/components/ai-tool/meta\";\nimport { meta as alertMeta } from \"@/components/alert/meta\";\nimport { meta as avatarMeta } from \"@/components/avatar/meta\";\nimport { meta as badgeMeta } from \"@/components/badge/meta\";\nimport { meta as buttonMeta } from \"@/components/button/meta\";\nimport { meta as calendarMeta } from \"@/components/calendar/meta\";\nimport { meta as cardMeta } from \"@/components/card/meta\";\nimport { meta as checkboxMeta } from \"@/components/checkbox/meta\";\nimport { meta as codeBlockMeta } from \"@/components/code-block/meta\";\nimport { meta as comboboxMeta } from \"@/components/combobox/meta\";\nimport { meta as commandMeta } from \"@/components/command/meta\";\nimport { meta as dataTableMeta } from \"@/components/data-table/meta\";\nimport { meta as datePickerMeta } from \"@/components/date-picker/meta\";\nimport { meta as dialogMeta } from \"@/components/dialog/meta\";\nimport { meta as diffViewerMeta } from \"@/components/diff-viewer/meta\";\nimport { meta as drawerMeta } from \"@/components/drawer/meta\";\nimport { meta as dropdownMenuMeta } from \"@/components/dropdown-menu/meta\";\nimport { meta as emptyStateMeta } from \"@/components/empty-state/meta\";\nimport { meta as fileUploadMeta } from \"@/components/file-upload/meta\";\nimport { meta as formMeta } from \"@/components/form/meta\";\nimport { meta as inputMeta } from \"@/components/input/meta\";\nimport { meta as labelMeta } from \"@/components/label/meta\";\nimport { meta as logViewerMeta } from \"@/components/log-viewer/meta\";\nimport { meta as meterMeta } from \"@/components/meter/meta\";\nimport { meta as metricDeltaMeta } from \"@/components/metric-delta/meta\";\nimport { meta as paginationMeta } from \"@/components/pagination/meta\";\nimport { meta as popoverMeta } from \"@/components/popover/meta\";\nimport { meta as progressMeta } from \"@/components/progress/meta\";\nimport { meta as radioGroupMeta } from \"@/components/radio-group/meta\";\nimport { meta as recordDiffMeta } from \"@/components/record-diff/meta\";\nimport { meta as selectMeta } from \"@/components/select/meta\";\nimport { meta as separatorMeta } from \"@/components/separator/meta\";\nimport { meta as sheetMeta } from \"@/components/sheet/meta\";\nimport { meta as skeletonMeta } from \"@/components/skeleton/meta\";\nimport { meta as sliderMeta } from \"@/components/slider/meta\";\nimport { meta as spinnerMeta } from \"@/components/spinner/meta\";\nimport { meta as switchMeta } from \"@/components/switch/meta\";\nimport { meta as tableMeta } from \"@/components/table/meta\";\nimport { meta as tabsMeta } from \"@/components/tabs/meta\";\nimport { meta as tagsInputMeta } from \"@/components/tags-input/meta\";\nimport { meta as timeRangePickerMeta } from \"@/components/time-range-picker/meta\";\nimport { meta as toastMeta } from \"@/components/toast/meta\";\nimport { meta as tooltipMeta } from \"@/components/tooltip/meta\";\n\n/**\n * Every component in the registry.\n *\n * An explicit list rather than a glob: the registry build runs in plain Node,\n * where bundler-only globbing is unavailable, and a static list is also what\n * lets the bundle tree-shake. `meta.test.ts` fails if a component directory\n * exists that is missing from here, so it cannot silently fall out of date.\n *\n * Identifiers carry a `Meta` suffix because component names include reserved\n * words — `switch` cannot be a binding name.\n */\nexport const componentMetas: ComponentMeta[] = [\n  accordionMeta,\n  activityFeedMeta,\n  aiActionLedgerMeta,\n  aiAgentPlanMeta,\n  aiAgentStatusMeta,\n  aiApprovalRequestMeta,\n  aiConversationMeta,\n  aiDisclosureMeta,\n  aiInlineCompletionMeta,\n  aiMessageMeta,\n  aiModelSelectorMeta,\n  aiPromptInputMeta,\n  aiReasoningMeta,\n  aiResponseMeta,\n  aiSourcesMeta,\n  aiStructuredOutputMeta,\n  aiTokenUsageMeta,\n  aiToolMeta,\n  alertMeta,\n  avatarMeta,\n  badgeMeta,\n  buttonMeta,\n  calendarMeta,\n  cardMeta,\n  checkboxMeta,\n  codeBlockMeta,\n  comboboxMeta,\n  commandMeta,\n  dataTableMeta,\n  datePickerMeta,\n  dialogMeta,\n  diffViewerMeta,\n  drawerMeta,\n  dropdownMenuMeta,\n  emptyStateMeta,\n  fileUploadMeta,\n  formMeta,\n  inputMeta,\n  labelMeta,\n  logViewerMeta,\n  meterMeta,\n  metricDeltaMeta,\n  paginationMeta,\n  popoverMeta,\n  progressMeta,\n  radioGroupMeta,\n  recordDiffMeta,\n  selectMeta,\n  separatorMeta,\n  sheetMeta,\n  skeletonMeta,\n  sliderMeta,\n  spinnerMeta,\n  switchMeta,\n  tableMeta,\n  tabsMeta,\n  tagsInputMeta,\n  timeRangePickerMeta,\n  toastMeta,\n  tooltipMeta,\n];\n\n// This file is the `@dowel-ui/react/registry` entry point, so the block barrel is\n// re-exported here — the registry build reads both through one import.\nexport { blockMetas } from \"./blocks\";\nexport { COMPONENT_CATEGORIES, COMPONENT_STATUSES } from \"./schema\";\nexport type { ComponentCategory, ComponentMeta, ComponentStatus } from \"./schema\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA0EA,MAAa,iBAAkC;CAC7CA;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;CACAC;AACF"}

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@dowel-ui/react",
-  "version": "0.2.0",
+  "version": "0.4.0",
   "type": "module",
-  "description": "Source-first React components for SaaS and AI products — 52 accessible components you install as code you own, not as a dependency.",
+  "description": "Source-first React components for SaaS and AI products — 60 accessible components you install as code you own, not as a dependency.",
   "keywords": [
     "react",
     "ui",
@@ -63,8 +63,10 @@
   },
   "dependencies": {
     "@tanstack/react-table": "9.2.4",
+    "@tanstack/react-virtual": "3.14.10",
     "class-variance-authority": "0.7.1",
     "clsx": "2.1.1",
+    "diff": "9.0.0",
     "radix-ui": "1.6.7",
     "react-day-picker": "10.0.1",
     "tailwind-merge": "3.6.0"
@@ -93,8 +95,8 @@
     "vite": "8.2.2",
     "vitest": "4.1.10",
     "zod": "4.5.4",
-    "@dowel-ui/config": "0.2.0",
-    "@dowel-ui/themes": "0.2.0"
+    "@dowel-ui/config": "0.4.0",
+    "@dowel-ui/themes": "0.4.0"
   },
   "scripts": {
     "build": "tsdown",

package/src/components/ai-agent-plan/index.ts

@@ -0,0 +1,10 @@
+export {
+  AgentPlan,
+  AgentPlanStep,
+  AgentPlanSteps,
+  AgentPlanSummary,
+  type AgentPlanProps,
+  type AgentPlanStepProps,
+  type PlanStep,
+  type StepStatus,
+} from "./ai-agent-plan";

package/src/components/ai-agent-plan/meta.ts

@@ -0,0 +1,19 @@
+import { defineMeta } from "@/registry/schema";
+
+export const meta = defineMeta({
+  name: "ai-agent-plan",
+  title: "AI Agent Plan",
+  description: "What an agent intends to do — including when it changes its mind mid-run.",
+  category: "ai",
+  status: "stable",
+  dependencies: [],
+  registryDependencies: [],
+  files: ["ai-agent-plan.tsx"],
+  a11y:
+    "An ordered list, because a plan is a sequence and the order carries meaning an unordered " +
+    'list would discard. The running step carries aria-current="step", which marks the reader\'s ' +
+    "place without moving focus and fighting anyone reading ahead. Every status is stated in text " +
+    "as well as drawn, and the markers are aria-hidden so the status is not heard twice per step. " +
+    "The live region reports structural revisions only — announcing every status transition would " +
+    "talk over the reader continuously on a plan of any length.",
+});

package/src/components/ai-approval-request/ai-approval-request.tsx

@@ -0,0 +1,368 @@
+"use client";
+
+import { useId, useMemo, useState, type ComponentPropsWithRef, type ReactNode } from "react";
+
+import { disabledStyles, focusRing } from "@/lib/styles";
+import { cn } from "@/lib/utils";
+
+/**
+ * The gate between an agent deciding to act and it acting.
+ *
+ * Two things separate this from the confirmations that already exist.
+ *
+ * The first is that the proposed arguments are editable. Every implementation
+ * surveyed returns a boolean over a read-only payload, which forces a false
+ * choice: approve a call whose recipient is wrong, or deny it and make the
+ * model try again. "Approve this, but fix the address first" is the answer
+ * people actually want, and it is only possible if the arguments are fields.
+ * Edited values come back in the decision, and are marked as changed so an
+ * audit trail can tell the model's proposal from the human's correction.
+ *
+ * The second is that it renders while the arguments are still arriving. The
+ * common implementation returns null until the tool input is complete, which
+ * means nothing is on screen at the moment approval becomes relevant and the
+ * request appears abruptly, fully formed. Here the request is visible as it
+ * forms, with the decision held until there is something whole to decide on.
+ */
+
+export type ApprovalScope = "once" | "always";
+
+export type ApprovalDecision =
+  | {
+      approved: true;
+      scope: ApprovalScope;
+      arguments: Record<string, string>;
+      edited: string[];
+    }
+  | { approved: false; reason?: string };
+
+export interface ApprovalField {
+  name: string;
+  label: string;
+  /** A textarea instead of a single line. For message bodies and prompts. */
+  multiline?: boolean;
+  /** Locked arguments are shown but not editable — an id, a resolved amount. */
+  readOnly?: boolean;
+}
+
+export interface ApprovalRequestProps extends Omit<
+  ComponentPropsWithRef<"section">,
+  "onSubmit" | "children"
+> {
+  /** The tool the model wants to call, as it named it. */
+  tool: string;
+  /** What the call will do, in the reader's language rather than the API's. */
+  summary: string;
+  /** Proposed arguments. Missing keys are treated as still arriving. */
+  arguments: Record<string, string>;
+  /** Which arguments to show, in order, and which may be changed. */
+  fields: ApprovalField[];
+  onDecision: (decision: ApprovalDecision) => void;
+  /**
+   * True while the model is still producing the arguments. The request renders
+   * anyway; only the decision waits.
+   */
+  streaming?: boolean;
+  /**
+   * Said plainly above the controls when the call cannot be taken back. Not a
+   * severity colour — the sentence is the warning.
+   */
+  irreversible?: string;
+  /** Set once decided, to render the outcome instead of the controls. */
+  decision?: ApprovalDecision;
+  children?: ReactNode;
+}
+
+export function ApprovalRequest({
+  className,
+  tool,
+  summary,
+  arguments: proposed,
+  fields,
+  onDecision,
+  streaming = false,
+  irreversible,
+  decision,
+  children,
+  ...props
+}: ApprovalRequestProps) {
+  const headingId = useId();
+  const [edits, setEdits] = useState<Record<string, string>>({});
+  const [denying, setDenying] = useState(false);
+  const [reason, setReason] = useState("");
+
+  // The model's proposal with the human's corrections applied on top. Keeping
+  // them apart is what lets the component say which is which.
+  const values = useMemo(() => ({ ...proposed, ...edits }), [proposed, edits]);
+
+  const edited = useMemo(
+    () => Object.keys(edits).filter((name) => edits[name] !== proposed[name]),
+    [edits, proposed],
+  );
+
+  const missing = fields.filter((field) => proposed[field.name] === undefined);
+  const settled = !streaming && missing.length === 0;
+
+  if (decision) {
+    return (
+      <section
+        data-slot="approval-request"
+        data-state={decision.approved ? "approved" : "denied"}
+        aria-labelledby={headingId}
+        className={cn(
+          "rounded-lg border p-4 text-sm",
+          decision.approved ? "border-border bg-muted/40" : "border-border bg-muted/40",
+          className,
+        )}
+        {...props}
+      >
+        <h3 id={headingId} className="text-sm font-medium">
+          {summary}
+        </h3>
+        <p data-slot="approval-outcome" className="mt-1 text-xs text-muted-foreground">
+          {decision.approved
+            ? `Approved ${decision.scope === "always" ? "for every call to this tool" : "once"}` +
+              (decision.edited.length > 0
+                ? `, with ${String(decision.edited.length)} argument${decision.edited.length === 1 ? "" : "s"} corrected`
+                : "")
+            : `Denied${decision.reason ? `: ${decision.reason}` : ""}`}
+        </p>
+      </section>
+    );
+  }
+
+  return (
+    <section
+      data-slot="approval-request"
+      data-state={settled ? "pending" : "forming"}
+      aria-labelledby={headingId}
+      // Busy while the arguments are still arriving, so a reader is told the
+      // request is not yet whole rather than acting on half of it.
+      aria-busy={!settled}
+      className={cn("rounded-lg border border-border bg-card p-4", className)}
+      {...props}
+    >
+      <div className="flex flex-wrap items-baseline justify-between gap-2">
+        <h3 id={headingId} className="text-sm font-medium">
+          {summary}
+        </h3>
+        <code className="rounded bg-muted px-1.5 py-0.5 font-mono text-2xs text-muted-foreground">
+          {tool}
+        </code>
+      </div>
+
+      <dl className="mt-3 flex flex-col gap-2.5">
+        {fields.map((field) => {
+          const arrived = proposed[field.name] !== undefined;
+          const changed = edited.includes(field.name);
+
+          return (
+            <ApprovalArgument
+              key={field.name}
+              field={field}
+              value={values[field.name] ?? ""}
+              arrived={arrived}
+              changed={changed}
+              onChange={(next) => {
+                setEdits((current) => ({ ...current, [field.name]: next }));
+              }}
+            />
+          );
+        })}
+      </dl>
+
+      {children}
+
+      {irreversible ? (
+        <p data-slot="approval-warning" className="mt-3 text-xs text-destructive">
+          {irreversible}
+        </p>
+      ) : null}
+
+      {denying ? (
+        <div className="mt-3 flex flex-col gap-2">
+          <label htmlFor={`${headingId}-reason`} className="text-xs text-muted-foreground">
+            Why not? The model sees this.
+          </label>
+          <textarea
+            id={`${headingId}-reason`}
+            rows={2}
+            value={reason}
+            onChange={(event) => {
+              setReason(event.target.value);
+            }}
+            className={cn(
+              "w-full resize-none rounded-md border border-input bg-background px-2 py-1.5 text-sm",
+              focusRing,
+            )}
+          />
+          <div className="flex flex-wrap gap-2">
+            <Action
+              variant="destructive"
+              onClick={() => {
+                onDecision({ approved: false, reason: reason.trim() || undefined });
+              }}
+            >
+              Deny
+            </Action>
+            <Action
+              onClick={() => {
+                setDenying(false);
+              }}
+            >
+              Back
+            </Action>
+          </div>
+        </div>
+      ) : (
+        <div className="mt-4 flex flex-wrap items-center gap-2">
+          <Action
+            variant="primary"
+            disabled={!settled}
+            onClick={() => {
+              onDecision({ approved: true, scope: "once", arguments: values, edited });
+            }}
+          >
+            {edited.length > 0 ? "Approve with changes" : "Approve once"}
+          </Action>
+
+          {/* Scope is a separate decision from approval, and blanket consent
+              should never be the easiest button to reach. */}
+          <Action
+            disabled={!settled}
+            onClick={() => {
+              onDecision({ approved: true, scope: "always", arguments: values, edited });
+            }}
+          >
+            Always allow {tool}
+          </Action>
+
+          <Action
+            onClick={() => {
+              setDenying(true);
+            }}
+          >
+            Deny…
+          </Action>
+
+          {!settled ? (
+            <span aria-live="polite" className="text-xs text-muted-foreground">
+              Waiting for the model to finish the request
+            </span>
+          ) : null}
+        </div>
+      )}
+    </section>
+  );
+}
+
+function ApprovalArgument({
+  field,
+  value,
+  arrived,
+  changed,
+  onChange,
+}: {
+  field: ApprovalField;
+  value: string;
+  arrived: boolean;
+  changed: boolean;
+  onChange: (value: string) => void;
+}) {
+  const id = useId();
+  const changedId = useId();
+  const editable = !field.readOnly && arrived;
+
+  return (
+    <div
+      data-slot="approval-argument"
+      data-changed={changed || undefined}
+      className="flex flex-col gap-1"
+    >
+      <dt className="flex items-baseline gap-1">
+        <label htmlFor={editable ? id : undefined} className="text-xs text-muted-foreground">
+          {field.label}
+        </label>
+        {/* Outside the label, and attached as a description instead. Inside it,
+            editing a field would rename the field — a screen reader user would
+            hear its accessible name change under them mid-edit. Marked in text
+            rather than by border colour alone, because an audit trail has to
+            tell the model's proposal from the human's correction. */}
+        {changed ? (
+          <span id={changedId} className="text-xs text-warning">
+            · changed from the model&rsquo;s proposal
+          </span>
+        ) : null}
+      </dt>
+      <dd className="m-0">
+        {!arrived ? (
+          <span
+            aria-hidden="true"
+            className="block h-8 w-full animate-pulse-soft rounded-md bg-muted"
+          />
+        ) : editable ? (
+          field.multiline ? (
+            <textarea
+              id={id}
+              aria-describedby={changed ? changedId : undefined}
+              rows={3}
+              value={value}
+              onChange={(event) => {
+                onChange(event.target.value);
+              }}
+              className={cn(
+                "w-full resize-none rounded-md border border-input bg-background px-2 py-1.5 font-mono text-xs",
+                changed && "border-warning",
+                focusRing,
+              )}
+            />
+          ) : (
+            <input
+              id={id}
+              type="text"
+              aria-describedby={changed ? changedId : undefined}
+              value={value}
+              onChange={(event) => {
+                onChange(event.target.value);
+              }}
+              className={cn(
+                "w-full rounded-md border border-input bg-background px-2 py-1.5 font-mono text-xs",
+                changed && "border-warning",
+                focusRing,
+              )}
+            />
+          )
+        ) : (
+          <p className="rounded-md bg-muted px-2 py-1.5 font-mono text-xs break-words">
+            {value}
+          </p>
+        )}
+      </dd>
+    </div>
+  );
+}
+
+function Action({
+  className,
+  variant = "default",
+  ...props
+}: ComponentPropsWithRef<"button"> & { variant?: "default" | "primary" | "destructive" }) {
+  return (
+    <button
+      type="button"
+      className={cn(
+        "rounded-md border px-2.5 py-1 text-xs font-medium transition-colors",
+        variant === "primary" &&
+          "border-primary bg-primary text-primary-foreground hover:bg-primary-hover",
+        variant === "destructive" &&
+          "border-destructive bg-destructive text-destructive-foreground hover:bg-destructive/90",
+        variant === "default" &&
+          "border-input bg-background hover:bg-accent hover:text-accent-foreground",
+        focusRing,
+        disabledStyles,
+        className,
+      )}
+      {...props}
+    />
+  );
+}

package/src/components/ai-approval-request/index.ts

@@ -0,0 +1,7 @@
+export {
+  ApprovalRequest,
+  type ApprovalDecision,
+  type ApprovalField,
+  type ApprovalRequestProps,
+  type ApprovalScope,
+} from "./ai-approval-request";

package/src/components/ai-approval-request/meta.ts

@@ -0,0 +1,21 @@
+import { defineMeta } from "@/registry/schema";
+
+export const meta = defineMeta({
+  name: "ai-approval-request",
+  title: "AI Approval Request",
+  description: "Approve a tool call — after correcting the arguments the model got wrong.",
+  category: "ai",
+  status: "stable",
+  dependencies: [],
+  registryDependencies: [],
+  files: ["ai-approval-request.tsx"],
+  a11y:
+    "The proposed arguments are a description list of real labelled form controls, so each value " +
+    "is associated with its name and editable ones are reachable by keyboard. A corrected " +
+    "argument is marked in text rather than by border colour alone, because an audit trail has " +
+    "to distinguish the model's proposal from the human's edit. The request is aria-busy while " +
+    "arguments are still arriving and the decision controls stay disabled until it is whole — " +
+    "rendering nothing until then, as the common implementation does, means nothing is on screen " +
+    "at the moment approval becomes relevant. Irreversibility is stated as a sentence, never as a " +
+    "severity colour.",
+});