@actioneer/ads 1.0.6 → 1.0.8

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 (74) hide show
  1. package/DESIGN.md +80 -86
  2. package/README.md +6 -0
  3. package/components/ai-elements/chart.js +20 -20
  4. package/components/ai-elements/inline-citation.js +50 -50
  5. package/components/ai-elements/message.js +1 -1
  6. package/components/ai-elements/tool.js +5 -5
  7. package/components/alert.d.ts +5 -4
  8. package/components/alert.js +91 -79
  9. package/components/answer.js +1 -1
  10. package/components/assistant-ui/action-bar.js +1 -1
  11. package/components/assistant-ui/attachment.js +68 -49
  12. package/components/assistant-ui/composer-add-context.js +1 -1
  13. package/components/assistant-ui/composer-trigger-popover.js +1 -1
  14. package/components/assistant-ui/composer.js +13 -13
  15. package/components/assistant-ui/message-timing.js +6 -6
  16. package/components/assistant-ui/selection-toolbar.js +5 -5
  17. package/components/assistant-ui/sources.js +15 -15
  18. package/components/assistant-ui/tooltip-icon-button.js +18 -14
  19. package/components/audio-waveform.d.ts +21 -8
  20. package/components/audio-waveform.js +371 -94
  21. package/components/autocomplete.js +9 -9
  22. package/components/breadcrumbs.js +32 -38
  23. package/components/button.js +83 -73
  24. package/components/card.js +1 -1
  25. package/components/chart.js +732 -673
  26. package/components/chip.js +37 -35
  27. package/components/command-palette.js +12 -12
  28. package/components/connector-card.d.ts +1 -2
  29. package/components/connector-card.js +17 -17
  30. package/components/date-range-picker.js +1 -2
  31. package/components/drawer.js +9 -10
  32. package/components/dropdown.js +1 -1
  33. package/components/empty-state.d.ts +2 -0
  34. package/components/empty-state.js +17 -15
  35. package/components/field.js +9 -10
  36. package/components/file-dropzone.d.ts +6 -3
  37. package/components/file-dropzone.js +72 -60
  38. package/components/infinite-canvas.js +9 -9
  39. package/components/modal.js +1 -1
  40. package/components/page-body.js +8 -8
  41. package/components/popover.js +11 -11
  42. package/components/progress-circle.d.ts +1 -1
  43. package/components/progress-circle.js +57 -48
  44. package/components/radio.d.ts +1 -1
  45. package/components/radio.js +53 -53
  46. package/components/segmented.d.ts +1 -0
  47. package/components/segmented.js +34 -36
  48. package/components/select.js +2 -2
  49. package/components/selection-action-bar.js +32 -31
  50. package/components/setting-row.js +10 -10
  51. package/components/sidebar.js +74 -73
  52. package/components/slider.js +5 -5
  53. package/components/stepper.d.ts +1 -1
  54. package/components/stepper.js +1 -1
  55. package/components/switch.js +10 -10
  56. package/components/table.d.ts +17 -5
  57. package/components/table.js +559 -405
  58. package/components/tabs.js +41 -35
  59. package/components/timeline.js +3 -3
  60. package/components/toast.js +53 -56
  61. package/components/ui/button.js +4 -4
  62. package/components/ui/dialog.js +1 -1
  63. package/components/viz-charts.js +263 -221
  64. package/examples/README.md +30 -0
  65. package/examples/agents-screen.tsx +477 -0
  66. package/examples/settings-screen.tsx +90 -0
  67. package/examples/workspace-header.tsx +71 -0
  68. package/lib/icons.d.ts +8 -0
  69. package/lib/icons.js +171 -118
  70. package/llms.txt +16 -16
  71. package/manifest.json +178 -54
  72. package/package.json +1 -1
  73. package/styles.css +60 -72
  74. package/theme.css +55 -63
@@ -1,13 +1,13 @@
1
1
  "use client";
2
2
  import { jsx as r, jsxs as c } from "react/jsx-runtime";
3
- import * as s from "react";
4
- import { MotionConfig as z, motion as j } from "motion/react";
5
- import { User as _, PanelLeft as E } from "../lib/icons.js";
3
+ import * as o from "react";
4
+ import { MotionConfig as _, motion as z } from "motion/react";
5
+ import { User as j, PanelLeft as E } from "../lib/icons.js";
6
6
  import { cn as n } from "../lib/cn.js";
7
7
  import { springSidebar as H } from "../lib/motion.js";
8
8
  import { Tooltip as I } from "./tooltip.js";
9
9
  import { Avatar as L } from "./avatar.js";
10
- const R = s.createContext({
10
+ const R = o.createContext({
11
11
  collapsed: !1,
12
12
  toggle: () => {
13
13
  },
@@ -15,44 +15,44 @@ const R = s.createContext({
15
15
  }
16
16
  });
17
17
  function M() {
18
- return s.useContext(R);
18
+ return o.useContext(R);
19
19
  }
20
- const K = s.forwardRef(
20
+ const K = o.forwardRef(
21
21
  ({
22
22
  className: t,
23
23
  collapsed: e,
24
24
  defaultCollapsed: a = !1,
25
25
  onCollapsedChange: i,
26
- animateOnMount: o = !1,
26
+ animateOnMount: s = !1,
27
27
  keyboardToggle: d = !0,
28
28
  ...l
29
29
  }, m) => {
30
- const [v, y] = s.useState(a), b = e !== void 0, u = b ? e : v, g = s.useCallback(
30
+ const [v, y] = o.useState(a), g = e !== void 0, u = g ? e : v, b = o.useCallback(
31
31
  (p) => {
32
- b || y(p), i == null || i(p);
32
+ g || y(p), i == null || i(p);
33
33
  },
34
- [b, i]
35
- ), h = s.useCallback(
36
- () => g(!u),
37
- [u, g]
34
+ [g, i]
35
+ ), h = o.useCallback(
36
+ () => b(!u),
37
+ [u, b]
38
38
  );
39
- s.useEffect(() => {
39
+ o.useEffect(() => {
40
40
  if (!d) return;
41
41
  const p = (f) => {
42
42
  (f.metaKey || f.ctrlKey) && f.key.toLowerCase() === "b" && (f.preventDefault(), h());
43
43
  };
44
44
  return document.addEventListener("keydown", p), () => document.removeEventListener("keydown", p);
45
45
  }, [d, h]);
46
- const x = s.useMemo(
47
- () => ({ collapsed: u, toggle: h, setCollapsed: g }),
48
- [u, h, g]
46
+ const x = o.useMemo(
47
+ () => ({ collapsed: u, toggle: h, setCollapsed: b }),
48
+ [u, h, b]
49
49
  );
50
- return /* @__PURE__ */ r(R.Provider, { value: x, children: /* @__PURE__ */ r(z, { reducedMotion: "user", children: /* @__PURE__ */ r(
51
- j.aside,
50
+ return /* @__PURE__ */ r(R.Provider, { value: x, children: /* @__PURE__ */ r(_, { reducedMotion: "user", children: /* @__PURE__ */ r(
51
+ z.aside,
52
52
  {
53
53
  ref: m,
54
54
  "data-collapsed": u ? "true" : "false",
55
- initial: o ? {
55
+ initial: s ? {
56
56
  width: u ? 56 : 240,
57
57
  transform: "translate3d(-100%, 0, 0)",
58
58
  opacity: 0
@@ -82,13 +82,13 @@ function k({
82
82
  tooltipSide: a = "right",
83
83
  ...i
84
84
  }) {
85
- const { collapsed: o, toggle: d } = M();
85
+ const { collapsed: s, toggle: d } = M();
86
86
  return /* @__PURE__ */ r(
87
87
  I,
88
88
  {
89
89
  side: a,
90
90
  content: /* @__PURE__ */ c("span", { className: "flex items-center gap-1.5", children: [
91
- o ? "Expand" : "Collapse",
91
+ s ? "Expand" : "Collapse",
92
92
  /* @__PURE__ */ c("span", { className: "flex items-center gap-0.5", children: [
93
93
  /* @__PURE__ */ r(S, { children: "⌘" }),
94
94
  /* @__PURE__ */ r(S, { children: "B" })
@@ -98,8 +98,8 @@ function k({
98
98
  "button",
99
99
  {
100
100
  type: "button",
101
- "aria-label": o ? "Expand sidebar" : "Collapse sidebar",
102
- "aria-pressed": o,
101
+ "aria-label": s ? "Expand sidebar" : "Collapse sidebar",
102
+ "aria-pressed": s,
103
103
  onClick: (l) => {
104
104
  e == null || e(l), d();
105
105
  },
@@ -122,7 +122,7 @@ function Y({
122
122
  href: e,
123
123
  label: a = "Home",
124
124
  showTrigger: i = !0,
125
- children: o,
125
+ children: s,
126
126
  className: d,
127
127
  ...l
128
128
  }) {
@@ -150,13 +150,13 @@ function Y({
150
150
  i && /* @__PURE__ */ r("div", { className: "hidden group-data-[collapsed=true]/sidebar:group-hover/sidebar:flex group-data-[collapsed=true]/sidebar:group-focus-within/sidebar:flex", children: /* @__PURE__ */ r(k, { tooltipSide: "right" }) }),
151
151
  /* @__PURE__ */ c("div", { className: "flex items-center gap-1 group-data-[collapsed=true]/sidebar:hidden", children: [
152
152
  i && /* @__PURE__ */ r(k, { tooltipSide: "bottom" }),
153
- o
153
+ s
154
154
  ] })
155
155
  ]
156
156
  }
157
157
  );
158
158
  }
159
- const q = s.forwardRef(
159
+ const q = o.forwardRef(
160
160
  ({ className: t, ...e }, a) => /* @__PURE__ */ r(
161
161
  "div",
162
162
  {
@@ -171,26 +171,26 @@ const q = s.forwardRef(
171
171
  )
172
172
  );
173
173
  q.displayName = "SidebarHeader";
174
- const A = s.forwardRef(
174
+ const B = o.forwardRef(
175
175
  ({ className: t, ...e }, a) => /* @__PURE__ */ r("nav", { ref: a, className: n("min-h-0 flex-1 space-y-5 overflow-y-auto p-3", t), ...e })
176
176
  );
177
- A.displayName = "SidebarNav";
178
- const B = s.forwardRef(
179
- ({ className: t, label: e, children: a, ...i }, o) => /* @__PURE__ */ c("div", { ref: o, className: t, ...i, children: [
177
+ B.displayName = "SidebarNav";
178
+ const D = o.forwardRef(
179
+ ({ className: t, label: e, children: a, ...i }, s) => /* @__PURE__ */ c("div", { ref: s, className: t, ...i, children: [
180
180
  e && /* @__PURE__ */ r("div", { className: "mb-1.5 px-3 text-s font-normal uppercase leading-4 tracking-wider text-tertiary group-data-[collapsed=true]/sidebar:hidden", children: e }),
181
181
  /* @__PURE__ */ r("div", { className: "flex flex-col gap-0.5 group-data-[collapsed=true]/sidebar:gap-2", children: a })
182
182
  ] })
183
183
  );
184
- B.displayName = "SidebarSection";
185
- const D = s.forwardRef(
186
- ({ className: t, icon: e, isActive: a, endContent: i, children: o, title: d, ...l }, m) => /* @__PURE__ */ c(
184
+ D.displayName = "SidebarSection";
185
+ const F = o.forwardRef(
186
+ ({ className: t, icon: e, isActive: a, endContent: i, children: s, title: d, ...l }, m) => /* @__PURE__ */ c(
187
187
  "a",
188
188
  {
189
189
  ref: m,
190
190
  "aria-current": a ? "page" : void 0,
191
- title: d ?? (typeof o == "string" ? o : void 0),
191
+ title: d ?? (typeof s == "string" ? s : void 0),
192
192
  className: n(
193
- "group/sidebar-item flex h-9 items-center gap-2.5 rounded-md border border-transparent px-3 text-m leading-[var(--text-m--line-height)] font-normal text-wg12",
193
+ "group/sidebar-item flex h-9 items-center gap-2.5 rounded-md border border-transparent px-3 text-m leading-[var(--text-m--line-height)] font-normal text-sidebar-foreground",
194
194
  "transition-[background-color,border-color,color] duration-150 ease-out motion-reduce:transition-none",
195
195
  "outline-none focus-visible:ring-3 focus-visible:ring-ring",
196
196
  // Collapsed: a centered square (--sidebar-item) so every rail item lines up.
@@ -205,17 +205,17 @@ const D = s.forwardRef(
205
205
  {
206
206
  "aria-hidden": !0,
207
207
  className: "flex shrink-0 items-center justify-center transition-transform duration-150 ease-out group-hover/sidebar-item:scale-110 motion-reduce:transition-none motion-reduce:group-hover/sidebar-item:scale-100 [&_svg]:size-4 [&_svg]:shrink-0",
208
- children: a && s.isValidElement(e) ? s.cloneElement(e, { weight: "fill" }) : e
208
+ children: a && o.isValidElement(e) ? o.cloneElement(e, { weight: "fill" }) : e
209
209
  }
210
210
  ),
211
- /* @__PURE__ */ r("span", { className: "min-w-0 flex-1 truncate group-data-[collapsed=true]/sidebar:hidden", children: o }),
211
+ /* @__PURE__ */ r("span", { className: "min-w-0 flex-1 truncate group-data-[collapsed=true]/sidebar:hidden", children: s }),
212
212
  i && /* @__PURE__ */ r("span", { className: "shrink-0 group-data-[collapsed=true]/sidebar:hidden", children: i })
213
213
  ]
214
214
  }
215
215
  )
216
216
  );
217
- D.displayName = "SidebarItem";
218
- const F = s.forwardRef(
217
+ F.displayName = "SidebarItem";
218
+ const W = o.forwardRef(
219
219
  ({ className: t, ...e }, a) => /* @__PURE__ */ r(
220
220
  "div",
221
221
  {
@@ -225,17 +225,17 @@ const F = s.forwardRef(
225
225
  }
226
226
  )
227
227
  );
228
- F.displayName = "SidebarFooter";
229
- const W = s.forwardRef(
230
- ({ className: t, icon: e, children: a, ...i }, o) => /* @__PURE__ */ r("div", { className: "px-3 pb-0.5 group-data-[collapsed=true]/sidebar:px-2", children: /* @__PURE__ */ c(
228
+ W.displayName = "SidebarFooter";
229
+ const $ = o.forwardRef(
230
+ ({ className: t, icon: e, children: a, ...i }, s) => /* @__PURE__ */ r("div", { className: "px-3 pb-0.5 group-data-[collapsed=true]/sidebar:px-2", children: /* @__PURE__ */ c(
231
231
  "button",
232
232
  {
233
- ref: o,
233
+ ref: s,
234
234
  type: "button",
235
235
  className: n(
236
236
  "flex h-9 w-full items-center justify-start gap-2 rounded-md px-3",
237
- "text-m leading-[var(--text-m--line-height)] font-normal text-wg12",
238
- // Reads as a normal nav item: transparent at rest, the shared teal
237
+ "text-m leading-[var(--text-m--line-height)] font-normal text-sidebar-foreground",
238
+ // Reads as a normal nav item: transparent at rest, the shared White
239
239
  // hover wash on hover (no fill-at-rest, no elevation).
240
240
  "transition-colors duration-150 ease-out motion-reduce:transition-none",
241
241
  "hover:bg-sidebar-accent/60 hover:text-sidebar-accent-foreground",
@@ -252,12 +252,12 @@ const W = s.forwardRef(
252
252
  }
253
253
  ) })
254
254
  );
255
- W.displayName = "SidebarAction";
256
- const $ = s.forwardRef(
257
- ({ className: t, label: e, children: a, ...i }, o) => /* @__PURE__ */ c(
255
+ $.displayName = "SidebarAction";
256
+ const A = o.forwardRef(
257
+ ({ className: t, label: e, children: a, ...i }, s) => /* @__PURE__ */ c(
258
258
  "div",
259
259
  {
260
- ref: o,
260
+ ref: s,
261
261
  className: n("group-data-[collapsed=true]/sidebar:hidden", t),
262
262
  ...i,
263
263
  children: [
@@ -267,10 +267,10 @@ const $ = s.forwardRef(
267
267
  }
268
268
  )
269
269
  );
270
- $.displayName = "SidebarHistory";
271
- const O = s.forwardRef(({ className: t, children: e, title: a, action: i, isActive: o, icon: d, ...l }, m) => {
272
- const v = s.useRef(null), y = s.useRef(null), [b, u] = s.useState(0);
273
- s.useLayoutEffect(() => {
270
+ A.displayName = "SidebarHistory";
271
+ const O = o.forwardRef(({ className: t, children: e, title: a, action: i, isActive: s, icon: d, ...l }, m) => {
272
+ const v = o.useRef(null), y = o.useRef(null), [g, u] = o.useState(0);
273
+ o.useLayoutEffect(() => {
274
274
  const x = v.current, p = y.current;
275
275
  if (!x || !p) return;
276
276
  const f = () => {
@@ -281,14 +281,14 @@ const O = s.forwardRef(({ className: t, children: e, title: a, action: i, isActi
281
281
  const N = new ResizeObserver(f);
282
282
  return N.observe(x), N.observe(p), () => N.disconnect();
283
283
  }, [e, i]);
284
- const g = b > 0, h = Math.max(500, Math.round(b * 18));
284
+ const b = g > 0, h = Math.max(500, Math.round(g * 18));
285
285
  return /* @__PURE__ */ c(
286
286
  "div",
287
287
  {
288
288
  className: n(
289
289
  "group/hist relative flex items-center rounded-md transition-colors",
290
- "text-wg12",
291
- o ? "bg-sidebar-accent text-sidebar-accent-foreground" : "hover:bg-sidebar-accent/60 hover:text-sidebar-accent-foreground"
290
+ "text-sidebar-foreground",
291
+ s ? "bg-sidebar-accent text-sidebar-accent-foreground" : "hover:bg-sidebar-accent/60 hover:text-sidebar-accent-foreground"
292
292
  ),
293
293
  children: [
294
294
  d && /* @__PURE__ */ r(
@@ -321,8 +321,8 @@ const O = s.forwardRef(({ className: t, children: e, title: a, action: i, isActi
321
321
  // Rest: fade the right edge (no ellipsis). Hover: the title scrolls,
322
322
  // so fade the LEFT edge where it exits; the action backdrop (or the
323
323
  // string's own end) handles the right.
324
- g && "[mask-image:linear-gradient(to_right,var(--color-wg12)_calc(100%-1.5rem),transparent)]",
325
- g && "group-hover/hist:[mask-image:linear-gradient(to_right,transparent,var(--color-wg12)_1.25rem,var(--color-wg12)_100%)]"
324
+ b && "[mask-image:linear-gradient(to_right,var(--color-wg12)_calc(100%-1.5rem),transparent)]",
325
+ b && "group-hover/hist:[mask-image:linear-gradient(to_right,transparent,var(--color-wg12)_1.25rem,var(--color-wg12)_100%)]"
326
326
  ),
327
327
  children: /* @__PURE__ */ r(
328
328
  "span",
@@ -330,11 +330,11 @@ const O = s.forwardRef(({ className: t, children: e, title: a, action: i, isActi
330
330
  ref: y,
331
331
  className: n(
332
332
  "block w-max whitespace-nowrap transition-transform ease-linear",
333
- g && "group-hover/hist:[transform:translateX(var(--mq-x))]",
333
+ b && "group-hover/hist:[transform:translateX(var(--mq-x))]",
334
334
  "motion-reduce:transition-none motion-reduce:group-hover/hist:[transform:none]"
335
335
  ),
336
336
  style: {
337
- "--mq-x": `-${b}px`,
337
+ "--mq-x": `-${g}px`,
338
338
  transitionDuration: `${h}ms`
339
339
  },
340
340
  children: e
@@ -351,7 +351,8 @@ const O = s.forwardRef(({ className: t, children: e, title: a, action: i, isActi
351
351
  // Rounded end matches the row's radius so the backdrop doesn't
352
352
  // square off the highlight's right corners.
353
353
  "absolute inset-y-0 right-0 flex items-center rounded-e-md pl-8 pr-1",
354
- "bg-gradient-to-l from-fill from-45% to-transparent",
354
+ "bg-gradient-to-l from-45% to-transparent",
355
+ s ? "from-sidebar-accent" : "from-[color-mix(in_srgb,var(--sidebar-accent)_60%,var(--background))]",
355
356
  "opacity-0 transition-opacity duration-150 group-hover/hist:opacity-100",
356
357
  "pointer-events-none group-hover/hist:pointer-events-auto",
357
358
  "focus-within:pointer-events-auto focus-within:opacity-100"
@@ -364,8 +365,8 @@ const O = s.forwardRef(({ className: t, children: e, title: a, action: i, isActi
364
365
  );
365
366
  });
366
367
  O.displayName = "SidebarHistoryItem";
367
- const P = s.forwardRef(
368
- ({ className: t, name: e, role: a, src: i, hideAvatar: o, ...d }, l) => /* @__PURE__ */ c(
368
+ const P = o.forwardRef(
369
+ ({ className: t, name: e, role: a, src: i, hideAvatar: s, ...d }, l) => /* @__PURE__ */ c(
369
370
  "a",
370
371
  {
371
372
  ref: l,
@@ -377,9 +378,9 @@ const P = s.forwardRef(
377
378
  ),
378
379
  ...d,
379
380
  children: [
380
- !o && /* @__PURE__ */ r(L, { size: "sm", name: e, src: i }),
381
- o && /* @__PURE__ */ r(
382
- _,
381
+ !s && /* @__PURE__ */ r(L, { size: "sm", name: e, src: i }),
382
+ s && /* @__PURE__ */ r(
383
+ j,
383
384
  {
384
385
  "aria-hidden": !0,
385
386
  className: "hidden size-4 shrink-0 text-muted-foreground group-data-[collapsed=true]/sidebar:block"
@@ -397,15 +398,15 @@ P.displayName = "SidebarAccount";
397
398
  export {
398
399
  K as Sidebar,
399
400
  P as SidebarAccount,
400
- W as SidebarAction,
401
+ $ as SidebarAction,
401
402
  Y as SidebarBrand,
402
- F as SidebarFooter,
403
+ W as SidebarFooter,
403
404
  q as SidebarHeader,
404
- $ as SidebarHistory,
405
+ A as SidebarHistory,
405
406
  O as SidebarHistoryItem,
406
- D as SidebarItem,
407
- A as SidebarNav,
408
- B as SidebarSection,
407
+ F as SidebarItem,
408
+ B as SidebarNav,
409
+ D as SidebarSection,
409
410
  k as SidebarTrigger,
410
411
  M as useSidebar
411
412
  };
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  import { jsxs as b, jsx as l } from "react/jsx-runtime";
3
- import * as v from "react";
3
+ import * as m from "react";
4
4
  import { cn as s } from "../lib/cn.js";
5
- const m = v.forwardRef(
5
+ const v = m.forwardRef(
6
6
  ({ value: d, onChange: t, min: e = 0, max: r = 100, step: u = 1, disabled: a, className: n, ...c }, f) => {
7
7
  const i = Math.min(Math.max(d, e), r), o = r === e ? 0 : (i - e) / (r - e) * 100;
8
8
  return /* @__PURE__ */ b(
@@ -44,7 +44,7 @@ const m = v.forwardRef(
44
44
  {
45
45
  className: s(
46
46
  "pointer-events-none absolute size-4 -translate-x-1/2 rounded-full",
47
- "border border-background bg-brand shadow-elevation transition-shadow",
47
+ "border border-background bg-brand transition-shadow",
48
48
  "peer-focus-visible:ring-3 peer-focus-visible:ring-ring"
49
49
  ),
50
50
  style: { left: `${o}%` },
@@ -56,7 +56,7 @@ const m = v.forwardRef(
56
56
  );
57
57
  }
58
58
  );
59
- m.displayName = "Slider";
59
+ v.displayName = "Slider";
60
60
  export {
61
- m as Slider
61
+ v as Slider
62
62
  };
@@ -35,7 +35,7 @@ export interface StepperProps extends Omit<React.HTMLAttributes<HTMLOListElement
35
35
  activeIndex: number;
36
36
  /** Makes completed steps navigable. */
37
37
  onSelect?: (index: number) => void;
38
- /** Places each label below its marker or directly beside it. */
38
+ /** Places each label directly beside its marker (default) or below it. */
39
39
  labelPosition?: "below" | "inline";
40
40
  }
41
41
  export declare const Stepper: React.ForwardRefExoticComponent<StepperProps & React.RefAttributes<HTMLOListElement>>;
@@ -31,7 +31,7 @@ const b = y(
31
31
  activeIndex: n,
32
32
  size: i = "md",
33
33
  onSelect: o,
34
- labelPosition: h = "below",
34
+ labelPosition: h = "inline",
35
35
  ...u
36
36
  }, N) => /* @__PURE__ */ e(
37
37
  "ol",
@@ -4,7 +4,7 @@ import * as c from "react";
4
4
  import { MotionConfig as w, motion as x } from "motion/react";
5
5
  import { cn as n } from "../lib/cn.js";
6
6
  import { springSwitch as g } from "../lib/motion.js";
7
- const v = {
7
+ const y = {
8
8
  sm: {
9
9
  track: "h-5 w-9",
10
10
  knob: "size-4",
@@ -15,17 +15,17 @@ const v = {
15
15
  knob: "size-5",
16
16
  offset: 20
17
17
  }
18
- }, y = c.forwardRef(
18
+ }, v = c.forwardRef(
19
19
  ({
20
20
  className: m,
21
21
  checked: t = !1,
22
22
  onCheckedChange: e,
23
- size: d = "md",
23
+ size: f = "md",
24
24
  disabled: s,
25
25
  children: o,
26
26
  ...r
27
- }, f) => {
28
- const l = v[d], a = c.useId(), u = r["aria-label"] != null || r["aria-labelledby"] != null, b = o && !u ? a : void 0;
27
+ }, u) => {
28
+ const l = y[f], a = c.useId(), b = r["aria-label"] != null || r["aria-labelledby"] != null, d = o && !b ? a : void 0;
29
29
  return /* @__PURE__ */ p(
30
30
  "label",
31
31
  {
@@ -37,11 +37,11 @@ const v = {
37
37
  /* @__PURE__ */ i(
38
38
  "button",
39
39
  {
40
- ref: f,
40
+ ref: u,
41
41
  type: "button",
42
42
  role: "switch",
43
43
  "aria-checked": t,
44
- "aria-labelledby": b,
44
+ "aria-labelledby": d,
45
45
  disabled: s,
46
46
  onClick: () => e == null ? void 0 : e(!t),
47
47
  className: n(
@@ -62,7 +62,7 @@ const v = {
62
62
  animate: { x: t ? l.offset : 0 },
63
63
  transition: g,
64
64
  className: n(
65
- "ml-0.5 inline-block rounded-full bg-elevated shadow-elevation",
65
+ "ml-0.5 inline-block rounded-full bg-elevated",
66
66
  l.knob
67
67
  )
68
68
  }
@@ -75,7 +75,7 @@ const v = {
75
75
  );
76
76
  }
77
77
  );
78
- y.displayName = "Switch";
78
+ v.displayName = "Switch";
79
79
  export {
80
- y as Switch
80
+ v as Switch
81
81
  };
@@ -25,14 +25,16 @@ export interface TableProps extends Omit<React.TableHTMLAttributes<HTMLTableElem
25
25
  */
26
26
  footer?: React.ReactNode;
27
27
  selectionMode?: SelectionMode;
28
+ /** In multiple mode, selected parent keys also select their descendants. */
28
29
  selectedKeys?: Selection;
30
+ /** Multiple selection reports every selected parent and descendant key. */
29
31
  onSelectionChange?: (keys: Set<string>) => void;
30
- /** All row keys on the current page — powers the header "select all". */
32
+ /** Current-page row keys for header selection; parent keys include their descendants. */
31
33
  rowKeys?: string[];
32
34
  /**
33
35
  * Turns the final `sticky="right"` column into a persistent action surface.
34
- * Its cells stay on `bg-elevated` while one flat Table-level
35
- * `shadow-elevation` compatibility hook spans the body below the WG1 header.
36
+ * Its cells stay on `bg-elevated` and flat beside the body below the White
37
+ * header.
36
38
  * The matching header cell stays transparent and scrolls normally, so it
37
39
  * never becomes a blank sticky surface over the header labels.
38
40
  */
@@ -67,12 +69,15 @@ export interface TableProps extends Omit<React.TableHTMLAttributes<HTMLTableElem
67
69
  maxBodyHeight?: React.CSSProperties["maxHeight"];
68
70
  }
69
71
  /**
70
- * Styled wrapper around a semantic `<table>` with horizontal overflow.
72
+ * Full-width semantic table with columns that share the available space.
73
+ * Content that cannot fit scrolls inside the table surface.
71
74
  *
72
75
  * A plain `<Table>` automatically makes its labeled data columns sortable.
73
76
  * Consumers can opt out with `allowsSorting={false}`, or control sorting with
74
77
  * `sortDescriptor` + `onSortChange` and explicit column `sortKey` values.
75
- * Row selection and sticky columns remain opt-in. Compose with `<Pagination>`
78
+ * Row selection is opt-in: single uses grouped radios, multiple uses checkboxes.
79
+ * Selected fills fade across the visible row from full tint on the left to none on the right.
80
+ * Sticky columns remain opt-in. Compose with `<Pagination>`
76
81
  * below for paging.
77
82
  */
78
83
  export declare const Table: React.ForwardRefExoticComponent<TableProps & React.RefAttributes<HTMLTableElement>>;
@@ -81,6 +86,13 @@ export declare const TableBody: React.ForwardRefExoticComponent<React.HTMLAttrib
81
86
  export interface TableRowProps extends React.HTMLAttributes<HTMLTableRowElement> {
82
87
  /** Stable key for selection (required on body rows to be selectable). */
83
88
  rowKey?: string;
89
+ /** Nested TableRow elements, shown beneath this row when expanded. */
90
+ childRows?: React.ReactNode;
91
+ expanded?: boolean;
92
+ defaultExpanded?: boolean;
93
+ onExpandedChange?: (expanded: boolean) => void;
94
+ /** Accessible disclosure label; defaults to the first cell's text. */
95
+ disclosureLabel?: string;
84
96
  /** @deprecated Existing visual-only marker. New rows should pass an action via onClick. */
85
97
  isInteractive?: boolean;
86
98
  }