@lumx/react 2.2.12-alpha.1 → 2.2.12-alpha.2

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 (6) hide show
  1. package/esm/_internal/Icon2.js +20 -40
  2. package/esm/_internal/Icon2.js.map +1 -1
  3. package/package.json +4 -4
  4. package/src/components/icon/Icon.stories.tsx +12 -0
  5. package/src/components/icon/Icon.tsx +16 -37
  6. package/src/components/icon/__snapshots__/Icon.test.tsx.snap +1 -1
package/esm/_internal/Icon2.js CHANGED
@@ -56,50 +56,30 @@ var Icon = forwardRef(function (props, ref) {
56
56
  size = props.size,
57
57
  theme = props.theme,
58
58
  alt = props.alt,
59
- forwardedProps = _objectWithoutProperties(props, ["className", "color", "colorVariant", "hasShape", "icon", "size", "theme", "alt"]);
59
+ forwardedProps = _objectWithoutProperties(props, ["className", "color", "colorVariant", "hasShape", "icon", "size", "theme", "alt"]); // Color
60
60
 
61
- var iconColor;
62
- var iconColorVariant;
63
- var iconTheme;
64
61
 
65
- if (color) {
66
- iconColor = color;
67
- iconTheme = theme;
68
- }
62
+ var iconColor = color;
69
63
 
70
- if (hasShape) {
71
- if (theme === Theme.dark && !iconColor) {
72
- iconColor = ColorPalette.light;
73
- iconTheme = theme;
74
- } else {
75
- iconColor = iconColor || ColorPalette.dark;
76
- }
77
- } else if (!iconColor && theme) {
78
- iconTheme = theme;
79
- iconColor = iconColor || theme === Theme.light ? ColorPalette.dark : ColorPalette.light;
80
- }
64
+ if (!iconColor && (hasShape || theme)) {
65
+ iconColor = theme === Theme.dark ? ColorPalette.light : ColorPalette.dark;
66
+ } // Color variant
81
67
 
82
- if (!iconColorVariant) {
83
- if (hasShape && iconColor === ColorPalette.dark) {
84
- iconColorVariant = colorVariant || 'L2';
85
- } else {
86
- iconColorVariant = colorVariant || (theme === Theme.dark ? 'N' : 'L1');
87
- }
88
- }
89
68
 
90
- var iconSize;
91
-
92
- if (size) {
93
- if (hasShape) {
94
- if (size === Size.xxs || size === Size.xs) {
95
- iconSize = Size.s;
96
- } else if (size === Size.xxl) {
97
- iconSize = Size.xl;
98
- } else {
99
- iconSize = size;
100
- }
101
- } else {
102
- iconSize = size;
69
+ var iconColorVariant = colorVariant;
70
+
71
+ if (!iconColorVariant && hasShape && iconColor === ColorPalette.dark) {
72
+ iconColorVariant = 'L2';
73
+ } // Size
74
+
75
+
76
+ var iconSize = size;
77
+
78
+ if (size && hasShape) {
79
+ if (size === Size.xxs || size === Size.xs) {
80
+ iconSize = Size.s;
81
+ } else if (size === Size.xxl) {
82
+ iconSize = Size.xl;
103
83
  }
104
84
  } else if (hasShape) {
105
85
  iconSize = Size.m;
@@ -113,7 +93,7 @@ var Icon = forwardRef(function (props, ref) {
113
93
  colorVariant: iconColorVariant,
114
94
  hasShape: hasShape,
115
95
  prefix: CLASSNAME,
116
- theme: iconTheme,
96
+ theme: theme,
117
97
  size: iconSize
118
98
  }), !hasShape && "".concat(CLASSNAME, "--no-shape"), !hasShape && iconColor === ColorPalette.yellow && icon === mdiAlertCircle && "".concat(CLASSNAME, "--has-dark-layer"), "".concat(CLASSNAME, "--path"))
119
99
  }), React.createElement("svg", {