@widergy/energy-ui 1.132.0 → 1.132.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/CHANGELOG.md +14 -0
- package/dist/components/UTProgressBar/theme.js +1 -1
- package/dist/components/UTSidebar/components/LogosContainer/index.js +10 -2
- package/dist/components/UTSidebar/components/Option/styles.module.scss +1 -5
- package/dist/components/UTSidebar/index.js +16 -4
- package/dist/components/UTSidebar/styles.module.scss +1 -1
- package/dist/components/UTSidebar/theme.js +24 -0
- package/dist/scss/variables/_fontSizes.scss +16 -4
- package/package.json +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,17 @@
|
|
|
1
|
+
## [1.132.2](https://github.com/widergy/energy-ui/compare/v1.132.1...v1.132.2) (2022-10-31)
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
### Bug Fixes
|
|
5
|
+
|
|
6
|
+
* adding posibility to use a non-color background ([#317](https://github.com/widergy/energy-ui/issues/317)) ([f55e9f7](https://github.com/widergy/energy-ui/commit/f55e9f7e7b620549b2b804a47e7e5451adb7b450))
|
|
7
|
+
|
|
8
|
+
## [1.132.1](https://github.com/widergy/energy-ui/compare/v1.132.0...v1.132.1) (2022-10-19)
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
### Bug Fixes
|
|
12
|
+
|
|
13
|
+
* added badge to sidebar ([#313](https://github.com/widergy/energy-ui/issues/313)) ([27f00ae](https://github.com/widergy/energy-ui/commit/27f00ae322a69afacfb45c7cb0e4dbef29dcb97d))
|
|
14
|
+
|
|
1
15
|
# [1.132.0](https://github.com/widergy/energy-ui/compare/v1.131.2...v1.132.0) (2022-10-06)
|
|
2
16
|
|
|
3
17
|
|
|
@@ -29,7 +29,7 @@ var retrieveStyle = function retrieveStyle(theme) {
|
|
|
29
29
|
borderRadius: (0, _seamlessImmutable.getIn)(theme, ['UTProgressBar', 'colorPrimary', 'borderRadius'])
|
|
30
30
|
},
|
|
31
31
|
barColorPrimary: {
|
|
32
|
-
|
|
32
|
+
background: (0, _seamlessImmutable.getIn)(theme, ['UTProgressBar', 'barColorPrimary', 'background'], (0, _seamlessImmutable.getIn)(theme, ['UTProgressBar', 'barColorPrimary', 'backgroundColor'], _colors.default.blue)),
|
|
33
33
|
borderRadius: (0, _seamlessImmutable.getIn)(theme, ['UTProgressBar', 'barColorPrimary', 'borderRadius']),
|
|
34
34
|
transition: (0, _seamlessImmutable.getIn)(theme, ['UTProgressBar', 'barColorPrimary', 'transition'])
|
|
35
35
|
},
|
|
@@ -11,6 +11,8 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
11
11
|
|
|
12
12
|
var _propTypes = require("prop-types");
|
|
13
13
|
|
|
14
|
+
var _energyUi = require("@widergy/energy-ui");
|
|
15
|
+
|
|
14
16
|
var _DynamicIcon = _interopRequireDefault(require("./components/DynamicIcon"));
|
|
15
17
|
|
|
16
18
|
var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
|
|
@@ -22,7 +24,9 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
22
24
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
23
25
|
|
|
24
26
|
var LogosContainer = function LogosContainer(_ref) {
|
|
25
|
-
var
|
|
27
|
+
var badgeClassName = _ref.badgeClassName,
|
|
28
|
+
badgeContent = _ref.badgeContent,
|
|
29
|
+
BigLogo = _ref.BigLogo,
|
|
26
30
|
bigLogoClassName = _ref.bigLogoClassName,
|
|
27
31
|
containerClassName = _ref.containerClassName,
|
|
28
32
|
SmallLogo = _ref.SmallLogo,
|
|
@@ -36,10 +40,14 @@ var LogosContainer = function LogosContainer(_ref) {
|
|
|
36
40
|
}), /*#__PURE__*/_react.default.createElement(_DynamicIcon.default, {
|
|
37
41
|
Icon: SmallLogo,
|
|
38
42
|
className: "".concat(smallLogoClassName, " ").concat(_stylesModule.default.logo, " ").concat(!showBigLogo && _stylesModule.default.visibleIcon)
|
|
39
|
-
})
|
|
43
|
+
}), badgeContent && /*#__PURE__*/_react.default.createElement(_energyUi.UTLabel, {
|
|
44
|
+
className: badgeClassName
|
|
45
|
+
}, badgeContent));
|
|
40
46
|
};
|
|
41
47
|
|
|
42
48
|
LogosContainer.propTypes = {
|
|
49
|
+
badgeClassName: _propTypes.string,
|
|
50
|
+
badgeContent: _propTypes.string,
|
|
43
51
|
BigLogo: _propTypes.elementType,
|
|
44
52
|
bigLogoClassName: _propTypes.string,
|
|
45
53
|
containerClassName: _propTypes.string,
|
|
@@ -25,6 +25,8 @@ var _array = require("@widergy/web-utils/lib/array");
|
|
|
25
25
|
|
|
26
26
|
var _useScreenSize2 = require("../../utils/useScreenSize");
|
|
27
27
|
|
|
28
|
+
var _classesUtils = require("../../utils/classesUtils");
|
|
29
|
+
|
|
28
30
|
var _WithTheme = _interopRequireDefault(require("../WithTheme"));
|
|
29
31
|
|
|
30
32
|
var _types = require("./types");
|
|
@@ -56,8 +58,10 @@ function _objectWithoutProperties(source, excluded) { if (source == null) return
|
|
|
56
58
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
57
59
|
|
|
58
60
|
var UTSidebar = function UTSidebar(_ref) {
|
|
59
|
-
var
|
|
60
|
-
|
|
61
|
+
var badgeContent = _ref.badgeContent,
|
|
62
|
+
BigLogo = _ref.BigLogo,
|
|
63
|
+
themeClasses = _ref.classes,
|
|
64
|
+
classNames = _ref.classNames,
|
|
61
65
|
FooterBigLogo = _ref.FooterBigLogo,
|
|
62
66
|
FooterSmallLogo = _ref.FooterSmallLogo,
|
|
63
67
|
handleOpen = _ref.handleOpen,
|
|
@@ -75,6 +79,10 @@ var UTSidebar = function UTSidebar(_ref) {
|
|
|
75
79
|
var _useScreenSize = (0, _useScreenSize2.useScreenSize)(),
|
|
76
80
|
isTabletOrDesktop = _useScreenSize.isTabletOrDesktop;
|
|
77
81
|
|
|
82
|
+
var classes = (0, _react.useMemo)(function () {
|
|
83
|
+
return (0, _classesUtils.mergeClasses)(themeClasses, classNames);
|
|
84
|
+
}, [classNames]);
|
|
85
|
+
|
|
78
86
|
var toggleDrawer = function toggleDrawer() {
|
|
79
87
|
return open ? handleClose() : handleOpen();
|
|
80
88
|
};
|
|
@@ -96,6 +104,8 @@ var UTSidebar = function UTSidebar(_ref) {
|
|
|
96
104
|
return withMouseActions && handleOpen();
|
|
97
105
|
}
|
|
98
106
|
}, /*#__PURE__*/_react.default.createElement(_LogosContainer.default, {
|
|
107
|
+
badgeClassName: open ? classes.logoBadgeOpen : classes.logoBadgeClose,
|
|
108
|
+
badgeContent: badgeContent,
|
|
99
109
|
BigLogo: BigLogo,
|
|
100
110
|
SmallLogo: SmallLogo,
|
|
101
111
|
bigLogoClassName: classes.bigLogo,
|
|
@@ -154,12 +164,14 @@ var UTSidebar = function UTSidebar(_ref) {
|
|
|
154
164
|
};
|
|
155
165
|
|
|
156
166
|
UTSidebar.propTypes = {
|
|
167
|
+
badgeContent: _propTypes.string,
|
|
157
168
|
BigLogo: (0, _propTypes.oneOfType)([_types.iconType, _propTypes.string]),
|
|
158
169
|
classes: _types.classType,
|
|
159
|
-
|
|
160
|
-
handleClose: _propTypes.func,
|
|
170
|
+
classNames: (0, _propTypes.objectOf)(_propTypes.string),
|
|
161
171
|
FooterBigLogo: (0, _propTypes.oneOfType)([_types.iconType, _propTypes.string]),
|
|
162
172
|
FooterSmallLogo: (0, _propTypes.oneOfType)([_types.iconType, _propTypes.string]),
|
|
173
|
+
handleClose: _propTypes.func,
|
|
174
|
+
handleOpen: _propTypes.func,
|
|
163
175
|
labelAlwaysVisible: _propTypes.bool,
|
|
164
176
|
open: _propTypes.bool,
|
|
165
177
|
options: _types.optionsType,
|
|
@@ -9,9 +9,13 @@ var _seamlessImmutable = require("seamless-immutable");
|
|
|
9
9
|
|
|
10
10
|
var _colors = _interopRequireDefault(require("../../scss/variables/_colors.scss"));
|
|
11
11
|
|
|
12
|
+
var _fontSizes = _interopRequireDefault(require("../../scss/variables/_fontSizes.scss"));
|
|
13
|
+
|
|
12
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
15
|
|
|
14
16
|
var retrieveStyle = function retrieveStyle(theme) {
|
|
17
|
+
var _theme$UTSidebar, _theme$UTSidebar$logo, _theme$UTSidebar2, _theme$UTSidebar2$log, _theme$UTSidebar3, _theme$UTSidebar3$log, _theme$UTSidebar4, _theme$UTSidebar4$log, _theme$UTSidebar5, _theme$UTSidebar5$log, _theme$UTSidebar6, _theme$UTSidebar6$log, _theme$UTSidebar7, _theme$UTSidebar7$log, _theme$UTSidebar8, _theme$UTSidebar8$log, _theme$UTSidebar9, _theme$UTSidebar9$log, _theme$UTSidebar10, _theme$UTSidebar10$lo, _theme$UTSidebar11, _theme$UTSidebar11$lo, _theme$UTSidebar12, _theme$UTSidebar12$lo, _theme$UTSidebar13, _theme$UTSidebar13$lo, _theme$UTSidebar14, _theme$UTSidebar14$lo, _theme$UTSidebar15, _theme$UTSidebar15$lo, _theme$UTSidebar16, _theme$UTSidebar16$lo;
|
|
18
|
+
|
|
15
19
|
return {
|
|
16
20
|
drawerRoot: {
|
|
17
21
|
width: (0, _seamlessImmutable.getIn)(theme, ['UTSidebar', 'drawer', 'width'], 60)
|
|
@@ -106,6 +110,26 @@ var retrieveStyle = function retrieveStyle(theme) {
|
|
|
106
110
|
padding: (0, _seamlessImmutable.getIn)(theme, ['UTSidebar', 'listOpened', 'padding']),
|
|
107
111
|
width: (0, _seamlessImmutable.getIn)(theme, ['UTSidebar', 'listOpened', 'width'])
|
|
108
112
|
},
|
|
113
|
+
logoBadgeOpen: {
|
|
114
|
+
backgroundColor: theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar = theme.UTSidebar) === null || _theme$UTSidebar === void 0 ? void 0 : (_theme$UTSidebar$logo = _theme$UTSidebar.logoBadgeOpen) === null || _theme$UTSidebar$logo === void 0 ? void 0 : _theme$UTSidebar$logo.backgroundColor,
|
|
115
|
+
borderRadius: (theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar2 = theme.UTSidebar) === null || _theme$UTSidebar2 === void 0 ? void 0 : (_theme$UTSidebar2$log = _theme$UTSidebar2.logoBadgeOpen) === null || _theme$UTSidebar2$log === void 0 ? void 0 : _theme$UTSidebar2$log.borderRadius) || 8,
|
|
116
|
+
color: theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar3 = theme.UTSidebar) === null || _theme$UTSidebar3 === void 0 ? void 0 : (_theme$UTSidebar3$log = _theme$UTSidebar3.logoBadgeOpen) === null || _theme$UTSidebar3$log === void 0 ? void 0 : _theme$UTSidebar3$log.color,
|
|
117
|
+
fontSize: "".concat((theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar4 = theme.UTSidebar) === null || _theme$UTSidebar4 === void 0 ? void 0 : (_theme$UTSidebar4$log = _theme$UTSidebar4.logoBadgeOpen) === null || _theme$UTSidebar4$log === void 0 ? void 0 : _theme$UTSidebar4$log.fontSize) || _fontSizes.default.small, " !important"),
|
|
118
|
+
fontWeight: "".concat((theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar5 = theme.UTSidebar) === null || _theme$UTSidebar5 === void 0 ? void 0 : (_theme$UTSidebar5$log = _theme$UTSidebar5.logoBadgeOpen) === null || _theme$UTSidebar5$log === void 0 ? void 0 : _theme$UTSidebar5$log.fontWeight) || 600, " !important"),
|
|
119
|
+
margin: (theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar6 = theme.UTSidebar) === null || _theme$UTSidebar6 === void 0 ? void 0 : (_theme$UTSidebar6$log = _theme$UTSidebar6.logoBadgeOpen) === null || _theme$UTSidebar6$log === void 0 ? void 0 : _theme$UTSidebar6$log.margin) || '12px auto 24px',
|
|
120
|
+
maxWidth: (theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar7 = theme.UTSidebar) === null || _theme$UTSidebar7 === void 0 ? void 0 : (_theme$UTSidebar7$log = _theme$UTSidebar7.logoBadgeOpen) === null || _theme$UTSidebar7$log === void 0 ? void 0 : _theme$UTSidebar7$log.maxWidth) || '96%',
|
|
121
|
+
padding: (theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar8 = theme.UTSidebar) === null || _theme$UTSidebar8 === void 0 ? void 0 : (_theme$UTSidebar8$log = _theme$UTSidebar8.logoBadgeOpen) === null || _theme$UTSidebar8$log === void 0 ? void 0 : _theme$UTSidebar8$log.padding) || '2px 8px'
|
|
122
|
+
},
|
|
123
|
+
logoBadgeClose: {
|
|
124
|
+
backgroundColor: theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar9 = theme.UTSidebar) === null || _theme$UTSidebar9 === void 0 ? void 0 : (_theme$UTSidebar9$log = _theme$UTSidebar9.logoBadgeClose) === null || _theme$UTSidebar9$log === void 0 ? void 0 : _theme$UTSidebar9$log.backgroundColor,
|
|
125
|
+
borderRadius: (theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar10 = theme.UTSidebar) === null || _theme$UTSidebar10 === void 0 ? void 0 : (_theme$UTSidebar10$lo = _theme$UTSidebar10.logoBadgeClose) === null || _theme$UTSidebar10$lo === void 0 ? void 0 : _theme$UTSidebar10$lo.borderRadius) || 8,
|
|
126
|
+
color: theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar11 = theme.UTSidebar) === null || _theme$UTSidebar11 === void 0 ? void 0 : (_theme$UTSidebar11$lo = _theme$UTSidebar11.logoBadgeClose) === null || _theme$UTSidebar11$lo === void 0 ? void 0 : _theme$UTSidebar11$lo.color,
|
|
127
|
+
fontSize: "".concat((theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar12 = theme.UTSidebar) === null || _theme$UTSidebar12 === void 0 ? void 0 : (_theme$UTSidebar12$lo = _theme$UTSidebar12.logoBadgeClose) === null || _theme$UTSidebar12$lo === void 0 ? void 0 : _theme$UTSidebar12$lo.fontSize) || _fontSizes.default.small, " !important"),
|
|
128
|
+
fontWeight: "".concat((theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar13 = theme.UTSidebar) === null || _theme$UTSidebar13 === void 0 ? void 0 : (_theme$UTSidebar13$lo = _theme$UTSidebar13.logoBadgeClose) === null || _theme$UTSidebar13$lo === void 0 ? void 0 : _theme$UTSidebar13$lo.fontWeight) || 600, " !important"),
|
|
129
|
+
margin: (theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar14 = theme.UTSidebar) === null || _theme$UTSidebar14 === void 0 ? void 0 : (_theme$UTSidebar14$lo = _theme$UTSidebar14.logoBadgeClose) === null || _theme$UTSidebar14$lo === void 0 ? void 0 : _theme$UTSidebar14$lo.margin) || '12px auto 24px',
|
|
130
|
+
maxWidth: (theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar15 = theme.UTSidebar) === null || _theme$UTSidebar15 === void 0 ? void 0 : (_theme$UTSidebar15$lo = _theme$UTSidebar15.logoBadgeClose) === null || _theme$UTSidebar15$lo === void 0 ? void 0 : _theme$UTSidebar15$lo.maxWidth) || '96%',
|
|
131
|
+
padding: (theme === null || theme === void 0 ? void 0 : (_theme$UTSidebar16 = theme.UTSidebar) === null || _theme$UTSidebar16 === void 0 ? void 0 : (_theme$UTSidebar16$lo = _theme$UTSidebar16.logoBadgeClose) === null || _theme$UTSidebar16$lo === void 0 ? void 0 : _theme$UTSidebar16$lo.padding) || '2px 8px'
|
|
132
|
+
},
|
|
109
133
|
option: {
|
|
110
134
|
backgroundColor: (0, _seamlessImmutable.getIn)(theme, ['UTSidebar', 'option', 'backgroundColor']),
|
|
111
135
|
border: (0, _seamlessImmutable.getIn)(theme, ['UTSidebar', 'option', 'border']),
|
|
@@ -2,7 +2,6 @@
|
|
|
2
2
|
$xxsmall: 9px;
|
|
3
3
|
$xsmall: 10px;
|
|
4
4
|
$small: 12px;
|
|
5
|
-
$xmedium: 13px;
|
|
6
5
|
$medium: 14px;
|
|
7
6
|
$large: 16px;
|
|
8
7
|
$xlarge: 18px;
|
|
@@ -11,6 +10,19 @@ $xxxlarge: 23px;
|
|
|
11
10
|
$title: 26px;
|
|
12
11
|
$xtitle: 30px;
|
|
13
12
|
$large-title: 36px;
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
13
|
+
|
|
14
|
+
// sass-lint:disable no-misspelled-properties
|
|
15
|
+
// sass-lint:disable property-sort-order
|
|
16
|
+
:export {
|
|
17
|
+
xxsmall: $xxsmall;
|
|
18
|
+
xsmall: $xsmall;
|
|
19
|
+
small: $small;
|
|
20
|
+
medium: $medium;
|
|
21
|
+
large: $large;
|
|
22
|
+
xlarge: $xlarge;
|
|
23
|
+
xxlarge: $xxlarge;
|
|
24
|
+
xxxlarge: $xxxlarge;
|
|
25
|
+
title: $title;
|
|
26
|
+
xtitle: $xtitle;
|
|
27
|
+
largeTitle: $large-title;
|
|
28
|
+
}
|