@synerise/ds-alert 0.9.9 → 1.0.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
CHANGED
@@ -3,6 +3,14 @@
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
5
5
|
|
6
|
+
## [0.9.10](https://github.com/Synerise/synerise-design/compare/@synerise/ds-alert@0.9.9...@synerise/ds-alert@0.9.10) (2025-03-10)
|
7
|
+
|
8
|
+
**Note:** Version bump only for package @synerise/ds-alert
|
9
|
+
|
10
|
+
|
11
|
+
|
12
|
+
|
13
|
+
|
6
14
|
## [0.9.9](https://github.com/Synerise/synerise-design/compare/@synerise/ds-alert@0.9.8...@synerise/ds-alert@0.9.9) (2025-03-04)
|
7
15
|
|
8
16
|
**Note:** Version bump only for package @synerise/ds-alert
|
package/dist/Alert.styles.js
CHANGED
@@ -12,7 +12,7 @@ export var AntdAlert = styled(function (props) {
|
|
12
12
|
return /*#__PURE__*/React.createElement(Alert, props);
|
13
13
|
}).withConfig({
|
14
14
|
displayName: "Alertstyles__AntdAlert",
|
15
|
-
componentId: "k5v82n-0"
|
15
|
+
componentId: "sc-k5v82n-0"
|
16
16
|
})(["", ";", ";", ";"], function (props) {
|
17
17
|
return Boolean(props.color) && css(["&&&{box-shadow:0 0 0 1px ", ";background-color:", ";color:", ";.ant-alert-icon{svg{color:", ";fill:", ";}}}"], props.theme.palette[props.color + "-600"], props.theme.palette[props.color + "-050"], getColor(props), getColor(props), getColor(props));
|
18
18
|
}, function (props) {
|
@@ -22,17 +22,17 @@ export var AntdAlert = styled(function (props) {
|
|
22
22
|
});
|
23
23
|
export var AlertContent = styled.div.withConfig({
|
24
24
|
displayName: "Alertstyles__AlertContent",
|
25
|
-
componentId: "k5v82n-1"
|
25
|
+
componentId: "sc-k5v82n-1"
|
26
26
|
})(["display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;padding:3px 0;color:inherit;"]);
|
27
27
|
export var AlertMessage = styled.span.withConfig({
|
28
28
|
displayName: "Alertstyles__AlertMessage",
|
29
|
-
componentId: "k5v82n-2"
|
29
|
+
componentId: "sc-k5v82n-2"
|
30
30
|
})(["display:flex;font-size:16px;line-height:1.25;letter-spacing:-0.1px;font-weight:500;margin-bottom:2px;color:inherit;"]);
|
31
31
|
export var AlertDescription = styled.span.withConfig({
|
32
32
|
displayName: "Alertstyles__AlertDescription",
|
33
|
-
componentId: "k5v82n-3"
|
33
|
+
componentId: "sc-k5v82n-3"
|
34
34
|
})(["display:flex;font-size:13px;line-height:1.39;font-weight:normal;margin-bottom:2px;color:inherit;"]);
|
35
35
|
export var AlertShowMore = styled.span.withConfig({
|
36
36
|
displayName: "Alertstyles__AlertShowMore",
|
37
|
-
componentId: "k5v82n-4"
|
37
|
+
componentId: "sc-k5v82n-4"
|
38
38
|
})(["display:flex;font-size:13px;font-weight:500;color:inherit;text-decoration:underline;cursor:pointer;margin-top:6px;"]);
|
@@ -8,13 +8,13 @@ var mapElementsPosition = {
|
|
8
8
|
};
|
9
9
|
export var TextWrapper = styled.div.withConfig({
|
10
10
|
displayName: "AlertInfostyles__TextWrapper",
|
11
|
-
componentId: "a78l8a-0"
|
11
|
+
componentId: "sc-a78l8a-0"
|
12
12
|
})(["display:flex;line-height:16px;max-width:440px;word-wrap:break-word;justify-content:", ";text-align:center;"], function (props) {
|
13
13
|
return props.labelPosition === 'bottom' ? 'center' : 'flex-start';
|
14
14
|
});
|
15
15
|
export var HeaderWrapper = styled.div.withConfig({
|
16
16
|
displayName: "AlertInfostyles__HeaderWrapper",
|
17
|
-
componentId: "a78l8a-1"
|
17
|
+
componentId: "sc-a78l8a-1"
|
18
18
|
})(["display:flex;line-height:16px;color:", ";font-size:", "px;font-weight:500;margin-top:", ";padding:", ";"], function (props) {
|
19
19
|
return props.theme.palette['grey-800'];
|
20
20
|
}, function (props) {
|
@@ -26,11 +26,11 @@ export var HeaderWrapper = styled.div.withConfig({
|
|
26
26
|
});
|
27
27
|
export var ButtonWrapper = styled.div.withConfig({
|
28
28
|
displayName: "AlertInfostyles__ButtonWrapper",
|
29
|
-
componentId: "a78l8a-2"
|
29
|
+
componentId: "sc-a78l8a-2"
|
30
30
|
})(["padding-top:12px;"]);
|
31
31
|
export var AlertWrapper = styled.div.withConfig({
|
32
32
|
displayName: "AlertInfostyles__AlertWrapper",
|
33
|
-
componentId: "a78l8a-3"
|
33
|
+
componentId: "sc-a78l8a-3"
|
34
34
|
})(["display:flex;flex-direction:", ";align-items:center;justify-content:center;", ";"], function (props) {
|
35
35
|
return mapElementsPosition[props.labelPosition];
|
36
36
|
}, function (props) {
|
@@ -38,11 +38,11 @@ export var AlertWrapper = styled.div.withConfig({
|
|
38
38
|
});
|
39
39
|
export var AlertIconContainer = styled.div.withConfig({
|
40
40
|
displayName: "AlertInfostyles__AlertIconContainer",
|
41
|
-
componentId: "a78l8a-4"
|
41
|
+
componentId: "sc-a78l8a-4"
|
42
42
|
})(["margin:0 0 12px;"]);
|
43
43
|
export var StatusIconContainer = styled.div.withConfig({
|
44
44
|
displayName: "AlertInfostyles__StatusIconContainer",
|
45
|
-
componentId: "a78l8a-5"
|
45
|
+
componentId: "sc-a78l8a-5"
|
46
46
|
})(["background-color:", ";width:40px;height:40px;border-radius:20px;text-align:center;display:flex;align-items:center;justify-content:center;margin:0 auto;&&{", "{fill:", ";}}"], function (props) {
|
47
47
|
return props.theme.palette[props.background];
|
48
48
|
}, IconContainer, function (props) {
|
@@ -55,7 +55,7 @@ export var ButtonWrapper = styled.div.withConfig({
|
|
55
55
|
export var BroadcastButton = styled(Button).withConfig({
|
56
56
|
displayName: "BroadcastBarstyles__BroadcastButton",
|
57
57
|
componentId: "sc-1xh5805-6"
|
58
|
-
})(["color:", "
|
58
|
+
})(["color:", ";&&& :hover{color:", " !important;}"], function (props) {
|
59
59
|
return props.color === 'yellow' ? props.theme.palette['grey-800'] : props.theme.palette.white;
|
60
60
|
}, function (props) {
|
61
61
|
return props.color === 'yellow' ? props.theme.palette['grey-800'] : props.theme.palette.white;
|
@@ -55,17 +55,17 @@ export var closingAnimation = function closingAnimation() {
|
|
55
55
|
};
|
56
56
|
export var AlertContent = styled.div.withConfig({
|
57
57
|
displayName: "Toaststyles__AlertContent",
|
58
|
-
componentId: "q5tn0-0"
|
58
|
+
componentId: "sc-q5tn0-0"
|
59
59
|
})(["display:flex;flex-direction:column;align-items:flex-start;justify-content:center;margin-right:24px;", " ", "{margin-bottom:8px;}"], function (props) {
|
60
60
|
return props.hasBottomMargin && 'margin-bottom:16px;';
|
61
61
|
}, UnorderedList);
|
62
62
|
export var AllContent = styled.div.withConfig({
|
63
63
|
displayName: "Toaststyles__AllContent",
|
64
|
-
componentId: "q5tn0-1"
|
64
|
+
componentId: "sc-q5tn0-1"
|
65
65
|
})(["display:flex;color:inherit;"]);
|
66
66
|
export var IconWrapper = styled.div.withConfig({
|
67
67
|
displayName: "Toaststyles__IconWrapper",
|
68
|
-
componentId: "q5tn0-2"
|
68
|
+
componentId: "sc-q5tn0-2"
|
69
69
|
})(["margin:12px;display:flex;svg{color:", ";fill:", ";}"], function (props) {
|
70
70
|
return props.customColorIcon ? props.theme.palette[props.customColorIcon + "-600"] : getColorIcon;
|
71
71
|
}, function (props) {
|
@@ -73,13 +73,13 @@ export var IconWrapper = styled.div.withConfig({
|
|
73
73
|
});
|
74
74
|
export var IconCloseWrapper = styled.div.withConfig({
|
75
75
|
displayName: "Toaststyles__IconCloseWrapper",
|
76
|
-
componentId: "q5tn0-3"
|
76
|
+
componentId: "sc-q5tn0-3"
|
77
77
|
})(["cursor:pointer;svg{fill:", ";}"], function (props) {
|
78
78
|
return props.customColorText ? props.theme.palette[props.customColorText + "-600"] : getColorText(props);
|
79
79
|
});
|
80
80
|
export var IconExpanderWrapper = styled.div.withConfig({
|
81
81
|
displayName: "Toaststyles__IconExpanderWrapper",
|
82
|
-
componentId: "q5tn0-4"
|
82
|
+
componentId: "sc-q5tn0-4"
|
83
83
|
})(["cursor:pointer;svg{fill:", ";transition:transform 0.1s linear;transform:rotateZ(", ");}"], function (props) {
|
84
84
|
return props.customColorText ? props.theme.palette[props.customColorText + "-600"] : getColorText(props);
|
85
85
|
}, function (props) {
|
@@ -87,15 +87,15 @@ export var IconExpanderWrapper = styled.div.withConfig({
|
|
87
87
|
});
|
88
88
|
export var ButtonWrapper = styled.div.withConfig({
|
89
89
|
displayName: "Toaststyles__ButtonWrapper",
|
90
|
-
componentId: "q5tn0-5"
|
90
|
+
componentId: "sc-q5tn0-5"
|
91
91
|
})(["position:absolute;right:12px;top:12px;display:flex;"]);
|
92
92
|
export var FirstButtonWrapper = styled.div.withConfig({
|
93
93
|
displayName: "Toaststyles__FirstButtonWrapper",
|
94
|
-
componentId: "q5tn0-6"
|
94
|
+
componentId: "sc-q5tn0-6"
|
95
95
|
})(["margin-right:8px;"]);
|
96
96
|
export var NumberWrapper = styled.div.withConfig({
|
97
97
|
displayName: "Toaststyles__NumberWrapper",
|
98
|
-
componentId: "q5tn0-7"
|
98
|
+
componentId: "sc-q5tn0-7"
|
99
99
|
})(["margin-left:4px;color:inherit;opacity:0.6;cursor:pointer;&:hover{background-image:linear-gradient( to right,", " 20%,rgba(255,255,255,0) 10% );background-color:transparent;background-position:bottom left;background-size:5px 1px;background-repeat:repeat-x;opacity:1;color:", ";}"], function (props) {
|
100
100
|
return props.theme.palette['grey-400'];
|
101
101
|
}, function (props) {
|
@@ -103,7 +103,7 @@ export var NumberWrapper = styled.div.withConfig({
|
|
103
103
|
});
|
104
104
|
export var ListWrapper = styled.div.withConfig({
|
105
105
|
displayName: "Toaststyles__ListWrapper",
|
106
|
-
componentId: "q5tn0-8"
|
106
|
+
componentId: "sc-q5tn0-8"
|
107
107
|
})(["display:flex;visibility:", ";height:", ";margin-top:", ";"], function (props) {
|
108
108
|
return props.visible ? 'visible' : 'hidden';
|
109
109
|
}, function (props) {
|
@@ -113,7 +113,7 @@ export var ListWrapper = styled.div.withConfig({
|
|
113
113
|
});
|
114
114
|
export var IconOrderWrapper = styled.div.withConfig({
|
115
115
|
displayName: "Toaststyles__IconOrderWrapper",
|
116
|
-
componentId: "q5tn0-9"
|
116
|
+
componentId: "sc-q5tn0-9"
|
117
117
|
})(["visibility:hidden;margin:-4px 0;svg{fill:", ";}&:hover{svg{fill:", ";cursor:pointer;}}"], function (props) {
|
118
118
|
return props.customColorText ? props.theme.palette[props.customColorText + "-600"] : getColorText(props);
|
119
119
|
}, function (props) {
|
@@ -121,7 +121,7 @@ export var IconOrderWrapper = styled.div.withConfig({
|
|
121
121
|
});
|
122
122
|
export var OrderWrapper = styled.div.withConfig({
|
123
123
|
displayName: "Toaststyles__OrderWrapper",
|
124
|
-
componentId: "q5tn0-10"
|
124
|
+
componentId: "sc-q5tn0-10"
|
125
125
|
})(["display:flex;color:", ";&:hover{", "{visibility:visible;}", "{background-image:linear-gradient( to right,", " 20%,rgba(255,255,255,0) 10% );background-color:transparent;background-position:bottom left;background-size:5px 1px;background-repeat:repeat-x;opacity:1;color:", ";}}"], function (props) {
|
126
126
|
return props.customColorText ? props.theme.palette[props.customColorText + "-600"] : getColorText(props);
|
127
127
|
}, IconOrderWrapper, NumberWrapper, function (props) {
|
@@ -131,19 +131,19 @@ export var OrderWrapper = styled.div.withConfig({
|
|
131
131
|
});
|
132
132
|
export var Wrapper = styled.div.withConfig({
|
133
133
|
displayName: "Toaststyles__Wrapper",
|
134
|
-
componentId: "q5tn0-11"
|
134
|
+
componentId: "sc-q5tn0-11"
|
135
135
|
})(["color:", ";"], function (props) {
|
136
136
|
return props.theme.palette['grey-050'];
|
137
137
|
});
|
138
138
|
export var AnimationContainer = styled.div.withConfig({
|
139
139
|
displayName: "Toaststyles__AnimationContainer",
|
140
|
-
componentId: "q5tn0-12"
|
140
|
+
componentId: "sc-q5tn0-12"
|
141
141
|
})(["animation:", " 0.5s ease-in-out 0s 1;"], function (props) {
|
142
142
|
return props.show ? openingAnimation() : closingAnimation();
|
143
143
|
});
|
144
144
|
export var Container = styled.div.withConfig({
|
145
145
|
displayName: "Toaststyles__Container",
|
146
|
-
componentId: "q5tn0-13"
|
146
|
+
componentId: "sc-q5tn0-13"
|
147
147
|
})(["display:flex;flex-direction:row;max-width:500px;align-items:flex-start;justify-content:center;background-color:", ";border-radius:4px;box-shadow:", ";"], function (props) {
|
148
148
|
return props.customColor ? props.theme.palette[props.customColor + "-600"] : getColorBackground(props);
|
149
149
|
}, function (props) {
|
@@ -151,11 +151,11 @@ export var Container = styled.div.withConfig({
|
|
151
151
|
});
|
152
152
|
export var WrapperSectionMessage = styled.div.withConfig({
|
153
153
|
displayName: "Toaststyles__WrapperSectionMessage",
|
154
|
-
componentId: "q5tn0-14"
|
154
|
+
componentId: "sc-q5tn0-14"
|
155
155
|
})(["position:relative;font-size:13px;min-width:0;color:inherit;"]);
|
156
156
|
export var AlertMessage = styled.div.withConfig({
|
157
157
|
displayName: "Toaststyles__AlertMessage",
|
158
|
-
componentId: "q5tn0-15"
|
158
|
+
componentId: "sc-q5tn0-15"
|
159
159
|
})(["font-size:14px;line-height:20px;padding-top:14px;", ";font-weight:500;overflow:hidden;overflow-wrap:break-word;text-overflow:ellipsis;padding-right:", ";color:", ";"], function (props) {
|
160
160
|
return props.noToastContent && 'padding-bottom: 14px;';
|
161
161
|
}, function (props) {
|
@@ -165,7 +165,7 @@ export var AlertMessage = styled.div.withConfig({
|
|
165
165
|
});
|
166
166
|
export var AlertDescription = styled.div.withConfig({
|
167
167
|
displayName: "Toaststyles__AlertDescription",
|
168
|
-
componentId: "q5tn0-16"
|
168
|
+
componentId: "sc-q5tn0-16"
|
169
169
|
})(["font-size:13px;line-height:1.39;font-weight:normal;overflow:hidden;overflow-wrap:anywhere;text-overflow:ellipsis;padding-bottom:", ";margin-top:2px;color:", ";"], function (props) {
|
170
170
|
return props.button || props.expandedContent ? '16px' : '0';
|
171
171
|
}, function (props) {
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@synerise/ds-alert",
|
3
|
-
"version": "0.
|
3
|
+
"version": "1.0.0",
|
4
4
|
"description": "Alert UI Component for the Synerise Design System",
|
5
5
|
"license": "ISC",
|
6
6
|
"repository": "Synerise/synerise-design",
|
@@ -21,7 +21,7 @@
|
|
21
21
|
"build:js": "babel --delete-dir-on-start --root-mode upward src --out-dir dist --extensions '.js,.ts,.tsx'",
|
22
22
|
"build:watch": "npm run build:js -- --watch",
|
23
23
|
"defs": "tsc --declaration --outDir dist/ --emitDeclarationOnly",
|
24
|
-
"pack:ci": "npm pack --pack-destination ../../
|
24
|
+
"pack:ci": "npm pack --pack-destination ../../storybook/storybook-static/static",
|
25
25
|
"prepublish": "npm run build",
|
26
26
|
"test": "jest",
|
27
27
|
"test:watch": "npm run test -- --watchAll",
|
@@ -34,10 +34,10 @@
|
|
34
34
|
],
|
35
35
|
"types": "dist/index.d.ts",
|
36
36
|
"dependencies": {
|
37
|
-
"@synerise/ds-button": "^0.
|
38
|
-
"@synerise/ds-icon": "^0.
|
39
|
-
"@synerise/ds-unordered-list": "^0.
|
40
|
-
"@synerise/ds-utils": "^0.
|
37
|
+
"@synerise/ds-button": "^1.0.0",
|
38
|
+
"@synerise/ds-icon": "^1.0.0",
|
39
|
+
"@synerise/ds-unordered-list": "^1.0.0",
|
40
|
+
"@synerise/ds-utils": "^1.0.0",
|
41
41
|
"animate.css": "^4.1.1"
|
42
42
|
},
|
43
43
|
"peerDependencies": {
|
@@ -46,5 +46,5 @@
|
|
46
46
|
"react": ">=16.9.0 <= 18.3.1",
|
47
47
|
"styled-components": "^5.3.3"
|
48
48
|
},
|
49
|
-
"gitHead": "
|
49
|
+
"gitHead": "e4c3690238a44b584b9ea41e4aa52b1eec42174b"
|
50
50
|
}
|