@dreamcommerce/aurora 2.9.0-3 → 2.9.0-5
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/build/cjs/packages/aurora/src/components/tree/components/tree_node.js +9 -4
- package/build/cjs/packages/aurora/src/components/tree/components/tree_node.js.map +1 -1
- package/build/cjs/packages/aurora/src/components/tree/css_classes.js +1 -0
- package/build/cjs/packages/aurora/src/components/tree/css_classes.js.map +1 -1
- package/build/cjs/packages/aurora/src/css/tree/main.module.less.js +2 -2
- package/build/esm/packages/aurora/src/components/tree/components/tree_node.d.ts +2 -2
- package/build/esm/packages/aurora/src/components/tree/components/tree_node.js +9 -4
- package/build/esm/packages/aurora/src/components/tree/components/tree_node.js.map +1 -1
- package/build/esm/packages/aurora/src/components/tree/css_classes.d.ts +1 -0
- package/build/esm/packages/aurora/src/components/tree/css_classes.js +1 -0
- package/build/esm/packages/aurora/src/components/tree/css_classes.js.map +1 -1
- package/build/esm/packages/aurora/src/css/tree/main.module.less.js +2 -2
- package/package.json +1 -1
|
@@ -25,14 +25,19 @@ const TreeNode = ({ children, id, ContentComponent, LabelComponent, ...rest }) =
|
|
|
25
25
|
const toggleNode = () => {
|
|
26
26
|
treeApi.toggleNode(node.id);
|
|
27
27
|
};
|
|
28
|
+
const Label = LabelComponent ? (LabelComponent === null || LabelComponent === void 0 ? void 0 : LabelComponent({ node })) : (React__default['default'].createElement("span", { className: classnames__default['default'](main_module['default'][css_classes.TREE_NODE_CSS_CLASSES.treeNodeTogglerLabel], css_classes.TREE_NODE_CSS_CLASSES.treeNodeTogglerLabel) }, node.label ? node.label : node.id));
|
|
29
|
+
const Content = ContentComponent ? (ContentComponent === null || ContentComponent === void 0 ? void 0 : ContentComponent({ node, toggleNode, isLeaf: !children })) : (React__default['default'].createElement("button", { onClick: toggleNode, className: classnames__default['default'](css_classes.TREE_NODE_CSS_CLASSES.treeNodeToggler, main_module['default'][css_classes.TREE_NODE_CSS_CLASSES.treeNodeToggler]) },
|
|
30
|
+
React__default['default'].createElement("span", { className: classnames__default['default'](main_module['default'][css_classes.TREE_NODE_CSS_CLASSES.treeNodeTogglerIcon], css_classes.TREE_NODE_CSS_CLASSES.treeNodeTogglerIcon, {
|
|
31
|
+
[css_classes.TREE_NODE_CSS_CLASSES.treeNodeTogglerIconExpanded]: node.expanded,
|
|
32
|
+
[main_module['default'][css_classes.TREE_NODE_CSS_CLASSES.treeNodeTogglerIconExpanded]]: node.expanded
|
|
33
|
+
}) },
|
|
34
|
+
React__default['default'].createElement(icon_list_arrow_down.IconListArrowDown, null)),
|
|
35
|
+
Label));
|
|
28
36
|
return (React__default['default'].createElement("li", { className: classnames__default['default'](main_module['default'][css_classes.TREE_NODE_CSS_CLASSES.treeNode], css_classes.TREE_NODE_CSS_CLASSES.treeNode, {
|
|
29
37
|
[css_classes.TREE_NODE_CSS_CLASSES.treeNodeExpanded]: node.expanded,
|
|
30
38
|
[main_module['default'][css_classes.TREE_NODE_CSS_CLASSES.treeNodeExpanded]]: node.expanded
|
|
31
39
|
}) },
|
|
32
|
-
|
|
33
|
-
React__default['default'].createElement("span", { className: classnames__default['default'](main_module['default'][css_classes.TREE_NODE_CSS_CLASSES.treeNodeTogglerIcon], css_classes.TREE_NODE_CSS_CLASSES.treeNodeTogglerIcon) },
|
|
34
|
-
React__default['default'].createElement(icon_list_arrow_down.IconListArrowDown, null)),
|
|
35
|
-
LabelComponent ? (React__default['default'].createElement(LabelComponent, { node: node })) : (React__default['default'].createElement("span", { className: classnames__default['default'](main_module['default'][css_classes.TREE_NODE_CSS_CLASSES.treeNodeTogglerLabel], css_classes.TREE_NODE_CSS_CLASSES.treeNodeTogglerLabel) }, node.label ? node.label : node.id)))),
|
|
40
|
+
children ? Content : Label,
|
|
36
41
|
children ? (React__default['default'].createElement(reactTransitionGroup.CSSTransition, { unmountOnExit: true, in: node.expanded, timeout: 250, classNames: {
|
|
37
42
|
enter: main_module['default'][css_classes.TREE_NODE_CSS_CLASSES.treeNodeChildrenEnter],
|
|
38
43
|
enterActive: main_module['default'][css_classes.TREE_NODE_CSS_CLASSES.treeNodeChildrenEnterActive],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -12,6 +12,7 @@ const TREE_NODE_CSS_CLASSES = {
|
|
|
12
12
|
treeNode: treeNodeBaseCssClass,
|
|
13
13
|
treeNodeToggler: `${treeNodeBaseCssClass}__toggler`,
|
|
14
14
|
treeNodeTogglerIcon: `${treeNodeBaseCssClass}__toggler-icon`,
|
|
15
|
+
treeNodeTogglerIconExpanded: `${treeNodeBaseCssClass}__toggler-icon_expanded`,
|
|
15
16
|
treeNodeTogglerLabel: `${treeNodeBaseCssClass}__toggler-label`,
|
|
16
17
|
treeNodeChildren: `${treeNodeBaseCssClass}__children`,
|
|
17
18
|
treeNodeChildrenEnter: `${treeNodeBaseCssClass}__children-enter`,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -4,8 +4,8 @@ Object.defineProperty(exports, '__esModule', { value: true });
|
|
|
4
4
|
|
|
5
5
|
var styleInject_es = require('../../../../../external/style-inject/dist/style-inject.es.js');
|
|
6
6
|
|
|
7
|
-
var css_248z = ".main-module_tree__3D4e3 {\n list-style: none;\n}\n.main-module_tree-
|
|
8
|
-
var cssClasses = {"tree":"main-module_tree__3D4e3","tree-
|
|
7
|
+
var css_248z = ".main-module_tree__3D4e3 {\n list-style: none;\n}\n.main-module_tree-node__toggler__Bhwx9 {\n display: flex;\n align-items: center;\n background: none;\n}\n.main-module_tree-node__toggler-icon__3QR9X {\n display: flex;\n align-items: center;\n}\n.main-module_tree-node__toggler-icon__3QR9X svg {\n transition: rotate 250ms ease-out;\n rotate: -95deg;\n}\n.main-module_tree-node__toggler-icon_expanded__31THq svg {\n rotate: 0deg;\n}\n.main-module_tree-node__children__QyEOR {\n transform-origin: top center;\n transition: opacity 250ms ease-out, scale 250ms ease-out;\n padding-left: 16px;\n list-style: none;\n will-change: true;\n}\n.main-module_tree-node__children-enter__vxFO- {\n opacity: 0;\n scale: 1 0;\n}\n.main-module_tree-node__children-enter-active__T6XIS {\n opacity: 1;\n scale: 1 1;\n}\n.main-module_tree-node__children-exit__1NXHe {\n opacity: 1;\n scale: 1 1;\n}\n.main-module_tree-node__children-exit-active__vdqAI {\n opacity: 0;\n scale: 1 0;\n}\n";
|
|
8
|
+
var cssClasses = {"tree":"main-module_tree__3D4e3","tree-node__toggler":"main-module_tree-node__toggler__Bhwx9","tree-node__toggler-icon":"main-module_tree-node__toggler-icon__3QR9X","tree-node__toggler-icon_expanded":"main-module_tree-node__toggler-icon_expanded__31THq","tree-node__children":"main-module_tree-node__children__QyEOR","tree-node__children-enter":"main-module_tree-node__children-enter__vxFO-","tree-node__children-enter-active":"main-module_tree-node__children-enter-active__T6XIS","tree-node__children-exit":"main-module_tree-node__children-exit__1NXHe","tree-node__children-exit-active":"main-module_tree-node__children-exit-active__vdqAI"};
|
|
9
9
|
styleInject_es['default'](css_248z);
|
|
10
10
|
|
|
11
11
|
exports.default = cssClasses;
|
|
@@ -12,8 +12,8 @@ declare type TTreeLabelComponentProps = {
|
|
|
12
12
|
declare type TTreeNodeProps = TPropsWithChildren<ITreeNode & {
|
|
13
13
|
collapseIcon?: React.ReactNode;
|
|
14
14
|
expandIcon?: React.ReactNode;
|
|
15
|
-
LabelComponent?: React.
|
|
16
|
-
ContentComponent?: React.
|
|
15
|
+
LabelComponent?: (props: TTreeLabelComponentProps) => React.ReactNode;
|
|
16
|
+
ContentComponent?: (props: TTreeContentComponentProps) => React.ReactNode;
|
|
17
17
|
}>;
|
|
18
18
|
export declare const TreeNode: ({ children, id, ContentComponent, LabelComponent, ...rest }: TTreeNodeProps) => JSX.Element | null;
|
|
19
19
|
export default TreeNode;
|
|
@@ -16,14 +16,19 @@ const TreeNode = ({ children, id, ContentComponent, LabelComponent, ...rest }) =
|
|
|
16
16
|
const toggleNode = () => {
|
|
17
17
|
treeApi.toggleNode(node.id);
|
|
18
18
|
};
|
|
19
|
+
const Label = LabelComponent ? (LabelComponent === null || LabelComponent === void 0 ? void 0 : LabelComponent({ node })) : (React.createElement("span", { className: classnames(cssClasses[TREE_NODE_CSS_CLASSES.treeNodeTogglerLabel], TREE_NODE_CSS_CLASSES.treeNodeTogglerLabel) }, node.label ? node.label : node.id));
|
|
20
|
+
const Content = ContentComponent ? (ContentComponent === null || ContentComponent === void 0 ? void 0 : ContentComponent({ node, toggleNode, isLeaf: !children })) : (React.createElement("button", { onClick: toggleNode, className: classnames(TREE_NODE_CSS_CLASSES.treeNodeToggler, cssClasses[TREE_NODE_CSS_CLASSES.treeNodeToggler]) },
|
|
21
|
+
React.createElement("span", { className: classnames(cssClasses[TREE_NODE_CSS_CLASSES.treeNodeTogglerIcon], TREE_NODE_CSS_CLASSES.treeNodeTogglerIcon, {
|
|
22
|
+
[TREE_NODE_CSS_CLASSES.treeNodeTogglerIconExpanded]: node.expanded,
|
|
23
|
+
[cssClasses[TREE_NODE_CSS_CLASSES.treeNodeTogglerIconExpanded]]: node.expanded
|
|
24
|
+
}) },
|
|
25
|
+
React.createElement(IconListArrowDown, null)),
|
|
26
|
+
Label));
|
|
19
27
|
return (React.createElement("li", { className: classnames(cssClasses[TREE_NODE_CSS_CLASSES.treeNode], TREE_NODE_CSS_CLASSES.treeNode, {
|
|
20
28
|
[TREE_NODE_CSS_CLASSES.treeNodeExpanded]: node.expanded,
|
|
21
29
|
[cssClasses[TREE_NODE_CSS_CLASSES.treeNodeExpanded]]: node.expanded
|
|
22
30
|
}) },
|
|
23
|
-
|
|
24
|
-
React.createElement("span", { className: classnames(cssClasses[TREE_NODE_CSS_CLASSES.treeNodeTogglerIcon], TREE_NODE_CSS_CLASSES.treeNodeTogglerIcon) },
|
|
25
|
-
React.createElement(IconListArrowDown, null)),
|
|
26
|
-
LabelComponent ? (React.createElement(LabelComponent, { node: node })) : (React.createElement("span", { className: classnames(cssClasses[TREE_NODE_CSS_CLASSES.treeNodeTogglerLabel], TREE_NODE_CSS_CLASSES.treeNodeTogglerLabel) }, node.label ? node.label : node.id)))),
|
|
31
|
+
children ? Content : Label,
|
|
27
32
|
children ? (React.createElement(CSSTransition, { unmountOnExit: true, in: node.expanded, timeout: 250, classNames: {
|
|
28
33
|
enter: cssClasses[TREE_NODE_CSS_CLASSES.treeNodeChildrenEnter],
|
|
29
34
|
enterActive: cssClasses[TREE_NODE_CSS_CLASSES.treeNodeChildrenEnterActive],
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -6,6 +6,7 @@ export declare const TREE_NODE_CSS_CLASSES: {
|
|
|
6
6
|
readonly treeNode: "tree-node";
|
|
7
7
|
readonly treeNodeToggler: "tree-node__toggler";
|
|
8
8
|
readonly treeNodeTogglerIcon: "tree-node__toggler-icon";
|
|
9
|
+
readonly treeNodeTogglerIconExpanded: "tree-node__toggler-icon_expanded";
|
|
9
10
|
readonly treeNodeTogglerLabel: "tree-node__toggler-label";
|
|
10
11
|
readonly treeNodeChildren: "tree-node__children";
|
|
11
12
|
readonly treeNodeChildrenEnter: "tree-node__children-enter";
|
|
@@ -8,6 +8,7 @@ const TREE_NODE_CSS_CLASSES = {
|
|
|
8
8
|
treeNode: treeNodeBaseCssClass,
|
|
9
9
|
treeNodeToggler: `${treeNodeBaseCssClass}__toggler`,
|
|
10
10
|
treeNodeTogglerIcon: `${treeNodeBaseCssClass}__toggler-icon`,
|
|
11
|
+
treeNodeTogglerIconExpanded: `${treeNodeBaseCssClass}__toggler-icon_expanded`,
|
|
11
12
|
treeNodeTogglerLabel: `${treeNodeBaseCssClass}__toggler-label`,
|
|
12
13
|
treeNodeChildren: `${treeNodeBaseCssClass}__children`,
|
|
13
14
|
treeNodeChildrenEnter: `${treeNodeBaseCssClass}__children-enter`,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
1
|
+
{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../../../../external/style-inject/dist/style-inject.es.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = ".main-module_tree__3D4e3 {\n list-style: none;\n}\n.main-module_tree-
|
|
4
|
-
var cssClasses = {"tree":"main-module_tree__3D4e3","tree-
|
|
3
|
+
var css_248z = ".main-module_tree__3D4e3 {\n list-style: none;\n}\n.main-module_tree-node__toggler__Bhwx9 {\n display: flex;\n align-items: center;\n background: none;\n}\n.main-module_tree-node__toggler-icon__3QR9X {\n display: flex;\n align-items: center;\n}\n.main-module_tree-node__toggler-icon__3QR9X svg {\n transition: rotate 250ms ease-out;\n rotate: -95deg;\n}\n.main-module_tree-node__toggler-icon_expanded__31THq svg {\n rotate: 0deg;\n}\n.main-module_tree-node__children__QyEOR {\n transform-origin: top center;\n transition: opacity 250ms ease-out, scale 250ms ease-out;\n padding-left: 16px;\n list-style: none;\n will-change: true;\n}\n.main-module_tree-node__children-enter__vxFO- {\n opacity: 0;\n scale: 1 0;\n}\n.main-module_tree-node__children-enter-active__T6XIS {\n opacity: 1;\n scale: 1 1;\n}\n.main-module_tree-node__children-exit__1NXHe {\n opacity: 1;\n scale: 1 1;\n}\n.main-module_tree-node__children-exit-active__vdqAI {\n opacity: 0;\n scale: 1 0;\n}\n";
|
|
4
|
+
var cssClasses = {"tree":"main-module_tree__3D4e3","tree-node__toggler":"main-module_tree-node__toggler__Bhwx9","tree-node__toggler-icon":"main-module_tree-node__toggler-icon__3QR9X","tree-node__toggler-icon_expanded":"main-module_tree-node__toggler-icon_expanded__31THq","tree-node__children":"main-module_tree-node__children__QyEOR","tree-node__children-enter":"main-module_tree-node__children-enter__vxFO-","tree-node__children-enter-active":"main-module_tree-node__children-enter-active__T6XIS","tree-node__children-exit":"main-module_tree-node__children-exit__1NXHe","tree-node__children-exit-active":"main-module_tree-node__children-exit-active__vdqAI"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export default cssClasses;
|