@mailstep/design-system 0.7.65-beta.0 → 0.7.65-beta.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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mailstep/design-system",
3
- "version": "0.7.65-beta.0",
3
+ "version": "0.7.65-beta.2",
4
4
  "license": "ISC",
5
5
  "type": "module",
6
6
  "main": "./ui/index.js",
@@ -49,6 +49,6 @@ var MenuItem = function (_a) {
49
49
  }, [items, link]);
50
50
  return (_jsxs(_Fragment, { children: [separator && _jsx(ItemsSeparator, {}), _jsxs(MenuItemContainer, { ref: parentRef, "$isCompact": isCompact, "$lightMode": lightMode, hasChildren: hasChildren, isHovering: isHovering, children: [_jsxs(ItemLinkWrap, __assign({}, linkProps, { onMouseOver: handleMouseOver, exact: true, activeClassName: hasChildren ? 'selected' : undefined, onClick: toggleChildren, "$isCompact": isCompact, className: itemLinkWrapClassName,
51
51
  // @ts-expect-error
52
- isActive: isActive, "$lightMode": lightMode, children: [_jsxs(ItemLabel, { "$isCompact": isCompact, isSubitem: isSubitem, children: [!isSubitem && icon && (_jsx(ItemIcon, { className: "mainIcon", "$isCompact": isCompact, children: typeof icon === 'string' ? _jsx(Icon, { icon: icon, fill: "none" }) : icon })), _jsx(Title, { variant: "semiBold", mt: 0, mb: 0, textAlign: "left", children: _jsx(OverflowWithEllipsis, { children: title }) })] }), !isCompact && hasChildren && _jsx(ItemDropdownArrow, { icon: "goDown", "$lightMode": lightMode })] })), isHovering && isCompact && hasChildren && !listExpandedItems && (_jsx(SubitemTooltip, { items: items, childRef: childRef, parentRef: parentRef, isLeftMenuOpen: isLeftMenuOpen, onCloseLeftMenu: onCloseLeftMenu, lightMode: lightMode }))] }), hasChildren && listExpandedItems && (_jsx(SubItemsWrap, { children: items === null || items === void 0 ? void 0 : items.map(function (item, index) { return (_jsx(MenuItem, __assign({ isCompact: isCompact, lightMode: lightMode }, item, { onCloseLeftMenu: onCloseLeftMenu, isSubitem: true }), "".concat(index))); }) }))] }));
52
+ isActive: isActive, "$lightMode": lightMode, children: [_jsxs(ItemLabel, { "$isCompact": isCompact, isSubitem: isSubitem, children: [!isSubitem && icon && (_jsx(ItemIcon, { className: "mainIcon", "$isCompact": isCompact, children: typeof icon === 'string' ? _jsx(Icon, { icon: icon, fill: "none" }) : icon })), _jsx(Title, { variant: "semiBold", mt: 0, mb: 0, textAlign: isCompact ? 'center' : 'left', children: _jsx(OverflowWithEllipsis, { children: title }) })] }), !isCompact && hasChildren && _jsx(ItemDropdownArrow, { icon: "goDown", "$lightMode": lightMode })] })), isHovering && isCompact && hasChildren && !listExpandedItems && (_jsx(SubitemTooltip, { items: items, childRef: childRef, parentRef: parentRef, isLeftMenuOpen: isLeftMenuOpen, onCloseLeftMenu: onCloseLeftMenu, lightMode: lightMode }))] }), hasChildren && listExpandedItems && (_jsx(SubItemsWrap, { children: items === null || items === void 0 ? void 0 : items.map(function (item, index) { return (_jsx(MenuItem, __assign({ isCompact: isCompact, lightMode: lightMode }, item, { onCloseLeftMenu: onCloseLeftMenu, isSubitem: true }), "".concat(index))); }) }))] }));
53
53
  };
54
54
  export default memo(MenuItem);
@@ -29,6 +29,9 @@ declare const defaultTheme: {
29
29
  typoPrimary: string;
30
30
  blue10: string;
31
31
  blue20: string;
32
+ blue30: string;
33
+ blue40: string;
34
+ blue50: string;
32
35
  blue60: string;
33
36
  blue70: string;
34
37
  blue80: string;
@@ -79,8 +82,13 @@ declare const defaultTheme: {
79
82
  purple60: string;
80
83
  purple80: string;
81
84
  purple90: string;
85
+ magenta10: string;
82
86
  magenta20: string;
87
+ magenta30: string;
88
+ magenta40: string;
89
+ magenta50: string;
83
90
  magenta60: string;
91
+ magenta70: string;
84
92
  magenta80: string;
85
93
  magenta90: string;
86
94
  };
@@ -29,6 +29,9 @@ var defaultTheme = {
29
29
  typoPrimary: '#22394E',
30
30
  blue10: '#F3F9FF',
31
31
  blue20: '#DCEFFF',
32
+ blue30: '#BFE0FF',
33
+ blue40: '#6FADFF',
34
+ blue50: '#2684FF',
32
35
  blue60: '#0065FF',
33
36
  blue70: '#0052CC',
34
37
  blue80: '#0747A6',
@@ -79,10 +82,15 @@ var defaultTheme = {
79
82
  purple60: '#6554C0',
80
83
  purple80: '#403294',
81
84
  purple90: '#03235f',
85
+ magenta10: '#FFF7FB',
82
86
  magenta20: '#FCF1F7',
87
+ magenta30: '#FFD6E8',
88
+ magenta40: '#FFAFD2',
89
+ magenta50: '#FF7EB6',
83
90
  magenta60: '#EE5396',
91
+ magenta70: '#D12771',
84
92
  magenta80: '#9F1853',
85
- magenta90: '#872e8b',
93
+ magenta90: '#7B1340',
86
94
  },
87
95
  fonts: {
88
96
  primary: 'Inter, sans-serif',
@@ -30,6 +30,9 @@ declare const themes: {
30
30
  typoPrimary: string;
31
31
  blue10: string;
32
32
  blue20: string;
33
+ blue30: string;
34
+ blue40: string;
35
+ blue50: string;
33
36
  blue60: string;
34
37
  blue70: string;
35
38
  blue80: string;
@@ -80,8 +83,13 @@ declare const themes: {
80
83
  purple60: string;
81
84
  purple80: string;
82
85
  purple90: string;
86
+ magenta10: string;
83
87
  magenta20: string;
88
+ magenta30: string;
89
+ magenta40: string;
90
+ magenta50: string;
84
91
  magenta60: string;
92
+ magenta70: string;
85
93
  magenta80: string;
86
94
  magenta90: string;
87
95
  };