@nocoo/basalt 3.0.0 → 3.2.0

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 (83) hide show
  1. package/ai/DESIGN.md +157 -39
  2. package/ai/INTEGRATION.md +83 -8
  3. package/ai/USAGE.md +2 -2
  4. package/ai/registry.json +302 -79
  5. package/dist/charts/config.d.ts +1 -1
  6. package/dist/charts/config.js +1 -1
  7. package/dist/charts/config.js.map +1 -1
  8. package/dist/charts/heatmap-matrix.js +2 -2
  9. package/dist/charts/heatmap-matrix.js.map +1 -1
  10. package/dist/charts/sparkline.js +1 -1
  11. package/dist/charts/sparkline.js.map +1 -1
  12. package/dist/charts/stat-card.js +1 -1
  13. package/dist/charts/stat-card.js.map +1 -1
  14. package/dist/components/alert-dialog.js +4 -4
  15. package/dist/components/alert-dialog.js.map +1 -1
  16. package/dist/components/approval-card.js +5 -6
  17. package/dist/components/approval-card.js.map +1 -1
  18. package/dist/components/avatar.js +1 -1
  19. package/dist/components/avatar.js.map +1 -1
  20. package/dist/components/chat-bubble.js +1 -1
  21. package/dist/components/chat-bubble.js.map +1 -1
  22. package/dist/components/chat-header.js +1 -1
  23. package/dist/components/chat-header.js.map +1 -1
  24. package/dist/components/chat-inbox.js +1 -1
  25. package/dist/components/chat-inbox.js.map +1 -1
  26. package/dist/components/chat-markdown.js +1 -1
  27. package/dist/components/chat-markdown.js.map +1 -1
  28. package/dist/components/chat-message.js +1 -1
  29. package/dist/components/chat-message.js.map +1 -1
  30. package/dist/components/code.js +4 -3
  31. package/dist/components/code.js.map +1 -1
  32. package/dist/components/context-cards.js +5 -5
  33. package/dist/components/context-cards.js.map +1 -1
  34. package/dist/components/data-table.d.ts +7 -1
  35. package/dist/components/data-table.js +127 -132
  36. package/dist/components/data-table.js.map +1 -1
  37. package/dist/components/dialog.js +3 -3
  38. package/dist/components/dialog.js.map +1 -1
  39. package/dist/components/diff-table.js +20 -15
  40. package/dist/components/diff-table.js.map +1 -1
  41. package/dist/components/input-area.js +1 -1
  42. package/dist/components/input-area.js.map +1 -1
  43. package/dist/components/layer-card.d.ts +6 -4
  44. package/dist/components/layer-card.js +60 -71
  45. package/dist/components/layer-card.js.map +1 -1
  46. package/dist/components/loader.js +1 -1
  47. package/dist/components/loader.js.map +1 -1
  48. package/dist/components/page-header.d.ts +2 -2
  49. package/dist/components/page-header.js +7 -7
  50. package/dist/components/page-header.js.map +1 -1
  51. package/dist/components/recommendation-card.js +2 -2
  52. package/dist/components/recommendation-card.js.map +1 -1
  53. package/dist/components/section-rule.js +1 -1
  54. package/dist/components/section-rule.js.map +1 -1
  55. package/dist/components/select.js +1 -1
  56. package/dist/components/select.js.map +1 -1
  57. package/dist/components/sheet.js +3 -3
  58. package/dist/components/sheet.js.map +1 -1
  59. package/dist/components/sidebar.js +19 -16
  60. package/dist/components/sidebar.js.map +1 -1
  61. package/dist/components/skeleton-line.js +1 -1
  62. package/dist/components/skeleton-line.js.map +1 -1
  63. package/dist/components/stat-strip.js +1 -1
  64. package/dist/components/stat-strip.js.map +1 -1
  65. package/dist/components/table.d.ts +41 -2
  66. package/dist/components/table.js +44 -15
  67. package/dist/components/table.js.map +1 -1
  68. package/dist/components/tabs.js +1 -1
  69. package/dist/components/tabs.js.map +1 -1
  70. package/dist/components/tag-badge.js +1 -1
  71. package/dist/components/tag-badge.js.map +1 -1
  72. package/dist/components/text.js +2 -2
  73. package/dist/components/text.js.map +1 -1
  74. package/dist/components/thinking.js +1 -1
  75. package/dist/components/thinking.js.map +1 -1
  76. package/dist/components/tool-chips.js +2 -2
  77. package/dist/components/tool-chips.js.map +1 -1
  78. package/dist/styles/standalone.css +145 -89
  79. package/dist/styles/tailwind.css +2 -0
  80. package/dist/styles/tokens.css +84 -39
  81. package/dist/utils/use-hover-highlight.js +38 -36
  82. package/dist/utils/use-hover-highlight.js.map +1 -1
  83. package/package.json +28 -28
@@ -1 +1 @@
1
- {"version":3,"file":"stat-strip.js","names":["React","StatStrip","ariaBusy","props","cn","BASALT_UI_CLASS","className","loading","items","item","SkeletonLine","index"],"sources":["../../src/components/stat-strip.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { SkeletonLine } from \"./skeleton-line\";\n\nexport interface StatStripItem {\n\t/** The visible label for this statistic. */\n\tlabel: React.ReactNode;\n\t/** The visible value for this statistic. */\n\tvalue: React.ReactNode;\n}\n\nexport interface StatStripProps\n\textends Omit<React.HTMLAttributes<HTMLDListElement>, \"children\" | \"className\"> {\n\t/** Additional classes for the definition list. */\n\tclassName?: string;\n\t/** The labelled values shown in the strip. */\n\titems: readonly StatStripItem[];\n\t/**\n\t * Replace each value with a skeleton while keeping labels visible.\n\t * @default false\n\t */\n\tloading?: boolean;\n}\n\nexport const StatStrip = React.forwardRef<HTMLDListElement, StatStripProps>(\n\t({ \"aria-busy\": ariaBusy, className, items, loading = false, ...props }, ref) => {\n\t\treturn (\n\t\t\t<dl\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cn(\n\t\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\t\t\"grid grid-cols-2 gap-basalt-layout md:grid-cols-4\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t\taria-busy={loading ? true : ariaBusy}\n\t\t\t>\n\t\t\t\t{items.map((item, index) => (\n\t\t\t\t\t<div key={index} data-basalt-surface=\"\" className=\"rounded-basalt-lg p-basalt-card\">\n\t\t\t\t\t\t<dt className=\"text-basalt-base font-medium text-basalt-muted-foreground\">\n\t\t\t\t\t\t\t{item.label}\n\t\t\t\t\t\t</dt>\n\t\t\t\t\t\t<dd className=\"mt-basalt-space-sm text-basalt-xl font-medium tabular-nums text-basalt-foreground\">\n\t\t\t\t\t\t\t{loading ? <SkeletonLine /> : item.value}\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t</dl>\n\t\t);\n\t},\n);\nStatStrip.displayName = \"StatStrip\";\n"],"mappings":";;;;;;;AAyBA,IAAaC,IAAYD,EAAM,YAC7B,EAAE,aAAaE,GAAU,cAAW,UAAO,aAAU,IAAO,GAAGC,KAAS,MAEvE,kBAAC,MAAD;CACM;CACL,WAAWC,EACVC,GACA,qDACAC,CACD;CACA,GAAIH;CACJ,aAAWI,IAAU,KAAOL;CAE3B,UAAAM,EAAM,KAAK,GAAM,MACjB,kBAAC,OAAD;EAAiB,uBAAoB;EAAG,WAAU;EAAlD,UAAA,CACC,kBAAC,MAAD;GAAI,WAAU;GACZ,UAAAC,EAAK;EACH,CAAA,GACJ,kBAAC,MAAD;GAAI,WAAU;GACZ,UAAAF,IAAU,kBAACG,GAAD,CAAe,CAAA,IAAID,EAAK;EAChC,CAAA,CACA;CAPK,GAAAE,CAOL,CACL;AACE,CAAA,CAGP;AACA,EAAU,cAAc"}
1
+ {"version":3,"file":"stat-strip.js","names":["React","StatStrip","ariaBusy","props","cn","BASALT_UI_CLASS","className","loading","items","item","SkeletonLine","index"],"sources":["../../src/components/stat-strip.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { SkeletonLine } from \"./skeleton-line\";\n\nexport interface StatStripItem {\n\t/** The visible label for this statistic. */\n\tlabel: React.ReactNode;\n\t/** The visible value for this statistic. */\n\tvalue: React.ReactNode;\n}\n\nexport interface StatStripProps\n\textends Omit<React.HTMLAttributes<HTMLDListElement>, \"children\" | \"className\"> {\n\t/** Additional classes for the definition list. */\n\tclassName?: string;\n\t/** The labelled values shown in the strip. */\n\titems: readonly StatStripItem[];\n\t/**\n\t * Replace each value with a skeleton while keeping labels visible.\n\t * @default false\n\t */\n\tloading?: boolean;\n}\n\nexport const StatStrip = React.forwardRef<HTMLDListElement, StatStripProps>(\n\t({ \"aria-busy\": ariaBusy, className, items, loading = false, ...props }, ref) => {\n\t\treturn (\n\t\t\t<dl\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cn(\n\t\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\t\t\"grid grid-cols-2 gap-basalt-layout md:grid-cols-4\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t\taria-busy={loading ? true : ariaBusy}\n\t\t\t>\n\t\t\t\t{items.map((item, index) => (\n\t\t\t\t\t<div key={index} data-basalt-surface=\"\" className=\"rounded-basalt-lg p-basalt-card\">\n\t\t\t\t\t\t<dt className=\"text-basalt-base font-medium text-basalt-muted-foreground\">\n\t\t\t\t\t\t\t{item.label}\n\t\t\t\t\t\t</dt>\n\t\t\t\t\t\t<dd className=\"mt-basalt-space-sm text-basalt-3xl font-basalt-display font-semibold tracking-tight tabular-nums text-basalt-foreground\">\n\t\t\t\t\t\t\t{loading ? <SkeletonLine /> : item.value}\n\t\t\t\t\t\t</dd>\n\t\t\t\t\t</div>\n\t\t\t\t))}\n\t\t\t</dl>\n\t\t);\n\t},\n);\nStatStrip.displayName = \"StatStrip\";\n"],"mappings":";;;;;;;AAyBA,IAAaC,IAAYD,EAAM,YAC7B,EAAE,aAAaE,GAAU,cAAW,UAAO,aAAU,IAAO,GAAGC,KAAS,MAEvE,kBAAC,MAAD;CACM;CACL,WAAWC,EACVC,GACA,qDACAC,CACD;CACA,GAAIH;CACJ,aAAWI,IAAU,KAAOL;CAE3B,UAAAM,EAAM,KAAK,GAAM,MACjB,kBAAC,OAAD;EAAiB,uBAAoB;EAAG,WAAU;EAAlD,UAAA,CACC,kBAAC,MAAD;GAAI,WAAU;GACZ,UAAAC,EAAK;EACH,CAAA,GACJ,kBAAC,MAAD;GAAI,WAAU;GACZ,UAAAF,IAAU,kBAACG,GAAD,CAAe,CAAA,IAAID,EAAK;EAChC,CAAA,CACA;CAPK,GAAAE,CAOL,CACL;AACE,CAAA,CAGP;AACA,EAAU,cAAc"}
@@ -1,5 +1,10 @@
1
1
  import * as React from "react";
2
+ /** Logical inline alignment. Maps to CSS `text-align: start | end`. */
3
+ export type TableTextAlign = "start" | "end";
4
+ export type TableSortDirection = "asc" | "desc";
2
5
  export type TableProps = {
6
+ /** Paint alternating rows. @default false */
7
+ striped?: boolean;
3
8
  /**
4
9
  * Additional classes for the table.
5
10
  */
@@ -33,15 +38,23 @@ export type TableHeadProps = {
33
38
  * Additional classes for the header cell.
34
39
  */
35
40
  className?: string;
41
+ /**
42
+ * Logical inline alignment. Omitted headers keep `text-start` unless native `align` is set.
43
+ */
44
+ textAlign?: TableTextAlign;
36
45
  };
37
- export declare const TableHead: ({ className, ...props }: TableHeadProps & React.ThHTMLAttributes<HTMLTableCellElement>) => React.JSX.Element;
46
+ export declare const TableHead: ({ className, textAlign, align, ...props }: TableHeadProps & React.ThHTMLAttributes<HTMLTableCellElement>) => React.JSX.Element;
38
47
  export type TableCellProps = {
39
48
  /**
40
49
  * Additional classes for the cell.
41
50
  */
42
51
  className?: string;
52
+ /**
53
+ * Logical inline alignment. Omitted cells inherit from the table or row. Native HTML `align` is unchanged.
54
+ */
55
+ textAlign?: TableTextAlign;
43
56
  };
44
- export declare const TableCell: ({ className, ...props }: TableCellProps & React.TdHTMLAttributes<HTMLTableCellElement>) => React.JSX.Element;
57
+ export declare const TableCell: ({ className, textAlign, ...props }: TableCellProps & React.TdHTMLAttributes<HTMLTableCellElement>) => React.JSX.Element;
45
58
  export type TableCaptionProps = {
46
59
  /**
47
60
  * Additional classes for the caption.
@@ -49,3 +62,29 @@ export type TableCaptionProps = {
49
62
  className?: string;
50
63
  };
51
64
  export declare function TableCaption({ className, ...props }: TableCaptionProps & React.HTMLAttributes<HTMLTableCaptionElement>): React.JSX.Element;
65
+ export type TableSortableHeaderProps = {
66
+ children: React.ReactNode;
67
+ /**
68
+ * Logical control layout. `end` places the sort icon inward of the label.
69
+ * @default "start"
70
+ */
71
+ textAlign?: TableTextAlign;
72
+ /**
73
+ * Current sort direction when this column is sorted.
74
+ */
75
+ sorted?: TableSortDirection;
76
+ className?: string;
77
+ } & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "type" | "children" | "className">;
78
+ export declare const TableSortableHeader: React.ForwardRefExoticComponent<{
79
+ children: React.ReactNode;
80
+ /**
81
+ * Logical control layout. `end` places the sort icon inward of the label.
82
+ * @default "start"
83
+ */
84
+ textAlign?: TableTextAlign;
85
+ /**
86
+ * Current sort direction when this column is sorted.
87
+ */
88
+ sorted?: TableSortDirection;
89
+ className?: string;
90
+ } & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "children" | "className" | "type"> & React.RefAttributes<HTMLButtonElement>>;
@@ -2,33 +2,62 @@
2
2
  import { cn as e } from "../utils/cn.js";
3
3
  import { BASALT_UI_CLASS as t } from "../utils/control-surface.js";
4
4
  import * as n from "react";
5
- import { jsx as r } from "react/jsx-runtime";
5
+ import { ArrowDown as r, ArrowUp as i, ArrowUpDown as a } from "lucide-react";
6
+ import { Fragment as o, jsx as s, jsxs as c } from "react/jsx-runtime";
6
7
  //#region src/components/table.tsx
7
- var i = n.forwardRef(({ className: n, ...i }, a) => /* @__PURE__ */ r("table", {
8
+ var l = n.forwardRef(({ className: n, striped: r = !1, ...i }, a) => /* @__PURE__ */ s("table", {
8
9
  ref: a,
9
10
  "data-basalt-table": "",
10
- className: e(t, "w-full border-separate border-spacing-0 caption-bottom text-left text-basalt-code leading-[var(--basalt-line-body)] text-basalt-foreground", n),
11
+ "data-striped": r ? "true" : void 0,
12
+ className: e(t, "w-full border-separate border-spacing-0 caption-bottom text-start text-basalt-base leading-[var(--basalt-line-body)] text-basalt-foreground", n),
11
13
  ...i
12
14
  }));
13
- i.displayName = "Table";
14
- var a = (e) => /* @__PURE__ */ r("thead", { ...e }), o = (e) => /* @__PURE__ */ r("tbody", { ...e }), s = (e) => /* @__PURE__ */ r("tfoot", { ...e }), c = ({ className: e, variant: t = "default", ...n }) => /* @__PURE__ */ r("tr", {
15
+ l.displayName = "Table";
16
+ var u = (e) => /* @__PURE__ */ s("thead", { ...e }), d = (e) => /* @__PURE__ */ s("tbody", { ...e }), f = (e) => /* @__PURE__ */ s("tfoot", { ...e }), p = ({ className: e, variant: t = "default", ...n }) => /* @__PURE__ */ s("tr", {
15
17
  ...n,
16
18
  "aria-selected": t === "selected" || n["aria-selected"],
17
19
  className: e
18
- }), l = ({ className: t, ...n }) => /* @__PURE__ */ r("th", {
19
- className: e("relative h-basalt-table-row whitespace-nowrap border-b border-basalt-border px-basalt-table-x py-basalt-table-y text-left align-middle text-basalt-sm font-medium text-basalt-muted-foreground", t),
20
- ...n
21
- }), u = ({ className: t, ...n }) => /* @__PURE__ */ r("td", {
22
- className: e("relative h-basalt-table-row px-basalt-table-x py-basalt-table-y align-middle", t),
23
- ...n
24
20
  });
25
- function d({ className: t, ...n }) {
26
- return /* @__PURE__ */ r("caption", {
27
- className: e("mt-basalt-space-lg text-basalt-base text-basalt-muted-foreground", t),
21
+ function m(e) {
22
+ if (e === "end") return "text-end tabular-nums";
23
+ if (e === "start") return "text-start";
24
+ }
25
+ var h = ({ className: t, textAlign: n, align: r, ...i }) => /* @__PURE__ */ s("th", {
26
+ className: e("relative h-basalt-table-row whitespace-nowrap border-b border-basalt-border ps-basalt-table-x pe-basalt-table-x py-basalt-table-y align-middle text-basalt-sm font-medium tracking-[0.04em] text-basalt-muted-foreground", m(n) ?? (r == null ? "text-start" : void 0), t),
27
+ align: r,
28
+ ...i
29
+ }), g = ({ className: t, textAlign: n, ...r }) => /* @__PURE__ */ s("td", {
30
+ className: e("relative h-basalt-table-row ps-basalt-table-x pe-basalt-table-x py-basalt-table-y align-middle", m(n), t),
31
+ ...r
32
+ });
33
+ function _({ className: t, ...n }) {
34
+ return /* @__PURE__ */ s("caption", {
35
+ className: e("px-basalt-panel-x py-basalt-panel-y text-basalt-base text-basalt-muted-foreground", t),
28
36
  ...n
29
37
  });
30
38
  }
39
+ function v({ sorted: t }) {
40
+ return /* @__PURE__ */ s(t === "asc" ? i : t === "desc" ? r : a, {
41
+ "aria-hidden": "true",
42
+ className: e("size-basalt-icon-sm shrink-0", !t && "opacity-0 transition-opacity basalt-motion group-hover:opacity-60 group-focus-visible:opacity-60 motion-reduce:transition-none"),
43
+ strokeWidth: 1.5
44
+ });
45
+ }
46
+ var y = n.forwardRef(({ children: t, textAlign: n = "start", sorted: r, className: i, ...a }, l) => {
47
+ let u = /* @__PURE__ */ s("span", {
48
+ className: "flex min-w-0 items-center gap-basalt-control-gap truncate",
49
+ children: t
50
+ }), d = /* @__PURE__ */ s(v, { sorted: r });
51
+ return /* @__PURE__ */ s("button", {
52
+ type: "button",
53
+ ref: l,
54
+ className: e("group flex w-full cursor-pointer items-center gap-basalt-space-sm rounded-basalt-sm border-0 bg-transparent p-0 font-inherit text-inherit font-medium focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-basalt-primary", n === "end" ? "justify-end text-end" : "text-start", i),
55
+ ...a,
56
+ children: n === "end" ? /* @__PURE__ */ c(o, { children: [d, u] }) : /* @__PURE__ */ c(o, { children: [u, d] })
57
+ });
58
+ });
59
+ y.displayName = "TableSortableHeader";
31
60
  //#endregion
32
- export { i as Table, o as TableBody, d as TableCaption, u as TableCell, s as TableFooter, l as TableHead, a as TableHeader, c as TableRow };
61
+ export { l as Table, d as TableBody, _ as TableCaption, g as TableCell, f as TableFooter, h as TableHead, u as TableHeader, p as TableRow, y as TableSortableHeader };
33
62
 
34
63
  //# sourceMappingURL=table.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"table.js","names":["React","Table","props","cn","BASALT_UI_CLASS","className","TableHeader","TableBody","TableFooter","TableRow","variant","TableHead","TableCell","TableCaption"],"sources":["../../src/components/table.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\n\nexport type TableProps = {\n\t/**\n\t * Additional classes for the table.\n\t */\n\tclassName?: string;\n};\n\nexport const Table = React.forwardRef<\n\tHTMLTableElement,\n\tTableProps & React.HTMLAttributes<HTMLTableElement>\n>(({ className, ...props }, ref) => (\n\t<table\n\t\tref={ref}\n\t\tdata-basalt-table=\"\"\n\t\tclassName={cn(\n\t\t\tBASALT_UI_CLASS,\n\t\t\t\"w-full border-separate border-spacing-0 caption-bottom text-left text-basalt-code leading-[var(--basalt-line-body)] text-basalt-foreground\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nTable.displayName = \"Table\";\n\nexport interface TableHeaderProps extends React.HTMLAttributes<HTMLTableSectionElement> {}\n\nexport const TableHeader = (props: TableHeaderProps) => <thead {...props} />;\n\nexport interface TableBodyProps extends React.HTMLAttributes<HTMLTableSectionElement> {}\n\nexport const TableBody = (props: TableBodyProps) => <tbody {...props} />;\n\nexport interface TableFooterProps extends React.HTMLAttributes<HTMLTableSectionElement> {}\n\nexport const TableFooter = (props: TableFooterProps) => <tfoot {...props} />;\n\nexport type TableRowVariant = \"default\" | \"selected\";\n\nexport type TableRowProps = {\n\t/**\n\t * Highlight the row as selected.\n\t * @default \"default\"\n\t */\n\tvariant?: TableRowVariant;\n\t/**\n\t * Additional classes for the row.\n\t */\n\tclassName?: string;\n};\n\nexport const TableRow = ({\n\tclassName,\n\tvariant = \"default\",\n\t...props\n}: TableRowProps & React.HTMLAttributes<HTMLTableRowElement>) => (\n\t<tr\n\t\t{...props}\n\t\taria-selected={variant === \"selected\" ? true : props[\"aria-selected\"]}\n\t\tclassName={className}\n\t/>\n);\n\nexport type TableHeadProps = {\n\t/**\n\t * Additional classes for the header cell.\n\t */\n\tclassName?: string;\n};\n\nexport const TableHead = ({\n\tclassName,\n\t...props\n}: TableHeadProps & React.ThHTMLAttributes<HTMLTableCellElement>) => (\n\t<th\n\t\tclassName={cn(\n\t\t\t\"relative h-basalt-table-row whitespace-nowrap border-b border-basalt-border px-basalt-table-x py-basalt-table-y text-left align-middle text-basalt-sm font-medium text-basalt-muted-foreground\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\n\nexport type TableCellProps = {\n\t/**\n\t * Additional classes for the cell.\n\t */\n\tclassName?: string;\n};\n\nexport const TableCell = ({\n\tclassName,\n\t...props\n}: TableCellProps & React.TdHTMLAttributes<HTMLTableCellElement>) => (\n\t<td\n\t\tclassName={cn(\n\t\t\t\"relative h-basalt-table-row px-basalt-table-x py-basalt-table-y align-middle\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\n\nexport type TableCaptionProps = {\n\t/**\n\t * Additional classes for the caption.\n\t */\n\tclassName?: string;\n};\n\nexport function TableCaption({\n\tclassName,\n\t...props\n}: TableCaptionProps & React.HTMLAttributes<HTMLTableCaptionElement>) {\n\treturn (\n\t\t<caption\n\t\t\tclassName={cn(\"mt-basalt-space-lg text-basalt-base text-basalt-muted-foreground\", className)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n"],"mappings":";;;;;;AAWA,IAAaC,IAAQD,EAAM,YAGxB,EAAE,cAAW,GAAGE,KAAS,MAC3B,kBAAC,SAAD;CACM;CACL,qBAAkB;CAClB,WAAWC,EACVC,GACA,8IACAC,CACD;CACA,GAAIH;AACJ,CAAA,CACD;AACD,EAAM,cAAc;AAIpB,IAAaI,KAAe,MAA4B,kBAAC,SAAD,EAAO,GAAIJ,EAAQ,CAAA,GAI9DK,KAAa,MAA0B,kBAAC,SAAD,EAAO,GAAIL,EAAQ,CAAA,GAI1DM,KAAe,MAA4B,kBAAC,SAAD,EAAO,GAAIN,EAAQ,CAAA,GAgB9DO,KAAY,EACxB,cACA,aAAU,WACV,GAAGP,QAEH,kBAAC,MAAD;CACC,GAAIA;CACJ,iBAAeQ,MAAY,cAAoBR,EAAM;CAC1C;AACX,CAAA,GAUWS,KAAa,EACzB,cACA,GAAGT,QAEH,kBAAC,MAAD;CACC,WAAWC,EACV,kMACAE,CACD;CACA,GAAIH;AACJ,CAAA,GAUWU,KAAa,EACzB,cACA,GAAGV,QAEH,kBAAC,MAAD;CACC,WAAWC,EACV,gFACAE,CACD;CACA,GAAIH;AACJ,CAAA;AAUF,SAAgBW,EAAa,EAC5B,cACA,GAAGX,KACkE;CACrE,OACC,kBAAC,WAAD;EACC,WAAWC,EAAG,oEAAoEE,CAAS;EAC3F,GAAIH;CACJ,CAAA;AAEH"}
1
+ {"version":3,"file":"table.js","names":["_Fragment","React","Fragment$1","Table","props","striped","cn","BASALT_UI_CLASS","className","TableHeader","TableBody","TableFooter","TableRow","variant","textAlignClass","textAlign","TableHead","align","TableCell","TableCaption","SortIcon","sorted","ArrowUp","ArrowDown","ArrowUpDown","TableSortableHeader","label","icon"],"sources":["../../src/components/table.tsx"],"sourcesContent":["import { ArrowDown, ArrowUp, ArrowUpDown } from \"lucide-react\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\n\n/** Logical inline alignment. Maps to CSS `text-align: start | end`. */\nexport type TableTextAlign = \"start\" | \"end\";\nexport type TableSortDirection = \"asc\" | \"desc\";\n\nexport type TableProps = {\n\t/** Paint alternating rows. @default false */\n\tstriped?: boolean;\n\t/**\n\t * Additional classes for the table.\n\t */\n\tclassName?: string;\n};\n\nexport const Table = React.forwardRef<\n\tHTMLTableElement,\n\tTableProps & React.HTMLAttributes<HTMLTableElement>\n>(({ className, striped = false, ...props }, ref) => (\n\t<table\n\t\tref={ref}\n\t\tdata-basalt-table=\"\"\n\t\tdata-striped={striped ? \"true\" : undefined}\n\t\tclassName={cn(\n\t\t\tBASALT_UI_CLASS,\n\t\t\t\"w-full border-separate border-spacing-0 caption-bottom text-start text-basalt-base leading-[var(--basalt-line-body)] text-basalt-foreground\",\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nTable.displayName = \"Table\";\n\nexport interface TableHeaderProps extends React.HTMLAttributes<HTMLTableSectionElement> {}\n\nexport const TableHeader = (props: TableHeaderProps) => <thead {...props} />;\n\nexport interface TableBodyProps extends React.HTMLAttributes<HTMLTableSectionElement> {}\n\nexport const TableBody = (props: TableBodyProps) => <tbody {...props} />;\n\nexport interface TableFooterProps extends React.HTMLAttributes<HTMLTableSectionElement> {}\n\nexport const TableFooter = (props: TableFooterProps) => <tfoot {...props} />;\n\nexport type TableRowVariant = \"default\" | \"selected\";\n\nexport type TableRowProps = {\n\t/**\n\t * Highlight the row as selected.\n\t * @default \"default\"\n\t */\n\tvariant?: TableRowVariant;\n\t/**\n\t * Additional classes for the row.\n\t */\n\tclassName?: string;\n};\n\nexport const TableRow = ({\n\tclassName,\n\tvariant = \"default\",\n\t...props\n}: TableRowProps & React.HTMLAttributes<HTMLTableRowElement>) => (\n\t<tr\n\t\t{...props}\n\t\taria-selected={variant === \"selected\" ? true : props[\"aria-selected\"]}\n\t\tclassName={className}\n\t/>\n);\n\nfunction textAlignClass(textAlign?: TableTextAlign) {\n\tif (textAlign === \"end\") return \"text-end tabular-nums\";\n\tif (textAlign === \"start\") return \"text-start\";\n}\n\nexport type TableHeadProps = {\n\t/**\n\t * Additional classes for the header cell.\n\t */\n\tclassName?: string;\n\t/**\n\t * Logical inline alignment. Omitted headers keep `text-start` unless native `align` is set.\n\t */\n\ttextAlign?: TableTextAlign;\n};\n\nexport const TableHead = ({\n\tclassName,\n\ttextAlign,\n\talign,\n\t...props\n}: TableHeadProps & React.ThHTMLAttributes<HTMLTableCellElement>) => (\n\t<th\n\t\tclassName={cn(\n\t\t\t\"relative h-basalt-table-row whitespace-nowrap border-b border-basalt-border ps-basalt-table-x pe-basalt-table-x py-basalt-table-y align-middle text-basalt-sm font-medium tracking-[0.04em] text-basalt-muted-foreground\",\n\t\t\ttextAlignClass(textAlign) ?? (align == null ? \"text-start\" : undefined),\n\t\t\tclassName,\n\t\t)}\n\t\talign={align}\n\t\t{...props}\n\t/>\n);\n\nexport type TableCellProps = {\n\t/**\n\t * Additional classes for the cell.\n\t */\n\tclassName?: string;\n\t/**\n\t * Logical inline alignment. Omitted cells inherit from the table or row. Native HTML `align` is unchanged.\n\t */\n\ttextAlign?: TableTextAlign;\n};\n\nexport const TableCell = ({\n\tclassName,\n\ttextAlign,\n\t...props\n}: TableCellProps & React.TdHTMLAttributes<HTMLTableCellElement>) => (\n\t<td\n\t\tclassName={cn(\n\t\t\t\"relative h-basalt-table-row ps-basalt-table-x pe-basalt-table-x py-basalt-table-y align-middle\",\n\t\t\ttextAlignClass(textAlign),\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n);\n\nexport type TableCaptionProps = {\n\t/**\n\t * Additional classes for the caption.\n\t */\n\tclassName?: string;\n};\n\nexport function TableCaption({\n\tclassName,\n\t...props\n}: TableCaptionProps & React.HTMLAttributes<HTMLTableCaptionElement>) {\n\treturn (\n\t\t<caption\n\t\t\tclassName={cn(\n\t\t\t\t\"px-basalt-panel-x py-basalt-panel-y text-basalt-base text-basalt-muted-foreground\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t/>\n\t);\n}\n\nexport type TableSortableHeaderProps = {\n\tchildren: React.ReactNode;\n\t/**\n\t * Logical control layout. `end` places the sort icon inward of the label.\n\t * @default \"start\"\n\t */\n\ttextAlign?: TableTextAlign;\n\t/**\n\t * Current sort direction when this column is sorted.\n\t */\n\tsorted?: TableSortDirection;\n\tclassName?: string;\n} & Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, \"type\" | \"children\" | \"className\">;\n\nfunction SortIcon({ sorted }: { sorted?: TableSortDirection }) {\n\tconst Icon = sorted === \"asc\" ? ArrowUp : sorted === \"desc\" ? ArrowDown : ArrowUpDown;\n\treturn (\n\t\t<Icon\n\t\t\taria-hidden=\"true\"\n\t\t\tclassName={cn(\n\t\t\t\t\"size-basalt-icon-sm shrink-0\",\n\t\t\t\t!sorted &&\n\t\t\t\t\t\"opacity-0 transition-opacity basalt-motion group-hover:opacity-60 group-focus-visible:opacity-60 motion-reduce:transition-none\",\n\t\t\t)}\n\t\t\tstrokeWidth={1.5}\n\t\t/>\n\t);\n}\n\nexport const TableSortableHeader = React.forwardRef<HTMLButtonElement, TableSortableHeaderProps>(\n\t({ children, textAlign = \"start\", sorted, className, ...props }, ref) => {\n\t\tconst label = (\n\t\t\t<span className=\"flex min-w-0 items-center gap-basalt-control-gap truncate\">{children}</span>\n\t\t);\n\t\tconst icon = <SortIcon sorted={sorted} />;\n\t\treturn (\n\t\t\t<button\n\t\t\t\ttype=\"button\"\n\t\t\t\tref={ref}\n\t\t\t\tclassName={cn(\n\t\t\t\t\t\"group flex w-full cursor-pointer items-center gap-basalt-space-sm rounded-basalt-sm border-0 bg-transparent p-0 font-inherit text-inherit font-medium focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-basalt-primary\",\n\t\t\t\t\ttextAlign === \"end\" ? \"justify-end text-end\" : \"text-start\",\n\t\t\t\t\tclassName,\n\t\t\t\t)}\n\t\t\t\t{...props}\n\t\t\t>\n\t\t\t\t{textAlign === \"end\" ? (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{icon}\n\t\t\t\t\t\t{label}\n\t\t\t\t\t</>\n\t\t\t\t) : (\n\t\t\t\t\t<>\n\t\t\t\t\t\t{label}\n\t\t\t\t\t\t{icon}\n\t\t\t\t\t</>\n\t\t\t\t)}\n\t\t\t</button>\n\t\t);\n\t},\n);\nTableSortableHeader.displayName = \"TableSortableHeader\";\n"],"mappings":";;;;;;;AAkBA,IAAaG,IAAQF,EAAM,YAGxB,EAAE,cAAW,aAAU,IAAO,GAAGG,KAAS,MAC5C,kBAAC,SAAD;CACM;CACL,qBAAkB;CAClB,gBAAcC,IAAU,SAAS,KAAA;CACjC,WAAWC,EACVC,GACA,+IACAC,CACD;CACA,GAAIJ;AACJ,CAAA,CACD;AACD,EAAM,cAAc;AAIpB,IAAaK,KAAe,MAA4B,kBAAC,SAAD,EAAO,GAAIL,EAAQ,CAAA,GAI9DM,KAAa,MAA0B,kBAAC,SAAD,EAAO,GAAIN,EAAQ,CAAA,GAI1DO,KAAe,MAA4B,kBAAC,SAAD,EAAO,GAAIP,EAAQ,CAAA,GAgB9DQ,KAAY,EACxB,cACA,aAAU,WACV,GAAGR,QAEH,kBAAC,MAAD;CACC,GAAIA;CACJ,iBAAeS,MAAY,cAAoBT,EAAM;CAC1C;AACX,CAAA;AAGF,SAASU,EAAe,GAA4B;CACnD,IAAIC,MAAc,OAAO,OAAO;CAChC,IAAIA,MAAc,SAAS,OAAO;AACnC;AAaA,IAAaC,KAAa,EACzB,cACA,cACA,UACA,GAAGZ,QAEH,kBAAC,MAAD;CACC,WAAWE,EACV,4NACAQ,EAAeC,CAAS,MAAME,KAAS,OAAO,eAAe,KAAA,IAC7DT,CACD;CACO;CACP,GAAIJ;AACJ,CAAA,GAcWc,KAAa,EACzB,cACA,cACA,GAAGd,QAEH,kBAAC,MAAD;CACC,WAAWE,EACV,kGACAQ,EAAeC,CAAS,GACxBP,CACD;CACA,GAAIJ;AACJ,CAAA;AAUF,SAAgBe,EAAa,EAC5B,cACA,GAAGf,KACkE;CACrE,OACC,kBAAC,WAAD;EACC,WAAWE,EACV,qFACAE,CACD;EACA,GAAIJ;CACJ,CAAA;AAEH;AAgBA,SAASgB,EAAS,EAAE,aAA2C;CAE9D,OACC,kBAFYC,MAAW,QAAQC,IAAUD,MAAW,SAASE,IAAYC,GAEzE;EACC,eAAY;EACZ,WAAWlB,EACV,gCACA,CAACe,KACA,gIACF;EACA,aAAa;CACb,CAAA;AAEH;AAEA,IAAaI,IAAsBxB,EAAM,YACvC,EAAE,aAAU,eAAY,SAAS,WAAQ,cAAW,GAAGG,KAAS,MAAQ;CACxE,IAAMsB,IACL,kBAAC,QAAD;EAAM,WAAU;EAA6D;CAAe,CAAA,GAEvFC,IAAO,kBAACP,GAAD,EAAkB,UAAS,CAAA;CACxC,OACC,kBAAC,UAAD;EACC,MAAK;EACA;EACL,WAAWd,EACV,qPACAS,MAAc,QAAQ,yBAAyB,cAC/CP,CACD;EACA,GAAIJ;EAEH,UAAAW,MAAc,QACd,kBAAAf,GAAA,EAAA,UAAA,CACE2B,GACAD,CACA,EAAA,CAAA,IAEF,kBAAA1B,GAAA,EAAA,UAAA,CACE0B,GACAC,CACA,EAAA,CAAA;CAEI,CAAA;AAEV,CACD;AACA,EAAoB,cAAc"}
@@ -48,7 +48,7 @@ var u = i.forwardRef(({ className: t, children: n, showIndicator: i = !0, ...l }
48
48
  u.displayName = s.List.displayName;
49
49
  var d = i.forwardRef(({ className: t, ...r }, i) => /* @__PURE__ */ a(s.Trigger, {
50
50
  ref: i,
51
- className: e("basalt-action rounded-t-basalt-md inline-flex items-center justify-center font-medium text-basalt-muted-foreground transition-colors basalt-motion hover:text-basalt-foreground data-[state=active]:bg-basalt-selected data-[state=active]:text-basalt-selected-foreground", n, t),
51
+ className: e("basalt-action inline-flex items-center justify-center font-medium text-basalt-muted-foreground transition-colors basalt-motion hover:text-basalt-foreground data-[state=active]:text-basalt-selected-foreground", n, t),
52
52
  ...r
53
53
  }));
54
54
  d.displayName = s.Trigger.displayName;
@@ -1 +1 @@
1
- {"version":3,"file":"tabs.js","names":["React","TabsPrimitive","measureTabUnderline","item","Tabs","props","cn","BASALT_UI_CLASS","className","TabsList","listRef","useSelectionIndicator","showIndicator","children","motionClassName","state","TabsTrigger","OVERLAY_MOTION","TabsContent"],"sources":["../../src/components/tabs.tsx"],"sourcesContent":["import * as TabsPrimitive from \"@radix-ui/react-tabs\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { useSelectionIndicator } from \"../utils/selection-indicator\";\nimport { OVERLAY_MOTION } from \"./overlay\";\n\nfunction measureTabUnderline(item: HTMLElement): {\n\tleft: number;\n\twidth: number;\n\ttop: number;\n\theight: number;\n} {\n\treturn {\n\t\tleft: item.offsetLeft,\n\t\twidth: item.offsetWidth,\n\t\ttop: item.offsetTop + item.offsetHeight,\n\t\theight: 0,\n\t};\n}\n\nexport type TabsProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof TabsPrimitive.Root>,\n\t\"value\" | \"defaultValue\" | \"onValueChange\"\n> & {\n\t/**\n\t * The controlled selected tab.\n\t */\n\tvalue?: string;\n\t/**\n\t * The uncontrolled initial tab.\n\t */\n\tdefaultValue?: string;\n\t/**\n\t * Called when the selected tab changes.\n\t */\n\tonValueChange?: (value: string) => void;\n};\nexport const Tabs: React.FC<TabsProps> = React.forwardRef<\n\tReact.ElementRef<typeof TabsPrimitive.Root>,\n\tTabsProps\n>(({ className, ...props }, ref) => (\n\t<TabsPrimitive.Root ref={ref} className={cn(BASALT_UI_CLASS, className)} {...props} />\n));\nTabs.displayName = TabsPrimitive.Root.displayName;\n\nexport type TabsListProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.List> & {\n\t/**\n\t * Show the sliding active underline.\n\t * @default true\n\t */\n\tshowIndicator?: boolean;\n};\n\nexport const TabsList = React.forwardRef<\n\tReact.ElementRef<typeof TabsPrimitive.List>,\n\tTabsListProps\n>(({ className, children, showIndicator = true, ...props }, ref) => {\n\tconst {\n\t\tref: listRef,\n\t\tstate,\n\t\tmotionClassName,\n\t} = useSelectionIndicator({\n\t\titemSelector: '[role=\"tab\"][data-state=\"active\"]',\n\t\tenabled: showIndicator,\n\t\tmapGeometry: measureTabUnderline,\n\t\tref,\n\t});\n\n\treturn (\n\t\t<TabsPrimitive.List\n\t\t\tref={listRef}\n\t\t\tclassName={cn(\n\t\t\t\t\"relative flex flex-wrap items-center gap-basalt-space-sm border-b border-basalt-border\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t\t{showIndicator ? (\n\t\t\t\t<span\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tdata-slot=\"selection-indicator\"\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"pointer-events-none absolute h-basalt-0_5 bg-basalt-primary\",\n\t\t\t\t\t\tmotionClassName,\n\t\t\t\t\t)}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\ttransform: `translate(${state.left}px, ${state.top}px)`,\n\t\t\t\t\t\twidth: state.visible ? state.width : 0,\n\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t) : null}\n\t\t</TabsPrimitive.List>\n\t);\n});\nTabsList.displayName = TabsPrimitive.List.displayName;\n\nexport type TabsTriggerProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>,\n\t\"disabled\" | \"value\"\n> & {\n\t/**\n\t * The tab value.\n\t */\n\tvalue: string;\n\t/**\n\t * Disable the tab trigger.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n};\n\nexport const TabsTrigger = React.forwardRef<\n\tReact.ElementRef<typeof TabsPrimitive.Trigger>,\n\tTabsTriggerProps\n>(({ className, ...props }, ref) => (\n\t<TabsPrimitive.Trigger\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"basalt-action rounded-t-basalt-md inline-flex items-center justify-center font-medium text-basalt-muted-foreground transition-colors basalt-motion hover:text-basalt-foreground data-[state=active]:bg-basalt-selected data-[state=active]:text-basalt-selected-foreground\",\n\t\t\tOVERLAY_MOTION,\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nTabsTrigger.displayName = TabsPrimitive.Trigger.displayName;\n\nexport type TabsContentProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>,\n\t\"value\"\n> & {\n\t/**\n\t * The tab value this panel belongs to.\n\t */\n\tvalue: string;\n};\n\nexport const TabsContent = React.forwardRef<\n\tReact.ElementRef<typeof TabsPrimitive.Content>,\n\tTabsContentProps\n>(({ className, ...props }, ref) => (\n\t<TabsPrimitive.Content\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"mt-basalt-space-lg text-basalt-base text-basalt-foreground data-[state=active]:animate-basalt-tab-in\",\n\t\t\tOVERLAY_MOTION,\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nTabsContent.displayName = TabsPrimitive.Content.displayName;\n"],"mappings":";;;;;;;;;AAOA,SAASE,EAAoB,GAK3B;CACD,OAAO;EACN,MAAMC,EAAK;EACX,OAAOA,EAAK;EACZ,KAAKA,EAAK,YAAYA,EAAK;EAC3B,QAAQ;CACT;AACD;AAmBA,IAAaC,IAA4BJ,EAAM,YAG5C,EAAE,cAAW,GAAGK,KAAS,MAC3B,kBAACJ,EAAc,MAAf;CAAyB;CAAK,WAAWK,EAAGC,GAAiBC,CAAS;CAAG,GAAIH;AAAQ,CAAA,CACrF;AACD,EAAK,cAAcJ,EAAc,KAAK;AAUtC,IAAaQ,IAAWT,EAAM,YAG3B,EAAE,cAAW,aAAU,mBAAgB,IAAM,GAAGK,KAAS,MAAQ;CACnE,IAAM,EACL,KAAKK,GACL,UACA,uBACGC,EAAsB;EACzB,cAAc;EACd,SAASC;EACT,aAAaV;EACb;CACD,CAAC;CAED,OACC,kBAACD,EAAc,MAAf;EACC,KAAKS;EACL,WAAWJ,EACV,0FACAE,CACD;EACA,GAAIH;EANL,UAAA,CAQEQ,GACAD,IACA,kBAAC,QAAD;GACC,eAAY;GACZ,aAAU;GACV,WAAWN,EACV,+DACAQ,CACD;GACA,OAAO;IACN,MAAM;IACN,WAAW,aAAaC,EAAM,KAAK,MAAMA,EAAM,IAAI;IACnD,OAAOA,EAAM,UAAUA,EAAM,QAAQ;IACrC,KAAK;GACN;EACA,CAAA,IACE,IACe;;AAEtB,CAAC;AACD,EAAS,cAAcd,EAAc,KAAK;AAiB1C,IAAae,IAAchB,EAAM,YAG9B,EAAE,cAAW,GAAGK,KAAS,MAC3B,kBAACJ,EAAc,SAAf;CACM;CACL,WAAWK,EACV,8QACAW,GACAT,CACD;CACA,GAAIH;AACJ,CAAA,CACD;AACD,EAAY,cAAcJ,EAAc,QAAQ;AAYhD,IAAaiB,IAAclB,EAAM,YAG9B,EAAE,cAAW,GAAGK,KAAS,MAC3B,kBAACJ,EAAc,SAAf;CACM;CACL,WAAWK,EACV,wGACAW,GACAT,CACD;CACA,GAAIH;AACJ,CAAA,CACD;AACD,EAAY,cAAcJ,EAAc,QAAQ"}
1
+ {"version":3,"file":"tabs.js","names":["React","TabsPrimitive","measureTabUnderline","item","Tabs","props","cn","BASALT_UI_CLASS","className","TabsList","listRef","useSelectionIndicator","showIndicator","children","motionClassName","state","TabsTrigger","OVERLAY_MOTION","TabsContent"],"sources":["../../src/components/tabs.tsx"],"sourcesContent":["import * as TabsPrimitive from \"@radix-ui/react-tabs\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\nimport { useSelectionIndicator } from \"../utils/selection-indicator\";\nimport { OVERLAY_MOTION } from \"./overlay\";\n\nfunction measureTabUnderline(item: HTMLElement): {\n\tleft: number;\n\twidth: number;\n\ttop: number;\n\theight: number;\n} {\n\treturn {\n\t\tleft: item.offsetLeft,\n\t\twidth: item.offsetWidth,\n\t\ttop: item.offsetTop + item.offsetHeight,\n\t\theight: 0,\n\t};\n}\n\nexport type TabsProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof TabsPrimitive.Root>,\n\t\"value\" | \"defaultValue\" | \"onValueChange\"\n> & {\n\t/**\n\t * The controlled selected tab.\n\t */\n\tvalue?: string;\n\t/**\n\t * The uncontrolled initial tab.\n\t */\n\tdefaultValue?: string;\n\t/**\n\t * Called when the selected tab changes.\n\t */\n\tonValueChange?: (value: string) => void;\n};\nexport const Tabs: React.FC<TabsProps> = React.forwardRef<\n\tReact.ElementRef<typeof TabsPrimitive.Root>,\n\tTabsProps\n>(({ className, ...props }, ref) => (\n\t<TabsPrimitive.Root ref={ref} className={cn(BASALT_UI_CLASS, className)} {...props} />\n));\nTabs.displayName = TabsPrimitive.Root.displayName;\n\nexport type TabsListProps = React.ComponentPropsWithoutRef<typeof TabsPrimitive.List> & {\n\t/**\n\t * Show the sliding active underline.\n\t * @default true\n\t */\n\tshowIndicator?: boolean;\n};\n\nexport const TabsList = React.forwardRef<\n\tReact.ElementRef<typeof TabsPrimitive.List>,\n\tTabsListProps\n>(({ className, children, showIndicator = true, ...props }, ref) => {\n\tconst {\n\t\tref: listRef,\n\t\tstate,\n\t\tmotionClassName,\n\t} = useSelectionIndicator({\n\t\titemSelector: '[role=\"tab\"][data-state=\"active\"]',\n\t\tenabled: showIndicator,\n\t\tmapGeometry: measureTabUnderline,\n\t\tref,\n\t});\n\n\treturn (\n\t\t<TabsPrimitive.List\n\t\t\tref={listRef}\n\t\t\tclassName={cn(\n\t\t\t\t\"relative flex flex-wrap items-center gap-basalt-space-sm border-b border-basalt-border\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t{children}\n\t\t\t{showIndicator ? (\n\t\t\t\t<span\n\t\t\t\t\taria-hidden=\"true\"\n\t\t\t\t\tdata-slot=\"selection-indicator\"\n\t\t\t\t\tclassName={cn(\n\t\t\t\t\t\t\"pointer-events-none absolute h-basalt-0_5 bg-basalt-primary\",\n\t\t\t\t\t\tmotionClassName,\n\t\t\t\t\t)}\n\t\t\t\t\tstyle={{\n\t\t\t\t\t\tleft: 0,\n\t\t\t\t\t\ttransform: `translate(${state.left}px, ${state.top}px)`,\n\t\t\t\t\t\twidth: state.visible ? state.width : 0,\n\t\t\t\t\t\ttop: 0,\n\t\t\t\t\t}}\n\t\t\t\t/>\n\t\t\t) : null}\n\t\t</TabsPrimitive.List>\n\t);\n});\nTabsList.displayName = TabsPrimitive.List.displayName;\n\nexport type TabsTriggerProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>,\n\t\"disabled\" | \"value\"\n> & {\n\t/**\n\t * The tab value.\n\t */\n\tvalue: string;\n\t/**\n\t * Disable the tab trigger.\n\t * @default false\n\t */\n\tdisabled?: boolean;\n};\n\nexport const TabsTrigger = React.forwardRef<\n\tReact.ElementRef<typeof TabsPrimitive.Trigger>,\n\tTabsTriggerProps\n>(({ className, ...props }, ref) => (\n\t<TabsPrimitive.Trigger\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"basalt-action inline-flex items-center justify-center font-medium text-basalt-muted-foreground transition-colors basalt-motion hover:text-basalt-foreground data-[state=active]:text-basalt-selected-foreground\",\n\t\t\tOVERLAY_MOTION,\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nTabsTrigger.displayName = TabsPrimitive.Trigger.displayName;\n\nexport type TabsContentProps = Omit<\n\tReact.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>,\n\t\"value\"\n> & {\n\t/**\n\t * The tab value this panel belongs to.\n\t */\n\tvalue: string;\n};\n\nexport const TabsContent = React.forwardRef<\n\tReact.ElementRef<typeof TabsPrimitive.Content>,\n\tTabsContentProps\n>(({ className, ...props }, ref) => (\n\t<TabsPrimitive.Content\n\t\tref={ref}\n\t\tclassName={cn(\n\t\t\t\"mt-basalt-space-lg text-basalt-base text-basalt-foreground data-[state=active]:animate-basalt-tab-in\",\n\t\t\tOVERLAY_MOTION,\n\t\t\tclassName,\n\t\t)}\n\t\t{...props}\n\t/>\n));\nTabsContent.displayName = TabsPrimitive.Content.displayName;\n"],"mappings":";;;;;;;;;AAOA,SAASE,EAAoB,GAK3B;CACD,OAAO;EACN,MAAMC,EAAK;EACX,OAAOA,EAAK;EACZ,KAAKA,EAAK,YAAYA,EAAK;EAC3B,QAAQ;CACT;AACD;AAmBA,IAAaC,IAA4BJ,EAAM,YAG5C,EAAE,cAAW,GAAGK,KAAS,MAC3B,kBAACJ,EAAc,MAAf;CAAyB;CAAK,WAAWK,EAAGC,GAAiBC,CAAS;CAAG,GAAIH;AAAQ,CAAA,CACrF;AACD,EAAK,cAAcJ,EAAc,KAAK;AAUtC,IAAaQ,IAAWT,EAAM,YAG3B,EAAE,cAAW,aAAU,mBAAgB,IAAM,GAAGK,KAAS,MAAQ;CACnE,IAAM,EACL,KAAKK,GACL,UACA,uBACGC,EAAsB;EACzB,cAAc;EACd,SAASC;EACT,aAAaV;EACb;CACD,CAAC;CAED,OACC,kBAACD,EAAc,MAAf;EACC,KAAKS;EACL,WAAWJ,EACV,0FACAE,CACD;EACA,GAAIH;EANL,UAAA,CAQEQ,GACAD,IACA,kBAAC,QAAD;GACC,eAAY;GACZ,aAAU;GACV,WAAWN,EACV,+DACAQ,CACD;GACA,OAAO;IACN,MAAM;IACN,WAAW,aAAaC,EAAM,KAAK,MAAMA,EAAM,IAAI;IACnD,OAAOA,EAAM,UAAUA,EAAM,QAAQ;IACrC,KAAK;GACN;EACA,CAAA,IACE,IACe;;AAEtB,CAAC;AACD,EAAS,cAAcd,EAAc,KAAK;AAiB1C,IAAae,IAAchB,EAAM,YAG9B,EAAE,cAAW,GAAGK,KAAS,MAC3B,kBAACJ,EAAc,SAAf;CACM;CACL,WAAWK,EACV,mNACAW,GACAT,CACD;CACA,GAAIH;AACJ,CAAA,CACD;AACD,EAAY,cAAcJ,EAAc,QAAQ;AAYhD,IAAaiB,IAAclB,EAAM,YAG9B,EAAE,cAAW,GAAGK,KAAS,MAC3B,kBAACJ,EAAc,SAAf;CACM;CACL,WAAWK,EACV,wGACAW,GACAT,CACD;CACA,GAAIH;AACJ,CAAA,CACD;AACD,EAAY,cAAcJ,EAAc,QAAQ"}
@@ -62,7 +62,7 @@ function o({ name: i, colorKey: o, color: s, size: c = "md", className: l, ...u
62
62
  return /* @__PURE__ */ n("span", {
63
63
  ...u,
64
64
  "data-tag-color": d,
65
- className: e(t, "inline-flex max-w-full items-center break-words rounded-basalt-full border font-medium", "basalt-inline", c === "sm" && "px-basalt-space-sm", r[d].className, l),
65
+ className: e(t, "inline-flex max-w-full items-center break-words rounded-basalt-full border font-medium", "basalt-inline", c === "sm" ? "px-basalt-space-md" : "px-basalt-space-lg", r[d].className, l),
66
66
  children: i
67
67
  });
68
68
  }
@@ -1 +1 @@
1
- {"version":3,"file":"tag-badge.js","names":["TAG_COLORS","HASH_COLORS","tagColorFor","hash","i","key","TagBadge","props","resolved","color","colorKey","name","cn","BASALT_UI_CLASS","size","className"],"sources":["../../src/components/tag-badge.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\n\n/** Stable identifiers, labels and opaque foreground/background pairs for both themes. */\nexport const TAG_COLORS = {\n\tslate: {\n\t\tlabel: \"Slate\",\n\t\tclassName:\n\t\t\t\"border-basalt-tag-slate-border bg-basalt-tag-slate text-basalt-tag-slate-foreground\",\n\t},\n\tblue: {\n\t\tlabel: \"Blue\",\n\t\tclassName: \"border-basalt-tag-blue-border bg-basalt-tag-blue text-basalt-tag-blue-foreground\",\n\t},\n\tviolet: {\n\t\tlabel: \"Violet\",\n\t\tclassName:\n\t\t\t\"border-basalt-tag-violet-border bg-basalt-tag-violet text-basalt-tag-violet-foreground\",\n\t},\n\tteal: {\n\t\tlabel: \"Teal\",\n\t\tclassName: \"border-basalt-tag-teal-border bg-basalt-tag-teal text-basalt-tag-teal-foreground\",\n\t},\n\tamber: {\n\t\tlabel: \"Amber\",\n\t\tclassName:\n\t\t\t\"border-basalt-tag-amber-border bg-basalt-tag-amber text-basalt-tag-amber-foreground\",\n\t},\n\trose: {\n\t\tlabel: \"Rose\",\n\t\tclassName: \"border-basalt-tag-rose-border bg-basalt-tag-rose text-basalt-tag-rose-foreground\",\n\t},\n\tsuccess: {\n\t\tlabel: \"Success\",\n\t\tclassName:\n\t\t\t\"border-basalt-tag-success-border bg-basalt-tag-success text-basalt-tag-success-foreground\",\n\t},\n\twarning: {\n\t\tlabel: \"Warning\",\n\t\tclassName:\n\t\t\t\"border-basalt-tag-warning-border bg-basalt-tag-warning text-basalt-tag-warning-foreground\",\n\t},\n\tdanger: {\n\t\tlabel: \"Danger\",\n\t\tclassName:\n\t\t\t\"border-basalt-tag-danger-border bg-basalt-tag-danger text-basalt-tag-danger-foreground\",\n\t},\n\tinfo: {\n\t\tlabel: \"Info\",\n\t\tclassName: \"border-basalt-tag-info-border bg-basalt-tag-info text-basalt-tag-info-foreground\",\n\t},\n} as const;\nexport type TagColor = keyof typeof TAG_COLORS;\nconst HASH_COLORS = [\"slate\", \"blue\", \"violet\", \"teal\", \"amber\", \"rose\"] as const;\n/** Stable FNV-1a assignment to six non-semantic colors; does not infer business meaning. */\nexport function tagColorFor(key: string): TagColor {\n\tlet hash = 2166136261;\n\tfor (let i = 0; i < key.length; i++) hash = Math.imul(hash ^ key.charCodeAt(i), 16777619);\n\treturn HASH_COLORS[(hash >>> 0) % HASH_COLORS.length];\n}\nexport interface TagBadgeProps extends Omit<ComponentProps<\"span\">, \"children\" | \"color\"> {\n\t/** Visible tag name; color is always accompanied by text. */\n\tname: string;\n\t/** Stable hash input, defaults to name. Use an entity ID to retain color after renaming. */\n\tcolorKey?: string;\n\t/** Explicit hue or semantic color, overriding the deterministic assignment. */\n\tcolor?: TagColor;\n\t/** Badge size. @default \"md\" */\n\tsize?: \"sm\" | \"md\";\n}\nexport function TagBadge({\n\tname,\n\tcolorKey,\n\tcolor,\n\tsize = \"md\",\n\tclassName,\n\t...props\n}: TagBadgeProps) {\n\tconst resolved = color ?? tagColorFor(colorKey ?? name);\n\treturn (\n\t\t<span\n\t\t\t{...props}\n\t\t\tdata-tag-color={resolved}\n\t\t\tclassName={cn(\n\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\t\"inline-flex max-w-full items-center break-words rounded-basalt-full border font-medium\",\n\t\t\t\t\"basalt-inline\",\n\t\t\t\tsize === \"sm\" && \"px-basalt-space-sm\",\n\t\t\t\tTAG_COLORS[resolved].className,\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t>\n\t\t\t{name}\n\t\t</span>\n\t);\n}\n"],"mappings":";;;;;AAKA,IAAaA,IAAa;CACzB,OAAO;EACN,OAAO;EACP,WACC;CACF;CACA,MAAM;EACL,OAAO;EACP,WAAW;CACZ;CACA,QAAQ;EACP,OAAO;EACP,WACC;CACF;CACA,MAAM;EACL,OAAO;EACP,WAAW;CACZ;CACA,OAAO;EACN,OAAO;EACP,WACC;CACF;CACA,MAAM;EACL,OAAO;EACP,WAAW;CACZ;CACA,SAAS;EACR,OAAO;EACP,WACC;CACF;CACA,SAAS;EACR,OAAO;EACP,WACC;CACF;CACA,QAAQ;EACP,OAAO;EACP,WACC;CACF;CACA,MAAM;EACL,OAAO;EACP,WAAW;CACZ;AACD,GAEMC,IAAc;CAAC;CAAS;CAAQ;CAAU;CAAQ;CAAS;AAAM;AAEvE,SAAgBC,EAAY,GAAuB;CAClD,IAAIC,IAAO;CACX,KAAK,IAAIC,IAAI,GAAGA,IAAIC,EAAI,QAAQ,KAAK,IAAO,KAAK,KAAKF,IAAOE,EAAI,WAAWD,CAAC,GAAG,QAAQ;CACxF,OAAOH,GAAaE,MAAS,KAAKF,EAAY;AAC/C;AAWA,SAAgBK,EAAS,EACxB,SACA,aACA,UACA,UAAO,MACP,cACA,GAAGC,KACc;CACjB,IAAMC,IAAWC,KAASP,EAAYQ,KAAYC,CAAI;CACtD,OACC,kBAAC,QAAD;EACC,GAAIJ;EACJ,kBAAgBC;EAChB,WAAWI,EACVC,GACA,0FACA,iBACAC,MAAS,QAAQ,sBACjBd,EAAWQ,EAAS,CAAC,WACrBO,CACD;EAEC,UAAAJ;CACI,CAAA;AAER"}
1
+ {"version":3,"file":"tag-badge.js","names":["TAG_COLORS","HASH_COLORS","tagColorFor","hash","i","key","TagBadge","props","resolved","color","colorKey","name","cn","BASALT_UI_CLASS","size","className"],"sources":["../../src/components/tag-badge.tsx"],"sourcesContent":["import type { ComponentProps } from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\n\n/** Stable identifiers, labels and opaque foreground/background pairs for both themes. */\nexport const TAG_COLORS = {\n\tslate: {\n\t\tlabel: \"Slate\",\n\t\tclassName:\n\t\t\t\"border-basalt-tag-slate-border bg-basalt-tag-slate text-basalt-tag-slate-foreground\",\n\t},\n\tblue: {\n\t\tlabel: \"Blue\",\n\t\tclassName: \"border-basalt-tag-blue-border bg-basalt-tag-blue text-basalt-tag-blue-foreground\",\n\t},\n\tviolet: {\n\t\tlabel: \"Violet\",\n\t\tclassName:\n\t\t\t\"border-basalt-tag-violet-border bg-basalt-tag-violet text-basalt-tag-violet-foreground\",\n\t},\n\tteal: {\n\t\tlabel: \"Teal\",\n\t\tclassName: \"border-basalt-tag-teal-border bg-basalt-tag-teal text-basalt-tag-teal-foreground\",\n\t},\n\tamber: {\n\t\tlabel: \"Amber\",\n\t\tclassName:\n\t\t\t\"border-basalt-tag-amber-border bg-basalt-tag-amber text-basalt-tag-amber-foreground\",\n\t},\n\trose: {\n\t\tlabel: \"Rose\",\n\t\tclassName: \"border-basalt-tag-rose-border bg-basalt-tag-rose text-basalt-tag-rose-foreground\",\n\t},\n\tsuccess: {\n\t\tlabel: \"Success\",\n\t\tclassName:\n\t\t\t\"border-basalt-tag-success-border bg-basalt-tag-success text-basalt-tag-success-foreground\",\n\t},\n\twarning: {\n\t\tlabel: \"Warning\",\n\t\tclassName:\n\t\t\t\"border-basalt-tag-warning-border bg-basalt-tag-warning text-basalt-tag-warning-foreground\",\n\t},\n\tdanger: {\n\t\tlabel: \"Danger\",\n\t\tclassName:\n\t\t\t\"border-basalt-tag-danger-border bg-basalt-tag-danger text-basalt-tag-danger-foreground\",\n\t},\n\tinfo: {\n\t\tlabel: \"Info\",\n\t\tclassName: \"border-basalt-tag-info-border bg-basalt-tag-info text-basalt-tag-info-foreground\",\n\t},\n} as const;\nexport type TagColor = keyof typeof TAG_COLORS;\nconst HASH_COLORS = [\"slate\", \"blue\", \"violet\", \"teal\", \"amber\", \"rose\"] as const;\n/** Stable FNV-1a assignment to six non-semantic colors; does not infer business meaning. */\nexport function tagColorFor(key: string): TagColor {\n\tlet hash = 2166136261;\n\tfor (let i = 0; i < key.length; i++) hash = Math.imul(hash ^ key.charCodeAt(i), 16777619);\n\treturn HASH_COLORS[(hash >>> 0) % HASH_COLORS.length];\n}\nexport interface TagBadgeProps extends Omit<ComponentProps<\"span\">, \"children\" | \"color\"> {\n\t/** Visible tag name; color is always accompanied by text. */\n\tname: string;\n\t/** Stable hash input, defaults to name. Use an entity ID to retain color after renaming. */\n\tcolorKey?: string;\n\t/** Explicit hue or semantic color, overriding the deterministic assignment. */\n\tcolor?: TagColor;\n\t/** Badge size. @default \"md\" */\n\tsize?: \"sm\" | \"md\";\n}\nexport function TagBadge({\n\tname,\n\tcolorKey,\n\tcolor,\n\tsize = \"md\",\n\tclassName,\n\t...props\n}: TagBadgeProps) {\n\tconst resolved = color ?? tagColorFor(colorKey ?? name);\n\treturn (\n\t\t<span\n\t\t\t{...props}\n\t\t\tdata-tag-color={resolved}\n\t\t\tclassName={cn(\n\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\t\"inline-flex max-w-full items-center break-words rounded-basalt-full border font-medium\",\n\t\t\t\t\"basalt-inline\",\n\t\t\t\tsize === \"sm\" ? \"px-basalt-space-md\" : \"px-basalt-space-lg\",\n\t\t\t\tTAG_COLORS[resolved].className,\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t>\n\t\t\t{name}\n\t\t</span>\n\t);\n}\n"],"mappings":";;;;;AAKA,IAAaA,IAAa;CACzB,OAAO;EACN,OAAO;EACP,WACC;CACF;CACA,MAAM;EACL,OAAO;EACP,WAAW;CACZ;CACA,QAAQ;EACP,OAAO;EACP,WACC;CACF;CACA,MAAM;EACL,OAAO;EACP,WAAW;CACZ;CACA,OAAO;EACN,OAAO;EACP,WACC;CACF;CACA,MAAM;EACL,OAAO;EACP,WAAW;CACZ;CACA,SAAS;EACR,OAAO;EACP,WACC;CACF;CACA,SAAS;EACR,OAAO;EACP,WACC;CACF;CACA,QAAQ;EACP,OAAO;EACP,WACC;CACF;CACA,MAAM;EACL,OAAO;EACP,WAAW;CACZ;AACD,GAEMC,IAAc;CAAC;CAAS;CAAQ;CAAU;CAAQ;CAAS;AAAM;AAEvE,SAAgBC,EAAY,GAAuB;CAClD,IAAIC,IAAO;CACX,KAAK,IAAIC,IAAI,GAAGA,IAAIC,EAAI,QAAQ,KAAK,IAAO,KAAK,KAAKF,IAAOE,EAAI,WAAWD,CAAC,GAAG,QAAQ;CACxF,OAAOH,GAAaE,MAAS,KAAKF,EAAY;AAC/C;AAWA,SAAgBK,EAAS,EACxB,SACA,aACA,UACA,UAAO,MACP,cACA,GAAGC,KACc;CACjB,IAAMC,IAAWC,KAASP,EAAYQ,KAAYC,CAAI;CACtD,OACC,kBAAC,QAAD;EACC,GAAIJ;EACJ,kBAAgBC;EAChB,WAAWI,EACVC,GACA,0FACA,iBACAC,MAAS,OAAO,uBAAuB,sBACvCd,EAAWQ,EAAS,CAAC,WACrBO,CACD;EAEC,UAAAJ;CACI,CAAA;AAER"}
@@ -10,8 +10,8 @@ var i = r("text-basalt-foreground", {
10
10
  xs: "text-basalt-sm",
11
11
  sm: "text-basalt-base",
12
12
  md: "text-basalt-base leading-[var(--basalt-line-relaxed)]",
13
- lg: "text-basalt-lg",
14
- xl: "text-basalt-xl"
13
+ lg: "text-basalt-xl",
14
+ xl: "text-basalt-3xl"
15
15
  },
16
16
  tone: {
17
17
  default: "text-basalt-foreground",
@@ -1 +1 @@
1
- {"version":3,"file":"text.js","names":["React","textVariants","cva","defaultElement","variant","defaultSize","Text","props","Component","as","cn","BASALT_UI_CLASS","size","bold","truncate","className"],"sources":["../../src/components/text.tsx"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\n\nexport type TextVariant = \"body\" | \"heading\" | \"mono\";\nexport type TextSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type TextTone = \"default\" | \"muted\";\nexport type TextElement =\n\t| \"h1\"\n\t| \"h2\"\n\t| \"h3\"\n\t| \"h4\"\n\t| \"h5\"\n\t| \"h6\"\n\t| \"p\"\n\t| \"span\"\n\t| \"label\"\n\t| \"dt\"\n\t| \"dd\"\n\t| \"li\"\n\t| \"figcaption\"\n\t| \"legend\"\n\t| \"pre\"\n\t| \"code\"\n\t| \"em\"\n\t| \"strong\"\n\t| \"small\"\n\t| \"abbr\"\n\t| \"time\";\n\nconst textVariants = cva(\"text-basalt-foreground\", {\n\tvariants: {\n\t\tsize: {\n\t\t\txs: \"text-basalt-sm\",\n\t\t\tsm: \"text-basalt-base\",\n\t\t\tmd: \"text-basalt-base leading-[var(--basalt-line-relaxed)]\",\n\t\t\tlg: \"text-basalt-lg\",\n\t\t\txl: \"text-basalt-xl\",\n\t\t},\n\t\ttone: {\n\t\t\tdefault: \"text-basalt-foreground\",\n\t\t\tmuted: \"text-basalt-muted-foreground\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tsize: \"md\",\n\t\ttone: \"default\",\n\t},\n});\n\nexport interface TextProps extends React.HTMLAttributes<HTMLElement> {\n\t/**\n\t * Visual role. Does not infer document outline.\n\t * @default \"body\"\n\t */\n\tvariant?: TextVariant;\n\t/** Type scale. Defaults by variant: body md, heading lg, mono sm. */\n\tsize?: TextSize;\n\t/**\n\t * Foreground tone.\n\t * @default \"default\"\n\t */\n\ttone?: TextTone;\n\t/** Rendered HTML element. Defaults by variant: body p, heading/mono span. */\n\tas?: TextElement;\n\t/**\n\t * Apply semibold weight.\n\t * @default false\n\t */\n\tbold?: boolean;\n\t/**\n\t * Ellipsize overflow on one line.\n\t * @default false\n\t */\n\ttruncate?: boolean;\n}\n\nfunction defaultElement(variant: TextVariant): TextElement {\n\treturn variant === \"body\" ? \"p\" : \"span\";\n}\n\nfunction defaultSize(variant: TextVariant): TextSize {\n\tif (variant === \"heading\") {\n\t\treturn \"lg\";\n\t}\n\tif (variant === \"mono\") {\n\t\treturn \"sm\";\n\t}\n\treturn \"md\";\n}\n\nexport const Text = React.forwardRef<HTMLElement, TextProps>(\n\t(\n\t\t{\n\t\t\tas,\n\t\t\tbold = false,\n\t\t\tclassName,\n\t\t\tsize,\n\t\t\ttone = \"default\",\n\t\t\ttruncate = false,\n\t\t\tvariant = \"body\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst Component = as ?? defaultElement(variant);\n\t\treturn React.createElement(Component, {\n\t\t\t...props,\n\t\t\tref,\n\t\t\tclassName: cn(\n\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\ttextVariants({ size: size ?? defaultSize(variant), tone }),\n\t\t\t\tvariant === \"heading\" && \"font-semibold\",\n\t\t\t\tvariant === \"mono\" && \"font-mono\",\n\t\t\t\tbold && \"font-semibold\",\n\t\t\t\ttruncate && \"min-w-0 truncate\",\n\t\t\t\tclassName,\n\t\t\t),\n\t\t});\n\t},\n);\nText.displayName = \"Text\";\n"],"mappings":";;;;;;AA+BA,IAAMC,IAAeC,EAAI,0BAA0B;CAClD,UAAU;EACT,MAAM;GACL,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACL;EACA,MAAM;GACL,SAAS;GACT,OAAO;EACR;CACD;CACA,iBAAiB;EAChB,MAAM;EACN,MAAM;CACP;AACD,CAAC;AA6BD,SAASC,EAAe,GAAmC;CAC1D,OAAOC,MAAY,SAAS,MAAM;AACnC;AAEA,SAASC,EAAY,GAAgC;CAOpD,OANID,MAAY,YACR,OAEJA,MAAY,SACR,OAED;AACR;AAEA,IAAaE,IAAON,EAAM,YAExB,EACC,OACA,UAAO,IACP,cACA,SACA,UAAO,WACP,cAAW,IACX,aAAU,QACV,GAAGO,KAEJ,MACI;CACJ,IAAMC,IAAYC,KAAMN,EAAeC,CAAO;CAC9C,OAAOJ,EAAM,cAAcQ,GAAW;EACrC,GAAGD;EACH;EACA,WAAWG,EACVC,GACAV,EAAa;GAAE,MAAMW,KAAQP,EAAYD,CAAO;GAAG;EAAK,CAAC,GACzDA,MAAY,aAAa,iBACzBA,MAAY,UAAU,aACtBS,KAAQ,iBACRC,KAAY,oBACZC,CACD;CACD,CAAC;AACF,CACD;AACA,EAAK,cAAc"}
1
+ {"version":3,"file":"text.js","names":["React","textVariants","cva","defaultElement","variant","defaultSize","Text","props","Component","as","cn","BASALT_UI_CLASS","size","bold","truncate","className"],"sources":["../../src/components/text.tsx"],"sourcesContent":["import { cva } from \"class-variance-authority\";\nimport * as React from \"react\";\nimport { cn } from \"../utils/cn\";\nimport { BASALT_UI_CLASS } from \"../utils/control-surface\";\n\nexport type TextVariant = \"body\" | \"heading\" | \"mono\";\nexport type TextSize = \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xl\";\nexport type TextTone = \"default\" | \"muted\";\nexport type TextElement =\n\t| \"h1\"\n\t| \"h2\"\n\t| \"h3\"\n\t| \"h4\"\n\t| \"h5\"\n\t| \"h6\"\n\t| \"p\"\n\t| \"span\"\n\t| \"label\"\n\t| \"dt\"\n\t| \"dd\"\n\t| \"li\"\n\t| \"figcaption\"\n\t| \"legend\"\n\t| \"pre\"\n\t| \"code\"\n\t| \"em\"\n\t| \"strong\"\n\t| \"small\"\n\t| \"abbr\"\n\t| \"time\";\n\nconst textVariants = cva(\"text-basalt-foreground\", {\n\tvariants: {\n\t\tsize: {\n\t\t\txs: \"text-basalt-sm\",\n\t\t\tsm: \"text-basalt-base\",\n\t\t\tmd: \"text-basalt-base leading-[var(--basalt-line-relaxed)]\",\n\t\t\tlg: \"text-basalt-xl\",\n\t\t\txl: \"text-basalt-3xl\",\n\t\t},\n\t\ttone: {\n\t\t\tdefault: \"text-basalt-foreground\",\n\t\t\tmuted: \"text-basalt-muted-foreground\",\n\t\t},\n\t},\n\tdefaultVariants: {\n\t\tsize: \"md\",\n\t\ttone: \"default\",\n\t},\n});\n\nexport interface TextProps extends React.HTMLAttributes<HTMLElement> {\n\t/**\n\t * Visual role. Does not infer document outline.\n\t * @default \"body\"\n\t */\n\tvariant?: TextVariant;\n\t/** Type scale. Defaults by variant: body md, heading lg, mono sm. */\n\tsize?: TextSize;\n\t/**\n\t * Foreground tone.\n\t * @default \"default\"\n\t */\n\ttone?: TextTone;\n\t/** Rendered HTML element. Defaults by variant: body p, heading/mono span. */\n\tas?: TextElement;\n\t/**\n\t * Apply semibold weight.\n\t * @default false\n\t */\n\tbold?: boolean;\n\t/**\n\t * Ellipsize overflow on one line.\n\t * @default false\n\t */\n\ttruncate?: boolean;\n}\n\nfunction defaultElement(variant: TextVariant): TextElement {\n\treturn variant === \"body\" ? \"p\" : \"span\";\n}\n\nfunction defaultSize(variant: TextVariant): TextSize {\n\tif (variant === \"heading\") {\n\t\treturn \"lg\";\n\t}\n\tif (variant === \"mono\") {\n\t\treturn \"sm\";\n\t}\n\treturn \"md\";\n}\n\nexport const Text = React.forwardRef<HTMLElement, TextProps>(\n\t(\n\t\t{\n\t\t\tas,\n\t\t\tbold = false,\n\t\t\tclassName,\n\t\t\tsize,\n\t\t\ttone = \"default\",\n\t\t\ttruncate = false,\n\t\t\tvariant = \"body\",\n\t\t\t...props\n\t\t},\n\t\tref,\n\t) => {\n\t\tconst Component = as ?? defaultElement(variant);\n\t\treturn React.createElement(Component, {\n\t\t\t...props,\n\t\t\tref,\n\t\t\tclassName: cn(\n\t\t\t\tBASALT_UI_CLASS,\n\t\t\t\ttextVariants({ size: size ?? defaultSize(variant), tone }),\n\t\t\t\tvariant === \"heading\" && \"font-semibold\",\n\t\t\t\tvariant === \"mono\" && \"font-mono\",\n\t\t\t\tbold && \"font-semibold\",\n\t\t\t\ttruncate && \"min-w-0 truncate\",\n\t\t\t\tclassName,\n\t\t\t),\n\t\t});\n\t},\n);\nText.displayName = \"Text\";\n"],"mappings":";;;;;;AA+BA,IAAMC,IAAeC,EAAI,0BAA0B;CAClD,UAAU;EACT,MAAM;GACL,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;EACL;EACA,MAAM;GACL,SAAS;GACT,OAAO;EACR;CACD;CACA,iBAAiB;EAChB,MAAM;EACN,MAAM;CACP;AACD,CAAC;AA6BD,SAASC,EAAe,GAAmC;CAC1D,OAAOC,MAAY,SAAS,MAAM;AACnC;AAEA,SAASC,EAAY,GAAgC;CAOpD,OANID,MAAY,YACR,OAEJA,MAAY,SACR,OAED;AACR;AAEA,IAAaE,IAAON,EAAM,YAExB,EACC,OACA,UAAO,IACP,cACA,SACA,UAAO,WACP,cAAW,IACX,aAAU,QACV,GAAGO,KAEJ,MACI;CACJ,IAAMC,IAAYC,KAAMN,EAAeC,CAAO;CAC9C,OAAOJ,EAAM,cAAcQ,GAAW;EACrC,GAAGD;EACH;EACA,WAAWG,EACVC,GACAV,EAAa;GAAE,MAAMW,KAAQP,EAAYD,CAAO;GAAG;EAAK,CAAC,GACzDA,MAAY,aAAa,iBACzBA,MAAY,UAAU,aACtBS,KAAQ,iBACRC,KAAY,oBACZC,CACD;CACD,CAAC;AACF,CACD;AACA,EAAK,cAAc"}
@@ -64,7 +64,7 @@ function m({ steps: m, variant: h = "steps", title: g, className: _, ...v }) {
64
64
  }), /* @__PURE__ */ p("div", {
65
65
  className: "min-w-0",
66
66
  children: [/* @__PURE__ */ f("p", {
67
- className: e("text-basalt-code", h === "coding" && "font-mono"),
67
+ className: e("text-basalt-base", h === "coding" && "font-mono"),
68
68
  children: t.label
69
69
  }), t.detail && /* @__PURE__ */ f("p", {
70
70
  className: "mt-basalt-space-sm whitespace-pre-wrap break-words text-basalt-sm leading-[var(--basalt-line-body)] text-basalt-muted-foreground",
@@ -1 +1 @@
1
- {"version":3,"file":"thinking.js","names":["Thinking","props","vm","useThinkingViewModel","Icon","variant","Search","Code","Sparkles","heading","title","Collapsible","cn","className","CollapsibleTrigger","CollapsibleContent","steps","step","Loader","Check","CircleAlert","Circle"],"sources":["../../src/components/thinking.tsx"],"sourcesContent":["import { Check, Circle, CircleAlert, Code, Search, Sparkles } from \"lucide-react\";\nimport type { ThinkingStep, ThinkingVariant } from \"../models/agent-feedback\";\nimport { cn } from \"../utils/cn\";\nimport { useThinkingViewModel } from \"../viewmodels/use-thinking\";\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from \"./collapsible\";\nimport { Loader } from \"./loader\";\n\nexport type { ThinkingStep, ThinkingVariant } from \"../models/agent-feedback\";\nexport interface ThinkingProps {\n\t/** Caller-owned trace steps; the component never executes work. */\n\tsteps: readonly ThinkingStep[];\n\t/** Trace presentation. @default \"steps\" */\n\tvariant?: ThinkingVariant;\n\t/** Override the derived status title. */\n\ttitle?: string;\n\topen?: boolean;\n\t/** Initially expand the trace. @default true */\n\tdefaultOpen?: boolean;\n\tonOpenChange?: (open: boolean) => void;\n\tclassName?: string;\n}\n\nexport function Thinking({ steps, variant = \"steps\", title, className, ...props }: ThinkingProps) {\n\tconst vm = useThinkingViewModel({ steps, ...props });\n\tconst Icon = variant === \"search\" ? Search : variant === \"coding\" ? Code : Sparkles;\n\tconst heading =\n\t\ttitle ??\n\t\t(vm.status === \"error\"\n\t\t\t? \"Needs attention\"\n\t\t\t: vm.status === \"complete\"\n\t\t\t\t? \"Thinking complete\"\n\t\t\t\t: vm.status === \"running\"\n\t\t\t\t\t? \"Thinking\"\n\t\t\t\t\t: \"Waiting\");\n\treturn (\n\t\t<Collapsible\n\t\t\topen={vm.open}\n\t\t\tonOpenChange={vm.setOpen}\n\t\t\tclassName={cn(\n\t\t\t\t\"basalt-ui w-full text-basalt-base leading-[var(--basalt-line-body)] text-basalt-foreground\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t>\n\t\t\t<CollapsibleTrigger className=\"rounded-basalt-sm px-basalt-row-x py-basalt-control-y text-basalt-muted-foreground\">\n\t\t\t\t<span className=\"inline-flex min-w-0 flex-wrap items-center gap-basalt-row-gap\">\n\t\t\t\t\t<Icon aria-hidden=\"true\" className=\"size-basalt-icon-lg shrink-0\" strokeWidth={1.5} />\n\t\t\t\t\t<span role=\"status\" className={cn(vm.status === \"running\" && \"basalt-shimmer-label\")}>\n\t\t\t\t\t\t{heading}\n\t\t\t\t\t</span>\n\t\t\t\t\t<span className=\"text-basalt-sm tabular-nums text-basalt-muted-foreground\">\n\t\t\t\t\t\t{vm.completed}/{vm.total}\n\t\t\t\t\t</span>\n\t\t\t\t</span>\n\t\t\t</CollapsibleTrigger>\n\t\t\t<CollapsibleContent unstyled>\n\t\t\t\t<ol\n\t\t\t\t\taria-label=\"Thinking steps\"\n\t\t\t\t\tclassName=\"ml-[calc(var(--basalt-space-row-x)+var(--basalt-size-icon-lg)/2)] space-y-basalt-content-gap border-l border-basalt-border py-basalt-space-lg pl-[calc(var(--basalt-size-icon-lg)/2+var(--basalt-space-row-gap))] pr-basalt-row-x\"\n\t\t\t\t>\n\t\t\t\t\t{steps.map((step) => (\n\t\t\t\t\t\t<li\n\t\t\t\t\t\t\tkey={step.id}\n\t\t\t\t\t\t\tdata-step-status={step.status}\n\t\t\t\t\t\t\tclassName=\"basalt-agent-reveal flex items-start gap-basalt-row-gap\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\tclassName=\"flex h-[var(--basalt-line-body)] w-basalt-icon-lg shrink-0 items-center justify-center text-basalt-muted-foreground\"\n\t\t\t\t\t\t\t\trole=\"img\"\n\t\t\t\t\t\t\t\taria-label={step.status}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{step.status === \"running\" ? (\n\t\t\t\t\t\t\t\t\t<Loader size={12} showLabel={false} showElapsed={false} aria-hidden=\"true\" />\n\t\t\t\t\t\t\t\t) : step.status === \"complete\" ? (\n\t\t\t\t\t\t\t\t\t<Check size={14} />\n\t\t\t\t\t\t\t\t) : step.status === \"error\" ? (\n\t\t\t\t\t\t\t\t\t<CircleAlert size={14} className=\"text-basalt-danger\" />\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<Circle size={12} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<div className=\"min-w-0\">\n\t\t\t\t\t\t\t\t<p className={cn(\"text-basalt-code\", variant === \"coding\" && \"font-mono\")}>\n\t\t\t\t\t\t\t\t\t{step.label}\n\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t{step.detail && (\n\t\t\t\t\t\t\t\t\t<p className=\"mt-basalt-space-sm whitespace-pre-wrap break-words text-basalt-sm leading-[var(--basalt-line-body)] text-basalt-muted-foreground\">\n\t\t\t\t\t\t\t\t\t\t{step.detail}\n\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t))}\n\t\t\t\t\t{steps.length === 0 && (\n\t\t\t\t\t\t<li className=\"text-basalt-sm text-basalt-muted-foreground\">No steps yet</li>\n\t\t\t\t\t)}\n\t\t\t\t</ol>\n\t\t\t</CollapsibleContent>\n\t\t</Collapsible>\n\t);\n}\n"],"mappings":";;;;;;;;AAsBA,SAAgBA,EAAS,EAAE,UAAO,aAAU,SAAS,UAAO,cAAW,GAAGC,KAAwB;CACjG,IAAMC,IAAKC,EAAqB;EAAE;EAAO,GAAGF;CAAM,CAAC,GAC7CG,IAAOC,MAAY,WAAWC,IAASD,MAAY,WAAWE,IAAOC,GACrEC,IACLC,MACCR,EAAG,WAAW,UACZ,oBACAA,EAAG,WAAW,aACb,sBACAA,EAAG,WAAW,YACb,aACA;CACN,OACC,kBAACS,GAAD;EACC,MAAMT,EAAG;EACT,cAAcA,EAAG;EACjB,WAAWU,EACV,8FACAC,CACD;EAND,UAAA,CAQC,kBAACC,GAAD;GAAoB,WAAU;GAC7B,UAAA,kBAAC,QAAD;IAAM,WAAU;IAAhB,UAAA;KACC,kBAACV,GAAD;MAAM,eAAY;MAAO,WAAU;MAA+B,aAAa;KAAM,CAAA;KACrF,kBAAC,QAAD;MAAM,MAAK;MAAS,WAAWQ,EAAGV,EAAG,WAAW,aAAa,sBAAsB;MACjF,UAAAO;KACI,CAAA;KACN,kBAAC,QAAD;MAAM,WAAU;MAAhB,UAAA;OACEP,EAAG;OAAU;OAAEA,EAAG;MACd;;IACD;;EACa,CAAA,GACpB,kBAACa,GAAD;GAAoB,UAAA;GACnB,UAAA,kBAAC,MAAD;IACC,cAAW;IACX,WAAU;IAFX,UAAA,CAIEC,EAAM,KAAK,MACX,kBAAC,MAAD;KAEC,oBAAkBC,EAAK;KACvB,WAAU;KAHX,UAAA,CAKC,kBAAC,QAAD;MACC,WAAU;MACV,MAAK;MACL,cAAYA,EAAK;MAEhB,UAAAA,EAAK,WAAW,YAChB,kBAACC,GAAD;OAAQ,MAAM;OAAI,WAAW;OAAO,aAAa;OAAO,eAAY;MAAQ,CAAA,IACzED,EAAK,WAAW,aACnB,kBAACE,GAAD,EAAO,MAAM,GAAK,CAAA,IACfF,EAAK,WAAW,UACnB,kBAACG,GAAD;OAAa,MAAM;OAAI,WAAU;MAAsB,CAAA,IAEvD,kBAACC,GAAD,EAAQ,MAAM,GAAK,CAAA;KAEf,CAAA,GACN,kBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACC,kBAAC,KAAD;OAAG,WAAWT,EAAG,oBAAoBP,MAAY,YAAY,WAAW;OACtE,UAAAY,EAAK;MACJ,CAAA,GACFA,EAAK,UACL,kBAAC,KAAD;OAAG,WAAU;OACX,UAAAA,EAAK;MACJ,CAAA,CAEA;KACF,CAAA,CAAA;IA7BE,GAAAA,EAAK,EA6BP,CACJ,GACAD,EAAM,WAAW,KACjB,kBAAC,MAAD;KAAI,WAAU;KAA8C,UAAA;IAAgB,CAAA,CAE1E;;EACe,CAAA,CACR;;AAEf"}
1
+ {"version":3,"file":"thinking.js","names":["Thinking","props","vm","useThinkingViewModel","Icon","variant","Search","Code","Sparkles","heading","title","Collapsible","cn","className","CollapsibleTrigger","CollapsibleContent","steps","step","Loader","Check","CircleAlert","Circle"],"sources":["../../src/components/thinking.tsx"],"sourcesContent":["import { Check, Circle, CircleAlert, Code, Search, Sparkles } from \"lucide-react\";\nimport type { ThinkingStep, ThinkingVariant } from \"../models/agent-feedback\";\nimport { cn } from \"../utils/cn\";\nimport { useThinkingViewModel } from \"../viewmodels/use-thinking\";\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from \"./collapsible\";\nimport { Loader } from \"./loader\";\n\nexport type { ThinkingStep, ThinkingVariant } from \"../models/agent-feedback\";\nexport interface ThinkingProps {\n\t/** Caller-owned trace steps; the component never executes work. */\n\tsteps: readonly ThinkingStep[];\n\t/** Trace presentation. @default \"steps\" */\n\tvariant?: ThinkingVariant;\n\t/** Override the derived status title. */\n\ttitle?: string;\n\topen?: boolean;\n\t/** Initially expand the trace. @default true */\n\tdefaultOpen?: boolean;\n\tonOpenChange?: (open: boolean) => void;\n\tclassName?: string;\n}\n\nexport function Thinking({ steps, variant = \"steps\", title, className, ...props }: ThinkingProps) {\n\tconst vm = useThinkingViewModel({ steps, ...props });\n\tconst Icon = variant === \"search\" ? Search : variant === \"coding\" ? Code : Sparkles;\n\tconst heading =\n\t\ttitle ??\n\t\t(vm.status === \"error\"\n\t\t\t? \"Needs attention\"\n\t\t\t: vm.status === \"complete\"\n\t\t\t\t? \"Thinking complete\"\n\t\t\t\t: vm.status === \"running\"\n\t\t\t\t\t? \"Thinking\"\n\t\t\t\t\t: \"Waiting\");\n\treturn (\n\t\t<Collapsible\n\t\t\topen={vm.open}\n\t\t\tonOpenChange={vm.setOpen}\n\t\t\tclassName={cn(\n\t\t\t\t\"basalt-ui w-full text-basalt-base leading-[var(--basalt-line-body)] text-basalt-foreground\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t>\n\t\t\t<CollapsibleTrigger className=\"rounded-basalt-sm px-basalt-row-x py-basalt-control-y text-basalt-muted-foreground\">\n\t\t\t\t<span className=\"inline-flex min-w-0 flex-wrap items-center gap-basalt-row-gap\">\n\t\t\t\t\t<Icon aria-hidden=\"true\" className=\"size-basalt-icon-lg shrink-0\" strokeWidth={1.5} />\n\t\t\t\t\t<span role=\"status\" className={cn(vm.status === \"running\" && \"basalt-shimmer-label\")}>\n\t\t\t\t\t\t{heading}\n\t\t\t\t\t</span>\n\t\t\t\t\t<span className=\"text-basalt-sm tabular-nums text-basalt-muted-foreground\">\n\t\t\t\t\t\t{vm.completed}/{vm.total}\n\t\t\t\t\t</span>\n\t\t\t\t</span>\n\t\t\t</CollapsibleTrigger>\n\t\t\t<CollapsibleContent unstyled>\n\t\t\t\t<ol\n\t\t\t\t\taria-label=\"Thinking steps\"\n\t\t\t\t\tclassName=\"ml-[calc(var(--basalt-space-row-x)+var(--basalt-size-icon-lg)/2)] space-y-basalt-content-gap border-l border-basalt-border py-basalt-space-lg pl-[calc(var(--basalt-size-icon-lg)/2+var(--basalt-space-row-gap))] pr-basalt-row-x\"\n\t\t\t\t>\n\t\t\t\t\t{steps.map((step) => (\n\t\t\t\t\t\t<li\n\t\t\t\t\t\t\tkey={step.id}\n\t\t\t\t\t\t\tdata-step-status={step.status}\n\t\t\t\t\t\t\tclassName=\"basalt-agent-reveal flex items-start gap-basalt-row-gap\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\tclassName=\"flex h-[var(--basalt-line-body)] w-basalt-icon-lg shrink-0 items-center justify-center text-basalt-muted-foreground\"\n\t\t\t\t\t\t\t\trole=\"img\"\n\t\t\t\t\t\t\t\taria-label={step.status}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{step.status === \"running\" ? (\n\t\t\t\t\t\t\t\t\t<Loader size={12} showLabel={false} showElapsed={false} aria-hidden=\"true\" />\n\t\t\t\t\t\t\t\t) : step.status === \"complete\" ? (\n\t\t\t\t\t\t\t\t\t<Check size={14} />\n\t\t\t\t\t\t\t\t) : step.status === \"error\" ? (\n\t\t\t\t\t\t\t\t\t<CircleAlert size={14} className=\"text-basalt-danger\" />\n\t\t\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t\t\t<Circle size={12} />\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t<div className=\"min-w-0\">\n\t\t\t\t\t\t\t\t<p className={cn(\"text-basalt-base\", variant === \"coding\" && \"font-mono\")}>\n\t\t\t\t\t\t\t\t\t{step.label}\n\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t{step.detail && (\n\t\t\t\t\t\t\t\t\t<p className=\"mt-basalt-space-sm whitespace-pre-wrap break-words text-basalt-sm leading-[var(--basalt-line-body)] text-basalt-muted-foreground\">\n\t\t\t\t\t\t\t\t\t\t{step.detail}\n\t\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t))}\n\t\t\t\t\t{steps.length === 0 && (\n\t\t\t\t\t\t<li className=\"text-basalt-sm text-basalt-muted-foreground\">No steps yet</li>\n\t\t\t\t\t)}\n\t\t\t\t</ol>\n\t\t\t</CollapsibleContent>\n\t\t</Collapsible>\n\t);\n}\n"],"mappings":";;;;;;;;AAsBA,SAAgBA,EAAS,EAAE,UAAO,aAAU,SAAS,UAAO,cAAW,GAAGC,KAAwB;CACjG,IAAMC,IAAKC,EAAqB;EAAE;EAAO,GAAGF;CAAM,CAAC,GAC7CG,IAAOC,MAAY,WAAWC,IAASD,MAAY,WAAWE,IAAOC,GACrEC,IACLC,MACCR,EAAG,WAAW,UACZ,oBACAA,EAAG,WAAW,aACb,sBACAA,EAAG,WAAW,YACb,aACA;CACN,OACC,kBAACS,GAAD;EACC,MAAMT,EAAG;EACT,cAAcA,EAAG;EACjB,WAAWU,EACV,8FACAC,CACD;EAND,UAAA,CAQC,kBAACC,GAAD;GAAoB,WAAU;GAC7B,UAAA,kBAAC,QAAD;IAAM,WAAU;IAAhB,UAAA;KACC,kBAACV,GAAD;MAAM,eAAY;MAAO,WAAU;MAA+B,aAAa;KAAM,CAAA;KACrF,kBAAC,QAAD;MAAM,MAAK;MAAS,WAAWQ,EAAGV,EAAG,WAAW,aAAa,sBAAsB;MACjF,UAAAO;KACI,CAAA;KACN,kBAAC,QAAD;MAAM,WAAU;MAAhB,UAAA;OACEP,EAAG;OAAU;OAAEA,EAAG;MACd;;IACD;;EACa,CAAA,GACpB,kBAACa,GAAD;GAAoB,UAAA;GACnB,UAAA,kBAAC,MAAD;IACC,cAAW;IACX,WAAU;IAFX,UAAA,CAIEC,EAAM,KAAK,MACX,kBAAC,MAAD;KAEC,oBAAkBC,EAAK;KACvB,WAAU;KAHX,UAAA,CAKC,kBAAC,QAAD;MACC,WAAU;MACV,MAAK;MACL,cAAYA,EAAK;MAEhB,UAAAA,EAAK,WAAW,YAChB,kBAACC,GAAD;OAAQ,MAAM;OAAI,WAAW;OAAO,aAAa;OAAO,eAAY;MAAQ,CAAA,IACzED,EAAK,WAAW,aACnB,kBAACE,GAAD,EAAO,MAAM,GAAK,CAAA,IACfF,EAAK,WAAW,UACnB,kBAACG,GAAD;OAAa,MAAM;OAAI,WAAU;MAAsB,CAAA,IAEvD,kBAACC,GAAD,EAAQ,MAAM,GAAK,CAAA;KAEf,CAAA,GACN,kBAAC,OAAD;MAAK,WAAU;MAAf,UAAA,CACC,kBAAC,KAAD;OAAG,WAAWT,EAAG,oBAAoBP,MAAY,YAAY,WAAW;OACtE,UAAAY,EAAK;MACJ,CAAA,GACFA,EAAK,UACL,kBAAC,KAAD;OAAG,WAAU;OACX,UAAAA,EAAK;MACJ,CAAA,CAEA;KACF,CAAA,CAAA;IA7BE,GAAAA,EAAK,EA6BP,CACJ,GACAD,EAAM,WAAW,KACjB,kBAAC,MAAD;KAAI,WAAU;KAA8C,UAAA;IAAgB,CAAA,CAE1E;;EACe,CAAA,CACR;;AAEf"}
@@ -62,7 +62,7 @@ function S({ steps: h, diffs: g = [], title: _, defaultOpen: v = !0, className:
62
62
  /* @__PURE__ */ b("span", {
63
63
  className: "flex min-w-0 flex-wrap items-center gap-x-basalt-row-gap",
64
64
  children: [/* @__PURE__ */ y("span", { children: e.label }), e.target && /* @__PURE__ */ y("span", {
65
- className: "max-w-full truncate font-mono text-basalt-code text-basalt-muted-foreground",
65
+ className: "max-w-full truncate font-mono text-basalt-base text-basalt-muted-foreground",
66
66
  children: e.target
67
67
  })]
68
68
  }),
@@ -86,7 +86,7 @@ function S({ steps: h, diffs: g = [], title: _, defaultOpen: v = !0, className:
86
86
  unstyled: !0,
87
87
  className: "pl-basalt-row-content pr-basalt-row-x pb-basalt-row-y",
88
88
  children: /* @__PURE__ */ y("p", {
89
- className: "whitespace-pre-wrap break-words text-basalt-code text-basalt-muted-foreground",
89
+ className: "whitespace-pre-wrap break-words text-basalt-base text-basalt-muted-foreground",
90
90
  children: e.detail || "No output yet"
91
91
  })
92
92
  })]
@@ -1 +1 @@
1
- {"version":3,"file":"tool-chips.js","names":["ICONS","Sparkles","FileText","Pencil","Terminal","ToolChips","vm","useToolChipsViewModel","steps","defaultOpen","highlightRef","useHoverHighlight","Collapsible","cn","className","CollapsibleTrigger","title","CollapsibleContent","Icon","step","next","Loader","Check","CircleAlert","diffs","Popover","PopoverTrigger","Button","diff","PopoverContent","PopoverTitle","CodeBlock"],"sources":["../../src/components/tool-chips.tsx"],"sourcesContent":["import { Check, CircleAlert, FileText, Pencil, Sparkles, Terminal } from \"lucide-react\";\nimport type { ToolDiff, ToolStep } from \"../models/agent-feedback\";\nimport { cn } from \"../utils/cn\";\nimport { useHoverHighlight } from \"../utils/use-hover-highlight\";\nimport { useToolChipsViewModel } from \"../viewmodels/use-tool-chips\";\nimport { Button } from \"./button\";\nimport { CodeBlock } from \"./code\";\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from \"./collapsible\";\nimport { Loader } from \"./loader\";\nimport { Popover, PopoverContent, PopoverTitle, PopoverTrigger } from \"./popover\";\n\nexport type { ToolDiff, ToolStep } from \"../models/agent-feedback\";\nexport interface ToolChipsProps {\n\t/** Caller-owned tool activity; statuses never advance automatically. */\n\tsteps: readonly ToolStep[];\n\tdiffs?: readonly ToolDiff[];\n\ttitle?: string;\n\t/** Start with the tool list expanded. @default true */\n\tdefaultOpen?: boolean;\n\tclassName?: string;\n}\nconst ICONS = { think: Sparkles, read: FileText, write: Pencil, run: Terminal };\n\nexport function ToolChips({\n\tsteps,\n\tdiffs = [],\n\ttitle,\n\tdefaultOpen = true,\n\tclassName,\n}: ToolChipsProps) {\n\tconst vm = useToolChipsViewModel(steps, defaultOpen);\n\tconst highlightRef = useHoverHighlight();\n\treturn (\n\t\t<Collapsible\n\t\t\topen={vm.open}\n\t\t\tonOpenChange={vm.setOpen}\n\t\t\tclassName={cn(\n\t\t\t\t\"basalt-ui w-full space-y-basalt-content-gap leading-[var(--basalt-line-body)]\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t>\n\t\t\t<CollapsibleTrigger className=\"rounded-basalt-sm px-basalt-row-x py-basalt-control-y text-basalt-muted-foreground\">\n\t\t\t\t<span role=\"status\">{title ?? `${vm.total} tool calls · ${vm.completed} complete`}</span>\n\t\t\t</CollapsibleTrigger>\n\t\t\t<CollapsibleContent\n\t\t\t\tref={highlightRef}\n\t\t\t\tunstyled\n\t\t\t\tclassName=\"basalt-hover-list space-y-basalt-space-sm\"\n\t\t\t>\n\t\t\t\t{steps.map((step) => {\n\t\t\t\t\tconst Icon = ICONS[step.kind];\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Collapsible\n\t\t\t\t\t\t\tkey={step.id}\n\t\t\t\t\t\t\topen={vm.expanded.includes(step.id)}\n\t\t\t\t\t\t\tonOpenChange={(next) => vm.setExpanded(step.id, next)}\n\t\t\t\t\t\t\tclassName=\"basalt-agent-reveal\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<CollapsibleTrigger\n\t\t\t\t\t\t\t\tdata-basalt-hover-item=\"\"\n\t\t\t\t\t\t\t\tdata-hover-selected={vm.expanded.includes(step.id)}\n\t\t\t\t\t\t\t\taria-label={[step.label, step.target, step.status].filter(Boolean).join(\" \")}\n\t\t\t\t\t\t\t\tclassName=\"w-full min-h-basalt-control items-start justify-between rounded-basalt-sm px-basalt-row-x py-basalt-row-y leading-basalt-row [&>svg]:mt-[calc((var(--basalt-line-row)-var(--basalt-size-icon-sm))/2)]\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<span className=\"flex min-w-0 items-start gap-basalt-row-gap text-basalt-base leading-basalt-row\">\n\t\t\t\t\t\t\t\t\t<span className=\"flex h-[var(--basalt-line-row)] w-basalt-icon-lg shrink-0 items-center justify-center\">\n\t\t\t\t\t\t\t\t\t\t<Icon aria-hidden=\"true\" className=\"size-basalt-icon-lg\" strokeWidth={1.5} />\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t<span className=\"flex min-w-0 flex-wrap items-center gap-x-basalt-row-gap\">\n\t\t\t\t\t\t\t\t\t\t<span>{step.label}</span>\n\t\t\t\t\t\t\t\t\t\t{step.target && (\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"max-w-full truncate font-mono text-basalt-code text-basalt-muted-foreground\">\n\t\t\t\t\t\t\t\t\t\t\t\t{step.target}\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\trole=\"img\"\n\t\t\t\t\t\t\t\t\t\taria-label={step.status}\n\t\t\t\t\t\t\t\t\t\tclassName=\"flex h-[var(--basalt-line-row)] w-basalt-icon-sm shrink-0 items-center justify-center\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{step.status === \"running\" ? (\n\t\t\t\t\t\t\t\t\t\t\t<Loader size={12} showLabel={false} showElapsed={false} aria-hidden=\"true\" />\n\t\t\t\t\t\t\t\t\t\t) : step.status === \"complete\" ? (\n\t\t\t\t\t\t\t\t\t\t\t<Check size={12} />\n\t\t\t\t\t\t\t\t\t\t) : step.status === \"error\" ? (\n\t\t\t\t\t\t\t\t\t\t\t<CircleAlert size={12} className=\"text-basalt-danger\" />\n\t\t\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</CollapsibleTrigger>\n\t\t\t\t\t\t\t<CollapsibleContent\n\t\t\t\t\t\t\t\tunstyled\n\t\t\t\t\t\t\t\tclassName=\"pl-basalt-row-content pr-basalt-row-x pb-basalt-row-y\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<p className=\"whitespace-pre-wrap break-words text-basalt-code text-basalt-muted-foreground\">\n\t\t\t\t\t\t\t\t\t{step.detail || \"No output yet\"}\n\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t</CollapsibleContent>\n\t\t\t\t\t\t</Collapsible>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t\t{steps.length === 0 && (\n\t\t\t\t\t<p className=\"px-basalt-row-x py-basalt-space-lg text-basalt-sm text-basalt-muted-foreground\">\n\t\t\t\t\t\tNo tool calls yet\n\t\t\t\t\t</p>\n\t\t\t\t)}\n\t\t\t\t<div className=\"flex flex-wrap gap-basalt-content-gap px-basalt-row-x\">\n\t\t\t\t\t{diffs.map((diff) => (\n\t\t\t\t\t\t<Popover key={diff.file}>\n\t\t\t\t\t\t\t<PopoverTrigger asChild>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tvariant=\"outline\"\n\t\t\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\t\t\taria-label={`${diff.file} +${diff.added} -${diff.removed}`}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<span className=\"font-mono text-basalt-sm\">{diff.file}</span>\n\t\t\t\t\t\t\t\t\t<span className=\"text-basalt-primary\">+{diff.added}</span>\n\t\t\t\t\t\t\t\t\t<span className=\"text-basalt-danger\">-{diff.removed}</span>\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t</PopoverTrigger>\n\t\t\t\t\t\t\t<PopoverContent arrow={false} className=\"max-w-[calc(100vw-2rem)]\">\n\t\t\t\t\t\t\t\t<PopoverTitle>{diff.file}</PopoverTitle>\n\t\t\t\t\t\t\t\t<CodeBlock className=\"mt-basalt-space-lg max-h-basalt-64 text-basalt-sm\">\n\t\t\t\t\t\t\t\t\t{diff.content || \"No diff preview available\"}\n\t\t\t\t\t\t\t\t</CodeBlock>\n\t\t\t\t\t\t\t</PopoverContent>\n\t\t\t\t\t\t</Popover>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t</CollapsibleContent>\n\t\t</Collapsible>\n\t);\n}\n"],"mappings":";;;;;;;;;;;;AAqBA,IAAMA,IAAQ;CAAE,OAAOC;CAAU,MAAMC;CAAU,OAAOC;CAAQ,KAAKC;AAAS;AAE9E,SAAgBC,EAAU,EACzB,UACA,WAAQ,CAAC,GACT,UACA,iBAAc,IACd,gBACkB;CAClB,IAAMC,IAAKC,EAAsBC,GAAOC,CAAW,GAC7CC,IAAeC,EAAkB;CACvC,OACC,kBAACC,GAAD;EACC,MAAMN,EAAG;EACT,cAAcA,EAAG;EACjB,WAAWO,EACV,iFACAC,CACD;EAND,UAAA,CAQC,kBAACC,GAAD;GAAoB,WAAU;GAC7B,UAAA,kBAAC,QAAD;IAAM,MAAK;IAAU,UAAAC,KAAS,GAAGV,EAAG,MAAM,gBAAgBA,EAAG,UAAU;GAAiB,CAAA;EACrE,CAAA,GACpB,kBAACW,GAAD;GACC,KAAKP;GACL,UAAA;GACA,WAAU;GAHX,UAAA;IAKEF,EAAM,KAAK,MAAS;KACpB,IAAMU,IAAOlB,EAAMmB,EAAK;KACxB,OACC,kBAACP,GAAD;MAEC,MAAMN,EAAG,SAAS,SAASa,EAAK,EAAE;MAClC,eAAe,MAASb,EAAG,YAAYa,EAAK,IAAIC,CAAI;MACpD,WAAU;MAJX,UAAA,CAMC,kBAACL,GAAD;OACC,0BAAuB;OACvB,uBAAqBT,EAAG,SAAS,SAASa,EAAK,EAAE;OACjD,cAAY;QAACA,EAAK;QAAOA,EAAK;QAAQA,EAAK;OAAM,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;OAC3E,WAAU;OAEV,UAAA,kBAAC,QAAD;QAAM,WAAU;QAAhB,UAAA;SACC,kBAAC,QAAD;UAAM,WAAU;UACf,UAAA,kBAACD,GAAD;WAAM,eAAY;WAAO,WAAU;WAAsB,aAAa;UAAM,CAAA;SACvE,CAAA;SACN,kBAAC,QAAD;UAAM,WAAU;UAAhB,UAAA,CACC,kBAAC,QAAD,EAAA,UAAOC,EAAK,MAAY,CAAA,GACvBA,EAAK,UACL,kBAAC,QAAD;WAAM,WAAU;WACd,UAAAA,EAAK;UACD,CAAA,CAEF;;SACN,kBAAC,QAAD;UACC,MAAK;UACL,cAAYA,EAAK;UACjB,WAAU;UAET,UAAAA,EAAK,WAAW,YAChB,kBAACE,GAAD;WAAQ,MAAM;WAAI,WAAW;WAAO,aAAa;WAAO,eAAY;UAAQ,CAAA,IACzEF,EAAK,WAAW,aACnB,kBAACG,GAAD,EAAO,MAAM,GAAK,CAAA,IACfH,EAAK,WAAW,UACnB,kBAACI,GAAD;WAAa,MAAM;WAAI,WAAU;UAAsB,CAAA,IACpD;SACC,CAAA;QACD;;MACa,CAAA,GACpB,kBAACN,GAAD;OACC,UAAA;OACA,WAAU;OAEV,UAAA,kBAAC,KAAD;QAAG,WAAU;QACX,UAAAE,EAAK,UAAU;OACd,CAAA;MACgB,CAAA,CACR;KA9CP,GAAAA,EAAK,EA8CE;IAEf,CAAC;IACAX,EAAM,WAAW,KACjB,kBAAC,KAAD;KAAG,WAAU;KAAiF,UAAA;IAE3F,CAAA;IAEJ,kBAAC,OAAD;KAAK,WAAU;KACb,UAAAgB,EAAM,KAAK,MACX,kBAACC,GAAD,EAAA,UAAA,CACC,kBAACC,GAAD;MAAgB,SAAA;MACf,UAAA,kBAACC,GAAD;OACC,SAAQ;OACR,MAAK;OACL,cAAY,GAAGC,EAAK,KAAK,IAAIA,EAAK,MAAM,IAAIA,EAAK;OAHlD,UAAA;QAKC,kBAAC,QAAD;SAAM,WAAU;SAA4B,UAAAA,EAAK;QAAW,CAAA;QAC5D,kBAAC,QAAD;SAAM,WAAU;SAAhB,UAAA,CAAsC,KAAEA,EAAK,KAAY;;QACzD,kBAAC,QAAD;SAAM,WAAU;SAAhB,UAAA,CAAqC,KAAEA,EAAK,OAAc;;OACnD;;KACO,CAAA,GAChB,kBAACC,GAAD;MAAgB,OAAO;MAAO,WAAU;MAAxC,UAAA,CACC,kBAACC,GAAD,EAAA,UAAeF,EAAK,KAAmB,CAAA,GACvC,kBAACG,GAAD;OAAW,WAAU;OACnB,UAAAH,EAAK,WAAW;MACP,CAAA,CACI;KACR,CAAA,CAAA,EAAA,GAlBKA,EAAK,IAkBV,CACT;IACG,CAAA;GACc;EACR,CAAA,CAAA;;AAEf"}
1
+ {"version":3,"file":"tool-chips.js","names":["ICONS","Sparkles","FileText","Pencil","Terminal","ToolChips","vm","useToolChipsViewModel","steps","defaultOpen","highlightRef","useHoverHighlight","Collapsible","cn","className","CollapsibleTrigger","title","CollapsibleContent","Icon","step","next","Loader","Check","CircleAlert","diffs","Popover","PopoverTrigger","Button","diff","PopoverContent","PopoverTitle","CodeBlock"],"sources":["../../src/components/tool-chips.tsx"],"sourcesContent":["import { Check, CircleAlert, FileText, Pencil, Sparkles, Terminal } from \"lucide-react\";\nimport type { ToolDiff, ToolStep } from \"../models/agent-feedback\";\nimport { cn } from \"../utils/cn\";\nimport { useHoverHighlight } from \"../utils/use-hover-highlight\";\nimport { useToolChipsViewModel } from \"../viewmodels/use-tool-chips\";\nimport { Button } from \"./button\";\nimport { CodeBlock } from \"./code\";\nimport { Collapsible, CollapsibleContent, CollapsibleTrigger } from \"./collapsible\";\nimport { Loader } from \"./loader\";\nimport { Popover, PopoverContent, PopoverTitle, PopoverTrigger } from \"./popover\";\n\nexport type { ToolDiff, ToolStep } from \"../models/agent-feedback\";\nexport interface ToolChipsProps {\n\t/** Caller-owned tool activity; statuses never advance automatically. */\n\tsteps: readonly ToolStep[];\n\tdiffs?: readonly ToolDiff[];\n\ttitle?: string;\n\t/** Start with the tool list expanded. @default true */\n\tdefaultOpen?: boolean;\n\tclassName?: string;\n}\nconst ICONS = { think: Sparkles, read: FileText, write: Pencil, run: Terminal };\n\nexport function ToolChips({\n\tsteps,\n\tdiffs = [],\n\ttitle,\n\tdefaultOpen = true,\n\tclassName,\n}: ToolChipsProps) {\n\tconst vm = useToolChipsViewModel(steps, defaultOpen);\n\tconst highlightRef = useHoverHighlight();\n\treturn (\n\t\t<Collapsible\n\t\t\topen={vm.open}\n\t\t\tonOpenChange={vm.setOpen}\n\t\t\tclassName={cn(\n\t\t\t\t\"basalt-ui w-full space-y-basalt-content-gap leading-[var(--basalt-line-body)]\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t>\n\t\t\t<CollapsibleTrigger className=\"rounded-basalt-sm px-basalt-row-x py-basalt-control-y text-basalt-muted-foreground\">\n\t\t\t\t<span role=\"status\">{title ?? `${vm.total} tool calls · ${vm.completed} complete`}</span>\n\t\t\t</CollapsibleTrigger>\n\t\t\t<CollapsibleContent\n\t\t\t\tref={highlightRef}\n\t\t\t\tunstyled\n\t\t\t\tclassName=\"basalt-hover-list space-y-basalt-space-sm\"\n\t\t\t>\n\t\t\t\t{steps.map((step) => {\n\t\t\t\t\tconst Icon = ICONS[step.kind];\n\t\t\t\t\treturn (\n\t\t\t\t\t\t<Collapsible\n\t\t\t\t\t\t\tkey={step.id}\n\t\t\t\t\t\t\topen={vm.expanded.includes(step.id)}\n\t\t\t\t\t\t\tonOpenChange={(next) => vm.setExpanded(step.id, next)}\n\t\t\t\t\t\t\tclassName=\"basalt-agent-reveal\"\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<CollapsibleTrigger\n\t\t\t\t\t\t\t\tdata-basalt-hover-item=\"\"\n\t\t\t\t\t\t\t\tdata-hover-selected={vm.expanded.includes(step.id)}\n\t\t\t\t\t\t\t\taria-label={[step.label, step.target, step.status].filter(Boolean).join(\" \")}\n\t\t\t\t\t\t\t\tclassName=\"w-full min-h-basalt-control items-start justify-between rounded-basalt-sm px-basalt-row-x py-basalt-row-y leading-basalt-row [&>svg]:mt-[calc((var(--basalt-line-row)-var(--basalt-size-icon-sm))/2)]\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<span className=\"flex min-w-0 items-start gap-basalt-row-gap text-basalt-base leading-basalt-row\">\n\t\t\t\t\t\t\t\t\t<span className=\"flex h-[var(--basalt-line-row)] w-basalt-icon-lg shrink-0 items-center justify-center\">\n\t\t\t\t\t\t\t\t\t\t<Icon aria-hidden=\"true\" className=\"size-basalt-icon-lg\" strokeWidth={1.5} />\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t<span className=\"flex min-w-0 flex-wrap items-center gap-x-basalt-row-gap\">\n\t\t\t\t\t\t\t\t\t\t<span>{step.label}</span>\n\t\t\t\t\t\t\t\t\t\t{step.target && (\n\t\t\t\t\t\t\t\t\t\t\t<span className=\"max-w-full truncate font-mono text-basalt-base text-basalt-muted-foreground\">\n\t\t\t\t\t\t\t\t\t\t\t\t{step.target}\n\t\t\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t\t)}\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\trole=\"img\"\n\t\t\t\t\t\t\t\t\t\taria-label={step.status}\n\t\t\t\t\t\t\t\t\t\tclassName=\"flex h-[var(--basalt-line-row)] w-basalt-icon-sm shrink-0 items-center justify-center\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{step.status === \"running\" ? (\n\t\t\t\t\t\t\t\t\t\t\t<Loader size={12} showLabel={false} showElapsed={false} aria-hidden=\"true\" />\n\t\t\t\t\t\t\t\t\t\t) : step.status === \"complete\" ? (\n\t\t\t\t\t\t\t\t\t\t\t<Check size={12} />\n\t\t\t\t\t\t\t\t\t\t) : step.status === \"error\" ? (\n\t\t\t\t\t\t\t\t\t\t\t<CircleAlert size={12} className=\"text-basalt-danger\" />\n\t\t\t\t\t\t\t\t\t\t) : null}\n\t\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t\t</span>\n\t\t\t\t\t\t\t</CollapsibleTrigger>\n\t\t\t\t\t\t\t<CollapsibleContent\n\t\t\t\t\t\t\t\tunstyled\n\t\t\t\t\t\t\t\tclassName=\"pl-basalt-row-content pr-basalt-row-x pb-basalt-row-y\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<p className=\"whitespace-pre-wrap break-words text-basalt-base text-basalt-muted-foreground\">\n\t\t\t\t\t\t\t\t\t{step.detail || \"No output yet\"}\n\t\t\t\t\t\t\t\t</p>\n\t\t\t\t\t\t\t</CollapsibleContent>\n\t\t\t\t\t\t</Collapsible>\n\t\t\t\t\t);\n\t\t\t\t})}\n\t\t\t\t{steps.length === 0 && (\n\t\t\t\t\t<p className=\"px-basalt-row-x py-basalt-space-lg text-basalt-sm text-basalt-muted-foreground\">\n\t\t\t\t\t\tNo tool calls yet\n\t\t\t\t\t</p>\n\t\t\t\t)}\n\t\t\t\t<div className=\"flex flex-wrap gap-basalt-content-gap px-basalt-row-x\">\n\t\t\t\t\t{diffs.map((diff) => (\n\t\t\t\t\t\t<Popover key={diff.file}>\n\t\t\t\t\t\t\t<PopoverTrigger asChild>\n\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\tvariant=\"outline\"\n\t\t\t\t\t\t\t\t\tsize=\"sm\"\n\t\t\t\t\t\t\t\t\taria-label={`${diff.file} +${diff.added} -${diff.removed}`}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<span className=\"font-mono text-basalt-sm\">{diff.file}</span>\n\t\t\t\t\t\t\t\t\t<span className=\"text-basalt-primary\">+{diff.added}</span>\n\t\t\t\t\t\t\t\t\t<span className=\"text-basalt-danger\">-{diff.removed}</span>\n\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t</PopoverTrigger>\n\t\t\t\t\t\t\t<PopoverContent arrow={false} className=\"max-w-[calc(100vw-2rem)]\">\n\t\t\t\t\t\t\t\t<PopoverTitle>{diff.file}</PopoverTitle>\n\t\t\t\t\t\t\t\t<CodeBlock className=\"mt-basalt-space-lg max-h-basalt-64 text-basalt-sm\">\n\t\t\t\t\t\t\t\t\t{diff.content || \"No diff preview available\"}\n\t\t\t\t\t\t\t\t</CodeBlock>\n\t\t\t\t\t\t\t</PopoverContent>\n\t\t\t\t\t\t</Popover>\n\t\t\t\t\t))}\n\t\t\t\t</div>\n\t\t\t</CollapsibleContent>\n\t\t</Collapsible>\n\t);\n}\n"],"mappings":";;;;;;;;;;;;AAqBA,IAAMA,IAAQ;CAAE,OAAOC;CAAU,MAAMC;CAAU,OAAOC;CAAQ,KAAKC;AAAS;AAE9E,SAAgBC,EAAU,EACzB,UACA,WAAQ,CAAC,GACT,UACA,iBAAc,IACd,gBACkB;CAClB,IAAMC,IAAKC,EAAsBC,GAAOC,CAAW,GAC7CC,IAAeC,EAAkB;CACvC,OACC,kBAACC,GAAD;EACC,MAAMN,EAAG;EACT,cAAcA,EAAG;EACjB,WAAWO,EACV,iFACAC,CACD;EAND,UAAA,CAQC,kBAACC,GAAD;GAAoB,WAAU;GAC7B,UAAA,kBAAC,QAAD;IAAM,MAAK;IAAU,UAAAC,KAAS,GAAGV,EAAG,MAAM,gBAAgBA,EAAG,UAAU;GAAiB,CAAA;EACrE,CAAA,GACpB,kBAACW,GAAD;GACC,KAAKP;GACL,UAAA;GACA,WAAU;GAHX,UAAA;IAKEF,EAAM,KAAK,MAAS;KACpB,IAAMU,IAAOlB,EAAMmB,EAAK;KACxB,OACC,kBAACP,GAAD;MAEC,MAAMN,EAAG,SAAS,SAASa,EAAK,EAAE;MAClC,eAAe,MAASb,EAAG,YAAYa,EAAK,IAAIC,CAAI;MACpD,WAAU;MAJX,UAAA,CAMC,kBAACL,GAAD;OACC,0BAAuB;OACvB,uBAAqBT,EAAG,SAAS,SAASa,EAAK,EAAE;OACjD,cAAY;QAACA,EAAK;QAAOA,EAAK;QAAQA,EAAK;OAAM,CAAC,CAAC,OAAO,OAAO,CAAC,CAAC,KAAK,GAAG;OAC3E,WAAU;OAEV,UAAA,kBAAC,QAAD;QAAM,WAAU;QAAhB,UAAA;SACC,kBAAC,QAAD;UAAM,WAAU;UACf,UAAA,kBAACD,GAAD;WAAM,eAAY;WAAO,WAAU;WAAsB,aAAa;UAAM,CAAA;SACvE,CAAA;SACN,kBAAC,QAAD;UAAM,WAAU;UAAhB,UAAA,CACC,kBAAC,QAAD,EAAA,UAAOC,EAAK,MAAY,CAAA,GACvBA,EAAK,UACL,kBAAC,QAAD;WAAM,WAAU;WACd,UAAAA,EAAK;UACD,CAAA,CAEF;;SACN,kBAAC,QAAD;UACC,MAAK;UACL,cAAYA,EAAK;UACjB,WAAU;UAET,UAAAA,EAAK,WAAW,YAChB,kBAACE,GAAD;WAAQ,MAAM;WAAI,WAAW;WAAO,aAAa;WAAO,eAAY;UAAQ,CAAA,IACzEF,EAAK,WAAW,aACnB,kBAACG,GAAD,EAAO,MAAM,GAAK,CAAA,IACfH,EAAK,WAAW,UACnB,kBAACI,GAAD;WAAa,MAAM;WAAI,WAAU;UAAsB,CAAA,IACpD;SACC,CAAA;QACD;;MACa,CAAA,GACpB,kBAACN,GAAD;OACC,UAAA;OACA,WAAU;OAEV,UAAA,kBAAC,KAAD;QAAG,WAAU;QACX,UAAAE,EAAK,UAAU;OACd,CAAA;MACgB,CAAA,CACR;KA9CP,GAAAA,EAAK,EA8CE;IAEf,CAAC;IACAX,EAAM,WAAW,KACjB,kBAAC,KAAD;KAAG,WAAU;KAAiF,UAAA;IAE3F,CAAA;IAEJ,kBAAC,OAAD;KAAK,WAAU;KACb,UAAAgB,EAAM,KAAK,MACX,kBAACC,GAAD,EAAA,UAAA,CACC,kBAACC,GAAD;MAAgB,SAAA;MACf,UAAA,kBAACC,GAAD;OACC,SAAQ;OACR,MAAK;OACL,cAAY,GAAGC,EAAK,KAAK,IAAIA,EAAK,MAAM,IAAIA,EAAK;OAHlD,UAAA;QAKC,kBAAC,QAAD;SAAM,WAAU;SAA4B,UAAAA,EAAK;QAAW,CAAA;QAC5D,kBAAC,QAAD;SAAM,WAAU;SAAhB,UAAA,CAAsC,KAAEA,EAAK,KAAY;;QACzD,kBAAC,QAAD;SAAM,WAAU;SAAhB,UAAA,CAAqC,KAAEA,EAAK,OAAc;;OACnD;;KACO,CAAA,GAChB,kBAACC,GAAD;MAAgB,OAAO;MAAO,WAAU;MAAxC,UAAA,CACC,kBAACC,GAAD,EAAA,UAAeF,EAAK,KAAmB,CAAA,GACvC,kBAACG,GAAD;OAAW,WAAU;OACnB,UAAAH,EAAK,WAAW;MACP,CAAA,CACI;KACR,CAAA,CAAA,EAAA,GAlBKA,EAAK,IAkBV,CACT;IACG,CAAA;GACc;EACR,CAAA,CAAA;;AAEf"}