@itcase/ui 1.8.146 → 1.8.147

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.
Files changed (15) hide show
  1. package/dist/cjs/components/Notification.js +46 -18
  2. package/dist/components/Notification.js +46 -18
  3. package/dist/css/components/Notification/Notification.css +6 -6
  4. package/dist/css/components/Notification/css/__item/notification__item_float.css +1 -2
  5. package/dist/css/components/Notification/css/__item/notification__item_global.css +1 -2
  6. package/dist/css/components/Notification/css/__item/notification__item_size.css +9 -0
  7. package/dist/css/components/Notification/css/__item/notification__item_toast.css +1 -2
  8. package/dist/types/components/Notification/appearance/notificationDefault.d.ts +0 -3
  9. package/dist/types/components/Notification/appearance/notificationError.d.ts +0 -2
  10. package/dist/types/components/Notification/appearance/notificationInfo.d.ts +0 -3
  11. package/dist/types/components/Notification/appearance/notificationShape.d.ts +3 -0
  12. package/dist/types/components/Notification/appearance/notificationSize.d.ts +16 -1
  13. package/dist/types/components/Notification/appearance/notificationSuccess.d.ts +0 -3
  14. package/dist/types/components/Notification/appearance/notificationWarning.d.ts +0 -2
  15. package/package.json +1 -1
package/dist/cjs/components/Notification.js CHANGED
@@ -2,6 +2,7 @@
2
2
 
3
3
  var jsxRuntime = require('react/jsx-runtime');
4
4
  var clsx = require('clsx');
5
+ var Loader = require('../../Loader_cjs_CRiUlTC3.js');
5
6
  var useAppearanceConfig = require('../hooks/useAppearanceConfig/useAppearanceConfig.js');
6
7
  var useDevicePropsGenerator = require('../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js');
7
8
  var useStyles = require('../hooks/useStyles/useStyles.js');
@@ -24,7 +25,6 @@ require('react-responsive');
24
25
  require('../utils/setViewportProperty.js');
25
26
  require('lodash/maxBy');
26
27
  require('../../Link_cjs_qKXVfU8e.js');
27
- require('../../Loader_cjs_CRiUlTC3.js');
28
28
  require('react-inlinesvg');
29
29
  require('../hoc/urlWithAssetPrefix.js');
30
30
  require('../context/UrlAssetPrefix.js');
@@ -34,12 +34,9 @@ const notificationAppearanceDefault = {
34
34
  fill: 'surfacePrimary',
35
35
  fillHover: 'surfacePrimaryHover',
36
36
  titleTextColor: 'surfaceTextPrimary',
37
- titleTextSize: 'xxl',
38
37
  descTextColor: 'surfaceTextPrimary',
39
- descTextSize: 'm',
40
38
  borderColor: 'surfaceBorderPrimary',
41
39
  textColor: 'surfaceTextPrimary',
42
- iconSize: 20,
43
40
  closeIcon: _default.icons20.Action.Close,
44
41
  closeIconFillIcon: 'surfaceItemPrimary',
45
42
  },
@@ -50,9 +47,7 @@ const notificationAppearanceError = {
50
47
  fill: 'errorPrimary',
51
48
  fillHover: 'errorPrimaryHover',
52
49
  titleTextColor: 'errorTextPrimary',
53
- titleTextSize: 'l',
54
50
  descTextColor: 'errorTextPrimary',
55
- descTextSize: 'm',
56
51
  borderColor: 'errorBorderPrimary',
57
52
  textColor: 'errorTextPrimary',
58
53
  buttonAppearance: 'surfacePrimary sizeXXL solid rounded',
@@ -66,19 +61,56 @@ const notificationAppearanceInfo = {
66
61
  fill: 'infoPrimary',
67
62
  fillHover: 'infoPrimaryHover',
68
63
  titleTextColor: 'infoTextPrimary',
69
- titleTextSize: 'l',
70
64
  descTextColor: 'infoTextPrimary',
71
- descTextSize: 'm',
72
65
  borderColor: 'infoBorderPrimary',
73
66
  textColor: 'infoTextPrimary',
74
67
  buttonAppearance: 'surfacePrimary sizeXXL solid rounded',
75
- iconSize: 20,
76
68
  closeIcon: _default.icons20.Action.Close,
77
69
  closeIconAppearance: 'infoPrimary size_20_20 solid circular',
78
70
  },
79
71
  };
80
72
 
81
- const notificationAppearanceSize = {};
73
+ const notificationAppearanceShape = {
74
+ circular: {
75
+ shape: 'circular',
76
+ },
77
+ rounded: {
78
+ shape: 'rounded',
79
+ },
80
+ roundedXL: {
81
+ shape: 'rounded',
82
+ shapeStrength: '2m',
83
+ },
84
+ roundedL: {
85
+ shape: 'rounded',
86
+ shapeStrength: '1_5m',
87
+ },
88
+ roundedM: {
89
+ shape: 'rounded',
90
+ shapeStrength: '1m',
91
+ },
92
+ roundedS: {
93
+ shape: 'rounded',
94
+ shapeStrength: '0_5m',
95
+ },
96
+ };
97
+
98
+ const notificationAppearanceSize = {
99
+ sizeM: {
100
+ size: 'm',
101
+ titleTextSize: 'xxl',
102
+ descTextSize: 'm',
103
+ iconSize: 24,
104
+ loaderAppearanceSize: 'sizeS',
105
+ },
106
+ sizeS: {
107
+ size: 'm',
108
+ titleTextSize: 'xl',
109
+ descTextSize: 'm',
110
+ iconSize: 24,
111
+ loaderAppearanceSize: 'sizeS',
112
+ },
113
+ };
82
114
 
83
115
  const notificationAppearanceStyle = {
84
116
  solid: {
@@ -99,13 +131,10 @@ const notificationAppearanceSuccess = {
99
131
  fill: 'successPrimary',
100
132
  fillHover: 'successPrimaryHover',
101
133
  titleTextColor: 'successTextPrimary',
102
- titleTextSize: 'l',
103
134
  descTextColor: 'successTextPrimary',
104
- descTextSize: 'm',
105
135
  borderColor: 'successBorderPrimary',
106
136
  textColor: 'successTextPrimary',
107
137
  buttonAppearance: 'surfacePrimary sizeXXL solid rounded',
108
- iconSize: 20,
109
138
  closeIcon: _default.icons20.Action.Close,
110
139
  closeIconAppearance: 'successPrimary size_20_20 solid circular',
111
140
  },
@@ -116,9 +145,7 @@ const notificationAppearanceWarning = {
116
145
  fill: 'warningPrimary',
117
146
  fillHover: 'warningPrimaryHover',
118
147
  titleTextColor: 'warningTextPrimary',
119
- titleTextSize: 'l',
120
148
  descTextColor: 'warningTextPrimary',
121
- descTextSize: 'm',
122
149
  borderColor: 'surfaceBorderPrimary',
123
150
  textColor: 'warningTextPrimary',
124
151
  buttonAppearance: 'surfacePrimary sizeXXL solid rounded',
@@ -130,6 +157,7 @@ const notificationAppearanceWarning = {
130
157
 
131
158
  const notificationAppearance = {
132
159
  ...notificationAppearanceDefault,
160
+ ...notificationAppearanceShape,
133
161
  ...notificationAppearanceSize,
134
162
  ...notificationAppearanceStyle,
135
163
  ...notificationAppearanceError,
@@ -145,13 +173,13 @@ const notificationConfig = {
145
173
  },
146
174
  };
147
175
  function Notification(props) {
148
- const { id, appearance, className, dataTestId, dataTour, title, text, float, global, toast, before, after, isSkeleton, onClickButton, onClickClose, } = props;
176
+ const { id, appearance, className, dataTestId, dataTour, title, text, float, global, toast, before, after, isSkeleton, isLoading, onClickButton, onClickClose, } = props;
149
177
  const appearanceConfig = useAppearanceConfig.useAppearanceConfig(appearance, notificationConfig);
150
178
  const propsGenerator = useDevicePropsGenerator.useDevicePropsGenerator(props, appearanceConfig);
151
- const { fillClass, fillHoverClass, titleTextColor, titleTextSize, descTextColor, descTextSize, buttonAppearance, buttonLabel, elevationClass, widthClass, closeIcon, closeIconAppearance, closeIconSrc, } = propsGenerator;
179
+ const { fillClass, fillHoverClass, titleTextColor, titleTextSize, descTextColor, descTextSize, buttonAppearance, buttonLabel, elevationClass, loaderAppearance, loaderAppearanceSize, loaderFill, loaderItemFill, loaderSize, loaderType, shapeClass, shapeStrengthClass, sizeClass, widthClass, closeIcon, closeIconAppearance, closeIconSrc, } = propsGenerator;
152
180
  // @ts-expect-error
153
181
  const { styles: notificationStyles } = useStyles.useStyles(props);
154
- return (jsxRuntime.jsxs("div", { className: clsx('notification__item', float && 'notification__item_float', toast && 'notification__item_toast', global && 'notification__item_global', widthClass && `width_${widthClass}`, elevationClass && `elevation_${elevationClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_${fillHoverClass}`, isSkeleton && `notification__item_skeleton`), "data-test-id": dataTestId, "data-tour": dataTour, style: notificationStyles, children: [before, jsxRuntime.jsxs("div", { className: clsx(className, 'notification__item-wrapper'), children: [title && (jsxRuntime.jsx(Text.Text, { className: "notification__item-title", size: titleTextSize, textColor: titleTextColor, children: title })), text && (jsxRuntime.jsx(Text.Text, { className: "notification__item-text", size: descTextSize, textColor: descTextColor, children: text })), onClickClose && (jsxRuntime.jsx(Icon.Icon, { appearance: closeIconAppearance, className: clsx('notification__item-close', 'cursor_type_pointer'), imageSrc: closeIconSrc, SvgImage: closeIcon, onClick: () => onClickClose && onClickClose(id) })), (onClickButton || buttonLabel) && (jsxRuntime.jsx(Button.Button, { appearance: buttonAppearance, className: "notification__item-button", width: "fill", label: buttonLabel, onClick: onClickButton }))] }), after] }));
182
+ return (jsxRuntime.jsxs("div", { className: clsx('notification__item', float && 'notification__item_float', toast && 'notification__item_toast', global && 'notification__item_global', widthClass && `width_${widthClass}`, elevationClass && `elevation_${elevationClass}`, fillClass && `fill_${fillClass}`, sizeClass && `notification__item_size_${sizeClass}`, fillHoverClass && `fill_${fillHoverClass}`, isSkeleton && `notification__item_skeleton`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`), "data-test-id": dataTestId, "data-tour": dataTour, style: notificationStyles, children: [before, jsxRuntime.jsxs("div", { className: clsx(className, 'notification__item-wrapper'), children: [title && (jsxRuntime.jsx(Text.Text, { className: "notification__item-title", size: titleTextSize, textColor: titleTextColor, children: title })), text && (jsxRuntime.jsx(Text.Text, { className: "notification__item-text", size: descTextSize, textColor: descTextColor, children: text })), isLoading && (jsxRuntime.jsx(Loader.Loader, { appearance: `${loaderAppearance} ${loaderAppearanceSize}`, className: clsx(className, 'button__loader'), type: loaderType, size: loaderSize, fill: loaderFill, itemFill: loaderItemFill })), onClickClose && (jsxRuntime.jsx(Icon.Icon, { appearance: closeIconAppearance, className: clsx('notification__item-close', 'cursor_type_pointer'), imageSrc: closeIconSrc, SvgImage: closeIcon, onClick: () => onClickClose && onClickClose(id) })), (onClickButton || buttonLabel) && (jsxRuntime.jsx(Button.Button, { appearance: buttonAppearance, className: "notification__item-button", width: "fill", label: buttonLabel, onClick: onClickButton }))] }), after] }));
155
183
  }
156
184
 
157
185
  function NotificationWrapper(props) {
package/dist/components/Notification.js CHANGED
@@ -1,5 +1,6 @@
1
1
  import { jsxs, jsx } from 'react/jsx-runtime';
2
2
  import clsx from 'clsx';
3
+ import { L as Loader } from '../Loader_es_Dq2-7sn2.js';
3
4
  import { useAppearanceConfig } from '../hooks/useAppearanceConfig/useAppearanceConfig.js';
4
5
  import { useDevicePropsGenerator } from '../hooks/useDevicePropsGenerator/useDevicePropsGenerator.js';
5
6
  import { useStyles } from '../hooks/useStyles/useStyles.js';
@@ -22,7 +23,6 @@ import 'react-responsive';
22
23
  import '../utils/setViewportProperty.js';
23
24
  import 'lodash/maxBy';
24
25
  import '../Link_es_P2b6ya7P.js';
25
- import '../Loader_es_Dq2-7sn2.js';
26
26
  import 'react-inlinesvg';
27
27
  import '../hoc/urlWithAssetPrefix.js';
28
28
  import '../context/UrlAssetPrefix.js';
@@ -32,12 +32,9 @@ const notificationAppearanceDefault = {
32
32
  fill: 'surfacePrimary',
33
33
  fillHover: 'surfacePrimaryHover',
34
34
  titleTextColor: 'surfaceTextPrimary',
35
- titleTextSize: 'xxl',
36
35
  descTextColor: 'surfaceTextPrimary',
37
- descTextSize: 'm',
38
36
  borderColor: 'surfaceBorderPrimary',
39
37
  textColor: 'surfaceTextPrimary',
40
- iconSize: 20,
41
38
  closeIcon: icons20.Action.Close,
42
39
  closeIconFillIcon: 'surfaceItemPrimary',
43
40
  },
@@ -48,9 +45,7 @@ const notificationAppearanceError = {
48
45
  fill: 'errorPrimary',
49
46
  fillHover: 'errorPrimaryHover',
50
47
  titleTextColor: 'errorTextPrimary',
51
- titleTextSize: 'l',
52
48
  descTextColor: 'errorTextPrimary',
53
- descTextSize: 'm',
54
49
  borderColor: 'errorBorderPrimary',
55
50
  textColor: 'errorTextPrimary',
56
51
  buttonAppearance: 'surfacePrimary sizeXXL solid rounded',
@@ -64,19 +59,56 @@ const notificationAppearanceInfo = {
64
59
  fill: 'infoPrimary',
65
60
  fillHover: 'infoPrimaryHover',
66
61
  titleTextColor: 'infoTextPrimary',
67
- titleTextSize: 'l',
68
62
  descTextColor: 'infoTextPrimary',
69
- descTextSize: 'm',
70
63
  borderColor: 'infoBorderPrimary',
71
64
  textColor: 'infoTextPrimary',
72
65
  buttonAppearance: 'surfacePrimary sizeXXL solid rounded',
73
- iconSize: 20,
74
66
  closeIcon: icons20.Action.Close,
75
67
  closeIconAppearance: 'infoPrimary size_20_20 solid circular',
76
68
  },
77
69
  };
78
70
 
79
- const notificationAppearanceSize = {};
71
+ const notificationAppearanceShape = {
72
+ circular: {
73
+ shape: 'circular',
74
+ },
75
+ rounded: {
76
+ shape: 'rounded',
77
+ },
78
+ roundedXL: {
79
+ shape: 'rounded',
80
+ shapeStrength: '2m',
81
+ },
82
+ roundedL: {
83
+ shape: 'rounded',
84
+ shapeStrength: '1_5m',
85
+ },
86
+ roundedM: {
87
+ shape: 'rounded',
88
+ shapeStrength: '1m',
89
+ },
90
+ roundedS: {
91
+ shape: 'rounded',
92
+ shapeStrength: '0_5m',
93
+ },
94
+ };
95
+
96
+ const notificationAppearanceSize = {
97
+ sizeM: {
98
+ size: 'm',
99
+ titleTextSize: 'xxl',
100
+ descTextSize: 'm',
101
+ iconSize: 24,
102
+ loaderAppearanceSize: 'sizeS',
103
+ },
104
+ sizeS: {
105
+ size: 'm',
106
+ titleTextSize: 'xl',
107
+ descTextSize: 'm',
108
+ iconSize: 24,
109
+ loaderAppearanceSize: 'sizeS',
110
+ },
111
+ };
80
112
 
81
113
  const notificationAppearanceStyle = {
82
114
  solid: {
@@ -97,13 +129,10 @@ const notificationAppearanceSuccess = {
97
129
  fill: 'successPrimary',
98
130
  fillHover: 'successPrimaryHover',
99
131
  titleTextColor: 'successTextPrimary',
100
- titleTextSize: 'l',
101
132
  descTextColor: 'successTextPrimary',
102
- descTextSize: 'm',
103
133
  borderColor: 'successBorderPrimary',
104
134
  textColor: 'successTextPrimary',
105
135
  buttonAppearance: 'surfacePrimary sizeXXL solid rounded',
106
- iconSize: 20,
107
136
  closeIcon: icons20.Action.Close,
108
137
  closeIconAppearance: 'successPrimary size_20_20 solid circular',
109
138
  },
@@ -114,9 +143,7 @@ const notificationAppearanceWarning = {
114
143
  fill: 'warningPrimary',
115
144
  fillHover: 'warningPrimaryHover',
116
145
  titleTextColor: 'warningTextPrimary',
117
- titleTextSize: 'l',
118
146
  descTextColor: 'warningTextPrimary',
119
- descTextSize: 'm',
120
147
  borderColor: 'surfaceBorderPrimary',
121
148
  textColor: 'warningTextPrimary',
122
149
  buttonAppearance: 'surfacePrimary sizeXXL solid rounded',
@@ -128,6 +155,7 @@ const notificationAppearanceWarning = {
128
155
 
129
156
  const notificationAppearance = {
130
157
  ...notificationAppearanceDefault,
158
+ ...notificationAppearanceShape,
131
159
  ...notificationAppearanceSize,
132
160
  ...notificationAppearanceStyle,
133
161
  ...notificationAppearanceError,
@@ -143,13 +171,13 @@ const notificationConfig = {
143
171
  },
144
172
  };
145
173
  function Notification(props) {
146
- const { id, appearance, className, dataTestId, dataTour, title, text, float, global, toast, before, after, isSkeleton, onClickButton, onClickClose, } = props;
174
+ const { id, appearance, className, dataTestId, dataTour, title, text, float, global, toast, before, after, isSkeleton, isLoading, onClickButton, onClickClose, } = props;
147
175
  const appearanceConfig = useAppearanceConfig(appearance, notificationConfig);
148
176
  const propsGenerator = useDevicePropsGenerator(props, appearanceConfig);
149
- const { fillClass, fillHoverClass, titleTextColor, titleTextSize, descTextColor, descTextSize, buttonAppearance, buttonLabel, elevationClass, widthClass, closeIcon, closeIconAppearance, closeIconSrc, } = propsGenerator;
177
+ const { fillClass, fillHoverClass, titleTextColor, titleTextSize, descTextColor, descTextSize, buttonAppearance, buttonLabel, elevationClass, loaderAppearance, loaderAppearanceSize, loaderFill, loaderItemFill, loaderSize, loaderType, shapeClass, shapeStrengthClass, sizeClass, widthClass, closeIcon, closeIconAppearance, closeIconSrc, } = propsGenerator;
150
178
  // @ts-expect-error
151
179
  const { styles: notificationStyles } = useStyles(props);
152
- return (jsxs("div", { className: clsx('notification__item', float && 'notification__item_float', toast && 'notification__item_toast', global && 'notification__item_global', widthClass && `width_${widthClass}`, elevationClass && `elevation_${elevationClass}`, fillClass && `fill_${fillClass}`, fillHoverClass && `fill_${fillHoverClass}`, isSkeleton && `notification__item_skeleton`), "data-test-id": dataTestId, "data-tour": dataTour, style: notificationStyles, children: [before, jsxs("div", { className: clsx(className, 'notification__item-wrapper'), children: [title && (jsx(Text, { className: "notification__item-title", size: titleTextSize, textColor: titleTextColor, children: title })), text && (jsx(Text, { className: "notification__item-text", size: descTextSize, textColor: descTextColor, children: text })), onClickClose && (jsx(Icon, { appearance: closeIconAppearance, className: clsx('notification__item-close', 'cursor_type_pointer'), imageSrc: closeIconSrc, SvgImage: closeIcon, onClick: () => onClickClose && onClickClose(id) })), (onClickButton || buttonLabel) && (jsx(Button, { appearance: buttonAppearance, className: "notification__item-button", width: "fill", label: buttonLabel, onClick: onClickButton }))] }), after] }));
180
+ return (jsxs("div", { className: clsx('notification__item', float && 'notification__item_float', toast && 'notification__item_toast', global && 'notification__item_global', widthClass && `width_${widthClass}`, elevationClass && `elevation_${elevationClass}`, fillClass && `fill_${fillClass}`, sizeClass && `notification__item_size_${sizeClass}`, fillHoverClass && `fill_${fillHoverClass}`, isSkeleton && `notification__item_skeleton`, shapeClass && `shape_${shapeClass}`, shapeStrengthClass && `shape-strength_${shapeStrengthClass}`), "data-test-id": dataTestId, "data-tour": dataTour, style: notificationStyles, children: [before, jsxs("div", { className: clsx(className, 'notification__item-wrapper'), children: [title && (jsx(Text, { className: "notification__item-title", size: titleTextSize, textColor: titleTextColor, children: title })), text && (jsx(Text, { className: "notification__item-text", size: descTextSize, textColor: descTextColor, children: text })), isLoading && (jsx(Loader, { appearance: `${loaderAppearance} ${loaderAppearanceSize}`, className: clsx(className, 'button__loader'), type: loaderType, size: loaderSize, fill: loaderFill, itemFill: loaderItemFill })), onClickClose && (jsx(Icon, { appearance: closeIconAppearance, className: clsx('notification__item-close', 'cursor_type_pointer'), imageSrc: closeIconSrc, SvgImage: closeIcon, onClick: () => onClickClose && onClickClose(id) })), (onClickButton || buttonLabel) && (jsx(Button, { appearance: buttonAppearance, className: "notification__item-button", width: "fill", label: buttonLabel, onClick: onClickButton }))] }), after] }));
153
181
  }
154
182
 
155
183
  function NotificationWrapper(props) {
package/dist/css/components/Notification/Notification.css CHANGED
@@ -34,8 +34,7 @@
34
34
  }
35
35
  }
36
36
  .notification__item {
37
- &_float {
38
- @mixin elevation-8;
37
+ &&_float {
39
38
  ^&-wrapper {
40
39
  padding: 12px;
41
40
  display: flex;
@@ -44,9 +43,8 @@
44
43
  }
45
44
  }
46
45
  .notification__item {
47
- &_toast {
46
+ &&_toast {
48
47
  width: 100%;
49
- @mixin elevation-8;
50
48
  ^&-wrapper {
51
49
  display: flex;
52
50
  flex-direction: column;
@@ -54,9 +52,8 @@
54
52
  }
55
53
  }
56
54
  .notification__item {
57
- &_global {
55
+ &&_global {
58
56
  width: 100%;
59
- @mixin elevation-8;
60
57
  ^&-wrapper {
61
58
  display: flex;
62
59
  flex-direction: column;
@@ -118,4 +115,7 @@
118
115
  --notification-item-set-top-padding: 10px;
119
116
  --notification-item-set-toast-border-radius: 0;
120
117
  --notification-item-set-toast-padding: 0;
118
+
119
+ --notification-item-m-padding: 12px;
120
+ --notification-item-s-padding: 12px;
121
121
  }
package/dist/css/components/Notification/css/__item/notification__item_float.css CHANGED
@@ -1,6 +1,5 @@
1
1
  .notification__item {
2
- &_float {
3
- @mixin elevation-8;
2
+ &&_float {
4
3
  ^&-wrapper {
5
4
  padding: 12px;
6
5
  display: flex;
package/dist/css/components/Notification/css/__item/notification__item_global.css CHANGED
@@ -1,7 +1,6 @@
1
1
  .notification__item {
2
- &_global {
2
+ &&_global {
3
3
  width: 100%;
4
- @mixin elevation-8;
5
4
  ^&-wrapper {
6
5
  display: flex;
7
6
  flex-direction: column;
package/dist/css/components/Notification/css/__item/notification__item_size.css ADDED
@@ -0,0 +1,9 @@
1
+ .notification__item {
2
+ @each $size in xxl, xl, l, m, s, xs, xxs {
3
+ &_size_$(size) {
4
+ & .notification__item-wrapper {
5
+ padding: var(--notification-item-$(size)-padding);
6
+ }
7
+ }
8
+ }
9
+ }
package/dist/css/components/Notification/css/__item/notification__item_toast.css CHANGED
@@ -1,7 +1,6 @@
1
1
  .notification__item {
2
- &_toast {
2
+ &&_toast {
3
3
  width: 100%;
4
- @mixin elevation-8;
5
4
  ^&-wrapper {
6
5
  display: flex;
7
6
  flex-direction: column;
package/dist/types/components/Notification/appearance/notificationDefault.d.ts CHANGED
@@ -3,12 +3,9 @@ declare const notificationAppearanceDefault: {
3
3
  fill: string;
4
4
  fillHover: string;
5
5
  titleTextColor: string;
6
- titleTextSize: string;
7
6
  descTextColor: string;
8
- descTextSize: string;
9
7
  borderColor: string;
10
8
  textColor: string;
11
- iconSize: number;
12
9
  closeIcon: string;
13
10
  closeIconFillIcon: string;
14
11
  };
package/dist/types/components/Notification/appearance/notificationError.d.ts CHANGED
@@ -3,9 +3,7 @@ declare const notificationAppearanceError: {
3
3
  fill: string;
4
4
  fillHover: string;
5
5
  titleTextColor: string;
6
- titleTextSize: string;
7
6
  descTextColor: string;
8
- descTextSize: string;
9
7
  borderColor: string;
10
8
  textColor: string;
11
9
  buttonAppearance: string;
package/dist/types/components/Notification/appearance/notificationInfo.d.ts CHANGED
@@ -3,13 +3,10 @@ declare const notificationAppearanceInfo: {
3
3
  fill: string;
4
4
  fillHover: string;
5
5
  titleTextColor: string;
6
- titleTextSize: string;
7
6
  descTextColor: string;
8
- descTextSize: string;
9
7
  borderColor: string;
10
8
  textColor: string;
11
9
  buttonAppearance: string;
12
- iconSize: number;
13
10
  closeIcon: string;
14
11
  closeIconAppearance: string;
15
12
  };
package/dist/types/components/Notification/appearance/notificationShape.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ import { NotificationAppearance } from '../Notification.interface';
2
+ declare const notificationAppearanceShape: NotificationAppearance;
3
+ export { notificationAppearanceShape };
package/dist/types/components/Notification/appearance/notificationSize.d.ts CHANGED
@@ -1,2 +1,17 @@
1
- declare const notificationAppearanceSize: {};
1
+ declare const notificationAppearanceSize: {
2
+ sizeM: {
3
+ size: string;
4
+ titleTextSize: string;
5
+ descTextSize: string;
6
+ iconSize: number;
7
+ loaderAppearanceSize: string;
8
+ };
9
+ sizeS: {
10
+ size: string;
11
+ titleTextSize: string;
12
+ descTextSize: string;
13
+ iconSize: number;
14
+ loaderAppearanceSize: string;
15
+ };
16
+ };
2
17
  export { notificationAppearanceSize };
package/dist/types/components/Notification/appearance/notificationSuccess.d.ts CHANGED
@@ -3,13 +3,10 @@ declare const notificationAppearanceSuccess: {
3
3
  fill: string;
4
4
  fillHover: string;
5
5
  titleTextColor: string;
6
- titleTextSize: string;
7
6
  descTextColor: string;
8
- descTextSize: string;
9
7
  borderColor: string;
10
8
  textColor: string;
11
9
  buttonAppearance: string;
12
- iconSize: number;
13
10
  closeIcon: string;
14
11
  closeIconAppearance: string;
15
12
  };
package/dist/types/components/Notification/appearance/notificationWarning.d.ts CHANGED
@@ -3,9 +3,7 @@ declare const notificationAppearanceWarning: {
3
3
  fill: string;
4
4
  fillHover: string;
5
5
  titleTextColor: string;
6
- titleTextSize: string;
7
6
  descTextColor: string;
8
- descTextSize: string;
9
7
  borderColor: string;
10
8
  textColor: string;
11
9
  buttonAppearance: string;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@itcase/ui",
3
- "version": "1.8.146",
3
+ "version": "1.8.147",
4
4
  "description": "UI components (Modal, Loader, Popup, etc)",
5
5
  "keywords": [
6
6
  "Modal",