fln-espranza 0.0.1 → 0.0.2

package/components/ProgressBar.tsx

@@ -1,33 +1,33 @@
-import React, { useEffect, useRef, useState } from 'react'
-import { Animated,StyleSheet, View } from 'react-native';
-import tw from "../lib/tailwind";
-import { Colors } from "../utils/Color";
-
-interface IProps{
-    progress: number;
-}
-
-export default function ProgressBar( {progress}: IProps) {
-
-
-    const barWidth = useRef(new Animated.Value(0)).current;
-
-    useEffect(() => {
-        Animated.spring(barWidth, {
-            toValue: progress,
-            bounciness: 0,
-            speed: 7,
-            useNativeDriver: false,
-        }).start();
-    }, [progress]);
-    return (
-        <View style={[tw`h-2 w-14 bg-[${Colors['primary-light']}] overflow-hidden mr-2`, {
-            borderRadius: 40,
-        }]}>
-            <Animated.View
-                style={[StyleSheet.absoluteFill, { backgroundColor: Colors['primary-base'], width: barWidth }]}
-
-            />
-        </View>
-    )
-}
+import React, { useEffect, useRef, useState } from 'react'
+import { Animated,StyleSheet, View } from 'react-native';
+import tw from "../lib/tailwind";
+import { Colors } from "../utils/Color";
+
+interface IProps{
+    progress: number;
+}
+
+export default function ProgressBar( {progress}: IProps) {
+
+
+    const barWidth = useRef(new Animated.Value(0)).current;
+
+    useEffect(() => {
+        Animated.spring(barWidth, {
+            toValue: progress,
+            bounciness: 0,
+            speed: 7,
+            useNativeDriver: false,
+        }).start();
+    }, [progress]);
+    return (
+        <View style={[tw`h-2 w-14 bg-[${Colors['primary-light']}] overflow-hidden mr-2`, {
+            borderRadius: 40,
+        }]}>
+            <Animated.View
+                style={[StyleSheet.absoluteFill, { backgroundColor: Colors['primary-base'], width: barWidth }]}
+
+            />
+        </View>
+    )
+}

package/components/SecondaryBaseLayout.tsx

@@ -1,120 +1,120 @@
-import {
-  View,
-  ImageBackground,
-  Dimensions,
-  Animated,
-  ScrollView,
-  Platform,
-} from "react-native";
-import React, { useEffect, useRef, useState } from "react";
-import { useSafeAreaInsets } from "react-native-safe-area-context";
-import tw from "../lib/tailwind";
-import EText from "./EText";
-import { StatusBar } from "expo-status-bar";
-import {
-  Container,
-  EButton,
-  EButtonIcon,
-  PageHeader,
-  PageHeaderSecondary,
-} from ".";
-import Constants from "expo-constants";
-import { useNavigation } from "@react-navigation/native";
-
-const SCREEN_WIDTH = Dimensions.get("window").width;
-const SCREEN_HEIGHT = Dimensions.get("window").height;
-const HEADER_HEIGHT = Constants.statusBarHeight + 60;
-const SCROLL_PADDING_BOTTOM = 100;
-
-interface BaseLayoutProps {
-  title: string;
-  subtitle?: string;
-  curved?: boolean;
-  headerContent?: JSX.Element;
-  children?: JSX.Element | JSX.Element[];
-  iconEnd?: JSX.Element;
-  noScroll?: boolean;
-  bottomButton?: JSX.Element;
-  border?: boolean;
-  menuButton?: boolean;
-}
-
-export default function SecondaryBaseLayout({
-  title,
-  subtitle,
-  curved,
-  headerContent,
-  children,
-  noScroll,
-  iconEnd,
-  bottomButton,
-  border,
-  menuButton,
-}: BaseLayoutProps) {
-  const insets = useSafeAreaInsets();
-
-  const navigation = useNavigation();
-
-  return (
-    <View
-      style={[
-        tw`flex-1 bg-white`,
-        {
-          paddingBottom: Platform.OS === "ios" ? insets.bottom : 0,
-          paddingTop: Platform.OS === "ios" ? 20 : 0,
-        },
-      ]}
-    >
-      <StatusBar style="dark" animated />
-
-      {/* HEADER */}
-      <View
-        style={[
-          tw`absolute top-0 right-0 left-0 pt-2 z-10 w-full bg-white  ${
-            title ? "mb-1" : "pb-0"
-          }`,
-        ]}
-      >
-        {/* <PageHeaderSecondary
-          title={title}
-          subtitle={subtitle}
-          button={
-            <EButtonIcon
-              type="close"
-              iconColor="slate-800"
-              onPress={() => navigation.goBack()}
-            />
-          }
-        /> */}
-        <PageHeader
-          border={border}
-          title={title}
-          subtitle={subtitle}
-          curved={curved}
-          iconEnd={iconEnd}
-          menuButton={menuButton}
-        >
-          {headerContent}
-        </PageHeader>
-      </View>
-      <ScrollView
-        style={[
-          tw`flex-1`,
-          { paddingBottom: insets.bottom, paddingTop: !title ? 80 : 80 },
-        ]}
-        showsVerticalScrollIndicator={false}
-        decelerationRate={"fast"}
-        contentContainerStyle={{
-          paddingBottom: SCROLL_PADDING_BOTTOM,
-        }}
-      >
-        {children}
-      </ScrollView>
-      {bottomButton ? (
-        <View style={tw` px-4 mb-6 `}>{bottomButton}</View>
-      ) : (
-        <></>
-      )}
-    </View>
-  );
-}
+import {
+  View,
+  ImageBackground,
+  Dimensions,
+  Animated,
+  ScrollView,
+  Platform,
+} from "react-native";
+import React, { useEffect, useRef, useState } from "react";
+import { useSafeAreaInsets } from "react-native-safe-area-context";
+import tw from "../lib/tailwind";
+import EText from "./EText";
+import { StatusBar } from "expo-status-bar";
+import {
+  Container,
+  EButton,
+  EButtonIcon,
+  PageHeader,
+  PageHeaderSecondary,
+} from ".";
+import Constants from "expo-constants";
+import { useNavigation } from "@react-navigation/native";
+
+const SCREEN_WIDTH = Dimensions.get("window").width;
+const SCREEN_HEIGHT = Dimensions.get("window").height;
+const HEADER_HEIGHT = Constants.statusBarHeight + 60;
+const SCROLL_PADDING_BOTTOM = 100;
+
+interface BaseLayoutProps {
+  title: string;
+  subtitle?: string;
+  curved?: boolean;
+  headerContent?: JSX.Element;
+  children?: JSX.Element | JSX.Element[];
+  iconEnd?: JSX.Element;
+  noScroll?: boolean;
+  bottomButton?: JSX.Element;
+  border?: boolean;
+  menuButton?: boolean;
+}
+
+export default function SecondaryBaseLayout({
+  title,
+  subtitle,
+  curved,
+  headerContent,
+  children,
+  noScroll,
+  iconEnd,
+  bottomButton,
+  border,
+  menuButton,
+}: BaseLayoutProps) {
+  const insets = useSafeAreaInsets();
+
+  const navigation = useNavigation();
+
+  return (
+    <View
+      style={[
+        tw`flex-1 bg-white`,
+        {
+          paddingBottom: Platform.OS === "ios" ? insets.bottom : 0,
+          paddingTop: Platform.OS === "ios" ? 20 : 0,
+        },
+      ]}
+    >
+      <StatusBar style="dark" animated />
+
+      {/* HEADER */}
+      <View
+        style={[
+          tw`absolute top-0 right-0 left-0 pt-2 z-10 w-full bg-white  ${
+            title ? "mb-1" : "pb-0"
+          }`,
+        ]}
+      >
+        {/* <PageHeaderSecondary
+          title={title}
+          subtitle={subtitle}
+          button={
+            <EButtonIcon
+              type="close"
+              iconColor="slate-800"
+              onPress={() => navigation.goBack()}
+            />
+          }
+        /> */}
+        <PageHeader
+          border={border}
+          title={title}
+          subtitle={subtitle}
+          curved={curved}
+          iconEnd={iconEnd}
+          menuButton={menuButton}
+        >
+          {headerContent}
+        </PageHeader>
+      </View>
+      <ScrollView
+        style={[
+          tw`flex-1`,
+          { paddingBottom: insets.bottom, paddingTop: !title ? 80 : 80 },
+        ]}
+        showsVerticalScrollIndicator={false}
+        decelerationRate={"fast"}
+        contentContainerStyle={{
+          paddingBottom: SCROLL_PADDING_BOTTOM,
+        }}
+      >
+        {children}
+      </ScrollView>
+      {bottomButton ? (
+        <View style={tw` px-4 mb-6 `}>{bottomButton}</View>
+      ) : (
+        <></>
+      )}
+    </View>
+  );
+}

package/components/Timer.tsx

@@ -1,57 +1,57 @@
-import React from "react";
-import { useState } from "react";
-import { TouchableOpacity } from "react-native";
-import tw from "../lib/tailwind";
-import { Colors } from "../utils/Color";
-import EText from "./EText";
-
-interface IProps {
-    time: number;
-    text: string;
-    subtext: string;
-    handleGetOTP: () => void;
-    sendOtp: boolean;
-    email: string;
-  }
-
-export default function Timer({ time, text, subtext, sendOtp, handleGetOTP,email }: IProps) {
-
-    const [timer, setTimer] = useState(time);
-    React.useEffect(() => {
-      setTimer(30);
-      return () => {
-        setTimer(0);
-      }
-    }, [sendOtp]);
-  
-    React.useEffect(() => {
-      timer > 0 &&
-        setTimeout(() => {
-          setTimer(timer - 1);
-        }, 1000);
-
-        return () => {
-          clearTimeout();
-        }
-    }, [timer]);
-
-    return(
-
-        <>
-       {timer > 0 ? <TouchableOpacity style={[tw`mt-2`, {}]}>
-            <EText size="sm" style={[tw`font-bold text-[${Colors["text-primary"]}]`, {}]}>
-            {timer > 0 && `${text}${timer >= 10 ? timer : "0" + timer}`}
-            </EText>
-        </TouchableOpacity> : 
-        <TouchableOpacity style={[tw`mt-2`, {}]} 
-            onPress={() =>  handleGetOTP()}
-        >
-            <EText size="sm" style={[tw`font-bold text-[${Colors["text-primary"]}]`, {}]}>
-            {subtext}
-            </EText>
-        </TouchableOpacity>
-        }
-        </>
-        
-    )
+import React from "react";
+import { useState } from "react";
+import { TouchableOpacity } from "react-native";
+import tw from "../lib/tailwind";
+import { Colors } from "../utils/Color";
+import EText from "./EText";
+
+interface IProps {
+    time: number;
+    text: string;
+    subtext: string;
+    handleGetOTP: () => void;
+    sendOtp: boolean;
+    email: string;
+  }
+
+export default function Timer({ time, text, subtext, sendOtp, handleGetOTP,email }: IProps) {
+
+    const [timer, setTimer] = useState(time);
+    React.useEffect(() => {
+      setTimer(30);
+      return () => {
+        setTimer(0);
+      }
+    }, [sendOtp]);
+  
+    React.useEffect(() => {
+      timer > 0 &&
+        setTimeout(() => {
+          setTimer(timer - 1);
+        }, 1000);
+
+        return () => {
+          clearTimeout();
+        }
+    }, [timer]);
+
+    return(
+
+        <>
+       {timer > 0 ? <TouchableOpacity style={[tw`mt-2`, {}]}>
+            <EText size="sm" style={[tw`font-bold text-[${Colors["text-primary"]}]`, {}]}>
+            {timer > 0 && `${text}${timer >= 10 ? timer : "0" + timer}`}
+            </EText>
+        </TouchableOpacity> : 
+        <TouchableOpacity style={[tw`mt-2`, {}]} 
+            onPress={() =>  handleGetOTP()}
+        >
+            <EText size="sm" style={[tw`font-bold text-[${Colors["text-primary"]}]`, {}]}>
+            {subtext}
+            </EText>
+        </TouchableOpacity>
+        }
+        </>
+        
+    )
 }

package/index.ts

@@ -1,76 +1,76 @@
-import Avatar from "./components/Avatar";
-import BaseLayout from "./components/BaseLayout";
-import Container from "./components/Container";
-import Drawer from "./components/Drawer";
-import EBadge from "./components/EBadge";
-import EButton from "./components/EButton";
-import EButtonIcon from "./components/EButtonIcon";
-import EDateAndTimeCard from "./components/EDateAndTimeCard";
-import EIcon from "./components/EIcon";
-import EInfoBox from "./components/EInfoBox";
-import EInput from "./components/EInput";
-import ELabel from "./components/ELabel";
-import EOtpInput from "./components/EOtpInputBox";
-import EPageDescription from "./components/EPageDescription";
-import EPillButton from "./components/EPillButton";
-import EProfile from "./components/EProfile";
-import ESegment from "./components/ESegment";
-import { ESegmentItem } from "./components/ESegment";
-import ETimeLineCard from "./components/ETimeLineCard";
-import ListFormView from "./components/ListFormView";
-import MenuItems from "./components/MenuItems";
-import SecondaryBaseLayout from "./components/SecondaryBaseLayout";
-import Timer from "./components/Timer";
-import EText from "./components/EText";
-import ModalLayout from "./components/ModalLayout";
-import PageHeader from "./components/PageHeader";
-import PageHeaderSecondary from "./components/PageHeaderSecondary";
-import Spacer from "./components/Spacer";
-import { Colors } from "./utils/Color";
-import ProgressBar from "./components/ProgressBar";
-import Loader from "./components/Loader";
-import ETimeInput from "./components/ETimeInput";
-import EDateInput from "./components/EDateInput";
-import EErrorText from "./components/EErrorText";
-import EListPerson from "./components/EListPerson";
-import EListSchool from "./components/EListSchool";
-
-export {
-  Avatar,
-  BaseLayout,
-  Container,
-  Drawer,
-  EButton,
-  EButtonIcon,
-  EIcon,
-  EInput,
-  EText,
-  ModalLayout,
-  PageHeader,
-  PageHeaderSecondary,
-  ESegment,
-  ESegmentItem,
-  Spacer,
-  EInfoBox,
-  EBadge,
-  EDateAndTimeCard,
-  ELabel,
-  EOtpInput,
-  EPageDescription,
-  ETimeLineCard,
-  ListFormView,
-  MenuItems,
-  EPillButton,
-  EProfile,
-  SecondaryBaseLayout,
-  Timer,
-  ProgressBar,
-  Loader,
-  ETimeInput,
-  EDateInput,
-  EErrorText,
-  Colors,
-  EListPerson,
-  EListSchool
-
-};
+import Avatar from "./components/Avatar";
+import BaseLayout from "./components/BaseLayout";
+import Container from "./components/Container";
+import Drawer from "./components/Drawer";
+import EBadge from "./components/EBadge";
+import EButton from "./components/EButton";
+import EButtonIcon from "./components/EButtonIcon";
+import EDateAndTimeCard from "./components/EDateAndTimeCard";
+import EIcon from "./components/EIcon";
+import EInfoBox from "./components/EInfoBox";
+import EInput from "./components/EInput";
+import ELabel from "./components/ELabel";
+import EOtpInput from "./components/EOtpInputBox";
+import EPageDescription from "./components/EPageDescription";
+import EPillButton from "./components/EPillButton";
+import EProfile from "./components/EProfile";
+import ESegment from "./components/ESegment";
+import { ESegmentItem } from "./components/ESegment";
+import ETimeLineCard from "./components/ETimeLineCard";
+import ListFormView from "./components/ListFormView";
+import MenuItems from "./components/MenuItems";
+import SecondaryBaseLayout from "./components/SecondaryBaseLayout";
+import Timer from "./components/Timer";
+import EText from "./components/EText";
+import ModalLayout from "./components/ModalLayout";
+import PageHeader from "./components/PageHeader";
+import PageHeaderSecondary from "./components/PageHeaderSecondary";
+import Spacer from "./components/Spacer";
+import { Colors } from "./utils/Color";
+import ProgressBar from "./components/ProgressBar";
+import Loader from "./components/Loader";
+import ETimeInput from "./components/ETimeInput";
+import EDateInput from "./components/EDateInput";
+import EErrorText from "./components/EErrorText";
+import EListPerson from "./components/EListPerson";
+import EListSchool from "./components/EListSchool";
+
+export {
+  Avatar,
+  BaseLayout,
+  Container,
+  Drawer,
+  EButton,
+  EButtonIcon,
+  EIcon,
+  EInput,
+  EText,
+  ModalLayout,
+  PageHeader,
+  PageHeaderSecondary,
+  ESegment,
+  ESegmentItem,
+  Spacer,
+  EInfoBox,
+  EBadge,
+  EDateAndTimeCard,
+  ELabel,
+  EOtpInput,
+  EPageDescription,
+  ETimeLineCard,
+  ListFormView,
+  MenuItems,
+  EPillButton,
+  EProfile,
+  SecondaryBaseLayout,
+  Timer,
+  ProgressBar,
+  Loader,
+  ETimeInput,
+  EDateInput,
+  EErrorText,
+  Colors,
+  EListPerson,
+  EListSchool
+
+};

package/package.json

@@ -1,26 +1,26 @@
-{
-  "name": "fln-espranza",
-  "version": "0.0.1",
-  "description": "All components used inside FLN Project of Espranza Innovations",
-  "main": "index.ts",
-  "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1"
-  },
-  "author": "",
-  "license": "ISC",
-  "peerDependencies": {
-    "expo": "~45.0.0",
-    "expo-status-bar": "~1.3.0",
-    "react": "17.0.2",
-    "react-native": "0.68.2",
-    "react-native-safe-area-context": "4.2.4",
-    "twrnc": "^3.3.2",
-    "@react-navigation/drawer": "^6.5.0",
-    "@react-navigation/native": "^6.0.10",
-    "@react-navigation/native-stack": "^6.6.2",
-    "react-native-heroicons": "^2.2.0",
-    "moment": "^2.29.4",
-    "@react-native-community/datetimepicker": "6.1.2",
-    "react-native-reanimated": "~2.8.0"
-  }
-}
+{
+  "name": "fln-espranza",
+  "version": "0.0.2",
+  "description": "All components used inside FLN Project of Espranza Innovations",
+  "main": "index.ts",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "author": "",
+  "license": "ISC",
+  "peerDependencies": {
+    "expo": "~45.0.0",
+    "expo-status-bar": "~1.3.0",
+    "react": "17.0.2",
+    "react-native": "0.68.2",
+    "react-native-safe-area-context": "4.2.4",
+    "twrnc": "^3.3.2",
+    "@react-navigation/drawer": "^6.5.0",
+    "@react-navigation/native": "^6.0.10",
+    "@react-navigation/native-stack": "^6.6.2",
+    "react-native-heroicons": "^2.2.0",
+    "moment": "^2.29.4",
+    "@react-native-community/datetimepicker": "6.1.2",
+    "react-native-reanimated": "~2.8.0"
+  }
+}

package/utils/Color.ts

@@ -1,15 +1,15 @@
-export const Colors = {
-    "primary-base": '#218C74',
-    "primary-light": '#F4F9F8',
-    "secondary-base": '#3F3D84',
-    "secondary-light": '#F5F5F9',
-    "blue": '#0993BF',
-    "border": '#E0E6EC',
-    "warning": '#FFCB66',
-    "success": '#00BE9B',
-    "text-primary": '#2D3A5D',
-    "text-body": '#64748B',
-    "text-placeholder": '#CBD5E1',
-    "text-secondary": "#585F68",
-    "white": '#FFFFFF',
+export const Colors = {
+    "primary-base": '#218C74',
+    "primary-light": '#F4F9F8',
+    "secondary-base": '#3F3D84',
+    "secondary-light": '#F5F5F9',
+    "blue": '#0993BF',
+    "border": '#E0E6EC',
+    "warning": '#FFCB66',
+    "success": '#00BE9B',
+    "text-primary": '#2D3A5D',
+    "text-body": '#64748B',
+    "text-placeholder": '#CBD5E1',
+    "text-secondary": "#585F68",
+    "white": '#FFFFFF',
   };