@snack-uikit/alert 0.13.3-preview-969acefa.0 → 0.13.3
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,17 @@
|
|
|
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.13.3 (2024-09-17)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* **PDS-759:** fix title size in M alert ([58397d7](https://github.com/cloud-ru-tech/snack-uikit/commit/58397d797ddfe48e1d72e0eee83dcf32b2176368))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
6
17
|
## 0.13.2 (2024-09-06)
|
|
7
18
|
|
|
8
19
|
### Only dependencies have been changed
|
|
@@ -27,5 +27,5 @@ export function Alert(_a) {
|
|
|
27
27
|
var { icon = true, title, truncate, link, description, onClose, appearance = APPEARANCE.Neutral, className, actions, outline, size = 'm' } = _a, rest = __rest(_a, ["icon", "title", "truncate", "link", "description", "onClose", "appearance", "className", "actions", "outline", "size"]);
|
|
28
28
|
return (_jsxs("div", Object.assign({ className: cn(styles.alert, {
|
|
29
29
|
[styles.alertOutline]: outline,
|
|
30
|
-
}, className) }, extractSupportProps(rest), { "data-color": APPEARANCE_TO_COLOR_MAP[appearance], "data-size": size, children: [_jsxs("div", { className: styles.body, "data-size": size, children: [icon && (_jsx("div", { className: styles.icon, "data-color": APPEARANCE_TO_COLOR_MAP[appearance], "data-test-id": 'alert__icon', "data-size": size, children: getIcon(appearance, size === 's' ? 16 : 24) })), _jsxs("div", { className: styles.contentLayout, children: [title && (_jsx(TruncateString, { text: title, maxLines: (_b = truncate === null || truncate === void 0 ? void 0 : truncate.title) !== null && _b !== void 0 ? _b : 1, className: styles.title, "data-test-id": 'alert__title', "data-size": size })), _jsx("span", { "data-test-id": 'alert__description', className: styles.description, "data-size": size, children: description }), link && (_jsx("span", { children: _jsx(Link, Object.assign({}, link, { appearance: APPEARANCE_TO_LINK_COLOR_MAP[appearance], textMode: 'default', size: size, "data-test-id": 'alert__link' })) }))] }), onClose && (_jsx(AlertButton, { onClick: onClose, appearance: APPEARANCE_TO_COLOR_MAP[appearance], icon: _jsx(CrossSVG, {}), variant: 'simple', dataTestId: 'alert__close-button' }))] }), actions && (_jsxs("div", { className: styles.footer, "data-size": size, children: [actions.primary && (_jsx(AlertButton, Object.assign({}, actions.primary, { appearance: APPEARANCE_TO_COLOR_MAP[appearance], variant: 'simple', size: size }))), (actions === null || actions === void 0 ? void 0 : actions.secondary) && (_jsx(AlertButton, Object.assign({}, actions.secondary, { appearance: APPEARANCE_TO_COLOR_MAP[appearance], variant: 'simple', size: size })))] }))] })));
|
|
30
|
+
}, className) }, extractSupportProps(rest), { "data-color": APPEARANCE_TO_COLOR_MAP[appearance], "data-size": size, children: [_jsxs("div", { className: styles.body, "data-size": size, children: [icon && (_jsx("div", { className: styles.icon, "data-color": APPEARANCE_TO_COLOR_MAP[appearance], "data-test-id": 'alert__icon', "data-size": size, children: getIcon(appearance, size === 's' ? 16 : 24) })), _jsxs("div", { className: styles.contentLayout, "data-size": size, children: [title && (_jsx(TruncateString, { text: title, maxLines: (_b = truncate === null || truncate === void 0 ? void 0 : truncate.title) !== null && _b !== void 0 ? _b : 1, className: styles.title, "data-test-id": 'alert__title', "data-size": size })), _jsx("span", { "data-test-id": 'alert__description', className: styles.description, "data-size": size, children: description }), link && (_jsx("span", { children: _jsx(Link, Object.assign({}, link, { appearance: APPEARANCE_TO_LINK_COLOR_MAP[appearance], textMode: 'default', size: size, "data-test-id": 'alert__link' })) }))] }), onClose && (_jsx(AlertButton, { onClick: onClose, appearance: APPEARANCE_TO_COLOR_MAP[appearance], icon: _jsx(CrossSVG, {}), variant: 'simple', dataTestId: 'alert__close-button' }))] }), actions && (_jsxs("div", { className: styles.footer, "data-size": size, children: [actions.primary && (_jsx(AlertButton, Object.assign({}, actions.primary, { appearance: APPEARANCE_TO_COLOR_MAP[appearance], variant: 'simple', size: size }))), (actions === null || actions === void 0 ? void 0 : actions.secondary) && (_jsx(AlertButton, Object.assign({}, actions.secondary, { appearance: APPEARANCE_TO_COLOR_MAP[appearance], variant: 'simple', size: size })))] }))] })));
|
|
31
31
|
}
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
box-sizing:border-box;
|
|
10
10
|
}
|
|
11
11
|
.alertTop[data-color=invert-neutral]{
|
|
12
|
-
background-color:var(--sys-invert-neutral-background, #
|
|
12
|
+
background-color:var(--sys-invert-neutral-background, #30303c);
|
|
13
13
|
}
|
|
14
14
|
.alertTop[data-color=primary]{
|
|
15
15
|
background-color:var(--sys-primary-accent-default, #794ed3);
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
color:var(--sys-red-on-accent, #fffbf9);
|
|
43
43
|
}
|
|
44
44
|
.icon[data-color=yellow]{
|
|
45
|
-
color:var(--sys-yellow-on-accent, #
|
|
45
|
+
color:var(--sys-yellow-on-accent, #583f1f);
|
|
46
46
|
}
|
|
47
47
|
.icon[data-color=green]{
|
|
48
48
|
color:var(--sys-green-on-accent, #fcfefa);
|
|
@@ -73,7 +73,7 @@
|
|
|
73
73
|
color:var(--sys-red-on-accent, #fffbf9);
|
|
74
74
|
}
|
|
75
75
|
.title[data-color=yellow]{
|
|
76
|
-
color:var(--sys-yellow-on-accent, #
|
|
76
|
+
color:var(--sys-yellow-on-accent, #583f1f);
|
|
77
77
|
}
|
|
78
78
|
.title[data-color=green]{
|
|
79
79
|
color:var(--sys-green-on-accent, #fcfefa);
|
|
@@ -101,7 +101,7 @@
|
|
|
101
101
|
color:var(--sys-red-on-accent, #fffbf9);
|
|
102
102
|
}
|
|
103
103
|
.description[data-color=yellow]{
|
|
104
|
-
color:var(--sys-yellow-on-accent, #
|
|
104
|
+
color:var(--sys-yellow-on-accent, #583f1f);
|
|
105
105
|
}
|
|
106
106
|
.description[data-color=green]{
|
|
107
107
|
color:var(--sys-green-on-accent, #fcfefa);
|
|
@@ -65,7 +65,7 @@
|
|
|
65
65
|
border-radius:var(--radius-alert-button, 8px);
|
|
66
66
|
}
|
|
67
67
|
.alertButton[data-variant=simple]:focus-visible{
|
|
68
|
-
outline-color:var(--sys-available-complementary, #
|
|
68
|
+
outline-color:var(--sys-available-complementary, #1c1c24);
|
|
69
69
|
outline-offset:var(--spacing-state-focus-offset, 2px);
|
|
70
70
|
}
|
|
71
71
|
.alertButton[data-variant=simple][data-appearance=neutral]{
|
|
@@ -161,7 +161,7 @@
|
|
|
161
161
|
color:var(--sys-red-on-accent, #fffbf9);
|
|
162
162
|
}
|
|
163
163
|
.alertButton[data-variant=tonal][data-appearance=yellow]{
|
|
164
|
-
color:var(--sys-yellow-on-accent, #
|
|
164
|
+
color:var(--sys-yellow-on-accent, #583f1f);
|
|
165
165
|
}
|
|
166
166
|
.alertButton[data-variant=tonal][data-appearance=green]{
|
|
167
167
|
color:var(--sys-green-on-accent, #fcfefa);
|
package/package.json
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
"access": "public"
|
|
5
5
|
},
|
|
6
6
|
"title": "Alert",
|
|
7
|
-
"version": "0.13.3
|
|
7
|
+
"version": "0.13.3",
|
|
8
8
|
"sideEffects": [
|
|
9
9
|
"*.css",
|
|
10
10
|
"*.woff",
|
|
@@ -39,5 +39,5 @@
|
|
|
39
39
|
"@snack-uikit/utils": "3.3.0",
|
|
40
40
|
"classnames": "2.3.2"
|
|
41
41
|
},
|
|
42
|
-
"gitHead": "
|
|
42
|
+
"gitHead": "b5dbc02c777773140b597e9c3268a9424f8608d8"
|
|
43
43
|
}
|