related-ui-components 2.1.0 → 2.1.1

package/lib/module/contexts/BottomSheetContext.js

@@ -0,0 +1,13 @@
+"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

@@ -0,0 +1 @@
+{"version":3,"names":["createContext","useContext","BottomSheetContext","undefined","useBottomSheet","context","Error"],"sourceRoot":"..\\..\\..\\src","sources":["contexts/BottomSheetContext.tsx"],"mappings":";;AAAA,SAASA,aAAa,EAAEC,UAAU,QAAmB,OAAO;AAY5D,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

@@ -0,0 +1,100 @@
+"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 [onCloseCallback, setOnCloseCallback] = useState(null);
+  const openBottomSheet = useCallback((newContent, size, onClose) => {
+    setContent(newContent);
+    setSize(size);
+    setOnCloseCallback(() => onClose);
+    setIsOpen(true);
+  }, []);
+  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: ["30%", "50%", "85%"],
+      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

@@ -0,0 +1 @@
+{"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","onCloseCallback","setOnCloseCallback","openBottomSheet","newContent","onClose","closeBottomSheet","current","close","renderBackdrop","props","disappearsOnIndex","appearsOnIndex","opacity","pressBehavior","style","backgroundColor","snapToIndex","Provider","value","ref","index","snapPoints","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/module/contexts/index.js

@@ -0,0 +1,5 @@
+"use strict";
+
+export * from "./BottomSheetContext.js";
+export * from "./BottomSheetProvider.js";
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"..\\..\\..\\src","sources":["contexts/index.ts"],"mappings":";;AAAA,cAAc,yBAAsB;AACpC,cAAc,0BAAuB","ignoreList":[]}

package/lib/module/index.js

@@ -1,9 +1,13 @@
 "use strict";
 
-import { registerRootComponent } from 'expo';
-import "react-native-reanimated";
-import App from "./app.js";
-registerRootComponent(App);
+// import { registerRootComponent } from 'expo';
+// import "react-native-reanimated";
+
+// import App from "./app";
+
+// registerRootComponent(App);
+
 export * from "./theme/index.js";
 export * from "./components/index.js";
+export * from "./contexts/index.js";
 //# sourceMappingURL=index.js.map

package/lib/module/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["registerRootComponent","App"],"sourceRoot":"..\\..\\src","sources":["index.ts"],"mappings":";;AAAA,SAASA,qBAAqB,QAAQ,MAAM;AAC5C,OAAO,yBAAyB;AAGhC,OAAOC,GAAG,MAAM,UAAO;AAEvBD,qBAAqB,CAACC,GAAG,CAAC;AAE1B,cAAc,kBAAS;AACvB,cAAc,uBAAc","ignoreList":[]}
+{"version":3,"names":[],"sourceRoot":"..\\..\\src","sources":["index.ts"],"mappings":";;AAAA;AACA;;AAGA;;AAEA;;AAEA,cAAc,kBAAS;AACvB,cAAc,uBAAc;AAC5B,cAAc,qBAAY","ignoreList":[]}

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

@@ -0,0 +1,10 @@
+import { ReactNode } from "react";
+interface BottomSheetContextProps {
+    openBottomSheet: (content: ReactNode | (() => ReactNode), size: "small" | "large", onClose?: () => void) => 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

@@ -0,0 +1 @@
+{"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,KACjB,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

@@ -0,0 +1,7 @@
+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

@@ -0,0 +1 @@
+{"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,CAkFlE,CAAC"}

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

@@ -0,0 +1,3 @@
+export * from "./BottomSheetContext";
+export * from "./BottomSheetProvider";
+//# sourceMappingURL=index.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/contexts/index.ts"],"names":[],"mappings":"AAAA,cAAc,sBAAsB,CAAA;AACpC,cAAc,uBAAuB,CAAA"}

package/lib/typescript/src/index.d.ts

@@ -1,4 +1,4 @@
-import "react-native-reanimated";
 export * from "./theme";
 export * from "./components";
+export * from "./contexts";
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AACA,OAAO,yBAAyB,CAAC;AAOjC,cAAc,SAAS,CAAA;AACvB,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAQA,cAAc,SAAS,CAAA;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,YAAY,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "related-ui-components",
-  "version": "2.1.0",
+  "version": "2.1.1",
   "main": "./src/index.ts",
   "scripts": {
     "start": "expo start",

package/src/contexts/BottomSheetContext.tsx

@@ -0,0 +1,27 @@
+import { createContext, useContext, ReactNode } from "react";
+
+interface BottomSheetContextProps {
+  openBottomSheet: (
+    content: ReactNode | (() => ReactNode),
+    size: "small" | "large",
+    onClose?: () => void,
+  ) => 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

@@ -0,0 +1,127 @@
+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 [onCloseCallback, setOnCloseCallback] = useState<(() => void) | null>(
+    null
+  );
+
+  const openBottomSheet = useCallback(
+    (
+      newContent: ReactNode | (() => ReactNode),
+      size: "small" | "large",
+      onClose?: () => void
+    ) => {
+      setContent(newContent);
+      setSize(size);
+      setOnCloseCallback(() => onClose);
+      setIsOpen(true);
+    },
+    []
+  );
+
+  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={["30%", "50%", "85%"]}
+        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
+    },
+  });

package/src/contexts/index.ts

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

package/src/index.ts

@@ -1,10 +1,11 @@
-import { registerRootComponent } from 'expo';
-import "react-native-reanimated";
+// import { registerRootComponent } from 'expo';
+// import "react-native-reanimated";
 
 
-import App from "./app";
+// import App from "./app";
 
-registerRootComponent(App);
+// registerRootComponent(App);
 
 export * from "./theme"
-export * from "./components";
+export * from "./components";
+export * from "./contexts";