related-ui-components 2.4.8 → 2.5.0

package/src/app.tsx

@@ -2,9 +2,20 @@
 // import { SafeAreaView, StyleSheet, StatusBar } from "react-native";
 // import CarouselCardStack from "./components/CarouselCardStack/CarouselCardStack"; // Adjust path as needed
 // import { GestureHandlerRootView } from "react-native-gesture-handler";
-// import { CarRentalForm, DateRangePicker, FlightForm, FlightSummary, HotelForm, HotelSummary, Filters} from "./components";
+// import {
+//   CarRentalForm,
+//   DateRangePicker,
+//   FlightForm,
+//   FlightSummary,
+//   HotelForm,
+//   HotelSummary,
+//   Filters,
+// } from "./components";
 // import { lightTheme, RelatedProvider, useTheme } from "./theme";
 // import CircularProgressBar from "./components/ProgressBar/CircularProgressBar";
+// import PhoneInput from "./components/Input/PhoneInput";
+// import { BottomSheetStackProvider } from "./contexts";
+// import { SafeAreaProvider } from "react-native-safe-area-context";
 
 // // Sample data - replace with your actual image URLs
 // const DUMMY_DATA = [
@@ -43,27 +54,31 @@
 // const App = () => {
 //   const { theme } = useTheme();
 
-//   const [departureDate, setDepartureDate] = useState<string | undefined>(undefined);
+//   const [departureDate, setDepartureDate] = useState<string | undefined>(
+//     undefined
+//   );
 //   const [returnDate, setReturnDate] = useState<string | undefined>(undefined);
 
 //   const [progress, setProgress] = useState(25);
-// const handleAnimate = () => {
+//   const handleAnimate = () => {
 //     // Set progress to a new random value between 0 and 100
 //     const newProgress = Math.floor(Math.random() * 101);
 //     setProgress(newProgress);
 //   };
 //   return (
 //     <>
-//       <RelatedProvider theme={lightTheme}>
-//         <GestureHandlerRootView style={{ flex: 1 }}>
-//           <StatusBar barStyle="light-content" />
-//           <SafeAreaView style={styles.appContainer}>
-//             <CircularProgressBar
+//     <SafeAreaProvider>
+//       <GestureHandlerRootView style={{ flex: 1 }}>
+//         <RelatedProvider theme={lightTheme}>
+//           <BottomSheetStackProvider>
+//             <StatusBar barStyle="light-content" />
+//             <SafeAreaView style={styles.appContainer}>
+//               {/* <CircularProgressBar
 //               progress={5}
 //               lineCap="round"
 //               textFont={""}
-//             />
-//             {/* <DateRangePicker
+//             /> */}
+//               {/* <DateRangePicker
 //               onDatesChange={(t) => {
 //                 setDepartureDate(t.departure);
 //                 setReturnDate(t.return);
@@ -73,7 +88,7 @@
 //               returnDate={returnDate}
 //               // returnDisplayValue={returnDate}
 //             ></DateRangePicker> */}
-//             {/* <Filters
+//               {/* <Filters
 //               bottomSheetBackgroundStyle={{
 //                 borderTopRightRadius: 30,
 //                 borderTopLeftRadius: 30,
@@ -97,16 +112,19 @@
 //               applyButtonTextStyle={{ color: theme.secondary }}
 //               headerStyle={{ borderBottomWidth: 0 }}
 //             ></Filters> */}
-//             {/* <FlightSummary></FlightSummary> */}
-//             {/* <FlightForm></FlightForm> */}
-//             {/* <HotelSummary></HotelSummary> */}
-//             {/* <HotelForm></HotelForm> */}
-//             {/* <DateRangePicker onDatesChange={()=>{}} labelContainerStyle={{backgroundColor:"red"}}></DateRangePicker> */}
-//             {/* <CarRentalForm onSelectionChange={console.log}></CarRentalForm> */}
-//             <CarouselCardStack data={DUMMY_DATA} />
-//           </SafeAreaView>
-//         </GestureHandlerRootView>
-//       </RelatedProvider>
+//               {/* <FlightSummary></FlightSummary> */}
+//               {/* <FlightForm></FlightForm> */}
+//               {/* <HotelSummary></HotelSummary> */}
+//               {/* <HotelForm></HotelForm> */}
+//               {/* <DateRangePicker onDatesChange={()=>{}} labelContainerStyle={{backgroundColor:"red"}}></DateRangePicker> */}
+//               {/* <CarRentalForm onSelectionChange={console.log}></CarRentalForm> */}
+//               {/* <CarouselCardStack data={DUMMY_DATA} /> */}
+//               <PhoneInput value="" onChangeText={() => {}} inputContainerStyle={{height: 55}}></PhoneInput>
+//             </SafeAreaView>
+//           </BottomSheetStackProvider>
+//         </RelatedProvider>
+//       </GestureHandlerRootView>
+//       </SafeAreaProvider>
 //     </>
 //   );
 // };

package/src/components/Input/PhoneInput.tsx

@@ -0,0 +1,214 @@
+import React, { forwardRef, useState, useMemo, useCallback } from "react";
+import {
+  TextInput,
+  Text,
+  View,
+  TouchableOpacity,
+  StyleSheet,
+  FlatList,
+  TextInputProps,
+  StyleProp,
+  TextStyle,
+} from "react-native";
+import CustomInput, { CustomInputProps } from "./Input";
+import { useTheme } from "../../theme";
+import { Popup } from "../Popup";
+import { Ionicons } from "@expo/vector-icons";
+import { useBottomSheetStack } from "../../contexts";
+import { BottomSheetFlatList } from "@gorhom/bottom-sheet";
+import { allCountries } from 'country-telephone-data';
+import { iso2ToFlagEmoji } from "../../utils/flags";
+
+export type Country = {
+  code: string; 
+  iso2: string;
+  name: string; 
+};
+
+export interface PhoneInputProps
+  extends Omit<
+    CustomInputProps,
+    | "leftIcon"
+    | "rightIcon"
+    | "onRightIconPress"
+    | "keyboardType"
+    | "style"
+    | "placeholderTextColor"
+  > {
+  value: string;
+  onChangeText: (text: string) => void;
+  selectedCountry?: Country;
+  onSelectCountry?: (c: Country) => void;
+  countries?: Country[];
+
+  //styles 
+  countryNameStyle?: StyleProp<TextStyle>;
+  countryCodeStyle?: StyleProp<TextStyle>;
+  listTitleStyle?: StyleProp<TextStyle>;
+
+  listTitle?: string
+}
+
+const DEFAULT_COUNTRIES: Country[] = allCountries.map(c => ({
+  code: `+${c.dialCode}`,
+  iso2: c.iso2,
+  name: c.name,
+}));
+
+const PhoneInput = forwardRef<TextInput, PhoneInputProps>(
+  (
+    {
+      value,
+      onChangeText,
+      selectedCountry,
+      onSelectCountry,
+      countries = DEFAULT_COUNTRIES,
+      containerStyle,
+      inputContainerStyle,
+      inputStyle,
+      label,
+      labelStyle,
+      error,
+      errorStyle,
+      helper,
+      helperStyle,
+      listTitle = "Select Country",
+      listTitleStyle,
+      countryCodeStyle,
+      countryNameStyle,
+      ...rest
+    },
+    ref
+  ) => {
+    const { theme } = useTheme();
+    const { push } = useBottomSheetStack();
+
+    const sel = useMemo(
+      () =>
+        selectedCountry ||
+        countries.find((c) => c.code === "+1") ||
+        countries[0],
+      [selectedCountry, countries]
+    );
+
+    const handleCountryPress = useCallback(
+      (c: Country) => {
+        onSelectCountry && onSelectCountry(c);
+      },
+      [onSelectCountry]
+    );
+
+    const renderCountry = ({ item }: { item: Country }) => (
+      <TouchableOpacity
+        style={styles.countryRow}
+        onPress={() => handleCountryPress(item)}
+      >
+        <Text style={styles.flag}> {iso2ToFlagEmoji(item.iso2)}</Text>
+        <View style={styles.countryText}>
+          <Text style={[styles.countryName, countryNameStyle]}>{item.name}</Text>
+          <Text style={[styles.countryCode, countryCodeStyle]}>{item.code}</Text>
+        </View>
+      </TouchableOpacity>
+    );
+
+    const leftIcon = (
+      <TouchableOpacity
+        style={[styles.selector, { backgroundColor: theme.inputBackground }]}
+        hitSlop={{left: 30, top: 30, right: 30, bottom: 30}}
+        onPress={() =>
+          push({
+            component: (
+              <View style={styles.popup}>
+                <Text style={[styles.popupTitle, listTitleStyle, { color: theme.text }]}>
+                  {listTitle}
+                </Text>
+                <BottomSheetFlatList
+                  data={countries}
+                  keyExtractor={(c, i) => i.toString()}
+                  renderItem={renderCountry}
+                  contentContainerStyle={{ paddingBottom: 16 }}
+                />
+              </View>
+            ),
+            snapPoints: ["100%"]
+          })
+        }
+        activeOpacity={0.8}
+      >
+        <Text style={[styles.flag, { color: theme.inputText }]}>
+          {iso2ToFlagEmoji(sel.iso2)}
+        </Text>
+        <Text style={[styles.code, { color: theme.inputText }]}>
+          {sel.code}
+        </Text>
+        <Ionicons name="chevron-down" size={16} style={{marginHorizontal: 4}}></Ionicons>
+      </TouchableOpacity>
+    );
+
+    return (
+      <>
+        <CustomInput
+          ref={ref}
+          label={label}
+          value={value}
+          onChangeText={onChangeText}
+          keyboardType="phone-pad"
+          placeholder="123 456 7890"
+          leftIcon={leftIcon}
+          containerStyle={containerStyle}
+          inputContainerStyle={inputContainerStyle}
+          inputStyle={inputStyle}
+          labelStyle={labelStyle}
+          error={error}
+          errorStyle={errorStyle}
+          helper={helper}
+          helperStyle={helperStyle}
+          {...rest}
+        />
+      </>
+    );
+  }
+);
+
+const styles = StyleSheet.create({
+  selector: {
+    flexDirection: "row",
+    alignItems: "center",
+    borderRightWidth: 1,
+    borderRightColor: "grey"
+  },
+  flag: {
+    fontSize: 18,
+  },
+  code: {
+    fontSize: 14,
+    marginLeft: 4,
+  },
+  popup: {
+    // maxHeight: 400,
+    width: "100%",
+    padding: 16,
+  },
+  popupTitle: {
+    fontSize: 18,
+    fontWeight: "600",
+    marginBottom: 12,
+  },
+  countryRow: {
+    flexDirection: "row",
+    alignItems: "center",
+    paddingVertical: 10,
+  },
+  countryText: {
+    marginLeft: 12,
+  },
+  countryName: {
+    fontSize: 16,
+  },
+  countryCode: {
+    fontSize: 14,
+    color: "#666",
+  },
+});
+
+export default PhoneInput;

package/src/components/Input/index.ts

@@ -1,2 +1,5 @@
 export { default as Input} from "./Input";
-export * from "./Input";
+export * from "./Input";
+
+export { default as PhoneInput} from "./PhoneInput";
+export * from "./PhoneInput";

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/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":"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","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"}