fln-espranza 0.0.36 → 0.0.37

package/components/Drawer.tsx

@@ -1,116 +1,116 @@
-import React from "react";
-import { ScrollView, View, TouchableOpacity } from "react-native";
-import tw from "../lib/tailwind";
-import EText from "./EText";
-import Spacer from "./Spacer";
-import Avatar from "./Avatar";
-import { Colors } from "../utils/Color";
-import MenuItems from "./MenuItems";
-import EIconLogout from "./icons/EIconLogout";
-
-type menuItems = {
-  title: string;
-  icon: any;
-  screen: string;
-};
-
-interface IProps {
-  name: string;
-  profile: string;
-  menuItems: menuItems[];
-  secondMenuItems?: menuItems[];
-  secondMenuItemsTitle?: string;
-  navigation: any;
-  logout?: () => void;
-}
-
-const Drawer = ({ name, profile, menuItems, navigation, secondMenuItemsTitle, secondMenuItems, logout }: IProps) => {
-  return (
-    <ScrollView
-      scrollEnabled={true}
-      showsVerticalScrollIndicator={false}
-      style={{
-        position: "relative",
-        backgroundColor: "#ffffff",
-      }}
-    >
-      <View style={tw`mx-4 pt-4`}>
-        <Spacer height={30} />
-
-        <View style={tw`flex w-full mt-5`}>
-          <View style={tw`flex-row items-center`}>
-            <Avatar
-              size="sm"
-              source={""}
-              nameFirstLetter={name?.split("")[0]}
-            />
-            <View style={tw`ml-3`}>
-              <EText size={"xl"} style={tw`font-bold -mt-1`}>
-                {name}
-              </EText>
-              <EText
-                size="sm"
-                style={[
-                  tw`font-normal`,
-                  {
-                    color: Colors["text-body"],
-                  },
-                ]}
-              >
-                {profile}
-              </EText>
-            </View>
-          </View>
-        </View>
-
-        <Spacer height={30} />
-        {menuItems.map((item, index) => {
-          return (
-            <MenuItems
-              key={index}
-              title={item.title}
-              icon={item.icon}
-              onPress={() => navigation.navigate(item.screen)}
-            />
-          );
-        })}
-
-        {secondMenuItemsTitle 
-          ? 
-          <EText size="base" style={tw`my-5 mr-2 pb-2 text-slate-500 border-b border-[${Colors.border}] font-normal`}>
-          My Cluster
-        </EText> 
-        : 
-        <></>
-        }
-        {
-          secondMenuItems && secondMenuItems?.length > 0
-            ?
-            secondMenuItems.map((item, index) => {
-              return (
-                <MenuItems
-                  key={index}
-                  title={item.title}
-                  icon={item.icon}
-                  onPress={() => navigation.navigate(item.screen)}
-                />)
-            })
-            : <></>
-        }
-
-        <MenuItems
-          title={"Logout"}
-          icon={
-            <EIconLogout
-              size={24}
-              style={tw`text-[${Colors["primary-base"]}]`}
-            />
-          }
-          onPress={() => logout && logout()}
-        />
-      </View>
-    </ScrollView>
-  );
-};
-
-export default Drawer;
+import React from "react";
+import { ScrollView, View, TouchableOpacity } from "react-native";
+import tw from "../lib/tailwind";
+import EText from "./EText";
+import Spacer from "./Spacer";
+import Avatar from "./Avatar";
+import { Colors } from "../utils/Color";
+import MenuItems from "./MenuItems";
+import EIconLogout from "./icons/EIconLogout";
+
+type menuItems = {
+  title: string;
+  icon: any;
+  screen: string;
+};
+
+interface IProps {
+  name: string;
+  profile: string;
+  menuItems: menuItems[];
+  secondMenuItems?: menuItems[];
+  secondMenuItemsTitle?: string;
+  navigation: any;
+  logout?: () => void;
+}
+
+const Drawer = ({ name, profile, menuItems, navigation, secondMenuItemsTitle, secondMenuItems, logout }: IProps) => {
+  return (
+    <ScrollView
+      scrollEnabled={true}
+      showsVerticalScrollIndicator={false}
+      style={{
+        position: "relative",
+        backgroundColor: "#ffffff",
+      }}
+    >
+      <View style={tw`mx-4 pt-4`}>
+        <Spacer height={30} />
+
+        <View style={tw`flex w-full mt-5`}>
+          <View style={tw`flex-row items-center`}>
+            <Avatar
+              size="sm"
+              source={""}
+              nameFirstLetter={name?.split("")[0]}
+            />
+            <View style={tw`ml-3`}>
+              <EText size={"xl"} style={tw`font-bold -mt-1`}>
+                {name}
+              </EText>
+              <EText
+                size="sm"
+                style={[
+                  tw`font-normal`,
+                  {
+                    color: Colors["text-body"],
+                  },
+                ]}
+              >
+                {profile}
+              </EText>
+            </View>
+          </View>
+        </View>
+
+        <Spacer height={30} />
+        {menuItems.map((item, index) => {
+          return (
+            <MenuItems
+              key={index}
+              title={item.title}
+              icon={item.icon}
+              onPress={() => navigation.navigate(item.screen)}
+            />
+          );
+        })}
+
+        {secondMenuItemsTitle 
+          ? 
+          <EText size="base" style={tw`my-5 mr-2 pb-2 text-slate-500 border-b border-[${Colors.border}] font-normal`}>
+          My Cluster
+        </EText> 
+        : 
+        <></>
+        }
+        {
+          secondMenuItems && secondMenuItems?.length > 0
+            ?
+            secondMenuItems.map((item, index) => {
+              return (
+                <MenuItems
+                  key={index}
+                  title={item.title}
+                  icon={item.icon}
+                  onPress={() => navigation.navigate(item.screen)}
+                />)
+            })
+            : <></>
+        }
+
+        <MenuItems
+          title={"Logout"}
+          icon={
+            <EIconLogout
+              size={24}
+              style={tw`text-[${Colors["primary-base"]}]`}
+            />
+          }
+          onPress={() => logout && logout()}
+        />
+      </View>
+    </ScrollView>
+  );
+};
+
+export default Drawer;

package/components/EBadge.tsx

@@ -1,24 +1,24 @@
-import React from 'react'
-import { View } from 'react-native'
-import tw from '../lib/tailwind';
-import EText from './EText';
-import { CheckCircleIcon } from 'react-native-heroicons/solid';
-
-
-interface IProps {
-    text: string;
-    bgColor: string;
-    textColor: string
-    completed?: boolean;
-}
-
-export default function EBadge({ text, completed, bgColor, textColor }: IProps) {
-    return (
-        <View style={[tw`flex-row p-1  px-2 bg-[${bgColor}] rounded-full`,]}>
-            {completed ? <CheckCircleIcon style={tw`text-white -ml-1 mr-1`} size={16} /> : null}
-            <EText size='xs' style={tw`font-semibold text-[${textColor}]`}>
-                {text}
-            </EText>
-        </View>
-    )
-}
+import React from 'react'
+import { View } from 'react-native'
+import tw from '../lib/tailwind';
+import EText from './EText';
+import { CheckCircleIcon } from 'react-native-heroicons/solid';
+
+
+interface IProps {
+    text: string;
+    bgColor: string;
+    textColor: string
+    completed?: boolean;
+}
+
+export default function EBadge({ text, completed, bgColor, textColor }: IProps) {
+    return (
+        <View style={[tw`flex-row p-1  px-2 bg-[${bgColor}] rounded-full`,]}>
+            {completed ? <CheckCircleIcon style={tw`text-white -ml-1 mr-1`} size={16} /> : null}
+            <EText size='xs' style={tw`font-semibold text-[${textColor}]`}>
+                {text}
+            </EText>
+        </View>
+    )
+}

package/components/EButton.tsx

@@ -1,71 +1,70 @@
-import {
-  View,
-  Text,
-  TouchableOpacity,
-  TouchableOpacityProps,
-} from "react-native";
-import React from "react";
-import tw from "../lib/tailwind";
-import EText from "./EText";
-import { Colors } from "../utils/Color";
-
-interface EButtonProps extends TouchableOpacityProps {
-  iconL?: JSX.Element;
-  iconR?: JSX.Element;
-  inline?: boolean;
-  small?: boolean;
-  type?: "secondary" | "clear" | "primary";
-  disabled?: boolean;
-  children: any;
-}
-
-export default function EButton({
-  // label,
-  children,
-  iconL,
-  iconR,
-  inline,
-  small,
-  type,
-  disabled,
-  ...props
-}: EButtonProps) {
-  return (
-    <TouchableOpacity
-      activeOpacity={0.8}
-      disabled={disabled}
-      {...props}
-      style={[tw`${inline ? "items-start" : ""}`, {}]}
-    >
-      <View
-        style={[
-          tw`flex-row justify-center items-center px-8 rounded-full ${small ? 'h-10' : 'h-14'} ${disabled ? "opacity-40" : ""} ${
-            type === "clear"
-              ? "bg-transparent"
-              : type === "secondary"
-              ? `bg-[${Colors["secondary-base"]}] self-start px-5 h-11`
-              : `bg-[${Colors["primary-base"]}]`
-          }`,
-        ]}
-      >
-        {/* ICON LEFT */}
-        {iconL ? <View style={tw`mr-1 -ml-2`}>{iconL}</View> : null}
-        {/* LABEL */}
-        <EText
-          size={"sm"}
-          style={[
-            tw`font-semibold ${
-              type === "clear" ? `text-[${Colors["primary-base"]}]` : "text-white"
-            }`,
-          ]}
-        >
-          {children } 
-        </EText>
-
-        {/* ICON RIGHT */}
-        {iconR ? <View style={tw`ml-1 -mr-2`}>{iconR}</View> : null}
-      </View>
-    </TouchableOpacity>
-  );
-}
-
+import {
+  View,
+  TouchableOpacity,
+  TouchableOpacityProps,
+} from "react-native";
+import React from "react";
+import tw from "../lib/tailwind";
+import EText from "./EText";
+import { Colors } from "../utils/Color";
+
+interface EButtonProps extends TouchableOpacityProps {
+  iconL?: JSX.Element;
+  iconR?: JSX.Element;
+  inline?: boolean;
+  small?: boolean;
+  type?: "secondary" | "clear" | "primary";
+  disabled?: boolean;
+  children: any;
+}
+
+export default function EButton({
+  // label,
+  children,
+  iconL,
+  iconR,
+  inline,
+  small,
+  type,
+  disabled,
+  ...props
+}: EButtonProps) {
+  return (
+    <TouchableOpacity
+      activeOpacity={0.8}
+      disabled={disabled}
+      {...props}
+      style={[tw`${inline ? "items-start" : ""}`, {}]}
+    >
+      <View
+        style={[
+          tw`flex-row justify-center items-center rounded-full border-2 border-black/5 ${small ? 'h-11 px-6' : 'h-14 px-8'} ${disabled ? "opacity-40" : ""} ${
+            type === "clear"
+              ? "bg-transparent "
+              : type === "secondary"
+              ? `bg-[${Colors["secondary-base"]}] self-start px-6 h-11`
+              : `bg-[${Colors["primary-base"]}] shadow shadow-[${Colors["primary-base"]}]`
+          }`,
+        ]}
+      >
+        {/* ICON LEFT */}
+        {iconL ? <View style={tw`mr-1 -ml-2`}>{iconL}</View> : null}
+        {/* LABEL */}
+        <EText
+          size={"sm"}
+          style={[
+            tw`font-semibold ${
+              type === "clear" ? `text-[${Colors["primary-base"]}]` : "text-white"
+            }`,
+          ]}
+        >
+          {children } 
+        </EText>
+
+        {/* ICON RIGHT */}
+        {iconR ? <View style={tw`ml-1 -mr-2`}>{iconR}</View> : null}
+      </View>
+    </TouchableOpacity>
+  );
+}
+

package/components/EDateAndTimeCard.tsx

@@ -1,51 +1,51 @@
-import React from "react";
-import { View } from "react-native";
-import tw from "../lib/tailwind";
-import { Colors } from "../utils/Color";
-import EText from "./EText";
-import EIconClock from "./icons/EIconClock";
-
-interface IProps {
-  date: string;
-  month: string;
-  day?: string;
-  time?: string;
-
-}
-
-export default function EDateAndTimeCard({ date, month, day, time }: IProps) {
-  return (
-    <View
-      style={[tw`flex-row pb-4`, { borderBottomColor: Colors.border }]}
-    >
-      <View
-        style={[
-          tw`rounded-lg px-3 py-1 items-center justify-center`,
-          { backgroundColor: Colors["primary-base"] },
-        ]}
-      >
-        <EText size="xl" style={tw`font-bold text-white -mb-1`}>
-          {date}
-        </EText>
-        <EText size="xs" style={tw`font-bold text-white uppercase opacity-80`}>
-          {month}
-        </EText>
-      </View>
-      <View style={tw`ml-3 justify-center`}>
-        {/* <EText size="base" style={tw`font-bold text-black opacity-80 -mb-1`}>
-          {day}
-        </EText> */}
-        {
-          time ?<View style={tw`flex-row justify-center items-center mt-2`}>
-          <EIconClock size={16} style={tw`text-slate-500`} />
-          <EText
-            size="sm"
-            style={tw`ml-1 text-slate-500`}
-          >
-            {time}
-          </EText>
-        </View> : null}
-      </View>
-    </View>
-  );
-}
+import React from "react";
+import { View } from "react-native";
+import tw from "../lib/tailwind";
+import { Colors } from "../utils/Color";
+import EText from "./EText";
+import EIconClock from "./icons/EIconClock";
+
+interface IProps {
+  date: string;
+  month: string;
+  day?: string;
+  time?: string;
+
+}
+
+export default function EDateAndTimeCard({ date, month, day, time }: IProps) {
+  return (
+    <View
+      style={[tw`flex-row pb-4`, { borderBottomColor: Colors.border }]}
+    >
+      <View
+        style={[
+          tw`rounded-lg px-3 py-1 items-center justify-center`,
+          { backgroundColor: Colors["primary-base"] },
+        ]}
+      >
+        <EText size="xl" style={tw`font-bold text-white -mb-1`}>
+          {date}
+        </EText>
+        <EText size="xs" style={tw`font-bold text-white uppercase opacity-80`}>
+          {month}
+        </EText>
+      </View>
+      <View style={tw`ml-3 justify-center`}>
+        {/* <EText size="base" style={tw`font-bold text-black opacity-80 -mb-1`}>
+          {day}
+        </EText> */}
+        {
+          time ?<View style={tw`flex-row justify-center items-center mt-2`}>
+          <EIconClock size={16} style={tw`text-slate-500`} />
+          <EText
+            size="sm"
+            style={tw`ml-1 text-slate-500`}
+          >
+            {time}
+          </EText>
+        </View> : null}
+      </View>
+    </View>
+  );
+}

package/components/EDateInput.tsx

@@ -1,55 +1,55 @@
-import moment from 'moment'
-import React, { useState } from 'react'
-import { View, TouchableOpacity } from 'react-native'
-import DateTimePicker from '@react-native-community/datetimepicker';
-import tw from '../../../lib/tailwind'
-import { CalendarIcon } from 'react-native-heroicons/outline';
-import  EText  from './EText';
-import ELabel from './ELabel';
-import { Colors } from 'fln-espranza/utils/Color'
-
-interface IProps {
-    label: string;
-    value: string;
-    onChange: (value: string) => void;
-    style?: any;
-    placeholder?: string;
-    maxDate?: Date;
-    minDate?: Date;
-}
-
-export default function EDateInput({ label, value, style, placeholder, maxDate, minDate, onChange }: IProps) {
-    const [show, setShow] = useState(false);
-
-    const handleOnChange = (event: any, selectedDate: any) => {
-        const currentDate = selectedDate;
-        setShow(false);
-        onChange(currentDate)
-    }
-
-    return (
-
-        <View style={[tw`mb-4 `, style]}>
-            <ELabel label={label} />
-            <TouchableOpacity
-                style={tw`h-12 rounded-lg px-4 flex-row justify-between items-center border border-slate-300 lowercase my-2 bg-white`}
-                onPress={() => setShow(true)}
-            >
-                <EText size={"sm"} style={tw`font-normal text-slate-400`}>
-                    {
-                        value ? moment(value).format("DD/MM/YYYY") : "Select Date"
-                    }
-                </EText>
-                {show ? <DateTimePicker
-                    testID="dateTimePicker"
-                    value={value ? new Date(value) : new Date()}
-                    mode={"date"}
-                    onChange={handleOnChange}
-                    minimumDate={minDate}
-                    maximumDate={maxDate}
-                /> : <></>}
-                <CalendarIcon size={20} style={tw`text-[${Colors["primary-base"]}]`} />
-            </TouchableOpacity>
-        </View>
-    )
-}
+import moment from 'moment'
+import React, { useState } from 'react'
+import { View, TouchableOpacity } from 'react-native'
+import DateTimePicker from '@react-native-community/datetimepicker';
+import tw from '../../../lib/tailwind'
+import { CalendarIcon } from 'react-native-heroicons/outline';
+import  EText  from './EText';
+import ELabel from './ELabel';
+import { Colors } from 'fln-espranza/utils/Color'
+
+interface IProps {
+    label: string;
+    value: string;
+    onChange: (value: string) => void;
+    style?: any;
+    placeholder?: string;
+    maxDate?: Date;
+    minDate?: Date;
+}
+
+export default function EDateInput({ label, value, style, placeholder, maxDate, minDate, onChange }: IProps) {
+    const [show, setShow] = useState(false);
+
+    const handleOnChange = (event: any, selectedDate: any) => {
+        const currentDate = selectedDate;
+        setShow(false);
+        onChange(currentDate)
+    }
+
+    return (
+
+        <View style={[tw`mb-4 `, style]}>
+            <ELabel label={label} />
+            <TouchableOpacity
+                style={tw`h-12 rounded-lg px-4 flex-row justify-between items-center border border-slate-300 lowercase my-2 bg-white`}
+                onPress={() => setShow(true)}
+            >
+                <EText size={"sm"} style={tw`font-normal text-slate-400`}>
+                    {
+                        value ? moment(value).format("DD/MM/YYYY") : "Select Date"
+                    }
+                </EText>
+                {show ? <DateTimePicker
+                    testID="dateTimePicker"
+                    value={value ? new Date(value) : new Date()}
+                    mode={"date"}
+                    onChange={handleOnChange}
+                    minimumDate={minDate}
+                    maximumDate={maxDate}
+                /> : <></>}
+                <CalendarIcon size={20} style={tw`text-[${Colors["primary-base"]}]`} />
+            </TouchableOpacity>
+        </View>
+    )
+}