@hoddy-ui/core 2.5.7 → 2.5.8

package/next/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hoddy-ui/next",
-  "version": "2.0.48",
+  "version": "2.0.49",
   "description": "Core rich react native components written in typescript, with support for expo-router",
   "main": "./dist/index.js",
   "module": "./dist/index.mjs",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hoddy-ui/core",
-  "version": "2.5.7",
+  "version": "2.5.8",
   "description": "Core rich react native components written in typescript",
   "main": "index.ts",
   "repository": {

package/src/Components/Popup.tsx

@@ -17,12 +17,13 @@ import Animated, {
   useSharedValue,
   withTiming,
 } from "react-native-reanimated";
-import { ScaledSheet } from "react-native-size-matters";
+import { ms, ScaledSheet } from "react-native-size-matters";
 import { useColors, useTheme } from "../hooks";
 import { UIThemeProvider } from "../theme";
 import { PopupProps } from "../types";
 import { IconButton } from "./Button";
 import Typography from "./Typography";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
 
 export const Popup: React.FC<PopupProps> = ({
   title,
@@ -39,6 +40,7 @@ export const Popup: React.FC<PopupProps> = ({
   const theme = useTheme();
   const colors = useColors();
   const [modalVisible, setModalVisible] = useState(false);
+  const { bottom } = useSafeAreaInsets();
 
   // Animation values
   const backdropOpacity = useSharedValue(0);
@@ -94,13 +96,14 @@ export const Popup: React.FC<PopupProps> = ({
       width: sheet ? "100%" : undefined,
     },
     container: {
-      paddingBottom: sheet ? "30@ms" : undefined,
+      paddingBottom: sheet && !bare ? bottom + ms(10) : undefined,
       backgroundColor: theme === "dark" ? "#111" : colors.white[1],
       borderTopLeftRadius: 20,
       borderTopRightRadius: 20,
       borderBottomRightRadius: sheet ? 0 : 20,
       borderBottomLeftRadius: sheet ? 0 : 20,
       width: "100%",
+      overflow: "hidden",
       ...style,
     },
     content: {