@canlooks/can-ui 0.0.81 → 0.0.82
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.
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.CascadePanel = CascadePanel;
|
|
4
|
+
const react_1 = require("@emotion/react");
|
|
4
5
|
const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
|
|
5
6
|
const loading_1 = require("../loading");
|
|
6
7
|
const loadingIndicator_1 = require("../loadingIndicator");
|
|
@@ -39,9 +40,8 @@ function CascadePanel({ options, index = 0 }) {
|
|
|
39
40
|
const status = selectionStatus?.get(optVal);
|
|
40
41
|
const opened = openedPanels[index] === optVal;
|
|
41
42
|
const hasChildren = !!opt[childrenKey]?.length;
|
|
42
|
-
return ((0,
|
|
43
|
-
showCheckbox
|
|
44
|
-
key: optVal
|
|
43
|
+
return ((0, react_1.createElement)(menuItem_1.MenuItem, { ...(0, utils_1.mergeComponentProps)({
|
|
44
|
+
showCheckbox
|
|
45
45
|
}, opt, {
|
|
46
46
|
checkboxProps: (0, utils_1.mergeComponentProps)(opt?.checkboxProps, showCheckbox
|
|
47
47
|
? {
|
|
@@ -62,7 +62,7 @@ function CascadePanel({ options, index = 0 }) {
|
|
|
62
62
|
? (0, jsx_runtime_1.jsx)(loadingIndicator_1.LoadingIndicator, {})
|
|
63
63
|
: hasChildren && (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faChevronRight_1.faChevronRight }),
|
|
64
64
|
children: null
|
|
65
|
-
}) }));
|
|
65
|
+
}), key: optVal }));
|
|
66
66
|
});
|
|
67
67
|
};
|
|
68
68
|
const nextOptions = optionsMap.get(openedPanels[index])?.[childrenKey];
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.DataGridRows = void 0;
|
|
4
|
-
const react_1 = require("@emotion/react");
|
|
5
4
|
const jsx_runtime_1 = require("@emotion/react/jsx-runtime");
|
|
5
|
+
const react_1 = require("@emotion/react");
|
|
6
6
|
const react_2 = require("react");
|
|
7
7
|
const dataGrid_1 = require("./dataGrid");
|
|
8
8
|
const selectionContext_1 = require("../selectionContext");
|
|
@@ -33,43 +33,42 @@ exports.DataGridRows = (0, react_2.memo)(({ rows, _level = 0 }) => {
|
|
|
33
33
|
const currentExpanded = expandable && expandedSet.has(trKey);
|
|
34
34
|
let expandableIndex = -2;
|
|
35
35
|
const ret = [
|
|
36
|
-
(0,
|
|
37
|
-
key: trKey,
|
|
36
|
+
(0, react_1.createElement)(Tr, { ...(0, utils_1.mergeComponentProps)(TrProps, _rowProps, {
|
|
38
37
|
className: (0, utils_1.clsx)(_rowProps, _level > 0 && dataGrid_style_1.classes.sub),
|
|
39
38
|
onClick() {
|
|
40
39
|
clickRowToSelect && toggleSelected(trKey, row);
|
|
41
40
|
}
|
|
42
|
-
}), "data-selected": status === 2,
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
}
|
|
53
|
-
const Component = multiple ? checkbox_1.Checkbox : radio_1.Radio;
|
|
54
|
-
return ((0, jsx_runtime_1.jsx)(table_1.TdCell, { className: dataGrid_style_1.classes.selectable, sticky: j === 0 ? 'left' : void 0, children: (0, jsx_runtime_1.jsx)(Component, { checked: status === 2, indeterminate: status === 1, onChange: () => {
|
|
55
|
-
toggleSelected(trKey, row);
|
|
56
|
-
}, onClick: e => e.stopPropagation() }) }, j + '_selectable'));
|
|
41
|
+
}), key: trKey, "data-selected": status === 2 }, flattedColumns?.flatMap((col, j) => {
|
|
42
|
+
if (typeof col === 'symbol') {
|
|
43
|
+
if (col === dataGrid_1.DataGrid.EXPAND_COLUMN) {
|
|
44
|
+
expandableIndex = j;
|
|
45
|
+
return [];
|
|
46
|
+
}
|
|
47
|
+
// col === DataGrid.SELECT_COLUMN
|
|
48
|
+
if (expandableIndex === j - 1) {
|
|
49
|
+
// select column紧跟在expand column后面，需要顺延expandableIndex
|
|
50
|
+
expandableIndex = j;
|
|
57
51
|
}
|
|
58
|
-
const
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
52
|
+
const Component = multiple ? checkbox_1.Checkbox : radio_1.Radio;
|
|
53
|
+
return ((0, jsx_runtime_1.jsx)(table_1.TdCell, { className: dataGrid_style_1.classes.selectable, sticky: j === 0 ? 'left' : void 0, children: (0, jsx_runtime_1.jsx)(Component, { checked: status === 2, indeterminate: status === 1, onChange: () => {
|
|
54
|
+
toggleSelected(trKey, row);
|
|
55
|
+
}, onClick: e => e.stopPropagation() }) }, j + '_selectable'));
|
|
56
|
+
}
|
|
57
|
+
const {
|
|
58
|
+
// 排除无需加入dom节点的属性
|
|
59
|
+
// width属性只需加入thead列中，普通列需排除
|
|
60
|
+
// rowSpan与colSpan需排除
|
|
61
|
+
title, key, children, sticky, field, render, sorter, filter, width, _key, _negativeRowSpan, rowSpan, colSpan, ..._colProps } = col;
|
|
62
|
+
const renderedContent = (0, utils_1.renderCell)({ render, field }, row, i, arr);
|
|
63
|
+
const shouldRenderExpand = expandableIndex === j - 1;
|
|
64
|
+
return ((0, react_1.createElement)(table_1.TdCell, { ..._colProps, key: _key, className: shouldRenderExpand ? dataGrid_style_1.classes.expandable : void 0, sticky: sticky }, shouldRenderExpand
|
|
65
|
+
? (0, jsx_runtime_1.jsxs)("div", { className: dataGrid_style_1.classes.expandableWrap, style: { paddingLeft: _level * indent }, children: [(0, jsx_runtime_1.jsx)(button_1.Button, { variant: "text", shape: "circular", color: "text.disabled", onClick: () => toggleExpanded(trKey), style: expandable ? void 0 : { visibility: 'hidden' }, children: renderExpandIcon
|
|
66
|
+
? renderExpandIcon(trKey, currentExpanded, [...expandedSet])
|
|
67
|
+
: currentExpanded
|
|
68
|
+
? (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faMinusSquare_1.faMinusSquare })
|
|
69
|
+
: (0, jsx_runtime_1.jsx)(icon_1.Icon, { icon: faPlusSquare_1.faPlusSquare }) }), renderedContent] })
|
|
70
|
+
: renderedContent));
|
|
71
|
+
}))
|
|
73
72
|
];
|
|
74
73
|
if (Array.isArray(children)) {
|
|
75
74
|
currentExpanded && ret.push((0, jsx_runtime_1.jsx)(exports.DataGridRows, { rows: children, _level: _level + 1 }, trKey + '_children'));
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { createElement as _createElement } from "@emotion/react";
|
|
1
2
|
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
|
|
2
3
|
import { Loading } from '../loading';
|
|
3
4
|
import { LoadingIndicator } from '../loadingIndicator';
|
|
@@ -36,9 +37,8 @@ export function CascadePanel({ options, index = 0 }) {
|
|
|
36
37
|
const status = selectionStatus?.get(optVal);
|
|
37
38
|
const opened = openedPanels[index] === optVal;
|
|
38
39
|
const hasChildren = !!opt[childrenKey]?.length;
|
|
39
|
-
return (
|
|
40
|
-
showCheckbox
|
|
41
|
-
key: optVal
|
|
40
|
+
return (_createElement(MenuItem, { ...mergeComponentProps({
|
|
41
|
+
showCheckbox
|
|
42
42
|
}, opt, {
|
|
43
43
|
checkboxProps: mergeComponentProps(opt?.checkboxProps, showCheckbox
|
|
44
44
|
? {
|
|
@@ -59,7 +59,7 @@ export function CascadePanel({ options, index = 0 }) {
|
|
|
59
59
|
? _jsx(LoadingIndicator, {})
|
|
60
60
|
: hasChildren && _jsx(Icon, { icon: faChevronRight }),
|
|
61
61
|
children: null
|
|
62
|
-
}) }));
|
|
62
|
+
}), key: optVal }));
|
|
63
63
|
});
|
|
64
64
|
};
|
|
65
65
|
const nextOptions = optionsMap.get(openedPanels[index])?.[childrenKey];
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { createElement as _createElement } from "@emotion/react";
|
|
2
1
|
import { jsx as _jsx, jsxs as _jsxs } from "@emotion/react/jsx-runtime";
|
|
2
|
+
import { createElement as _createElement } from "@emotion/react";
|
|
3
3
|
import { memo } from 'react';
|
|
4
4
|
import { DataGrid, useDataGridContext } from './dataGrid';
|
|
5
5
|
import { useSelectionContext } from '../selectionContext';
|
|
@@ -30,43 +30,42 @@ export const DataGridRows = memo(({ rows, _level = 0 }) => {
|
|
|
30
30
|
const currentExpanded = expandable && expandedSet.has(trKey);
|
|
31
31
|
let expandableIndex = -2;
|
|
32
32
|
const ret = [
|
|
33
|
-
|
|
34
|
-
key: trKey,
|
|
33
|
+
_createElement(Tr, { ...mergeComponentProps(TrProps, _rowProps, {
|
|
35
34
|
className: clsx(_rowProps, _level > 0 && classes.sub),
|
|
36
35
|
onClick() {
|
|
37
36
|
clickRowToSelect && toggleSelected(trKey, row);
|
|
38
37
|
}
|
|
39
|
-
}), "data-selected": status === 2,
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
}
|
|
50
|
-
const Component = multiple ? Checkbox : Radio;
|
|
51
|
-
return (_jsx(TdCell, { className: classes.selectable, sticky: j === 0 ? 'left' : void 0, children: _jsx(Component, { checked: status === 2, indeterminate: status === 1, onChange: () => {
|
|
52
|
-
toggleSelected(trKey, row);
|
|
53
|
-
}, onClick: e => e.stopPropagation() }) }, j + '_selectable'));
|
|
38
|
+
}), key: trKey, "data-selected": status === 2 }, flattedColumns?.flatMap((col, j) => {
|
|
39
|
+
if (typeof col === 'symbol') {
|
|
40
|
+
if (col === DataGrid.EXPAND_COLUMN) {
|
|
41
|
+
expandableIndex = j;
|
|
42
|
+
return [];
|
|
43
|
+
}
|
|
44
|
+
// col === DataGrid.SELECT_COLUMN
|
|
45
|
+
if (expandableIndex === j - 1) {
|
|
46
|
+
// select column紧跟在expand column后面，需要顺延expandableIndex
|
|
47
|
+
expandableIndex = j;
|
|
54
48
|
}
|
|
55
|
-
const
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
49
|
+
const Component = multiple ? Checkbox : Radio;
|
|
50
|
+
return (_jsx(TdCell, { className: classes.selectable, sticky: j === 0 ? 'left' : void 0, children: _jsx(Component, { checked: status === 2, indeterminate: status === 1, onChange: () => {
|
|
51
|
+
toggleSelected(trKey, row);
|
|
52
|
+
}, onClick: e => e.stopPropagation() }) }, j + '_selectable'));
|
|
53
|
+
}
|
|
54
|
+
const {
|
|
55
|
+
// 排除无需加入dom节点的属性
|
|
56
|
+
// width属性只需加入thead列中，普通列需排除
|
|
57
|
+
// rowSpan与colSpan需排除
|
|
58
|
+
title, key, children, sticky, field, render, sorter, filter, width, _key, _negativeRowSpan, rowSpan, colSpan, ..._colProps } = col;
|
|
59
|
+
const renderedContent = renderCell({ render, field }, row, i, arr);
|
|
60
|
+
const shouldRenderExpand = expandableIndex === j - 1;
|
|
61
|
+
return (_createElement(TdCell, { ..._colProps, key: _key, className: shouldRenderExpand ? classes.expandable : void 0, sticky: sticky }, shouldRenderExpand
|
|
62
|
+
? _jsxs("div", { className: classes.expandableWrap, style: { paddingLeft: _level * indent }, children: [_jsx(Button, { variant: "text", shape: "circular", color: "text.disabled", onClick: () => toggleExpanded(trKey), style: expandable ? void 0 : { visibility: 'hidden' }, children: renderExpandIcon
|
|
63
|
+
? renderExpandIcon(trKey, currentExpanded, [...expandedSet])
|
|
64
|
+
: currentExpanded
|
|
65
|
+
? _jsx(Icon, { icon: faMinusSquare })
|
|
66
|
+
: _jsx(Icon, { icon: faPlusSquare }) }), renderedContent] })
|
|
67
|
+
: renderedContent));
|
|
68
|
+
}))
|
|
70
69
|
];
|
|
71
70
|
if (Array.isArray(children)) {
|
|
72
71
|
currentExpanded && ret.push(_jsx(DataGridRows, { rows: children, _level: _level + 1 }, trKey + '_children'));
|