@alfalab/core-components 46.0.0-beta.1 → 46.0.0

package/bottom-sheet/esm/index.css

@@ -1,4 +1,4 @@
-/* hash: 1y7n7 */
+/* hash: cn0ra */
 :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 */
 } /* deprecated */ :root {
     --color-light-bg-accent: #ef3124;
@@ -52,25 +52,25 @@
     /* header */
 
     /* footer */
-} .bottom-sheet__modal_tmbtb {
+} .bottom-sheet__modal_exdrv {
     bottom: 0;
     width: 100%;
     max-width: 600px;
     pointer-events: none;
     touch-action: none;
-} .bottom-sheet__modal_tmbtb.bottom-sheet__modal_tmbtb {
+} .bottom-sheet__modal_exdrv.bottom-sheet__modal_exdrv {
     background-color: transparent;
     position: fixed;
-} .bottom-sheet__wrapper_tmbtb {
+} .bottom-sheet__wrapper_exdrv {
     transform: translateY(100%);
     pointer-events: none;
     touch-action: none;
     border-top-right-radius: var(--bottom-sheet-top-radius);
     border-top-left-radius: var(--bottom-sheet-top-radius);
     transition: border-radius 0.3s ease;
-} .bottom-sheet__fullscreen_tmbtb {
+} .bottom-sheet__fullscreen_exdrv {
     border-radius: 0;
-} .bottom-sheet__component_tmbtb {
+} .bottom-sheet__component_exdrv {
     position: relative;
     display: flex;
     flex-direction: column;
@@ -78,9 +78,9 @@
     background-color: var(--color-light-modal-bg-primary);
     pointer-events: all;
     box-shadow: var(--bottom-sheet-shadow);
-} .bottom-sheet__withTransition_tmbtb {
+} .bottom-sheet__withTransition_exdrv {
     transition: var(--bottom-sheet-out-transition);
-} .bottom-sheet__scrollableContainer_tmbtb {
+} .bottom-sheet__scrollableContainer_exdrv {
     overflow: auto;
     display: flex;
     flex-direction: column;
@@ -89,7 +89,7 @@
     background-color: inherit;
     border-radius: inherit;
     overscroll-behavior: contain;
-} .bottom-sheet__marker_tmbtb {
+} .bottom-sheet__marker_exdrv {
     position: fixed;
     top: var(--gap-2xs);
     right: 0;
@@ -97,11 +97,11 @@
     z-index: 1000;
     width: 36px;
     margin: 0 auto;
-} .bottom-sheet__defaultMarker_tmbtb {
+} .bottom-sheet__defaultMarker_exdrv {
     height: 4px;
     border-radius: var(--border-radius-xxl);
     background-color: var(--color-light-neutral-translucent-300);
-} .bottom-sheet__content_tmbtb {
+} .bottom-sheet__content_exdrv {
     position: relative;
     z-index: 0;
     display: flex;
@@ -111,73 +111,75 @@
     color: var(--color-light-text-primary);
     background-color: inherit;
     border-radius: inherit;
-} .bottom-sheet__noHeader_tmbtb {
+} .bottom-sheet__noHeader_exdrv {
     padding-top: var(--gap-m);
-} .bottom-sheet__noFooter_tmbtb {
+} .bottom-sheet__noFooter_exdrv {
     padding-bottom: var(--gap-m);
-} .bottom-sheet__scrollLocked_tmbtb {
+} .bottom-sheet__scrollLocked_exdrv {
     overflow: hidden;
-} .bottom-sheet__hiddenScrollbar_tmbtb {
+} .bottom-sheet__hiddenScrollbar_exdrv {
     scrollbar-width: none
-} .bottom-sheet__hiddenScrollbar_tmbtb::-webkit-scrollbar {
+} .bottom-sheet__hiddenScrollbar_exdrv::-webkit-scrollbar {
         width: 0;
         height: 0;
-    } .bottom-sheet__disabledPointerEvents_tmbtb {
+    } .bottom-sheet__disabledPointerEvents_exdrv {
     pointer-events: none;
-} .bottom-sheet__appear_tmbtb .bottom-sheet__wrapper_tmbtb, .bottom-sheet__enter_tmbtb .bottom-sheet__wrapper_tmbtb {
+} .bottom-sheet__appear_exdrv .bottom-sheet__wrapper_exdrv, .bottom-sheet__enter_exdrv .bottom-sheet__wrapper_exdrv {
         transition: none;
-    } .bottom-sheet__appearActive_tmbtb .bottom-sheet__wrapper_tmbtb, .bottom-sheet__enterActive_tmbtb .bottom-sheet__wrapper_tmbtb {
+    } .bottom-sheet__appearActive_exdrv .bottom-sheet__wrapper_exdrv, .bottom-sheet__enterActive_exdrv .bottom-sheet__wrapper_exdrv {
         transition: var(--bottom-sheet-in-transition);
         transform: translateY(0);
-    } .bottom-sheet__enterDone_tmbtb .bottom-sheet__wrapper_tmbtb, .bottom-sheet__appearDone_tmbtb .bottom-sheet__wrapper_tmbtb {
+    } .bottom-sheet__enterDone_exdrv .bottom-sheet__wrapper_exdrv, .bottom-sheet__appearDone_exdrv .bottom-sheet__wrapper_exdrv {
         transform: translateY(0);
-    } .bottom-sheet__exit_tmbtb .bottom-sheet__wrapper_tmbtb {
+    } .bottom-sheet__exit_exdrv .bottom-sheet__wrapper_exdrv {
         transform: translateY(0);
-    } .bottom-sheet__exitActive_tmbtb .bottom-sheet__wrapper_tmbtb {
+    } .bottom-sheet__exitActive_exdrv .bottom-sheet__wrapper_exdrv {
         transition: var(--bottom-sheet-out-transition);
         transform: translateY(100%);
-    } .bottom-sheet__background-accent_tmbtb {
+    } .bottom-sheet__safeAreaBottom_exdrv {
+    padding-bottom: env(safe-area-inset-bottom);
+} .bottom-sheet__background-accent_exdrv {
             background-color: var(--color-light-bg-accent);
-        } .bottom-sheet__background-info_tmbtb {
+        } .bottom-sheet__background-info_exdrv {
             background-color: var(--color-light-bg-info);
-        } .bottom-sheet__background-attention-muted_tmbtb {
+        } .bottom-sheet__background-attention-muted_exdrv {
             background-color: var(--color-light-bg-attention-muted);
-        } .bottom-sheet__background-positive-muted_tmbtb {
+        } .bottom-sheet__background-positive-muted_exdrv {
             background-color: var(--color-light-bg-positive-muted);
-        } .bottom-sheet__background-negative-muted_tmbtb {
+        } .bottom-sheet__background-negative-muted_exdrv {
             background-color: var(--color-light-bg-negative-muted);
-        } .bottom-sheet__background-primary_tmbtb {
+        } .bottom-sheet__background-primary_exdrv {
             background-color: var(--color-light-bg-primary);
-        } .bottom-sheet__background-primary-inverted_tmbtb {
+        } .bottom-sheet__background-primary-inverted_exdrv {
             background-color: var(--color-light-bg-primary-inverted);
-        } .bottom-sheet__background-secondary_tmbtb {
+        } .bottom-sheet__background-secondary_exdrv {
             background-color: var(--color-light-bg-secondary);
-        } .bottom-sheet__background-secondary-inverted_tmbtb {
+        } .bottom-sheet__background-secondary-inverted_exdrv {
             background-color: var(--color-light-bg-secondary-inverted);
-        } .bottom-sheet__background-tertiary_tmbtb {
+        } .bottom-sheet__background-tertiary_exdrv {
             background-color: var(--color-light-bg-tertiary);
-        } .bottom-sheet__background-tertiary-inverted_tmbtb {
+        } .bottom-sheet__background-tertiary-inverted_exdrv {
             background-color: var(--color-light-bg-tertiary-inverted);
-        } .bottom-sheet__background-quaternary_tmbtb {
+        } .bottom-sheet__background-quaternary_exdrv {
             background-color: var(--color-light-bg-quaternary);
-        } .bottom-sheet__background-quaternary-inverted_tmbtb {
+        } .bottom-sheet__background-quaternary-inverted_exdrv {
             background-color: var(--color-light-bg-quaternary-inverted);
-        } .bottom-sheet__background-specialbg-component_tmbtb {
+        } .bottom-sheet__background-specialbg-component_exdrv {
             background-color: var(--color-light-specialbg-component);
-        } .bottom-sheet__background-specialbg-component-inverted_tmbtb {
+        } .bottom-sheet__background-specialbg-component-inverted_exdrv {
             background-color: var(--color-light-specialbg-component-inverted);
-        } .bottom-sheet__background-specialbg-primary-grouped_tmbtb {
+        } .bottom-sheet__background-specialbg-primary-grouped_exdrv {
             background-color: var(--color-light-specialbg-primary-grouped);
-        } .bottom-sheet__background-specialbg-secondary-grouped_tmbtb {
+        } .bottom-sheet__background-specialbg-secondary-grouped_exdrv {
             background-color: var(--color-light-specialbg-secondary-grouped);
-        } .bottom-sheet__background-specialbg-tertiary-grouped_tmbtb {
+        } .bottom-sheet__background-specialbg-tertiary-grouped_exdrv {
             background-color: var(--color-light-specialbg-tertiary-grouped);
-        } .bottom-sheet__background-specialbg-secondary-transparent_tmbtb {
+        } .bottom-sheet__background-specialbg-secondary-transparent_exdrv {
             background-color: var(--color-light-specialbg-secondary-transparent);
-        } .bottom-sheet__background-specialbg-secondary-transparent-inverted_tmbtb {
+        } .bottom-sheet__background-specialbg-secondary-transparent-inverted_exdrv {
             background-color: var(--color-light-specialbg-secondary-transparent-inverted);
-        } .bottom-sheet__background-specialbg-tertiary-transparent_tmbtb {
+        } .bottom-sheet__background-specialbg-tertiary-transparent_exdrv {
             background-color: var(--color-light-specialbg-tertiary-transparent);
-        } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_tmbtb {
+        } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_exdrv {
             background-color: var(--color-light-specialbg-tertiary-transparent-inverted);
         }

package/bottom-sheet/esm/index.js

@@ -10,6 +10,8 @@ import '../../base-modal/esm';
 import '../../shared/esm';
 import './components/footer/Component.js';
 import './components/header/Component.js';
-import '../../navigation-bar/esm';
+import '../../navigation-bar-private/esm';
 import './components/swipeable-backdrop/Component.js';
 import '../../backdrop/esm';
+import './consts/swipeConsts.js';
+import './enums/swipeEnums.js';

package/bottom-sheet/esm/types/swipeTypes.d.ts

@@ -0,0 +1,9 @@
+import { SwipeDirections } from 'react-swipeable';
+import { HandledEvents } from 'react-swipeable/es/types';
+type ShouldSkipSwipingParams = {
+    deltaY: number;
+    startY: number;
+    event: HandledEvents;
+    dir: SwipeDirections;
+};
+export { ShouldSkipSwipingParams };

package/bottom-sheet/esm/types/swipeTypes.js

@@ -0,0 +1 @@
+

package/bottom-sheet/esm/types.d.ts

@@ -3,7 +3,7 @@ import { HTMLAttributes, ReactElement, ReactNode, RefObject } from 'react';
 import { HandledEvents } from 'react-swipeable/es/types';
 import { TransitionProps } from 'react-transition-group/Transition';
 import { BaseModalProps } from "../../base-modal";
-import { NavigationBarProps } from "../../navigation-bar";
+import { NavigationBarPrivateProps as NavigationBarProps } from "../../navigation-bar-private";
 type BackgroundColorType = "accent" | "info" | "attention-muted" | "positive-muted" | "negative-muted" | "primary" | "primary-inverted" | "secondary" | "secondary-inverted" | "tertiary" | "tertiary-inverted" | "quaternary" | "quaternary-inverted" | "specialbg-component" | "specialbg-component-inverted" | "specialbg-primary-grouped" | "specialbg-secondary-grouped" | "specialbg-tertiary-grouped" | "specialbg-secondary-transparent" | "specialbg-secondary-transparent-inverted" | "specialbg-tertiary-transparent" | "specialbg-tertiary-transparent-inverted";
 type BottomSheetTitleAlign = 'center' | 'left';
 type BottomSheetProps = {

package/bottom-sheet/index.css

@@ -1,4 +1,4 @@
-/* hash: 1y7n7 */
+/* hash: cn0ra */
 :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 */
 } /* deprecated */ :root {
     --color-light-bg-accent: #ef3124;
@@ -52,25 +52,25 @@
     /* header */
 
     /* footer */
-} .bottom-sheet__modal_tmbtb {
+} .bottom-sheet__modal_exdrv {
     bottom: 0;
     width: 100%;
     max-width: 600px;
     pointer-events: none;
     touch-action: none;
-} .bottom-sheet__modal_tmbtb.bottom-sheet__modal_tmbtb {
+} .bottom-sheet__modal_exdrv.bottom-sheet__modal_exdrv {
     background-color: transparent;
     position: fixed;
-} .bottom-sheet__wrapper_tmbtb {
+} .bottom-sheet__wrapper_exdrv {
     transform: translateY(100%);
     pointer-events: none;
     touch-action: none;
     border-top-right-radius: var(--bottom-sheet-top-radius);
     border-top-left-radius: var(--bottom-sheet-top-radius);
     transition: border-radius 0.3s ease;
-} .bottom-sheet__fullscreen_tmbtb {
+} .bottom-sheet__fullscreen_exdrv {
     border-radius: 0;
-} .bottom-sheet__component_tmbtb {
+} .bottom-sheet__component_exdrv {
     position: relative;
     display: flex;
     flex-direction: column;
@@ -78,9 +78,9 @@
     background-color: var(--color-light-modal-bg-primary);
     pointer-events: all;
     box-shadow: var(--bottom-sheet-shadow);
-} .bottom-sheet__withTransition_tmbtb {
+} .bottom-sheet__withTransition_exdrv {
     transition: var(--bottom-sheet-out-transition);
-} .bottom-sheet__scrollableContainer_tmbtb {
+} .bottom-sheet__scrollableContainer_exdrv {
     overflow: auto;
     display: flex;
     flex-direction: column;
@@ -89,7 +89,7 @@
     background-color: inherit;
     border-radius: inherit;
     overscroll-behavior: contain;
-} .bottom-sheet__marker_tmbtb {
+} .bottom-sheet__marker_exdrv {
     position: fixed;
     top: var(--gap-2xs);
     right: 0;
@@ -97,11 +97,11 @@
     z-index: 1000;
     width: 36px;
     margin: 0 auto;
-} .bottom-sheet__defaultMarker_tmbtb {
+} .bottom-sheet__defaultMarker_exdrv {
     height: 4px;
     border-radius: var(--border-radius-xxl);
     background-color: var(--color-light-neutral-translucent-300);
-} .bottom-sheet__content_tmbtb {
+} .bottom-sheet__content_exdrv {
     position: relative;
     z-index: 0;
     display: flex;
@@ -111,73 +111,75 @@
     color: var(--color-light-text-primary);
     background-color: inherit;
     border-radius: inherit;
-} .bottom-sheet__noHeader_tmbtb {
+} .bottom-sheet__noHeader_exdrv {
     padding-top: var(--gap-m);
-} .bottom-sheet__noFooter_tmbtb {
+} .bottom-sheet__noFooter_exdrv {
     padding-bottom: var(--gap-m);
-} .bottom-sheet__scrollLocked_tmbtb {
+} .bottom-sheet__scrollLocked_exdrv {
     overflow: hidden;
-} .bottom-sheet__hiddenScrollbar_tmbtb {
+} .bottom-sheet__hiddenScrollbar_exdrv {
     scrollbar-width: none
-} .bottom-sheet__hiddenScrollbar_tmbtb::-webkit-scrollbar {
+} .bottom-sheet__hiddenScrollbar_exdrv::-webkit-scrollbar {
         width: 0;
         height: 0;
-    } .bottom-sheet__disabledPointerEvents_tmbtb {
+    } .bottom-sheet__disabledPointerEvents_exdrv {
     pointer-events: none;
-} .bottom-sheet__appear_tmbtb .bottom-sheet__wrapper_tmbtb, .bottom-sheet__enter_tmbtb .bottom-sheet__wrapper_tmbtb {
+} .bottom-sheet__appear_exdrv .bottom-sheet__wrapper_exdrv, .bottom-sheet__enter_exdrv .bottom-sheet__wrapper_exdrv {
         transition: none;
-    } .bottom-sheet__appearActive_tmbtb .bottom-sheet__wrapper_tmbtb, .bottom-sheet__enterActive_tmbtb .bottom-sheet__wrapper_tmbtb {
+    } .bottom-sheet__appearActive_exdrv .bottom-sheet__wrapper_exdrv, .bottom-sheet__enterActive_exdrv .bottom-sheet__wrapper_exdrv {
         transition: var(--bottom-sheet-in-transition);
         transform: translateY(0);
-    } .bottom-sheet__enterDone_tmbtb .bottom-sheet__wrapper_tmbtb, .bottom-sheet__appearDone_tmbtb .bottom-sheet__wrapper_tmbtb {
+    } .bottom-sheet__enterDone_exdrv .bottom-sheet__wrapper_exdrv, .bottom-sheet__appearDone_exdrv .bottom-sheet__wrapper_exdrv {
         transform: translateY(0);
-    } .bottom-sheet__exit_tmbtb .bottom-sheet__wrapper_tmbtb {
+    } .bottom-sheet__exit_exdrv .bottom-sheet__wrapper_exdrv {
         transform: translateY(0);
-    } .bottom-sheet__exitActive_tmbtb .bottom-sheet__wrapper_tmbtb {
+    } .bottom-sheet__exitActive_exdrv .bottom-sheet__wrapper_exdrv {
         transition: var(--bottom-sheet-out-transition);
         transform: translateY(100%);
-    } .bottom-sheet__background-accent_tmbtb {
+    } .bottom-sheet__safeAreaBottom_exdrv {
+    padding-bottom: env(safe-area-inset-bottom);
+} .bottom-sheet__background-accent_exdrv {
             background-color: var(--color-light-bg-accent);
-        } .bottom-sheet__background-info_tmbtb {
+        } .bottom-sheet__background-info_exdrv {
             background-color: var(--color-light-bg-info);
-        } .bottom-sheet__background-attention-muted_tmbtb {
+        } .bottom-sheet__background-attention-muted_exdrv {
             background-color: var(--color-light-bg-attention-muted);
-        } .bottom-sheet__background-positive-muted_tmbtb {
+        } .bottom-sheet__background-positive-muted_exdrv {
             background-color: var(--color-light-bg-positive-muted);
-        } .bottom-sheet__background-negative-muted_tmbtb {
+        } .bottom-sheet__background-negative-muted_exdrv {
             background-color: var(--color-light-bg-negative-muted);
-        } .bottom-sheet__background-primary_tmbtb {
+        } .bottom-sheet__background-primary_exdrv {
             background-color: var(--color-light-bg-primary);
-        } .bottom-sheet__background-primary-inverted_tmbtb {
+        } .bottom-sheet__background-primary-inverted_exdrv {
             background-color: var(--color-light-bg-primary-inverted);
-        } .bottom-sheet__background-secondary_tmbtb {
+        } .bottom-sheet__background-secondary_exdrv {
             background-color: var(--color-light-bg-secondary);
-        } .bottom-sheet__background-secondary-inverted_tmbtb {
+        } .bottom-sheet__background-secondary-inverted_exdrv {
             background-color: var(--color-light-bg-secondary-inverted);
-        } .bottom-sheet__background-tertiary_tmbtb {
+        } .bottom-sheet__background-tertiary_exdrv {
             background-color: var(--color-light-bg-tertiary);
-        } .bottom-sheet__background-tertiary-inverted_tmbtb {
+        } .bottom-sheet__background-tertiary-inverted_exdrv {
             background-color: var(--color-light-bg-tertiary-inverted);
-        } .bottom-sheet__background-quaternary_tmbtb {
+        } .bottom-sheet__background-quaternary_exdrv {
             background-color: var(--color-light-bg-quaternary);
-        } .bottom-sheet__background-quaternary-inverted_tmbtb {
+        } .bottom-sheet__background-quaternary-inverted_exdrv {
             background-color: var(--color-light-bg-quaternary-inverted);
-        } .bottom-sheet__background-specialbg-component_tmbtb {
+        } .bottom-sheet__background-specialbg-component_exdrv {
             background-color: var(--color-light-specialbg-component);
-        } .bottom-sheet__background-specialbg-component-inverted_tmbtb {
+        } .bottom-sheet__background-specialbg-component-inverted_exdrv {
             background-color: var(--color-light-specialbg-component-inverted);
-        } .bottom-sheet__background-specialbg-primary-grouped_tmbtb {
+        } .bottom-sheet__background-specialbg-primary-grouped_exdrv {
             background-color: var(--color-light-specialbg-primary-grouped);
-        } .bottom-sheet__background-specialbg-secondary-grouped_tmbtb {
+        } .bottom-sheet__background-specialbg-secondary-grouped_exdrv {
             background-color: var(--color-light-specialbg-secondary-grouped);
-        } .bottom-sheet__background-specialbg-tertiary-grouped_tmbtb {
+        } .bottom-sheet__background-specialbg-tertiary-grouped_exdrv {
             background-color: var(--color-light-specialbg-tertiary-grouped);
-        } .bottom-sheet__background-specialbg-secondary-transparent_tmbtb {
+        } .bottom-sheet__background-specialbg-secondary-transparent_exdrv {
             background-color: var(--color-light-specialbg-secondary-transparent);
-        } .bottom-sheet__background-specialbg-secondary-transparent-inverted_tmbtb {
+        } .bottom-sheet__background-specialbg-secondary-transparent-inverted_exdrv {
             background-color: var(--color-light-specialbg-secondary-transparent-inverted);
-        } .bottom-sheet__background-specialbg-tertiary-transparent_tmbtb {
+        } .bottom-sheet__background-specialbg-tertiary-transparent_exdrv {
             background-color: var(--color-light-specialbg-tertiary-transparent);
-        } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_tmbtb {
+        } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_exdrv {
             background-color: var(--color-light-specialbg-tertiary-transparent-inverted);
         }

package/bottom-sheet/modern/component.js

@@ -4,15 +4,17 @@ import mergeRefs from 'react-merge-refs';
 import { useSwipeable } from 'react-swipeable';
 import cn from 'classnames';
 import { BaseModal } from '../../base-modal/modern';
-import { getDataTestId, fnUtils } from '../../shared/modern';
+import { os, getDataTestId, fnUtils } from '../../shared/modern';
 import { Footer } from './components/footer/Component.js';
 import { Header } from './components/header/Component.js';
 import { SwipeableBackdrop } from './components/swipeable-backdrop/Component.js';
+import { horizontalDirections } from './consts/swipeConsts.js';
 import { convertPercentToNumber, TIMEOUT, MARKER_HEIGHT, SCROLL_OFFSET, SWIPE_VELOCITY, CLOSE_OFFSET } from './utils.js';
-import '../../navigation-bar/modern';
+import '../../navigation-bar-private/modern';
 import '../../backdrop/modern';
+import './enums/swipeEnums.js';
 
-const 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","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"};
+const styles = {"modal":"bottom-sheet__modal_exdrv","wrapper":"bottom-sheet__wrapper_exdrv","fullscreen":"bottom-sheet__fullscreen_exdrv","component":"bottom-sheet__component_exdrv","withTransition":"bottom-sheet__withTransition_exdrv","scrollableContainer":"bottom-sheet__scrollableContainer_exdrv","marker":"bottom-sheet__marker_exdrv","defaultMarker":"bottom-sheet__defaultMarker_exdrv","content":"bottom-sheet__content_exdrv","noHeader":"bottom-sheet__noHeader_exdrv","noFooter":"bottom-sheet__noFooter_exdrv","scrollLocked":"bottom-sheet__scrollLocked_exdrv","hiddenScrollbar":"bottom-sheet__hiddenScrollbar_exdrv","disabledPointerEvents":"bottom-sheet__disabledPointerEvents_exdrv","appear":"bottom-sheet__appear_exdrv","enter":"bottom-sheet__enter_exdrv","appearActive":"bottom-sheet__appearActive_exdrv","enterActive":"bottom-sheet__enterActive_exdrv","enterDone":"bottom-sheet__enterDone_exdrv","appearDone":"bottom-sheet__appearDone_exdrv","exit":"bottom-sheet__exit_exdrv","exitActive":"bottom-sheet__exitActive_exdrv","safeAreaBottom":"bottom-sheet__safeAreaBottom_exdrv","background-accent":"bottom-sheet__background-accent_exdrv","background-info":"bottom-sheet__background-info_exdrv","background-attention-muted":"bottom-sheet__background-attention-muted_exdrv","background-positive-muted":"bottom-sheet__background-positive-muted_exdrv","background-negative-muted":"bottom-sheet__background-negative-muted_exdrv","background-primary":"bottom-sheet__background-primary_exdrv","background-primary-inverted":"bottom-sheet__background-primary-inverted_exdrv","background-secondary":"bottom-sheet__background-secondary_exdrv","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_exdrv","background-tertiary":"bottom-sheet__background-tertiary_exdrv","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_exdrv","background-quaternary":"bottom-sheet__background-quaternary_exdrv","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_exdrv","background-specialbg-component":"bottom-sheet__background-specialbg-component_exdrv","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_exdrv","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_exdrv","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_exdrv","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_exdrv","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_exdrv","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_exdrv","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_exdrv","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_exdrv"};
 require('./index.css');
 
 const { isNil } = fnUtils;
@@ -24,7 +26,9 @@ const BottomSheet = forwardRef(({ open, title, container, usePortal, backgroundC
         if (magneticAreasProp) {
             return magneticAreasProp.map((area) => convertPercentToNumber(area, fullHeight, headerOffset));
         }
-        return [0, fullHeight - headerOffset];
+        const iOSViewHeight = document?.documentElement?.clientHeight || window.innerHeight;
+        const viewHeight = os.isIOS() ? iOSViewHeight : fullHeight;
+        return [0, viewHeight - headerOffset];
     }, [fullHeight, headerOffset, magneticAreasProp]);
     const lastMagneticArea = magneticAreas[magneticAreas.length - 1];
     const [sheetOffset, setSheetOffset] = useState(0);
@@ -197,7 +201,8 @@ const BottomSheet = forwardRef(({ open, title, container, usePortal, backgroundC
      * Если контент внутри шторки скроллится - то шторка не должна свайпаться
      * Если шапка внутри шторки зафиксирована - то шторка должна свайпаться только в области шапки
      */
-    const shouldSkipSwiping = (deltaY, startY, event) => {
+    const shouldSkipSwiping = (swipeParams) => {
+        const { deltaY, startY, event, dir } = swipeParams;
         if (scrollLockedProp || swipingInProgress)
             return false;
         if (!swipeableContent && contentRef.current?.contains(event.target)) {
@@ -222,23 +227,34 @@ const BottomSheet = forwardRef(({ open, title, container, usePortal, backgroundC
         if (!scrollOccurred.current && shouldScroll) {
             scrollOccurred.current = true;
         }
+        // Если контент внутри шторки скроллится горизонально - то шторка не должна закрываться
+        if (horizontalDirections.includes(dir)) {
+            return true;
+        }
         return shouldScroll;
     };
-    const handleSheetSwipe = ({ initial, velocity, deltaY, event }) => {
-        if (scrollOccurred.current || shouldSkipSwiping(deltaY, initial[1], event)) {
+    const handleSheetSwipeEnd = (swipeParams) => {
+        const { initial, velocity, deltaY, event, dir } = swipeParams;
+        const shouldPreventSwipe = scrollOccurred.current ||
+            shouldSkipSwiping({ deltaY, startY: initial[1], event, dir });
+        if (shouldPreventSwipe) {
             return;
         }
         magnetize(velocity, deltaY);
     };
-    const handleSheetSwipeStart = ({ deltaY, initial, event }) => {
-        if (shouldSkipSwiping(deltaY, initial[1], event)) {
+    const handleSheetSwipeStart = (swipeParams) => {
+        const { deltaY, initial, event, dir } = swipeParams;
+        if (shouldSkipSwiping({ deltaY, startY: initial[1], event, dir })) {
             return;
         }
         startSwiping(event);
     };
     const handleTouchEnd = ({ event }) => stopSwiping(event);
-    const handleSheetSwiping = ({ initial, deltaY, event }) => {
-        if (scrollOccurred.current || shouldSkipSwiping(deltaY, initial[1], event)) {
+    const handleSheetSwipeMove = (swipeParams) => {
+        const { initial, deltaY, event, dir } = swipeParams;
+        const shouldPreventSwipe = scrollOccurred.current ||
+            shouldSkipSwiping({ deltaY, startY: initial[1], event, dir });
+        if (shouldPreventSwipe) {
             return;
         }
         if (!swipingInProgress) {
@@ -251,8 +267,8 @@ const BottomSheet = forwardRef(({ open, title, container, usePortal, backgroundC
     };
     const sheetSwipeableHandlers = useSwipeable({
         onSwipeStart: handleSheetSwipeStart,
-        onSwiping: handleSheetSwiping,
-        onSwiped: handleSheetSwipe,
+        onSwiping: handleSheetSwipeMove,
+        onSwiped: handleSheetSwipeEnd,
         onTouchEndOrOnMouseUp: handleTouchEnd,
         trackMouse: swipeable,
         trackTouch: swipeable,
@@ -350,11 +366,12 @@ const BottomSheet = forwardRef(({ open, title, container, usePortal, backgroundC
             onEnter: handleEnter,
             onExit: handleExit,
         }, disableAutoFocus: disableAutoFocus, disableEscapeKeyDown: disableEscapeKeyDown, disableRestoreFocus: disableRestoreFocus, keepMounted: keepMounted },
-        React.createElement("div", { style: { ...getHeightStyles() }, className: cn(styles.wrapper, {
+        React.createElement("div", { className: cn(styles.wrapper, {
                 [styles.fullscreen]: headerOffset === 0 && sheetOffset === 0,
             }), onTransitionEnd: setSheetHeight },
             React.createElement("div", { className: cn(styles.component, bgClassName, className, {
                     [styles.withTransition]: swipingInProgress === false,
+                    [styles.safeAreaBottom]: os.isIOS(),
                 }), style: {
                     ...getSwipeStyles(),
                     ...getHeightStyles(),

package/bottom-sheet/modern/components/footer/Component.js

@@ -2,7 +2,7 @@ import React, { useContext, useEffect } from 'react';
 import cn from 'classnames';
 import { BaseModalContext } from '../../../../base-modal/modern';
 
-const 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"};
+const styles = {"footer":"bottom-sheet__footer_i9nlp","sticky":"bottom-sheet__sticky_i9nlp","highlighted":"bottom-sheet__highlighted_i9nlp","background-accent":"bottom-sheet__background-accent_i9nlp","background-info":"bottom-sheet__background-info_i9nlp","background-attention-muted":"bottom-sheet__background-attention-muted_i9nlp","background-positive-muted":"bottom-sheet__background-positive-muted_i9nlp","background-negative-muted":"bottom-sheet__background-negative-muted_i9nlp","background-primary":"bottom-sheet__background-primary_i9nlp","background-primary-inverted":"bottom-sheet__background-primary-inverted_i9nlp","background-secondary":"bottom-sheet__background-secondary_i9nlp","background-secondary-inverted":"bottom-sheet__background-secondary-inverted_i9nlp","background-tertiary":"bottom-sheet__background-tertiary_i9nlp","background-tertiary-inverted":"bottom-sheet__background-tertiary-inverted_i9nlp","background-quaternary":"bottom-sheet__background-quaternary_i9nlp","background-quaternary-inverted":"bottom-sheet__background-quaternary-inverted_i9nlp","background-specialbg-component":"bottom-sheet__background-specialbg-component_i9nlp","background-specialbg-component-inverted":"bottom-sheet__background-specialbg-component-inverted_i9nlp","background-specialbg-primary-grouped":"bottom-sheet__background-specialbg-primary-grouped_i9nlp","background-specialbg-secondary-grouped":"bottom-sheet__background-specialbg-secondary-grouped_i9nlp","background-specialbg-tertiary-grouped":"bottom-sheet__background-specialbg-tertiary-grouped_i9nlp","background-specialbg-secondary-transparent":"bottom-sheet__background-specialbg-secondary-transparent_i9nlp","background-specialbg-secondary-transparent-inverted":"bottom-sheet__background-specialbg-secondary-transparent-inverted_i9nlp","background-specialbg-tertiary-transparent":"bottom-sheet__background-specialbg-tertiary-transparent_i9nlp","background-specialbg-tertiary-transparent-inverted":"bottom-sheet__background-specialbg-tertiary-transparent-inverted_i9nlp"};
 require('./index.css');
 
 const Footer = ({ children, className, sticky, dataTestId }) => {