@widergy/energy-ui 3.85.0 → 3.85.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.85.2](https://github.com/widergy/energy-ui/compare/v3.85.1...v3.85.2) (2025-07-10)
2
+
3
+
4
+ ### Bug Fixes
5
+
6
+ * [CX-844] utility widergy visual fixes ([#636](https://github.com/widergy/energy-ui/issues/636)) ([c322070](https://github.com/widergy/energy-ui/commit/c322070bd6d841ae31e0d5ac2d13e41164556437))
7
+
8
+ ## [3.85.1](https://github.com/widergy/energy-ui/compare/v3.85.0...v3.85.1) (2025-07-08)
9
+
10
+
11
+ ### Bug Fixes
12
+
13
+ * empty phone field handling ([#632](https://github.com/widergy/energy-ui/issues/632)) ([4ab9f2a](https://github.com/widergy/energy-ui/commit/4ab9f2a75aa1242f6072dcebaa6337d23417b5d7))
14
+
1
15
  # [3.85.0](https://github.com/widergy/energy-ui/compare/v3.84.1...v3.85.0) (2025-07-07)
2
16
 
3
17
 
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.SLIDE_PROPS = exports.PREV = exports.NEXT = exports.LOADING_THICKNESS = exports.LOADING_SIZE = exports.LAST_OPTION_PROPS = void 0;
6
+ exports.SLIDE_PROPS = exports.PREV = exports.NEXT = exports.LAST_OPTION_PROPS = void 0;
7
7
  const SLIDE_PROPS = exports.SLIDE_PROPS = {
8
8
  style: {
9
9
  borderTopLeftRadius: '16px',
@@ -15,7 +15,5 @@ const LAST_OPTION_PROPS = exports.LAST_OPTION_PROPS = {
15
15
  marginRight: '4px'
16
16
  }
17
17
  };
18
- const LOADING_SIZE = exports.LOADING_SIZE = 80;
19
- const LOADING_THICKNESS = exports.LOADING_THICKNESS = 5;
20
18
  const NEXT = exports.NEXT = 'next';
21
19
  const PREV = exports.PREV = 'prev';
@@ -8,7 +8,7 @@ var _react = _interopRequireWildcard(require("react"));
8
8
  var _propTypes = require("prop-types");
9
9
  var _UTTabs = _interopRequireDefault(require("../UTTabs"));
10
10
  var _UTLabel = _interopRequireDefault(require("../UTLabel"));
11
- var _Loading = _interopRequireDefault(require("../Loading"));
11
+ var _UTLoading = _interopRequireDefault(require("../UTLoading"));
12
12
  var _UTSheet = _interopRequireDefault(require("../UTSheet"));
13
13
  var _useScreenSize = require("../../utils/useScreenSize");
14
14
  var _utils = require("./utils");
@@ -150,9 +150,8 @@ const UTDocumentWizard = _ref => {
150
150
  className: _stylesModule.default.scrollContainer
151
151
  }, isChangingTab && /*#__PURE__*/_react.default.createElement("div", {
152
152
  className: _stylesModule.default.loadingContainer
153
- }, /*#__PURE__*/_react.default.createElement(_Loading.default, {
154
- size: _constants.LOADING_SIZE,
155
- thickness: _constants.LOADING_THICKNESS
153
+ }, /*#__PURE__*/_react.default.createElement(_UTLoading.default, {
154
+ loading: true
156
155
  })), !isChangingTab && actualPage && /*#__PURE__*/_react.default.createElement(_PageWizard.default, {
157
156
  canvasRef: canvasRef,
158
157
  classNames: classNames,
@@ -4,16 +4,18 @@ Component used for displaying text values and markdown.
4
4
 
5
5
  ## Props
6
6
 
7
- | Name | Type | Default | Description |
8
- | ----------------- | ------ | ---------------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
9
- | className | string | | Additional classes. |
10
- | classes | string | | Classes returned by UTLabel's own [theme](./theme.js#L40) `retrieveStyle`. |
11
- | colorTheme | string | 'primary' | Color theme to style the UTLabel. Has to be defined in the proyect theme. [Example](#colortheme). |
12
- | markdownRenderers | object | [MARKDOWN_RENDERERS](./constants.js#L36) | ⚠️ Requires `withMarkdown` to be set to `true` <br />Object mapping tag names to React components. The keys in components are HTML equivalents for the things you write with markdown [List of tags](#markdown-renderers). |
13
- | title | string | | [Title global attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/title). |
14
- | variant | string | 'body' | Defines html component to use. For a list of available variants, check [here](#variants). Font sizes can be overwritten (⚠️ for the entire proyect) through the proyect's theme. |
15
- | weight | string | 'regular' | Defines font-weight to be used. For a list of available options, check [here](#font-weights). |
16
- | withMarkdown | bool | false | Tells the component whether or not to render text inside as markdown. |
7
+
8
+ | Name | Type | Default | Description |
9
+ | ------------------- | -------- | ------------------------------------------ | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
10
+ | align | string | 'left' | Alignment of the text content. Accepts values like 'left', 'center', 'right', or 'justify'. |
11
+ | className | string | | Additional classes. |
12
+ | classes | string | | Classes returned by UTLabel's own[theme](./theme.js#L40) `retrieveStyle`. |
13
+ | colorTheme | string | 'primary' | Color theme to style the UTLabel. Has to be defined in the proyect theme.[Example](#colortheme). |
14
+ | markdownRenderers | object | [MARKDOWN_RENDERERS](./constants.js#L36) | ⚠️ Requires`withMarkdown` to be set to `true` <br />Object mapping tag names to React components. The keys in components are HTML equivalents for the things you write with markdown [List of tags](#markdown-renderers). |
15
+ | title | string | | [Title global attribute](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/title). |
16
+ | variant | string | 'body' | Defines html component to use. For a list of available variants, check[here](#variants). Font sizes can be overwritten (⚠️ for the entire proyect) through the proyect's theme. |
17
+ | weight | string | 'regular' | Defines font-weight to be used. For a list of available options, check[here](#font-weights). |
18
+ | withMarkdown | bool | false | Tells the component whether or not to render text inside as markdown. |
17
19
 
18
20
  ## Examples
19
21
 
@@ -37,24 +39,25 @@ UTLabel: {
37
39
 
38
40
  ### Markdown renderers
39
41
 
40
- | markdown | component |
41
- | ------------------------- | --------------------------------------- |
42
- | `blockquote` | `blockquote` |
43
- | `break` | `br` |
44
- | `code`, `inlineCode` | `code`, `pre`**​\*​** |
42
+
43
+ | markdown | component |
44
+ | --------------------------- | ------------------------------------------ |
45
+ | `blockquote` | `blockquote` |
46
+ | `break` | `br` |
47
+ | `code`, `inlineCode` | `code`, `pre`**\*** |
45
48
  | `definition` | **†** |
46
- | `emphasis` | `em` |
49
+ | `emphasis` | `em` |
47
50
  | `heading` | `h1`, `h2`, `h3`, `h4`, `h5`, `h6`**§** |
48
51
  | `image`, `imageReference` | `img`**†** |
49
52
  | `link`, `linkReference` | `a`**†** |
50
53
  | `list` | `ol`, `ul`**¶** |
51
- | `listItem` | `li` |
52
- | `paragraph` | `p` |
53
- | `strong` | `strong` |
54
- | `text` | |
55
- | `thematicBreak` | `hr` |
54
+ | `listItem` | `li` |
55
+ | `paragraph` | `p` |
56
+ | `strong` | `strong` |
57
+ | `text` | |
58
+ | `thematicBreak` | `hr` |
56
59
 
57
- - **​\*​** It’s possible to differentiate between code based on the `inline`
60
+ - **\*** It’s possible to differentiate between code based on the `inline`
58
61
  prop.
59
62
  Block code is also wrapped in a `pre`
60
63
  - **†** Resource (`[text](url)`) and reference (`[text][id]`) style links and
@@ -92,7 +95,7 @@ There are some extra props passed.
92
95
  - `inline` (`boolean?`)
93
96
  — set to `true` for inline code
94
97
  - `className` (`string?`)
95
- — set to `language-js` or so when using ` ```js `
98
+ — set to `language-js` or so when using ` ```js`
96
99
  - `h1`, `h2`, `h3`, `h4`, `h5`, `h6`
97
100
  - `level` (`number` beween 1 and 6)
98
101
  — heading rank
@@ -141,8 +144,9 @@ info.
141
144
 
142
145
  ### variants
143
146
 
147
+
144
148
  | Variant | Component | Default font size |
145
- | --------- | --------- | ----------------- |
149
+ | ----------- | ----------- | ------------------- |
146
150
  | title1 | h1 | 30px |
147
151
  | title2 | h2 | 24px |
148
152
  | title3 | h3 | 22px |
@@ -156,8 +160,9 @@ info.
156
160
 
157
161
  ### font-weights
158
162
 
163
+
159
164
  | Name | Weight |
160
- | ---------- | ------ |
165
+ | ------------ | -------- |
161
166
  | thin | 100 |
162
167
  | extralight | 200 |
163
168
  | light | 300 |
@@ -68,6 +68,7 @@ const MARKDOWN_RENDERERS = exports.MARKDOWN_RENDERERS = {
68
68
  }
69
69
  };
70
70
  const DEFAULT_PROPS = exports.DEFAULT_PROPS = {
71
+ align: 'left',
71
72
  colorTheme: _Palette.COLOR_THEMES.dark,
72
73
  field: {},
73
74
  markdownRenderers: MARKDOWN_RENDERERS,
@@ -15,12 +15,14 @@ var _UTSkeleton = _interopRequireDefault(require("../UTSkeleton"));
15
15
  var _WithTheme = _interopRequireDefault(require("../WithTheme"));
16
16
  var _constants = require("./constants");
17
17
  var _theme = require("./theme");
18
+ var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
18
19
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
19
20
  function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
20
21
  /* eslint-disable react/no-children-prop */
21
22
 
22
23
  const UTLabel = _ref => {
23
24
  let {
25
+ align,
24
26
  children,
25
27
  className,
26
28
  classes: theme,
@@ -36,7 +38,7 @@ const UTLabel = _ref => {
36
38
  className
37
39
  }), [theme, className]);
38
40
  return /*#__PURE__*/_react.default.createElement(_UTSkeleton.default, null, /*#__PURE__*/_react.default.createElement(Component, {
39
- className: "".concat(classes.root, " ").concat(classes.className).trim(),
41
+ className: "".concat(classes.root, " ").concat(_stylesModule.default["".concat(align, "Alignment")] || '', " ").concat(classes.className).trim(),
40
42
  "data-testid": dataTestId,
41
43
  title: title
42
44
  }, withMarkdown && /*#__PURE__*/_react.default.createElement(_reactMarkdown.default, {
@@ -51,6 +53,7 @@ const UTLabel = _ref => {
51
53
  };
52
54
  UTLabel.defaultProps = _constants.DEFAULT_PROPS;
53
55
  UTLabel.propTypes = {
56
+ align: _propTypes.string,
54
57
  classes: (0, _propTypes.objectOf)(_propTypes.string),
55
58
  className: _propTypes.string,
56
59
  dataTestId: _propTypes.string,
@@ -0,0 +1,15 @@
1
+ .leftAlignment {
2
+ text-align: left;
3
+ }
4
+
5
+ .centerAlignment {
6
+ text-align: center;
7
+ }
8
+
9
+ .rightAlignment {
10
+ text-align: right;
11
+ }
12
+
13
+ .justifyAlignment {
14
+ text-align: justify;
15
+ }
@@ -107,6 +107,8 @@ const UTPhoneInput = _ref => {
107
107
  if (newValue !== value) {
108
108
  onChange(newValue);
109
109
  }
110
+ } else {
111
+ onChange('');
110
112
  }
111
113
  }, [areaCodeState.code, phoneNumber, withAreaCode, onChange, value]);
112
114
  const validationData = validations || areaCodeState.error && (0, _utils.formatErrorToValidation)(areaCodeState.error) || error && (0, _utils.formatErrorToValidation)(error);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@widergy/energy-ui",
3
- "version": "3.85.0",
3
+ "version": "3.85.2",
4
4
  "description": "Widergy Web Components",
5
5
  "author": "widergy",
6
6
  "license": "MIT",