@itilite/lumina-ui 1.0.5-alpha → 1.0.6-alpha
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/Table-DSFYzrpU.d.mts +129 -0
- package/dist/Table-DSFYzrpU.d.ts +129 -0
- package/dist/atom/Table/Table.d.mts +1 -1
- package/dist/atom/Table/Table.d.ts +1 -1
- package/dist/atom/Table/Table.js +57 -18
- package/dist/atom/Table/Table.mjs +1 -1
- package/dist/chunk-LRNKIRH3.mjs +289 -0
- package/dist/index.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +57 -18
- package/dist/index.mjs +13 -13
- package/dist/styles.css +223 -207
- package/package.json +1 -1
|
@@ -0,0 +1,289 @@
|
|
|
1
|
+
import {
|
|
2
|
+
__objRest,
|
|
3
|
+
__spreadProps,
|
|
4
|
+
__spreadValues
|
|
5
|
+
} from "./chunk-FWCSY2DS.mjs";
|
|
6
|
+
|
|
7
|
+
// src/atom/Table/Table.tsx
|
|
8
|
+
import * as React from "react";
|
|
9
|
+
import { Table as AntTable } from "antd";
|
|
10
|
+
import clsx from "clsx";
|
|
11
|
+
|
|
12
|
+
// src/atom/Table/Table.module.scss
|
|
13
|
+
var Table_module_default = { "tableWrapper": "Table-module__tableWrapper___3cqiD", "isAccordion": "Table-module__isAccordion___-uIs6", "isToolbar": "Table-module__isToolbar___LdS-m", "hasCustomHeaderCell": "Table-module__hasCustomHeaderCell___AtCk8", "table": "Table-module__table___5d7g0", "hasCustomBodyCell": "Table-module__hasCustomBodyCell___sf8j8", "hasRowSpacing": "Table-module__hasRowSpacing___bGT0u", "firstRow": "Table-module__firstRow___Xq-Hi", "lastRow": "Table-module__lastRow___ahv4g", "showHoverEffect": "Table-module__showHoverEffect___IyKyO", "columnHeader": "Table-module__columnHeader___Unr6d", "columnHeaderLeft": "Table-module__columnHeaderLeft___mp7pK", "columnHeaderSortArea": "Table-module__columnHeaderSortArea___jrIYo", "columnHeaderLabel": "Table-module__columnHeaderLabel___A-mRu", "columnHeaderSortIcon": "Table-module__columnHeaderSortIcon___mWVZN", "columnHeaderSortIconActive": "Table-module__columnHeaderSortIconActive___wHAqC", "columnHeaderFilterWrapper": "Table-module__columnHeaderFilterWrapper___DnSve", "columnHeaderFilterBtn": "Table-module__columnHeaderFilterBtn___NR7DY", "columnHeaderFilterBtnActive": "Table-module__columnHeaderFilterBtnActive___JdO11", "columnHeaderFilterBadge": "Table-module__columnHeaderFilterBadge___-Q2T2", "columnHeaderFilterDropdown": "Table-module__columnHeaderFilterDropdown___M-fD4" };
|
|
14
|
+
|
|
15
|
+
// src/atom/Table/Table.tsx
|
|
16
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
17
|
+
function buildPagination(pagination, overrides = {}) {
|
|
18
|
+
var _a, _b, _c, _d;
|
|
19
|
+
if (pagination === false) {
|
|
20
|
+
return false;
|
|
21
|
+
}
|
|
22
|
+
const defaults = {
|
|
23
|
+
showSizeChanger: true,
|
|
24
|
+
pageSizeOptions: ["10", "25", "50"],
|
|
25
|
+
locale: { items_per_page: "" },
|
|
26
|
+
// Removes "/ page" text
|
|
27
|
+
showTotal: (total, range) => `${range[0]}\u2013${range[1]} of ${total} items`
|
|
28
|
+
};
|
|
29
|
+
const baseConfig = pagination === true || pagination === void 0 ? defaults : __spreadValues(__spreadValues({}, defaults), pagination);
|
|
30
|
+
return __spreadProps(__spreadValues({}, baseConfig), {
|
|
31
|
+
total: (_a = overrides.total) != null ? _a : baseConfig.total,
|
|
32
|
+
current: (_b = overrides.current) != null ? _b : baseConfig.current,
|
|
33
|
+
pageSize: (_c = overrides.pageSize) != null ? _c : baseConfig.pageSize,
|
|
34
|
+
onChange: (_d = overrides.onChange) != null ? _d : baseConfig.onChange
|
|
35
|
+
});
|
|
36
|
+
}
|
|
37
|
+
function nextSortOrder(current) {
|
|
38
|
+
if (current === void 0) return "ascend";
|
|
39
|
+
if (current === "ascend") return "descend";
|
|
40
|
+
return void 0;
|
|
41
|
+
}
|
|
42
|
+
function ColumnHeader({
|
|
43
|
+
label,
|
|
44
|
+
sortable = false,
|
|
45
|
+
sortOrder,
|
|
46
|
+
onSortChange,
|
|
47
|
+
sortIcon,
|
|
48
|
+
filterCount = 0,
|
|
49
|
+
filterIcon,
|
|
50
|
+
filterContent,
|
|
51
|
+
className = ""
|
|
52
|
+
}) {
|
|
53
|
+
const [filterOpen, setFilterOpen] = React.useState(false);
|
|
54
|
+
const wrapperRef = React.useRef(null);
|
|
55
|
+
const filterActive = filterCount > 0;
|
|
56
|
+
const hasFilter = filterContent !== void 0 && filterIcon !== void 0;
|
|
57
|
+
const hasSort = sortable && sortIcon !== void 0;
|
|
58
|
+
React.useEffect(() => {
|
|
59
|
+
if (!filterOpen) return;
|
|
60
|
+
const onOutside = (e) => {
|
|
61
|
+
if (wrapperRef.current && !wrapperRef.current.contains(e.target)) {
|
|
62
|
+
setFilterOpen(false);
|
|
63
|
+
}
|
|
64
|
+
};
|
|
65
|
+
document.addEventListener("mousedown", onOutside);
|
|
66
|
+
return () => document.removeEventListener("mousedown", onOutside);
|
|
67
|
+
}, [filterOpen]);
|
|
68
|
+
return /* @__PURE__ */ jsxs("div", { className: Table_module_default.columnHeader, ref: wrapperRef, children: [
|
|
69
|
+
/* @__PURE__ */ jsx("div", { className: Table_module_default.columnHeaderLeft, children: hasSort ? /* @__PURE__ */ jsxs(
|
|
70
|
+
"button",
|
|
71
|
+
{
|
|
72
|
+
type: "button",
|
|
73
|
+
className: Table_module_default.columnHeaderSortArea,
|
|
74
|
+
onClick: () => onSortChange == null ? void 0 : onSortChange(nextSortOrder(sortOrder)),
|
|
75
|
+
"aria-label": typeof label === "string" ? `Sort by ${label}` : "Sort",
|
|
76
|
+
children: [
|
|
77
|
+
/* @__PURE__ */ jsx("span", { className: clsx(Table_module_default.columnHeaderLabel, "tw-typography-caption2Bold tw-text-color-text-weak", className), children: label }),
|
|
78
|
+
/* @__PURE__ */ jsx(
|
|
79
|
+
"span",
|
|
80
|
+
{
|
|
81
|
+
className: clsx(Table_module_default.columnHeaderSortIcon, {
|
|
82
|
+
[Table_module_default.columnHeaderSortIconActive]: sortOrder !== void 0
|
|
83
|
+
}),
|
|
84
|
+
children: sortIcon
|
|
85
|
+
}
|
|
86
|
+
)
|
|
87
|
+
]
|
|
88
|
+
}
|
|
89
|
+
) : /* @__PURE__ */ jsx("span", { className: clsx(Table_module_default.columnHeaderLabel, "tw-typography-caption2Bold tw-text-color-text-weak", className), children: label }) }),
|
|
90
|
+
hasFilter && /* @__PURE__ */ jsxs("div", { className: Table_module_default.columnHeaderFilterWrapper, children: [
|
|
91
|
+
/* @__PURE__ */ jsxs(
|
|
92
|
+
"button",
|
|
93
|
+
{
|
|
94
|
+
type: "button",
|
|
95
|
+
className: clsx(Table_module_default.columnHeaderFilterBtn, {
|
|
96
|
+
[Table_module_default.columnHeaderFilterBtnActive]: filterActive
|
|
97
|
+
}),
|
|
98
|
+
onClick: () => setFilterOpen((v) => !v),
|
|
99
|
+
"aria-label": typeof label === "string" ? `Filter ${label}` : "Filter",
|
|
100
|
+
"aria-expanded": filterOpen,
|
|
101
|
+
"aria-haspopup": "dialog",
|
|
102
|
+
children: [
|
|
103
|
+
filterIcon,
|
|
104
|
+
filterActive && /* @__PURE__ */ jsx("span", { className: Table_module_default.columnHeaderFilterBadge, children: filterCount })
|
|
105
|
+
]
|
|
106
|
+
}
|
|
107
|
+
),
|
|
108
|
+
filterOpen && /* @__PURE__ */ jsx("div", { className: Table_module_default.columnHeaderFilterDropdown, role: "dialog", children: filterContent })
|
|
109
|
+
] })
|
|
110
|
+
] });
|
|
111
|
+
}
|
|
112
|
+
function processColumns(columns, headerCellClassName, bodyCellClassName) {
|
|
113
|
+
if (!columns) return void 0;
|
|
114
|
+
return columns.map((col) => {
|
|
115
|
+
const _a = col, { headerProps, title, onHeaderCell, onCell } = _a, rest = __objRest(_a, ["headerProps", "title", "onHeaderCell", "onCell"]);
|
|
116
|
+
const resolvedOnHeaderCell = (column) => {
|
|
117
|
+
var _a2;
|
|
118
|
+
const base = (_a2 = onHeaderCell == null ? void 0 : onHeaderCell(column)) != null ? _a2 : {};
|
|
119
|
+
return __spreadProps(__spreadValues({}, base), {
|
|
120
|
+
className: clsx(base.className, headerCellClassName)
|
|
121
|
+
});
|
|
122
|
+
};
|
|
123
|
+
const resolvedOnCell = (record, rowIndex) => {
|
|
124
|
+
var _a2;
|
|
125
|
+
const base = (_a2 = onCell == null ? void 0 : onCell(record, rowIndex)) != null ? _a2 : {};
|
|
126
|
+
return __spreadProps(__spreadValues({}, base), {
|
|
127
|
+
className: clsx(base.className, bodyCellClassName)
|
|
128
|
+
});
|
|
129
|
+
};
|
|
130
|
+
const processedTitle = headerProps ? /* @__PURE__ */ jsx(ColumnHeader, __spreadValues({ label: title }, headerProps)) : title;
|
|
131
|
+
return __spreadProps(__spreadValues({}, rest), {
|
|
132
|
+
title: processedTitle,
|
|
133
|
+
onHeaderCell: resolvedOnHeaderCell,
|
|
134
|
+
onCell: resolvedOnCell
|
|
135
|
+
});
|
|
136
|
+
});
|
|
137
|
+
}
|
|
138
|
+
function Table(props) {
|
|
139
|
+
var _b;
|
|
140
|
+
const _a = props, {
|
|
141
|
+
size = "middle",
|
|
142
|
+
variant = "default",
|
|
143
|
+
isAccordion = false,
|
|
144
|
+
isToolbar = false,
|
|
145
|
+
className = "",
|
|
146
|
+
pagination,
|
|
147
|
+
loading,
|
|
148
|
+
total,
|
|
149
|
+
current,
|
|
150
|
+
pageSize,
|
|
151
|
+
onPaginationChange,
|
|
152
|
+
columns,
|
|
153
|
+
rowSelection,
|
|
154
|
+
rowKey = "key",
|
|
155
|
+
onRow,
|
|
156
|
+
dataSource,
|
|
157
|
+
emptyState,
|
|
158
|
+
hideHeader,
|
|
159
|
+
loadingIndicator,
|
|
160
|
+
style,
|
|
161
|
+
headerCellClassName,
|
|
162
|
+
bodyCellClassName,
|
|
163
|
+
rowClassName,
|
|
164
|
+
rowSpacing
|
|
165
|
+
} = _a, rest = __objRest(_a, [
|
|
166
|
+
"size",
|
|
167
|
+
"variant",
|
|
168
|
+
"isAccordion",
|
|
169
|
+
"isToolbar",
|
|
170
|
+
"className",
|
|
171
|
+
"pagination",
|
|
172
|
+
"loading",
|
|
173
|
+
"total",
|
|
174
|
+
"current",
|
|
175
|
+
"pageSize",
|
|
176
|
+
"onPaginationChange",
|
|
177
|
+
"columns",
|
|
178
|
+
"rowSelection",
|
|
179
|
+
"rowKey",
|
|
180
|
+
"onRow",
|
|
181
|
+
"dataSource",
|
|
182
|
+
"emptyState",
|
|
183
|
+
"hideHeader",
|
|
184
|
+
"loadingIndicator",
|
|
185
|
+
"style",
|
|
186
|
+
"headerCellClassName",
|
|
187
|
+
"bodyCellClassName",
|
|
188
|
+
"rowClassName",
|
|
189
|
+
"rowSpacing"
|
|
190
|
+
]);
|
|
191
|
+
const isChildVariant = isAccordion || isToolbar;
|
|
192
|
+
const resolvedPagination = buildPagination(pagination, {
|
|
193
|
+
total,
|
|
194
|
+
current,
|
|
195
|
+
pageSize,
|
|
196
|
+
onChange: onPaginationChange
|
|
197
|
+
});
|
|
198
|
+
const processedColumns = React.useMemo(
|
|
199
|
+
() => processColumns(columns, headerCellClassName, bodyCellClassName),
|
|
200
|
+
[columns, headerCellClassName, bodyCellClassName]
|
|
201
|
+
);
|
|
202
|
+
const resolvedOnRow = React.useMemo(() => {
|
|
203
|
+
const onChange = rowSelection == null ? void 0 : rowSelection.onChange;
|
|
204
|
+
if (variant !== "selectable" || !onChange) return onRow;
|
|
205
|
+
return (record, index) => {
|
|
206
|
+
var _a2;
|
|
207
|
+
const base = (_a2 = onRow == null ? void 0 : onRow(record, index)) != null ? _a2 : {};
|
|
208
|
+
const getKey = (r, i) => typeof rowKey === "function" ? rowKey(r, i) : r[rowKey];
|
|
209
|
+
return __spreadProps(__spreadValues({}, base), {
|
|
210
|
+
style: __spreadValues({ cursor: "pointer" }, base.style),
|
|
211
|
+
onClick: (e) => {
|
|
212
|
+
var _a3, _b2;
|
|
213
|
+
(_a3 = base.onClick) == null ? void 0 : _a3.call(base, e);
|
|
214
|
+
const key = getKey(record, index);
|
|
215
|
+
const current2 = (_b2 = rowSelection.selectedRowKeys) != null ? _b2 : [];
|
|
216
|
+
const isSelected = current2.some((k) => k === key);
|
|
217
|
+
const newKeys = isSelected ? current2.filter((k) => k !== key) : [...current2, key];
|
|
218
|
+
const newRows = (dataSource != null ? dataSource : []).filter(
|
|
219
|
+
(r) => newKeys.some((k) => k === getKey(r))
|
|
220
|
+
);
|
|
221
|
+
onChange(newKeys, newRows, { type: "single" });
|
|
222
|
+
}
|
|
223
|
+
});
|
|
224
|
+
};
|
|
225
|
+
}, [variant, rowSelection, rowKey, onRow, dataSource]);
|
|
226
|
+
const hasRowSpacing = rowSpacing !== void 0;
|
|
227
|
+
const rowSpacingValue = typeof rowSpacing === "number" ? `${rowSpacing}px` : rowSpacing;
|
|
228
|
+
const wrapperStyle = React.useMemo(() => {
|
|
229
|
+
if (!hasRowSpacing) return style;
|
|
230
|
+
return __spreadProps(__spreadValues({}, style), {
|
|
231
|
+
"--lumina-table-row-spacing": rowSpacingValue
|
|
232
|
+
});
|
|
233
|
+
}, [style, hasRowSpacing, rowSpacingValue]);
|
|
234
|
+
return /* @__PURE__ */ jsx(
|
|
235
|
+
"div",
|
|
236
|
+
{
|
|
237
|
+
className: clsx(
|
|
238
|
+
Table_module_default.tableWrapper,
|
|
239
|
+
Table_module_default.showHoverEffect,
|
|
240
|
+
{
|
|
241
|
+
[Table_module_default.isAccordion]: isAccordion,
|
|
242
|
+
[Table_module_default.isToolbar]: isToolbar,
|
|
243
|
+
[Table_module_default.hasCustomHeaderCell]: !!headerCellClassName,
|
|
244
|
+
[Table_module_default.hasCustomBodyCell]: !!bodyCellClassName,
|
|
245
|
+
[Table_module_default.hasRowSpacing]: hasRowSpacing
|
|
246
|
+
},
|
|
247
|
+
className
|
|
248
|
+
),
|
|
249
|
+
style: wrapperStyle,
|
|
250
|
+
"data-testid": "lumina-table",
|
|
251
|
+
children: /* @__PURE__ */ jsx(
|
|
252
|
+
AntTable,
|
|
253
|
+
__spreadProps(__spreadValues({
|
|
254
|
+
className: Table_module_default.table,
|
|
255
|
+
size,
|
|
256
|
+
pagination: resolvedPagination,
|
|
257
|
+
columns: processedColumns,
|
|
258
|
+
rowSelection,
|
|
259
|
+
rowKey,
|
|
260
|
+
onRow: resolvedOnRow,
|
|
261
|
+
dataSource,
|
|
262
|
+
showHeader: !hideHeader,
|
|
263
|
+
locale: {
|
|
264
|
+
emptyText: loading && loadingIndicator ? loadingIndicator : loading ? " " : emptyState
|
|
265
|
+
}
|
|
266
|
+
}, rest), {
|
|
267
|
+
loading: loadingIndicator ? { spinning: !!loading && ((_b = dataSource == null ? void 0 : dataSource.length) != null ? _b : 0) > 0, indicator: loadingIndicator } : loading,
|
|
268
|
+
rowClassName: (record, index) => {
|
|
269
|
+
var _a2;
|
|
270
|
+
return clsx(
|
|
271
|
+
{
|
|
272
|
+
[Table_module_default.firstRow]: index === 0,
|
|
273
|
+
[Table_module_default.lastRow]: index === ((_a2 = dataSource == null ? void 0 : dataSource.length) != null ? _a2 : 0) - 1
|
|
274
|
+
},
|
|
275
|
+
typeof rowClassName === "function" ? rowClassName(record, index) : rowClassName
|
|
276
|
+
);
|
|
277
|
+
}
|
|
278
|
+
})
|
|
279
|
+
)
|
|
280
|
+
}
|
|
281
|
+
);
|
|
282
|
+
}
|
|
283
|
+
Table.displayName = "Table";
|
|
284
|
+
var Table_default = Table;
|
|
285
|
+
|
|
286
|
+
export {
|
|
287
|
+
Table,
|
|
288
|
+
Table_default
|
|
289
|
+
};
|
package/dist/index.d.mts
CHANGED
|
@@ -11,7 +11,7 @@ export { A as AdvancedDateRangePicker, D as DateRangePickerProps, a as DateRange
|
|
|
11
11
|
export { Select } from './atom/Select/Select.mjs';
|
|
12
12
|
export { LoadingSpinner } from './atom/LoadingSpinner/LoadingSpinner.mjs';
|
|
13
13
|
export { Slider } from './atom/Slider/Slider.mjs';
|
|
14
|
-
export { L as LuminaColumnHeaderProps, a as LuminaColumnType, b as LuminaColumnsType, S as SortOrder, T as Table, c as TableProps } from './Table-
|
|
14
|
+
export { L as LuminaColumnHeaderProps, a as LuminaColumnType, b as LuminaColumnsType, S as SortOrder, T as Table, c as TableProps } from './Table-DSFYzrpU.mjs';
|
|
15
15
|
export { UserProfile } from './molecules/UserProfile/UserProfile.mjs';
|
|
16
16
|
export { TablePaginationConfig } from 'antd';
|
|
17
17
|
import 'react';
|
package/dist/index.d.ts
CHANGED
|
@@ -11,7 +11,7 @@ export { A as AdvancedDateRangePicker, D as DateRangePickerProps, a as DateRange
|
|
|
11
11
|
export { Select } from './atom/Select/Select.js';
|
|
12
12
|
export { LoadingSpinner } from './atom/LoadingSpinner/LoadingSpinner.js';
|
|
13
13
|
export { Slider } from './atom/Slider/Slider.js';
|
|
14
|
-
export { L as LuminaColumnHeaderProps, a as LuminaColumnType, b as LuminaColumnsType, S as SortOrder, T as Table, c as TableProps } from './Table-
|
|
14
|
+
export { L as LuminaColumnHeaderProps, a as LuminaColumnType, b as LuminaColumnsType, S as SortOrder, T as Table, c as TableProps } from './Table-DSFYzrpU.js';
|
|
15
15
|
export { UserProfile } from './molecules/UserProfile/UserProfile.js';
|
|
16
16
|
export { TablePaginationConfig } from 'antd';
|
|
17
17
|
import 'react';
|
package/dist/index.js
CHANGED
|
@@ -2710,7 +2710,7 @@ var import_antd10 = require("antd");
|
|
|
2710
2710
|
var import_clsx12 = __toESM(require("clsx"));
|
|
2711
2711
|
|
|
2712
2712
|
// src/atom/Table/Table.module.scss
|
|
2713
|
-
var Table_module_default = { "tableWrapper": "Table-module__tableWrapper___3cqiD", "isAccordion": "Table-module__isAccordion___-uIs6", "isToolbar": "Table-module__isToolbar___LdS-m", "table": "Table-module__table___5d7g0", "firstRow": "Table-module__firstRow___Xq-Hi", "lastRow": "Table-module__lastRow___ahv4g", "showHoverEffect": "Table-module__showHoverEffect___IyKyO", "columnHeader": "Table-module__columnHeader___Unr6d", "columnHeaderLeft": "Table-module__columnHeaderLeft___mp7pK", "columnHeaderSortArea": "Table-module__columnHeaderSortArea___jrIYo", "columnHeaderLabel": "Table-module__columnHeaderLabel___A-mRu", "columnHeaderSortIcon": "Table-module__columnHeaderSortIcon___mWVZN", "columnHeaderSortIconActive": "Table-module__columnHeaderSortIconActive___wHAqC", "columnHeaderFilterWrapper": "Table-module__columnHeaderFilterWrapper___DnSve", "columnHeaderFilterBtn": "Table-module__columnHeaderFilterBtn___NR7DY", "columnHeaderFilterBtnActive": "Table-module__columnHeaderFilterBtnActive___JdO11", "columnHeaderFilterBadge": "Table-module__columnHeaderFilterBadge___-Q2T2", "columnHeaderFilterDropdown": "Table-module__columnHeaderFilterDropdown___M-fD4" };
|
|
2713
|
+
var Table_module_default = { "tableWrapper": "Table-module__tableWrapper___3cqiD", "isAccordion": "Table-module__isAccordion___-uIs6", "isToolbar": "Table-module__isToolbar___LdS-m", "hasCustomHeaderCell": "Table-module__hasCustomHeaderCell___AtCk8", "table": "Table-module__table___5d7g0", "hasCustomBodyCell": "Table-module__hasCustomBodyCell___sf8j8", "hasRowSpacing": "Table-module__hasRowSpacing___bGT0u", "firstRow": "Table-module__firstRow___Xq-Hi", "lastRow": "Table-module__lastRow___ahv4g", "showHoverEffect": "Table-module__showHoverEffect___IyKyO", "columnHeader": "Table-module__columnHeader___Unr6d", "columnHeaderLeft": "Table-module__columnHeaderLeft___mp7pK", "columnHeaderSortArea": "Table-module__columnHeaderSortArea___jrIYo", "columnHeaderLabel": "Table-module__columnHeaderLabel___A-mRu", "columnHeaderSortIcon": "Table-module__columnHeaderSortIcon___mWVZN", "columnHeaderSortIconActive": "Table-module__columnHeaderSortIconActive___wHAqC", "columnHeaderFilterWrapper": "Table-module__columnHeaderFilterWrapper___DnSve", "columnHeaderFilterBtn": "Table-module__columnHeaderFilterBtn___NR7DY", "columnHeaderFilterBtnActive": "Table-module__columnHeaderFilterBtnActive___JdO11", "columnHeaderFilterBadge": "Table-module__columnHeaderFilterBadge___-Q2T2", "columnHeaderFilterDropdown": "Table-module__columnHeaderFilterDropdown___M-fD4" };
|
|
2714
2714
|
|
|
2715
2715
|
// src/atom/Table/Table.tsx
|
|
2716
2716
|
var import_jsx_runtime19 = require("react/jsx-runtime");
|
|
@@ -2809,13 +2809,29 @@ function ColumnHeader({
|
|
|
2809
2809
|
] })
|
|
2810
2810
|
] });
|
|
2811
2811
|
}
|
|
2812
|
-
function processColumns(columns) {
|
|
2812
|
+
function processColumns(columns, headerCellClassName, bodyCellClassName) {
|
|
2813
2813
|
if (!columns) return void 0;
|
|
2814
2814
|
return columns.map((col) => {
|
|
2815
|
-
const _a = col, { headerProps, title } = _a, rest = __objRest(_a, ["headerProps", "title"]);
|
|
2816
|
-
|
|
2815
|
+
const _a = col, { headerProps, title, onHeaderCell, onCell } = _a, rest = __objRest(_a, ["headerProps", "title", "onHeaderCell", "onCell"]);
|
|
2816
|
+
const resolvedOnHeaderCell = (column) => {
|
|
2817
|
+
var _a2;
|
|
2818
|
+
const base = (_a2 = onHeaderCell == null ? void 0 : onHeaderCell(column)) != null ? _a2 : {};
|
|
2819
|
+
return __spreadProps(__spreadValues({}, base), {
|
|
2820
|
+
className: (0, import_clsx12.default)(base.className, headerCellClassName)
|
|
2821
|
+
});
|
|
2822
|
+
};
|
|
2823
|
+
const resolvedOnCell = (record, rowIndex) => {
|
|
2824
|
+
var _a2;
|
|
2825
|
+
const base = (_a2 = onCell == null ? void 0 : onCell(record, rowIndex)) != null ? _a2 : {};
|
|
2826
|
+
return __spreadProps(__spreadValues({}, base), {
|
|
2827
|
+
className: (0, import_clsx12.default)(base.className, bodyCellClassName)
|
|
2828
|
+
});
|
|
2829
|
+
};
|
|
2830
|
+
const processedTitle = headerProps ? /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(ColumnHeader, __spreadValues({ label: title }, headerProps)) : title;
|
|
2817
2831
|
return __spreadProps(__spreadValues({}, rest), {
|
|
2818
|
-
title:
|
|
2832
|
+
title: processedTitle,
|
|
2833
|
+
onHeaderCell: resolvedOnHeaderCell,
|
|
2834
|
+
onCell: resolvedOnCell
|
|
2819
2835
|
});
|
|
2820
2836
|
});
|
|
2821
2837
|
}
|
|
@@ -2841,7 +2857,11 @@ function Table(props) {
|
|
|
2841
2857
|
emptyState,
|
|
2842
2858
|
hideHeader,
|
|
2843
2859
|
loadingIndicator,
|
|
2844
|
-
style
|
|
2860
|
+
style,
|
|
2861
|
+
headerCellClassName,
|
|
2862
|
+
bodyCellClassName,
|
|
2863
|
+
rowClassName,
|
|
2864
|
+
rowSpacing
|
|
2845
2865
|
} = _a, rest = __objRest(_a, [
|
|
2846
2866
|
"size",
|
|
2847
2867
|
"variant",
|
|
@@ -2862,7 +2882,11 @@ function Table(props) {
|
|
|
2862
2882
|
"emptyState",
|
|
2863
2883
|
"hideHeader",
|
|
2864
2884
|
"loadingIndicator",
|
|
2865
|
-
"style"
|
|
2885
|
+
"style",
|
|
2886
|
+
"headerCellClassName",
|
|
2887
|
+
"bodyCellClassName",
|
|
2888
|
+
"rowClassName",
|
|
2889
|
+
"rowSpacing"
|
|
2866
2890
|
]);
|
|
2867
2891
|
const isChildVariant = isAccordion || isToolbar;
|
|
2868
2892
|
const resolvedPagination = buildPagination(pagination, {
|
|
@@ -2872,9 +2896,8 @@ function Table(props) {
|
|
|
2872
2896
|
onChange: onPaginationChange
|
|
2873
2897
|
});
|
|
2874
2898
|
const processedColumns = React5.useMemo(
|
|
2875
|
-
() => processColumns(columns),
|
|
2876
|
-
|
|
2877
|
-
[columns]
|
|
2899
|
+
() => processColumns(columns, headerCellClassName, bodyCellClassName),
|
|
2900
|
+
[columns, headerCellClassName, bodyCellClassName]
|
|
2878
2901
|
);
|
|
2879
2902
|
const resolvedOnRow = React5.useMemo(() => {
|
|
2880
2903
|
const onChange = rowSelection == null ? void 0 : rowSelection.onChange;
|
|
@@ -2900,17 +2923,30 @@ function Table(props) {
|
|
|
2900
2923
|
});
|
|
2901
2924
|
};
|
|
2902
2925
|
}, [variant, rowSelection, rowKey, onRow, dataSource]);
|
|
2926
|
+
const hasRowSpacing = rowSpacing !== void 0;
|
|
2927
|
+
const rowSpacingValue = typeof rowSpacing === "number" ? `${rowSpacing}px` : rowSpacing;
|
|
2928
|
+
const wrapperStyle = React5.useMemo(() => {
|
|
2929
|
+
if (!hasRowSpacing) return style;
|
|
2930
|
+
return __spreadProps(__spreadValues({}, style), {
|
|
2931
|
+
"--lumina-table-row-spacing": rowSpacingValue
|
|
2932
|
+
});
|
|
2933
|
+
}, [style, hasRowSpacing, rowSpacingValue]);
|
|
2903
2934
|
return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
2904
2935
|
"div",
|
|
2905
2936
|
{
|
|
2906
2937
|
className: (0, import_clsx12.default)(
|
|
2907
2938
|
Table_module_default.tableWrapper,
|
|
2908
2939
|
Table_module_default.showHoverEffect,
|
|
2909
|
-
{
|
|
2910
|
-
|
|
2940
|
+
{
|
|
2941
|
+
[Table_module_default.isAccordion]: isAccordion,
|
|
2942
|
+
[Table_module_default.isToolbar]: isToolbar,
|
|
2943
|
+
[Table_module_default.hasCustomHeaderCell]: !!headerCellClassName,
|
|
2944
|
+
[Table_module_default.hasCustomBodyCell]: !!bodyCellClassName,
|
|
2945
|
+
[Table_module_default.hasRowSpacing]: hasRowSpacing
|
|
2946
|
+
},
|
|
2911
2947
|
className
|
|
2912
2948
|
),
|
|
2913
|
-
style,
|
|
2949
|
+
style: wrapperStyle,
|
|
2914
2950
|
"data-testid": "lumina-table",
|
|
2915
2951
|
children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
|
|
2916
2952
|
import_antd10.Table,
|
|
@@ -2929,12 +2965,15 @@ function Table(props) {
|
|
|
2929
2965
|
}
|
|
2930
2966
|
}, rest), {
|
|
2931
2967
|
loading: loadingIndicator ? { spinning: !!loading && ((_b = dataSource == null ? void 0 : dataSource.length) != null ? _b : 0) > 0, indicator: loadingIndicator } : loading,
|
|
2932
|
-
rowClassName: (
|
|
2968
|
+
rowClassName: (record, index) => {
|
|
2933
2969
|
var _a2;
|
|
2934
|
-
return (0, import_clsx12.default)(
|
|
2935
|
-
|
|
2936
|
-
|
|
2937
|
-
|
|
2970
|
+
return (0, import_clsx12.default)(
|
|
2971
|
+
{
|
|
2972
|
+
[Table_module_default.firstRow]: index === 0,
|
|
2973
|
+
[Table_module_default.lastRow]: index === ((_a2 = dataSource == null ? void 0 : dataSource.length) != null ? _a2 : 0) - 1
|
|
2974
|
+
},
|
|
2975
|
+
typeof rowClassName === "function" ? rowClassName(record, index) : rowClassName
|
|
2976
|
+
);
|
|
2938
2977
|
}
|
|
2939
2978
|
})
|
|
2940
2979
|
)
|
package/dist/index.mjs
CHANGED
|
@@ -1,24 +1,24 @@
|
|
|
1
|
+
import {
|
|
2
|
+
Table
|
|
3
|
+
} from "./chunk-LRNKIRH3.mjs";
|
|
1
4
|
import {
|
|
2
5
|
UserProfile_default
|
|
3
6
|
} from "./chunk-N2WTNCQU.mjs";
|
|
4
|
-
import {
|
|
5
|
-
Tag_default
|
|
6
|
-
} from "./chunk-4VZB2KR2.mjs";
|
|
7
7
|
import {
|
|
8
8
|
Radio_default
|
|
9
9
|
} from "./chunk-2EBPXGRY.mjs";
|
|
10
10
|
import {
|
|
11
11
|
RangePicker_default
|
|
12
12
|
} from "./chunk-4JX54OKI.mjs";
|
|
13
|
-
import {
|
|
14
|
-
Slider_default
|
|
15
|
-
} from "./chunk-D3N7VFER.mjs";
|
|
16
13
|
import {
|
|
17
14
|
Switch_default
|
|
18
15
|
} from "./chunk-MNARBWAJ.mjs";
|
|
19
16
|
import {
|
|
20
|
-
|
|
21
|
-
} from "./chunk-
|
|
17
|
+
Slider_default
|
|
18
|
+
} from "./chunk-D3N7VFER.mjs";
|
|
19
|
+
import {
|
|
20
|
+
Tag_default
|
|
21
|
+
} from "./chunk-4VZB2KR2.mjs";
|
|
22
22
|
import {
|
|
23
23
|
AdvancedDateRangePicker
|
|
24
24
|
} from "./chunk-UC4NTBDH.mjs";
|
|
@@ -30,18 +30,18 @@ import {
|
|
|
30
30
|
} from "./chunk-MLCMZRUC.mjs";
|
|
31
31
|
import "./chunk-FPH63V2R.mjs";
|
|
32
32
|
import "./chunk-ZTRM4HZJ.mjs";
|
|
33
|
-
import {
|
|
34
|
-
Avatar_default
|
|
35
|
-
} from "./chunk-IWO2Y5QX.mjs";
|
|
36
33
|
import {
|
|
37
34
|
Checkbox_default
|
|
38
35
|
} from "./chunk-UQZNUEZE.mjs";
|
|
36
|
+
import {
|
|
37
|
+
Modal_default
|
|
38
|
+
} from "./chunk-UQJ3BDM4.mjs";
|
|
39
39
|
import {
|
|
40
40
|
LoadingSpinner_default
|
|
41
41
|
} from "./chunk-QKTMWS4J.mjs";
|
|
42
42
|
import {
|
|
43
|
-
|
|
44
|
-
} from "./chunk-
|
|
43
|
+
Avatar_default
|
|
44
|
+
} from "./chunk-IWO2Y5QX.mjs";
|
|
45
45
|
import {
|
|
46
46
|
Button_default
|
|
47
47
|
} from "./chunk-AF2RKLH6.mjs";
|