@box/metadata-view 1.25.2 → 1.26.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.
- package/dist/chunks/index.js +68 -65
- package/dist/esm/lib/components/metadata-table/metadata-table.js +15 -16
- package/dist/esm/lib/components/metadata-table/table-body/table-body-with-data.js +130 -128
- package/dist/styles/index.css +1 -1
- package/dist/types/lib/components/metadata-table/table-renderer.d.ts +1 -1
- package/package.json +5 -5
package/dist/chunks/index.js
CHANGED
|
@@ -1,102 +1,105 @@
|
|
|
1
|
-
import { Row as
|
|
2
|
-
import
|
|
3
|
-
import { ItemTypeIcon as
|
|
4
|
-
import
|
|
1
|
+
import { Row as y, Cell as s, Text as d, ActionCell as U } from "@box/blueprint-web";
|
|
2
|
+
import h from "lodash/get";
|
|
3
|
+
import { ItemTypeIcon as p } from "@box/item-icon";
|
|
4
|
+
import C from "clsx";
|
|
5
5
|
import { I as n } from "./types.js";
|
|
6
|
-
import { THUMBNAIL_LIST_VIEW_HEIGHTS as
|
|
7
|
-
import { jsxs as
|
|
8
|
-
import { ItemActionMenu as
|
|
9
|
-
import '../styles/index.css';const
|
|
10
|
-
tableHeaderActionsWrapper:
|
|
11
|
-
tableHeaderActions:
|
|
12
|
-
tableRow:
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
6
|
+
import { THUMBNAIL_LIST_VIEW_HEIGHTS as k } from "../esm/lib/components/constants.js";
|
|
7
|
+
import { jsxs as _, jsx as e } from "react/jsx-runtime";
|
|
8
|
+
import { ItemActionMenu as B } from "../esm/lib/components/item-action-menu/item-action-menu.js";
|
|
9
|
+
import '../styles/index.css';const W = "_tableHeaderActionsWrapper_1sntd_1", g = "_tableHeaderActions_1sntd_1", j = "_tableRow_1sntd_33", M = "_isClickable_1sntd_41", $ = "_selectAllCheckbox_1sntd_45", v = "_tableNameCell_1sntd_50", O = "_tableNameCellTitle_1sntd_56", R = "_hasSubtitle_1sntd_60", w = "_tableNameCellText_1sntd_65", D = "_tableNameCellIconInline_1sntd_70", G = "_iconCell_1sntd_74", t = {
|
|
10
|
+
tableHeaderActionsWrapper: W,
|
|
11
|
+
tableHeaderActions: g,
|
|
12
|
+
tableRow: j,
|
|
13
|
+
isClickable: M,
|
|
14
|
+
selectAllCheckbox: $,
|
|
15
|
+
tableNameCell: v,
|
|
16
|
+
tableNameCellTitle: O,
|
|
17
|
+
hasSubtitle: R,
|
|
18
|
+
tableNameCellText: w,
|
|
19
|
+
tableNameCellIconInline: D,
|
|
20
|
+
iconCell: G
|
|
21
|
+
}, Z = ({
|
|
22
|
+
areSelectionCheckboxesDisabled: T,
|
|
23
|
+
columns: x,
|
|
23
24
|
iconColumnVariant: a,
|
|
24
25
|
item: l,
|
|
25
|
-
itemActionMenuProps:
|
|
26
|
-
onTableRowClick:
|
|
27
|
-
shouldRenderActionColumn:
|
|
28
|
-
zoomLevel:
|
|
29
|
-
}) => /* @__PURE__ */
|
|
30
|
-
className: t.tableRow,
|
|
26
|
+
itemActionMenuProps: b,
|
|
27
|
+
onTableRowClick: c,
|
|
28
|
+
shouldRenderActionColumn: u,
|
|
29
|
+
zoomLevel: f = 0
|
|
30
|
+
}) => /* @__PURE__ */ _(y, {
|
|
31
|
+
className: C(t.tableRow, {
|
|
32
|
+
[t.isClickable]: c
|
|
33
|
+
}),
|
|
31
34
|
id: l.id,
|
|
32
|
-
onAction: () =>
|
|
35
|
+
onAction: () => c == null ? void 0 : c(l),
|
|
33
36
|
children: [a === n.COLUMN ? /* @__PURE__ */ e(s, {
|
|
34
37
|
style: {
|
|
35
|
-
height:
|
|
38
|
+
height: k[f]
|
|
36
39
|
},
|
|
37
|
-
children: /* @__PURE__ */ e(
|
|
40
|
+
children: /* @__PURE__ */ e(p, {
|
|
38
41
|
className: t.iconCell,
|
|
39
42
|
item: l
|
|
40
43
|
})
|
|
41
|
-
}, `item-type-icon-${l.id}`) : null,
|
|
44
|
+
}, `item-type-icon-${l.id}`) : null, x.map((o) => {
|
|
42
45
|
const {
|
|
43
|
-
cellRenderer:
|
|
44
|
-
id:
|
|
45
|
-
isItemMetadata:
|
|
46
|
-
subtitle:
|
|
47
|
-
textValue:
|
|
48
|
-
type:
|
|
49
|
-
} =
|
|
50
|
-
if (
|
|
46
|
+
cellRenderer: m,
|
|
47
|
+
id: r,
|
|
48
|
+
isItemMetadata: A,
|
|
49
|
+
subtitle: L,
|
|
50
|
+
textValue: S,
|
|
51
|
+
type: E
|
|
52
|
+
} = o, i = `${S}-${l.id}`;
|
|
53
|
+
if (m)
|
|
51
54
|
return /* @__PURE__ */ e(s, {
|
|
52
|
-
children:
|
|
53
|
-
},
|
|
54
|
-
const
|
|
55
|
-
if (
|
|
55
|
+
children: m(l, o)
|
|
56
|
+
}, i);
|
|
57
|
+
const H = A ? r.split(".")[1] : r, N = h(l, H);
|
|
58
|
+
if (r === "name" && (a === n.INLINE || a === n.INLINE_SUBTITLE))
|
|
56
59
|
return /* @__PURE__ */ e(s, {
|
|
57
|
-
children: /* @__PURE__ */
|
|
60
|
+
children: /* @__PURE__ */ _("div", {
|
|
58
61
|
className: t.tableNameCell,
|
|
59
|
-
children: [/* @__PURE__ */ e(
|
|
62
|
+
children: [/* @__PURE__ */ e(p, {
|
|
60
63
|
item: l
|
|
61
|
-
}), /* @__PURE__ */
|
|
62
|
-
className:
|
|
64
|
+
}), /* @__PURE__ */ _("div", {
|
|
65
|
+
className: C(t.tableNameCellTitle, {
|
|
63
66
|
[t.hasSubtitle]: a === n.INLINE_SUBTITLE
|
|
64
67
|
}),
|
|
65
|
-
children: [/* @__PURE__ */ e(
|
|
68
|
+
children: [/* @__PURE__ */ e(d, {
|
|
66
69
|
as: "span",
|
|
67
70
|
className: t.tableNameCellText,
|
|
68
|
-
children:
|
|
69
|
-
}), a === n.INLINE_SUBTITLE ? /* @__PURE__ */ e(
|
|
71
|
+
children: N
|
|
72
|
+
}), a === n.INLINE_SUBTITLE ? /* @__PURE__ */ e(d, {
|
|
70
73
|
as: "span",
|
|
71
74
|
className: t.tableNameCellText,
|
|
72
75
|
color: "textOnLightSecondary",
|
|
73
|
-
children:
|
|
76
|
+
children: L
|
|
74
77
|
}) : null]
|
|
75
78
|
})]
|
|
76
79
|
})
|
|
77
|
-
},
|
|
78
|
-
if (
|
|
79
|
-
const
|
|
80
|
+
}, i);
|
|
81
|
+
if (E === "multiSelect") {
|
|
82
|
+
const I = h(l, r);
|
|
80
83
|
return /* @__PURE__ */ e(s, {
|
|
81
|
-
children:
|
|
82
|
-
},
|
|
84
|
+
children: I ? I.join(" ") : ""
|
|
85
|
+
}, i);
|
|
83
86
|
}
|
|
84
87
|
return /* @__PURE__ */ e(s, {
|
|
85
|
-
children: /* @__PURE__ */ e(
|
|
88
|
+
children: /* @__PURE__ */ e(d, {
|
|
86
89
|
as: "span",
|
|
87
|
-
children:
|
|
90
|
+
children: N
|
|
88
91
|
})
|
|
89
|
-
},
|
|
90
|
-
}),
|
|
91
|
-
isCheckboxDisabled:
|
|
92
|
-
children: (
|
|
93
|
-
...
|
|
92
|
+
}, i);
|
|
93
|
+
}), u && /* @__PURE__ */ e(U, {
|
|
94
|
+
isCheckboxDisabled: T,
|
|
95
|
+
children: (o) => b ? /* @__PURE__ */ e(B, {
|
|
96
|
+
...b,
|
|
94
97
|
item: l,
|
|
95
|
-
onOpenChange:
|
|
98
|
+
onOpenChange: o
|
|
96
99
|
}) : null
|
|
97
100
|
})]
|
|
98
101
|
}, l.id);
|
|
99
102
|
export {
|
|
100
|
-
|
|
103
|
+
Z as T,
|
|
101
104
|
t as s
|
|
102
105
|
};
|
|
@@ -1,17 +1,16 @@
|
|
|
1
1
|
import { useRef as v } from "react";
|
|
2
2
|
import { useIntl as B } from "react-intl";
|
|
3
3
|
import { Text as O, ListCheckbox as Z, DataTableWrapper as _, TableHeader as q, Column as E } from "@box/blueprint-web";
|
|
4
|
-
import F from "
|
|
5
|
-
import { useInfiniteScrollTableItems as G } from "./hooks/useInfiniteScrollTableItems.js";
|
|
4
|
+
import { useInfiniteScrollTableItems as F } from "./hooks/useInfiniteScrollTableItems.js";
|
|
6
5
|
import { TableRenderer as R } from "./table-renderer.js";
|
|
7
|
-
import { I as
|
|
8
|
-
import { THUMBNAIL_WIDTHS as
|
|
6
|
+
import { I as G } from "../../../../chunks/types.js";
|
|
7
|
+
import { THUMBNAIL_WIDTHS as J } from "../constants.js";
|
|
9
8
|
import { s as i } from "../../../../chunks/index.js";
|
|
10
|
-
import { getShouldRenderActionColumn as
|
|
11
|
-
import
|
|
12
|
-
import { jsx as t, jsxs as
|
|
9
|
+
import { getShouldRenderActionColumn as K } from "./actionColumn.js";
|
|
10
|
+
import Q from "./messages.js";
|
|
11
|
+
import { jsx as t, jsxs as X } from "react/jsx-runtime";
|
|
13
12
|
import "./table-body/inline-editing-cell/inline-editing-cell.js";
|
|
14
|
-
const
|
|
13
|
+
const ie = ({
|
|
15
14
|
areSelectionCheckboxesDisabled: n = !1,
|
|
16
15
|
columns: m,
|
|
17
16
|
hasNextPage: b = !1,
|
|
@@ -25,7 +24,7 @@ const me = ({
|
|
|
25
24
|
minActionColumnWidth: w,
|
|
26
25
|
onGetNextPage: C,
|
|
27
26
|
onInlineEditChange: S,
|
|
28
|
-
onTableRowClick: N
|
|
27
|
+
onTableRowClick: N,
|
|
29
28
|
placeholderRowsCount: g,
|
|
30
29
|
zoomLevel: a,
|
|
31
30
|
...l
|
|
@@ -35,7 +34,7 @@ const me = ({
|
|
|
35
34
|
} = B(), p = v(null), {
|
|
36
35
|
virtualItemsToDisplay: y,
|
|
37
36
|
totalVirtualSize: D
|
|
38
|
-
} =
|
|
37
|
+
} = F({
|
|
39
38
|
items: c,
|
|
40
39
|
hasNextPage: b,
|
|
41
40
|
isLoading: s,
|
|
@@ -43,9 +42,9 @@ const me = ({
|
|
|
43
42
|
onGetNextPage: C,
|
|
44
43
|
placeholderRowsCount: g
|
|
45
44
|
}), r = [], M = 0;
|
|
46
|
-
if (d ===
|
|
45
|
+
if (d === G.COLUMN) {
|
|
47
46
|
a = a || M;
|
|
48
|
-
const e = parseInt(
|
|
47
|
+
const e = parseInt(J[a], 10) + 24;
|
|
49
48
|
r.push({
|
|
50
49
|
id: "item-type-icon",
|
|
51
50
|
isRowHeader: !1,
|
|
@@ -75,13 +74,13 @@ const me = ({
|
|
|
75
74
|
allowsSorting: I !== "multiSelect" && I !== "enum"
|
|
76
75
|
};
|
|
77
76
|
});
|
|
78
|
-
r.push(...j),
|
|
77
|
+
r.push(...j), K(l) && r.push({
|
|
79
78
|
id: "actions",
|
|
80
79
|
className: i.tableHeaderActions,
|
|
81
|
-
children: /* @__PURE__ */
|
|
80
|
+
children: /* @__PURE__ */ X("div", {
|
|
82
81
|
className: i.tableHeaderActionsWrapper,
|
|
83
82
|
children: [l.HeaderActions, W ? /* @__PURE__ */ t(Z, {
|
|
84
|
-
"aria-label": f(
|
|
83
|
+
"aria-label": f(Q.selectAll),
|
|
85
84
|
className: i.selectAllCheckbox,
|
|
86
85
|
isDisabled: s || n
|
|
87
86
|
}) : null]
|
|
@@ -124,5 +123,5 @@ const me = ({
|
|
|
124
123
|
});
|
|
125
124
|
};
|
|
126
125
|
export {
|
|
127
|
-
|
|
126
|
+
ie as MetadataTable
|
|
128
127
|
};
|
|
@@ -1,212 +1,214 @@
|
|
|
1
|
-
import { TableBody as
|
|
2
|
-
import { ItemTypeIcon as
|
|
3
|
-
import
|
|
4
|
-
import
|
|
1
|
+
import { TableBody as E, Row as u, Cell as f, ActionCell as W, Text as g } from "@box/blueprint-web";
|
|
2
|
+
import { ItemTypeIcon as b } from "@box/item-icon";
|
|
3
|
+
import L from "clsx";
|
|
4
|
+
import S from "lodash/get";
|
|
5
5
|
import h from "react";
|
|
6
6
|
import { I as p } from "../../../../../chunks/types.js";
|
|
7
|
-
import { THUMBNAIL_LIST_VIEW_HEIGHTS as
|
|
8
|
-
import { s as
|
|
9
|
-
import { jsxs as
|
|
10
|
-
import { InlineEditingCell as
|
|
11
|
-
import { ItemActionMenu as
|
|
12
|
-
import { GhostTableRow as
|
|
13
|
-
const
|
|
14
|
-
const
|
|
15
|
-
return
|
|
16
|
-
},
|
|
7
|
+
import { THUMBNAIL_LIST_VIEW_HEIGHTS as j } from "../../constants.js";
|
|
8
|
+
import { s as i, T as G } from "../../../../../chunks/index.js";
|
|
9
|
+
import { jsxs as $, jsx as t } from "react/jsx-runtime";
|
|
10
|
+
import { InlineEditingCell as H } from "./inline-editing-cell/inline-editing-cell.js";
|
|
11
|
+
import { ItemActionMenu as w } from "../../item-action-menu/item-action-menu.js";
|
|
12
|
+
import { GhostTableRow as A } from "./ghost-table-row/ghost-table-row.js";
|
|
13
|
+
const B = (e, n, r) => {
|
|
14
|
+
const s = r ? n.split(".")[1] : n;
|
|
15
|
+
return S(e, s);
|
|
16
|
+
}, R = /* @__PURE__ */ h.memo(({
|
|
17
17
|
column: e,
|
|
18
18
|
iconColumnVariant: n,
|
|
19
|
-
item:
|
|
19
|
+
item: r
|
|
20
20
|
}) => {
|
|
21
21
|
const {
|
|
22
|
-
id:
|
|
23
|
-
isItemMetadata:
|
|
24
|
-
subtitle:
|
|
22
|
+
id: s,
|
|
23
|
+
isItemMetadata: d,
|
|
24
|
+
subtitle: c,
|
|
25
25
|
textValue: m
|
|
26
|
-
} = e,
|
|
26
|
+
} = e, a = `${m}-${r.id}`;
|
|
27
27
|
return /* @__PURE__ */ t(f, {
|
|
28
|
-
children: /* @__PURE__ */
|
|
29
|
-
className:
|
|
30
|
-
children: [/* @__PURE__ */ t(
|
|
31
|
-
className:
|
|
32
|
-
item:
|
|
33
|
-
}), /* @__PURE__ */
|
|
34
|
-
className:
|
|
35
|
-
[
|
|
28
|
+
children: /* @__PURE__ */ $("div", {
|
|
29
|
+
className: i.tableNameCell,
|
|
30
|
+
children: [/* @__PURE__ */ t(b, {
|
|
31
|
+
className: i.tableNameCellIconInline,
|
|
32
|
+
item: r
|
|
33
|
+
}), /* @__PURE__ */ $("div", {
|
|
34
|
+
className: L(i.tableNameCellTitle, {
|
|
35
|
+
[i.hasSubtitle]: n === p.INLINE_SUBTITLE
|
|
36
36
|
}),
|
|
37
|
-
children: [/* @__PURE__ */ t(
|
|
37
|
+
children: [/* @__PURE__ */ t(g, {
|
|
38
38
|
as: "span",
|
|
39
|
-
className:
|
|
40
|
-
children:
|
|
41
|
-
}), n === p.INLINE_SUBTITLE && /* @__PURE__ */ t(
|
|
39
|
+
className: i.tableNameCellText,
|
|
40
|
+
children: B(r, s, d)
|
|
41
|
+
}), n === p.INLINE_SUBTITLE && /* @__PURE__ */ t(g, {
|
|
42
42
|
as: "span",
|
|
43
|
-
className:
|
|
43
|
+
className: i.tableNameCellText,
|
|
44
44
|
color: "textOnLightSecondary",
|
|
45
|
-
children:
|
|
45
|
+
children: c
|
|
46
46
|
})]
|
|
47
47
|
})]
|
|
48
48
|
})
|
|
49
|
-
},
|
|
50
|
-
}),
|
|
49
|
+
}, a);
|
|
50
|
+
}), F = /* @__PURE__ */ h.memo(({
|
|
51
51
|
column: e,
|
|
52
52
|
item: n
|
|
53
53
|
}) => {
|
|
54
|
-
var
|
|
55
|
-
const
|
|
54
|
+
var s;
|
|
55
|
+
const r = `${e.textValue}-${n.id}`;
|
|
56
56
|
return /* @__PURE__ */ t(f, {
|
|
57
|
-
children: (
|
|
58
|
-
},
|
|
59
|
-
}),
|
|
57
|
+
children: (s = e.cellRenderer) == null ? void 0 : s.call(e, n, e)
|
|
58
|
+
}, r);
|
|
59
|
+
}), K = /* @__PURE__ */ h.memo(({
|
|
60
60
|
column: e,
|
|
61
61
|
item: n
|
|
62
62
|
}) => {
|
|
63
|
-
const
|
|
64
|
-
return
|
|
65
|
-
children:
|
|
66
|
-
},
|
|
67
|
-
}),
|
|
63
|
+
const r = `${e.textValue}-${n.id}`, s = S(n, e.id);
|
|
64
|
+
return s ? /* @__PURE__ */ t(f, {
|
|
65
|
+
children: s.join(" ")
|
|
66
|
+
}, r) : /* @__PURE__ */ t(f, {}, r);
|
|
67
|
+
}), k = /* @__PURE__ */ h.memo(({
|
|
68
68
|
column: e,
|
|
69
69
|
item: n
|
|
70
70
|
}) => {
|
|
71
71
|
const {
|
|
72
|
-
id:
|
|
73
|
-
isItemMetadata:
|
|
74
|
-
textValue:
|
|
75
|
-
} = e,
|
|
72
|
+
id: r,
|
|
73
|
+
isItemMetadata: s,
|
|
74
|
+
textValue: d
|
|
75
|
+
} = e, c = `${d}-${n.id}`;
|
|
76
76
|
return /* @__PURE__ */ t(f, {
|
|
77
|
-
children: /* @__PURE__ */ t(
|
|
77
|
+
children: /* @__PURE__ */ t(g, {
|
|
78
78
|
as: "span",
|
|
79
|
-
children:
|
|
79
|
+
children: B(n, r, s)
|
|
80
80
|
})
|
|
81
|
-
},
|
|
81
|
+
}, c);
|
|
82
82
|
}), q = /* @__PURE__ */ h.memo(({
|
|
83
83
|
column: e,
|
|
84
84
|
iconColumnVariant: n,
|
|
85
|
-
item:
|
|
86
|
-
onInlineEditChange:
|
|
85
|
+
item: r,
|
|
86
|
+
onInlineEditChange: s
|
|
87
87
|
}) => {
|
|
88
88
|
const {
|
|
89
|
-
cellRenderer:
|
|
90
|
-
id:
|
|
89
|
+
cellRenderer: d,
|
|
90
|
+
id: c,
|
|
91
91
|
isInlineEditingEnabled: m,
|
|
92
|
-
type:
|
|
93
|
-
} = e, N =
|
|
94
|
-
return
|
|
92
|
+
type: a
|
|
93
|
+
} = e, N = c === "item.name" && (n === p.INLINE || n === p.INLINE_SUBTITLE);
|
|
94
|
+
return d ? /* @__PURE__ */ t(F, {
|
|
95
95
|
column: e,
|
|
96
|
-
item:
|
|
97
|
-
}) : N ? /* @__PURE__ */ t(
|
|
96
|
+
item: r
|
|
97
|
+
}) : N ? /* @__PURE__ */ t(R, {
|
|
98
98
|
column: e,
|
|
99
99
|
iconColumnVariant: n,
|
|
100
|
-
item:
|
|
101
|
-
}) : m && (
|
|
100
|
+
item: r
|
|
101
|
+
}) : m && (a === "multiSelect" || a === "enum") ? /* @__PURE__ */ t(H, {
|
|
102
102
|
column: e,
|
|
103
|
-
item:
|
|
104
|
-
onInlineEditChange:
|
|
105
|
-
}, `${e.id}-${
|
|
103
|
+
item: r,
|
|
104
|
+
onInlineEditChange: s
|
|
105
|
+
}, `${e.id}-${r.id}`) : a === "multiSelect" ? /* @__PURE__ */ t(K, {
|
|
106
106
|
column: e,
|
|
107
|
-
item:
|
|
108
|
-
}) : /* @__PURE__ */ t(
|
|
107
|
+
item: r
|
|
108
|
+
}) : /* @__PURE__ */ t(k, {
|
|
109
109
|
column: e,
|
|
110
|
-
item:
|
|
110
|
+
item: r
|
|
111
111
|
});
|
|
112
112
|
}), J = /* @__PURE__ */ h.memo(({
|
|
113
113
|
item: e,
|
|
114
114
|
zoomLevel: n
|
|
115
115
|
}) => /* @__PURE__ */ t(f, {
|
|
116
116
|
style: {
|
|
117
|
-
height:
|
|
117
|
+
height: j[n]
|
|
118
118
|
},
|
|
119
|
-
children: /* @__PURE__ */ t(
|
|
120
|
-
className:
|
|
119
|
+
children: /* @__PURE__ */ t(b, {
|
|
120
|
+
className: i.iconCell,
|
|
121
121
|
item: e
|
|
122
122
|
})
|
|
123
123
|
}, `item-type-icon-${e.id}`)), Q = /* @__PURE__ */ h.memo(({
|
|
124
124
|
item: e,
|
|
125
125
|
itemActionMenuProps: n,
|
|
126
|
-
isCheckboxDisabled:
|
|
127
|
-
}) => /* @__PURE__ */ t(
|
|
128
|
-
isCheckboxDisabled:
|
|
129
|
-
children: (
|
|
126
|
+
isCheckboxDisabled: r
|
|
127
|
+
}) => /* @__PURE__ */ t(W, {
|
|
128
|
+
isCheckboxDisabled: r,
|
|
129
|
+
children: (s) => n ? /* @__PURE__ */ t(w, {
|
|
130
130
|
...n,
|
|
131
131
|
item: e,
|
|
132
|
-
onOpenChange:
|
|
132
|
+
onOpenChange: s
|
|
133
133
|
}) : null
|
|
134
|
-
})),
|
|
134
|
+
})), le = ({
|
|
135
135
|
areSelectionCheckboxesDisabled: e,
|
|
136
136
|
columnCount: n,
|
|
137
|
-
columns:
|
|
138
|
-
iconColumnVariant:
|
|
139
|
-
items:
|
|
140
|
-
itemActionMenuProps:
|
|
137
|
+
columns: r,
|
|
138
|
+
iconColumnVariant: s,
|
|
139
|
+
items: d,
|
|
140
|
+
itemActionMenuProps: c,
|
|
141
141
|
onInlineEditChange: m,
|
|
142
|
-
onTableRowClick:
|
|
142
|
+
onTableRowClick: a,
|
|
143
143
|
shouldRenderActionColumn: N,
|
|
144
144
|
virtualItems: I,
|
|
145
|
-
totalVirtualSize:
|
|
146
|
-
zoomLevel:
|
|
145
|
+
totalVirtualSize: M,
|
|
146
|
+
zoomLevel: x
|
|
147
147
|
}) => {
|
|
148
|
-
const
|
|
148
|
+
const O = s === p.COLUMN;
|
|
149
149
|
if (I) {
|
|
150
|
-
const
|
|
150
|
+
const o = (l) => /* @__PURE__ */ t(A, {
|
|
151
151
|
columnLength: n || 0,
|
|
152
|
-
rowKey: `ghost-${
|
|
153
|
-
}),
|
|
152
|
+
rowKey: `ghost-${l}`
|
|
153
|
+
}), y = (l) => /* @__PURE__ */ t(G, {
|
|
154
154
|
areSelectionCheckboxesDisabled: e,
|
|
155
|
-
columns:
|
|
156
|
-
iconColumnVariant:
|
|
157
|
-
item:
|
|
158
|
-
itemActionMenuProps:
|
|
159
|
-
onTableRowClick:
|
|
155
|
+
columns: r,
|
|
156
|
+
iconColumnVariant: s,
|
|
157
|
+
item: l,
|
|
158
|
+
itemActionMenuProps: c,
|
|
159
|
+
onTableRowClick: a,
|
|
160
160
|
shouldRenderActionColumn: N,
|
|
161
|
-
zoomLevel:
|
|
162
|
-
}),
|
|
163
|
-
const
|
|
164
|
-
return (
|
|
165
|
-
},
|
|
166
|
-
const
|
|
167
|
-
return Math.max((
|
|
168
|
-
},
|
|
169
|
-
return /* @__PURE__ */
|
|
170
|
-
children: [!!
|
|
161
|
+
zoomLevel: x
|
|
162
|
+
}), _ = () => {
|
|
163
|
+
const l = I[0];
|
|
164
|
+
return (l == null ? void 0 : l.start) || 0;
|
|
165
|
+
}, D = () => {
|
|
166
|
+
const l = I[I.length - 1], U = (l == null ? void 0 : l.end) || 0;
|
|
167
|
+
return Math.max((M || 0) - U, 0);
|
|
168
|
+
}, T = _(), C = D();
|
|
169
|
+
return /* @__PURE__ */ $(E, {
|
|
170
|
+
children: [!!T && /* @__PURE__ */ t(u, {
|
|
171
171
|
isDisabled: !0,
|
|
172
172
|
style: {
|
|
173
|
-
height: `${
|
|
173
|
+
height: `${T}px`
|
|
174
174
|
}
|
|
175
175
|
}), I.map(({
|
|
176
|
-
index:
|
|
177
|
-
}) =>
|
|
176
|
+
index: l
|
|
177
|
+
}) => l >= d.length ? o(l) : y(d[l])), !!C && /* @__PURE__ */ t(u, {
|
|
178
178
|
isDisabled: !0,
|
|
179
179
|
style: {
|
|
180
|
-
height: `${
|
|
180
|
+
height: `${C}px`
|
|
181
181
|
}
|
|
182
182
|
})]
|
|
183
183
|
});
|
|
184
184
|
}
|
|
185
|
-
return /* @__PURE__ */ t(
|
|
186
|
-
items:
|
|
187
|
-
key:
|
|
188
|
-
...
|
|
185
|
+
return /* @__PURE__ */ t(E, {
|
|
186
|
+
items: d.map((o) => ({
|
|
187
|
+
key: o.id,
|
|
188
|
+
...o
|
|
189
189
|
})),
|
|
190
|
-
children: (
|
|
191
|
-
className:
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
190
|
+
children: (o) => /* @__PURE__ */ $(u, {
|
|
191
|
+
className: L(i.tableRow, {
|
|
192
|
+
[i.isClickable]: a
|
|
193
|
+
}),
|
|
194
|
+
id: o.id,
|
|
195
|
+
onAction: () => a == null ? void 0 : a(o),
|
|
196
|
+
children: [O && /* @__PURE__ */ t(J, {
|
|
197
|
+
item: o,
|
|
198
|
+
zoomLevel: x
|
|
199
|
+
}), r.map((y) => /* @__PURE__ */ t(q, {
|
|
200
|
+
column: y,
|
|
201
|
+
iconColumnVariant: s,
|
|
202
|
+
item: o,
|
|
201
203
|
onInlineEditChange: m
|
|
202
|
-
}, `${
|
|
204
|
+
}, `${y.textValue}-${o.id}`)), N && /* @__PURE__ */ t(Q, {
|
|
203
205
|
isCheckboxDisabled: e,
|
|
204
|
-
item:
|
|
205
|
-
itemActionMenuProps:
|
|
206
|
+
item: o,
|
|
207
|
+
itemActionMenuProps: c
|
|
206
208
|
})]
|
|
207
|
-
},
|
|
209
|
+
}, o.id)
|
|
208
210
|
});
|
|
209
211
|
};
|
|
210
212
|
export {
|
|
211
|
-
|
|
213
|
+
le as default
|
|
212
214
|
};
|
package/dist/styles/index.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
.
|
|
1
|
+
._tableHeaderActionsWrapper_1sntd_1{position:absolute;top:0;right:var(--size-4);bottom:0;display:flex;gap:var(--space-2);align-items:center;justify-content:center;padding:0 var(--space-2);background:var(--item-background);margin-block:var(--space-2)}._tableHeaderActionsWrapper_1sntd_1:before{position:absolute;left:0;z-index:0;display:block;width:0;height:50%;box-shadow:-.25rem 0 .625rem .625rem var(--item-background);content:""}._tableHeaderActions_1sntd_1{position:sticky;right:0;width:var(--size-6);padding:0}._tableRow_1sntd_33:after{height:100%!important}._tableRow_1sntd_33[aria-selected=true]:after{height:100%!important}._tableRow_1sntd_33._isClickable_1sntd_41{cursor:pointer}._selectAllCheckbox_1sntd_45 svg{transform:none!important}._tableNameCell_1sntd_50{display:flex;gap:var(--space-3);align-items:center}._tableNameCellTitle_1sntd_56{overflow:hidden;text-overflow:ellipsis}._tableNameCellTitle_1sntd_56._hasSubtitle_1sntd_60{display:flex;flex-direction:column}._tableNameCellText_1sntd_65{overflow:hidden;text-overflow:ellipsis}._tableNameCellIconInline_1sntd_70{flex-shrink:0}._iconCell_1sntd_74{width:100%!important;height:100%!important}
|
|
@@ -13,7 +13,7 @@ export interface TableRendererProps extends Pick<InlineEditingCellProps, 'onInli
|
|
|
13
13
|
areSelectionCheckboxesDisabled?: boolean;
|
|
14
14
|
itemActionMenuProps?: MetadataProps['itemActionMenuProps'];
|
|
15
15
|
items: MetadataProps['items'];
|
|
16
|
-
onTableRowClick
|
|
16
|
+
onTableRowClick?: (item: Item) => void;
|
|
17
17
|
style?: React.CSSProperties;
|
|
18
18
|
tableHeader: React.ReactNode;
|
|
19
19
|
tableProps: TableProps;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@box/metadata-view",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.26.1",
|
|
4
4
|
"license": "SEE LICENSE IN LICENSE",
|
|
5
5
|
"peerDependencies": {
|
|
6
6
|
"@box/blueprint-web": "^12.76.2",
|
|
@@ -18,12 +18,12 @@
|
|
|
18
18
|
"react-intl": "^6.4.2"
|
|
19
19
|
},
|
|
20
20
|
"devDependencies": {
|
|
21
|
-
"@box/blueprint-web": "^12.103.
|
|
21
|
+
"@box/blueprint-web": "^12.103.2",
|
|
22
22
|
"@box/blueprint-web-assets": "^4.86.0",
|
|
23
|
-
"@box/box-item-type-selector": "^1.14.
|
|
23
|
+
"@box/box-item-type-selector": "^1.14.4",
|
|
24
24
|
"@box/eslint-plugin-blueprint": "1.0.5",
|
|
25
|
-
"@box/item-icon": "^2.5.
|
|
26
|
-
"@box/metadata-filter": "^1.52.
|
|
25
|
+
"@box/item-icon": "^2.5.4",
|
|
26
|
+
"@box/metadata-filter": "^1.52.4",
|
|
27
27
|
"@box/storybook-utils": "0.14.23",
|
|
28
28
|
"@box/types": "2.0.0",
|
|
29
29
|
"@tanstack/react-virtual": "^3.10.8",
|