@alfalab/core-components-drawer 5.1.13 → 5.1.14

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 (7) hide show
  1. package/Component.js +1 -1
  2. package/esm/Component.js +1 -1
  3. package/esm/index.css +35 -35
  4. package/index.css +35 -35
  5. package/modern/Component.js +1 -1
  6. package/modern/index.css +35 -35
  7. package/package.json +2 -2
package/Component.js CHANGED
@@ -13,7 +13,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
13
13
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
14
14
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
15
15
 
16
- var styles = {"component":"drawer__component_19gcy","customScrollbar":"drawer__customScrollbar_19gcy","rightPlacement":"drawer__rightPlacement_19gcy","leftPlacement":"drawer__leftPlacement_19gcy","content":"drawer__content_19gcy","enterRight":"drawer__enterRight_19gcy","enterLeft":"drawer__enterLeft_19gcy","contentEnter":"drawer__contentEnter_19gcy","backdropEnter":"drawer__backdropEnter_19gcy","enterActive":"drawer__enterActive_19gcy","backdropEnterActive":"drawer__backdropEnterActive_19gcy","backdropEnterDone":"drawer__backdropEnterDone_19gcy","contentEnterActive":"drawer__contentEnterActive_19gcy","exit":"drawer__exit_19gcy","backdropExit":"drawer__backdropExit_19gcy","contentExit":"drawer__contentExit_19gcy","exitActiveRight":"drawer__exitActiveRight_19gcy","exitActiveLeft":"drawer__exitActiveLeft_19gcy","backdropExitActive":"drawer__backdropExitActive_19gcy","backdropExitDone":"drawer__backdropExitDone_19gcy","contentExitActive":"drawer__contentExitActive_19gcy"};
16
+ var styles = {"component":"drawer__component_7o6t4","customScrollbar":"drawer__customScrollbar_7o6t4","rightPlacement":"drawer__rightPlacement_7o6t4","leftPlacement":"drawer__leftPlacement_7o6t4","content":"drawer__content_7o6t4","enterRight":"drawer__enterRight_7o6t4","enterLeft":"drawer__enterLeft_7o6t4","contentEnter":"drawer__contentEnter_7o6t4","backdropEnter":"drawer__backdropEnter_7o6t4","enterActive":"drawer__enterActive_7o6t4","backdropEnterActive":"drawer__backdropEnterActive_7o6t4","backdropEnterDone":"drawer__backdropEnterDone_7o6t4","contentEnterActive":"drawer__contentEnterActive_7o6t4","exit":"drawer__exit_7o6t4","backdropExit":"drawer__backdropExit_7o6t4","contentExit":"drawer__contentExit_7o6t4","exitActiveRight":"drawer__exitActiveRight_7o6t4","exitActiveLeft":"drawer__exitActiveLeft_7o6t4","backdropExitActive":"drawer__backdropExitActive_7o6t4","backdropExitDone":"drawer__backdropExitDone_7o6t4","contentExitActive":"drawer__contentExitActive_7o6t4"};
17
17
  require('./index.css')
18
18
 
19
19
  var ANIMATION_DURATION = 600;
package/esm/Component.js CHANGED
@@ -4,7 +4,7 @@ import { CSSTransition } from 'react-transition-group';
4
4
  import cn from 'classnames';
5
5
  import { BaseModal, BaseModalContext } from '@alfalab/core-components-base-modal/esm';
6
6
 
7
- var styles = {"component":"drawer__component_19gcy","customScrollbar":"drawer__customScrollbar_19gcy","rightPlacement":"drawer__rightPlacement_19gcy","leftPlacement":"drawer__leftPlacement_19gcy","content":"drawer__content_19gcy","enterRight":"drawer__enterRight_19gcy","enterLeft":"drawer__enterLeft_19gcy","contentEnter":"drawer__contentEnter_19gcy","backdropEnter":"drawer__backdropEnter_19gcy","enterActive":"drawer__enterActive_19gcy","backdropEnterActive":"drawer__backdropEnterActive_19gcy","backdropEnterDone":"drawer__backdropEnterDone_19gcy","contentEnterActive":"drawer__contentEnterActive_19gcy","exit":"drawer__exit_19gcy","backdropExit":"drawer__backdropExit_19gcy","contentExit":"drawer__contentExit_19gcy","exitActiveRight":"drawer__exitActiveRight_19gcy","exitActiveLeft":"drawer__exitActiveLeft_19gcy","backdropExitActive":"drawer__backdropExitActive_19gcy","backdropExitDone":"drawer__backdropExitDone_19gcy","contentExitActive":"drawer__contentExitActive_19gcy"};
7
+ var styles = {"component":"drawer__component_7o6t4","customScrollbar":"drawer__customScrollbar_7o6t4","rightPlacement":"drawer__rightPlacement_7o6t4","leftPlacement":"drawer__leftPlacement_7o6t4","content":"drawer__content_7o6t4","enterRight":"drawer__enterRight_7o6t4","enterLeft":"drawer__enterLeft_7o6t4","contentEnter":"drawer__contentEnter_7o6t4","backdropEnter":"drawer__backdropEnter_7o6t4","enterActive":"drawer__enterActive_7o6t4","backdropEnterActive":"drawer__backdropEnterActive_7o6t4","backdropEnterDone":"drawer__backdropEnterDone_7o6t4","contentEnterActive":"drawer__contentEnterActive_7o6t4","exit":"drawer__exit_7o6t4","backdropExit":"drawer__backdropExit_7o6t4","contentExit":"drawer__contentExit_7o6t4","exitActiveRight":"drawer__exitActiveRight_7o6t4","exitActiveLeft":"drawer__exitActiveLeft_7o6t4","backdropExitActive":"drawer__backdropExitActive_7o6t4","backdropExitDone":"drawer__backdropExitDone_7o6t4","contentExitActive":"drawer__contentExitActive_7o6t4"};
8
8
  require('./index.css')
9
9
 
10
10
  var ANIMATION_DURATION = 600;
package/esm/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: udww6 */
1
+ /* hash: 1yak8 */
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-500: rgba(9, 12, 37, 0.28);
@@ -32,97 +32,97 @@
32
32
  --backdrop-hidden-background: transparent;
33
33
  } :root {
34
34
  --drawer-width: 500px;
35
- } .drawer__component_19gcy {
35
+ } .drawer__component_7o6t4 {
36
36
  top: var(--gap-0);
37
37
  height: 100%;
38
38
  width: var(--drawer-width);
39
39
  flex: 1;
40
40
  overflow: auto;
41
41
  will-change: transform;
42
- } .drawer__component_19gcy.drawer__component_19gcy {
42
+ } .drawer__component_7o6t4.drawer__component_7o6t4 {
43
43
  position: fixed;
44
- } .drawer__customScrollbar_19gcy {
44
+ } .drawer__customScrollbar_7o6t4 {
45
45
  overflow: auto;
46
46
  cursor: auto;
47
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar {
47
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar {
48
48
  width: 12px;
49
49
  height: 12px;
50
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-track {
50
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-track {
51
51
  background-color: transparent;
52
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-track-piece {
52
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-track-piece {
53
53
  background-color: transparent;
54
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb {
54
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb {
55
55
  background-color: var(--color-light-neutral-translucent-500);
56
56
  border-color: transparent;
57
57
  border-style: solid;
58
58
  border-width: 4px;
59
59
  background-clip: padding-box;
60
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb:vertical {
60
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb:vertical {
61
61
  border-radius: var(--border-radius-circle) / var(--border-radius-6);
62
62
  min-height: 40px;
63
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb:vertical:hover {
63
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb:vertical:hover {
64
64
  border-radius: var(--border-radius-circle) / 7px;
65
65
  border-width: 4px 3px;
66
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb:horizontal {
66
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb:horizontal {
67
67
  border-radius: var(--border-radius-6) / var(--border-radius-circle);
68
68
  min-width: 40px;
69
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb:horizontal:hover {
69
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb:horizontal:hover {
70
70
  border-radius: 7px / var(--border-radius-circle);
71
71
  border-width: 3px 4px;
72
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb:active {
72
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb:active {
73
73
  background-color: var(--color-light-text-secondary);
74
- } .drawer__customScrollbar_19gcy::-webkit-resizer {
74
+ } .drawer__customScrollbar_7o6t4::-webkit-resizer {
75
75
  background: url('data:image/svg+xml;utf8,<svg width="12" height="12" viewBox="0 0 12 12" fill="%2386868a" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M8.64645 0.646447C8.84171 0.841709 8.84171 1.15829 8.64645 1.35355L1.35355 8.64645C1.15829 8.84171 0.841709 8.84171 0.646447 8.64645C0.451184 8.45118 0.451184 8.1346 0.646447 7.93934L7.93934 0.646447C8.1346 0.451184 8.45118 0.451184 8.64645 0.646447ZM8.64645 3.64645C8.84171 3.84171 8.84171 4.15829 8.64645 4.35355L4.35355 8.64645C4.15829 8.84171 3.84171 8.84171 3.64645 8.64645C3.45118 8.45118 3.45118 8.1346 3.64645 7.93934L7.93934 3.64645C8.1346 3.45118 8.45118 3.45118 8.64645 3.64645Z" /></svg>')
76
76
  no-repeat right bottom;
77
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-button,
78
- .drawer__customScrollbar_19gcy::-webkit-scrollbar-corner {
77
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-button,
78
+ .drawer__customScrollbar_7o6t4::-webkit-scrollbar-corner {
79
79
  display: none;
80
- } .drawer__rightPlacement_19gcy {
80
+ } .drawer__rightPlacement_7o6t4 {
81
81
  right: var(--gap-0);
82
82
  align-self: flex-end;
83
- } .drawer__leftPlacement_19gcy {
83
+ } .drawer__leftPlacement_7o6t4 {
84
84
  left: var(--gap-0);
85
85
  align-self: flex-start;
86
- } .drawer__content_19gcy {
86
+ } .drawer__content_7o6t4 {
87
87
  width: 100%;
88
88
  display: flex;
89
89
  flex-direction: column;
90
90
  flex: 1;
91
- } /* enter */ .drawer__enterRight_19gcy {
91
+ } /* enter */ .drawer__enterRight_7o6t4 {
92
92
  transform: translateX(100%);
93
- } .drawer__enterLeft_19gcy {
93
+ } .drawer__enterLeft_7o6t4 {
94
94
  transform: translateX(-100%);
95
- } .drawer__contentEnter_19gcy {
95
+ } .drawer__contentEnter_7o6t4 {
96
96
  opacity: 0;
97
- } .drawer__backdropEnter_19gcy {
97
+ } .drawer__backdropEnter_7o6t4 {
98
98
  background-color: var(--backdrop-hidden-background);
99
- } .drawer__enterActive_19gcy {
99
+ } .drawer__enterActive_7o6t4 {
100
100
  transition: transform 0.3s ease-in-out;
101
101
  transform: translateX(0);
102
- } .drawer__backdropEnterActive_19gcy,
103
- .drawer__backdropEnterDone_19gcy {
102
+ } .drawer__backdropEnterActive_7o6t4,
103
+ .drawer__backdropEnterDone_7o6t4 {
104
104
  transition: background 0.3s ease-in-out;
105
105
  background-color: var(--backdrop-visible-background);
106
- } .drawer__contentEnterActive_19gcy {
106
+ } .drawer__contentEnterActive_7o6t4 {
107
107
  transition: opacity 0.2s ease-in-out 0.3s;
108
108
  opacity: 1;
109
- } /* exit */ .drawer__exit_19gcy {
109
+ } /* exit */ .drawer__exit_7o6t4 {
110
110
  transform: translateX(0);
111
- } .drawer__backdropExit_19gcy {
111
+ } .drawer__backdropExit_7o6t4 {
112
112
  background-color: var(--backdrop-visible-background);
113
- } .drawer__contentExit_19gcy {
113
+ } .drawer__contentExit_7o6t4 {
114
114
  opacity: 1;
115
- } .drawer__exitActiveRight_19gcy {
115
+ } .drawer__exitActiveRight_7o6t4 {
116
116
  transition: transform 0.25s ease-in-out 0.1s;
117
117
  transform: translateX(100%);
118
- } .drawer__exitActiveLeft_19gcy {
118
+ } .drawer__exitActiveLeft_7o6t4 {
119
119
  transition: transform 0.25s ease-in-out 0.1s;
120
120
  transform: translateX(-100%);
121
- } .drawer__backdropExitActive_19gcy,
122
- .drawer__backdropExitDone_19gcy {
121
+ } .drawer__backdropExitActive_7o6t4,
122
+ .drawer__backdropExitDone_7o6t4 {
123
123
  transition: background 0.25s ease-in-out 0.1s;
124
124
  background-color: var(--backdrop-hidden-background);
125
- } .drawer__contentExitActive_19gcy {
125
+ } .drawer__contentExitActive_7o6t4 {
126
126
  opacity: 0;
127
127
  transition: opacity 0.12s ease-in-out;
128
128
  }
package/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: udww6 */
1
+ /* hash: 1yak8 */
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-500: rgba(9, 12, 37, 0.28);
@@ -32,97 +32,97 @@
32
32
  --backdrop-hidden-background: transparent;
33
33
  } :root {
34
34
  --drawer-width: 500px;
35
- } .drawer__component_19gcy {
35
+ } .drawer__component_7o6t4 {
36
36
  top: var(--gap-0);
37
37
  height: 100%;
38
38
  width: var(--drawer-width);
39
39
  flex: 1;
40
40
  overflow: auto;
41
41
  will-change: transform;
42
- } .drawer__component_19gcy.drawer__component_19gcy {
42
+ } .drawer__component_7o6t4.drawer__component_7o6t4 {
43
43
  position: fixed;
44
- } .drawer__customScrollbar_19gcy {
44
+ } .drawer__customScrollbar_7o6t4 {
45
45
  overflow: auto;
46
46
  cursor: auto;
47
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar {
47
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar {
48
48
  width: 12px;
49
49
  height: 12px;
50
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-track {
50
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-track {
51
51
  background-color: transparent;
52
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-track-piece {
52
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-track-piece {
53
53
  background-color: transparent;
54
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb {
54
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb {
55
55
  background-color: var(--color-light-neutral-translucent-500);
56
56
  border-color: transparent;
57
57
  border-style: solid;
58
58
  border-width: 4px;
59
59
  background-clip: padding-box;
60
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb:vertical {
60
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb:vertical {
61
61
  border-radius: var(--border-radius-circle) / var(--border-radius-6);
62
62
  min-height: 40px;
63
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb:vertical:hover {
63
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb:vertical:hover {
64
64
  border-radius: var(--border-radius-circle) / 7px;
65
65
  border-width: 4px 3px;
66
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb:horizontal {
66
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb:horizontal {
67
67
  border-radius: var(--border-radius-6) / var(--border-radius-circle);
68
68
  min-width: 40px;
69
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb:horizontal:hover {
69
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb:horizontal:hover {
70
70
  border-radius: 7px / var(--border-radius-circle);
71
71
  border-width: 3px 4px;
72
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb:active {
72
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb:active {
73
73
  background-color: var(--color-light-text-secondary);
74
- } .drawer__customScrollbar_19gcy::-webkit-resizer {
74
+ } .drawer__customScrollbar_7o6t4::-webkit-resizer {
75
75
  background: url('data:image/svg+xml;utf8,<svg width="12" height="12" viewBox="0 0 12 12" fill="%2386868a" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M8.64645 0.646447C8.84171 0.841709 8.84171 1.15829 8.64645 1.35355L1.35355 8.64645C1.15829 8.84171 0.841709 8.84171 0.646447 8.64645C0.451184 8.45118 0.451184 8.1346 0.646447 7.93934L7.93934 0.646447C8.1346 0.451184 8.45118 0.451184 8.64645 0.646447ZM8.64645 3.64645C8.84171 3.84171 8.84171 4.15829 8.64645 4.35355L4.35355 8.64645C4.15829 8.84171 3.84171 8.84171 3.64645 8.64645C3.45118 8.45118 3.45118 8.1346 3.64645 7.93934L7.93934 3.64645C8.1346 3.45118 8.45118 3.45118 8.64645 3.64645Z" /></svg>')
76
76
  no-repeat right bottom;
77
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-button,
78
- .drawer__customScrollbar_19gcy::-webkit-scrollbar-corner {
77
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-button,
78
+ .drawer__customScrollbar_7o6t4::-webkit-scrollbar-corner {
79
79
  display: none;
80
- } .drawer__rightPlacement_19gcy {
80
+ } .drawer__rightPlacement_7o6t4 {
81
81
  right: var(--gap-0);
82
82
  align-self: flex-end;
83
- } .drawer__leftPlacement_19gcy {
83
+ } .drawer__leftPlacement_7o6t4 {
84
84
  left: var(--gap-0);
85
85
  align-self: flex-start;
86
- } .drawer__content_19gcy {
86
+ } .drawer__content_7o6t4 {
87
87
  width: 100%;
88
88
  display: flex;
89
89
  flex-direction: column;
90
90
  flex: 1;
91
- } /* enter */ .drawer__enterRight_19gcy {
91
+ } /* enter */ .drawer__enterRight_7o6t4 {
92
92
  transform: translateX(100%);
93
- } .drawer__enterLeft_19gcy {
93
+ } .drawer__enterLeft_7o6t4 {
94
94
  transform: translateX(-100%);
95
- } .drawer__contentEnter_19gcy {
95
+ } .drawer__contentEnter_7o6t4 {
96
96
  opacity: 0;
97
- } .drawer__backdropEnter_19gcy {
97
+ } .drawer__backdropEnter_7o6t4 {
98
98
  background-color: var(--backdrop-hidden-background);
99
- } .drawer__enterActive_19gcy {
99
+ } .drawer__enterActive_7o6t4 {
100
100
  transition: transform 0.3s ease-in-out;
101
101
  transform: translateX(0);
102
- } .drawer__backdropEnterActive_19gcy,
103
- .drawer__backdropEnterDone_19gcy {
102
+ } .drawer__backdropEnterActive_7o6t4,
103
+ .drawer__backdropEnterDone_7o6t4 {
104
104
  transition: background 0.3s ease-in-out;
105
105
  background-color: var(--backdrop-visible-background);
106
- } .drawer__contentEnterActive_19gcy {
106
+ } .drawer__contentEnterActive_7o6t4 {
107
107
  transition: opacity 0.2s ease-in-out 0.3s;
108
108
  opacity: 1;
109
- } /* exit */ .drawer__exit_19gcy {
109
+ } /* exit */ .drawer__exit_7o6t4 {
110
110
  transform: translateX(0);
111
- } .drawer__backdropExit_19gcy {
111
+ } .drawer__backdropExit_7o6t4 {
112
112
  background-color: var(--backdrop-visible-background);
113
- } .drawer__contentExit_19gcy {
113
+ } .drawer__contentExit_7o6t4 {
114
114
  opacity: 1;
115
- } .drawer__exitActiveRight_19gcy {
115
+ } .drawer__exitActiveRight_7o6t4 {
116
116
  transition: transform 0.25s ease-in-out 0.1s;
117
117
  transform: translateX(100%);
118
- } .drawer__exitActiveLeft_19gcy {
118
+ } .drawer__exitActiveLeft_7o6t4 {
119
119
  transition: transform 0.25s ease-in-out 0.1s;
120
120
  transform: translateX(-100%);
121
- } .drawer__backdropExitActive_19gcy,
122
- .drawer__backdropExitDone_19gcy {
121
+ } .drawer__backdropExitActive_7o6t4,
122
+ .drawer__backdropExitDone_7o6t4 {
123
123
  transition: background 0.25s ease-in-out 0.1s;
124
124
  background-color: var(--backdrop-hidden-background);
125
- } .drawer__contentExitActive_19gcy {
125
+ } .drawer__contentExitActive_7o6t4 {
126
126
  opacity: 0;
127
127
  transition: opacity 0.12s ease-in-out;
128
128
  }
package/modern/Component.js CHANGED
@@ -3,7 +3,7 @@ import { CSSTransition } from 'react-transition-group';
3
3
  import cn from 'classnames';
4
4
  import { BaseModal, BaseModalContext } from '@alfalab/core-components-base-modal/modern';
5
5
 
6
- const styles = {"component":"drawer__component_19gcy","customScrollbar":"drawer__customScrollbar_19gcy","rightPlacement":"drawer__rightPlacement_19gcy","leftPlacement":"drawer__leftPlacement_19gcy","content":"drawer__content_19gcy","enterRight":"drawer__enterRight_19gcy","enterLeft":"drawer__enterLeft_19gcy","contentEnter":"drawer__contentEnter_19gcy","backdropEnter":"drawer__backdropEnter_19gcy","enterActive":"drawer__enterActive_19gcy","backdropEnterActive":"drawer__backdropEnterActive_19gcy","backdropEnterDone":"drawer__backdropEnterDone_19gcy","contentEnterActive":"drawer__contentEnterActive_19gcy","exit":"drawer__exit_19gcy","backdropExit":"drawer__backdropExit_19gcy","contentExit":"drawer__contentExit_19gcy","exitActiveRight":"drawer__exitActiveRight_19gcy","exitActiveLeft":"drawer__exitActiveLeft_19gcy","backdropExitActive":"drawer__backdropExitActive_19gcy","backdropExitDone":"drawer__backdropExitDone_19gcy","contentExitActive":"drawer__contentExitActive_19gcy"};
6
+ const styles = {"component":"drawer__component_7o6t4","customScrollbar":"drawer__customScrollbar_7o6t4","rightPlacement":"drawer__rightPlacement_7o6t4","leftPlacement":"drawer__leftPlacement_7o6t4","content":"drawer__content_7o6t4","enterRight":"drawer__enterRight_7o6t4","enterLeft":"drawer__enterLeft_7o6t4","contentEnter":"drawer__contentEnter_7o6t4","backdropEnter":"drawer__backdropEnter_7o6t4","enterActive":"drawer__enterActive_7o6t4","backdropEnterActive":"drawer__backdropEnterActive_7o6t4","backdropEnterDone":"drawer__backdropEnterDone_7o6t4","contentEnterActive":"drawer__contentEnterActive_7o6t4","exit":"drawer__exit_7o6t4","backdropExit":"drawer__backdropExit_7o6t4","contentExit":"drawer__contentExit_7o6t4","exitActiveRight":"drawer__exitActiveRight_7o6t4","exitActiveLeft":"drawer__exitActiveLeft_7o6t4","backdropExitActive":"drawer__backdropExitActive_7o6t4","backdropExitDone":"drawer__backdropExitDone_7o6t4","contentExitActive":"drawer__contentExitActive_7o6t4"};
7
7
  require('./index.css')
8
8
 
9
9
  const ANIMATION_DURATION = 600;
package/modern/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: udww6 */
1
+ /* hash: 1yak8 */
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-500: rgba(9, 12, 37, 0.28);
@@ -32,97 +32,97 @@
32
32
  --backdrop-hidden-background: transparent;
33
33
  } :root {
34
34
  --drawer-width: 500px;
35
- } .drawer__component_19gcy {
35
+ } .drawer__component_7o6t4 {
36
36
  top: var(--gap-0);
37
37
  height: 100%;
38
38
  width: var(--drawer-width);
39
39
  flex: 1;
40
40
  overflow: auto;
41
41
  will-change: transform;
42
- } .drawer__component_19gcy.drawer__component_19gcy {
42
+ } .drawer__component_7o6t4.drawer__component_7o6t4 {
43
43
  position: fixed;
44
- } .drawer__customScrollbar_19gcy {
44
+ } .drawer__customScrollbar_7o6t4 {
45
45
  overflow: auto;
46
46
  cursor: auto;
47
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar {
47
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar {
48
48
  width: 12px;
49
49
  height: 12px;
50
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-track {
50
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-track {
51
51
  background-color: transparent;
52
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-track-piece {
52
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-track-piece {
53
53
  background-color: transparent;
54
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb {
54
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb {
55
55
  background-color: var(--color-light-neutral-translucent-500);
56
56
  border-color: transparent;
57
57
  border-style: solid;
58
58
  border-width: 4px;
59
59
  background-clip: padding-box;
60
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb:vertical {
60
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb:vertical {
61
61
  border-radius: var(--border-radius-circle) / var(--border-radius-6);
62
62
  min-height: 40px;
63
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb:vertical:hover {
63
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb:vertical:hover {
64
64
  border-radius: var(--border-radius-circle) / 7px;
65
65
  border-width: 4px 3px;
66
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb:horizontal {
66
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb:horizontal {
67
67
  border-radius: var(--border-radius-6) / var(--border-radius-circle);
68
68
  min-width: 40px;
69
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb:horizontal:hover {
69
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb:horizontal:hover {
70
70
  border-radius: 7px / var(--border-radius-circle);
71
71
  border-width: 3px 4px;
72
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-thumb:active {
72
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-thumb:active {
73
73
  background-color: var(--color-light-text-secondary);
74
- } .drawer__customScrollbar_19gcy::-webkit-resizer {
74
+ } .drawer__customScrollbar_7o6t4::-webkit-resizer {
75
75
  background: url('data:image/svg+xml;utf8,<svg width="12" height="12" viewBox="0 0 12 12" fill="%2386868a" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M8.64645 0.646447C8.84171 0.841709 8.84171 1.15829 8.64645 1.35355L1.35355 8.64645C1.15829 8.84171 0.841709 8.84171 0.646447 8.64645C0.451184 8.45118 0.451184 8.1346 0.646447 7.93934L7.93934 0.646447C8.1346 0.451184 8.45118 0.451184 8.64645 0.646447ZM8.64645 3.64645C8.84171 3.84171 8.84171 4.15829 8.64645 4.35355L4.35355 8.64645C4.15829 8.84171 3.84171 8.84171 3.64645 8.64645C3.45118 8.45118 3.45118 8.1346 3.64645 7.93934L7.93934 3.64645C8.1346 3.45118 8.45118 3.45118 8.64645 3.64645Z" /></svg>')
76
76
  no-repeat right bottom;
77
- } .drawer__customScrollbar_19gcy::-webkit-scrollbar-button,
78
- .drawer__customScrollbar_19gcy::-webkit-scrollbar-corner {
77
+ } .drawer__customScrollbar_7o6t4::-webkit-scrollbar-button,
78
+ .drawer__customScrollbar_7o6t4::-webkit-scrollbar-corner {
79
79
  display: none;
80
- } .drawer__rightPlacement_19gcy {
80
+ } .drawer__rightPlacement_7o6t4 {
81
81
  right: var(--gap-0);
82
82
  align-self: flex-end;
83
- } .drawer__leftPlacement_19gcy {
83
+ } .drawer__leftPlacement_7o6t4 {
84
84
  left: var(--gap-0);
85
85
  align-self: flex-start;
86
- } .drawer__content_19gcy {
86
+ } .drawer__content_7o6t4 {
87
87
  width: 100%;
88
88
  display: flex;
89
89
  flex-direction: column;
90
90
  flex: 1;
91
- } /* enter */ .drawer__enterRight_19gcy {
91
+ } /* enter */ .drawer__enterRight_7o6t4 {
92
92
  transform: translateX(100%);
93
- } .drawer__enterLeft_19gcy {
93
+ } .drawer__enterLeft_7o6t4 {
94
94
  transform: translateX(-100%);
95
- } .drawer__contentEnter_19gcy {
95
+ } .drawer__contentEnter_7o6t4 {
96
96
  opacity: 0;
97
- } .drawer__backdropEnter_19gcy {
97
+ } .drawer__backdropEnter_7o6t4 {
98
98
  background-color: var(--backdrop-hidden-background);
99
- } .drawer__enterActive_19gcy {
99
+ } .drawer__enterActive_7o6t4 {
100
100
  transition: transform 0.3s ease-in-out;
101
101
  transform: translateX(0);
102
- } .drawer__backdropEnterActive_19gcy,
103
- .drawer__backdropEnterDone_19gcy {
102
+ } .drawer__backdropEnterActive_7o6t4,
103
+ .drawer__backdropEnterDone_7o6t4 {
104
104
  transition: background 0.3s ease-in-out;
105
105
  background-color: var(--backdrop-visible-background);
106
- } .drawer__contentEnterActive_19gcy {
106
+ } .drawer__contentEnterActive_7o6t4 {
107
107
  transition: opacity 0.2s ease-in-out 0.3s;
108
108
  opacity: 1;
109
- } /* exit */ .drawer__exit_19gcy {
109
+ } /* exit */ .drawer__exit_7o6t4 {
110
110
  transform: translateX(0);
111
- } .drawer__backdropExit_19gcy {
111
+ } .drawer__backdropExit_7o6t4 {
112
112
  background-color: var(--backdrop-visible-background);
113
- } .drawer__contentExit_19gcy {
113
+ } .drawer__contentExit_7o6t4 {
114
114
  opacity: 1;
115
- } .drawer__exitActiveRight_19gcy {
115
+ } .drawer__exitActiveRight_7o6t4 {
116
116
  transition: transform 0.25s ease-in-out 0.1s;
117
117
  transform: translateX(100%);
118
- } .drawer__exitActiveLeft_19gcy {
118
+ } .drawer__exitActiveLeft_7o6t4 {
119
119
  transition: transform 0.25s ease-in-out 0.1s;
120
120
  transform: translateX(-100%);
121
- } .drawer__backdropExitActive_19gcy,
122
- .drawer__backdropExitDone_19gcy {
121
+ } .drawer__backdropExitActive_7o6t4,
122
+ .drawer__backdropExitDone_7o6t4 {
123
123
  transition: background 0.25s ease-in-out 0.1s;
124
124
  background-color: var(--backdrop-hidden-background);
125
- } .drawer__contentExitActive_19gcy {
125
+ } .drawer__contentExitActive_7o6t4 {
126
126
  opacity: 0;
127
127
  transition: opacity 0.12s ease-in-out;
128
128
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-drawer",
3
- "version": "5.1.13",
3
+ "version": "5.1.14",
4
4
  "description": "Drawer component",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -16,7 +16,7 @@
16
16
  "react-dom": "^16.9.0 || ^17.0.1 || ^18.0.0"
17
17
  },
18
18
  "dependencies": {
19
- "@alfalab/core-components-base-modal": "^5.9.2",
19
+ "@alfalab/core-components-base-modal": "^5.9.3",
20
20
  "classnames": "^2.5.1",
21
21
  "react-transition-group": "^4.4.5",
22
22
  "tslib": "^2.4.0"