@dreamcommerce/aurora 3.0.0-106 → 3.0.0-108

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 (9) hide show
  1. package/build/cjs/packages/aurora/src/components/tree/components/tree_node.js +13 -9
  2. package/build/cjs/packages/aurora/src/components/tree/components/tree_node.js.map +1 -1
  3. package/build/esm/packages/aurora/src/components/tree/components/tree_node.d.ts +2 -1
  4. package/build/esm/packages/aurora/src/components/tree/components/tree_node.js +13 -9
  5. package/build/esm/packages/aurora/src/components/tree/components/tree_node.js.map +1 -1
  6. package/build/index.css +1 -1
  7. package/build/tailwind.config.js +259 -257
  8. package/package.json +1 -1
  9. package/build/css_tokens.css +0 -1
package/build/cjs/packages/aurora/src/components/tree/components/tree_node.js CHANGED
@@ -14,7 +14,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
14
14
 
15
15
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
16
16
 
17
- var _excluded = ["children", "id", "cssClassNames", "ContentComponent", "LabelComponent", "disabled", "hasDisabledHover"];
17
+ var _excluded = ["children", "id", "cssClassNames", "ContentComponent", "LabelComponent", "disabled", "isHighlighted", "hasDisabledHover"];
18
18
  var TreeNode = function TreeNode(_ref) {
19
19
  var children = _ref.children,
20
20
  id = _ref.id,
@@ -22,6 +22,7 @@ var TreeNode = function TreeNode(_ref) {
22
22
  ContentComponent = _ref.ContentComponent,
23
23
  LabelComponent = _ref.LabelComponent,
24
24
  disabled = _ref.disabled,
25
+ isHighlighted = _ref.isHighlighted,
25
26
  hasDisabledHover = _ref.hasDisabledHover,
26
27
  rest = _rollupPluginBabelHelpers.objectWithoutProperties(_ref, _excluded);
27
28
  var treeApi = tree_hook.useTree();
@@ -34,7 +35,8 @@ var TreeNode = function TreeNode(_ref) {
34
35
  };
35
36
  var Label = LabelComponent ? (/*#__PURE__*/React__default['default'].createElement("div", {
36
37
  className: cn.cn('aurora-w-full aurora-px-2 aurora-rounded-4 hover:aurora-bg-hover', {
37
- 'hover:aurora-bg-transparent': hasDisabledHover
38
+ 'hover:aurora-bg-transparent': hasDisabledHover,
39
+ 'aurora-bg-hover': isHighlighted
38
40
  })
39
41
  }, LabelComponent === null || LabelComponent === void 0 ? void 0 : LabelComponent({
40
42
  node: node,
@@ -42,7 +44,8 @@ var TreeNode = function TreeNode(_ref) {
42
44
  }))) : (/*#__PURE__*/React__default['default'].createElement("div", {
43
45
  tabIndex: !children ? 0 : -1,
44
46
  className: cn.cn('aurora-w-full aurora-px-2 aurora-rounded-4 hover:aurora-bg-hover', {
45
- 'hover:aurora-bg-transparent': hasDisabledHover
47
+ 'hover:aurora-bg-transparent': hasDisabledHover,
48
+ 'aurora-bg-hover': isHighlighted
46
49
  })
47
50
  }, node.label ? node.label : node.id));
48
51
  var Content = ContentComponent ? ContentComponent === null || ContentComponent === void 0 ? void 0 : ContentComponent({
@@ -51,7 +54,8 @@ var TreeNode = function TreeNode(_ref) {
51
54
  isLeaf: !childrenCount
52
55
  }) : (/*#__PURE__*/React__default['default'].createElement("div", {
53
56
  className: cn.cn('aurora-flex aurora-items-center aurora-rounded-4 hover:aurora-bg-hover', {
54
- 'hover:aurora-bg-transparent': hasDisabledHover
57
+ 'hover:aurora-bg-transparent': hasDisabledHover,
58
+ 'aurora-bg-hover': isHighlighted
55
59
  })
56
60
  }, /*#__PURE__*/React__default['default'].createElement("button", {
57
61
  className: "aurora-flex aurora-items-center aurora-p-1 aurora-cursor-pointer",
@@ -59,13 +63,13 @@ var TreeNode = function TreeNode(_ref) {
59
63
  }, /*#__PURE__*/React__default['default'].createElement("span", {
60
64
  className: "aurora-flex"
61
65
  }, /*#__PURE__*/React__default['default'].createElement(arrow_down_s_fill.ArrowDownSFillIcon, {
62
- className: cn.cn('aurora-h-4 aurora-w-4 aurora-text-inverse-subtle-light -aurora-rotate-90 tree-arrow-transition', {
66
+ className: cn.cn('aurora-h-4 aurora-w-4 aurora-text-inverse-subtle-light -aurora-rotate-90 aurora-transition-transform aurora-duration-200 aurora-ease-out', {
63
67
  'aurora-rotate-0': node.expanded,
64
68
  'aurora-fill-disabled': disabled
65
69
  })
66
70
  }))), Label));
67
71
  return /*#__PURE__*/React__default['default'].createElement("li", {
68
- className: "aurora-flex aurora-flex-col aurora-gap-2",
72
+ className: cn.cn('aurora-flex aurora-flex-col aurora-gap-2', cssClassNames),
69
73
  role: "treeitem",
70
74
  "aria-expanded": node.expanded,
71
75
  "data-disabled": !!disabled
@@ -75,12 +79,12 @@ var TreeNode = function TreeNode(_ref) {
75
79
  timeout: 50,
76
80
  classNames: {
77
81
  enter: 'tree__children-enter',
78
- enterActive: 'tree__children-enter-active',
79
- exit: 'tree__children-exit',
82
+ enterActive: 'aurora-opacity-100 aurora-scale-100',
83
+ exit: 'aurora-opacity-100 aurora-scale-100',
80
84
  exitActive: 'tree__children-exit-active'
81
85
  }
82
86
  }, /*#__PURE__*/React__default['default'].createElement("ul", {
83
- className: "aurora-flex aurora-flex-col aurora-gap-2 aurora-pl-4 aurora-scale-100 aurora-origin-top aurora-list-none aurora-will-change-auto tree__children-transition",
87
+ className: "aurora-flex aurora-flex-col aurora-gap-2 aurora-pl-4 aurora-scale-100 aurora-origin-top aurora-list-none aurora-will-change-auto aurora-duration-200 aurora-ease-out aurora-transition-all",
84
88
  ref: nodeChildrenRef
85
89
  }, children))) : null);
86
90
  };
package/build/cjs/packages/aurora/src/components/tree/components/tree_node.js.map CHANGED
@@ -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;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;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;"}
package/build/esm/packages/aurora/src/components/tree/components/tree_node.d.ts CHANGED
@@ -17,7 +17,8 @@ declare type TTreeNodeProps = TPropsWithChildren<ITreeNode & {
17
17
  expandIcon?: React.ReactNode;
18
18
  LabelComponent?: (props: TTreeLabelComponentProps) => React.ReactNode;
19
19
  ContentComponent?: (props: TTreeContentComponentProps) => React.ReactNode;
20
+ isHighlighted?: boolean;
20
21
  hasDisabledHover?: boolean;
21
22
  }>;
22
- export declare const TreeNode: ({ children, id, cssClassNames, ContentComponent, LabelComponent, disabled, hasDisabledHover, ...rest }: TTreeNodeProps) => React.JSX.Element | null;
23
+ export declare const TreeNode: ({ children, id, cssClassNames, ContentComponent, LabelComponent, disabled, isHighlighted, hasDisabledHover, ...rest }: TTreeNodeProps) => React.JSX.Element | null;
23
24
  export default TreeNode;
package/build/esm/packages/aurora/src/components/tree/components/tree_node.js CHANGED
@@ -6,7 +6,7 @@ import { CSSTransition } from 'react-transition-group';
6
6
  import { useTree } from '../hooks/tree_hook.js';
7
7
  import { useTreeNode } from '../hooks/tree_node_hook.js';
8
8
 
9
- var _excluded = ["children", "id", "cssClassNames", "ContentComponent", "LabelComponent", "disabled", "hasDisabledHover"];
9
+ var _excluded = ["children", "id", "cssClassNames", "ContentComponent", "LabelComponent", "disabled", "isHighlighted", "hasDisabledHover"];
10
10
  var TreeNode = function TreeNode(_ref) {
11
11
  var children = _ref.children,
12
12
  id = _ref.id,
@@ -14,6 +14,7 @@ var TreeNode = function TreeNode(_ref) {
14
14
  ContentComponent = _ref.ContentComponent,
15
15
  LabelComponent = _ref.LabelComponent,
16
16
  disabled = _ref.disabled,
17
+ isHighlighted = _ref.isHighlighted,
17
18
  hasDisabledHover = _ref.hasDisabledHover,
18
19
  rest = _objectWithoutProperties(_ref, _excluded);
19
20
  var treeApi = useTree();
@@ -26,7 +27,8 @@ var TreeNode = function TreeNode(_ref) {
26
27
  };
27
28
  var Label = LabelComponent ? (/*#__PURE__*/React.createElement("div", {
28
29
  className: cn('aurora-w-full aurora-px-2 aurora-rounded-4 hover:aurora-bg-hover', {
29
- 'hover:aurora-bg-transparent': hasDisabledHover
30
+ 'hover:aurora-bg-transparent': hasDisabledHover,
31
+ 'aurora-bg-hover': isHighlighted
30
32
  })
31
33
  }, LabelComponent === null || LabelComponent === void 0 ? void 0 : LabelComponent({
32
34
  node: node,
@@ -34,7 +36,8 @@ var TreeNode = function TreeNode(_ref) {
34
36
  }))) : (/*#__PURE__*/React.createElement("div", {
35
37
  tabIndex: !children ? 0 : -1,
36
38
  className: cn('aurora-w-full aurora-px-2 aurora-rounded-4 hover:aurora-bg-hover', {
37
- 'hover:aurora-bg-transparent': hasDisabledHover
39
+ 'hover:aurora-bg-transparent': hasDisabledHover,
40
+ 'aurora-bg-hover': isHighlighted
38
41
  })
39
42
  }, node.label ? node.label : node.id));
40
43
  var Content = ContentComponent ? ContentComponent === null || ContentComponent === void 0 ? void 0 : ContentComponent({
@@ -43,7 +46,8 @@ var TreeNode = function TreeNode(_ref) {
43
46
  isLeaf: !childrenCount
44
47
  }) : (/*#__PURE__*/React.createElement("div", {
45
48
  className: cn('aurora-flex aurora-items-center aurora-rounded-4 hover:aurora-bg-hover', {
46
- 'hover:aurora-bg-transparent': hasDisabledHover
49
+ 'hover:aurora-bg-transparent': hasDisabledHover,
50
+ 'aurora-bg-hover': isHighlighted
47
51
  })
48
52
  }, /*#__PURE__*/React.createElement("button", {
49
53
  className: "aurora-flex aurora-items-center aurora-p-1 aurora-cursor-pointer",
@@ -51,13 +55,13 @@ var TreeNode = function TreeNode(_ref) {
51
55
  }, /*#__PURE__*/React.createElement("span", {
52
56
  className: "aurora-flex"
53
57
  }, /*#__PURE__*/React.createElement(ArrowDownSFillIcon, {
54
- className: cn('aurora-h-4 aurora-w-4 aurora-text-inverse-subtle-light -aurora-rotate-90 tree-arrow-transition', {
58
+ className: cn('aurora-h-4 aurora-w-4 aurora-text-inverse-subtle-light -aurora-rotate-90 aurora-transition-transform aurora-duration-200 aurora-ease-out', {
55
59
  'aurora-rotate-0': node.expanded,
56
60
  'aurora-fill-disabled': disabled
57
61
  })
58
62
  }))), Label));
59
63
  return /*#__PURE__*/React.createElement("li", {
60
- className: "aurora-flex aurora-flex-col aurora-gap-2",
64
+ className: cn('aurora-flex aurora-flex-col aurora-gap-2', cssClassNames),
61
65
  role: "treeitem",
62
66
  "aria-expanded": node.expanded,
63
67
  "data-disabled": !!disabled
@@ -67,12 +71,12 @@ var TreeNode = function TreeNode(_ref) {
67
71
  timeout: 50,
68
72
  classNames: {
69
73
  enter: 'tree__children-enter',
70
- enterActive: 'tree__children-enter-active',
71
- exit: 'tree__children-exit',
74
+ enterActive: 'aurora-opacity-100 aurora-scale-100',
75
+ exit: 'aurora-opacity-100 aurora-scale-100',
72
76
  exitActive: 'tree__children-exit-active'
73
77
  }
74
78
  }, /*#__PURE__*/React.createElement("ul", {
75
- className: "aurora-flex aurora-flex-col aurora-gap-2 aurora-pl-4 aurora-scale-100 aurora-origin-top aurora-list-none aurora-will-change-auto tree__children-transition",
79
+ className: "aurora-flex aurora-flex-col aurora-gap-2 aurora-pl-4 aurora-scale-100 aurora-origin-top aurora-list-none aurora-will-change-auto aurora-duration-200 aurora-ease-out aurora-transition-all",
76
80
  ref: nodeChildrenRef
77
81
  }, children))) : null);
78
82
  };
package/build/esm/packages/aurora/src/components/tree/components/tree_node.js.map CHANGED
@@ -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;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;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;"}