@devalok/shilp-sutra 0.49.1 → 0.49.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (54) hide show
  1. package/dist/_chunks/badge-group.js +37 -37
  2. package/dist/_chunks/badge-group.js.map +1 -1
  3. package/dist/_chunks/chat.js +3 -12
  4. package/dist/_chunks/chat.js.map +1 -1
  5. package/dist/_chunks/primitives.js +6 -9
  6. package/dist/_chunks/primitives.js.map +1 -1
  7. package/dist/_chunks/success.js +1 -4
  8. package/dist/_chunks/success.js.map +1 -1
  9. package/dist/ai/block-renderer.js +1 -4
  10. package/dist/ai/block-renderer.js.map +1 -1
  11. package/dist/ai/command-bar.d.ts.map +1 -1
  12. package/dist/ai/command-bar.js +2 -33
  13. package/dist/ai/command-bar.js.map +1 -1
  14. package/dist/ai/conversation.js +2 -8
  15. package/dist/ai/conversation.js.map +1 -1
  16. package/dist/ai/devadoot-icon.d.ts.map +1 -1
  17. package/dist/ai/index.js +7 -38
  18. package/dist/ai/index.js.map +1 -1
  19. package/dist/composed/activity-feed.js +3 -3
  20. package/dist/composed/activity-feed.js.map +1 -1
  21. package/dist/composed/avatar-group.js +2 -2
  22. package/dist/composed/avatar-group.js.map +1 -1
  23. package/dist/composed/empty-state.d.ts.map +1 -1
  24. package/dist/composed/empty-state.js +22 -32
  25. package/dist/composed/empty-state.js.map +1 -1
  26. package/dist/composed/schedule-view.js +1 -1
  27. package/dist/composed/schedule-view.js.map +1 -1
  28. package/dist/primitives/_internal/react-dismissable-layer.d.ts.map +1 -1
  29. package/dist/primitives/_internal/react-focus-scope.d.ts.map +1 -1
  30. package/dist/shell/bottom-navbar.js +1 -1
  31. package/dist/shell/bottom-navbar.js.map +1 -1
  32. package/dist/ui/avatar.d.ts.map +1 -1
  33. package/dist/ui/avatar.js +44 -59
  34. package/dist/ui/avatar.js.map +1 -1
  35. package/dist/ui/badge.d.ts +2 -0
  36. package/dist/ui/badge.d.ts.map +1 -1
  37. package/dist/ui/button.js +4 -4
  38. package/dist/ui/button.js.map +1 -1
  39. package/dist/ui/combobox.js +1 -1
  40. package/dist/ui/combobox.js.map +1 -1
  41. package/dist/ui/dot.d.ts.map +1 -1
  42. package/dist/ui/dot.js +23 -31
  43. package/dist/ui/dot.js.map +1 -1
  44. package/dist/ui/slider.js +1 -1
  45. package/dist/ui/slider.js.map +1 -1
  46. package/dist/ui/stat-card.d.ts +2 -0
  47. package/dist/ui/stat-card.d.ts.map +1 -1
  48. package/dist/ui/stat-card.js +92 -124
  49. package/dist/ui/stat-card.js.map +1 -1
  50. package/llms.txt +1 -1
  51. package/mcp-manifest.json +1 -1
  52. package/package.json +1 -1
  53. package/skill/SKILL.md +1 -1
  54. package/skill/references/components.md +1 -1
@@ -302,10 +302,7 @@ var z = C.memo(function({ data: e }) {
302
302
  })
303
303
  }, e.label) : /* @__PURE__ */ w(k.div, {
304
304
  className: "flex-1 min-w-[140px]",
305
- initial: {
306
- opacity: 0,
307
- y: 8
308
- },
305
+ initial: { y: 8 },
309
306
  animate: {
310
307
  opacity: 1,
311
308
  y: 0
@@ -1 +1 @@
1
- {"version":3,"file":"success.js","names":[],"sources":["../../src/ai/blocks/block-table.tsx","../../src/ai/blocks/confirm.tsx","../../src/ai/blocks/divider.tsx","../../src/ai/blocks/info.tsx","../../src/ai/blocks/loading.tsx","../../src/ai/blocks/stat-row.tsx","../../src/ai/blocks/success.tsx"],"sourcesContent":["'use client'\n\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { useMotion } from '../../motion/motion-provider'\nimport { Badge } from '../../ui/badge'\nimport { springs } from '../../ui/lib/motion'\nimport { cn } from '../../ui/lib/utils'\nimport {\n Table,\n TableBody,\n TableCaption,\n TableCell,\n TableHead,\n TableHeader,\n TableRow,\n} from '../../ui/table'\nimport type { BlockComponentProps, BlockTableColumn,BlockTableData } from '../types'\nimport { BlockShell } from './block-shell'\n\ntype SortDir = 'asc' | 'desc' | null\n\nfunction renderCellValue(value: unknown, column: BlockTableColumn) {\n if (column.variant === 'badge') {\n if (value && typeof value === 'object' && 'label' in value) {\n const badgeObj = value as { label: string; color: string }\n return (\n <Badge variant=\"subtle\" size=\"sm\" color={badgeObj.color as 'default'}>\n {badgeObj.label}\n </Badge>\n )\n }\n return (\n <Badge variant=\"subtle\" size=\"sm\">\n {String(value ?? '')}\n </Badge>\n )\n }\n\n return String(value ?? '')\n}\n\nfunction sortRows(\n rows: Record<string, unknown>[],\n sortKey: string | null,\n sortDir: SortDir,\n): Record<string, unknown>[] {\n if (!sortKey || !sortDir) return rows\n return [...rows].sort((a, b) => {\n const aVal = a[sortKey]\n const bVal = b[sortKey]\n const aStr = String(aVal ?? '')\n const bStr = String(bVal ?? '')\n const aNum = Number(aVal)\n const bNum = Number(bVal)\n\n // If both are numeric, sort numerically\n if (!Number.isNaN(aNum) && !Number.isNaN(bNum)) {\n return sortDir === 'asc' ? aNum - bNum : bNum - aNum\n }\n\n // Otherwise sort lexicographically\n const cmp = aStr.localeCompare(bStr)\n return sortDir === 'asc' ? cmp : -cmp\n })\n}\n\nconst BlockTable = React.memo(function BlockTable({\n data,\n confidence,\n}: BlockComponentProps<BlockTableData>) {\n const { reducedMotion } = useMotion()\n const [sortKey, setSortKey] = React.useState<string | null>(null)\n const [sortDir, setSortDir] = React.useState<SortDir>(null)\n\n const handleHeaderClick = React.useCallback(\n (key: string) => {\n if (!data.sortable) return\n if (sortKey !== key) {\n setSortKey(key)\n setSortDir('asc')\n } else if (sortDir === 'asc') {\n setSortDir('desc')\n } else if (sortDir === 'desc') {\n setSortKey(null)\n setSortDir(null)\n }\n },\n [data.sortable, sortKey, sortDir],\n )\n\n const columns = data.columns ?? []\n const sortedRows = sortRows(data.rows ?? [], sortKey, sortDir)\n\n return (\n <BlockShell confidence={confidence} className=\"overflow-x-auto\">\n <Table>\n {data.caption && <TableCaption>{data.caption}</TableCaption>}\n <TableHeader>\n <TableRow>\n {columns.map((col) => {\n const isSorted = sortKey === col.key\n const ariaSort = data.sortable\n ? isSorted\n ? sortDir === 'asc'\n ? ('ascending' as const)\n : ('descending' as const)\n : ('none' as const)\n : undefined\n\n return (\n <TableHead\n key={col.key}\n role=\"columnheader\"\n className={cn(\n col.variant === 'number' && 'text-right',\n data.sortable && 'cursor-pointer select-none',\n )}\n tabIndex={data.sortable ? 0 : undefined}\n onClick={\n data.sortable\n ? () => handleHeaderClick(col.key)\n : undefined\n }\n onKeyDown={\n data.sortable\n ? (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault()\n handleHeaderClick(col.key)\n }\n }\n : undefined\n }\n aria-sort={ariaSort}\n >\n <span className=\"inline-flex items-center gap-1\">\n {col.label}\n {isSorted && sortDir === 'asc' && (\n <span aria-hidden=\"true\">&#9650;</span>\n )}\n {isSorted && sortDir === 'desc' && (\n <span aria-hidden=\"true\">&#9660;</span>\n )}\n </span>\n </TableHead>\n )\n })}\n </TableRow>\n </TableHeader>\n <TableBody>\n {sortedRows.map((row, rowIndex) => {\n const rowKey =\n typeof row.id === 'string' || typeof row.id === 'number'\n ? String(row.id)\n : `row-${rowIndex}`\n\n const RowWrapper = reducedMotion ? 'tr' : motion.tr\n\n const motionProps = reducedMotion\n ? {}\n : {\n initial: { opacity: 0, y: 6 } as const,\n animate: { opacity: 1, y: 0 } as const,\n transition: { ...springs.responsive, delay: rowIndex * 0.03 },\n }\n\n return (\n <RowWrapper\n key={rowKey}\n className=\"hover:bg-surface-raised-hover transition-colors\"\n {...motionProps}\n >\n {columns.map((col) => (\n <TableCell\n key={col.key}\n className={cn(\n 'text-ds-sm py-ds-02b px-ds-04',\n col.variant === 'number' &&\n 'text-right tabular-nums font-medium',\n )}\n >\n {renderCellValue(row[col.key], col)}\n </TableCell>\n ))}\n </RowWrapper>\n )\n })}\n </TableBody>\n </Table>\n </BlockShell>\n )\n})\n\nBlockTable.displayName = 'BlockTable'\n\nexport { BlockTable }\n","'use client'\n\nimport * as React from 'react'\n\nimport { Button } from '../../ui/button'\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '../../ui/collapsible'\nimport type { BlockComponentProps, ConfirmBlockData } from '../types'\nimport { BlockShell } from './block-shell'\n\nconst ConfirmBlock = React.memo(function ConfirmBlock({\n data,\n confidence,\n onAction,\n}: BlockComponentProps<ConfirmBlockData>) {\n const handleConfirm = React.useCallback(() => {\n onAction?.(data.actionId, 'confirm')\n }, [data.actionId, onAction])\n\n const handleCancel = React.useCallback(() => {\n onAction?.(data.actionId, 'cancel')\n }, [data.actionId, onAction])\n\n return (\n <BlockShell confidence={confidence}>\n {data.description && (\n <p className=\"text-ds-sm text-surface-fg-muted mb-3\">\n {data.description}\n </p>\n )}\n\n <div className=\"flex items-center gap-3\">\n <Button\n variant=\"solid\"\n color={data.destructive ? 'error' : undefined}\n onClick={handleConfirm}\n >\n {data.label}\n </Button>\n <Button variant=\"ghost\" onClick={handleCancel}>\n Cancel\n </Button>\n </div>\n\n {data.rationale && (\n <Collapsible className=\"mt-3\">\n <CollapsibleTrigger asChild>\n <button\n type=\"button\"\n className=\"text-ds-xs text-surface-fg-subtle underline cursor-pointer\"\n >\n Why this action?\n </button>\n </CollapsibleTrigger>\n <CollapsibleContent>\n <p className=\"text-ds-sm text-surface-fg-muted mt-2 p-3 bg-surface-raised rounded-surface\">\n {data.rationale}\n </p>\n </CollapsibleContent>\n </Collapsible>\n )}\n </BlockShell>\n )\n})\n\nConfirmBlock.displayName = 'ConfirmBlock'\n\nexport { ConfirmBlock }\n","'use client'\n\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { useMotion } from '../../motion/motion-provider'\nimport { tweens } from '../../ui/lib/motion'\nimport { Separator } from '../../ui/separator'\nimport type { BlockComponentProps } from '../types'\n\nconst DividerBlock = React.memo(function DividerBlock(\n _props: BlockComponentProps<Record<string, never>>,\n) {\n const { reducedMotion } = useMotion()\n\n if (reducedMotion) {\n return <Separator />\n }\n\n return (\n <motion.div\n initial={{ scaleX: 0 }}\n animate={{ scaleX: 1 }}\n style={{ originX: 0.5 }}\n transition={tweens.elegant}\n >\n <Separator />\n </motion.div>\n )\n})\n\nDividerBlock.displayName = 'DividerBlock'\n\nexport { DividerBlock }\n","'use client'\n\nimport * as React from 'react'\n\nimport { Alert } from '../../ui/alert'\nimport type { BlockComponentProps } from '../types'\n\nconst InfoBlock = React.memo(function InfoBlock({\n data,\n}: BlockComponentProps<{ message: string }>) {\n return (\n <Alert color=\"info\" variant=\"subtle\" role=\"status\">\n {data.message}\n </Alert>\n )\n})\n\nInfoBlock.displayName = 'InfoBlock'\n\nexport { InfoBlock }\n","'use client'\n\nimport {\n IconCircle,\n IconCircleCheck,\n IconCircleX,\n} from '@tabler/icons-react'\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { useMotion } from '../../motion/motion-provider'\nimport { Icon } from '../../ui/icon'\nimport { durations } from '../../ui/lib/motion'\nimport { cn } from '../../ui/lib/utils'\nimport { Skeleton } from '../../ui/skeleton'\nimport type { BlockComponentProps, LoadingBlockData, ProcessingStep } from '../types'\n\n/** Spinning indicator for active steps */\nfunction StepSpinner() {\n return (\n <motion.span\n className=\"inline-block h-4 w-4 rounded-pill border-2 border-current border-t-transparent text-accent-9\"\n animate={{ rotate: 360 }}\n transition={{ repeat: Infinity, duration: 1, ease: 'linear' }}\n aria-hidden=\"true\"\n data-testid=\"step-spinner\"\n />\n )\n}\n\n/** Icon for a processing step based on its status */\nfunction StepIcon({ status }: { status: ProcessingStep['status'] }) {\n switch (status) {\n case 'done':\n return (\n <span data-testid=\"step-icon-done\">\n <Icon icon={IconCircleCheck} size=\"sm\" className=\"text-success-11\" />\n </span>\n )\n case 'active':\n return <StepSpinner />\n case 'error':\n return (\n <span data-testid=\"step-icon-error\">\n <Icon icon={IconCircleX} size=\"sm\" className=\"text-error-11\" />\n </span>\n )\n case 'pending':\n default:\n return (\n <span data-testid=\"step-icon-pending\">\n <Icon icon={IconCircle} size=\"sm\" className=\"text-surface-fg-subtle opacity-50\" />\n </span>\n )\n }\n}\n\nconst LoadingBlock = React.memo(function LoadingBlock({\n data,\n}: BlockComponentProps<LoadingBlockData>) {\n const { reducedMotion } = useMotion()\n const isReduced = reducedMotion\n\n // Mode A: Skeleton lines\n if (data.lines != null) {\n const lineCount = Math.max(1, data.lines)\n return (\n <div\n role=\"status\"\n aria-busy=\"true\"\n aria-label=\"Loading\"\n className=\"flex flex-col gap-2\"\n >\n {Array.from({ length: lineCount }).map((_, i) => (\n <Skeleton\n key={i}\n animation=\"shimmer\"\n className={cn(\n 'h-4',\n i === lineCount - 1 ? 'w-3/5' : 'w-full',\n )}\n />\n ))}\n <span className=\"sr-only\">Loading</span>\n </div>\n )\n }\n\n // Mode B: Processing steps\n if (data.steps) {\n return (\n <div\n role=\"status\"\n aria-busy=\"true\"\n aria-label=\"Processing\"\n className=\"flex flex-col gap-2\"\n >\n {data.steps.map((step, index) => (\n <motion.div\n key={step.id}\n className=\"flex items-center gap-2\"\n initial={isReduced ? undefined : { opacity: 0, x: -8 }}\n animate={{ opacity: 1, x: 0 }}\n transition={\n isReduced\n ? { duration: 0 }\n : { duration: durations.moderate01b, delay: index * 0.06 }\n }\n >\n <StepIcon status={step.status} />\n <span\n className={cn(\n 'text-ds-sm',\n step.status === 'done' || step.status === 'active'\n ? 'text-surface-fg'\n : 'text-surface-fg-subtle',\n )}\n >\n {step.label}\n </span>\n </motion.div>\n ))}\n <span className=\"sr-only\">Processing</span>\n </div>\n )\n }\n\n // Fallback: empty status container\n return (\n <div role=\"status\" aria-busy=\"true\" aria-label=\"Loading\">\n <span className=\"sr-only\">Loading</span>\n </div>\n )\n})\n\nLoadingBlock.displayName = 'LoadingBlock'\n\nexport { LoadingBlock }\n","'use client'\n\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { useMotion } from '../../motion/motion-provider'\nimport { springs } from '../../ui/lib/motion'\nimport { StatCard } from '../../ui/stat-card'\nimport type { BlockComponentProps, StatRowBlockData } from '../types'\n\nconst StatRowBlock = React.memo(function StatRowBlock({\n data,\n}: BlockComponentProps<StatRowBlockData>) {\n const { reducedMotion } = useMotion()\n const stats = data.stats ?? []\n\n if (stats.length === 0) return null\n\n return (\n <div className=\"flex flex-wrap gap-ds-05\">\n {stats.map((stat, index) => {\n const delta = stat.change\n ? {\n value: stat.change.value,\n direction: stat.change.direction,\n }\n : undefined\n\n if (reducedMotion) {\n return (\n <div key={stat.label} className=\"flex-1 min-w-[140px]\">\n <StatCard\n label={stat.label}\n value={stat.value}\n delta={delta}\n />\n </div>\n )\n }\n\n return (\n <motion.div\n key={stat.label}\n className=\"flex-1 min-w-[140px]\"\n initial={{ opacity: 0, y: 8 }}\n animate={{ opacity: 1, y: 0 }}\n transition={{ ...springs.responsive, delay: index * 0.08 }}\n >\n <StatCard\n label={stat.label}\n value={stat.value}\n delta={delta}\n />\n </motion.div>\n )\n })}\n </div>\n )\n})\n\nStatRowBlock.displayName = 'StatRowBlock'\n\nexport { StatRowBlock }\n","'use client'\n\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { useMotion } from '../../motion/motion-provider'\nimport { Alert } from '../../ui/alert'\nimport { Button } from '../../ui/button'\nimport type { BlockComponentProps, SuccessBlockData } from '../types'\nimport { BlockShell } from './block-shell'\n\nconst DEFAULT_UNDO_TIMEOUT = 5000\n\nconst SuccessBlock = React.memo(function SuccessBlock({\n data,\n blockId,\n confidence,\n onAction,\n}: BlockComponentProps<SuccessBlockData>) {\n const { reducedMotion } = useMotion()\n const isReduced = reducedMotion\n const undoTimeout = data.undoTimeout ?? DEFAULT_UNDO_TIMEOUT\n const [remaining, setRemaining] = React.useState(undoTimeout)\n const [showUndo, setShowUndo] = React.useState(!!data.undoable)\n\n React.useEffect(() => {\n if (!data.undoable) return\n\n const interval = setInterval(() => {\n setRemaining((prev) => {\n const next = prev - 100\n if (next <= 0) {\n clearInterval(interval)\n setShowUndo(false)\n return 0\n }\n return next\n })\n }, 100)\n\n return () => clearInterval(interval)\n }, [data.undoable, undoTimeout])\n\n const handleUndo = React.useCallback(() => {\n onAction?.(blockId || 'unknown', 'undo')\n }, [blockId, onAction])\n\n const remainingSeconds = Math.ceil(remaining / 1000)\n\n // Countdown ring dimensions\n const ringSize = 20\n const ringStroke = 2\n const ringRadius = (ringSize - ringStroke) / 2\n const ringCircumference = 2 * Math.PI * ringRadius\n\n return (\n <BlockShell confidence={confidence}>\n <Alert\n color=\"success\"\n variant=\"subtle\"\n title={data.title}\n >\n {data.message}\n </Alert>\n\n {showUndo && data.undoable && (\n <div className=\"mt-2 flex items-center gap-2\">\n <Button\n variant=\"ghost\"\n size=\"sm\"\n onClick={handleUndo}\n aria-label={`Undo action, ${remainingSeconds} seconds remaining`}\n >\n <span className=\"flex items-center gap-1.5\">\n <svg\n width={ringSize}\n height={ringSize}\n viewBox={`0 0 ${ringSize} ${ringSize}`}\n className=\"shrink-0 -rotate-90\"\n aria-hidden=\"true\"\n >\n <circle\n cx={ringSize / 2}\n cy={ringSize / 2}\n r={ringRadius}\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={ringStroke}\n opacity={0.2}\n />\n <motion.circle\n cx={ringSize / 2}\n cy={ringSize / 2}\n r={ringRadius}\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={ringStroke}\n strokeDasharray={ringCircumference}\n initial={isReduced ? undefined : { strokeDashoffset: 0 }}\n animate={{\n strokeDashoffset: ringCircumference,\n }}\n transition={\n isReduced\n ? { duration: 0 }\n : {\n duration: undoTimeout / 1000,\n ease: 'linear',\n }\n }\n />\n </svg>\n Undo\n </span>\n </Button>\n </div>\n )}\n\n </BlockShell>\n )\n})\n\nSuccessBlock.displayName = 'SuccessBlock'\n\nexport { SuccessBlock }\n"],"mappings":"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"}
1
+ {"version":3,"file":"success.js","names":[],"sources":["../../src/ai/blocks/block-table.tsx","../../src/ai/blocks/confirm.tsx","../../src/ai/blocks/divider.tsx","../../src/ai/blocks/info.tsx","../../src/ai/blocks/loading.tsx","../../src/ai/blocks/stat-row.tsx","../../src/ai/blocks/success.tsx"],"sourcesContent":["'use client'\n\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { useMotion } from '../../motion/motion-provider'\nimport { Badge } from '../../ui/badge'\nimport { springs } from '../../ui/lib/motion'\nimport { cn } from '../../ui/lib/utils'\nimport {\n Table,\n TableBody,\n TableCaption,\n TableCell,\n TableHead,\n TableHeader,\n TableRow,\n} from '../../ui/table'\nimport type { BlockComponentProps, BlockTableColumn,BlockTableData } from '../types'\nimport { BlockShell } from './block-shell'\n\ntype SortDir = 'asc' | 'desc' | null\n\nfunction renderCellValue(value: unknown, column: BlockTableColumn) {\n if (column.variant === 'badge') {\n if (value && typeof value === 'object' && 'label' in value) {\n const badgeObj = value as { label: string; color: string }\n return (\n <Badge variant=\"subtle\" size=\"sm\" color={badgeObj.color as 'default'}>\n {badgeObj.label}\n </Badge>\n )\n }\n return (\n <Badge variant=\"subtle\" size=\"sm\">\n {String(value ?? '')}\n </Badge>\n )\n }\n\n return String(value ?? '')\n}\n\nfunction sortRows(\n rows: Record<string, unknown>[],\n sortKey: string | null,\n sortDir: SortDir,\n): Record<string, unknown>[] {\n if (!sortKey || !sortDir) return rows\n return [...rows].sort((a, b) => {\n const aVal = a[sortKey]\n const bVal = b[sortKey]\n const aStr = String(aVal ?? '')\n const bStr = String(bVal ?? '')\n const aNum = Number(aVal)\n const bNum = Number(bVal)\n\n // If both are numeric, sort numerically\n if (!Number.isNaN(aNum) && !Number.isNaN(bNum)) {\n return sortDir === 'asc' ? aNum - bNum : bNum - aNum\n }\n\n // Otherwise sort lexicographically\n const cmp = aStr.localeCompare(bStr)\n return sortDir === 'asc' ? cmp : -cmp\n })\n}\n\nconst BlockTable = React.memo(function BlockTable({\n data,\n confidence,\n}: BlockComponentProps<BlockTableData>) {\n const { reducedMotion } = useMotion()\n const [sortKey, setSortKey] = React.useState<string | null>(null)\n const [sortDir, setSortDir] = React.useState<SortDir>(null)\n\n const handleHeaderClick = React.useCallback(\n (key: string) => {\n if (!data.sortable) return\n if (sortKey !== key) {\n setSortKey(key)\n setSortDir('asc')\n } else if (sortDir === 'asc') {\n setSortDir('desc')\n } else if (sortDir === 'desc') {\n setSortKey(null)\n setSortDir(null)\n }\n },\n [data.sortable, sortKey, sortDir],\n )\n\n const columns = data.columns ?? []\n const sortedRows = sortRows(data.rows ?? [], sortKey, sortDir)\n\n return (\n <BlockShell confidence={confidence} className=\"overflow-x-auto\">\n <Table>\n {data.caption && <TableCaption>{data.caption}</TableCaption>}\n <TableHeader>\n <TableRow>\n {columns.map((col) => {\n const isSorted = sortKey === col.key\n const ariaSort = data.sortable\n ? isSorted\n ? sortDir === 'asc'\n ? ('ascending' as const)\n : ('descending' as const)\n : ('none' as const)\n : undefined\n\n return (\n <TableHead\n key={col.key}\n role=\"columnheader\"\n className={cn(\n col.variant === 'number' && 'text-right',\n data.sortable && 'cursor-pointer select-none',\n )}\n tabIndex={data.sortable ? 0 : undefined}\n onClick={\n data.sortable\n ? () => handleHeaderClick(col.key)\n : undefined\n }\n onKeyDown={\n data.sortable\n ? (e: React.KeyboardEvent) => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault()\n handleHeaderClick(col.key)\n }\n }\n : undefined\n }\n aria-sort={ariaSort}\n >\n <span className=\"inline-flex items-center gap-1\">\n {col.label}\n {isSorted && sortDir === 'asc' && (\n <span aria-hidden=\"true\">&#9650;</span>\n )}\n {isSorted && sortDir === 'desc' && (\n <span aria-hidden=\"true\">&#9660;</span>\n )}\n </span>\n </TableHead>\n )\n })}\n </TableRow>\n </TableHeader>\n <TableBody>\n {sortedRows.map((row, rowIndex) => {\n const rowKey =\n typeof row.id === 'string' || typeof row.id === 'number'\n ? String(row.id)\n : `row-${rowIndex}`\n\n const RowWrapper = reducedMotion ? 'tr' : motion.tr\n\n const motionProps = reducedMotion\n ? {}\n : {\n initial: { opacity: 0, y: 6 } as const,\n animate: { opacity: 1, y: 0 } as const,\n transition: { ...springs.responsive, delay: rowIndex * 0.03 },\n }\n\n return (\n <RowWrapper\n key={rowKey}\n className=\"hover:bg-surface-raised-hover transition-colors\"\n {...motionProps}\n >\n {columns.map((col) => (\n <TableCell\n key={col.key}\n className={cn(\n 'text-ds-sm py-ds-02b px-ds-04',\n col.variant === 'number' &&\n 'text-right tabular-nums font-medium',\n )}\n >\n {renderCellValue(row[col.key], col)}\n </TableCell>\n ))}\n </RowWrapper>\n )\n })}\n </TableBody>\n </Table>\n </BlockShell>\n )\n})\n\nBlockTable.displayName = 'BlockTable'\n\nexport { BlockTable }\n","'use client'\n\nimport * as React from 'react'\n\nimport { Button } from '../../ui/button'\nimport {\n Collapsible,\n CollapsibleContent,\n CollapsibleTrigger,\n} from '../../ui/collapsible'\nimport type { BlockComponentProps, ConfirmBlockData } from '../types'\nimport { BlockShell } from './block-shell'\n\nconst ConfirmBlock = React.memo(function ConfirmBlock({\n data,\n confidence,\n onAction,\n}: BlockComponentProps<ConfirmBlockData>) {\n const handleConfirm = React.useCallback(() => {\n onAction?.(data.actionId, 'confirm')\n }, [data.actionId, onAction])\n\n const handleCancel = React.useCallback(() => {\n onAction?.(data.actionId, 'cancel')\n }, [data.actionId, onAction])\n\n return (\n <BlockShell confidence={confidence}>\n {data.description && (\n <p className=\"text-ds-sm text-surface-fg-muted mb-3\">\n {data.description}\n </p>\n )}\n\n <div className=\"flex items-center gap-3\">\n <Button\n variant=\"solid\"\n color={data.destructive ? 'error' : undefined}\n onClick={handleConfirm}\n >\n {data.label}\n </Button>\n <Button variant=\"ghost\" onClick={handleCancel}>\n Cancel\n </Button>\n </div>\n\n {data.rationale && (\n <Collapsible className=\"mt-3\">\n <CollapsibleTrigger asChild>\n <button\n type=\"button\"\n className=\"text-ds-xs text-surface-fg-subtle underline cursor-pointer\"\n >\n Why this action?\n </button>\n </CollapsibleTrigger>\n <CollapsibleContent>\n <p className=\"text-ds-sm text-surface-fg-muted mt-2 p-3 bg-surface-raised rounded-surface\">\n {data.rationale}\n </p>\n </CollapsibleContent>\n </Collapsible>\n )}\n </BlockShell>\n )\n})\n\nConfirmBlock.displayName = 'ConfirmBlock'\n\nexport { ConfirmBlock }\n","'use client'\n\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { useMotion } from '../../motion/motion-provider'\nimport { tweens } from '../../ui/lib/motion'\nimport { Separator } from '../../ui/separator'\nimport type { BlockComponentProps } from '../types'\n\nconst DividerBlock = React.memo(function DividerBlock(\n _props: BlockComponentProps<Record<string, never>>,\n) {\n const { reducedMotion } = useMotion()\n\n if (reducedMotion) {\n return <Separator />\n }\n\n return (\n <motion.div\n initial={{ scaleX: 0 }}\n animate={{ scaleX: 1 }}\n style={{ originX: 0.5 }}\n transition={tweens.elegant}\n >\n <Separator />\n </motion.div>\n )\n})\n\nDividerBlock.displayName = 'DividerBlock'\n\nexport { DividerBlock }\n","'use client'\n\nimport * as React from 'react'\n\nimport { Alert } from '../../ui/alert'\nimport type { BlockComponentProps } from '../types'\n\nconst InfoBlock = React.memo(function InfoBlock({\n data,\n}: BlockComponentProps<{ message: string }>) {\n return (\n <Alert color=\"info\" variant=\"subtle\" role=\"status\">\n {data.message}\n </Alert>\n )\n})\n\nInfoBlock.displayName = 'InfoBlock'\n\nexport { InfoBlock }\n","'use client'\n\nimport {\n IconCircle,\n IconCircleCheck,\n IconCircleX,\n} from '@tabler/icons-react'\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { useMotion } from '../../motion/motion-provider'\nimport { Icon } from '../../ui/icon'\nimport { durations } from '../../ui/lib/motion'\nimport { cn } from '../../ui/lib/utils'\nimport { Skeleton } from '../../ui/skeleton'\nimport type { BlockComponentProps, LoadingBlockData, ProcessingStep } from '../types'\n\n/** Spinning indicator for active steps */\nfunction StepSpinner() {\n return (\n <motion.span\n className=\"inline-block h-4 w-4 rounded-pill border-2 border-current border-t-transparent text-accent-9\"\n animate={{ rotate: 360 }}\n transition={{ repeat: Infinity, duration: 1, ease: 'linear' }}\n aria-hidden=\"true\"\n data-testid=\"step-spinner\"\n />\n )\n}\n\n/** Icon for a processing step based on its status */\nfunction StepIcon({ status }: { status: ProcessingStep['status'] }) {\n switch (status) {\n case 'done':\n return (\n <span data-testid=\"step-icon-done\">\n <Icon icon={IconCircleCheck} size=\"sm\" className=\"text-success-11\" />\n </span>\n )\n case 'active':\n return <StepSpinner />\n case 'error':\n return (\n <span data-testid=\"step-icon-error\">\n <Icon icon={IconCircleX} size=\"sm\" className=\"text-error-11\" />\n </span>\n )\n case 'pending':\n default:\n return (\n <span data-testid=\"step-icon-pending\">\n <Icon icon={IconCircle} size=\"sm\" className=\"text-surface-fg-subtle opacity-50\" />\n </span>\n )\n }\n}\n\nconst LoadingBlock = React.memo(function LoadingBlock({\n data,\n}: BlockComponentProps<LoadingBlockData>) {\n const { reducedMotion } = useMotion()\n const isReduced = reducedMotion\n\n // Mode A: Skeleton lines\n if (data.lines != null) {\n const lineCount = Math.max(1, data.lines)\n return (\n <div\n role=\"status\"\n aria-busy=\"true\"\n aria-label=\"Loading\"\n className=\"flex flex-col gap-2\"\n >\n {Array.from({ length: lineCount }).map((_, i) => (\n <Skeleton\n key={i}\n animation=\"shimmer\"\n className={cn(\n 'h-4',\n i === lineCount - 1 ? 'w-3/5' : 'w-full',\n )}\n />\n ))}\n <span className=\"sr-only\">Loading</span>\n </div>\n )\n }\n\n // Mode B: Processing steps\n if (data.steps) {\n return (\n <div\n role=\"status\"\n aria-busy=\"true\"\n aria-label=\"Processing\"\n className=\"flex flex-col gap-2\"\n >\n {data.steps.map((step, index) => (\n <motion.div\n key={step.id}\n className=\"flex items-center gap-2\"\n initial={isReduced ? undefined : { opacity: 0, x: -8 }}\n animate={{ opacity: 1, x: 0 }}\n transition={\n isReduced\n ? { duration: 0 }\n : { duration: durations.moderate01b, delay: index * 0.06 }\n }\n >\n <StepIcon status={step.status} />\n <span\n className={cn(\n 'text-ds-sm',\n step.status === 'done' || step.status === 'active'\n ? 'text-surface-fg'\n : 'text-surface-fg-subtle',\n )}\n >\n {step.label}\n </span>\n </motion.div>\n ))}\n <span className=\"sr-only\">Processing</span>\n </div>\n )\n }\n\n // Fallback: empty status container\n return (\n <div role=\"status\" aria-busy=\"true\" aria-label=\"Loading\">\n <span className=\"sr-only\">Loading</span>\n </div>\n )\n})\n\nLoadingBlock.displayName = 'LoadingBlock'\n\nexport { LoadingBlock }\n","'use client'\n\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { useMotion } from '../../motion/motion-provider'\nimport { springs } from '../../ui/lib/motion'\nimport { StatCard } from '../../ui/stat-card'\nimport type { BlockComponentProps, StatRowBlockData } from '../types'\n\nconst StatRowBlock = React.memo(function StatRowBlock({\n data,\n}: BlockComponentProps<StatRowBlockData>) {\n const { reducedMotion } = useMotion()\n const stats = data.stats ?? []\n\n if (stats.length === 0) return null\n\n return (\n <div className=\"flex flex-wrap gap-ds-05\">\n {stats.map((stat, index) => {\n const delta = stat.change\n ? {\n value: stat.change.value,\n direction: stat.change.direction,\n }\n : undefined\n\n if (reducedMotion) {\n return (\n <div key={stat.label} className=\"flex-1 min-w-[140px]\">\n <StatCard\n label={stat.label}\n value={stat.value}\n delta={delta}\n />\n </div>\n )\n }\n\n return (\n <motion.div\n key={stat.label}\n className=\"flex-1 min-w-[140px]\"\n initial={{ y: 8 }}\n animate={{ opacity: 1, y: 0 }}\n transition={{ ...springs.responsive, delay: index * 0.08 }}\n >\n <StatCard\n label={stat.label}\n value={stat.value}\n delta={delta}\n />\n </motion.div>\n )\n })}\n </div>\n )\n})\n\nStatRowBlock.displayName = 'StatRowBlock'\n\nexport { StatRowBlock }\n","'use client'\n\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { useMotion } from '../../motion/motion-provider'\nimport { Alert } from '../../ui/alert'\nimport { Button } from '../../ui/button'\nimport type { BlockComponentProps, SuccessBlockData } from '../types'\nimport { BlockShell } from './block-shell'\n\nconst DEFAULT_UNDO_TIMEOUT = 5000\n\nconst SuccessBlock = React.memo(function SuccessBlock({\n data,\n blockId,\n confidence,\n onAction,\n}: BlockComponentProps<SuccessBlockData>) {\n const { reducedMotion } = useMotion()\n const isReduced = reducedMotion\n const undoTimeout = data.undoTimeout ?? DEFAULT_UNDO_TIMEOUT\n const [remaining, setRemaining] = React.useState(undoTimeout)\n const [showUndo, setShowUndo] = React.useState(!!data.undoable)\n\n React.useEffect(() => {\n if (!data.undoable) return\n\n const interval = setInterval(() => {\n setRemaining((prev) => {\n const next = prev - 100\n if (next <= 0) {\n clearInterval(interval)\n setShowUndo(false)\n return 0\n }\n return next\n })\n }, 100)\n\n return () => clearInterval(interval)\n }, [data.undoable, undoTimeout])\n\n const handleUndo = React.useCallback(() => {\n onAction?.(blockId || 'unknown', 'undo')\n }, [blockId, onAction])\n\n const remainingSeconds = Math.ceil(remaining / 1000)\n\n // Countdown ring dimensions\n const ringSize = 20\n const ringStroke = 2\n const ringRadius = (ringSize - ringStroke) / 2\n const ringCircumference = 2 * Math.PI * ringRadius\n\n return (\n <BlockShell confidence={confidence}>\n <Alert\n color=\"success\"\n variant=\"subtle\"\n title={data.title}\n >\n {data.message}\n </Alert>\n\n {showUndo && data.undoable && (\n <div className=\"mt-2 flex items-center gap-2\">\n <Button\n variant=\"ghost\"\n size=\"sm\"\n onClick={handleUndo}\n aria-label={`Undo action, ${remainingSeconds} seconds remaining`}\n >\n <span className=\"flex items-center gap-1.5\">\n <svg\n width={ringSize}\n height={ringSize}\n viewBox={`0 0 ${ringSize} ${ringSize}`}\n className=\"shrink-0 -rotate-90\"\n aria-hidden=\"true\"\n >\n <circle\n cx={ringSize / 2}\n cy={ringSize / 2}\n r={ringRadius}\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={ringStroke}\n opacity={0.2}\n />\n <motion.circle\n cx={ringSize / 2}\n cy={ringSize / 2}\n r={ringRadius}\n fill=\"none\"\n stroke=\"currentColor\"\n strokeWidth={ringStroke}\n strokeDasharray={ringCircumference}\n initial={isReduced ? undefined : { strokeDashoffset: 0 }}\n animate={{\n strokeDashoffset: ringCircumference,\n }}\n transition={\n isReduced\n ? { duration: 0 }\n : {\n duration: undoTimeout / 1000,\n ease: 'linear',\n }\n }\n />\n </svg>\n Undo\n </span>\n </Button>\n </div>\n )}\n\n </BlockShell>\n )\n})\n\nSuccessBlock.displayName = 'SuccessBlock'\n\nexport { SuccessBlock }\n"],"mappings":"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"}
@@ -52,10 +52,7 @@ var y = m.forwardRef(({ blocks: n, onAction: a, customBlocks: o, staggerDelay: s
52
52
  type: t.type
53
53
  }), o = t.id ?? `${t.type}-${n}`;
54
54
  return d ? /* @__PURE__ */ h("div", { children: a }, o) : /* @__PURE__ */ h(g.div, {
55
- initial: {
56
- opacity: 0,
57
- y: 12
58
- },
55
+ initial: { y: 12 },
59
56
  animate: {
60
57
  opacity: 1,
61
58
  y: 0
@@ -1 +1 @@
1
- {"version":3,"file":"block-renderer.js","names":[],"sources":["../../src/ai/block-renderer.tsx"],"sourcesContent":["'use client'\n\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { useMotion } from '../motion/motion-provider'\nimport { Alert } from '../ui/alert'\nimport { springs } from '../ui/lib/motion'\nimport { cn } from '../ui/lib/utils'\nimport { useAICommand } from './ai-command-provider'\nimport { BlockTable } from './blocks/block-table'\nimport { ConfirmBlock } from './blocks/confirm'\nimport { DividerBlock } from './blocks/divider'\nimport { ErrorBlock } from './blocks/error'\nimport { InfoBlock } from './blocks/info'\nimport { LoadingBlock } from './blocks/loading'\nimport { StatRowBlock } from './blocks/stat-row'\nimport { SuccessBlock } from './blocks/success'\n// Import all built-in blocks\nimport { TextBlock } from './blocks/text'\nimport type { Block, BlockComponentProps } from './types'\n\nconst BUILT_IN_BLOCKS: Record<string, React.ComponentType<BlockComponentProps<any>>> = {\n text: TextBlock,\n table: BlockTable,\n confirm: ConfirmBlock,\n success: SuccessBlock,\n error: ErrorBlock,\n info: InfoBlock,\n loading: LoadingBlock,\n divider: DividerBlock,\n stat_row: StatRowBlock,\n}\n\nfunction FallbackBlock({ data, type }: { data: Record<string, unknown>; type: string }) {\n return (\n <Alert color=\"info\" variant=\"subtle\" title={`Unknown block type: ${type}`}>\n <pre className=\"mt-2 text-ds-xs whitespace-pre-wrap\">\n {JSON.stringify(data, null, 2)}\n </pre>\n </Alert>\n )\n}\n\nexport interface BlockRendererProps {\n blocks: Block[]\n onAction?: (actionId: string, type: 'confirm' | 'cancel' | 'undo') => void\n customBlocks?: Record<string, React.ComponentType<BlockComponentProps<any>>>\n staggerDelay?: number\n className?: string\n}\n\nconst BlockRenderer = React.forwardRef<HTMLDivElement, BlockRendererProps>(({\n blocks,\n onAction,\n customBlocks,\n staggerDelay = 50,\n className,\n}, ref) => {\n const ctx = useAICommand()\n const { reducedMotion } = useMotion()\n\n // Merge custom blocks: prop wins over context\n const mergedCustomBlocks = React.useMemo(() => {\n const contextBlocks = ctx?.customBlocks ?? {}\n return { ...contextBlocks, ...customBlocks }\n }, [ctx?.customBlocks, customBlocks])\n\n // Resolve onAction: prop wins over context\n const resolvedOnAction = onAction ?? ctx?.onAction\n\n return (\n <div ref={ref} className={cn('flex flex-col gap-ds-04', className)}>\n {blocks.map((block, index) => {\n const Component =\n mergedCustomBlocks[block.type] ??\n BUILT_IN_BLOCKS[block.type] ??\n null\n\n const blockProps: BlockComponentProps<any> = {\n data: block.data,\n blockId: block.id,\n confidence: block.confidence,\n onAction: resolvedOnAction,\n }\n\n const content = Component ? (\n <Component {...blockProps} />\n ) : (\n <FallbackBlock data={block.data} type={block.type} />\n )\n\n const key = block.id ?? `${block.type}-${index}`\n\n if (reducedMotion) {\n return <div key={key}>{content}</div>\n }\n\n return (\n <motion.div\n key={key}\n initial={{ opacity: 0, y: 12 }}\n animate={{ opacity: 1, y: 0 }}\n transition={{ ...springs.responsive, delay: index * (staggerDelay / 1000) }}\n >\n {content}\n </motion.div>\n )\n })}\n </div>\n )\n})\nBlockRenderer.displayName = 'BlockRenderer'\n\nexport { BlockRenderer }\n"],"mappings":";;;;;;;;;;;;;AAsBA,IAAM,IAAiF;CACrF,MAAM;CACN,OAAO;CACP,SAAS;CACT,SAAS;CACT,OAAO;CACP,MAAM;CACN,SAAS;CACT,SAAS;CACT,UAAU;CACX;AAED,SAAS,EAAc,EAAE,SAAM,WAAyD;AACtF,QACE,kBAAC,GAAD;EAAO,OAAM;EAAO,SAAQ;EAAS,OAAO,uBAAuB;YACjE,kBAAC,OAAD;GAAK,WAAU;aACZ,KAAK,UAAU,GAAM,MAAM,EAAE;GAC1B,CAAA;EACA,CAAA;;AAYZ,IAAM,IAAgB,EAAM,YAAgD,EAC1E,WACA,aACA,iBACA,kBAAe,IACf,gBACC,MAAQ;CACT,IAAM,IAAM,GAAc,EACpB,EAAE,qBAAkB,GAAW,EAG/B,IAAqB,EAAM,eAExB;EAAE,GADa,GAAK,gBAAgB,EAAE;EAClB,GAAG;EAAc,GAC3C,CAAC,GAAK,cAAc,EAAa,CAAC,EAG/B,IAAmB,KAAY,GAAK;AAE1C,QACE,kBAAC,OAAD;EAAU;EAAK,WAAW,EAAG,2BAA2B,EAAU;YAC/D,EAAO,KAAK,GAAO,MAAU;GAC5B,IAAM,IACJ,EAAmB,EAAM,SACzB,EAAgB,EAAM,SACtB,MAEI,IAAuC;IAC3C,MAAM,EAAM;IACZ,SAAS,EAAM;IACf,YAAY,EAAM;IAClB,UAAU;IACX,EAEK,IAAU,IACd,kBAAC,GAAD,EAAW,GAAI,GAAc,CAAA,GAE7B,kBAAC,GAAD;IAAe,MAAM,EAAM;IAAM,MAAM,EAAM;IAAQ,CAAA,EAGjD,IAAM,EAAM,MAAM,GAAG,EAAM,KAAK,GAAG;AAMzC,UAJI,IACK,kBAAC,OAAD,EAAA,UAAgB,GAAc,EAApB,EAAoB,GAIrC,kBAAC,EAAO,KAAR;IAEE,SAAS;KAAE,SAAS;KAAG,GAAG;KAAI;IAC9B,SAAS;KAAE,SAAS;KAAG,GAAG;KAAG;IAC7B,YAAY;KAAE,GAAG,EAAQ;KAAY,OAAgB,IAAe,MAAxB;KAA+B;cAE1E;IACU,EANN,EAMM;IAEf;EACE,CAAA;EAER;AACF,EAAc,cAAc"}
1
+ {"version":3,"file":"block-renderer.js","names":[],"sources":["../../src/ai/block-renderer.tsx"],"sourcesContent":["'use client'\n\nimport { motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { useMotion } from '../motion/motion-provider'\nimport { Alert } from '../ui/alert'\nimport { springs } from '../ui/lib/motion'\nimport { cn } from '../ui/lib/utils'\nimport { useAICommand } from './ai-command-provider'\nimport { BlockTable } from './blocks/block-table'\nimport { ConfirmBlock } from './blocks/confirm'\nimport { DividerBlock } from './blocks/divider'\nimport { ErrorBlock } from './blocks/error'\nimport { InfoBlock } from './blocks/info'\nimport { LoadingBlock } from './blocks/loading'\nimport { StatRowBlock } from './blocks/stat-row'\nimport { SuccessBlock } from './blocks/success'\n// Import all built-in blocks\nimport { TextBlock } from './blocks/text'\nimport type { Block, BlockComponentProps } from './types'\n\nconst BUILT_IN_BLOCKS: Record<string, React.ComponentType<BlockComponentProps<any>>> = {\n text: TextBlock,\n table: BlockTable,\n confirm: ConfirmBlock,\n success: SuccessBlock,\n error: ErrorBlock,\n info: InfoBlock,\n loading: LoadingBlock,\n divider: DividerBlock,\n stat_row: StatRowBlock,\n}\n\nfunction FallbackBlock({ data, type }: { data: Record<string, unknown>; type: string }) {\n return (\n <Alert color=\"info\" variant=\"subtle\" title={`Unknown block type: ${type}`}>\n <pre className=\"mt-2 text-ds-xs whitespace-pre-wrap\">\n {JSON.stringify(data, null, 2)}\n </pre>\n </Alert>\n )\n}\n\nexport interface BlockRendererProps {\n blocks: Block[]\n onAction?: (actionId: string, type: 'confirm' | 'cancel' | 'undo') => void\n customBlocks?: Record<string, React.ComponentType<BlockComponentProps<any>>>\n staggerDelay?: number\n className?: string\n}\n\nconst BlockRenderer = React.forwardRef<HTMLDivElement, BlockRendererProps>(({\n blocks,\n onAction,\n customBlocks,\n staggerDelay = 50,\n className,\n}, ref) => {\n const ctx = useAICommand()\n const { reducedMotion } = useMotion()\n\n // Merge custom blocks: prop wins over context\n const mergedCustomBlocks = React.useMemo(() => {\n const contextBlocks = ctx?.customBlocks ?? {}\n return { ...contextBlocks, ...customBlocks }\n }, [ctx?.customBlocks, customBlocks])\n\n // Resolve onAction: prop wins over context\n const resolvedOnAction = onAction ?? ctx?.onAction\n\n return (\n <div ref={ref} className={cn('flex flex-col gap-ds-04', className)}>\n {blocks.map((block, index) => {\n const Component =\n mergedCustomBlocks[block.type] ??\n BUILT_IN_BLOCKS[block.type] ??\n null\n\n const blockProps: BlockComponentProps<any> = {\n data: block.data,\n blockId: block.id,\n confidence: block.confidence,\n onAction: resolvedOnAction,\n }\n\n const content = Component ? (\n <Component {...blockProps} />\n ) : (\n <FallbackBlock data={block.data} type={block.type} />\n )\n\n const key = block.id ?? `${block.type}-${index}`\n\n if (reducedMotion) {\n return <div key={key}>{content}</div>\n }\n\n return (\n <motion.div\n key={key}\n initial={{ y: 12 }}\n animate={{ opacity: 1, y: 0 }}\n transition={{ ...springs.responsive, delay: index * (staggerDelay / 1000) }}\n >\n {content}\n </motion.div>\n )\n })}\n </div>\n )\n})\nBlockRenderer.displayName = 'BlockRenderer'\n\nexport { BlockRenderer }\n"],"mappings":";;;;;;;;;;;;;AAsBA,IAAM,IAAiF;CACrF,MAAM;CACN,OAAO;CACP,SAAS;CACT,SAAS;CACT,OAAO;CACP,MAAM;CACN,SAAS;CACT,SAAS;CACT,UAAU;CACX;AAED,SAAS,EAAc,EAAE,SAAM,WAAyD;AACtF,QACE,kBAAC,GAAD;EAAO,OAAM;EAAO,SAAQ;EAAS,OAAO,uBAAuB;YACjE,kBAAC,OAAD;GAAK,WAAU;aACZ,KAAK,UAAU,GAAM,MAAM,EAAE;GAC1B,CAAA;EACA,CAAA;;AAYZ,IAAM,IAAgB,EAAM,YAAgD,EAC1E,WACA,aACA,iBACA,kBAAe,IACf,gBACC,MAAQ;CACT,IAAM,IAAM,GAAc,EACpB,EAAE,qBAAkB,GAAW,EAG/B,IAAqB,EAAM,eAExB;EAAE,GADa,GAAK,gBAAgB,EAAE;EAClB,GAAG;EAAc,GAC3C,CAAC,GAAK,cAAc,EAAa,CAAC,EAG/B,IAAmB,KAAY,GAAK;AAE1C,QACE,kBAAC,OAAD;EAAU;EAAK,WAAW,EAAG,2BAA2B,EAAU;YAC/D,EAAO,KAAK,GAAO,MAAU;GAC5B,IAAM,IACJ,EAAmB,EAAM,SACzB,EAAgB,EAAM,SACtB,MAEI,IAAuC;IAC3C,MAAM,EAAM;IACZ,SAAS,EAAM;IACf,YAAY,EAAM;IAClB,UAAU;IACX,EAEK,IAAU,IACd,kBAAC,GAAD,EAAW,GAAI,GAAc,CAAA,GAE7B,kBAAC,GAAD;IAAe,MAAM,EAAM;IAAM,MAAM,EAAM;IAAQ,CAAA,EAGjD,IAAM,EAAM,MAAM,GAAG,EAAM,KAAK,GAAG;AAMzC,UAJI,IACK,kBAAC,OAAD,EAAA,UAAgB,GAAc,EAApB,EAAoB,GAIrC,kBAAC,EAAO,KAAR;IAEE,SAAS,EAAE,GAAG,IAAI;IAClB,SAAS;KAAE,SAAS;KAAG,GAAG;KAAG;IAC7B,YAAY;KAAE,GAAG,EAAQ;KAAY,OAAgB,IAAe,MAAxB;KAA+B;cAE1E;IACU,EANN,EAMM;IAEf;EACE,CAAA;EAER;AACF,EAAc,cAAc"}
@@ -1 +1 @@
1
- {"version":3,"file":"command-bar.d.ts","sourceRoot":"","sources":["../../src/ai/command-bar.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAA;AAkG5E;;;;;;;;GAQG;AACH,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC;IAE5D,wDAAwD;IACxD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,0FAA0F;IAC1F,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,YAAY,GAAG,WAAW,CAAA;IAGtD,gFAAgF;IAChF,MAAM,CAAC,EAAE,YAAY,EAAE,CAAA;IACvB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAG5B,sCAAsC;IACtC,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,UAAU,CAAA;IACxC,2EAA2E;IAC3E,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;IAC/B,4EAA4E;IAC5E,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,4DAA4D;IAC5D,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAG3B,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACtC,8DAA8D;IAC9D,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,KAAK,CAAA;IAGtC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAG3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B;AAqED,QAAA,MAAM,UAAU,qGAkpBf,CAAA;AAID,OAAO,EAAE,UAAU,EAAE,CAAA;AACrB,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,CAAA"}
1
+ {"version":3,"file":"command-bar.d.ts","sourceRoot":"","sources":["../../src/ai/command-bar.tsx"],"names":[],"mappings":"AAsBA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,KAAK,EAAE,YAAY,EAAE,WAAW,EAAE,MAAM,6BAA6B,CAAA;AAiF5E;;;;;;;;GAQG;AACH,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,KAAK,CAAC,qBAAqB,CAAC,KAAK,CAAC,EAAE,UAAU,CAAC;IAE5D,wDAAwD;IACxD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,0FAA0F;IAC1F,KAAK,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,YAAY,GAAG,WAAW,CAAA;IAGtD,gFAAgF;IAChF,MAAM,CAAC,EAAE,YAAY,EAAE,CAAA;IACvB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IAClC,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAG5B,sCAAsC;IACtC,OAAO,CAAC,EAAE,MAAM,GAAG,QAAQ,GAAG,UAAU,CAAA;IACxC,2EAA2E;IAC3E,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;IAC/B,4EAA4E;IAC5E,mBAAmB,CAAC,EAAE,MAAM,CAAA;IAC5B,6DAA6D;IAC7D,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,4DAA4D;IAC5D,KAAK,CAAC,EAAE,MAAM,EAAE,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAG3B,IAAI,CAAC,EAAE,OAAO,CAAA;IACd,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAA;IACtC,8DAA8D;IAC9D,UAAU,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,KAAK,CAAA;IAGtC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,SAAS,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IAG3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC3B;AAqED,QAAA,MAAM,UAAU,qGAkpBf,CAAA;AAID,OAAO,EAAE,UAAU,EAAE,CAAA;AACrB,YAAY,EAAE,YAAY,EAAE,WAAW,EAAE,CAAA"}
@@ -17,7 +17,7 @@ function me({ active: e, rounded: t, reducedMotion: n, children: i }) {
17
17
  return e ? n ? /* @__PURE__ */ d("div", {
18
18
  className: r("p-[1.5px] bg-accent-9", t),
19
19
  children: i
20
- }) : /* @__PURE__ */ f(m.div, {
20
+ }) : /* @__PURE__ */ d(m.div, {
21
21
  className: r("relative p-[1.5px]", t),
22
22
  style: {
23
23
  background: "linear-gradient(var(--gradient-angle, 0deg), #D33163, #9B5DE5, #C850C0, #D33163)",
@@ -33,38 +33,7 @@ function me({ active: e, rounded: t, reducedMotion: n, children: i }) {
33
33
  repeat: Infinity,
34
34
  ease: "linear"
35
35
  } },
36
- children: [/* @__PURE__ */ d(m.div, {
37
- className: r("absolute inset-0 -z-10", t),
38
- style: {
39
- background: "linear-gradient(var(--gradient-angle, 0deg), #D33163, #9B5DE5, #C850C0, #D33163)",
40
- backgroundSize: "300% 300%",
41
- filter: "blur(8px)"
42
- },
43
- animate: {
44
- opacity: [
45
- .3,
46
- .5,
47
- .3
48
- ],
49
- backgroundPosition: [
50
- "0% 0%",
51
- "100% 100%",
52
- "0% 0%"
53
- ]
54
- },
55
- transition: {
56
- opacity: {
57
- duration: 3,
58
- repeat: Infinity,
59
- ease: "easeInOut"
60
- },
61
- backgroundPosition: {
62
- duration: 4,
63
- repeat: Infinity,
64
- ease: "linear"
65
- }
66
- }
67
- }), i]
36
+ children: i
68
37
  }) : /* @__PURE__ */ d(u, { children: i });
69
38
  }
70
39
  function he(e) {
@@ -1 +1 @@
1
- {"version":3,"file":"command-bar.js","names":[],"sources":["../../src/ai/command-bar.tsx"],"sourcesContent":["'use client'\n\n/**\n * CommandBar -- Unified AI command interface.\n *\n * Three variants:\n * - hero: Full-featured inline bar with greeting, hints, placeholder rotation\n * - inline: Compact inline bar for embedding in panels/toolbars\n * - floating: Modal overlay (same pattern as CommandPalette) with global keybinding\n *\n * Supports both command-palette filtering (when `groups` provided) and\n * AI natural-language submission via `onSubmit`.\n */\nimport {\n IconArrowDown,\n IconArrowUp,\n IconCornerDownLeft,\n IconLoader2,\n IconSearch,\n IconX,\n} from '@tabler/icons-react'\nimport { AnimatePresence,motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport type { CommandGroup, CommandItem } from '../composed/command-palette'\nimport { useMotion } from '../motion/motion-provider'\nimport {\n Dialog,\n DialogContentRaw,\n DialogDescription,\n DialogOverlay,\n DialogPortal,\n DialogTitle,\n} from '../ui/dialog'\nimport { Icon } from '../ui/icon'\nimport { IconProvider } from '../ui/icon-context'\nimport { getIsMac, getModifierDisplay,matchesKeybinding } from '../ui/lib/keybinding'\nimport { springs,tweens } from '../ui/lib/motion'\nimport { normalizeIcon } from '../ui/lib/normalize-icon'\nimport { cn } from '../ui/lib/utils'\nimport { VisuallyHidden } from '../ui/visually-hidden'\n\n// -----------------------------------------------------------------------\n// GradientBorderWrap — animated gradient border during processing\n// -----------------------------------------------------------------------\n\n/**\n * Wraps the input row with an animated gradient border during processing.\n * Uses the Devalok brand palette (pink → purple → magenta) flowing around\n * the border. When inactive, renders children directly with no wrapper overhead.\n *\n * Technique: outer div with gradient background + padding-[1.5px] creates\n * a visible gradient border. The inner content covers the center, leaving\n * only the edge visible as a \"border\".\n */\nfunction GradientBorderWrap({\n active,\n rounded,\n reducedMotion,\n children,\n}: {\n active: boolean\n rounded: string\n reducedMotion: boolean\n children: React.ReactNode\n}) {\n if (!active) return <>{children}</>\n\n if (reducedMotion) {\n return (\n <div className={cn('p-[1.5px] bg-accent-9', rounded)}>\n {children}\n </div>\n )\n }\n\n return (\n <motion.div\n className={cn('relative p-[1.5px]', rounded)}\n style={{\n background: 'linear-gradient(var(--gradient-angle, 0deg), #D33163, #9B5DE5, #C850C0, #D33163)',\n backgroundSize: '300% 300%',\n }}\n animate={{\n // Rotate the gradient angle — creates the flowing border effect\n // Using CSS custom property animation via backgroundPosition as proxy\n backgroundPosition: ['0% 0%', '100% 100%', '0% 0%'],\n }}\n transition={{\n backgroundPosition: {\n duration: 4,\n repeat: Infinity,\n ease: 'linear',\n },\n }}\n >\n {/* Subtle outer glow */}\n <motion.div\n className={cn('absolute inset-0 -z-10', rounded)}\n style={{\n background: 'linear-gradient(var(--gradient-angle, 0deg), #D33163, #9B5DE5, #C850C0, #D33163)',\n backgroundSize: '300% 300%',\n filter: 'blur(8px)',\n }}\n animate={{\n opacity: [0.3, 0.5, 0.3],\n backgroundPosition: ['0% 0%', '100% 100%', '0% 0%'],\n }}\n transition={{\n opacity: { duration: 3, repeat: Infinity, ease: 'easeInOut' },\n backgroundPosition: { duration: 4, repeat: Infinity, ease: 'linear' },\n }}\n />\n {children}\n </motion.div>\n )\n}\n\n// -----------------------------------------------------------------------\n// Types\n// -----------------------------------------------------------------------\n\n/**\n * Unified AI command interface with three visual variants:\n * - `hero`: full-featured inline bar with greeting, animated placeholder rotation, and hints\n * - `inline`: compact bar for embedding in panels or toolbars\n * - `floating`: modal overlay with global keybinding (same pattern as CommandPalette)\n *\n * Supports both command-palette filtering (when `groups` provided) and\n * natural-language AI submission via `onSubmit`.\n */\nexport interface CommandBarProps\n extends Omit<React.ComponentPropsWithRef<'div'>, 'onSubmit'> {\n // -- AI submission --\n /** Called when the user submits a query (Enter key). */\n onSubmit?: (query: string) => void\n /** Current interaction state. Controls visual feedback (gradient border, placeholder). */\n state?: 'idle' | 'typing' | 'processing' | 'responded'\n\n // -- Command palette mode (optional) --\n /** When provided, enables command-palette filtering alongside AI submission. */\n groups?: CommandGroup[]\n onSearch?: (query: string) => void\n emptyMessage?: string\n emptyState?: React.ReactNode\n\n // -- Visual --\n /** Layout variant. @default 'hero' */\n variant?: 'hero' | 'inline' | 'floating'\n /** Placeholder text, or an array of strings that rotate on an interval. */\n placeholder?: string | string[]\n /** Rotation interval in ms when `placeholder` is an array. @default 4000 */\n placeholderInterval?: number\n /** Greeting text shown above the input in `hero` variant. */\n greeting?: string\n /** Hint strings shown below the input in `hero` variant. */\n hints?: string[]\n agentName?: string\n agentIcon?: React.ReactNode\n\n // -- Floating variant (modal) --\n open?: boolean\n defaultOpen?: boolean\n onOpenChange?: (open: boolean) => void\n /** Keybinding to toggle the floating bar. @default 'mod+k' */\n keybinding?: string | string[] | false\n\n // -- Interaction --\n disabled?: boolean\n maxHeight?: string | number\n\n // -- Composition --\n children?: React.ReactNode\n}\n\n// -----------------------------------------------------------------------\n// Helpers\n// -----------------------------------------------------------------------\n\nfunction getFilterValue(item: CommandItem): string {\n if (item.filterValue) return item.filterValue\n if (typeof item.label === 'string') return item.label\n return ''\n}\n\nfunction getFilterDescription(item: CommandItem): string {\n if (typeof item.description === 'string') return item.description\n return ''\n}\n\n// -----------------------------------------------------------------------\n// Rotating Placeholder\n// -----------------------------------------------------------------------\n\nfunction RotatingPlaceholder({\n placeholders,\n interval,\n paused,\n}: {\n placeholders: string[]\n interval: number\n paused: boolean\n}) {\n const [currentIndex, setCurrentIndex] = React.useState(0)\n const { reducedMotion } = useMotion()\n\n React.useEffect(() => {\n if (paused || placeholders.length <= 1) return\n const timer = setInterval(() => {\n setCurrentIndex((prev) => (prev + 1) % placeholders.length)\n }, interval)\n return () => clearInterval(timer)\n }, [paused, placeholders.length, interval])\n\n if (reducedMotion) {\n return (\n <span className=\"pointer-events-none absolute text-surface-fg-subtle\">\n {placeholders[currentIndex]}\n </span>\n )\n }\n\n return (\n <AnimatePresence mode=\"wait\">\n <motion.span\n key={placeholders[currentIndex]}\n initial={{ opacity: 0, y: -4 }}\n animate={{ opacity: 1, y: 0 }}\n exit={{ opacity: 0, y: 4 }}\n transition={tweens.fade}\n className=\"pointer-events-none absolute text-surface-fg-subtle\"\n >\n {placeholders[currentIndex]}\n </motion.span>\n </AnimatePresence>\n )\n}\n\n// -----------------------------------------------------------------------\n// CommandBar\n// -----------------------------------------------------------------------\n\nconst CommandBar = React.forwardRef<HTMLDivElement, CommandBarProps>(\n function CommandBar(\n {\n onSubmit,\n state = 'idle',\n groups = [],\n onSearch,\n emptyMessage = 'No results found.',\n emptyState,\n variant = 'hero',\n placeholder = 'Ask anything...',\n placeholderInterval = 5000,\n greeting,\n hints,\n agentName,\n agentIcon,\n open: openProp,\n defaultOpen,\n onOpenChange,\n keybinding = 'mod+j',\n disabled = false,\n maxHeight = '320px',\n children,\n className,\n ...props\n },\n ref,\n ) {\n // -- Controlled/uncontrolled open state (floating) --\n const isControlled = openProp !== undefined\n const [internalOpen, setInternalOpen] = React.useState(defaultOpen ?? false)\n const open = isControlled ? openProp : internalOpen\n\n const openRef = React.useRef(open)\n openRef.current = open\n\n const setOpen = React.useCallback(\n (nextOpen: boolean | ((prev: boolean) => boolean)) => {\n const resolved =\n typeof nextOpen === 'function' ? nextOpen(openRef.current) : nextOpen\n if (!isControlled) {\n setInternalOpen(resolved)\n }\n onOpenChange?.(resolved)\n },\n [isControlled, onOpenChange],\n )\n\n // -- Core state --\n const [query, setQuery] = React.useState('')\n const [activeIndex, setActiveIndex] = React.useState(-1)\n const [lastQuery, setLastQuery] = React.useState('')\n const [isFocused, setIsFocused] = React.useState(false)\n const [shake, setShake] = React.useState(false)\n const inputRef = React.useRef<HTMLInputElement>(null)\n const listRef = React.useRef<HTMLDivElement>(null)\n const instanceId = React.useId()\n const listboxId = `command-bar-listbox-${instanceId}`\n\n // -- Motion --\n const { reducedMotion: isReduced } = useMotion()\n const noMotionTransition = { duration: 0 }\n\n // -- Platform detection --\n const isMac = React.useMemo(() => getIsMac(), [])\n\n // -- Placeholders --\n const placeholders = React.useMemo(\n () => (Array.isArray(placeholder) ? placeholder : [placeholder]),\n [placeholder],\n )\n\n // -- Has groups --\n const hasGroups = groups.length > 0\n\n // -- Filter groups --\n const filteredGroups = React.useMemo(() => {\n if (!hasGroups) return []\n if (!query.trim()) return groups\n const q = query.toLowerCase()\n return groups\n .map((group) => ({\n ...group,\n items: group.items.filter(\n (item) =>\n getFilterValue(item).toLowerCase().includes(q) ||\n getFilterDescription(item).toLowerCase().includes(q),\n ),\n }))\n .filter((group) => group.items.length > 0)\n }, [groups, query, hasGroups])\n\n const filteredItems = React.useMemo(\n () => filteredGroups.flatMap((g) => g.items),\n [filteredGroups],\n )\n\n // Build item index map for keyboard navigation\n const itemIndexMap = React.useMemo(() => {\n const map = new Map<string, number>()\n let idx = 0\n for (const group of filteredGroups) {\n for (const item of group.items) {\n map.set(item.id, idx++)\n }\n }\n return map\n }, [filteredGroups])\n\n // -- Max height CSS --\n const maxHeightValue =\n typeof maxHeight === 'number' ? `${maxHeight}px` : maxHeight\n\n // -- Global keybinding (floating variant) --\n React.useEffect(() => {\n if (variant !== 'floating' || keybinding === false) return\n\n const bindings = Array.isArray(keybinding) ? keybinding : [keybinding]\n\n function handleKeyDown(e: KeyboardEvent) {\n for (const binding of bindings) {\n if (matchesKeybinding(e, binding)) {\n e.preventDefault()\n setOpen((prev) => !prev)\n return\n }\n }\n }\n document.addEventListener('keydown', handleKeyDown)\n return () => document.removeEventListener('keydown', handleKeyDown)\n }, [variant, keybinding, setOpen])\n\n // -- Reset on floating open --\n React.useEffect(() => {\n if (variant === 'floating' && open) {\n setQuery('')\n setActiveIndex(-1)\n requestAnimationFrame(() => {\n inputRef.current?.focus()\n })\n }\n }, [variant, open])\n\n // -- Scroll active item into view --\n React.useEffect(() => {\n if (activeIndex < 0) return\n const activeEl = listRef.current?.querySelector(\n `[data-command-index=\"${activeIndex}\"]`,\n )\n activeEl?.scrollIntoView({ block: 'nearest' })\n }, [activeIndex])\n\n // -- Query change handler --\n const handleQueryChange = (value: string) => {\n setQuery(value)\n setActiveIndex(hasGroups && value.trim() ? 0 : -1)\n onSearch?.(value)\n }\n\n // -- Submit handler --\n const handleSubmit = React.useCallback(() => {\n if (!query.trim() || disabled) return\n setLastQuery(query)\n onSubmit?.(query)\n }, [query, disabled, onSubmit])\n\n // -- Keyboard handler --\n const handleKeyDown = (e: React.KeyboardEvent) => {\n switch (e.key) {\n case 'ArrowDown': {\n if (!hasGroups || filteredItems.length === 0) return\n e.preventDefault()\n setActiveIndex((prev) =>\n prev < filteredItems.length - 1 ? prev + 1 : 0,\n )\n break\n }\n case 'ArrowUp': {\n if (hasGroups && filteredItems.length > 0) {\n e.preventDefault()\n setActiveIndex((prev) =>\n prev > 0 ? prev - 1 : filteredItems.length - 1,\n )\n } else if (!hasGroups && !query && lastQuery) {\n // Recall last query\n e.preventDefault()\n setQuery(lastQuery)\n }\n break\n }\n case 'Enter': {\n e.preventDefault()\n const isCmdEnter = e.metaKey || e.ctrlKey\n\n if (isCmdEnter) {\n // Cmd+Enter always submits\n handleSubmit()\n } else if (\n hasGroups &&\n activeIndex >= 0 &&\n filteredItems[activeIndex]\n ) {\n // Enter selects active command item\n filteredItems[activeIndex].onSelect()\n if (variant === 'floating') setOpen(false)\n } else {\n // Enter submits query\n handleSubmit()\n }\n break\n }\n case 'Escape': {\n e.preventDefault()\n if (state === 'responded') {\n setQuery('')\n } else if (variant === 'floating') {\n setOpen(false)\n } else {\n inputRef.current?.blur()\n }\n break\n }\n }\n }\n\n // -- Clear handler --\n const handleClear = () => {\n setQuery('')\n setActiveIndex(-1)\n inputRef.current?.focus()\n }\n\n // -- Shake animation reset --\n React.useEffect(() => {\n if (shake) {\n const timer = setTimeout(() => setShake(false), 500)\n return () => clearTimeout(timer)\n }\n }, [shake])\n\n // -- Shared spring/tween for reduced motion --\n const springSnappy = isReduced ? noMotionTransition : springs.snappy\n const tweenFade = isReduced ? noMotionTransition : tweens.fade\n const noInit = isReduced ? { opacity: 1, scale: 1, y: 0 } : undefined\n\n // =====================================================================\n // Shared Input Row\n // =====================================================================\n const isCompact = variant === 'inline'\n const isProcessing = state === 'processing'\n const isResponded = state === 'responded'\n\n const renderInputRow = () => (\n <GradientBorderWrap\n active={isProcessing}\n rounded={isCompact ? 'rounded-control' : 'rounded-surface'}\n reducedMotion={isReduced}\n >\n <div\n className={cn(\n 'flex items-center gap-ds-04 border bg-surface-overlay transition-colors transition-shadow duration-fast-02 ease-productive-standard',\n isCompact\n ? 'rounded-control px-ds-04'\n : 'rounded-surface px-ds-05',\n isProcessing\n ? 'border-transparent'\n : 'border-surface-border-strong',\n isFocused && !isProcessing && 'border-accent-7 shadow-ring',\n shake && 'animate-shake',\n )}\n >\n {/* Search icon */}\n <Icon\n icon={IconSearch}\n size={isCompact ? 'xs' : 'sm'}\n stroke=\"light\"\n className={cn(\n 'shrink-0 transition-colors duration-fast-02 ease-productive-standard',\n isFocused ? 'text-accent-9' : 'text-surface-fg-subtle',\n )}\n />\n\n {/* Input wrapper */}\n <div className=\"relative flex flex-1 items-center\">\n {!query && !isFocused && placeholders.length > 1 && (\n <RotatingPlaceholder\n placeholders={placeholders}\n interval={placeholderInterval}\n paused={isFocused || !!query}\n />\n )}\n <input\n ref={inputRef}\n value={query}\n onChange={(e) => handleQueryChange(e.target.value)}\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n onKeyDown={handleKeyDown}\n placeholder={\n placeholders.length === 1 || isFocused ? placeholders[0] : ''\n }\n readOnly={isProcessing}\n disabled={disabled}\n role=\"combobox\"\n aria-expanded={hasGroups && filteredItems.length > 0}\n aria-controls={hasGroups ? listboxId : undefined}\n aria-activedescendant={\n hasGroups && activeIndex >= 0 && filteredItems[activeIndex]\n ? `command-bar-item-${instanceId}-${filteredItems[activeIndex].id}`\n : undefined\n }\n aria-autocomplete={hasGroups ? 'list' : undefined}\n aria-label={agentName ? `Ask ${agentName}` : 'AI Command Bar'}\n className={cn(\n 'flex-1 bg-transparent text-surface-fg outline-hidden',\n 'placeholder:text-surface-fg-subtle',\n isCompact ? 'h-9 text-ds-sm' : 'h-12 text-ds-base',\n isProcessing && 'cursor-wait',\n disabled && 'cursor-not-allowed opacity-50',\n )}\n autoComplete=\"off\"\n autoCorrect=\"off\"\n spellCheck={false}\n />\n </div>\n\n {/* Right side: spinner / clear / shortcut badge */}\n {isProcessing ? (\n <span data-testid=\"command-bar-spinner\" className=\"shrink-0\">\n <Icon\n icon={IconLoader2}\n size={isCompact ? 'xs' : 'sm'}\n stroke=\"light\"\n animate=\"spin\"\n className=\"text-accent-9\"\n />\n </span>\n ) : isResponded ? (\n <button\n type=\"button\"\n onClick={handleClear}\n className=\"shrink-0 rounded-control-inner p-ds-01 text-surface-fg-subtle transition-colors duration-fast-01 hover:bg-surface-raised-hover hover:text-surface-fg-muted focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9\"\n aria-label=\"Clear\"\n title=\"Clear\"\n >\n <Icon\n icon={IconX}\n size={isCompact ? 'xs' : 'sm'}\n stroke=\"light\"\n />\n </button>\n ) : variant === 'hero' ? (\n <AnimatePresence>\n {!isFocused && (\n <motion.kbd\n initial={noInit ?? { opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={isReduced ? undefined : { opacity: 0 }}\n transition={tweenFade}\n className=\"hidden shrink-0 select-none rounded-control border border-surface-border-strong bg-surface-raised px-ds-02b py-ds-01 text-ds-sm font-medium text-surface-fg-subtle shadow-kbd sm:inline-flex\"\n >\n {getModifierDisplay(isMac)}J\n </motion.kbd>\n )}\n </AnimatePresence>\n ) : null}\n </div>\n </GradientBorderWrap>\n )\n\n // =====================================================================\n // Command Results (shared between variants)\n // =====================================================================\n const renderCommandResults = () => {\n if (!hasGroups) return null\n\n const showResults =\n filteredItems.length > 0 || (query.trim() && filteredGroups.length === 0)\n\n if (!showResults && !query.trim()) return null\n\n return (\n <div\n ref={listRef}\n id={listboxId}\n role=\"listbox\"\n aria-label=\"Command results\"\n className=\"overflow-y-auto px-ds-03 py-ds-03\"\n style={{ maxHeight: maxHeightValue }}\n >\n {filteredGroups.length === 0 && query.trim() && (\n <motion.div\n initial={noInit ?? { opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={tweenFade}\n className=\"flex items-center justify-center py-ds-07\"\n >\n {emptyState ?? (\n <p className=\"text-ds-md text-surface-fg-subtle\">\n {emptyMessage}\n </p>\n )}\n </motion.div>\n )}\n\n {filteredGroups.map((group, groupIdx) => (\n <motion.div\n key={group.label}\n initial={noInit ?? { opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={\n isReduced\n ? noMotionTransition\n : { ...tweens.fade, delay: groupIdx * 0.06 }\n }\n className=\"mb-ds-02\"\n >\n <div className=\"px-ds-03 pb-ds-02 pt-ds-03\">\n <span className=\"text-ds-xs font-semibold uppercase tracking-wider text-surface-fg-subtle\">\n {group.label}\n </span>\n </div>\n\n {group.items.map((item) => {\n const itemIndex = itemIndexMap.get(item.id) ?? 0\n const isActive = itemIndex === activeIndex\n return (\n <motion.button\n key={item.id}\n id={`command-bar-item-${instanceId}-${item.id}`}\n type=\"button\"\n role=\"option\"\n aria-selected={isActive}\n data-command-index={itemIndex}\n initial={noInit ?? { opacity: 0, y: 4 }}\n animate={{ opacity: 1, y: 0 }}\n transition={\n isReduced\n ? noMotionTransition\n : { ...springs.snappy, delay: itemIndex * 0.03 }\n }\n onClick={() => {\n item.onSelect()\n if (variant === 'floating') setOpen(false)\n }}\n onMouseEnter={() => setActiveIndex(itemIndex)}\n className={cn(\n 'flex w-full items-center gap-ds-04 rounded-surface px-ds-03 py-ds-03 text-left transition-[color,background-color] duration-fast-02 ease-productive-standard',\n isActive\n ? 'bg-surface-raised-hover text-surface-fg'\n : 'text-surface-fg-muted hover:bg-surface-raised',\n )}\n >\n {item.icon && (\n <span\n className={cn(\n '[&>svg]:h-ico-sm [&>svg]:w-ico-sm shrink-0 transition-colors duration-fast-02 ease-productive-standard',\n isActive\n ? 'text-accent-11'\n : 'text-surface-fg-subtle',\n )}\n aria-hidden=\"true\"\n >\n <IconProvider size=\"sm\">{normalizeIcon(item.icon)}</IconProvider>\n </span>\n )}\n <div className=\"flex flex-1 flex-col\">\n <span className=\"text-ds-md\">\n {item.renderLabel\n ? item.renderLabel(query)\n : item.label}\n </span>\n {item.description && (\n <span className=\"text-ds-sm text-surface-fg-subtle\">\n {item.description}\n </span>\n )}\n </div>\n <AnimatePresence>\n {isActive && (\n <motion.span\n initial={isReduced ? undefined : { opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={isReduced ? undefined : { opacity: 0 }}\n transition={tweenFade}\n className=\"inline-flex shrink-0\"\n >\n <Icon\n icon={IconCornerDownLeft}\n size=\"sm\"\n stroke=\"light\"\n className=\"text-surface-fg-subtle\"\n />\n </motion.span>\n )}\n </AnimatePresence>\n </motion.button>\n )\n })}\n </motion.div>\n ))}\n </div>\n )\n }\n\n // =====================================================================\n // Hero Variant\n // =====================================================================\n if (variant === 'hero') {\n return (\n <div\n ref={ref}\n role=\"search\"\n className={cn(\n 'bg-surface-raised rounded-overlay-lg shadow-raised p-ds-07',\n className,\n )}\n {...props}\n >\n {greeting && (\n <p className=\"text-ds-lg text-surface-fg-muted mb-ds-04\">\n {greeting}\n </p>\n )}\n\n {renderInputRow()}\n {renderCommandResults()}\n\n {/* Hints */}\n {hints && hints.length > 0 && (\n <div className=\"mt-ds-04 flex flex-wrap gap-ds-02b\">\n {hints.map((hint) => (\n <button\n key={hint}\n type=\"button\"\n onClick={() => {\n setQuery(hint)\n onSearch?.(hint)\n inputRef.current?.focus()\n }}\n className=\"rounded-control border border-surface-border-strong bg-surface-overlay px-ds-03 py-ds-01 text-ds-sm text-surface-fg-subtle transition-colors duration-fast-02 ease-productive-standard hover:bg-surface-raised-hover hover:text-surface-fg-muted\"\n >\n {hint}\n </button>\n ))}\n </div>\n )}\n\n {/* Response area (children) */}\n {children && <div className=\"mt-ds-05\">{children}</div>}\n </div>\n )\n }\n\n // =====================================================================\n // Inline Variant\n // =====================================================================\n if (variant === 'inline') {\n return (\n <div\n ref={ref}\n role=\"search\"\n className={cn('w-full', className)}\n {...props}\n >\n {renderInputRow()}\n {renderCommandResults()}\n {children && <div className=\"mt-ds-03\">{children}</div>}\n </div>\n )\n }\n\n // =====================================================================\n // Floating Variant\n // =====================================================================\n const handleDialogOpenChange = (nextOpen: boolean) => {\n setOpen(nextOpen)\n }\n\n return (\n <Dialog open={open} onOpenChange={handleDialogOpenChange}>\n <DialogPortal>\n <DialogOverlay className=\"fixed inset-0 z-overlay bg-overlay data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\" />\n <DialogContentRaw\n ref={ref}\n {...props}\n className={cn(\n 'fixed left-1/2 top-[20%] z-modal w-full max-w-[560px] -translate-x-1/2',\n 'overflow-hidden rounded-overlay-lg bg-surface-overlay shadow-overlay',\n 'duration-moderate-02 data-[state=open]:animate-in data-[state=closed]:animate-out',\n 'data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n 'data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',\n 'data-[state=closed]:slide-out-to-left-1/2 data-[state=open]:slide-in-from-left-1/2',\n 'data-[state=closed]:slide-out-to-top-2 data-[state=open]:slide-in-from-top-2',\n className,\n )}\n >\n <VisuallyHidden>\n <DialogTitle>AI Command Bar</DialogTitle>\n <DialogDescription>\n Search commands or ask a question\n </DialogDescription>\n </VisuallyHidden>\n\n <div className=\"p-ds-04\">{renderInputRow()}</div>\n\n {renderCommandResults()}\n\n {children && (\n <div className=\"border-t border-surface-border-strong p-ds-04\">\n {children}\n </div>\n )}\n\n {/* Footer hints */}\n <motion.div\n initial={noInit ?? { opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={tweenFade}\n className=\"flex items-center gap-ds-05 border-t border-surface-border-strong px-ds-05 py-ds-03\"\n >\n {hasGroups && (\n <div className=\"flex items-center gap-ds-02b\">\n <div className=\"flex items-center gap-ds-01\">\n <kbd className=\"inline-flex h-ico-md w-ico-md items-center justify-center rounded border border-surface-border-strong bg-surface-raised shadow-kbd\">\n <Icon icon={IconArrowUp} size=\"xs\" className=\"text-surface-fg-subtle\" />\n </kbd>\n <kbd className=\"inline-flex h-ico-md w-ico-md items-center justify-center rounded border border-surface-border-strong bg-surface-raised shadow-kbd\">\n <Icon icon={IconArrowDown} size=\"xs\" className=\"text-surface-fg-subtle\" />\n </kbd>\n </div>\n <span className=\"text-ds-xs text-surface-fg-subtle\">\n Navigate\n </span>\n </div>\n )}\n <div className=\"flex items-center gap-ds-02b\">\n <kbd className=\"inline-flex h-[20px] items-center justify-center rounded-control border border-surface-border-strong bg-surface-raised px-ds-02b shadow-kbd\">\n <Icon icon={IconCornerDownLeft} size=\"xs\" className=\"text-surface-fg-subtle\" />\n </kbd>\n <span className=\"text-ds-xs text-surface-fg-subtle\">\n Submit\n </span>\n </div>\n <div className=\"flex items-center gap-ds-02b\">\n <kbd className=\"inline-flex h-[20px] items-center justify-center rounded-control border border-surface-border-strong bg-surface-raised px-ds-02b text-ds-xs font-medium text-surface-fg-subtle shadow-kbd\">\n Esc\n </kbd>\n <span className=\"text-ds-xs text-surface-fg-subtle\">\n Close\n </span>\n </div>\n </motion.div>\n </DialogContentRaw>\n </DialogPortal>\n </Dialog>\n )\n },\n)\n\nCommandBar.displayName = 'CommandBar'\n\nexport { CommandBar }\nexport type { CommandGroup, CommandItem }\n"],"mappings":"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"}
1
+ {"version":3,"file":"command-bar.js","names":[],"sources":["../../src/ai/command-bar.tsx"],"sourcesContent":["'use client'\n\n/**\n * CommandBar -- Unified AI command interface.\n *\n * Three variants:\n * - hero: Full-featured inline bar with greeting, hints, placeholder rotation\n * - inline: Compact inline bar for embedding in panels/toolbars\n * - floating: Modal overlay (same pattern as CommandPalette) with global keybinding\n *\n * Supports both command-palette filtering (when `groups` provided) and\n * AI natural-language submission via `onSubmit`.\n */\nimport {\n IconArrowDown,\n IconArrowUp,\n IconCornerDownLeft,\n IconLoader2,\n IconSearch,\n IconX,\n} from '@tabler/icons-react'\nimport { AnimatePresence,motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport type { CommandGroup, CommandItem } from '../composed/command-palette'\nimport { useMotion } from '../motion/motion-provider'\nimport {\n Dialog,\n DialogContentRaw,\n DialogDescription,\n DialogOverlay,\n DialogPortal,\n DialogTitle,\n} from '../ui/dialog'\nimport { Icon } from '../ui/icon'\nimport { IconProvider } from '../ui/icon-context'\nimport { getIsMac, getModifierDisplay,matchesKeybinding } from '../ui/lib/keybinding'\nimport { springs,tweens } from '../ui/lib/motion'\nimport { normalizeIcon } from '../ui/lib/normalize-icon'\nimport { cn } from '../ui/lib/utils'\nimport { VisuallyHidden } from '../ui/visually-hidden'\n\n// -----------------------------------------------------------------------\n// GradientBorderWrap — animated gradient border during processing\n// -----------------------------------------------------------------------\n\n/**\n * Wraps the input row with an animated gradient border during processing.\n * Uses the Devalok brand palette (pink → purple → magenta) flowing around\n * the border. When inactive, renders children directly with no wrapper overhead.\n *\n * Technique: outer div with gradient background + padding-[1.5px] creates\n * a visible gradient border. The inner content covers the center, leaving\n * only the edge visible as a \"border\".\n */\nfunction GradientBorderWrap({\n active,\n rounded,\n reducedMotion,\n children,\n}: {\n active: boolean\n rounded: string\n reducedMotion: boolean\n children: React.ReactNode\n}) {\n if (!active) return <>{children}</>\n\n if (reducedMotion) {\n return (\n <div className={cn('p-[1.5px] bg-accent-9', rounded)}>\n {children}\n </div>\n )\n }\n\n return (\n <motion.div\n className={cn('relative p-[1.5px]', rounded)}\n style={{\n background: 'linear-gradient(var(--gradient-angle, 0deg), #D33163, #9B5DE5, #C850C0, #D33163)',\n backgroundSize: '300% 300%',\n }}\n animate={{\n // Rotate the gradient angle — creates the flowing border effect\n // Using CSS custom property animation via backgroundPosition as proxy\n backgroundPosition: ['0% 0%', '100% 100%', '0% 0%'],\n }}\n transition={{\n backgroundPosition: {\n duration: 4,\n repeat: Infinity,\n ease: 'linear',\n },\n }}\n >\n {children}\n </motion.div>\n )\n}\n\n// -----------------------------------------------------------------------\n// Types\n// -----------------------------------------------------------------------\n\n/**\n * Unified AI command interface with three visual variants:\n * - `hero`: full-featured inline bar with greeting, animated placeholder rotation, and hints\n * - `inline`: compact bar for embedding in panels or toolbars\n * - `floating`: modal overlay with global keybinding (same pattern as CommandPalette)\n *\n * Supports both command-palette filtering (when `groups` provided) and\n * natural-language AI submission via `onSubmit`.\n */\nexport interface CommandBarProps\n extends Omit<React.ComponentPropsWithRef<'div'>, 'onSubmit'> {\n // -- AI submission --\n /** Called when the user submits a query (Enter key). */\n onSubmit?: (query: string) => void\n /** Current interaction state. Controls visual feedback (gradient border, placeholder). */\n state?: 'idle' | 'typing' | 'processing' | 'responded'\n\n // -- Command palette mode (optional) --\n /** When provided, enables command-palette filtering alongside AI submission. */\n groups?: CommandGroup[]\n onSearch?: (query: string) => void\n emptyMessage?: string\n emptyState?: React.ReactNode\n\n // -- Visual --\n /** Layout variant. @default 'hero' */\n variant?: 'hero' | 'inline' | 'floating'\n /** Placeholder text, or an array of strings that rotate on an interval. */\n placeholder?: string | string[]\n /** Rotation interval in ms when `placeholder` is an array. @default 4000 */\n placeholderInterval?: number\n /** Greeting text shown above the input in `hero` variant. */\n greeting?: string\n /** Hint strings shown below the input in `hero` variant. */\n hints?: string[]\n agentName?: string\n agentIcon?: React.ReactNode\n\n // -- Floating variant (modal) --\n open?: boolean\n defaultOpen?: boolean\n onOpenChange?: (open: boolean) => void\n /** Keybinding to toggle the floating bar. @default 'mod+k' */\n keybinding?: string | string[] | false\n\n // -- Interaction --\n disabled?: boolean\n maxHeight?: string | number\n\n // -- Composition --\n children?: React.ReactNode\n}\n\n// -----------------------------------------------------------------------\n// Helpers\n// -----------------------------------------------------------------------\n\nfunction getFilterValue(item: CommandItem): string {\n if (item.filterValue) return item.filterValue\n if (typeof item.label === 'string') return item.label\n return ''\n}\n\nfunction getFilterDescription(item: CommandItem): string {\n if (typeof item.description === 'string') return item.description\n return ''\n}\n\n// -----------------------------------------------------------------------\n// Rotating Placeholder\n// -----------------------------------------------------------------------\n\nfunction RotatingPlaceholder({\n placeholders,\n interval,\n paused,\n}: {\n placeholders: string[]\n interval: number\n paused: boolean\n}) {\n const [currentIndex, setCurrentIndex] = React.useState(0)\n const { reducedMotion } = useMotion()\n\n React.useEffect(() => {\n if (paused || placeholders.length <= 1) return\n const timer = setInterval(() => {\n setCurrentIndex((prev) => (prev + 1) % placeholders.length)\n }, interval)\n return () => clearInterval(timer)\n }, [paused, placeholders.length, interval])\n\n if (reducedMotion) {\n return (\n <span className=\"pointer-events-none absolute text-surface-fg-subtle\">\n {placeholders[currentIndex]}\n </span>\n )\n }\n\n return (\n <AnimatePresence mode=\"wait\">\n <motion.span\n key={placeholders[currentIndex]}\n initial={{ opacity: 0, y: -4 }}\n animate={{ opacity: 1, y: 0 }}\n exit={{ opacity: 0, y: 4 }}\n transition={tweens.fade}\n className=\"pointer-events-none absolute text-surface-fg-subtle\"\n >\n {placeholders[currentIndex]}\n </motion.span>\n </AnimatePresence>\n )\n}\n\n// -----------------------------------------------------------------------\n// CommandBar\n// -----------------------------------------------------------------------\n\nconst CommandBar = React.forwardRef<HTMLDivElement, CommandBarProps>(\n function CommandBar(\n {\n onSubmit,\n state = 'idle',\n groups = [],\n onSearch,\n emptyMessage = 'No results found.',\n emptyState,\n variant = 'hero',\n placeholder = 'Ask anything...',\n placeholderInterval = 5000,\n greeting,\n hints,\n agentName,\n agentIcon,\n open: openProp,\n defaultOpen,\n onOpenChange,\n keybinding = 'mod+j',\n disabled = false,\n maxHeight = '320px',\n children,\n className,\n ...props\n },\n ref,\n ) {\n // -- Controlled/uncontrolled open state (floating) --\n const isControlled = openProp !== undefined\n const [internalOpen, setInternalOpen] = React.useState(defaultOpen ?? false)\n const open = isControlled ? openProp : internalOpen\n\n const openRef = React.useRef(open)\n openRef.current = open\n\n const setOpen = React.useCallback(\n (nextOpen: boolean | ((prev: boolean) => boolean)) => {\n const resolved =\n typeof nextOpen === 'function' ? nextOpen(openRef.current) : nextOpen\n if (!isControlled) {\n setInternalOpen(resolved)\n }\n onOpenChange?.(resolved)\n },\n [isControlled, onOpenChange],\n )\n\n // -- Core state --\n const [query, setQuery] = React.useState('')\n const [activeIndex, setActiveIndex] = React.useState(-1)\n const [lastQuery, setLastQuery] = React.useState('')\n const [isFocused, setIsFocused] = React.useState(false)\n const [shake, setShake] = React.useState(false)\n const inputRef = React.useRef<HTMLInputElement>(null)\n const listRef = React.useRef<HTMLDivElement>(null)\n const instanceId = React.useId()\n const listboxId = `command-bar-listbox-${instanceId}`\n\n // -- Motion --\n const { reducedMotion: isReduced } = useMotion()\n const noMotionTransition = { duration: 0 }\n\n // -- Platform detection --\n const isMac = React.useMemo(() => getIsMac(), [])\n\n // -- Placeholders --\n const placeholders = React.useMemo(\n () => (Array.isArray(placeholder) ? placeholder : [placeholder]),\n [placeholder],\n )\n\n // -- Has groups --\n const hasGroups = groups.length > 0\n\n // -- Filter groups --\n const filteredGroups = React.useMemo(() => {\n if (!hasGroups) return []\n if (!query.trim()) return groups\n const q = query.toLowerCase()\n return groups\n .map((group) => ({\n ...group,\n items: group.items.filter(\n (item) =>\n getFilterValue(item).toLowerCase().includes(q) ||\n getFilterDescription(item).toLowerCase().includes(q),\n ),\n }))\n .filter((group) => group.items.length > 0)\n }, [groups, query, hasGroups])\n\n const filteredItems = React.useMemo(\n () => filteredGroups.flatMap((g) => g.items),\n [filteredGroups],\n )\n\n // Build item index map for keyboard navigation\n const itemIndexMap = React.useMemo(() => {\n const map = new Map<string, number>()\n let idx = 0\n for (const group of filteredGroups) {\n for (const item of group.items) {\n map.set(item.id, idx++)\n }\n }\n return map\n }, [filteredGroups])\n\n // -- Max height CSS --\n const maxHeightValue =\n typeof maxHeight === 'number' ? `${maxHeight}px` : maxHeight\n\n // -- Global keybinding (floating variant) --\n React.useEffect(() => {\n if (variant !== 'floating' || keybinding === false) return\n\n const bindings = Array.isArray(keybinding) ? keybinding : [keybinding]\n\n function handleKeyDown(e: KeyboardEvent) {\n for (const binding of bindings) {\n if (matchesKeybinding(e, binding)) {\n e.preventDefault()\n setOpen((prev) => !prev)\n return\n }\n }\n }\n document.addEventListener('keydown', handleKeyDown)\n return () => document.removeEventListener('keydown', handleKeyDown)\n }, [variant, keybinding, setOpen])\n\n // -- Reset on floating open --\n React.useEffect(() => {\n if (variant === 'floating' && open) {\n setQuery('')\n setActiveIndex(-1)\n requestAnimationFrame(() => {\n inputRef.current?.focus()\n })\n }\n }, [variant, open])\n\n // -- Scroll active item into view --\n React.useEffect(() => {\n if (activeIndex < 0) return\n const activeEl = listRef.current?.querySelector(\n `[data-command-index=\"${activeIndex}\"]`,\n )\n activeEl?.scrollIntoView({ block: 'nearest' })\n }, [activeIndex])\n\n // -- Query change handler --\n const handleQueryChange = (value: string) => {\n setQuery(value)\n setActiveIndex(hasGroups && value.trim() ? 0 : -1)\n onSearch?.(value)\n }\n\n // -- Submit handler --\n const handleSubmit = React.useCallback(() => {\n if (!query.trim() || disabled) return\n setLastQuery(query)\n onSubmit?.(query)\n }, [query, disabled, onSubmit])\n\n // -- Keyboard handler --\n const handleKeyDown = (e: React.KeyboardEvent) => {\n switch (e.key) {\n case 'ArrowDown': {\n if (!hasGroups || filteredItems.length === 0) return\n e.preventDefault()\n setActiveIndex((prev) =>\n prev < filteredItems.length - 1 ? prev + 1 : 0,\n )\n break\n }\n case 'ArrowUp': {\n if (hasGroups && filteredItems.length > 0) {\n e.preventDefault()\n setActiveIndex((prev) =>\n prev > 0 ? prev - 1 : filteredItems.length - 1,\n )\n } else if (!hasGroups && !query && lastQuery) {\n // Recall last query\n e.preventDefault()\n setQuery(lastQuery)\n }\n break\n }\n case 'Enter': {\n e.preventDefault()\n const isCmdEnter = e.metaKey || e.ctrlKey\n\n if (isCmdEnter) {\n // Cmd+Enter always submits\n handleSubmit()\n } else if (\n hasGroups &&\n activeIndex >= 0 &&\n filteredItems[activeIndex]\n ) {\n // Enter selects active command item\n filteredItems[activeIndex].onSelect()\n if (variant === 'floating') setOpen(false)\n } else {\n // Enter submits query\n handleSubmit()\n }\n break\n }\n case 'Escape': {\n e.preventDefault()\n if (state === 'responded') {\n setQuery('')\n } else if (variant === 'floating') {\n setOpen(false)\n } else {\n inputRef.current?.blur()\n }\n break\n }\n }\n }\n\n // -- Clear handler --\n const handleClear = () => {\n setQuery('')\n setActiveIndex(-1)\n inputRef.current?.focus()\n }\n\n // -- Shake animation reset --\n React.useEffect(() => {\n if (shake) {\n const timer = setTimeout(() => setShake(false), 500)\n return () => clearTimeout(timer)\n }\n }, [shake])\n\n // -- Shared spring/tween for reduced motion --\n const springSnappy = isReduced ? noMotionTransition : springs.snappy\n const tweenFade = isReduced ? noMotionTransition : tweens.fade\n const noInit = isReduced ? { opacity: 1, scale: 1, y: 0 } : undefined\n\n // =====================================================================\n // Shared Input Row\n // =====================================================================\n const isCompact = variant === 'inline'\n const isProcessing = state === 'processing'\n const isResponded = state === 'responded'\n\n const renderInputRow = () => (\n <GradientBorderWrap\n active={isProcessing}\n rounded={isCompact ? 'rounded-control' : 'rounded-surface'}\n reducedMotion={isReduced}\n >\n <div\n className={cn(\n 'flex items-center gap-ds-04 border bg-surface-overlay transition-colors transition-shadow duration-fast-02 ease-productive-standard',\n isCompact\n ? 'rounded-control px-ds-04'\n : 'rounded-surface px-ds-05',\n isProcessing\n ? 'border-transparent'\n : 'border-surface-border-strong',\n isFocused && !isProcessing && 'border-accent-7 shadow-ring',\n shake && 'animate-shake',\n )}\n >\n {/* Search icon */}\n <Icon\n icon={IconSearch}\n size={isCompact ? 'xs' : 'sm'}\n stroke=\"light\"\n className={cn(\n 'shrink-0 transition-colors duration-fast-02 ease-productive-standard',\n isFocused ? 'text-accent-9' : 'text-surface-fg-subtle',\n )}\n />\n\n {/* Input wrapper */}\n <div className=\"relative flex flex-1 items-center\">\n {!query && !isFocused && placeholders.length > 1 && (\n <RotatingPlaceholder\n placeholders={placeholders}\n interval={placeholderInterval}\n paused={isFocused || !!query}\n />\n )}\n <input\n ref={inputRef}\n value={query}\n onChange={(e) => handleQueryChange(e.target.value)}\n onFocus={() => setIsFocused(true)}\n onBlur={() => setIsFocused(false)}\n onKeyDown={handleKeyDown}\n placeholder={\n placeholders.length === 1 || isFocused ? placeholders[0] : ''\n }\n readOnly={isProcessing}\n disabled={disabled}\n role=\"combobox\"\n aria-expanded={hasGroups && filteredItems.length > 0}\n aria-controls={hasGroups ? listboxId : undefined}\n aria-activedescendant={\n hasGroups && activeIndex >= 0 && filteredItems[activeIndex]\n ? `command-bar-item-${instanceId}-${filteredItems[activeIndex].id}`\n : undefined\n }\n aria-autocomplete={hasGroups ? 'list' : undefined}\n aria-label={agentName ? `Ask ${agentName}` : 'AI Command Bar'}\n className={cn(\n 'flex-1 bg-transparent text-surface-fg outline-hidden',\n 'placeholder:text-surface-fg-subtle',\n isCompact ? 'h-9 text-ds-sm' : 'h-12 text-ds-base',\n isProcessing && 'cursor-wait',\n disabled && 'cursor-not-allowed opacity-50',\n )}\n autoComplete=\"off\"\n autoCorrect=\"off\"\n spellCheck={false}\n />\n </div>\n\n {/* Right side: spinner / clear / shortcut badge */}\n {isProcessing ? (\n <span data-testid=\"command-bar-spinner\" className=\"shrink-0\">\n <Icon\n icon={IconLoader2}\n size={isCompact ? 'xs' : 'sm'}\n stroke=\"light\"\n animate=\"spin\"\n className=\"text-accent-9\"\n />\n </span>\n ) : isResponded ? (\n <button\n type=\"button\"\n onClick={handleClear}\n className=\"shrink-0 rounded-control-inner p-ds-01 text-surface-fg-subtle transition-colors duration-fast-01 hover:bg-surface-raised-hover hover:text-surface-fg-muted focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-accent-9\"\n aria-label=\"Clear\"\n title=\"Clear\"\n >\n <Icon\n icon={IconX}\n size={isCompact ? 'xs' : 'sm'}\n stroke=\"light\"\n />\n </button>\n ) : variant === 'hero' ? (\n <AnimatePresence>\n {!isFocused && (\n <motion.kbd\n initial={noInit ?? { opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={isReduced ? undefined : { opacity: 0 }}\n transition={tweenFade}\n className=\"hidden shrink-0 select-none rounded-control border border-surface-border-strong bg-surface-raised px-ds-02b py-ds-01 text-ds-sm font-medium text-surface-fg-subtle shadow-kbd sm:inline-flex\"\n >\n {getModifierDisplay(isMac)}J\n </motion.kbd>\n )}\n </AnimatePresence>\n ) : null}\n </div>\n </GradientBorderWrap>\n )\n\n // =====================================================================\n // Command Results (shared between variants)\n // =====================================================================\n const renderCommandResults = () => {\n if (!hasGroups) return null\n\n const showResults =\n filteredItems.length > 0 || (query.trim() && filteredGroups.length === 0)\n\n if (!showResults && !query.trim()) return null\n\n return (\n <div\n ref={listRef}\n id={listboxId}\n role=\"listbox\"\n aria-label=\"Command results\"\n className=\"overflow-y-auto px-ds-03 py-ds-03\"\n style={{ maxHeight: maxHeightValue }}\n >\n {filteredGroups.length === 0 && query.trim() && (\n <motion.div\n initial={noInit ?? { opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={tweenFade}\n className=\"flex items-center justify-center py-ds-07\"\n >\n {emptyState ?? (\n <p className=\"text-ds-md text-surface-fg-subtle\">\n {emptyMessage}\n </p>\n )}\n </motion.div>\n )}\n\n {filteredGroups.map((group, groupIdx) => (\n <motion.div\n key={group.label}\n initial={noInit ?? { opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={\n isReduced\n ? noMotionTransition\n : { ...tweens.fade, delay: groupIdx * 0.06 }\n }\n className=\"mb-ds-02\"\n >\n <div className=\"px-ds-03 pb-ds-02 pt-ds-03\">\n <span className=\"text-ds-xs font-semibold uppercase tracking-wider text-surface-fg-subtle\">\n {group.label}\n </span>\n </div>\n\n {group.items.map((item) => {\n const itemIndex = itemIndexMap.get(item.id) ?? 0\n const isActive = itemIndex === activeIndex\n return (\n <motion.button\n key={item.id}\n id={`command-bar-item-${instanceId}-${item.id}`}\n type=\"button\"\n role=\"option\"\n aria-selected={isActive}\n data-command-index={itemIndex}\n initial={noInit ?? { opacity: 0, y: 4 }}\n animate={{ opacity: 1, y: 0 }}\n transition={\n isReduced\n ? noMotionTransition\n : { ...springs.snappy, delay: itemIndex * 0.03 }\n }\n onClick={() => {\n item.onSelect()\n if (variant === 'floating') setOpen(false)\n }}\n onMouseEnter={() => setActiveIndex(itemIndex)}\n className={cn(\n 'flex w-full items-center gap-ds-04 rounded-surface px-ds-03 py-ds-03 text-left transition-[color,background-color] duration-fast-02 ease-productive-standard',\n isActive\n ? 'bg-surface-raised-hover text-surface-fg'\n : 'text-surface-fg-muted hover:bg-surface-raised',\n )}\n >\n {item.icon && (\n <span\n className={cn(\n '[&>svg]:h-ico-sm [&>svg]:w-ico-sm shrink-0 transition-colors duration-fast-02 ease-productive-standard',\n isActive\n ? 'text-accent-11'\n : 'text-surface-fg-subtle',\n )}\n aria-hidden=\"true\"\n >\n <IconProvider size=\"sm\">{normalizeIcon(item.icon)}</IconProvider>\n </span>\n )}\n <div className=\"flex flex-1 flex-col\">\n <span className=\"text-ds-md\">\n {item.renderLabel\n ? item.renderLabel(query)\n : item.label}\n </span>\n {item.description && (\n <span className=\"text-ds-sm text-surface-fg-subtle\">\n {item.description}\n </span>\n )}\n </div>\n <AnimatePresence>\n {isActive && (\n <motion.span\n initial={isReduced ? undefined : { opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={isReduced ? undefined : { opacity: 0 }}\n transition={tweenFade}\n className=\"inline-flex shrink-0\"\n >\n <Icon\n icon={IconCornerDownLeft}\n size=\"sm\"\n stroke=\"light\"\n className=\"text-surface-fg-subtle\"\n />\n </motion.span>\n )}\n </AnimatePresence>\n </motion.button>\n )\n })}\n </motion.div>\n ))}\n </div>\n )\n }\n\n // =====================================================================\n // Hero Variant\n // =====================================================================\n if (variant === 'hero') {\n return (\n <div\n ref={ref}\n role=\"search\"\n className={cn(\n 'bg-surface-raised rounded-overlay-lg shadow-raised p-ds-07',\n className,\n )}\n {...props}\n >\n {greeting && (\n <p className=\"text-ds-lg text-surface-fg-muted mb-ds-04\">\n {greeting}\n </p>\n )}\n\n {renderInputRow()}\n {renderCommandResults()}\n\n {/* Hints */}\n {hints && hints.length > 0 && (\n <div className=\"mt-ds-04 flex flex-wrap gap-ds-02b\">\n {hints.map((hint) => (\n <button\n key={hint}\n type=\"button\"\n onClick={() => {\n setQuery(hint)\n onSearch?.(hint)\n inputRef.current?.focus()\n }}\n className=\"rounded-control border border-surface-border-strong bg-surface-overlay px-ds-03 py-ds-01 text-ds-sm text-surface-fg-subtle transition-colors duration-fast-02 ease-productive-standard hover:bg-surface-raised-hover hover:text-surface-fg-muted\"\n >\n {hint}\n </button>\n ))}\n </div>\n )}\n\n {/* Response area (children) */}\n {children && <div className=\"mt-ds-05\">{children}</div>}\n </div>\n )\n }\n\n // =====================================================================\n // Inline Variant\n // =====================================================================\n if (variant === 'inline') {\n return (\n <div\n ref={ref}\n role=\"search\"\n className={cn('w-full', className)}\n {...props}\n >\n {renderInputRow()}\n {renderCommandResults()}\n {children && <div className=\"mt-ds-03\">{children}</div>}\n </div>\n )\n }\n\n // =====================================================================\n // Floating Variant\n // =====================================================================\n const handleDialogOpenChange = (nextOpen: boolean) => {\n setOpen(nextOpen)\n }\n\n return (\n <Dialog open={open} onOpenChange={handleDialogOpenChange}>\n <DialogPortal>\n <DialogOverlay className=\"fixed inset-0 z-overlay bg-overlay data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0\" />\n <DialogContentRaw\n ref={ref}\n {...props}\n className={cn(\n 'fixed left-1/2 top-[20%] z-modal w-full max-w-[560px] -translate-x-1/2',\n 'overflow-hidden rounded-overlay-lg bg-surface-overlay shadow-overlay',\n 'duration-moderate-02 data-[state=open]:animate-in data-[state=closed]:animate-out',\n 'data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0',\n 'data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95',\n 'data-[state=closed]:slide-out-to-left-1/2 data-[state=open]:slide-in-from-left-1/2',\n 'data-[state=closed]:slide-out-to-top-2 data-[state=open]:slide-in-from-top-2',\n className,\n )}\n >\n <VisuallyHidden>\n <DialogTitle>AI Command Bar</DialogTitle>\n <DialogDescription>\n Search commands or ask a question\n </DialogDescription>\n </VisuallyHidden>\n\n <div className=\"p-ds-04\">{renderInputRow()}</div>\n\n {renderCommandResults()}\n\n {children && (\n <div className=\"border-t border-surface-border-strong p-ds-04\">\n {children}\n </div>\n )}\n\n {/* Footer hints */}\n <motion.div\n initial={noInit ?? { opacity: 0 }}\n animate={{ opacity: 1 }}\n transition={tweenFade}\n className=\"flex items-center gap-ds-05 border-t border-surface-border-strong px-ds-05 py-ds-03\"\n >\n {hasGroups && (\n <div className=\"flex items-center gap-ds-02b\">\n <div className=\"flex items-center gap-ds-01\">\n <kbd className=\"inline-flex h-ico-md w-ico-md items-center justify-center rounded border border-surface-border-strong bg-surface-raised shadow-kbd\">\n <Icon icon={IconArrowUp} size=\"xs\" className=\"text-surface-fg-subtle\" />\n </kbd>\n <kbd className=\"inline-flex h-ico-md w-ico-md items-center justify-center rounded border border-surface-border-strong bg-surface-raised shadow-kbd\">\n <Icon icon={IconArrowDown} size=\"xs\" className=\"text-surface-fg-subtle\" />\n </kbd>\n </div>\n <span className=\"text-ds-xs text-surface-fg-subtle\">\n Navigate\n </span>\n </div>\n )}\n <div className=\"flex items-center gap-ds-02b\">\n <kbd className=\"inline-flex h-[20px] items-center justify-center rounded-control border border-surface-border-strong bg-surface-raised px-ds-02b shadow-kbd\">\n <Icon icon={IconCornerDownLeft} size=\"xs\" className=\"text-surface-fg-subtle\" />\n </kbd>\n <span className=\"text-ds-xs text-surface-fg-subtle\">\n Submit\n </span>\n </div>\n <div className=\"flex items-center gap-ds-02b\">\n <kbd className=\"inline-flex h-[20px] items-center justify-center rounded-control border border-surface-border-strong bg-surface-raised px-ds-02b text-ds-xs font-medium text-surface-fg-subtle shadow-kbd\">\n Esc\n </kbd>\n <span className=\"text-ds-xs text-surface-fg-subtle\">\n Close\n </span>\n </div>\n </motion.div>\n </DialogContentRaw>\n </DialogPortal>\n </Dialog>\n )\n },\n)\n\nCommandBar.displayName = 'CommandBar'\n\nexport { CommandBar }\nexport type { CommandGroup, CommandItem }\n"],"mappings":"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"}
@@ -69,10 +69,7 @@ function b({ message: e, reducedMotion: t }) {
69
69
  })
70
70
  }) : /* @__PURE__ */ u(_.div, {
71
71
  className: "bg-surface-raised rounded-surface px-ds-05 py-ds-04",
72
- initial: {
73
- opacity: 0,
74
- y: 8
75
- },
72
+ initial: { y: 8 },
76
73
  animate: {
77
74
  opacity: 1,
78
75
  y: 0
@@ -169,10 +166,7 @@ function C({ onClick: e }) {
169
166
  role: "button",
170
167
  "aria-label": "Scroll to latest response",
171
168
  className: "absolute bottom-ds-04 left-1/2 -translate-x-1/2 z-10 flex items-center gap-ds-02 bg-accent-9 text-accent-fg text-ds-xs font-medium rounded-pill px-ds-04 py-ds-02 shadow-floating",
172
- initial: {
173
- opacity: 0,
174
- y: 8
175
- },
169
+ initial: { y: 8 },
176
170
  animate: {
177
171
  opacity: 1,
178
172
  y: 0
@@ -1 +1 @@
1
- {"version":3,"file":"conversation.js","names":[],"sources":["../../src/ai/conversation.tsx"],"sourcesContent":["'use client'\n\nimport {\n IconCircle,\n IconCircleCheck,\n IconCircleX,\n IconLoader2,\n} from '@tabler/icons-react'\nimport { AnimatePresence,motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { useMotion } from '../motion/motion-provider'\nimport { Icon } from '../ui/icon'\nimport { IconProvider } from '../ui/icon-context'\nimport type { IconInput } from '../ui/lib/icon-input'\nimport { durations,springs } from '../ui/lib/motion'\nimport { normalizeIcon } from '../ui/lib/normalize-icon'\nimport { cn } from '../ui/lib/utils'\nimport { useAICommand } from './ai-command-provider'\nimport { BlockRenderer } from './block-renderer'\nimport type {\n BlockComponentProps,\n ConversationMessage,\n ProcessingStep,\n} from './types'\n\n// ── Props ────────────────────────────────────────────────────────────────────\n\n/**\n * Renders a scrollable AI conversation thread with support for streaming\n * processing steps, custom content blocks, and action confirmations.\n */\nexport interface AIConversationProps {\n /** Ordered conversation messages (user + assistant turns). */\n messages: ConversationMessage[]\n /** When true, shows a live processing indicator below the last message. */\n isProcessing?: boolean\n /** Granular processing steps shown during the processing state. */\n processingSteps?: ProcessingStep[]\n /** Agent identity displayed as a header on assistant messages. */\n agent?: { name: string; icon?: IconInput }\n /** Called when user interacts with an action block (confirm/cancel/undo). */\n onAction?: (actionId: string, type: 'confirm' | 'cancel' | 'undo') => void\n /** Map of custom block type names to React components for extensible rendering. */\n customBlocks?: Record<string, React.ComponentType<BlockComponentProps<any>>>\n /** Max height of the conversation container (CSS value). Enables scrolling. */\n maxHeight?: string | number\n /** Auto-scroll to bottom on new messages. @default true */\n autoScroll?: boolean\n className?: string\n}\n\n// ── Step status icon ─────────────────────────────────────────────────────────\n\nfunction StepStatusIcon({ status }: { status: ProcessingStep['status'] }) {\n switch (status) {\n case 'done':\n return (\n <Icon icon={IconCircleCheck} size=\"sm\" className=\"text-success-11\" />\n )\n case 'active':\n return (\n <motion.span\n className=\"inline-flex items-center justify-center text-accent-9\"\n animate={{ rotate: 360 }}\n transition={{ repeat: Infinity, duration: 1, ease: 'linear' }}\n aria-hidden=\"true\"\n >\n <Icon icon={IconLoader2} size=\"sm\" />\n </motion.span>\n )\n case 'error':\n return (\n <Icon icon={IconCircleX} size=\"sm\" className=\"text-error-11\" />\n )\n case 'pending':\n default:\n return (\n <Icon icon={IconCircle} size=\"sm\" className=\"text-surface-fg-subtle opacity-50\" />\n )\n }\n}\n\n// ── Agent header ─────────────────────────────────────────────────────────────\n\nfunction AgentHeader({\n name,\n icon,\n}: {\n name: string\n icon?: IconInput\n}) {\n return (\n <div className=\"flex items-center gap-ds-02b mb-ds-03\">\n {icon && <span className=\"h-4 w-4 flex items-center justify-center\"><IconProvider size=\"sm\">{normalizeIcon(icon)}</IconProvider></span>}\n <span className=\"text-ds-xs font-semibold uppercase tracking-wider text-surface-fg-subtle\">\n {name}\n </span>\n </div>\n )\n}\n\n// ── User message ─────────────────────────────────────────────────────────────\n\nfunction UserMessage({\n message,\n reducedMotion,\n}: {\n message: ConversationMessage\n reducedMotion: boolean\n}) {\n if (reducedMotion) {\n return (\n <div className=\"bg-surface-raised rounded-surface px-ds-05 py-ds-04\">\n <p className=\"text-ds-sm text-surface-fg\">{message.content}</p>\n </div>\n )\n }\n\n return (\n <motion.div\n className=\"bg-surface-raised rounded-surface px-ds-05 py-ds-04\"\n initial={{ opacity: 0, y: 8 }}\n animate={{ opacity: 1, y: 0 }}\n transition={springs.snappy}\n >\n <p className=\"text-ds-sm text-surface-fg\">{message.content}</p>\n </motion.div>\n )\n}\n\n// ── Assistant message ────────────────────────────────────────────────────────\n\nfunction AssistantMessage({\n message,\n agent,\n onAction,\n customBlocks,\n}: {\n message: ConversationMessage\n agent: { name: string; icon?: IconInput }\n onAction?: (actionId: string, type: 'confirm' | 'cancel' | 'undo') => void\n customBlocks?: Record<string, React.ComponentType<BlockComponentProps<any>>>\n}) {\n return (\n <div>\n <AgentHeader name={agent.name} icon={agent.icon} />\n {message.blocks && (\n <BlockRenderer\n blocks={message.blocks}\n onAction={onAction}\n customBlocks={customBlocks}\n />\n )}\n </div>\n )\n}\n\n// ── Processing indicator ─────────────────────────────────────────────────────\n\nfunction ProcessingIndicator({\n steps,\n agent,\n reducedMotion,\n}: {\n steps?: ProcessingStep[]\n agent: { name: string; icon?: IconInput }\n reducedMotion: boolean\n}) {\n // Step visualization\n if (steps && steps.length > 0) {\n return (\n <div role=\"status\" aria-busy=\"true\" aria-label=\"Processing\">\n <AgentHeader name={agent.name} icon={agent.icon} />\n <div className=\"flex flex-col gap-ds-02b\">\n {steps.map((step, i) => (\n <motion.div\n key={step.id}\n className=\"flex items-center gap-ds-02b\"\n initial={reducedMotion ? undefined : { opacity: 0, x: -8 }}\n animate={{ opacity: 1, x: 0 }}\n transition={\n reducedMotion\n ? { duration: 0 }\n : { duration: durations.moderate01b, delay: i * 0.05 }\n }\n >\n <StepStatusIcon status={step.status} />\n <span\n className={cn(\n 'text-ds-sm',\n step.status === 'pending'\n ? 'text-surface-fg-subtle'\n : 'text-surface-fg',\n )}\n >\n {step.label}\n </span>\n </motion.div>\n ))}\n </div>\n </div>\n )\n }\n\n // Breathing dots\n return (\n <div\n role=\"status\"\n aria-busy=\"true\"\n aria-label={`${agent.name} is processing`}\n >\n <AgentHeader name={agent.name} icon={agent.icon} />\n <div className=\"flex items-center gap-ds-02\">\n {!reducedMotion &&\n [0, 1, 2].map((i) => (\n <motion.span\n key={i}\n className=\"h-1.5 w-1.5 rounded-pill bg-accent-9\"\n animate={{ scale: [1, 1.4, 1], opacity: [0.4, 1, 0.4] }}\n transition={{\n duration: 1.4,\n repeat: Infinity,\n ease: 'easeInOut',\n delay: i * 0.16,\n }}\n />\n ))}\n <span className=\"ml-ds-02b text-ds-sm text-surface-fg-subtle\">\n {agent.name} is thinking...\n </span>\n </div>\n </div>\n )\n}\n\n// ── Scroll-to-bottom pill ────────────────────────────────────────────────────\n\nfunction ScrollToBottomPill({ onClick }: { onClick: () => void }) {\n return (\n <motion.button\n role=\"button\"\n aria-label=\"Scroll to latest response\"\n className=\"absolute bottom-ds-04 left-1/2 -translate-x-1/2 z-10 flex items-center gap-ds-02 bg-accent-9 text-accent-fg text-ds-xs font-medium rounded-pill px-ds-04 py-ds-02 shadow-floating\"\n initial={{ opacity: 0, y: 8 }}\n animate={{ opacity: 1, y: 0 }}\n exit={{ opacity: 0, y: 8 }}\n transition={springs.snappy}\n onClick={onClick}\n >\n {'\\u2193'} New response\n </motion.button>\n )\n}\n\n// ── Default agent ────────────────────────────────────────────────────────────\n\nconst DEFAULT_AGENT = { name: 'Assistant' }\n\n// ── AIConversation ───────────────────────────────────────────────────────────\n\nconst AIConversation = React.forwardRef<HTMLDivElement, AIConversationProps>(({\n messages,\n isProcessing = false,\n processingSteps,\n agent: agentProp,\n onAction,\n customBlocks,\n maxHeight,\n autoScroll = true,\n className,\n}, ref) => {\n const ctx = useAICommand()\n const { reducedMotion } = useMotion()\n\n // Resolve agent: prop > context > default\n const agent = agentProp ?? ctx?.agent ?? DEFAULT_AGENT\n\n // Resolve onAction: prop > context\n const resolvedOnAction = onAction ?? ctx?.onAction\n\n // Resolve customBlocks: prop wins over context\n const resolvedCustomBlocks = React.useMemo(() => {\n const contextBlocks = ctx?.customBlocks ?? {}\n return { ...contextBlocks, ...customBlocks }\n }, [ctx?.customBlocks, customBlocks])\n\n // ── Auto-scroll ──────────────────────────────────────────────────────────\n\n const scrollRef = React.useRef<HTMLDivElement>(null)\n const sentinelRef = React.useRef<HTMLDivElement>(null)\n const [isAtBottom, setIsAtBottom] = React.useState(true)\n const [hasNewContent, setHasNewContent] = React.useState(false)\n const prevMessageCount = React.useRef(messages.length)\n const prevProcessing = React.useRef(isProcessing)\n\n // Track if user is scrolled to bottom via IntersectionObserver\n React.useEffect(() => {\n if (!autoScroll || !sentinelRef.current) return\n\n const observer = new IntersectionObserver(\n ([entry]) => {\n setIsAtBottom(entry.isIntersecting)\n if (entry.isIntersecting) {\n setHasNewContent(false)\n }\n },\n {\n root: scrollRef.current,\n threshold: 0.1,\n },\n )\n\n observer.observe(sentinelRef.current)\n return () => observer.disconnect()\n }, [autoScroll])\n\n // Auto-scroll or show pill on new content\n React.useEffect(() => {\n const contentChanged =\n messages.length !== prevMessageCount.current ||\n isProcessing !== prevProcessing.current\n\n prevMessageCount.current = messages.length\n prevProcessing.current = isProcessing\n\n if (!contentChanged || !autoScroll) return\n\n if (isAtBottom) {\n sentinelRef.current?.scrollIntoView({ behavior: 'smooth', block: 'end' })\n } else {\n setHasNewContent(true)\n }\n }, [messages, isProcessing, isAtBottom, autoScroll])\n\n const scrollToBottom = React.useCallback(() => {\n sentinelRef.current?.scrollIntoView({ behavior: 'smooth', block: 'end' })\n setIsAtBottom(true)\n setHasNewContent(false)\n }, [])\n\n // ── Render ───────────────────────────────────────────────────────────────\n\n return (\n <div ref={ref} className={cn('relative', className)}>\n <div\n ref={scrollRef}\n className=\"flex flex-col gap-ds-05 overflow-y-auto\"\n aria-live=\"polite\"\n style={\n maxHeight\n ? {\n maxHeight:\n typeof maxHeight === 'number' ? `${maxHeight}px` : maxHeight,\n }\n : undefined\n }\n >\n {messages.map((msg) =>\n msg.role === 'user' ? (\n <UserMessage\n key={msg.id}\n message={msg}\n reducedMotion={reducedMotion}\n />\n ) : (\n <AssistantMessage\n key={msg.id}\n message={msg}\n agent={agent}\n onAction={resolvedOnAction}\n customBlocks={resolvedCustomBlocks}\n />\n ),\n )}\n {isProcessing && (\n <ProcessingIndicator\n steps={processingSteps}\n agent={agent}\n reducedMotion={reducedMotion}\n />\n )}\n <div ref={sentinelRef} className=\"h-px\" />\n </div>\n <AnimatePresence>\n {!isAtBottom && hasNewContent && (\n <ScrollToBottomPill onClick={scrollToBottom} />\n )}\n </AnimatePresence>\n </div>\n )\n})\nAIConversation.displayName = 'AIConversation'\n\nexport { AIConversation }\n"],"mappings":"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"}
1
+ {"version":3,"file":"conversation.js","names":[],"sources":["../../src/ai/conversation.tsx"],"sourcesContent":["'use client'\n\nimport {\n IconCircle,\n IconCircleCheck,\n IconCircleX,\n IconLoader2,\n} from '@tabler/icons-react'\nimport { AnimatePresence,motion } from 'framer-motion'\nimport * as React from 'react'\n\nimport { useMotion } from '../motion/motion-provider'\nimport { Icon } from '../ui/icon'\nimport { IconProvider } from '../ui/icon-context'\nimport type { IconInput } from '../ui/lib/icon-input'\nimport { durations,springs } from '../ui/lib/motion'\nimport { normalizeIcon } from '../ui/lib/normalize-icon'\nimport { cn } from '../ui/lib/utils'\nimport { useAICommand } from './ai-command-provider'\nimport { BlockRenderer } from './block-renderer'\nimport type {\n BlockComponentProps,\n ConversationMessage,\n ProcessingStep,\n} from './types'\n\n// ── Props ────────────────────────────────────────────────────────────────────\n\n/**\n * Renders a scrollable AI conversation thread with support for streaming\n * processing steps, custom content blocks, and action confirmations.\n */\nexport interface AIConversationProps {\n /** Ordered conversation messages (user + assistant turns). */\n messages: ConversationMessage[]\n /** When true, shows a live processing indicator below the last message. */\n isProcessing?: boolean\n /** Granular processing steps shown during the processing state. */\n processingSteps?: ProcessingStep[]\n /** Agent identity displayed as a header on assistant messages. */\n agent?: { name: string; icon?: IconInput }\n /** Called when user interacts with an action block (confirm/cancel/undo). */\n onAction?: (actionId: string, type: 'confirm' | 'cancel' | 'undo') => void\n /** Map of custom block type names to React components for extensible rendering. */\n customBlocks?: Record<string, React.ComponentType<BlockComponentProps<any>>>\n /** Max height of the conversation container (CSS value). Enables scrolling. */\n maxHeight?: string | number\n /** Auto-scroll to bottom on new messages. @default true */\n autoScroll?: boolean\n className?: string\n}\n\n// ── Step status icon ─────────────────────────────────────────────────────────\n\nfunction StepStatusIcon({ status }: { status: ProcessingStep['status'] }) {\n switch (status) {\n case 'done':\n return (\n <Icon icon={IconCircleCheck} size=\"sm\" className=\"text-success-11\" />\n )\n case 'active':\n return (\n <motion.span\n className=\"inline-flex items-center justify-center text-accent-9\"\n animate={{ rotate: 360 }}\n transition={{ repeat: Infinity, duration: 1, ease: 'linear' }}\n aria-hidden=\"true\"\n >\n <Icon icon={IconLoader2} size=\"sm\" />\n </motion.span>\n )\n case 'error':\n return (\n <Icon icon={IconCircleX} size=\"sm\" className=\"text-error-11\" />\n )\n case 'pending':\n default:\n return (\n <Icon icon={IconCircle} size=\"sm\" className=\"text-surface-fg-subtle opacity-50\" />\n )\n }\n}\n\n// ── Agent header ─────────────────────────────────────────────────────────────\n\nfunction AgentHeader({\n name,\n icon,\n}: {\n name: string\n icon?: IconInput\n}) {\n return (\n <div className=\"flex items-center gap-ds-02b mb-ds-03\">\n {icon && <span className=\"h-4 w-4 flex items-center justify-center\"><IconProvider size=\"sm\">{normalizeIcon(icon)}</IconProvider></span>}\n <span className=\"text-ds-xs font-semibold uppercase tracking-wider text-surface-fg-subtle\">\n {name}\n </span>\n </div>\n )\n}\n\n// ── User message ─────────────────────────────────────────────────────────────\n\nfunction UserMessage({\n message,\n reducedMotion,\n}: {\n message: ConversationMessage\n reducedMotion: boolean\n}) {\n if (reducedMotion) {\n return (\n <div className=\"bg-surface-raised rounded-surface px-ds-05 py-ds-04\">\n <p className=\"text-ds-sm text-surface-fg\">{message.content}</p>\n </div>\n )\n }\n\n return (\n <motion.div\n className=\"bg-surface-raised rounded-surface px-ds-05 py-ds-04\"\n initial={{ y: 8 }}\n animate={{ opacity: 1, y: 0 }}\n transition={springs.snappy}\n >\n <p className=\"text-ds-sm text-surface-fg\">{message.content}</p>\n </motion.div>\n )\n}\n\n// ── Assistant message ────────────────────────────────────────────────────────\n\nfunction AssistantMessage({\n message,\n agent,\n onAction,\n customBlocks,\n}: {\n message: ConversationMessage\n agent: { name: string; icon?: IconInput }\n onAction?: (actionId: string, type: 'confirm' | 'cancel' | 'undo') => void\n customBlocks?: Record<string, React.ComponentType<BlockComponentProps<any>>>\n}) {\n return (\n <div>\n <AgentHeader name={agent.name} icon={agent.icon} />\n {message.blocks && (\n <BlockRenderer\n blocks={message.blocks}\n onAction={onAction}\n customBlocks={customBlocks}\n />\n )}\n </div>\n )\n}\n\n// ── Processing indicator ─────────────────────────────────────────────────────\n\nfunction ProcessingIndicator({\n steps,\n agent,\n reducedMotion,\n}: {\n steps?: ProcessingStep[]\n agent: { name: string; icon?: IconInput }\n reducedMotion: boolean\n}) {\n // Step visualization\n if (steps && steps.length > 0) {\n return (\n <div role=\"status\" aria-busy=\"true\" aria-label=\"Processing\">\n <AgentHeader name={agent.name} icon={agent.icon} />\n <div className=\"flex flex-col gap-ds-02b\">\n {steps.map((step, i) => (\n <motion.div\n key={step.id}\n className=\"flex items-center gap-ds-02b\"\n initial={reducedMotion ? undefined : { opacity: 0, x: -8 }}\n animate={{ opacity: 1, x: 0 }}\n transition={\n reducedMotion\n ? { duration: 0 }\n : { duration: durations.moderate01b, delay: i * 0.05 }\n }\n >\n <StepStatusIcon status={step.status} />\n <span\n className={cn(\n 'text-ds-sm',\n step.status === 'pending'\n ? 'text-surface-fg-subtle'\n : 'text-surface-fg',\n )}\n >\n {step.label}\n </span>\n </motion.div>\n ))}\n </div>\n </div>\n )\n }\n\n // Breathing dots\n return (\n <div\n role=\"status\"\n aria-busy=\"true\"\n aria-label={`${agent.name} is processing`}\n >\n <AgentHeader name={agent.name} icon={agent.icon} />\n <div className=\"flex items-center gap-ds-02\">\n {!reducedMotion &&\n [0, 1, 2].map((i) => (\n <motion.span\n key={i}\n className=\"h-1.5 w-1.5 rounded-pill bg-accent-9\"\n animate={{ scale: [1, 1.4, 1], opacity: [0.4, 1, 0.4] }}\n transition={{\n duration: 1.4,\n repeat: Infinity,\n ease: 'easeInOut',\n delay: i * 0.16,\n }}\n />\n ))}\n <span className=\"ml-ds-02b text-ds-sm text-surface-fg-subtle\">\n {agent.name} is thinking...\n </span>\n </div>\n </div>\n )\n}\n\n// ── Scroll-to-bottom pill ────────────────────────────────────────────────────\n\nfunction ScrollToBottomPill({ onClick }: { onClick: () => void }) {\n return (\n <motion.button\n role=\"button\"\n aria-label=\"Scroll to latest response\"\n className=\"absolute bottom-ds-04 left-1/2 -translate-x-1/2 z-10 flex items-center gap-ds-02 bg-accent-9 text-accent-fg text-ds-xs font-medium rounded-pill px-ds-04 py-ds-02 shadow-floating\"\n initial={{ y: 8 }}\n animate={{ opacity: 1, y: 0 }}\n exit={{ opacity: 0, y: 8 }}\n transition={springs.snappy}\n onClick={onClick}\n >\n {'\\u2193'} New response\n </motion.button>\n )\n}\n\n// ── Default agent ────────────────────────────────────────────────────────────\n\nconst DEFAULT_AGENT = { name: 'Assistant' }\n\n// ── AIConversation ───────────────────────────────────────────────────────────\n\nconst AIConversation = React.forwardRef<HTMLDivElement, AIConversationProps>(({\n messages,\n isProcessing = false,\n processingSteps,\n agent: agentProp,\n onAction,\n customBlocks,\n maxHeight,\n autoScroll = true,\n className,\n}, ref) => {\n const ctx = useAICommand()\n const { reducedMotion } = useMotion()\n\n // Resolve agent: prop > context > default\n const agent = agentProp ?? ctx?.agent ?? DEFAULT_AGENT\n\n // Resolve onAction: prop > context\n const resolvedOnAction = onAction ?? ctx?.onAction\n\n // Resolve customBlocks: prop wins over context\n const resolvedCustomBlocks = React.useMemo(() => {\n const contextBlocks = ctx?.customBlocks ?? {}\n return { ...contextBlocks, ...customBlocks }\n }, [ctx?.customBlocks, customBlocks])\n\n // ── Auto-scroll ──────────────────────────────────────────────────────────\n\n const scrollRef = React.useRef<HTMLDivElement>(null)\n const sentinelRef = React.useRef<HTMLDivElement>(null)\n const [isAtBottom, setIsAtBottom] = React.useState(true)\n const [hasNewContent, setHasNewContent] = React.useState(false)\n const prevMessageCount = React.useRef(messages.length)\n const prevProcessing = React.useRef(isProcessing)\n\n // Track if user is scrolled to bottom via IntersectionObserver\n React.useEffect(() => {\n if (!autoScroll || !sentinelRef.current) return\n\n const observer = new IntersectionObserver(\n ([entry]) => {\n setIsAtBottom(entry.isIntersecting)\n if (entry.isIntersecting) {\n setHasNewContent(false)\n }\n },\n {\n root: scrollRef.current,\n threshold: 0.1,\n },\n )\n\n observer.observe(sentinelRef.current)\n return () => observer.disconnect()\n }, [autoScroll])\n\n // Auto-scroll or show pill on new content\n React.useEffect(() => {\n const contentChanged =\n messages.length !== prevMessageCount.current ||\n isProcessing !== prevProcessing.current\n\n prevMessageCount.current = messages.length\n prevProcessing.current = isProcessing\n\n if (!contentChanged || !autoScroll) return\n\n if (isAtBottom) {\n sentinelRef.current?.scrollIntoView({ behavior: 'smooth', block: 'end' })\n } else {\n setHasNewContent(true)\n }\n }, [messages, isProcessing, isAtBottom, autoScroll])\n\n const scrollToBottom = React.useCallback(() => {\n sentinelRef.current?.scrollIntoView({ behavior: 'smooth', block: 'end' })\n setIsAtBottom(true)\n setHasNewContent(false)\n }, [])\n\n // ── Render ───────────────────────────────────────────────────────────────\n\n return (\n <div ref={ref} className={cn('relative', className)}>\n <div\n ref={scrollRef}\n className=\"flex flex-col gap-ds-05 overflow-y-auto\"\n aria-live=\"polite\"\n style={\n maxHeight\n ? {\n maxHeight:\n typeof maxHeight === 'number' ? `${maxHeight}px` : maxHeight,\n }\n : undefined\n }\n >\n {messages.map((msg) =>\n msg.role === 'user' ? (\n <UserMessage\n key={msg.id}\n message={msg}\n reducedMotion={reducedMotion}\n />\n ) : (\n <AssistantMessage\n key={msg.id}\n message={msg}\n agent={agent}\n onAction={resolvedOnAction}\n customBlocks={resolvedCustomBlocks}\n />\n ),\n )}\n {isProcessing && (\n <ProcessingIndicator\n steps={processingSteps}\n agent={agent}\n reducedMotion={reducedMotion}\n />\n )}\n <div ref={sentinelRef} className=\"h-px\" />\n </div>\n <AnimatePresence>\n {!isAtBottom && hasNewContent && (\n <ScrollToBottomPill onClick={scrollToBottom} />\n )}\n </AnimatePresence>\n </div>\n )\n})\nAIConversation.displayName = 'AIConversation'\n\nexport { AIConversation }\n"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"devadoot-icon.d.ts","sourceRoot":"","sources":["../../src/ai/devadoot-icon.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,YAAY,GAAG,WAAW,GAAG,OAAO,CAAA;AAEzE,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAiCD,QAAA,MAAM,YAAY,0DAIf,iBAAiB,6CAqJlB,CAAA;AAIF,OAAO,EAAE,YAAY,EAAE,CAAA"}
1
+ {"version":3,"file":"devadoot-icon.d.ts","sourceRoot":"","sources":["../../src/ai/devadoot-icon.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAK9B,MAAM,MAAM,aAAa,GAAG,MAAM,GAAG,YAAY,GAAG,WAAW,GAAG,OAAO,CAAA;AAEzE,MAAM,WAAW,iBAAiB;IAChC,KAAK,CAAC,EAAE,aAAa,CAAA;IACrB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB;AAiCD,QAAA,MAAM,YAAY,0DAIf,iBAAiB,6CAuHlB,CAAA;AAIF,OAAO,EAAE,YAAY,EAAE,CAAA"}