@box/metadata-view 1.20.5 → 1.21.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/esm/lib/components/metadata-table/actionColumn.js +1 -1
- package/dist/esm/lib/components/metadata-table/metadata-table.js +80 -76
- package/dist/types/lib/components/metadata-table/actionColumn.d.ts +1 -0
- package/dist/types/lib/components/metadata-table/metadata-table.d.ts +4 -1
- package/package.json +5 -5
|
@@ -1,50 +1,52 @@
|
|
|
1
|
-
import { useRef as
|
|
2
|
-
import { useIntl as
|
|
3
|
-
import { Text as
|
|
4
|
-
import
|
|
5
|
-
import { useInfiniteScrollTableItems as
|
|
1
|
+
import { useRef as O } from "react";
|
|
2
|
+
import { useIntl as U } from "react-intl";
|
|
3
|
+
import { Text as k, ListCheckbox as F, TableHeader as G, Column as L } from "@box/blueprint-web";
|
|
4
|
+
import V from "lodash/noop";
|
|
5
|
+
import { useInfiniteScrollTableItems as X } from "./hooks/useInfiniteScrollTableItems.js";
|
|
6
6
|
import { TableRenderer as I } from "./table-renderer.js";
|
|
7
|
-
import { I as
|
|
8
|
-
import { THUMBNAIL_WIDTHS as
|
|
9
|
-
import { s
|
|
10
|
-
import
|
|
11
|
-
import { getShouldRenderActionColumn as
|
|
12
|
-
import { jsx as e } from "react/jsx-runtime";
|
|
7
|
+
import { I as Y } from "../../../../chunks/types.js";
|
|
8
|
+
import { THUMBNAIL_WIDTHS as Z } from "../constants.js";
|
|
9
|
+
import { s } from "../../../../chunks/index.js";
|
|
10
|
+
import $ from "./messages.js";
|
|
11
|
+
import { getShouldRenderActionColumn as q } from "./actionColumn.js";
|
|
12
|
+
import { jsx as e, jsxs as J } from "react/jsx-runtime";
|
|
13
13
|
import "./table-body/inline-editing-cell/inline-editing-cell.js";
|
|
14
|
-
const
|
|
15
|
-
areSelectionCheckboxesDisabled:
|
|
16
|
-
columns:
|
|
17
|
-
hasNextPage:
|
|
18
|
-
iconColumnVariant:
|
|
19
|
-
isInfiniteScrollEnabled:
|
|
20
|
-
isLoading:
|
|
21
|
-
isSelectAllEnabled:
|
|
22
|
-
itemActionMenuProps:
|
|
23
|
-
items:
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
14
|
+
const K = 40, de = ({
|
|
15
|
+
areSelectionCheckboxesDisabled: n = !1,
|
|
16
|
+
columns: m,
|
|
17
|
+
hasNextPage: x = !1,
|
|
18
|
+
iconColumnVariant: d,
|
|
19
|
+
isInfiniteScrollEnabled: A = !1,
|
|
20
|
+
isLoading: i = !1,
|
|
21
|
+
isSelectAllEnabled: W,
|
|
22
|
+
itemActionMenuProps: g,
|
|
23
|
+
items: c,
|
|
24
|
+
maxActionColumnWidth: w,
|
|
25
|
+
minActionColumnWidth: y,
|
|
26
|
+
onGetNextPage: C,
|
|
27
|
+
onInlineEditChange: N,
|
|
28
|
+
onTableRowClick: S = V,
|
|
29
|
+
placeholderRowsCount: _,
|
|
28
30
|
zoomLevel: a,
|
|
29
|
-
...
|
|
31
|
+
...l
|
|
30
32
|
}) => {
|
|
31
33
|
var H;
|
|
32
34
|
const {
|
|
33
35
|
formatMessage: f
|
|
34
|
-
} =
|
|
35
|
-
virtualItemsToDisplay:
|
|
36
|
-
getTableHeight:
|
|
37
|
-
} =
|
|
38
|
-
items:
|
|
39
|
-
hasNextPage:
|
|
40
|
-
isLoading:
|
|
36
|
+
} = U(), p = O(null), {
|
|
37
|
+
virtualItemsToDisplay: h,
|
|
38
|
+
getTableHeight: v
|
|
39
|
+
} = X({
|
|
40
|
+
items: c,
|
|
41
|
+
hasNextPage: x,
|
|
42
|
+
isLoading: i,
|
|
41
43
|
parentRef: p,
|
|
42
|
-
onGetNextPage:
|
|
43
|
-
placeholderRowsCount:
|
|
44
|
-
}), r = [],
|
|
45
|
-
if (
|
|
46
|
-
a = a ||
|
|
47
|
-
const t = parseInt(
|
|
44
|
+
onGetNextPage: C,
|
|
45
|
+
placeholderRowsCount: _
|
|
46
|
+
}), r = [], D = 0;
|
|
47
|
+
if (d === Y.COLUMN) {
|
|
48
|
+
a = a || D;
|
|
49
|
+
const t = parseInt(Z[a], 10) + 24;
|
|
48
50
|
r.push({
|
|
49
51
|
id: "item-type-icon",
|
|
50
52
|
isRowHeader: !1,
|
|
@@ -53,88 +55,90 @@ const Z = 40, ie = ({
|
|
|
53
55
|
maxWidth: t
|
|
54
56
|
});
|
|
55
57
|
}
|
|
56
|
-
const
|
|
58
|
+
const E = m.map((t) => {
|
|
57
59
|
const {
|
|
58
60
|
id: b,
|
|
59
|
-
isRowHeader:
|
|
61
|
+
isRowHeader: j,
|
|
60
62
|
headerRenderer: R,
|
|
61
63
|
textValue: o,
|
|
62
64
|
type: T,
|
|
63
|
-
...
|
|
65
|
+
...B
|
|
64
66
|
} = t;
|
|
65
67
|
return {
|
|
66
|
-
...
|
|
67
|
-
children: R ? R(o, t) : /* @__PURE__ */ e(
|
|
68
|
+
...B,
|
|
69
|
+
children: R ? R(o, t) : /* @__PURE__ */ e(k, {
|
|
68
70
|
as: "span",
|
|
69
71
|
children: o
|
|
70
72
|
}),
|
|
71
|
-
isRowHeader: b === "name" ||
|
|
73
|
+
isRowHeader: b === "name" || j,
|
|
72
74
|
id: b,
|
|
73
75
|
textValue: o,
|
|
74
76
|
allowsSorting: T !== "multiSelect" && T !== "enum"
|
|
75
77
|
};
|
|
76
78
|
});
|
|
77
|
-
r.push(...
|
|
79
|
+
r.push(...E), q(l) && r.push({
|
|
78
80
|
id: "actions",
|
|
79
|
-
className:
|
|
80
|
-
children: /* @__PURE__ */
|
|
81
|
-
className:
|
|
82
|
-
children:
|
|
83
|
-
"aria-label": f(
|
|
84
|
-
className:
|
|
85
|
-
isDisabled:
|
|
86
|
-
}) : null
|
|
81
|
+
className: s.tableHeaderActions,
|
|
82
|
+
children: /* @__PURE__ */ J("div", {
|
|
83
|
+
className: s.tableHeaderActionsWrapper,
|
|
84
|
+
children: [l.HeaderActions, W ? /* @__PURE__ */ e(F, {
|
|
85
|
+
"aria-label": f($.selectAll),
|
|
86
|
+
className: s.selectAllCheckbox,
|
|
87
|
+
isDisabled: i || n
|
|
88
|
+
}) : null]
|
|
87
89
|
}),
|
|
88
90
|
isRowHeader: !1,
|
|
89
91
|
hideHeader: !1,
|
|
90
|
-
allowsSorting: !1
|
|
92
|
+
allowsSorting: !1,
|
|
93
|
+
maxWidth: w,
|
|
94
|
+
minWidth: y
|
|
91
95
|
});
|
|
92
|
-
const
|
|
96
|
+
const M = /* @__PURE__ */ e(G, {
|
|
93
97
|
columns: r,
|
|
94
|
-
children: (t) => /* @__PURE__ */ e(
|
|
98
|
+
children: (t) => /* @__PURE__ */ e(L, {
|
|
95
99
|
...t
|
|
96
100
|
})
|
|
97
|
-
}),
|
|
101
|
+
}), u = {
|
|
98
102
|
columnCount: r.length,
|
|
99
|
-
columns:
|
|
103
|
+
columns: m,
|
|
100
104
|
formatMessage: f,
|
|
101
|
-
iconColumnVariant:
|
|
102
|
-
isLoading:
|
|
103
|
-
areSelectionCheckboxesDisabled:
|
|
104
|
-
itemActionMenuProps:
|
|
105
|
-
items:
|
|
106
|
-
onInlineEditChange:
|
|
107
|
-
onTableRowClick:
|
|
108
|
-
tableHeader:
|
|
109
|
-
tableProps:
|
|
105
|
+
iconColumnVariant: d,
|
|
106
|
+
isLoading: i,
|
|
107
|
+
areSelectionCheckboxesDisabled: n,
|
|
108
|
+
itemActionMenuProps: g,
|
|
109
|
+
items: c,
|
|
110
|
+
onInlineEditChange: N,
|
|
111
|
+
onTableRowClick: S,
|
|
112
|
+
tableHeader: M,
|
|
113
|
+
tableProps: l,
|
|
110
114
|
zoomLevel: a
|
|
111
115
|
};
|
|
112
|
-
return
|
|
116
|
+
return A ? /* @__PURE__ */ e("div", {
|
|
113
117
|
ref: p,
|
|
114
|
-
className:
|
|
118
|
+
className: s.infiniteScrollTableContainerFullHeight,
|
|
115
119
|
children: /* @__PURE__ */ e("div", {
|
|
116
120
|
style: {
|
|
117
121
|
position: "relative",
|
|
118
122
|
width: "100%",
|
|
119
|
-
height:
|
|
123
|
+
height: v() + K
|
|
120
124
|
},
|
|
121
125
|
children: /* @__PURE__ */ e(I, {
|
|
122
|
-
...
|
|
126
|
+
...u,
|
|
123
127
|
style: {
|
|
124
128
|
position: "absolute",
|
|
125
129
|
top: 0,
|
|
126
130
|
left: 0,
|
|
127
131
|
width: "100%",
|
|
128
|
-
transform: `translateY(${((H =
|
|
132
|
+
transform: `translateY(${((H = h[0]) == null ? void 0 : H.start) || 0}px)`,
|
|
129
133
|
tableLayout: "fixed"
|
|
130
134
|
},
|
|
131
|
-
virtualItems:
|
|
135
|
+
virtualItems: h
|
|
132
136
|
})
|
|
133
137
|
})
|
|
134
138
|
}) : /* @__PURE__ */ e(I, {
|
|
135
|
-
...
|
|
139
|
+
...u
|
|
136
140
|
});
|
|
137
141
|
};
|
|
138
142
|
export {
|
|
139
|
-
|
|
143
|
+
de as MetadataTable
|
|
140
144
|
};
|
|
@@ -6,12 +6,15 @@ export interface MetadataTableProps extends TableProps, MetadataProps, Pick<Inli
|
|
|
6
6
|
areSelectionCheckboxesDisabled?: boolean;
|
|
7
7
|
columns: Column[];
|
|
8
8
|
hasNextPage?: boolean;
|
|
9
|
+
HeaderActions?: React.ReactElement;
|
|
9
10
|
iconColumnVariant?: IconColumnVariant;
|
|
10
11
|
isInfiniteScrollEnabled?: boolean;
|
|
11
12
|
isSelectAllEnabled?: boolean;
|
|
13
|
+
maxActionColumnWidth?: number;
|
|
14
|
+
minActionColumnWidth?: number;
|
|
12
15
|
onGetNextPage?: () => void;
|
|
13
16
|
onTableRowClick?: (item: Item) => void;
|
|
14
17
|
placeholderRowsCount?: number;
|
|
15
18
|
zoomLevel?: number;
|
|
16
19
|
}
|
|
17
|
-
export declare const MetadataTable: ({ areSelectionCheckboxesDisabled, columns, hasNextPage, iconColumnVariant, isInfiniteScrollEnabled, isLoading, isSelectAllEnabled, itemActionMenuProps, items, onGetNextPage, onInlineEditChange, onTableRowClick, placeholderRowsCount, zoomLevel, ...tableProps }: MetadataTableProps) => import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
export declare const MetadataTable: ({ areSelectionCheckboxesDisabled, columns, hasNextPage, iconColumnVariant, isInfiniteScrollEnabled, isLoading, isSelectAllEnabled, itemActionMenuProps, items, maxActionColumnWidth, minActionColumnWidth, onGetNextPage, onInlineEditChange, onTableRowClick, placeholderRowsCount, zoomLevel, ...tableProps }: MetadataTableProps) => import("react/jsx-runtime").JSX.Element;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@box/metadata-view",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.21.0",
|
|
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.
|
|
21
|
+
"@box/blueprint-web": "^12.101.0",
|
|
22
22
|
"@box/blueprint-web-assets": "^4.85.0",
|
|
23
|
-
"@box/box-item-type-selector": "^1.13.
|
|
23
|
+
"@box/box-item-type-selector": "^1.13.6",
|
|
24
24
|
"@box/eslint-plugin-blueprint": "1.0.5",
|
|
25
|
-
"@box/item-icon": "^2.4.
|
|
26
|
-
"@box/metadata-filter": "^1.51.
|
|
25
|
+
"@box/item-icon": "^2.4.6",
|
|
26
|
+
"@box/metadata-filter": "^1.51.6",
|
|
27
27
|
"@box/storybook-utils": "0.14.22",
|
|
28
28
|
"@box/types": "2.0.0",
|
|
29
29
|
"@tanstack/react-virtual": "^3.10.8",
|