@alfalab/core-components-bottom-sheet 6.18.13 → 6.19.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 (39) hide show
  1. package/component.js +14 -12
  2. package/components/footer/Component.js +1 -1
  3. package/components/footer/index.css +26 -26
  4. package/components/header/Component.d.ts +1 -0
  5. package/components/header/Component.js +5 -3
  6. package/components/header/index.css +17 -14
  7. package/cssm/component.js +13 -11
  8. package/cssm/components/header/Component.d.ts +1 -0
  9. package/cssm/components/header/Component.js +4 -2
  10. package/cssm/components/header/index.module.css +7 -2
  11. package/cssm/types.d.ts +3 -1
  12. package/esm/component.js +14 -12
  13. package/esm/components/footer/Component.js +1 -1
  14. package/esm/components/footer/index.css +26 -26
  15. package/esm/components/header/Component.d.ts +1 -0
  16. package/esm/components/header/Component.js +5 -3
  17. package/esm/components/header/index.css +17 -14
  18. package/esm/index.css +45 -45
  19. package/esm/types.d.ts +3 -1
  20. package/index.css +45 -45
  21. package/modern/component.js +9 -7
  22. package/modern/components/footer/Component.js +1 -1
  23. package/modern/components/footer/index.css +26 -26
  24. package/modern/components/header/Component.d.ts +1 -0
  25. package/modern/components/header/Component.js +5 -3
  26. package/modern/components/header/index.css +17 -14
  27. package/modern/index.css +45 -45
  28. package/modern/types.d.ts +3 -1
  29. package/moderncssm/component.js +8 -6
  30. package/moderncssm/components/header/Component.d.ts +1 -0
  31. package/moderncssm/components/header/Component.js +4 -2
  32. package/moderncssm/components/header/index.module.css +9 -2
  33. package/moderncssm/types.d.ts +3 -1
  34. package/package.json +6 -6
  35. package/src/component.tsx +16 -9
  36. package/src/components/header/Component.tsx +5 -1
  37. package/src/components/header/index.module.css +11 -2
  38. package/src/types.ts +7 -1
  39. package/types.d.ts +3 -1
package/component.js CHANGED
@@ -23,15 +23,17 @@ 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_1x3or","wrapper":"bottom-sheet__wrapper_1x3or","fullscreen":"bottom-sheet__fullscreen_1x3or","component":"bottom-sheet__component_1x3or","withTransition":"bottom-sheet__withTransition_1x3or","scrollableContainer":"bottom-sheet__scrollableContainer_1x3or","marker":"bottom-sheet__marker_1x3or","defaultMarker":"bottom-sheet__defaultMarker_1x3or","content":"bottom-sheet__content_1x3or","noHeader":"bottom-sheet__noHeader_1x3or","noFooter":"bottom-sheet__noFooter_1x3or","scrollLocked":"bottom-sheet__scrollLocked_1x3or","hiddenScrollbar":"bottom-sheet__hiddenScrollbar_1x3or","disabledPointerEvents":"bottom-sheet__disabledPointerEvents_1x3or","appear":"bottom-sheet__appear_1x3or","enter":"bottom-sheet__enter_1x3or","appearActive":"bottom-sheet__appearActive_1x3or","enterActive":"bottom-sheet__enterActive_1x3or","enterDone":"bottom-sheet__enterDone_1x3or","appearDone":"bottom-sheet__appearDone_1x3or","exit":"bottom-sheet__exit_1x3or","exitActive":"bottom-sheet__exitActive_1x3or","safeAreaBottom":"bottom-sheet__safeAreaBottom_1x3or","background-accent":"bottom-sheet__background-accent_1x3or","background-info":"bottom-sheet__background-info_1x3or","background-attention-muted":"bottom-sheet__background-attention-muted_1x3or","background-positive-muted":"bottom-sheet__background-positive-muted_1x3or","background-negative-muted":"bottom-sheet__background-negative-muted_1x3or","background-primary":"bottom-sheet__background-primary_1x3or","background-primary-inverted":"bottom-sheet__background-primary-inverted_1x3or","background-secondary":"bottom-sheet__background-secondary_1x3or","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_1x3or","background-tertiary":"bottom-sheet__background-tertiary_1x3or","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_1x3or","background-quaternary":"bottom-sheet__background-quaternary_1x3or","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_1x3or","background-specialbg-component":"bottom-sheet__background-specialbg-component_1x3or","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_1x3or","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_1x3or","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_1x3or","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_1x3or","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_1x3or","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_1x3or","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_1x3or","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_1x3or"};
26
+ var styles = {"modal":"bottom-sheet__modal_1oxul","wrapper":"bottom-sheet__wrapper_1oxul","fullscreen":"bottom-sheet__fullscreen_1oxul","component":"bottom-sheet__component_1oxul","withTransition":"bottom-sheet__withTransition_1oxul","scrollableContainer":"bottom-sheet__scrollableContainer_1oxul","marker":"bottom-sheet__marker_1oxul","defaultMarker":"bottom-sheet__defaultMarker_1oxul","content":"bottom-sheet__content_1oxul","noHeader":"bottom-sheet__noHeader_1oxul","noFooter":"bottom-sheet__noFooter_1oxul","scrollLocked":"bottom-sheet__scrollLocked_1oxul","hiddenScrollbar":"bottom-sheet__hiddenScrollbar_1oxul","disabledPointerEvents":"bottom-sheet__disabledPointerEvents_1oxul","appear":"bottom-sheet__appear_1oxul","enter":"bottom-sheet__enter_1oxul","appearActive":"bottom-sheet__appearActive_1oxul","enterActive":"bottom-sheet__enterActive_1oxul","enterDone":"bottom-sheet__enterDone_1oxul","appearDone":"bottom-sheet__appearDone_1oxul","exit":"bottom-sheet__exit_1oxul","exitActive":"bottom-sheet__exitActive_1oxul","safeAreaBottom":"bottom-sheet__safeAreaBottom_1oxul","background-accent":"bottom-sheet__background-accent_1oxul","background-info":"bottom-sheet__background-info_1oxul","background-attention-muted":"bottom-sheet__background-attention-muted_1oxul","background-positive-muted":"bottom-sheet__background-positive-muted_1oxul","background-negative-muted":"bottom-sheet__background-negative-muted_1oxul","background-primary":"bottom-sheet__background-primary_1oxul","background-primary-inverted":"bottom-sheet__background-primary-inverted_1oxul","background-secondary":"bottom-sheet__background-secondary_1oxul","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_1oxul","background-tertiary":"bottom-sheet__background-tertiary_1oxul","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_1oxul","background-quaternary":"bottom-sheet__background-quaternary_1oxul","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_1oxul","background-specialbg-component":"bottom-sheet__background-specialbg-component_1oxul","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_1oxul","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_1oxul","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_1oxul","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_1oxul","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_1oxul","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_1oxul","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_1oxul","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_1oxul"};
27
27
  require('./index.css')
28
28
 
29
29
  var isNil = coreComponentsShared.fnUtils.isNil;
30
30
  var adjustContainerHeightDefault = function (value) { return value; };
31
- var BottomSheet = React.forwardRef(function (_a, ref) {
31
+ var BottomSheet = React.forwardRef(
32
+ // eslint-disable-next-line complexity
33
+ function (_a, ref) {
32
34
  var _b, _c, _d, _e, _f;
33
35
  var _g, _h;
34
- var open = _a.open, title = _a.title, container = _a.container, usePortal = _a.usePortal, backgroundColor = _a.backgroundColor, _j = _a.titleSize, titleSize = _j === void 0 ? 'default' : _j, 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, _k = _a.titleAlign, titleAlign = _k === void 0 ? 'left' : _k, trimTitle = _a.trimTitle, stickyHeader = _a.stickyHeader, _l = _a.stickyFooter, stickyFooter = _l === void 0 ? true : _l, _m = _a.initialHeight, initialHeight = _m === void 0 ? 'default' : _m, hideOverlay = _a.hideOverlay, hideScrollbar = _a.hideScrollbar, hideHeader = _a.hideHeader, disableOverlayClick = _a.disableOverlayClick, disableBlockingScroll = _a.disableBlockingScroll, disableFocusLock = _a.disableFocusLock, children = _a.children, zIndex = _a.zIndex, _o = _a.transitionProps, transitionProps = _o === void 0 ? {} : _o, magneticAreasProp = _a.magneticAreas, initialActiveAreaIndex = _a.initialActiveAreaIndex, dataTestId = _a.dataTestId, _p = _a.swipeable, swipeable = _p === void 0 ? true : _p, _q = _a.swipeableContent, swipeableContent = _q === void 0 ? true : _q, _r = _a.swipeThreshold, swipeThreshold = _r === void 0 ? 5 : _r, scrollLockedProp = _a.scrollLocked, backdropProps = _a.backdropProps, _s = _a.scrollableContainerRef, scrollableContainerRef = _s === void 0 ? function () { return null; } : _s, bottomSheetInstanceRef = _a.bottomSheetInstanceRef, _t = _a.sheetContainerRef, sheetContainerRef = _t === void 0 ? function () { return null; } : _t, _u = _a.headerOffset, headerOffset = _u === void 0 ? 24 : _u, _v = _a.adjustContainerHeight, adjustContainerHeight = _v === void 0 ? adjustContainerHeightDefault : _v, onClose = _a.onClose, onBack = _a.onBack, onMagnetize = _a.onMagnetize, onSwipeStart = _a.onSwipeStart, onSwipeEnd = _a.onSwipeEnd, disableRestoreFocus = _a.disableRestoreFocus, disableAutoFocus = _a.disableAutoFocus, disableEscapeKeyDown = _a.disableEscapeKeyDown, keepMounted = _a.keepMounted, onMagnetizeEnd = _a.onMagnetizeEnd, onOffsetChange = _a.onOffsetChange, swipeableMarker = _a.swipeableMarker, swipeableMarkerClassName = _a.swipeableMarkerClassName, backButtonProps = _a.backButtonProps, _w = _a.iOSLock, iOSLock = _w === void 0 ? false : _w, _x = _a.virtualKeyboard, virtualKeyboard = _x === void 0 ? false : _x;
36
+ var open = _a.open, title = _a.title, container = _a.container, usePortal = _a.usePortal, backgroundColor = _a.backgroundColor, _j = _a.titleSize, titleSize = _j === void 0 ? 'default' : _j, 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, _k = _a.titleAlign, titleAlign = _k === void 0 ? 'left' : _k, trimTitle = _a.trimTitle, stickyHeader = _a.stickyHeader, _l = _a.stickyFooter, stickyFooter = _l === void 0 ? true : _l, _m = _a.initialHeight, initialHeight = _m === void 0 ? 'default' : _m, hideOverlay = _a.hideOverlay, hideScrollbar = _a.hideScrollbar, hideHeader = _a.hideHeader, disableOverlayClick = _a.disableOverlayClick, disableBlockingScroll = _a.disableBlockingScroll, disableFocusLock = _a.disableFocusLock, children = _a.children, zIndex = _a.zIndex, _o = _a.transitionProps, transitionProps = _o === void 0 ? {} : _o, magneticAreasProp = _a.magneticAreas, initialActiveAreaIndex = _a.initialActiveAreaIndex, dataTestId = _a.dataTestId, _p = _a.swipeable, swipeable = _p === void 0 ? true : _p, _q = _a.swipeableContent, swipeableContent = _q === void 0 ? true : _q, _r = _a.swipeThreshold, swipeThreshold = _r === void 0 ? 5 : _r, scrollLockedProp = _a.scrollLocked, backdropProps = _a.backdropProps, _s = _a.scrollableContainerRef, scrollableContainerRef = _s === void 0 ? function () { return null; } : _s, bottomSheetInstanceRef = _a.bottomSheetInstanceRef, _t = _a.sheetContainerRef, sheetContainerRef = _t === void 0 ? function () { return null; } : _t, _u = _a.headerOffset, headerOffset = _u === void 0 ? 24 : _u, _v = _a.adjustContainerHeight, adjustContainerHeight = _v === void 0 ? adjustContainerHeightDefault : _v, onClose = _a.onClose, onBack = _a.onBack, onMagnetize = _a.onMagnetize, onSwipeStart = _a.onSwipeStart, onSwipeEnd = _a.onSwipeEnd, disableRestoreFocus = _a.disableRestoreFocus, disableAutoFocus = _a.disableAutoFocus, disableEscapeKeyDown = _a.disableEscapeKeyDown, keepMounted = _a.keepMounted, onMagnetizeEnd = _a.onMagnetizeEnd, onOffsetChange = _a.onOffsetChange, _w = _a.showSwipeMarker, showSwipeMarker = _w === void 0 ? true : _w, swipeableMarker = _a.swipeableMarker, swipeableMarkerClassName = _a.swipeableMarkerClassName, backButtonProps = _a.backButtonProps, _x = _a.iOSLock, iOSLock = _x === void 0 ? false : _x, _y = _a.virtualKeyboard, virtualKeyboard = _y === void 0 ? false : _y;
35
37
  var windowHeight = (_g = reactDiv100vh.use100vh()) !== null && _g !== void 0 ? _g : 0;
36
38
  var visualViewportSize = hooks_useVisualviewportSize.useVisualViewportSize();
37
39
  var fullHeight = virtualKeyboard ? (_h = visualViewportSize === null || visualViewportSize === void 0 ? void 0 : visualViewportSize.height) !== null && _h !== void 0 ? _h : 0 : windowHeight;
@@ -59,10 +61,10 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
59
61
  return [0, viewHeight - headerOffset];
60
62
  }, [fullHeight, headerOffset, magneticAreasProp, virtualKeyboard, adjustContainerHeight]);
61
63
  var lastMagneticArea = magneticAreas[magneticAreas.length - 1];
62
- var _y = React.useState(0), sheetOffset = _y[0], setSheetOffset = _y[1];
63
- var _z = React.useState(1), backdropOpacity = _z[0], setBackdropOpacity = _z[1];
64
- var _0 = React.useState(-1), activeAreaIdx = _0[0], setActiveAreaIdx = _0[1];
65
- var _1 = React.useState(null), swipingInProgress = _1[0], setSwipingInProgress = _1[1];
64
+ var _z = React.useState(0), sheetOffset = _z[0], setSheetOffset = _z[1];
65
+ var _0 = React.useState(1), backdropOpacity = _0[0], setBackdropOpacity = _0[1];
66
+ var _1 = React.useState(-1), activeAreaIdx = _1[0], setActiveAreaIdx = _1[1];
67
+ var _2 = React.useState(null), swipingInProgress = _2[0], setSwipingInProgress = _2[1];
66
68
  var scrollOccurred = React.useRef(false);
67
69
  var headerRef = React.useRef(null);
68
70
  var contentRef = React.useRef(null);
@@ -370,10 +372,10 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
370
372
  : undefined,
371
373
  }); };
372
374
  var renderMarker = function () {
373
- if (swipeable) {
374
- if (swipeableMarker) {
375
- return (React__default.default.createElement("div", { className: cn__default.default(styles.marker, swipeableMarkerClassName) }, swipeableMarker));
376
- }
375
+ if (swipeableMarker) {
376
+ return (React__default.default.createElement("div", { className: cn__default.default(styles.marker, swipeableMarkerClassName) }, swipeableMarker));
377
+ }
378
+ if (showSwipeMarker) {
377
379
  return (React__default.default.createElement("div", { className: cn__default.default(styles.marker, styles.defaultMarker, swipeableMarkerClassName) }));
378
380
  }
379
381
  return null;
@@ -394,7 +396,7 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
394
396
  _e[styles.scrollLocked] = scrollLockedProp || swipingInProgress,
395
397
  _e[styles.hiddenScrollbar] = hideScrollbar,
396
398
  _e)), ref: mergeRefs__default.default([scrollableContainer, scrollableContainerRef]) }),
397
- !hideHeader && !emptyHeader && React__default.default.createElement(components_header_Component.Header, tslib.__assign({}, headerProps)),
399
+ !hideHeader && !emptyHeader && (React__default.default.createElement(components_header_Component.Header, tslib.__assign({}, headerProps, { showSwipeMarker: showSwipeMarker }))),
398
400
  React__default.default.createElement("div", { ref: contentRef, className: cn__default.default(styles.content, contentClassName, (_f = {},
399
401
  _f[styles.noHeader] = hideHeader || emptyHeader,
400
402
  _f[styles.noFooter] = !actionButton,
@@ -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_1bh9u","sticky":"bottom-sheet__sticky_1bh9u","highlighted":"bottom-sheet__highlighted_1bh9u","background-accent":"bottom-sheet__background-accent_1bh9u","background-info":"bottom-sheet__background-info_1bh9u","background-attention-muted":"bottom-sheet__background-attention-muted_1bh9u","background-positive-muted":"bottom-sheet__background-positive-muted_1bh9u","background-negative-muted":"bottom-sheet__background-negative-muted_1bh9u","background-primary":"bottom-sheet__background-primary_1bh9u","background-primary-inverted":"bottom-sheet__background-primary-inverted_1bh9u","background-secondary":"bottom-sheet__background-secondary_1bh9u","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_1bh9u","background-tertiary":"bottom-sheet__background-tertiary_1bh9u","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_1bh9u","background-quaternary":"bottom-sheet__background-quaternary_1bh9u","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_1bh9u","background-specialbg-component":"bottom-sheet__background-specialbg-component_1bh9u","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_1bh9u","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_1bh9u","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_1bh9u","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_1bh9u","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_1bh9u","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_1bh9u","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_1bh9u","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_1bh9u"};
14
+ var styles = {"footer":"bottom-sheet__footer_1b0qj","sticky":"bottom-sheet__sticky_1b0qj","highlighted":"bottom-sheet__highlighted_1b0qj","background-accent":"bottom-sheet__background-accent_1b0qj","background-info":"bottom-sheet__background-info_1b0qj","background-attention-muted":"bottom-sheet__background-attention-muted_1b0qj","background-positive-muted":"bottom-sheet__background-positive-muted_1b0qj","background-negative-muted":"bottom-sheet__background-negative-muted_1b0qj","background-primary":"bottom-sheet__background-primary_1b0qj","background-primary-inverted":"bottom-sheet__background-primary-inverted_1b0qj","background-secondary":"bottom-sheet__background-secondary_1b0qj","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_1b0qj","background-tertiary":"bottom-sheet__background-tertiary_1b0qj","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_1b0qj","background-quaternary":"bottom-sheet__background-quaternary_1b0qj","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_1b0qj","background-specialbg-component":"bottom-sheet__background-specialbg-component_1b0qj","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_1b0qj","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_1b0qj","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_1b0qj","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_1b0qj","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_1b0qj","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_1b0qj","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_1b0qj","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_1b0qj"};
15
15
  require('./index.css')
16
16
 
17
17
  var Footer = function (_a) {
@@ -1,4 +1,4 @@
1
- /* hash: 19bh4 */
1
+ /* hash: 1ty8q */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-modal-bg-primary: #fff;
@@ -55,58 +55,58 @@
55
55
  /* footer */
56
56
  --bottom-sheet-footer-border-top: 1px solid var(--color-light-neutral-300);
57
57
  --bottom-sheet-footer-background-color: var(--color-light-modal-bg-primary);
58
- } .bottom-sheet__footer_1bh9u {
58
+ } .bottom-sheet__footer_1b0qj {
59
59
  padding: var(--gap-16) var(--gap-16);
60
60
  background-color: var(--color-light-modal-bg-primary);
61
- } .bottom-sheet__sticky_1bh9u {
61
+ } .bottom-sheet__sticky_1b0qj {
62
62
  position: sticky;
63
63
  bottom: var(--gap-0);
64
64
  z-index: 1;
65
- } .bottom-sheet__highlighted_1bh9u {
65
+ } .bottom-sheet__highlighted_1b0qj {
66
66
  border-top: var(--bottom-sheet-footer-border-top);
67
67
  background-color: var(--bottom-sheet-footer-background-color);
68
- } .bottom-sheet__background-accent_1bh9u {
68
+ } .bottom-sheet__background-accent_1b0qj {
69
69
  background-color: var(--color-light-bg-accent);
70
- } .bottom-sheet__background-info_1bh9u {
70
+ } .bottom-sheet__background-info_1b0qj {
71
71
  background-color: var(--color-light-bg-info);
72
- } .bottom-sheet__background-attention-muted_1bh9u {
72
+ } .bottom-sheet__background-attention-muted_1b0qj {
73
73
  background-color: var(--color-light-bg-attention-muted);
74
- } .bottom-sheet__background-positive-muted_1bh9u {
74
+ } .bottom-sheet__background-positive-muted_1b0qj {
75
75
  background-color: var(--color-light-bg-positive-muted);
76
- } .bottom-sheet__background-negative-muted_1bh9u {
76
+ } .bottom-sheet__background-negative-muted_1b0qj {
77
77
  background-color: var(--color-light-bg-negative-muted);
78
- } .bottom-sheet__background-primary_1bh9u {
78
+ } .bottom-sheet__background-primary_1b0qj {
79
79
  background-color: var(--color-light-bg-primary);
80
- } .bottom-sheet__background-primary-inverted_1bh9u {
80
+ } .bottom-sheet__background-primary-inverted_1b0qj {
81
81
  background-color: var(--color-light-bg-primary-inverted);
82
- } .bottom-sheet__background-secondary_1bh9u {
82
+ } .bottom-sheet__background-secondary_1b0qj {
83
83
  background-color: var(--color-light-bg-secondary);
84
- } .bottom-sheet__background-secondary-inverted_1bh9u {
84
+ } .bottom-sheet__background-secondary-inverted_1b0qj {
85
85
  background-color: var(--color-light-bg-secondary-inverted);
86
- } .bottom-sheet__background-tertiary_1bh9u {
86
+ } .bottom-sheet__background-tertiary_1b0qj {
87
87
  background-color: var(--color-light-bg-tertiary);
88
- } .bottom-sheet__background-tertiary-inverted_1bh9u {
88
+ } .bottom-sheet__background-tertiary-inverted_1b0qj {
89
89
  background-color: var(--color-light-bg-tertiary-inverted);
90
- } .bottom-sheet__background-quaternary_1bh9u {
90
+ } .bottom-sheet__background-quaternary_1b0qj {
91
91
  background-color: var(--color-light-bg-quaternary);
92
- } .bottom-sheet__background-quaternary-inverted_1bh9u {
92
+ } .bottom-sheet__background-quaternary-inverted_1b0qj {
93
93
  background-color: var(--color-light-bg-quaternary-inverted);
94
- } .bottom-sheet__background-specialbg-component_1bh9u {
94
+ } .bottom-sheet__background-specialbg-component_1b0qj {
95
95
  background-color: var(--color-light-specialbg-component);
96
- } .bottom-sheet__background-specialbg-component-inverted_1bh9u {
96
+ } .bottom-sheet__background-specialbg-component-inverted_1b0qj {
97
97
  background-color: var(--color-light-specialbg-component-inverted);
98
- } .bottom-sheet__background-specialbg-primary-grouped_1bh9u {
98
+ } .bottom-sheet__background-specialbg-primary-grouped_1b0qj {
99
99
  background-color: var(--color-light-specialbg-primary-grouped);
100
- } .bottom-sheet__background-specialbg-secondary-grouped_1bh9u {
100
+ } .bottom-sheet__background-specialbg-secondary-grouped_1b0qj {
101
101
  background-color: var(--color-light-specialbg-secondary-grouped);
102
- } .bottom-sheet__background-specialbg-tertiary-grouped_1bh9u {
102
+ } .bottom-sheet__background-specialbg-tertiary-grouped_1b0qj {
103
103
  background-color: var(--color-light-specialbg-tertiary-grouped);
104
- } .bottom-sheet__background-specialbg-secondary-transparent_1bh9u {
104
+ } .bottom-sheet__background-specialbg-secondary-transparent_1b0qj {
105
105
  background-color: var(--color-light-specialbg-secondary-transparent);
106
- } .bottom-sheet__background-specialbg-secondary-transparent-inverted_1bh9u {
106
+ } .bottom-sheet__background-specialbg-secondary-transparent-inverted_1b0qj {
107
107
  background-color: var(--color-light-specialbg-secondary-transparent-inverted);
108
- } .bottom-sheet__background-specialbg-tertiary-transparent_1bh9u {
108
+ } .bottom-sheet__background-specialbg-tertiary-transparent_1b0qj {
109
109
  background-color: var(--color-light-specialbg-tertiary-transparent);
110
- } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_1bh9u {
110
+ } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_1b0qj {
111
111
  background-color: var(--color-light-specialbg-tertiary-transparent-inverted);
112
112
  }
@@ -3,6 +3,7 @@ import { NavigationBarPrivateProps } from "@alfalab/core-components-navigation-b
3
3
  type HeaderProps = Omit<NavigationBarPrivateProps, 'view' | 'size'> & {
4
4
  headerRef: RefObject<HTMLDivElement>;
5
5
  headerOffset: number;
6
+ showSwipeMarker?: boolean;
6
7
  };
7
8
  declare const Header: FC<HeaderProps>;
8
9
  export { HeaderProps, Header };
@@ -13,12 +13,12 @@ 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_bf3ph","hasContent":"bottom-sheet__hasContent_bf3ph","header":"bottom-sheet__header_bf3ph","sticky":"bottom-sheet__sticky_bf3ph","highlighted":"bottom-sheet__highlighted_bf3ph","justifyEnd":"bottom-sheet__justifyEnd_bf3ph","addon":"bottom-sheet__addon_bf3ph","addonFixed":"bottom-sheet__addonFixed_bf3ph","title":"bottom-sheet__title_bf3ph","titleCenter":"bottom-sheet__titleCenter_bf3ph","titleLeft":"bottom-sheet__titleLeft_bf3ph","trimTitle":"bottom-sheet__trimTitle_bf3ph"};
16
+ var styles = {"headerBase":"bottom-sheet__headerBase_1e71u","headerWrapper":"bottom-sheet__headerWrapper_1e71u bottom-sheet__headerBase_1e71u","headerWrapperWithoutSwipeMarker":"bottom-sheet__headerWrapperWithoutSwipeMarker_1e71u bottom-sheet__headerBase_1e71u","hasContent":"bottom-sheet__hasContent_1e71u","header":"bottom-sheet__header_1e71u","sticky":"bottom-sheet__sticky_1e71u","highlighted":"bottom-sheet__highlighted_1e71u","justifyEnd":"bottom-sheet__justifyEnd_1e71u","addon":"bottom-sheet__addon_1e71u","addonFixed":"bottom-sheet__addonFixed_1e71u","title":"bottom-sheet__title_1e71u","titleCenter":"bottom-sheet__titleCenter_1e71u","titleLeft":"bottom-sheet__titleLeft_1e71u","trimTitle":"bottom-sheet__trimTitle_1e71u"};
17
17
  require('./index.css')
18
18
 
19
19
  var Header = function (_a) {
20
20
  var _b;
21
- var className = _a.className, sticky = _a.sticky, headerRef = _a.headerRef, headerOffset = _a.headerOffset, title = _a.title, children = _a.children, restProps = tslib.__rest(_a, ["className", "sticky", "headerRef", "headerOffset", "title", "children"]);
21
+ var className = _a.className, sticky = _a.sticky, headerRef = _a.headerRef, headerOffset = _a.headerOffset, showSwipeMarker = _a.showSwipeMarker, title = _a.title, children = _a.children, restProps = tslib.__rest(_a, ["className", "sticky", "headerRef", "headerOffset", "showSwipeMarker", "title", "children"]);
22
22
  var _c = React.useContext(coreComponentsBaseModal.BaseModalContext), setHeaderOffset = _c.setHeaderOffset, setHasHeader = _c.setHasHeader, headerHighlighted = _c.headerHighlighted, onClose = _c.onClose;
23
23
  React.useEffect(function () {
24
24
  setHeaderOffset(headerOffset);
@@ -27,7 +27,9 @@ var Header = function (_a) {
27
27
  setHasHeader(true);
28
28
  }, [setHasHeader]);
29
29
  var hasContent = Boolean(title || children);
30
- return (React__default.default.createElement(coreComponentsNavigationBarPrivate.NavigationBarPrivate, tslib.__assign({}, restProps, { ref: headerRef, title: title, onClose: onClose, sticky: sticky, view: 'mobile', className: cn__default.default(styles.headerWrapper, className, (_b = {},
30
+ return (React__default.default.createElement(coreComponentsNavigationBarPrivate.NavigationBarPrivate, tslib.__assign({}, restProps, { ref: headerRef, title: title, onClose: onClose, sticky: sticky, view: 'mobile', className: cn__default.default(className, (_b = {},
31
+ _b[styles.headerWrapper] = showSwipeMarker,
32
+ _b[styles.headerWrapperWithoutSwipeMarker] = !showSwipeMarker,
31
33
  _b[styles.highlighted] = hasContent && headerHighlighted && sticky,
32
34
  _b[styles.sticky] = sticky,
33
35
  _b[styles.hasContent] = hasContent,
@@ -1,4 +1,4 @@
1
- /* hash: srork */
1
+ /* hash: x1gg4 */
2
2
  :root { /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
3
3
  } /* deprecated */ :root {
4
4
  --color-light-neutral-300: #e7e8eb; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -41,42 +41,45 @@
41
41
  --bottom-sheet-title-font-family: var(--font-family-system);
42
42
 
43
43
  /* footer */
44
- } .bottom-sheet__headerWrapper_bf3ph {
45
- padding: var(--gap-12) var(--gap-8) var(--gap-4);
44
+ } .bottom-sheet__headerBase_1e71u {
46
45
  border-top-left-radius: inherit;
47
46
  border-top-right-radius: inherit;
48
47
  z-index: 1;
49
- } .bottom-sheet__hasContent_bf3ph {
48
+ } .bottom-sheet__headerWrapper_1e71u {
49
+ padding: var(--gap-12) var(--gap-8) var(--gap-4);
50
+ } .bottom-sheet__headerWrapperWithoutSwipeMarker_1e71u {
51
+ padding: var(--gap-8) var(--gap-8) var(--gap-4);
52
+ } .bottom-sheet__hasContent_1e71u {
50
53
  background-color: inherit;
51
- } .bottom-sheet__header_bf3ph {
54
+ } .bottom-sheet__header_1e71u {
52
55
  display: flex;
53
- } .bottom-sheet__sticky_bf3ph {
56
+ } .bottom-sheet__sticky_1e71u {
54
57
  position: sticky;
55
58
  top: var(--gap-0);
56
- } .bottom-sheet__highlighted_bf3ph {
59
+ } .bottom-sheet__highlighted_1e71u {
57
60
  border-bottom: var(--bottom-sheet-header-border-bottom);
58
- } .bottom-sheet__justifyEnd_bf3ph {
61
+ } .bottom-sheet__justifyEnd_1e71u {
59
62
  justify-content: flex-end;
60
- } .bottom-sheet__addon_bf3ph {
63
+ } .bottom-sheet__addon_1e71u {
61
64
  display: flex;
62
65
  justify-content: center;
63
66
  align-items: center;
64
67
  min-width: 48px;
65
68
  height: 48px;
66
- } .bottom-sheet__addonFixed_bf3ph {
69
+ } .bottom-sheet__addonFixed_1e71u {
67
70
  position: fixed;
68
- } .bottom-sheet__title_bf3ph {
71
+ } .bottom-sheet__title_1e71u {
69
72
  padding: 10px var(--gap-8);
70
73
  width: 100%;
71
74
  font-size: var(--bottom-sheet-title-font-size);
72
75
  font-weight: var(--bottom-sheet-title-font-weight);
73
76
  line-height: var(--bottom-sheet-title-line-height);
74
77
  font-family: var(--bottom-sheet-title-font-family);
75
- } .bottom-sheet__titleCenter_bf3ph {
78
+ } .bottom-sheet__titleCenter_1e71u {
76
79
  text-align: center;
77
- } .bottom-sheet__titleLeft_bf3ph {
80
+ } .bottom-sheet__titleLeft_1e71u {
78
81
  text-align: left;
79
- } .bottom-sheet__trimTitle_bf3ph {
82
+ } .bottom-sheet__trimTitle_1e71u {
80
83
  white-space: nowrap;
81
84
  overflow: hidden;
82
85
  text-overflow: ellipsis;
package/cssm/component.js CHANGED
@@ -27,10 +27,12 @@ var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
27
27
 
28
28
  var isNil = coreComponentsShared.fnUtils.isNil;
29
29
  var adjustContainerHeightDefault = function (value) { return value; };
30
- var BottomSheet = React.forwardRef(function (_a, ref) {
30
+ var BottomSheet = React.forwardRef(
31
+ // eslint-disable-next-line complexity
32
+ function (_a, ref) {
31
33
  var _b, _c, _d, _e, _f;
32
34
  var _g, _h;
33
- var open = _a.open, title = _a.title, container = _a.container, usePortal = _a.usePortal, backgroundColor = _a.backgroundColor, _j = _a.titleSize, titleSize = _j === void 0 ? 'default' : _j, 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, _k = _a.titleAlign, titleAlign = _k === void 0 ? 'left' : _k, trimTitle = _a.trimTitle, stickyHeader = _a.stickyHeader, _l = _a.stickyFooter, stickyFooter = _l === void 0 ? true : _l, _m = _a.initialHeight, initialHeight = _m === void 0 ? 'default' : _m, hideOverlay = _a.hideOverlay, hideScrollbar = _a.hideScrollbar, hideHeader = _a.hideHeader, disableOverlayClick = _a.disableOverlayClick, disableBlockingScroll = _a.disableBlockingScroll, disableFocusLock = _a.disableFocusLock, children = _a.children, zIndex = _a.zIndex, _o = _a.transitionProps, transitionProps = _o === void 0 ? {} : _o, magneticAreasProp = _a.magneticAreas, initialActiveAreaIndex = _a.initialActiveAreaIndex, dataTestId = _a.dataTestId, _p = _a.swipeable, swipeable = _p === void 0 ? true : _p, _q = _a.swipeableContent, swipeableContent = _q === void 0 ? true : _q, _r = _a.swipeThreshold, swipeThreshold = _r === void 0 ? 5 : _r, scrollLockedProp = _a.scrollLocked, backdropProps = _a.backdropProps, _s = _a.scrollableContainerRef, scrollableContainerRef = _s === void 0 ? function () { return null; } : _s, bottomSheetInstanceRef = _a.bottomSheetInstanceRef, _t = _a.sheetContainerRef, sheetContainerRef = _t === void 0 ? function () { return null; } : _t, _u = _a.headerOffset, headerOffset = _u === void 0 ? 24 : _u, _v = _a.adjustContainerHeight, adjustContainerHeight = _v === void 0 ? adjustContainerHeightDefault : _v, onClose = _a.onClose, onBack = _a.onBack, onMagnetize = _a.onMagnetize, onSwipeStart = _a.onSwipeStart, onSwipeEnd = _a.onSwipeEnd, disableRestoreFocus = _a.disableRestoreFocus, disableAutoFocus = _a.disableAutoFocus, disableEscapeKeyDown = _a.disableEscapeKeyDown, keepMounted = _a.keepMounted, onMagnetizeEnd = _a.onMagnetizeEnd, onOffsetChange = _a.onOffsetChange, swipeableMarker = _a.swipeableMarker, swipeableMarkerClassName = _a.swipeableMarkerClassName, backButtonProps = _a.backButtonProps, _w = _a.iOSLock, iOSLock = _w === void 0 ? false : _w, _x = _a.virtualKeyboard, virtualKeyboard = _x === void 0 ? false : _x;
35
+ var open = _a.open, title = _a.title, container = _a.container, usePortal = _a.usePortal, backgroundColor = _a.backgroundColor, _j = _a.titleSize, titleSize = _j === void 0 ? 'default' : _j, 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, _k = _a.titleAlign, titleAlign = _k === void 0 ? 'left' : _k, trimTitle = _a.trimTitle, stickyHeader = _a.stickyHeader, _l = _a.stickyFooter, stickyFooter = _l === void 0 ? true : _l, _m = _a.initialHeight, initialHeight = _m === void 0 ? 'default' : _m, hideOverlay = _a.hideOverlay, hideScrollbar = _a.hideScrollbar, hideHeader = _a.hideHeader, disableOverlayClick = _a.disableOverlayClick, disableBlockingScroll = _a.disableBlockingScroll, disableFocusLock = _a.disableFocusLock, children = _a.children, zIndex = _a.zIndex, _o = _a.transitionProps, transitionProps = _o === void 0 ? {} : _o, magneticAreasProp = _a.magneticAreas, initialActiveAreaIndex = _a.initialActiveAreaIndex, dataTestId = _a.dataTestId, _p = _a.swipeable, swipeable = _p === void 0 ? true : _p, _q = _a.swipeableContent, swipeableContent = _q === void 0 ? true : _q, _r = _a.swipeThreshold, swipeThreshold = _r === void 0 ? 5 : _r, scrollLockedProp = _a.scrollLocked, backdropProps = _a.backdropProps, _s = _a.scrollableContainerRef, scrollableContainerRef = _s === void 0 ? function () { return null; } : _s, bottomSheetInstanceRef = _a.bottomSheetInstanceRef, _t = _a.sheetContainerRef, sheetContainerRef = _t === void 0 ? function () { return null; } : _t, _u = _a.headerOffset, headerOffset = _u === void 0 ? 24 : _u, _v = _a.adjustContainerHeight, adjustContainerHeight = _v === void 0 ? adjustContainerHeightDefault : _v, onClose = _a.onClose, onBack = _a.onBack, onMagnetize = _a.onMagnetize, onSwipeStart = _a.onSwipeStart, onSwipeEnd = _a.onSwipeEnd, disableRestoreFocus = _a.disableRestoreFocus, disableAutoFocus = _a.disableAutoFocus, disableEscapeKeyDown = _a.disableEscapeKeyDown, keepMounted = _a.keepMounted, onMagnetizeEnd = _a.onMagnetizeEnd, onOffsetChange = _a.onOffsetChange, _w = _a.showSwipeMarker, showSwipeMarker = _w === void 0 ? true : _w, swipeableMarker = _a.swipeableMarker, swipeableMarkerClassName = _a.swipeableMarkerClassName, backButtonProps = _a.backButtonProps, _x = _a.iOSLock, iOSLock = _x === void 0 ? false : _x, _y = _a.virtualKeyboard, virtualKeyboard = _y === void 0 ? false : _y;
34
36
  var windowHeight = (_g = reactDiv100vh.use100vh()) !== null && _g !== void 0 ? _g : 0;
35
37
  var visualViewportSize = hooks_useVisualviewportSize.useVisualViewportSize();
36
38
  var fullHeight = virtualKeyboard ? (_h = visualViewportSize === null || visualViewportSize === void 0 ? void 0 : visualViewportSize.height) !== null && _h !== void 0 ? _h : 0 : windowHeight;
@@ -58,10 +60,10 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
58
60
  return [0, viewHeight - headerOffset];
59
61
  }, [fullHeight, headerOffset, magneticAreasProp, virtualKeyboard, adjustContainerHeight]);
60
62
  var lastMagneticArea = magneticAreas[magneticAreas.length - 1];
61
- var _y = React.useState(0), sheetOffset = _y[0], setSheetOffset = _y[1];
62
- var _z = React.useState(1), backdropOpacity = _z[0], setBackdropOpacity = _z[1];
63
- var _0 = React.useState(-1), activeAreaIdx = _0[0], setActiveAreaIdx = _0[1];
64
- var _1 = React.useState(null), swipingInProgress = _1[0], setSwipingInProgress = _1[1];
63
+ var _z = React.useState(0), sheetOffset = _z[0], setSheetOffset = _z[1];
64
+ var _0 = React.useState(1), backdropOpacity = _0[0], setBackdropOpacity = _0[1];
65
+ var _1 = React.useState(-1), activeAreaIdx = _1[0], setActiveAreaIdx = _1[1];
66
+ var _2 = React.useState(null), swipingInProgress = _2[0], setSwipingInProgress = _2[1];
65
67
  var scrollOccurred = React.useRef(false);
66
68
  var headerRef = React.useRef(null);
67
69
  var contentRef = React.useRef(null);
@@ -369,10 +371,10 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
369
371
  : undefined,
370
372
  }); };
371
373
  var renderMarker = function () {
372
- if (swipeable) {
373
- if (swipeableMarker) {
374
- return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.marker, swipeableMarkerClassName) }, swipeableMarker));
375
- }
374
+ if (swipeableMarker) {
375
+ return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.marker, swipeableMarkerClassName) }, swipeableMarker));
376
+ }
377
+ if (showSwipeMarker) {
376
378
  return (React__default.default.createElement("div", { className: cn__default.default(styles__default.default.marker, styles__default.default.defaultMarker, swipeableMarkerClassName) }));
377
379
  }
378
380
  return null;
@@ -393,7 +395,7 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
393
395
  _e[styles__default.default.scrollLocked] = scrollLockedProp || swipingInProgress,
394
396
  _e[styles__default.default.hiddenScrollbar] = hideScrollbar,
395
397
  _e)), ref: mergeRefs__default.default([scrollableContainer, scrollableContainerRef]) }),
396
- !hideHeader && !emptyHeader && React__default.default.createElement(components_header_Component.Header, tslib.__assign({}, headerProps)),
398
+ !hideHeader && !emptyHeader && (React__default.default.createElement(components_header_Component.Header, tslib.__assign({}, headerProps, { showSwipeMarker: showSwipeMarker }))),
397
399
  React__default.default.createElement("div", { ref: contentRef, className: cn__default.default(styles__default.default.content, contentClassName, (_f = {},
398
400
  _f[styles__default.default.noHeader] = hideHeader || emptyHeader,
399
401
  _f[styles__default.default.noFooter] = !actionButton,
@@ -3,6 +3,7 @@ import { NavigationBarPrivateProps } from "@alfalab/core-components-navigation-b
3
3
  type HeaderProps = Omit<NavigationBarPrivateProps, 'view' | 'size'> & {
4
4
  headerRef: RefObject<HTMLDivElement>;
5
5
  headerOffset: number;
6
+ showSwipeMarker?: boolean;
6
7
  };
7
8
  declare const Header: FC<HeaderProps>;
8
9
  export { HeaderProps, Header };
@@ -17,7 +17,7 @@ var styles__default = /*#__PURE__*/_interopDefaultCompat(styles);
17
17
 
18
18
  var Header = function (_a) {
19
19
  var _b;
20
- var className = _a.className, sticky = _a.sticky, headerRef = _a.headerRef, headerOffset = _a.headerOffset, title = _a.title, children = _a.children, restProps = tslib.__rest(_a, ["className", "sticky", "headerRef", "headerOffset", "title", "children"]);
20
+ var className = _a.className, sticky = _a.sticky, headerRef = _a.headerRef, headerOffset = _a.headerOffset, showSwipeMarker = _a.showSwipeMarker, title = _a.title, children = _a.children, restProps = tslib.__rest(_a, ["className", "sticky", "headerRef", "headerOffset", "showSwipeMarker", "title", "children"]);
21
21
  var _c = React.useContext(coreComponentsBaseModal.BaseModalContext), setHeaderOffset = _c.setHeaderOffset, setHasHeader = _c.setHasHeader, headerHighlighted = _c.headerHighlighted, onClose = _c.onClose;
22
22
  React.useEffect(function () {
23
23
  setHeaderOffset(headerOffset);
@@ -26,7 +26,9 @@ var Header = function (_a) {
26
26
  setHasHeader(true);
27
27
  }, [setHasHeader]);
28
28
  var hasContent = Boolean(title || children);
29
- return (React__default.default.createElement(coreComponentsNavigationBarPrivate.NavigationBarPrivate, tslib.__assign({}, restProps, { ref: headerRef, title: title, onClose: onClose, sticky: sticky, view: 'mobile', className: cn__default.default(styles__default.default.headerWrapper, className, (_b = {},
29
+ return (React__default.default.createElement(coreComponentsNavigationBarPrivate.NavigationBarPrivate, tslib.__assign({}, restProps, { ref: headerRef, title: title, onClose: onClose, sticky: sticky, view: 'mobile', className: cn__default.default(className, (_b = {},
30
+ _b[styles__default.default.headerWrapper] = showSwipeMarker,
31
+ _b[styles__default.default.headerWrapperWithoutSwipeMarker] = !showSwipeMarker,
30
32
  _b[styles__default.default.highlighted] = hasContent && headerHighlighted && sticky,
31
33
  _b[styles__default.default.sticky] = sticky,
32
34
  _b[styles__default.default.hasContent] = hasContent,
@@ -40,11 +40,16 @@
40
40
  --bottom-sheet-title-font-family: var(--font-family-system);
41
41
 
42
42
  /* footer */
43
- } .headerWrapper {
44
- padding: var(--gap-12) var(--gap-8) var(--gap-4);
43
+ } .headerBase {
45
44
  border-top-left-radius: inherit;
46
45
  border-top-right-radius: inherit;
47
46
  z-index: 1;
47
+ } .headerWrapper {
48
+ composes: headerBase;
49
+ padding: var(--gap-12) var(--gap-8) var(--gap-4);
50
+ } .headerWrapperWithoutSwipeMarker {
51
+ composes: headerBase;
52
+ padding: var(--gap-8) var(--gap-8) var(--gap-4);
48
53
  } .hasContent {
49
54
  background-color: inherit;
50
55
  } .header {
package/cssm/types.d.ts CHANGED
@@ -94,8 +94,10 @@ type BottomSheetProps = {
94
94
  */
95
95
  modalWrapperClassName?: string;
96
96
  /**
97
- * Дополнительный класс для маркера
97
+ * Дефолтный маркер
98
+ * @default true
98
99
  */
100
+ showSwipeMarker?: boolean;
99
101
  swipeableMarkerClassName?: string;
100
102
  /**
101
103
  * Кастомный маркер
package/esm/component.js CHANGED
@@ -13,15 +13,17 @@ import { horizontalDirections } from './consts/swipeConsts.js';
13
13
  import { useVisualViewportSize } from './hooks/use-visualviewport-size.js';
14
14
  import { convertPercentToNumber, TIMEOUT, MARKER_HEIGHT, SCROLL_OFFSET, SWIPE_VELOCITY, CLOSE_OFFSET } from './utils.js';
15
15
 
16
- var styles = {"modal":"bottom-sheet__modal_1x3or","wrapper":"bottom-sheet__wrapper_1x3or","fullscreen":"bottom-sheet__fullscreen_1x3or","component":"bottom-sheet__component_1x3or","withTransition":"bottom-sheet__withTransition_1x3or","scrollableContainer":"bottom-sheet__scrollableContainer_1x3or","marker":"bottom-sheet__marker_1x3or","defaultMarker":"bottom-sheet__defaultMarker_1x3or","content":"bottom-sheet__content_1x3or","noHeader":"bottom-sheet__noHeader_1x3or","noFooter":"bottom-sheet__noFooter_1x3or","scrollLocked":"bottom-sheet__scrollLocked_1x3or","hiddenScrollbar":"bottom-sheet__hiddenScrollbar_1x3or","disabledPointerEvents":"bottom-sheet__disabledPointerEvents_1x3or","appear":"bottom-sheet__appear_1x3or","enter":"bottom-sheet__enter_1x3or","appearActive":"bottom-sheet__appearActive_1x3or","enterActive":"bottom-sheet__enterActive_1x3or","enterDone":"bottom-sheet__enterDone_1x3or","appearDone":"bottom-sheet__appearDone_1x3or","exit":"bottom-sheet__exit_1x3or","exitActive":"bottom-sheet__exitActive_1x3or","safeAreaBottom":"bottom-sheet__safeAreaBottom_1x3or","background-accent":"bottom-sheet__background-accent_1x3or","background-info":"bottom-sheet__background-info_1x3or","background-attention-muted":"bottom-sheet__background-attention-muted_1x3or","background-positive-muted":"bottom-sheet__background-positive-muted_1x3or","background-negative-muted":"bottom-sheet__background-negative-muted_1x3or","background-primary":"bottom-sheet__background-primary_1x3or","background-primary-inverted":"bottom-sheet__background-primary-inverted_1x3or","background-secondary":"bottom-sheet__background-secondary_1x3or","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_1x3or","background-tertiary":"bottom-sheet__background-tertiary_1x3or","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_1x3or","background-quaternary":"bottom-sheet__background-quaternary_1x3or","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_1x3or","background-specialbg-component":"bottom-sheet__background-specialbg-component_1x3or","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_1x3or","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_1x3or","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_1x3or","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_1x3or","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_1x3or","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_1x3or","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_1x3or","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_1x3or"};
16
+ var styles = {"modal":"bottom-sheet__modal_1oxul","wrapper":"bottom-sheet__wrapper_1oxul","fullscreen":"bottom-sheet__fullscreen_1oxul","component":"bottom-sheet__component_1oxul","withTransition":"bottom-sheet__withTransition_1oxul","scrollableContainer":"bottom-sheet__scrollableContainer_1oxul","marker":"bottom-sheet__marker_1oxul","defaultMarker":"bottom-sheet__defaultMarker_1oxul","content":"bottom-sheet__content_1oxul","noHeader":"bottom-sheet__noHeader_1oxul","noFooter":"bottom-sheet__noFooter_1oxul","scrollLocked":"bottom-sheet__scrollLocked_1oxul","hiddenScrollbar":"bottom-sheet__hiddenScrollbar_1oxul","disabledPointerEvents":"bottom-sheet__disabledPointerEvents_1oxul","appear":"bottom-sheet__appear_1oxul","enter":"bottom-sheet__enter_1oxul","appearActive":"bottom-sheet__appearActive_1oxul","enterActive":"bottom-sheet__enterActive_1oxul","enterDone":"bottom-sheet__enterDone_1oxul","appearDone":"bottom-sheet__appearDone_1oxul","exit":"bottom-sheet__exit_1oxul","exitActive":"bottom-sheet__exitActive_1oxul","safeAreaBottom":"bottom-sheet__safeAreaBottom_1oxul","background-accent":"bottom-sheet__background-accent_1oxul","background-info":"bottom-sheet__background-info_1oxul","background-attention-muted":"bottom-sheet__background-attention-muted_1oxul","background-positive-muted":"bottom-sheet__background-positive-muted_1oxul","background-negative-muted":"bottom-sheet__background-negative-muted_1oxul","background-primary":"bottom-sheet__background-primary_1oxul","background-primary-inverted":"bottom-sheet__background-primary-inverted_1oxul","background-secondary":"bottom-sheet__background-secondary_1oxul","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_1oxul","background-tertiary":"bottom-sheet__background-tertiary_1oxul","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_1oxul","background-quaternary":"bottom-sheet__background-quaternary_1oxul","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_1oxul","background-specialbg-component":"bottom-sheet__background-specialbg-component_1oxul","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_1oxul","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_1oxul","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_1oxul","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_1oxul","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_1oxul","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_1oxul","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_1oxul","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_1oxul"};
17
17
  require('./index.css')
18
18
 
19
19
  var isNil = fnUtils.isNil;
20
20
  var adjustContainerHeightDefault = function (value) { return value; };
21
- var BottomSheet = forwardRef(function (_a, ref) {
21
+ var BottomSheet = forwardRef(
22
+ // eslint-disable-next-line complexity
23
+ function (_a, ref) {
22
24
  var _b, _c, _d, _e, _f;
23
25
  var _g, _h;
24
- var open = _a.open, title = _a.title, container = _a.container, usePortal = _a.usePortal, backgroundColor = _a.backgroundColor, _j = _a.titleSize, titleSize = _j === void 0 ? 'default' : _j, 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, _k = _a.titleAlign, titleAlign = _k === void 0 ? 'left' : _k, trimTitle = _a.trimTitle, stickyHeader = _a.stickyHeader, _l = _a.stickyFooter, stickyFooter = _l === void 0 ? true : _l, _m = _a.initialHeight, initialHeight = _m === void 0 ? 'default' : _m, hideOverlay = _a.hideOverlay, hideScrollbar = _a.hideScrollbar, hideHeader = _a.hideHeader, disableOverlayClick = _a.disableOverlayClick, disableBlockingScroll = _a.disableBlockingScroll, disableFocusLock = _a.disableFocusLock, children = _a.children, zIndex = _a.zIndex, _o = _a.transitionProps, transitionProps = _o === void 0 ? {} : _o, magneticAreasProp = _a.magneticAreas, initialActiveAreaIndex = _a.initialActiveAreaIndex, dataTestId = _a.dataTestId, _p = _a.swipeable, swipeable = _p === void 0 ? true : _p, _q = _a.swipeableContent, swipeableContent = _q === void 0 ? true : _q, _r = _a.swipeThreshold, swipeThreshold = _r === void 0 ? 5 : _r, scrollLockedProp = _a.scrollLocked, backdropProps = _a.backdropProps, _s = _a.scrollableContainerRef, scrollableContainerRef = _s === void 0 ? function () { return null; } : _s, bottomSheetInstanceRef = _a.bottomSheetInstanceRef, _t = _a.sheetContainerRef, sheetContainerRef = _t === void 0 ? function () { return null; } : _t, _u = _a.headerOffset, headerOffset = _u === void 0 ? 24 : _u, _v = _a.adjustContainerHeight, adjustContainerHeight = _v === void 0 ? adjustContainerHeightDefault : _v, onClose = _a.onClose, onBack = _a.onBack, onMagnetize = _a.onMagnetize, onSwipeStart = _a.onSwipeStart, onSwipeEnd = _a.onSwipeEnd, disableRestoreFocus = _a.disableRestoreFocus, disableAutoFocus = _a.disableAutoFocus, disableEscapeKeyDown = _a.disableEscapeKeyDown, keepMounted = _a.keepMounted, onMagnetizeEnd = _a.onMagnetizeEnd, onOffsetChange = _a.onOffsetChange, swipeableMarker = _a.swipeableMarker, swipeableMarkerClassName = _a.swipeableMarkerClassName, backButtonProps = _a.backButtonProps, _w = _a.iOSLock, iOSLock = _w === void 0 ? false : _w, _x = _a.virtualKeyboard, virtualKeyboard = _x === void 0 ? false : _x;
26
+ var open = _a.open, title = _a.title, container = _a.container, usePortal = _a.usePortal, backgroundColor = _a.backgroundColor, _j = _a.titleSize, titleSize = _j === void 0 ? 'default' : _j, 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, _k = _a.titleAlign, titleAlign = _k === void 0 ? 'left' : _k, trimTitle = _a.trimTitle, stickyHeader = _a.stickyHeader, _l = _a.stickyFooter, stickyFooter = _l === void 0 ? true : _l, _m = _a.initialHeight, initialHeight = _m === void 0 ? 'default' : _m, hideOverlay = _a.hideOverlay, hideScrollbar = _a.hideScrollbar, hideHeader = _a.hideHeader, disableOverlayClick = _a.disableOverlayClick, disableBlockingScroll = _a.disableBlockingScroll, disableFocusLock = _a.disableFocusLock, children = _a.children, zIndex = _a.zIndex, _o = _a.transitionProps, transitionProps = _o === void 0 ? {} : _o, magneticAreasProp = _a.magneticAreas, initialActiveAreaIndex = _a.initialActiveAreaIndex, dataTestId = _a.dataTestId, _p = _a.swipeable, swipeable = _p === void 0 ? true : _p, _q = _a.swipeableContent, swipeableContent = _q === void 0 ? true : _q, _r = _a.swipeThreshold, swipeThreshold = _r === void 0 ? 5 : _r, scrollLockedProp = _a.scrollLocked, backdropProps = _a.backdropProps, _s = _a.scrollableContainerRef, scrollableContainerRef = _s === void 0 ? function () { return null; } : _s, bottomSheetInstanceRef = _a.bottomSheetInstanceRef, _t = _a.sheetContainerRef, sheetContainerRef = _t === void 0 ? function () { return null; } : _t, _u = _a.headerOffset, headerOffset = _u === void 0 ? 24 : _u, _v = _a.adjustContainerHeight, adjustContainerHeight = _v === void 0 ? adjustContainerHeightDefault : _v, onClose = _a.onClose, onBack = _a.onBack, onMagnetize = _a.onMagnetize, onSwipeStart = _a.onSwipeStart, onSwipeEnd = _a.onSwipeEnd, disableRestoreFocus = _a.disableRestoreFocus, disableAutoFocus = _a.disableAutoFocus, disableEscapeKeyDown = _a.disableEscapeKeyDown, keepMounted = _a.keepMounted, onMagnetizeEnd = _a.onMagnetizeEnd, onOffsetChange = _a.onOffsetChange, _w = _a.showSwipeMarker, showSwipeMarker = _w === void 0 ? true : _w, swipeableMarker = _a.swipeableMarker, swipeableMarkerClassName = _a.swipeableMarkerClassName, backButtonProps = _a.backButtonProps, _x = _a.iOSLock, iOSLock = _x === void 0 ? false : _x, _y = _a.virtualKeyboard, virtualKeyboard = _y === void 0 ? false : _y;
25
27
  var windowHeight = (_g = use100vh()) !== null && _g !== void 0 ? _g : 0;
26
28
  var visualViewportSize = useVisualViewportSize();
27
29
  var fullHeight = virtualKeyboard ? (_h = visualViewportSize === null || visualViewportSize === void 0 ? void 0 : visualViewportSize.height) !== null && _h !== void 0 ? _h : 0 : windowHeight;
@@ -49,10 +51,10 @@ var BottomSheet = forwardRef(function (_a, ref) {
49
51
  return [0, viewHeight - headerOffset];
50
52
  }, [fullHeight, headerOffset, magneticAreasProp, virtualKeyboard, adjustContainerHeight]);
51
53
  var lastMagneticArea = magneticAreas[magneticAreas.length - 1];
52
- var _y = useState(0), sheetOffset = _y[0], setSheetOffset = _y[1];
53
- var _z = useState(1), backdropOpacity = _z[0], setBackdropOpacity = _z[1];
54
- var _0 = useState(-1), activeAreaIdx = _0[0], setActiveAreaIdx = _0[1];
55
- var _1 = useState(null), swipingInProgress = _1[0], setSwipingInProgress = _1[1];
54
+ var _z = useState(0), sheetOffset = _z[0], setSheetOffset = _z[1];
55
+ var _0 = useState(1), backdropOpacity = _0[0], setBackdropOpacity = _0[1];
56
+ var _1 = useState(-1), activeAreaIdx = _1[0], setActiveAreaIdx = _1[1];
57
+ var _2 = useState(null), swipingInProgress = _2[0], setSwipingInProgress = _2[1];
56
58
  var scrollOccurred = useRef(false);
57
59
  var headerRef = useRef(null);
58
60
  var contentRef = useRef(null);
@@ -360,10 +362,10 @@ var BottomSheet = forwardRef(function (_a, ref) {
360
362
  : undefined,
361
363
  }); };
362
364
  var renderMarker = function () {
363
- if (swipeable) {
364
- if (swipeableMarker) {
365
- return (React.createElement("div", { className: cn(styles.marker, swipeableMarkerClassName) }, swipeableMarker));
366
- }
365
+ if (swipeableMarker) {
366
+ return (React.createElement("div", { className: cn(styles.marker, swipeableMarkerClassName) }, swipeableMarker));
367
+ }
368
+ if (showSwipeMarker) {
367
369
  return (React.createElement("div", { className: cn(styles.marker, styles.defaultMarker, swipeableMarkerClassName) }));
368
370
  }
369
371
  return null;
@@ -384,7 +386,7 @@ var BottomSheet = forwardRef(function (_a, ref) {
384
386
  _e[styles.scrollLocked] = scrollLockedProp || swipingInProgress,
385
387
  _e[styles.hiddenScrollbar] = hideScrollbar,
386
388
  _e)), ref: mergeRefs([scrollableContainer, scrollableContainerRef]) }),
387
- !hideHeader && !emptyHeader && React.createElement(Header, __assign({}, headerProps)),
389
+ !hideHeader && !emptyHeader && (React.createElement(Header, __assign({}, headerProps, { showSwipeMarker: showSwipeMarker }))),
388
390
  React.createElement("div", { ref: contentRef, className: cn(styles.content, contentClassName, (_f = {},
389
391
  _f[styles.noHeader] = hideHeader || emptyHeader,
390
392
  _f[styles.noFooter] = !actionButton,
@@ -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_1bh9u","sticky":"bottom-sheet__sticky_1bh9u","highlighted":"bottom-sheet__highlighted_1bh9u","background-accent":"bottom-sheet__background-accent_1bh9u","background-info":"bottom-sheet__background-info_1bh9u","background-attention-muted":"bottom-sheet__background-attention-muted_1bh9u","background-positive-muted":"bottom-sheet__background-positive-muted_1bh9u","background-negative-muted":"bottom-sheet__background-negative-muted_1bh9u","background-primary":"bottom-sheet__background-primary_1bh9u","background-primary-inverted":"bottom-sheet__background-primary-inverted_1bh9u","background-secondary":"bottom-sheet__background-secondary_1bh9u","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_1bh9u","background-tertiary":"bottom-sheet__background-tertiary_1bh9u","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_1bh9u","background-quaternary":"bottom-sheet__background-quaternary_1bh9u","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_1bh9u","background-specialbg-component":"bottom-sheet__background-specialbg-component_1bh9u","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_1bh9u","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_1bh9u","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_1bh9u","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_1bh9u","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_1bh9u","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_1bh9u","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_1bh9u","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_1bh9u"};
5
+ var styles = {"footer":"bottom-sheet__footer_1b0qj","sticky":"bottom-sheet__sticky_1b0qj","highlighted":"bottom-sheet__highlighted_1b0qj","background-accent":"bottom-sheet__background-accent_1b0qj","background-info":"bottom-sheet__background-info_1b0qj","background-attention-muted":"bottom-sheet__background-attention-muted_1b0qj","background-positive-muted":"bottom-sheet__background-positive-muted_1b0qj","background-negative-muted":"bottom-sheet__background-negative-muted_1b0qj","background-primary":"bottom-sheet__background-primary_1b0qj","background-primary-inverted":"bottom-sheet__background-primary-inverted_1b0qj","background-secondary":"bottom-sheet__background-secondary_1b0qj","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_1b0qj","background-tertiary":"bottom-sheet__background-tertiary_1b0qj","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_1b0qj","background-quaternary":"bottom-sheet__background-quaternary_1b0qj","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_1b0qj","background-specialbg-component":"bottom-sheet__background-specialbg-component_1b0qj","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_1b0qj","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_1b0qj","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_1b0qj","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_1b0qj","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_1b0qj","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_1b0qj","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_1b0qj","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_1b0qj"};
6
6
  require('./index.css')
7
7
 
8
8
  var Footer = function (_a) {