@actioneer/ads 0.6.0 → 0.8.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 (123) hide show
  1. package/DESIGN.md +597 -0
  2. package/components/ai-elements/agent-trace.d.ts +2 -2
  3. package/components/ai-elements/agent-trace.js +164 -105
  4. package/components/ai-elements/chain-of-thought.d.ts +2 -2
  5. package/components/ai-elements/chain-of-thought.js +1 -1
  6. package/components/ai-elements/index.d.ts +0 -5
  7. package/components/ai-elements/inline-citation.js +1 -1
  8. package/components/alert.d.ts +6 -6
  9. package/components/alert.js +89 -53
  10. package/components/answer-sources.d.ts +2 -6
  11. package/components/answer-sources.js +58 -60
  12. package/components/answer.d.ts +5 -0
  13. package/components/answer.js +311 -271
  14. package/components/assistant-ui/action-bar.js +1 -1
  15. package/components/assistant-ui/attachment.js +11 -11
  16. package/components/assistant-ui/badge.js +18 -18
  17. package/components/assistant-ui/composer-harness.js +15 -20
  18. package/components/assistant-ui/composer-trigger-popover.js +9 -9
  19. package/components/assistant-ui/composer.d.ts +3 -1
  20. package/components/assistant-ui/composer.js +148 -144
  21. package/components/assistant-ui/image.js +61 -61
  22. package/components/assistant-ui/index.d.ts +0 -3
  23. package/components/assistant-ui/message-timing.js +1 -1
  24. package/components/assistant-ui/selection-toolbar.js +7 -7
  25. package/components/assistant-ui/thread-context.d.ts +3 -1
  26. package/components/assistant-ui/thread.js +50 -42
  27. package/components/avatar.js +42 -42
  28. package/components/badge.d.ts +5 -6
  29. package/components/badge.js +13 -76
  30. package/components/body-page-header.d.ts +15 -0
  31. package/components/body-page-header.js +24 -0
  32. package/components/brand-loader.d.ts +0 -3
  33. package/components/brand-loader.js +10 -32
  34. package/components/breadcrumbs.d.ts +0 -7
  35. package/components/breadcrumbs.js +54 -71
  36. package/components/button.d.ts +1 -1
  37. package/components/button.js +55 -49
  38. package/components/chart.js +298 -296
  39. package/components/chip.d.ts +13 -1
  40. package/components/chip.js +93 -80
  41. package/components/collection-header.d.ts +17 -0
  42. package/components/collection-header.js +31 -0
  43. package/components/connector-card.d.ts +6 -6
  44. package/components/connector-card.js +31 -32
  45. package/components/date-range-picker.d.ts +2 -1
  46. package/components/date-range-picker.js +158 -122
  47. package/components/divider.js +25 -25
  48. package/components/drawer.d.ts +6 -2
  49. package/components/drawer.js +61 -58
  50. package/components/dropdown.d.ts +1 -2
  51. package/components/dropdown.js +88 -89
  52. package/components/field.js +41 -36
  53. package/components/file-dropzone.js +1 -1
  54. package/components/index.d.ts +4 -4
  55. package/components/index.js +501 -549
  56. package/components/infinite-canvas.js +24 -24
  57. package/components/input-field.d.ts +18 -3
  58. package/components/input-field.js +88 -72
  59. package/components/input.js +32 -29
  60. package/components/modal.d.ts +31 -3
  61. package/components/modal.js +244 -170
  62. package/components/number-field.js +45 -42
  63. package/components/page-body.d.ts +12 -0
  64. package/components/page-body.js +18 -0
  65. package/components/pagination.js +36 -36
  66. package/components/pixel-blast-svg.js +71 -73
  67. package/components/select.d.ts +21 -0
  68. package/components/select.js +189 -148
  69. package/components/setting-row.d.ts +6 -5
  70. package/components/setting-row.js +33 -32
  71. package/components/sidebar.d.ts +2 -0
  72. package/components/sidebar.js +151 -141
  73. package/components/skeleton.js +8 -7
  74. package/components/slider.js +1 -1
  75. package/components/surface-loader.d.ts +11 -0
  76. package/components/surface-loader.js +35 -0
  77. package/components/table.d.ts +16 -10
  78. package/components/table.js +427 -412
  79. package/components/tabs.d.ts +2 -0
  80. package/components/tabs.js +160 -295
  81. package/components/textarea.js +9 -9
  82. package/components/toast.d.ts +1 -1
  83. package/components/toast.js +181 -118
  84. package/components/tree.d.ts +5 -1
  85. package/components/tree.js +54 -49
  86. package/components/typography.d.ts +4 -4
  87. package/components/typography.js +13 -13
  88. package/components/ui/button.d.ts +1 -1
  89. package/components/ui/button.js +4 -4
  90. package/components/ui/dialog.js +25 -25
  91. package/demo/components/add-to-artifact.js +6 -10
  92. package/lib/cn.js +11 -4
  93. package/lib/icons.d.ts +4 -0
  94. package/lib/icons.js +103 -102
  95. package/lib/interactive.d.ts +1 -1
  96. package/llms.txt +132 -188
  97. package/manifest.json +1719 -2831
  98. package/package.json +2 -2
  99. package/styles.css +362 -233
  100. package/theme.css +312 -177
  101. package/components/agent-icon.d.ts +0 -76
  102. package/components/agent-icon.js +0 -265
  103. package/components/ai-elements/queue.d.ts +0 -60
  104. package/components/ai-elements/queue.js +0 -193
  105. package/components/ai-elements/speech-input.d.ts +0 -16
  106. package/components/ai-elements/speech-input.js +0 -151
  107. package/components/ai-elements/task-progress.d.ts +0 -41
  108. package/components/ai-elements/task-progress.js +0 -224
  109. package/components/ai-elements/task.d.ts +0 -39
  110. package/components/ai-elements/task.js +0 -105
  111. package/components/ai-elements/voice.d.ts +0 -90
  112. package/components/ai-elements/voice.js +0 -496
  113. package/components/assistant-ui/follow-up-suggestions.d.ts +0 -11
  114. package/components/assistant-ui/follow-up-suggestions.js +0 -72
  115. package/components/assistant-ui/suggestions.d.ts +0 -7
  116. package/components/assistant-ui/suggestions.js +0 -19
  117. package/components/assistant-ui/voice.d.ts +0 -18
  118. package/components/link.d.ts +0 -14
  119. package/components/link.js +0 -72
  120. package/components/navbar.d.ts +0 -15
  121. package/components/navbar.js +0 -68
  122. package/components/pixel-icon.d.ts +0 -37
  123. package/components/pixel-icon.js +0 -859
@@ -1,77 +1,62 @@
1
1
  "use client";
2
- import { jsx as p, jsxs as T } from "react/jsx-runtime";
3
- import * as o from "react";
4
- import { cn as u } from "../lib/cn.js";
5
- import { Checkbox as re } from "./checkbox.js";
6
- import { ChevronUp as ge, ChevronDown as he, SortIcon as we } from "../lib/icons.js";
7
- const ne = (e) => e === "center" ? "text-center" : e === "right" ? "text-right" : "text-left", ae = (e, t = !1) => e === "left" ? u(
2
+ import { jsx as d, jsxs as T } from "react/jsx-runtime";
3
+ import * as n from "react";
4
+ import { cn as m } from "../lib/cn.js";
5
+ import { Checkbox as ne } from "./checkbox.js";
6
+ import { ChevronUp as ve, ChevronDown as ye, SortIcon as we } from "../lib/icons.js";
7
+ const se = (r) => r === "center" ? "text-center" : r === "right" ? "text-right" : "text-left", ae = (r, t = !1) => r === "left" ? m(
8
8
  "sticky left-0 z-10",
9
9
  // Scroll-aware: the smudge only appears once content is actually
10
10
  // hidden behind the pinned column (nothing to scroll back to at the
11
11
  // far left → no shadow).
12
12
  "group-data-[scroll-left=true]/table-shell:shadow-table-smudge-left"
13
- ) : e === "right" ? u(
13
+ ) : r === "right" ? m(
14
14
  "sticky right-0 z-10",
15
15
  // Backward-compatible fallback. Action columns should opt into the
16
16
  // Table-level elevation so one shadow spans the complete column.
17
17
  !t && "group-data-[scroll-right=true]/table-shell:shadow-table-smudge-right"
18
- ) : void 0, se = (e) => e === "right" ? u(
19
- "group-first/row:before:pointer-events-none group-first/row:before:absolute group-first/row:before:right-0 group-first/row:before:top-0 group-first/row:before:size-3 group-first/row:before:content-[''] group-first/row:before:[background:radial-gradient(circle_at_0%_100%,transparent_11.5px,var(--table-shell)_12px)]",
20
- "group-last/row:after:pointer-events-none group-last/row:after:absolute group-last/row:after:right-0 group-last/row:after:bottom-0 group-last/row:after:size-3 group-last/row:after:content-[''] group-last/row:after:[background:radial-gradient(circle_at_0%_0%,transparent_11.5px,var(--table-shell)_12px)]"
21
- ) : u(
22
- "group-first/row:before:pointer-events-none group-first/row:before:absolute group-first/row:before:left-0 group-first/row:before:top-0 group-first/row:before:size-3 group-first/row:before:content-[''] group-first/row:before:[background:radial-gradient(circle_at_100%_100%,transparent_11.5px,var(--table-shell)_12px)]",
23
- "group-last/row:after:pointer-events-none group-last/row:after:absolute group-last/row:after:left-0 group-last/row:after:bottom-0 group-last/row:after:size-3 group-last/row:after:content-[''] group-last/row:after:[background:radial-gradient(circle_at_100%_0%,transparent_11.5px,var(--table-shell)_12px)]"
24
- ), le = (e) => u(
18
+ ) : void 0, ie = n.createContext(!1), le = (r) => m(
25
19
  "bg-card align-middle transition-colors",
26
- // Row separators — functional hairline, none under the last row.
27
- "border-b border-border group-last/row:border-b-0",
28
- !e && u(
29
- // Restore the original quiet neutral hover: the row softly sinks
30
- // toward the shell instead of picking up a brand tint or a new
20
+ // Functional row hairline; the table shell carries the outer stroke.
21
+ "border-b border-table-stroke group-last/row:border-b-0",
22
+ r && m(
23
+ // Use WG2 without introducing a new
31
24
  // rounded silhouette. The wash is pre-composited so scrolled text
32
25
  // cannot show through sticky cells.
33
26
  "group-hover/row:bg-(--table-row-hover) group-focus-within/row:bg-(--table-row-hover)",
34
27
  "group-data-[selected]/row:bg-(--table-row-selected)"
35
28
  )
36
- ), ve = u(
37
- "group-first/row:rounded-tl-(--table-card-radius)",
38
- "group-last/row:rounded-bl-(--table-card-radius)"
39
- ), ye = u(
40
- "group-first/row:first:rounded-tl-(--table-card-radius)",
41
- "group-first/row:last:rounded-tr-(--table-card-radius)",
42
- "group-last/row:first:rounded-bl-(--table-card-radius)",
43
- "group-last/row:last:rounded-br-(--table-card-radius)"
44
- ), ie = u(
29
+ ), ce = "bg-card", ue = m(
45
30
  "after:pointer-events-none after:absolute after:right-0 after:top-1/2",
46
31
  "after:h-4 after:w-px after:-translate-y-1/2 after:rounded-sm",
47
32
  "after:bg-border-strong last:after:hidden"
48
- ), K = "__ads_table_column_", G = 64, xe = new Intl.Collator(void 0, {
33
+ ), G = "__ads_table_column_", Q = 64, xe = new Intl.Collator(void 0, {
49
34
  numeric: !0,
50
35
  sensitivity: "base"
51
36
  });
52
- function V(e) {
37
+ function V(r) {
53
38
  const t = [];
54
- return o.Children.forEach(e, (a) => {
55
- if (o.isValidElement(a) && a.type === o.Fragment) {
39
+ return n.Children.forEach(r, (a) => {
40
+ if (n.isValidElement(a) && a.type === n.Fragment) {
56
41
  t.push(...V(a.props.children));
57
42
  return;
58
43
  }
59
44
  t.push(a);
60
45
  }), t;
61
46
  }
62
- function X(e) {
63
- if (e == null || typeof e == "boolean")
47
+ function X(r) {
48
+ if (r == null || typeof r == "boolean")
64
49
  return "";
65
- if (typeof e == "number" || typeof e == "string") return e;
66
- if (Array.isArray(e))
67
- return e.map((n) => String(X(n))).join(" ").trim();
68
- if (!o.isValidElement(e)) return "";
69
- const t = e.props.sortValue;
50
+ if (typeof r == "number" || typeof r == "string") return r;
51
+ if (Array.isArray(r))
52
+ return r.map((o) => String(X(o))).join(" ").trim();
53
+ if (!n.isValidElement(r)) return "";
54
+ const t = r.props.sortValue;
70
55
  if (typeof t == "string" || typeof t == "number" || t instanceof Date)
71
56
  return t;
72
- const a = X(e.props.children);
57
+ const a = X(r.props.children);
73
58
  if (String(a).trim()) return a;
74
- for (const n of [
59
+ for (const o of [
75
60
  "value",
76
61
  "label",
77
62
  "status",
@@ -79,17 +64,17 @@ function X(e) {
79
64
  "title",
80
65
  "health"
81
66
  ]) {
82
- const s = e.props[n];
67
+ const s = r.props[o];
83
68
  if (typeof s == "string" || typeof s == "number") return s;
84
69
  }
85
70
  return "";
86
71
  }
87
- function oe(e) {
88
- if (e instanceof Date)
89
- return { kind: "number", value: e.getTime() };
90
- if (typeof e == "number")
91
- return { kind: "number", value: e };
92
- const t = e.trim();
72
+ function oe(r) {
73
+ if (r instanceof Date)
74
+ return { kind: "number", value: r.getTime() };
75
+ if (typeof r == "number")
76
+ return { kind: "number", value: r };
77
+ const t = r.trim();
93
78
  if (!t || t === "—" || t === "-")
94
79
  return { kind: "empty", value: "" };
95
80
  const a = t.replace(/[,\s]/g, "").replace(/^[₹$€£]/, "").replace(/%$/, "");
@@ -98,267 +83,270 @@ function oe(e) {
98
83
  const s = /^\d{4}[-/]\d{1,2}[-/]\d{1,2}/.test(t) || /\b(?:Jan|Feb|Mar|Apr|May|Jun|Jul|Aug|Sep|Oct|Nov|Dec)\b/i.test(t) ? Date.parse(t) : Number.NaN;
99
84
  return Number.isNaN(s) ? { kind: "text", value: t } : { kind: "number", value: s };
100
85
  }
101
- function Ce(e, t, a) {
102
- const n = oe(e), s = oe(t);
103
- if (n.kind === "empty") return s.kind === "empty" ? 0 : 1;
86
+ function Ce(r, t, a) {
87
+ const o = oe(r), s = oe(t);
88
+ if (o.kind === "empty") return s.kind === "empty" ? 0 : 1;
104
89
  if (s.kind === "empty") return -1;
105
- const i = n.kind === "number" && s.kind === "number" ? n.value - s.value : xe.compare(String(n.value), String(s.value));
106
- return a === "ascending" ? i : -i;
90
+ const c = o.kind === "number" && s.kind === "number" ? o.value - s.value : xe.compare(String(o.value), String(s.value));
91
+ return a === "ascending" ? c : -c;
107
92
  }
108
- const ce = o.createContext(null), j = () => o.useContext(ce), Q = o.createContext("body");
109
- function Ne(e) {
110
- const t = [], n = V(e.props.children).map((s, i) => {
111
- if (!o.isValidElement(s) || s.type !== Y)
93
+ const de = n.createContext(null), B = () => n.useContext(de), Y = n.createContext("body");
94
+ function Ne(r) {
95
+ const t = [], o = V(r.props.children).map((s, c) => {
96
+ if (!n.isValidElement(s) || s.type !== Z)
112
97
  return s;
113
- let l = 0;
114
- const w = V(s.props.children).map((r) => {
115
- if (!o.isValidElement(r)) return r;
116
- for (; (t[l] ?? 0) > i; )
117
- l += 1;
118
- const E = Math.max(1, Number(r.props.colSpan ?? 1)), x = Math.max(1, Number(r.props.rowSpan ?? 1)), v = l;
119
- for (let C = 0; C < E; C += 1)
120
- t[v + C] = Math.max(
121
- t[v + C] ?? 0,
122
- i + x
98
+ let u = 0;
99
+ const f = V(s.props.children).map((e) => {
100
+ if (!n.isValidElement(e)) return e;
101
+ for (; (t[u] ?? 0) > c; )
102
+ u += 1;
103
+ const N = Math.max(1, Number(e.props.colSpan ?? 1)), x = Math.max(1, Number(e.props.rowSpan ?? 1)), y = u;
104
+ for (let g = 0; g < N; g += 1)
105
+ t[y + g] = Math.max(
106
+ t[y + g] ?? 0,
107
+ c + x
123
108
  );
124
- return l += E, r.type !== fe ? r : o.cloneElement(r, { _sortColumnIndex: v });
109
+ return u += N, e.type !== be ? e : n.cloneElement(e, { _sortColumnIndex: y });
125
110
  });
126
- return o.cloneElement(s, void 0, w);
111
+ return n.cloneElement(s, void 0, f);
127
112
  });
128
- return o.cloneElement(e, void 0, n);
113
+ return n.cloneElement(r, void 0, o);
129
114
  }
130
- function ze(e, t, a) {
131
- const n = V(e.props.children).map((s, i) => {
132
- if (!o.isValidElement(s) || s.type !== Y)
133
- return { row: s, index: i, value: "" };
134
- const l = V(s.props.children);
115
+ function ke(r, t, a) {
116
+ const o = V(r.props.children).map((s, c) => {
117
+ if (!n.isValidElement(s) || s.type !== Z)
118
+ return { row: s, index: c, value: "" };
119
+ const u = V(s.props.children);
135
120
  return {
136
121
  row: s,
137
- index: i,
138
- value: X(l[t])
122
+ index: c,
123
+ value: X(u[t])
139
124
  };
140
125
  });
141
- return n.sort((s, i) => Ce(s.value, i.value, a) || s.index - i.index), o.cloneElement(
142
- e,
126
+ return o.sort((s, c) => Ce(s.value, c.value, a) || s.index - c.index), n.cloneElement(
127
+ r,
143
128
  void 0,
144
- n.map(({ row: s }) => s)
129
+ o.map(({ row: s }) => s)
145
130
  );
146
131
  }
147
- function ue(e, t) {
148
- const a = t != null && t.column.startsWith(K) ? Number(t.column.slice(K.length)) : Number.NaN;
149
- return o.Children.map(e, (n) => o.isValidElement(n) ? n.type === o.Fragment ? o.cloneElement(
150
- n,
132
+ function me(r, t) {
133
+ const a = t != null && t.column.startsWith(G) ? Number(t.column.slice(G.length)) : Number.NaN;
134
+ return n.Children.map(r, (o) => n.isValidElement(o) ? o.type === n.Fragment ? n.cloneElement(
135
+ o,
151
136
  void 0,
152
- ue(n.props.children, t)
153
- ) : n.type === de ? Ne(n) : n.type === pe && t && Number.isInteger(a) && a >= 0 ? ze(n, a, t.direction) : n : n);
137
+ me(o.props.children, t)
138
+ ) : o.type === pe ? Ne(o) : o.type === fe && t && Number.isInteger(a) && a >= 0 ? ke(o, a, t.direction) : o : o);
154
139
  }
155
- const Se = o.forwardRef(
140
+ const ze = n.forwardRef(
156
141
  ({
157
- className: e,
142
+ className: r,
158
143
  wrapperClassName: t,
159
- footer: a,
160
- children: n,
161
- selectionMode: s = "none",
162
- selectedKeys: i,
163
- onSelectionChange: l,
164
- rowKeys: h,
165
- elevatedActionColumn: w = !1,
166
- actionColumnWidth: r = "4rem",
167
- sortDescriptor: E,
168
- onSortChange: x,
169
- allowsSorting: v = !0,
170
- isStatic: C = !1,
171
- resizableColumns: A = !0,
172
- maxBodyHeight: z,
173
- ...W
144
+ toolbar: a,
145
+ footer: o,
146
+ children: s,
147
+ selectionMode: c = "none",
148
+ selectedKeys: u,
149
+ onSelectionChange: h,
150
+ rowKeys: f,
151
+ elevatedActionColumn: e = !1,
152
+ actionColumnWidth: N = "3rem",
153
+ sortDescriptor: x,
154
+ onSortChange: y,
155
+ allowsSorting: g = !0,
156
+ isStatic: A = !1,
157
+ resizableColumns: E = !0,
158
+ maxBodyHeight: k,
159
+ ..._
174
160
  }, O) => {
175
- const N = o.useMemo(() => h ?? [], [h]), y = i === "all", b = y ? null : i ?? /* @__PURE__ */ new Set(), k = o.useCallback(
176
- (c) => y || !!(b != null && b.has(c)),
177
- [y, b]
178
- ), R = N.length > 0 && (y || N.every((c) => b == null ? void 0 : b.has(c))), $ = !R && (y || N.some((c) => b == null ? void 0 : b.has(c))), M = o.useCallback(
179
- (c) => {
180
- if (!l) return;
181
- if (s === "single") {
182
- l(k(c) ? /* @__PURE__ */ new Set() : /* @__PURE__ */ new Set([c]));
161
+ const C = n.useMemo(() => f ?? [], [f]), z = u === "all", v = z ? null : u ?? /* @__PURE__ */ new Set(), D = n.useCallback(
162
+ (i) => z || !!(v != null && v.has(i)),
163
+ [z, v]
164
+ ), R = C.length > 0 && (z || C.every((i) => v == null ? void 0 : v.has(i))), W = !R && (z || C.some((i) => v == null ? void 0 : v.has(i))), $ = n.useCallback(
165
+ (i) => {
166
+ if (!h) return;
167
+ if (c === "single") {
168
+ h(D(i) ? /* @__PURE__ */ new Set() : /* @__PURE__ */ new Set([i]));
183
169
  return;
184
170
  }
185
- const m = new Set(y ? N : b ?? /* @__PURE__ */ new Set());
186
- m.has(c) ? m.delete(c) : m.add(c), l(m);
171
+ const b = new Set(z ? C : v ?? /* @__PURE__ */ new Set());
172
+ b.has(i) ? b.delete(i) : b.add(i), h(b);
187
173
  },
188
- [l, s, k, y, N, b]
189
- ), H = o.useCallback(() => {
190
- l && l(R ? /* @__PURE__ */ new Set() : new Set(N));
191
- }, [l, R, N]), [U, q] = o.useState(), S = v && !x, d = S ? U ?? E : E, f = o.useCallback(
192
- (c) => {
193
- if (!v) return;
194
- const m = (d == null ? void 0 : d.column) === c && d.direction === "ascending" ? "descending" : "ascending", g = { column: c, direction: m };
195
- x ? x(g) : q(g);
174
+ [h, c, D, z, C, v]
175
+ ), I = n.useCallback(() => {
176
+ h && h(R ? /* @__PURE__ */ new Set() : new Set(C));
177
+ }, [h, R, C]), [H, U] = n.useState(), p = g && !y, l = p ? H ?? x : x, S = n.useCallback(
178
+ (i) => {
179
+ if (!g) return;
180
+ const b = (l == null ? void 0 : l.column) === i && l.direction === "ascending" ? "descending" : "ascending", w = { column: i, direction: b };
181
+ y ? y(w) : U(w);
196
182
  },
197
- [d, v, x]
198
- ), _ = o.useMemo(
199
- () => S ? ue(n, d) : n,
200
- [d, S, n]
201
- ), D = o.useRef(null), [I, me] = o.useState({
183
+ [l, g, y]
184
+ ), j = n.useMemo(
185
+ () => p ? me(s, l) : s,
186
+ [l, p, s]
187
+ ), M = n.useRef(null), [F, he] = n.useState({
202
188
  left: !1,
203
189
  right: !1
204
- }), F = o.useCallback(() => {
205
- const c = D.current;
206
- if (!c) return;
207
- const m = c.scrollWidth - c.clientWidth, g = c.scrollLeft > 1, L = c.scrollLeft < m - 1;
208
- me(
209
- (J) => J.left === g && J.right === L ? J : { left: g, right: L }
190
+ }), q = n.useCallback(() => {
191
+ const i = M.current;
192
+ if (!i) return;
193
+ const b = i.scrollWidth - i.clientWidth, w = i.scrollLeft > 1, L = i.scrollLeft < b - 1;
194
+ he(
195
+ (K) => K.left === w && K.right === L ? K : { left: w, right: L }
210
196
  );
211
197
  }, []);
212
- o.useEffect(() => {
213
- F();
214
- const c = D.current;
215
- if (!c || typeof ResizeObserver > "u") return;
216
- const m = new ResizeObserver(F);
217
- m.observe(c);
218
- const g = c.querySelector("table");
219
- return g && m.observe(g), () => m.disconnect();
220
- }, [F]);
221
- const [P, B] = o.useState(
198
+ n.useEffect(() => {
199
+ q();
200
+ const i = M.current;
201
+ if (!i || typeof ResizeObserver > "u") return;
202
+ const b = new ResizeObserver(q);
203
+ b.observe(i);
204
+ const w = i.querySelector("table");
205
+ return w && b.observe(w), () => b.disconnect();
206
+ }, [q]);
207
+ const [P, J] = n.useState(
222
208
  null
223
- ), Z = o.useCallback(
224
- (c) => {
225
- B(
226
- (m) => m ?? Array.from(
227
- c.cells,
228
- (g) => g.getBoundingClientRect().width
209
+ ), ee = n.useCallback(
210
+ (i) => {
211
+ J(
212
+ (b) => b ?? Array.from(
213
+ i.cells,
214
+ (w) => w.getBoundingClientRect().width
229
215
  )
230
216
  );
231
217
  },
232
218
  []
233
- ), ee = o.useCallback(
234
- (c, m) => {
235
- B((g) => {
236
- if (!g) return g;
237
- const L = [...g];
238
- return L[c] = Math.max(G, m), L;
239
- });
240
- },
241
- []
242
- ), te = o.useCallback(
243
- () => B(null),
219
+ ), te = n.useCallback((i, b) => {
220
+ J((w) => {
221
+ if (!w) return w;
222
+ const L = [...w];
223
+ return L[i] = Math.max(Q, b), L;
224
+ });
225
+ }, []), re = n.useCallback(
226
+ () => J(null),
244
227
  []
245
- ), be = o.useMemo(
228
+ ), ge = n.useMemo(
246
229
  () => ({
247
- selectionMode: s,
248
- isSelected: k,
249
- toggleKey: M,
250
- toggleAll: H,
230
+ selectionMode: c,
231
+ isSelected: D,
232
+ toggleKey: $,
233
+ toggleAll: I,
251
234
  allSelected: R,
252
- someSelected: $,
253
- isStatic: C,
254
- sortDescriptor: d,
255
- requestSort: v ? f : void 0,
256
- automaticSorting: S,
257
- elevatedActionColumn: w,
258
- resizableColumns: A,
235
+ someSelected: W,
236
+ isStatic: A,
237
+ sortDescriptor: l,
238
+ requestSort: g ? S : void 0,
239
+ automaticSorting: p,
240
+ elevatedActionColumn: e,
241
+ resizableColumns: E,
259
242
  columnWidths: P,
260
- snapshotColumnWidths: Z,
261
- setColumnWidth: ee,
262
- resetColumnWidths: te,
263
- stickyHeader: z != null
243
+ snapshotColumnWidths: ee,
244
+ setColumnWidth: te,
245
+ resetColumnWidths: re,
246
+ stickyHeader: k != null
264
247
  }),
265
248
  [
266
- s,
267
- k,
268
- M,
269
- H,
270
- R,
249
+ c,
250
+ D,
271
251
  $,
272
- C,
273
- d,
274
- v,
275
- S,
276
- f,
277
- w,
252
+ I,
253
+ R,
254
+ W,
278
255
  A,
256
+ l,
257
+ g,
258
+ p,
259
+ S,
260
+ e,
261
+ E,
279
262
  P,
280
- Z,
281
263
  ee,
282
264
  te,
283
- z
265
+ re,
266
+ k
284
267
  ]
285
268
  );
286
- return /* @__PURE__ */ p(ce.Provider, { value: be, children: /* @__PURE__ */ T(
269
+ return /* @__PURE__ */ d(de.Provider, { value: ge, children: /* @__PURE__ */ T(
287
270
  "div",
288
271
  {
289
- "data-scroll-left": I.left ? "true" : "false",
290
- "data-scroll-right": I.right ? "true" : "false",
291
- className: u(
292
- "group/table-shell overflow-clip rounded-2xl bg-table-shell px-1 pb-1",
293
- // Concentric inner radius for the white body card: shell radius
294
- // minus the 4px inset above. Every card corner (cells, viewport,
295
- // pinned caps) derives from this one value.
296
- "[--table-card-radius:calc(var(--radius-2xl)-0.25rem)]",
272
+ "data-slot": "table-container",
273
+ "data-scroll-left": F.left ? "true" : "false",
274
+ "data-scroll-right": F.right ? "true" : "false",
275
+ className: m(
276
+ "group/table-shell overflow-clip rounded-m border border-table-stroke bg-table-shell",
277
+ "[--table-card-radius:var(--radius-m)]",
297
278
  t
298
279
  ),
299
280
  children: [
281
+ a && /* @__PURE__ */ d(
282
+ "div",
283
+ {
284
+ "data-slot": "table-toolbar",
285
+ className: "flex min-h-12 items-center justify-end border-b border-table-stroke px-4 py-2",
286
+ children: a
287
+ }
288
+ ),
300
289
  /* @__PURE__ */ T(
301
290
  "div",
302
291
  {
303
292
  className: "relative",
304
- style: w ? {
305
- "--table-action-column-width": r
293
+ style: e ? {
294
+ "--table-action-column-width": N
306
295
  } : void 0,
307
296
  children: [
308
- /* @__PURE__ */ p(
297
+ /* @__PURE__ */ d(
309
298
  "div",
310
299
  {
311
- ref: D,
312
- onScroll: F,
313
- className: u(
300
+ ref: M,
301
+ onScroll: q,
302
+ className: m(
314
303
  "overflow-x-auto rounded-(--table-card-radius)",
315
- z != null && "overflow-y-auto"
304
+ k != null && "overflow-y-auto"
316
305
  ),
317
- style: z != null ? { maxHeight: z } : void 0,
306
+ style: k != null ? { maxHeight: k } : void 0,
318
307
  children: /* @__PURE__ */ T(
319
308
  "table",
320
309
  {
321
310
  ref: O,
322
311
  "data-slot": "table",
323
- className: u(
324
- "w-full border-separate border-spacing-0 text-base",
312
+ className: m(
313
+ "w-full border-separate border-spacing-0 text-m font-normal",
325
314
  // Manual widths need fixed layout so the <colgroup> wins;
326
315
  // until the first resize the automatic layout is untouched.
327
316
  P && "table-fixed",
328
- e
317
+ r
329
318
  ),
330
- ...W,
319
+ ..._,
331
320
  children: [
332
- P && /* @__PURE__ */ p("colgroup", { children: P.map((c, m) => /* @__PURE__ */ p("col", { style: { width: c } }, m)) }),
333
- _
321
+ P && /* @__PURE__ */ d("colgroup", { children: P.map((i, b) => /* @__PURE__ */ d("col", { style: { width: i } }, b)) }),
322
+ j
334
323
  ]
335
324
  }
336
325
  )
337
326
  }
338
327
  ),
339
- /* @__PURE__ */ p(
328
+ /* @__PURE__ */ d(
340
329
  "div",
341
330
  {
342
331
  "aria-hidden": "true",
343
332
  "data-slot": "table-scroll-hint",
344
- className: u(
333
+ className: m(
345
334
  "pointer-events-none absolute inset-y-0 z-20 w-10",
346
335
  "bg-gradient-to-l from-(--table-scroll-hint) to-transparent",
347
336
  "opacity-0 transition-opacity duration-150 ease-out motion-reduce:transition-none",
348
- I.right && "opacity-100",
349
- w ? "right-[var(--table-action-column-width)]" : "right-0"
337
+ F.right && "opacity-100",
338
+ e ? "right-[var(--table-action-column-width)]" : "right-0"
350
339
  )
351
340
  }
352
341
  ),
353
- w && /* @__PURE__ */ p(
342
+ e && /* @__PURE__ */ d(
354
343
  "div",
355
344
  {
356
345
  "aria-hidden": "true",
357
346
  "data-slot": "table-action-column-elevation",
358
- className: u(
347
+ className: m(
359
348
  "pointer-events-none absolute inset-y-0 right-0 z-20",
360
- "w-[var(--table-action-column-width)]",
361
- "rounded-br-(--table-card-radius)"
349
+ "w-[var(--table-action-column-width)]"
362
350
  // No shadow of its own: while columns hide behind the pinned
363
351
  // surface the scroll-hint gradient is already washing the
364
352
  // seam — stacking a cast on top of it read harsh. The hint
@@ -369,88 +357,97 @@ const Se = o.forwardRef(
369
357
  ]
370
358
  }
371
359
  ),
372
- a && /* @__PURE__ */ p("div", { className: "flex items-center px-4 py-2.5", children: a })
360
+ o && /* @__PURE__ */ d("div", { className: "flex items-center border-t border-table-stroke px-4 py-2.5", children: o })
373
361
  ]
374
362
  }
375
363
  ) });
376
364
  }
377
365
  );
378
- Se.displayName = "Table";
379
- const de = o.forwardRef(({ className: e, ...t }, a) => {
380
- const n = j();
381
- return /* @__PURE__ */ p(Q.Provider, { value: "header", children: /* @__PURE__ */ p(
366
+ ze.displayName = "Table";
367
+ const pe = n.forwardRef(({ className: r, ...t }, a) => {
368
+ const o = B();
369
+ return /* @__PURE__ */ d(Y.Provider, { value: "header", children: /* @__PURE__ */ d(
382
370
  "thead",
383
371
  {
384
372
  ref: a,
385
- className: u(
386
- "text-xs text-muted-foreground",
387
- (n == null ? void 0 : n.elevatedActionColumn) && "relative z-30 bg-table-shell",
388
- e
373
+ className: m(
374
+ "text-s font-medium uppercase text-table-header-foreground",
375
+ (o == null ? void 0 : o.elevatedActionColumn) && "relative z-30 bg-wg1",
376
+ r
389
377
  ),
390
378
  ...t
391
379
  }
392
380
  ) });
393
381
  });
394
- de.displayName = "TableHeader";
395
- const pe = o.forwardRef(({ className: e, ...t }, a) => /* @__PURE__ */ p(Q.Provider, { value: "body", children: /* @__PURE__ */ p("tbody", { ref: a, className: u(e), ...t }) }));
396
- pe.displayName = "TableBody";
397
- const Y = o.forwardRef(
398
- ({ className: e, rowKey: t, children: a, ...n }, s) => {
399
- const i = j(), l = o.useContext(Q), h = !!i && i.selectionMode !== "none", w = h && l === "body" && t !== void 0 ? i.isSelected(t) : !1;
400
- return /* @__PURE__ */ T(
382
+ pe.displayName = "TableHeader";
383
+ const fe = n.forwardRef(({ className: r, ...t }, a) => /* @__PURE__ */ d(Y.Provider, { value: "body", children: /* @__PURE__ */ d("tbody", { ref: a, className: m(r), ...t }) }));
384
+ fe.displayName = "TableBody";
385
+ const Z = n.forwardRef(
386
+ ({
387
+ className: r,
388
+ rowKey: t,
389
+ children: a,
390
+ isInteractive: o = !1,
391
+ onClick: s,
392
+ role: c,
393
+ ...u
394
+ }, h) => {
395
+ const f = B(), e = n.useContext(Y), N = !!f && f.selectionMode !== "none", x = e === "body" && !(f != null && f.isStatic) && (o || N || typeof s == "function" || c === "button" || u["aria-expanded"] !== void 0), y = N && e === "body" && t !== void 0 ? f.isSelected(t) : !1;
396
+ return /* @__PURE__ */ d(ie.Provider, { value: x, children: /* @__PURE__ */ T(
401
397
  "tr",
402
398
  {
403
- ref: s,
404
- "data-selected": w || void 0,
405
- className: u("group/row", e),
406
- ...n,
399
+ ref: h,
400
+ "data-interactive": x || void 0,
401
+ "data-selected": y || void 0,
402
+ className: m("group/row", e === "body" && "h-12", r),
403
+ onClick: s,
404
+ role: c,
405
+ ...u,
407
406
  children: [
408
- h && (l === "header" ? /* @__PURE__ */ T(
407
+ N && (e === "header" ? /* @__PURE__ */ T(
409
408
  "th",
410
409
  {
411
410
  scope: "col",
412
- className: u(
413
- "w-10 px-4 py-2.5",
414
- ie,
411
+ className: m(
412
+ "w-10 border-b border-table-stroke px-4 py-2.5",
413
+ ue,
415
414
  // Sticky without the baked shadow — an always-on smudge
416
415
  // muddies the shell's corners (elevation = actionability).
417
416
  // (sticky is positioned, so the ::after tick anchors to it —
418
417
  // no `relative` needed, and it would conflict with sticky.)
419
- "sticky left-0 z-10 bg-table-shell"
418
+ "sticky left-0 z-10",
419
+ ce
420
420
  ),
421
421
  children: [
422
- /* @__PURE__ */ p("span", { className: "sr-only", children: "Row selection" }),
423
- i.selectionMode === "multiple" && /* @__PURE__ */ p(
424
- re,
422
+ /* @__PURE__ */ d("span", { className: "sr-only", children: "Row selection" }),
423
+ f.selectionMode === "multiple" && /* @__PURE__ */ d(
424
+ ne,
425
425
  {
426
426
  size: "sm",
427
427
  "aria-label": "Select all rows",
428
- checked: i.allSelected,
429
- indeterminate: i.someSelected,
430
- onChange: i.toggleAll
428
+ checked: f.allSelected,
429
+ indeterminate: f.someSelected,
430
+ onChange: f.toggleAll
431
431
  }
432
432
  )
433
433
  ]
434
434
  }
435
- ) : /* @__PURE__ */ p(
435
+ ) : /* @__PURE__ */ d(
436
436
  "td",
437
437
  {
438
- className: u(
439
- "w-10 px-4 py-3",
440
- le(i.isStatic),
441
- ve,
442
- "sticky left-0 z-10",
443
- // Same white-behind-white corner problem as pinned data cells.
444
- se("left")
438
+ className: m(
439
+ "h-12 w-10 px-4 py-2",
440
+ le(x),
441
+ "sticky left-0 z-10"
445
442
  ),
446
- onClick: (r) => r.stopPropagation(),
447
- children: t !== void 0 && /* @__PURE__ */ p(
448
- re,
443
+ onClick: (g) => g.stopPropagation(),
444
+ children: t !== void 0 && /* @__PURE__ */ d(
445
+ ne,
449
446
  {
450
447
  size: "sm",
451
448
  "aria-label": `Select ${t}`,
452
- checked: w,
453
- onChange: () => i.toggleKey(t)
449
+ checked: y,
450
+ onChange: () => f.toggleKey(t)
454
451
  }
455
452
  )
456
453
  }
@@ -458,176 +455,194 @@ const Y = o.forwardRef(
458
455
  a
459
456
  ]
460
457
  }
461
- );
458
+ ) });
462
459
  }
463
460
  );
464
- Y.displayName = "TableRow";
465
- const fe = o.forwardRef(({ className: e, align: t, sticky: a, sortKey: n, allowsSorting: s = !0, _sortColumnIndex: i, children: l, ...h }, w) => {
466
- var U, q, S;
467
- const r = j(), x = (r != null && r.automaticSorting && i !== void 0 ? `${K}${i}` : void 0) ?? n, v = Number(h.colSpan ?? 1) === 1, C = String(X(l)).trim(), A = C.length > 0, z = s && v && a !== "right" && A && !!x && !!(r != null && r.requestSort), W = z && ((U = r == null ? void 0 : r.sortDescriptor) == null ? void 0 : U.column) === x, O = (q = r == null ? void 0 : r.sortDescriptor) == null ? void 0 : q.direction, N = !!(r != null && r.resizableColumns) && v && a !== "right", y = o.useRef(null), [b, k] = o.useState(!1), R = (d) => {
468
- if (d.button !== 0 || !r) return;
469
- const f = d.currentTarget.parentElement, _ = f == null ? void 0 : f.parentElement;
470
- if (!(!f || !_)) {
471
- r.snapshotColumnWidths(_), y.current = {
472
- index: f.cellIndex,
473
- startX: d.clientX,
474
- startWidth: f.getBoundingClientRect().width
475
- }, k(!0);
476
- try {
477
- d.currentTarget.setPointerCapture(d.pointerId);
478
- } catch {
461
+ Z.displayName = "TableRow";
462
+ const be = n.forwardRef(
463
+ ({
464
+ className: r,
465
+ align: t,
466
+ sticky: a,
467
+ sortKey: o,
468
+ allowsSorting: s = !0,
469
+ _sortColumnIndex: c,
470
+ children: u,
471
+ ...h
472
+ }, f) => {
473
+ var I, H, U;
474
+ const e = B(), x = (e != null && e.automaticSorting && c !== void 0 ? `${G}${c}` : void 0) ?? o, y = Number(h.colSpan ?? 1) === 1, g = String(X(u)).trim(), A = g.length > 0, E = s && y && a !== "right" && A && !!x && !!(e != null && e.requestSort), k = E && ((I = e == null ? void 0 : e.sortDescriptor) == null ? void 0 : I.column) === x, _ = (H = e == null ? void 0 : e.sortDescriptor) == null ? void 0 : H.direction, O = !!(e != null && e.resizableColumns) && y && a !== "right", C = n.useRef(null), [z, v] = n.useState(!1), D = (p) => {
475
+ if (p.button !== 0 || !e) return;
476
+ const l = p.currentTarget.parentElement, S = l == null ? void 0 : l.parentElement;
477
+ if (!(!l || !S)) {
478
+ e.snapshotColumnWidths(S), C.current = {
479
+ index: l.cellIndex,
480
+ startX: p.clientX,
481
+ startWidth: l.getBoundingClientRect().width
482
+ }, v(!0);
483
+ try {
484
+ p.currentTarget.setPointerCapture(p.pointerId);
485
+ } catch {
486
+ }
487
+ p.preventDefault();
488
+ }
489
+ }, R = (p) => {
490
+ const l = C.current;
491
+ !l || !e || e.setColumnWidth(
492
+ l.index,
493
+ l.startWidth + (p.clientX - l.startX)
494
+ );
495
+ }, W = () => {
496
+ C.current = null, v(!1);
497
+ }, $ = (p) => {
498
+ if (p.key !== "ArrowLeft" && p.key !== "ArrowRight" || !e) return;
499
+ p.preventDefault();
500
+ const l = p.currentTarget.parentElement, S = l == null ? void 0 : l.parentElement;
501
+ if (!l || !S) return;
502
+ e.snapshotColumnWidths(S);
503
+ const j = p.shiftKey ? 32 : 8, M = p.key === "ArrowRight" ? j : -j;
504
+ e.setColumnWidth(
505
+ l.cellIndex,
506
+ l.getBoundingClientRect().width + M
507
+ );
508
+ };
509
+ return /* @__PURE__ */ T(
510
+ "th",
511
+ {
512
+ ref: f,
513
+ scope: "col",
514
+ "aria-sort": k ? _ === "ascending" ? "ascending" : "descending" : E ? "none" : void 0,
515
+ className: m(
516
+ // whitespace-nowrap: header labels hug their content — the table
517
+ // scrolls horizontally, so wrapping "Null %" to two lines only
518
+ // wastes header height without saving any width.
519
+ "relative whitespace-nowrap border-b border-table-stroke px-4 py-2.5 font-medium uppercase",
520
+ ce,
521
+ ue,
522
+ // The resize handle carries its own tick visual, so drop the
523
+ // decorative one; the last column never shows a handle.
524
+ O && "after:hidden [&:last-child>[data-slot=resize-handle]]:hidden",
525
+ // Capped-height tables scroll under the header: pin it to the
526
+ // viewport top, painted WG1 so rows pass beneath.
527
+ (e == null ? void 0 : e.stickyHeader) && "sticky top-0 z-30",
528
+ se(t),
529
+ a && (a === "right" && (e != null && e.elevatedActionColumn) ? m(
530
+ // Preserve the semantic column width, but do not pin or paint
531
+ // a blank header cell over the labels behind it. Only body
532
+ // action cells participate in the sticky elevated surface.
533
+ "w-[var(--table-action-column-width)]",
534
+ "min-w-[var(--table-action-column-width)]",
535
+ "max-w-[var(--table-action-column-width)]",
536
+ "px-2",
537
+ "bg-transparent"
538
+ ) : ae(a)),
539
+ r
540
+ ),
541
+ ...h,
542
+ children: [
543
+ E ? /* @__PURE__ */ T(
544
+ "button",
545
+ {
546
+ type: "button",
547
+ onClick: () => e.requestSort(x),
548
+ className: m(
549
+ "group/sort -mx-1 inline-flex items-center gap-1 rounded px-1 uppercase outline-none transition-colors",
550
+ "hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring",
551
+ t === "right" && "flex-row-reverse",
552
+ k && "font-medium"
553
+ ),
554
+ children: [
555
+ u,
556
+ k ? _ === "ascending" ? /* @__PURE__ */ d(ve, { className: "size-3.5" }) : /* @__PURE__ */ d(ye, { className: "size-3.5" }) : /* @__PURE__ */ d(we, { className: "size-3.5 opacity-0 transition-opacity group-hover/sort:opacity-60" })
557
+ ]
558
+ }
559
+ ) : A ? u : /* @__PURE__ */ d("span", { className: "sr-only", children: h["aria-label"] ?? "Table column" }),
560
+ O && /* @__PURE__ */ d(
561
+ "span",
562
+ {
563
+ "data-slot": "resize-handle",
564
+ role: "separator",
565
+ "aria-orientation": "vertical",
566
+ "aria-label": `Resize ${g || "this"} column`,
567
+ "aria-valuemin": Q,
568
+ "aria-valuemax": 2e3,
569
+ "aria-valuenow": ((U = e == null ? void 0 : e.columnWidths) == null ? void 0 : U[c ?? -1]) ?? Q,
570
+ tabIndex: 0,
571
+ "data-resizing": z ? "true" : void 0,
572
+ onPointerDown: D,
573
+ onPointerMove: R,
574
+ onPointerUp: W,
575
+ onPointerCancel: W,
576
+ onKeyDown: $,
577
+ onDoubleClick: () => e == null ? void 0 : e.resetColumnWidths(),
578
+ className: m(
579
+ // 12px hit area straddling the column edge; the 1px tick inside
580
+ // is the visible affordance (it replaces the decorative one).
581
+ "group/resize absolute -right-1.5 top-0 z-10 flex h-full w-3 cursor-col-resize touch-none select-none items-center justify-center rounded-sm outline-none",
582
+ "focus-visible:ring-2 focus-visible:ring-ring"
583
+ ),
584
+ children: /* @__PURE__ */ d(
585
+ "span",
586
+ {
587
+ "aria-hidden": "true",
588
+ className: m(
589
+ "h-4 w-px rounded-sm bg-border-strong",
590
+ "transition-[transform,background-color] duration-150 ease-out motion-reduce:transition-none",
591
+ "group-hover/resize:scale-y-125 group-hover/resize:bg-foreground/60",
592
+ "group-focus-visible/resize:scale-y-125 group-focus-visible/resize:bg-foreground/60",
593
+ "group-data-[resizing]/resize:scale-y-125 group-data-[resizing]/resize:bg-foreground/60"
594
+ )
595
+ }
596
+ )
597
+ }
598
+ )
599
+ ]
479
600
  }
480
- d.preventDefault();
481
- }
482
- }, $ = (d) => {
483
- const f = y.current;
484
- !f || !r || r.setColumnWidth(
485
- f.index,
486
- f.startWidth + (d.clientX - f.startX)
487
601
  );
488
- }, M = () => {
489
- y.current = null, k(!1);
490
- }, H = (d) => {
491
- if (d.key !== "ArrowLeft" && d.key !== "ArrowRight" || !r) return;
492
- d.preventDefault();
493
- const f = d.currentTarget.parentElement, _ = f == null ? void 0 : f.parentElement;
494
- if (!f || !_) return;
495
- r.snapshotColumnWidths(_);
496
- const D = d.shiftKey ? 32 : 8, I = d.key === "ArrowRight" ? D : -D;
497
- r.setColumnWidth(f.cellIndex, f.getBoundingClientRect().width + I);
498
- };
499
- return /* @__PURE__ */ T(
500
- "th",
501
- {
502
- ref: w,
503
- scope: "col",
504
- "aria-sort": W ? O === "ascending" ? "ascending" : "descending" : z ? "none" : void 0,
505
- className: u(
506
- // whitespace-nowrap: header labels hug their content — the table
507
- // scrolls horizontally, so wrapping "Null %" to two lines only
508
- // wastes header height without saving any width.
509
- "relative whitespace-nowrap px-4 py-2.5 font-normal",
510
- ie,
511
- // The resize handle carries its own tick visual, so drop the
512
- // decorative one; the last column never shows a handle.
513
- N && "after:hidden [&:last-child>[data-slot=resize-handle]]:hidden",
514
- // Capped-height tables scroll under the header: pin it to the
515
- // viewport top, painted on the shell gray so rows pass beneath.
516
- (r == null ? void 0 : r.stickyHeader) && "sticky top-0 z-30 bg-table-shell",
517
- ne(t),
518
- a && (a === "right" && (r != null && r.elevatedActionColumn) ? u(
519
- // Preserve the semantic column width, but do not pin or paint
520
- // a blank header cell over the labels behind it. Only body
521
- // action cells participate in the sticky elevated surface.
522
- "w-[var(--table-action-column-width)]",
523
- "min-w-[var(--table-action-column-width)]",
524
- "max-w-[var(--table-action-column-width)]",
525
- "bg-transparent"
526
- ) : u(ae(a), "bg-table-shell")),
527
- e
528
- ),
529
- ...h,
530
- children: [
531
- z ? /* @__PURE__ */ T(
532
- "button",
533
- {
534
- type: "button",
535
- onClick: () => r.requestSort(x),
536
- className: u(
537
- "group/sort -mx-1 inline-flex items-center gap-1 rounded px-1 outline-none transition-colors",
538
- "hover:text-foreground focus-visible:ring-2 focus-visible:ring-ring",
539
- t === "right" && "flex-row-reverse",
540
- W && "text-foreground"
541
- ),
542
- children: [
543
- l,
544
- W ? O === "ascending" ? /* @__PURE__ */ p(ge, { className: "size-3.5" }) : /* @__PURE__ */ p(he, { className: "size-3.5" }) : /* @__PURE__ */ p(we, { className: "size-3.5 opacity-0 transition-opacity group-hover/sort:opacity-60" })
545
- ]
546
- }
547
- ) : A ? l : /* @__PURE__ */ p("span", { className: "sr-only", children: h["aria-label"] ?? "Table column" }),
548
- N && /* @__PURE__ */ p(
549
- "span",
550
- {
551
- "data-slot": "resize-handle",
552
- role: "separator",
553
- "aria-orientation": "vertical",
554
- "aria-label": `Resize ${C || "this"} column`,
555
- "aria-valuemin": G,
556
- "aria-valuemax": 2e3,
557
- "aria-valuenow": ((S = r == null ? void 0 : r.columnWidths) == null ? void 0 : S[i ?? -1]) ?? G,
558
- tabIndex: 0,
559
- "data-resizing": b ? "true" : void 0,
560
- onPointerDown: R,
561
- onPointerMove: $,
562
- onPointerUp: M,
563
- onPointerCancel: M,
564
- onKeyDown: H,
565
- onDoubleClick: () => r == null ? void 0 : r.resetColumnWidths(),
566
- className: u(
567
- // 12px hit area straddling the column edge; the 1px tick inside
568
- // is the visible affordance (it replaces the decorative one).
569
- "group/resize absolute -right-1.5 top-0 z-10 flex h-full w-3 cursor-col-resize touch-none select-none items-center justify-center rounded-sm outline-none",
570
- "focus-visible:ring-2 focus-visible:ring-ring"
571
- ),
572
- children: /* @__PURE__ */ p(
573
- "span",
574
- {
575
- "aria-hidden": "true",
576
- className: u(
577
- "h-4 w-px rounded-sm bg-border-strong",
578
- "transition-[transform,background-color] duration-150 ease-out motion-reduce:transition-none",
579
- "group-hover/resize:scale-y-125 group-hover/resize:bg-foreground/60",
580
- "group-focus-visible/resize:scale-y-125 group-focus-visible/resize:bg-foreground/60",
581
- "group-data-[resizing]/resize:scale-y-125 group-data-[resizing]/resize:bg-foreground/60"
582
- )
583
- }
584
- )
585
- }
586
- )
587
- ]
588
- }
589
- );
590
- });
591
- fe.displayName = "TableColumn";
592
- const ke = o.forwardRef(
593
- ({ className: e, align: t, sticky: a, sortValue: n, ...s }, i) => {
594
- const l = j(), h = a === "right" && (l == null ? void 0 : l.elevatedActionColumn);
595
- return /* @__PURE__ */ p(
602
+ }
603
+ );
604
+ be.displayName = "TableColumn";
605
+ const Se = n.forwardRef(
606
+ ({ className: r, align: t, sticky: a, sortValue: o, ...s }, c) => {
607
+ const u = B(), h = n.useContext(ie), f = a === "right" && (u == null ? void 0 : u.elevatedActionColumn);
608
+ return /* @__PURE__ */ d(
596
609
  "td",
597
610
  {
598
- ref: i,
599
- "data-sort-value": n instanceof Date ? n.toISOString() : n,
600
- className: u(
611
+ ref: c,
612
+ "data-sort-value": o instanceof Date ? o.toISOString() : o,
613
+ className: m(
601
614
  // whitespace-nowrap: cell content never wraps — the table's
602
615
  // overflow-x-auto viewport scrolls horizontally instead, matching the
603
616
  // header cells. Opt back into wrapping with `whitespace-normal` for
604
617
  // deliberate multi-line content (e.g. an EmptyState in a colSpan cell).
605
- "whitespace-nowrap px-4 py-3",
606
- le((l == null ? void 0 : l.isStatic) ?? !1),
607
- ye,
608
- ne(t),
609
- a && ae(a, l == null ? void 0 : l.elevatedActionColumn),
610
- a && se(a),
611
- h && u(
618
+ // Cell values own the ADS 15px body-text contract instead of relying
619
+ // on inheritance from <Table>; nested content stays 15px by default.
620
+ "h-12 whitespace-nowrap px-4 py-2 text-m",
621
+ le(h),
622
+ se(t),
623
+ a && ae(a, u == null ? void 0 : u.elevatedActionColumn),
624
+ f && m(
612
625
  "w-[var(--table-action-column-width)]",
613
626
  "min-w-[var(--table-action-column-width)]",
614
627
  "max-w-[var(--table-action-column-width)]",
628
+ "px-2",
615
629
  "bg-elevated",
630
+ // Keep the action column on its elevated surface during hover.
616
631
  "group-hover/row:bg-elevated group-focus-within/row:bg-elevated"
617
632
  ),
618
- e
633
+ r
619
634
  ),
620
635
  ...s
621
636
  }
622
637
  );
623
638
  }
624
639
  );
625
- ke.displayName = "TableCell";
640
+ Se.displayName = "TableCell";
626
641
  export {
627
- Se as Table,
628
- pe as TableBody,
629
- ke as TableCell,
630
- fe as TableColumn,
631
- de as TableHeader,
632
- Y as TableRow
642
+ ze as Table,
643
+ fe as TableBody,
644
+ Se as TableCell,
645
+ be as TableColumn,
646
+ pe as TableHeader,
647
+ Z as TableRow
633
648
  };