@widergy/energy-ui 3.121.0 → 3.121.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 CHANGED
@@ -1,3 +1,17 @@
1
+ ## [3.121.2](https://github.com/widergy/energy-ui/compare/v3.121.1...v3.121.2) (2025-11-19)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * [BRILLA-97] color theme ut base input ([#722](https://github.com/widergy/energy-ui/issues/722)) ([e5f120f](https://github.com/widergy/energy-ui/commit/e5f120f3aac517800d20bc7a478132b8cc9cd83b))
7
+
8
+ ## [3.121.1](https://github.com/widergy/energy-ui/compare/v3.121.0...v3.121.1) (2025-11-18)
9
+
10
+
11
+ ### Bug Fixes
12
+
13
+ * step label prop ([#725](https://github.com/widergy/energy-ui/issues/725)) ([c70a9ab](https://github.com/widergy/energy-ui/commit/c70a9ab29df8da303df640c60e762c67ebfa0c48))
14
+
1
15
  # [3.121.0](https://github.com/widergy/energy-ui/compare/v3.120.0...v3.121.0) (2025-11-18)
2
16
 
3
17
 
@@ -3,7 +3,8 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.COMPONENT_KEYS = exports.COMPONENTS_MAPPER = void 0;
6
+ exports.UT_BASE_INPUT_COLOR_BORDER_FOCUS = exports.DEFAULT_PROPS = exports.COMPONENT_KEYS = exports.COMPONENTS_MAPPER = void 0;
7
+ var _Palette = require("../../constants/Palette");
7
8
  var _ActionAdornment = _interopRequireDefault(require("./components/ActionAdornment"));
8
9
  var _BadgeAdornment = _interopRequireDefault(require("./components/BadgeAdornment"));
9
10
  var _IconAdornment = _interopRequireDefault(require("./components/IconAdornment"));
@@ -26,4 +27,8 @@ const COMPONENTS_MAPPER = exports.COMPONENTS_MAPPER = {
26
27
  [COMPONENT_KEYS.PREFIX]: _PrefixAdornment.default,
27
28
  [COMPONENT_KEYS.SUFFIX]: _SuffixAdornment.default,
28
29
  [COMPONENT_KEYS.TOOLTIP]: _TooltipAdornment.default
30
+ };
31
+ const UT_BASE_INPUT_COLOR_BORDER_FOCUS = exports.UT_BASE_INPUT_COLOR_BORDER_FOCUS = 'UT-baseInput-color-border-focus';
32
+ const DEFAULT_PROPS = exports.DEFAULT_PROPS = {
33
+ colorTheme: _Palette.COLOR_THEMES.accent
29
34
  };
@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.retrieveStyle = void 0;
7
7
  var _theme = require("../UTLabel/theme");
8
+ var _utils = require("./utils");
8
9
  const charactersCountRowHeight = 20;
9
10
  const PADDING = {
10
11
  HORIZONTAL: 16,
@@ -64,7 +65,6 @@ const getBackgroundColorOnHover = _ref3 => {
64
65
  return undefined;
65
66
  };
66
67
  const retrieveStyle = _ref4 => {
67
- var _theme$Palette$action, _theme$Palette$action2, _theme$Palette$action3, _theme$Palette$action4, _theme$Palette$action5;
68
68
  let {
69
69
  alwaysShowPlaceholder,
70
70
  disabled: receivedDisabled,
@@ -78,6 +78,7 @@ const retrieveStyle = _ref4 => {
78
78
  } = _ref4;
79
79
  const disabled = receivedDisabled && !readOnly;
80
80
  const hasCharactersCount = showCharacterCount && maxLength && !disabled && !readOnly;
81
+ const actionPalette = (0, _utils.getActionPalette)(theme);
81
82
  const {
82
83
  verticalPadding,
83
84
  horizontalPadding,
@@ -116,7 +117,7 @@ const retrieveStyle = _ref4 => {
116
117
  ...(!disabled && !readOnly && {
117
118
  backgroundColor: theme.Palette.light['01'],
118
119
  '& $inputContainer': {
119
- borderColor: error ? "".concat(theme.Palette.error['04'], " !important") : "".concat(((_theme$Palette$action = theme.Palette.actions) === null || _theme$Palette$action === void 0 ? void 0 : _theme$Palette$action.accent['04']) || theme.Palette.accent['04'], " !important"),
120
+ borderColor: error ? "".concat(theme.Palette.error['04'], " !important") : "".concat(actionPalette['04'], " !important"),
120
121
  borderWidth: '2px'
121
122
  },
122
123
  '& $input': {
@@ -147,12 +148,12 @@ const retrieveStyle = _ref4 => {
147
148
  },
148
149
  withValueRoot: {
149
150
  ...(variant === 'transparent' && !error && {
150
- backgroundColor: ((_theme$Palette$action2 = theme.Palette.actions) === null || _theme$Palette$action2 === void 0 ? void 0 : _theme$Palette$action2.accent['01']) || theme.Palette.accent['01']
151
+ backgroundColor: actionPalette['01']
151
152
  })
152
153
  },
153
154
  focusedInputContainer: {
154
155
  ...(!error && {
155
- borderColor: "".concat(((_theme$Palette$action3 = theme.Palette.actions) === null || _theme$Palette$action3 === void 0 ? void 0 : _theme$Palette$action3.accent['04']) || theme.Palette.accent['04'], " !important"),
156
+ borderColor: "".concat(actionPalette['04'], " !important"),
156
157
  borderWidth: '2px'
157
158
  }),
158
159
  ...(error && {
@@ -165,7 +166,7 @@ const retrieveStyle = _ref4 => {
165
166
  variant: 'body',
166
167
  weight: 'regular'
167
168
  }),
168
- caretColor: ((_theme$Palette$action4 = theme.Palette.actions) === null || _theme$Palette$action4 === void 0 ? void 0 : _theme$Palette$action4.accent['04']) || theme.Palette.accent['04'],
169
+ caretColor: actionPalette['04'],
169
170
  color: theme.Palette.dark['05'],
170
171
  minHeight: '22px',
171
172
  overflow: 'auto',
@@ -178,7 +179,7 @@ const retrieveStyle = _ref4 => {
178
179
  userSelect: 'none'
179
180
  },
180
181
  '&::selection': {
181
- backgroundColor: ((_theme$Palette$action5 = theme.Palette.actions) === null || _theme$Palette$action5 === void 0 ? void 0 : _theme$Palette$action5.accent['02']) || theme.Palette.accent['02']
182
+ backgroundColor: actionPalette['02']
182
183
  },
183
184
  '&:focus': {
184
185
  '&::placeholder': {
@@ -3,7 +3,15 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.validateAdornments = void 0;
6
+ exports.validateColorTheme = exports.validateAdornments = exports.getActionPalette = void 0;
7
7
  var _constants = require("./constants");
8
8
  const validateAdornments = adornments => adornments.every(adornment => _constants.COMPONENTS_MAPPER[adornment.name]);
9
- exports.validateAdornments = validateAdornments;
9
+ exports.validateAdornments = validateAdornments;
10
+ const validateColorTheme = colorTheme => colorTheme || _constants.DEFAULT_PROPS.colorTheme;
11
+ exports.validateColorTheme = validateColorTheme;
12
+ const getActionPalette = theme => {
13
+ var _theme$Palette$action, _theme$Palette$action2;
14
+ const colorThemeToUse = (theme === null || theme === void 0 ? void 0 : theme[_constants.UT_BASE_INPUT_COLOR_BORDER_FOCUS]) || _constants.DEFAULT_PROPS.colorTheme;
15
+ return ((_theme$Palette$action = theme.Palette.actions) === null || _theme$Palette$action === void 0 ? void 0 : _theme$Palette$action[colorThemeToUse]) || theme.Palette[colorThemeToUse] || ((_theme$Palette$action2 = theme.Palette.actions) === null || _theme$Palette$action2 === void 0 ? void 0 : _theme$Palette$action2[_constants.DEFAULT_PROPS.colorTheme]) || theme.Palette[_constants.DEFAULT_PROPS.colorTheme];
16
+ };
17
+ exports.getActionPalette = getActionPalette;
@@ -12,6 +12,7 @@ var _constants = require("../../constants");
12
12
  var _useScreenSize = require("../../../../utils/useScreenSize");
13
13
  var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
14
14
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
15
+ function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
15
16
  var CompletedIcon = function CompletedIcon(props) {
16
17
  return /*#__PURE__*/_react.default.createElement("svg", props, /*#__PURE__*/_react.default.createElement("path", {
17
18
  clipRule: "evenodd",
@@ -27,11 +28,12 @@ CompletedIcon.defaultProps = {
27
28
  };
28
29
  const Step = _ref => {
29
30
  let {
30
- stage,
31
+ classes,
31
32
  isActive,
32
33
  isCompleted,
33
34
  size,
34
- classes
35
+ stage,
36
+ stepperLabelProps = {}
35
37
  } = _ref;
36
38
  const stageCompleted = isCompleted(stage === null || stage === void 0 ? void 0 : stage.id);
37
39
  const stageActive = isActive(stage === null || stage === void 0 ? void 0 : stage.id);
@@ -45,11 +47,11 @@ const Step = _ref => {
45
47
  className: _stylesModule.default["checkIcon".concat(size)]
46
48
  }), !stageCompleted && size === _constants.SIZES.LARGE && /*#__PURE__*/_react.default.createElement(CustomIcon, {
47
49
  className: "\n ".concat(stageActive ? classes.activeIcon : classes.nextIcxon, " \n ").concat(_stylesModule.default["customIcon".concat(size)], "\n ")
48
- }), (stageActive || !isMobileOrTablet) && /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
50
+ }), (stageActive || !isMobileOrTablet) && /*#__PURE__*/_react.default.createElement(_UTLabel.default, _extends({
49
51
  variant: "xsmall",
50
52
  className: "\n ".concat(_stylesModule.default.label, "\n ").concat(stageActive || stageCompleted ? classes.coloredLabel : '', "\n "),
51
53
  colorTheme: !stageActive && !stageCompleted ? 'gray' : null
52
- }, stage.label));
54
+ }, stepperLabelProps), stage.label));
53
55
  };
54
56
  Step.propTypes = {
55
57
  classes: _commonTypes.classesType,
@@ -60,6 +62,7 @@ Step.propTypes = {
60
62
  id: _propTypes.number,
61
63
  label: _propTypes.string,
62
64
  Icon: _propTypes.elementType
63
- })
65
+ }),
66
+ stepperLabelProps: _propTypes.object
64
67
  };
65
68
  var _default = exports.default = Step;
@@ -21,6 +21,7 @@ const UTStepper = _ref => {
21
21
  classNames,
22
22
  currentStage,
23
23
  stages,
24
+ stepperLabelProps = {},
24
25
  stepperSize,
25
26
  withPadding
26
27
  } = _ref;
@@ -41,7 +42,8 @@ const UTStepper = _ref => {
41
42
  size,
42
43
  isCompleted,
43
44
  isActive,
44
- stage
45
+ stage,
46
+ stepperLabelProps
45
47
  })), /*#__PURE__*/_react.default.createElement(_Connectors.default, {
46
48
  classes,
47
49
  withPadding,
@@ -54,6 +56,7 @@ UTStepper.propTypes = {
54
56
  classNames: (0, _propTypes.objectOf)(_propTypes.string),
55
57
  currentStage: _propTypes.number,
56
58
  stages: _propTypes.object,
59
+ stepperLabelProps: _propTypes.object,
57
60
  stepperSize: (0, _propTypes.oneOf)([_constants.SIZES.LARGE, _constants.SIZES.SMALL]),
58
61
  withPadding: _propTypes.bool
59
62
  };
@@ -32,8 +32,8 @@ const UTWorkflowContainer = _ref => {
32
32
  banner,
33
33
  checkbox,
34
34
  children,
35
- classNames,
36
35
  classes: themeClasses = {},
36
+ classNames,
37
37
  currentStage,
38
38
  currentStep = 1,
39
39
  forceResponsive = false,
@@ -47,6 +47,7 @@ const UTWorkflowContainer = _ref => {
47
47
  requiredFieldInfoDataTestId = workflowContainer.header.requiredFieldInfo,
48
48
  secondaryAction,
49
49
  stages,
50
+ stepperLabelProps = {},
50
51
  stepperSize = 'S',
51
52
  stepsCount,
52
53
  subtitle,
@@ -114,6 +115,7 @@ const UTWorkflowContainer = _ref => {
114
115
  stepperSize,
115
116
  currentStage,
116
117
  stages,
118
+ stepperLabelProps,
117
119
  withPadding: withStepperPadding
118
120
  }), (title || isMobileOrTablet && (primaryAction || secondaryAction)) && /*#__PURE__*/_react.default.createElement(_UTHeader.default, {
119
121
  actions: [...(headerActions || []), ...(isMobileOrTablet ? [primaryAction, secondaryAction].filter(action => action) : [])],
@@ -191,6 +193,7 @@ UTWorkflowContainer.propTypes = {
191
193
  requiredFieldInfoDataTestId: _propTypes.string,
192
194
  secondaryAction: _types.buttonTypes,
193
195
  stages: _propTypes.object,
196
+ stepperLabelProps: _propTypes.object,
194
197
  stepperSize: _propTypes.string,
195
198
  stepsCount: _propTypes.number,
196
199
  subtitle: _propTypes.string,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@widergy/energy-ui",
3
- "version": "3.121.0",
3
+ "version": "3.121.2",
4
4
  "description": "Widergy Web Components",
5
5
  "author": "widergy",
6
6
  "license": "MIT",