@jobber/components-native 0.98.5 → 0.99.0

package/dist/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@jobber/components-native",
-    "version": "0.98.5",
+    "version": "0.99.0",
     "license": "MIT",
     "description": "React Native implementation of Atlantis",
     "repository": {
@@ -96,5 +96,5 @@
         "react-native-safe-area-context": "^5.4.0",
         "react-native-svg": ">=12.0.0"
     },
-    "gitHead": "60dbce9880c63f02f43d8b3f1f5ef9090dba32e3"
+    "gitHead": "c92c33f8e0a06cbc2addce9eca3005c1231a9202"
 }

package/dist/src/AtlantisOverlayProvider/AtlantisOverlayProvider.js

@@ -0,0 +1,5 @@
+import React from "react";
+import { BottomSheetModalProvider } from "@gorhom/bottom-sheet";
+export function AtlantisOverlayProvider({ children, }) {
+    return React.createElement(BottomSheetModalProvider, null, children);
+}

package/dist/src/AtlantisOverlayProvider/index.js

@@ -0,0 +1 @@
+export { AtlantisOverlayProvider } from "./AtlantisOverlayProvider";

package/dist/src/BottomSheet/BottomSheet.js

@@ -1,7 +1,7 @@
 import React, { useCallback, useImperativeHandle, useRef } from "react";
 import { Keyboard, View } from "react-native";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
-import RNBottomSheet, { BottomSheetBackdrop, BottomSheetView, } from "@gorhom/bottom-sheet";
+import { BottomSheetBackdrop, BottomSheetModal, BottomSheetView, } from "@gorhom/bottom-sheet";
 import { tokens } from "@jobber/design";
 import { useStyles } from "./BottomSheet.style";
 import { BottomSheetOption } from "./components/BottomSheetOption";
@@ -22,7 +22,8 @@ export function BottomSheet({ children, showCancel, loading = false, heading, on
     useImperativeHandle(ref, () => ({
         open: () => {
             var _a;
-            (_a = bottomSheetRef.current) === null || _a === void 0 ? void 0 : _a.expand();
+            dismissKeyboard();
+            (_a = bottomSheetRef.current) === null || _a === void 0 ? void 0 : _a.present();
         },
         close: () => {
             close();
@@ -30,25 +31,22 @@ export function BottomSheet({ children, showCancel, loading = false, heading, on
     }));
     const close = useCallback(() => {
         var _a;
-        (_a = bottomSheetRef.current) === null || _a === void 0 ? void 0 : _a.close();
+        (_a = bottomSheetRef.current) === null || _a === void 0 ? void 0 : _a.dismiss();
     }, []);
     const handleChange = (index) => {
         // Handle Android back button
         handleSheetPositionChange(index);
         const previousIndex = previousIndexRef.current;
         if (previousIndex === -1 && index >= 0) {
-            // Transitioned from closed to open
-            dismissKeyboard();
             onOpen === null || onOpen === void 0 ? void 0 : onOpen();
         }
-        else if (previousIndex >= 0 && index === -1) {
-            // Transitioned from open to closed
-            dismissKeyboard();
-            onClose === null || onClose === void 0 ? void 0 : onClose();
-        }
         previousIndexRef.current = index;
     };
-    return (React.createElement(RNBottomSheet, { ref: bottomSheetRef, index: -1, backdropComponent: Backdrop, backgroundStyle: styles.background, enablePanDownToClose: true, onChange: handleChange, keyboardBlurBehavior: "restore", handleStyle: styles.handle },
+    return (React.createElement(BottomSheetModal, { ref: bottomSheetRef, backdropComponent: Backdrop, backgroundStyle: styles.background, enablePanDownToClose: true, onChange: handleChange, onDismiss: () => {
+            previousIndexRef.current = -1;
+            dismissKeyboard();
+            onClose === null || onClose === void 0 ? void 0 : onClose();
+        }, keyboardBlurBehavior: "restore", handleStyle: styles.handle },
         React.createElement(BottomSheetView, { style: {
                 paddingBottom: insets.bottom + tokens["space-small"],
                 paddingTop: tokens["space-small"],

package/dist/src/BottomSheet/hooks/useBottomSheetBackHandler.js

@@ -1,7 +1,7 @@
 import { useCallback, useRef } from "react";
 import { BackHandler } from "react-native";
 /**
- * Hook that closes the bottom sheet on the hardware back button press if it is visible
+ * Hook that dismisses the bottom sheet modal on the hardware back button press if it is visible
  * @param bottomSheetRef ref to the bottom sheet component
  */
 export function useBottomSheetBackHandler(bottomSheetRef) {
@@ -13,7 +13,7 @@ export function useBottomSheetBackHandler(bottomSheetRef) {
             // Setup the back handler if the bottom sheet is right in front of the user
             backHandlerSubscriptionRef.current = BackHandler.addEventListener("hardwareBackPress", () => {
                 var _a;
-                (_a = bottomSheetRef.current) === null || _a === void 0 ? void 0 : _a.close();
+                (_a = bottomSheetRef.current) === null || _a === void 0 ? void 0 : _a.dismiss();
                 return true;
             });
         }

package/dist/src/ButtonGroup/components/SecondaryActionSheet/SecondaryActionSheet.js

@@ -1,17 +1,15 @@
 import React from "react";
 import { View } from "react-native";
-import { Portal } from "react-native-portalize";
 import { BottomSheetOption } from "../../../BottomSheet/components/BottomSheetOption";
 import { BottomSheet } from "../../../BottomSheet/BottomSheet";
 export function SecondaryActionSheet({ actions, secondaryActionsRef, heading, showCancel, onOpenBottomSheet, onCloseBottomSheet, }) {
-    return (React.createElement(Portal, null,
-        React.createElement(BottomSheet, { heading: heading, showCancel: showCancel, ref: secondaryActionsRef, onOpen: onOpenBottomSheet, onClose: onCloseBottomSheet },
-            React.createElement(View, null, actions.map((action, index) => {
-                const { label, onPress, icon, iconColor, destructive } = action;
-                return (React.createElement(BottomSheetOption, { destructive: destructive, key: index, text: label, onPress: () => {
-                        var _a;
-                        (_a = secondaryActionsRef === null || secondaryActionsRef === void 0 ? void 0 : secondaryActionsRef.current) === null || _a === void 0 ? void 0 : _a.close();
-                        onPress();
-                    }, icon: icon, iconColor: iconColor }));
-            })))));
+    return (React.createElement(BottomSheet, { heading: heading, showCancel: showCancel, ref: secondaryActionsRef, onOpen: onOpenBottomSheet, onClose: onCloseBottomSheet },
+        React.createElement(View, null, actions.map((action, index) => {
+            const { label, onPress, icon, iconColor, destructive } = action;
+            return (React.createElement(BottomSheetOption, { destructive: destructive, key: index, text: label, onPress: () => {
+                    var _a;
+                    (_a = secondaryActionsRef === null || secondaryActionsRef === void 0 ? void 0 : secondaryActionsRef.current) === null || _a === void 0 ? void 0 : _a.close();
+                    onPress();
+                }, icon: icon, iconColor: iconColor }));
+        }))));
 }

package/dist/src/FormatFile/components/FormatFileBottomSheet/FormatFileBottomSheet.js

@@ -1,5 +1,4 @@
 import React from "react";
-import { Portal } from "react-native-portalize";
 import { BottomSheet } from "../../../BottomSheet/BottomSheet";
 import { BottomSheetOption } from "../../../BottomSheet/components/BottomSheetOption";
 import { useAtlantisI18n } from "../../../hooks/useAtlantisI18n";
@@ -10,12 +9,11 @@ export const FormatFileBottomSheet = ({ bottomSheetRef, onPreviewPress, onRemove
         onPressAction();
         (_a = bottomSheetRef.current) === null || _a === void 0 ? void 0 : _a.close();
     };
-    return (React.createElement(Portal, null,
-        React.createElement(BottomSheet, { ref: bottomSheetRef },
-            onPreviewPress ? (React.createElement(BottomSheetOption, { icon: "eye", text: t("FormatFile.preview", {
-                    item: bottomSheetOptionsSuffix || "",
-                }), onPress: () => handlePress(onPreviewPress) })) : undefined,
-            onRemovePress ? (React.createElement(BottomSheetOption, { icon: "trash", destructive: true, text: t("FormatFile.remove", {
-                    item: bottomSheetOptionsSuffix || "",
-                }), onPress: () => handlePress(onRemovePress) })) : undefined)));
+    return (React.createElement(BottomSheet, { ref: bottomSheetRef },
+        onPreviewPress ? (React.createElement(BottomSheetOption, { icon: "eye", text: t("FormatFile.preview", {
+                item: bottomSheetOptionsSuffix || "",
+            }), onPress: () => handlePress(onPreviewPress) })) : undefined,
+        onRemovePress ? (React.createElement(BottomSheetOption, { icon: "trash", destructive: true, text: t("FormatFile.remove", {
+                item: bottomSheetOptionsSuffix || "",
+            }), onPress: () => handlePress(onRemovePress) })) : undefined));
 };

package/dist/src/index.js

@@ -2,6 +2,7 @@ export * from "./ActionItem";
 export * from "./ActionLabel";
 export * from "./ActivityIndicator";
 export * from "./AtlantisContext";
+export * from "./AtlantisOverlayProvider";
 export * from "./AtlantisThemeContext";
 export * from "./AutoLink";
 export * from "./Banner";

package/dist/src/utils/meta/meta.json

@@ -9,6 +9,7 @@
         "AtlantisContext.Provider",
         "AtlantisFormContext.Consumer",
         "AtlantisFormContext.Provider",
+        "AtlantisOverlayProvider",
         "AtlantisThemeContextProvider",
         "AutoLink",
         "Banner",