@alfalab/core-components-bottom-sheet 3.0.1 → 3.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,17 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [3.0.2](https://github.com/alfa-laboratory/core-components/compare/@alfalab/core-components-bottom-sheet@3.0.1...@alfalab/core-components-bottom-sheet@3.0.2) (2022-01-27)
7
+
8
+
9
+ ### Bug Fixes
10
+
11
+ * **bottom-sheet:** fix double calling onClose fn ([#962](https://github.com/alfa-laboratory/core-components/issues/962)) ([feda2a4](https://github.com/alfa-laboratory/core-components/commit/feda2a4c8d3a4f40a1ab9c40eb21f5359e4fa538))
12
+
13
+
14
+
15
+
16
+
6
17
  ## [3.0.1](https://github.com/alfa-laboratory/core-components/compare/@alfalab/core-components-bottom-sheet@3.0.0...@alfalab/core-components-bottom-sheet@3.0.1) (2022-01-17)
7
18
 
8
19
  **Note:** Version bump only for package @alfalab/core-components-bottom-sheet
package/dist/component.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var components_swipeableBackdrop_Component = require('./Component-411270d3.js');
5
+ var components_swipeableBackdrop_Component = require('./Component-2ea4e400.js');
6
6
  var React = require('react');
7
7
  var cn = require('classnames');
8
8
  var reactSwipeable = require('react-swipeable');
@@ -16,7 +16,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
16
16
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
17
17
  var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
18
18
 
19
- var styles = {"modal":"bottom-sheet__modal_1rr5r","component":"bottom-sheet__component_1rr5r","withTransition":"bottom-sheet__withTransition_1rr5r","marker":"bottom-sheet__marker_1rr5r","scrollableContainer":"bottom-sheet__scrollableContainer_1rr5r","withPadding":"bottom-sheet__withPadding_1rr5r","content":"bottom-sheet__content_1rr5r","title":"bottom-sheet__title_1rr5r","scrollLocked":"bottom-sheet__scrollLocked_1rr5r","appear":"bottom-sheet__appear_1rr5r","enter":"bottom-sheet__enter_1rr5r","appearActive":"bottom-sheet__appearActive_1rr5r","enterActive":"bottom-sheet__enterActive_1rr5r","enterDone":"bottom-sheet__enterDone_1rr5r","appearDone":"bottom-sheet__appearDone_1rr5r","exit":"bottom-sheet__exit_1rr5r","exitActive":"bottom-sheet__exitActive_1rr5r"};
19
+ var styles = {"modal":"bottom-sheet__modal_1ielz","component":"bottom-sheet__component_1ielz","withTransition":"bottom-sheet__withTransition_1ielz","marker":"bottom-sheet__marker_1ielz","scrollableContainer":"bottom-sheet__scrollableContainer_1ielz","withPadding":"bottom-sheet__withPadding_1ielz","content":"bottom-sheet__content_1ielz","title":"bottom-sheet__title_1ielz","scrollLocked":"bottom-sheet__scrollLocked_1ielz","appear":"bottom-sheet__appear_1ielz","enter":"bottom-sheet__enter_1ielz","appearActive":"bottom-sheet__appearActive_1ielz","enterActive":"bottom-sheet__enterActive_1ielz","enterDone":"bottom-sheet__enterDone_1ielz","appearDone":"bottom-sheet__appearDone_1ielz","exit":"bottom-sheet__exit_1ielz","exitActive":"bottom-sheet__exitActive_1ielz"};
20
20
  require('./index.css')
21
21
 
22
22
  var TIMEOUT = 300;
@@ -130,7 +130,7 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
130
130
  var getSwipeStyles = function () { return ({
131
131
  transform: sheetOffset ? "translateY(" + sheetOffset + "px)" : '',
132
132
  }); };
133
- return (React__default['default'].createElement(coreComponentsBaseModal.BaseModal, { open: open, ref: ref, dataTestId: dataTestId, zIndex: zIndex, onClose: onClose, onBackdropClick: onClose, scrollHandler: scrollableContainer, Backdrop: components_swipeableBackdrop_Component.SwipeableBackdrop, backdropProps: {
133
+ return (React__default['default'].createElement(coreComponentsBaseModal.BaseModal, { open: open, ref: ref, dataTestId: dataTestId, zIndex: zIndex, onClose: onClose, scrollHandler: scrollableContainer, Backdrop: components_swipeableBackdrop_Component.SwipeableBackdrop, backdropProps: {
134
134
  opacity: backdropOpacity,
135
135
  handlers: backdropSwipeablehandlers,
136
136
  opacityTimeout: TIMEOUT,
@@ -11,7 +11,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
11
11
  var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
12
12
  var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
13
13
 
14
- var styles = {"footer":"bottom-sheet__footer_qcucr","highlighted":"bottom-sheet__highlighted_qcucr"};
14
+ var styles = {"footer":"bottom-sheet__footer_byygy","highlighted":"bottom-sheet__highlighted_byygy"};
15
15
  require('./index.css')
16
16
 
17
17
  var Footer = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: nuzfd */
1
+ /* hash: 657hw */
2
2
  :root {
3
3
  --color-light-bg-primary: #fff;
4
4
  }
@@ -15,12 +15,12 @@
15
15
  --gap-m: 16px;
16
16
  --gap-3xl: 40px;
17
17
  }
18
- .bottom-sheet__footer_qcucr {
18
+ .bottom-sheet__footer_byygy {
19
19
  position: sticky;
20
20
  bottom: 0;
21
21
  padding: var(--gap-m) var(--gap-m) var(--gap-3xl);
22
22
  background-color: var(--color-light-bg-primary);
23
23
  }
24
- .bottom-sheet__highlighted_qcucr {
24
+ .bottom-sheet__highlighted_byygy {
25
25
  box-shadow: var(--shadow-s-up);
26
26
  }
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- var components_swipeableBackdrop_Component = require('../../Component-411270d3.js');
5
+ var components_swipeableBackdrop_Component = require('../../Component-2ea4e400.js');
6
6
  require('react');
7
7
  require('@alfalab/core-components-backdrop');
8
8
 
@@ -130,7 +130,7 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
130
130
  var getSwipeStyles = function () { return ({
131
131
  transform: sheetOffset ? "translateY(" + sheetOffset + "px)" : '',
132
132
  }); };
133
- return (React__default['default'].createElement(coreComponentsBaseModal.BaseModal, { open: open, ref: ref, dataTestId: dataTestId, zIndex: zIndex, onClose: onClose, onBackdropClick: onClose, scrollHandler: scrollableContainer, Backdrop: components_swipeableBackdrop_Component.SwipeableBackdrop, backdropProps: {
133
+ return (React__default['default'].createElement(coreComponentsBaseModal.BaseModal, { open: open, ref: ref, dataTestId: dataTestId, zIndex: zIndex, onClose: onClose, scrollHandler: scrollableContainer, Backdrop: components_swipeableBackdrop_Component.SwipeableBackdrop, backdropProps: {
134
134
  opacity: backdropOpacity,
135
135
  handlers: backdropSwipeablehandlers,
136
136
  opacityTimeout: TIMEOUT,
@@ -1,4 +1,4 @@
1
- import { S as SwipeableBackdrop, _ as __assign } from './Component-fff1007b.js';
1
+ import { S as SwipeableBackdrop, _ as __assign } from './Component-6badd464.js';
2
2
  import React, { forwardRef, useState, useRef, useCallback, useEffect } from 'react';
3
3
  import cn from 'classnames';
4
4
  import { useSwipeable } from 'react-swipeable';
@@ -7,7 +7,7 @@ import { Typography } from '@alfalab/core-components-typography/dist/esm';
7
7
  import { Footer } from './components/footer/Component.js';
8
8
  import '@alfalab/core-components-backdrop/dist/esm';
9
9
 
10
- var styles = {"modal":"bottom-sheet__modal_1rr5r","component":"bottom-sheet__component_1rr5r","withTransition":"bottom-sheet__withTransition_1rr5r","marker":"bottom-sheet__marker_1rr5r","scrollableContainer":"bottom-sheet__scrollableContainer_1rr5r","withPadding":"bottom-sheet__withPadding_1rr5r","content":"bottom-sheet__content_1rr5r","title":"bottom-sheet__title_1rr5r","scrollLocked":"bottom-sheet__scrollLocked_1rr5r","appear":"bottom-sheet__appear_1rr5r","enter":"bottom-sheet__enter_1rr5r","appearActive":"bottom-sheet__appearActive_1rr5r","enterActive":"bottom-sheet__enterActive_1rr5r","enterDone":"bottom-sheet__enterDone_1rr5r","appearDone":"bottom-sheet__appearDone_1rr5r","exit":"bottom-sheet__exit_1rr5r","exitActive":"bottom-sheet__exitActive_1rr5r"};
10
+ var styles = {"modal":"bottom-sheet__modal_1ielz","component":"bottom-sheet__component_1ielz","withTransition":"bottom-sheet__withTransition_1ielz","marker":"bottom-sheet__marker_1ielz","scrollableContainer":"bottom-sheet__scrollableContainer_1ielz","withPadding":"bottom-sheet__withPadding_1ielz","content":"bottom-sheet__content_1ielz","title":"bottom-sheet__title_1ielz","scrollLocked":"bottom-sheet__scrollLocked_1ielz","appear":"bottom-sheet__appear_1ielz","enter":"bottom-sheet__enter_1ielz","appearActive":"bottom-sheet__appearActive_1ielz","enterActive":"bottom-sheet__enterActive_1ielz","enterDone":"bottom-sheet__enterDone_1ielz","appearDone":"bottom-sheet__appearDone_1ielz","exit":"bottom-sheet__exit_1ielz","exitActive":"bottom-sheet__exitActive_1ielz"};
11
11
  require('./index.css')
12
12
 
13
13
  var TIMEOUT = 300;
@@ -121,7 +121,7 @@ var BottomSheet = forwardRef(function (_a, ref) {
121
121
  var getSwipeStyles = function () { return ({
122
122
  transform: sheetOffset ? "translateY(" + sheetOffset + "px)" : '',
123
123
  }); };
124
- return (React.createElement(BaseModal, { open: open, ref: ref, dataTestId: dataTestId, zIndex: zIndex, onClose: onClose, onBackdropClick: onClose, scrollHandler: scrollableContainer, Backdrop: SwipeableBackdrop, backdropProps: {
124
+ return (React.createElement(BaseModal, { open: open, ref: ref, dataTestId: dataTestId, zIndex: zIndex, onClose: onClose, scrollHandler: scrollableContainer, Backdrop: SwipeableBackdrop, backdropProps: {
125
125
  opacity: backdropOpacity,
126
126
  handlers: backdropSwipeablehandlers,
127
127
  opacityTimeout: TIMEOUT,
@@ -2,7 +2,7 @@ import React, { useContext, useEffect } from 'react';
2
2
  import cn from 'classnames';
3
3
  import { BaseModalContext } from '@alfalab/core-components-base-modal/dist/esm';
4
4
 
5
- var styles = {"footer":"bottom-sheet__footer_qcucr","highlighted":"bottom-sheet__highlighted_qcucr"};
5
+ var styles = {"footer":"bottom-sheet__footer_byygy","highlighted":"bottom-sheet__highlighted_byygy"};
6
6
  require('./index.css')
7
7
 
8
8
  var Footer = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: nuzfd */
1
+ /* hash: 657hw */
2
2
  :root {
3
3
  --color-light-bg-primary: #fff;
4
4
  }
@@ -15,12 +15,12 @@
15
15
  --gap-m: 16px;
16
16
  --gap-3xl: 40px;
17
17
  }
18
- .bottom-sheet__footer_qcucr {
18
+ .bottom-sheet__footer_byygy {
19
19
  position: sticky;
20
20
  bottom: 0;
21
21
  padding: var(--gap-m) var(--gap-m) var(--gap-3xl);
22
22
  background-color: var(--color-light-bg-primary);
23
23
  }
24
- .bottom-sheet__highlighted_qcucr {
24
+ .bottom-sheet__highlighted_byygy {
25
25
  box-shadow: var(--shadow-s-up);
26
26
  }
@@ -1,3 +1,3 @@
1
- export { S as SwipeableBackdrop } from '../../Component-fff1007b.js';
1
+ export { S as SwipeableBackdrop } from '../../Component-6badd464.js';
2
2
  import 'react';
3
3
  import '@alfalab/core-components-backdrop/dist/esm';
@@ -1,4 +1,4 @@
1
- /* hash: 1qgns */
1
+ /* hash: znx0k */
2
2
  :root {
3
3
  --color-light-bg-primary: #fff;
4
4
  --color-light-graphic-neutral: #dbdee1;
@@ -22,14 +22,14 @@
22
22
  --bottom-sheet-in-transition: 0.5s cubic-bezier(0.09, 0.91, 0.18, 0.99);
23
23
  --bottom-sheet-out-transition: 0.3s ease;
24
24
  }
25
- .bottom-sheet__modal_1rr5r {
25
+ .bottom-sheet__modal_1ielz {
26
26
  background-color: transparent;
27
27
  position: fixed;
28
28
  bottom: 0;
29
29
  width: 100%;
30
30
  max-width: 600px;
31
31
  }
32
- .bottom-sheet__component_1rr5r {
32
+ .bottom-sheet__component_1ielz {
33
33
  position: relative;
34
34
  display: flex;
35
35
  flex-direction: column;
@@ -39,10 +39,10 @@
39
39
  background: var(--color-light-bg-primary);
40
40
  transform: translateY(100%);
41
41
  }
42
- .bottom-sheet__withTransition_1rr5r {
42
+ .bottom-sheet__withTransition_1ielz {
43
43
  transition: var(--bottom-sheet-out-transition);
44
44
  }
45
- .bottom-sheet__marker_1rr5r {
45
+ .bottom-sheet__marker_1ielz {
46
46
  position: absolute;
47
47
  top: var(--gap-xs);
48
48
  left: 50%;
@@ -52,41 +52,41 @@
52
52
  transform: translateX(-50%);
53
53
  background-color: var(--color-light-graphic-neutral);
54
54
  }
55
- .bottom-sheet__scrollableContainer_1rr5r {
55
+ .bottom-sheet__scrollableContainer_1ielz {
56
56
  overflow: auto;
57
57
  padding-top: var(--gap-2xl);
58
58
  }
59
- .bottom-sheet__withPadding_1rr5r {
59
+ .bottom-sheet__withPadding_1ielz {
60
60
  padding-bottom: var(--gap-xl);
61
61
  }
62
- .bottom-sheet__content_1rr5r {
62
+ .bottom-sheet__content_1ielz {
63
63
  display: flex;
64
64
  flex-direction: column;
65
65
  flex: 1;
66
66
  padding: 0 var(--gap-m) var(--gap-m);
67
67
  color: var(--color-light-text-primary);
68
68
  }
69
- .bottom-sheet__title_1rr5r {
69
+ .bottom-sheet__title_1ielz {
70
70
  margin-bottom: var(--gap-xl);
71
71
  padding: 0 var(--gap-m);
72
72
  }
73
- .bottom-sheet__scrollLocked_1rr5r {
73
+ .bottom-sheet__scrollLocked_1ielz {
74
74
  overflow: hidden;
75
75
  }
76
- .bottom-sheet__appear_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__enter_1rr5r .bottom-sheet__component_1rr5r {
76
+ .bottom-sheet__appear_1ielz .bottom-sheet__component_1ielz, .bottom-sheet__enter_1ielz .bottom-sheet__component_1ielz {
77
77
  transition: none;
78
78
  }
79
- .bottom-sheet__appearActive_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__enterActive_1rr5r .bottom-sheet__component_1rr5r {
79
+ .bottom-sheet__appearActive_1ielz .bottom-sheet__component_1ielz, .bottom-sheet__enterActive_1ielz .bottom-sheet__component_1ielz {
80
80
  transition: var(--bottom-sheet-in-transition);
81
81
  transform: translateY(0);
82
82
  }
83
- .bottom-sheet__enterDone_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__appearDone_1rr5r .bottom-sheet__component_1rr5r {
83
+ .bottom-sheet__enterDone_1ielz .bottom-sheet__component_1ielz, .bottom-sheet__appearDone_1ielz .bottom-sheet__component_1ielz {
84
84
  transform: translateY(0);
85
85
  }
86
- .bottom-sheet__exit_1rr5r .bottom-sheet__component_1rr5r {
86
+ .bottom-sheet__exit_1ielz .bottom-sheet__component_1ielz {
87
87
  transform: translateY(0);
88
88
  }
89
- .bottom-sheet__exitActive_1rr5r .bottom-sheet__component_1rr5r {
89
+ .bottom-sheet__exitActive_1ielz .bottom-sheet__component_1ielz {
90
90
  transition: var(--bottom-sheet-out-transition);
91
91
  transform: translateY(100%);
92
92
  }
package/dist/esm/index.js CHANGED
@@ -1,4 +1,4 @@
1
- import './Component-fff1007b.js';
1
+ import './Component-6badd464.js';
2
2
  import 'react';
3
3
  import 'classnames';
4
4
  import 'react-swipeable';
package/dist/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1qgns */
1
+ /* hash: znx0k */
2
2
  :root {
3
3
  --color-light-bg-primary: #fff;
4
4
  --color-light-graphic-neutral: #dbdee1;
@@ -22,14 +22,14 @@
22
22
  --bottom-sheet-in-transition: 0.5s cubic-bezier(0.09, 0.91, 0.18, 0.99);
23
23
  --bottom-sheet-out-transition: 0.3s ease;
24
24
  }
25
- .bottom-sheet__modal_1rr5r {
25
+ .bottom-sheet__modal_1ielz {
26
26
  background-color: transparent;
27
27
  position: fixed;
28
28
  bottom: 0;
29
29
  width: 100%;
30
30
  max-width: 600px;
31
31
  }
32
- .bottom-sheet__component_1rr5r {
32
+ .bottom-sheet__component_1ielz {
33
33
  position: relative;
34
34
  display: flex;
35
35
  flex-direction: column;
@@ -39,10 +39,10 @@
39
39
  background: var(--color-light-bg-primary);
40
40
  transform: translateY(100%);
41
41
  }
42
- .bottom-sheet__withTransition_1rr5r {
42
+ .bottom-sheet__withTransition_1ielz {
43
43
  transition: var(--bottom-sheet-out-transition);
44
44
  }
45
- .bottom-sheet__marker_1rr5r {
45
+ .bottom-sheet__marker_1ielz {
46
46
  position: absolute;
47
47
  top: var(--gap-xs);
48
48
  left: 50%;
@@ -52,41 +52,41 @@
52
52
  transform: translateX(-50%);
53
53
  background-color: var(--color-light-graphic-neutral);
54
54
  }
55
- .bottom-sheet__scrollableContainer_1rr5r {
55
+ .bottom-sheet__scrollableContainer_1ielz {
56
56
  overflow: auto;
57
57
  padding-top: var(--gap-2xl);
58
58
  }
59
- .bottom-sheet__withPadding_1rr5r {
59
+ .bottom-sheet__withPadding_1ielz {
60
60
  padding-bottom: var(--gap-xl);
61
61
  }
62
- .bottom-sheet__content_1rr5r {
62
+ .bottom-sheet__content_1ielz {
63
63
  display: flex;
64
64
  flex-direction: column;
65
65
  flex: 1;
66
66
  padding: 0 var(--gap-m) var(--gap-m);
67
67
  color: var(--color-light-text-primary);
68
68
  }
69
- .bottom-sheet__title_1rr5r {
69
+ .bottom-sheet__title_1ielz {
70
70
  margin-bottom: var(--gap-xl);
71
71
  padding: 0 var(--gap-m);
72
72
  }
73
- .bottom-sheet__scrollLocked_1rr5r {
73
+ .bottom-sheet__scrollLocked_1ielz {
74
74
  overflow: hidden;
75
75
  }
76
- .bottom-sheet__appear_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__enter_1rr5r .bottom-sheet__component_1rr5r {
76
+ .bottom-sheet__appear_1ielz .bottom-sheet__component_1ielz, .bottom-sheet__enter_1ielz .bottom-sheet__component_1ielz {
77
77
  transition: none;
78
78
  }
79
- .bottom-sheet__appearActive_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__enterActive_1rr5r .bottom-sheet__component_1rr5r {
79
+ .bottom-sheet__appearActive_1ielz .bottom-sheet__component_1ielz, .bottom-sheet__enterActive_1ielz .bottom-sheet__component_1ielz {
80
80
  transition: var(--bottom-sheet-in-transition);
81
81
  transform: translateY(0);
82
82
  }
83
- .bottom-sheet__enterDone_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__appearDone_1rr5r .bottom-sheet__component_1rr5r {
83
+ .bottom-sheet__enterDone_1ielz .bottom-sheet__component_1ielz, .bottom-sheet__appearDone_1ielz .bottom-sheet__component_1ielz {
84
84
  transform: translateY(0);
85
85
  }
86
- .bottom-sheet__exit_1rr5r .bottom-sheet__component_1rr5r {
86
+ .bottom-sheet__exit_1ielz .bottom-sheet__component_1ielz {
87
87
  transform: translateY(0);
88
88
  }
89
- .bottom-sheet__exitActive_1rr5r .bottom-sheet__component_1rr5r {
89
+ .bottom-sheet__exitActive_1ielz .bottom-sheet__component_1ielz {
90
90
  transition: var(--bottom-sheet-out-transition);
91
91
  transform: translateY(100%);
92
92
  }
package/dist/index.js CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- require('./Component-411270d3.js');
5
+ require('./Component-2ea4e400.js');
6
6
  require('react');
7
7
  require('classnames');
8
8
  require('react-swipeable');
@@ -7,7 +7,7 @@ import { Footer } from './components/footer/Component.js';
7
7
  import '@alfalab/core-components-backdrop/dist/modern';
8
8
  import { SwipeableBackdrop } from './components/swipeable-backdrop/Component.js';
9
9
 
10
- var styles = {"modal":"bottom-sheet__modal_1rr5r","component":"bottom-sheet__component_1rr5r","withTransition":"bottom-sheet__withTransition_1rr5r","marker":"bottom-sheet__marker_1rr5r","scrollableContainer":"bottom-sheet__scrollableContainer_1rr5r","withPadding":"bottom-sheet__withPadding_1rr5r","content":"bottom-sheet__content_1rr5r","title":"bottom-sheet__title_1rr5r","scrollLocked":"bottom-sheet__scrollLocked_1rr5r","appear":"bottom-sheet__appear_1rr5r","enter":"bottom-sheet__enter_1rr5r","appearActive":"bottom-sheet__appearActive_1rr5r","enterActive":"bottom-sheet__enterActive_1rr5r","enterDone":"bottom-sheet__enterDone_1rr5r","appearDone":"bottom-sheet__appearDone_1rr5r","exit":"bottom-sheet__exit_1rr5r","exitActive":"bottom-sheet__exitActive_1rr5r"};
10
+ var styles = {"modal":"bottom-sheet__modal_1ielz","component":"bottom-sheet__component_1ielz","withTransition":"bottom-sheet__withTransition_1ielz","marker":"bottom-sheet__marker_1ielz","scrollableContainer":"bottom-sheet__scrollableContainer_1ielz","withPadding":"bottom-sheet__withPadding_1ielz","content":"bottom-sheet__content_1ielz","title":"bottom-sheet__title_1ielz","scrollLocked":"bottom-sheet__scrollLocked_1ielz","appear":"bottom-sheet__appear_1ielz","enter":"bottom-sheet__enter_1ielz","appearActive":"bottom-sheet__appearActive_1ielz","enterActive":"bottom-sheet__enterActive_1ielz","enterDone":"bottom-sheet__enterDone_1ielz","appearDone":"bottom-sheet__appearDone_1ielz","exit":"bottom-sheet__exit_1ielz","exitActive":"bottom-sheet__exitActive_1ielz"};
11
11
  require('./index.css')
12
12
 
13
13
  const TIMEOUT = 300;
@@ -116,7 +116,7 @@ const BottomSheet = forwardRef(({ open, title, actionButton, contentClassName, c
116
116
  const getSwipeStyles = () => ({
117
117
  transform: sheetOffset ? `translateY(${sheetOffset}px)` : '',
118
118
  });
119
- return (React.createElement(BaseModal, { open: open, ref: ref, dataTestId: dataTestId, zIndex: zIndex, onClose: onClose, onBackdropClick: onClose, scrollHandler: scrollableContainer, Backdrop: SwipeableBackdrop, backdropProps: {
119
+ return (React.createElement(BaseModal, { open: open, ref: ref, dataTestId: dataTestId, zIndex: zIndex, onClose: onClose, scrollHandler: scrollableContainer, Backdrop: SwipeableBackdrop, backdropProps: {
120
120
  opacity: backdropOpacity,
121
121
  handlers: backdropSwipeablehandlers,
122
122
  opacityTimeout: TIMEOUT,
@@ -2,7 +2,7 @@ import React, { useContext, useEffect } from 'react';
2
2
  import cn from 'classnames';
3
3
  import { BaseModalContext } from '@alfalab/core-components-base-modal/dist/modern';
4
4
 
5
- var styles = {"footer":"bottom-sheet__footer_qcucr","highlighted":"bottom-sheet__highlighted_qcucr"};
5
+ var styles = {"footer":"bottom-sheet__footer_byygy","highlighted":"bottom-sheet__highlighted_byygy"};
6
6
  require('./index.css')
7
7
 
8
8
  const Footer = ({ children, className }) => {
@@ -1,4 +1,4 @@
1
- /* hash: nuzfd */
1
+ /* hash: 657hw */
2
2
  :root {
3
3
  --color-light-bg-primary: #fff;
4
4
  }
@@ -15,12 +15,12 @@
15
15
  --gap-m: 16px;
16
16
  --gap-3xl: 40px;
17
17
  }
18
- .bottom-sheet__footer_qcucr {
18
+ .bottom-sheet__footer_byygy {
19
19
  position: sticky;
20
20
  bottom: 0;
21
21
  padding: var(--gap-m) var(--gap-m) var(--gap-3xl);
22
22
  background-color: var(--color-light-bg-primary);
23
23
  }
24
- .bottom-sheet__highlighted_qcucr {
24
+ .bottom-sheet__highlighted_byygy {
25
25
  box-shadow: var(--shadow-s-up);
26
26
  }
@@ -1,4 +1,4 @@
1
- /* hash: 1qgns */
1
+ /* hash: znx0k */
2
2
  :root {
3
3
  --color-light-bg-primary: #fff;
4
4
  --color-light-graphic-neutral: #dbdee1;
@@ -22,14 +22,14 @@
22
22
  --bottom-sheet-in-transition: 0.5s cubic-bezier(0.09, 0.91, 0.18, 0.99);
23
23
  --bottom-sheet-out-transition: 0.3s ease;
24
24
  }
25
- .bottom-sheet__modal_1rr5r {
25
+ .bottom-sheet__modal_1ielz {
26
26
  background-color: transparent;
27
27
  position: fixed;
28
28
  bottom: 0;
29
29
  width: 100%;
30
30
  max-width: 600px;
31
31
  }
32
- .bottom-sheet__component_1rr5r {
32
+ .bottom-sheet__component_1ielz {
33
33
  position: relative;
34
34
  display: flex;
35
35
  flex-direction: column;
@@ -39,10 +39,10 @@
39
39
  background: var(--color-light-bg-primary);
40
40
  transform: translateY(100%);
41
41
  }
42
- .bottom-sheet__withTransition_1rr5r {
42
+ .bottom-sheet__withTransition_1ielz {
43
43
  transition: var(--bottom-sheet-out-transition);
44
44
  }
45
- .bottom-sheet__marker_1rr5r {
45
+ .bottom-sheet__marker_1ielz {
46
46
  position: absolute;
47
47
  top: var(--gap-xs);
48
48
  left: 50%;
@@ -52,41 +52,41 @@
52
52
  transform: translateX(-50%);
53
53
  background-color: var(--color-light-graphic-neutral);
54
54
  }
55
- .bottom-sheet__scrollableContainer_1rr5r {
55
+ .bottom-sheet__scrollableContainer_1ielz {
56
56
  overflow: auto;
57
57
  padding-top: var(--gap-2xl);
58
58
  }
59
- .bottom-sheet__withPadding_1rr5r {
59
+ .bottom-sheet__withPadding_1ielz {
60
60
  padding-bottom: var(--gap-xl);
61
61
  }
62
- .bottom-sheet__content_1rr5r {
62
+ .bottom-sheet__content_1ielz {
63
63
  display: flex;
64
64
  flex-direction: column;
65
65
  flex: 1;
66
66
  padding: 0 var(--gap-m) var(--gap-m);
67
67
  color: var(--color-light-text-primary);
68
68
  }
69
- .bottom-sheet__title_1rr5r {
69
+ .bottom-sheet__title_1ielz {
70
70
  margin-bottom: var(--gap-xl);
71
71
  padding: 0 var(--gap-m);
72
72
  }
73
- .bottom-sheet__scrollLocked_1rr5r {
73
+ .bottom-sheet__scrollLocked_1ielz {
74
74
  overflow: hidden;
75
75
  }
76
- .bottom-sheet__appear_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__enter_1rr5r .bottom-sheet__component_1rr5r {
76
+ .bottom-sheet__appear_1ielz .bottom-sheet__component_1ielz, .bottom-sheet__enter_1ielz .bottom-sheet__component_1ielz {
77
77
  transition: none;
78
78
  }
79
- .bottom-sheet__appearActive_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__enterActive_1rr5r .bottom-sheet__component_1rr5r {
79
+ .bottom-sheet__appearActive_1ielz .bottom-sheet__component_1ielz, .bottom-sheet__enterActive_1ielz .bottom-sheet__component_1ielz {
80
80
  transition: var(--bottom-sheet-in-transition);
81
81
  transform: translateY(0);
82
82
  }
83
- .bottom-sheet__enterDone_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__appearDone_1rr5r .bottom-sheet__component_1rr5r {
83
+ .bottom-sheet__enterDone_1ielz .bottom-sheet__component_1ielz, .bottom-sheet__appearDone_1ielz .bottom-sheet__component_1ielz {
84
84
  transform: translateY(0);
85
85
  }
86
- .bottom-sheet__exit_1rr5r .bottom-sheet__component_1rr5r {
86
+ .bottom-sheet__exit_1ielz .bottom-sheet__component_1ielz {
87
87
  transform: translateY(0);
88
88
  }
89
- .bottom-sheet__exitActive_1rr5r .bottom-sheet__component_1rr5r {
89
+ .bottom-sheet__exitActive_1ielz .bottom-sheet__component_1ielz {
90
90
  transition: var(--bottom-sheet-out-transition);
91
91
  transform: translateY(100%);
92
92
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alfalab/core-components-bottom-sheet",
3
- "version": "3.0.1",
3
+ "version": "3.0.2",
4
4
  "description": "Bottom sheet mobile component",
5
5
  "keywords": [],
6
6
  "license": "MIT",
@@ -27,5 +27,5 @@
27
27
  "react-swipeable": "^5.5.0",
28
28
  "react-transition-group": "^4.3.0"
29
29
  },
30
- "gitHead": "d35b2d43cbc90ecb7665c682a2de13733bc03eb0"
30
+ "gitHead": "108ff074b584a39584279b079825456dc579db41"
31
31
  }