@alfalab/core-components-navigation-bar-private 0.1.9 → 0.2.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.
Files changed (45) hide show
  1. package/Component.js +1 -1
  2. package/components/back-arrow-addon/Component.js +1 -1
  3. package/components/back-arrow-addon/index.css +18 -16
  4. package/components/closer/Component.js +1 -1
  5. package/components/closer/index.css +6 -6
  6. package/cssm/components/back-arrow-addon/index.module.css +6 -4
  7. package/cssm/index.module.css +6 -4
  8. package/esm/Component.js +1 -1
  9. package/esm/components/back-arrow-addon/Component.js +1 -1
  10. package/esm/components/back-arrow-addon/index.css +18 -16
  11. package/esm/components/closer/Component.js +1 -1
  12. package/esm/components/closer/index.css +6 -6
  13. package/esm/index.css +33 -31
  14. package/index.css +33 -31
  15. package/modern/Component.js +1 -1
  16. package/modern/components/back-arrow-addon/Component.js +1 -1
  17. package/modern/components/back-arrow-addon/index.css +18 -16
  18. package/modern/components/closer/Component.js +1 -1
  19. package/modern/components/closer/index.css +6 -6
  20. package/modern/index.css +33 -31
  21. package/moderncssm/Component.d.ts +5 -0
  22. package/moderncssm/Component.js +159 -0
  23. package/moderncssm/components/back-arrow-addon/Component.d.ts +26 -0
  24. package/moderncssm/components/back-arrow-addon/Component.js +21 -0
  25. package/moderncssm/components/back-arrow-addon/index.d.ts +1 -0
  26. package/moderncssm/components/back-arrow-addon/index.js +1 -0
  27. package/moderncssm/components/back-arrow-addon/index.module.css +62 -0
  28. package/moderncssm/components/closer/Component.d.ts +35 -0
  29. package/moderncssm/components/closer/Component.js +18 -0
  30. package/moderncssm/components/closer/index.d.ts +1 -0
  31. package/moderncssm/components/closer/index.js +1 -0
  32. package/moderncssm/components/closer/index.module.css +33 -0
  33. package/moderncssm/index.d.ts +2 -0
  34. package/moderncssm/index.js +1 -0
  35. package/moderncssm/index.module.css +131 -0
  36. package/moderncssm/shared/index.d.ts +2 -0
  37. package/moderncssm/shared/index.js +2 -0
  38. package/moderncssm/types.d.ts +118 -0
  39. package/moderncssm/types.js +1 -0
  40. package/moderncssm/vars.css +7 -0
  41. package/package.json +6 -6
  42. package/src/components/back-arrow-addon/index.module.css +5 -5
  43. package/src/components/closer/index.module.css +1 -1
  44. package/src/index.module.css +5 -5
  45. package/src/vars.css +1 -1
package/Component.js CHANGED
@@ -17,7 +17,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
17
17
  var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
18
18
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
19
19
 
20
- var styles = {"header":"navigation-bar-private__header_1mg8v","backgroundImage":"navigation-bar-private__backgroundImage_1mg8v","mainLine":"navigation-bar-private__mainLine_1mg8v","mainLineSticky":"navigation-bar-private__mainLineSticky_1mg8v","mainLineWithImageBg":"navigation-bar-private__mainLineWithImageBg_1mg8v","content":"navigation-bar-private__content_1mg8v","withBothAddons":"navigation-bar-private__withBothAddons_1mg8v","withCompactTitle":"navigation-bar-private__withCompactTitle_1mg8v","children":"navigation-bar-private__children_1mg8v","title":"navigation-bar-private__title_1mg8v","contentOnBotDesktop":"navigation-bar-private__contentOnBotDesktop_1mg8v","contentOnBotMobile":"navigation-bar-private__contentOnBotMobile_1mg8v","subtitle":"navigation-bar-private__subtitle_1mg8v","addonsWrapper":"navigation-bar-private__addonsWrapper_1mg8v","rightAddons":"navigation-bar-private__rightAddons_1mg8v","addon":"navigation-bar-private__addon_1mg8v","bottomAddons":"navigation-bar-private__bottomAddons_1mg8v","closer":"navigation-bar-private__closer_1mg8v","left":"navigation-bar-private__left_1mg8v","center":"navigation-bar-private__center_1mg8v","trim":"navigation-bar-private__trim_1mg8v"};
20
+ var styles = {"header":"navigation-bar-private__header_8xzyw","backgroundImage":"navigation-bar-private__backgroundImage_8xzyw","mainLine":"navigation-bar-private__mainLine_8xzyw","mainLineSticky":"navigation-bar-private__mainLineSticky_8xzyw","mainLineWithImageBg":"navigation-bar-private__mainLineWithImageBg_8xzyw","content":"navigation-bar-private__content_8xzyw","withBothAddons":"navigation-bar-private__withBothAddons_8xzyw","withCompactTitle":"navigation-bar-private__withCompactTitle_8xzyw","children":"navigation-bar-private__children_8xzyw","title":"navigation-bar-private__title_8xzyw","contentOnBotDesktop":"navigation-bar-private__contentOnBotDesktop_8xzyw","contentOnBotMobile":"navigation-bar-private__contentOnBotMobile_8xzyw","subtitle":"navigation-bar-private__subtitle_8xzyw","addonsWrapper":"navigation-bar-private__addonsWrapper_8xzyw","rightAddons":"navigation-bar-private__rightAddons_8xzyw","addon":"navigation-bar-private__addon_8xzyw","bottomAddons":"navigation-bar-private__bottomAddons_8xzyw","closer":"navigation-bar-private__closer_8xzyw","left":"navigation-bar-private__left_8xzyw","center":"navigation-bar-private__center_8xzyw","trim":"navigation-bar-private__trim_8xzyw"};
21
21
  require('./index.css')
22
22
 
23
23
  var ADDONS_HEIGHT = 48;
@@ -15,7 +15,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
15
15
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
16
16
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
17
17
 
18
- var styles = {"component":"navigation-bar-private__component_mj4yu","mobileComponent":"navigation-bar-private__mobileComponent_mj4yu","flex":"navigation-bar-private__flex_mj4yu","iconWrapper":"navigation-bar-private__iconWrapper_mj4yu","text":"navigation-bar-private__text_mj4yu","mobileWrapper":"navigation-bar-private__mobileWrapper_mj4yu"};
18
+ var styles = {"component":"navigation-bar-private__component_1sneo","mobileComponent":"navigation-bar-private__mobileComponent_1sneo","flex":"navigation-bar-private__flex_1sneo","iconWrapper":"navigation-bar-private__iconWrapper_1sneo","text":"navigation-bar-private__text_1sneo","mobileWrapper":"navigation-bar-private__mobileWrapper_1sneo"};
19
19
  require('./index.css')
20
20
 
21
21
  var BackArrowAddon = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: 1u1uz */
1
+ /* hash: 1jkoy */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-neutral-translucent-100: rgba(38, 55, 88, 0.06);
@@ -26,6 +26,8 @@
26
26
  --gap-s: 12px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
27
27
 
28
28
  /* новые значения, используйте их */
29
+ --gap-8: var(--gap-xs);
30
+ --gap-12: var(--gap-s);
29
31
  } :root {
30
32
  } :root {
31
33
  } :root {
@@ -33,48 +35,48 @@
33
35
 
34
36
  /* back-arrow */
35
37
  --navigation-bar-back-arrow-mobile-fill: var(--color-light-neutral-translucent-700);
36
- } .navigation-bar-private__component_mj4yu {
38
+ } .navigation-bar-private__component_1sneo {
37
39
  height: 100%;
38
40
  background: var(--color-light-bg-primary-alpha-40);
39
41
  -webkit-backdrop-filter: blur(10px);
40
42
  backdrop-filter: blur(10px);
41
43
  border-radius: var(--border-radius-pill);
42
44
  min-width: 48px
43
- } .navigation-bar-private__component_mj4yu svg > path {
45
+ } .navigation-bar-private__component_1sneo svg > path {
44
46
  transition: fill 0.2s ease;
45
47
  fill: var(--color-light-neutral-translucent-1300);
46
- } .navigation-bar-private__component_mj4yu:hover svg > path {
48
+ } .navigation-bar-private__component_1sneo:hover svg > path {
47
49
  fill: var(--color-light-neutral-translucent-1300-hover);
48
- } .navigation-bar-private__component_mj4yu:active svg > path {
50
+ } .navigation-bar-private__component_1sneo:active svg > path {
49
51
  fill: var(--color-light-neutral-translucent-1300-press);
50
- } .navigation-bar-private__mobileComponent_mj4yu {
52
+ } .navigation-bar-private__mobileComponent_1sneo {
51
53
  height: 32px;
52
54
  min-width: 32px;
53
- margin: 0 var(--gap-xs);
55
+ margin: 0 var(--gap-8);
54
56
  -webkit-backdrop-filter: none;
55
57
  backdrop-filter: none;
56
58
  background: none;
57
- } .navigation-bar-private__flex_mj4yu {
59
+ } .navigation-bar-private__flex_1sneo {
58
60
  display: flex;
59
61
  align-items: center;
60
- } .navigation-bar-private__iconWrapper_mj4yu {
62
+ } .navigation-bar-private__iconWrapper_1sneo {
61
63
  display: inline-flex;
62
64
  align-items: center;
63
65
  justify-content: center;
64
66
  height: 48px;
65
- margin: 0 var(--gap-xs) 0 var(--gap-s);
67
+ margin: 0 var(--gap-8) 0 var(--gap-12);
66
68
  border-radius: var(--border-radius-circle)
67
- } .navigation-bar-private__iconWrapper_mj4yu + .navigation-bar-private__text_mj4yu {
68
- margin-right: var(--gap-s);
69
- } .navigation-bar-private__mobileWrapper_mj4yu {
69
+ } .navigation-bar-private__iconWrapper_1sneo + .navigation-bar-private__text_1sneo {
70
+ margin-right: var(--gap-12);
71
+ } .navigation-bar-private__mobileWrapper_1sneo {
70
72
  width: 32px;
71
73
  height: 32px;
72
74
  background: var(--color-light-neutral-translucent-100);
73
75
  -webkit-backdrop-filter: blur(10px);
74
76
  backdrop-filter: blur(10px);
75
77
  margin: 0
76
- } .navigation-bar-private__mobileWrapper_mj4yu + .navigation-bar-private__text_mj4yu {
77
- margin: 0 var(--gap-s) 0 var(--gap-xs);
78
- } .navigation-bar-private__mobileWrapper_mj4yu svg > path {
78
+ } .navigation-bar-private__mobileWrapper_1sneo + .navigation-bar-private__text_1sneo {
79
+ margin: 0 var(--gap-12) 0 var(--gap-8);
80
+ } .navigation-bar-private__mobileWrapper_1sneo svg > path {
79
81
  fill: var(--navigation-bar-back-arrow-mobile-fill);
80
82
  }
@@ -14,7 +14,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
14
14
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
15
15
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
16
16
 
17
- var styles = {"closer":"navigation-bar-private__closer_1rtgg","button":"navigation-bar-private__button_1rtgg","mobile":"navigation-bar-private__mobile_1rtgg","sticky":"navigation-bar-private__sticky_1rtgg"};
17
+ var styles = {"closer":"navigation-bar-private__closer_216hm","button":"navigation-bar-private__button_216hm","mobile":"navigation-bar-private__mobile_216hm","sticky":"navigation-bar-private__sticky_216hm"};
18
18
  require('./index.css')
19
19
 
20
20
  var Closer = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: 67rl1 */
1
+ /* hash: 1gpbm */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-neutral-translucent-100: rgba(38, 55, 88, 0.06);
@@ -28,7 +28,7 @@
28
28
  --navigation-bar-closer-mobile-color: var(--color-light-neutral-translucent-700);
29
29
 
30
30
  /* back-arrow */
31
- } .navigation-bar-private__closer_1rtgg {
31
+ } .navigation-bar-private__closer_216hm {
32
32
  flex-shrink: 0;
33
33
  width: 48px;
34
34
  height: 48px;
@@ -36,17 +36,17 @@
36
36
  display: flex;
37
37
  align-items: center;
38
38
  justify-content: center;
39
- } .navigation-bar-private__button_1rtgg {
39
+ } .navigation-bar-private__button_216hm {
40
40
  background: var(--color-light-bg-primary-alpha-40);
41
41
  -webkit-backdrop-filter: blur(10px);
42
42
  backdrop-filter: blur(10px);
43
43
  color: var(--color-light-neutral-translucent-1300)
44
- } .navigation-bar-private__button_1rtgg.navigation-bar-private__mobile_1rtgg {
44
+ } .navigation-bar-private__button_216hm.navigation-bar-private__mobile_216hm {
45
45
  background: var(--color-light-neutral-translucent-100);
46
46
  color: var(--navigation-bar-closer-mobile-color);
47
- } .navigation-bar-private__button_1rtgg.navigation-bar-private__button_1rtgg {
47
+ } .navigation-bar-private__button_216hm.navigation-bar-private__button_216hm {
48
48
  border-radius: var(--border-radius-circle);
49
- } .navigation-bar-private__sticky_1rtgg {
49
+ } .navigation-bar-private__sticky_216hm {
50
50
  position: sticky;
51
51
  top: 0;
52
52
  }
@@ -25,6 +25,8 @@
25
25
  --gap-s: 12px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
26
26
 
27
27
  /* новые значения, используйте их */
28
+ --gap-8: var(--gap-xs);
29
+ --gap-12: var(--gap-s);
28
30
  } :root {
29
31
  } :root {
30
32
  } :root {
@@ -49,7 +51,7 @@
49
51
  } .mobileComponent {
50
52
  height: 32px;
51
53
  min-width: 32px;
52
- margin: 0 var(--gap-xs);
54
+ margin: 0 var(--gap-8);
53
55
  -webkit-backdrop-filter: none;
54
56
  backdrop-filter: none;
55
57
  background: none;
@@ -61,10 +63,10 @@
61
63
  align-items: center;
62
64
  justify-content: center;
63
65
  height: 48px;
64
- margin: 0 var(--gap-xs) 0 var(--gap-s);
66
+ margin: 0 var(--gap-8) 0 var(--gap-12);
65
67
  border-radius: var(--border-radius-circle)
66
68
  } .iconWrapper + .text {
67
- margin-right: var(--gap-s);
69
+ margin-right: var(--gap-12);
68
70
  } .mobileWrapper {
69
71
  width: 32px;
70
72
  height: 32px;
@@ -73,7 +75,7 @@
73
75
  backdrop-filter: blur(10px);
74
76
  margin: 0
75
77
  } .mobileWrapper + .text {
76
- margin: 0 var(--gap-s) 0 var(--gap-xs);
78
+ margin: 0 var(--gap-12) 0 var(--gap-8);
77
79
  } .mobileWrapper svg > path {
78
80
  fill: var(--navigation-bar-back-arrow-mobile-fill);
79
81
  }
@@ -19,6 +19,8 @@
19
19
  --gap-s: 12px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
20
20
 
21
21
  /* новые значения, используйте их */
22
+ --gap-4: var(--gap-2xs);
23
+ --gap-12: var(--gap-s);
22
24
  } :root {
23
25
  } :root {
24
26
  } .header {
@@ -56,8 +58,8 @@
56
58
  line-height: 20px;
57
59
  font-weight: 500;
58
60
  align-self: center;
59
- padding-top: var(--gap-2xs);
60
- padding-bottom: var(--gap-2xs)
61
+ padding-top: var(--gap-4);
62
+ padding-bottom: var(--gap-4)
61
63
  } .content.withBothAddons > .children,
62
64
  .content.withBothAddons > .title,
63
65
  .content.withCompactTitle > .children,
@@ -65,9 +67,9 @@
65
67
  -webkit-line-clamp: 1;
66
68
  word-break: break-all;
67
69
  } .content.contentOnBotDesktop.contentOnBotDesktop {
68
- padding-top: var(--gap-s);
70
+ padding-top: var(--gap-12);
69
71
  } .content.contentOnBotMobile.contentOnBotMobile {
70
- padding-top: var(--gap-s);
72
+ padding-top: var(--gap-12);
71
73
  } .title {
72
74
  word-break: break-word;
73
75
  } .subtitle {
package/esm/Component.js CHANGED
@@ -7,7 +7,7 @@ import { useLayoutEffect_SAFE_FOR_SSR } from '@alfalab/hooks';
7
7
  import { BackArrowAddon } from './components/back-arrow-addon/Component.js';
8
8
  import { Closer } from './components/closer/Component.js';
9
9
 
10
- var styles = {"header":"navigation-bar-private__header_1mg8v","backgroundImage":"navigation-bar-private__backgroundImage_1mg8v","mainLine":"navigation-bar-private__mainLine_1mg8v","mainLineSticky":"navigation-bar-private__mainLineSticky_1mg8v","mainLineWithImageBg":"navigation-bar-private__mainLineWithImageBg_1mg8v","content":"navigation-bar-private__content_1mg8v","withBothAddons":"navigation-bar-private__withBothAddons_1mg8v","withCompactTitle":"navigation-bar-private__withCompactTitle_1mg8v","children":"navigation-bar-private__children_1mg8v","title":"navigation-bar-private__title_1mg8v","contentOnBotDesktop":"navigation-bar-private__contentOnBotDesktop_1mg8v","contentOnBotMobile":"navigation-bar-private__contentOnBotMobile_1mg8v","subtitle":"navigation-bar-private__subtitle_1mg8v","addonsWrapper":"navigation-bar-private__addonsWrapper_1mg8v","rightAddons":"navigation-bar-private__rightAddons_1mg8v","addon":"navigation-bar-private__addon_1mg8v","bottomAddons":"navigation-bar-private__bottomAddons_1mg8v","closer":"navigation-bar-private__closer_1mg8v","left":"navigation-bar-private__left_1mg8v","center":"navigation-bar-private__center_1mg8v","trim":"navigation-bar-private__trim_1mg8v"};
10
+ var styles = {"header":"navigation-bar-private__header_8xzyw","backgroundImage":"navigation-bar-private__backgroundImage_8xzyw","mainLine":"navigation-bar-private__mainLine_8xzyw","mainLineSticky":"navigation-bar-private__mainLineSticky_8xzyw","mainLineWithImageBg":"navigation-bar-private__mainLineWithImageBg_8xzyw","content":"navigation-bar-private__content_8xzyw","withBothAddons":"navigation-bar-private__withBothAddons_8xzyw","withCompactTitle":"navigation-bar-private__withCompactTitle_8xzyw","children":"navigation-bar-private__children_8xzyw","title":"navigation-bar-private__title_8xzyw","contentOnBotDesktop":"navigation-bar-private__contentOnBotDesktop_8xzyw","contentOnBotMobile":"navigation-bar-private__contentOnBotMobile_8xzyw","subtitle":"navigation-bar-private__subtitle_8xzyw","addonsWrapper":"navigation-bar-private__addonsWrapper_8xzyw","rightAddons":"navigation-bar-private__rightAddons_8xzyw","addon":"navigation-bar-private__addon_8xzyw","bottomAddons":"navigation-bar-private__bottomAddons_8xzyw","closer":"navigation-bar-private__closer_8xzyw","left":"navigation-bar-private__left_8xzyw","center":"navigation-bar-private__center_8xzyw","trim":"navigation-bar-private__trim_8xzyw"};
11
11
  require('./index.css')
12
12
 
13
13
  var ADDONS_HEIGHT = 48;
@@ -6,7 +6,7 @@ import { Typography } from '@alfalab/core-components-typography/esm';
6
6
  import { ArrowLeftMediumMIcon } from '@alfalab/icons-glyph/ArrowLeftMediumMIcon';
7
7
  import { ArrowLeftMIcon } from '@alfalab/icons-glyph/ArrowLeftMIcon';
8
8
 
9
- var styles = {"component":"navigation-bar-private__component_mj4yu","mobileComponent":"navigation-bar-private__mobileComponent_mj4yu","flex":"navigation-bar-private__flex_mj4yu","iconWrapper":"navigation-bar-private__iconWrapper_mj4yu","text":"navigation-bar-private__text_mj4yu","mobileWrapper":"navigation-bar-private__mobileWrapper_mj4yu"};
9
+ var styles = {"component":"navigation-bar-private__component_1sneo","mobileComponent":"navigation-bar-private__mobileComponent_1sneo","flex":"navigation-bar-private__flex_1sneo","iconWrapper":"navigation-bar-private__iconWrapper_1sneo","text":"navigation-bar-private__text_1sneo","mobileWrapper":"navigation-bar-private__mobileWrapper_1sneo"};
10
10
  require('./index.css')
11
11
 
12
12
  var BackArrowAddon = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: 1u1uz */
1
+ /* hash: 1jkoy */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-neutral-translucent-100: rgba(38, 55, 88, 0.06);
@@ -26,6 +26,8 @@
26
26
  --gap-s: 12px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
27
27
 
28
28
  /* новые значения, используйте их */
29
+ --gap-8: var(--gap-xs);
30
+ --gap-12: var(--gap-s);
29
31
  } :root {
30
32
  } :root {
31
33
  } :root {
@@ -33,48 +35,48 @@
33
35
 
34
36
  /* back-arrow */
35
37
  --navigation-bar-back-arrow-mobile-fill: var(--color-light-neutral-translucent-700);
36
- } .navigation-bar-private__component_mj4yu {
38
+ } .navigation-bar-private__component_1sneo {
37
39
  height: 100%;
38
40
  background: var(--color-light-bg-primary-alpha-40);
39
41
  -webkit-backdrop-filter: blur(10px);
40
42
  backdrop-filter: blur(10px);
41
43
  border-radius: var(--border-radius-pill);
42
44
  min-width: 48px
43
- } .navigation-bar-private__component_mj4yu svg > path {
45
+ } .navigation-bar-private__component_1sneo svg > path {
44
46
  transition: fill 0.2s ease;
45
47
  fill: var(--color-light-neutral-translucent-1300);
46
- } .navigation-bar-private__component_mj4yu:hover svg > path {
48
+ } .navigation-bar-private__component_1sneo:hover svg > path {
47
49
  fill: var(--color-light-neutral-translucent-1300-hover);
48
- } .navigation-bar-private__component_mj4yu:active svg > path {
50
+ } .navigation-bar-private__component_1sneo:active svg > path {
49
51
  fill: var(--color-light-neutral-translucent-1300-press);
50
- } .navigation-bar-private__mobileComponent_mj4yu {
52
+ } .navigation-bar-private__mobileComponent_1sneo {
51
53
  height: 32px;
52
54
  min-width: 32px;
53
- margin: 0 var(--gap-xs);
55
+ margin: 0 var(--gap-8);
54
56
  -webkit-backdrop-filter: none;
55
57
  backdrop-filter: none;
56
58
  background: none;
57
- } .navigation-bar-private__flex_mj4yu {
59
+ } .navigation-bar-private__flex_1sneo {
58
60
  display: flex;
59
61
  align-items: center;
60
- } .navigation-bar-private__iconWrapper_mj4yu {
62
+ } .navigation-bar-private__iconWrapper_1sneo {
61
63
  display: inline-flex;
62
64
  align-items: center;
63
65
  justify-content: center;
64
66
  height: 48px;
65
- margin: 0 var(--gap-xs) 0 var(--gap-s);
67
+ margin: 0 var(--gap-8) 0 var(--gap-12);
66
68
  border-radius: var(--border-radius-circle)
67
- } .navigation-bar-private__iconWrapper_mj4yu + .navigation-bar-private__text_mj4yu {
68
- margin-right: var(--gap-s);
69
- } .navigation-bar-private__mobileWrapper_mj4yu {
69
+ } .navigation-bar-private__iconWrapper_1sneo + .navigation-bar-private__text_1sneo {
70
+ margin-right: var(--gap-12);
71
+ } .navigation-bar-private__mobileWrapper_1sneo {
70
72
  width: 32px;
71
73
  height: 32px;
72
74
  background: var(--color-light-neutral-translucent-100);
73
75
  -webkit-backdrop-filter: blur(10px);
74
76
  backdrop-filter: blur(10px);
75
77
  margin: 0
76
- } .navigation-bar-private__mobileWrapper_mj4yu + .navigation-bar-private__text_mj4yu {
77
- margin: 0 var(--gap-s) 0 var(--gap-xs);
78
- } .navigation-bar-private__mobileWrapper_mj4yu svg > path {
78
+ } .navigation-bar-private__mobileWrapper_1sneo + .navigation-bar-private__text_1sneo {
79
+ margin: 0 var(--gap-12) 0 var(--gap-8);
80
+ } .navigation-bar-private__mobileWrapper_1sneo svg > path {
79
81
  fill: var(--navigation-bar-back-arrow-mobile-fill);
80
82
  }
@@ -5,7 +5,7 @@ import { IconButton } from '@alfalab/core-components-icon-button/esm';
5
5
  import { CrossHeavyMIcon } from '@alfalab/icons-glyph/CrossHeavyMIcon';
6
6
  import { CrossMIcon } from '@alfalab/icons-glyph/CrossMIcon';
7
7
 
8
- var styles = {"closer":"navigation-bar-private__closer_1rtgg","button":"navigation-bar-private__button_1rtgg","mobile":"navigation-bar-private__mobile_1rtgg","sticky":"navigation-bar-private__sticky_1rtgg"};
8
+ var styles = {"closer":"navigation-bar-private__closer_216hm","button":"navigation-bar-private__button_216hm","mobile":"navigation-bar-private__mobile_216hm","sticky":"navigation-bar-private__sticky_216hm"};
9
9
  require('./index.css')
10
10
 
11
11
  var Closer = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: 67rl1 */
1
+ /* hash: 1gpbm */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-neutral-translucent-100: rgba(38, 55, 88, 0.06);
@@ -28,7 +28,7 @@
28
28
  --navigation-bar-closer-mobile-color: var(--color-light-neutral-translucent-700);
29
29
 
30
30
  /* back-arrow */
31
- } .navigation-bar-private__closer_1rtgg {
31
+ } .navigation-bar-private__closer_216hm {
32
32
  flex-shrink: 0;
33
33
  width: 48px;
34
34
  height: 48px;
@@ -36,17 +36,17 @@
36
36
  display: flex;
37
37
  align-items: center;
38
38
  justify-content: center;
39
- } .navigation-bar-private__button_1rtgg {
39
+ } .navigation-bar-private__button_216hm {
40
40
  background: var(--color-light-bg-primary-alpha-40);
41
41
  -webkit-backdrop-filter: blur(10px);
42
42
  backdrop-filter: blur(10px);
43
43
  color: var(--color-light-neutral-translucent-1300)
44
- } .navigation-bar-private__button_1rtgg.navigation-bar-private__mobile_1rtgg {
44
+ } .navigation-bar-private__button_216hm.navigation-bar-private__mobile_216hm {
45
45
  background: var(--color-light-neutral-translucent-100);
46
46
  color: var(--navigation-bar-closer-mobile-color);
47
- } .navigation-bar-private__button_1rtgg.navigation-bar-private__button_1rtgg {
47
+ } .navigation-bar-private__button_216hm.navigation-bar-private__button_216hm {
48
48
  border-radius: var(--border-radius-circle);
49
- } .navigation-bar-private__sticky_1rtgg {
49
+ } .navigation-bar-private__sticky_216hm {
50
50
  position: sticky;
51
51
  top: 0;
52
52
  }
package/esm/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 197le */
1
+ /* hash: 1mj0b */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-text-primary: rgba(3, 3, 6, 0.88);
@@ -20,28 +20,30 @@
20
20
  --gap-s: 12px; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
21
21
 
22
22
  /* новые значения, используйте их */
23
+ --gap-4: var(--gap-2xs);
24
+ --gap-12: var(--gap-s);
23
25
  } :root {
24
26
  } :root {
25
- } .navigation-bar-private__header_1mg8v {
27
+ } .navigation-bar-private__header_8xzyw {
26
28
  width: 100%;
27
29
  box-sizing: border-box;
28
30
  transition: box-shadow 0.2s ease, background 0.2s ease
29
- } .navigation-bar-private__header_1mg8v.navigation-bar-private__header_1mg8v.navigation-bar-private__backgroundImage_1mg8v {
31
+ } .navigation-bar-private__header_8xzyw.navigation-bar-private__header_8xzyw.navigation-bar-private__backgroundImage_8xzyw {
30
32
  background-repeat: no-repeat;
31
33
  background-position: center;
32
34
  background-size: cover;
33
- } .navigation-bar-private__mainLine_1mg8v {
35
+ } .navigation-bar-private__mainLine_8xzyw {
34
36
  display: flex;
35
37
  align-items: stretch;
36
38
  justify-content: space-between;
37
39
  z-index: 1;
38
40
  background-color: inherit;
39
- } .navigation-bar-private__mainLineSticky_1mg8v {
41
+ } .navigation-bar-private__mainLineSticky_8xzyw {
40
42
  position: sticky;
41
43
  top: 0;
42
- } .navigation-bar-private__mainLineWithImageBg_1mg8v {
44
+ } .navigation-bar-private__mainLineWithImageBg_8xzyw {
43
45
  background-color: initial;
44
- } .navigation-bar-private__content_1mg8v {
46
+ } .navigation-bar-private__content_8xzyw {
45
47
  color: var(--color-light-text-primary);
46
48
  display: flex;
47
49
  flex-flow: column nowrap;
@@ -50,27 +52,27 @@
50
52
  align-self: baseline;
51
53
  box-sizing: border-box;
52
54
  min-height: 48px
53
- } .navigation-bar-private__content_1mg8v.navigation-bar-private__withBothAddons_1mg8v,
54
- .navigation-bar-private__content_1mg8v.navigation-bar-private__withCompactTitle_1mg8v {
55
+ } .navigation-bar-private__content_8xzyw.navigation-bar-private__withBothAddons_8xzyw,
56
+ .navigation-bar-private__content_8xzyw.navigation-bar-private__withCompactTitle_8xzyw {
55
57
  font-size: 16px;
56
58
  line-height: 20px;
57
59
  font-weight: 500;
58
60
  align-self: center;
59
- padding-top: var(--gap-2xs);
60
- padding-bottom: var(--gap-2xs)
61
- } .navigation-bar-private__content_1mg8v.navigation-bar-private__withBothAddons_1mg8v > .navigation-bar-private__children_1mg8v,
62
- .navigation-bar-private__content_1mg8v.navigation-bar-private__withBothAddons_1mg8v > .navigation-bar-private__title_1mg8v,
63
- .navigation-bar-private__content_1mg8v.navigation-bar-private__withCompactTitle_1mg8v > .navigation-bar-private__children_1mg8v,
64
- .navigation-bar-private__content_1mg8v.navigation-bar-private__withCompactTitle_1mg8v > .navigation-bar-private__title_1mg8v {
61
+ padding-top: var(--gap-4);
62
+ padding-bottom: var(--gap-4)
63
+ } .navigation-bar-private__content_8xzyw.navigation-bar-private__withBothAddons_8xzyw > .navigation-bar-private__children_8xzyw,
64
+ .navigation-bar-private__content_8xzyw.navigation-bar-private__withBothAddons_8xzyw > .navigation-bar-private__title_8xzyw,
65
+ .navigation-bar-private__content_8xzyw.navigation-bar-private__withCompactTitle_8xzyw > .navigation-bar-private__children_8xzyw,
66
+ .navigation-bar-private__content_8xzyw.navigation-bar-private__withCompactTitle_8xzyw > .navigation-bar-private__title_8xzyw {
65
67
  -webkit-line-clamp: 1;
66
68
  word-break: break-all;
67
- } .navigation-bar-private__content_1mg8v.navigation-bar-private__contentOnBotDesktop_1mg8v.navigation-bar-private__contentOnBotDesktop_1mg8v {
68
- padding-top: var(--gap-s);
69
- } .navigation-bar-private__content_1mg8v.navigation-bar-private__contentOnBotMobile_1mg8v.navigation-bar-private__contentOnBotMobile_1mg8v {
70
- padding-top: var(--gap-s);
71
- } .navigation-bar-private__title_1mg8v {
69
+ } .navigation-bar-private__content_8xzyw.navigation-bar-private__contentOnBotDesktop_8xzyw.navigation-bar-private__contentOnBotDesktop_8xzyw {
70
+ padding-top: var(--gap-12);
71
+ } .navigation-bar-private__content_8xzyw.navigation-bar-private__contentOnBotMobile_8xzyw.navigation-bar-private__contentOnBotMobile_8xzyw {
72
+ padding-top: var(--gap-12);
73
+ } .navigation-bar-private__title_8xzyw {
72
74
  word-break: break-word;
73
- } .navigation-bar-private__subtitle_1mg8v {
75
+ } .navigation-bar-private__subtitle_8xzyw {
74
76
  font-size: 14px;
75
77
  line-height: 20px;
76
78
  font-weight: 400;
@@ -81,11 +83,11 @@
81
83
 
82
84
  color: var(--color-light-text-secondary);
83
85
  word-break: break-all;
84
- } .navigation-bar-private__addonsWrapper_1mg8v {
86
+ } .navigation-bar-private__addonsWrapper_8xzyw {
85
87
  display: flex;
86
- } .navigation-bar-private__rightAddons_1mg8v {
88
+ } .navigation-bar-private__rightAddons_8xzyw {
87
89
  margin-left: auto;
88
- } .navigation-bar-private__addon_1mg8v {
90
+ } .navigation-bar-private__addon_8xzyw {
89
91
  min-width: 48px;
90
92
  height: 48px;
91
93
  display: flex;
@@ -93,18 +95,18 @@
93
95
  align-items: center;
94
96
  flex-shrink: 0;
95
97
  pointer-events: all;
96
- } .navigation-bar-private__bottomAddons_1mg8v {
98
+ } .navigation-bar-private__bottomAddons_8xzyw {
97
99
  pointer-events: all;
98
- } .navigation-bar-private__closer_1mg8v {
100
+ } .navigation-bar-private__closer_8xzyw {
99
101
  margin-left: auto;
100
- } .navigation-bar-private__left_1mg8v {
102
+ } .navigation-bar-private__left_8xzyw {
101
103
  text-align: left;
102
- } .navigation-bar-private__center_1mg8v {
104
+ } .navigation-bar-private__center_8xzyw {
103
105
  text-align: center;
104
- } .navigation-bar-private__trim_1mg8v {
106
+ } .navigation-bar-private__trim_8xzyw {
105
107
  overflow: hidden
106
- } .navigation-bar-private__trim_1mg8v .navigation-bar-private__title_1mg8v,
107
- .navigation-bar-private__trim_1mg8v .navigation-bar-private__children_1mg8v {
108
+ } .navigation-bar-private__trim_8xzyw .navigation-bar-private__title_8xzyw,
109
+ .navigation-bar-private__trim_8xzyw .navigation-bar-private__children_8xzyw {
108
110
  -webkit-line-clamp: 2;
109
111
  display: -webkit-box;
110
112
  -webkit-box-orient: vertical;