@deepnoid/ui 0.0.95 → 0.0.96
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/{chunk-JWFWFBQM.mjs → chunk-HAKQYVWB.mjs} +52 -23
- package/dist/{chunk-VG4644BG.mjs → chunk-PO3ADNA5.mjs} +6 -6
- package/dist/{chunk-PR277HT5.mjs → chunk-QDDEQY63.mjs} +15 -8
- package/dist/components/accordion/accordion.test.mjs +3 -3
- package/dist/components/button/button-group.test.mjs +3 -3
- package/dist/components/button/button.test.mjs +3 -3
- package/dist/components/checkbox/checkbox.test.mjs +3 -3
- package/dist/components/dateTimePicker/dateTimePicker.mjs +3 -3
- package/dist/components/dateTimePicker/index.mjs +3 -3
- package/dist/components/input/input.test.mjs +1 -1
- package/dist/components/modal/modal.test.mjs +1 -1
- package/dist/components/select/select.test.mjs +3 -3
- package/dist/components/table/index.js +71 -35
- package/dist/components/table/index.mjs +3 -3
- package/dist/components/table/table-body.d.mts +7 -4
- package/dist/components/table/table-body.d.ts +7 -4
- package/dist/components/table/table-body.js +15 -8
- package/dist/components/table/table-body.mjs +1 -1
- package/dist/components/table/table-head.d.mts +4 -4
- package/dist/components/table/table-head.d.ts +4 -4
- package/dist/components/table/table-head.js +6 -6
- package/dist/components/table/table-head.mjs +1 -1
- package/dist/components/table/table.d.mts +51 -7
- package/dist/components/table/table.d.ts +51 -7
- package/dist/components/table/table.js +71 -35
- package/dist/components/table/table.mjs +3 -3
- package/dist/components/table/table.test.js +71 -35
- package/dist/components/table/table.test.mjs +3 -3
- package/dist/components/tabs/tabs.test.mjs +3 -3
- package/dist/components/textarea/textarea.test.mjs +1 -1
- package/dist/components/tooltip/tooltip.test.mjs +3 -3
- package/dist/index.js +71 -35
- package/dist/index.mjs +37 -37
- package/package.json +1 -1
- package/dist/{chunk-ON2OTH5K.mjs → chunk-I5SI4OCM.mjs} +3 -3
|
@@ -13,7 +13,9 @@ interface Props extends Omit<React__default.ComponentPropsWithRef<"table">, "ref
|
|
|
13
13
|
onRowAction?: (e: React__default.MouseEvent, params: TableRow) => void;
|
|
14
14
|
}
|
|
15
15
|
interface TableRef {
|
|
16
|
+
checkedRows: Set<number>;
|
|
16
17
|
selectedRows: Set<number>;
|
|
18
|
+
setCheckedRows: (rows: Set<number>) => void;
|
|
17
19
|
setSelectedRows: (rows: Set<number>) => void;
|
|
18
20
|
}
|
|
19
21
|
declare const Table: React__default.ForwardRefExoticComponent<Props & TableVariantProps & React__default.RefAttributes<TableRef>>;
|
|
@@ -65,7 +67,13 @@ declare const table: tailwind_variants.TVReturnType<{
|
|
|
65
67
|
isSelected: {
|
|
66
68
|
true: {};
|
|
67
69
|
};
|
|
68
|
-
|
|
70
|
+
isMultiSelect: {
|
|
71
|
+
true: {};
|
|
72
|
+
};
|
|
73
|
+
isChecked: {
|
|
74
|
+
true: {};
|
|
75
|
+
};
|
|
76
|
+
isCheckedRow: {
|
|
69
77
|
true: {
|
|
70
78
|
tr: string;
|
|
71
79
|
};
|
|
@@ -151,7 +159,13 @@ declare const table: tailwind_variants.TVReturnType<{
|
|
|
151
159
|
isSelected: {
|
|
152
160
|
true: {};
|
|
153
161
|
};
|
|
154
|
-
|
|
162
|
+
isMultiSelect: {
|
|
163
|
+
true: {};
|
|
164
|
+
};
|
|
165
|
+
isChecked: {
|
|
166
|
+
true: {};
|
|
167
|
+
};
|
|
168
|
+
isCheckedRow: {
|
|
155
169
|
true: {
|
|
156
170
|
tr: string;
|
|
157
171
|
};
|
|
@@ -224,7 +238,13 @@ declare const table: tailwind_variants.TVReturnType<{
|
|
|
224
238
|
isSelected: {
|
|
225
239
|
true: {};
|
|
226
240
|
};
|
|
227
|
-
|
|
241
|
+
isMultiSelect: {
|
|
242
|
+
true: {};
|
|
243
|
+
};
|
|
244
|
+
isChecked: {
|
|
245
|
+
true: {};
|
|
246
|
+
};
|
|
247
|
+
isCheckedRow: {
|
|
228
248
|
true: {
|
|
229
249
|
tr: string;
|
|
230
250
|
};
|
|
@@ -297,7 +317,13 @@ declare const table: tailwind_variants.TVReturnType<{
|
|
|
297
317
|
isSelected: {
|
|
298
318
|
true: {};
|
|
299
319
|
};
|
|
300
|
-
|
|
320
|
+
isMultiSelect: {
|
|
321
|
+
true: {};
|
|
322
|
+
};
|
|
323
|
+
isChecked: {
|
|
324
|
+
true: {};
|
|
325
|
+
};
|
|
326
|
+
isCheckedRow: {
|
|
301
327
|
true: {
|
|
302
328
|
tr: string;
|
|
303
329
|
};
|
|
@@ -383,7 +409,13 @@ declare const table: tailwind_variants.TVReturnType<{
|
|
|
383
409
|
isSelected: {
|
|
384
410
|
true: {};
|
|
385
411
|
};
|
|
386
|
-
|
|
412
|
+
isMultiSelect: {
|
|
413
|
+
true: {};
|
|
414
|
+
};
|
|
415
|
+
isChecked: {
|
|
416
|
+
true: {};
|
|
417
|
+
};
|
|
418
|
+
isCheckedRow: {
|
|
387
419
|
true: {
|
|
388
420
|
tr: string;
|
|
389
421
|
};
|
|
@@ -469,7 +501,13 @@ declare const table: tailwind_variants.TVReturnType<{
|
|
|
469
501
|
isSelected: {
|
|
470
502
|
true: {};
|
|
471
503
|
};
|
|
472
|
-
|
|
504
|
+
isMultiSelect: {
|
|
505
|
+
true: {};
|
|
506
|
+
};
|
|
507
|
+
isChecked: {
|
|
508
|
+
true: {};
|
|
509
|
+
};
|
|
510
|
+
isCheckedRow: {
|
|
473
511
|
true: {
|
|
474
512
|
tr: string;
|
|
475
513
|
};
|
|
@@ -542,7 +580,13 @@ declare const table: tailwind_variants.TVReturnType<{
|
|
|
542
580
|
isSelected: {
|
|
543
581
|
true: {};
|
|
544
582
|
};
|
|
545
|
-
|
|
583
|
+
isMultiSelect: {
|
|
584
|
+
true: {};
|
|
585
|
+
};
|
|
586
|
+
isChecked: {
|
|
587
|
+
true: {};
|
|
588
|
+
};
|
|
589
|
+
isCheckedRow: {
|
|
546
590
|
true: {
|
|
547
591
|
tr: string;
|
|
548
592
|
};
|
|
@@ -318,10 +318,10 @@ var TableHead = ({
|
|
|
318
318
|
size,
|
|
319
319
|
color,
|
|
320
320
|
isExpanded,
|
|
321
|
-
|
|
322
|
-
|
|
321
|
+
isChecked,
|
|
322
|
+
isCheckedAll,
|
|
323
323
|
classNames,
|
|
324
|
-
|
|
324
|
+
onCheckAll
|
|
325
325
|
}) => {
|
|
326
326
|
const getTheadProps = (0, import_react2.useCallback)(
|
|
327
327
|
() => ({
|
|
@@ -341,12 +341,12 @@ var TableHead = ({
|
|
|
341
341
|
}),
|
|
342
342
|
[classNames == null ? void 0 : classNames.th, slots]
|
|
343
343
|
);
|
|
344
|
-
const
|
|
344
|
+
const handleClickCheckAll = (e) => {
|
|
345
345
|
e.preventDefault();
|
|
346
|
-
|
|
346
|
+
onCheckAll(!isCheckedAll);
|
|
347
347
|
};
|
|
348
348
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("thead", { ...getTheadProps(), children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("tr", { ...getTrProps(), children: [
|
|
349
|
-
|
|
349
|
+
isChecked && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("th", { className: "w-[40px]", onClick: handleClickCheckAll, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(checkbox_default, { size, color, checked: isCheckedAll, classNames: { wrapper: "bg-background" } }) }),
|
|
350
350
|
isExpanded && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("th", { className: "w-[40px]" }),
|
|
351
351
|
columns.map((column, index) => /* @__PURE__ */ (0, import_react3.createElement)("th", { ...getThProps(column), key: column.field + index + "th" }, column.headerName))
|
|
352
352
|
] }) });
|
|
@@ -3937,13 +3937,16 @@ var TableBody = ({
|
|
|
3937
3937
|
columns,
|
|
3938
3938
|
isExpanded,
|
|
3939
3939
|
isSelected,
|
|
3940
|
-
|
|
3940
|
+
isChecked,
|
|
3941
|
+
isCheckedRow,
|
|
3941
3942
|
selectedRows,
|
|
3943
|
+
checkedRows,
|
|
3942
3944
|
emptyContent,
|
|
3943
|
-
|
|
3945
|
+
onCheckedRow,
|
|
3946
|
+
onSelectedRow,
|
|
3944
3947
|
onRowAction
|
|
3945
3948
|
}) => {
|
|
3946
|
-
const COL_SPAN_COUNT = columns.length + (isExpanded ? 1 : 0) + (
|
|
3949
|
+
const COL_SPAN_COUNT = columns.length + (isExpanded ? 1 : 0) + (isChecked ? 1 : 0);
|
|
3947
3950
|
const [expandedRows, setExpandedRows] = (0, import_react4.useState)(/* @__PURE__ */ new Set());
|
|
3948
3951
|
(0, import_react4.useEffect)(() => {
|
|
3949
3952
|
setExpandedRows(/* @__PURE__ */ new Set());
|
|
@@ -3956,11 +3959,14 @@ var TableBody = ({
|
|
|
3956
3959
|
);
|
|
3957
3960
|
const getTrProps = (0, import_react4.useCallback)(
|
|
3958
3961
|
(index) => ({
|
|
3959
|
-
className: clsx(
|
|
3962
|
+
className: clsx(
|
|
3963
|
+
slots.tr({ class: [classNames == null ? void 0 : classNames.tr, (isSelected || isCheckedRow || isExpanded) && "cursor-pointer"] })
|
|
3964
|
+
),
|
|
3960
3965
|
"data-odd": index % 2 !== 0,
|
|
3961
|
-
"data-expanded": expandedRows.has(index)
|
|
3966
|
+
"data-expanded": expandedRows.has(index),
|
|
3967
|
+
"data-selected": selectedRows == null ? void 0 : selectedRows.has(index)
|
|
3962
3968
|
}),
|
|
3963
|
-
[classNames == null ? void 0 : classNames.tr, expandedRows, slots]
|
|
3969
|
+
[classNames == null ? void 0 : classNames.tr, expandedRows, isCheckedRow, isExpanded, isSelected, selectedRows, slots]
|
|
3964
3970
|
);
|
|
3965
3971
|
const getExpandedContentProps = (0, import_react4.useCallback)(
|
|
3966
3972
|
() => ({
|
|
@@ -4011,7 +4017,8 @@ var TableBody = ({
|
|
|
4011
4017
|
e.stopPropagation();
|
|
4012
4018
|
e.preventDefault();
|
|
4013
4019
|
if (isExpanded) onChangeExpandedRow(index);
|
|
4014
|
-
if (isSelected
|
|
4020
|
+
if (isSelected) onSelectedRow(index);
|
|
4021
|
+
if (isChecked && isCheckedRow) onCheckedRow(index);
|
|
4015
4022
|
const row = rows[index];
|
|
4016
4023
|
if (row) {
|
|
4017
4024
|
(_a = row.onRowAction) == null ? void 0 : _a.call(row, e, row);
|
|
@@ -4021,7 +4028,7 @@ var TableBody = ({
|
|
|
4021
4028
|
const keys = Object.keys(row);
|
|
4022
4029
|
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react4.default.Fragment, { children: [
|
|
4023
4030
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("tr", { ...getTrProps(rowIndex), onClick: handleRowClick(rowIndex), children: [
|
|
4024
|
-
|
|
4031
|
+
isChecked && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("td", { ...getTdProps({ field: "checkbox" }, row, keys), onClick: () => onCheckedRow(rowIndex), children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(checkbox_default, { color, size, checked: checkedRows.has(rowIndex) }) }),
|
|
4025
4032
|
isExpanded && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("td", { ...getTdProps({ field: "expandIcon" }, row, keys), children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
4026
4033
|
Icon_default,
|
|
4027
4034
|
{
|
|
@@ -4044,6 +4051,7 @@ var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
|
4044
4051
|
var Table = (0, import_react6.forwardRef)((originalProps, ref) => {
|
|
4045
4052
|
const [props, variantProps] = mapPropsVariants(originalProps, table.variantKeys);
|
|
4046
4053
|
const { classNames, rows, columns, isLoading, className, emptyContent, onRowAction, ...tableComponentsProps } = props;
|
|
4054
|
+
const [checkedRows, setCheckedRows] = (0, import_react6.useState)(/* @__PURE__ */ new Set());
|
|
4047
4055
|
const [selectedRows, setSelectedRows] = (0, import_react6.useState)(/* @__PURE__ */ new Set());
|
|
4048
4056
|
const slots = (0, import_react6.useMemo)(() => table({ ...variantProps }), [...Object.values(variantProps)]);
|
|
4049
4057
|
const getBaseProps = (0, import_react6.useCallback)(
|
|
@@ -4060,21 +4068,41 @@ var Table = (0, import_react6.forwardRef)((originalProps, ref) => {
|
|
|
4060
4068
|
}),
|
|
4061
4069
|
[classNames == null ? void 0 : classNames.table, slots]
|
|
4062
4070
|
);
|
|
4063
|
-
const
|
|
4064
|
-
const
|
|
4065
|
-
|
|
4071
|
+
const handleCheckAll = (isChecked) => {
|
|
4072
|
+
const newCheckedRows = isChecked ? new Set(rows.map((_, index) => index)) : /* @__PURE__ */ new Set();
|
|
4073
|
+
setCheckedRows(newCheckedRows);
|
|
4074
|
+
};
|
|
4075
|
+
const handleCheckRow = (index) => {
|
|
4076
|
+
const newCheckedRows = new Set(checkedRows);
|
|
4077
|
+
if (newCheckedRows.has(index)) {
|
|
4078
|
+
newCheckedRows.delete(index);
|
|
4079
|
+
} else {
|
|
4080
|
+
newCheckedRows.add(index);
|
|
4081
|
+
}
|
|
4082
|
+
setCheckedRows(newCheckedRows);
|
|
4066
4083
|
};
|
|
4067
4084
|
const handleSelectRow = (index) => {
|
|
4068
4085
|
const newSelectedRows = new Set(selectedRows);
|
|
4069
|
-
if (
|
|
4070
|
-
newSelectedRows.
|
|
4086
|
+
if (originalProps.isMultiSelect) {
|
|
4087
|
+
if (newSelectedRows.has(index)) {
|
|
4088
|
+
newSelectedRows.delete(index);
|
|
4089
|
+
} else {
|
|
4090
|
+
newSelectedRows.add(index);
|
|
4091
|
+
}
|
|
4071
4092
|
} else {
|
|
4072
|
-
newSelectedRows.
|
|
4093
|
+
if (newSelectedRows.has(index)) {
|
|
4094
|
+
newSelectedRows.delete(index);
|
|
4095
|
+
} else {
|
|
4096
|
+
newSelectedRows.clear();
|
|
4097
|
+
newSelectedRows.add(index);
|
|
4098
|
+
}
|
|
4073
4099
|
}
|
|
4074
4100
|
setSelectedRows(newSelectedRows);
|
|
4075
4101
|
};
|
|
4076
4102
|
(0, import_react6.useImperativeHandle)(ref, () => ({
|
|
4103
|
+
checkedRows,
|
|
4077
4104
|
selectedRows,
|
|
4105
|
+
setCheckedRows,
|
|
4078
4106
|
setSelectedRows
|
|
4079
4107
|
}));
|
|
4080
4108
|
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { ref, "data-table": "base", ...getBaseProps(), children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("table", { ...getTableProps(tableComponentsProps), children: [
|
|
@@ -4086,10 +4114,10 @@ var Table = (0, import_react6.forwardRef)((originalProps, ref) => {
|
|
|
4086
4114
|
columns,
|
|
4087
4115
|
size: originalProps.size,
|
|
4088
4116
|
color: originalProps.color === "neutral" ? "primary" : originalProps.color,
|
|
4089
|
-
|
|
4117
|
+
isChecked: originalProps.isChecked,
|
|
4090
4118
|
isExpanded: originalProps.isExpanded,
|
|
4091
|
-
|
|
4092
|
-
|
|
4119
|
+
onCheckAll: handleCheckAll,
|
|
4120
|
+
isCheckedAll: checkedRows.size === rows.length
|
|
4093
4121
|
}
|
|
4094
4122
|
),
|
|
4095
4123
|
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
@@ -4101,13 +4129,16 @@ var Table = (0, import_react6.forwardRef)((originalProps, ref) => {
|
|
|
4101
4129
|
size: originalProps.size,
|
|
4102
4130
|
color: originalProps.color === "neutral" ? "primary" : originalProps.color,
|
|
4103
4131
|
isSelected: originalProps.isSelected,
|
|
4104
|
-
|
|
4132
|
+
isChecked: originalProps.isChecked,
|
|
4133
|
+
isCheckedRow: originalProps.isCheckedRow,
|
|
4105
4134
|
isExpanded: originalProps.isExpanded,
|
|
4106
4135
|
isLoading,
|
|
4107
4136
|
classNames,
|
|
4108
4137
|
emptyContent,
|
|
4109
4138
|
selectedRows,
|
|
4110
|
-
|
|
4139
|
+
checkedRows,
|
|
4140
|
+
onCheckedRow: handleCheckRow,
|
|
4141
|
+
onSelectedRow: handleSelectRow,
|
|
4111
4142
|
onRowAction
|
|
4112
4143
|
}
|
|
4113
4144
|
)
|
|
@@ -4124,7 +4155,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
4124
4155
|
tr: ["group", "outline-none"],
|
|
4125
4156
|
th: [
|
|
4126
4157
|
"text-foreground",
|
|
4127
|
-
"text-center",
|
|
4158
|
+
"!text-center",
|
|
4128
4159
|
"align-middle",
|
|
4129
4160
|
"whitespace-nowrap",
|
|
4130
4161
|
"font-normal",
|
|
@@ -4143,7 +4174,6 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
4143
4174
|
"[&>*]:z-1",
|
|
4144
4175
|
"[&>*]:relative",
|
|
4145
4176
|
"transition duration-200",
|
|
4146
|
-
"data-[selected=true]:before:opacity-100",
|
|
4147
4177
|
"group-data-[disabled=true]:text-default-300"
|
|
4148
4178
|
],
|
|
4149
4179
|
tfoot: "",
|
|
@@ -4209,7 +4239,13 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
4209
4239
|
isSelected: {
|
|
4210
4240
|
true: {}
|
|
4211
4241
|
},
|
|
4212
|
-
|
|
4242
|
+
isMultiSelect: {
|
|
4243
|
+
true: {}
|
|
4244
|
+
},
|
|
4245
|
+
isChecked: {
|
|
4246
|
+
true: {}
|
|
4247
|
+
},
|
|
4248
|
+
isCheckedRow: {
|
|
4213
4249
|
true: {
|
|
4214
4250
|
tr: "cursor-pointer"
|
|
4215
4251
|
}
|
|
@@ -4241,7 +4277,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
4241
4277
|
color: "primary",
|
|
4242
4278
|
variant: "solid",
|
|
4243
4279
|
size: "md",
|
|
4244
|
-
|
|
4280
|
+
isChecked: false,
|
|
4245
4281
|
isExpanded: false,
|
|
4246
4282
|
isCompact: false,
|
|
4247
4283
|
hideHeader: false,
|
|
@@ -4254,7 +4290,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
4254
4290
|
color: "primary",
|
|
4255
4291
|
class: {
|
|
4256
4292
|
thead: "[&>tr]:bg-primary-light",
|
|
4257
|
-
tr: "data-[expanded=true]:bg-primary-soft"
|
|
4293
|
+
tr: ["data-[expanded=true]:bg-primary-soft", "data-[selected=true]:bg-primary-soft"]
|
|
4258
4294
|
}
|
|
4259
4295
|
},
|
|
4260
4296
|
{
|
|
@@ -4262,7 +4298,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
4262
4298
|
color: "secondary",
|
|
4263
4299
|
class: {
|
|
4264
4300
|
thead: "[&>tr]:bg-secondary-light",
|
|
4265
|
-
tr: "data-[expanded=true]:bg-secondary-soft"
|
|
4301
|
+
tr: ["data-[expanded=true]:bg-secondary-soft", "data-[selected=true]:bg-secondary-soft"]
|
|
4266
4302
|
}
|
|
4267
4303
|
},
|
|
4268
4304
|
{
|
|
@@ -4270,7 +4306,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
4270
4306
|
color: "neutral",
|
|
4271
4307
|
class: {
|
|
4272
4308
|
thead: "[&>tr]:bg-trans-light",
|
|
4273
|
-
tr: "data-[expanded=true]:bg-neutral-soft"
|
|
4309
|
+
tr: ["data-[expanded=true]:bg-neutral-soft", "data-[selected=true]:bg-neutral-soft"]
|
|
4274
4310
|
}
|
|
4275
4311
|
},
|
|
4276
4312
|
{
|
|
@@ -4278,7 +4314,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
4278
4314
|
color: "primary",
|
|
4279
4315
|
class: {
|
|
4280
4316
|
thead: "border-primary-light",
|
|
4281
|
-
tr: "data-[expanded=true]:bg-primary-soft"
|
|
4317
|
+
tr: ["data-[expanded=true]:bg-primary-soft", "data-[selected=true]:bg-primary-soft"]
|
|
4282
4318
|
}
|
|
4283
4319
|
},
|
|
4284
4320
|
{
|
|
@@ -4286,7 +4322,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
4286
4322
|
color: "secondary",
|
|
4287
4323
|
class: {
|
|
4288
4324
|
thead: "border-secondary-light",
|
|
4289
|
-
tr: "data-[expanded=true]:bg-secondary-soft"
|
|
4325
|
+
tr: ["data-[expanded=true]:bg-secondary-soft", "data-[selected=true]:bg-secondary-soft"]
|
|
4290
4326
|
}
|
|
4291
4327
|
},
|
|
4292
4328
|
{
|
|
@@ -4294,7 +4330,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
4294
4330
|
color: "neutral",
|
|
4295
4331
|
class: {
|
|
4296
4332
|
thead: "border-trans-light",
|
|
4297
|
-
tr: "data-[expanded=true]:bg-neutral-soft"
|
|
4333
|
+
tr: ["data-[expanded=true]:bg-neutral-soft", "data-[selected=true]:bg-neutral-soft"]
|
|
4298
4334
|
}
|
|
4299
4335
|
},
|
|
4300
4336
|
{
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import {
|
|
3
3
|
table_default
|
|
4
|
-
} from "../../chunk-
|
|
5
|
-
import "../../chunk-
|
|
6
|
-
import "../../chunk-
|
|
4
|
+
} from "../../chunk-HAKQYVWB.mjs";
|
|
5
|
+
import "../../chunk-QDDEQY63.mjs";
|
|
6
|
+
import "../../chunk-PO3ADNA5.mjs";
|
|
7
7
|
import "../../chunk-QZ3LVYJW.mjs";
|
|
8
8
|
import "../../chunk-ANYPMQH4.mjs";
|
|
9
9
|
import "../../chunk-27Y6K5NK.mjs";
|
|
@@ -13155,10 +13155,10 @@ var TableHead = ({
|
|
|
13155
13155
|
size,
|
|
13156
13156
|
color,
|
|
13157
13157
|
isExpanded,
|
|
13158
|
-
|
|
13159
|
-
|
|
13158
|
+
isChecked,
|
|
13159
|
+
isCheckedAll,
|
|
13160
13160
|
classNames,
|
|
13161
|
-
|
|
13161
|
+
onCheckAll
|
|
13162
13162
|
}) => {
|
|
13163
13163
|
const getTheadProps = (0, import_react2.useCallback)(
|
|
13164
13164
|
() => ({
|
|
@@ -13178,12 +13178,12 @@ var TableHead = ({
|
|
|
13178
13178
|
}),
|
|
13179
13179
|
[classNames == null ? void 0 : classNames.th, slots]
|
|
13180
13180
|
);
|
|
13181
|
-
const
|
|
13181
|
+
const handleClickCheckAll = (e) => {
|
|
13182
13182
|
e.preventDefault();
|
|
13183
|
-
|
|
13183
|
+
onCheckAll(!isCheckedAll);
|
|
13184
13184
|
};
|
|
13185
13185
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("thead", { ...getTheadProps(), children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("tr", { ...getTrProps(), children: [
|
|
13186
|
-
|
|
13186
|
+
isChecked && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("th", { className: "w-[40px]", onClick: handleClickCheckAll, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(checkbox_default, { size, color, checked: isCheckedAll, classNames: { wrapper: "bg-background" } }) }),
|
|
13187
13187
|
isExpanded && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("th", { className: "w-[40px]" }),
|
|
13188
13188
|
columns2.map((column, index) => /* @__PURE__ */ (0, import_react3.createElement)("th", { ...getThProps(column), key: column.field + index + "th" }, column.headerName))
|
|
13189
13189
|
] }) });
|
|
@@ -16774,13 +16774,16 @@ var TableBody = ({
|
|
|
16774
16774
|
columns: columns2,
|
|
16775
16775
|
isExpanded,
|
|
16776
16776
|
isSelected,
|
|
16777
|
-
|
|
16777
|
+
isChecked,
|
|
16778
|
+
isCheckedRow,
|
|
16778
16779
|
selectedRows,
|
|
16780
|
+
checkedRows,
|
|
16779
16781
|
emptyContent,
|
|
16780
|
-
|
|
16782
|
+
onCheckedRow,
|
|
16783
|
+
onSelectedRow,
|
|
16781
16784
|
onRowAction
|
|
16782
16785
|
}) => {
|
|
16783
|
-
const COL_SPAN_COUNT = columns2.length + (isExpanded ? 1 : 0) + (
|
|
16786
|
+
const COL_SPAN_COUNT = columns2.length + (isExpanded ? 1 : 0) + (isChecked ? 1 : 0);
|
|
16784
16787
|
const [expandedRows, setExpandedRows] = (0, import_react4.useState)(/* @__PURE__ */ new Set());
|
|
16785
16788
|
(0, import_react4.useEffect)(() => {
|
|
16786
16789
|
setExpandedRows(/* @__PURE__ */ new Set());
|
|
@@ -16793,11 +16796,14 @@ var TableBody = ({
|
|
|
16793
16796
|
);
|
|
16794
16797
|
const getTrProps = (0, import_react4.useCallback)(
|
|
16795
16798
|
(index) => ({
|
|
16796
|
-
className: clsx(
|
|
16799
|
+
className: clsx(
|
|
16800
|
+
slots.tr({ class: [classNames == null ? void 0 : classNames.tr, (isSelected || isCheckedRow || isExpanded) && "cursor-pointer"] })
|
|
16801
|
+
),
|
|
16797
16802
|
"data-odd": index % 2 !== 0,
|
|
16798
|
-
"data-expanded": expandedRows.has(index)
|
|
16803
|
+
"data-expanded": expandedRows.has(index),
|
|
16804
|
+
"data-selected": selectedRows == null ? void 0 : selectedRows.has(index)
|
|
16799
16805
|
}),
|
|
16800
|
-
[classNames == null ? void 0 : classNames.tr, expandedRows, slots]
|
|
16806
|
+
[classNames == null ? void 0 : classNames.tr, expandedRows, isCheckedRow, isExpanded, isSelected, selectedRows, slots]
|
|
16801
16807
|
);
|
|
16802
16808
|
const getExpandedContentProps = (0, import_react4.useCallback)(
|
|
16803
16809
|
() => ({
|
|
@@ -16848,7 +16854,8 @@ var TableBody = ({
|
|
|
16848
16854
|
e.stopPropagation();
|
|
16849
16855
|
e.preventDefault();
|
|
16850
16856
|
if (isExpanded) onChangeExpandedRow(index);
|
|
16851
|
-
if (isSelected
|
|
16857
|
+
if (isSelected) onSelectedRow(index);
|
|
16858
|
+
if (isChecked && isCheckedRow) onCheckedRow(index);
|
|
16852
16859
|
const row = rows2[index];
|
|
16853
16860
|
if (row) {
|
|
16854
16861
|
(_a2 = row.onRowAction) == null ? void 0 : _a2.call(row, e, row);
|
|
@@ -16858,7 +16865,7 @@ var TableBody = ({
|
|
|
16858
16865
|
const keys = Object.keys(row);
|
|
16859
16866
|
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_react4.default.Fragment, { children: [
|
|
16860
16867
|
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("tr", { ...getTrProps(rowIndex), onClick: handleRowClick(rowIndex), children: [
|
|
16861
|
-
|
|
16868
|
+
isChecked && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("td", { ...getTdProps({ field: "checkbox" }, row, keys), onClick: () => onCheckedRow(rowIndex), children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(checkbox_default, { color, size, checked: checkedRows.has(rowIndex) }) }),
|
|
16862
16869
|
isExpanded && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("td", { ...getTdProps({ field: "expandIcon" }, row, keys), children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
16863
16870
|
Icon_default,
|
|
16864
16871
|
{
|
|
@@ -16881,6 +16888,7 @@ var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
|
16881
16888
|
var Table = (0, import_react6.forwardRef)((originalProps, ref) => {
|
|
16882
16889
|
const [props, variantProps] = mapPropsVariants(originalProps, table.variantKeys);
|
|
16883
16890
|
const { classNames, rows: rows2, columns: columns2, isLoading, className, emptyContent, onRowAction, ...tableComponentsProps } = props;
|
|
16891
|
+
const [checkedRows, setCheckedRows] = (0, import_react6.useState)(/* @__PURE__ */ new Set());
|
|
16884
16892
|
const [selectedRows, setSelectedRows] = (0, import_react6.useState)(/* @__PURE__ */ new Set());
|
|
16885
16893
|
const slots = (0, import_react6.useMemo)(() => table({ ...variantProps }), [...Object.values(variantProps)]);
|
|
16886
16894
|
const getBaseProps = (0, import_react6.useCallback)(
|
|
@@ -16897,21 +16905,41 @@ var Table = (0, import_react6.forwardRef)((originalProps, ref) => {
|
|
|
16897
16905
|
}),
|
|
16898
16906
|
[classNames == null ? void 0 : classNames.table, slots]
|
|
16899
16907
|
);
|
|
16900
|
-
const
|
|
16901
|
-
const
|
|
16902
|
-
|
|
16908
|
+
const handleCheckAll = (isChecked) => {
|
|
16909
|
+
const newCheckedRows = isChecked ? new Set(rows2.map((_, index) => index)) : /* @__PURE__ */ new Set();
|
|
16910
|
+
setCheckedRows(newCheckedRows);
|
|
16911
|
+
};
|
|
16912
|
+
const handleCheckRow = (index) => {
|
|
16913
|
+
const newCheckedRows = new Set(checkedRows);
|
|
16914
|
+
if (newCheckedRows.has(index)) {
|
|
16915
|
+
newCheckedRows.delete(index);
|
|
16916
|
+
} else {
|
|
16917
|
+
newCheckedRows.add(index);
|
|
16918
|
+
}
|
|
16919
|
+
setCheckedRows(newCheckedRows);
|
|
16903
16920
|
};
|
|
16904
16921
|
const handleSelectRow = (index) => {
|
|
16905
16922
|
const newSelectedRows = new Set(selectedRows);
|
|
16906
|
-
if (
|
|
16907
|
-
newSelectedRows.
|
|
16923
|
+
if (originalProps.isMultiSelect) {
|
|
16924
|
+
if (newSelectedRows.has(index)) {
|
|
16925
|
+
newSelectedRows.delete(index);
|
|
16926
|
+
} else {
|
|
16927
|
+
newSelectedRows.add(index);
|
|
16928
|
+
}
|
|
16908
16929
|
} else {
|
|
16909
|
-
newSelectedRows.
|
|
16930
|
+
if (newSelectedRows.has(index)) {
|
|
16931
|
+
newSelectedRows.delete(index);
|
|
16932
|
+
} else {
|
|
16933
|
+
newSelectedRows.clear();
|
|
16934
|
+
newSelectedRows.add(index);
|
|
16935
|
+
}
|
|
16910
16936
|
}
|
|
16911
16937
|
setSelectedRows(newSelectedRows);
|
|
16912
16938
|
};
|
|
16913
16939
|
(0, import_react6.useImperativeHandle)(ref, () => ({
|
|
16940
|
+
checkedRows,
|
|
16914
16941
|
selectedRows,
|
|
16942
|
+
setCheckedRows,
|
|
16915
16943
|
setSelectedRows
|
|
16916
16944
|
}));
|
|
16917
16945
|
return /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("div", { ref, "data-table": "base", ...getBaseProps(), children: /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("table", { ...getTableProps(tableComponentsProps), children: [
|
|
@@ -16923,10 +16951,10 @@ var Table = (0, import_react6.forwardRef)((originalProps, ref) => {
|
|
|
16923
16951
|
columns: columns2,
|
|
16924
16952
|
size: originalProps.size,
|
|
16925
16953
|
color: originalProps.color === "neutral" ? "primary" : originalProps.color,
|
|
16926
|
-
|
|
16954
|
+
isChecked: originalProps.isChecked,
|
|
16927
16955
|
isExpanded: originalProps.isExpanded,
|
|
16928
|
-
|
|
16929
|
-
|
|
16956
|
+
onCheckAll: handleCheckAll,
|
|
16957
|
+
isCheckedAll: checkedRows.size === rows2.length
|
|
16930
16958
|
}
|
|
16931
16959
|
),
|
|
16932
16960
|
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
|
|
@@ -16938,13 +16966,16 @@ var Table = (0, import_react6.forwardRef)((originalProps, ref) => {
|
|
|
16938
16966
|
size: originalProps.size,
|
|
16939
16967
|
color: originalProps.color === "neutral" ? "primary" : originalProps.color,
|
|
16940
16968
|
isSelected: originalProps.isSelected,
|
|
16941
|
-
|
|
16969
|
+
isChecked: originalProps.isChecked,
|
|
16970
|
+
isCheckedRow: originalProps.isCheckedRow,
|
|
16942
16971
|
isExpanded: originalProps.isExpanded,
|
|
16943
16972
|
isLoading,
|
|
16944
16973
|
classNames,
|
|
16945
16974
|
emptyContent,
|
|
16946
16975
|
selectedRows,
|
|
16947
|
-
|
|
16976
|
+
checkedRows,
|
|
16977
|
+
onCheckedRow: handleCheckRow,
|
|
16978
|
+
onSelectedRow: handleSelectRow,
|
|
16948
16979
|
onRowAction
|
|
16949
16980
|
}
|
|
16950
16981
|
)
|
|
@@ -16961,7 +16992,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
16961
16992
|
tr: ["group", "outline-none"],
|
|
16962
16993
|
th: [
|
|
16963
16994
|
"text-foreground",
|
|
16964
|
-
"text-center",
|
|
16995
|
+
"!text-center",
|
|
16965
16996
|
"align-middle",
|
|
16966
16997
|
"whitespace-nowrap",
|
|
16967
16998
|
"font-normal",
|
|
@@ -16980,7 +17011,6 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
16980
17011
|
"[&>*]:z-1",
|
|
16981
17012
|
"[&>*]:relative",
|
|
16982
17013
|
"transition duration-200",
|
|
16983
|
-
"data-[selected=true]:before:opacity-100",
|
|
16984
17014
|
"group-data-[disabled=true]:text-default-300"
|
|
16985
17015
|
],
|
|
16986
17016
|
tfoot: "",
|
|
@@ -17046,7 +17076,13 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
17046
17076
|
isSelected: {
|
|
17047
17077
|
true: {}
|
|
17048
17078
|
},
|
|
17049
|
-
|
|
17079
|
+
isMultiSelect: {
|
|
17080
|
+
true: {}
|
|
17081
|
+
},
|
|
17082
|
+
isChecked: {
|
|
17083
|
+
true: {}
|
|
17084
|
+
},
|
|
17085
|
+
isCheckedRow: {
|
|
17050
17086
|
true: {
|
|
17051
17087
|
tr: "cursor-pointer"
|
|
17052
17088
|
}
|
|
@@ -17078,7 +17114,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
17078
17114
|
color: "primary",
|
|
17079
17115
|
variant: "solid",
|
|
17080
17116
|
size: "md",
|
|
17081
|
-
|
|
17117
|
+
isChecked: false,
|
|
17082
17118
|
isExpanded: false,
|
|
17083
17119
|
isCompact: false,
|
|
17084
17120
|
hideHeader: false,
|
|
@@ -17091,7 +17127,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
17091
17127
|
color: "primary",
|
|
17092
17128
|
class: {
|
|
17093
17129
|
thead: "[&>tr]:bg-primary-light",
|
|
17094
|
-
tr: "data-[expanded=true]:bg-primary-soft"
|
|
17130
|
+
tr: ["data-[expanded=true]:bg-primary-soft", "data-[selected=true]:bg-primary-soft"]
|
|
17095
17131
|
}
|
|
17096
17132
|
},
|
|
17097
17133
|
{
|
|
@@ -17099,7 +17135,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
17099
17135
|
color: "secondary",
|
|
17100
17136
|
class: {
|
|
17101
17137
|
thead: "[&>tr]:bg-secondary-light",
|
|
17102
|
-
tr: "data-[expanded=true]:bg-secondary-soft"
|
|
17138
|
+
tr: ["data-[expanded=true]:bg-secondary-soft", "data-[selected=true]:bg-secondary-soft"]
|
|
17103
17139
|
}
|
|
17104
17140
|
},
|
|
17105
17141
|
{
|
|
@@ -17107,7 +17143,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
17107
17143
|
color: "neutral",
|
|
17108
17144
|
class: {
|
|
17109
17145
|
thead: "[&>tr]:bg-trans-light",
|
|
17110
|
-
tr: "data-[expanded=true]:bg-neutral-soft"
|
|
17146
|
+
tr: ["data-[expanded=true]:bg-neutral-soft", "data-[selected=true]:bg-neutral-soft"]
|
|
17111
17147
|
}
|
|
17112
17148
|
},
|
|
17113
17149
|
{
|
|
@@ -17115,7 +17151,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
17115
17151
|
color: "primary",
|
|
17116
17152
|
class: {
|
|
17117
17153
|
thead: "border-primary-light",
|
|
17118
|
-
tr: "data-[expanded=true]:bg-primary-soft"
|
|
17154
|
+
tr: ["data-[expanded=true]:bg-primary-soft", "data-[selected=true]:bg-primary-soft"]
|
|
17119
17155
|
}
|
|
17120
17156
|
},
|
|
17121
17157
|
{
|
|
@@ -17123,7 +17159,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
17123
17159
|
color: "secondary",
|
|
17124
17160
|
class: {
|
|
17125
17161
|
thead: "border-secondary-light",
|
|
17126
|
-
tr: "data-[expanded=true]:bg-secondary-soft"
|
|
17162
|
+
tr: ["data-[expanded=true]:bg-secondary-soft", "data-[selected=true]:bg-secondary-soft"]
|
|
17127
17163
|
}
|
|
17128
17164
|
},
|
|
17129
17165
|
{
|
|
@@ -17131,7 +17167,7 @@ var table = (0, import_tailwind_variants3.tv)({
|
|
|
17131
17167
|
color: "neutral",
|
|
17132
17168
|
class: {
|
|
17133
17169
|
thead: "border-trans-light",
|
|
17134
|
-
tr: "data-[expanded=true]:bg-neutral-soft"
|
|
17170
|
+
tr: ["data-[expanded=true]:bg-neutral-soft", "data-[selected=true]:bg-neutral-soft"]
|
|
17135
17171
|
}
|
|
17136
17172
|
},
|
|
17137
17173
|
{
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import {
|
|
3
3
|
table_default
|
|
4
|
-
} from "../../chunk-
|
|
5
|
-
import "../../chunk-
|
|
6
|
-
import "../../chunk-
|
|
4
|
+
} from "../../chunk-HAKQYVWB.mjs";
|
|
5
|
+
import "../../chunk-QDDEQY63.mjs";
|
|
6
|
+
import "../../chunk-PO3ADNA5.mjs";
|
|
7
7
|
import "../../chunk-QZ3LVYJW.mjs";
|
|
8
8
|
import "../../chunk-ANYPMQH4.mjs";
|
|
9
9
|
import "../../chunk-27Y6K5NK.mjs";
|