@alfalab/core-components-notification-manager 5.4.11 → 5.4.12

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/component.js CHANGED
@@ -16,7 +16,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
16
16
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
17
17
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
18
18
 
19
- var styles = {"component":"notification-manager__component_smg2r","notification":"notification-manager__notification_smg2r","withoutMargin":"notification-manager__withoutMargin_smg2r","enter":"notification-manager__enter_smg2r","enterActive":"notification-manager__enterActive_smg2r"};
19
+ var styles = {"component":"notification-manager__component_qafqh","notification":"notification-manager__notification_qafqh","withoutMargin":"notification-manager__withoutMargin_qafqh","enter":"notification-manager__enter_qafqh","enterActive":"notification-manager__enterActive_qafqh"};
20
20
  require('./index.css')
21
21
 
22
22
  var CSS_TRANSITION_CLASS_NAMES = {
@@ -4,19 +4,22 @@
4
4
  --gap-4xl: 48px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
5
5
 
6
6
  /* новые значения, используйте их */
7
+ --gap-12: var(--gap-s);
8
+ --gap-24: var(--gap-xl);
9
+ --gap-48: var(--gap-4xl);
7
10
  }
8
11
 
9
12
  .component {
10
13
  position: fixed;
11
14
  top: 0;
12
- right: var(--gap-s);
15
+ right: var(--gap-12);
13
16
  display: flex;
14
17
  flex-direction: column;
15
18
  }
16
19
 
17
20
  .component .notification {
18
- width: calc(100vw - var(--gap-xl));
19
- margin-top: var(--gap-s);
21
+ width: calc(100vw - var(--gap-24));
22
+ margin-top: var(--gap-12);
20
23
  will-change: transform
21
24
  }
22
25
 
@@ -41,7 +44,7 @@
41
44
 
42
45
  @media (min-width: 600px) {
43
46
  .component {
44
- right: var(--gap-4xl);
47
+ right: var(--gap-48);
45
48
  }
46
49
 
47
50
  .component .notification {
package/esm/component.js CHANGED
@@ -7,7 +7,7 @@ import { Stack } from '@alfalab/core-components-stack/esm';
7
7
  import { stackingOrder } from '@alfalab/stack-context';
8
8
  import { Notification } from './components/notification/component.js';
9
9
 
10
- var styles = {"component":"notification-manager__component_smg2r","notification":"notification-manager__notification_smg2r","withoutMargin":"notification-manager__withoutMargin_smg2r","enter":"notification-manager__enter_smg2r","enterActive":"notification-manager__enterActive_smg2r"};
10
+ var styles = {"component":"notification-manager__component_qafqh","notification":"notification-manager__notification_qafqh","withoutMargin":"notification-manager__withoutMargin_qafqh","enter":"notification-manager__enter_qafqh","enterActive":"notification-manager__enterActive_qafqh"};
11
11
  require('./index.css')
12
12
 
13
13
  var CSS_TRANSITION_CLASS_NAMES = {
package/esm/index.css CHANGED
@@ -1,59 +1,62 @@
1
- /* hash: w85gx */
1
+ /* hash: 94gc4 */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */
3
3
  --gap-s: 12px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  --gap-xl: 24px; /* deprecated */ /* deprecated */ /* deprecated */
5
5
  --gap-4xl: 48px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
6
6
 
7
7
  /* новые значения, используйте их */
8
+ --gap-12: var(--gap-s);
9
+ --gap-24: var(--gap-xl);
10
+ --gap-48: var(--gap-4xl);
8
11
  }
9
12
 
10
- .notification-manager__component_smg2r {
13
+ .notification-manager__component_qafqh {
11
14
  position: fixed;
12
15
  top: 0;
13
- right: var(--gap-s);
16
+ right: var(--gap-12);
14
17
  display: flex;
15
18
  flex-direction: column;
16
19
  }
17
20
 
18
- .notification-manager__component_smg2r .notification-manager__notification_smg2r {
19
- width: calc(100vw - var(--gap-xl));
20
- margin-top: var(--gap-s);
21
+ .notification-manager__component_qafqh .notification-manager__notification_qafqh {
22
+ width: calc(100vw - var(--gap-24));
23
+ margin-top: var(--gap-12);
21
24
  will-change: transform
22
25
  }
23
26
 
24
- .notification-manager__component_smg2r .notification-manager__notification_smg2r.notification-manager__withoutMargin_smg2r {
27
+ .notification-manager__component_qafqh .notification-manager__notification_qafqh.notification-manager__withoutMargin_qafqh {
25
28
  margin-top: 0;
26
29
  }
27
30
 
28
- .notification-manager__component_smg2r .notification-manager__notification_smg2r.notification-manager__notification_smg2r {
31
+ .notification-manager__component_qafqh .notification-manager__notification_qafqh.notification-manager__notification_qafqh {
29
32
  position: static;
30
33
  }
31
34
 
32
- .notification-manager__enter_smg2r {
35
+ .notification-manager__enter_qafqh {
33
36
  visibility: hidden;
34
37
  transform: translate(0, -500px);
35
38
  }
36
39
 
37
- .notification-manager__enterActive_smg2r {
40
+ .notification-manager__enterActive_qafqh {
38
41
  visibility: visible;
39
42
  transform: translate(0);
40
43
  transition: transform 0.4s ease-out;
41
44
  }
42
45
 
43
46
  @media (min-width: 600px) {
44
- .notification-manager__component_smg2r {
45
- right: var(--gap-4xl);
47
+ .notification-manager__component_qafqh {
48
+ right: var(--gap-48);
46
49
  }
47
50
 
48
- .notification-manager__component_smg2r .notification-manager__notification_smg2r {
51
+ .notification-manager__component_qafqh .notification-manager__notification_qafqh {
49
52
  width: auto;
50
53
  }
51
54
 
52
- .notification-manager__enter_smg2r {
55
+ .notification-manager__enter_qafqh {
53
56
  transform: translate(100%, 0);
54
57
  }
55
58
 
56
- .notification-manager__enterActive_smg2r {
59
+ .notification-manager__enterActive_qafqh {
57
60
  transform: translate(0);
58
61
  }
59
62
  }
package/index.css CHANGED
@@ -1,59 +1,62 @@
1
- /* hash: w85gx */
1
+ /* hash: 94gc4 */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */
3
3
  --gap-s: 12px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  --gap-xl: 24px; /* deprecated */ /* deprecated */ /* deprecated */
5
5
  --gap-4xl: 48px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
6
6
 
7
7
  /* новые значения, используйте их */
8
+ --gap-12: var(--gap-s);
9
+ --gap-24: var(--gap-xl);
10
+ --gap-48: var(--gap-4xl);
8
11
  }
9
12
 
10
- .notification-manager__component_smg2r {
13
+ .notification-manager__component_qafqh {
11
14
  position: fixed;
12
15
  top: 0;
13
- right: var(--gap-s);
16
+ right: var(--gap-12);
14
17
  display: flex;
15
18
  flex-direction: column;
16
19
  }
17
20
 
18
- .notification-manager__component_smg2r .notification-manager__notification_smg2r {
19
- width: calc(100vw - var(--gap-xl));
20
- margin-top: var(--gap-s);
21
+ .notification-manager__component_qafqh .notification-manager__notification_qafqh {
22
+ width: calc(100vw - var(--gap-24));
23
+ margin-top: var(--gap-12);
21
24
  will-change: transform
22
25
  }
23
26
 
24
- .notification-manager__component_smg2r .notification-manager__notification_smg2r.notification-manager__withoutMargin_smg2r {
27
+ .notification-manager__component_qafqh .notification-manager__notification_qafqh.notification-manager__withoutMargin_qafqh {
25
28
  margin-top: 0;
26
29
  }
27
30
 
28
- .notification-manager__component_smg2r .notification-manager__notification_smg2r.notification-manager__notification_smg2r {
31
+ .notification-manager__component_qafqh .notification-manager__notification_qafqh.notification-manager__notification_qafqh {
29
32
  position: static;
30
33
  }
31
34
 
32
- .notification-manager__enter_smg2r {
35
+ .notification-manager__enter_qafqh {
33
36
  visibility: hidden;
34
37
  transform: translate(0, -500px);
35
38
  }
36
39
 
37
- .notification-manager__enterActive_smg2r {
40
+ .notification-manager__enterActive_qafqh {
38
41
  visibility: visible;
39
42
  transform: translate(0);
40
43
  transition: transform 0.4s ease-out;
41
44
  }
42
45
 
43
46
  @media (min-width: 600px) {
44
- .notification-manager__component_smg2r {
45
- right: var(--gap-4xl);
47
+ .notification-manager__component_qafqh {
48
+ right: var(--gap-48);
46
49
  }
47
50
 
48
- .notification-manager__component_smg2r .notification-manager__notification_smg2r {
51
+ .notification-manager__component_qafqh .notification-manager__notification_qafqh {
49
52
  width: auto;
50
53
  }
51
54
 
52
- .notification-manager__enter_smg2r {
55
+ .notification-manager__enter_qafqh {
53
56
  transform: translate(100%, 0);
54
57
  }
55
58
 
56
- .notification-manager__enterActive_smg2r {
59
+ .notification-manager__enterActive_qafqh {
57
60
  transform: translate(0);
58
61
  }
59
62
  }
@@ -6,7 +6,7 @@ import { Stack } from '@alfalab/core-components-stack/modern';
6
6
  import { stackingOrder } from '@alfalab/stack-context';
7
7
  import { Notification } from './components/notification/component.js';
8
8
 
9
- const styles = {"component":"notification-manager__component_smg2r","notification":"notification-manager__notification_smg2r","withoutMargin":"notification-manager__withoutMargin_smg2r","enter":"notification-manager__enter_smg2r","enterActive":"notification-manager__enterActive_smg2r"};
9
+ const styles = {"component":"notification-manager__component_qafqh","notification":"notification-manager__notification_qafqh","withoutMargin":"notification-manager__withoutMargin_qafqh","enter":"notification-manager__enter_qafqh","enterActive":"notification-manager__enterActive_qafqh"};
10
10
  require('./index.css')
11
11
 
12
12
  const CSS_TRANSITION_CLASS_NAMES = {
package/modern/index.css CHANGED
@@ -1,59 +1,62 @@
1
- /* hash: w85gx */
1
+ /* hash: 94gc4 */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */
3
3
  --gap-s: 12px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
4
4
  --gap-xl: 24px; /* deprecated */ /* deprecated */ /* deprecated */
5
5
  --gap-4xl: 48px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
6
6
 
7
7
  /* новые значения, используйте их */
8
+ --gap-12: var(--gap-s);
9
+ --gap-24: var(--gap-xl);
10
+ --gap-48: var(--gap-4xl);
8
11
  }
9
12
 
10
- .notification-manager__component_smg2r {
13
+ .notification-manager__component_qafqh {
11
14
  position: fixed;
12
15
  top: 0;
13
- right: var(--gap-s);
16
+ right: var(--gap-12);
14
17
  display: flex;
15
18
  flex-direction: column;
16
19
  }
17
20
 
18
- .notification-manager__component_smg2r .notification-manager__notification_smg2r {
19
- width: calc(100vw - var(--gap-xl));
20
- margin-top: var(--gap-s);
21
+ .notification-manager__component_qafqh .notification-manager__notification_qafqh {
22
+ width: calc(100vw - var(--gap-24));
23
+ margin-top: var(--gap-12);
21
24
  will-change: transform
22
25
  }
23
26
 
24
- .notification-manager__component_smg2r .notification-manager__notification_smg2r.notification-manager__withoutMargin_smg2r {
27
+ .notification-manager__component_qafqh .notification-manager__notification_qafqh.notification-manager__withoutMargin_qafqh {
25
28
  margin-top: 0;
26
29
  }
27
30
 
28
- .notification-manager__component_smg2r .notification-manager__notification_smg2r.notification-manager__notification_smg2r {
31
+ .notification-manager__component_qafqh .notification-manager__notification_qafqh.notification-manager__notification_qafqh {
29
32
  position: static;
30
33
  }
31
34
 
32
- .notification-manager__enter_smg2r {
35
+ .notification-manager__enter_qafqh {
33
36
  visibility: hidden;
34
37
  transform: translate(0, -500px);
35
38
  }
36
39
 
37
- .notification-manager__enterActive_smg2r {
40
+ .notification-manager__enterActive_qafqh {
38
41
  visibility: visible;
39
42
  transform: translate(0);
40
43
  transition: transform 0.4s ease-out;
41
44
  }
42
45
 
43
46
  @media (min-width: 600px) {
44
- .notification-manager__component_smg2r {
45
- right: var(--gap-4xl);
47
+ .notification-manager__component_qafqh {
48
+ right: var(--gap-48);
46
49
  }
47
50
 
48
- .notification-manager__component_smg2r .notification-manager__notification_smg2r {
51
+ .notification-manager__component_qafqh .notification-manager__notification_qafqh {
49
52
  width: auto;
50
53
  }
51
54
 
52
- .notification-manager__enter_smg2r {
55
+ .notification-manager__enter_qafqh {
53
56
  transform: translate(100%, 0);
54
57
  }
55
58
 
56
- .notification-manager__enterActive_smg2r {
59
+ .notification-manager__enterActive_qafqh {
57
60
  transform: translate(0);
58
61
  }
59
62
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-notification-manager",
3
- "version": "5.4.11",
3
+ "version": "5.4.12",
4
4
  "description": "Notification manager",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -14,13 +14,13 @@
14
14
  "react": "^16.9.0 || ^17.0.1 || ^18.0.0"
15
15
  },
16
16
  "dependencies": {
17
- "@alfalab/core-components-notification": "^7.1.3",
17
+ "@alfalab/core-components-notification": "^7.1.4",
18
18
  "@alfalab/core-components-portal": "^3.3.1",
19
19
  "@alfalab/core-components-stack": "^5.0.0",
20
20
  "classnames": "^2.3.1",
21
21
  "react-transition-group": "^4.4.5",
22
22
  "tslib": "^2.4.0"
23
23
  },
24
- "themesVersion": "13.0.1",
24
+ "themesVersion": "13.0.2",
25
25
  "varsVersion": "9.11.1"
26
26
  }
@@ -3,14 +3,14 @@
3
3
  .component {
4
4
  position: fixed;
5
5
  top: 0;
6
- right: var(--gap-s);
6
+ right: var(--gap-12);
7
7
  display: flex;
8
8
  flex-direction: column;
9
9
  }
10
10
 
11
11
  .component .notification {
12
- width: calc(100vw - var(--gap-xl));
13
- margin-top: var(--gap-s);
12
+ width: calc(100vw - var(--gap-24));
13
+ margin-top: var(--gap-12);
14
14
  will-change: transform;
15
15
 
16
16
  &.withoutMargin {
@@ -35,7 +35,7 @@
35
35
 
36
36
  @media (--tablet-s) {
37
37
  .component {
38
- right: var(--gap-4xl);
38
+ right: var(--gap-48);
39
39
  }
40
40
 
41
41
  .component .notification {