@tensor_1/react 2.4.0 → 2.6.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.
package/dist/index.cjs CHANGED
@@ -24,22 +24,33 @@ __export(src_exports, {
24
24
  AppShell: () => AppShell,
25
25
  Avatar: () => Avatar,
26
26
  AvatarGroup: () => AvatarGroup,
27
+ BulkBar: () => BulkBar,
27
28
  Button: () => Button,
28
29
  ButtonGroup: () => ButtonGroup,
29
30
  Card: () => Card,
31
+ CellStrong: () => CellStrong,
32
+ CellSub: () => CellSub,
30
33
  Checkbox: () => Checkbox,
31
34
  CommandGroup: () => CommandGroup,
32
35
  CommandItem: () => CommandItem,
33
36
  CommandPalette: () => CommandPalette,
34
37
  Comment: () => Comment,
35
38
  Comments: () => Comments,
39
+ Composer: () => Composer,
40
+ ComposerBar: () => ComposerBar,
36
41
  DescriptionItem: () => DescriptionItem,
37
42
  DescriptionList: () => DescriptionList,
38
43
  DetailLayout: () => DetailLayout,
39
44
  Drawer: () => Drawer,
40
45
  EmptyState: () => EmptyState,
41
46
  ErrorState: () => ErrorState,
47
+ ExpandToggle: () => ExpandToggle,
42
48
  Field: () => Field,
49
+ Highlighted: () => Highlighted,
50
+ Inbox: () => Inbox,
51
+ InboxDetail: () => InboxDetail,
52
+ InboxItem: () => InboxItem,
53
+ InboxList: () => InboxList,
43
54
  Input: () => Input,
44
55
  InputGroup: () => InputGroup,
45
56
  Kanban: () => Kanban,
@@ -49,6 +60,8 @@ __export(src_exports, {
49
60
  List: () => List,
50
61
  ListItem: () => ListItem,
51
62
  LoadingState: () => LoadingState,
63
+ Mark: () => Mark,
64
+ Meter: () => Meter,
52
65
  Modal: () => Modal,
53
66
  NavFavourites: () => NavFavourites,
54
67
  NavGroup: () => NavGroup,
@@ -62,6 +75,10 @@ __export(src_exports, {
62
75
  Prose: () => Prose,
63
76
  Radio: () => Radio,
64
77
  RadioGroup: () => RadioGroup,
78
+ RowAction: () => RowAction,
79
+ RowActions: () => RowActions,
80
+ Segmented: () => Segmented,
81
+ SegmentedOption: () => SegmentedOption,
65
82
  Select: () => Select,
66
83
  Sidebar: () => Sidebar,
67
84
  SidebarSection: () => SidebarSection,
@@ -87,8 +104,26 @@ __export(src_exports, {
87
104
  Tr: () => Tr,
88
105
  Tree: () => Tree,
89
106
  UserChip: () => UserChip,
107
+ applyFilters: () => applyFilters,
108
+ clampWidth: () => clampWidth,
90
109
  cx: () => cx,
91
- useDialog: () => useDialog
110
+ highlightSegments: () => highlightSegments,
111
+ matchFilter: () => matchFilter,
112
+ mergePinned: () => mergePinned,
113
+ multiSort: () => multiSort,
114
+ nextSortDir: () => nextSortDir,
115
+ parseView: () => parseView,
116
+ reorder: () => reorder,
117
+ searchRows: () => searchRows,
118
+ selectAllState: () => selectAllState,
119
+ serializeView: () => serializeView,
120
+ shouldVirtualize: () => shouldVirtualize,
121
+ toggleId: () => toggleId,
122
+ togglePage: () => togglePage,
123
+ toggleSort: () => toggleSort,
124
+ useDialog: () => useDialog,
125
+ useTable: () => useTable,
126
+ virtualWindow: () => virtualWindow
92
127
  });
93
128
  module.exports = __toCommonJS(src_exports);
94
129
 
@@ -116,10 +151,235 @@ function useDialog(open) {
116
151
  return ref;
117
152
  }
118
153
 
119
- // src/components/Button.tsx
154
+ // src/hooks/useTable.ts
120
155
  var import_react2 = require("react");
156
+
157
+ // src/table-engine.ts
158
+ function compare(a, b) {
159
+ if (a == null && b == null) return 0;
160
+ if (a == null) return -1;
161
+ if (b == null) return 1;
162
+ if (typeof a === "number" && typeof b === "number") return a - b;
163
+ return String(a).localeCompare(String(b), void 0, { numeric: true, sensitivity: "base" });
164
+ }
165
+ function multiSort(rows, keys) {
166
+ if (!keys.length) return rows.slice();
167
+ return rows.map((row, i) => ({ row, i })).sort((x, y) => {
168
+ for (const k of keys) {
169
+ const c = compare(x.row[k.field], y.row[k.field]);
170
+ if (c !== 0) return k.dir === "ascending" ? c : -c;
171
+ }
172
+ return x.i - y.i;
173
+ }).map((w) => w.row);
174
+ }
175
+ function nextSortDir(current) {
176
+ if (current === "ascending") return "descending";
177
+ if (current === "descending") return "none";
178
+ return "ascending";
179
+ }
180
+ function toggleSort(keys, field, additive = false) {
181
+ const existing = keys.find((k) => k.field === field);
182
+ const dir = nextSortDir(existing?.dir);
183
+ if (!additive) return dir === "none" ? [] : [{ field, dir }];
184
+ const rest = keys.filter((k) => k.field !== field);
185
+ return dir === "none" ? rest : [...rest, { field, dir }];
186
+ }
187
+ function asNum(v) {
188
+ return typeof v === "number" ? v : Number(v);
189
+ }
190
+ function matchFilter(row, f) {
191
+ const cell = row[f.field];
192
+ switch (f.op) {
193
+ case "isAnyOf":
194
+ return Array.isArray(f.value) && f.value.includes(cell);
195
+ case "isNoneOf":
196
+ return Array.isArray(f.value) && !f.value.includes(cell);
197
+ case "contains":
198
+ return String(cell ?? "").toLowerCase().includes(String(f.value ?? "").toLowerCase());
199
+ case "equals":
200
+ return String(cell ?? "") === String(f.value ?? "");
201
+ case "startsWith":
202
+ return String(cell ?? "").toLowerCase().startsWith(String(f.value ?? "").toLowerCase());
203
+ case "eq":
204
+ return asNum(cell) === asNum(f.value);
205
+ case "lt":
206
+ return asNum(cell) < asNum(f.value);
207
+ case "gt":
208
+ return asNum(cell) > asNum(f.value);
209
+ case "between": {
210
+ const [lo, hi] = f.value.map(asNum);
211
+ return asNum(cell) >= lo && asNum(cell) <= hi;
212
+ }
213
+ case "is":
214
+ return Boolean(cell) === Boolean(f.value);
215
+ default:
216
+ return true;
217
+ }
218
+ }
219
+ function applyFilters(rows, filters) {
220
+ if (!filters.length) return rows.slice();
221
+ return rows.filter((r) => filters.every((f) => matchFilter(r, f)));
222
+ }
223
+ function searchRows(rows, query, fields) {
224
+ const q = query.trim().toLowerCase();
225
+ if (!q) return rows.slice();
226
+ return rows.filter((r) => {
227
+ const vals = fields ? fields.map((f) => r[f]) : Object.values(r);
228
+ return vals.some((v) => v != null && String(v).toLowerCase().includes(q));
229
+ });
230
+ }
231
+ function highlightSegments(text, query) {
232
+ const q = query.trim();
233
+ if (!q) return [{ text, match: false }];
234
+ const out = [];
235
+ const lower = text.toLowerCase();
236
+ const ql = q.toLowerCase();
237
+ let i = 0;
238
+ for (; ; ) {
239
+ const hit = lower.indexOf(ql, i);
240
+ if (hit === -1) {
241
+ if (i < text.length) out.push({ text: text.slice(i), match: false });
242
+ break;
243
+ }
244
+ if (hit > i) out.push({ text: text.slice(i, hit), match: false });
245
+ out.push({ text: text.slice(hit, hit + q.length), match: true });
246
+ i = hit + q.length;
247
+ }
248
+ return out;
249
+ }
250
+ function serializeView(v) {
251
+ const p = new URLSearchParams();
252
+ if (v.sort?.length) p.set("sort", v.sort.map((s) => `${s.field}:${s.dir === "descending" ? "d" : "a"}`).join(","));
253
+ if (v.columns?.length) p.set("cols", v.columns.join(","));
254
+ if (v.density && v.density !== "standard") p.set("density", v.density);
255
+ if (v.q) p.set("q", v.q);
256
+ if (v.filters?.length) p.set("filter", v.filters.map((f) => `${f.field}~${f.op}~${Array.isArray(f.value) ? f.value.join("|") : f.value ?? ""}`).join(","));
257
+ return p.toString();
258
+ }
259
+ function parseView(qs) {
260
+ const p = new URLSearchParams(qs.replace(/^\?/, ""));
261
+ const v = {};
262
+ const sort = p.get("sort");
263
+ if (sort) v.sort = sort.split(",").filter(Boolean).map((tok) => {
264
+ const [field, d] = tok.split(":");
265
+ return { field, dir: d === "d" ? "descending" : "ascending" };
266
+ });
267
+ const cols = p.get("cols");
268
+ if (cols) v.columns = cols.split(",").filter(Boolean);
269
+ const density = p.get("density");
270
+ if (density === "compact" || density === "comfortable" || density === "standard") v.density = density;
271
+ const q = p.get("q");
272
+ if (q) v.q = q;
273
+ const filter = p.get("filter");
274
+ if (filter) v.filters = filter.split(",").filter(Boolean).map((tok) => {
275
+ const [field, op, raw] = tok.split("~");
276
+ const value = raw?.includes("|") ? raw.split("|") : raw;
277
+ return { field, kind: "text", op, value };
278
+ });
279
+ return v;
280
+ }
281
+ function virtualWindow(scrollTop, viewportH, rowH, count, overscan = 6) {
282
+ if (rowH <= 0 || count <= 0) return { start: 0, end: count, padTop: 0, padBottom: 0, total: 0 };
283
+ const first = Math.max(0, Math.floor(scrollTop / rowH) - overscan);
284
+ const visible = Math.ceil(viewportH / rowH) + overscan * 2;
285
+ const end = Math.min(count, first + visible);
286
+ return { start: first, end, padTop: first * rowH, padBottom: (count - end) * rowH, total: count * rowH };
287
+ }
288
+ function shouldVirtualize(count, threshold = 100) {
289
+ return count > threshold;
290
+ }
291
+ function clampWidth(width, min = 64, max = Infinity) {
292
+ return Math.max(min, Math.min(max, Math.round(width)));
293
+ }
294
+ function reorder(arr, from, to) {
295
+ const next = arr.slice();
296
+ if (from < 0 || from >= next.length || to < 0 || to >= next.length) return next;
297
+ const [moved] = next.splice(from, 1);
298
+ next.splice(to, 0, moved);
299
+ return next;
300
+ }
301
+ function toggleId(set, id) {
302
+ const next = new Set(set);
303
+ next.has(id) ? next.delete(id) : next.add(id);
304
+ return next;
305
+ }
306
+ function selectAllState(selected, pageIds) {
307
+ const on = pageIds.filter((id) => selected.has(id)).length;
308
+ if (on === 0) return "none";
309
+ return on === pageIds.length ? "all" : "some";
310
+ }
311
+ function togglePage(selected, pageIds) {
312
+ const next = new Set(selected);
313
+ const all = pageIds.every((id) => next.has(id));
314
+ for (const id of pageIds) all ? next.delete(id) : next.add(id);
315
+ return next;
316
+ }
317
+ function mergePinned(all, visible, pinnedIds, idField = "id") {
318
+ if (!pinnedIds.size) return visible.slice();
319
+ const pinned = all.filter((r) => pinnedIds.has(String(r[idField])));
320
+ const pinnedSet = new Set(pinned.map((r) => String(r[idField])));
321
+ const rest = visible.filter((r) => !pinnedSet.has(String(r[idField])));
322
+ return [...pinned, ...rest];
323
+ }
324
+
325
+ // src/hooks/useTable.ts
326
+ function useTable(data, options = {}) {
327
+ const { idField = "id", searchFields } = options;
328
+ const [sort, setSort] = (0, import_react2.useState)(() => options.initialSort ?? []);
329
+ const [filters, setFilters] = (0, import_react2.useState)(() => options.initialFilters ?? []);
330
+ const [query, setQuery] = (0, import_react2.useState)(() => options.initialQuery ?? "");
331
+ const [selected, setSelected] = (0, import_react2.useState)(() => /* @__PURE__ */ new Set());
332
+ const [pinned, setPinned] = (0, import_react2.useState)(() => new Set(options.initialPinned ?? []));
333
+ const rows = (0, import_react2.useMemo)(() => {
334
+ const filtered = applyFilters(data, filters);
335
+ const searched = searchRows(filtered, query, searchFields);
336
+ const sorted = multiSort(searched, sort);
337
+ return mergePinned(data, sorted, pinned, idField);
338
+ }, [data, filters, query, searchFields, sort, pinned, idField]);
339
+ const pageIds = (0, import_react2.useMemo)(() => rows.map((r) => String(r[idField])), [rows, idField]);
340
+ const selectAll = selectAllState(selected, pageIds);
341
+ const doToggleSort = (0, import_react2.useCallback)((field, additive = false) => {
342
+ setSort((keys) => toggleSort(keys, field, additive));
343
+ }, []);
344
+ const toggleRow = (0, import_react2.useCallback)((id) => setSelected((s) => toggleId(s, id)), []);
345
+ const toggleAllRows = (0, import_react2.useCallback)(() => setSelected((s) => togglePage(s, pageIds)), [pageIds]);
346
+ const clearSelection = (0, import_react2.useCallback)(() => setSelected(/* @__PURE__ */ new Set()), []);
347
+ const togglePin = (0, import_react2.useCallback)((id) => setPinned((s) => toggleId(s, id)), []);
348
+ const view = (0, import_react2.useMemo)(() => ({ sort, filters, q: query }), [sort, filters, query]);
349
+ const viewQueryString = (0, import_react2.useMemo)(() => serializeView(view), [view]);
350
+ const applyView = (0, import_react2.useCallback)((queryString) => {
351
+ const v = parseView(queryString);
352
+ setSort(v.sort ?? []);
353
+ setFilters(v.filters ?? []);
354
+ setQuery(v.q ?? "");
355
+ }, []);
356
+ return {
357
+ rows,
358
+ sort,
359
+ filters,
360
+ query,
361
+ selected,
362
+ pinned,
363
+ selectAll,
364
+ toggleSort: doToggleSort,
365
+ setSort,
366
+ setFilters,
367
+ setQuery,
368
+ isSelected: (id) => selected.has(id),
369
+ toggleRow,
370
+ toggleAllRows,
371
+ clearSelection,
372
+ togglePin,
373
+ view,
374
+ viewQueryString,
375
+ applyView
376
+ };
377
+ }
378
+
379
+ // src/components/Button.tsx
380
+ var import_react3 = require("react");
121
381
  var import_jsx_runtime = require("react/jsx-runtime");
122
- var Button = (0, import_react2.forwardRef)(
382
+ var Button = (0, import_react3.forwardRef)(
123
383
  ({ variant = "secondary", size = "md", icon = false, loading = false, className, children, disabled, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
124
384
  "button",
125
385
  {
@@ -144,9 +404,9 @@ function ButtonGroup({ children, className }) {
144
404
  }
145
405
 
146
406
  // src/components/Input.tsx
147
- var import_react3 = require("react");
407
+ var import_react4 = require("react");
148
408
  var import_jsx_runtime2 = require("react/jsx-runtime");
149
- var Input = (0, import_react3.forwardRef)(
409
+ var Input = (0, import_react4.forwardRef)(
150
410
  ({ size = "md", invalid, valid, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
151
411
  "input",
152
412
  {
@@ -179,9 +439,9 @@ function InputGroup({ children, leadingIcon, trailingIcon, className }) {
179
439
  }
180
440
 
181
441
  // src/components/Textarea.tsx
182
- var import_react4 = require("react");
442
+ var import_react5 = require("react");
183
443
  var import_jsx_runtime3 = require("react/jsx-runtime");
184
- var Textarea = (0, import_react4.forwardRef)(
444
+ var Textarea = (0, import_react5.forwardRef)(
185
445
  ({ invalid, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
186
446
  "textarea",
187
447
  {
@@ -195,9 +455,9 @@ var Textarea = (0, import_react4.forwardRef)(
195
455
  Textarea.displayName = "Textarea";
196
456
 
197
457
  // src/components/Select.tsx
198
- var import_react5 = require("react");
458
+ var import_react6 = require("react");
199
459
  var import_jsx_runtime4 = require("react/jsx-runtime");
200
- var Select = (0, import_react5.forwardRef)(
460
+ var Select = (0, import_react6.forwardRef)(
201
461
  ({ size = "md", className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
202
462
  "select",
203
463
  {
@@ -210,14 +470,14 @@ var Select = (0, import_react5.forwardRef)(
210
470
  Select.displayName = "Select";
211
471
 
212
472
  // src/components/Checkbox.tsx
213
- var import_react6 = require("react");
473
+ var import_react7 = require("react");
214
474
  var import_jsx_runtime5 = require("react/jsx-runtime");
215
475
  var CheckIcon = () => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("polyline", { points: "1.5,6 4.5,9 10.5,3" }) });
216
476
  var IndeterminateIcon = () => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("svg", { viewBox: "0 0 12 12", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("rect", { x: "2", y: "5", width: "8", height: "2", rx: "1", fill: "currentColor" }) });
217
- var Checkbox = (0, import_react6.forwardRef)(
477
+ var Checkbox = (0, import_react7.forwardRef)(
218
478
  ({ label, indeterminate, className, ...props }, forwardedRef) => {
219
- const innerRef = (0, import_react6.useRef)(null);
220
- (0, import_react6.useEffect)(() => {
479
+ const innerRef = (0, import_react7.useRef)(null);
480
+ (0, import_react7.useEffect)(() => {
221
481
  const el = innerRef.current;
222
482
  if (el) el.indeterminate = !!indeterminate;
223
483
  }, [indeterminate]);
@@ -242,9 +502,9 @@ var Checkbox = (0, import_react6.forwardRef)(
242
502
  Checkbox.displayName = "Checkbox";
243
503
 
244
504
  // src/components/Radio.tsx
245
- var import_react7 = require("react");
505
+ var import_react8 = require("react");
246
506
  var import_jsx_runtime6 = require("react/jsx-runtime");
247
- var Radio = (0, import_react7.forwardRef)(
507
+ var Radio = (0, import_react8.forwardRef)(
248
508
  ({ label, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("label", { className: cx("uix-radio", className), children: [
249
509
  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("input", { type: "radio", ref, ...props }),
250
510
  /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "uix-radio__dot" }),
@@ -257,9 +517,9 @@ function RadioGroup({ children, className }) {
257
517
  }
258
518
 
259
519
  // src/components/Switch.tsx
260
- var import_react8 = require("react");
520
+ var import_react9 = require("react");
261
521
  var import_jsx_runtime7 = require("react/jsx-runtime");
262
- var Switch = (0, import_react8.forwardRef)(
522
+ var Switch = (0, import_react9.forwardRef)(
263
523
  ({ label, className, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("label", { className: cx("uix-switch", className), children: [
264
524
  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("input", { type: "checkbox", role: "switch", ref, ...props }),
265
525
  /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("span", { className: "uix-switch__track" }),
@@ -406,11 +666,11 @@ function ListItem({ title, meta, trail, leading, children, className, ...props }
406
666
  }
407
667
 
408
668
  // src/components/DescriptionList.tsx
409
- var import_react9 = require("react");
669
+ var import_react10 = require("react");
410
670
  var import_jsx_runtime16 = require("react/jsx-runtime");
411
671
  function DescriptionList({ items, children, className, ...props }) {
412
672
  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("dl", { className: cx("uix-dl", className), ...props, children: [
413
- items?.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_react9.Fragment, { children: [
673
+ items?.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_react10.Fragment, { children: [
414
674
  /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("dt", { children: item.term }),
415
675
  /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("dd", { children: item.description })
416
676
  ] }, item.id ?? i)),
@@ -425,14 +685,14 @@ function DescriptionItem({ term, children }) {
425
685
  }
426
686
 
427
687
  // src/components/Tabs.tsx
428
- var import_react10 = require("react");
688
+ var import_react11 = require("react");
429
689
  var import_jsx_runtime17 = require("react/jsx-runtime");
430
- var TabsCtx = (0, import_react10.createContext)({});
690
+ var TabsCtx = (0, import_react11.createContext)({});
431
691
  function Tabs({ variant = "line", value, onChange, children, className }) {
432
692
  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(TabsCtx.Provider, { value: { value, onChange }, children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { role: "tablist", className: cx("uix-tabs", `uix-tabs--${variant}`, className), children }) });
433
693
  }
434
694
  function Tab({ value, children, disabled, className, onClick, ...props }) {
435
- const ctx = (0, import_react10.useContext)(TabsCtx);
695
+ const ctx = (0, import_react11.useContext)(TabsCtx);
436
696
  const selected = ctx.value === value;
437
697
  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
438
698
  "button",
@@ -452,17 +712,49 @@ function Tab({ value, children, disabled, className, onClick, ...props }) {
452
712
  }
453
713
 
454
714
  // src/components/AppShell.tsx
715
+ var import_react12 = require("react");
455
716
  var import_jsx_runtime18 = require("react/jsx-runtime");
456
- function AppShell({ collapsed, sidebar, topbar, children, className, ...props }) {
457
- return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)("div", { className: cx("uix-shell", className), "data-collapsed": collapsed || void 0, ...props, children: [
458
- sidebar && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "uix-shell__sidebar", children: sidebar }),
459
- topbar && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "uix-shell__topbar", children: topbar }),
460
- /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("main", { className: "uix-shell__main", children })
461
- ] });
717
+ function AppShell({
718
+ nav,
719
+ collapsed,
720
+ focus,
721
+ onExitFocus,
722
+ mainBleed,
723
+ sidebar,
724
+ topbar,
725
+ children,
726
+ className,
727
+ ...props
728
+ }) {
729
+ const navState = nav ?? (collapsed ? "rail" : "full");
730
+ (0, import_react12.useEffect)(() => {
731
+ if (!focus || !onExitFocus) return;
732
+ const onKey = (e) => {
733
+ if (e.key === "Escape") onExitFocus();
734
+ };
735
+ document.addEventListener("keydown", onKey);
736
+ return () => document.removeEventListener("keydown", onKey);
737
+ }, [focus, onExitFocus]);
738
+ return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
739
+ "div",
740
+ {
741
+ className: cx("uix-shell", className),
742
+ "data-nav": navState !== "full" ? navState : void 0,
743
+ "data-collapsed": collapsed && nav == null ? "" : void 0,
744
+ "data-focus": focus || void 0,
745
+ ...props,
746
+ children: [
747
+ sidebar && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "uix-shell__sidebar", children: sidebar }),
748
+ topbar && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "uix-shell__topbar", children: topbar }),
749
+ /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("main", { className: cx("uix-shell__main", mainBleed && "uix-shell__main--bleed"), children }),
750
+ focus && onExitFocus && /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("div", { className: "uix-shell__focus-exit", children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("button", { type: "button", className: "uix-btn uix-btn--secondary uix-btn--sm", onClick: onExitFocus, children: "Esc \xB7 Exit focus" }) })
751
+ ]
752
+ }
753
+ );
462
754
  }
463
755
 
464
756
  // src/components/Sidebar.tsx
465
- var import_react11 = require("react");
757
+ var import_react13 = require("react");
466
758
  var import_jsx_runtime19 = require("react/jsx-runtime");
467
759
  var ChevronIcon = () => /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("svg", { className: "uix-navgroup__chevron", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("path", { d: "M2 4l4 4 4-4" }) });
468
760
  function Sidebar({ collapsed, onToggle, brand, toggleIcon, children, className, ...props }) {
@@ -516,7 +808,7 @@ function NavItem({ icon, badge, active, as: Tag = "a", children, className, ...p
516
808
  );
517
809
  }
518
810
  function NavGroup({ icon, label, children, defaultExpanded = true }) {
519
- const [expanded, setExpanded] = (0, import_react11.useState)(defaultExpanded);
811
+ const [expanded, setExpanded] = (0, import_react13.useState)(defaultExpanded);
520
812
  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)("div", { className: "uix-navgroup", children: [
521
813
  /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
522
814
  "button",
@@ -584,7 +876,7 @@ function StarButton({
584
876
  }
585
877
 
586
878
  // src/components/NavFavourites.tsx
587
- var import_react12 = require("react");
879
+ var import_react14 = require("react");
588
880
  var import_jsx_runtime21 = require("react/jsx-runtime");
589
881
  var ChevronDownIcon = () => /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
590
882
  "svg",
@@ -648,13 +940,13 @@ function NavFavourites({
648
940
  emptyReason,
649
941
  className
650
942
  }) {
651
- const regionId = (0, import_react12.useId)();
652
- const headerRef = (0, import_react12.useRef)(null);
653
- const regionRef = (0, import_react12.useRef)(null);
654
- const focusAfterRef = (0, import_react12.useRef)(null);
655
- const triggerRefs = (0, import_react12.useRef)(/* @__PURE__ */ new Map());
943
+ const regionId = (0, import_react14.useId)();
944
+ const headerRef = (0, import_react14.useRef)(null);
945
+ const regionRef = (0, import_react14.useRef)(null);
946
+ const focusAfterRef = (0, import_react14.useRef)(null);
947
+ const triggerRefs = (0, import_react14.useRef)(/* @__PURE__ */ new Map());
656
948
  const order = items.map((i) => i.id);
657
- (0, import_react12.useEffect)(() => {
949
+ (0, import_react14.useEffect)(() => {
658
950
  const id = focusAfterRef.current;
659
951
  if (!id) return;
660
952
  focusAfterRef.current = null;
@@ -765,18 +1057,18 @@ function FavouriteRow({
765
1057
  onRemove,
766
1058
  registerTrigger
767
1059
  }) {
768
- const [open, setOpen] = (0, import_react12.useState)(false);
769
- const [revealed, setRevealed] = (0, import_react12.useState)(false);
770
- const menuId = (0, import_react12.useId)();
771
- const triggerRef = (0, import_react12.useRef)(null);
772
- const itemRefs = (0, import_react12.useRef)([]);
1060
+ const [open, setOpen] = (0, import_react14.useState)(false);
1061
+ const [revealed, setRevealed] = (0, import_react14.useState)(false);
1062
+ const menuId = (0, import_react14.useId)();
1063
+ const triggerRef = (0, import_react14.useRef)(null);
1064
+ const itemRefs = (0, import_react14.useRef)([]);
773
1065
  const optionsTemplate = labels.options ?? "{label} favourite options";
774
1066
  const actions = [
775
1067
  ...isFirst ? [] : [{ label: labels.moveUp, onSelect: onMoveUp }],
776
1068
  ...isLast ? [] : [{ label: labels.moveDown, onSelect: onMoveDown }],
777
1069
  { label: labels.remove.replace("{label}", item.label), onSelect: onRemove }
778
1070
  ];
779
- (0, import_react12.useEffect)(() => {
1071
+ (0, import_react14.useEffect)(() => {
780
1072
  if (open) itemRefs.current[0]?.focus();
781
1073
  }, [open]);
782
1074
  const closeAndReturnFocus = () => {
@@ -993,6 +1285,7 @@ function Table({
993
1285
  density = "standard",
994
1286
  zebra = true,
995
1287
  pinnedCol,
1288
+ fixed,
996
1289
  rowPeek,
997
1290
  v2,
998
1291
  className,
@@ -1002,7 +1295,13 @@ function Table({
1002
1295
  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
1003
1296
  "table",
1004
1297
  {
1005
- className: cx("uix-table", !zebra && "uix-table--no-zebra", pinnedCol && "uix-table--pinned-col", className),
1298
+ className: cx(
1299
+ "uix-table",
1300
+ !zebra && "uix-table--no-zebra",
1301
+ pinnedCol && "uix-table--pinned-col",
1302
+ fixed && "uix-table--fixed",
1303
+ className
1304
+ ),
1006
1305
  "data-density": density !== "standard" ? density : void 0,
1007
1306
  "data-uix-rowpeek": rowPeek || void 0,
1008
1307
  "data-uix-table-v2": v2 || void 0,
@@ -1011,12 +1310,13 @@ function Table({
1011
1310
  }
1012
1311
  );
1013
1312
  }
1014
- function Th({ sortable, sortDirection, onSort, className, children, onClick, ...props }) {
1313
+ function Th({ sortable, sortDirection, sortOrder, onSort, className, children, onClick, ...props }) {
1015
1314
  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
1016
1315
  "th",
1017
1316
  {
1018
1317
  className,
1019
1318
  "data-sort": sortable || void 0,
1319
+ "data-sort-order": sortOrder != null && sortOrder > 0 ? sortOrder : void 0,
1020
1320
  "aria-sort": sortDirection && sortDirection !== "none" ? sortDirection : void 0,
1021
1321
  onClick: sortable ? onSort ?? onClick : onClick,
1022
1322
  ...props,
@@ -1039,6 +1339,49 @@ function Tr({ selected, pinned, className, children, ...props }) {
1039
1339
  }
1040
1340
  );
1041
1341
  }
1342
+ function BulkBar({ count, children, className, ...props }) {
1343
+ return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: cx("uix-bulkbar", className), role: "toolbar", "aria-label": "Bulk actions", ...props, children: [
1344
+ count != null && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("span", { className: "uix-bulkbar__count", children: [
1345
+ count,
1346
+ " selected"
1347
+ ] }),
1348
+ /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "uix-bulkbar__spacer" }),
1349
+ children
1350
+ ] });
1351
+ }
1352
+ function RowActions({ children, className, ...props }) {
1353
+ return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("td", { className: cx("uix-table__actions", className), ...props, children });
1354
+ }
1355
+ function RowAction({ children, className, type = "button", ...props }) {
1356
+ return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("button", { type, className: cx("uix-rowact", className), ...props, children });
1357
+ }
1358
+ function ExpandToggle({ expanded, className, type = "button", ...props }) {
1359
+ return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
1360
+ "button",
1361
+ {
1362
+ type,
1363
+ className: cx("uix-table__expand", className),
1364
+ "aria-expanded": expanded,
1365
+ "aria-label": expanded ? "Collapse row" : "Expand row",
1366
+ ...props,
1367
+ children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("svg", { viewBox: "0 0 16 16", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("path", { d: "M6 4l4 4-4 4" }) })
1368
+ }
1369
+ );
1370
+ }
1371
+ function CellStrong({ children, className, ...props }) {
1372
+ return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: cx("uix-cell-strong", className), ...props, children });
1373
+ }
1374
+ function CellSub({ children, className, ...props }) {
1375
+ return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: cx("uix-cell-sub", className), ...props, children });
1376
+ }
1377
+ function Mark({ children, className, ...props }) {
1378
+ return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("mark", { className: cx("uix-mark", className), ...props, children });
1379
+ }
1380
+ function Highlighted({ text, query }) {
1381
+ return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_jsx_runtime25.Fragment, { children: highlightSegments(text, query).map(
1382
+ (seg, i) => seg.match ? /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("mark", { className: "uix-mark", children: seg.text }, i) : /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { children: seg.text }, i)
1383
+ ) });
1384
+ }
1042
1385
 
1043
1386
  // src/components/Pagination.tsx
1044
1387
  var import_jsx_runtime26 = require("react/jsx-runtime");
@@ -1125,49 +1468,74 @@ function Progress({ value = 0, max = 100, indeterminate, className, ...props })
1125
1468
  );
1126
1469
  }
1127
1470
 
1128
- // src/components/Stat.tsx
1471
+ // src/components/Meter.tsx
1129
1472
  var import_jsx_runtime29 = require("react/jsx-runtime");
1473
+ function Meter({ value = 0, tone, className, ...props }) {
1474
+ const pct = Math.max(0, Math.min(100, value));
1475
+ return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
1476
+ "div",
1477
+ {
1478
+ role: "meter",
1479
+ "aria-valuenow": pct,
1480
+ "aria-valuemin": 0,
1481
+ "aria-valuemax": 100,
1482
+ className: cx("uix-meter", className),
1483
+ ...props,
1484
+ children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
1485
+ "div",
1486
+ {
1487
+ className: "uix-meter__fill",
1488
+ style: { width: `${pct}%` },
1489
+ ...tone && tone !== "success" ? { "data-tone": tone } : {}
1490
+ }
1491
+ )
1492
+ }
1493
+ );
1494
+ }
1495
+
1496
+ // src/components/Stat.tsx
1497
+ var import_jsx_runtime30 = require("react/jsx-runtime");
1130
1498
  function Stat({ label, value, icon, meta, trend, className, ...props }) {
1131
- return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: cx("uix-stat", className), ...props, children: [
1132
- /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "uix-stat__label", children: [
1133
- /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { children: label }),
1499
+ return /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: cx("uix-stat", className), ...props, children: [
1500
+ /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "uix-stat__label", children: [
1501
+ /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { children: label }),
1134
1502
  icon
1135
1503
  ] }),
1136
- /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "uix-stat__value", children: value }),
1137
- (meta != null || trend != null) && /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "uix-stat__meta", children: [
1138
- trend != null && /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: cx("uix-stat__trend", `uix-stat__trend--${trend.direction}`), children: trend.label }),
1504
+ /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("div", { className: "uix-stat__value", children: value }),
1505
+ (meta != null || trend != null) && /* @__PURE__ */ (0, import_jsx_runtime30.jsxs)("div", { className: "uix-stat__meta", children: [
1506
+ trend != null && /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { className: cx("uix-stat__trend", `uix-stat__trend--${trend.direction}`), children: trend.label }),
1139
1507
  meta
1140
1508
  ] })
1141
1509
  ] });
1142
1510
  }
1143
1511
 
1144
1512
  // src/components/Tooltip.tsx
1145
- var import_jsx_runtime30 = require("react/jsx-runtime");
1513
+ var import_jsx_runtime31 = require("react/jsx-runtime");
1146
1514
  function Tooltip({ label, children, ...props }) {
1147
- return /* @__PURE__ */ (0, import_jsx_runtime30.jsx)("span", { "data-uix-tip": label, ...props, children });
1515
+ return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("span", { "data-uix-tip": label, ...props, children });
1148
1516
  }
1149
1517
 
1150
1518
  // src/components/States.tsx
1151
- var import_jsx_runtime31 = require("react/jsx-runtime");
1519
+ var import_jsx_runtime32 = require("react/jsx-runtime");
1152
1520
  function EmptyState({ icon, title, children, action, className, ...props }) {
1153
- return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: cx("uix-empty", className), ...props, children: [
1154
- icon != null && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "uix-empty__icon", children: icon }),
1155
- title != null && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "uix-empty__title", children: title }),
1521
+ return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: cx("uix-empty", className), ...props, children: [
1522
+ icon != null && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "uix-empty__icon", children: icon }),
1523
+ title != null && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "uix-empty__title", children: title }),
1156
1524
  children,
1157
1525
  action
1158
1526
  ] });
1159
1527
  }
1160
1528
  function ErrorState({ icon, title, detail, action, className, ...props }) {
1161
- return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: cx("uix-empty", "uix-empty--danger", className), role: "alert", ...props, children: [
1162
- icon != null && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "uix-empty__icon uix-empty__icon--danger", children: icon }),
1163
- title != null && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: "uix-empty__title", children: title }),
1164
- detail != null && /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("p", { children: detail }),
1529
+ return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: cx("uix-empty", "uix-empty--danger", className), role: "alert", ...props, children: [
1530
+ icon != null && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "uix-empty__icon uix-empty__icon--danger", children: icon }),
1531
+ title != null && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: "uix-empty__title", children: title }),
1532
+ detail != null && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("p", { children: detail }),
1165
1533
  action
1166
1534
  ] });
1167
1535
  }
1168
1536
  function Skeleton({ variant = "block", width, height, className, style, ...props }) {
1169
1537
  const dims = { width, height, ...style };
1170
- return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(
1538
+ return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(
1171
1539
  "div",
1172
1540
  {
1173
1541
  className: cx(
@@ -1182,52 +1550,52 @@ function Skeleton({ variant = "block", width, height, className, style, ...props
1182
1550
  );
1183
1551
  }
1184
1552
  function LoadingState({ rows = 3, className, ...props }) {
1185
- return /* @__PURE__ */ (0, import_jsx_runtime31.jsx)("div", { className: cx("uix-stack", className), role: "status", "aria-busy": "true", ...props, children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ (0, import_jsx_runtime31.jsx)(Skeleton, { variant: "text", width: `${92 - i % 3 * 14}%` }, i)) });
1553
+ return /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("div", { className: cx("uix-stack", className), role: "status", "aria-busy": "true", ...props, children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ (0, import_jsx_runtime32.jsx)(Skeleton, { variant: "text", width: `${92 - i % 3 * 14}%` }, i)) });
1186
1554
  }
1187
1555
 
1188
1556
  // src/components/Label.tsx
1189
- var import_jsx_runtime32 = require("react/jsx-runtime");
1557
+ var import_jsx_runtime33 = require("react/jsx-runtime");
1190
1558
  function Label({ color, dot, children, className, style, ...props }) {
1191
1559
  const merged = color ? { "--label-color": color, ...style } : style;
1192
- return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("span", { className: cx("uix-label", className), style: merged, ...props, children: [
1193
- dot && /* @__PURE__ */ (0, import_jsx_runtime32.jsx)("span", { className: "uix-label__dot", "aria-hidden": "true" }),
1560
+ return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("span", { className: cx("uix-label", className), style: merged, ...props, children: [
1561
+ dot && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "uix-label__dot", "aria-hidden": "true" }),
1194
1562
  children
1195
1563
  ] });
1196
1564
  }
1197
1565
 
1198
1566
  // src/components/Avatar.tsx
1199
- var import_jsx_runtime33 = require("react/jsx-runtime");
1567
+ var import_jsx_runtime34 = require("react/jsx-runtime");
1200
1568
  function Avatar({ size = "md", src, alt, children, status, className, ...props }) {
1201
- return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("span", { className: cx("uix-avatar", size !== "md" && `uix-avatar--${size}`, className), ...props, children: [
1202
- src ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("img", { src, alt: alt ?? "" }) : children,
1203
- status && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "uix-avatar__status" })
1569
+ return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("span", { className: cx("uix-avatar", size !== "md" && `uix-avatar--${size}`, className), ...props, children: [
1570
+ src ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("img", { src, alt: alt ?? "" }) : children,
1571
+ status && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "uix-avatar__status" })
1204
1572
  ] });
1205
1573
  }
1206
1574
  function AvatarGroup({ children, className, ...props }) {
1207
- return /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: cx("uix-avatar-group", className), ...props, children });
1575
+ return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: cx("uix-avatar-group", className), ...props, children });
1208
1576
  }
1209
1577
  function UserChip({ avatar, name, sub, className, children, ...props }) {
1210
- return /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("span", { className: cx("uix-user-chip", className), ...props, children: [
1578
+ return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("span", { className: cx("uix-user-chip", className), ...props, children: [
1211
1579
  avatar,
1212
- /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("span", { children: [
1213
- name != null && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "uix-user-chip__name", children: name }),
1214
- sub != null && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "uix-user-chip__sub", style: { display: "block" }, children: sub })
1580
+ /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("span", { children: [
1581
+ name != null && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "uix-user-chip__name", children: name }),
1582
+ sub != null && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "uix-user-chip__sub", style: { display: "block" }, children: sub })
1215
1583
  ] }),
1216
1584
  children
1217
1585
  ] });
1218
1586
  }
1219
1587
 
1220
1588
  // src/components/Comments.tsx
1221
- var import_jsx_runtime34 = require("react/jsx-runtime");
1589
+ var import_jsx_runtime35 = require("react/jsx-runtime");
1222
1590
  function Comments({ children, className, ...props }) {
1223
- return /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("div", { className: cx("uix-comments", className), ...props, children });
1591
+ return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: cx("uix-comments", className), ...props, children });
1224
1592
  }
1225
1593
  function Comment({ avatar, author, meta, children, className, ...props }) {
1226
- return /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: cx("uix-comment", className), ...props, children: [
1227
- avatar ?? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { "aria-hidden": "true" }),
1228
- /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "uix-comment__body", children: [
1229
- (author != null || meta != null) && /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: "uix-comment__meta", children: [
1230
- author != null && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "uix-comment__author", children: author }),
1594
+ return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: cx("uix-comment", className), ...props, children: [
1595
+ avatar ?? /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { "aria-hidden": "true" }),
1596
+ /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "uix-comment__body", children: [
1597
+ (author != null || meta != null) && /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "uix-comment__meta", children: [
1598
+ author != null && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "uix-comment__author", children: author }),
1231
1599
  author != null && meta != null ? " \xB7 " : null,
1232
1600
  meta
1233
1601
  ] }),
@@ -1236,96 +1604,176 @@ function Comment({ avatar, author, meta, children, className, ...props }) {
1236
1604
  ] });
1237
1605
  }
1238
1606
 
1607
+ // src/components/Composer.tsx
1608
+ var import_jsx_runtime36 = require("react/jsx-runtime");
1609
+ function Composer({ children, className, ...props }) {
1610
+ return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: cx("uix-composer", className), ...props, children });
1611
+ }
1612
+ function ComposerBar({ children, className, ...props }) {
1613
+ return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: cx("uix-composer__bar", className), ...props, children });
1614
+ }
1615
+
1616
+ // src/components/Segmented.tsx
1617
+ var import_react15 = require("react");
1618
+ var import_jsx_runtime37 = require("react/jsx-runtime");
1619
+ var SegmentedCtx = (0, import_react15.createContext)({});
1620
+ function Segmented({ value, onChange, children, className, ...props }) {
1621
+ return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(SegmentedCtx.Provider, { value: { value, onChange }, children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { role: "group", className: cx("uix-segmented", className), ...props, children }) });
1622
+ }
1623
+ function SegmentedOption({
1624
+ value,
1625
+ children,
1626
+ className,
1627
+ onClick,
1628
+ ...props
1629
+ }) {
1630
+ const ctx = (0, import_react15.useContext)(SegmentedCtx);
1631
+ const selected = ctx.value === value;
1632
+ return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
1633
+ "button",
1634
+ {
1635
+ type: "button",
1636
+ className: cx("uix-segmented__option", className),
1637
+ "aria-pressed": selected,
1638
+ onClick: (e) => {
1639
+ ctx.onChange?.(value);
1640
+ onClick?.(e);
1641
+ },
1642
+ ...props,
1643
+ children
1644
+ }
1645
+ );
1646
+ }
1647
+
1239
1648
  // src/components/Timeline.tsx
1240
- var import_jsx_runtime35 = require("react/jsx-runtime");
1649
+ var import_jsx_runtime38 = require("react/jsx-runtime");
1241
1650
  function Timeline({ children, className, ...props }) {
1242
- return /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: cx("uix-timeline", className), ...props, children });
1651
+ return /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: cx("uix-timeline", className), ...props, children });
1243
1652
  }
1244
- function TimelineItem({ meta, children, className, ...props }) {
1245
- return /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: cx("uix-timeline__item", className), ...props, children: [
1246
- /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "uix-timeline__rail", children: [
1247
- /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "uix-timeline__node" }),
1248
- /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("span", { className: "uix-timeline__line" })
1653
+ function TimelineItem({ node, meta, children, className, ...props }) {
1654
+ return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: cx("uix-timeline__item", className), ...props, children: [
1655
+ /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "uix-timeline__rail", children: [
1656
+ node ?? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "uix-timeline__node" }),
1657
+ /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "uix-timeline__line" })
1249
1658
  ] }),
1250
- /* @__PURE__ */ (0, import_jsx_runtime35.jsxs)("div", { className: "uix-timeline__body", children: [
1251
- meta != null && /* @__PURE__ */ (0, import_jsx_runtime35.jsx)("div", { className: "uix-timeline__meta", children: meta }),
1659
+ /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "uix-timeline__body", children: [
1660
+ meta != null && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "uix-timeline__meta", children: meta }),
1252
1661
  children
1253
1662
  ] })
1254
1663
  ] });
1255
1664
  }
1256
1665
 
1257
1666
  // src/components/Prose.tsx
1258
- var import_jsx_runtime36 = require("react/jsx-runtime");
1667
+ var import_jsx_runtime39 = require("react/jsx-runtime");
1259
1668
  function Prose({ children, className, ...props }) {
1260
- return /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: cx("uix-prose", className), ...props, children });
1669
+ return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: cx("uix-prose", className), ...props, children });
1261
1670
  }
1262
1671
  function Note({ tone, icon, children, className, ...props }) {
1263
- return /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: cx("uix-note", tone && `uix-note--${tone}`, className), ...props, children: [
1264
- icon != null && /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "uix-note__icon", children: icon }),
1265
- /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "uix-note__body", children })
1672
+ return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: cx("uix-note", tone && `uix-note--${tone}`, className), ...props, children: [
1673
+ icon != null && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "uix-note__icon", children: icon }),
1674
+ /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "uix-note__body", children })
1266
1675
  ] });
1267
1676
  }
1268
1677
 
1269
1678
  // src/components/Popover.tsx
1270
- var import_jsx_runtime37 = require("react/jsx-runtime");
1679
+ var import_jsx_runtime40 = require("react/jsx-runtime");
1271
1680
  function Popover({ popover = "auto", children, className, ...props }) {
1272
1681
  const popoverAttr = { popover };
1273
- return /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("div", { className: cx("uix-popover", className), ...popoverAttr, ...props, children });
1682
+ return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("div", { className: cx("uix-popover", className), ...popoverAttr, ...props, children });
1274
1683
  }
1275
1684
 
1276
1685
  // src/components/CommandPalette.tsx
1277
- var import_jsx_runtime38 = require("react/jsx-runtime");
1686
+ var import_jsx_runtime41 = require("react/jsx-runtime");
1278
1687
  function CommandPalette({ inputProps, children, className, ...props }) {
1279
- return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: cx("uix-cmdk", className), ...props, children: [
1280
- /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("input", { className: "uix-cmdk__input", ...inputProps }),
1281
- /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "uix-cmdk__list", children })
1688
+ return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: cx("uix-cmdk", className), ...props, children: [
1689
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("input", { className: "uix-cmdk__input", ...inputProps }),
1690
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "uix-cmdk__list", children })
1282
1691
  ] });
1283
1692
  }
1284
1693
  function CommandGroup({ label, children }) {
1285
- return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_jsx_runtime38.Fragment, { children: [
1286
- label != null && /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { className: "uix-cmdk__group", children: label }),
1694
+ return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(import_jsx_runtime41.Fragment, { children: [
1695
+ label != null && /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("div", { className: "uix-cmdk__group", children: label }),
1287
1696
  children
1288
1697
  ] });
1289
1698
  }
1290
1699
  function CommandItem({ icon, shortcut, active, children, className, ...props }) {
1291
- return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: cx("uix-cmdk__item", className), "data-active": active || void 0, ...props, children: [
1700
+ return /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)("div", { className: cx("uix-cmdk__item", className), "data-active": active || void 0, ...props, children: [
1292
1701
  icon,
1293
- /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { children }),
1702
+ /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { children }),
1294
1703
  shortcut
1295
1704
  ] });
1296
1705
  }
1297
1706
 
1707
+ // src/components/Inbox.tsx
1708
+ var import_jsx_runtime42 = require("react/jsx-runtime");
1709
+ function Inbox({ children, className, ...props }) {
1710
+ return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: cx("uix-inbox", className), ...props, children });
1711
+ }
1712
+ function InboxList({ children, className, ...props }) {
1713
+ return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: cx("uix-inbox__list", className), role: "listbox", ...props, children });
1714
+ }
1715
+ function InboxItem({
1716
+ subject,
1717
+ preview,
1718
+ leading,
1719
+ unread,
1720
+ selected,
1721
+ children,
1722
+ className,
1723
+ ...props
1724
+ }) {
1725
+ return /* @__PURE__ */ (0, import_jsx_runtime42.jsxs)(
1726
+ "div",
1727
+ {
1728
+ role: "option",
1729
+ "aria-selected": selected ?? false,
1730
+ className: cx("uix-inbox__item", className),
1731
+ ...unread ? { "data-unread": "" } : {},
1732
+ ...props,
1733
+ children: [
1734
+ leading,
1735
+ subject != null && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "uix-inbox__subject", children: subject }),
1736
+ preview != null && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: "uix-inbox__preview", children: preview }),
1737
+ children
1738
+ ]
1739
+ }
1740
+ );
1741
+ }
1742
+ function InboxDetail({ children, className, ...props }) {
1743
+ return /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("div", { className: cx("uix-inbox__detail", className), ...props, children });
1744
+ }
1745
+
1298
1746
  // src/components/Kanban.tsx
1299
- var import_jsx_runtime39 = require("react/jsx-runtime");
1747
+ var import_jsx_runtime43 = require("react/jsx-runtime");
1300
1748
  function Kanban({ children, className, ...props }) {
1301
- return /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: cx("uix-kanban", className), ...props, children });
1749
+ return /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: cx("uix-kanban", className), ...props, children });
1302
1750
  }
1303
1751
  function KanbanColumn({ title, count, children, className, ...props }) {
1304
- return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: cx("uix-kanban__col", className), ...props, children: [
1305
- (title != null || count != null) && /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: "uix-kanban__head", children: [
1752
+ return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: cx("uix-kanban__col", className), ...props, children: [
1753
+ (title != null || count != null) && /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "uix-kanban__head", children: [
1306
1754
  title,
1307
- count != null && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "uix-kanban__count", children: count })
1755
+ count != null && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: "uix-kanban__count", children: count })
1308
1756
  ] }),
1309
- /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "uix-kanban__body", children })
1757
+ /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "uix-kanban__body", children })
1310
1758
  ] });
1311
1759
  }
1312
1760
  function KanbanCard({ title, meta, children, className, ...props }) {
1313
- return /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)("div", { className: cx("uix-kanban__card", className), ...props, children: [
1314
- title && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "uix-kanban__card-title", children: title }),
1315
- meta && /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("div", { className: "uix-kanban__card-meta", children: meta }),
1761
+ return /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: cx("uix-kanban__card", className), ...props, children: [
1762
+ title && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "uix-kanban__card-title", children: title }),
1763
+ meta && /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("div", { className: "uix-kanban__card-meta", children: meta }),
1316
1764
  children
1317
1765
  ] });
1318
1766
  }
1319
1767
 
1320
1768
  // src/components/Tree.tsx
1321
- var import_react13 = require("react");
1322
- var import_jsx_runtime40 = require("react/jsx-runtime");
1323
- var ChevronIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("svg", { viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("path", { d: "M2 4l4 4 4-4" }) });
1769
+ var import_react16 = require("react");
1770
+ var import_jsx_runtime44 = require("react/jsx-runtime");
1771
+ var ChevronIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("svg", { viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("path", { d: "M2 4l4 4 4-4" }) });
1324
1772
  function TreeNode({ node, expanded, selected, onToggle, onSelect, level = 0 }) {
1325
1773
  const hasChildren = Array.isArray(node.children) && node.children.length > 0;
1326
1774
  const isExpanded = expanded.has(node.id);
1327
- return /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)("li", { children: [
1328
- /* @__PURE__ */ (0, import_jsx_runtime40.jsxs)(
1775
+ return /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("li", { children: [
1776
+ /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(
1329
1777
  "button",
1330
1778
  {
1331
1779
  className: "uix-tree__row",
@@ -1336,13 +1784,13 @@ function TreeNode({ node, expanded, selected, onToggle, onSelect, level = 0 }) {
1336
1784
  onSelect?.(node.id);
1337
1785
  },
1338
1786
  children: [
1339
- /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { className: "uix-tree__toggle", children: hasChildren && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(ChevronIcon2, {}) }),
1340
- node.icon && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("span", { "aria-hidden": "true", children: node.icon }),
1787
+ /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "uix-tree__toggle", children: hasChildren && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(ChevronIcon2, {}) }),
1788
+ node.icon && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { "aria-hidden": "true", children: node.icon }),
1341
1789
  node.label
1342
1790
  ]
1343
1791
  }
1344
1792
  ),
1345
- hasChildren && isExpanded && /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("ul", { children: node.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
1793
+ hasChildren && isExpanded && /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("ul", { children: node.children.map((child) => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
1346
1794
  TreeNode,
1347
1795
  {
1348
1796
  node: child,
@@ -1357,7 +1805,7 @@ function TreeNode({ node, expanded, selected, onToggle, onSelect, level = 0 }) {
1357
1805
  ] });
1358
1806
  }
1359
1807
  function Tree({ nodes, expanded: controlledExpanded, defaultExpanded, selected, onToggle, onSelect, className, ...props }) {
1360
- const [internalExpanded, setInternalExpanded] = (0, import_react13.useState)(defaultExpanded ?? /* @__PURE__ */ new Set());
1808
+ const [internalExpanded, setInternalExpanded] = (0, import_react16.useState)(defaultExpanded ?? /* @__PURE__ */ new Set());
1361
1809
  const expanded = controlledExpanded ?? internalExpanded;
1362
1810
  function handleToggle(id) {
1363
1811
  if (!controlledExpanded) {
@@ -1370,7 +1818,7 @@ function Tree({ nodes, expanded: controlledExpanded, defaultExpanded, selected,
1370
1818
  }
1371
1819
  onToggle?.(id);
1372
1820
  }
1373
- return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)("ul", { className: cx("uix-tree", className), role: "tree", ...props, children: nodes.map((node) => /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
1821
+ return /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("ul", { className: cx("uix-tree", className), role: "tree", ...props, children: nodes.map((node) => /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(
1374
1822
  TreeNode,
1375
1823
  {
1376
1824
  node,
@@ -1388,22 +1836,33 @@ function Tree({ nodes, expanded: controlledExpanded, defaultExpanded, selected,
1388
1836
  AppShell,
1389
1837
  Avatar,
1390
1838
  AvatarGroup,
1839
+ BulkBar,
1391
1840
  Button,
1392
1841
  ButtonGroup,
1393
1842
  Card,
1843
+ CellStrong,
1844
+ CellSub,
1394
1845
  Checkbox,
1395
1846
  CommandGroup,
1396
1847
  CommandItem,
1397
1848
  CommandPalette,
1398
1849
  Comment,
1399
1850
  Comments,
1851
+ Composer,
1852
+ ComposerBar,
1400
1853
  DescriptionItem,
1401
1854
  DescriptionList,
1402
1855
  DetailLayout,
1403
1856
  Drawer,
1404
1857
  EmptyState,
1405
1858
  ErrorState,
1859
+ ExpandToggle,
1406
1860
  Field,
1861
+ Highlighted,
1862
+ Inbox,
1863
+ InboxDetail,
1864
+ InboxItem,
1865
+ InboxList,
1407
1866
  Input,
1408
1867
  InputGroup,
1409
1868
  Kanban,
@@ -1413,6 +1872,8 @@ function Tree({ nodes, expanded: controlledExpanded, defaultExpanded, selected,
1413
1872
  List,
1414
1873
  ListItem,
1415
1874
  LoadingState,
1875
+ Mark,
1876
+ Meter,
1416
1877
  Modal,
1417
1878
  NavFavourites,
1418
1879
  NavGroup,
@@ -1426,6 +1887,10 @@ function Tree({ nodes, expanded: controlledExpanded, defaultExpanded, selected,
1426
1887
  Prose,
1427
1888
  Radio,
1428
1889
  RadioGroup,
1890
+ RowAction,
1891
+ RowActions,
1892
+ Segmented,
1893
+ SegmentedOption,
1429
1894
  Select,
1430
1895
  Sidebar,
1431
1896
  SidebarSection,
@@ -1451,6 +1916,24 @@ function Tree({ nodes, expanded: controlledExpanded, defaultExpanded, selected,
1451
1916
  Tr,
1452
1917
  Tree,
1453
1918
  UserChip,
1919
+ applyFilters,
1920
+ clampWidth,
1454
1921
  cx,
1455
- useDialog
1922
+ highlightSegments,
1923
+ matchFilter,
1924
+ mergePinned,
1925
+ multiSort,
1926
+ nextSortDir,
1927
+ parseView,
1928
+ reorder,
1929
+ searchRows,
1930
+ selectAllState,
1931
+ serializeView,
1932
+ shouldVirtualize,
1933
+ toggleId,
1934
+ togglePage,
1935
+ toggleSort,
1936
+ useDialog,
1937
+ useTable,
1938
+ virtualWindow
1456
1939
  });