@widergy/energy-ui 3.35.0 → 3.37.0
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/Loading/styles.module.scss +0 -2
- package/dist/components/UTAttachment/styles.module.scss +1 -1
- package/dist/components/UTButton/styles.module.scss +1 -1
- package/dist/components/UTConsumptionBar/components/ConsumptionBarIndicator/styles.module.scss +2 -2
- package/dist/components/UTConsumptionBar/components/ConsumptionBarIndicatorTop/styles.module.scss +2 -2
- package/dist/components/UTConsumptionBar/styles.module.scss +3 -3
- package/dist/components/UTEmojiPicker/styles.module.scss +2 -2
- package/dist/components/UTFileInput/styles.module.scss +1 -2
- package/dist/components/UTHeader/styles.module.scss +6 -4
- package/dist/components/UTImageRadio/components/ImageRadioCard/styles.module.scss +3 -2
- package/dist/components/UTOnboarding/components/OnboardingStep/styles.module.scss +1 -1
- package/dist/components/UTOnboarding/styles.module.scss +2 -3
- package/dist/components/UTPhoneInput/versions/V0/styles.module.scss +2 -2
- package/dist/components/UTRating/components/Circle/styles.module.scss +4 -4
- package/dist/components/UTRating/components/Faces/styles.module.scss +3 -3
- package/dist/components/UTRating/components/Star/styles.module.scss +3 -3
- package/dist/components/UTRating/styles.module.scss +1 -1
- package/dist/components/UTSidebar/styles.module.scss +1 -1
- package/dist/components/UTSkeleton/styles.module.scss +1 -1
- package/dist/components/UTStepper/components/Step/styles.module.scss +1 -1
- package/dist/components/UTTable/components/ActionIcons/styles.module.scss +0 -2
- package/dist/components/UTTable/styles.module.scss +1 -1
- package/dist/components/UTTextInput/versions/V0/styles.module.scss +1 -1
- package/dist/components/UTTooltip/styles.module.scss +1 -1
- package/dist/components/UTTracker/components/Step/styles.module.scss +3 -3
- package/dist/components/UTTracker/styles.module.scss +0 -2
- package/dist/components/UTWorkflowContainer/versions/V1/README.md +2 -1
- package/dist/components/UTWorkflowContainer/versions/V1/components/NavActions/styles.module.scss +1 -1
- package/dist/components/UTWorkflowContainer/versions/V1/constants.js +5 -8
- package/dist/components/UTWorkflowContainer/versions/V1/styles.module.scss +11 -18
- package/dist/scss/variables/colors.module.scss +3 -1
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
|
@@ -1,3 +1,17 @@
|
|
|
1
|
+
# [3.37.0](https://github.com/widergy/energy-ui/compare/v3.36.0...v3.37.0) (2024-10-29)
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
### Features
|
|
5
|
+
|
|
6
|
+
* replaced node-sass with sass ([#521](https://github.com/widergy/energy-ui/issues/521)) ([5286d09](https://github.com/widergy/energy-ui/commit/5286d09c702e90bcfd3955ff03502cec9ab6e047))
|
|
7
|
+
|
|
8
|
+
# [3.36.0](https://github.com/widergy/energy-ui/compare/v3.35.0...v3.36.0) (2024-10-23)
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
### Features
|
|
12
|
+
|
|
13
|
+
* [UG-2149] new workflow design ([#517](https://github.com/widergy/energy-ui/issues/517)) ([f3309ed](https://github.com/widergy/energy-ui/commit/f3309ed72d5dc9bbbaf0ad76cee34a919f0b1c0e))
|
|
14
|
+
|
|
1
15
|
# [3.35.0](https://github.com/widergy/energy-ui/compare/v3.34.0...v3.35.0) (2024-10-22)
|
|
2
16
|
|
|
3
17
|
|
package/dist/components/UTConsumptionBar/components/ConsumptionBarIndicator/styles.module.scss
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
@
|
|
2
|
-
@
|
|
1
|
+
@use '../../../../scss/variables/colors.module.scss' as *;
|
|
2
|
+
@use '../../../../scss/variables/mediaQueries.module.scss' as *;
|
|
3
3
|
|
|
4
4
|
.indicator {
|
|
5
5
|
align-items: center;
|
package/dist/components/UTConsumptionBar/components/ConsumptionBarIndicatorTop/styles.module.scss
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
@
|
|
2
|
-
@
|
|
1
|
+
@use '../../../../scss/variables/colors.module.scss' as *;
|
|
2
|
+
@use '../../../../scss/variables/mediaQueries.module.scss' as *;
|
|
3
3
|
|
|
4
4
|
.alignCenter {
|
|
5
5
|
text-align: center;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
@
|
|
2
|
-
@
|
|
3
|
-
@
|
|
1
|
+
@use '../../scss/variables/colors.module.scss' as *;
|
|
2
|
+
@use '../../scss/variables/mediaQueries.module.scss' as *;
|
|
3
|
+
@use '../../scss/variables/fontSizes.module.scss' as *;
|
|
4
4
|
|
|
5
5
|
.container {
|
|
6
6
|
align-items: center;
|
|
@@ -1,4 +1,6 @@
|
|
|
1
|
-
@
|
|
1
|
+
@use '../../scss/variables/mediaQueries.module.scss' as *;
|
|
2
|
+
|
|
3
|
+
$header-workflow-max-width: 966px;
|
|
2
4
|
|
|
3
5
|
.actionsContainer {
|
|
4
6
|
align-items: flex-start;
|
|
@@ -11,7 +13,7 @@
|
|
|
11
13
|
flex-direction: column;
|
|
12
14
|
justify-content: space-between;
|
|
13
15
|
margin: 0 auto;
|
|
14
|
-
max-width:
|
|
16
|
+
max-width: $header-workflow-max-width;
|
|
15
17
|
padding: 24px 32px 32px;
|
|
16
18
|
|
|
17
19
|
@media #{$tablet-mobile} {
|
|
@@ -38,8 +40,6 @@
|
|
|
38
40
|
.bannerContainer {
|
|
39
41
|
border-radius: 8px;
|
|
40
42
|
margin-bottom: 0;
|
|
41
|
-
max-width: calc(800px - 32px);
|
|
42
|
-
width: 100%;
|
|
43
43
|
}
|
|
44
44
|
|
|
45
45
|
.stepTitle {
|
|
@@ -54,7 +54,9 @@
|
|
|
54
54
|
.titleAndActionsContainer {
|
|
55
55
|
align-items: flex-start;
|
|
56
56
|
display: flex;
|
|
57
|
+
flex-wrap: wrap;
|
|
57
58
|
grid-gap: 16px;
|
|
59
|
+
word-break: break-word;
|
|
58
60
|
justify-content: space-between;
|
|
59
61
|
margin-bottom: 12px;
|
|
60
62
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
@
|
|
2
|
-
@
|
|
1
|
+
@use 'sass:color';
|
|
2
|
+
@use '../../../../scss/variables/colors.module.scss' as *;
|
|
3
|
+
@use '../../../../scss/variables/mediaQueries.module.scss' as *;
|
|
3
4
|
|
|
4
5
|
$default-text-grid-gap: 8px;
|
|
5
6
|
$content-grid-gap: 16px;
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
@import '../../scss/variables/colors.module.scss';
|
|
2
1
|
$intro-js-disabled-button-class: 'introjs-disabled';
|
|
3
2
|
$introjs-progress: 'introjs-progress';
|
|
4
3
|
$introjs-progressbar: 'introjs-progressbar';
|
|
@@ -17,13 +16,13 @@ $introjs-tooltipbuttons: 'introjs-tooltipbuttons';
|
|
|
17
16
|
|
|
18
17
|
%tooltipContainer {
|
|
19
18
|
box-sizing: border-box;
|
|
20
|
-
color:
|
|
19
|
+
color: var(--light01);
|
|
21
20
|
margin: 0;
|
|
22
21
|
padding: 16px !important;
|
|
23
22
|
width: 296px;
|
|
24
23
|
z-index: 1290;
|
|
25
24
|
[class*='#{$introjs-skipbutton}'] {
|
|
26
|
-
color:
|
|
25
|
+
color: var(--light01);
|
|
27
26
|
font-size: 30px;
|
|
28
27
|
font-weight: 400;
|
|
29
28
|
position: relative;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
@
|
|
2
|
-
@
|
|
1
|
+
@use '../../../../scss/variables/colors.module.scss' as *;
|
|
2
|
+
@use '../../../../scss/variables/fontSizes.module.scss' as *;
|
|
3
3
|
|
|
4
4
|
.container {
|
|
5
5
|
align-items: flex-start;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
@
|
|
2
|
-
@
|
|
3
|
-
@
|
|
4
|
-
@
|
|
1
|
+
@use '../../../../scss/variables/colors.module.scss' as *;
|
|
2
|
+
@use '../../../../scss/variables/fontSizes.module.scss' as *;
|
|
3
|
+
@use '../../../../scss/variables/sizes.module.scss' as *;
|
|
4
|
+
@use '../../../../scss/variables/mediaQueries.module.scss' as *;
|
|
5
5
|
|
|
6
6
|
.icon {
|
|
7
7
|
height: $rating-circle-icon-size;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
@
|
|
2
|
-
@
|
|
3
|
-
@
|
|
1
|
+
@use '../../../../scss/variables/colors.module.scss' as *;
|
|
2
|
+
@use '../../../../scss/variables/sizes.module.scss' as *;
|
|
3
|
+
@use '../../../../scss/variables/mediaQueries.module.scss' as *;
|
|
4
4
|
|
|
5
5
|
.container {
|
|
6
6
|
align-items: center;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
@
|
|
2
|
-
@
|
|
3
|
-
@
|
|
1
|
+
@use '../../../../scss/variables/colors.module.scss' as *;
|
|
2
|
+
@use '../../../../scss/variables/fontSizes.module.scss' as *;
|
|
3
|
+
@use '../../../../scss/variables/mediaQueries.module.scss' as *;
|
|
4
4
|
|
|
5
5
|
.container {
|
|
6
6
|
align-items: center;
|
|
@@ -24,9 +24,9 @@ $oval-size: 20px;
|
|
|
24
24
|
|
|
25
25
|
.innerContainer {
|
|
26
26
|
align-items: center;
|
|
27
|
-
border-radius: ($oval-size / 2);
|
|
28
|
-
height: ($oval-size / 2);
|
|
29
|
-
width: ($oval-size / 2);
|
|
27
|
+
border-radius: calc($oval-size / 2);
|
|
28
|
+
height: calc($oval-size / 2);
|
|
29
|
+
width: calc($oval-size / 2);
|
|
30
30
|
}
|
|
31
31
|
|
|
32
32
|
.outerContainer {
|
|
@@ -30,6 +30,7 @@ This component serves as a wrapper for each step of a workflow
|
|
|
30
30
|
| tagline | string | | Text that will be rendered in uppercase on top of the title. |
|
|
31
31
|
| title | string | | Text that will be rendered between the stages and the content. It is required in order to show any other text header elements. |
|
|
32
32
|
| TitleIcon | element | | Icon that will be rendered on top of the title. |
|
|
33
|
+
| variant | string | 'default' | Defines which variant to show. There are two options:`default` or `fullWidth`. |
|
|
33
34
|
| withIcon | bool | false | Defines whether the nextButton and backButton will aditionally have their own icons inside. |
|
|
34
35
|
| withStepperPadding | bool | true | If false, the stepper indicator will occupy the full width of the container, rendering the first and last stage's label aligned towards the center. |
|
|
35
36
|
|
|
@@ -41,4 +42,4 @@ This component serves as a wrapper for each step of a workflow
|
|
|
41
42
|
| bannerType | `{ Icon: element, text: string }` |
|
|
42
43
|
| checkboxType | objectOf( UTCheckbox props ) |
|
|
43
44
|
| headerActionType | `{ label: string, onClick: func, main: bool, Icon: element }` |
|
|
44
|
-
| stageType | arrayOf( `{ id: number, label: string, Icon: element }` ) |
|
|
45
|
+
| stageType | arrayOf( `{ id: number, label: string, Icon: element }` ) |
|
|
@@ -6,16 +6,13 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.childrenContentStyle = exports.VARIANTS = void 0;
|
|
7
7
|
var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
|
|
8
8
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
9
|
-
const CENTERED = 'centered';
|
|
10
|
-
const FULL_WIDTH = 'fullWidth';
|
|
11
9
|
const DEFAULT = 'default';
|
|
10
|
+
const FULL_WIDTH = 'fullWidth';
|
|
12
11
|
const VARIANTS = exports.VARIANTS = {
|
|
13
|
-
|
|
14
|
-
FULL_WIDTH
|
|
15
|
-
DEFAULT
|
|
12
|
+
DEFAULT,
|
|
13
|
+
FULL_WIDTH
|
|
16
14
|
};
|
|
17
15
|
const childrenContentStyle = exports.childrenContentStyle = {
|
|
18
|
-
[VARIANTS.
|
|
19
|
-
[VARIANTS.FULL_WIDTH]: _stylesModule.default.childrenContentFullWidth
|
|
20
|
-
[VARIANTS.DEFAULT]: _stylesModule.default.childrenContent
|
|
16
|
+
[VARIANTS.DEFAULT]: _stylesModule.default.childrenContent,
|
|
17
|
+
[VARIANTS.FULL_WIDTH]: _stylesModule.default.childrenContentFullWidth
|
|
21
18
|
};
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
@
|
|
2
|
-
|
|
1
|
+
@use '../../../../scss/variables/mediaQueries.module.scss' as *;
|
|
2
|
+
|
|
3
|
+
$default-variant-max-width: 966px;
|
|
3
4
|
|
|
4
5
|
.container {
|
|
5
6
|
align-items: center;
|
|
@@ -41,8 +42,8 @@
|
|
|
41
42
|
.childrenContainer {
|
|
42
43
|
flex: 1;
|
|
43
44
|
margin: 0 auto;
|
|
44
|
-
max-width:
|
|
45
|
-
padding: 0 32px
|
|
45
|
+
max-width: $default-variant-max-width;
|
|
46
|
+
padding: 0 32px 32px;
|
|
46
47
|
width: calc(100% - 64px);
|
|
47
48
|
|
|
48
49
|
@media #{$tablet-mobile} {
|
|
@@ -52,26 +53,18 @@
|
|
|
52
53
|
}
|
|
53
54
|
|
|
54
55
|
.childrenContent {
|
|
55
|
-
max-width: 800px;
|
|
56
|
-
|
|
57
|
-
@media #{$tablet-mobile} {
|
|
58
|
-
margin: 0 auto;
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
|
-
|
|
62
|
-
.childrenContentCentered {
|
|
63
|
-
align-items: center;
|
|
64
|
-
display: flex;
|
|
65
|
-
height: 100%;
|
|
66
|
-
justify-content: center;
|
|
67
56
|
margin: 0 auto;
|
|
68
|
-
max-width:
|
|
57
|
+
max-width: 100%;
|
|
69
58
|
}
|
|
70
59
|
|
|
71
60
|
.childrenContainerFullWidth {
|
|
72
61
|
max-width: none;
|
|
73
|
-
padding: 24px 32px
|
|
62
|
+
padding: 24px 32px 32px;
|
|
74
63
|
width: calc(100% - 64px);
|
|
64
|
+
|
|
65
|
+
@media #{$tablet-mobile} {
|
|
66
|
+
padding: 24px 16px 16px !important;
|
|
67
|
+
}
|
|
75
68
|
}
|
|
76
69
|
|
|
77
70
|
.childrenContentFullWidth {
|
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
@use 'sass:color';
|
|
2
|
+
|
|
1
3
|
$black: rgba(0, 0, 0, 0.87);
|
|
2
4
|
$white: #FFF;
|
|
3
5
|
$transparent: transparent;
|
|
@@ -42,7 +44,7 @@ $button-secondary: #1A58D5;
|
|
|
42
44
|
$button-tertiary: #E9F0FD;
|
|
43
45
|
$button-shadow: #C9DBFE;
|
|
44
46
|
$image-radio-background: #E5E5E5;
|
|
45
|
-
$image-radio-background-hover:
|
|
47
|
+
$image-radio-background-hover: color.adjust(#E5E5E5, $lightness: -10%);
|
|
46
48
|
$green: #02E700;
|
|
47
49
|
$usage-indicator-yellow: #FEFA00;
|
|
48
50
|
$usage-indicator-red: #FB391B;
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@widergy/energy-ui",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.37.0",
|
|
4
4
|
"description": "Widergy Web Components",
|
|
5
5
|
"author": "widergy",
|
|
6
6
|
"license": "MIT",
|
|
@@ -42,7 +42,6 @@
|
|
|
42
42
|
"emojilib": "^3.0.10",
|
|
43
43
|
"intro.js": "^7.2.0",
|
|
44
44
|
"intro.js-react": "0.7.1",
|
|
45
|
-
"node-sass": "^8.0.0",
|
|
46
45
|
"numeral": "^2.0.6",
|
|
47
46
|
"object-hash": "^3.0.0",
|
|
48
47
|
"react-google-maps": ">=9.2.2",
|
|
@@ -54,6 +53,7 @@
|
|
|
54
53
|
"react-window": "^1.8.5",
|
|
55
54
|
"rehype-raw": "^6.1.0",
|
|
56
55
|
"remark-breaks": "^3.0.2",
|
|
56
|
+
"sass": "^1.80.4",
|
|
57
57
|
"sass-loader": "^10.0.5",
|
|
58
58
|
"seamless-immutable": "^7.1.4"
|
|
59
59
|
},
|