@alfalab/core-components-bottom-sheet 6.14.4 → 6.14.6

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 (50) hide show
  1. package/component.js +29 -15
  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/consts/swipeConsts.d.ts +2 -0
  7. package/consts/swipeConsts.js +9 -0
  8. package/cssm/component.js +28 -14
  9. package/cssm/consts/swipeConsts.d.ts +2 -0
  10. package/cssm/consts/swipeConsts.js +9 -0
  11. package/cssm/enums/swipeEnums.d.ts +7 -0
  12. package/cssm/enums/swipeEnums.js +11 -0
  13. package/cssm/index.module.css +4 -2
  14. package/cssm/types/swipeTypes.d.ts +9 -0
  15. package/cssm/types/swipeTypes.js +2 -0
  16. package/enums/swipeEnums.d.ts +7 -0
  17. package/enums/swipeEnums.js +11 -0
  18. package/esm/component.js +30 -16
  19. package/esm/components/footer/Component.js +1 -1
  20. package/esm/components/footer/index.css +26 -26
  21. package/esm/components/header/Component.js +1 -1
  22. package/esm/components/header/index.css +13 -13
  23. package/esm/consts/swipeConsts.d.ts +2 -0
  24. package/esm/consts/swipeConsts.js +5 -0
  25. package/esm/enums/swipeEnums.d.ts +7 -0
  26. package/esm/enums/swipeEnums.js +9 -0
  27. package/esm/index.css +47 -45
  28. package/esm/types/swipeTypes.d.ts +9 -0
  29. package/esm/types/swipeTypes.js +1 -0
  30. package/index.css +47 -45
  31. package/modern/component.js +29 -13
  32. package/modern/components/footer/Component.js +1 -1
  33. package/modern/components/footer/index.css +26 -26
  34. package/modern/components/header/Component.js +1 -1
  35. package/modern/components/header/index.css +13 -13
  36. package/modern/consts/swipeConsts.d.ts +2 -0
  37. package/modern/consts/swipeConsts.js +5 -0
  38. package/modern/enums/swipeEnums.d.ts +7 -0
  39. package/modern/enums/swipeEnums.js +9 -0
  40. package/modern/index.css +47 -45
  41. package/modern/types/swipeTypes.d.ts +9 -0
  42. package/modern/types/swipeTypes.js +1 -0
  43. package/package.json +3 -3
  44. package/src/component.tsx +37 -13
  45. package/src/consts/swipeConsts.ts +3 -0
  46. package/src/enums/swipeEnums.ts +6 -0
  47. package/src/index.module.css +4 -0
  48. package/src/types/swipeTypes.ts +9 -0
  49. package/types/swipeTypes.d.ts +9 -0
  50. package/types/swipeTypes.js +2 -0
package/component.js CHANGED
@@ -13,6 +13,7 @@ var coreComponentsShared = require('@alfalab/core-components-shared');
13
13
  var components_footer_Component = require('./components/footer/Component.js');
14
14
  var components_header_Component = require('./components/header/Component.js');
15
15
  var components_swipeableBackdrop_Component = require('./components/swipeable-backdrop/Component.js');
16
+ var consts_swipeConsts = require('./consts/swipeConsts.js');
16
17
  var utils = require('./utils.js');
17
18
 
18
19
  function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
@@ -21,7 +22,7 @@ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
21
22
  var mergeRefs__default = /*#__PURE__*/_interopDefaultCompat(mergeRefs);
22
23
  var cn__default = /*#__PURE__*/_interopDefaultCompat(cn);
23
24
 
24
- var styles = {"modal":"bottom-sheet__modal_11fyc","wrapper":"bottom-sheet__wrapper_11fyc","fullscreen":"bottom-sheet__fullscreen_11fyc","component":"bottom-sheet__component_11fyc","withTransition":"bottom-sheet__withTransition_11fyc","scrollableContainer":"bottom-sheet__scrollableContainer_11fyc","marker":"bottom-sheet__marker_11fyc","defaultMarker":"bottom-sheet__defaultMarker_11fyc","content":"bottom-sheet__content_11fyc","noHeader":"bottom-sheet__noHeader_11fyc","noFooter":"bottom-sheet__noFooter_11fyc","scrollLocked":"bottom-sheet__scrollLocked_11fyc","hiddenScrollbar":"bottom-sheet__hiddenScrollbar_11fyc","disabledPointerEvents":"bottom-sheet__disabledPointerEvents_11fyc","appear":"bottom-sheet__appear_11fyc","enter":"bottom-sheet__enter_11fyc","appearActive":"bottom-sheet__appearActive_11fyc","enterActive":"bottom-sheet__enterActive_11fyc","enterDone":"bottom-sheet__enterDone_11fyc","appearDone":"bottom-sheet__appearDone_11fyc","exit":"bottom-sheet__exit_11fyc","exitActive":"bottom-sheet__exitActive_11fyc","background-accent":"bottom-sheet__background-accent_11fyc","background-info":"bottom-sheet__background-info_11fyc","background-attention-muted":"bottom-sheet__background-attention-muted_11fyc","background-positive-muted":"bottom-sheet__background-positive-muted_11fyc","background-negative-muted":"bottom-sheet__background-negative-muted_11fyc","background-primary":"bottom-sheet__background-primary_11fyc","background-primary-inverted":"bottom-sheet__background-primary-inverted_11fyc","background-secondary":"bottom-sheet__background-secondary_11fyc","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_11fyc","background-tertiary":"bottom-sheet__background-tertiary_11fyc","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_11fyc","background-quaternary":"bottom-sheet__background-quaternary_11fyc","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_11fyc","background-specialbg-component":"bottom-sheet__background-specialbg-component_11fyc","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_11fyc","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_11fyc","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_11fyc","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_11fyc","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_11fyc","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_11fyc","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_11fyc","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_11fyc"};
25
+ var styles = {"modal":"bottom-sheet__modal_tmbtb","wrapper":"bottom-sheet__wrapper_tmbtb","fullscreen":"bottom-sheet__fullscreen_tmbtb","component":"bottom-sheet__component_tmbtb","withTransition":"bottom-sheet__withTransition_tmbtb","scrollableContainer":"bottom-sheet__scrollableContainer_tmbtb","marker":"bottom-sheet__marker_tmbtb","defaultMarker":"bottom-sheet__defaultMarker_tmbtb","content":"bottom-sheet__content_tmbtb","noHeader":"bottom-sheet__noHeader_tmbtb","noFooter":"bottom-sheet__noFooter_tmbtb","scrollLocked":"bottom-sheet__scrollLocked_tmbtb","hiddenScrollbar":"bottom-sheet__hiddenScrollbar_tmbtb","disabledPointerEvents":"bottom-sheet__disabledPointerEvents_tmbtb","appear":"bottom-sheet__appear_tmbtb","enter":"bottom-sheet__enter_tmbtb","appearActive":"bottom-sheet__appearActive_tmbtb","enterActive":"bottom-sheet__enterActive_tmbtb","enterDone":"bottom-sheet__enterDone_tmbtb","appearDone":"bottom-sheet__appearDone_tmbtb","exit":"bottom-sheet__exit_tmbtb","exitActive":"bottom-sheet__exitActive_tmbtb","safeAreaBottom":"bottom-sheet__safeAreaBottom_tmbtb","background-accent":"bottom-sheet__background-accent_tmbtb","background-info":"bottom-sheet__background-info_tmbtb","background-attention-muted":"bottom-sheet__background-attention-muted_tmbtb","background-positive-muted":"bottom-sheet__background-positive-muted_tmbtb","background-negative-muted":"bottom-sheet__background-negative-muted_tmbtb","background-primary":"bottom-sheet__background-primary_tmbtb","background-primary-inverted":"bottom-sheet__background-primary-inverted_tmbtb","background-secondary":"bottom-sheet__background-secondary_tmbtb","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_tmbtb","background-tertiary":"bottom-sheet__background-tertiary_tmbtb","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_tmbtb","background-quaternary":"bottom-sheet__background-quaternary_tmbtb","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_tmbtb","background-specialbg-component":"bottom-sheet__background-specialbg-component_tmbtb","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_tmbtb","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_tmbtb","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_tmbtb","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_tmbtb","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_tmbtb","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_tmbtb","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_tmbtb","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_tmbtb"};
25
26
  require('./index.css')
26
27
 
27
28
  var isNil = coreComponentsShared.fnUtils.isNil;
@@ -32,12 +33,15 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
32
33
  // Хук use100vh рассчитывает высоту вьюпорта в useEffect, поэтому на первый рендер всегда возвращает null.
33
34
  var isFirstRender = fullHeight === 0;
34
35
  var magneticAreas = React.useMemo(function () {
36
+ var _a;
35
37
  if (magneticAreasProp) {
36
38
  return magneticAreasProp.map(function (area) {
37
39
  return utils.convertPercentToNumber(area, fullHeight, headerOffset);
38
40
  });
39
41
  }
40
- return [0, fullHeight - headerOffset];
42
+ var iOSViewHeight = ((_a = document === null || document === void 0 ? void 0 : document.documentElement) === null || _a === void 0 ? void 0 : _a.clientHeight) || window.innerHeight;
43
+ var viewHeight = coreComponentsShared.os.isIOS() ? iOSViewHeight : fullHeight;
44
+ return [0, viewHeight - headerOffset];
41
45
  }, [fullHeight, headerOffset, magneticAreasProp]);
42
46
  var lastMagneticArea = magneticAreas[magneticAreas.length - 1];
43
47
  var _t = React.useState(0), sheetOffset = _t[0], setSheetOffset = _t[1];
@@ -187,8 +191,9 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
187
191
  * Если контент внутри шторки скроллится - то шторка не должна свайпаться
188
192
  * Если шапка внутри шторки зафиксирована - то шторка должна свайпаться только в области шапки
189
193
  */
190
- var shouldSkipSwiping = function (deltaY, startY, event) {
194
+ var shouldSkipSwiping = function (swipeParams) {
191
195
  var _a;
196
+ var deltaY = swipeParams.deltaY, startY = swipeParams.startY, event = swipeParams.event, dir = swipeParams.dir;
192
197
  if (scrollLockedProp || swipingInProgress)
193
198
  return false;
194
199
  if (!swipeableContent && ((_a = contentRef.current) === null || _a === void 0 ? void 0 : _a.contains(event.target))) {
@@ -213,18 +218,24 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
213
218
  if (!scrollOccurred.current && shouldScroll) {
214
219
  scrollOccurred.current = true;
215
220
  }
221
+ // Если контент внутри шторки скроллится горизонально - то шторка не должна закрываться
222
+ if (consts_swipeConsts.horizontalDirections.includes(dir)) {
223
+ return true;
224
+ }
216
225
  return shouldScroll;
217
226
  };
218
- var handleSheetSwipe = function (_a) {
219
- var initial = _a.initial, velocity = _a.velocity, deltaY = _a.deltaY, event = _a.event;
220
- if (scrollOccurred.current || shouldSkipSwiping(deltaY, initial[1], event)) {
227
+ var handleSheetSwipeEnd = function (swipeParams) {
228
+ var initial = swipeParams.initial, velocity = swipeParams.velocity, deltaY = swipeParams.deltaY, event = swipeParams.event, dir = swipeParams.dir;
229
+ var shouldPreventSwipe = scrollOccurred.current ||
230
+ shouldSkipSwiping({ deltaY: deltaY, startY: initial[1], event: event, dir: dir });
231
+ if (shouldPreventSwipe) {
221
232
  return;
222
233
  }
223
234
  magnetize(velocity, deltaY);
224
235
  };
225
- var handleSheetSwipeStart = function (_a) {
226
- var deltaY = _a.deltaY, initial = _a.initial, event = _a.event;
227
- if (shouldSkipSwiping(deltaY, initial[1], event)) {
236
+ var handleSheetSwipeStart = function (swipeParams) {
237
+ var deltaY = swipeParams.deltaY, initial = swipeParams.initial, event = swipeParams.event, dir = swipeParams.dir;
238
+ if (shouldSkipSwiping({ deltaY: deltaY, startY: initial[1], event: event, dir: dir })) {
228
239
  return;
229
240
  }
230
241
  startSwiping(event);
@@ -233,9 +244,11 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
233
244
  var event = _a.event;
234
245
  return stopSwiping(event);
235
246
  };
236
- var handleSheetSwiping = function (_a) {
237
- var initial = _a.initial, deltaY = _a.deltaY, event = _a.event;
238
- if (scrollOccurred.current || shouldSkipSwiping(deltaY, initial[1], event)) {
247
+ var handleSheetSwipeMove = function (swipeParams) {
248
+ var initial = swipeParams.initial, deltaY = swipeParams.deltaY, event = swipeParams.event, dir = swipeParams.dir;
249
+ var shouldPreventSwipe = scrollOccurred.current ||
250
+ shouldSkipSwiping({ deltaY: deltaY, startY: initial[1], event: event, dir: dir });
251
+ if (shouldPreventSwipe) {
239
252
  return;
240
253
  }
241
254
  if (!swipingInProgress) {
@@ -248,8 +261,8 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
248
261
  };
249
262
  var sheetSwipeableHandlers = reactSwipeable.useSwipeable({
250
263
  onSwipeStart: handleSheetSwipeStart,
251
- onSwiping: handleSheetSwiping,
252
- onSwiped: handleSheetSwipe,
264
+ onSwiping: handleSheetSwipeMove,
265
+ onSwiped: handleSheetSwipeEnd,
253
266
  onTouchEndOrOnMouseUp: handleTouchEnd,
254
267
  trackMouse: swipeable,
255
268
  trackTouch: swipeable,
@@ -334,11 +347,12 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
334
347
  return (React__default.default.createElement(coreComponentsBaseModal.BaseModal, { open: open, ref: ref, container: container, dataTestId: dataTestId, zIndex: zIndex, onClose: onClose, usePortal: usePortal, scrollHandler: scrollableContainer, Backdrop: components_swipeableBackdrop_Component.SwipeableBackdrop, backdropProps: tslib.__assign(tslib.__assign({}, backdropProps), { className: styles.disabledPointerEvents, opacity: backdropOpacity, opacityTimeout: utils.TIMEOUT, invisible: hideOverlay }), disableBackdropClick: hideOverlay ? true : disableOverlayClick, className: cn__default.default(styles.modal, modalClassName), wrapperClassName: cn__default.default(modalWrapperClassName, (_b = {},
335
348
  _b[styles.disabledPointerEvents] = hideOverlay,
336
349
  _b)), disableBlockingScroll: disableBlockingScroll, disableFocusLock: disableFocusLock, transitionProps: tslib.__assign(tslib.__assign({ appear: true, timeout: utils.TIMEOUT, classNames: styles }, transitionProps), { onExited: handleExited, onEntered: handleEntered, onEnter: handleEnter, onExit: handleExit }), disableAutoFocus: disableAutoFocus, disableEscapeKeyDown: disableEscapeKeyDown, disableRestoreFocus: disableRestoreFocus, keepMounted: keepMounted },
337
- React__default.default.createElement("div", { style: tslib.__assign({}, getHeightStyles()), className: cn__default.default(styles.wrapper, (_c = {},
350
+ React__default.default.createElement("div", { className: cn__default.default(styles.wrapper, (_c = {},
338
351
  _c[styles.fullscreen] = headerOffset === 0 && sheetOffset === 0,
339
352
  _c)), onTransitionEnd: setSheetHeight },
340
353
  React__default.default.createElement("div", tslib.__assign({ className: cn__default.default(styles.component, bgClassName, className, (_d = {},
341
354
  _d[styles.withTransition] = swipingInProgress === false,
355
+ _d[styles.safeAreaBottom] = coreComponentsShared.os.isIOS(),
342
356
  _d)), style: tslib.__assign(tslib.__assign({}, getSwipeStyles()), getHeightStyles()) }, sheetSwipeableHandlers, { ref: mergeRefs__default.default([sheetRef, sheetContainerRef, sheetSwipeableHandlers.ref]), onTransitionEnd: handleTransitionEnd }),
343
357
  renderMarker(),
344
358
  React__default.default.createElement("div", tslib.__assign({}, containerProps, { className: cn__default.default(styles.scrollableContainer, containerProps === null || containerProps === void 0 ? void 0 : containerProps.className, containerClassName, (_e = {},
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_pv52s","sticky":"bottom-sheet__sticky_pv52s","highlighted":"bottom-sheet__highlighted_pv52s","background-accent":"bottom-sheet__background-accent_pv52s","background-info":"bottom-sheet__background-info_pv52s","background-attention-muted":"bottom-sheet__background-attention-muted_pv52s","background-positive-muted":"bottom-sheet__background-positive-muted_pv52s","background-negative-muted":"bottom-sheet__background-negative-muted_pv52s","background-primary":"bottom-sheet__background-primary_pv52s","background-primary-inverted":"bottom-sheet__background-primary-inverted_pv52s","background-secondary":"bottom-sheet__background-secondary_pv52s","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_pv52s","background-tertiary":"bottom-sheet__background-tertiary_pv52s","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_pv52s","background-quaternary":"bottom-sheet__background-quaternary_pv52s","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_pv52s","background-specialbg-component":"bottom-sheet__background-specialbg-component_pv52s","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_pv52s","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_pv52s","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_pv52s","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_pv52s","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_pv52s","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_pv52s","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_pv52s","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_pv52s"};
14
+ var styles = {"footer":"bottom-sheet__footer_c562w","sticky":"bottom-sheet__sticky_c562w","highlighted":"bottom-sheet__highlighted_c562w","background-accent":"bottom-sheet__background-accent_c562w","background-info":"bottom-sheet__background-info_c562w","background-attention-muted":"bottom-sheet__background-attention-muted_c562w","background-positive-muted":"bottom-sheet__background-positive-muted_c562w","background-negative-muted":"bottom-sheet__background-negative-muted_c562w","background-primary":"bottom-sheet__background-primary_c562w","background-primary-inverted":"bottom-sheet__background-primary-inverted_c562w","background-secondary":"bottom-sheet__background-secondary_c562w","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_c562w","background-tertiary":"bottom-sheet__background-tertiary_c562w","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_c562w","background-quaternary":"bottom-sheet__background-quaternary_c562w","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_c562w","background-specialbg-component":"bottom-sheet__background-specialbg-component_c562w","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_c562w","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_c562w","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_c562w","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_c562w","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_c562w","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_c562w","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_c562w","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_c562w"};
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: igk35 */
1
+ /* hash: 1ezh4 */
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-bg-accent: #ef3124;
@@ -46,58 +46,58 @@
46
46
  /* footer */
47
47
  --bottom-sheet-footer-border-top: 1px solid var(--color-light-neutral-300);
48
48
  --bottom-sheet-footer-background-color: var(--color-light-modal-bg-primary);
49
- } .bottom-sheet__footer_pv52s {
49
+ } .bottom-sheet__footer_c562w {
50
50
  padding: var(--gap-m) var(--gap-m);
51
51
  background-color: var(--color-light-modal-bg-primary);
52
- } .bottom-sheet__sticky_pv52s {
52
+ } .bottom-sheet__sticky_c562w {
53
53
  position: sticky;
54
54
  bottom: 0;
55
55
  z-index: 1;
56
- } .bottom-sheet__highlighted_pv52s {
56
+ } .bottom-sheet__highlighted_c562w {
57
57
  border-top: var(--bottom-sheet-footer-border-top);
58
58
  background-color: var(--bottom-sheet-footer-background-color);
59
- } .bottom-sheet__background-accent_pv52s {
59
+ } .bottom-sheet__background-accent_c562w {
60
60
  background-color: var(--color-light-bg-accent);
61
- } .bottom-sheet__background-info_pv52s {
61
+ } .bottom-sheet__background-info_c562w {
62
62
  background-color: var(--color-light-bg-info);
63
- } .bottom-sheet__background-attention-muted_pv52s {
63
+ } .bottom-sheet__background-attention-muted_c562w {
64
64
  background-color: var(--color-light-bg-attention-muted);
65
- } .bottom-sheet__background-positive-muted_pv52s {
65
+ } .bottom-sheet__background-positive-muted_c562w {
66
66
  background-color: var(--color-light-bg-positive-muted);
67
- } .bottom-sheet__background-negative-muted_pv52s {
67
+ } .bottom-sheet__background-negative-muted_c562w {
68
68
  background-color: var(--color-light-bg-negative-muted);
69
- } .bottom-sheet__background-primary_pv52s {
69
+ } .bottom-sheet__background-primary_c562w {
70
70
  background-color: var(--color-light-bg-primary);
71
- } .bottom-sheet__background-primary-inverted_pv52s {
71
+ } .bottom-sheet__background-primary-inverted_c562w {
72
72
  background-color: var(--color-light-bg-primary-inverted);
73
- } .bottom-sheet__background-secondary_pv52s {
73
+ } .bottom-sheet__background-secondary_c562w {
74
74
  background-color: var(--color-light-bg-secondary);
75
- } .bottom-sheet__background-secondary-inverted_pv52s {
75
+ } .bottom-sheet__background-secondary-inverted_c562w {
76
76
  background-color: var(--color-light-bg-secondary-inverted);
77
- } .bottom-sheet__background-tertiary_pv52s {
77
+ } .bottom-sheet__background-tertiary_c562w {
78
78
  background-color: var(--color-light-bg-tertiary);
79
- } .bottom-sheet__background-tertiary-inverted_pv52s {
79
+ } .bottom-sheet__background-tertiary-inverted_c562w {
80
80
  background-color: var(--color-light-bg-tertiary-inverted);
81
- } .bottom-sheet__background-quaternary_pv52s {
81
+ } .bottom-sheet__background-quaternary_c562w {
82
82
  background-color: var(--color-light-bg-quaternary);
83
- } .bottom-sheet__background-quaternary-inverted_pv52s {
83
+ } .bottom-sheet__background-quaternary-inverted_c562w {
84
84
  background-color: var(--color-light-bg-quaternary-inverted);
85
- } .bottom-sheet__background-specialbg-component_pv52s {
85
+ } .bottom-sheet__background-specialbg-component_c562w {
86
86
  background-color: var(--color-light-specialbg-component);
87
- } .bottom-sheet__background-specialbg-component-inverted_pv52s {
87
+ } .bottom-sheet__background-specialbg-component-inverted_c562w {
88
88
  background-color: var(--color-light-specialbg-component-inverted);
89
- } .bottom-sheet__background-specialbg-primary-grouped_pv52s {
89
+ } .bottom-sheet__background-specialbg-primary-grouped_c562w {
90
90
  background-color: var(--color-light-specialbg-primary-grouped);
91
- } .bottom-sheet__background-specialbg-secondary-grouped_pv52s {
91
+ } .bottom-sheet__background-specialbg-secondary-grouped_c562w {
92
92
  background-color: var(--color-light-specialbg-secondary-grouped);
93
- } .bottom-sheet__background-specialbg-tertiary-grouped_pv52s {
93
+ } .bottom-sheet__background-specialbg-tertiary-grouped_c562w {
94
94
  background-color: var(--color-light-specialbg-tertiary-grouped);
95
- } .bottom-sheet__background-specialbg-secondary-transparent_pv52s {
95
+ } .bottom-sheet__background-specialbg-secondary-transparent_c562w {
96
96
  background-color: var(--color-light-specialbg-secondary-transparent);
97
- } .bottom-sheet__background-specialbg-secondary-transparent-inverted_pv52s {
97
+ } .bottom-sheet__background-specialbg-secondary-transparent-inverted_c562w {
98
98
  background-color: var(--color-light-specialbg-secondary-transparent-inverted);
99
- } .bottom-sheet__background-specialbg-tertiary-transparent_pv52s {
99
+ } .bottom-sheet__background-specialbg-tertiary-transparent_c562w {
100
100
  background-color: var(--color-light-specialbg-tertiary-transparent);
101
- } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_pv52s {
101
+ } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_c562w {
102
102
  background-color: var(--color-light-specialbg-tertiary-transparent-inverted);
103
103
  }
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_n5i2s","hasContent":"bottom-sheet__hasContent_n5i2s","header":"bottom-sheet__header_n5i2s","sticky":"bottom-sheet__sticky_n5i2s","highlighted":"bottom-sheet__highlighted_n5i2s","justifyEnd":"bottom-sheet__justifyEnd_n5i2s","addon":"bottom-sheet__addon_n5i2s","addonFixed":"bottom-sheet__addonFixed_n5i2s","title":"bottom-sheet__title_n5i2s","titleCenter":"bottom-sheet__titleCenter_n5i2s","titleLeft":"bottom-sheet__titleLeft_n5i2s","trimTitle":"bottom-sheet__trimTitle_n5i2s"};
16
+ var styles = {"headerWrapper":"bottom-sheet__headerWrapper_14dgd","hasContent":"bottom-sheet__hasContent_14dgd","header":"bottom-sheet__header_14dgd","sticky":"bottom-sheet__sticky_14dgd","highlighted":"bottom-sheet__highlighted_14dgd","justifyEnd":"bottom-sheet__justifyEnd_14dgd","addon":"bottom-sheet__addon_14dgd","addonFixed":"bottom-sheet__addonFixed_14dgd","title":"bottom-sheet__title_14dgd","titleCenter":"bottom-sheet__titleCenter_14dgd","titleLeft":"bottom-sheet__titleLeft_14dgd","trimTitle":"bottom-sheet__trimTitle_14dgd"};
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: e6ngd */
1
+ /* hash: sd5sa */
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 */
@@ -30,42 +30,42 @@
30
30
  --bottom-sheet-title-font-family: var(--font-family-system);
31
31
 
32
32
  /* footer */
33
- } .bottom-sheet__headerWrapper_n5i2s {
33
+ } .bottom-sheet__headerWrapper_14dgd {
34
34
  padding: var(--gap-s) var(--gap-xs) var(--gap-2xs);
35
35
  border-top-left-radius: inherit;
36
36
  border-top-right-radius: inherit;
37
37
  z-index: 1;
38
- } .bottom-sheet__hasContent_n5i2s {
38
+ } .bottom-sheet__hasContent_14dgd {
39
39
  background-color: inherit;
40
- } .bottom-sheet__header_n5i2s {
40
+ } .bottom-sheet__header_14dgd {
41
41
  display: flex;
42
- } .bottom-sheet__sticky_n5i2s {
42
+ } .bottom-sheet__sticky_14dgd {
43
43
  position: sticky;
44
44
  top: 0;
45
- } .bottom-sheet__highlighted_n5i2s {
45
+ } .bottom-sheet__highlighted_14dgd {
46
46
  border-bottom: var(--bottom-sheet-header-border-bottom);
47
- } .bottom-sheet__justifyEnd_n5i2s {
47
+ } .bottom-sheet__justifyEnd_14dgd {
48
48
  justify-content: flex-end;
49
- } .bottom-sheet__addon_n5i2s {
49
+ } .bottom-sheet__addon_14dgd {
50
50
  display: flex;
51
51
  justify-content: center;
52
52
  align-items: center;
53
53
  min-width: 48px;
54
54
  height: 48px;
55
- } .bottom-sheet__addonFixed_n5i2s {
55
+ } .bottom-sheet__addonFixed_14dgd {
56
56
  position: fixed;
57
- } .bottom-sheet__title_n5i2s {
57
+ } .bottom-sheet__title_14dgd {
58
58
  padding: var(--gap-s) var(--gap-xs);
59
59
  width: 100%;
60
60
  font-size: var(--bottom-sheet-title-font-size);
61
61
  font-weight: var(--bottom-sheet-title-font-weight);
62
62
  line-height: var(--bottom-sheet-title-line-height);
63
63
  font-family: var(--bottom-sheet-title-font-family);
64
- } .bottom-sheet__titleCenter_n5i2s {
64
+ } .bottom-sheet__titleCenter_14dgd {
65
65
  text-align: center;
66
- } .bottom-sheet__titleLeft_n5i2s {
66
+ } .bottom-sheet__titleLeft_14dgd {
67
67
  text-align: left;
68
- } .bottom-sheet__trimTitle_n5i2s {
68
+ } .bottom-sheet__trimTitle_14dgd {
69
69
  white-space: nowrap;
70
70
  overflow: hidden;
71
71
  text-overflow: ellipsis;
package/consts/swipeConsts.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ declare const horizontalDirections: [string, string];
2
+ export { horizontalDirections };
package/consts/swipeConsts.js ADDED
@@ -0,0 +1,9 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var enums_swipeEnums = require('../enums/swipeEnums.js');
6
+
7
+ var horizontalDirections = [enums_swipeEnums.SwipeDirection.Left, enums_swipeEnums.SwipeDirection.Right];
8
+
9
+ exports.horizontalDirections = horizontalDirections;
package/cssm/component.js CHANGED
@@ -13,6 +13,7 @@ var coreComponentsShared = require('@alfalab/core-components-shared/cssm');
13
13
  var components_footer_Component = require('./components/footer/Component.js');
14
14
  var components_header_Component = require('./components/header/Component.js');
15
15
  var components_swipeableBackdrop_Component = require('./components/swipeable-backdrop/Component.js');
16
+ var consts_swipeConsts = require('./consts/swipeConsts.js');
16
17
  var utils = require('./utils.js');
17
18
  var styles = require('./index.module.css');
18
19
 
@@ -31,12 +32,15 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
31
32
  // Хук use100vh рассчитывает высоту вьюпорта в useEffect, поэтому на первый рендер всегда возвращает null.
32
33
  var isFirstRender = fullHeight === 0;
33
34
  var magneticAreas = React.useMemo(function () {
35
+ var _a;
34
36
  if (magneticAreasProp) {
35
37
  return magneticAreasProp.map(function (area) {
36
38
  return utils.convertPercentToNumber(area, fullHeight, headerOffset);
37
39
  });
38
40
  }
39
- return [0, fullHeight - headerOffset];
41
+ var iOSViewHeight = ((_a = document === null || document === void 0 ? void 0 : document.documentElement) === null || _a === void 0 ? void 0 : _a.clientHeight) || window.innerHeight;
42
+ var viewHeight = coreComponentsShared.os.isIOS() ? iOSViewHeight : fullHeight;
43
+ return [0, viewHeight - headerOffset];
40
44
  }, [fullHeight, headerOffset, magneticAreasProp]);
41
45
  var lastMagneticArea = magneticAreas[magneticAreas.length - 1];
42
46
  var _t = React.useState(0), sheetOffset = _t[0], setSheetOffset = _t[1];
@@ -186,8 +190,9 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
186
190
  * Если контент внутри шторки скроллится - то шторка не должна свайпаться
187
191
  * Если шапка внутри шторки зафиксирована - то шторка должна свайпаться только в области шапки
188
192
  */
189
- var shouldSkipSwiping = function (deltaY, startY, event) {
193
+ var shouldSkipSwiping = function (swipeParams) {
190
194
  var _a;
195
+ var deltaY = swipeParams.deltaY, startY = swipeParams.startY, event = swipeParams.event, dir = swipeParams.dir;
191
196
  if (scrollLockedProp || swipingInProgress)
192
197
  return false;
193
198
  if (!swipeableContent && ((_a = contentRef.current) === null || _a === void 0 ? void 0 : _a.contains(event.target))) {
@@ -212,18 +217,24 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
212
217
  if (!scrollOccurred.current && shouldScroll) {
213
218
  scrollOccurred.current = true;
214
219
  }
220
+ // Если контент внутри шторки скроллится горизонально - то шторка не должна закрываться
221
+ if (consts_swipeConsts.horizontalDirections.includes(dir)) {
222
+ return true;
223
+ }
215
224
  return shouldScroll;
216
225
  };
217
- var handleSheetSwipe = function (_a) {
218
- var initial = _a.initial, velocity = _a.velocity, deltaY = _a.deltaY, event = _a.event;
219
- if (scrollOccurred.current || shouldSkipSwiping(deltaY, initial[1], event)) {
226
+ var handleSheetSwipeEnd = function (swipeParams) {
227
+ var initial = swipeParams.initial, velocity = swipeParams.velocity, deltaY = swipeParams.deltaY, event = swipeParams.event, dir = swipeParams.dir;
228
+ var shouldPreventSwipe = scrollOccurred.current ||
229
+ shouldSkipSwiping({ deltaY: deltaY, startY: initial[1], event: event, dir: dir });
230
+ if (shouldPreventSwipe) {
220
231
  return;
221
232
  }
222
233
  magnetize(velocity, deltaY);
223
234
  };
224
- var handleSheetSwipeStart = function (_a) {
225
- var deltaY = _a.deltaY, initial = _a.initial, event = _a.event;
226
- if (shouldSkipSwiping(deltaY, initial[1], event)) {
235
+ var handleSheetSwipeStart = function (swipeParams) {
236
+ var deltaY = swipeParams.deltaY, initial = swipeParams.initial, event = swipeParams.event, dir = swipeParams.dir;
237
+ if (shouldSkipSwiping({ deltaY: deltaY, startY: initial[1], event: event, dir: dir })) {
227
238
  return;
228
239
  }
229
240
  startSwiping(event);
@@ -232,9 +243,11 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
232
243
  var event = _a.event;
233
244
  return stopSwiping(event);
234
245
  };
235
- var handleSheetSwiping = function (_a) {
236
- var initial = _a.initial, deltaY = _a.deltaY, event = _a.event;
237
- if (scrollOccurred.current || shouldSkipSwiping(deltaY, initial[1], event)) {
246
+ var handleSheetSwipeMove = function (swipeParams) {
247
+ var initial = swipeParams.initial, deltaY = swipeParams.deltaY, event = swipeParams.event, dir = swipeParams.dir;
248
+ var shouldPreventSwipe = scrollOccurred.current ||
249
+ shouldSkipSwiping({ deltaY: deltaY, startY: initial[1], event: event, dir: dir });
250
+ if (shouldPreventSwipe) {
238
251
  return;
239
252
  }
240
253
  if (!swipingInProgress) {
@@ -247,8 +260,8 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
247
260
  };
248
261
  var sheetSwipeableHandlers = reactSwipeable.useSwipeable({
249
262
  onSwipeStart: handleSheetSwipeStart,
250
- onSwiping: handleSheetSwiping,
251
- onSwiped: handleSheetSwipe,
263
+ onSwiping: handleSheetSwipeMove,
264
+ onSwiped: handleSheetSwipeEnd,
252
265
  onTouchEndOrOnMouseUp: handleTouchEnd,
253
266
  trackMouse: swipeable,
254
267
  trackTouch: swipeable,
@@ -333,11 +346,12 @@ var BottomSheet = React.forwardRef(function (_a, ref) {
333
346
  return (React__default.default.createElement(coreComponentsBaseModal.BaseModal, { open: open, ref: ref, container: container, dataTestId: dataTestId, zIndex: zIndex, onClose: onClose, usePortal: usePortal, scrollHandler: scrollableContainer, Backdrop: components_swipeableBackdrop_Component.SwipeableBackdrop, backdropProps: tslib.__assign(tslib.__assign({}, backdropProps), { className: styles__default.default.disabledPointerEvents, opacity: backdropOpacity, opacityTimeout: utils.TIMEOUT, invisible: hideOverlay }), disableBackdropClick: hideOverlay ? true : disableOverlayClick, className: cn__default.default(styles__default.default.modal, modalClassName), wrapperClassName: cn__default.default(modalWrapperClassName, (_b = {},
334
347
  _b[styles__default.default.disabledPointerEvents] = hideOverlay,
335
348
  _b)), disableBlockingScroll: disableBlockingScroll, disableFocusLock: disableFocusLock, transitionProps: tslib.__assign(tslib.__assign({ appear: true, timeout: utils.TIMEOUT, classNames: styles__default.default }, transitionProps), { onExited: handleExited, onEntered: handleEntered, onEnter: handleEnter, onExit: handleExit }), disableAutoFocus: disableAutoFocus, disableEscapeKeyDown: disableEscapeKeyDown, disableRestoreFocus: disableRestoreFocus, keepMounted: keepMounted },
336
- React__default.default.createElement("div", { style: tslib.__assign({}, getHeightStyles()), className: cn__default.default(styles__default.default.wrapper, (_c = {},
349
+ React__default.default.createElement("div", { className: cn__default.default(styles__default.default.wrapper, (_c = {},
337
350
  _c[styles__default.default.fullscreen] = headerOffset === 0 && sheetOffset === 0,
338
351
  _c)), onTransitionEnd: setSheetHeight },
339
352
  React__default.default.createElement("div", tslib.__assign({ className: cn__default.default(styles__default.default.component, bgClassName, className, (_d = {},
340
353
  _d[styles__default.default.withTransition] = swipingInProgress === false,
354
+ _d[styles__default.default.safeAreaBottom] = coreComponentsShared.os.isIOS(),
341
355
  _d)), style: tslib.__assign(tslib.__assign({}, getSwipeStyles()), getHeightStyles()) }, sheetSwipeableHandlers, { ref: mergeRefs__default.default([sheetRef, sheetContainerRef, sheetSwipeableHandlers.ref]), onTransitionEnd: handleTransitionEnd }),
342
356
  renderMarker(),
343
357
  React__default.default.createElement("div", tslib.__assign({}, containerProps, { className: cn__default.default(styles__default.default.scrollableContainer, containerProps === null || containerProps === void 0 ? void 0 : containerProps.className, containerClassName, (_e = {},
package/cssm/consts/swipeConsts.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ declare const horizontalDirections: [string, string];
2
+ export { horizontalDirections };
package/cssm/consts/swipeConsts.js ADDED
@@ -0,0 +1,9 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ var enums_swipeEnums = require('../enums/swipeEnums.js');
6
+
7
+ var horizontalDirections = [enums_swipeEnums.SwipeDirection.Left, enums_swipeEnums.SwipeDirection.Right];
8
+
9
+ exports.horizontalDirections = horizontalDirections;
package/cssm/enums/swipeEnums.d.ts ADDED
@@ -0,0 +1,7 @@
1
+ declare enum SwipeDirection {
2
+ Left = "Left",
3
+ Right = "Right",
4
+ Up = "Up",
5
+ Down = "Down"
6
+ }
7
+ export { SwipeDirection };
package/cssm/enums/swipeEnums.js ADDED
@@ -0,0 +1,11 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ exports.SwipeDirection = void 0;
6
+ (function (SwipeDirection) {
7
+ SwipeDirection["Left"] = "Left";
8
+ SwipeDirection["Right"] = "Right";
9
+ SwipeDirection["Up"] = "Up";
10
+ SwipeDirection["Down"] = "Down";
11
+ })(exports.SwipeDirection || (exports.SwipeDirection = {}));
package/cssm/index.module.css CHANGED
@@ -24,7 +24,7 @@
24
24
  --color-light-specialbg-tertiary-grouped: #f2f3f5;
25
25
  --color-light-specialbg-tertiary-transparent: rgba(30, 43, 68, 0.08);
26
26
  --color-light-specialbg-tertiary-transparent-inverted: rgba(222, 222, 240, 0.12);
27
- --color-light-text-primary: #0e0e0e; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* 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
+ --color-light-text-primary: rgba(3, 3, 6, 0.88); /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
28
28
  } :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 */
29
29
  } :root {
30
30
  } :root {
@@ -135,7 +135,9 @@
135
135
  } .exitActive .wrapper {
136
136
  transition: var(--bottom-sheet-out-transition);
137
137
  transform: translateY(100%);
138
- } .background-accent {
138
+ } .safeAreaBottom {
139
+ padding-bottom: env(safe-area-inset-bottom);
140
+ } .background-accent {
139
141
  background-color: var(--color-light-bg-accent);
140
142
  } .background-info {
141
143
  background-color: var(--color-light-bg-info);
package/cssm/types/swipeTypes.d.ts ADDED
@@ -0,0 +1,9 @@
1
+ import { SwipeDirections } from 'react-swipeable';
2
+ import { HandledEvents } from 'react-swipeable/es/types';
3
+ type ShouldSkipSwipingParams = {
4
+ deltaY: number;
5
+ startY: number;
6
+ event: HandledEvents;
7
+ dir: SwipeDirections;
8
+ };
9
+ export { ShouldSkipSwipingParams };
package/cssm/types/swipeTypes.js ADDED
@@ -0,0 +1,2 @@
1
+ 'use strict';
2
+
package/enums/swipeEnums.d.ts ADDED
@@ -0,0 +1,7 @@
1
+ declare enum SwipeDirection {
2
+ Left = "Left",
3
+ Right = "Right",
4
+ Up = "Up",
5
+ Down = "Down"
6
+ }
7
+ export { SwipeDirection };
package/enums/swipeEnums.js ADDED
@@ -0,0 +1,11 @@
1
+ 'use strict';
2
+
3
+ Object.defineProperty(exports, '__esModule', { value: true });
4
+
5
+ exports.SwipeDirection = void 0;
6
+ (function (SwipeDirection) {
7
+ SwipeDirection["Left"] = "Left";
8
+ SwipeDirection["Right"] = "Right";
9
+ SwipeDirection["Up"] = "Up";
10
+ SwipeDirection["Down"] = "Down";
11
+ })(exports.SwipeDirection || (exports.SwipeDirection = {}));