@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.
Files changed (35) hide show
  1. package/dist/{chunk-JWFWFBQM.mjs → chunk-HAKQYVWB.mjs} +52 -23
  2. package/dist/{chunk-VG4644BG.mjs → chunk-PO3ADNA5.mjs} +6 -6
  3. package/dist/{chunk-PR277HT5.mjs → chunk-QDDEQY63.mjs} +15 -8
  4. package/dist/components/accordion/accordion.test.mjs +3 -3
  5. package/dist/components/button/button-group.test.mjs +3 -3
  6. package/dist/components/button/button.test.mjs +3 -3
  7. package/dist/components/checkbox/checkbox.test.mjs +3 -3
  8. package/dist/components/dateTimePicker/dateTimePicker.mjs +3 -3
  9. package/dist/components/dateTimePicker/index.mjs +3 -3
  10. package/dist/components/input/input.test.mjs +1 -1
  11. package/dist/components/modal/modal.test.mjs +1 -1
  12. package/dist/components/select/select.test.mjs +3 -3
  13. package/dist/components/table/index.js +71 -35
  14. package/dist/components/table/index.mjs +3 -3
  15. package/dist/components/table/table-body.d.mts +7 -4
  16. package/dist/components/table/table-body.d.ts +7 -4
  17. package/dist/components/table/table-body.js +15 -8
  18. package/dist/components/table/table-body.mjs +1 -1
  19. package/dist/components/table/table-head.d.mts +4 -4
  20. package/dist/components/table/table-head.d.ts +4 -4
  21. package/dist/components/table/table-head.js +6 -6
  22. package/dist/components/table/table-head.mjs +1 -1
  23. package/dist/components/table/table.d.mts +51 -7
  24. package/dist/components/table/table.d.ts +51 -7
  25. package/dist/components/table/table.js +71 -35
  26. package/dist/components/table/table.mjs +3 -3
  27. package/dist/components/table/table.test.js +71 -35
  28. package/dist/components/table/table.test.mjs +3 -3
  29. package/dist/components/tabs/tabs.test.mjs +3 -3
  30. package/dist/components/textarea/textarea.test.mjs +1 -1
  31. package/dist/components/tooltip/tooltip.test.mjs +3 -3
  32. package/dist/index.js +71 -35
  33. package/dist/index.mjs +37 -37
  34. package/package.json +1 -1
  35. package/dist/{chunk-ON2OTH5K.mjs → chunk-I5SI4OCM.mjs} +3 -3
@@ -1,10 +1,10 @@
1
1
  "use client";
2
2
  import {
3
3
  table_body_default
4
- } from "./chunk-PR277HT5.mjs";
4
+ } from "./chunk-QDDEQY63.mjs";
5
5
  import {
6
6
  table_head_default
7
- } from "./chunk-VG4644BG.mjs";
7
+ } from "./chunk-PO3ADNA5.mjs";
8
8
  import {
9
9
  clsx
10
10
  } from "./chunk-27Y6K5NK.mjs";
@@ -19,6 +19,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
19
19
  var Table = forwardRef((originalProps, ref) => {
20
20
  const [props, variantProps] = mapPropsVariants(originalProps, table.variantKeys);
21
21
  const { classNames, rows, columns, isLoading, className, emptyContent, onRowAction, ...tableComponentsProps } = props;
22
+ const [checkedRows, setCheckedRows] = useState(/* @__PURE__ */ new Set());
22
23
  const [selectedRows, setSelectedRows] = useState(/* @__PURE__ */ new Set());
23
24
  const slots = useMemo(() => table({ ...variantProps }), [...Object.values(variantProps)]);
24
25
  const getBaseProps = useCallback(
@@ -35,21 +36,41 @@ var Table = forwardRef((originalProps, ref) => {
35
36
  }),
36
37
  [classNames == null ? void 0 : classNames.table, slots]
37
38
  );
38
- const handleSelectAll = (isSelected) => {
39
- const newSelectedRows = isSelected ? new Set(rows.map((_, index) => index)) : /* @__PURE__ */ new Set();
40
- setSelectedRows(newSelectedRows);
39
+ const handleCheckAll = (isChecked) => {
40
+ const newCheckedRows = isChecked ? new Set(rows.map((_, index) => index)) : /* @__PURE__ */ new Set();
41
+ setCheckedRows(newCheckedRows);
42
+ };
43
+ const handleCheckRow = (index) => {
44
+ const newCheckedRows = new Set(checkedRows);
45
+ if (newCheckedRows.has(index)) {
46
+ newCheckedRows.delete(index);
47
+ } else {
48
+ newCheckedRows.add(index);
49
+ }
50
+ setCheckedRows(newCheckedRows);
41
51
  };
42
52
  const handleSelectRow = (index) => {
43
53
  const newSelectedRows = new Set(selectedRows);
44
- if (newSelectedRows.has(index)) {
45
- newSelectedRows.delete(index);
54
+ if (originalProps.isMultiSelect) {
55
+ if (newSelectedRows.has(index)) {
56
+ newSelectedRows.delete(index);
57
+ } else {
58
+ newSelectedRows.add(index);
59
+ }
46
60
  } else {
47
- newSelectedRows.add(index);
61
+ if (newSelectedRows.has(index)) {
62
+ newSelectedRows.delete(index);
63
+ } else {
64
+ newSelectedRows.clear();
65
+ newSelectedRows.add(index);
66
+ }
48
67
  }
49
68
  setSelectedRows(newSelectedRows);
50
69
  };
51
70
  useImperativeHandle(ref, () => ({
71
+ checkedRows,
52
72
  selectedRows,
73
+ setCheckedRows,
53
74
  setSelectedRows
54
75
  }));
55
76
  return /* @__PURE__ */ jsx("div", { ref, "data-table": "base", ...getBaseProps(), children: /* @__PURE__ */ jsxs("table", { ...getTableProps(tableComponentsProps), children: [
@@ -61,10 +82,10 @@ var Table = forwardRef((originalProps, ref) => {
61
82
  columns,
62
83
  size: originalProps.size,
63
84
  color: originalProps.color === "neutral" ? "primary" : originalProps.color,
64
- isSelected: originalProps.isSelected,
85
+ isChecked: originalProps.isChecked,
65
86
  isExpanded: originalProps.isExpanded,
66
- onSelectAll: handleSelectAll,
67
- isAllSelected: selectedRows.size === rows.length
87
+ onCheckAll: handleCheckAll,
88
+ isCheckedAll: checkedRows.size === rows.length
68
89
  }
69
90
  ),
70
91
  /* @__PURE__ */ jsx(
@@ -76,13 +97,16 @@ var Table = forwardRef((originalProps, ref) => {
76
97
  size: originalProps.size,
77
98
  color: originalProps.color === "neutral" ? "primary" : originalProps.color,
78
99
  isSelected: originalProps.isSelected,
79
- isSelectedRow: originalProps.isSelectedRow,
100
+ isChecked: originalProps.isChecked,
101
+ isCheckedRow: originalProps.isCheckedRow,
80
102
  isExpanded: originalProps.isExpanded,
81
103
  isLoading,
82
104
  classNames,
83
105
  emptyContent,
84
106
  selectedRows,
85
- onSelectRow: handleSelectRow,
107
+ checkedRows,
108
+ onCheckedRow: handleCheckRow,
109
+ onSelectedRow: handleSelectRow,
86
110
  onRowAction
87
111
  }
88
112
  )
@@ -99,7 +123,7 @@ var table = tv({
99
123
  tr: ["group", "outline-none"],
100
124
  th: [
101
125
  "text-foreground",
102
- "text-center",
126
+ "!text-center",
103
127
  "align-middle",
104
128
  "whitespace-nowrap",
105
129
  "font-normal",
@@ -118,7 +142,6 @@ var table = tv({
118
142
  "[&>*]:z-1",
119
143
  "[&>*]:relative",
120
144
  "transition duration-200",
121
- "data-[selected=true]:before:opacity-100",
122
145
  "group-data-[disabled=true]:text-default-300"
123
146
  ],
124
147
  tfoot: "",
@@ -184,7 +207,13 @@ var table = tv({
184
207
  isSelected: {
185
208
  true: {}
186
209
  },
187
- isSelectedRow: {
210
+ isMultiSelect: {
211
+ true: {}
212
+ },
213
+ isChecked: {
214
+ true: {}
215
+ },
216
+ isCheckedRow: {
188
217
  true: {
189
218
  tr: "cursor-pointer"
190
219
  }
@@ -216,7 +245,7 @@ var table = tv({
216
245
  color: "primary",
217
246
  variant: "solid",
218
247
  size: "md",
219
- isSelected: false,
248
+ isChecked: false,
220
249
  isExpanded: false,
221
250
  isCompact: false,
222
251
  hideHeader: false,
@@ -229,7 +258,7 @@ var table = tv({
229
258
  color: "primary",
230
259
  class: {
231
260
  thead: "[&>tr]:bg-primary-light",
232
- tr: "data-[expanded=true]:bg-primary-soft"
261
+ tr: ["data-[expanded=true]:bg-primary-soft", "data-[selected=true]:bg-primary-soft"]
233
262
  }
234
263
  },
235
264
  {
@@ -237,7 +266,7 @@ var table = tv({
237
266
  color: "secondary",
238
267
  class: {
239
268
  thead: "[&>tr]:bg-secondary-light",
240
- tr: "data-[expanded=true]:bg-secondary-soft"
269
+ tr: ["data-[expanded=true]:bg-secondary-soft", "data-[selected=true]:bg-secondary-soft"]
241
270
  }
242
271
  },
243
272
  {
@@ -245,7 +274,7 @@ var table = tv({
245
274
  color: "neutral",
246
275
  class: {
247
276
  thead: "[&>tr]:bg-trans-light",
248
- tr: "data-[expanded=true]:bg-neutral-soft"
277
+ tr: ["data-[expanded=true]:bg-neutral-soft", "data-[selected=true]:bg-neutral-soft"]
249
278
  }
250
279
  },
251
280
  {
@@ -253,7 +282,7 @@ var table = tv({
253
282
  color: "primary",
254
283
  class: {
255
284
  thead: "border-primary-light",
256
- tr: "data-[expanded=true]:bg-primary-soft"
285
+ tr: ["data-[expanded=true]:bg-primary-soft", "data-[selected=true]:bg-primary-soft"]
257
286
  }
258
287
  },
259
288
  {
@@ -261,7 +290,7 @@ var table = tv({
261
290
  color: "secondary",
262
291
  class: {
263
292
  thead: "border-secondary-light",
264
- tr: "data-[expanded=true]:bg-secondary-soft"
293
+ tr: ["data-[expanded=true]:bg-secondary-soft", "data-[selected=true]:bg-secondary-soft"]
265
294
  }
266
295
  },
267
296
  {
@@ -269,7 +298,7 @@ var table = tv({
269
298
  color: "neutral",
270
299
  class: {
271
300
  thead: "border-trans-light",
272
- tr: "data-[expanded=true]:bg-neutral-soft"
301
+ tr: ["data-[expanded=true]:bg-neutral-soft", "data-[selected=true]:bg-neutral-soft"]
273
302
  }
274
303
  },
275
304
  {
@@ -16,10 +16,10 @@ var TableHead = ({
16
16
  size,
17
17
  color,
18
18
  isExpanded,
19
- isSelected,
20
- isAllSelected,
19
+ isChecked,
20
+ isCheckedAll,
21
21
  classNames,
22
- onSelectAll
22
+ onCheckAll
23
23
  }) => {
24
24
  const getTheadProps = useCallback(
25
25
  () => ({
@@ -39,12 +39,12 @@ var TableHead = ({
39
39
  }),
40
40
  [classNames == null ? void 0 : classNames.th, slots]
41
41
  );
42
- const handleClickSelectAll = (e) => {
42
+ const handleClickCheckAll = (e) => {
43
43
  e.preventDefault();
44
- onSelectAll(!isAllSelected);
44
+ onCheckAll(!isCheckedAll);
45
45
  };
46
46
  return /* @__PURE__ */ jsx("thead", { ...getTheadProps(), children: /* @__PURE__ */ jsxs("tr", { ...getTrProps(), children: [
47
- isSelected && /* @__PURE__ */ jsx("th", { className: "w-[40px]", onClick: handleClickSelectAll, children: /* @__PURE__ */ jsx(checkbox_default, { size, color, checked: isAllSelected, classNames: { wrapper: "bg-background" } }) }),
47
+ isChecked && /* @__PURE__ */ jsx("th", { className: "w-[40px]", onClick: handleClickCheckAll, children: /* @__PURE__ */ jsx(checkbox_default, { size, color, checked: isCheckedAll, classNames: { wrapper: "bg-background" } }) }),
48
48
  isExpanded && /* @__PURE__ */ jsx("th", { className: "w-[40px]" }),
49
49
  columns.map((column, index) => /* @__PURE__ */ createElement("th", { ...getThProps(column), key: column.field + index + "th" }, column.headerName))
50
50
  ] }) });
@@ -22,13 +22,16 @@ var TableBody = ({
22
22
  columns,
23
23
  isExpanded,
24
24
  isSelected,
25
- isSelectedRow,
25
+ isChecked,
26
+ isCheckedRow,
26
27
  selectedRows,
28
+ checkedRows,
27
29
  emptyContent,
28
- onSelectRow,
30
+ onCheckedRow,
31
+ onSelectedRow,
29
32
  onRowAction
30
33
  }) => {
31
- const COL_SPAN_COUNT = columns.length + (isExpanded ? 1 : 0) + (isSelected ? 1 : 0);
34
+ const COL_SPAN_COUNT = columns.length + (isExpanded ? 1 : 0) + (isChecked ? 1 : 0);
32
35
  const [expandedRows, setExpandedRows] = useState(/* @__PURE__ */ new Set());
33
36
  useEffect(() => {
34
37
  setExpandedRows(/* @__PURE__ */ new Set());
@@ -41,11 +44,14 @@ var TableBody = ({
41
44
  );
42
45
  const getTrProps = useCallback(
43
46
  (index) => ({
44
- className: clsx(slots.tr({ class: classNames == null ? void 0 : classNames.tr })),
47
+ className: clsx(
48
+ slots.tr({ class: [classNames == null ? void 0 : classNames.tr, (isSelected || isCheckedRow || isExpanded) && "cursor-pointer"] })
49
+ ),
45
50
  "data-odd": index % 2 !== 0,
46
- "data-expanded": expandedRows.has(index)
51
+ "data-expanded": expandedRows.has(index),
52
+ "data-selected": selectedRows == null ? void 0 : selectedRows.has(index)
47
53
  }),
48
- [classNames == null ? void 0 : classNames.tr, expandedRows, slots]
54
+ [classNames == null ? void 0 : classNames.tr, expandedRows, isCheckedRow, isExpanded, isSelected, selectedRows, slots]
49
55
  );
50
56
  const getExpandedContentProps = useCallback(
51
57
  () => ({
@@ -96,7 +102,8 @@ var TableBody = ({
96
102
  e.stopPropagation();
97
103
  e.preventDefault();
98
104
  if (isExpanded) onChangeExpandedRow(index);
99
- if (isSelected && isSelectedRow) onSelectRow(index);
105
+ if (isSelected) onSelectedRow(index);
106
+ if (isChecked && isCheckedRow) onCheckedRow(index);
100
107
  const row = rows[index];
101
108
  if (row) {
102
109
  (_a = row.onRowAction) == null ? void 0 : _a.call(row, e, row);
@@ -106,7 +113,7 @@ var TableBody = ({
106
113
  const keys = Object.keys(row);
107
114
  return /* @__PURE__ */ jsxs(React.Fragment, { children: [
108
115
  /* @__PURE__ */ jsxs("tr", { ...getTrProps(rowIndex), onClick: handleRowClick(rowIndex), children: [
109
- isSelected && /* @__PURE__ */ jsx("td", { ...getTdProps({ field: "checkbox" }, row, keys), onClick: () => onSelectRow(rowIndex), children: /* @__PURE__ */ jsx(checkbox_default, { color, size, checked: selectedRows.has(rowIndex) }) }),
116
+ isChecked && /* @__PURE__ */ jsx("td", { ...getTdProps({ field: "checkbox" }, row, keys), onClick: () => onCheckedRow(rowIndex), children: /* @__PURE__ */ jsx(checkbox_default, { color, size, checked: checkedRows.has(rowIndex) }) }),
110
117
  isExpanded && /* @__PURE__ */ jsx("td", { ...getTdProps({ field: "expandIcon" }, row, keys), children: /* @__PURE__ */ jsx(
111
118
  Icon_default,
112
119
  {
@@ -1,10 +1,10 @@
1
1
  "use client";
2
- import {
3
- accordion_default
4
- } from "../../chunk-SWR7E3NU.mjs";
5
2
  import {
6
3
  render
7
4
  } from "../../chunk-FNPWLOGV.mjs";
5
+ import {
6
+ accordion_default
7
+ } from "../../chunk-SWR7E3NU.mjs";
8
8
  import "../../chunk-E3G5QXSH.mjs";
9
9
  import "../../chunk-J725QONZ.mjs";
10
10
  import "../../chunk-IZ6II3QA.mjs";
@@ -5,12 +5,12 @@ import {
5
5
  import {
6
6
  button_group_default
7
7
  } from "../../chunk-NGQ3MK2J.mjs";
8
- import {
9
- render
10
- } from "../../chunk-FNPWLOGV.mjs";
11
8
  import {
12
9
  button_default
13
10
  } from "../../chunk-UR64ZUAU.mjs";
11
+ import {
12
+ render
13
+ } from "../../chunk-FNPWLOGV.mjs";
14
14
  import "../../chunk-ZYIIXWVY.mjs";
15
15
  import "../../chunk-LCI6RPWE.mjs";
16
16
  import "../../chunk-IOCRFIQF.mjs";
@@ -1,12 +1,12 @@
1
1
  "use client";
2
2
  import "../../chunk-H7BLXC5M.mjs";
3
+ import {
4
+ button_default
5
+ } from "../../chunk-UR64ZUAU.mjs";
3
6
  import {
4
7
  act,
5
8
  render
6
9
  } from "../../chunk-FNPWLOGV.mjs";
7
- import {
8
- button_default
9
- } from "../../chunk-UR64ZUAU.mjs";
10
10
  import "../../chunk-ZYIIXWVY.mjs";
11
11
  import "../../chunk-LCI6RPWE.mjs";
12
12
  import "../../chunk-IOCRFIQF.mjs";
@@ -1,10 +1,10 @@
1
1
  "use client";
2
- import {
3
- checkbox_default
4
- } from "../../chunk-ANYPMQH4.mjs";
5
2
  import {
6
3
  userEvent
7
4
  } from "../../chunk-S4DTK5GI.mjs";
5
+ import {
6
+ checkbox_default
7
+ } from "../../chunk-ANYPMQH4.mjs";
8
8
  import {
9
9
  act,
10
10
  render
@@ -2,14 +2,14 @@
2
2
  import {
3
3
  dateTimePickerStyle,
4
4
  dateTimePicker_default
5
- } from "../../chunk-ON2OTH5K.mjs";
6
- import "../../chunk-FWJ2ZKH6.mjs";
5
+ } from "../../chunk-I5SI4OCM.mjs";
7
6
  import "../../chunk-FDKT4IBP.mjs";
8
- import "../../chunk-P732YGHO.mjs";
9
7
  import "../../chunk-BCN5F2MN.mjs";
10
8
  import "../../chunk-7MVEAQ7Z.mjs";
11
9
  import "../../chunk-EYY4CRRR.mjs";
12
10
  import "../../chunk-V77MALL4.mjs";
11
+ import "../../chunk-FWJ2ZKH6.mjs";
12
+ import "../../chunk-P732YGHO.mjs";
13
13
  import "../../chunk-ZYIIXWVY.mjs";
14
14
  import "../../chunk-LCI6RPWE.mjs";
15
15
  import "../../chunk-IOCRFIQF.mjs";
@@ -2,14 +2,14 @@
2
2
  import "../../chunk-75HLCORR.mjs";
3
3
  import {
4
4
  dateTimePicker_default
5
- } from "../../chunk-ON2OTH5K.mjs";
6
- import "../../chunk-FWJ2ZKH6.mjs";
5
+ } from "../../chunk-I5SI4OCM.mjs";
7
6
  import "../../chunk-FDKT4IBP.mjs";
8
- import "../../chunk-P732YGHO.mjs";
9
7
  import "../../chunk-BCN5F2MN.mjs";
10
8
  import "../../chunk-7MVEAQ7Z.mjs";
11
9
  import "../../chunk-EYY4CRRR.mjs";
12
10
  import "../../chunk-V77MALL4.mjs";
11
+ import "../../chunk-FWJ2ZKH6.mjs";
12
+ import "../../chunk-P732YGHO.mjs";
13
13
  import "../../chunk-ZYIIXWVY.mjs";
14
14
  import "../../chunk-LCI6RPWE.mjs";
15
15
  import "../../chunk-IOCRFIQF.mjs";
@@ -1,8 +1,8 @@
1
1
  "use client";
2
+ import "../../chunk-H7BLXC5M.mjs";
2
3
  import {
3
4
  input_default
4
5
  } from "../../chunk-ZNEEYSIK.mjs";
5
- import "../../chunk-H7BLXC5M.mjs";
6
6
  import {
7
7
  render,
8
8
  waitForWrapper
@@ -4,11 +4,11 @@ import {
4
4
  } from "../../chunk-PRLGHYFO.mjs";
5
5
  import "../../chunk-VUYUQGLF.mjs";
6
6
  import "../../chunk-NGQ3MK2J.mjs";
7
+ import "../../chunk-UR64ZUAU.mjs";
7
8
  import {
8
9
  fireEvent,
9
10
  render
10
11
  } from "../../chunk-FNPWLOGV.mjs";
11
- import "../../chunk-UR64ZUAU.mjs";
12
12
  import "../../chunk-ZYIIXWVY.mjs";
13
13
  import "../../chunk-LCI6RPWE.mjs";
14
14
  import "../../chunk-IOCRFIQF.mjs";
@@ -1,12 +1,12 @@
1
1
  "use client";
2
+ import {
3
+ userEvent
4
+ } from "../../chunk-S4DTK5GI.mjs";
2
5
  import {
3
6
  select_default
4
7
  } from "../../chunk-2BCJZILI.mjs";
5
8
  import "../../chunk-S3QS5B7F.mjs";
6
9
  import "../../chunk-RZZWHI6O.mjs";
7
- import {
8
- userEvent
9
- } from "../../chunk-S4DTK5GI.mjs";
10
10
  import {
11
11
  act,
12
12
  render