fln-espranza 0.0.41 → 0.0.42

package/components/EProfileScreenLayout.tsx

@@ -1,111 +1,111 @@
-import { Animated, ImageBackground, View } from "react-native";
-// import tw from '../../../lib/tailwind'
-import tw from "../lib/tailwind"
-import EButtonIcon from "./EButtonIcon";
-import EText from "./EText";
-import React, { useCallback, useRef } from "react";
-import Constants from "expo-constants";
-import { SCREEN_HEIGHT } from "@gorhom/bottom-sheet";
-import { useFocusEffect, useNavigation } from "@react-navigation/native";
-import { StatusBar } from "expo-status-bar";
-import ProfileHeader from "./ProfileHeader";
-
-
-interface IProps {
-    profileName: string;
-    titleText?: string;
-    uniqueCode: string;
-    body: JSX.Element;
-}
-
-export default function EProfileScreenLayout( { profileName, uniqueCode, body, titleText } : IProps) {
-  const opacity = useRef(new Animated.Value(0)).current;
-  const [headerScrolled, setHeaderScrolled] = React.useState(false);
-  const scrollY = useRef(new Animated.Value(0)).current;
-  const navigation = useNavigation();
-
-  React.useEffect(() => {
-    Animated.spring(scrollY, {
-      toValue: headerScrolled ? 0 : -100,
-      speed: 2,
-      delay: 1,
-      bounciness: 1,
-      useNativeDriver: true,
-    }).start();
-
-    Animated.spring(opacity, {
-      toValue: headerScrolled ? 0.975 : 0,
-      speed: 2,
-      delay: 1,
-      bounciness: 1,
-      useNativeDriver: true,
-    }).start();
-  }, [headerScrolled]);
-
-
-
-  return (
-    <View style={tw``}>
-      <StatusBar
-        style={"light"}
-        animated
-      />
-      <Animated.View
-        style={[
-          tw`absolute top-0 left-0 right-0 z-10`,
-          {
-            transform: [{ translateY: scrollY }],
-            opacity,
-          },
-        ]}
-      >
-        <ImageBackground
-          style={[tw`flex-1`, {}]}
-          source={require("../assets/images/bg-profile.jpg")}
-        >
-          <View
-            style={[
-              tw`flex-1 pl-3 pb-3 flex-row items-center `,
-              { paddingTop: Constants.statusBarHeight + 4 },
-            ]}
-          >
-            <EButtonIcon
-              iconColor={"white"}
-              size={20}
-              onPress={() => navigation.goBack()}
-            />
-            <EText size="lg" style={tw`text-white font-bold ml-2`}>
-              Profile
-            </EText>
-          </View>
-        </ImageBackground>
-      </Animated.View>
-
-      <Animated.ScrollView
-        onScroll={(event) => {
-          const scrolling = event.nativeEvent.contentOffset.y;
-          scrolling > 40 ? setHeaderScrolled(true) : setHeaderScrolled(false);
-        }}
-        style={[tw`flex-1 bg-white`, { minHeight: SCREEN_HEIGHT, paddingBottom: 100 }]}
-        scrollEventThrottle={16}
-        showsVerticalScrollIndicator={false}
-        decelerationRate={"fast"}
-        contentContainerStyle={{
-          paddingBottom: 100
-        }}
-      >
-
-        <ProfileHeader 
-          name={profileName?.trim() || ""}
-          title={uniqueCode || ""}
-          titleText={titleText ? titleText : "Unique Code"}
-        />
-
-        <View style={tw`px-4 mt-8 flex-1`}>
-            {body}
-        </View>
-
-      </Animated.ScrollView>
-    </View>
-  );
-}
+import { Animated, ImageBackground, View } from "react-native";
+// import tw from '../../../lib/tailwind'
+import tw from "../lib/tailwind"
+import EButtonIcon from "./EButtonIcon";
+import EText from "./EText";
+import React, { useCallback, useRef } from "react";
+import Constants from "expo-constants";
+import { SCREEN_HEIGHT } from "@gorhom/bottom-sheet";
+import { useFocusEffect, useNavigation } from "@react-navigation/native";
+import { StatusBar } from "expo-status-bar";
+import ProfileHeader from "./ProfileHeader";
+
+
+interface IProps {
+    profileName: string;
+    titleText?: string;
+    uniqueCode: string;
+    body: JSX.Element;
+}
+
+export default function EProfileScreenLayout( { profileName, uniqueCode, body, titleText } : IProps) {
+  const opacity = useRef(new Animated.Value(0)).current;
+  const [headerScrolled, setHeaderScrolled] = React.useState(false);
+  const scrollY = useRef(new Animated.Value(0)).current;
+  const navigation = useNavigation();
+
+  React.useEffect(() => {
+    Animated.spring(scrollY, {
+      toValue: headerScrolled ? 0 : -100,
+      speed: 2,
+      delay: 1,
+      bounciness: 1,
+      useNativeDriver: true,
+    }).start();
+
+    Animated.spring(opacity, {
+      toValue: headerScrolled ? 0.975 : 0,
+      speed: 2,
+      delay: 1,
+      bounciness: 1,
+      useNativeDriver: true,
+    }).start();
+  }, [headerScrolled]);
+
+
+
+  return (
+    <View style={tw``}>
+      <StatusBar
+        style={"light"}
+        animated
+      />
+      <Animated.View
+        style={[
+          tw`absolute top-0 left-0 right-0 z-10`,
+          {
+            transform: [{ translateY: scrollY }],
+            opacity,
+          },
+        ]}
+      >
+        <ImageBackground
+          style={[tw`flex-1`, {}]}
+          source={require("../assets/images/bg-profile.jpg")}
+        >
+          <View
+            style={[
+              tw`flex-1 pl-3 pb-3 flex-row items-center `,
+              { paddingTop: Constants.statusBarHeight + 4 },
+            ]}
+          >
+            <EButtonIcon
+              iconColor={"white"}
+              size={20}
+              onPress={() => navigation.goBack()}
+            />
+            <EText size="lg" style={tw`text-white font-bold ml-2`}>
+              Profile
+            </EText>
+          </View>
+        </ImageBackground>
+      </Animated.View>
+
+      <Animated.ScrollView
+        onScroll={(event) => {
+          const scrolling = event.nativeEvent.contentOffset.y;
+          scrolling > 40 ? setHeaderScrolled(true) : setHeaderScrolled(false);
+        }}
+        style={[tw`flex-1 bg-white`, { minHeight: SCREEN_HEIGHT, paddingBottom: 100 }]}
+        scrollEventThrottle={16}
+        showsVerticalScrollIndicator={false}
+        decelerationRate={"fast"}
+        contentContainerStyle={{
+          paddingBottom: 100
+        }}
+      >
+
+        <ProfileHeader 
+          name={profileName?.trim() || ""}
+          title={uniqueCode || ""}
+          titleText={titleText ? titleText : "Unique Code"}
+        />
+
+        <View style={tw`px-4 mt-8 flex-1`}>
+            {body}
+        </View>
+
+      </Animated.ScrollView>
+    </View>
+  );
+}

package/components/EProgressBar.tsx

@@ -1,33 +1,33 @@
-import React, { useEffect, useRef, useState } from 'react'
-import { Animated,StyleSheet, View } from 'react-native';
-import tw from "fln-espranza/lib/tailwind";
-import { Colors } from "fln-espranza/utils/Color";
-
-interface IProps{
-    progress: number;
-}
-
-export default function EProgressBar( {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-slate-200 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 "fln-espranza/lib/tailwind";
+import { Colors } from "fln-espranza/utils/Color";
+
+interface IProps{
+    progress: number;
+}
+
+export default function EProgressBar( {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-slate-200 overflow-hidden mr-2`, {
+            borderRadius: 40,
+        }]}>
+            <Animated.View
+                style={[StyleSheet.absoluteFill, { backgroundColor: Colors['primary-base'], width: barWidth }]}
+
+            />
+        </View>
+    )
+}

package/components/EQuestionSerialNumberLabel.tsx

@@ -1,17 +1,17 @@
-import React from 'react'
-import tw from '../lib/tailwind';
-import { Colors } from '../utils/Color';
-import EText from './EText';
-// import { EText } from '../../../components'
-
-interface IProps{
-    label: string;
-}
-
-export default function EQuestionSerialNumberLabel( { label } : IProps) {
-  return (
-   <EText size={"sm"} style={[tw`font-extrabold`, {color: Colors['primary-base']}]}>
-    {label}
-   </EText>
-  )
-}
+import React from 'react'
+import tw from '../lib/tailwind';
+import { Colors } from '../utils/Color';
+import EText from './EText';
+// import { EText } from '../../../components'
+
+interface IProps{
+    label: string;
+}
+
+export default function EQuestionSerialNumberLabel( { label } : IProps) {
+  return (
+   <EText size={"sm"} style={[tw`font-extrabold`, {color: Colors['primary-base']}]}>
+    {label}
+   </EText>
+  )
+}

package/components/EQuestionText.tsx

@@ -1,14 +1,14 @@
-import React from 'react'
-import tw from '../lib/tailwind';
-import EText from './EText';
-interface IProps{
-    question: string;
-}
-
-export default function EQuestionText( { question } : IProps) {
-  return (
-    <EText size={"base"} style={ tw`font-medium mt-1`}>
-        {question}
-    </EText>
-  )
-}
+import React from 'react'
+import tw from '../lib/tailwind';
+import EText from './EText';
+interface IProps{
+    question: string;
+}
+
+export default function EQuestionText( { question } : IProps) {
+  return (
+    <EText size={"base"} style={ tw`font-medium mt-1`}>
+        {question}
+    </EText>
+  )
+}

package/components/ESegment.tsx

@@ -1,36 +1,36 @@
-import { View, Text, Pressable, TouchableOpacity } from "react-native";
-import React from "react";
-import tw from '../lib/tailwind'
-import EText from "./EText";
-import { Colors } from "../utils/Color";
-
-export function ESegmentItem(props: any) {
-  const { onPress, label, isActive } = props;
-  return (
-    <TouchableOpacity
-      style={tw.style(
-        "py-1.5 px-4 rounded-full items-center w-1/2",
-        isActive && "bg-white shadow-lg shadow-slate-500 "
-      )}
-      onPress={onPress}
-    >
-      <View style={tw`items-center`}>
-      <EText size="sm" style={tw`font-bold ${!isActive ? "text-white": ""}`}>{label}</EText>
-      </View>
-    </TouchableOpacity>
-  );
-}
-
-export default function ESegment(props: any) {
-  return (
-    <View style={tw`justify-center items-center`}>
-    <View
-      style={[tw`flex-row rounded-full p-1 border border-slate-100 w-full`, {
-        backgroundColor: Colors["text-body"],
-      }]}
-    >
-      {props.children}
-    </View>
-  </View>
-  );
-}
+import { View, Text, Pressable, TouchableOpacity } from "react-native";
+import React from "react";
+import tw from '../lib/tailwind'
+import EText from "./EText";
+import { Colors } from "../utils/Color";
+
+export function ESegmentItem(props: any) {
+  const { onPress, label, isActive } = props;
+  return (
+    <TouchableOpacity
+      style={tw.style(
+        "py-1.5 px-4 rounded-full items-center w-1/2",
+        isActive && "bg-white shadow-lg shadow-slate-500 "
+      )}
+      onPress={onPress}
+    >
+      <View style={tw`items-center`}>
+      <EText size="sm" style={tw`font-bold ${!isActive ? "text-white": ""}`}>{label}</EText>
+      </View>
+    </TouchableOpacity>
+  );
+}
+
+export default function ESegment(props: any) {
+  return (
+    <View style={tw`justify-center items-center`}>
+    <View
+      style={[tw`flex-row rounded-full p-1 border border-slate-100 w-full`, {
+        backgroundColor: Colors["text-body"],
+      }]}
+    >
+      {props.children}
+    </View>
+  </View>
+  );
+}

package/components/EStat.tsx

@@ -1,24 +1,24 @@
-import React from "react";
-import { View } from "react-native";
-import tw from "../../../lib/tailwind";
-import EText from "./EText";
-
-interface IProps {
-  stat: string;
-  label: string;
-  backgroundColor: string;
-  lightText?: boolean;
-}
-
-export default function EStat({ stat, label, backgroundColor, lightText }: IProps) {
-  return (
-    <View style={tw`mr-1 mt-1 w-[140px] h-[110px] p-3 justify-between shadow-lg shadow-slate-400 rounded-tl-lg rounded-tr-[44px] bg-[${backgroundColor}]`}>
-    <EText style={tw`font-bold tracking-tight text-2xl ${lightText ? 'text-white' : 'text-slate-900'}`}>
-      {stat}
-    </EText>
-      <EText size="xs" style={tw`mb-1 ${lightText ? 'text-white/90' : 'text-slate-900/90'}`}>
-        {label}
-      </EText>
-    </View>
-  );
-}
+import React from "react";
+import { View } from "react-native";
+import tw from "../../../lib/tailwind";
+import EText from "./EText";
+
+interface IProps {
+  stat: string;
+  label: string;
+  backgroundColor: string;
+  lightText?: boolean;
+}
+
+export default function EStat({ stat, label, backgroundColor, lightText }: IProps) {
+  return (
+    <View style={tw`mr-1 mt-1 w-[140px] h-[110px] p-3 justify-between shadow-lg shadow-slate-400 rounded-tl-lg rounded-tr-[44px] bg-[${backgroundColor}]`}>
+    <EText style={tw`font-bold tracking-tight text-2xl ${lightText ? 'text-white' : 'text-slate-900'}`}>
+      {stat}
+    </EText>
+      <EText size="xs" style={tw`mb-1 ${lightText ? 'text-white/90' : 'text-slate-900/90'}`}>
+        {label}
+      </EText>
+    </View>
+  );
+}

package/components/EText.tsx

@@ -1,41 +1,41 @@
-import { Text, TextProps } from "react-native";
-import React from "react";
-import tw from "../lib/tailwind";
-
-interface ETextProps extends TextProps {
-  size?: "xs" | "sm" | "base" | "lg" | "xl" | "2xl" | "3xl" | "title";
-  muted?: boolean;
-  style?: any;
-  children?: any;
-}
-
-export default function EText({
-  size,
-  muted,
-  style, 
-  children,
-  ...props
-}: ETextProps) {
-  return (
-    <Text
-      {...props}
-      style={[
-        tw.style(
-          "text-base leading-6",
-          size === "xs" && "text-xs",
-          size === "sm" && "text-sm",
-          size === "base" && "text-base",
-          size == "lg" && "font-semibold text-lg",
-          size === "xl" && "font-bold text-xl",
-          size === "2xl" && "font-bold text-2xl",
-          size === "3xl" && "font-bold text-3xl",
-          size === "title" && "font-extrabold text-title text-2xl",
-          muted && "opacity-60"
-        ),
-        style,
-      ]}
-    >
-      {children}
-    </Text>
-  );
-}
+import { Text, TextProps } from "react-native";
+import React from "react";
+import tw from "../lib/tailwind";
+
+interface ETextProps extends TextProps {
+  size?: "xs" | "sm" | "base" | "lg" | "xl" | "2xl" | "3xl" | "title";
+  muted?: boolean;
+  style?: any;
+  children?: any;
+}
+
+export default function EText({
+  size,
+  muted,
+  style, 
+  children,
+  ...props
+}: ETextProps) {
+  return (
+    <Text
+      {...props}
+      style={[
+        tw.style(
+          "text-base leading-6",
+          size === "xs" && "text-xs",
+          size === "sm" && "text-sm",
+          size === "base" && "text-base",
+          size == "lg" && "font-semibold text-lg",
+          size === "xl" && "font-bold text-xl",
+          size === "2xl" && "font-bold text-2xl",
+          size === "3xl" && "font-bold text-3xl",
+          size === "title" && "font-extrabold text-title text-2xl",
+          muted && "opacity-60"
+        ),
+        style,
+      ]}
+    >
+      {children}
+    </Text>
+  );
+}

package/components/ETextArea.tsx

@@ -1,53 +1,53 @@
-import { View, Text, TextInput, TextInputProps } from "react-native";
-import React, { useState } from "react";
-import EText from "./EText";
-import tw from "../lib/tailwind";
-
-interface EInputProps extends TextInputProps {
-  label?: string;
-  size?: "lg";
-  hasBackground?: boolean;
-  icon?: JSX.Element;
-}
-
-export default function ETextArea({
-  label,
-  size,
-  hasBackground,
-  icon,
-  ...props
-}: EInputProps) {
-  const [hasFocus, setHasFocus] = useState(false);
-  return (
-    <View style={[tw``, {}]}>
-      {label ? (
-        <EText size="sm" style={[tw`font-semibold text-slate-800`, {
-          // color: Colors["text-primary"]
-        }]}>
-          {label}
-        </EText>
-      ) : null}
-
-      <View
-        style={tw` mt-2 `}
-      >
-        <TextInput
-          style={[tw`h-24 rounded-lg p-4 border border-slate-300  ${
-            hasFocus ? "border-black " : ""
-          }`, {
-            textAlignVertical: 'top'
-          }]}
-          {...props}
-          multiline = {true}
-          onFocus={() => setHasFocus(!hasFocus)}
-          onBlur={() => setHasFocus(!hasFocus)}
-        />
-        {
-          icon ?
-            <>{icon}</>
-            : null
-        }
-      </View>
-    </View>
-  );
-}
+import { View, Text, TextInput, TextInputProps } from "react-native";
+import React, { useState } from "react";
+import EText from "./EText";
+import tw from "../lib/tailwind";
+
+interface EInputProps extends TextInputProps {
+  label?: string;
+  size?: "lg";
+  hasBackground?: boolean;
+  icon?: JSX.Element;
+}
+
+export default function ETextArea({
+  label,
+  size,
+  hasBackground,
+  icon,
+  ...props
+}: EInputProps) {
+  const [hasFocus, setHasFocus] = useState(false);
+  return (
+    <View style={[tw``, {}]}>
+      {label ? (
+        <EText size="sm" style={[tw`font-semibold text-slate-800`, {
+          // color: Colors["text-primary"]
+        }]}>
+          {label}
+        </EText>
+      ) : null}
+
+      <View
+        style={tw` mt-2 `}
+      >
+        <TextInput
+          style={[tw`h-24 rounded-lg p-4 border border-slate-300  ${
+            hasFocus ? "border-black " : ""
+          }`, {
+            textAlignVertical: 'top'
+          }]}
+          {...props}
+          multiline = {true}
+          onFocus={() => setHasFocus(!hasFocus)}
+          onBlur={() => setHasFocus(!hasFocus)}
+        />
+        {
+          icon ?
+            <>{icon}</>
+            : null
+        }
+      </View>
+    </View>
+  );
+}