@alfalab/core-components-notification 9.0.10 → 9.0.11

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.
@@ -1,15 +1,10 @@
1
1
  :root {
2
- --gap-s: 12px;
3
- --gap-m: 16px;
4
- --gap-xl: 24px;
5
- --gap-4xl: 48px;
6
- --gap-s-neg: -12px;
7
2
  --gap-0: 0px;
8
- --gap-12: var(--gap-s);
9
- --gap-16: var(--gap-m);
10
- --gap-24: var(--gap-xl);
11
- --gap-48: var(--gap-4xl);
12
- --gap-12-neg: var(--gap-s-neg);
3
+ --gap-12: 12px;
4
+ --gap-16: 16px;
5
+ --gap-24: 24px;
6
+ --gap-48: 48px;
7
+ --gap-12-neg: -12px;
13
8
  }
14
9
  :root {
15
10
  --notification-desktop-content-width: 278px;
package/esm/index.css CHANGED
@@ -1,20 +1,15 @@
1
1
  :root {
2
- --gap-s: 12px;
3
- --gap-m: 16px;
4
- --gap-xl: 24px;
5
- --gap-4xl: 48px;
6
- --gap-s-neg: -12px;
7
2
  --gap-0: 0px;
8
- --gap-12: var(--gap-s);
9
- --gap-16: var(--gap-m);
10
- --gap-24: var(--gap-xl);
11
- --gap-48: var(--gap-4xl);
12
- --gap-12-neg: var(--gap-s-neg);
3
+ --gap-12: 12px;
4
+ --gap-16: 16px;
5
+ --gap-24: 24px;
6
+ --gap-48: 48px;
7
+ --gap-12-neg: -12px;
13
8
  }
14
9
  :root {
15
10
  --notification-desktop-content-width: 278px;
16
11
  }
17
- .notification__notificationComponent_12wdc {
12
+ .notification__notificationComponent_12vzg {
18
13
  visibility: hidden;
19
14
  right: var(--gap-12);
20
15
  transform: translate(0, -500px);
@@ -27,42 +22,42 @@
27
22
  border-radius: var(--gap-16);
28
23
  }
29
24
  @media screen and (min-width: 600px) {
30
- .notification__notificationComponent_12wdc {
25
+ .notification__notificationComponent_12vzg {
31
26
  right: var(--gap-48);
32
27
  width: auto;
33
28
  transform: translate(calc(100% + var(--gap-48)), 0);
34
29
  }
35
30
  }
36
- .notification__notificationComponent_12wdc.notification__isVisible_12wdc {
31
+ .notification__notificationComponent_12vzg.notification__isVisible_12vzg {
37
32
  visibility: visible;
38
33
  transform: translate(0, 0);
39
34
  }
40
- .notification__notificationComponent_12wdc.notification__isClosing_12wdc {
35
+ .notification__notificationComponent_12vzg.notification__isClosing_12vzg {
41
36
  transition: transform 0.1s ease-out;
42
37
  transform: translate(100vw, 0);
43
38
  }
44
39
  @media screen and (min-width: 600px) {
45
- .notification__notificationComponent_12wdc.notification__isClosing_12wdc {
40
+ .notification__notificationComponent_12vzg.notification__isClosing_12vzg {
46
41
  transform: translate(calc(100% + var(--gap-48)), 0);
47
42
  }
48
43
  }
49
- .notification__notificationComponent_12wdc.notification__hasCloser_12wdc {
44
+ .notification__notificationComponent_12vzg.notification__hasCloser_12vzg {
50
45
  padding-right: 52px;
51
46
  }
52
- .notification__notificationComponent_12wdc.notification__notificationComponent_12wdc {
47
+ .notification__notificationComponent_12vzg.notification__notificationComponent_12vzg {
53
48
  position: fixed;
54
49
  }
55
50
  @media screen and (min-width: 600px) {
56
- .notification__toastContent_12wdc {
51
+ .notification__toastContent_12vzg {
57
52
  width: var(--notification-desktop-content-width);
58
53
  }
59
54
  }
60
- .notification__toastContent_12wdc {
55
+ .notification__toastContent_12vzg {
61
56
 
62
57
  box-sizing: border-box;
63
58
  gap: var(--gap-16);
64
59
  }
65
- .notification__actionSection_12wdc {
60
+ .notification__actionSection_12vzg {
66
61
  min-width: 104px;
67
62
  min-height: 48px;
68
63
  padding: 0;
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- var styles = {"notificationComponent":"notification__notificationComponent_12wdc","isVisible":"notification__isVisible_12wdc","isClosing":"notification__isClosing_12wdc","hasCloser":"notification__hasCloser_12wdc","toastContent":"notification__toastContent_12wdc","actionSection":"notification__actionSection_12wdc"};
3
+ var styles = {"notificationComponent":"notification__notificationComponent_12vzg","isVisible":"notification__isVisible_12vzg","isClosing":"notification__isClosing_12vzg","hasCloser":"notification__hasCloser_12vzg","toastContent":"notification__toastContent_12vzg","actionSection":"notification__actionSection_12vzg"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
package/index.css CHANGED
@@ -1,20 +1,15 @@
1
1
  :root {
2
- --gap-s: 12px;
3
- --gap-m: 16px;
4
- --gap-xl: 24px;
5
- --gap-4xl: 48px;
6
- --gap-s-neg: -12px;
7
2
  --gap-0: 0px;
8
- --gap-12: var(--gap-s);
9
- --gap-16: var(--gap-m);
10
- --gap-24: var(--gap-xl);
11
- --gap-48: var(--gap-4xl);
12
- --gap-12-neg: var(--gap-s-neg);
3
+ --gap-12: 12px;
4
+ --gap-16: 16px;
5
+ --gap-24: 24px;
6
+ --gap-48: 48px;
7
+ --gap-12-neg: -12px;
13
8
  }
14
9
  :root {
15
10
  --notification-desktop-content-width: 278px;
16
11
  }
17
- .notification__notificationComponent_12wdc {
12
+ .notification__notificationComponent_12vzg {
18
13
  visibility: hidden;
19
14
  right: var(--gap-12);
20
15
  transform: translate(0, -500px);
@@ -27,42 +22,42 @@
27
22
  border-radius: var(--gap-16);
28
23
  }
29
24
  @media screen and (min-width: 600px) {
30
- .notification__notificationComponent_12wdc {
25
+ .notification__notificationComponent_12vzg {
31
26
  right: var(--gap-48);
32
27
  width: auto;
33
28
  transform: translate(calc(100% + var(--gap-48)), 0);
34
29
  }
35
30
  }
36
- .notification__notificationComponent_12wdc.notification__isVisible_12wdc {
31
+ .notification__notificationComponent_12vzg.notification__isVisible_12vzg {
37
32
  visibility: visible;
38
33
  transform: translate(0, 0);
39
34
  }
40
- .notification__notificationComponent_12wdc.notification__isClosing_12wdc {
35
+ .notification__notificationComponent_12vzg.notification__isClosing_12vzg {
41
36
  transition: transform 0.1s ease-out;
42
37
  transform: translate(100vw, 0);
43
38
  }
44
39
  @media screen and (min-width: 600px) {
45
- .notification__notificationComponent_12wdc.notification__isClosing_12wdc {
40
+ .notification__notificationComponent_12vzg.notification__isClosing_12vzg {
46
41
  transform: translate(calc(100% + var(--gap-48)), 0);
47
42
  }
48
43
  }
49
- .notification__notificationComponent_12wdc.notification__hasCloser_12wdc {
44
+ .notification__notificationComponent_12vzg.notification__hasCloser_12vzg {
50
45
  padding-right: 52px;
51
46
  }
52
- .notification__notificationComponent_12wdc.notification__notificationComponent_12wdc {
47
+ .notification__notificationComponent_12vzg.notification__notificationComponent_12vzg {
53
48
  position: fixed;
54
49
  }
55
50
  @media screen and (min-width: 600px) {
56
- .notification__toastContent_12wdc {
51
+ .notification__toastContent_12vzg {
57
52
  width: var(--notification-desktop-content-width);
58
53
  }
59
54
  }
60
- .notification__toastContent_12wdc {
55
+ .notification__toastContent_12vzg {
61
56
 
62
57
  box-sizing: border-box;
63
58
  gap: var(--gap-16);
64
59
  }
65
- .notification__actionSection_12wdc {
60
+ .notification__actionSection_12vzg {
66
61
  min-width: 104px;
67
62
  min-height: 48px;
68
63
  padding: 0;
@@ -2,7 +2,7 @@
2
2
 
3
3
  require('./index.css');
4
4
 
5
- var styles = {"notificationComponent":"notification__notificationComponent_12wdc","isVisible":"notification__isVisible_12wdc","isClosing":"notification__isClosing_12wdc","hasCloser":"notification__hasCloser_12wdc","toastContent":"notification__toastContent_12wdc","actionSection":"notification__actionSection_12wdc"};
5
+ var styles = {"notificationComponent":"notification__notificationComponent_12vzg","isVisible":"notification__isVisible_12vzg","isClosing":"notification__isClosing_12vzg","hasCloser":"notification__hasCloser_12vzg","toastContent":"notification__toastContent_12vzg","actionSection":"notification__actionSection_12vzg"};
6
6
 
7
7
  module.exports = styles;
8
8
  //# sourceMappingURL=index.module.css.js.map
package/modern/index.css CHANGED
@@ -1,20 +1,15 @@
1
1
  :root {
2
- --gap-s: 12px;
3
- --gap-m: 16px;
4
- --gap-xl: 24px;
5
- --gap-4xl: 48px;
6
- --gap-s-neg: -12px;
7
2
  --gap-0: 0px;
8
- --gap-12: var(--gap-s);
9
- --gap-16: var(--gap-m);
10
- --gap-24: var(--gap-xl);
11
- --gap-48: var(--gap-4xl);
12
- --gap-12-neg: var(--gap-s-neg);
3
+ --gap-12: 12px;
4
+ --gap-16: 16px;
5
+ --gap-24: 24px;
6
+ --gap-48: 48px;
7
+ --gap-12-neg: -12px;
13
8
  }
14
9
  :root {
15
10
  --notification-desktop-content-width: 278px;
16
11
  }
17
- .notification__notificationComponent_12wdc {
12
+ .notification__notificationComponent_12vzg {
18
13
  visibility: hidden;
19
14
  right: var(--gap-12);
20
15
  transform: translate(0, -500px);
@@ -27,42 +22,42 @@
27
22
  border-radius: var(--gap-16);
28
23
  }
29
24
  @media screen and (min-width: 600px) {
30
- .notification__notificationComponent_12wdc {
25
+ .notification__notificationComponent_12vzg {
31
26
  right: var(--gap-48);
32
27
  width: auto;
33
28
  transform: translate(calc(100% + var(--gap-48)), 0);
34
29
  }
35
30
  }
36
- .notification__notificationComponent_12wdc.notification__isVisible_12wdc {
31
+ .notification__notificationComponent_12vzg.notification__isVisible_12vzg {
37
32
  visibility: visible;
38
33
  transform: translate(0, 0);
39
34
  }
40
- .notification__notificationComponent_12wdc.notification__isClosing_12wdc {
35
+ .notification__notificationComponent_12vzg.notification__isClosing_12vzg {
41
36
  transition: transform 0.1s ease-out;
42
37
  transform: translate(100vw, 0);
43
38
  }
44
39
  @media screen and (min-width: 600px) {
45
- .notification__notificationComponent_12wdc.notification__isClosing_12wdc {
40
+ .notification__notificationComponent_12vzg.notification__isClosing_12vzg {
46
41
  transform: translate(calc(100% + var(--gap-48)), 0);
47
42
  }
48
43
  }
49
- .notification__notificationComponent_12wdc.notification__hasCloser_12wdc {
44
+ .notification__notificationComponent_12vzg.notification__hasCloser_12vzg {
50
45
  padding-right: 52px;
51
46
  }
52
- .notification__notificationComponent_12wdc.notification__notificationComponent_12wdc {
47
+ .notification__notificationComponent_12vzg.notification__notificationComponent_12vzg {
53
48
  position: fixed;
54
49
  }
55
50
  @media screen and (min-width: 600px) {
56
- .notification__toastContent_12wdc {
51
+ .notification__toastContent_12vzg {
57
52
  width: var(--notification-desktop-content-width);
58
53
  }
59
54
  }
60
- .notification__toastContent_12wdc {
55
+ .notification__toastContent_12vzg {
61
56
 
62
57
  box-sizing: border-box;
63
58
  gap: var(--gap-16);
64
59
  }
65
- .notification__actionSection_12wdc {
60
+ .notification__actionSection_12vzg {
66
61
  min-width: 104px;
67
62
  min-height: 48px;
68
63
  padding: 0;
@@ -1,6 +1,6 @@
1
1
  import './index.css';
2
2
 
3
- const styles = {"notificationComponent":"notification__notificationComponent_12wdc","isVisible":"notification__isVisible_12wdc","isClosing":"notification__isClosing_12wdc","hasCloser":"notification__hasCloser_12wdc","toastContent":"notification__toastContent_12wdc","actionSection":"notification__actionSection_12wdc"};
3
+ const styles = {"notificationComponent":"notification__notificationComponent_12vzg","isVisible":"notification__isVisible_12vzg","isClosing":"notification__isClosing_12vzg","hasCloser":"notification__hasCloser_12vzg","toastContent":"notification__toastContent_12vzg","actionSection":"notification__actionSection_12vzg"};
4
4
 
5
5
  export { styles as default };
6
6
  //# sourceMappingURL=index.module.css.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-notification",
3
- "version": "9.0.10",
3
+ "version": "9.0.11",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -13,10 +13,10 @@
13
13
  "build": "rollup -c ../../tools/rollup/rollup.config.mjs --silent"
14
14
  },
15
15
  "dependencies": {
16
- "@alfalab/core-components-portal": "^5.0.3",
17
- "@alfalab/core-components-shared": "^2.2.2",
16
+ "@alfalab/core-components-portal": "^5.0.4",
17
+ "@alfalab/core-components-shared": "^2.2.3",
18
18
  "@alfalab/core-components-stack": "^7.0.1",
19
- "@alfalab/core-components-toast-plate": "^9.1.5",
19
+ "@alfalab/core-components-toast-plate": "^9.1.6",
20
20
  "classnames": "^2.5.1",
21
21
  "element-closest": "^3.0.2",
22
22
  "react-merge-refs": "^1.1.0",
@@ -32,6 +32,6 @@
32
32
  "access": "public",
33
33
  "directory": "dist"
34
34
  },
35
- "themesVersion": "15.2.0",
36
- "varsVersion": "11.1.0"
35
+ "themesVersion": "15.2.1",
36
+ "varsVersion": "11.2.1"
37
37
  }