@hoddy-ui/core 1.0.19 → 1.0.21

package/package.json

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

package/src/Components/Checkbox.tsx

@@ -1,19 +1,14 @@
-import {
-  Pressable,
-  StyleSheet,
-  Text,
-  TouchableOpacity,
-  View,
-} from "react-native";
-import React, { FC } from "react";
 import { MaterialCommunityIcons } from "@expo/vector-icons";
+import React, { FC } from "react";
+import { TouchableOpacity, View } from "react-native";
+import { ScaledSheet } from "react-native-size-matters";
 import { useColors } from "../hooks";
 import { CheckboxProps } from "../types";
-import { ScaledSheet } from "react-native-size-matters";
 
-const CheckBox: FC<CheckboxProps> = ({
+export const CheckBox: FC<CheckboxProps> = ({
   color = "primary",
   checked,
+  size = 24,
   label,
   style = {},
   onChange,
@@ -27,12 +22,6 @@ const CheckBox: FC<CheckboxProps> = ({
       flexDirection: "row",
       ...style,
     },
-    title: {
-      fontSize: 16,
-      color: "#000",
-      marginLeft: 5,
-      fontWeight: "600",
-    },
   });
 
   return (
@@ -40,7 +29,7 @@ const CheckBox: FC<CheckboxProps> = ({
       <TouchableOpacity onPress={onChange}>
         <MaterialCommunityIcons
           name={iconName}
-          size={24}
+          size={size}
           color={colors[color].main}
         />
       </TouchableOpacity>
@@ -48,5 +37,3 @@ const CheckBox: FC<CheckboxProps> = ({
     </View>
   );
 };
-
-export default CheckBox;

package/src/Components/FlashMessage.tsx

@@ -18,23 +18,28 @@ export let showFlashMessage: (msg: FlashMessageProps) => void = () => {
 
 const FlashMessage: React.FC = () => {
   const { top } = useSafeAreaInsets();
-  const [show, setShow] = useState<null | FlashMessageProps>(null);
+  const [message, setMessage] = useState<null | FlashMessageProps>(null);
+  const [show, setShow] = useState(false);
   const colors = useColors();
-  const type = show?.type || "success";
+  const type = message?.type || "success";
 
   showFlashMessage = (msg: FlashMessageProps) => {
+    setMessage(msg);
     setTimeout(() => {
-      setShow(msg);
+      setShow(true);
     }, 50);
 
     setTimeout(() => {
-      setShow(null);
+      setShow(false);
+      setTimeout(() => {
+        setMessage(null);
+      }, 500);
     }, msg.duration || 2000);
+
     console.log("done", msg);
   };
   useEffect(() => {
     LayoutAnimation.configureNext(LayoutAnimation.Presets.easeInEaseOut);
-    console.log("show", show);
   }, [show]);
 
   const styles = ScaledSheet.create({
@@ -65,22 +70,22 @@ const FlashMessage: React.FC = () => {
     <View style={styles.root}>
       <View style={{ flexDirection: "row" }}>
         <View style={{ flex: 1, marginRight: 10 }}>
-          {show?.title && (
+          {message?.title && (
             <Typography
               variant="h6"
               fontWeight={600}
               gutterBottom={3}
               style={{ color: "#fff" }}
             >
-              {show?.title}
+              {message?.title}
             </Typography>
           )}
-          <Typography style={{ color: "#fff" }}>{show?.message}</Typography>
+          <Typography style={{ color: "#fff" }}>{message?.message}</Typography>
         </View>
         {/* <MaterialIcons color="#fff" size={36} name="error-outline" /> */}
       </View>
 
-      {show?.actions?.map((cur) => (
+      {message?.actions?.map((cur) => (
         <TouchableOpacity style={styles.action}>
           <Typography fontWeight={700} style={{ color: "#fff" }}>
             {cur.title}

package/src/types.ts

@@ -103,6 +103,7 @@ export interface ButtonProps {
 export interface CheckboxProps {
   color?: colorTypes;
   label: ReactNode;
+  size: number;
   checked?: boolean;
   style?: ViewStyle;
   onChange?: () => void;