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

package/CHANGELOG.md

@@ -3,6 +3,76 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [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)
+
+**Note:** Version bump only for package @alfalab/core-components-bottom-sheet
+
+
+
+
+
+# [3.0.0](https://github.com/alfa-laboratory/core-components/compare/@alfalab/core-components-bottom-sheet@2.1.1...@alfalab/core-components-bottom-sheet@3.0.0) (2021-11-26)
+
+
+### Features
+
+* **button:** добавлена кнопка размера 40px, изменены скругления ([#886](https://github.com/alfa-laboratory/core-components/issues/886)) ([88e657a](https://github.com/alfa-laboratory/core-components/commit/88e657a9f0f68b8b58f6e9437053954ee984f83c)), closes [#890](https://github.com/alfa-laboratory/core-components/issues/890)
+
+
+### BREAKING CHANGES
+
+* **button:** Кнопка размера xs теперь имеет размер 40px. Тем, кто использовал размер xs, надо
+заменить размер  на xxs. Можно воспользоваться codemod.
+
+* feat(codemod): add button xs to xxs transformer
+
+* feat(tag): добавлен тэг размера 40px, изменены отступы
+
+Добавлен тэг размером 40px, изменены отступы. Тем, кто использовал размер xs, надо заменить размер
+на xxs.
+* **button:** Тэг размера xs теперь имеет размер 40px. Тем, кто использовал размер xs, надо
+заменить размер на xxs. Можно воспользоваться codemod.
+
+* test: update screenshots
+
+* test: update screenshots
+
+* feat(button): linter fix
+
+* feat(button): fix min-width
+
+* feat(tag): remove vertical paddings
+
+* feat(tag): remove vertical paddings
+
+* feat(button): updates
+
+
+
+
+
+## [2.1.1](https://github.com/alfa-laboratory/core-components/compare/@alfalab/core-components-bottom-sheet@2.1.0...@alfalab/core-components-bottom-sheet@2.1.1) (2021-09-14)
+
+
+### Bug Fixes
+
+* **base-modal:** modal scroll ([#820](https://github.com/alfa-laboratory/core-components/issues/820)) ([1b2d94a](https://github.com/alfa-laboratory/core-components/commit/1b2d94ad45e04145bf1292d749ae2028702dc622))
+
+
+
+
+
+# [2.1.0](https://github.com/alfa-laboratory/core-components/compare/@alfalab/core-components-bottom-sheet@2.0.2...@alfalab/core-components-bottom-sheet@2.1.0) (2021-07-23)
+
+
+### Features
+
+* **bottom-sheet:** fix marker gap, fix animation duration ([#750](https://github.com/alfa-laboratory/core-components/issues/750)) ([cb04ed8](https://github.com/alfa-laboratory/core-components/commit/cb04ed8cc214fac9dba32a0ab39a4399743d5bfc))
+
+
+
+
+
 ## [2.0.2](https://github.com/alfa-laboratory/core-components/compare/@alfalab/core-components-bottom-sheet@2.0.1...@alfalab/core-components-bottom-sheet@2.0.2) (2021-07-19)
 
 **Note:** Version bump only for package @alfalab/core-components-bottom-sheet

package/dist/{Component-efcb3ff4.js → Component-411270d3.js}

@@ -47,11 +47,8 @@ function __rest(s, e) {
 }
 
 var SwipeableBackdrop = function (_a) {
-    var opacity = _a.opacity, handlers = _a.handlers, opacityTimeout = _a.opacityTimeout, backdropProps = __rest(_a, ["opacity", "handlers", "opacityTimeout"]);
-    return (React__default['default'].createElement("div", exports.__assign({}, handlers, { style: {
-            opacity: opacity,
-            transition: opacity === 1 ? "opacity " + opacityTimeout + "ms ease-in-out" : '',
-        } }),
+    var opacity = _a.opacity, handlers = _a.handlers, opacityTimeout = _a.opacityTimeout, style = _a.style, backdropProps = __rest(_a, ["opacity", "handlers", "opacityTimeout", "style"]);
+    return (React__default['default'].createElement("div", exports.__assign({}, handlers, { style: exports.__assign({ opacity: opacity, transition: opacity === 1 ? "opacity " + opacityTimeout + "ms ease-in-out" : '', position: 'relative' }, style) }),
         React__default['default'].createElement(coreComponentsBackdrop.Backdrop, exports.__assign({}, backdropProps))));
 };
 

package/dist/component.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var components_swipeableBackdrop_Component = require('./Component-efcb3ff4.js');
+var components_swipeableBackdrop_Component = require('./Component-411270d3.js');
 var React = require('react');
 var cn = require('classnames');
 var reactSwipeable = require('react-swipeable');
@@ -16,7 +16,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"modal":"bottom-sheet__modal_15lwo","component":"bottom-sheet__component_15lwo","withTransition":"bottom-sheet__withTransition_15lwo","marker":"bottom-sheet__marker_15lwo","scrollableContainer":"bottom-sheet__scrollableContainer_15lwo","withPadding":"bottom-sheet__withPadding_15lwo","content":"bottom-sheet__content_15lwo","title":"bottom-sheet__title_15lwo","scrollLocked":"bottom-sheet__scrollLocked_15lwo","appear":"bottom-sheet__appear_15lwo","enter":"bottom-sheet__enter_15lwo","appearActive":"bottom-sheet__appearActive_15lwo","enterActive":"bottom-sheet__enterActive_15lwo","enterDone":"bottom-sheet__enterDone_15lwo","appearDone":"bottom-sheet__appearDone_15lwo","exit":"bottom-sheet__exit_15lwo","exitActive":"bottom-sheet__exitActive_15lwo"};
+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"};
 require('./index.css')
 
 var TIMEOUT = 300;

package/dist/components/footer/Component.js

@@ -11,7 +11,7 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
 var cn__default = /*#__PURE__*/_interopDefaultLegacy(cn);
 
-var styles = {"footer":"bottom-sheet__footer_332sh","highlighted":"bottom-sheet__highlighted_332sh"};
+var styles = {"footer":"bottom-sheet__footer_qcucr","highlighted":"bottom-sheet__highlighted_qcucr"};
 require('./index.css')
 
 var Footer = function (_a) {

package/dist/components/footer/index.css

@@ -1,4 +1,4 @@
-/* hash: 332sh */
+/* hash: nuzfd */
 :root {
     --color-light-bg-primary: #fff;
 }
@@ -15,12 +15,12 @@
     --gap-m: 16px;
     --gap-3xl: 40px;
 }
-.bottom-sheet__footer_332sh {
+.bottom-sheet__footer_qcucr {
     position: sticky;
     bottom: 0;
     padding: var(--gap-m) var(--gap-m) var(--gap-3xl);
     background-color: var(--color-light-bg-primary);
 }
-.bottom-sheet__highlighted_332sh {
+.bottom-sheet__highlighted_qcucr {
     box-shadow: var(--shadow-s-up);
 }

package/dist/components/swipeable-backdrop/Component.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var components_swipeableBackdrop_Component = require('../../Component-efcb3ff4.js');
+var components_swipeableBackdrop_Component = require('../../Component-411270d3.js');
 require('react');
 require('@alfalab/core-components-backdrop');
 

package/dist/cssm/{Component-3a3629ef.js → Component-24200d96.js}

@@ -47,11 +47,8 @@ function __rest(s, e) {
 }
 
 var SwipeableBackdrop = function (_a) {
-    var opacity = _a.opacity, handlers = _a.handlers, opacityTimeout = _a.opacityTimeout, backdropProps = __rest(_a, ["opacity", "handlers", "opacityTimeout"]);
-    return (React__default['default'].createElement("div", exports.__assign({}, handlers, { style: {
-            opacity: opacity,
-            transition: opacity === 1 ? "opacity " + opacityTimeout + "ms ease-in-out" : '',
-        } }),
+    var opacity = _a.opacity, handlers = _a.handlers, opacityTimeout = _a.opacityTimeout, style = _a.style, backdropProps = __rest(_a, ["opacity", "handlers", "opacityTimeout", "style"]);
+    return (React__default['default'].createElement("div", exports.__assign({}, handlers, { style: exports.__assign({ opacity: opacity, transition: opacity === 1 ? "opacity " + opacityTimeout + "ms ease-in-out" : '', position: 'relative' }, style) }),
         React__default['default'].createElement(coreComponentsBackdrop.Backdrop, exports.__assign({}, backdropProps))));
 };
 

package/dist/cssm/component.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var components_swipeableBackdrop_Component = require('./Component-3a3629ef.js');
+var components_swipeableBackdrop_Component = require('./Component-24200d96.js');
 var React = require('react');
 var cn = require('classnames');
 var reactSwipeable = require('react-swipeable');

package/dist/cssm/components/swipeable-backdrop/Component.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var components_swipeableBackdrop_Component = require('../../Component-3a3629ef.js');
+var components_swipeableBackdrop_Component = require('../../Component-24200d96.js');
 require('react');
 require('@alfalab/core-components-backdrop/dist/cssm');
 

package/dist/cssm/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('./Component-3a3629ef.js');
+require('./Component-24200d96.js');
 require('react');
 require('classnames');
 require('react-swipeable');

package/dist/cssm/index.module.css

@@ -12,13 +12,13 @@
     /* Hard up */
 }
 :root {
-    --gap-2xs: 4px;
+    --gap-xs: 8px;
     --gap-m: 16px;
     --gap-xl: 24px;
     --gap-2xl: 32px;
 }
 :root {
-    --bottom-sheet-in-transition: 0.7s cubic-bezier(0.09, 0.91, 0.18, 0.99);
+    --bottom-sheet-in-transition: 0.5s cubic-bezier(0.09, 0.91, 0.18, 0.99);
     --bottom-sheet-out-transition: 0.3s ease;
 }
 .modal {
@@ -43,7 +43,7 @@
 }
 .marker {
     position: absolute;
-    top: var(--gap-2xs);
+    top: var(--gap-xs);
     left: 50%;
     width: 36px;
     height: 4px;

package/dist/esm/{Component-45d95b4b.js → Component-fff1007b.js}

@@ -41,11 +41,8 @@ function __rest(s, e) {
 }
 
 var SwipeableBackdrop = function (_a) {
-    var opacity = _a.opacity, handlers = _a.handlers, opacityTimeout = _a.opacityTimeout, backdropProps = __rest(_a, ["opacity", "handlers", "opacityTimeout"]);
-    return (React.createElement("div", __assign({}, handlers, { style: {
-            opacity: opacity,
-            transition: opacity === 1 ? "opacity " + opacityTimeout + "ms ease-in-out" : '',
-        } }),
+    var opacity = _a.opacity, handlers = _a.handlers, opacityTimeout = _a.opacityTimeout, style = _a.style, backdropProps = __rest(_a, ["opacity", "handlers", "opacityTimeout", "style"]);
+    return (React.createElement("div", __assign({}, handlers, { style: __assign({ opacity: opacity, transition: opacity === 1 ? "opacity " + opacityTimeout + "ms ease-in-out" : '', position: 'relative' }, style) }),
         React.createElement(Backdrop, __assign({}, backdropProps))));
 };
 

package/dist/esm/component.js

@@ -1,4 +1,4 @@
-import { S as SwipeableBackdrop, _ as __assign } from './Component-45d95b4b.js';
+import { S as SwipeableBackdrop, _ as __assign } from './Component-fff1007b.js';
 import React, { forwardRef, useState, useRef, useCallback, useEffect } from 'react';
 import cn from 'classnames';
 import { useSwipeable } from 'react-swipeable';
@@ -7,7 +7,7 @@ import { Typography } from '@alfalab/core-components-typography/dist/esm';
 import { Footer } from './components/footer/Component.js';
 import '@alfalab/core-components-backdrop/dist/esm';
 
-var styles = {"modal":"bottom-sheet__modal_15lwo","component":"bottom-sheet__component_15lwo","withTransition":"bottom-sheet__withTransition_15lwo","marker":"bottom-sheet__marker_15lwo","scrollableContainer":"bottom-sheet__scrollableContainer_15lwo","withPadding":"bottom-sheet__withPadding_15lwo","content":"bottom-sheet__content_15lwo","title":"bottom-sheet__title_15lwo","scrollLocked":"bottom-sheet__scrollLocked_15lwo","appear":"bottom-sheet__appear_15lwo","enter":"bottom-sheet__enter_15lwo","appearActive":"bottom-sheet__appearActive_15lwo","enterActive":"bottom-sheet__enterActive_15lwo","enterDone":"bottom-sheet__enterDone_15lwo","appearDone":"bottom-sheet__appearDone_15lwo","exit":"bottom-sheet__exit_15lwo","exitActive":"bottom-sheet__exitActive_15lwo"};
+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"};
 require('./index.css')
 
 var TIMEOUT = 300;

package/dist/esm/components/footer/Component.js

@@ -2,7 +2,7 @@ import React, { useContext, useEffect } from 'react';
 import cn from 'classnames';
 import { BaseModalContext } from '@alfalab/core-components-base-modal/dist/esm';
 
-var styles = {"footer":"bottom-sheet__footer_332sh","highlighted":"bottom-sheet__highlighted_332sh"};
+var styles = {"footer":"bottom-sheet__footer_qcucr","highlighted":"bottom-sheet__highlighted_qcucr"};
 require('./index.css')
 
 var Footer = function (_a) {

package/dist/esm/components/footer/index.css

@@ -1,4 +1,4 @@
-/* hash: 332sh */
+/* hash: nuzfd */
 :root {
     --color-light-bg-primary: #fff;
 }
@@ -15,12 +15,12 @@
     --gap-m: 16px;
     --gap-3xl: 40px;
 }
-.bottom-sheet__footer_332sh {
+.bottom-sheet__footer_qcucr {
     position: sticky;
     bottom: 0;
     padding: var(--gap-m) var(--gap-m) var(--gap-3xl);
     background-color: var(--color-light-bg-primary);
 }
-.bottom-sheet__highlighted_332sh {
+.bottom-sheet__highlighted_qcucr {
     box-shadow: var(--shadow-s-up);
 }

package/dist/esm/components/swipeable-backdrop/Component.js

@@ -1,3 +1,3 @@
-export { S as SwipeableBackdrop } from '../../Component-45d95b4b.js';
+export { S as SwipeableBackdrop } from '../../Component-fff1007b.js';
 import 'react';
 import '@alfalab/core-components-backdrop/dist/esm';

package/dist/esm/index.css

@@ -1,4 +1,4 @@
-/* hash: 15lwo */
+/* hash: 1qgns */
 :root {
     --color-light-bg-primary: #fff;
     --color-light-graphic-neutral: #dbdee1;
@@ -13,23 +13,23 @@
     /* Hard up */
 }
 :root {
-    --gap-2xs: 4px;
+    --gap-xs: 8px;
     --gap-m: 16px;
     --gap-xl: 24px;
     --gap-2xl: 32px;
 }
 :root {
-    --bottom-sheet-in-transition: 0.7s cubic-bezier(0.09, 0.91, 0.18, 0.99);
+    --bottom-sheet-in-transition: 0.5s cubic-bezier(0.09, 0.91, 0.18, 0.99);
     --bottom-sheet-out-transition: 0.3s ease;
 }
-.bottom-sheet__modal_15lwo {
+.bottom-sheet__modal_1rr5r {
     background-color: transparent;
     position: fixed;
     bottom: 0;
     width: 100%;
     max-width: 600px;
 }
-.bottom-sheet__component_15lwo {
+.bottom-sheet__component_1rr5r {
     position: relative;
     display: flex;
     flex-direction: column;
@@ -39,12 +39,12 @@
     background: var(--color-light-bg-primary);
     transform: translateY(100%);
 }
-.bottom-sheet__withTransition_15lwo {
+.bottom-sheet__withTransition_1rr5r {
     transition: var(--bottom-sheet-out-transition);
 }
-.bottom-sheet__marker_15lwo {
+.bottom-sheet__marker_1rr5r {
     position: absolute;
-    top: var(--gap-2xs);
+    top: var(--gap-xs);
     left: 50%;
     width: 36px;
     height: 4px;
@@ -52,41 +52,41 @@
     transform: translateX(-50%);
     background-color: var(--color-light-graphic-neutral);
 }
-.bottom-sheet__scrollableContainer_15lwo {
+.bottom-sheet__scrollableContainer_1rr5r {
     overflow: auto;
     padding-top: var(--gap-2xl);
 }
-.bottom-sheet__withPadding_15lwo {
+.bottom-sheet__withPadding_1rr5r {
     padding-bottom: var(--gap-xl);
 }
-.bottom-sheet__content_15lwo {
+.bottom-sheet__content_1rr5r {
     display: flex;
     flex-direction: column;
     flex: 1;
     padding: 0 var(--gap-m) var(--gap-m);
     color: var(--color-light-text-primary);
 }
-.bottom-sheet__title_15lwo {
+.bottom-sheet__title_1rr5r {
     margin-bottom: var(--gap-xl);
     padding: 0 var(--gap-m);
 }
-.bottom-sheet__scrollLocked_15lwo {
+.bottom-sheet__scrollLocked_1rr5r {
     overflow: hidden;
 }
-.bottom-sheet__appear_15lwo .bottom-sheet__component_15lwo, .bottom-sheet__enter_15lwo .bottom-sheet__component_15lwo {
+.bottom-sheet__appear_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__enter_1rr5r .bottom-sheet__component_1rr5r {
         transition: none;
     }
-.bottom-sheet__appearActive_15lwo .bottom-sheet__component_15lwo, .bottom-sheet__enterActive_15lwo .bottom-sheet__component_15lwo {
+.bottom-sheet__appearActive_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__enterActive_1rr5r .bottom-sheet__component_1rr5r {
         transition: var(--bottom-sheet-in-transition);
         transform: translateY(0);
     }
-.bottom-sheet__enterDone_15lwo .bottom-sheet__component_15lwo, .bottom-sheet__appearDone_15lwo .bottom-sheet__component_15lwo {
+.bottom-sheet__enterDone_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__appearDone_1rr5r .bottom-sheet__component_1rr5r {
         transform: translateY(0);
     }
-.bottom-sheet__exit_15lwo .bottom-sheet__component_15lwo {
+.bottom-sheet__exit_1rr5r .bottom-sheet__component_1rr5r {
         transform: translateY(0);
     }
-.bottom-sheet__exitActive_15lwo .bottom-sheet__component_15lwo {
+.bottom-sheet__exitActive_1rr5r .bottom-sheet__component_1rr5r {
         transition: var(--bottom-sheet-out-transition);
         transform: translateY(100%);
     }

package/dist/esm/index.js

@@ -1,4 +1,4 @@
-import './Component-45d95b4b.js';
+import './Component-fff1007b.js';
 import 'react';
 import 'classnames';
 import 'react-swipeable';

package/dist/index.css

@@ -1,4 +1,4 @@
-/* hash: 15lwo */
+/* hash: 1qgns */
 :root {
     --color-light-bg-primary: #fff;
     --color-light-graphic-neutral: #dbdee1;
@@ -13,23 +13,23 @@
     /* Hard up */
 }
 :root {
-    --gap-2xs: 4px;
+    --gap-xs: 8px;
     --gap-m: 16px;
     --gap-xl: 24px;
     --gap-2xl: 32px;
 }
 :root {
-    --bottom-sheet-in-transition: 0.7s cubic-bezier(0.09, 0.91, 0.18, 0.99);
+    --bottom-sheet-in-transition: 0.5s cubic-bezier(0.09, 0.91, 0.18, 0.99);
     --bottom-sheet-out-transition: 0.3s ease;
 }
-.bottom-sheet__modal_15lwo {
+.bottom-sheet__modal_1rr5r {
     background-color: transparent;
     position: fixed;
     bottom: 0;
     width: 100%;
     max-width: 600px;
 }
-.bottom-sheet__component_15lwo {
+.bottom-sheet__component_1rr5r {
     position: relative;
     display: flex;
     flex-direction: column;
@@ -39,12 +39,12 @@
     background: var(--color-light-bg-primary);
     transform: translateY(100%);
 }
-.bottom-sheet__withTransition_15lwo {
+.bottom-sheet__withTransition_1rr5r {
     transition: var(--bottom-sheet-out-transition);
 }
-.bottom-sheet__marker_15lwo {
+.bottom-sheet__marker_1rr5r {
     position: absolute;
-    top: var(--gap-2xs);
+    top: var(--gap-xs);
     left: 50%;
     width: 36px;
     height: 4px;
@@ -52,41 +52,41 @@
     transform: translateX(-50%);
     background-color: var(--color-light-graphic-neutral);
 }
-.bottom-sheet__scrollableContainer_15lwo {
+.bottom-sheet__scrollableContainer_1rr5r {
     overflow: auto;
     padding-top: var(--gap-2xl);
 }
-.bottom-sheet__withPadding_15lwo {
+.bottom-sheet__withPadding_1rr5r {
     padding-bottom: var(--gap-xl);
 }
-.bottom-sheet__content_15lwo {
+.bottom-sheet__content_1rr5r {
     display: flex;
     flex-direction: column;
     flex: 1;
     padding: 0 var(--gap-m) var(--gap-m);
     color: var(--color-light-text-primary);
 }
-.bottom-sheet__title_15lwo {
+.bottom-sheet__title_1rr5r {
     margin-bottom: var(--gap-xl);
     padding: 0 var(--gap-m);
 }
-.bottom-sheet__scrollLocked_15lwo {
+.bottom-sheet__scrollLocked_1rr5r {
     overflow: hidden;
 }
-.bottom-sheet__appear_15lwo .bottom-sheet__component_15lwo, .bottom-sheet__enter_15lwo .bottom-sheet__component_15lwo {
+.bottom-sheet__appear_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__enter_1rr5r .bottom-sheet__component_1rr5r {
         transition: none;
     }
-.bottom-sheet__appearActive_15lwo .bottom-sheet__component_15lwo, .bottom-sheet__enterActive_15lwo .bottom-sheet__component_15lwo {
+.bottom-sheet__appearActive_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__enterActive_1rr5r .bottom-sheet__component_1rr5r {
         transition: var(--bottom-sheet-in-transition);
         transform: translateY(0);
     }
-.bottom-sheet__enterDone_15lwo .bottom-sheet__component_15lwo, .bottom-sheet__appearDone_15lwo .bottom-sheet__component_15lwo {
+.bottom-sheet__enterDone_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__appearDone_1rr5r .bottom-sheet__component_1rr5r {
         transform: translateY(0);
     }
-.bottom-sheet__exit_15lwo .bottom-sheet__component_15lwo {
+.bottom-sheet__exit_1rr5r .bottom-sheet__component_1rr5r {
         transform: translateY(0);
     }
-.bottom-sheet__exitActive_15lwo .bottom-sheet__component_15lwo {
+.bottom-sheet__exitActive_1rr5r .bottom-sheet__component_1rr5r {
         transition: var(--bottom-sheet-out-transition);
         transform: translateY(100%);
     }

package/dist/index.js

@@ -2,7 +2,7 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-require('./Component-efcb3ff4.js');
+require('./Component-411270d3.js');
 require('react');
 require('classnames');
 require('react-swipeable');

package/dist/modern/component.js

@@ -7,7 +7,7 @@ import { Footer } from './components/footer/Component.js';
 import '@alfalab/core-components-backdrop/dist/modern';
 import { SwipeableBackdrop } from './components/swipeable-backdrop/Component.js';
 
-var styles = {"modal":"bottom-sheet__modal_15lwo","component":"bottom-sheet__component_15lwo","withTransition":"bottom-sheet__withTransition_15lwo","marker":"bottom-sheet__marker_15lwo","scrollableContainer":"bottom-sheet__scrollableContainer_15lwo","withPadding":"bottom-sheet__withPadding_15lwo","content":"bottom-sheet__content_15lwo","title":"bottom-sheet__title_15lwo","scrollLocked":"bottom-sheet__scrollLocked_15lwo","appear":"bottom-sheet__appear_15lwo","enter":"bottom-sheet__enter_15lwo","appearActive":"bottom-sheet__appearActive_15lwo","enterActive":"bottom-sheet__enterActive_15lwo","enterDone":"bottom-sheet__enterDone_15lwo","appearDone":"bottom-sheet__appearDone_15lwo","exit":"bottom-sheet__exit_15lwo","exitActive":"bottom-sheet__exitActive_15lwo"};
+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"};
 require('./index.css')
 
 const TIMEOUT = 300;

package/dist/modern/components/footer/Component.js

@@ -2,7 +2,7 @@ import React, { useContext, useEffect } from 'react';
 import cn from 'classnames';
 import { BaseModalContext } from '@alfalab/core-components-base-modal/dist/modern';
 
-var styles = {"footer":"bottom-sheet__footer_332sh","highlighted":"bottom-sheet__highlighted_332sh"};
+var styles = {"footer":"bottom-sheet__footer_qcucr","highlighted":"bottom-sheet__highlighted_qcucr"};
 require('./index.css')
 
 const Footer = ({ children, className }) => {

package/dist/modern/components/footer/index.css

@@ -1,4 +1,4 @@
-/* hash: 332sh */
+/* hash: nuzfd */
 :root {
     --color-light-bg-primary: #fff;
 }
@@ -15,12 +15,12 @@
     --gap-m: 16px;
     --gap-3xl: 40px;
 }
-.bottom-sheet__footer_332sh {
+.bottom-sheet__footer_qcucr {
     position: sticky;
     bottom: 0;
     padding: var(--gap-m) var(--gap-m) var(--gap-3xl);
     background-color: var(--color-light-bg-primary);
 }
-.bottom-sheet__highlighted_332sh {
+.bottom-sheet__highlighted_qcucr {
     box-shadow: var(--shadow-s-up);
 }

package/dist/modern/components/swipeable-backdrop/Component.js

@@ -1,9 +1,11 @@
 import React from 'react';
 import { Backdrop } from '@alfalab/core-components-backdrop/dist/modern';
 
-const SwipeableBackdrop = ({ opacity, handlers, opacityTimeout, ...backdropProps }) => (React.createElement("div", Object.assign({}, handlers, { style: {
+const SwipeableBackdrop = ({ opacity, handlers, opacityTimeout, style, ...backdropProps }) => (React.createElement("div", Object.assign({}, handlers, { style: {
         opacity,
         transition: opacity === 1 ? `opacity ${opacityTimeout}ms ease-in-out` : '',
+        position: 'relative',
+        ...style,
     } }),
     React.createElement(Backdrop, Object.assign({}, backdropProps))));
 

package/dist/modern/index.css

@@ -1,4 +1,4 @@
-/* hash: 15lwo */
+/* hash: 1qgns */
 :root {
     --color-light-bg-primary: #fff;
     --color-light-graphic-neutral: #dbdee1;
@@ -13,23 +13,23 @@
     /* Hard up */
 }
 :root {
-    --gap-2xs: 4px;
+    --gap-xs: 8px;
     --gap-m: 16px;
     --gap-xl: 24px;
     --gap-2xl: 32px;
 }
 :root {
-    --bottom-sheet-in-transition: 0.7s cubic-bezier(0.09, 0.91, 0.18, 0.99);
+    --bottom-sheet-in-transition: 0.5s cubic-bezier(0.09, 0.91, 0.18, 0.99);
     --bottom-sheet-out-transition: 0.3s ease;
 }
-.bottom-sheet__modal_15lwo {
+.bottom-sheet__modal_1rr5r {
     background-color: transparent;
     position: fixed;
     bottom: 0;
     width: 100%;
     max-width: 600px;
 }
-.bottom-sheet__component_15lwo {
+.bottom-sheet__component_1rr5r {
     position: relative;
     display: flex;
     flex-direction: column;
@@ -39,12 +39,12 @@
     background: var(--color-light-bg-primary);
     transform: translateY(100%);
 }
-.bottom-sheet__withTransition_15lwo {
+.bottom-sheet__withTransition_1rr5r {
     transition: var(--bottom-sheet-out-transition);
 }
-.bottom-sheet__marker_15lwo {
+.bottom-sheet__marker_1rr5r {
     position: absolute;
-    top: var(--gap-2xs);
+    top: var(--gap-xs);
     left: 50%;
     width: 36px;
     height: 4px;
@@ -52,41 +52,41 @@
     transform: translateX(-50%);
     background-color: var(--color-light-graphic-neutral);
 }
-.bottom-sheet__scrollableContainer_15lwo {
+.bottom-sheet__scrollableContainer_1rr5r {
     overflow: auto;
     padding-top: var(--gap-2xl);
 }
-.bottom-sheet__withPadding_15lwo {
+.bottom-sheet__withPadding_1rr5r {
     padding-bottom: var(--gap-xl);
 }
-.bottom-sheet__content_15lwo {
+.bottom-sheet__content_1rr5r {
     display: flex;
     flex-direction: column;
     flex: 1;
     padding: 0 var(--gap-m) var(--gap-m);
     color: var(--color-light-text-primary);
 }
-.bottom-sheet__title_15lwo {
+.bottom-sheet__title_1rr5r {
     margin-bottom: var(--gap-xl);
     padding: 0 var(--gap-m);
 }
-.bottom-sheet__scrollLocked_15lwo {
+.bottom-sheet__scrollLocked_1rr5r {
     overflow: hidden;
 }
-.bottom-sheet__appear_15lwo .bottom-sheet__component_15lwo, .bottom-sheet__enter_15lwo .bottom-sheet__component_15lwo {
+.bottom-sheet__appear_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__enter_1rr5r .bottom-sheet__component_1rr5r {
         transition: none;
     }
-.bottom-sheet__appearActive_15lwo .bottom-sheet__component_15lwo, .bottom-sheet__enterActive_15lwo .bottom-sheet__component_15lwo {
+.bottom-sheet__appearActive_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__enterActive_1rr5r .bottom-sheet__component_1rr5r {
         transition: var(--bottom-sheet-in-transition);
         transform: translateY(0);
     }
-.bottom-sheet__enterDone_15lwo .bottom-sheet__component_15lwo, .bottom-sheet__appearDone_15lwo .bottom-sheet__component_15lwo {
+.bottom-sheet__enterDone_1rr5r .bottom-sheet__component_1rr5r, .bottom-sheet__appearDone_1rr5r .bottom-sheet__component_1rr5r {
         transform: translateY(0);
     }
-.bottom-sheet__exit_15lwo .bottom-sheet__component_15lwo {
+.bottom-sheet__exit_1rr5r .bottom-sheet__component_1rr5r {
         transform: translateY(0);
     }
-.bottom-sheet__exitActive_15lwo .bottom-sheet__component_15lwo {
+.bottom-sheet__exitActive_1rr5r .bottom-sheet__component_1rr5r {
         transition: var(--bottom-sheet-out-transition);
         transform: translateY(100%);
     }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alfalab/core-components-bottom-sheet",
-    "version": "2.0.2",
+    "version": "3.0.1",
     "description": "Bottom sheet mobile component",
     "keywords": [],
     "license": "MIT",
@@ -21,11 +21,11 @@
     },
     "dependencies": {
         "@alfalab/core-components-backdrop": "^2.0.1",
-        "@alfalab/core-components-base-modal": "^3.0.1",
-        "@alfalab/core-components-typography": "^2.1.0",
+        "@alfalab/core-components-base-modal": "^3.1.0",
+        "@alfalab/core-components-typography": "^2.3.0",
         "classnames": "^2.2.6",
         "react-swipeable": "^5.5.0",
         "react-transition-group": "^4.3.0"
     },
-    "gitHead": "394d0105c7162272b2f5666bd32cb5c32d132904"
+    "gitHead": "d35b2d43cbc90ecb7665c682a2de13733bc03eb0"
 }