related-ui-components 2.4.7 → 2.4.9

package/src/components/Skeleton/Shimmer.tsx

@@ -56,7 +56,7 @@ const Shimmer: React.FC<ShimmerProps> = ({
 
   const shimmerColors = [
     "transparent",
-    "rgba(255, 255, 255, 0.4)",
+    theme.skeletonShimmer,
     "transparent",
   ];
 

package/src/contexts/BottomSheetStackContext.tsx

@@ -0,0 +1,30 @@
+import React, { ReactNode, useContext } from "react";
+
+export interface BottomSheetStackItem {
+  component: ReactNode;
+  snapPoints?: string[] | number[];
+  initialSnapIndex?: number;
+}
+
+export interface BottomSheetStackContextType {
+  push: (item: BottomSheetStackItem) => void;
+  pop: () => void;
+  replace: (item: BottomSheetStackItem) => void;
+  clear: () => void;
+  canGoBack: boolean;
+}
+
+export const BottomSheetStackContext =
+  React.createContext<BottomSheetStackContextType | null>(null);
+
+export const useBottomSheetStack = () => {
+  const context = useContext(BottomSheetStackContext);
+
+  if (!context) {
+    throw new Error(
+      "useBottomSheetStack must be used within a BottomSheetStackProvider"
+    );
+  }
+
+  return context;
+};

package/src/contexts/BottomSheetStackProvider.tsx

@@ -0,0 +1,138 @@
+import BottomSheet, {
+  BottomSheetBackdrop,
+  BottomSheetBackdropProps,
+} from "@gorhom/bottom-sheet";
+import React, {
+  ReactNode,
+  useCallback,
+  useEffect,
+  useMemo,
+  useRef,
+  useState,
+} from "react";
+import { BackHandler, StyleSheet } from "react-native";
+import Animated, { FadeIn, FadeOut } from "react-native-reanimated";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
+import {
+  BottomSheetStackContext,
+  BottomSheetStackItem,
+} from "./BottomSheetStackContext";
+
+export const BottomSheetStackProvider: React.FC<{ children: ReactNode }> = ({
+  children,
+}) => {
+  const [stack, setStack] = useState<BottomSheetStackItem[]>([]);
+  const sheetRef = useRef<BottomSheet>(null);
+  const { top } = useSafeAreaInsets();
+
+  const push = useCallback((item: BottomSheetStackItem) => {
+    setStack((prev) => [...prev, item]);
+  }, []);
+
+  const clear = useCallback(() => {
+    sheetRef.current?.close();
+    setStack([]);
+  }, []);
+
+  const pop = useCallback(() => {
+    if (stack.length <= 1) {
+      clear();
+      return;
+    }
+    setStack((prev) => prev.slice(0, -1));
+  }, [stack.length, clear]);
+
+  const replace = useCallback((item: BottomSheetStackItem) => {
+    setStack((prev) => [...prev.slice(0, -1), item]);
+  }, []);
+
+  const currentItem = useMemo(() => stack[stack.length - 1], [stack]);
+  const canGoBack = stack.length > 1;
+  const isOpen = stack.length > 0;
+
+  useEffect(() => {
+    if (isOpen && currentItem) {
+      sheetRef.current?.snapToIndex(0);
+    }
+
+    const backHandlerSubscription = BackHandler.addEventListener(
+      "hardwareBackPress",
+      () => {
+        if (canGoBack) {
+          pop();
+          return true;
+        }
+        if (!canGoBack && stack.length === 1) {
+          sheetRef.current?.close();
+          return true;
+        }
+        return false;
+      }
+    );
+
+    return () => backHandlerSubscription.remove();
+  }, [isOpen, canGoBack, currentItem, pop, stack]);
+
+  const AnimatedView = Animated.View;
+  const enteringAnimation = FadeIn.duration(200);
+  const exitingAnimation = FadeOut.duration(200);
+
+  const renderBackdrop = useCallback(
+    (props: BottomSheetBackdropProps) => (
+      <BottomSheetBackdrop
+        {...props}
+        disappearsOnIndex={-1}
+        style={[props.style, { backgroundColor: "rgba(0,0,0,0,1)" }]}
+        appearsOnIndex={0}
+        pressBehavior={"close"}
+      />
+    ),
+    []
+  );
+
+  return (
+    <BottomSheetStackContext.Provider
+      value={{ push, pop, replace, clear, canGoBack }}
+    >
+      {children}
+      <BottomSheet
+        ref={sheetRef}
+        index={0}
+        snapPoints={currentItem?.snapPoints || ["100%"]}
+        enableDynamicSizing={currentItem?.snapPoints === undefined}
+        enablePanDownToClose
+        android_keyboardInputMode="adjustResize"
+        enableBlurKeyboardOnGesture
+        keyboardBlurBehavior="restore"
+        keyboardBehavior="fillParent"
+        onClose={clear}
+        backdropComponent={renderBackdrop}
+        topInset={top}
+        handleIndicatorStyle={{ backgroundColor: "#CCCCCC" }}
+        style={styles.sheetContainer}
+      >
+        {currentItem && (
+          <AnimatedView
+            key={stack.length}
+            entering={enteringAnimation}
+            exiting={exitingAnimation}
+            style={styles.animatedView}
+          >
+            {currentItem.component}
+          </AnimatedView>
+        )}
+      </BottomSheet>
+    </BottomSheetStackContext.Provider>
+  );
+};
+
+const styles = StyleSheet.create({
+  sheetContainer: {
+    // backgroundColor: "#FFFFFF",
+    // borderTopLeftRadius: 20,
+    // borderTopRightRadius: 20,
+  },
+  animatedView: {
+    flex: 1,
+  },
+});

package/src/contexts/index.ts

@@ -1,2 +1,2 @@
-export * from "./BottomSheetContext"
-export * from "./BottomSheetProvider"
+export * from "./BottomSheetStackContext"
+export * from "./BottomSheetStackProvider"

package/src/theme/Colors.ts

@@ -54,6 +54,7 @@ export interface ThemeType {
   };
   skeletonBackgroundColor? : string;
   skeletonItemColor?: string;
+  skeletonShimmer?: string;
 }
 
 // Updated Light Theme - True black and white oriented, less muted
@@ -106,7 +107,8 @@ export const lightTheme: ThemeType = {
   },
 
   skeletonBackgroundColor: "#e0e0e0",
-  skeletonItemColor: "#2c2c2c"
+  skeletonItemColor: "#2c2c2c",
+  skeletonShimmer: "rgba(255, 255, 255, 0.4)"
 };
 
 // Updated Dark Theme - True black and white oriented, less muted
@@ -159,5 +161,6 @@ export const darkTheme: ThemeType = {
   },
 
   skeletonBackgroundColor: "#f5f5f5",
-  skeletonItemColor: "#444444"
+  skeletonItemColor: "#444444",
+  skeletonShimmer: "rgba(255, 255, 255, 0.2)"
 };

package/src/utils/flags.ts

@@ -0,0 +1,7 @@
+export function iso2ToFlagEmoji(countryCode: string): string {
+  return countryCode
+    .toUpperCase()
+    .split('')
+    .map(ch => String.fromCodePoint(ch.charCodeAt(0) + 127397))
+    .join('');
+}

package/lib/module/contexts/BottomSheetContext.js

@@ -1,13 +0,0 @@
-"use strict";
-
-import { createContext, useContext } from "react";
-const BottomSheetContext = /*#__PURE__*/createContext(undefined);
-export const useBottomSheet = () => {
-  const context = useContext(BottomSheetContext);
-  if (!context) {
-    throw new Error("useBottomSheet must be used within a BottomSheetProvider");
-  }
-  return context;
-};
-export default BottomSheetContext;
-//# sourceMappingURL=BottomSheetContext.js.map

package/lib/module/contexts/BottomSheetContext.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["createContext","useContext","BottomSheetContext","undefined","useBottomSheet","context","Error"],"sourceRoot":"..\\..\\..\\src","sources":["contexts/BottomSheetContext.tsx"],"mappings":";;AAAA,SAASA,aAAa,EAAEC,UAAU,QAAmB,OAAO;AAa5D,MAAMC,kBAAkB,gBAAGF,aAAa,CACtCG,SACF,CAAC;AAED,OAAO,MAAMC,cAAc,GAAGA,CAAA,KAAM;EAClC,MAAMC,OAAO,GAAGJ,UAAU,CAACC,kBAAkB,CAAC;EAC9C,IAAI,CAACG,OAAO,EAAE;IACZ,MAAM,IAAIC,KAAK,CACb,0DACF,CAAC;EACH;EACA,OAAOD,OAAO;AAChB,CAAC;AAED,eAAeH,kBAAkB","ignoreList":[]}

package/lib/module/contexts/BottomSheetProvider.js

@@ -1,104 +0,0 @@
-"use strict";
-
-import React, { useState, useRef, useCallback, useMemo, useEffect } from "react";
-import BottomSheet, { BottomSheetBackdrop } from "@gorhom/bottom-sheet";
-import BottomSheetContext from "./BottomSheetContext.js";
-import { Keyboard, StyleSheet } from "react-native";
-import { useTheme } from "../theme/index.js";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export const BottomSheetProvider = ({
-  children
-}) => {
-  const {
-    theme
-  } = useTheme(); // Get theme for styling the provider's sheet if needed
-  const styles = useMemo(() => providerStyles(theme), [theme]);
-  const sheetRef = useRef(null);
-  const [isOpen, setIsOpen] = useState(false);
-  const [content, setContent] = useState(null);
-  const [size, setSize] = useState("small");
-  const [sp, setSnapPoints] = useState(["30%", "50%", "85%"]);
-  const [onCloseCallback, setOnCloseCallback] = useState(null);
-  const openBottomSheet = useCallback((newContent, size, onClose, snapPoints) => {
-    setContent(newContent);
-    setSize(size);
-    setOnCloseCallback(() => onClose);
-    setIsOpen(true);
-    if (snapPoints) {
-      setSnapPoints(snapPoints);
-    }
-  }, []);
-  const closeBottomSheet = useCallback(() => {
-    sheetRef.current?.close();
-    setIsOpen(false);
-  }, []);
-  const renderBackdrop = useCallback(props => /*#__PURE__*/_jsx(BottomSheetBackdrop, {
-    ...props,
-    disappearsOnIndex: -1,
-    appearsOnIndex: 0,
-    opacity: 0.5,
-    pressBehavior: "close",
-    style: [props.style, {
-      backgroundColor: "rgba(0,0,0,0.5)"
-    }]
-  }), []);
-  useEffect(() => {
-    if (isOpen && content) {
-      sheetRef.current?.snapToIndex(size === "small" ? 0 : 1);
-    } else {
-      sheetRef.current?.close();
-    }
-  }, [isOpen, content, size]);
-  return /*#__PURE__*/_jsxs(BottomSheetContext.Provider, {
-    value: {
-      openBottomSheet,
-      closeBottomSheet,
-      isOpen
-    },
-    children: [children, /*#__PURE__*/_jsx(BottomSheet, {
-      ref: sheetRef,
-      index: -1,
-      snapPoints: sp,
-      enablePanDownToClose: true,
-      backdropComponent: renderBackdrop,
-      android_keyboardInputMode: "adjustResize",
-      keyboardBlurBehavior: "restore",
-      keyboardBehavior: "extend",
-      enableDynamicSizing: false,
-      style: styles.bottomSheetContainer,
-      onClose: () => {
-        setIsOpen(false);
-        Keyboard.dismiss();
-      },
-      handleIndicatorStyle: {
-        backgroundColor: theme.onSurface
-      },
-      children: content
-    })]
-  });
-};
-const providerStyles = theme => StyleSheet.create({
-  bottomSheetContainer: {
-    backgroundColor: theme.surface,
-    // Ensure sheet background matches theme
-    borderTopLeftRadius: 20,
-    borderTopRightRadius: 20,
-    overflow: "hidden" // Important for rounded corners with content
-  },
-  headerContainer: {
-    padding: 16,
-    borderBottomWidth: 1,
-    borderBottomColor: theme.divider,
-    // Use theme color for divider
-    alignItems: "center"
-  },
-  headerTitle: {
-    fontSize: 18,
-    fontWeight: "bold",
-    color: theme.onSurface
-  },
-  contentContainer: {
-    flex: 1 // Ensure content can take up available space
-  }
-});
-//# sourceMappingURL=BottomSheetProvider.js.map

package/lib/module/contexts/BottomSheetProvider.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["React","useState","useRef","useCallback","useMemo","useEffect","BottomSheet","BottomSheetBackdrop","BottomSheetContext","Keyboard","StyleSheet","useTheme","jsx","_jsx","jsxs","_jsxs","BottomSheetProvider","children","theme","styles","providerStyles","sheetRef","isOpen","setIsOpen","content","setContent","size","setSize","sp","setSnapPoints","onCloseCallback","setOnCloseCallback","openBottomSheet","newContent","onClose","snapPoints","closeBottomSheet","current","close","renderBackdrop","props","disappearsOnIndex","appearsOnIndex","opacity","pressBehavior","style","backgroundColor","snapToIndex","Provider","value","ref","index","enablePanDownToClose","backdropComponent","android_keyboardInputMode","keyboardBlurBehavior","keyboardBehavior","enableDynamicSizing","bottomSheetContainer","dismiss","handleIndicatorStyle","onSurface","create","surface","borderTopLeftRadius","borderTopRightRadius","overflow","headerContainer","padding","borderBottomWidth","borderBottomColor","divider","alignItems","headerTitle","fontSize","fontWeight","color","contentContainer","flex"],"sourceRoot":"..\\..\\..\\src","sources":["contexts/BottomSheetProvider.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IACVC,QAAQ,EACRC,MAAM,EACNC,WAAW,EAEXC,OAAO,EACPC,SAAS,QACJ,OAAO;AACd,OAAOC,WAAW,IAChBC,mBAAmB,QAEd,sBAAsB;AAC7B,OAAOC,kBAAkB,MAAM,yBAAsB;AACrD,SAASC,QAAQ,EAAEC,UAAU,QAAQ,cAAc;AACnD,SAAoBC,QAAQ,QAAQ,mBAAU;AAAC,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAM/C,OAAO,MAAMC,mBAAuD,GAAGA,CAAC;EACtEC;AACF,CAAC,KAAK;EACJ,MAAM;IAAEC;EAAM,CAAC,GAAGP,QAAQ,CAAC,CAAC,CAAC,CAAC;EAC9B,MAAMQ,MAAM,GAAGf,OAAO,CAAC,MAAMgB,cAAc,CAACF,KAAK,CAAC,EAAE,CAACA,KAAK,CAAC,CAAC;EAC5D,MAAMG,QAAQ,GAAGnB,MAAM,CAAc,IAAI,CAAC;EAE1C,MAAM,CAACoB,MAAM,EAAEC,SAAS,CAAC,GAAGtB,QAAQ,CAAC,KAAK,CAAC;EAC3C,MAAM,CAACuB,OAAO,EAAEC,UAAU,CAAC,GAAGxB,QAAQ,CAAY,IAAI,CAAC;EACvD,MAAM,CAACyB,IAAI,EAAEC,OAAO,CAAC,GAAG1B,QAAQ,CAAoB,OAAO,CAAC;EAC5D,MAAM,CAAC2B,EAAE,EAAEC,aAAa,CAAC,GAAG5B,QAAQ,CAAuB,CACzD,KAAK,EACL,KAAK,EACL,KAAK,CACN,CAAC;EAEF,MAAM,CAAC6B,eAAe,EAAEC,kBAAkB,CAAC,GAAG9B,QAAQ,CACpD,IACF,CAAC;EAED,MAAM+B,eAAe,GAAG7B,WAAW,CACjC,CACE8B,UAAyC,EACzCP,IAAuB,EACvBQ,OAAoB,EACpBC,UAAqB,KAClB;IACHV,UAAU,CAACQ,UAAU,CAAC;IACtBN,OAAO,CAACD,IAAI,CAAC;IACbK,kBAAkB,CAAC,MAAMG,OAAO,CAAC;IACjCX,SAAS,CAAC,IAAI,CAAC;IACf,IAAIY,UAAU,EAAE;MACdN,aAAa,CAACM,UAAU,CAAC;IAC3B;EACF,CAAC,EACD,EACF,CAAC;EAED,MAAMC,gBAAgB,GAAGjC,WAAW,CAAC,MAAM;IACzCkB,QAAQ,CAACgB,OAAO,EAAEC,KAAK,CAAC,CAAC;IACzBf,SAAS,CAAC,KAAK,CAAC;EAClB,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMgB,cAAc,GAAGpC,WAAW,CAC/BqC,KAA+B,iBAC9B3B,IAAA,CAACN,mBAAmB;IAAA,GACdiC,KAAK;IACTC,iBAAiB,EAAE,CAAC,CAAE;IACtBC,cAAc,EAAE,CAAE;IAClBC,OAAO,EAAE,GAAI;IACbC,aAAa,EAAC,OAAO;IACrBC,KAAK,EAAE,CAACL,KAAK,CAACK,KAAK,EAAE;MAAEC,eAAe,EAAE;IAAkB,CAAC;EAAE,CAC9D,CACF,EACD,EACF,CAAC;EAEDzC,SAAS,CAAC,MAAM;IACd,IAAIiB,MAAM,IAAIE,OAAO,EAAE;MACrBH,QAAQ,CAACgB,OAAO,EAAEU,WAAW,CAACrB,IAAI,KAAK,OAAO,GAAG,CAAC,GAAG,CAAC,CAAC;IACzD,CAAC,MAAM;MACLL,QAAQ,CAACgB,OAAO,EAAEC,KAAK,CAAC,CAAC;IAC3B;EACF,CAAC,EAAE,CAAChB,MAAM,EAAEE,OAAO,EAAEE,IAAI,CAAC,CAAC;EAE3B,oBACEX,KAAA,CAACP,kBAAkB,CAACwC,QAAQ;IAC1BC,KAAK,EAAE;MAAEjB,eAAe;MAAEI,gBAAgB;MAAEd;IAAO,CAAE;IAAAL,QAAA,GAEpDA,QAAQ,eACTJ,IAAA,CAACP,WAAW;MACV4C,GAAG,EAAE7B,QAAS;MACd8B,KAAK,EAAE,CAAC,CAAE;MACVhB,UAAU,EAAEP,EAAG;MACfwB,oBAAoB;MACpBC,iBAAiB,EAAEd,cAAe;MAClCe,yBAAyB,EAAC,cAAc;MACxCC,oBAAoB,EAAC,SAAS;MAC9BC,gBAAgB,EAAC,QAAQ;MACzBC,mBAAmB,EAAE,KAAM;MAC3BZ,KAAK,EAAE1B,MAAM,CAACuC,oBAAqB;MACnCxB,OAAO,EAAEA,CAAA,KAAM;QACbX,SAAS,CAAC,KAAK,CAAC;QAChBd,QAAQ,CAACkD,OAAO,CAAC,CAAC;MACpB,CAAE;MACFC,oBAAoB,EAAE;QAAEd,eAAe,EAAE5B,KAAK,CAAC2C;MAAU,CAAE;MAAA5C,QAAA,EAE1DO;IAAO,CACG,CAAC;EAAA,CACa,CAAC;AAElC,CAAC;AAED,MAAMJ,cAAc,GAAIF,KAAgB,IACtCR,UAAU,CAACoD,MAAM,CAAC;EAChBJ,oBAAoB,EAAE;IACpBZ,eAAe,EAAE5B,KAAK,CAAC6C,OAAO;IAAE;IAChCC,mBAAmB,EAAE,EAAE;IACvBC,oBAAoB,EAAE,EAAE;IACxBC,QAAQ,EAAE,QAAQ,CAAE;EACtB,CAAC;EACDC,eAAe,EAAE;IACfC,OAAO,EAAE,EAAE;IACXC,iBAAiB,EAAE,CAAC;IACpBC,iBAAiB,EAAEpD,KAAK,CAACqD,OAAO;IAAE;IAClCC,UAAU,EAAE;EACd,CAAC;EACDC,WAAW,EAAE;IACXC,QAAQ,EAAE,EAAE;IACZC,UAAU,EAAE,MAAM;IAClBC,KAAK,EAAE1D,KAAK,CAAC2C;EACf,CAAC;EACDgB,gBAAgB,EAAE;IAChBC,IAAI,EAAE,CAAC,CAAE;EACX;AACF,CAAC,CAAC","ignoreList":[]}

package/lib/typescript/src/contexts/BottomSheetContext.d.ts

@@ -1,10 +0,0 @@
-import { ReactNode } from "react";
-interface BottomSheetContextProps {
-    openBottomSheet: (content: ReactNode | (() => ReactNode), size: "small" | "large", onClose?: () => void, snapPoints?: string[]) => void;
-    closeBottomSheet: () => void;
-    isOpen: boolean;
-}
-declare const BottomSheetContext: import("react").Context<BottomSheetContextProps | undefined>;
-export declare const useBottomSheet: () => BottomSheetContextProps;
-export default BottomSheetContext;
-//# sourceMappingURL=BottomSheetContext.d.ts.map

package/lib/typescript/src/contexts/BottomSheetContext.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"BottomSheetContext.d.ts","sourceRoot":"","sources":["../../../../src/contexts/BottomSheetContext.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA6B,SAAS,EAAE,MAAM,OAAO,CAAC;AAE7D,UAAU,uBAAuB;IAC/B,eAAe,EAAE,CACf,OAAO,EAAE,SAAS,GAAG,CAAC,MAAM,SAAS,CAAC,EACtC,IAAI,EAAE,OAAO,GAAG,OAAO,EACvB,OAAO,CAAC,EAAE,MAAM,IAAI,EACpB,UAAU,CAAC,EAAE,MAAM,EAAE,KAClB,IAAI,CAAC;IACV,gBAAgB,EAAE,MAAM,IAAI,CAAC;IAC7B,MAAM,EAAE,OAAO,CAAC;CACjB;AAED,QAAA,MAAM,kBAAkB,8DAEvB,CAAC;AAEF,eAAO,MAAM,cAAc,+BAQ1B,CAAC;AAEF,eAAe,kBAAkB,CAAC"}

package/lib/typescript/src/contexts/BottomSheetProvider.d.ts

@@ -1,7 +0,0 @@
-import React, { ReactNode } from "react";
-interface BottomSheetProviderProps {
-    children: ReactNode;
-}
-export declare const BottomSheetProvider: React.FC<BottomSheetProviderProps>;
-export {};
-//# sourceMappingURL=BottomSheetProvider.d.ts.map

package/lib/typescript/src/contexts/BottomSheetProvider.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"BottomSheetProvider.d.ts","sourceRoot":"","sources":["../../../../src/contexts/BottomSheetProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAIZ,SAAS,EAGV,MAAM,OAAO,CAAC;AASf,UAAU,wBAAwB;IAChC,QAAQ,EAAE,SAAS,CAAC;CACrB;AAED,eAAO,MAAM,mBAAmB,EAAE,KAAK,CAAC,EAAE,CAAC,wBAAwB,CA2FlE,CAAC"}

package/src/contexts/BottomSheetContext.tsx

@@ -1,28 +0,0 @@
-import { createContext, useContext, ReactNode } from "react";
-
-interface BottomSheetContextProps {
-  openBottomSheet: (
-    content: ReactNode | (() => ReactNode),
-    size: "small" | "large",
-    onClose?: () => void,
-    snapPoints?: string[]
-  ) => void;
-  closeBottomSheet: () => void;
-  isOpen: boolean;
-}
-
-const BottomSheetContext = createContext<BottomSheetContextProps | undefined>(
-  undefined
-);
-
-export const useBottomSheet = () => {
-  const context = useContext(BottomSheetContext);
-  if (!context) {
-    throw new Error(
-      "useBottomSheet must be used within a BottomSheetProvider"
-    );
-  }
-  return context;
-};
-
-export default BottomSheetContext;

package/src/contexts/BottomSheetProvider.tsx

@@ -1,136 +0,0 @@
-import React, {
-  useState,
-  useRef,
-  useCallback,
-  ReactNode,
-  useMemo,
-  useEffect,
-} from "react";
-import BottomSheet, {
-  BottomSheetBackdrop,
-  BottomSheetBackdropProps,
-} from "@gorhom/bottom-sheet";
-import BottomSheetContext from "./BottomSheetContext";
-import { Keyboard, StyleSheet } from "react-native";
-import { ThemeType, useTheme } from "../theme";
-
-interface BottomSheetProviderProps {
-  children: ReactNode;
-}
-
-export const BottomSheetProvider: React.FC<BottomSheetProviderProps> = ({
-  children,
-}) => {
-  const { theme } = useTheme(); // Get theme for styling the provider's sheet if needed
-  const styles = useMemo(() => providerStyles(theme), [theme]);
-  const sheetRef = useRef<BottomSheet>(null);
-
-  const [isOpen, setIsOpen] = useState(false);
-  const [content, setContent] = useState<ReactNode>(null);
-  const [size, setSize] = useState<"small" | "large">("small");
-  const [sp, setSnapPoints] = useState<string[] | undefined>([
-    "30%",
-    "50%",
-    "85%",
-  ]);
-
-  const [onCloseCallback, setOnCloseCallback] = useState<(() => void) | null>(
-    null
-  );
-
-  const openBottomSheet = useCallback(
-    (
-      newContent: ReactNode | (() => ReactNode),
-      size: "small" | "large",
-      onClose?: () => void,
-      snapPoints?: string[]
-    ) => {
-      setContent(newContent);
-      setSize(size);
-      setOnCloseCallback(() => onClose);
-      setIsOpen(true);
-      if (snapPoints) {
-        setSnapPoints(snapPoints);
-      }
-    },
-    []
-  );
-
-  const closeBottomSheet = useCallback(() => {
-    sheetRef.current?.close();
-    setIsOpen(false);
-  }, []);
-
-  const renderBackdrop = useCallback(
-    (props: BottomSheetBackdropProps) => (
-      <BottomSheetBackdrop
-        {...props}
-        disappearsOnIndex={-1}
-        appearsOnIndex={0}
-        opacity={0.5}
-        pressBehavior="close"
-        style={[props.style, { backgroundColor: "rgba(0,0,0,0.5)" }]}
-      />
-    ),
-    []
-  );
-
-  useEffect(() => {
-    if (isOpen && content) {
-      sheetRef.current?.snapToIndex(size === "small" ? 0 : 1);
-    } else {
-      sheetRef.current?.close();
-    }
-  }, [isOpen, content, size]);
-
-  return (
-    <BottomSheetContext.Provider
-      value={{ openBottomSheet, closeBottomSheet, isOpen }}
-    >
-      {children}
-      <BottomSheet
-        ref={sheetRef}
-        index={-1}
-        snapPoints={sp}
-        enablePanDownToClose
-        backdropComponent={renderBackdrop}
-        android_keyboardInputMode="adjustResize"
-        keyboardBlurBehavior="restore"
-        keyboardBehavior="extend"
-        enableDynamicSizing={false}
-        style={styles.bottomSheetContainer}
-        onClose={() => {
-          setIsOpen(false);
-          Keyboard.dismiss();
-        }}
-        handleIndicatorStyle={{ backgroundColor: theme.onSurface }}
-      >
-        {content}
-      </BottomSheet>
-    </BottomSheetContext.Provider>
-  );
-};
-
-const providerStyles = (theme: ThemeType) =>
-  StyleSheet.create({
-    bottomSheetContainer: {
-      backgroundColor: theme.surface, // Ensure sheet background matches theme
-      borderTopLeftRadius: 20,
-      borderTopRightRadius: 20,
-      overflow: "hidden", // Important for rounded corners with content
-    },
-    headerContainer: {
-      padding: 16,
-      borderBottomWidth: 1,
-      borderBottomColor: theme.divider, // Use theme color for divider
-      alignItems: "center",
-    },
-    headerTitle: {
-      fontSize: 18,
-      fontWeight: "bold",
-      color: theme.onSurface,
-    },
-    contentContainer: {
-      flex: 1, // Ensure content can take up available space
-    },
-  });