fln-espranza 0.0.36 → 0.0.37

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (86) hide show
  1. package/.expo/README.md +15 -15
  2. package/.expo/settings.json +8 -8
  3. package/components/Avatar.tsx +43 -43
  4. package/components/BaseLayout.tsx +174 -174
  5. package/components/Drawer.tsx +116 -116
  6. package/components/EBadge.tsx +24 -24
  7. package/components/EButton.tsx +70 -71
  8. package/components/EDateAndTimeCard.tsx +51 -51
  9. package/components/EDateInput.tsx +55 -55
  10. package/components/EEmptyPlaceholder.tsx +21 -21
  11. package/components/EErrorText.tsx +19 -19
  12. package/components/EInfoBox.tsx +41 -41
  13. package/components/EInput.tsx +54 -54
  14. package/components/ELabel.tsx +15 -15
  15. package/components/EListPerson.tsx +52 -52
  16. package/components/EListSchool.tsx +35 -35
  17. package/components/EOption.tsx +98 -98
  18. package/components/EOtpInputBox.tsx +49 -49
  19. package/components/EPageDescription.tsx +19 -19
  20. package/components/EPillButton.tsx +33 -33
  21. package/components/EProfile.tsx +62 -62
  22. package/components/EProfileScreenLayout.tsx +111 -111
  23. package/components/EProgressBar.tsx +33 -33
  24. package/components/EQuestionSerialNumberLabel.tsx +17 -17
  25. package/components/EQuestionText.tsx +14 -14
  26. package/components/ESegment.tsx +36 -36
  27. package/components/EText.tsx +41 -41
  28. package/components/ETextArea.tsx +53 -53
  29. package/components/ETimeInput.tsx +54 -54
  30. package/components/ETimeLineCard.tsx +66 -66
  31. package/components/ListFormView.tsx +36 -36
  32. package/components/Loader.tsx +31 -31
  33. package/components/MenuItems.tsx +46 -46
  34. package/components/PageHeader.tsx +123 -123
  35. package/components/ProfileHeader.tsx +85 -85
  36. package/components/SecondaryBaseLayout.tsx +106 -106
  37. package/components/Timer.tsx +56 -56
  38. package/components/icons/EIconAdd.jsx +19 -19
  39. package/components/icons/EIconAddCircle.jsx +21 -21
  40. package/components/icons/EIconApplicationStatus.jsx +20 -20
  41. package/components/icons/EIconArrowDown.jsx +20 -20
  42. package/components/icons/EIconArrowLeft.jsx +21 -21
  43. package/components/icons/EIconArrowRight.jsx +21 -21
  44. package/components/icons/EIconArrowUp.jsx +20 -20
  45. package/components/icons/EIconBadge.jsx +20 -20
  46. package/components/icons/EIconBell.jsx +19 -19
  47. package/components/icons/EIconCalendar.jsx +21 -21
  48. package/components/icons/EIconCalendarCheck.jsx +24 -24
  49. package/components/icons/EIconCamera.jsx +20 -20
  50. package/components/icons/EIconCameraRotate.jsx +23 -23
  51. package/components/icons/EIconCheck.jsx +19 -19
  52. package/components/icons/EIconCheckCircle.jsx +20 -20
  53. package/components/icons/EIconCheckFill.jsx +19 -19
  54. package/components/icons/EIconChevronDown.jsx +19 -19
  55. package/components/icons/EIconChevronLeft.jsx +19 -19
  56. package/components/icons/EIconChevronRight.jsx +19 -19
  57. package/components/icons/EIconChevronUp.jsx +19 -19
  58. package/components/icons/EIconClock.jsx +19 -19
  59. package/components/icons/EIconClose.jsx +19 -19
  60. package/components/icons/EIconDashboard.jsx +20 -20
  61. package/components/icons/EIconDocumentCheck.jsx +14 -14
  62. package/components/icons/EIconEdit.jsx +19 -19
  63. package/components/icons/EIconFemale.jsx +20 -20
  64. package/components/icons/EIconFile.jsx +21 -21
  65. package/components/icons/EIconInfo.jsx +20 -20
  66. package/components/icons/EIconLogout.jsx +19 -19
  67. package/components/icons/EIconMale.jsx +21 -21
  68. package/components/icons/EIconMenu.jsx +19 -19
  69. package/components/icons/EIconMinus.jsx +19 -19
  70. package/components/icons/EIconPin.jsx +19 -19
  71. package/components/icons/EIconProfile.jsx +19 -19
  72. package/components/icons/EIconSchool.jsx +24 -24
  73. package/components/icons/EIconSearch.jsx +19 -19
  74. package/components/icons/EIconSettings.jsx +20 -20
  75. package/components/icons/EIconShare.jsx +21 -21
  76. package/components/icons/EIconStudent.jsx +23 -23
  77. package/components/icons/EIconSubject.jsx +21 -21
  78. package/components/icons/EIconTeach.jsx +21 -21
  79. package/components/icons/EIconTrash.jsx +19 -19
  80. package/components/icons/EIconUserCard.jsx +19 -19
  81. package/components/icons/EIconUserCheck.jsx +20 -20
  82. package/components/icons/EIconUsers.jsx +19 -19
  83. package/components/index.tsx +65 -65
  84. package/index.ts +180 -180
  85. package/package.json +26 -26
  86. package/utils/Color.ts +14 -14
@@ -1,31 +1,31 @@
1
- import { SCREEN_WIDTH, SCREEN_HEIGHT } from '@gorhom/bottom-sheet'
2
- // import { Colors, EText } from 'fln-espranza'
3
- import EText from './EText';
4
- import React from 'react'
5
- import { View, ActivityIndicator } from 'react-native'
6
- import tw from '../lib/tailwind';
7
- import { Colors } from '../utils/Color';
8
-
9
- interface IProps{
10
- show: boolean
11
- }
12
-
13
- export default function Loader({show}: IProps) {
14
- return (
15
- <>
16
- {show ? <View style={[tw`absolute justify-center items-center z-10 bg-slate-100 `, {
17
- opacity: 0.9,
18
- width: SCREEN_WIDTH,
19
- height: SCREEN_HEIGHT,
20
- }]}>
21
- <View style={[tw`h-24 w-32 bg-white px-2 py-3 justify-center items-center rounded-xl`]}>
22
- <ActivityIndicator size="large" color={Colors['primary-base']} />
23
- <EText size="base" style={tw`text-black`}>Loading...</EText>
24
- </View>
25
- </View>
26
- :
27
- <></>
28
- }
29
- </>
30
- )
31
- }
1
+ import { SCREEN_WIDTH, SCREEN_HEIGHT } from '@gorhom/bottom-sheet'
2
+ // import { Colors, EText } from 'fln-espranza'
3
+ import EText from './EText';
4
+ import React from 'react'
5
+ import { View, ActivityIndicator } from 'react-native'
6
+ import tw from '../lib/tailwind';
7
+ import { Colors } from '../utils/Color';
8
+
9
+ interface IProps{
10
+ show: boolean
11
+ }
12
+
13
+ export default function Loader({show}: IProps) {
14
+ return (
15
+ <>
16
+ {show ? <View style={[tw`absolute justify-center items-center z-10 bg-slate-100 `, {
17
+ opacity: 0.9,
18
+ width: SCREEN_WIDTH,
19
+ height: SCREEN_HEIGHT,
20
+ }]}>
21
+ <View style={[tw`h-24 w-32 bg-white px-2 py-3 justify-center items-center rounded-xl`]}>
22
+ <ActivityIndicator size="large" color={Colors['primary-base']} />
23
+ <EText size="base" style={tw`text-black`}>Loading...</EText>
24
+ </View>
25
+ </View>
26
+ :
27
+ <></>
28
+ }
29
+ </>
30
+ )
31
+ }
@@ -1,46 +1,46 @@
1
- import React from "react";
2
- import { TouchableOpacity, View } from "react-native";
3
- import { HomeIcon } from "react-native-heroicons/solid";
4
- import tw from "../lib/tailwind";
5
- import { Colors } from "../utils/Color";
6
- import EText from "./EText";
7
-
8
- interface IProps {
9
- title?: string;
10
- icon?: JSX.Element;
11
- onPress?: () => void;
12
- }
13
-
14
- export default function MenuItems({ title, icon, onPress }: IProps) {
15
- return (
16
- <TouchableOpacity style={tw`flex-row items-center`} onPress={onPress}>
17
- {/* <HomeIcon style={[tw`w-6 h-6`, { color: Colors["primary-base"] }]} /> */}
18
- {icon ? (
19
- icon
20
- ) : (
21
- <HomeIcon style={[tw`w-6 h-6`, { color: Colors["primary-base"] }]} />
22
- )}
23
- <View
24
- style={[
25
- tw`py-4 ml-4 mr-8 w-[80%]`,
26
- {
27
- borderBottomWidth: 1,
28
- borderBottomColor: Colors.border,
29
- },
30
- ]}
31
- >
32
- <EText
33
- size="base"
34
- style={[
35
- tw`font-semibold `,
36
- {
37
- color: Colors["text-primary"],
38
- },
39
- ]}
40
- >
41
- {title ? title : "Dashboard"}
42
- </EText>
43
- </View>
44
- </TouchableOpacity>
45
- );
46
- }
1
+ import React from "react";
2
+ import { TouchableOpacity, View } from "react-native";
3
+ import { HomeIcon } from "react-native-heroicons/solid";
4
+ import tw from "../lib/tailwind";
5
+ import { Colors } from "../utils/Color";
6
+ import EText from "./EText";
7
+
8
+ interface IProps {
9
+ title?: string;
10
+ icon?: JSX.Element;
11
+ onPress?: () => void;
12
+ }
13
+
14
+ export default function MenuItems({ title, icon, onPress }: IProps) {
15
+ return (
16
+ <TouchableOpacity style={tw`flex-row items-center`} onPress={onPress}>
17
+ {/* <HomeIcon style={[tw`w-6 h-6`, { color: Colors["primary-base"] }]} /> */}
18
+ {icon ? (
19
+ icon
20
+ ) : (
21
+ <HomeIcon style={[tw`w-6 h-6`, { color: Colors["primary-base"] }]} />
22
+ )}
23
+ <View
24
+ style={[
25
+ tw`py-4 ml-4 mr-8 w-[80%]`,
26
+ {
27
+ borderBottomWidth: 1,
28
+ borderBottomColor: Colors.border,
29
+ },
30
+ ]}
31
+ >
32
+ <EText
33
+ size="base"
34
+ style={[
35
+ tw`font-semibold `,
36
+ {
37
+ color: Colors["text-primary"],
38
+ },
39
+ ]}
40
+ >
41
+ {title ? title : "Dashboard"}
42
+ </EText>
43
+ </View>
44
+ </TouchableOpacity>
45
+ );
46
+ }
@@ -1,123 +1,123 @@
1
- import { View, Animated, Dimensions, TouchableOpacity } from "react-native";
2
- import React, { useEffect, useRef } from "react";
3
- import tw from "../lib/tailwind";
4
- import { useNavigation } from "@react-navigation/native";
5
- import EText from "./EText";
6
- import Constants from "expo-constants";
7
- import EIconArrowLeft from "./icons/EIconArrowLeft";
8
- import EIconMenu from "./icons/EIconMenu";
9
-
10
- const SCREEN_WIDTH = Dimensions.get("window").width;
11
- const HEADER_HEIGHT = 90;
12
-
13
- interface PageHeaderProps {
14
- title: string;
15
- subtitle?: string;
16
- curved?: boolean;
17
- children?: JSX.Element;
18
- iconEnd?: JSX.Element;
19
- border?: boolean;
20
- menuButton?: boolean;
21
- hideBackBtn?: boolean;
22
- }
23
-
24
- export default function PageHeader({
25
- title,
26
- subtitle,
27
- curved,
28
- children,
29
- iconEnd,
30
- border,
31
- menuButton,
32
- hideBackBtn
33
- }: PageHeaderProps) {
34
- const navigation = useNavigation();
35
-
36
- const translateX = useRef(new Animated.Value(60)).current;
37
- const opacity = useRef(new Animated.Value(0)).current;
38
-
39
- useEffect(() => {
40
- Animated.spring(translateX, {
41
- toValue: 0,
42
- stiffness: 40,
43
- damping: 10,
44
- useNativeDriver: true,
45
- }).start();
46
- Animated.spring(opacity, {
47
- toValue: 1,
48
- delay: 250,
49
- useNativeDriver: true,
50
- }).start();
51
- });
52
- return (
53
- <View style={[tw`${"border-none border-slate-300 bg-white shadow-lg py-3"} `, {}]}>
54
- <View style={tw`overflow-hidden`}>
55
- <View
56
- style={[
57
- tw`flex-row items-center px-3`,
58
- {
59
- paddingTop: Constants.statusBarHeight + 8,
60
- },
61
- ]}
62
- >
63
- {/* LEFT ICON */}
64
- {hideBackBtn
65
- ? <></>
66
- :
67
- <View
68
- style={[tw``]}
69
- >
70
- {menuButton ?
71
- <TouchableOpacity activeOpacity={0.6}
72
- onPress={() => navigation?.openDrawer()}>
73
- <EIconMenu
74
- size={24}
75
- style={tw`text-slate-800`}
76
- />
77
- </TouchableOpacity>
78
-
79
- :
80
- <TouchableOpacity activeOpacity={0.6}
81
- onPress={() => navigation.goBack()}>
82
- <EIconArrowLeft
83
- iconColor={curved ? "white" : "tint-slate-900"}
84
- size={24}
85
- // onPress={() => navigation.navigate("Dashboard")}
86
- style={tw`text-slate-800`}
87
- />
88
- </TouchableOpacity>
89
- }
90
- </View>
91
-
92
- }
93
- {/* TITLE */}
94
- <View style={tw`flex-1 items-start px-3`}>
95
- <EText
96
- size="lg"
97
- style={tw.style("text-slate-800 font-bold")}
98
- >
99
- {title}
100
- </EText>
101
- {subtitle ? (
102
- <EText
103
- style={tw.style(
104
- "text-slate-800 opacity-40 font-semibold mt-0.25"
105
- )}
106
- >
107
- {subtitle}
108
- </EText>
109
- ) : null}
110
- </View>
111
-
112
- {/* RIGHT ICON */}
113
- {iconEnd ? (
114
- <View style={[tw``, {}]}>
115
- {iconEnd}
116
- </View>
117
- ) : null}
118
- </View>
119
- {children ? <View style={tw.style("pb-6")}>{children}</View> : null}
120
- </View>
121
- </View>
122
- );
123
- }
1
+ import { View, Animated, Dimensions, TouchableOpacity } from "react-native";
2
+ import React, { useEffect, useRef } from "react";
3
+ import tw from "../lib/tailwind";
4
+ import { useNavigation } from "@react-navigation/native";
5
+ import EText from "./EText";
6
+ import Constants from "expo-constants";
7
+ import EIconArrowLeft from "./icons/EIconArrowLeft";
8
+ import EIconMenu from "./icons/EIconMenu";
9
+
10
+ const SCREEN_WIDTH = Dimensions.get("window").width;
11
+ const HEADER_HEIGHT = 90;
12
+
13
+ interface PageHeaderProps {
14
+ title: string;
15
+ subtitle?: string;
16
+ curved?: boolean;
17
+ children?: JSX.Element;
18
+ iconEnd?: JSX.Element;
19
+ border?: boolean;
20
+ menuButton?: boolean;
21
+ hideBackBtn?: boolean;
22
+ }
23
+
24
+ export default function PageHeader({
25
+ title,
26
+ subtitle,
27
+ curved,
28
+ children,
29
+ iconEnd,
30
+ border,
31
+ menuButton,
32
+ hideBackBtn
33
+ }: PageHeaderProps) {
34
+ const navigation = useNavigation();
35
+
36
+ const translateX = useRef(new Animated.Value(60)).current;
37
+ const opacity = useRef(new Animated.Value(0)).current;
38
+
39
+ useEffect(() => {
40
+ Animated.spring(translateX, {
41
+ toValue: 0,
42
+ stiffness: 40,
43
+ damping: 10,
44
+ useNativeDriver: true,
45
+ }).start();
46
+ Animated.spring(opacity, {
47
+ toValue: 1,
48
+ delay: 250,
49
+ useNativeDriver: true,
50
+ }).start();
51
+ });
52
+ return (
53
+ <View style={[tw`${"border-none border-slate-300 bg-white shadow-lg py-3"} `, {}]}>
54
+ <View style={tw`overflow-hidden`}>
55
+ <View
56
+ style={[
57
+ tw`flex-row items-center px-3`,
58
+ {
59
+ paddingTop: Constants.statusBarHeight + 8,
60
+ },
61
+ ]}
62
+ >
63
+ {/* LEFT ICON */}
64
+ {hideBackBtn
65
+ ? <></>
66
+ :
67
+ <View
68
+ style={[tw``]}
69
+ >
70
+ {menuButton ?
71
+ <TouchableOpacity activeOpacity={0.6}
72
+ onPress={() => navigation?.openDrawer()}>
73
+ <EIconMenu
74
+ size={24}
75
+ style={tw`text-slate-800`}
76
+ />
77
+ </TouchableOpacity>
78
+
79
+ :
80
+ <TouchableOpacity activeOpacity={0.6}
81
+ onPress={() => navigation.goBack()}>
82
+ <EIconArrowLeft
83
+ iconColor={curved ? "white" : "tint-slate-900"}
84
+ size={24}
85
+ // onPress={() => navigation.navigate("Dashboard")}
86
+ style={tw`text-slate-800`}
87
+ />
88
+ </TouchableOpacity>
89
+ }
90
+ </View>
91
+
92
+ }
93
+ {/* TITLE */}
94
+ <View style={tw`flex-1 items-start px-3`}>
95
+ <EText
96
+ size="lg"
97
+ style={tw.style("text-slate-800 font-bold")}
98
+ >
99
+ {title}
100
+ </EText>
101
+ {subtitle ? (
102
+ <EText
103
+ style={tw.style(
104
+ "text-slate-800 opacity-40 font-semibold mt-0.25"
105
+ )}
106
+ >
107
+ {subtitle}
108
+ </EText>
109
+ ) : null}
110
+ </View>
111
+
112
+ {/* RIGHT ICON */}
113
+ {iconEnd ? (
114
+ <View style={[tw``, {}]}>
115
+ {iconEnd}
116
+ </View>
117
+ ) : null}
118
+ </View>
119
+ {children ? <View style={tw.style("pb-6")}>{children}</View> : null}
120
+ </View>
121
+ </View>
122
+ );
123
+ }
@@ -1,85 +1,85 @@
1
- import { useNavigation } from "@react-navigation/native";
2
- import React, { useRef } from "react";
3
- import { Animated, ImageBackground, View } from "react-native";
4
- import EButtonIcon from "./EButtonIcon";
5
- import Avatar from "./Avatar";
6
- import EText from "./EText";
7
- import tw from "../lib/tailwind"
8
- import Constants from "expo-constants";
9
-
10
- interface IProps {
11
- name: string;
12
- titleText?: string;
13
- title: string;
14
- }
15
-
16
- export default function ProfileHeader({ name, title, titleText }: IProps) {
17
- const translateX = useRef(new Animated.Value(60)).current;
18
- const opacity = useRef(new Animated.Value(0)).current;
19
- const navigation = useNavigation();
20
-
21
- React.useEffect(() => {
22
- Animated.spring(translateX, {
23
- toValue: 0,
24
- stiffness: 40,
25
- damping: 10,
26
- useNativeDriver: true,
27
- }).start();
28
- Animated.spring(opacity, {
29
- toValue: 1,
30
- delay: 250,
31
- useNativeDriver: true,
32
- }).start();
33
- });
34
-
35
- return (
36
- <View style={tw`flex-1 overflow-hidden h-full`}>
37
- <ImageBackground
38
- style={[tw`h-full w-full`, {}]}
39
- source={require("../assets/images/bg-profile.jpg")}
40
- >
41
- <Animated.View
42
- style={[
43
- tw`flex-row pr-4 pl-3 pb-3`,
44
- {
45
- paddingTop: Constants.statusBarHeight + 8,
46
- transform: [{ translateX }],
47
- opacity,
48
- },
49
- ]}
50
- >
51
- <Animated.View
52
- style={[
53
- tw`-mt-2 left-3 absolute `,
54
- {
55
- transform: [{ translateX }],
56
- opacity,
57
- paddingTop: Constants.statusBarHeight + 8,
58
- },
59
- ]}
60
- >
61
- <EButtonIcon
62
- iconColor={"tint-white"}
63
- size={20}
64
- onPress={() => navigation.goBack()}
65
- />
66
- </Animated.View>
67
- </Animated.View>
68
- <View style={[tw`flex items-center mt-5 rounded-4xl `, {}]}>
69
- <Avatar size="5xl" source={""} nameFirstLetter={name?.split("")[0]} />
70
- <View style={tw`mt-6 mb-8 items-center`}>
71
- <EText size="2xl" style={tw`font-bold text-white capitalize`}>
72
- {name.toLocaleLowerCase().trim()}
73
- </EText>
74
- <EText
75
- size="sm"
76
- style={tw`mt-0.5 font-normal opacity-50 text-white`}
77
- >
78
- {titleText ? titleText : "Unique Code"} : {title}
79
- </EText>
80
- </View>
81
- </View>
82
- </ImageBackground>
83
- </View>
84
- );
85
- }
1
+ import { useNavigation } from "@react-navigation/native";
2
+ import React, { useRef } from "react";
3
+ import { Animated, ImageBackground, View } from "react-native";
4
+ import EButtonIcon from "./EButtonIcon";
5
+ import Avatar from "./Avatar";
6
+ import EText from "./EText";
7
+ import tw from "../lib/tailwind"
8
+ import Constants from "expo-constants";
9
+
10
+ interface IProps {
11
+ name: string;
12
+ titleText?: string;
13
+ title: string;
14
+ }
15
+
16
+ export default function ProfileHeader({ name, title, titleText }: IProps) {
17
+ const translateX = useRef(new Animated.Value(60)).current;
18
+ const opacity = useRef(new Animated.Value(0)).current;
19
+ const navigation = useNavigation();
20
+
21
+ React.useEffect(() => {
22
+ Animated.spring(translateX, {
23
+ toValue: 0,
24
+ stiffness: 40,
25
+ damping: 10,
26
+ useNativeDriver: true,
27
+ }).start();
28
+ Animated.spring(opacity, {
29
+ toValue: 1,
30
+ delay: 250,
31
+ useNativeDriver: true,
32
+ }).start();
33
+ });
34
+
35
+ return (
36
+ <View style={tw`flex-1 overflow-hidden h-full`}>
37
+ <ImageBackground
38
+ style={[tw`h-full w-full`, {}]}
39
+ source={require("../assets/images/bg-profile.jpg")}
40
+ >
41
+ <Animated.View
42
+ style={[
43
+ tw`flex-row pr-4 pl-3 pb-3`,
44
+ {
45
+ paddingTop: Constants.statusBarHeight + 8,
46
+ transform: [{ translateX }],
47
+ opacity,
48
+ },
49
+ ]}
50
+ >
51
+ <Animated.View
52
+ style={[
53
+ tw`-mt-2 left-3 absolute `,
54
+ {
55
+ transform: [{ translateX }],
56
+ opacity,
57
+ paddingTop: Constants.statusBarHeight + 8,
58
+ },
59
+ ]}
60
+ >
61
+ <EButtonIcon
62
+ iconColor={"tint-white"}
63
+ size={20}
64
+ onPress={() => navigation.goBack()}
65
+ />
66
+ </Animated.View>
67
+ </Animated.View>
68
+ <View style={[tw`flex items-center mt-5 rounded-4xl `, {}]}>
69
+ <Avatar size="5xl" source={""} nameFirstLetter={name?.split("")[0]} />
70
+ <View style={tw`mt-6 mb-8 items-center`}>
71
+ <EText size="2xl" style={tw`font-bold text-white capitalize`}>
72
+ {name.toLocaleLowerCase().trim()}
73
+ </EText>
74
+ <EText
75
+ size="sm"
76
+ style={tw`mt-0.5 font-normal opacity-50 text-white`}
77
+ >
78
+ {titleText ? titleText : "Unique Code"} : {title}
79
+ </EText>
80
+ </View>
81
+ </View>
82
+ </ImageBackground>
83
+ </View>
84
+ );
85
+ }