@ynput/ayon-frontend-shared 0.6.9 → 0.7.1

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 (66) hide show
  1. package/dist/ContextMenu.es.js +44 -27
  2. package/dist/DetailsPanel.es.js +767 -740
  3. package/dist/ListTable.es.js +430 -430
  4. package/dist/NewEntity.es.js +43 -42
  5. package/dist/ProjectTreeTable.es.js +3496 -3342
  6. package/dist/Slicer.es.js +301 -276
  7. package/dist/Views.es.js +537 -521
  8. package/dist/api.es.js +429 -412
  9. package/dist/chunks/Actions.es.js +19 -18
  10. package/dist/chunks/ColumnDropIndicator.es.js +19 -18
  11. package/dist/chunks/ColumnHeaderMenuUI.es.js +2 -2
  12. package/dist/chunks/ContextMenuContextInstance.es.js +4 -3
  13. package/dist/chunks/DeleteEntitiesConfirmDialog.es.js +53 -41
  14. package/dist/chunks/DetailsDialog.es.js +26 -24
  15. package/dist/chunks/EmptyPlaceholder.es.js +3 -3
  16. package/dist/chunks/EmptyPlaceholderFlex.styled.es.js +40 -0
  17. package/dist/chunks/EntityPath.es.js +72 -71
  18. package/dist/chunks/EntityPickerDialog.es.js +88 -83
  19. package/dist/chunks/EntityTooltip.es.js +11 -10
  20. package/dist/chunks/EntityUpdatesContext.es.js +11 -11
  21. package/dist/chunks/Feed.es.js +864 -859
  22. package/dist/chunks/FilterErrorActions.es.js +4 -3
  23. package/dist/chunks/Menu.es.js +633 -289
  24. package/dist/chunks/MenuContext.es.js +1 -1
  25. package/dist/chunks/MetaWidget.es.js +2751 -2217
  26. package/dist/chunks/PlayableIcon.es.js +79 -78
  27. package/dist/chunks/ProjectContext.es.js +7 -7
  28. package/dist/chunks/RepresentationsList.es.js +1 -1
  29. package/dist/chunks/ReviewablesSelector.es.js +625 -609
  30. package/dist/chunks/SimpleForm.es.js +1 -1
  31. package/dist/chunks/SimpleTable.es.js +386 -363
  32. package/dist/chunks/Slicer.es.js +954 -821
  33. package/dist/chunks/{DeleteEntitiesContextInstance.es.js → TableExportContextInstance.es.js} +190 -186
  34. package/dist/chunks/TableSettingsFallback.es.js +4 -3
  35. package/dist/chunks/ThumbnailSimple.es.js +96 -95
  36. package/dist/chunks/VideoPlayer.es.js +1 -1
  37. package/dist/chunks/Watchers.es.js +850 -797
  38. package/dist/chunks/getBundleMode.es.js +1 -1
  39. package/dist/chunks/getEntityTypeIcon.es.js +5 -4
  40. package/dist/chunks/getUris.es.js +3704 -3504
  41. package/dist/chunks/realtimeUpdatesUtils.es.js +91 -82
  42. package/dist/chunks/searchTerms.es.js +649 -563
  43. package/dist/chunks/sortLists.es.js +22 -0
  44. package/dist/chunks/useAttributeEnums.es.js +21 -21
  45. package/dist/chunks/useHierarchySelection.es.js +6 -5
  46. package/dist/chunks/useLoadModule.es.js +24 -23
  47. package/dist/chunks/viewUpdateHelper.es.js +19 -18
  48. package/dist/components.es.js +628 -593
  49. package/dist/context.es.js +525 -499
  50. package/dist/hooks.es.js +54 -53
  51. package/dist/index.es.js +4 -4
  52. package/dist/types/ContextMenu.d.ts +4 -1
  53. package/dist/types/Feed.d.ts +1 -1
  54. package/dist/types/ListTable.d.ts +1 -1
  55. package/dist/types/ProjectTreeTable.d.ts +144 -14
  56. package/dist/types/SimpleTable.d.ts +2 -1
  57. package/dist/types/Slicer.d.ts +32 -5
  58. package/dist/types/Views.d.ts +6 -0
  59. package/dist/types/api.d.ts +2252 -510
  60. package/dist/types/components.d.ts +52 -4
  61. package/dist/types/context.d.ts +96 -2
  62. package/dist/types/hooks.d.ts +36 -1
  63. package/dist/types/util.d.ts +54 -0
  64. package/dist/util.es.js +129 -119
  65. package/package.json +4 -4
  66. package/dist/chunks/MenuItem.es.js +0 -420
@@ -1,21 +1,21 @@
1
- import { jsx as d, jsxs as _, Fragment as Ae } from "react/jsx-runtime";
2
- import { useCallback as v, createContext as Ie, useContext as Le, forwardRef as je, useState as Pe, useEffect as ye, useRef as R, useMemo as se } from "react";
3
- import { theme as He, Button as xe, Icon as fe, InputText as Ve, Spacer as Be } from "@ynput/ayon-react-components";
4
- import L from "styled-components";
5
- import { functionalUpdate as he, useReactTable as qe, getExpandedRowModel as Oe, getFilteredRowModel as _e, getCoreRowModel as Qe, flexRender as Je, sortingFns as Ue } from "@tanstack/react-table";
6
- import { useVirtualizer as We } from "@tanstack/react-virtual";
7
- import K from "clsx";
8
- import { compareItems as Ye } from "@tanstack/match-sorter-utils";
1
+ import { jsx as u, jsxs as W, Fragment as Le } from "react/jsx-runtime";
2
+ import { useCallback as w, createContext as je, useContext as Pe, forwardRef as qe, useState as He, useEffect as ce, useRef as v, useMemo as se } from "react";
3
+ import { theme as Ve, Button as ve, Icon as xe, InputText as Be, Spacer as Oe } from "@ynput/ayon-react-components";
4
+ import P from "styled-components";
5
+ import { functionalUpdate as be, useReactTable as _e, getExpandedRowModel as Qe, getFilteredRowModel as Je, getCoreRowModel as Ue, flexRender as We, sortingFns as Ye } from "@tanstack/react-table";
6
+ import { useVirtualizer as Ge } from "@tanstack/react-virtual";
7
+ import M from "clsx";
8
+ import { compareItems as Xe } from "@tanstack/match-sorter-utils";
9
9
  import "lodash";
10
10
  import "primereact/confirmdialog";
11
11
  import "react-toastify";
12
12
  import "uuid";
13
- import { bt as Ge, bu as Xe } from "./searchTerms.es.js";
14
- import { E as Ze } from "./EmptyPlaceholder.es.js";
13
+ import { bE as Ze, bF as et } from "./searchTerms.es.js";
14
+ import { E as tt } from "./EmptyPlaceholder.es.js";
15
15
  import "./ContextMenuContextInstance.es.js";
16
16
  import "primereact-context/contextmenu";
17
- import { u as et } from "./useCreateContextMenu.es.js";
18
- const tt = L.div`
17
+ import { u as nt } from "./useCreateContextMenu.es.js";
18
+ const ot = P.div`
19
19
  display: flex;
20
20
 
21
21
  height: 100%;
@@ -41,7 +41,7 @@ const tt = L.div`
41
41
  font-size: 32px;
42
42
  }
43
43
  h3 {
44
- ${He.titleMedium}
44
+ ${Ve.titleMedium}
45
45
  }
46
46
  }
47
47
 
@@ -71,7 +71,7 @@ const tt = L.div`
71
71
  padding: 1px 0px;
72
72
  width: 100%;
73
73
  }
74
- `, nt = L.div`
74
+ `, rt = P.div`
75
75
  width: 100%;
76
76
  min-height: 32px;
77
77
  user-select: none;
@@ -109,13 +109,15 @@ const tt = L.div`
109
109
  pointer-events: none;
110
110
  }
111
111
 
112
- &:hover {
112
+ &:hover,
113
+ tr[data-context-menu-target] & {
113
114
  background-color: var(--md-sys-color-surface-container-hover);
114
115
  }
115
116
 
116
117
  &.selected {
117
118
  background-color: var(--md-sys-color-primary-container);
118
- &:hover {
119
+ &:hover,
120
+ tr[data-context-menu-target] & {
119
121
  background-color: var(--md-sys-color-primary-container-hover);
120
122
  }
121
123
 
@@ -155,13 +157,24 @@ const tt = L.div`
155
157
  .badges {
156
158
  color: var(--md-sys-color-outline);
157
159
  padding-right: 4px;
160
+
161
+ /* an icon tag, the size of an action button */
162
+ .badge-icon {
163
+ padding: var(--padding-s);
164
+ color: var(--md-sys-color-on-surface);
165
+ }
158
166
  }
159
167
 
160
168
  .actions {
161
- display: flex;
169
+ /* hidden while none of its icons show, so its gap doesn't move the badge */
170
+ display: none;
162
171
  align-items: center;
163
172
  gap: var(--base-gap-small);
164
173
 
174
+ &:has(.icon.show-always, .icon.active) {
175
+ display: flex;
176
+ }
177
+
165
178
  .icon {
166
179
  border-radius: var(--border-radius-m);
167
180
  padding: var(--padding-s);
@@ -185,6 +198,7 @@ const tt = L.div`
185
198
 
186
199
  &:hover {
187
200
  .actions {
201
+ display: flex;
188
202
  .icon:not(.show-hidden) {
189
203
  display: flex;
190
204
  }
@@ -195,6 +209,7 @@ const tt = L.div`
195
209
  }
196
210
 
197
211
  &.pinned {
212
+ .actions,
198
213
  .pin {
199
214
  display: flex;
200
215
  }
@@ -262,7 +277,7 @@ const tt = L.div`
262
277
  border-radius: 2px;
263
278
  }
264
279
  }
265
- `, ot = L(xe)`
280
+ `, at = P(ve)`
266
281
  &.expander {
267
282
  background-color: unset;
268
283
  padding: 2px;
@@ -271,7 +286,7 @@ const tt = L.div`
271
286
  background-color: var(--md-sys-color-surface-container-high-hover);
272
287
  }
273
288
  }
274
- `, Ft = L.div`
289
+ `, Dt = P.div`
275
290
  border-radius: var(--border-radius-m);
276
291
  overflow: hidden;
277
292
  background-color: var(--md-sys-color-surface-container-low);
@@ -281,7 +296,7 @@ const tt = L.div`
281
296
  display: flex;
282
297
  flex-direction: column;
283
298
  position: relative;
284
- `, Nt = L.div`
299
+ `, zt = P.div`
285
300
  padding: 2px;
286
301
  width: 100%;
287
302
  justify-content: space-between;
@@ -292,7 +307,7 @@ const tt = L.div`
292
307
  gap: var(--base-gap-small);
293
308
 
294
309
  border-bottom: 1px solid var(--md-sys-color-outline-variant);
295
- `, Tt = L(xe)`
310
+ `, Tt = P(ve)`
296
311
  background-color: unset !important;
297
312
  z-index: 110;
298
313
  position: relative;
@@ -313,594 +328,602 @@ const tt = L.div`
313
328
  background-color: var(--md-sys-color-surface-container-hover) !important;
314
329
  }
315
330
  `;
316
- function rt({
331
+ function it({
317
332
  handleRowSelect: t,
318
- handleArrowNavigation: a,
333
+ handleArrowNavigation: i,
319
334
  handleRename: l
320
335
  }) {
321
- return { handleRowKeyDown: v(
322
- (n, p) => {
336
+ return { handleRowKeyDown: w(
337
+ (n, g) => {
323
338
  if (["Enter", " "].includes(n.key))
324
- n.preventDefault(), n.stopPropagation(), t(n, p);
339
+ n.preventDefault(), n.stopPropagation(), t(n, g);
325
340
  else if (n.key === "ArrowDown" || n.key === "ArrowUp") {
326
341
  n.preventDefault(), n.stopPropagation();
327
342
  const b = n.key === "ArrowDown" ? "down" : "up";
328
- a?.(b, p, n);
329
- } else n.key.toLowerCase() === "r" && !n.ctrlKey && !n.metaKey && (n.preventDefault(), n.stopPropagation(), l?.(n, p));
343
+ i?.(b, g, n);
344
+ } else n.key.toLowerCase() === "r" && !n.ctrlKey && !n.metaKey && (n.preventDefault(), n.stopPropagation(), l?.(n, g));
330
345
  },
331
- [t, a, l]
346
+ [t, i, l]
332
347
  ) };
333
348
  }
334
- const be = Ie(void 0), at = () => {
335
- const t = Le(be);
349
+ const we = je(void 0), lt = () => {
350
+ const t = Pe(we);
336
351
  if (t === void 0)
337
352
  throw new Error("useSimpleTableContext must be used within a SimpleTableProvider");
338
353
  return t;
339
- }, Dt = ({ children: t, ...a }) => /* @__PURE__ */ d(be.Provider, { value: { ...a }, children: t }), it = ({
354
+ }, At = ({ children: t, ...i }) => /* @__PURE__ */ u(we.Provider, { value: { ...i }, children: t }), st = ({
340
355
  isRowExpandable: t,
341
- isRowExpanded: a,
356
+ isRowExpanded: i,
342
357
  enableNonFolderIndent: l = !0,
343
- isTableExpandable: u,
358
+ isTableExpandable: p,
344
359
  onExpandClick: n
345
- }) => t ? /* @__PURE__ */ d(
346
- ot,
360
+ }) => t ? /* @__PURE__ */ u(
361
+ at,
347
362
  {
348
- onClick: (p) => {
349
- p.stopPropagation(), n?.(p);
363
+ onClick: (g) => {
364
+ g.stopPropagation(), n?.(g);
350
365
  },
351
- icon: a ? "expand_more" : "chevron_right",
366
+ icon: i ? "expand_more" : "chevron_right",
352
367
  className: "expander",
353
368
  style: { cursor: "pointer" }
354
369
  }
355
- ) : u && l && /* @__PURE__ */ d("div", { style: { display: "inline-block", minWidth: 24 } }), lt = je(
370
+ ) : p && l && /* @__PURE__ */ u("div", { style: { display: "inline-block", minWidth: 24 } }), ct = qe(
356
371
  ({
357
372
  value: t,
358
- icon: a,
373
+ icon: i,
359
374
  parents: l,
360
- iconColor: u,
375
+ iconColor: p,
361
376
  iconFilled: n,
362
- img: p,
377
+ img: g,
363
378
  imgShape: b = "square",
364
- imgRatio: x,
365
- imgPosition: M = "start",
366
- isRowExpandable: Q,
367
- isRowExpanded: j,
368
- isTableExpandable: J,
369
- enableNonFolderIndent: U = !0,
370
- onExpandClick: P,
371
- startContent: W,
372
- endContent: H,
373
- badge: C,
374
- actions: F,
375
- isRenaming: E,
376
- renameInitialValue: N,
377
- onSubmitRename: Y,
378
- onCancelRename: V,
379
- renamePlaceholder: G,
380
- depth: k = 0,
381
- isDisabled: X,
382
- disabledMessage: Z,
383
- active: ee,
384
- inactive: T,
385
- style: re,
379
+ imgRatio: h,
380
+ imgPosition: N = "start",
381
+ isRowExpandable: Y,
382
+ isRowExpanded: q,
383
+ isTableExpandable: G,
384
+ enableNonFolderIndent: X = !0,
385
+ onExpandClick: H,
386
+ startContent: R,
387
+ endContent: V,
388
+ badge: k,
389
+ actions: D,
390
+ isRenaming: F,
391
+ renameInitialValue: z,
392
+ onSubmitRename: Z,
393
+ onCancelRename: B,
394
+ renamePlaceholder: ee,
395
+ depth: O = 0,
396
+ isDisabled: K,
397
+ disabledMessage: re,
398
+ active: te,
399
+ inactive: ne,
400
+ style: T,
386
401
  pt: y,
387
- ...te
388
- }, D) => {
389
- const [B, z] = Pe(N ?? t);
390
- ye(() => {
391
- E && z(N ?? t);
392
- }, [t, E, N]);
393
- const S = p ? /* @__PURE__ */ d(
402
+ ..._
403
+ }, ae) => {
404
+ const [Q, J] = He(z ?? t);
405
+ ce(() => {
406
+ F && J(z ?? t);
407
+ }, [t, F, z]);
408
+ const A = g ? /* @__PURE__ */ u(
394
409
  "img",
395
410
  {
396
- src: p,
411
+ src: g,
397
412
  ...y?.img,
398
413
  alt: "",
399
- className: K("image", b, `img-${M}`, y?.img?.className),
414
+ className: M("image", b, `img-${N}`, y?.img?.className),
400
415
  style: {
401
- aspectRatio: (x ?? 1).toString(),
416
+ aspectRatio: (h ?? 1).toString(),
402
417
  ...y?.img?.style
403
418
  }
404
419
  }
405
420
  ) : (
406
421
  // keep the slot so rows don't shift when a thumbnail is missing
407
- x !== void 0 && /* @__PURE__ */ d(
422
+ h !== void 0 && /* @__PURE__ */ u(
408
423
  "div",
409
424
  {
410
- className: K("image", b, `img-${M}`, y?.img?.className),
425
+ className: M("image", b, `img-${N}`, y?.img?.className),
411
426
  style: {
412
- aspectRatio: x.toString(),
427
+ aspectRatio: h.toString(),
413
428
  ...y?.img?.style
414
429
  }
415
430
  }
416
431
  )
417
432
  );
418
- return /* @__PURE__ */ _(
419
- nt,
433
+ return /* @__PURE__ */ W(
434
+ rt,
420
435
  {
421
- ...te,
422
- ref: D,
423
- className: K(te.className, {
424
- disabled: X,
425
- inactive: T || ee === !1,
426
- "has-actions": !!F?.length
436
+ ..._,
437
+ ref: ae,
438
+ className: M(_.className, {
439
+ disabled: K,
440
+ inactive: ne || te === !1,
441
+ "has-actions": !!D?.length
427
442
  }),
428
443
  style: {
429
- ...re,
430
- paddingLeft: `calc(${k * 1.5}rem + 4px)`
444
+ ...T,
445
+ paddingLeft: `calc(${O * 1.5}rem + 4px)`
431
446
  },
432
- title: X ? Z : void 0,
447
+ title: K ? re : void 0,
433
448
  children: [
434
- /* @__PURE__ */ d(
435
- it,
449
+ /* @__PURE__ */ u(
450
+ st,
436
451
  {
437
- isRowExpandable: Q,
438
- isRowExpanded: j,
439
- isTableExpandable: J,
440
- onExpandClick: P,
441
- enableNonFolderIndent: U,
452
+ isRowExpandable: Y,
453
+ isRowExpanded: q,
454
+ isTableExpandable: G,
455
+ onExpandClick: H,
456
+ enableNonFolderIndent: X,
442
457
  ...y?.expander
443
458
  }
444
459
  ),
445
- M === "start" && S,
446
- W,
447
- a && /* @__PURE__ */ d(
448
- fe,
460
+ N === "start" && A,
461
+ R,
462
+ i && /* @__PURE__ */ u(
463
+ xe,
449
464
  {
450
- icon: a,
451
- className: K({ filled: n }, y?.icon?.className),
465
+ icon: i,
466
+ className: M({ filled: n }, y?.icon?.className),
452
467
  style: {
453
- color: u,
468
+ color: p,
454
469
  ...y?.icon?.style
455
470
  },
456
471
  ...y?.icon
457
472
  }
458
473
  ),
459
- E ? /* @__PURE__ */ d(
460
- Ve,
474
+ F ? /* @__PURE__ */ u(
475
+ Be,
461
476
  {
462
477
  autoFocus: !0,
463
478
  style: { flex: 1 },
464
- onChange: (f) => z(f.target.value),
465
- value: B,
466
- placeholder: G,
479
+ onChange: (f) => J(f.target.value),
480
+ value: Q,
481
+ placeholder: ee,
467
482
  onKeyDown: (f) => {
468
- f.key === "Enter" && Y?.(B), f.key === "Escape" && V?.();
483
+ f.key === "Enter" && Z?.(Q), f.key === "Escape" && B?.();
469
484
  },
470
485
  onBlur: () => {
471
- V?.();
486
+ B?.();
472
487
  },
473
488
  onFocus: (f) => {
474
489
  f.target.select();
475
490
  },
476
491
  ...y?.input
477
492
  }
478
- ) : /* @__PURE__ */ _("div", { className: "text", ...y?.text, children: [
479
- l && k === 0 && /* @__PURE__ */ _("span", { className: "path", children: [
493
+ ) : /* @__PURE__ */ W("div", { className: "text", ...y?.text, children: [
494
+ l && O === 0 && /* @__PURE__ */ W("span", { className: "path", children: [
480
495
  l.join(" / "),
481
496
  " / "
482
497
  ] }),
483
- /* @__PURE__ */ d("span", { className: "value", children: t })
498
+ /* @__PURE__ */ u("span", { className: "value", children: t })
484
499
  ] }),
485
- !E && /* @__PURE__ */ _(Ae, { children: [
486
- /* @__PURE__ */ d(Be, { className: "spacer" }),
487
- C?.toString() && /* @__PURE__ */ d("div", { className: "badges", children: typeof C == "string" ? /* @__PURE__ */ d("span", { children: C }) : C }),
488
- F && /* @__PURE__ */ d("div", { className: "actions", children: F.map((f, q) => {
489
- const { show: $ = "hover", ...A } = f;
490
- return $ === "hidden" ? null : /* @__PURE__ */ d(
491
- fe,
500
+ !F && /* @__PURE__ */ W(Le, { children: [
501
+ /* @__PURE__ */ u(Oe, { className: "spacer" }),
502
+ k?.toString() && /* @__PURE__ */ u("div", { className: "badges", children: typeof k == "string" ? /* @__PURE__ */ u("span", { children: k }) : k }),
503
+ D && /* @__PURE__ */ u("div", { className: "actions", children: D.map((f, S) => {
504
+ const { show: $ = "hover", ...E } = f;
505
+ return $ === "hidden" ? null : /* @__PURE__ */ u(
506
+ xe,
492
507
  {
493
- ...A,
494
- className: K(A.className, { "show-always": $ === "always" })
508
+ ...E,
509
+ className: M(E.className, { "show-always": $ === "always" })
495
510
  },
496
- A.icon + q.toString()
511
+ E.icon + S.toString()
497
512
  );
498
513
  }) })
499
514
  ] }),
500
- M === "end" && S,
501
- H && H
515
+ N === "end" && A,
516
+ V && V
502
517
  ]
503
518
  }
504
519
  );
505
520
  }
506
- ), st = (t) => t ? Array.isArray(t) ? t.filter(Boolean) : [t] : [], ve = (t, a) => {
507
- t.toggleExpanded(a), t.subRows.forEach((l) => ve(l, a));
508
- }, we = (t, a, l, u) => {
509
- const n = t.getValue(a);
510
- let p = typeof n == "string" ? n : Array.isArray(n) ? n.join(" ") : JSON.stringify(n);
511
- a === "label" && (p = [t.original.label, t.original.name, ...t.original.parents || []].join(
521
+ ), dt = (t) => t ? Array.isArray(t) ? t.filter(Boolean) : [t] : [], Re = (t, i) => {
522
+ t.toggleExpanded(i), t.subRows.forEach((l) => Re(l, i));
523
+ }, Se = (t, i, l, p) => {
524
+ const n = t.getValue(i);
525
+ let g = typeof n == "string" ? n : Array.isArray(n) ? n.join(" ") : JSON.stringify(n);
526
+ i === "label" && (g = [t.original.label, t.original.name, ...t.original.parents || []].join(
512
527
  " "
513
528
  ));
514
- const b = Ge(p, l);
515
- return u({ itemRank: b }), b.passed;
529
+ const b = Ze(g, l);
530
+ return p({ itemRank: b }), b.passed;
516
531
  };
517
- we.resolveFilterValue = Xe;
518
- const ct = (t, a, l) => {
519
- let u = 0;
520
- return t.columnFiltersMeta[l] && (u = Ye(
532
+ Se.resolveFilterValue = et;
533
+ const ut = (t, i, l) => {
534
+ let p = 0;
535
+ return t.columnFiltersMeta[l] && (p = Xe(
521
536
  t.columnFiltersMeta[l]?.itemRank,
522
- a.columnFiltersMeta[l]?.itemRank
523
- )), u === 0 ? Ue.alphanumeric(t, a, l) : u;
537
+ i.columnFiltersMeta[l]?.itemRank
538
+ )), p === 0 ? Ye.alphanumeric(t, i, l) : p;
524
539
  };
525
- function dt(t, a, l) {
526
- let u = -1, n = -1;
527
- for (let x = 0; x < t.length && (t[x].id === a && (u = x), t[x].id === l && (n = x), !(u !== -1 && n !== -1)); x++)
540
+ function pt(t, i, l) {
541
+ let p = -1, n = -1;
542
+ for (let h = 0; h < t.length && (t[h].id === i && (p = h), t[h].id === l && (n = h), !(p !== -1 && n !== -1)); h++)
528
543
  ;
529
- if (u === -1 || n === -1) return [];
530
- const p = Math.min(u, n), b = Math.max(u, n);
531
- return t.slice(p, b + 1);
544
+ if (p === -1 || n === -1) return [];
545
+ const g = Math.min(p, n), b = Math.max(p, n);
546
+ return t.slice(g, b + 1);
532
547
  }
533
- const zt = ({
548
+ const $t = ({
534
549
  data: t = [],
535
- isLoading: a,
550
+ isLoading: i,
536
551
  error: l,
537
- isExpandable: u,
552
+ isExpandable: p,
538
553
  isMultiSelect: n = !0,
539
- enableClickToDeselect: p = !0,
554
+ enableClickToDeselect: g = !0,
540
555
  enableNonFolderIndent: b = !0,
541
- forceUpdateTable: x,
542
- globalFilter: M,
543
- meta: Q,
544
- rowHeight: j,
545
- imgRatio: J,
546
- imgPosition: U,
547
- onScrollBottom: P,
548
- onRename: W,
549
- renamingId: H,
550
- renameInitialValue: C,
556
+ forceUpdateTable: h,
557
+ globalFilter: N,
558
+ meta: Y,
559
+ rowHeight: q,
560
+ imgRatio: G,
561
+ imgPosition: X,
562
+ onScrollBottom: H,
563
+ scrollToRowId: R,
564
+ onRename: V,
565
+ renamingId: k,
566
+ renameInitialValue: D,
551
567
  onSubmitRename: F,
552
- onCancelRename: E,
553
- onRowDoubleClick: N,
554
- onRowOptionClick: Y,
555
- rowContextMenuBuilders: V = [],
556
- children: G,
557
- pt: k,
558
- fitContent: X,
559
- rowIdPrefix: Z,
560
- ...ee
568
+ onCancelRename: z,
569
+ onRowDoubleClick: Z,
570
+ onRowOptionClick: B,
571
+ rowContextMenuBuilders: ee = [],
572
+ children: O,
573
+ pt: K,
574
+ fitContent: re,
575
+ rowIdPrefix: te,
576
+ ...ne
561
577
  }) => {
562
578
  const {
563
579
  rowSelection: T,
564
- expanded: re,
565
- setExpanded: y,
566
- onExpandedChange: te,
567
- onRowSelectionChange: D,
568
- rowPinning: B,
569
- onRowPinningChange: z
570
- } = at(), S = R(null), f = R(null), q = R(Z);
571
- q.current = Z;
572
- const $ = (e) => q.current ? `${q.current}-${e}` : e, [A] = et(), ce = R(N);
573
- ce.current = N;
574
- const ae = R(H);
575
- ae.current = H;
576
- const de = R(C);
577
- de.current = C;
578
- const ie = R(F);
579
- ie.current = F;
580
- const ue = R(E);
581
- ue.current = E;
582
- const pe = R(W);
583
- pe.current = W;
584
- const Re = se(() => a ? Array.from({ length: 10 }, (e, i) => ({
585
- id: `placeholder-${i}`,
586
- name: `placeholder-${i}`,
587
- label: `placeholder-${i}`,
580
+ expanded: y,
581
+ setExpanded: _,
582
+ onExpandedChange: ae,
583
+ onRowSelectionChange: Q,
584
+ rowPinning: J,
585
+ onRowPinningChange: A
586
+ } = lt(), f = v(null), S = v(null), $ = v(te);
587
+ $.current = te;
588
+ const E = (e) => $.current ? `${$.current}-${e}` : e, [de] = nt(), ue = v(Z);
589
+ ue.current = Z;
590
+ const ie = v(k);
591
+ ie.current = k;
592
+ const pe = v(D);
593
+ pe.current = D;
594
+ const le = v(F);
595
+ le.current = F;
596
+ const ge = v(z);
597
+ ge.current = z;
598
+ const me = v(V);
599
+ me.current = V;
600
+ const Ce = se(() => i ? Array.from({ length: 10 }, (e, r) => ({
601
+ id: `placeholder-${r}`,
602
+ name: `placeholder-${r}`,
603
+ label: `placeholder-${r}`,
588
604
  icon: null,
589
605
  img: null,
590
606
  subRows: [],
591
607
  data: {
592
- id: `placeholder-${i}`
608
+ id: `placeholder-${r}`
593
609
  }
594
- })) : t, [a, t, x]), I = v(
595
- (e, i, r, c) => {
596
- const s = i, g = e.getRowModel(), o = g.rows, w = g.rowsById[s], h = e.getState().rowSelection || {};
597
- if (!w) return { ...h };
598
- if (w.original.isDisabled)
599
- return { ...h };
600
- if (p && !r && !c && Object.keys(h).length === 1 && h[s])
601
- return e.setRowSelection({}), S.current = null, {};
602
- let m;
603
- if (n && r && S.current) {
604
- const ze = S.current, me = dt(o, s, ze);
605
- me.length === 0 ? m = { ...h, [s]: !0 } : (m = { ...h }, me.forEach(($e) => m[$e.id] = !0));
606
- } else n && c ? (m = { ...h }, m[s] ? delete m[s] : m[s] = !0) : (m = { ...h }, Object.keys(m).length === 1 && m[s] || (m = { [s]: !0 }));
607
- return e.setRowSelection(m), S.current = s, m;
610
+ })) : t, [i, t, h]), I = w(
611
+ (e, r, a, d) => {
612
+ const s = r, m = e.getRowModel(), o = m.rows, C = m.rowsById[s], x = e.getState().rowSelection || {};
613
+ if (!C) return { ...x };
614
+ if (C.original.isDisabled)
615
+ return { ...x };
616
+ if (g && !a && !d && Object.keys(x).length === 1 && x[s])
617
+ return e.setRowSelection({}), f.current = null, {};
618
+ let c;
619
+ if (n && a && f.current) {
620
+ const $e = f.current, ye = pt(o, s, $e);
621
+ ye.length === 0 ? c = { ...x, [s]: !0 } : (c = { ...x }, ye.forEach((Ie) => c[Ie.id] = !0));
622
+ } else n && d ? (c = { ...x }, c[s] ? delete c[s] : c[s] = !0) : (c = { ...x }, Object.keys(c).length === 1 && c[s] || (c = { [s]: !0 }));
623
+ return e.setRowSelection(c), f.current = s, c;
608
624
  },
609
- [n, p]
610
- ), Se = v(
611
- (e, i) => {
612
- if (!f.current) {
625
+ [n, g]
626
+ ), Ee = w(
627
+ (e, r) => {
628
+ if (!S.current) {
613
629
  console.warn("tableRef not yet available in handleRowSelectForKeydown");
614
630
  return;
615
631
  }
616
- const r = e.shiftKey, c = e.ctrlKey || e.metaKey;
632
+ const a = e.shiftKey, d = e.ctrlKey || e.metaKey;
617
633
  I(
618
- f.current,
634
+ S.current,
619
635
  // Pass the main table instance
620
- i.id,
621
- r,
622
- c
636
+ r.id,
637
+ a,
638
+ d
623
639
  );
624
640
  },
625
641
  [I]
626
642
  // Depends only on handleSelectionLogic
627
- ), Ce = v(
628
- (e, i, r) => {
629
- if (!f.current) return;
630
- const c = f.current.getRowModel().rows, s = c.findIndex((o) => o.id === i.id);
643
+ ), ke = w(
644
+ (e, r, a) => {
645
+ if (!S.current) return;
646
+ const d = S.current.getRowModel().rows, s = d.findIndex((o) => o.id === r.id);
631
647
  if (s === -1) return;
632
- let g = e === "down" ? s + 1 : s - 1;
633
- if (!(g < 0 || g >= c.length))
634
- for (; g >= 0 && g < c.length; ) {
635
- const o = c[g];
648
+ let m = e === "down" ? s + 1 : s - 1;
649
+ if (!(m < 0 || m >= d.length))
650
+ for (; m >= 0 && m < d.length; ) {
651
+ const o = d[m];
636
652
  if (!o.original.isDisabled) {
637
653
  I(
638
- f.current,
654
+ S.current,
639
655
  o.id,
640
- r.shiftKey,
641
- r.ctrlKey || r.metaKey
656
+ a.shiftKey,
657
+ a.ctrlKey || a.metaKey
642
658
  ), requestAnimationFrame(() => {
643
- const w = le.current, m = (w ? w.querySelector(`#${CSS.escape($(o.id))}`) : document.getElementById($(o.id)))?.querySelector('[tabindex="0"]');
644
- m && (m.focus(), m.scrollIntoView({ block: "nearest", behavior: "smooth" }));
659
+ const C = oe.current, c = (C ? C.querySelector(`#${CSS.escape(E(o.id))}`) : document.getElementById(E(o.id)))?.querySelector('[tabindex="0"]');
660
+ c && (c.focus(), c.scrollIntoView({ block: "nearest", behavior: "smooth" }));
645
661
  });
646
662
  return;
647
663
  }
648
- g = e === "down" ? g + 1 : g - 1;
664
+ m = e === "down" ? m + 1 : m - 1;
649
665
  }
650
666
  },
651
667
  [I]
652
- ), Ee = v(
653
- (e, i) => {
654
- i.original.isDisabled || pe.current?.(i.id, i);
668
+ ), Fe = w(
669
+ (e, r) => {
670
+ r.original.isDisabled || me.current?.(r.id, r);
655
671
  },
656
672
  []
657
673
  // eslint-disable-line react-hooks/exhaustive-deps
658
- ), { handleRowKeyDown: ge } = rt({
659
- handleRowSelect: Se,
660
- handleArrowNavigation: Ce,
661
- handleRename: Ee
662
- }), ke = se(
674
+ ), { handleRowKeyDown: fe } = it({
675
+ handleRowSelect: Ee,
676
+ handleArrowNavigation: ke,
677
+ handleRename: Fe
678
+ }), Ke = se(
663
679
  () => [
664
680
  {
665
681
  accessorKey: "label",
666
682
  header: void 0,
667
683
  filterFn: "fuzzy",
668
- sortingFn: ct,
684
+ sortingFn: ut,
669
685
  //sort by fuzzy rank (falls back to alphanumeric)
670
- cell: ({ row: e, getValue: i, table: r }) => {
671
- const c = r.options.meta, s = (o) => {
686
+ cell: ({ row: e, getValue: r, table: a }) => {
687
+ const d = a.options.meta, s = (o) => {
672
688
  if (o.target instanceof HTMLInputElement || o.target instanceof HTMLButtonElement || o.target instanceof HTMLTextAreaElement || o.target instanceof HTMLSelectElement || o.target instanceof HTMLAnchorElement || o.target.closest("button, a, input, textarea, select"))
673
689
  return;
674
- const h = o.altKey && e.getIsSelected() && !o.shiftKey && !o.ctrlKey && !o.metaKey ? r.getState().rowSelection || {} : I(
675
- r,
690
+ const x = o.altKey && e.getIsSelected() && !o.shiftKey && !o.ctrlKey && !o.metaKey ? a.getState().rowSelection || {} : I(
691
+ a,
676
692
  // Pass the cell's table instance
677
693
  e.id,
678
694
  o.shiftKey,
679
695
  o.ctrlKey || o.metaKey
680
696
  );
681
- o.altKey && Y?.(e.original, Object.keys(h));
682
- }, g = {
683
- className: K({
697
+ o.altKey && B?.(e.original, Object.keys(x));
698
+ }, m = {
699
+ className: M({
684
700
  selected: e.getIsSelected(),
685
- loading: c?.isLoading,
701
+ loading: d?.isLoading,
686
702
  disabled: e.original.isDisabled,
687
703
  // you can't select disabled rows
688
704
  inactive: e.original.inactive
689
705
  // false: archived items but still selectable
690
706
  }),
691
707
  onKeyDown: (o) => {
692
- o.target instanceof HTMLInputElement || ge(o, e);
708
+ o.target instanceof HTMLInputElement || fe(o, e);
693
709
  },
694
710
  depth: e.depth,
695
711
  tabIndex: 0,
696
- value: i(),
712
+ value: r(),
697
713
  parents: e.original.parents,
698
714
  icon: e.original.icon || void 0,
699
715
  iconColor: e.original.iconColor,
700
716
  iconFilled: e.original.iconFilled,
701
717
  img: e.original.img,
702
718
  imgShape: e.original.imgShape,
703
- imgRatio: J,
704
- imgPosition: U,
719
+ imgRatio: G,
720
+ imgPosition: X,
705
721
  isRowExpandable: e.getCanExpand(),
706
722
  enableNonFolderIndent: b,
707
723
  isRowExpanded: e.getIsExpanded(),
708
- isTableExpandable: c?.isExpandable,
724
+ isTableExpandable: d?.isExpandable,
709
725
  onExpandClick: (o) => {
710
- o?.altKey ? ve(e, !e.getIsExpanded()) : e.toggleExpanded();
726
+ o?.altKey ? Re(e, !e.getIsExpanded()) : e.toggleExpanded();
711
727
  },
712
728
  startContent: e.original.startContent,
713
729
  endContent: e.original.endContent,
714
730
  badge: e.original.badge,
715
731
  isDisabled: e.original.isDisabled,
716
732
  disabledMessage: e.original.disabledMessage,
717
- isRenaming: e.id === ae.current,
718
- renameInitialValue: e.id === ae.current ? de.current : void 0,
719
- onSubmitRename: ie.current ? (o) => ie.current(e.id, o) : void 0,
720
- onCancelRename: ue.current,
721
- ...k?.cell,
733
+ isRenaming: e.id === ie.current,
734
+ renameInitialValue: e.id === ie.current ? pe.current : void 0,
735
+ onSubmitRename: le.current ? (o) => le.current(e.id, o) : void 0,
736
+ onCancelRename: ge.current,
737
+ ...K?.cell,
722
738
  onClick: s,
723
739
  // Added onClick handler
724
- onDoubleClick: (o) => ce.current?.(e.id, e)
740
+ onDoubleClick: (o) => ue.current?.(e.id, e)
725
741
  };
726
- return c?.children ? c.children(g, e, r) : /* @__PURE__ */ d(lt, { ...g, ...k?.cell });
742
+ return d?.children ? d.children(m, e, a) : /* @__PURE__ */ u(ct, { ...m, ...K?.cell });
727
743
  }
728
744
  }
729
745
  ],
730
746
  [
731
- x,
747
+ h,
732
748
  I,
733
- ge,
734
- p,
749
+ fe,
750
+ g,
735
751
  b,
736
- J,
737
- U,
738
- Y
752
+ G,
753
+ X,
754
+ B
739
755
  ]
740
- ), Ke = v(
756
+ ), Me = w(
741
757
  (e) => {
742
- D(he(e, T));
758
+ Q(be(e, T));
743
759
  },
744
- [D]
745
- ), Me = v(
760
+ [Q]
761
+ ), Ne = w(
746
762
  (e) => {
747
- z?.(he(e, B || {}));
763
+ A?.(be(e, J || {}));
748
764
  },
749
- [z]
750
- ), Fe = v(
765
+ [A]
766
+ ), De = w(
751
767
  (e) => {
752
- y?.((i) => {
753
- const r = e instanceof Function ? e(i) : e;
754
- return te?.(r), r;
768
+ _?.((r) => {
769
+ const a = e instanceof Function ? e(r) : e;
770
+ return ae?.(a), a;
755
771
  });
756
772
  },
757
- [y]
758
- ), O = qe({
759
- data: Re,
760
- columns: ke,
773
+ [_]
774
+ ), U = _e({
775
+ data: Ce,
776
+ columns: Ke,
761
777
  state: {
762
- expanded: re,
778
+ expanded: y,
763
779
  rowSelection: T,
764
- globalFilter: M,
765
- rowPinning: B
780
+ globalFilter: N,
781
+ rowPinning: J
766
782
  },
767
- onRowSelectionChange: Ke,
768
- onRowPinningChange: Me,
783
+ onRowSelectionChange: Me,
784
+ onRowPinningChange: Ne,
769
785
  filterFns: {
770
- fuzzy: we
786
+ fuzzy: Se
771
787
  },
772
788
  globalFilterFn: "fuzzy",
773
789
  enableRowSelection: !0,
774
790
  //enable row selection for all rows
775
- enableRowPinning: !!z,
791
+ enableRowPinning: !!A,
776
792
  getRowId: (e) => e.id,
777
793
  enableSubRowSelection: !1,
778
794
  //disable sub row selection
779
- onExpandedChange: Fe,
795
+ onExpandedChange: De,
780
796
  getSubRows: (e) => e.subRows,
781
- getCoreRowModel: Qe(),
782
- getFilteredRowModel: _e(),
783
- getExpandedRowModel: Oe(),
797
+ getCoreRowModel: Ue(),
798
+ getFilteredRowModel: Je(),
799
+ getExpandedRowModel: Qe(),
784
800
  filterFromLeafRows: !0,
785
801
  // debugTable: true,
786
802
  // @ts-expect-error: updateData is not required
787
803
  meta: se(
788
804
  () => ({
789
- isExpandable: !!u,
790
- isLoading: a,
791
- children: G,
792
- ...Q
805
+ isExpandable: !!p,
806
+ isLoading: i,
807
+ children: O,
808
+ ...Y
793
809
  }),
794
- [u, a, G, Q]
810
+ [p, i, O, Y]
795
811
  )
796
812
  });
797
- ye(() => {
798
- f.current = O;
799
- }, [O]);
800
- const { rows: ne } = O.getRowModel(), Ne = v(
801
- (e, i, r) => {
802
- if (!f.current) return;
803
- const c = ne[i];
804
- if (!c || c.original === void 0) return;
805
- r.preventDefault(), r.stopPropagation();
806
- const s = Object.keys(T), g = s.includes(e) ? s : [e];
807
- if (!s.includes(e)) {
808
- const w = { [e]: !0 };
809
- D?.(w);
810
- }
811
- const o = V.flatMap(
812
- (w) => st(
813
- w(r, {
813
+ ce(() => {
814
+ S.current = U;
815
+ }, [U]);
816
+ const { rows: L } = U.getRowModel(), ze = w(
817
+ (e, r, a) => {
818
+ if (!S.current) return;
819
+ const d = L[r];
820
+ if (!d || d.original === void 0) return;
821
+ a.preventDefault(), a.stopPropagation();
822
+ const s = Object.keys(T), m = s.includes(e), o = m ? s : [e], C = ee.flatMap(
823
+ (x) => dt(
824
+ x(a, {
814
825
  rowId: e,
815
- rowIndex: i,
816
- row: c,
817
- selectedRows: g,
818
- selectedTableRows: g.map((h) => O.getRowModel().rowsById[h]).filter((h) => !!h),
819
- isSelected: g.includes(e)
826
+ rowIndex: r,
827
+ row: d,
828
+ selectedRows: o,
829
+ selectedTableRows: o.map((c) => U.getRowModel().rowsById[c]).filter((c) => !!c),
830
+ isSelected: m
820
831
  })
821
832
  )
822
833
  );
823
- o.length > 0 && A(r, o);
834
+ C.length > 0 && de(a, C);
824
835
  },
825
- [V, ne, T, D, A]
826
- ), le = R(null), oe = We({
827
- count: ne.length,
828
- estimateSize: () => j || 34,
836
+ [ee, L, T, de]
837
+ ), oe = v(null), j = Ge({
838
+ count: L.length,
839
+ estimateSize: () => q || 34,
829
840
  //estimate row height for accurate scrollbar dragging
830
- getScrollElement: () => le.current,
841
+ getScrollElement: () => oe.current,
831
842
  //measure dynamic row height, except in firefox because it measures table border height incorrectly
832
- measureElement: j ? () => j : typeof window < "u" && navigator.userAgent.indexOf("Firefox") === -1 ? (e) => e?.getBoundingClientRect().height : void 0,
843
+ measureElement: q ? () => q : typeof window < "u" && navigator.userAgent.indexOf("Firefox") === -1 ? (e) => e?.getBoundingClientRect().height : void 0,
833
844
  overscan: 5
834
- }), Te = v(
845
+ }), he = v(void 0);
846
+ ce(() => {
847
+ if (!R || he.current === R) return;
848
+ const e = L.findIndex((r) => r.id === R);
849
+ e < 0 || (he.current = R, f.current = R, j.scrollToIndex(e, { align: "center" }), requestAnimationFrame(
850
+ () => requestAnimationFrame(() => {
851
+ oe.current?.querySelector(
852
+ `#${CSS.escape(E(R))}`
853
+ )?.querySelector('[tabindex="0"]')?.focus({ preventScroll: !0 });
854
+ })
855
+ ));
856
+ }, [R, L, j]);
857
+ const Te = w(
835
858
  (e) => {
836
- e && oe.measureElement(e);
859
+ e && j.measureElement(e);
837
860
  },
838
- [oe]
839
- ), De = v(
861
+ [j]
862
+ ), Ae = w(
840
863
  (e) => {
841
- if (!P) return;
842
- const i = e.currentTarget, { scrollTop: r, scrollHeight: c, clientHeight: s } = i;
843
- c - r - s < 100 && !a && P();
864
+ if (!H) return;
865
+ const r = e.currentTarget, { scrollTop: a, scrollHeight: d, clientHeight: s } = r;
866
+ d - a - s < 100 && !i && H();
844
867
  },
845
- [P, a]
868
+ [H, i]
846
869
  );
847
- return /* @__PURE__ */ _(
848
- tt,
870
+ return /* @__PURE__ */ W(
871
+ ot,
849
872
  {
850
- ref: le,
851
- onScroll: De,
873
+ ref: oe,
874
+ onScroll: Ae,
852
875
  onClick: (e) => {
853
- p && !e.target.closest("tr") && (O.setRowSelection({}), S.current = null);
876
+ g && !e.target.closest("tr") && (U.setRowSelection({}), f.current = null);
854
877
  },
855
- ...ee,
856
- className: K(ee.className, { isLoading: a, fitContent: X }),
878
+ ...ne,
879
+ className: M(ne.className, { isLoading: i, fitContent: re }),
857
880
  children: [
858
- !l && /* @__PURE__ */ d("table", { children: /* @__PURE__ */ d(
881
+ !l && /* @__PURE__ */ u("table", { children: /* @__PURE__ */ u(
859
882
  "tbody",
860
883
  {
861
884
  style: {
862
- height: `${oe?.getTotalSize()}px`
885
+ height: `${j?.getTotalSize()}px`
863
886
  //tells scrollbar how big the table is
864
887
  },
865
- children: oe?.getVirtualItems().map((e) => {
866
- const i = ne[e.index];
867
- return /* @__PURE__ */ d(
888
+ children: j?.getVirtualItems().map((e) => {
889
+ const r = L[e.index];
890
+ return /* @__PURE__ */ u(
868
891
  "tr",
869
892
  {
870
893
  "data-index": e.index,
871
894
  ref: Te,
872
- id: $(i.id),
873
- onContextMenu: (r) => Ne(i.id, e.index, r),
874
- ...k?.row,
895
+ id: E(r.id),
896
+ onContextMenu: (a) => ze(r.id, e.index, a),
897
+ ...K?.row,
875
898
  style: {
876
899
  transform: `translateY(${e.start}px)`,
877
900
  //this should always be a `style` as it changes on scroll
878
- ...k?.row?.style
901
+ ...K?.row?.style
879
902
  // custom styles to be passed
880
903
  },
881
- children: i.getVisibleCells().map((r) => /* @__PURE__ */ d("td", { children: Je(r.column.columnDef.cell, r.getContext()) }, r.id))
904
+ children: r.getVisibleCells().map((a) => /* @__PURE__ */ u("td", { children: We(a.column.columnDef.cell, a.getContext()) }, a.id))
882
905
  },
883
- i.id
906
+ r.id
884
907
  );
885
908
  })
886
909
  }
887
910
  ) }),
888
- !!l && /* @__PURE__ */ d(Ze, { error: l })
911
+ !!l && /* @__PURE__ */ u(tt, { error: l })
889
912
  ]
890
913
  }
891
914
  );
892
915
  };
893
916
  export {
894
- nt as C,
895
- ot as E,
896
- Nt as H,
897
- it as R,
898
- zt as S,
899
- tt as T,
900
- Ft as a,
917
+ rt as C,
918
+ at as E,
919
+ zt as H,
920
+ st as R,
921
+ $t as S,
922
+ ot as T,
923
+ Dt as a,
901
924
  Tt as b,
902
- lt as c,
903
- be as d,
904
- Dt as e,
905
- at as u
925
+ ct as c,
926
+ we as d,
927
+ At as e,
928
+ lt as u
906
929
  };