@canlooks/can-ui 0.0.48 → 0.0.51

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 (55) hide show
  1. package/dist/cjs/components/boundary/errorBoundary.js +1 -1
  2. package/dist/cjs/components/calendar/calendar.style.js +124 -124
  3. package/dist/cjs/components/calendar/panelYear.js +1 -1
  4. package/dist/cjs/components/curd/curd.js +2 -2
  5. package/dist/cjs/components/curd/curdColumnConfig.js +1 -1
  6. package/dist/cjs/components/curd/curdFilter.js +5 -3
  7. package/dist/cjs/components/curd/curdResizable.js +1 -1
  8. package/dist/cjs/components/dataGrid/dataGrid.d.ts +1 -1
  9. package/dist/cjs/components/dataGrid/dataGrid.js +15 -9
  10. package/dist/cjs/components/dialog/dialog.js +1 -1
  11. package/dist/cjs/components/drawer/drawer.js +1 -1
  12. package/dist/cjs/components/form/form.js +0 -1
  13. package/dist/cjs/components/inputBase/inputBase.js +1 -1
  14. package/dist/cjs/components/pagination/pager.js +1 -1
  15. package/dist/cjs/components/palette/palette.js +1 -1
  16. package/dist/cjs/components/pickerDialog/pickerDialog.js +1 -1
  17. package/dist/cjs/components/transitionBase/collapse.js +1 -1
  18. package/dist/cjs/components/tree/tree.style.js +2 -2
  19. package/dist/cjs/components/tree/treeNode.js +2 -2
  20. package/dist/cjs/components/treeSelect/treeSelect.js +6 -6
  21. package/dist/cjs/components/upload/imageItem.js +1 -1
  22. package/dist/cjs/utils/curd.d.ts +1 -0
  23. package/dist/cjs/utils/curd.js +3 -2
  24. package/dist/cjs/utils/tree.js +2 -0
  25. package/dist/esm/components/boundary/errorBoundary.js +1 -1
  26. package/dist/esm/components/calendar/calendar.style.js +124 -124
  27. package/dist/esm/components/calendar/panelYear.js +1 -1
  28. package/dist/esm/components/curd/curd.js +2 -2
  29. package/dist/esm/components/curd/curdColumnConfig.js +1 -1
  30. package/dist/esm/components/curd/curdFilter.js +5 -3
  31. package/dist/esm/components/curd/curdResizable.js +1 -1
  32. package/dist/esm/components/dataGrid/dataGrid.d.ts +1 -1
  33. package/dist/esm/components/dataGrid/dataGrid.js +15 -9
  34. package/dist/esm/components/dialog/dialog.js +1 -1
  35. package/dist/esm/components/drawer/drawer.js +1 -1
  36. package/dist/esm/components/form/form.js +0 -1
  37. package/dist/esm/components/inputBase/inputBase.js +1 -1
  38. package/dist/esm/components/pagination/pager.js +1 -1
  39. package/dist/esm/components/palette/palette.js +1 -1
  40. package/dist/esm/components/pickerDialog/pickerDialog.js +1 -1
  41. package/dist/esm/components/transitionBase/collapse.js +1 -1
  42. package/dist/esm/components/tree/tree.style.js +2 -2
  43. package/dist/esm/components/tree/treeNode.js +2 -2
  44. package/dist/esm/components/treeSelect/treeSelect.js +6 -6
  45. package/dist/esm/components/upload/imageItem.js +1 -1
  46. package/dist/esm/utils/curd.d.ts +1 -0
  47. package/dist/esm/utils/curd.js +3 -2
  48. package/dist/esm/utils/tree.js +3 -1
  49. package/documentation/dist/assets/{index-UW3tEkHN.js → index-Db8Y9DzG.js} +2901 -2901
  50. package/documentation/dist/index.html +1 -1
  51. package/documentation/vite.config.mjs +18 -0
  52. package/extensions/curd.cjs +5 -5
  53. package/extensions/documentViewer.cjs +5 -5
  54. package/extensions/textFormatter.cjs +5 -5
  55. package/package.json +1 -1
@@ -25,5 +25,5 @@ exports.ErrorBoundary = (0, react_1.memo)(({ error, reload, reloadable, ...props
25
25
  }
26
26
  };
27
27
  return ((0, jsx_runtime_1.jsx)(placeholder_1.Placeholder, { status: "error", description: renderDescriptions(), slots: placeholderSlots, extra: reloadable &&
28
- (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outlined", color: "text", prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faRotateRight_1.faRotateRight }), onClick: reload, children: "\u91CD\u65B0\u52A0\u8F7D" }), ...props, css: errorBoundary_style_1.style, className: (0, utils_1.clsx)(errorBoundary_style_1.classes.root, props.className) }));
28
+ (0, jsx_runtime_1.jsx)(button_1.Button, { variant: "outlined", color: "text.secondary", prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faRotateRight_1.faRotateRight }), onClick: reload, children: "\u91CD\u65B0\u52A0\u8F7D" }), ...props, css: errorBoundary_style_1.style, className: (0, utils_1.clsx)(errorBoundary_style_1.classes.root, props.className) }));
29
29
  });
@@ -16,128 +16,128 @@ exports.classes = (0, utils_1.defineInnerClasses)('calendar', [
16
16
  'yearItem',
17
17
  'foot'
18
18
  ]);
19
- exports.style = (0, utils_1.defineCss)(({ divider, text, spacing }) => (0, react_1.css) `
20
- .${exports.classes.head} {
21
- height: 40px;
22
- display: flex;
23
- align-items: center;
24
- justify-content: space-between;
25
- border-bottom: 1px solid ${divider};
26
- padding: 0 ${menuItem_style_1.menuListPadding}px;
27
- position: relative;
28
-
29
- .${exports.classes.headSide} {
30
- z-index: 1;
31
- }
32
-
33
- .${exports.classes.headControl} {
34
- color: ${text.placeholder};
35
- }
36
-
37
- .${exports.classes.headCenter} {
38
- display: flex;
39
- align-items: center;
40
- justify-content: center;
41
- position: absolute;
42
- inset: 0;
43
-
44
- .${exports.classes.headButton} {
45
- font-weight: bold;
46
- color: ${text.primary};
47
- }
48
- }
49
- }
50
-
51
- .${exports.classes.body} {
52
- padding: ${spacing[3]}px ${spacing[4]}px;
53
- display: grid;
54
- place-items: center;
55
-
56
- &[data-view-type=date] {
57
- font-size: ${13 / 14}em;
58
- grid-template-columns: repeat(7, 36px);
59
- grid-template-rows: repeat(7, 36px);
60
-
61
- .${exports.classes.dateItem} {
62
- width: 24px;
63
- height: 24px;
64
-
65
- &:not([data-variant=filled]) {
66
- color: ${text.primary};
67
- border-color: ${text.disabled};
68
-
69
- &[data-other-month=true] {
70
- color: ${text.placeholder};
71
- }
72
- }
73
-
74
- &:disabled {
75
- width: 100%;
76
- border-radius: 0;
77
- }
78
- }
79
- }
80
-
81
- &[data-view-type=month], &[data-view-type=year] {
82
- grid-template-columns: repeat(3, 84px);
83
- grid-template-rows: repeat(4, 63px);
84
-
85
- .${exports.classes.monthItem},
86
- .${exports.classes.yearItem} {
87
- width: 72px;
88
- padding-inline: 0;
89
-
90
- &:not([data-variant=filled]) {
91
- color: ${text.primary};
92
- }
93
- }
94
- }
95
- }
96
-
97
- &[data-size=small] {
98
- .${exports.classes.body} {
99
- &[data-view-type=date] {
100
- grid-template-columns: repeat(7, 30px);
101
- grid-template-rows: repeat(7, 30px);
102
- }
103
-
104
- &[data-view-type=month], &[data-view-type=year] {
105
- grid-template-columns: repeat(3, 70px);
106
- grid-template-rows: repeat(4, 52.5px);
107
-
108
- .${exports.classes.monthItem},
109
- .${exports.classes.yearItem} {
110
- width: 60px;
111
- }
112
- }
113
- }
114
- }
115
-
116
- &[data-size=large] {
117
- .${exports.classes.body} {
118
- &[data-view-type=date] {
119
- font-size: 1em;
120
- grid-template-columns: repeat(7, 42px);
121
- grid-template-rows: repeat(7, 42px);
122
-
123
- .${exports.classes.dateItem} {
124
- width: 32px;
125
- height: 32px;
126
- }
127
- }
128
-
129
- &[data-view-type=month], &[data-view-type=year] {
130
- grid-template-columns: repeat(3, 98px);
131
- grid-template-rows: repeat(4, 73.5px);
132
- }
133
- }
134
- }
135
-
136
- .${exports.classes.foot} {
137
- height: 41px;
138
- display: flex;
139
- align-items: center;
140
- justify-content: center;
141
- border-top: 1px solid ${divider};
142
- }
19
+ exports.style = (0, utils_1.defineCss)(({ divider, text, spacing }) => (0, react_1.css) `
20
+ .${exports.classes.head} {
21
+ height: 40px;
22
+ display: flex;
23
+ align-items: center;
24
+ justify-content: space-between;
25
+ border-bottom: 1px solid ${divider};
26
+ padding: 0 ${menuItem_style_1.menuListPadding}px;
27
+ position: relative;
28
+
29
+ .${exports.classes.headSide} {
30
+ z-index: 1;
31
+ }
32
+
33
+ .${exports.classes.headControl} {
34
+ color: ${text.placeholder};
35
+ }
36
+
37
+ .${exports.classes.headCenter} {
38
+ display: flex;
39
+ align-items: center;
40
+ justify-content: center;
41
+ position: absolute;
42
+ inset: 0;
43
+
44
+ .${exports.classes.headButton} {
45
+ font-weight: bold;
46
+ color: ${text.primary};
47
+ }
48
+ }
49
+ }
50
+
51
+ .${exports.classes.body} {
52
+ padding: ${spacing[3]}px ${spacing[4]}px;
53
+ display: grid;
54
+ place-items: center;
55
+
56
+ &[data-view-type=date] {
57
+ font-size: ${13 / 14}em;
58
+ grid-template-columns: repeat(7, 36px);
59
+ grid-template-rows: repeat(7, 36px);
60
+
61
+ .${exports.classes.dateItem} {
62
+ width: 24px;
63
+ height: 24px;
64
+
65
+ &:not([data-variant=filled]) {
66
+ color: ${text.primary};
67
+ border-color: ${text.disabled};
68
+
69
+ &[data-other-month=true] {
70
+ color: ${text.placeholder};
71
+ }
72
+ }
73
+
74
+ &:disabled {
75
+ width: 100%;
76
+ border-radius: 0;
77
+ }
78
+ }
79
+ }
80
+
81
+ &[data-view-type=month], &[data-view-type=year] {
82
+ grid-template-columns: repeat(3, 84px);
83
+ grid-template-rows: repeat(4, 63px);
84
+
85
+ .${exports.classes.monthItem},
86
+ .${exports.classes.yearItem} {
87
+ width: 72px;
88
+ padding-inline: 0;
89
+
90
+ &:not([data-variant=filled]) {
91
+ color: ${text.primary};
92
+ }
93
+ }
94
+ }
95
+ }
96
+
97
+ &[data-size=small] {
98
+ .${exports.classes.body} {
99
+ &[data-view-type=date] {
100
+ grid-template-columns: repeat(7, 30px);
101
+ grid-template-rows: repeat(7, 30px);
102
+ }
103
+
104
+ &[data-view-type=month], &[data-view-type=year] {
105
+ grid-template-columns: repeat(3, 70px);
106
+ grid-template-rows: repeat(4, 52.5px);
107
+
108
+ .${exports.classes.monthItem},
109
+ .${exports.classes.yearItem} {
110
+ width: 60px;
111
+ }
112
+ }
113
+ }
114
+ }
115
+
116
+ &[data-size=large] {
117
+ .${exports.classes.body} {
118
+ &[data-view-type=date] {
119
+ font-size: 1em;
120
+ grid-template-columns: repeat(7, 42px);
121
+ grid-template-rows: repeat(7, 42px);
122
+
123
+ .${exports.classes.dateItem} {
124
+ width: 32px;
125
+ height: 32px;
126
+ }
127
+ }
128
+
129
+ &[data-view-type=month], &[data-view-type=year] {
130
+ grid-template-columns: repeat(3, 98px);
131
+ grid-template-rows: repeat(4, 73.5px);
132
+ }
133
+ }
134
+ }
135
+
136
+ .${exports.classes.foot} {
137
+ height: 41px;
138
+ display: flex;
139
+ align-items: center;
140
+ justify-content: center;
141
+ border-top: 1px solid ${divider};
142
+ }
143
143
  `);
@@ -16,7 +16,7 @@ exports.PanelYear = (0, react_1.memo)(({ innerD, setInnerD, onSelected, min, max
16
16
  onSelected(d);
17
17
  };
18
18
  const [page, setPage] = (0, react_1.useState)(() => Math.floor(currentYear / 12));
19
- const renderHeadControl = (icon, title, onClick) => ((0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: title, children: (0, jsx_runtime_1.jsx)(button_1.Button, { className: calendar_style_1.classes.headControl, variant: "text", size: "small", color: "text", onClick: onClick, children: icon }) }));
19
+ const renderHeadControl = (icon, title, onClick) => ((0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: title, children: (0, jsx_runtime_1.jsx)(button_1.Button, { className: calendar_style_1.classes.headControl, variant: "text", size: "small", color: "text.secondary", onClick: onClick, children: icon }) }));
20
20
  const isDisabled = (d) => {
21
21
  if (min && min.isAfter(d)) {
22
22
  return true;
@@ -71,7 +71,7 @@ exports.Curd = (0, react_1.memo)((props) => {
71
71
  }
72
72
  };
73
73
  return [...columns || [], controlColumn];
74
- }, [columns, updatable, deletable]);
74
+ }, [columns, updatable, deletable, renderExtraControl, controlColumnTitle, updateButtonProps, deleteButtonProps, dataName, deleteConfirmProps]);
75
75
  const { orderedColumns, actualColumns, innerVisible, setInnerVisible, setInnerOrder } = (0, utils_1.useCurdColumns)({
76
76
  columns: completedColumns,
77
77
  columnConfigurable
@@ -177,7 +177,7 @@ exports.Curd = (0, react_1.memo)((props) => {
177
177
  (0, jsx_runtime_1.jsxs)("div", { className: curd_style_1.classes.toolbar, children: [(0, jsx_runtime_1.jsxs)("div", { className: curd_style_1.classes.toolbarLeft, children: [creatable &&
178
178
  (0, jsx_runtime_1.jsxs)(button_1.Button, { prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faPlus_1.faPlus }), ...createButtonProps, onClick: createHandler, children: [createName, dataName] }), toolbarLeft] }), (0, jsx_runtime_1.jsxs)("div", { className: curd_style_1.classes.toolbarRight, children: [!!toolbarRight &&
179
179
  (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [toolbarRight, (0, jsx_runtime_1.jsx)(divider_1.Divider, { className: curd_style_1.classes.divider, orientation: "vertical" })] }), reloadable &&
180
- (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u5237\u65B0", children: (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text", prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faRotateRight_1.faRotateRight }), loading: innerLoading.current, onClick: reloadHandler }) }), resizable &&
180
+ (0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u5237\u65B0", children: (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text.secondary", prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faRotateRight_1.faRotateRight }), loading: innerLoading.current, onClick: reloadHandler }) }), resizable &&
181
181
  (0, jsx_runtime_1.jsx)(curdResizable_1.CurdResizable, { innerSize: innerSize.current, setInnerSize: setInnerSize }), columnConfigurable &&
182
182
  (0, jsx_runtime_1.jsx)(curdColumnConfig_1.CurdColumnConfig, { columns: orderedColumns, innerVisible: innerVisible.current, setInnerVisible: setInnerVisible, setInnerOrder: setInnerOrder })] })] }), (0, jsx_runtime_1.jsx)("div", { className: curd_style_1.classes.card, children: (0, jsx_runtime_1.jsx)(dataGrid_1.DataGrid, { ...dataGridProps, columns: actualColumns, tableProps: {
183
183
  ...props.tableProps,
@@ -27,5 +27,5 @@ exports.CurdColumnConfig = (0, react_1.memo)(({ columns = [], innerVisible, setI
27
27
  ? [...o, key]
28
28
  : o.filter(k => k !== key));
29
29
  };
30
- return ((0, jsx_runtime_1.jsx)(bubble_1.Bubble, { css: curdColumnConfig_style_1.style, placement: "bottomRight", content: (0, jsx_runtime_1.jsx)(core_1.DndContext, { sensors: (0, utils_1.useDndSensors)(), onDragEnd: dragEndHandler, children: (0, jsx_runtime_1.jsx)(sortable_1.SortableContext, { items: columns?.map((col, i) => col._key ?? i), children: (0, jsx_runtime_1.jsxs)("div", { className: curdColumnConfig_style_1.classes.content, children: [(0, jsx_runtime_1.jsx)("div", { className: curdColumnConfig_style_1.classes.title, children: "\u5217\u8BBE\u7F6E" }), columns?.map((col, i) => (0, jsx_runtime_1.jsx)(sortableItem_1.SortableItem, { id: col._key ?? i, component: menuItem_1.MenuItem, className: curdColumnConfig_style_1.classes.item, prefix: (0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { className: curdColumnConfig_style_1.classes.checkbox, checked: !(0, utils_1.isUnset)(col._key) && visibleSet.has(col._key), onChange: e => !(0, utils_1.isUnset)(col._key) && toggleVisible(col._key, e.target.checked) }), label: col.title }, col._key ?? i))] }) }) }), children: (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text", children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faGear_1.faGear }) }) }));
30
+ return ((0, jsx_runtime_1.jsx)(bubble_1.Bubble, { css: curdColumnConfig_style_1.style, placement: "bottomRight", content: (0, jsx_runtime_1.jsx)(core_1.DndContext, { sensors: (0, utils_1.useDndSensors)(), onDragEnd: dragEndHandler, children: (0, jsx_runtime_1.jsx)(sortable_1.SortableContext, { items: columns?.map((col, i) => col._key ?? i), children: (0, jsx_runtime_1.jsxs)("div", { className: curdColumnConfig_style_1.classes.content, children: [(0, jsx_runtime_1.jsx)("div", { className: curdColumnConfig_style_1.classes.title, children: "\u5217\u8BBE\u7F6E" }), columns?.map((col, i) => (0, jsx_runtime_1.jsx)(sortableItem_1.SortableItem, { id: col._key ?? i, component: menuItem_1.MenuItem, className: curdColumnConfig_style_1.classes.item, prefix: (0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { className: curdColumnConfig_style_1.classes.checkbox, checked: !(0, utils_1.isUnset)(col._key) && visibleSet.has(col._key), onChange: e => !(0, utils_1.isUnset)(col._key) && toggleVisible(col._key, e.target.checked) }), label: col.title }, col._key ?? i))] }) }) }), autoClose: false, children: (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text.secondary", children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faGear_1.faGear }) }) }));
31
31
  });
@@ -25,9 +25,11 @@ exports.CurdFilter = (0, react_2.memo)(({ ref, columns, expandable, showButton,
25
25
  */
26
26
  const firstItemRef = (0, react_2.useRef)(null);
27
27
  const [expanded, setExpanded] = (0, react_2.useState)(false);
28
- const renderedGrid = ((0, jsx_runtime_1.jsx)(grid_1.Grid, { className: curd_style_1.classes.filterGrid, columnGap: spacing[8], children: items?.map((item, i) => (0, react_2.isValidElement)(item)
29
- ? item
30
- : (0, react_1.createElement)(form_1.FormItem, { span: { xs: 12, md: 6, lg: 4 }, ...item, key: item.key ?? i, wrapperRef: !i ? firstItemRef : void 0 })) }));
28
+ const renderedGrid = ((0, jsx_runtime_1.jsx)(grid_1.Grid, { className: curd_style_1.classes.filterGrid, columnGap: spacing[8], children: items?.map((item, i) => {
29
+ return (0, react_2.isValidElement)(item)
30
+ ? item
31
+ : (0, react_1.createElement)(form_1.FormItem, { span: { xs: 12, md: 6, lg: 4 }, variant: "grid", ...item, key: item.key ?? i, wrapperRef: !i ? firstItemRef : void 0 });
32
+ }) }));
31
33
  /**
32
34
  * --------------------------------------------------------------
33
35
  * 触发筛选
@@ -10,5 +10,5 @@ const button_1 = require("../button");
10
10
  const __1 = require("../..");
11
11
  const faArrowsUpDown_1 = require("@fortawesome/free-solid-svg-icons/faArrowsUpDown");
12
12
  exports.CurdResizable = (0, react_1.memo)(({ innerSize, setInnerSize }) => {
13
- return ((0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u8868\u683C\u5C3A\u5BF8", children: (0, jsx_runtime_1.jsx)(bubble_1.Bubble, { placement: "bottom", content: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(menuItem_1.MenuItem, { value: "small", label: "\u5C0F", selected: innerSize === 'small', onClick: () => setInnerSize('small') }), (0, jsx_runtime_1.jsx)(menuItem_1.MenuItem, { value: "medium", label: "\u4E2D", selected: innerSize === 'medium', onClick: () => setInnerSize('medium') }), (0, jsx_runtime_1.jsx)(menuItem_1.MenuItem, { value: "large", label: "\u5927", selected: innerSize === 'large', onClick: () => setInnerSize('large') })] }), children: (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text", children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faArrowsUpDown_1.faArrowsUpDown }) }) }) }));
13
+ return ((0, jsx_runtime_1.jsx)(tooltip_1.Tooltip, { title: "\u8868\u683C\u5C3A\u5BF8", children: (0, jsx_runtime_1.jsx)(bubble_1.Bubble, { placement: "bottom", content: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(menuItem_1.MenuItem, { value: "small", label: "\u5C0F", selected: innerSize === 'small', onClick: () => setInnerSize('small') }), (0, jsx_runtime_1.jsx)(menuItem_1.MenuItem, { value: "medium", label: "\u4E2D", selected: innerSize === 'medium', onClick: () => setInnerSize('medium') }), (0, jsx_runtime_1.jsx)(menuItem_1.MenuItem, { value: "large", label: "\u5927", selected: innerSize === 'large', onClick: () => setInnerSize('large') })] }), children: (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text.secondary", children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faArrowsUpDown_1.faArrowsUpDown }) }) }) }));
14
14
  });
@@ -30,7 +30,7 @@ type DataGridSharedProps<R extends RowType> = {
30
30
  /** 数据的主键名,默认为`id` */
31
31
  primaryKey?: keyof R;
32
32
  /**
33
- * 当数据中存在该字段,则会渲染可展开的子行,默认为`null`表示不使用子行功能,
33
+ * 当数据中存在该字段,则会渲染可展开的子行,默认为`null`,表示不使用子行功能,
34
34
  * children允许的值类型:
35
35
  * @types {R[] | ReactNode | ((parent: R, expanded: boolean) => ReactNode)}
36
36
  */
@@ -6,6 +6,7 @@ const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
6
6
  const react_1 = require("react");
7
7
  const dataGrid_style_1 = require("./dataGrid.style");
8
8
  const selectionContext_1 = require("../selectionContext");
9
+ const pagination_1 = require("../pagination");
9
10
  const table_1 = require("../table");
10
11
  const utils_1 = require("../../utils");
11
12
  const loading_1 = require("../loading");
@@ -96,21 +97,26 @@ exports.DataGrid = (0, react_1.memo)(({ columns, rows, rowProps, primaryKey = 'i
96
97
  pageSize: innerPageSize.current,
97
98
  onChange: pageChangeHandler
98
99
  };
100
+ const renderPaginationFn = () => {
101
+ return renderPagination
102
+ ? renderPagination(_paginationProps)
103
+ : (0, jsx_runtime_1.jsx)(pagination_1.Pagination, { ..._paginationProps });
104
+ };
99
105
  const paginatedRows = (0, react_1.useMemo)(() => {
100
106
  if (!paginatable) {
101
107
  return orderedRows;
102
108
  }
103
109
  const { page, pageSize } = _paginationProps;
104
110
  return orderedRows?.slice((page - 1) * pageSize, page * pageSize);
105
- }, [orderedRows, _paginationProps.page, _paginationProps.pageSize]);
106
- return ((0, jsx_runtime_1.jsx)(loading_1.Loading, { ...props, css: dataGrid_style_1.style, className: (0, utils_1.clsx)(dataGrid_style_1.classes.root, props.className), open: loading, "data-column-resizable": columnResizable, children: (0, jsx_runtime_1.jsx)(columnResize_1.ColumnResizeContext, { columnResizable: columnResizable, children: ({ scrollerRef, tableRef }) => (0, jsx_runtime_1.jsxs)(table_1.TableContainer, { ref: scrollerRef, className: dataGrid_style_1.classes.container, children: [(0, jsx_runtime_1.jsx)(table_1.Table, { size: size, bordered: bordered, striped: striped, ...tableProps, ref: (0, utils_1.cloneRef)(tableProps?.ref, tableRef), children: (0, jsx_runtime_1.jsxs)(selectionContext_1.SelectionContext, { options: rows, primaryKey: primaryKey, childrenKey: childrenKey !== null ? childrenKey : void 0, relation: relation, integration: integration, disabled: !selectable, multiple: multiple, defaultValue: defaultValue, value: value, onChange: onChange, children: [(0, jsx_runtime_1.jsx)(dataGridHead_1.DataGridHead, { flattedColumns: flattedColumns, completedColumns: completedColumns, rows: rows, primaryKey: primaryKey, orderColumn: innerOrderColumn.current, orderType: innerOrderType.current, onOrderChange: orderChangeHandler, allowSelectAll: allowSelectAll, columnResizable: columnResizable }), (0, jsx_runtime_1.jsx)("tbody", { children: (0, jsx_runtime_1.jsx)(DataGridContext, { value: (0, react_1.useMemo)(() => ({
107
- rowProps, primaryKey, childrenKey, clickRowToSelect, indent, renderExpandIcon,
108
- expandedSet, flattedColumns, toggleExpanded
109
- }), [
110
- rowProps, primaryKey, childrenKey, clickRowToSelect, indent, renderExpandIcon,
111
- expandedSet, flattedColumns
112
- ]), children: !!paginatedRows?.length &&
113
- (0, jsx_runtime_1.jsx)(dataGridRows_1.DataGridRows, { rows: paginatedRows }) }) })] }) }), !paginatedRows?.length && (emptyPlaceholder ?? (0, jsx_runtime_1.jsx)(placeholder_1.Placeholder, { className: dataGrid_style_1.classes.empty }))] }) }) }));
111
+ }, [orderedRows, _paginationProps.page, _paginationProps.pageSize, paginatable]);
112
+ return ((0, jsx_runtime_1.jsxs)(loading_1.Loading, { ...props, css: dataGrid_style_1.style, className: (0, utils_1.clsx)(dataGrid_style_1.classes.root, props.className), open: loading, "data-column-resizable": columnResizable, children: [(0, jsx_runtime_1.jsx)(columnResize_1.ColumnResizeContext, { columnResizable: columnResizable, children: ({ scrollerRef, tableRef }) => (0, jsx_runtime_1.jsxs)(table_1.TableContainer, { ref: scrollerRef, className: dataGrid_style_1.classes.container, children: [(0, jsx_runtime_1.jsx)(table_1.Table, { size: size, bordered: bordered, striped: striped, ...tableProps, ref: (0, utils_1.cloneRef)(tableProps?.ref, tableRef), children: (0, jsx_runtime_1.jsxs)(selectionContext_1.SelectionContext, { options: rows, primaryKey: primaryKey, childrenKey: childrenKey !== null ? childrenKey : void 0, relation: relation, integration: integration, disabled: !selectable, multiple: multiple, defaultValue: defaultValue, value: value, onChange: onChange, children: [(0, jsx_runtime_1.jsx)(dataGridHead_1.DataGridHead, { flattedColumns: flattedColumns, completedColumns: completedColumns, rows: rows, primaryKey: primaryKey, orderColumn: innerOrderColumn.current, orderType: innerOrderType.current, onOrderChange: orderChangeHandler, allowSelectAll: allowSelectAll, columnResizable: columnResizable }), (0, jsx_runtime_1.jsx)("tbody", { children: (0, jsx_runtime_1.jsx)(DataGridContext, { value: (0, react_1.useMemo)(() => ({
113
+ rowProps, primaryKey, childrenKey, clickRowToSelect, indent, renderExpandIcon,
114
+ expandedSet, flattedColumns, toggleExpanded
115
+ }), [
116
+ rowProps, primaryKey, childrenKey, clickRowToSelect, indent, renderExpandIcon,
117
+ expandedSet, flattedColumns
118
+ ]), children: !!paginatedRows?.length &&
119
+ (0, jsx_runtime_1.jsx)(dataGridRows_1.DataGridRows, { rows: paginatedRows }) }) })] }) }), !paginatedRows?.length && (emptyPlaceholder ?? (0, jsx_runtime_1.jsx)(placeholder_1.Placeholder, { className: dataGrid_style_1.classes.empty }))] }) }), renderPaginationFn()] }));
114
120
  });
115
121
  exports.DataGrid.EXPAND_COLUMN = Symbol('expand-column');
116
122
  exports.DataGrid.SELECT_COLUMN = Symbol('select-column');
@@ -84,7 +84,7 @@ function Dialog({ ref, icon, title, footer, prefix, suffix, width = 420, minWidt
84
84
  return ((0, jsx_runtime_1.jsx)(modal_1.Modal, { ...props, ref: (0, utils_1.cloneRef)(ref, overlayRef), css: dialog_style_1.style, className: (0, utils_1.clsx)(dialog_style_1.classes.root, props.className), open: innerOpen.current, onMaskClick: onMaskClick, "data-draggable": draggable, children: (0, jsx_runtime_1.jsx)(draggable_1.Draggable, { container: () => overlayRef.current, children: (targetProps, handleProps) => (0, jsx_runtime_1.jsxs)("div", { className: dialog_style_1.classes.card, ...targetProps, style: { width, minWidth, maxWidth, ...targetProps.style }, children: [!!icon &&
85
85
  (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.icon, children: icon }), (0, jsx_runtime_1.jsxs)("div", { className: dialog_style_1.classes.content, children: [!!(title || showClose) &&
86
86
  (0, jsx_runtime_1.jsxs)("div", { className: dialog_style_1.classes.titleRow, ...handleProps, children: [(0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.title, children: title }), showClose &&
87
- (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text", ...closeProps, className: (0, utils_1.clsx)(dialog_style_1.classes.close, closeProps?.className), onClick: closeHandler, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faXmark_1.faXmark }) })] }), (0, jsx_runtime_1.jsxs)("div", { ref: bodyRef, className: dialog_style_1.classes.body, onScroll: onScroll, children: [!!prefix &&
87
+ (0, jsx_runtime_1.jsx)(button_1.Button, { shape: "circular", variant: "text", color: "text.secondary", ...closeProps, className: (0, utils_1.clsx)(dialog_style_1.classes.close, closeProps?.className), onClick: closeHandler, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faXmark_1.faXmark }) })] }), (0, jsx_runtime_1.jsxs)("div", { ref: bodyRef, className: dialog_style_1.classes.body, onScroll: onScroll, children: [!!prefix &&
88
88
  (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.prefix, children: prefix }), (0, jsx_runtime_1.jsx)("div", { ref: bodyWrapRef, className: dialog_style_1.classes.bodyWrap, children: props.children }), !!suffix &&
89
89
  (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.suffix, children: suffix })] }), (typeof footer === 'undefined' || !!footer) &&
90
90
  (0, jsx_runtime_1.jsx)("div", { className: dialog_style_1.classes.footer, children: renderFooter() })] })] }) }) }));
@@ -51,7 +51,7 @@ function Drawer({ title, footer, showClose = true, size = { xs: '100%', sm: '75%
51
51
  }, [innerOpen.current]);
52
52
  return ((0, jsx_runtime_1.jsx)(overlayBase_1.OverlayBase, { ...props, css: (0, drawer_style_1.useStyle)({ size: typeof size === 'object' ? size : { xs: size } }), className: (0, utils_1.clsx)(drawer_style_1.classes.root, props.className), open: innerOpen.current, onMaskClick: onMaskClick, "data-placement": placement, children: (0, jsx_runtime_1.jsx)(transitionBase_1.Slide, { direction: placementToDirection[placement], ...slideProps, in: innerOpen.current, className: (0, utils_1.clsx)(drawer_style_1.classes.drawer, slideProps?.className), children: (0, jsx_runtime_1.jsxs)("div", { className: drawer_style_1.classes.drawerWrap, children: [!!(title || showClose) &&
53
53
  (0, jsx_runtime_1.jsxs)("div", { className: drawer_style_1.classes.titleRow, children: [(0, jsx_runtime_1.jsx)("div", { className: drawer_style_1.classes.title, children: title }), showClose &&
54
- (0, jsx_runtime_1.jsx)(button_1.Button, { className: drawer_style_1.classes.close, shape: "circular", variant: "text", color: "text", onClick: closeHandler, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAnglesRight_1.faAnglesRight, style: {
54
+ (0, jsx_runtime_1.jsx)(button_1.Button, { className: drawer_style_1.classes.close, shape: "circular", variant: "text", color: "text.secondary", onClick: closeHandler, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAnglesRight_1.faAnglesRight, style: {
55
55
  rotate: {
56
56
  left: '180deg',
57
57
  right: '0',
@@ -43,7 +43,6 @@ inline, columnCount = 1, gap, columnGap, rowGap, ...props }) => {
43
43
  */
44
44
  const itemsContainer = (0, react_1.useRef)(new Map());
45
45
  const submitHandler = async (e) => {
46
- console.log(e);
47
46
  e?.preventDefault();
48
47
  try {
49
48
  await Promise.all([...itemsContainer.current].map(async ([, item]) => {
@@ -76,6 +76,6 @@ min, max, step, precision, placeholder, disabled, readOnly, autoFocus, defaultVa
76
76
  onKeyDown: (e) => e.key === 'Enter' && blurHandler(e)
77
77
  }) }), loading &&
78
78
  (0, jsx_runtime_1.jsx)(loadingIndicator_1.LoadingIndicator, {}), clearable && !disabled && !readOnly && (Array.isArray(innerValue.current) ? !!innerValue.current.length : !!innerValue.current) &&
79
- (0, jsx_runtime_1.jsx)(button_1.Button, { className: inputBase_style_1.classes.clear, variant: "plain", color: "text.disabled", onClick: clear, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCircleXmark_1.faCircleXmark }) }), !!suffix &&
79
+ (0, jsx_runtime_1.jsx)(button_1.Button, { className: inputBase_style_1.classes.clear, variant: "plain", color: "text.disabled", onClick: clear, tabIndex: -1, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faCircleXmark_1.faCircleXmark }) }), !!suffix &&
80
80
  (0, jsx_runtime_1.jsx)("div", { className: inputBase_style_1.classes.suffix, children: suffix })] }));
81
81
  });
@@ -52,5 +52,5 @@ exports.PaginationPager = (0, react_1.memo)((props) => {
52
52
  : renderPageButton(page + i - 5, i === 1 || i === 7);
53
53
  });
54
54
  };
55
- return ((0, jsx_runtime_1.jsxs)("div", { ...props, className: (0, utils_1.clsx)(pagination_style_1.classes.pager, props.className), children: [(0, jsx_runtime_1.jsx)(button_1.Button, { className: pagination_style_1.classes.button, variant: "text", size: size, color: "text", disabled: page === 1, onClick: () => onPageChange(page - 1), children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAngleLeft_1.faAngleLeft }) }), renderPageList(), (0, jsx_runtime_1.jsx)(button_1.Button, { className: pagination_style_1.classes.button, variant: "text", size: size, color: "text", disabled: page === pageCount, onClick: () => onPageChange(page + 1), children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAngleRight_1.faAngleRight }) })] }));
55
+ return ((0, jsx_runtime_1.jsxs)("div", { ...props, className: (0, utils_1.clsx)(pagination_style_1.classes.pager, props.className), children: [(0, jsx_runtime_1.jsx)(button_1.Button, { className: pagination_style_1.classes.button, variant: "text", size: size, color: "text.secondary", disabled: page === 1, onClick: () => onPageChange(page - 1), children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAngleLeft_1.faAngleLeft }) }), renderPageList(), (0, jsx_runtime_1.jsx)(button_1.Button, { className: pagination_style_1.classes.button, variant: "text", size: size, color: "text.secondary", disabled: page === pageCount, onClick: () => onPageChange(page + 1), children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faAngleRight_1.faAngleRight }) })] }));
56
56
  });
@@ -114,5 +114,5 @@ exports.Palette = (0, react_1.memo)(({ defaultValue, value, onChange, gestureOpt
114
114
  }, ...draggableHandles })] }), (0, jsx_runtime_1.jsxs)("div", { className: palette_style_1.classes.slidersRow, children: [(0, jsx_runtime_1.jsxs)("div", { className: palette_style_1.classes.sliders, children: [(0, jsx_runtime_1.jsx)(slider_1.Slider, { ...sliderProps, className: palette_style_1.classes.hue, value: colorObject.hue / 359 * 100, onChange: hueChangeHandler }), (0, jsx_runtime_1.jsx)(slider_1.Slider, { ...sliderProps, className: palette_style_1.classes.alpha, renderRail: (_, railProps) => (0, jsx_runtime_1.jsxs)("div", { ...railProps, children: [railProps.children, (0, jsx_runtime_1.jsx)("div", { className: palette_style_1.classes.alphaMask, style: { backgroundImage: `linear-gradient(90deg, transparent, ${colorObject.saturated})` } })] }), value: colorObject.alpha * 100, onChange: alphaChangeHandler })] }), (0, jsx_runtime_1.jsx)("div", { className: palette_style_1.classes.preview, children: (0, jsx_runtime_1.jsx)("div", { className: palette_style_1.classes.previewColor, style: {
115
115
  backgroundColor: colorObject.hex,
116
116
  opacity: colorObject.alpha
117
- } }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: palette_style_1.classes.inputRow, children: [(0, jsx_runtime_1.jsx)(button_1.Button, { variant: "plain", color: "text", suffix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faChevronDown_1.faChevronDown }), onClick: formatChangeHandler, children: availableFormat[activeFormat] }), renderInputs()] })] }));
117
+ } }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: palette_style_1.classes.inputRow, children: [(0, jsx_runtime_1.jsx)(button_1.Button, { variant: "plain", color: "text.secondary", suffix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faChevronDown_1.faChevronDown }), onClick: formatChangeHandler, children: availableFormat[activeFormat] }), renderInputs()] })] }));
118
118
  });
@@ -70,6 +70,6 @@ options = rows ?? nodes, primaryKey = 'id', childrenKey = 'children', relation =
70
70
  ...props.modalProps
71
71
  }, ...showSelectedList && {
72
72
  [selectedListPlacement === 'left' ? 'prefix' : 'suffix']: ((0, jsx_runtime_1.jsxs)("div", { className: pickerDialog_style_1.classes.selectedArea, children: [(0, jsx_runtime_1.jsxs)(divider_1.Divider, { className: pickerDialog_style_1.classes.count, textAlign: "start", children: [(0, jsx_runtime_1.jsxs)("div", { children: ["\u5DF2\u9009\u62E9", (0, jsx_runtime_1.jsx)("b", { children: selectedCount }), "\u9879"] }), clearable &&
73
- (0, jsx_runtime_1.jsx)(button_1.Button, { prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faTrashCan_1.faTrashCan }), variant: "plain", color: "text", onClick: () => setInnerValue(multiple ? [] : null), children: "\u6E05\u7A7A" })] }), (0, jsx_runtime_1.jsx)(selectedList_1.SelectedList, { itemProps: selectedItemProps, ...selectedListProps, className: (0, utils_1.clsx)(pickerDialog_style_1.classes.list, selectedListProps?.className) }), (0, jsx_runtime_1.jsx)(button_1.Button, { className: pickerDialog_style_1.classes.confirm, disabled: selectedCount === 0, onClick: () => confirmHandler(), children: "\u786E\u5B9A" })] }))
73
+ (0, jsx_runtime_1.jsx)(button_1.Button, { prefix: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faTrashCan_1.faTrashCan }), variant: "plain", color: "text.secondary", onClick: () => setInnerValue(multiple ? [] : null), children: "\u6E05\u7A7A" })] }), (0, jsx_runtime_1.jsx)(selectedList_1.SelectedList, { itemProps: selectedItemProps, ...selectedListProps, className: (0, utils_1.clsx)(pickerDialog_style_1.classes.list, selectedListProps?.className) }), (0, jsx_runtime_1.jsx)(button_1.Button, { className: pickerDialog_style_1.classes.confirm, disabled: selectedCount === 0, onClick: () => confirmHandler(), children: "\u786E\u5B9A" })] }))
74
74
  }, children: renderChildren() }) }));
75
75
  });
@@ -22,7 +22,7 @@ const Sweeping = ({ ref, in: _in = false, appear = true, orientation = 'vertical
22
22
  (0, react_1.useEffect)(() => {
23
23
  if (_in && size.current !== 'auto') {
24
24
  requestAnimationFrame(() => {
25
- setSize(innerRef.current[orientation === 'vertical' ? 'scrollHeight' : 'scrollWidth']);
25
+ innerRef.current && setSize(innerRef.current[orientation === 'vertical' ? 'scrollHeight' : 'scrollWidth']);
26
26
  });
27
27
  }
28
28
  }, [_in]);
@@ -76,8 +76,8 @@ exports.style = (0, utils_1.defineCss)(({ spacing, mode, borderRadius, text, eas
76
76
  align-items: center;
77
77
  justify-content: center;
78
78
 
79
- .${exports.classes.icon} > svg {
80
- transition: transform .25s ${easing.easeOut};
79
+ .${exports.classes.icon} {
80
+ transition: rotate .25s ${easing.easeOut};
81
81
  }
82
82
  }
83
83
 
@@ -23,14 +23,14 @@ exports.TreeNode = (0, react_1.memo)(({ value, label, prefix, suffix, disabled,
23
23
  clickLabelToExpand && toggleExpanded?.(value);
24
24
  };
25
25
  const hasChildren = !!props.children && (!Array.isArray(props.children) || props.children.length > 0);
26
- return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { ...props, className: (0, utils_1.clsx)(tree_style_1.classes.node, props.className), "data-selected": status === 2, "data-read-only": readOnly, "data-disabled": disabled, onClick: clickHandler, children: [Array(_level).fill(void 0).map((_, i) => (0, jsx_runtime_1.jsx)("div", { className: tree_style_1.classes.indent, style: { width: indent } }, i)), (0, jsx_runtime_1.jsx)(button_1.Button, { className: tree_style_1.classes.expand, variant: "plain", color: "text", onClick: e => {
26
+ return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { ...props, className: (0, utils_1.clsx)(tree_style_1.classes.node, props.className), "data-selected": status === 2, "data-read-only": readOnly, "data-disabled": disabled, onClick: clickHandler, children: [Array(_level).fill(void 0).map((_, i) => (0, jsx_runtime_1.jsx)("div", { className: tree_style_1.classes.indent, style: { width: indent } }, i)), (0, jsx_runtime_1.jsx)(button_1.Button, { className: tree_style_1.classes.expand, variant: "plain", color: "text.secondary", onClick: e => {
27
27
  e.stopPropagation();
28
28
  toggleExpanded?.(value);
29
29
  }, children: renderExpandIcon
30
30
  ? renderExpandIcon(value, !!currentExpanded, [...expandedSet])
31
31
  : hasChildren &&
32
32
  (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faChevronRight_1.faChevronRight, className: tree_style_1.classes.icon, style: {
33
- rotate: currentExpanded ? '90deg' : '0'
33
+ rotate: currentExpanded ? '90deg' : '0deg'
34
34
  } }) }), showCheckbox &&
35
35
  (0, jsx_runtime_1.jsx)(checkbox_1.Checkbox, { className: tree_style_1.classes.checkbox, checked: status === 2, indeterminate: status === 1, onClick: e => {
36
36
  e.stopPropagation();
@@ -57,24 +57,24 @@ placeholder = '请选择', autoFocus, clearable, onClear, ...props }) => {
57
57
  (0, react_1.useMemo)(() => {
58
58
  // 单选模式下,选中一次就自动关闭弹框
59
59
  !props.multiple && setInnerOpen(false);
60
- }, [innerValue.current, props.multiple]);
60
+ }, [innerValue, props.multiple]);
61
61
  const clearHandler = () => {
62
62
  onClear?.();
63
63
  setInnerValue(props.multiple ? [] : void 0);
64
64
  };
65
65
  const renderBackfillFn = () => {
66
66
  if (renderBackfill) {
67
- return renderBackfill(innerValue.current);
67
+ return renderBackfill(innerValue);
68
68
  }
69
69
  if (props.multiple) {
70
- return (0, utils_1.toArray)(innerValue.current)?.map(v => (0, jsx_runtime_1.jsx)(tag_1.Tag, { closable: true, onClose: () => toggleSelected(v), children: optionsMap.get(v)?.[props.labelKey] ?? v }, v));
70
+ return (0, utils_1.toArray)(innerValue)?.map(v => (0, jsx_runtime_1.jsx)(tag_1.Tag, { closable: true, onClose: () => toggleSelected(v), children: optionsMap.get(v)?.[props.labelKey] ?? v }, v));
71
71
  }
72
- return ((0, jsx_runtime_1.jsx)("div", { className: treeSelect_style_1.classes.backfillWrap, children: optionsMap.get(innerValue.current)?.[props.labelKey] ?? innerValue.current }));
72
+ return ((0, jsx_runtime_1.jsx)("div", { className: treeSelect_style_1.classes.backfillWrap, children: optionsMap.get(innerValue)?.[props.labelKey] ?? innerValue }));
73
73
  };
74
- return ((0, jsx_runtime_1.jsx)(popper_1.Popper, { css: popper_style_1.popperStyle, open: innerOpen.current, onOpenChange: openChangeHandler, placement: "bottom", variant: "collapse", trigger: ['click', 'enter'], disabled: props.disabled || props.readOnly, sizeAdaptable: sizeAdaptable, content: (0, jsx_runtime_1.jsx)(tree_1.Tree, { ...props, nodes: options, value: innerValue.current, onChange: setInnerValue }), ...popperProps, popperRef: popperRef, onPointerDown: e => {
74
+ return ((0, jsx_runtime_1.jsx)(popper_1.Popper, { css: popper_style_1.popperStyle, open: innerOpen.current, onOpenChange: openChangeHandler, placement: "bottom", variant: "collapse", trigger: ['click', 'enter'], disabled: props.disabled || props.readOnly, sizeAdaptable: sizeAdaptable, content: (0, jsx_runtime_1.jsx)(tree_1.Tree, { ...props, nodes: options, value: innerValue, onChange: setInnerValue }), ...popperProps, popperRef: popperRef, onPointerDown: e => {
75
75
  popperProps?.onPointerDown?.(e);
76
76
  e.preventDefault();
77
- }, children: (0, jsx_runtime_1.jsx)(inputBase_1.InputBase, { clearable: !!props.multiple, css: treeSelect_style_1.style, className: (0, utils_1.clsx)(treeSelect_style_1.classes.root, props.className), "data-focused": open, value: innerValue.current, onClear: clearHandler, placeholder: placeholder, autoFocus: autoFocus, disabled: props.disabled, readOnly: props.readOnly, children: ({ ref, ...rest }) => (0, jsx_runtime_1.jsxs)("div", { className: treeSelect_style_1.classes.contentWrap, children: [!(0, utils_1.toArray)(innerValue.current)?.length
77
+ }, children: (0, jsx_runtime_1.jsx)(inputBase_1.InputBase, { clearable: !!props.multiple, css: treeSelect_style_1.style, className: (0, utils_1.clsx)(treeSelect_style_1.classes.root, props.className), "data-focused": open, value: innerValue, onClear: clearHandler, placeholder: placeholder, autoFocus: autoFocus, disabled: props.disabled, readOnly: props.readOnly, children: ({ ref, ...rest }) => (0, jsx_runtime_1.jsxs)("div", { className: treeSelect_style_1.classes.contentWrap, children: [!(0, utils_1.toArray)(innerValue)?.length
78
78
  ? (0, jsx_runtime_1.jsx)("div", { className: treeSelect_style_1.classes.placeholder, children: placeholder })
79
79
  : (0, jsx_runtime_1.jsx)("div", { className: treeSelect_style_1.classes.backfill, children: renderBackfillFn() }), (0, jsx_runtime_1.jsx)("input", { size: 1, ...rest, ...inputProps, ref: (0, utils_1.cloneRef)(ref, inputProps?.ref), "data-hidden": "true" }), (0, jsx_runtime_1.jsx)("div", { className: treeSelect_style_1.classes.arrow, "data-open": open, children: loading
80
80
  ? (0, jsx_runtime_1.jsx)(loadingIndicator_1.LoadingIndicator, {})
@@ -19,7 +19,7 @@ exports.ImageItem = (0, react_1.memo)((props) => {
19
19
  open: previewOpen,
20
20
  onOpenChange: setPreviewOpen
21
21
  }, actions: [
22
- (0, jsx_runtime_1.jsx)(button_1.Button, { size: "small", variant: "text", shape: "circular", color: "text", onClick: () => setPreviewOpen(true), children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faEye_1.faEye }) }, "preview"),
22
+ (0, jsx_runtime_1.jsx)(button_1.Button, { size: "small", variant: "text", shape: "circular", color: "text.secondary", onClick: () => setPreviewOpen(true), children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faEye_1.faEye }) }, "preview"),
23
23
  (0, jsx_runtime_1.jsx)(button_1.Button, { size: "small", variant: "text", shape: "circular", color: "error", onClick: props.onRemove, children: (0, jsx_runtime_1.jsx)(__1.Icon, { icon: faTrashCan_1.faTrashCan }) }, "delete")
24
24
  ], children: status !== 'default' &&
25
25
  (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.clsx)(upload_style_1.classes.progress), children: (0, jsx_runtime_1.jsx)(progress_1.Progress, { variant: "circular", showInfo: status !== 'uploading', value: progress, status: status === 'uploading' ? 'processing' : status }) }) }) }));
@@ -10,6 +10,7 @@ export declare function columnsToFilterItem(columns?: (CurdColumn<any> | symbol)
10
10
  /**
11
11
  * 将Curd的Columns转换为FormItem
12
12
  * @param columns
13
+ * @param row
13
14
  */
14
15
  export declare function columnsToFormItem(columns?: (CurdColumn<any> | symbol)[], row?: Obj): CurdFormItemProps[] | undefined;
15
16
  /**
@@ -17,6 +17,7 @@ function columnsToFilterItem(columns) {
17
17
  /**
18
18
  * 将Curd的Columns转换为FormItem
19
19
  * @param columns
20
+ * @param row
20
21
  */
21
22
  function columnsToFormItem(columns, row) {
22
23
  return columnsTransfer(columns, 'form', row);
@@ -36,7 +37,7 @@ function columnsTransfer(columns, type = 'filter', row) {
36
37
  return item.key ? item : (0, react_1.cloneElement)(item, { key });
37
38
  }
38
39
  if (item === true) {
39
- // filter为true当作空对象处理
40
+ // item为true当作空对象处理
40
41
  item = {};
41
42
  }
42
43
  if (typeof item === 'object') {
@@ -67,7 +68,7 @@ function useCurdColumns({ columns, columnConfigurable }) {
67
68
  }
68
69
  let { defaultVisible, visible, onVisibleChange, defaultOrder, order, onOrderChange } = columnConfigurable;
69
70
  if (!defaultVisible || !defaultOrder) {
70
- const defaultKeys = columns?.flatMap((col) => col._key ?? []) || [];
71
+ const defaultKeys = columns?.flatMap((col) => col.hideInTable ? [] : (col._key ?? [])) || [];
71
72
  defaultVisible ||= defaultKeys;
72
73
  defaultOrder ||= defaultKeys;
73
74
  }
@@ -8,7 +8,9 @@ function useTreeSearch({ nodes, primaryKey = 'id', labelKey = 'label', childrenK
8
8
  const expandedSet = (0, react_1.useMemo)(() => {
9
9
  return new Set(innerExpanded.current);
10
10
  }, [innerExpanded.current]);
11
+ const sync = (0, hooks_1.useSync)({ expandedSet, onExpandedChange });
11
12
  const toggleExpanded = (0, react_1.useCallback)((value) => {
13
+ const { expandedSet, onExpandedChange } = sync.current;
12
14
  const currentExpanded = expandedSet.has(value);
13
15
  setInnerExpanded(o => {
14
16
  const newExpanded = currentExpanded
@@ -22,5 +22,5 @@ export const ErrorBoundary = memo(({ error, reload, reloadable, ...props }) => {
22
22
  }
23
23
  };
24
24
  return (_jsx(Placeholder, { status: "error", description: renderDescriptions(), slots: placeholderSlots, extra: reloadable &&
25
- _jsx(Button, { variant: "outlined", color: "text", prefix: _jsx(Icon, { icon: faRotateRight }), onClick: reload, children: "\u91CD\u65B0\u52A0\u8F7D" }), ...props, css: style, className: clsx(classes.root, props.className) }));
25
+ _jsx(Button, { variant: "outlined", color: "text.secondary", prefix: _jsx(Icon, { icon: faRotateRight }), onClick: reload, children: "\u91CD\u65B0\u52A0\u8F7D" }), ...props, css: style, className: clsx(classes.root, props.className) }));
26
26
  });