@alfalab/core-components-bottom-sheet 6.2.3 → 6.2.4

package/modern/components/footer/index.css

@@ -1,4 +1,4 @@
-/* hash: ld5gf */
+/* hash: 1wk86 */
 :root {
 } /* deprecated */ :root {
     --color-light-bg-accent: #ef3124;
@@ -41,58 +41,58 @@
 } :root {
     --bottom-sheet-footer-border-top: 1px solid var(--color-light-border-secondary);
     --bottom-sheet-footer-background-color: var(--color-light-bg-primary);
-} .bottom-sheet__footer_38if0 {
+} .bottom-sheet__footer_ykuo8 {
     padding: var(--gap-m) var(--gap-m);
     background-color: var(--color-light-bg-primary);
-} .bottom-sheet__sticky_38if0 {
+} .bottom-sheet__sticky_ykuo8 {
     position: sticky;
     bottom: 0;
     z-index: 1;
-} .bottom-sheet__highlighted_38if0 {
+} .bottom-sheet__highlighted_ykuo8 {
     border-top: var(--bottom-sheet-footer-border-top);
     background-color: var(--bottom-sheet-footer-background-color);
-} .bottom-sheet__background-accent_38if0 {
+} .bottom-sheet__background-accent_ykuo8 {
             background-color: var(--color-light-bg-accent);
-        } .bottom-sheet__background-info_38if0 {
+        } .bottom-sheet__background-info_ykuo8 {
             background-color: var(--color-light-bg-info);
-        } .bottom-sheet__background-attention-muted_38if0 {
+        } .bottom-sheet__background-attention-muted_ykuo8 {
             background-color: var(--color-light-bg-attention-muted);
-        } .bottom-sheet__background-positive-muted_38if0 {
+        } .bottom-sheet__background-positive-muted_ykuo8 {
             background-color: var(--color-light-bg-positive-muted);
-        } .bottom-sheet__background-negative-muted_38if0 {
+        } .bottom-sheet__background-negative-muted_ykuo8 {
             background-color: var(--color-light-bg-negative-muted);
-        } .bottom-sheet__background-primary_38if0 {
+        } .bottom-sheet__background-primary_ykuo8 {
             background-color: var(--color-light-bg-primary);
-        } .bottom-sheet__background-primary-inverted_38if0 {
+        } .bottom-sheet__background-primary-inverted_ykuo8 {
             background-color: var(--color-light-bg-primary-inverted);
-        } .bottom-sheet__background-secondary_38if0 {
+        } .bottom-sheet__background-secondary_ykuo8 {
             background-color: var(--color-light-bg-secondary);
-        } .bottom-sheet__background-secondary-inverted_38if0 {
+        } .bottom-sheet__background-secondary-inverted_ykuo8 {
             background-color: var(--color-light-bg-secondary-inverted);
-        } .bottom-sheet__background-tertiary_38if0 {
+        } .bottom-sheet__background-tertiary_ykuo8 {
             background-color: var(--color-light-bg-tertiary);
-        } .bottom-sheet__background-tertiary-inverted_38if0 {
+        } .bottom-sheet__background-tertiary-inverted_ykuo8 {
             background-color: var(--color-light-bg-tertiary-inverted);
-        } .bottom-sheet__background-quaternary_38if0 {
+        } .bottom-sheet__background-quaternary_ykuo8 {
             background-color: var(--color-light-bg-quaternary);
-        } .bottom-sheet__background-quaternary-inverted_38if0 {
+        } .bottom-sheet__background-quaternary-inverted_ykuo8 {
             background-color: var(--color-light-bg-quaternary-inverted);
-        } .bottom-sheet__background-specialbg-component_38if0 {
+        } .bottom-sheet__background-specialbg-component_ykuo8 {
             background-color: var(--color-light-specialbg-component);
-        } .bottom-sheet__background-specialbg-component-inverted_38if0 {
+        } .bottom-sheet__background-specialbg-component-inverted_ykuo8 {
             background-color: var(--color-light-specialbg-component-inverted);
-        } .bottom-sheet__background-specialbg-primary-grouped_38if0 {
+        } .bottom-sheet__background-specialbg-primary-grouped_ykuo8 {
             background-color: var(--color-light-specialbg-primary-grouped);
-        } .bottom-sheet__background-specialbg-secondary-grouped_38if0 {
+        } .bottom-sheet__background-specialbg-secondary-grouped_ykuo8 {
             background-color: var(--color-light-specialbg-secondary-grouped);
-        } .bottom-sheet__background-specialbg-tertiary-grouped_38if0 {
+        } .bottom-sheet__background-specialbg-tertiary-grouped_ykuo8 {
             background-color: var(--color-light-specialbg-tertiary-grouped);
-        } .bottom-sheet__background-specialbg-secondary-transparent_38if0 {
+        } .bottom-sheet__background-specialbg-secondary-transparent_ykuo8 {
             background-color: var(--color-light-specialbg-secondary-transparent);
-        } .bottom-sheet__background-specialbg-secondary-transparent-inverted_38if0 {
+        } .bottom-sheet__background-specialbg-secondary-transparent-inverted_ykuo8 {
             background-color: var(--color-light-specialbg-secondary-transparent-inverted);
-        } .bottom-sheet__background-specialbg-tertiary-transparent_38if0 {
+        } .bottom-sheet__background-specialbg-tertiary-transparent_ykuo8 {
             background-color: var(--color-light-specialbg-tertiary-transparent);
-        } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_38if0 {
+        } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_ykuo8 {
             background-color: var(--color-light-specialbg-tertiary-transparent-inverted);
         }

package/modern/components/header/Component.js

@@ -4,7 +4,7 @@ import { BaseModalContext } from '@alfalab/core-components-base-modal/modern';
 import { NavigationBar } from '@alfalab/core-components-navigation-bar/modern';
 import { HEADER_OFFSET } from '../../utils.js';
 
-const styles = {"headerWrapper":"bottom-sheet__headerWrapper_ivezv","hasContent":"bottom-sheet__hasContent_ivezv","header":"bottom-sheet__header_ivezv","sticky":"bottom-sheet__sticky_ivezv","highlighted":"bottom-sheet__highlighted_ivezv","justifyEnd":"bottom-sheet__justifyEnd_ivezv","addon":"bottom-sheet__addon_ivezv","addonFixed":"bottom-sheet__addonFixed_ivezv","title":"bottom-sheet__title_ivezv","titleCenter":"bottom-sheet__titleCenter_ivezv","titleLeft":"bottom-sheet__titleLeft_ivezv","trimTitle":"bottom-sheet__trimTitle_ivezv"};
+const styles = {"headerWrapper":"bottom-sheet__headerWrapper_1r713","hasContent":"bottom-sheet__hasContent_1r713","header":"bottom-sheet__header_1r713","sticky":"bottom-sheet__sticky_1r713","highlighted":"bottom-sheet__highlighted_1r713","justifyEnd":"bottom-sheet__justifyEnd_1r713","addon":"bottom-sheet__addon_1r713","addonFixed":"bottom-sheet__addonFixed_1r713","title":"bottom-sheet__title_1r713","titleCenter":"bottom-sheet__titleCenter_1r713","titleLeft":"bottom-sheet__titleLeft_1r713","trimTitle":"bottom-sheet__trimTitle_1r713"};
 require('./index.css')
 
 const Header = ({ className, sticky, headerRef, title, children, ...restProps }) => {

package/modern/components/header/index.css

@@ -1,4 +1,4 @@
-/* hash: p8448 */
+/* hash: gqfc1 */
 :root {
 } /* deprecated */ :root {
     --color-light-border-secondary: #e9e9eb; /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */ /* deprecated */
@@ -27,42 +27,42 @@
     --bottom-sheet-title-font-weight: 700;
     --bottom-sheet-title-line-height: 24px;
     --bottom-sheet-title-font-family: var(--font-family-system);
-} .bottom-sheet__headerWrapper_ivezv {
+} .bottom-sheet__headerWrapper_1r713 {
     padding: var(--gap-s) var(--gap-xs) var(--gap-2xs);
     border-top-right-radius: var(--border-radius-xl);
     border-top-left-radius: var(--border-radius-xl);
     z-index: 1;
-} .bottom-sheet__hasContent_ivezv {
+} .bottom-sheet__hasContent_1r713 {
     background-color: inherit;
-} .bottom-sheet__header_ivezv {
+} .bottom-sheet__header_1r713 {
     display: flex;
-} .bottom-sheet__sticky_ivezv {
+} .bottom-sheet__sticky_1r713 {
     position: sticky;
     top: 0;
-} .bottom-sheet__highlighted_ivezv {
+} .bottom-sheet__highlighted_1r713 {
     border-bottom: var(--bottom-sheet-header-border-bottom);
-} .bottom-sheet__justifyEnd_ivezv {
+} .bottom-sheet__justifyEnd_1r713 {
     justify-content: flex-end;
-} .bottom-sheet__addon_ivezv {
+} .bottom-sheet__addon_1r713 {
     display: flex;
     justify-content: center;
     align-items: center;
     min-width: 48px;
     height: 48px;
-} .bottom-sheet__addonFixed_ivezv {
+} .bottom-sheet__addonFixed_1r713 {
     position: fixed;
-} .bottom-sheet__title_ivezv {
+} .bottom-sheet__title_1r713 {
     padding: var(--gap-s) var(--gap-xs);
     width: 100%;
     font-size: var(--bottom-sheet-title-font-size);
     font-weight: var(--bottom-sheet-title-font-weight);
     line-height: var(--bottom-sheet-title-line-height);
     font-family: var(--bottom-sheet-title-font-family);
-} .bottom-sheet__titleCenter_ivezv {
+} .bottom-sheet__titleCenter_1r713 {
     text-align: center;
-} .bottom-sheet__titleLeft_ivezv {
+} .bottom-sheet__titleLeft_1r713 {
     text-align: left;
-} .bottom-sheet__trimTitle_ivezv {
+} .bottom-sheet__trimTitle_1r713 {
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;

package/modern/index.css

@@ -1,4 +1,4 @@
-/* hash: 1eypf */
+/* hash: 101y0 */
 :root {
 } /* deprecated */ :root {
     --color-light-bg-accent: #ef3124;
@@ -45,20 +45,20 @@
 } :root {
     --bottom-sheet-in-transition: transform 0.5s cubic-bezier(0.09, 0.91, 0.18, 0.99);
     --bottom-sheet-out-transition: transform 0.3s ease;
-} .bottom-sheet__modal_etbp0 {
+} .bottom-sheet__modal_1gfwj {
     background-color: transparent;
     position: fixed;
     bottom: 0;
     width: 100%;
     max-width: 600px;
     pointer-events: none;
-} .bottom-sheet__wrapper_etbp0 {
+} .bottom-sheet__wrapper_1gfwj {
     transform: translateY(100%);
     overflow: hidden;
     pointer-events: none;
     border-top-right-radius: var(--border-radius-xl);
     border-top-left-radius: var(--border-radius-xl);
-} .bottom-sheet__component_etbp0 {
+} .bottom-sheet__component_1gfwj {
     overflow: hidden;
     position: relative;
     display: flex;
@@ -66,16 +66,16 @@
     border-radius: inherit;
     background-color: var(--color-light-bg-primary);
     pointer-events: all;
-} .bottom-sheet__withTransition_etbp0 {
+} .bottom-sheet__withTransition_1gfwj {
     transition: var(--bottom-sheet-out-transition);
-} .bottom-sheet__scrollableContainer_etbp0 {
+} .bottom-sheet__scrollableContainer_1gfwj {
     overflow: auto;
     display: flex;
     flex-direction: column;
     position: relative;
     height: 100%;
     background-color: inherit;
-} .bottom-sheet__marker_etbp0 {
+} .bottom-sheet__marker_1gfwj {
     position: fixed;
     top: var(--gap-2xs);
     left: 50%;
@@ -85,7 +85,7 @@
     transform: translateX(-50%);
     background-color: var(--color-light-graphic-quaternary);
     z-index: 1000;
-} .bottom-sheet__content_etbp0 {
+} .bottom-sheet__content_1gfwj {
     position: relative;
     z-index: 0;
     display: flex;
@@ -94,73 +94,73 @@
     padding: 0 var(--gap-m);
     color: var(--color-light-text-primary);
     background-color: inherit;
-} .bottom-sheet__noHeader_etbp0 {
+} .bottom-sheet__noHeader_1gfwj {
     padding-top: var(--gap-m);
-} .bottom-sheet__noFooter_etbp0 {
+} .bottom-sheet__noFooter_1gfwj {
     padding-bottom: var(--gap-m);
-} .bottom-sheet__scrollLocked_etbp0 {
+} .bottom-sheet__scrollLocked_1gfwj {
     overflow: hidden;
-} .bottom-sheet__hiddenScrollbar_etbp0 {
+} .bottom-sheet__hiddenScrollbar_1gfwj {
     scrollbar-width: none
-} .bottom-sheet__hiddenScrollbar_etbp0::-webkit-scrollbar {
+} .bottom-sheet__hiddenScrollbar_1gfwj::-webkit-scrollbar {
         width: 0;
         height: 0;
-    } .bottom-sheet__disabledPointerEvents_etbp0 {
+    } .bottom-sheet__disabledPointerEvents_1gfwj {
     pointer-events: none;
-} .bottom-sheet__appear_etbp0 .bottom-sheet__wrapper_etbp0, .bottom-sheet__enter_etbp0 .bottom-sheet__wrapper_etbp0 {
+} .bottom-sheet__appear_1gfwj .bottom-sheet__wrapper_1gfwj, .bottom-sheet__enter_1gfwj .bottom-sheet__wrapper_1gfwj {
         transition: none;
-    } .bottom-sheet__appearActive_etbp0 .bottom-sheet__wrapper_etbp0, .bottom-sheet__enterActive_etbp0 .bottom-sheet__wrapper_etbp0 {
+    } .bottom-sheet__appearActive_1gfwj .bottom-sheet__wrapper_1gfwj, .bottom-sheet__enterActive_1gfwj .bottom-sheet__wrapper_1gfwj {
         transition: var(--bottom-sheet-in-transition);
         transform: translateY(0);
-    } .bottom-sheet__enterDone_etbp0 .bottom-sheet__wrapper_etbp0, .bottom-sheet__appearDone_etbp0 .bottom-sheet__wrapper_etbp0 {
+    } .bottom-sheet__enterDone_1gfwj .bottom-sheet__wrapper_1gfwj, .bottom-sheet__appearDone_1gfwj .bottom-sheet__wrapper_1gfwj {
         transform: translateY(0);
-    } .bottom-sheet__exit_etbp0 .bottom-sheet__wrapper_etbp0 {
+    } .bottom-sheet__exit_1gfwj .bottom-sheet__wrapper_1gfwj {
         transform: translateY(0);
-    } .bottom-sheet__exitActive_etbp0 .bottom-sheet__wrapper_etbp0 {
+    } .bottom-sheet__exitActive_1gfwj .bottom-sheet__wrapper_1gfwj {
         transition: var(--bottom-sheet-out-transition);
         transform: translateY(100%);
-    } .bottom-sheet__background-accent_etbp0 {
+    } .bottom-sheet__background-accent_1gfwj {
             background-color: var(--color-light-bg-accent);
-        } .bottom-sheet__background-info_etbp0 {
+        } .bottom-sheet__background-info_1gfwj {
             background-color: var(--color-light-bg-info);
-        } .bottom-sheet__background-attention-muted_etbp0 {
+        } .bottom-sheet__background-attention-muted_1gfwj {
             background-color: var(--color-light-bg-attention-muted);
-        } .bottom-sheet__background-positive-muted_etbp0 {
+        } .bottom-sheet__background-positive-muted_1gfwj {
             background-color: var(--color-light-bg-positive-muted);
-        } .bottom-sheet__background-negative-muted_etbp0 {
+        } .bottom-sheet__background-negative-muted_1gfwj {
             background-color: var(--color-light-bg-negative-muted);
-        } .bottom-sheet__background-primary_etbp0 {
+        } .bottom-sheet__background-primary_1gfwj {
             background-color: var(--color-light-bg-primary);
-        } .bottom-sheet__background-primary-inverted_etbp0 {
+        } .bottom-sheet__background-primary-inverted_1gfwj {
             background-color: var(--color-light-bg-primary-inverted);
-        } .bottom-sheet__background-secondary_etbp0 {
+        } .bottom-sheet__background-secondary_1gfwj {
             background-color: var(--color-light-bg-secondary);
-        } .bottom-sheet__background-secondary-inverted_etbp0 {
+        } .bottom-sheet__background-secondary-inverted_1gfwj {
             background-color: var(--color-light-bg-secondary-inverted);
-        } .bottom-sheet__background-tertiary_etbp0 {
+        } .bottom-sheet__background-tertiary_1gfwj {
             background-color: var(--color-light-bg-tertiary);
-        } .bottom-sheet__background-tertiary-inverted_etbp0 {
+        } .bottom-sheet__background-tertiary-inverted_1gfwj {
             background-color: var(--color-light-bg-tertiary-inverted);
-        } .bottom-sheet__background-quaternary_etbp0 {
+        } .bottom-sheet__background-quaternary_1gfwj {
             background-color: var(--color-light-bg-quaternary);
-        } .bottom-sheet__background-quaternary-inverted_etbp0 {
+        } .bottom-sheet__background-quaternary-inverted_1gfwj {
             background-color: var(--color-light-bg-quaternary-inverted);
-        } .bottom-sheet__background-specialbg-component_etbp0 {
+        } .bottom-sheet__background-specialbg-component_1gfwj {
             background-color: var(--color-light-specialbg-component);
-        } .bottom-sheet__background-specialbg-component-inverted_etbp0 {
+        } .bottom-sheet__background-specialbg-component-inverted_1gfwj {
             background-color: var(--color-light-specialbg-component-inverted);
-        } .bottom-sheet__background-specialbg-primary-grouped_etbp0 {
+        } .bottom-sheet__background-specialbg-primary-grouped_1gfwj {
             background-color: var(--color-light-specialbg-primary-grouped);
-        } .bottom-sheet__background-specialbg-secondary-grouped_etbp0 {
+        } .bottom-sheet__background-specialbg-secondary-grouped_1gfwj {
             background-color: var(--color-light-specialbg-secondary-grouped);
-        } .bottom-sheet__background-specialbg-tertiary-grouped_etbp0 {
+        } .bottom-sheet__background-specialbg-tertiary-grouped_1gfwj {
             background-color: var(--color-light-specialbg-tertiary-grouped);
-        } .bottom-sheet__background-specialbg-secondary-transparent_etbp0 {
+        } .bottom-sheet__background-specialbg-secondary-transparent_1gfwj {
             background-color: var(--color-light-specialbg-secondary-transparent);
-        } .bottom-sheet__background-specialbg-secondary-transparent-inverted_etbp0 {
+        } .bottom-sheet__background-specialbg-secondary-transparent-inverted_1gfwj {
             background-color: var(--color-light-specialbg-secondary-transparent-inverted);
-        } .bottom-sheet__background-specialbg-tertiary-transparent_etbp0 {
+        } .bottom-sheet__background-specialbg-tertiary-transparent_1gfwj {
             background-color: var(--color-light-specialbg-tertiary-transparent);
-        } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_etbp0 {
+        } .bottom-sheet__background-specialbg-tertiary-transparent-inverted_1gfwj {
             background-color: var(--color-light-specialbg-tertiary-transparent-inverted);
         }

package/modern/types.d.ts

@@ -36,6 +36,10 @@ type BottomSheetProps = {
      * Контейнер к которому будут добавляться порталы
      */
     container?: BaseModalProps['container'];
+    /**
+     * Рендерить ли в контейнер через портал.
+     */
+    usePortal?: BaseModalProps['usePortal'];
     /**
      * Дополнительный класс
      */

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@alfalab/core-components-bottom-sheet",
-    "version": "6.2.3",
+    "version": "6.2.4",
     "description": "Bottom sheet mobile component",
     "keywords": [],
     "license": "MIT",
@@ -20,9 +20,7 @@
     "dependencies": {
         "@alfalab/core-components-backdrop": "^3.0.6",
         "@alfalab/core-components-base-modal": "^5.1.3",
-        "@alfalab/core-components-icon-button": "^6.0.10",
-        "@alfalab/core-components-typography": "^3.2.1",
-        "@alfalab/core-components-navigation-bar": "^0.3.1",
+        "@alfalab/core-components-navigation-bar": "^0.3.2",
         "classnames": "^2.3.1",
         "react-div-100vh": "^0.7.0",
         "react-merge-refs": "^1.1.0",

package/types.d.ts

@@ -36,6 +36,10 @@ type BottomSheetProps = {
      * Контейнер к которому будут добавляться порталы
      */
     container?: BaseModalProps['container'];
+    /**
+     * Рендерить ли в контейнер через портал.
+     */
+    usePortal?: BaseModalProps['usePortal'];
     /**
      * Дополнительный класс
      */