fln-espranza 0.0.40 → 0.0.42

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 (90) hide show
  1. package/.expo/README.md +15 -15
  2. package/.expo/settings.json +8 -8
  3. package/assets/images/icon-placeholder-schedule.png +0 -0
  4. package/components/Avatar.tsx +43 -43
  5. package/components/BaseLayout.tsx +174 -174
  6. package/components/Drawer.tsx +125 -125
  7. package/components/EBadge.tsx +24 -24
  8. package/components/EButton.tsx +70 -70
  9. package/components/EButtonIcon.tsx +3 -3
  10. package/components/EDateAndTimeCard.tsx +51 -51
  11. package/components/EDateInput.tsx +55 -55
  12. package/components/EEmptyPlaceholder.tsx +21 -21
  13. package/components/EErrorText.tsx +19 -19
  14. package/components/EInfoBox.tsx +41 -41
  15. package/components/EInput.tsx +54 -54
  16. package/components/ELabel.tsx +15 -15
  17. package/components/EListPerson.tsx +52 -52
  18. package/components/EListSchool.tsx +35 -35
  19. package/components/ENotFoundPlaceholder.tsx +43 -0
  20. package/components/EOption.tsx +98 -98
  21. package/components/EOtpInputBox.tsx +49 -49
  22. package/components/EPageDescription.tsx +19 -19
  23. package/components/EPillButton.tsx +33 -33
  24. package/components/EProfile.tsx +62 -62
  25. package/components/EProfileScreenLayout.tsx +111 -111
  26. package/components/EProgressBar.tsx +33 -33
  27. package/components/EQuestionSerialNumberLabel.tsx +17 -17
  28. package/components/EQuestionText.tsx +14 -14
  29. package/components/ESegment.tsx +36 -36
  30. package/components/EStat.tsx +24 -22
  31. package/components/EText.tsx +41 -41
  32. package/components/ETextArea.tsx +53 -53
  33. package/components/ETimeInput.tsx +54 -54
  34. package/components/ETimeLineCard.tsx +66 -66
  35. package/components/ListFormView.tsx +36 -36
  36. package/components/Loader.tsx +31 -31
  37. package/components/MenuItems.tsx +46 -46
  38. package/components/PageHeader.tsx +123 -123
  39. package/components/ProfileHeader.tsx +85 -85
  40. package/components/SecondaryBaseLayout.tsx +106 -106
  41. package/components/Timer.tsx +56 -56
  42. package/components/icons/EIconAdd.jsx +19 -19
  43. package/components/icons/EIconAddCircle.jsx +21 -21
  44. package/components/icons/EIconApplicationStatus.jsx +20 -20
  45. package/components/icons/EIconArrowDown.jsx +20 -20
  46. package/components/icons/EIconArrowLeft.jsx +21 -21
  47. package/components/icons/EIconArrowRight.jsx +21 -21
  48. package/components/icons/EIconArrowUp.jsx +20 -20
  49. package/components/icons/EIconBadge.jsx +20 -20
  50. package/components/icons/EIconBell.jsx +19 -19
  51. package/components/icons/EIconCalendar.jsx +21 -21
  52. package/components/icons/EIconCalendarCheck.jsx +24 -24
  53. package/components/icons/EIconCamera.jsx +20 -20
  54. package/components/icons/EIconCameraRotate.jsx +23 -23
  55. package/components/icons/EIconCheck.jsx +19 -19
  56. package/components/icons/EIconCheckCircle.jsx +20 -20
  57. package/components/icons/EIconCheckFill.jsx +19 -19
  58. package/components/icons/EIconChevronDown.jsx +19 -19
  59. package/components/icons/EIconChevronLeft.jsx +19 -19
  60. package/components/icons/EIconChevronRight.jsx +19 -19
  61. package/components/icons/EIconChevronUp.jsx +19 -19
  62. package/components/icons/EIconClock.jsx +19 -19
  63. package/components/icons/EIconClose.jsx +19 -19
  64. package/components/icons/EIconDashboard.jsx +20 -20
  65. package/components/icons/EIconDocumentCheck.jsx +14 -14
  66. package/components/icons/EIconEdit.jsx +19 -19
  67. package/components/icons/EIconFemale.jsx +20 -20
  68. package/components/icons/EIconFile.jsx +21 -21
  69. package/components/icons/EIconInfo.jsx +20 -20
  70. package/components/icons/EIconLogout.jsx +19 -19
  71. package/components/icons/EIconMale.jsx +21 -21
  72. package/components/icons/EIconMenu.jsx +19 -19
  73. package/components/icons/EIconMinus.jsx +19 -19
  74. package/components/icons/EIconPin.jsx +19 -19
  75. package/components/icons/EIconProfile.jsx +19 -19
  76. package/components/icons/EIconSchool.jsx +24 -24
  77. package/components/icons/EIconSearch.jsx +19 -19
  78. package/components/icons/EIconSettings.jsx +20 -20
  79. package/components/icons/EIconShare.jsx +21 -21
  80. package/components/icons/EIconStudent.jsx +23 -23
  81. package/components/icons/EIconSubject.jsx +21 -21
  82. package/components/icons/EIconTeach.jsx +21 -21
  83. package/components/icons/EIconTrash.jsx +19 -19
  84. package/components/icons/EIconUserCard.jsx +19 -19
  85. package/components/icons/EIconUserCheck.jsx +20 -20
  86. package/components/icons/EIconUsers.jsx +19 -19
  87. package/components/index.tsx +67 -67
  88. package/index.ts +184 -180
  89. package/package.json +26 -26
  90. package/utils/Color.ts +14 -14
@@ -1,54 +1,54 @@
1
- import moment from 'moment'
2
- import React, { useState } from 'react'
3
- import { View, TouchableOpacity } from 'react-native'
4
- import { ClockIcon } from 'react-native-heroicons/outline'
5
- import DateTimePicker from '@react-native-community/datetimepicker';
6
- import tw from '../../../lib/tailwind'
7
- import EText from './EText';
8
- import ELabel from './ELabel';
9
-
10
- interface IProps {
11
- label: string;
12
- value: string;
13
- onChange: (value: string) => void;
14
- style?: any;
15
- }
16
-
17
- export default function ETimeInput( { label, value,style, onChange }: IProps ) {
18
- const [date, setDate] = useState(new Date());
19
- const [show, setShow] = useState(false);
20
-
21
- const handleOnChange = (event: any, selectedDate: any) => {
22
- const currentDate = selectedDate;
23
- setShow(false);
24
- setDate(currentDate);
25
- onChange(moment(currentDate).format("hh:mm A"));
26
- }
27
-
28
- return (
29
-
30
- <View style={[tw`mb-4 `, style]}>
31
- <ELabel label={label} />
32
- <TouchableOpacity
33
- style={tw`h-12 rounded-lg px-4 flex-row justify-between items-center border border-slate-300 lowercase my-2 bg-white`}
34
- onPress={() => setShow(true)}
35
- >
36
- <EText size={"sm"} style={tw`font-normal text-slate-400`}>
37
- {
38
- // value ? value : moment(date).format("hh:mm A")
39
- value ? value : "Select Time"
40
- }
41
- </EText>
42
- {show ? <DateTimePicker
43
- testID="dateTimePicker"
44
- value={date}
45
- mode={"time"}
46
- is24Hour={false}
47
- onChange={handleOnChange}
48
- /> : <></>}
49
- <ClockIcon size={20} style={tw`text-slate-500`} />
50
- </TouchableOpacity>
51
- </View>
52
- )
53
- }
54
-
1
+ import moment from 'moment'
2
+ import React, { useState } from 'react'
3
+ import { View, TouchableOpacity } from 'react-native'
4
+ import { ClockIcon } from 'react-native-heroicons/outline'
5
+ import DateTimePicker from '@react-native-community/datetimepicker';
6
+ import tw from '../../../lib/tailwind'
7
+ import EText from './EText';
8
+ import ELabel from './ELabel';
9
+
10
+ interface IProps {
11
+ label: string;
12
+ value: string;
13
+ onChange: (value: string) => void;
14
+ style?: any;
15
+ }
16
+
17
+ export default function ETimeInput( { label, value,style, onChange }: IProps ) {
18
+ const [date, setDate] = useState(new Date());
19
+ const [show, setShow] = useState(false);
20
+
21
+ const handleOnChange = (event: any, selectedDate: any) => {
22
+ const currentDate = selectedDate;
23
+ setShow(false);
24
+ setDate(currentDate);
25
+ onChange(moment(currentDate).format("hh:mm A"));
26
+ }
27
+
28
+ return (
29
+
30
+ <View style={[tw`mb-4 `, style]}>
31
+ <ELabel label={label} />
32
+ <TouchableOpacity
33
+ style={tw`h-12 rounded-lg px-4 flex-row justify-between items-center border border-slate-300 lowercase my-2 bg-white`}
34
+ onPress={() => setShow(true)}
35
+ >
36
+ <EText size={"sm"} style={tw`font-normal text-slate-400`}>
37
+ {
38
+ // value ? value : moment(date).format("hh:mm A")
39
+ value ? value : "Select Time"
40
+ }
41
+ </EText>
42
+ {show ? <DateTimePicker
43
+ testID="dateTimePicker"
44
+ value={date}
45
+ mode={"time"}
46
+ is24Hour={false}
47
+ onChange={handleOnChange}
48
+ /> : <></>}
49
+ <ClockIcon size={20} style={tw`text-slate-500`} />
50
+ </TouchableOpacity>
51
+ </View>
52
+ )
53
+ }
54
+
@@ -1,66 +1,66 @@
1
- import React from 'react'
2
- import { Dimensions, TouchableOpacity, View } from 'react-native'
3
- import tw from '../lib/tailwind'
4
- import { Colors } from '../utils/Color';
5
- import EBadge from './EBadge'
6
- import EText from './EText';
7
- import EIconChevronRight from './icons/EIconChevronRight';
8
-
9
- interface IProps {
10
- title: string;
11
- description: string;
12
- completed: boolean;
13
- onPress?: () => void;
14
- buttonText?: string;
15
- disabled: boolean;
16
- badgeText?: string;
17
- }
18
-
19
- export default function ETimeLineCard({ title, description, completed, disabled, onPress, buttonText, badgeText }: IProps) {
20
- return (
21
- <TouchableOpacity
22
- onPress={() => onPress && onPress()}
23
- style={[
24
- tw` rounded-lg p-4 mb-3 w-full border border}`,
25
- {
26
- backgroundColor: completed ? Colors['primary-light'] : Colors['white'],
27
- borderColor: completed ? Colors['primary-base'] : Colors['border'],
28
- }
29
- ]}
30
- disabled={disabled}
31
- >
32
-
33
- <View style={tw`flex-row justify-between `}>
34
- <View style={tw`flex-1`}>
35
- <EText size="lg" style={[tw`font-bold`, { color: Colors['text-primary'] }]}>
36
- {title}
37
- </EText>
38
- <EText size='sm' style={[tw`font-normal mt-1`, { color: Colors['text-body'] }]}>
39
- {description}
40
- </EText>
41
- </View>
42
- <View style={tw`ml-4`}>
43
- <EBadge
44
- completed={completed}
45
- text={
46
- badgeText ? badgeText : completed ? "Complete" : "Pending"}
47
- bgColor={completed ? Colors['primary-base'] : Colors.warning}
48
- textColor={"#ffff"}
49
- />
50
- </View>
51
- </View>
52
-
53
- {
54
- !disabled ? (
55
- <View style={tw`mt-6 flex-row items-center justify-between`}>
56
- <TouchableOpacity style={tw`flex-row`} onPress={onPress}>
57
- <EText size="sm" style={[tw`ml-2 font-semibold`, { color: Colors['primary-base'] }]}>
58
- {buttonText}
59
- </EText>
60
- <EIconChevronRight size={20} style={[tw`ml-2`, { color: Colors['primary-base'] }]} />
61
- </TouchableOpacity>
62
- </View>) : <></>
63
- }
64
- </TouchableOpacity>
65
- )
66
- }
1
+ import React from 'react'
2
+ import { Dimensions, TouchableOpacity, View } from 'react-native'
3
+ import tw from '../lib/tailwind'
4
+ import { Colors } from '../utils/Color';
5
+ import EBadge from './EBadge'
6
+ import EText from './EText';
7
+ import EIconChevronRight from './icons/EIconChevronRight';
8
+
9
+ interface IProps {
10
+ title: string;
11
+ description: string;
12
+ completed: boolean;
13
+ onPress?: () => void;
14
+ buttonText?: string;
15
+ disabled: boolean;
16
+ badgeText?: string;
17
+ }
18
+
19
+ export default function ETimeLineCard({ title, description, completed, disabled, onPress, buttonText, badgeText }: IProps) {
20
+ return (
21
+ <TouchableOpacity
22
+ onPress={() => onPress && onPress()}
23
+ style={[
24
+ tw` rounded-lg p-4 mb-3 w-full border border}`,
25
+ {
26
+ backgroundColor: completed ? Colors['primary-light'] : Colors['white'],
27
+ borderColor: completed ? Colors['primary-base'] : Colors['border'],
28
+ }
29
+ ]}
30
+ disabled={disabled}
31
+ >
32
+
33
+ <View style={tw`flex-row justify-between `}>
34
+ <View style={tw`flex-1`}>
35
+ <EText size="lg" style={[tw`font-bold`, { color: Colors['text-primary'] }]}>
36
+ {title}
37
+ </EText>
38
+ <EText size='sm' style={[tw`font-normal mt-1`, { color: Colors['text-body'] }]}>
39
+ {description}
40
+ </EText>
41
+ </View>
42
+ <View style={tw`ml-4`}>
43
+ <EBadge
44
+ completed={completed}
45
+ text={
46
+ badgeText ? badgeText : completed ? "Complete" : "Pending"}
47
+ bgColor={completed ? Colors['primary-base'] : Colors.warning}
48
+ textColor={"#ffff"}
49
+ />
50
+ </View>
51
+ </View>
52
+
53
+ {
54
+ !disabled ? (
55
+ <View style={tw`mt-6 flex-row items-center justify-between`}>
56
+ <TouchableOpacity style={tw`flex-row`} onPress={onPress}>
57
+ <EText size="sm" style={[tw`ml-2 font-semibold`, { color: Colors['primary-base'] }]}>
58
+ {buttonText}
59
+ </EText>
60
+ <EIconChevronRight size={20} style={[tw`ml-2`, { color: Colors['primary-base'] }]} />
61
+ </TouchableOpacity>
62
+ </View>) : <></>
63
+ }
64
+ </TouchableOpacity>
65
+ )
66
+ }
@@ -1,37 +1,37 @@
1
- import {
2
- View,
3
- Text,
4
- TouchableOpacity,
5
- Image,
6
- TouchableOpacityProps,
7
- } from "react-native";
8
- import React from "react";
9
- import tw from "../lib/tailwind";
10
- import EText from "./EText";
11
- import { Colors } from "../utils/Color";
12
- // import { Tag } from "..";
13
-
14
- interface ListFormViewProps {
15
- label: string;
16
- description: string;
17
- }
18
-
19
- export default function ListFormView({
20
- label,
21
- description,
22
- }: ListFormViewProps) {
23
- return (
24
- <View style={tw`flex-row items-center justify-between py-3 border-b border-[${Colors.border}]`}>
25
- <View style={tw``}>
26
- <EText size="sm" style={tw`font-normal text-[${Colors["text-secondary"]}]`}>
27
- {label}
28
- </EText>
29
- </View>
30
- <View style={tw`flex-1 ml-4 items-end`}>
31
- <EText size="sm" style={tw`font-normal text-[${Colors["text-primary"]}]`}>
32
- {description}
33
- </EText>
34
- </View>
35
- </View>
36
- );
1
+ import {
2
+ View,
3
+ Text,
4
+ TouchableOpacity,
5
+ Image,
6
+ TouchableOpacityProps,
7
+ } from "react-native";
8
+ import React from "react";
9
+ import tw from "../lib/tailwind";
10
+ import EText from "./EText";
11
+ import { Colors } from "../utils/Color";
12
+ // import { Tag } from "..";
13
+
14
+ interface ListFormViewProps {
15
+ label: string;
16
+ description: string;
17
+ }
18
+
19
+ export default function ListFormView({
20
+ label,
21
+ description,
22
+ }: ListFormViewProps) {
23
+ return (
24
+ <View style={tw`flex-row items-center justify-between py-3 border-b border-[${Colors.border}]`}>
25
+ <View style={tw``}>
26
+ <EText size="sm" style={tw`font-normal text-[${Colors["text-secondary"]}]`}>
27
+ {label}
28
+ </EText>
29
+ </View>
30
+ <View style={tw`flex-1 ml-4 items-end`}>
31
+ <EText size="sm" style={tw`font-normal text-[${Colors["text-primary"]}]`}>
32
+ {description}
33
+ </EText>
34
+ </View>
35
+ </View>
36
+ );
37
37
  }
@@ -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
+ }