@alfalab/core-components-side-panel 5.0.1 → 5.1.1

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 (132) hide show
  1. package/Component.responsive.js +0 -13
  2. package/components/content/Component.desktop.js +1 -5
  3. package/components/content/Component.js +1 -2
  4. package/components/content/Component.mobile.js +1 -5
  5. package/components/content/desktop.css +3 -3
  6. package/components/content/index.css +4 -4
  7. package/components/content/mobile.css +3 -3
  8. package/components/controls/Component.js +4 -4
  9. package/components/controls/index.css +2 -2
  10. package/components/controls/index.js +0 -5
  11. package/components/footer/Component.desktop.js +1 -6
  12. package/components/footer/Component.js +2 -3
  13. package/components/footer/Component.mobile.js +1 -6
  14. package/components/footer/desktop.css +3 -3
  15. package/components/footer/index.css +4 -4
  16. package/components/footer/layout.css +17 -17
  17. package/components/footer/mobile.css +3 -3
  18. package/components/header/Component.js +4 -5
  19. package/components/header/desktop.css +5 -5
  20. package/components/header/index.css +14 -14
  21. package/components/header/mobile.css +4 -4
  22. package/cssm/Component.responsive.js +0 -27
  23. package/cssm/components/content/Component.desktop.js +0 -5
  24. package/cssm/components/content/Component.js +0 -1
  25. package/cssm/components/content/Component.mobile.js +0 -5
  26. package/cssm/components/controls/Component.js +2 -2
  27. package/cssm/components/controls/index.js +0 -6
  28. package/cssm/components/footer/Component.desktop.js +0 -6
  29. package/cssm/components/footer/Component.js +0 -1
  30. package/cssm/components/footer/Component.mobile.js +0 -6
  31. package/cssm/components/header/Component.js +1 -2
  32. package/cssm/desktop/Component.desktop.js +0 -15
  33. package/cssm/desktop/index.js +0 -27
  34. package/cssm/index.js +0 -36
  35. package/cssm/mobile/Component.mobile.js +0 -14
  36. package/cssm/mobile/index.js +0 -25
  37. package/cssm/shared/index.d.ts +1 -0
  38. package/cssm/shared/index.js +2 -1
  39. package/cssm/utils.d.ts +11 -0
  40. package/cssm/utils.js +20 -0
  41. package/desktop/Component.desktop.js +2 -9
  42. package/desktop/desktop.css +3 -3
  43. package/desktop/index.js +0 -17
  44. package/desktop/transitions.desktop.css +7 -7
  45. package/esm/Component.responsive.js +0 -13
  46. package/esm/components/content/Component.desktop.js +1 -5
  47. package/esm/components/content/Component.js +1 -2
  48. package/esm/components/content/Component.mobile.js +1 -5
  49. package/esm/components/content/desktop.css +3 -3
  50. package/esm/components/content/index.css +4 -4
  51. package/esm/components/content/mobile.css +3 -3
  52. package/esm/components/controls/Component.js +4 -4
  53. package/esm/components/controls/index.css +2 -2
  54. package/esm/components/controls/index.js +0 -5
  55. package/esm/components/footer/Component.desktop.js +1 -6
  56. package/esm/components/footer/Component.js +2 -3
  57. package/esm/components/footer/Component.mobile.js +1 -6
  58. package/esm/components/footer/desktop.css +3 -3
  59. package/esm/components/footer/index.css +4 -4
  60. package/esm/components/footer/layout.css +17 -17
  61. package/esm/components/footer/mobile.css +3 -3
  62. package/esm/components/header/Component.js +4 -5
  63. package/esm/components/header/desktop.css +5 -5
  64. package/esm/components/header/index.css +14 -14
  65. package/esm/components/header/mobile.css +4 -4
  66. package/esm/desktop/Component.desktop.js +2 -9
  67. package/esm/desktop/desktop.css +3 -3
  68. package/esm/desktop/index.js +0 -17
  69. package/esm/desktop/transitions.desktop.css +7 -7
  70. package/esm/index.js +0 -22
  71. package/esm/layout.module-9b1b1597.js +4 -0
  72. package/esm/mobile/Component.mobile.js +2 -8
  73. package/esm/mobile/index.js +0 -15
  74. package/esm/mobile/mobile.css +4 -4
  75. package/esm/mobile/transitions.mobile.css +8 -8
  76. package/esm/shared/index.d.ts +1 -0
  77. package/esm/shared/index.js +1 -1
  78. package/esm/utils.d.ts +11 -0
  79. package/esm/utils.js +16 -0
  80. package/index.js +0 -22
  81. package/layout.module-63bb425f.js +6 -0
  82. package/mobile/Component.mobile.js +2 -8
  83. package/mobile/index.js +0 -15
  84. package/mobile/mobile.css +4 -4
  85. package/mobile/transitions.mobile.css +8 -8
  86. package/modern/Component.responsive.js +0 -13
  87. package/modern/components/content/Component.desktop.js +1 -5
  88. package/modern/components/content/Component.js +1 -2
  89. package/modern/components/content/Component.mobile.js +1 -5
  90. package/modern/components/content/desktop.css +3 -3
  91. package/modern/components/content/index.css +4 -4
  92. package/modern/components/content/mobile.css +3 -3
  93. package/modern/components/controls/Component.js +3 -3
  94. package/modern/components/controls/index.css +2 -2
  95. package/modern/components/controls/index.js +0 -5
  96. package/modern/components/footer/Component.desktop.js +1 -6
  97. package/modern/components/footer/Component.js +2 -3
  98. package/modern/components/footer/Component.mobile.js +1 -6
  99. package/modern/components/footer/desktop.css +3 -3
  100. package/modern/components/footer/index.css +4 -4
  101. package/modern/components/footer/layout.css +17 -17
  102. package/modern/components/footer/mobile.css +3 -3
  103. package/modern/components/header/Component.js +4 -5
  104. package/modern/components/header/desktop.css +5 -5
  105. package/modern/components/header/index.css +14 -14
  106. package/modern/components/header/mobile.css +4 -4
  107. package/modern/desktop/Component.desktop.js +2 -9
  108. package/modern/desktop/desktop.css +3 -3
  109. package/modern/desktop/index.js +0 -16
  110. package/modern/desktop/transitions.desktop.css +7 -7
  111. package/modern/index.js +0 -21
  112. package/modern/layout.module-294dd7f0.js +4 -0
  113. package/modern/mobile/Component.mobile.js +2 -8
  114. package/modern/mobile/index.js +0 -14
  115. package/modern/mobile/mobile.css +4 -4
  116. package/modern/mobile/transitions.mobile.css +8 -8
  117. package/modern/shared/index.d.ts +1 -0
  118. package/modern/shared/index.js +1 -1
  119. package/modern/utils.d.ts +11 -0
  120. package/modern/utils.js +16 -0
  121. package/package.json +5 -5
  122. package/shared/index.d.ts +1 -0
  123. package/shared/index.js +2 -1
  124. package/src/components/controls/Component.tsx +1 -1
  125. package/src/components/header/Component.tsx +1 -1
  126. package/src/shared/index.ts +1 -0
  127. package/src/utils.ts +14 -0
  128. package/utils.d.ts +11 -0
  129. package/utils.js +20 -0
  130. package/esm/layout.module-31951bef.js +0 -4
  131. package/layout.module-2f71de49.js +0 -6
  132. package/modern/layout.module-a8ffdbd1.js +0 -4
@@ -1,4 +1,4 @@
1
- /* hash: yf1yt */
1
+ /* hash: cotma */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-modal-bg-primary: #fff;
@@ -32,15 +32,15 @@
32
32
  /* mobile */
33
33
 
34
34
  /* paddings */
35
- } .side-panel__footer_3jdk9 {
35
+ } .side-panel__footer_19kfm {
36
36
  width: 100%;
37
37
  box-sizing: border-box;
38
38
  transition: box-shadow 0.2s ease, background 0.2s ease;
39
- } .side-panel__sticky_3jdk9 {
39
+ } .side-panel__sticky_19kfm {
40
40
  background: var(--side-panel-footer-background);
41
41
  position: sticky;
42
42
  z-index: 1;
43
- } .side-panel__highlighted_3jdk9 {
43
+ } .side-panel__highlighted_19kfm {
44
44
  background: var(--side-panel-footer-highlight-background);
45
45
  box-shadow: var(--side-panel-footer-highlight-box-shadow);
46
46
  }
@@ -1,4 +1,4 @@
1
- /* hash: l7kmt */
1
+ /* hash: 1yigc */
2
2
  :root {
3
3
  } /* deprecated */ :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 */
4
4
  } :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 */
@@ -31,35 +31,35 @@
31
31
  /* mobile */
32
32
 
33
33
  /* paddings */
34
- } .side-panel__column_16gdu {
34
+ } .side-panel__column_1f5tc {
35
35
  display: flex;
36
36
  flex-direction: column
37
- } .side-panel__column_16gdu > *:not(:last-child):not(:only-child) {
37
+ } .side-panel__column_1f5tc > *:not(:last-child):not(:only-child) {
38
38
  margin-bottom: var(--side-panel-footer-default-gap);
39
- } .side-panel__column_16gdu.side-panel__gap-16_16gdu > *:not(:last-child):not(:only-child) {
39
+ } .side-panel__column_1f5tc.side-panel__gap-16_1f5tc > *:not(:last-child):not(:only-child) {
40
40
  margin-bottom: var(--gap-m);
41
- } .side-panel__column_16gdu.side-panel__gap-24_16gdu > *:not(:last-child):not(:only-child) {
41
+ } .side-panel__column_1f5tc.side-panel__gap-24_1f5tc > *:not(:last-child):not(:only-child) {
42
42
  margin-bottom: var(--gap-xl);
43
- } .side-panel__column_16gdu.side-panel__gap-32_16gdu > *:not(:last-child):not(:only-child) {
43
+ } .side-panel__column_1f5tc.side-panel__gap-32_1f5tc > *:not(:last-child):not(:only-child) {
44
44
  margin-bottom: var(--gap-2xl);
45
- } .side-panel__start_16gdu {
45
+ } .side-panel__start_1f5tc {
46
46
  justify-content: flex-start;
47
- } .side-panel__center_16gdu {
47
+ } .side-panel__center_1f5tc {
48
48
  justify-content: center;
49
- } .side-panel__space-between_16gdu {
49
+ } .side-panel__space-between_1f5tc {
50
50
  justify-content: space-between
51
- } .side-panel__space-between_16gdu > * {
51
+ } .side-panel__space-between_1f5tc > * {
52
52
  flex: 1;
53
- } .side-panel__start_16gdu,
54
- .side-panel__center_16gdu,
55
- .side-panel__space-between_16gdu {
53
+ } .side-panel__start_1f5tc,
54
+ .side-panel__center_1f5tc,
55
+ .side-panel__space-between_1f5tc {
56
56
  display: flex
57
- } .side-panel__start_16gdu > *:not(:last-child):not(:only-child), .side-panel__center_16gdu > *:not(:last-child):not(:only-child), .side-panel__space-between_16gdu > *:not(:last-child):not(:only-child) {
57
+ } .side-panel__start_1f5tc > *:not(:last-child):not(:only-child), .side-panel__center_1f5tc > *:not(:last-child):not(:only-child), .side-panel__space-between_1f5tc > *:not(:last-child):not(:only-child) {
58
58
  margin-right: var(--side-panel-footer-default-gap);
59
- } .side-panel__start_16gdu.side-panel__gap-16_16gdu > *:not(:last-child):not(:only-child), .side-panel__center_16gdu.side-panel__gap-16_16gdu > *:not(:last-child):not(:only-child), .side-panel__space-between_16gdu.side-panel__gap-16_16gdu > *:not(:last-child):not(:only-child) {
59
+ } .side-panel__start_1f5tc.side-panel__gap-16_1f5tc > *:not(:last-child):not(:only-child), .side-panel__center_1f5tc.side-panel__gap-16_1f5tc > *:not(:last-child):not(:only-child), .side-panel__space-between_1f5tc.side-panel__gap-16_1f5tc > *:not(:last-child):not(:only-child) {
60
60
  margin-right: var(--gap-m);
61
- } .side-panel__start_16gdu.side-panel__gap-24_16gdu > *:not(:last-child):not(:only-child), .side-panel__center_16gdu.side-panel__gap-24_16gdu > *:not(:last-child):not(:only-child), .side-panel__space-between_16gdu.side-panel__gap-24_16gdu > *:not(:last-child):not(:only-child) {
61
+ } .side-panel__start_1f5tc.side-panel__gap-24_1f5tc > *:not(:last-child):not(:only-child), .side-panel__center_1f5tc.side-panel__gap-24_1f5tc > *:not(:last-child):not(:only-child), .side-panel__space-between_1f5tc.side-panel__gap-24_1f5tc > *:not(:last-child):not(:only-child) {
62
62
  margin-right: var(--gap-xl);
63
- } .side-panel__start_16gdu.side-panel__gap-32_16gdu > *:not(:last-child):not(:only-child), .side-panel__center_16gdu.side-panel__gap-32_16gdu > *:not(:last-child):not(:only-child), .side-panel__space-between_16gdu.side-panel__gap-32_16gdu > *:not(:last-child):not(:only-child) {
63
+ } .side-panel__start_1f5tc.side-panel__gap-32_1f5tc > *:not(:last-child):not(:only-child), .side-panel__center_1f5tc.side-panel__gap-32_1f5tc > *:not(:last-child):not(:only-child), .side-panel__space-between_1f5tc.side-panel__gap-32_1f5tc > *:not(:last-child):not(:only-child) {
64
64
  margin-right: var(--gap-2xl);
65
65
  }
@@ -1,4 +1,4 @@
1
- /* hash: 179i8 */
1
+ /* hash: wtkmb */
2
2
  :root {
3
3
  } /* deprecated */ :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 */
4
4
  } :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 */
@@ -28,8 +28,8 @@
28
28
  /* mobile */
29
29
 
30
30
  /* paddings */
31
- } .side-panel__footer_1e4vh {
31
+ } .side-panel__footer_irfh8 {
32
32
  padding: var(--gap-m);
33
- } .side-panel__sticky_1e4vh {
33
+ } .side-panel__sticky_irfh8 {
34
34
  bottom: 0;
35
35
  }
@@ -5,15 +5,14 @@ import { NavigationBar } from '@alfalab/core-components-navigation-bar/esm';
5
5
  import { getDataTestId } from '@alfalab/core-components-shared/esm';
6
6
  import { ModalContext } from '../../Context.js';
7
7
  import { ResponsiveContext } from '../../ResponsiveContext.js';
8
- import '@alfalab/core-components-base-modal/esm';
9
8
 
10
- var desktopStyles = {"content":"side-panel__content_go813","s":"side-panel__s_go813","sticky":"side-panel__sticky_go813"};
9
+ var desktopStyles = {"content":"side-panel__content_18061","s":"side-panel__s_18061","sticky":"side-panel__sticky_18061"};
11
10
  require('./desktop.css')
12
11
 
13
- var styles = {"header":"side-panel__header_fxc9s","hasContent":"side-panel__hasContent_fxc9s","highlighted":"side-panel__highlighted_fxc9s","sticky":"side-panel__sticky_fxc9s","backgroundImage":"side-panel__backgroundImage_fxc9s","content":"side-panel__content_fxc9s","title":"side-panel__title_fxc9s","addon":"side-panel__addon_fxc9s","closer":"side-panel__closer_fxc9s","right":"side-panel__right_fxc9s","trim":"side-panel__trim_fxc9s"};
12
+ var styles = {"header":"side-panel__header_5jssm","hasContent":"side-panel__hasContent_5jssm","highlighted":"side-panel__highlighted_5jssm","sticky":"side-panel__sticky_5jssm","backgroundImage":"side-panel__backgroundImage_5jssm","content":"side-panel__content_5jssm","title":"side-panel__title_5jssm","addon":"side-panel__addon_5jssm","closer":"side-panel__closer_5jssm","right":"side-panel__right_5jssm","trim":"side-panel__trim_5jssm"};
14
13
  require('./index.css')
15
14
 
16
- var mobileStyles = {"header":"side-panel__header_bla0h","sticky":"side-panel__sticky_bla0h","content":"side-panel__content_bla0h"};
15
+ var mobileStyles = {"header":"side-panel__header_wv307","sticky":"side-panel__sticky_wv307","content":"side-panel__content_wv307"};
17
16
  require('./mobile.css')
18
17
 
19
18
  var Header = function (_a) {
@@ -25,7 +24,7 @@ var Header = function (_a) {
25
24
  setHasHeader(true);
26
25
  }, [setHasHeader]);
27
26
  var hasContent = Boolean(title || children);
28
- return (React.createElement(NavigationBar, __assign({}, restProps, { dataTestId: getDataTestId(dataTestId, 'header'), scrollableParentRef: componentRef, view: view, sticky: sticky, title: title, hasCloser: hasCloser, onClose: onClose, className: cn(styles.header, className, (_b = {},
27
+ return (React.createElement(NavigationBar, __assign({ dataTestId: getDataTestId(dataTestId, 'header') }, restProps, { scrollableParentRef: componentRef, view: view, sticky: sticky, title: title, hasCloser: hasCloser, onClose: onClose, className: cn(styles.header, className, (_b = {},
29
28
  _b[styles.highlighted] = hasContent && sticky && headerHighlighted,
30
29
  _b[styles.sticky] = sticky,
31
30
  _b[styles.hasContent] = hasContent,
@@ -1,4 +1,4 @@
1
- /* hash: 41ofx */
1
+ /* hash: 3zqj2 */
2
2
  :root {
3
3
  } /* deprecated */ :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 */
4
4
  } :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 */
@@ -37,15 +37,15 @@
37
37
  /* mobile */
38
38
 
39
39
  /* paddings */
40
- } .side-panel__content_go813 {
40
+ } .side-panel__content_18061 {
41
41
  font-weight: var(--side-panel-header-desktop-font-weight);
42
42
  font-family: var(--side-panel-header-desktop-font-family);
43
- } .side-panel__s_go813 .side-panel__content_go813 {
43
+ } .side-panel__s_18061 .side-panel__content_18061 {
44
44
  padding: var(--side-panel-s-header-desktop-content-paddings);
45
45
  font-size: var(--side-panel-s-header-desktop-font-size);
46
46
  line-height: var(--side-panel-s-header-desktop-line-height);
47
- } .side-panel__s_go813 {
47
+ } .side-panel__s_18061 {
48
48
  padding: var(--side-panel-s-header-paddings);
49
- } .side-panel__sticky_go813 {
49
+ } .side-panel__sticky_18061 {
50
50
  top: 0;
51
51
  }
@@ -1,4 +1,4 @@
1
- /* hash: 1tlp8 */
1
+ /* hash: 1tjrb */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-modal-bg-primary: #fff;
@@ -32,42 +32,42 @@
32
32
  /* mobile */
33
33
 
34
34
  /* paddings */
35
- } .side-panel__header_fxc9s {
35
+ } .side-panel__header_5jssm {
36
36
  width: 100%;
37
37
  box-sizing: border-box;
38
38
  transition: box-shadow 0.2s ease, background 0.2s ease
39
- } .side-panel__header_fxc9s:not(.side-panel__hasContent_fxc9s) {
39
+ } .side-panel__header_5jssm:not(.side-panel__hasContent_5jssm) {
40
40
  pointer-events: none;
41
- } .side-panel__highlighted_fxc9s {
41
+ } .side-panel__highlighted_5jssm {
42
42
  background: var(--side-panel-header-highlight-background);
43
43
  box-shadow: var(--side-panel-header-highlight-box-shadow);
44
- } .side-panel__sticky_fxc9s {
44
+ } .side-panel__sticky_5jssm {
45
45
  position: sticky;
46
46
  z-index: 1
47
- } .side-panel__sticky_fxc9s.side-panel__hasContent_fxc9s {
47
+ } .side-panel__sticky_5jssm.side-panel__hasContent_5jssm {
48
48
  background: var(--side-panel-header-background);
49
- } .side-panel__header_fxc9s.side-panel__backgroundImage_fxc9s {
49
+ } .side-panel__header_5jssm.side-panel__backgroundImage_5jssm {
50
50
  background: center no-repeat;
51
51
  background-size: cover;
52
- } .side-panel__content_fxc9s {
52
+ } .side-panel__content_5jssm {
53
53
  flex-grow: 1;
54
- } .side-panel__title_fxc9s {
54
+ } .side-panel__title_5jssm {
55
55
  word-break: break-word;
56
- } .side-panel__addon_fxc9s {
56
+ } .side-panel__addon_5jssm {
57
57
  min-width: 48px;
58
58
  height: 48px;
59
59
  display: flex;
60
60
  justify-content: center;
61
61
  align-items: center;
62
62
  pointer-events: all;
63
- } .side-panel__closer_fxc9s {
63
+ } .side-panel__closer_5jssm {
64
64
  margin-left: auto;
65
- } .side-panel__right_fxc9s {
65
+ } .side-panel__right_5jssm {
66
66
  justify-content: flex-end;
67
67
  text-align: right;
68
- } .side-panel__trim_fxc9s {
68
+ } .side-panel__trim_5jssm {
69
69
  overflow: hidden
70
- } .side-panel__trim_fxc9s .side-panel__title_fxc9s {
70
+ } .side-panel__trim_5jssm .side-panel__title_5jssm {
71
71
  overflow: hidden;
72
72
  white-space: nowrap;
73
73
  text-overflow: ellipsis;
@@ -1,4 +1,4 @@
1
- /* hash: 1rqwq */
1
+ /* hash: 1haz4 */
2
2
  :root {
3
3
  } /* deprecated */ :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 */
4
4
  } :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 */
@@ -38,11 +38,11 @@
38
38
 
39
39
  /* paddings */
40
40
  --side-panel-header-mobile-paddings: var(--gap-2xs) var(--gap-xs);
41
- } .side-panel__header_bla0h {
41
+ } .side-panel__header_wv307 {
42
42
  padding: var(--side-panel-header-mobile-paddings);
43
- } .side-panel__sticky_bla0h {
43
+ } .side-panel__sticky_wv307 {
44
44
  top: 0;
45
- } .side-panel__content_bla0h {
45
+ } .side-panel__content_wv307 {
46
46
  font-size: var(--side-panel-header-mobile-font-size);
47
47
  line-height: var(--side-panel-header-mobile-line-height);
48
48
  font-family: var(--side-panel-header-mobile-font-family);
@@ -8,18 +8,11 @@ import { Controls } from '../components/controls/Component.js';
8
8
  import { FooterDesktop } from '../components/footer/Component.desktop.js';
9
9
  import { Header } from '../components/header/Component.js';
10
10
  import { ResponsiveContext } from '../ResponsiveContext.js';
11
- import '../components/content/Component.js';
12
- import '@alfalab/core-components-shared/esm';
13
- import '../Context.js';
14
- import '@alfalab/core-components-base-modal/esm';
15
- import '../layout.module-31951bef.js';
16
- import '../components/footer/Component.js';
17
- import '@alfalab/core-components-navigation-bar/esm';
18
11
 
19
- var styles = {"s":"side-panel__s_1nqpu","hidden":"side-panel__hidden_1nqpu"};
12
+ var styles = {"s":"side-panel__s_1q7bn","hidden":"side-panel__hidden_1q7bn"};
20
13
  require('./desktop.css')
21
14
 
22
- var transitions = {"enterRight":"side-panel__enterRight_74yrs","enterLeft":"side-panel__enterLeft_74yrs","enterActive":"side-panel__enterActive_74yrs","exit":"side-panel__exit_74yrs","exitActiveRight":"side-panel__exitActiveRight_74yrs","exitActiveLeft":"side-panel__exitActiveLeft_74yrs"};
15
+ var transitions = {"enterRight":"side-panel__enterRight_935bb","enterLeft":"side-panel__enterLeft_935bb","enterActive":"side-panel__enterActive_935bb","exit":"side-panel__exit_935bb","exitActiveRight":"side-panel__exitActiveRight_935bb","exitActiveLeft":"side-panel__exitActiveLeft_935bb"};
23
16
  require('./transitions.desktop.css')
24
17
 
25
18
  var SidePanelDesktopComponent = forwardRef(function (_a, ref) {
@@ -1,4 +1,4 @@
1
- /* hash: 1omtc */
1
+ /* hash: yggkd */
2
2
  :root {
3
3
  } /* deprecated */ :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 */
4
4
  } :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 */
@@ -28,8 +28,8 @@
28
28
  /* mobile */
29
29
 
30
30
  /* paddings */
31
- } .side-panel__s_1nqpu.side-panel__s_1nqpu {
31
+ } .side-panel__s_1q7bn.side-panel__s_1q7bn {
32
32
  width: var(--side-panel-s-width);
33
- } .side-panel__hidden_1nqpu {
33
+ } .side-panel__hidden_1q7bn {
34
34
  overflow-x: hidden;
35
35
  }
@@ -1,18 +1 @@
1
1
  export { SidePanelDesktop } from './Component.desktop.js';
2
- import 'tslib';
3
- import 'react';
4
- import 'react-merge-refs';
5
- import 'classnames';
6
- import '@alfalab/core-components-drawer/esm';
7
- import '../components/content/Component.desktop.js';
8
- import '../components/content/Component.js';
9
- import '@alfalab/core-components-shared/esm';
10
- import '../Context.js';
11
- import '@alfalab/core-components-base-modal/esm';
12
- import '../ResponsiveContext.js';
13
- import '../components/controls/Component.js';
14
- import '../layout.module-31951bef.js';
15
- import '../components/footer/Component.desktop.js';
16
- import '../components/footer/Component.js';
17
- import '../components/header/Component.js';
18
- import '@alfalab/core-components-navigation-bar/esm';
@@ -1,32 +1,32 @@
1
- /* hash: 10z53 */
2
- .side-panel__enterRight_74yrs {
1
+ /* hash: qj7i0 */
2
+ .side-panel__enterRight_935bb {
3
3
  opacity: 0;
4
4
  transform: translateX(15px);
5
5
  }
6
6
 
7
- .side-panel__enterLeft_74yrs {
7
+ .side-panel__enterLeft_935bb {
8
8
  opacity: 0;
9
9
  transform: translateX(-15px);
10
10
  }
11
11
 
12
- .side-panel__enterActive_74yrs {
12
+ .side-panel__enterActive_935bb {
13
13
  opacity: 1;
14
14
  transform: translateX(0);
15
15
  transition: opacity 200ms ease-in, transform 200ms ease-in;
16
16
  }
17
17
 
18
- .side-panel__exit_74yrs {
18
+ .side-panel__exit_935bb {
19
19
  opacity: 1;
20
20
  transform: translateX(0);
21
21
  }
22
22
 
23
- .side-panel__exitActiveRight_74yrs {
23
+ .side-panel__exitActiveRight_935bb {
24
24
  opacity: 0;
25
25
  transition: opacity 200ms ease-out, transform 200ms ease-out;
26
26
  transform: translateX(15px);
27
27
  }
28
28
 
29
- .side-panel__exitActiveLeft_74yrs {
29
+ .side-panel__exitActiveLeft_935bb {
30
30
  opacity: 0;
31
31
  transition: opacity 200ms ease-out, transform 200ms ease-out;
32
32
  transform: translateX(-15px);
package/esm/index.js CHANGED
@@ -1,23 +1 @@
1
1
  export { SidePanelResponsive as SidePanel } from './Component.responsive.js';
2
- import 'tslib';
3
- import 'react';
4
- import '@alfalab/core-components-mq/esm';
5
- import '@alfalab/core-components-shared/esm';
6
- import './components/controls/Component.js';
7
- import 'classnames';
8
- import './ResponsiveContext.js';
9
- import './layout.module-31951bef.js';
10
- import './components/header/Component.js';
11
- import '@alfalab/core-components-navigation-bar/esm';
12
- import './Context.js';
13
- import '@alfalab/core-components-base-modal/esm';
14
- import './desktop/Component.desktop.js';
15
- import 'react-merge-refs';
16
- import '@alfalab/core-components-drawer/esm';
17
- import './components/content/Component.desktop.js';
18
- import './components/content/Component.js';
19
- import './components/footer/Component.desktop.js';
20
- import './components/footer/Component.js';
21
- import './mobile/Component.mobile.js';
22
- import './components/content/Component.mobile.js';
23
- import './components/footer/Component.mobile.js';
@@ -0,0 +1,4 @@
1
+ var layoutStyles = {"column":"side-panel__column_1f5tc","gap-16":"side-panel__gap-16_1f5tc","gap-24":"side-panel__gap-24_1f5tc","gap-32":"side-panel__gap-32_1f5tc","start":"side-panel__start_1f5tc","center":"side-panel__center_1f5tc","space-between":"side-panel__space-between_1f5tc"};
2
+ require('./components/footer/layout.css')
3
+
4
+ export { layoutStyles as l };
@@ -7,17 +7,11 @@ import { Controls } from '../components/controls/Component.js';
7
7
  import { FooterMobile } from '../components/footer/Component.mobile.js';
8
8
  import { Header } from '../components/header/Component.js';
9
9
  import { ResponsiveContext } from '../ResponsiveContext.js';
10
- import '../components/content/Component.js';
11
- import '@alfalab/core-components-shared/esm';
12
- import '../Context.js';
13
- import '../layout.module-31951bef.js';
14
- import '../components/footer/Component.js';
15
- import '@alfalab/core-components-navigation-bar/esm';
16
10
 
17
- var styles = {"component":"side-panel__component_1050h","mobileContent":"side-panel__mobileContent_1050h"};
11
+ var styles = {"component":"side-panel__component_74yh8","mobileContent":"side-panel__mobileContent_74yh8"};
18
12
  require('./mobile.css')
19
13
 
20
- var transitions = {"appear":"side-panel__appear_1lrki","enter":"side-panel__enter_1lrki","appearActive":"side-panel__appearActive_1lrki","enterActive":"side-panel__enterActive_1lrki","exit":"side-panel__exit_1lrki","exitActive":"side-panel__exitActive_1lrki","exitDone":"side-panel__exitDone_1lrki"};
14
+ var transitions = {"appear":"side-panel__appear_1be11","enter":"side-panel__enter_1be11","appearActive":"side-panel__appearActive_1be11","enterActive":"side-panel__enterActive_1be11","exit":"side-panel__exit_1be11","exitActive":"side-panel__exitActive_1be11","exitDone":"side-panel__exitDone_1be11"};
21
15
  require('./transitions.mobile.css')
22
16
 
23
17
  var SidePanelMobileComponent = forwardRef(function (_a, ref) {
@@ -1,16 +1 @@
1
1
  export { SidePanelMobile } from './Component.mobile.js';
2
- import 'tslib';
3
- import 'react';
4
- import 'classnames';
5
- import '@alfalab/core-components-base-modal/esm';
6
- import '../components/content/Component.mobile.js';
7
- import '../components/content/Component.js';
8
- import '@alfalab/core-components-shared/esm';
9
- import '../Context.js';
10
- import '../ResponsiveContext.js';
11
- import '../components/controls/Component.js';
12
- import '../layout.module-31951bef.js';
13
- import '../components/footer/Component.mobile.js';
14
- import '../components/footer/Component.js';
15
- import '../components/header/Component.js';
16
- import '@alfalab/core-components-navigation-bar/esm';
@@ -1,4 +1,4 @@
1
- /* hash: uxsui */
1
+ /* hash: 97khz */
2
2
  :root {
3
3
  } /* deprecated */ :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 */
4
4
  } :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 */
@@ -27,17 +27,17 @@
27
27
  /* mobile */
28
28
 
29
29
  /* paddings */
30
- } .side-panel__component_1050h {
30
+ } .side-panel__component_74yh8 {
31
31
  top: 0;
32
32
  height: 100%;
33
33
  width: 100%;
34
34
  overflow-x: hidden;
35
35
  overflow-y: auto;
36
36
  max-width: 600px;
37
- } .side-panel__component_1050h.side-panel__component_1050h {
37
+ } .side-panel__component_74yh8.side-panel__component_74yh8 {
38
38
  position: fixed;
39
39
  flex: 1;
40
- } .side-panel__mobileContent_1050h {
40
+ } .side-panel__mobileContent_74yh8 {
41
41
  display: flex;
42
42
  flex-direction: column;
43
43
  width: 100%;
@@ -1,24 +1,24 @@
1
- /* hash: ntku8 */
2
- .side-panel__appear_1lrki,
3
- .side-panel__enter_1lrki {
1
+ /* hash: nrmxe */
2
+ .side-panel__appear_1be11,
3
+ .side-panel__enter_1be11 {
4
4
  opacity: 0;
5
5
  transform: translateY(15px);
6
6
  }
7
7
 
8
- .side-panel__appearActive_1lrki,
9
- .side-panel__enterActive_1lrki {
8
+ .side-panel__appearActive_1be11,
9
+ .side-panel__enterActive_1be11 {
10
10
  opacity: 1;
11
11
  transform: translateY(0);
12
12
  transition: opacity 200ms ease-in, transform 200ms ease-in;
13
13
  }
14
14
 
15
- .side-panel__exit_1lrki {
15
+ .side-panel__exit_1be11 {
16
16
  opacity: 1;
17
17
  transform: translateY(0);
18
18
  }
19
19
 
20
- .side-panel__exitActive_1lrki,
21
- .side-panel__exitDone_1lrki {
20
+ .side-panel__exitActive_1be11,
21
+ .side-panel__exitDone_1be11 {
22
22
  opacity: 0;
23
23
  transform: translateY(15px);
24
24
  transition: opacity 200ms ease-out, transform 200ms ease-out;
@@ -1 +1,2 @@
1
1
  export { ModalContext } from "../Context";
2
+ export { getSidePanelTestIds } from "../utils";
@@ -1,2 +1,2 @@
1
1
  export { ModalContext } from '../Context.js';
2
- import '@alfalab/core-components-base-modal/esm';
2
+ export { getSidePanelTestIds } from '../utils.js';
package/esm/utils.d.ts ADDED
@@ -0,0 +1,11 @@
1
+ declare function getSidePanelTestIds(dataTestId: string): {
2
+ modal: string;
3
+ content: string;
4
+ footer: string;
5
+ controls: string;
6
+ header: string;
7
+ title: string;
8
+ closer: string;
9
+ backButton: string;
10
+ };
11
+ export { getSidePanelTestIds };
package/esm/utils.js ADDED
@@ -0,0 +1,16 @@
1
+ import { getDataTestId } from '@alfalab/core-components-shared/esm';
2
+
3
+ function getSidePanelTestIds(dataTestId) {
4
+ return {
5
+ modal: dataTestId,
6
+ content: getDataTestId(dataTestId, 'content'),
7
+ footer: getDataTestId(dataTestId, 'footer'),
8
+ controls: getDataTestId(dataTestId, 'controls'),
9
+ header: getDataTestId(dataTestId, 'header'),
10
+ title: getDataTestId(dataTestId, 'header-title'),
11
+ closer: getDataTestId(dataTestId, 'header-closer'),
12
+ backButton: getDataTestId(dataTestId, 'header-back-button'),
13
+ };
14
+ }
15
+
16
+ export { getSidePanelTestIds };
package/index.js CHANGED
@@ -3,28 +3,6 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var Component_responsive = require('./Component.responsive.js');
6
- require('tslib');
7
- require('react');
8
- require('@alfalab/core-components-mq');
9
- require('@alfalab/core-components-shared');
10
- require('./components/controls/Component.js');
11
- require('classnames');
12
- require('./ResponsiveContext.js');
13
- require('./layout.module-2f71de49.js');
14
- require('./components/header/Component.js');
15
- require('@alfalab/core-components-navigation-bar');
16
- require('./Context.js');
17
- require('@alfalab/core-components-base-modal');
18
- require('./desktop/Component.desktop.js');
19
- require('react-merge-refs');
20
- require('@alfalab/core-components-drawer');
21
- require('./components/content/Component.desktop.js');
22
- require('./components/content/Component.js');
23
- require('./components/footer/Component.desktop.js');
24
- require('./components/footer/Component.js');
25
- require('./mobile/Component.mobile.js');
26
- require('./components/content/Component.mobile.js');
27
- require('./components/footer/Component.mobile.js');
28
6
 
29
7
 
30
8
 
@@ -0,0 +1,6 @@
1
+ 'use strict';
2
+
3
+ var layoutStyles = {"column":"side-panel__column_1f5tc","gap-16":"side-panel__gap-16_1f5tc","gap-24":"side-panel__gap-24_1f5tc","gap-32":"side-panel__gap-32_1f5tc","start":"side-panel__start_1f5tc","center":"side-panel__center_1f5tc","space-between":"side-panel__space-between_1f5tc"};
4
+ require('./components/footer/layout.css')
5
+
6
+ exports.layoutStyles = layoutStyles;
@@ -11,22 +11,16 @@ var components_controls_Component = require('../components/controls/Component.js
11
11
  var components_footer_Component_mobile = require('../components/footer/Component.mobile.js');
12
12
  var components_header_Component = require('../components/header/Component.js');
13
13
  var ResponsiveContext = require('../ResponsiveContext.js');
14
- require('../components/content/Component.js');
15
- require('@alfalab/core-components-shared');
16
- require('../Context.js');
17
- require('../layout.module-2f71de49.js');
18
- require('../components/footer/Component.js');
19
- require('@alfalab/core-components-navigation-bar');
20
14
 
21
15
  function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
22
16
 
23
17
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
24
18
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
25
19
 
26
- var styles = {"component":"side-panel__component_1050h","mobileContent":"side-panel__mobileContent_1050h"};
20
+ var styles = {"component":"side-panel__component_74yh8","mobileContent":"side-panel__mobileContent_74yh8"};
27
21
  require('./mobile.css')
28
22
 
29
- var transitions = {"appear":"side-panel__appear_1lrki","enter":"side-panel__enter_1lrki","appearActive":"side-panel__appearActive_1lrki","enterActive":"side-panel__enterActive_1lrki","exit":"side-panel__exit_1lrki","exitActive":"side-panel__exitActive_1lrki","exitDone":"side-panel__exitDone_1lrki"};
23
+ var transitions = {"appear":"side-panel__appear_1be11","enter":"side-panel__enter_1be11","appearActive":"side-panel__appearActive_1be11","enterActive":"side-panel__enterActive_1be11","exit":"side-panel__exit_1be11","exitActive":"side-panel__exitActive_1be11","exitDone":"side-panel__exitDone_1be11"};
30
24
  require('./transitions.mobile.css')
31
25
 
32
26
  var SidePanelMobileComponent = React.forwardRef(function (_a, ref) {
package/mobile/index.js CHANGED
@@ -3,21 +3,6 @@
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
5
  var mobile_Component_mobile = require('./Component.mobile.js');
6
- require('tslib');
7
- require('react');
8
- require('classnames');
9
- require('@alfalab/core-components-base-modal');
10
- require('../components/content/Component.mobile.js');
11
- require('../components/content/Component.js');
12
- require('@alfalab/core-components-shared');
13
- require('../Context.js');
14
- require('../ResponsiveContext.js');
15
- require('../components/controls/Component.js');
16
- require('../layout.module-2f71de49.js');
17
- require('../components/footer/Component.mobile.js');
18
- require('../components/footer/Component.js');
19
- require('../components/header/Component.js');
20
- require('@alfalab/core-components-navigation-bar');
21
6
 
22
7
 
23
8