fln-espranza 1.1.14 → 1.1.16

package/components/EButton.tsx

@@ -1,73 +1,73 @@
-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;
-  secondary?: boolean;
-  inline?: boolean;
-  small?: boolean;
-  type?: "secondary" | "clear" | "primary";
-  disabled?: boolean;
-  children: any;
-}
-
-export default function EButton({
-  // label,
-  children,
-  iconL,
-  iconR,
-  secondary,
-  inline,
-  small,
-  type,
-  disabled,
-  ...props
-}: EButtonProps) {
-  return (
-    <TouchableOpacity
-      activeOpacity={0.8}
-      disabled={disabled}
-      {...props}
-      style={[tw`${inline ? "items-start" : ""}`, {}]}
-    >
-      <View
-        style={[
-          tw`h-14 flex-row justify-center items-center px-8 rounded-full ${disabled ? "opacity-60" : ""} ${
-            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,
+  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;
+  secondary?: boolean;
+  inline?: boolean;
+  small?: boolean;
+  type?: "secondary" | "clear" | "primary";
+  disabled?: boolean;
+  children: any;
+}
+
+export default function EButton({
+  // label,
+  children,
+  iconL,
+  iconR,
+  secondary,
+  inline,
+  small,
+  type,
+  disabled,
+  ...props
+}: EButtonProps) {
+  return (
+    <TouchableOpacity
+      activeOpacity={0.8}
+      disabled={disabled}
+      {...props}
+      style={[tw`${inline ? "items-start" : ""}`, {}]}
+    >
+      <View
+        style={[
+          tw`h-14 flex-row justify-center items-center px-8 rounded-full ${disabled ? "opacity-60" : ""} ${
+            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={"base"}
+          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,50 +1,50 @@
-import React from "react";
-import { View } from "react-native";
-import { ClockIcon } from "react-native-heroicons/solid";
-import tw from "../lib/tailwind";
-import { Colors } from "../utils/Color";
-import EText from "./EText";
-
-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 border-b`, { borderBottomColor: Colors.border }]}
-    >
-      <View
-        style={[
-          tw`rounded-xl mb-2 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`}>
-          {month}
-        </EText>
-      </View>
-      <View style={tw`ml-3`}>
-        <EText size="base" style={tw`font-bold text-black opacity-80 -mb-1`}>
-          {day}
-        </EText>
-        <View style={tw`flex-row justify-center items-center mt-2`}>
-          <ClockIcon size={14} style={tw`text-slate-400`} />
-          <EText
-            size="sm"
-            style={tw`ml-0.5 text-slate-400 font-medium`}
-          >
-            {time}
-          </EText>
-        </View>
-      </View>
-    </View>
-  );
-}
+import React from "react";
+import { View } from "react-native";
+import { ClockIcon } from "react-native-heroicons/solid";
+import tw from "../lib/tailwind";
+import { Colors } from "../utils/Color";
+import EText from "./EText";
+
+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 border-b`, { borderBottomColor: Colors.border }]}
+    >
+      <View
+        style={[
+          tw`rounded-xl mb-2 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`}>
+          {month}
+        </EText>
+      </View>
+      <View style={tw`ml-3`}>
+        <EText size="base" style={tw`font-bold text-black opacity-80 -mb-1`}>
+          {day}
+        </EText>
+        <View style={tw`flex-row justify-center items-center mt-2`}>
+          <ClockIcon size={14} style={tw`text-slate-400`} />
+          <EText
+            size="sm"
+            style={tw`ml-0.5 text-slate-400 font-medium`}
+          >
+            {time}
+          </EText>
+        </View>
+      </View>
+    </View>
+  );
+}

package/components/EDateInput.tsx

@@ -1,57 +1,55 @@
-import moment from 'moment'
-import React, { useState } from 'react'
-import { View, TouchableOpacity } from 'react-native'
-import { ClockIcon } from 'react-native-heroicons/solid'
-import { onChange } from 'react-native-reanimated'
-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';
-
-interface IProps {
-    label: string;
-    value: string;
-    onChange: (value: string) => void;
-    style?: string;
-    maxDate?: Date;
-    minDate?: Date;
-}
-
-export default function EDateInput({ label, value, style, maxDate, minDate, onChange }: IProps) {
-    // const [date, setDate] = useState(new Date());
-    const [show, setShow] = useState(false);
-
-    const handleOnChange = (event: any, selectedDate: any) => {
-        const currentDate = selectedDate;
-        setShow(false);
-        // setDate(currentDate);
-        onChange(moment(currentDate).format(" MMM DD, YYYY"));
-    }
-
-    return (
-
-        <View style={tw`flex-1 ${style ? 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`}>
-                    {
-                        value ? value : "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-slate-500`} />
-            </TouchableOpacity>
-        </View>
-    )
-}
+import moment from 'moment'
+import React, { useState } from 'react'
+import { View, TouchableOpacity } from 'react-native'
+import { ClockIcon } from 'react-native-heroicons/solid'
+import { onChange } from 'react-native-reanimated'
+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';
+
+interface IProps {
+    label: string;
+    value: string;
+    onChange: (value: string) => void;
+    style?: string;
+    maxDate?: Date;
+    minDate?: Date;
+}
+
+export default function EDateInput({ label, value, style, 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`flex-1 ${style ? 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`}>
+                    {
+                        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-slate-500`} />
+            </TouchableOpacity>
+        </View>
+    )
+}

package/components/EErrorText.tsx

@@ -1,19 +1,19 @@
-import React from 'react';
-import { View } from 'react-native';
-import tw from '../lib/tailwind';
-import EText from './EText';
-
-
-interface IProps {
-    error: string;
-}
-
-export default function EErrorText( { error }: IProps ) {
-  return (
-    <View>
-        <EText size={"xs"} style={tw`text-red-500`}>
-            {error}
-        </EText>
-    </View>
-  )
-}
+import React from 'react';
+import { View } from 'react-native';
+import tw from '../lib/tailwind';
+import EText from './EText';
+
+
+interface IProps {
+    error: string;
+}
+
+export default function EErrorText( { error }: IProps ) {
+  return (
+    <View>
+        <EText size={"xs"} style={tw`text-red-500`}>
+            {error}
+        </EText>
+    </View>
+  )
+}

package/components/EInfoBox.tsx

@@ -1,41 +1,41 @@
-import { View, Text } from "react-native";
-import React from "react";
-import tw from "../lib/tailwind";
-import EText from "./EText";
-import { Style } from "twrnc/dist/esm/types";
-
-interface InfoBoxProps {
-  title?: string;
-  icon: JSX.Element;
-  children: string;
-  color?: string;
-  style?: Style;
-  childTextColor?: string;
-}
-
-export default function InfoBox({
-  title,
-  icon,
-  color,
-  children,
-  style,
-  childTextColor,
-}: InfoBoxProps) {
-  return (
-    <View style={[tw.style("rounded-lg"), style]}>
-      <View style={tw`flex-row`}>
-        <View style={tw`w-5 h-5 mr-1`}>{icon}</View>
-        <View style={tw`flex-1`}>
-          {title ? (
-            <EText size="sm" style={tw`font-semibold mb-1 text-${color ? color : "white"}`}>
-              {title}
-            </EText>
-          ) : null}
-          <EText size="xs" style={[tw`font-medium`, {color: childTextColor}]}>
-            {children}
-          </EText>
-        </View>
-      </View>
-    </View>
-  );
-}
+import { View, Text } from "react-native";
+import React from "react";
+import tw from "../lib/tailwind";
+import EText from "./EText";
+import { Style } from "twrnc/dist/esm/types";
+
+interface InfoBoxProps {
+  title?: string;
+  icon: JSX.Element;
+  children: string;
+  color?: string;
+  style?: Style;
+  childTextColor?: string;
+}
+
+export default function InfoBox({
+  title,
+  icon,
+  color,
+  children,
+  style,
+  childTextColor,
+}: InfoBoxProps) {
+  return (
+    <View style={[tw.style("rounded-lg"), style]}>
+      <View style={tw`flex-row`}>
+        <View style={tw`w-5 h-5 mr-1`}>{icon}</View>
+        <View style={tw`flex-1`}>
+          {title ? (
+            <EText size="sm" style={tw`font-semibold mb-1 text-${color ? color : "white"}`}>
+              {title}
+            </EText>
+          ) : null}
+          <EText size="xs" style={[tw`font-medium`, {color: childTextColor}]}>
+            {children}
+          </EText>
+        </View>
+      </View>
+    </View>
+  );
+}

package/components/EInput.tsx

@@ -32,7 +32,7 @@ export default function EInput({
 
       <View
         style={tw`h-12 rounded-lg px-4 flex-row items-center border border-slate-300 lowercase mt-2 ${
-          hasFocus ? "border-black" : ""
+          hasFocus ? "border-black shadow-md" : ""
         }`}
       >
         <TextInput

package/components/ELabel.tsx

@@ -1,15 +1,15 @@
-import React from 'react'
-import tw from '../lib/tailwind'
-import EText from './EText';
-
-interface IProps{
-    label: string;
-}
-
-export default function ELabel( {label }: IProps ) {
-  return (
-    <EText style={tw`text-sm font-semibold text-slate-500`}>
-        {label}
-    </EText>
-  )
-}
+import React from 'react'
+import tw from '../lib/tailwind'
+import EText from './EText';
+
+interface IProps{
+    label: string;
+}
+
+export default function ELabel( {label }: IProps ) {
+  return (
+    <EText style={tw`text-sm font-semibold text-slate-500`}>
+        {label}
+    </EText>
+  )
+}

package/components/EOtpInputBox.tsx

@@ -1,49 +1,49 @@
-import { View, Image, TextInput, TextInputProps } from "react-native";
-import React, { useState } from "react";
-import EText from "./EText";
-import tw from "../lib/tailwind";
-import { AtSymbolIcon } from "react-native-heroicons/outline";
-import { Colors } from "../utils/Color";
-
-interface EInputProps extends TextInputProps {
-  label?: string;
-  icon?:string;
-  val?: string;
-  setVal?: any;
-  maxLength?: number;
-  reff?: any;
-}
-
-export default function EOtpInput({label, icon,val,setVal, maxLength, reff, ...props }:EInputProps) {
-  const [hasFocus, setHasFocus] = useState(false);
-  return (
-    <View>
-      <EText size="sm" style={tw`font-bold opacity-50`}>
-        {label}
-      </EText>
-      <View
-        style={tw`bg-[${Colors["primary-light"]}] h-12 rounded-lg px-4 flex-row items-center border border-blue-100 ${
-          hasFocus ? `border-black bg-white shadow-lg shadow-blue-400` : ""
-        }`}
-      >
-        {icon ? <Image
-          source={icon}
-          style={[
-            tw`mr-2 opacity-40 ${hasFocus ? "opacity-100 tint-blue-700" : ""}`,
-            { width: 24, height: 24 },
-          ]}
-        /> : null}
-        <TextInput
-          {...props}
-          style={[tw`flex-1 text-base`, { lineHeight: 20 }]}
-          onFocus={() => setHasFocus(!hasFocus)}
-          onBlur={() => setHasFocus(!hasFocus)}
-          placeholderTextColor={"#AEB3BC"}
-          onChangeText={(val) => setVal(val)}
-          maxLength={maxLength} 
-          ref={reff}
-        />
-      </View>
-    </View>
-  );
-}
+import { View, Image, TextInput, TextInputProps } from "react-native";
+import React, { useState } from "react";
+import EText from "./EText";
+import tw from "../lib/tailwind";
+import { AtSymbolIcon } from "react-native-heroicons/outline";
+import { Colors } from "../utils/Color";
+
+interface EInputProps extends TextInputProps {
+  label?: string;
+  icon?:string;
+  val?: string;
+  setVal?: any;
+  maxLength?: number;
+  reff?: any;
+}
+
+export default function EOtpInput({label, icon,val,setVal, maxLength, reff, ...props }:EInputProps) {
+  const [hasFocus, setHasFocus] = useState(false);
+  return (
+    <View>
+      <EText size="sm" style={tw`font-bold opacity-50`}>
+        {label}
+      </EText>
+      <View
+        style={tw`bg-[${Colors["primary-light"]}] h-12 rounded-lg px-4 flex-row items-center border border-blue-100 ${
+          hasFocus ? `border-black bg-white shadow-lg shadow-blue-400` : ""
+        }`}
+      >
+        {icon ? <Image
+          source={icon}
+          style={[
+            tw`mr-2 opacity-40 ${hasFocus ? "opacity-100 tint-blue-700" : ""}`,
+            { width: 24, height: 24 },
+          ]}
+        /> : null}
+        <TextInput
+          {...props}
+          style={[tw`flex-1 text-base`, { lineHeight: 20 }]}
+          onFocus={() => setHasFocus(!hasFocus)}
+          onBlur={() => setHasFocus(!hasFocus)}
+          placeholderTextColor={"#AEB3BC"}
+          onChangeText={(val) => setVal(val)}
+          maxLength={maxLength} 
+          ref={reff}
+        />
+      </View>
+    </View>
+  );
+}

package/components/EPageDescription.tsx

@@ -1,19 +1,19 @@
-import React from 'react'
-import tw from '../lib/tailwind'
-import { Colors } from '../utils/Color';
-import EText from './EText';
-
-interface IProps{
-    text: string;
-}
-
-export default function EPageDescription({text}: IProps) {
-  return (
-    <EText
-        size='sm'
-        style={[tw`font-normal`, {color: Colors['text-body']}]}
-    >
-        {text}
-    </EText>
-  )
-}
+import React from 'react'
+import tw from '../lib/tailwind'
+import { Colors } from '../utils/Color';
+import EText from './EText';
+
+interface IProps{
+    text: string;
+}
+
+export default function EPageDescription({text}: IProps) {
+  return (
+    <EText
+        size='sm'
+        style={[tw`font-normal`, {color: Colors['text-body']}]}
+    >
+        {text}
+    </EText>
+  )
+}