@alfalab/core-components-bottom-sheet 6.7.0 → 6.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (26) hide show
  1. package/component.js +13 -11
  2. package/components/footer/Component.js +1 -1
  3. package/components/footer/index.css +26 -26
  4. package/components/header/Component.js +1 -1
  5. package/components/header/index.css +13 -13
  6. package/cssm/component.js +12 -10
  7. package/cssm/types.d.ts +5 -0
  8. package/esm/component.js +14 -12
  9. package/esm/components/footer/Component.js +1 -1
  10. package/esm/components/footer/index.css +26 -26
  11. package/esm/components/header/Component.js +1 -1
  12. package/esm/components/header/index.css +13 -13
  13. package/esm/index.css +43 -43
  14. package/esm/types.d.ts +5 -0
  15. package/index.css +43 -43
  16. package/modern/component.js +13 -12
  17. package/modern/components/footer/Component.js +1 -1
  18. package/modern/components/footer/index.css +26 -26
  19. package/modern/components/header/Component.js +1 -1
  20. package/modern/components/header/index.css +13 -13
  21. package/modern/index.css +43 -43
  22. package/modern/types.d.ts +5 -0
  23. package/package.json +3 -3
  24. package/src/component.tsx +13 -17
  25. package/src/types.ts +6 -0
  26. package/types.d.ts +5 -0
package/component.js CHANGED
@@ -23,13 +23,13 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
23
23
  var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
24
24
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
25
25
 
26
- var styles = {"modal":"bottom-sheet__modal_3cpay","wrapper":"bottom-sheet__wrapper_3cpay","fullscreen":"bottom-sheet__fullscreen_3cpay","component":"bottom-sheet__component_3cpay","withTransition":"bottom-sheet__withTransition_3cpay","scrollableContainer":"bottom-sheet__scrollableContainer_3cpay","marker":"bottom-sheet__marker_3cpay","defaultMarker":"bottom-sheet__defaultMarker_3cpay","content":"bottom-sheet__content_3cpay","noHeader":"bottom-sheet__noHeader_3cpay","noFooter":"bottom-sheet__noFooter_3cpay","scrollLocked":"bottom-sheet__scrollLocked_3cpay","hiddenScrollbar":"bottom-sheet__hiddenScrollbar_3cpay","disabledPointerEvents":"bottom-sheet__disabledPointerEvents_3cpay","appear":"bottom-sheet__appear_3cpay","enter":"bottom-sheet__enter_3cpay","appearActive":"bottom-sheet__appearActive_3cpay","enterActive":"bottom-sheet__enterActive_3cpay","enterDone":"bottom-sheet__enterDone_3cpay","appearDone":"bottom-sheet__appearDone_3cpay","exit":"bottom-sheet__exit_3cpay","exitActive":"bottom-sheet__exitActive_3cpay","background-accent":"bottom-sheet__background-accent_3cpay","background-info":"bottom-sheet__background-info_3cpay","background-attention-muted":"bottom-sheet__background-attention-muted_3cpay","background-positive-muted":"bottom-sheet__background-positive-muted_3cpay","background-negative-muted":"bottom-sheet__background-negative-muted_3cpay","background-primary":"bottom-sheet__background-primary_3cpay","background-primary-inverted":"bottom-sheet__background-primary-inverted_3cpay","background-secondary":"bottom-sheet__background-secondary_3cpay","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_3cpay","background-tertiary":"bottom-sheet__background-tertiary_3cpay","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_3cpay","background-quaternary":"bottom-sheet__background-quaternary_3cpay","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_3cpay","background-specialbg-component":"bottom-sheet__background-specialbg-component_3cpay","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_3cpay","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_3cpay","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_3cpay","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_3cpay","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_3cpay","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_3cpay","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_3cpay","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_3cpay"};
26
+ var styles = {"modal":"bottom-sheet__modal_88g3f","wrapper":"bottom-sheet__wrapper_88g3f","fullscreen":"bottom-sheet__fullscreen_88g3f","component":"bottom-sheet__component_88g3f","withTransition":"bottom-sheet__withTransition_88g3f","scrollableContainer":"bottom-sheet__scrollableContainer_88g3f","marker":"bottom-sheet__marker_88g3f","defaultMarker":"bottom-sheet__defaultMarker_88g3f","content":"bottom-sheet__content_88g3f","noHeader":"bottom-sheet__noHeader_88g3f","noFooter":"bottom-sheet__noFooter_88g3f","scrollLocked":"bottom-sheet__scrollLocked_88g3f","hiddenScrollbar":"bottom-sheet__hiddenScrollbar_88g3f","disabledPointerEvents":"bottom-sheet__disabledPointerEvents_88g3f","appear":"bottom-sheet__appear_88g3f","enter":"bottom-sheet__enter_88g3f","appearActive":"bottom-sheet__appearActive_88g3f","enterActive":"bottom-sheet__enterActive_88g3f","enterDone":"bottom-sheet__enterDone_88g3f","appearDone":"bottom-sheet__appearDone_88g3f","exit":"bottom-sheet__exit_88g3f","exitActive":"bottom-sheet__exitActive_88g3f","background-accent":"bottom-sheet__background-accent_88g3f","background-info":"bottom-sheet__background-info_88g3f","background-attention-muted":"bottom-sheet__background-attention-muted_88g3f","background-positive-muted":"bottom-sheet__background-positive-muted_88g3f","background-negative-muted":"bottom-sheet__background-negative-muted_88g3f","background-primary":"bottom-sheet__background-primary_88g3f","background-primary-inverted":"bottom-sheet__background-primary-inverted_88g3f","background-secondary":"bottom-sheet__background-secondary_88g3f","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_88g3f","background-tertiary":"bottom-sheet__background-tertiary_88g3f","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_88g3f","background-quaternary":"bottom-sheet__background-quaternary_88g3f","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_88g3f","background-specialbg-component":"bottom-sheet__background-specialbg-component_88g3f","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_88g3f","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_88g3f","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_88g3f","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_88g3f","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_88g3f","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_88g3f","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_88g3f","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_88g3f"};
27
27
  require('./index.css')
28
28
 
29
+ var isNil = coreComponentsShared.fnUtils.isNil;
29
30
  var BottomSheet = React.forwardRef(function (_a, ref) {
30
31
  var _b, _c, _d, _e, _f;
31
- var open = _a.open, title = _a.title, container = _a.container, usePortal = _a.usePortal, backgroundColor = _a.backgroundColor, _g = _a.titleSize, titleSize = _g === void 0 ? 'default' : _g, subtitle = _a.subtitle, actionButton = _a.actionButton, contentClassName = _a.contentClassName, containerClassName = _a.containerClassName, containerProps = _a.containerProps, headerClassName = _a.headerClassName, footerClassName = _a.footerClassName, addonClassName = _a.addonClassName, closerClassName = _a.closerClassName, backerClassName = _a.backerClassName, modalClassName = _a.modalClassName, modalWrapperClassName = _a.modalWrapperClassName, className = _a.className, leftAddons = _a.leftAddons, rightAddons = _a.rightAddons, bottomAddons = _a.bottomAddons, hasCloser = _a.hasCloser, hasBacker = _a.hasBacker, _h = _a.titleAlign, titleAlign = _h === void 0 ? 'left' : _h, trimTitle = _a.trimTitle, stickyHeader = _a.stickyHeader, _j = _a.stickyFooter, stickyFooter = _j === void 0 ? true : _j, _k = _a.initialHeight, initialHeight = _k === void 0 ? 'default' : _k, hideOverlay = _a.hideOverlay, hideScrollbar = _a.hideScrollbar, hideHeader = _a.hideHeader, disableOverlayClick = _a.disableOverlayClick, disableBlockingScroll = _a.disableBlockingScroll, disableFocusLock = _a.disableFocusLock, children = _a.children, zIndex = _a.zIndex, _l = _a.transitionProps, transitionProps = _l === void 0 ? {} : _l, magneticAreasProp = _a.magneticAreas, initialActiveAreaIndex = _a.initialActiveAreaIndex, dataTestId = _a.dataTestId, _m = _a.swipeable, swipeable = _m === void 0 ? true : _m, _o = _a.swipeableContent, swipeableContent = _o === void 0 ? true : _o, _p = _a.swipeThreshold, swipeThreshold = _p === void 0 ? 5 : _p, scrollLockedProp = _a.scrollLocked, backdropProps = _a.backdropProps, _q = _a.scrollableContainerRef, scrollableContainerRef = _q === void 0 ? function () { return null; } : _q, bottomSheetInstanceRef = _a.bottomSheetInstanceRef, _r = _a.sheetContainerRef, sheetContainerRef = _r === void 0 ? function () { return null; } : _r, _s = _a.headerOffset, headerOffset = _s === void 0 ? 24 : _s, onClose = _a.onClose, onBack = _a.onBack, onMagnetize = _a.onMagnetize, disableRestoreFocus = _a.disableRestoreFocus, disableAutoFocus = _a.disableAutoFocus, disableEscapeKeyDown = _a.disableEscapeKeyDown, keepMounted = _a.keepMounted, onMagnetizeEnd = _a.onMagnetizeEnd, onOffsetChange = _a.onOffsetChange, swipeableMarker = _a.swipeableMarker, swipeableMarkerClassName = _a.swipeableMarkerClassName;
32
- var hasInitialIdx = initialActiveAreaIndex !== undefined;
32
+ var open = _a.open, title = _a.title, container = _a.container, usePortal = _a.usePortal, backgroundColor = _a.backgroundColor, _g = _a.titleSize, titleSize = _g === void 0 ? 'default' : _g, subtitle = _a.subtitle, actionButton = _a.actionButton, contentClassName = _a.contentClassName, containerClassName = _a.containerClassName, containerProps = _a.containerProps, headerClassName = _a.headerClassName, footerClassName = _a.footerClassName, addonClassName = _a.addonClassName, closerClassName = _a.closerClassName, backerClassName = _a.backerClassName, modalClassName = _a.modalClassName, modalWrapperClassName = _a.modalWrapperClassName, className = _a.className, leftAddons = _a.leftAddons, rightAddons = _a.rightAddons, bottomAddons = _a.bottomAddons, hasCloser = _a.hasCloser, hasBacker = _a.hasBacker, _h = _a.titleAlign, titleAlign = _h === void 0 ? 'left' : _h, trimTitle = _a.trimTitle, stickyHeader = _a.stickyHeader, _j = _a.stickyFooter, stickyFooter = _j === void 0 ? true : _j, _k = _a.initialHeight, initialHeight = _k === void 0 ? 'default' : _k, hideOverlay = _a.hideOverlay, hideScrollbar = _a.hideScrollbar, hideHeader = _a.hideHeader, disableOverlayClick = _a.disableOverlayClick, disableBlockingScroll = _a.disableBlockingScroll, disableFocusLock = _a.disableFocusLock, children = _a.children, zIndex = _a.zIndex, _l = _a.transitionProps, transitionProps = _l === void 0 ? {} : _l, magneticAreasProp = _a.magneticAreas, initialActiveAreaIndex = _a.initialActiveAreaIndex, dataTestId = _a.dataTestId, _m = _a.swipeable, swipeable = _m === void 0 ? true : _m, _o = _a.swipeableContent, swipeableContent = _o === void 0 ? true : _o, _p = _a.swipeThreshold, swipeThreshold = _p === void 0 ? 5 : _p, scrollLockedProp = _a.scrollLocked, backdropProps = _a.backdropProps, _q = _a.scrollableContainerRef, scrollableContainerRef = _q === void 0 ? function () { return null; } : _q, bottomSheetInstanceRef = _a.bottomSheetInstanceRef, _r = _a.sheetContainerRef, sheetContainerRef = _r === void 0 ? function () { return null; } : _r, _s = _a.headerOffset, headerOffset = _s === void 0 ? 24 : _s, onClose = _a.onClose, onBack = _a.onBack, onMagnetize = _a.onMagnetize, onTouchEnd = _a.onTouchEnd, disableRestoreFocus = _a.disableRestoreFocus, disableAutoFocus = _a.disableAutoFocus, disableEscapeKeyDown = _a.disableEscapeKeyDown, keepMounted = _a.keepMounted, onMagnetizeEnd = _a.onMagnetizeEnd, onOffsetChange = _a.onOffsetChange, swipeableMarker = _a.swipeableMarker, swipeableMarkerClassName = _a.swipeableMarkerClassName;
33
33
  var fullHeight = reactDiv100vh.use100vh() || 0;
34
34
  // Хук use100vh рассчитывает высоту вьюпорта в useEffect, поэтому на первый рендер всегда возвращает null.
35
35
  var isFirstRender = fullHeight === 0;
@@ -210,7 +210,9 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
210
210
  }
211
211
  setSwipingInProgress(true);
212
212
  };
213
- var handleTouchEnd = function () {
213
+ var handleTouchEnd = function (_a) {
214
+ var event = _a.event;
215
+ onTouchEnd === null || onTouchEnd === void 0 ? void 0 : onTouchEnd(event);
214
216
  setSwipingInProgress(false);
215
217
  scrollOccurred.current = false;
216
218
  };
@@ -237,9 +239,9 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
237
239
  });
238
240
  var handleExited = function (node) {
239
241
  var idx = initialActiveAreaIndex;
240
- var nextArea = hasInitialIdx ? magneticAreas[idx] : lastMagneticArea;
242
+ var nextArea = isNil(idx) ? lastMagneticArea : magneticAreas[idx];
241
243
  setBackdropOpacity(1);
242
- setSheetOffset(hasInitialIdx ? lastMagneticArea - magneticAreas[idx] : magneticAreas[0]);
244
+ setSheetOffset(isNil(idx) ? magneticAreas[0] : lastMagneticArea - magneticAreas[idx]);
243
245
  setActiveArea(nextArea);
244
246
  onMagnetizeEnd === null || onMagnetizeEnd === void 0 ? void 0 : onMagnetizeEnd();
245
247
  if (transitionProps.onExited) {
@@ -269,13 +271,13 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
269
271
  }
270
272
  };
271
273
  React.useEffect(function () {
272
- // Инициализируем стейт только после того, как была рассчитана высота вьюпорта.
274
+ // Инициализируем стейт только после того, как была рассчитана высота вьюпорта
273
275
  if (!isFirstRender) {
274
- setSheetOffset(hasInitialIdx ? lastMagneticArea - magneticAreas[initialActiveAreaIndex] : 0);
275
- setActiveArea(hasInitialIdx ? magneticAreas[initialActiveAreaIndex] : lastMagneticArea);
276
+ var idx = initialActiveAreaIndex;
277
+ setSheetOffset(isNil(idx) ? 0 : lastMagneticArea - magneticAreas[idx]);
278
+ setActiveArea(isNil(idx) ? lastMagneticArea : magneticAreas[idx]);
276
279
  }
277
- // eslint-disable-next-line react-hooks/exhaustive-deps
278
- }, [isFirstRender]);
280
+ }, [initialActiveAreaIndex, isFirstRender, lastMagneticArea, magneticAreas]);
279
281
  React.useEffect(function () {
280
282
  if (!sheetRef.current)
281
283
  return;
package/components/footer/Component.js CHANGED
@@ -11,7 +11,7 @@ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'defau
11
11
  var React__default = /*#__PURE__*/_interopDefaultCompat(React);
12
12
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
13
13
 
14
- var styles = {"footer":"bottom-sheet__footer_1n4ol","sticky":"bottom-sheet__sticky_1n4ol","highlighted":"bottom-sheet__highlighted_1n4ol","background-accent":"bottom-sheet__background-accent_1n4ol","background-info":"bottom-sheet__background-info_1n4ol","background-attention-muted":"bottom-sheet__background-attention-muted_1n4ol","background-positive-muted":"bottom-sheet__background-positive-muted_1n4ol","background-negative-muted":"bottom-sheet__background-negative-muted_1n4ol","background-primary":"bottom-sheet__background-primary_1n4ol","background-primary-inverted":"bottom-sheet__background-primary-inverted_1n4ol","background-secondary":"bottom-sheet__background-secondary_1n4ol","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_1n4ol","background-tertiary":"bottom-sheet__background-tertiary_1n4ol","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_1n4ol","background-quaternary":"bottom-sheet__background-quaternary_1n4ol","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_1n4ol","background-specialbg-component":"bottom-sheet__background-specialbg-component_1n4ol","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_1n4ol","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_1n4ol","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_1n4ol","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_1n4ol","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_1n4ol","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_1n4ol","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_1n4ol","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_1n4ol"};
14
+ var styles = {"footer":"bottom-sheet__footer_139bm","sticky":"bottom-sheet__sticky_139bm","highlighted":"bottom-sheet__highlighted_139bm","background-accent":"bottom-sheet__background-accent_139bm","background-info":"bottom-sheet__background-info_139bm","background-attention-muted":"bottom-sheet__background-attention-muted_139bm","background-positive-muted":"bottom-sheet__background-positive-muted_139bm","background-negative-muted":"bottom-sheet__background-negative-muted_139bm","background-primary":"bottom-sheet__background-primary_139bm","background-primary-inverted":"bottom-sheet__background-primary-inverted_139bm","background-secondary":"bottom-sheet__background-secondary_139bm","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_139bm","background-tertiary":"bottom-sheet__background-tertiary_139bm","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_139bm","background-quaternary":"bottom-sheet__background-quaternary_139bm","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_139bm","background-specialbg-component":"bottom-sheet__background-specialbg-component_139bm","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_139bm","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_139bm","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_139bm","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_139bm","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_139bm","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_139bm","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_139bm","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_139bm"};
15
15
  require('./index.css')
16
16
 
17
17
  var Footer = function (_a) {
package/components/footer/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1ufez */
1
+ /* hash: v9a86 */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-bg-accent: #ef3124;
@@ -41,58 +41,58 @@
41
41
  } :root {
42
42
  --bottom-sheet-footer-border-top: 1px solid var(--color-light-border-secondary);
43
43
  --bottom-sheet-footer-background-color: var(--color-light-bg-primary);
44
- } .bottom-sheet__footer_1n4ol {
44
+ } .bottom-sheet__footer_139bm {
45
45
  padding: var(--gap-m) var(--gap-m);
46
46
  background-color: var(--color-light-bg-primary);
47
- } .bottom-sheet__sticky_1n4ol {
47
+ } .bottom-sheet__sticky_139bm {
48
48
  position: sticky;
49
49
  bottom: 0;
50
50
  z-index: 1;
51
- } .bottom-sheet__highlighted_1n4ol {
51
+ } .bottom-sheet__highlighted_139bm {
52
52
  border-top: var(--bottom-sheet-footer-border-top);
53
53
  background-color: var(--bottom-sheet-footer-background-color);
54
- } .bottom-sheet__background-accent_1n4ol {
54
+ } .bottom-sheet__background-accent_139bm {
55
55
  background-color: var(--color-light-bg-accent);
56
- } .bottom-sheet__background-info_1n4ol {
56
+ } .bottom-sheet__background-info_139bm {
57
57
  background-color: var(--color-light-bg-info);
58
- } .bottom-sheet__background-attention-muted_1n4ol {
58
+ } .bottom-sheet__background-attention-muted_139bm {
59
59
  background-color: var(--color-light-bg-attention-muted);
60
- } .bottom-sheet__background-positive-muted_1n4ol {
60
+ } .bottom-sheet__background-positive-muted_139bm {
61
61
  background-color: var(--color-light-bg-positive-muted);
62
- } .bottom-sheet__background-negative-muted_1n4ol {
62
+ } .bottom-sheet__background-negative-muted_139bm {
63
63
  background-color: var(--color-light-bg-negative-muted);
64
- } .bottom-sheet__background-primary_1n4ol {
64
+ } .bottom-sheet__background-primary_139bm {
65
65
  background-color: var(--color-light-bg-primary);
66
- } .bottom-sheet__background-primary-inverted_1n4ol {
66
+ } .bottom-sheet__background-primary-inverted_139bm {
67
67
  background-color: var(--color-light-bg-primary-inverted);
68
- } .bottom-sheet__background-secondary_1n4ol {
68
+ } .bottom-sheet__background-secondary_139bm {
69
69
  background-color: var(--color-light-bg-secondary);
70
- } .bottom-sheet__background-secondary-inverted_1n4ol {
70
+ } .bottom-sheet__background-secondary-inverted_139bm {
71
71
  background-color: var(--color-light-bg-secondary-inverted);
72
- } .bottom-sheet__background-tertiary_1n4ol {
72
+ } .bottom-sheet__background-tertiary_139bm {
73
73
  background-color: var(--color-light-bg-tertiary);
74
- } .bottom-sheet__background-tertiary-inverted_1n4ol {
74
+ } .bottom-sheet__background-tertiary-inverted_139bm {
75
75
  background-color: var(--color-light-bg-tertiary-inverted);
76
- } .bottom-sheet__background-quaternary_1n4ol {
76
+ } .bottom-sheet__background-quaternary_139bm {
77
77
  background-color: var(--color-light-bg-quaternary);
78
- } .bottom-sheet__background-quaternary-inverted_1n4ol {
78
+ } .bottom-sheet__background-quaternary-inverted_139bm {
79
79
  background-color: var(--color-light-bg-quaternary-inverted);
80
- } .bottom-sheet__background-specialbg-component_1n4ol {
80
+ } .bottom-sheet__background-specialbg-component_139bm {
81
81
  background-color: var(--color-light-specialbg-component);
82
- } .bottom-sheet__background-specialbg-component-inverted_1n4ol {
82
+ } .bottom-sheet__background-specialbg-component-inverted_139bm {
83
83
  background-color: var(--color-light-specialbg-component-inverted);
84
- } .bottom-sheet__background-specialbg-primary-grouped_1n4ol {
84
+ } .bottom-sheet__background-specialbg-primary-grouped_139bm {
85
85
  background-color: var(--color-light-specialbg-primary-grouped);
86
- } .bottom-sheet__background-specialbg-secondary-grouped_1n4ol {
86
+ } .bottom-sheet__background-specialbg-secondary-grouped_139bm {
87
87
  background-color: var(--color-light-specialbg-secondary-grouped);
88
- } .bottom-sheet__background-specialbg-tertiary-grouped_1n4ol {
88
+ } .bottom-sheet__background-specialbg-tertiary-grouped_139bm {
89
89
  background-color: var(--color-light-specialbg-tertiary-grouped);
90
- } .bottom-sheet__background-specialbg-secondary-transparent_1n4ol {
90
+ } .bottom-sheet__background-specialbg-secondary-transparent_139bm {
91
91
  background-color: var(--color-light-specialbg-secondary-transparent);
92
- } .bottom-sheet__background-specialbg-secondary-transparent-inverted_1n4ol {
92
+ } .bottom-sheet__background-specialbg-secondary-transparent-inverted_139bm {
93
93
  background-color: var(--color-light-specialbg-secondary-transparent-inverted);
94
- } .bottom-sheet__background-specialbg-tertiary-transparent_1n4ol {
94
+ } .bottom-sheet__background-specialbg-tertiary-transparent_139bm {
95
95
  background-color: var(--color-light-specialbg-tertiary-transparent);
96
- } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_1n4ol {
96
+ } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_139bm {
97
97
  background-color: var(--color-light-specialbg-tertiary-transparent-inverted);
98
98
  }
package/components/header/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 = {"headerWrapper":"bottom-sheet__headerWrapper_1t48d","hasContent":"bottom-sheet__hasContent_1t48d","header":"bottom-sheet__header_1t48d","sticky":"bottom-sheet__sticky_1t48d","highlighted":"bottom-sheet__highlighted_1t48d","justifyEnd":"bottom-sheet__justifyEnd_1t48d","addon":"bottom-sheet__addon_1t48d","addonFixed":"bottom-sheet__addonFixed_1t48d","title":"bottom-sheet__title_1t48d","titleCenter":"bottom-sheet__titleCenter_1t48d","titleLeft":"bottom-sheet__titleLeft_1t48d","trimTitle":"bottom-sheet__trimTitle_1t48d"};
16
+ var styles = {"headerWrapper":"bottom-sheet__headerWrapper_198ve","hasContent":"bottom-sheet__hasContent_198ve","header":"bottom-sheet__header_198ve","sticky":"bottom-sheet__sticky_198ve","highlighted":"bottom-sheet__highlighted_198ve","justifyEnd":"bottom-sheet__justifyEnd_198ve","addon":"bottom-sheet__addon_198ve","addonFixed":"bottom-sheet__addonFixed_198ve","title":"bottom-sheet__title_198ve","titleCenter":"bottom-sheet__titleCenter_198ve","titleLeft":"bottom-sheet__titleLeft_198ve","trimTitle":"bottom-sheet__trimTitle_198ve"};
17
17
  require('./index.css')
18
18
 
19
19
  var Header = function (_a) {
package/components/header/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1yadn */
1
+ /* hash: 1x5qy */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-border-secondary: #e9e9eb; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* 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,42 +27,42 @@
27
27
  --bottom-sheet-title-font-weight: 700;
28
28
  --bottom-sheet-title-line-height: 24px;
29
29
  --bottom-sheet-title-font-family: var(--font-family-system);
30
- } .bottom-sheet__headerWrapper_1t48d {
30
+ } .bottom-sheet__headerWrapper_198ve {
31
31
  padding: var(--gap-s) var(--gap-xs) var(--gap-2xs);
32
32
  border-top-right-radius: var(--border-radius-xl);
33
33
  border-top-left-radius: var(--border-radius-xl);
34
34
  z-index: 1;
35
- } .bottom-sheet__hasContent_1t48d {
35
+ } .bottom-sheet__hasContent_198ve {
36
36
  background-color: inherit;
37
- } .bottom-sheet__header_1t48d {
37
+ } .bottom-sheet__header_198ve {
38
38
  display: flex;
39
- } .bottom-sheet__sticky_1t48d {
39
+ } .bottom-sheet__sticky_198ve {
40
40
  position: sticky;
41
41
  top: 0;
42
- } .bottom-sheet__highlighted_1t48d {
42
+ } .bottom-sheet__highlighted_198ve {
43
43
  border-bottom: var(--bottom-sheet-header-border-bottom);
44
- } .bottom-sheet__justifyEnd_1t48d {
44
+ } .bottom-sheet__justifyEnd_198ve {
45
45
  justify-content: flex-end;
46
- } .bottom-sheet__addon_1t48d {
46
+ } .bottom-sheet__addon_198ve {
47
47
  display: flex;
48
48
  justify-content: center;
49
49
  align-items: center;
50
50
  min-width: 48px;
51
51
  height: 48px;
52
- } .bottom-sheet__addonFixed_1t48d {
52
+ } .bottom-sheet__addonFixed_198ve {
53
53
  position: fixed;
54
- } .bottom-sheet__title_1t48d {
54
+ } .bottom-sheet__title_198ve {
55
55
  padding: var(--gap-s) var(--gap-xs);
56
56
  width: 100%;
57
57
  font-size: var(--bottom-sheet-title-font-size);
58
58
  font-weight: var(--bottom-sheet-title-font-weight);
59
59
  line-height: var(--bottom-sheet-title-line-height);
60
60
  font-family: var(--bottom-sheet-title-font-family);
61
- } .bottom-sheet__titleCenter_1t48d {
61
+ } .bottom-sheet__titleCenter_198ve {
62
62
  text-align: center;
63
- } .bottom-sheet__titleLeft_1t48d {
63
+ } .bottom-sheet__titleLeft_198ve {
64
64
  text-align: left;
65
- } .bottom-sheet__trimTitle_1t48d {
65
+ } .bottom-sheet__trimTitle_198ve {
66
66
  white-space: nowrap;
67
67
  overflow: hidden;
68
68
  text-overflow: ellipsis;
package/cssm/component.js CHANGED
@@ -27,10 +27,10 @@ var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
27
27
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
28
28
  var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
29
29
 
30
+ var isNil = coreComponentsShared.fnUtils.isNil;
30
31
  var BottomSheet = React.forwardRef(function (_a, ref) {
31
32
  var _b, _c, _d, _e, _f;
32
- var open = _a.open, title = _a.title, container = _a.container, usePortal = _a.usePortal, backgroundColor = _a.backgroundColor, _g = _a.titleSize, titleSize = _g === void 0 ? 'default' : _g, subtitle = _a.subtitle, actionButton = _a.actionButton, contentClassName = _a.contentClassName, containerClassName = _a.containerClassName, containerProps = _a.containerProps, headerClassName = _a.headerClassName, footerClassName = _a.footerClassName, addonClassName = _a.addonClassName, closerClassName = _a.closerClassName, backerClassName = _a.backerClassName, modalClassName = _a.modalClassName, modalWrapperClassName = _a.modalWrapperClassName, className = _a.className, leftAddons = _a.leftAddons, rightAddons = _a.rightAddons, bottomAddons = _a.bottomAddons, hasCloser = _a.hasCloser, hasBacker = _a.hasBacker, _h = _a.titleAlign, titleAlign = _h === void 0 ? 'left' : _h, trimTitle = _a.trimTitle, stickyHeader = _a.stickyHeader, _j = _a.stickyFooter, stickyFooter = _j === void 0 ? true : _j, _k = _a.initialHeight, initialHeight = _k === void 0 ? 'default' : _k, hideOverlay = _a.hideOverlay, hideScrollbar = _a.hideScrollbar, hideHeader = _a.hideHeader, disableOverlayClick = _a.disableOverlayClick, disableBlockingScroll = _a.disableBlockingScroll, disableFocusLock = _a.disableFocusLock, children = _a.children, zIndex = _a.zIndex, _l = _a.transitionProps, transitionProps = _l === void 0 ? {} : _l, magneticAreasProp = _a.magneticAreas, initialActiveAreaIndex = _a.initialActiveAreaIndex, dataTestId = _a.dataTestId, _m = _a.swipeable, swipeable = _m === void 0 ? true : _m, _o = _a.swipeableContent, swipeableContent = _o === void 0 ? true : _o, _p = _a.swipeThreshold, swipeThreshold = _p === void 0 ? 5 : _p, scrollLockedProp = _a.scrollLocked, backdropProps = _a.backdropProps, _q = _a.scrollableContainerRef, scrollableContainerRef = _q === void 0 ? function () { return null; } : _q, bottomSheetInstanceRef = _a.bottomSheetInstanceRef, _r = _a.sheetContainerRef, sheetContainerRef = _r === void 0 ? function () { return null; } : _r, _s = _a.headerOffset, headerOffset = _s === void 0 ? 24 : _s, onClose = _a.onClose, onBack = _a.onBack, onMagnetize = _a.onMagnetize, disableRestoreFocus = _a.disableRestoreFocus, disableAutoFocus = _a.disableAutoFocus, disableEscapeKeyDown = _a.disableEscapeKeyDown, keepMounted = _a.keepMounted, onMagnetizeEnd = _a.onMagnetizeEnd, onOffsetChange = _a.onOffsetChange, swipeableMarker = _a.swipeableMarker, swipeableMarkerClassName = _a.swipeableMarkerClassName;
33
- var hasInitialIdx = initialActiveAreaIndex !== undefined;
33
+ var open = _a.open, title = _a.title, container = _a.container, usePortal = _a.usePortal, backgroundColor = _a.backgroundColor, _g = _a.titleSize, titleSize = _g === void 0 ? 'default' : _g, subtitle = _a.subtitle, actionButton = _a.actionButton, contentClassName = _a.contentClassName, containerClassName = _a.containerClassName, containerProps = _a.containerProps, headerClassName = _a.headerClassName, footerClassName = _a.footerClassName, addonClassName = _a.addonClassName, closerClassName = _a.closerClassName, backerClassName = _a.backerClassName, modalClassName = _a.modalClassName, modalWrapperClassName = _a.modalWrapperClassName, className = _a.className, leftAddons = _a.leftAddons, rightAddons = _a.rightAddons, bottomAddons = _a.bottomAddons, hasCloser = _a.hasCloser, hasBacker = _a.hasBacker, _h = _a.titleAlign, titleAlign = _h === void 0 ? 'left' : _h, trimTitle = _a.trimTitle, stickyHeader = _a.stickyHeader, _j = _a.stickyFooter, stickyFooter = _j === void 0 ? true : _j, _k = _a.initialHeight, initialHeight = _k === void 0 ? 'default' : _k, hideOverlay = _a.hideOverlay, hideScrollbar = _a.hideScrollbar, hideHeader = _a.hideHeader, disableOverlayClick = _a.disableOverlayClick, disableBlockingScroll = _a.disableBlockingScroll, disableFocusLock = _a.disableFocusLock, children = _a.children, zIndex = _a.zIndex, _l = _a.transitionProps, transitionProps = _l === void 0 ? {} : _l, magneticAreasProp = _a.magneticAreas, initialActiveAreaIndex = _a.initialActiveAreaIndex, dataTestId = _a.dataTestId, _m = _a.swipeable, swipeable = _m === void 0 ? true : _m, _o = _a.swipeableContent, swipeableContent = _o === void 0 ? true : _o, _p = _a.swipeThreshold, swipeThreshold = _p === void 0 ? 5 : _p, scrollLockedProp = _a.scrollLocked, backdropProps = _a.backdropProps, _q = _a.scrollableContainerRef, scrollableContainerRef = _q === void 0 ? function () { return null; } : _q, bottomSheetInstanceRef = _a.bottomSheetInstanceRef, _r = _a.sheetContainerRef, sheetContainerRef = _r === void 0 ? function () { return null; } : _r, _s = _a.headerOffset, headerOffset = _s === void 0 ? 24 : _s, onClose = _a.onClose, onBack = _a.onBack, onMagnetize = _a.onMagnetize, onTouchEnd = _a.onTouchEnd, disableRestoreFocus = _a.disableRestoreFocus, disableAutoFocus = _a.disableAutoFocus, disableEscapeKeyDown = _a.disableEscapeKeyDown, keepMounted = _a.keepMounted, onMagnetizeEnd = _a.onMagnetizeEnd, onOffsetChange = _a.onOffsetChange, swipeableMarker = _a.swipeableMarker, swipeableMarkerClassName = _a.swipeableMarkerClassName;
34
34
  var fullHeight = reactDiv100vh.use100vh() || 0;
35
35
  // Хук use100vh рассчитывает высоту вьюпорта в useEffect, поэтому на первый рендер всегда возвращает null.
36
36
  var isFirstRender = fullHeight === 0;
@@ -211,7 +211,9 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
211
211
  }
212
212
  setSwipingInProgress(true);
213
213
  };
214
- var handleTouchEnd = function () {
214
+ var handleTouchEnd = function (_a) {
215
+ var event = _a.event;
216
+ onTouchEnd === null || onTouchEnd === void 0 ? void 0 : onTouchEnd(event);
215
217
  setSwipingInProgress(false);
216
218
  scrollOccurred.current = false;
217
219
  };
@@ -238,9 +240,9 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
238
240
  });
239
241
  var handleExited = function (node) {
240
242
  var idx = initialActiveAreaIndex;
241
- var nextArea = hasInitialIdx ? magneticAreas[idx] : lastMagneticArea;
243
+ var nextArea = isNil(idx) ? lastMagneticArea : magneticAreas[idx];
242
244
  setBackdropOpacity(1);
243
- setSheetOffset(hasInitialIdx ? lastMagneticArea - magneticAreas[idx] : magneticAreas[0]);
245
+ setSheetOffset(isNil(idx) ? magneticAreas[0] : lastMagneticArea - magneticAreas[idx]);
244
246
  setActiveArea(nextArea);
245
247
  onMagnetizeEnd === null || onMagnetizeEnd === void 0 ? void 0 : onMagnetizeEnd();
246
248
  if (transitionProps.onExited) {
@@ -270,13 +272,13 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
270
272
  }
271
273
  };
272
274
  React.useEffect(function () {
273
- // Инициализируем стейт только после того, как была рассчитана высота вьюпорта.
275
+ // Инициализируем стейт только после того, как была рассчитана высота вьюпорта
274
276
  if (!isFirstRender) {
275
- setSheetOffset(hasInitialIdx ? lastMagneticArea - magneticAreas[initialActiveAreaIndex] : 0);
276
- setActiveArea(hasInitialIdx ? magneticAreas[initialActiveAreaIndex] : lastMagneticArea);
277
+ var idx = initialActiveAreaIndex;
278
+ setSheetOffset(isNil(idx) ? 0 : lastMagneticArea - magneticAreas[idx]);
279
+ setActiveArea(isNil(idx) ? lastMagneticArea : magneticAreas[idx]);
277
280
  }
278
- // eslint-disable-next-line react-hooks/exhaustive-deps
279
- }, [isFirstRender]);
281
+ }, [initialActiveAreaIndex, isFirstRender, lastMagneticArea, magneticAreas]);
280
282
  React.useEffect(function () {
281
283
  if (!sheetRef.current)
282
284
  return;
package/cssm/types.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  /// <reference types="react-transition-group" />
2
2
  import { HTMLAttributes, ReactElement, ReactNode, RefObject } from 'react';
3
+ import { HandledEvents } from 'react-swipeable/es/types';
3
4
  import { TransitionProps } from 'react-transition-group/Transition';
4
5
  import { BaseModalProps } from "@alfalab/core-components-base-modal";
5
6
  import { NavigationBarProps } from "@alfalab/core-components-navigation-bar";
@@ -263,5 +264,9 @@ type BottomSheetProps = {
263
264
  * Вызывается при изменении положения шторки
264
265
  */
265
266
  onOffsetChange?: (offset: number, percent: number) => void;
267
+ /**
268
+ * Вызывается для событий touchend and mouseup.
269
+ */
270
+ onTouchEnd?: (event: HandledEvents) => void;
266
271
  };
267
272
  export { BottomSheetTitleAlign, BottomSheetProps };
package/esm/component.js CHANGED
@@ -5,7 +5,7 @@ import mergeRefs from 'react-merge-refs';
5
5
  import { useSwipeable } from 'react-swipeable';
6
6
  import cn from 'classnames';
7
7
  import { BaseModal } from '@alfalab/core-components-base-modal/esm';
8
- import { getDataTestId } from '@alfalab/core-components-shared/esm';
8
+ import { fnUtils, getDataTestId } from '@alfalab/core-components-shared/esm';
9
9
  import { Footer } from './components/footer/Component.js';
10
10
  import { Header } from './components/header/Component.js';
11
11
  import { SwipeableBackdrop } from './components/swipeable-backdrop/Component.js';
@@ -13,13 +13,13 @@ import { convertPercentToNumber, TIMEOUT, MARKER_HEIGHT, SCROLL_OFFSET, SWIPE_VE
13
13
  import '@alfalab/core-components-navigation-bar/esm';
14
14
  import '@alfalab/core-components-backdrop/esm';
15
15
 
16
- var styles = {"modal":"bottom-sheet__modal_3cpay","wrapper":"bottom-sheet__wrapper_3cpay","fullscreen":"bottom-sheet__fullscreen_3cpay","component":"bottom-sheet__component_3cpay","withTransition":"bottom-sheet__withTransition_3cpay","scrollableContainer":"bottom-sheet__scrollableContainer_3cpay","marker":"bottom-sheet__marker_3cpay","defaultMarker":"bottom-sheet__defaultMarker_3cpay","content":"bottom-sheet__content_3cpay","noHeader":"bottom-sheet__noHeader_3cpay","noFooter":"bottom-sheet__noFooter_3cpay","scrollLocked":"bottom-sheet__scrollLocked_3cpay","hiddenScrollbar":"bottom-sheet__hiddenScrollbar_3cpay","disabledPointerEvents":"bottom-sheet__disabledPointerEvents_3cpay","appear":"bottom-sheet__appear_3cpay","enter":"bottom-sheet__enter_3cpay","appearActive":"bottom-sheet__appearActive_3cpay","enterActive":"bottom-sheet__enterActive_3cpay","enterDone":"bottom-sheet__enterDone_3cpay","appearDone":"bottom-sheet__appearDone_3cpay","exit":"bottom-sheet__exit_3cpay","exitActive":"bottom-sheet__exitActive_3cpay","background-accent":"bottom-sheet__background-accent_3cpay","background-info":"bottom-sheet__background-info_3cpay","background-attention-muted":"bottom-sheet__background-attention-muted_3cpay","background-positive-muted":"bottom-sheet__background-positive-muted_3cpay","background-negative-muted":"bottom-sheet__background-negative-muted_3cpay","background-primary":"bottom-sheet__background-primary_3cpay","background-primary-inverted":"bottom-sheet__background-primary-inverted_3cpay","background-secondary":"bottom-sheet__background-secondary_3cpay","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_3cpay","background-tertiary":"bottom-sheet__background-tertiary_3cpay","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_3cpay","background-quaternary":"bottom-sheet__background-quaternary_3cpay","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_3cpay","background-specialbg-component":"bottom-sheet__background-specialbg-component_3cpay","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_3cpay","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_3cpay","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_3cpay","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_3cpay","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_3cpay","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_3cpay","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_3cpay","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_3cpay"};
16
+ var styles = {"modal":"bottom-sheet__modal_88g3f","wrapper":"bottom-sheet__wrapper_88g3f","fullscreen":"bottom-sheet__fullscreen_88g3f","component":"bottom-sheet__component_88g3f","withTransition":"bottom-sheet__withTransition_88g3f","scrollableContainer":"bottom-sheet__scrollableContainer_88g3f","marker":"bottom-sheet__marker_88g3f","defaultMarker":"bottom-sheet__defaultMarker_88g3f","content":"bottom-sheet__content_88g3f","noHeader":"bottom-sheet__noHeader_88g3f","noFooter":"bottom-sheet__noFooter_88g3f","scrollLocked":"bottom-sheet__scrollLocked_88g3f","hiddenScrollbar":"bottom-sheet__hiddenScrollbar_88g3f","disabledPointerEvents":"bottom-sheet__disabledPointerEvents_88g3f","appear":"bottom-sheet__appear_88g3f","enter":"bottom-sheet__enter_88g3f","appearActive":"bottom-sheet__appearActive_88g3f","enterActive":"bottom-sheet__enterActive_88g3f","enterDone":"bottom-sheet__enterDone_88g3f","appearDone":"bottom-sheet__appearDone_88g3f","exit":"bottom-sheet__exit_88g3f","exitActive":"bottom-sheet__exitActive_88g3f","background-accent":"bottom-sheet__background-accent_88g3f","background-info":"bottom-sheet__background-info_88g3f","background-attention-muted":"bottom-sheet__background-attention-muted_88g3f","background-positive-muted":"bottom-sheet__background-positive-muted_88g3f","background-negative-muted":"bottom-sheet__background-negative-muted_88g3f","background-primary":"bottom-sheet__background-primary_88g3f","background-primary-inverted":"bottom-sheet__background-primary-inverted_88g3f","background-secondary":"bottom-sheet__background-secondary_88g3f","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_88g3f","background-tertiary":"bottom-sheet__background-tertiary_88g3f","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_88g3f","background-quaternary":"bottom-sheet__background-quaternary_88g3f","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_88g3f","background-specialbg-component":"bottom-sheet__background-specialbg-component_88g3f","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_88g3f","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_88g3f","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_88g3f","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_88g3f","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_88g3f","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_88g3f","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_88g3f","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_88g3f"};
17
17
  require('./index.css')
18
18
 
19
+ var isNil = fnUtils.isNil;
19
20
  var BottomSheet = forwardRef(function (_a, ref) {
20
21
  var _b, _c, _d, _e, _f;
21
- var open = _a.open, title = _a.title, container = _a.container, usePortal = _a.usePortal, backgroundColor = _a.backgroundColor, _g = _a.titleSize, titleSize = _g === void 0 ? 'default' : _g, subtitle = _a.subtitle, actionButton = _a.actionButton, contentClassName = _a.contentClassName, containerClassName = _a.containerClassName, containerProps = _a.containerProps, headerClassName = _a.headerClassName, footerClassName = _a.footerClassName, addonClassName = _a.addonClassName, closerClassName = _a.closerClassName, backerClassName = _a.backerClassName, modalClassName = _a.modalClassName, modalWrapperClassName = _a.modalWrapperClassName, className = _a.className, leftAddons = _a.leftAddons, rightAddons = _a.rightAddons, bottomAddons = _a.bottomAddons, hasCloser = _a.hasCloser, hasBacker = _a.hasBacker, _h = _a.titleAlign, titleAlign = _h === void 0 ? 'left' : _h, trimTitle = _a.trimTitle, stickyHeader = _a.stickyHeader, _j = _a.stickyFooter, stickyFooter = _j === void 0 ? true : _j, _k = _a.initialHeight, initialHeight = _k === void 0 ? 'default' : _k, hideOverlay = _a.hideOverlay, hideScrollbar = _a.hideScrollbar, hideHeader = _a.hideHeader, disableOverlayClick = _a.disableOverlayClick, disableBlockingScroll = _a.disableBlockingScroll, disableFocusLock = _a.disableFocusLock, children = _a.children, zIndex = _a.zIndex, _l = _a.transitionProps, transitionProps = _l === void 0 ? {} : _l, magneticAreasProp = _a.magneticAreas, initialActiveAreaIndex = _a.initialActiveAreaIndex, dataTestId = _a.dataTestId, _m = _a.swipeable, swipeable = _m === void 0 ? true : _m, _o = _a.swipeableContent, swipeableContent = _o === void 0 ? true : _o, _p = _a.swipeThreshold, swipeThreshold = _p === void 0 ? 5 : _p, scrollLockedProp = _a.scrollLocked, backdropProps = _a.backdropProps, _q = _a.scrollableContainerRef, scrollableContainerRef = _q === void 0 ? function () { return null; } : _q, bottomSheetInstanceRef = _a.bottomSheetInstanceRef, _r = _a.sheetContainerRef, sheetContainerRef = _r === void 0 ? function () { return null; } : _r, _s = _a.headerOffset, headerOffset = _s === void 0 ? 24 : _s, onClose = _a.onClose, onBack = _a.onBack, onMagnetize = _a.onMagnetize, disableRestoreFocus = _a.disableRestoreFocus, disableAutoFocus = _a.disableAutoFocus, disableEscapeKeyDown = _a.disableEscapeKeyDown, keepMounted = _a.keepMounted, onMagnetizeEnd = _a.onMagnetizeEnd, onOffsetChange = _a.onOffsetChange, swipeableMarker = _a.swipeableMarker, swipeableMarkerClassName = _a.swipeableMarkerClassName;
22
- var hasInitialIdx = initialActiveAreaIndex !== undefined;
22
+ var open = _a.open, title = _a.title, container = _a.container, usePortal = _a.usePortal, backgroundColor = _a.backgroundColor, _g = _a.titleSize, titleSize = _g === void 0 ? 'default' : _g, subtitle = _a.subtitle, actionButton = _a.actionButton, contentClassName = _a.contentClassName, containerClassName = _a.containerClassName, containerProps = _a.containerProps, headerClassName = _a.headerClassName, footerClassName = _a.footerClassName, addonClassName = _a.addonClassName, closerClassName = _a.closerClassName, backerClassName = _a.backerClassName, modalClassName = _a.modalClassName, modalWrapperClassName = _a.modalWrapperClassName, className = _a.className, leftAddons = _a.leftAddons, rightAddons = _a.rightAddons, bottomAddons = _a.bottomAddons, hasCloser = _a.hasCloser, hasBacker = _a.hasBacker, _h = _a.titleAlign, titleAlign = _h === void 0 ? 'left' : _h, trimTitle = _a.trimTitle, stickyHeader = _a.stickyHeader, _j = _a.stickyFooter, stickyFooter = _j === void 0 ? true : _j, _k = _a.initialHeight, initialHeight = _k === void 0 ? 'default' : _k, hideOverlay = _a.hideOverlay, hideScrollbar = _a.hideScrollbar, hideHeader = _a.hideHeader, disableOverlayClick = _a.disableOverlayClick, disableBlockingScroll = _a.disableBlockingScroll, disableFocusLock = _a.disableFocusLock, children = _a.children, zIndex = _a.zIndex, _l = _a.transitionProps, transitionProps = _l === void 0 ? {} : _l, magneticAreasProp = _a.magneticAreas, initialActiveAreaIndex = _a.initialActiveAreaIndex, dataTestId = _a.dataTestId, _m = _a.swipeable, swipeable = _m === void 0 ? true : _m, _o = _a.swipeableContent, swipeableContent = _o === void 0 ? true : _o, _p = _a.swipeThreshold, swipeThreshold = _p === void 0 ? 5 : _p, scrollLockedProp = _a.scrollLocked, backdropProps = _a.backdropProps, _q = _a.scrollableContainerRef, scrollableContainerRef = _q === void 0 ? function () { return null; } : _q, bottomSheetInstanceRef = _a.bottomSheetInstanceRef, _r = _a.sheetContainerRef, sheetContainerRef = _r === void 0 ? function () { return null; } : _r, _s = _a.headerOffset, headerOffset = _s === void 0 ? 24 : _s, onClose = _a.onClose, onBack = _a.onBack, onMagnetize = _a.onMagnetize, onTouchEnd = _a.onTouchEnd, disableRestoreFocus = _a.disableRestoreFocus, disableAutoFocus = _a.disableAutoFocus, disableEscapeKeyDown = _a.disableEscapeKeyDown, keepMounted = _a.keepMounted, onMagnetizeEnd = _a.onMagnetizeEnd, onOffsetChange = _a.onOffsetChange, swipeableMarker = _a.swipeableMarker, swipeableMarkerClassName = _a.swipeableMarkerClassName;
23
23
  var fullHeight = use100vh() || 0;
24
24
  // Хук use100vh рассчитывает высоту вьюпорта в useEffect, поэтому на первый рендер всегда возвращает null.
25
25
  var isFirstRender = fullHeight === 0;
@@ -200,7 +200,9 @@ var BottomSheet = forwardRef(function (_a, ref) {
200
200
  }
201
201
  setSwipingInProgress(true);
202
202
  };
203
- var handleTouchEnd = function () {
203
+ var handleTouchEnd = function (_a) {
204
+ var event = _a.event;
205
+ onTouchEnd === null || onTouchEnd === void 0 ? void 0 : onTouchEnd(event);
204
206
  setSwipingInProgress(false);
205
207
  scrollOccurred.current = false;
206
208
  };
@@ -227,9 +229,9 @@ var BottomSheet = forwardRef(function (_a, ref) {
227
229
  });
228
230
  var handleExited = function (node) {
229
231
  var idx = initialActiveAreaIndex;
230
- var nextArea = hasInitialIdx ? magneticAreas[idx] : lastMagneticArea;
232
+ var nextArea = isNil(idx) ? lastMagneticArea : magneticAreas[idx];
231
233
  setBackdropOpacity(1);
232
- setSheetOffset(hasInitialIdx ? lastMagneticArea - magneticAreas[idx] : magneticAreas[0]);
234
+ setSheetOffset(isNil(idx) ? magneticAreas[0] : lastMagneticArea - magneticAreas[idx]);
233
235
  setActiveArea(nextArea);
234
236
  onMagnetizeEnd === null || onMagnetizeEnd === void 0 ? void 0 : onMagnetizeEnd();
235
237
  if (transitionProps.onExited) {
@@ -259,13 +261,13 @@ var BottomSheet = forwardRef(function (_a, ref) {
259
261
  }
260
262
  };
261
263
  useEffect(function () {
262
- // Инициализируем стейт только после того, как была рассчитана высота вьюпорта.
264
+ // Инициализируем стейт только после того, как была рассчитана высота вьюпорта
263
265
  if (!isFirstRender) {
264
- setSheetOffset(hasInitialIdx ? lastMagneticArea - magneticAreas[initialActiveAreaIndex] : 0);
265
- setActiveArea(hasInitialIdx ? magneticAreas[initialActiveAreaIndex] : lastMagneticArea);
266
+ var idx = initialActiveAreaIndex;
267
+ setSheetOffset(isNil(idx) ? 0 : lastMagneticArea - magneticAreas[idx]);
268
+ setActiveArea(isNil(idx) ? lastMagneticArea : magneticAreas[idx]);
266
269
  }
267
- // eslint-disable-next-line react-hooks/exhaustive-deps
268
- }, [isFirstRender]);
270
+ }, [initialActiveAreaIndex, isFirstRender, lastMagneticArea, magneticAreas]);
269
271
  useEffect(function () {
270
272
  if (!sheetRef.current)
271
273
  return;
package/esm/components/footer/Component.js CHANGED
@@ -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/esm';
4
4
 
5
- var styles = {"footer":"bottom-sheet__footer_1n4ol","sticky":"bottom-sheet__sticky_1n4ol","highlighted":"bottom-sheet__highlighted_1n4ol","background-accent":"bottom-sheet__background-accent_1n4ol","background-info":"bottom-sheet__background-info_1n4ol","background-attention-muted":"bottom-sheet__background-attention-muted_1n4ol","background-positive-muted":"bottom-sheet__background-positive-muted_1n4ol","background-negative-muted":"bottom-sheet__background-negative-muted_1n4ol","background-primary":"bottom-sheet__background-primary_1n4ol","background-primary-inverted":"bottom-sheet__background-primary-inverted_1n4ol","background-secondary":"bottom-sheet__background-secondary_1n4ol","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_1n4ol","background-tertiary":"bottom-sheet__background-tertiary_1n4ol","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_1n4ol","background-quaternary":"bottom-sheet__background-quaternary_1n4ol","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_1n4ol","background-specialbg-component":"bottom-sheet__background-specialbg-component_1n4ol","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_1n4ol","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_1n4ol","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_1n4ol","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_1n4ol","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_1n4ol","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_1n4ol","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_1n4ol","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_1n4ol"};
5
+ var styles = {"footer":"bottom-sheet__footer_139bm","sticky":"bottom-sheet__sticky_139bm","highlighted":"bottom-sheet__highlighted_139bm","background-accent":"bottom-sheet__background-accent_139bm","background-info":"bottom-sheet__background-info_139bm","background-attention-muted":"bottom-sheet__background-attention-muted_139bm","background-positive-muted":"bottom-sheet__background-positive-muted_139bm","background-negative-muted":"bottom-sheet__background-negative-muted_139bm","background-primary":"bottom-sheet__background-primary_139bm","background-primary-inverted":"bottom-sheet__background-primary-inverted_139bm","background-secondary":"bottom-sheet__background-secondary_139bm","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_139bm","background-tertiary":"bottom-sheet__background-tertiary_139bm","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_139bm","background-quaternary":"bottom-sheet__background-quaternary_139bm","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_139bm","background-specialbg-component":"bottom-sheet__background-specialbg-component_139bm","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_139bm","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_139bm","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_139bm","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_139bm","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_139bm","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_139bm","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_139bm","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_139bm"};
6
6
  require('./index.css')
7
7
 
8
8
  var Footer = function (_a) {
package/esm/components/footer/index.css CHANGED
@@ -1,4 +1,4 @@
1
- /* hash: 1ufez */
1
+ /* hash: v9a86 */
2
2
  :root {
3
3
  } /* deprecated */ :root {
4
4
  --color-light-bg-accent: #ef3124;
@@ -41,58 +41,58 @@
41
41
  } :root {
42
42
  --bottom-sheet-footer-border-top: 1px solid var(--color-light-border-secondary);
43
43
  --bottom-sheet-footer-background-color: var(--color-light-bg-primary);
44
- } .bottom-sheet__footer_1n4ol {
44
+ } .bottom-sheet__footer_139bm {
45
45
  padding: var(--gap-m) var(--gap-m);
46
46
  background-color: var(--color-light-bg-primary);
47
- } .bottom-sheet__sticky_1n4ol {
47
+ } .bottom-sheet__sticky_139bm {
48
48
  position: sticky;
49
49
  bottom: 0;
50
50
  z-index: 1;
51
- } .bottom-sheet__highlighted_1n4ol {
51
+ } .bottom-sheet__highlighted_139bm {
52
52
  border-top: var(--bottom-sheet-footer-border-top);
53
53
  background-color: var(--bottom-sheet-footer-background-color);
54
- } .bottom-sheet__background-accent_1n4ol {
54
+ } .bottom-sheet__background-accent_139bm {
55
55
  background-color: var(--color-light-bg-accent);
56
- } .bottom-sheet__background-info_1n4ol {
56
+ } .bottom-sheet__background-info_139bm {
57
57
  background-color: var(--color-light-bg-info);
58
- } .bottom-sheet__background-attention-muted_1n4ol {
58
+ } .bottom-sheet__background-attention-muted_139bm {
59
59
  background-color: var(--color-light-bg-attention-muted);
60
- } .bottom-sheet__background-positive-muted_1n4ol {
60
+ } .bottom-sheet__background-positive-muted_139bm {
61
61
  background-color: var(--color-light-bg-positive-muted);
62
- } .bottom-sheet__background-negative-muted_1n4ol {
62
+ } .bottom-sheet__background-negative-muted_139bm {
63
63
  background-color: var(--color-light-bg-negative-muted);
64
- } .bottom-sheet__background-primary_1n4ol {
64
+ } .bottom-sheet__background-primary_139bm {
65
65
  background-color: var(--color-light-bg-primary);
66
- } .bottom-sheet__background-primary-inverted_1n4ol {
66
+ } .bottom-sheet__background-primary-inverted_139bm {
67
67
  background-color: var(--color-light-bg-primary-inverted);
68
- } .bottom-sheet__background-secondary_1n4ol {
68
+ } .bottom-sheet__background-secondary_139bm {
69
69
  background-color: var(--color-light-bg-secondary);
70
- } .bottom-sheet__background-secondary-inverted_1n4ol {
70
+ } .bottom-sheet__background-secondary-inverted_139bm {
71
71
  background-color: var(--color-light-bg-secondary-inverted);
72
- } .bottom-sheet__background-tertiary_1n4ol {
72
+ } .bottom-sheet__background-tertiary_139bm {
73
73
  background-color: var(--color-light-bg-tertiary);
74
- } .bottom-sheet__background-tertiary-inverted_1n4ol {
74
+ } .bottom-sheet__background-tertiary-inverted_139bm {
75
75
  background-color: var(--color-light-bg-tertiary-inverted);
76
- } .bottom-sheet__background-quaternary_1n4ol {
76
+ } .bottom-sheet__background-quaternary_139bm {
77
77
  background-color: var(--color-light-bg-quaternary);
78
- } .bottom-sheet__background-quaternary-inverted_1n4ol {
78
+ } .bottom-sheet__background-quaternary-inverted_139bm {
79
79
  background-color: var(--color-light-bg-quaternary-inverted);
80
- } .bottom-sheet__background-specialbg-component_1n4ol {
80
+ } .bottom-sheet__background-specialbg-component_139bm {
81
81
  background-color: var(--color-light-specialbg-component);
82
- } .bottom-sheet__background-specialbg-component-inverted_1n4ol {
82
+ } .bottom-sheet__background-specialbg-component-inverted_139bm {
83
83
  background-color: var(--color-light-specialbg-component-inverted);
84
- } .bottom-sheet__background-specialbg-primary-grouped_1n4ol {
84
+ } .bottom-sheet__background-specialbg-primary-grouped_139bm {
85
85
  background-color: var(--color-light-specialbg-primary-grouped);
86
- } .bottom-sheet__background-specialbg-secondary-grouped_1n4ol {
86
+ } .bottom-sheet__background-specialbg-secondary-grouped_139bm {
87
87
  background-color: var(--color-light-specialbg-secondary-grouped);
88
- } .bottom-sheet__background-specialbg-tertiary-grouped_1n4ol {
88
+ } .bottom-sheet__background-specialbg-tertiary-grouped_139bm {
89
89
  background-color: var(--color-light-specialbg-tertiary-grouped);
90
- } .bottom-sheet__background-specialbg-secondary-transparent_1n4ol {
90
+ } .bottom-sheet__background-specialbg-secondary-transparent_139bm {
91
91
  background-color: var(--color-light-specialbg-secondary-transparent);
92
- } .bottom-sheet__background-specialbg-secondary-transparent-inverted_1n4ol {
92
+ } .bottom-sheet__background-specialbg-secondary-transparent-inverted_139bm {
93
93
  background-color: var(--color-light-specialbg-secondary-transparent-inverted);
94
- } .bottom-sheet__background-specialbg-tertiary-transparent_1n4ol {
94
+ } .bottom-sheet__background-specialbg-tertiary-transparent_139bm {
95
95
  background-color: var(--color-light-specialbg-tertiary-transparent);
96
- } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_1n4ol {
96
+ } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_139bm {
97
97
  background-color: var(--color-light-specialbg-tertiary-transparent-inverted);
98
98
  }
package/esm/components/header/Component.js CHANGED
@@ -4,7 +4,7 @@ import cn from 'classnames';
4
4
  import { BaseModalContext } from '@alfalab/core-components-base-modal/esm';
5
5
  import { NavigationBar } from '@alfalab/core-components-navigation-bar/esm';
6
6
 
7
- var styles = {"headerWrapper":"bottom-sheet__headerWrapper_1t48d","hasContent":"bottom-sheet__hasContent_1t48d","header":"bottom-sheet__header_1t48d","sticky":"bottom-sheet__sticky_1t48d","highlighted":"bottom-sheet__highlighted_1t48d","justifyEnd":"bottom-sheet__justifyEnd_1t48d","addon":"bottom-sheet__addon_1t48d","addonFixed":"bottom-sheet__addonFixed_1t48d","title":"bottom-sheet__title_1t48d","titleCenter":"bottom-sheet__titleCenter_1t48d","titleLeft":"bottom-sheet__titleLeft_1t48d","trimTitle":"bottom-sheet__trimTitle_1t48d"};
7
+ var styles = {"headerWrapper":"bottom-sheet__headerWrapper_198ve","hasContent":"bottom-sheet__hasContent_198ve","header":"bottom-sheet__header_198ve","sticky":"bottom-sheet__sticky_198ve","highlighted":"bottom-sheet__highlighted_198ve","justifyEnd":"bottom-sheet__justifyEnd_198ve","addon":"bottom-sheet__addon_198ve","addonFixed":"bottom-sheet__addonFixed_198ve","title":"bottom-sheet__title_198ve","titleCenter":"bottom-sheet__titleCenter_198ve","titleLeft":"bottom-sheet__titleLeft_198ve","trimTitle":"bottom-sheet__trimTitle_198ve"};
8
8
  require('./index.css')
9
9
 
10
10
  var Header = function (_a) {