fln-espranza 0.0.47 → 0.0.49

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.
@@ -53,7 +53,8 @@ const Drawer = ({
53
53
  nameFirstLetter={name?.split("")[0]}
54
54
  />
55
55
  <View style={tw`ml-3`}>
56
- <EText size={"xl"} style={tw`font-bold -mt-1`}>
56
+
57
+ <EText size={"xl"} style={tw`font-bold -mt-1 lowercase capitalize`}>
57
58
  {name}
58
59
  </EText>
59
60
  <EText
@@ -51,7 +51,6 @@ export default function EButton({
51
51
  {iconL ? <View style={tw`mr-1 -ml-2`}>{iconL}</View> : null}
52
52
  {/* LABEL */}
53
53
  <EText
54
- size={"sm"}
55
54
  style={[
56
55
  tw`font-semibold ${
57
56
  type === "clear" ? `text-[${Colors["primary-base"]}]` : "text-white"
@@ -27,9 +27,9 @@ export default function EButtonIcon({
27
27
  }`}
28
28
  >
29
29
  {type === "close" ? (
30
- <XMarkIcon size={20} style={tw`text-${iconColor? iconColor: ""}`} />
30
+ <XMarkIcon size={24} style={tw`text-${iconColor? iconColor: ""}`} />
31
31
  ) : (
32
- <ArrowLeftIcon size={20} style={tw`text-${iconColor? iconColor : ""}`} />
32
+ <ArrowLeftIcon size={24} style={tw`text-${iconColor? iconColor : ""}`} />
33
33
  )}
34
34
  </View>
35
35
  </TouchableOpacity>
@@ -7,6 +7,7 @@ import { CalendarIcon } from 'react-native-heroicons/outline';
7
7
  import EText from './EText';
8
8
  import ELabel from './ELabel';
9
9
  import { Colors } from 'fln-espranza/utils/Color'
10
+ import DateTimePickerModal from "react-native-modal-datetime-picker";
10
11
 
11
12
  interface IProps {
12
13
  label: string;
@@ -21,7 +22,7 @@ interface IProps {
21
22
  export default function EDateInput({ label, value, style, placeholder, maxDate, minDate, onChange }: IProps) {
22
23
  const [show, setShow] = useState(false);
23
24
 
24
- const handleOnChange = (event: any, selectedDate: any) => {
25
+ const handleOnChange = (selectedDate: any) => {
25
26
  const currentDate = selectedDate;
26
27
  setShow(false);
27
28
  onChange(currentDate)
@@ -40,14 +41,14 @@ export default function EDateInput({ label, value, style, placeholder, maxDate,
40
41
  value ? moment(value).format("DD/MM/YYYY") : "Select Date"
41
42
  }
42
43
  </EText>
43
- {show ? <DateTimePicker
44
- testID="dateTimePicker"
45
- value={value ? new Date(value) : new Date()}
46
- mode={"date"}
47
- onChange={handleOnChange}
44
+ <DateTimePickerModal
45
+ isVisible={show}
46
+ mode="date"
47
+ onConfirm={handleOnChange}
48
+ onCancel={() => setShow(false)}
48
49
  minimumDate={minDate}
49
50
  maximumDate={maxDate}
50
- /> : <></>}
51
+ />
51
52
  <CalendarIcon size={20} style={tw`text-[${Colors["primary-base"]}]`} />
52
53
  </TouchableOpacity>
53
54
  </View>
@@ -25,7 +25,7 @@ export default function EInput({
25
25
  return (
26
26
  <View style={[tw`mb-4`, {style}]}>
27
27
  {label ? (
28
- <EText size="sm" style={[tw`font-semibold text-slate-800`, {
28
+ <EText style={[tw`font-semibold ${hasFocus ? '' : 'text-slate-800'}`, {
29
29
  // color: Colors["text-primary"]
30
30
  }]}>
31
31
  {label}
@@ -33,11 +33,11 @@ export default function EInput({
33
33
  ) : null}
34
34
 
35
35
  <View
36
- style={tw` mt-2`}
36
+ style={tw` mt-1`}
37
37
  >
38
38
  <TextInput
39
- style={tw`h-12 rounded-lg px-4 flex-row items-center border border-slate-300 ${
40
- hasFocus ? "border-black " : ""
39
+ style={tw`h-12 rounded-lg px-4 flex-row items-center border border-slate-300 text-base ${
40
+ hasFocus ? "border-black bg-teal-50/10" : ""
41
41
  }`}
42
42
  {...props}
43
43
  onFocus={() => setHasFocus(!hasFocus)}
@@ -19,7 +19,7 @@ export default function ENotFoundPlaceholder(
19
19
  <View style={tw`items-center px-16 py-2`}>
20
20
  <Image
21
21
  source={require("../assets/images/icon-placeholder-schedule.png")}
22
- style={[tw`mb-2`, { height: 64 }]}
22
+ style={[tw``, { height: 44 }]}
23
23
  resizeMode="contain"
24
24
  />
25
25
 
@@ -35,7 +35,7 @@ export default function ENotFoundPlaceholder(
35
35
  >
36
36
  {subtitle}
37
37
  </EText>
38
- <View style={tw`mt-6`}>
38
+ <View style={tw`mt-4`}>
39
39
  {button}
40
40
  </View>
41
41
  </View>
@@ -35,6 +35,7 @@ export default function EProfile({
35
35
  />
36
36
  <View style={tw`ml-3`}>
37
37
  <EText
38
+ size={"lg"}
38
39
  style={[
39
40
  tw`font-bold text-slate-800 mb-0.5 capitalize`,
40
41
  { color: Colors["text-primary"] },
@@ -43,10 +44,7 @@ export default function EProfile({
43
44
  {name}
44
45
  </EText>
45
46
  {subjectName ? (
46
- <EText
47
- size="sm"
48
- style={[tw` `, { color: Colors["text-body"] }]}
49
- >
47
+ <EText size="sm" style={[tw` `, { color: Colors["text-body"] }]}>
50
48
  {subjectName}
51
49
  </EText>
52
50
  ) : null}
@@ -1,13 +1,14 @@
1
1
  import React, { useEffect, useRef, useState } from 'react'
2
- import { Animated,StyleSheet, View } from 'react-native';
2
+ import { Animated, StyleSheet, View } from 'react-native';
3
3
  import tw from "fln-espranza/lib/tailwind";
4
4
  import { Colors } from "fln-espranza/utils/Color";
5
5
 
6
- interface IProps{
6
+ interface IProps {
7
7
  progress: number;
8
+ type: "stepper" | "bar";
8
9
  }
9
10
 
10
- export default function EProgressBar( {progress}: IProps) {
11
+ export default function EProgressBar({ progress, type }: IProps) {
11
12
 
12
13
 
13
14
  const barWidth = useRef(new Animated.Value(0)).current;
@@ -21,13 +22,26 @@ export default function EProgressBar( {progress}: IProps) {
21
22
  }).start();
22
23
  }, [progress]);
23
24
  return (
24
- <View style={[tw`h-2 w-14 bg-slate-200 overflow-hidden mr-2`, {
25
- borderRadius: 40,
26
- }]}>
27
- <Animated.View
28
- style={[StyleSheet.absoluteFill, { backgroundColor: Colors['primary-base'], width: barWidth }]}
25
+ <>
26
+ {type === "stepper" ? <View style={[tw`h-2 w-14 bg-slate-200 overflow-hidden mr-2`, {
27
+ borderRadius: 40,
28
+ }]}>
29
+ <Animated.View
30
+ style={[StyleSheet.absoluteFill, { backgroundColor: Colors['primary-base'], width: barWidth }]}
29
31
 
30
- />
31
- </View>
32
+ />
33
+ </View>
34
+ :
35
+
36
+ <View style={[tw`h-1 w-full bg-white/10 overflow-hidden mt-1`, {
37
+ borderRadius: 40,
38
+ }]}>
39
+ <View
40
+ style={[tw`h-1 w-[${progress}%] bg-[${Colors['primary-base']}]`]}
41
+
42
+ />
43
+ </View>
44
+ }
45
+ </>
32
46
  )
33
47
  }
@@ -21,7 +21,7 @@ export default function EStat({
21
21
  }: IProps) {
22
22
 
23
23
  const percentage = Math.round((parseFloat(stat) / parseFloat(target)) * 100);
24
- const pending = parseFloat(target) - parseFloat(stat);
24
+ const pending = Number(stat) <= Number(target) ? parseFloat(target) - parseFloat(stat) : 0;
25
25
 
26
26
  return (
27
27
  <TouchableOpacity
@@ -44,7 +44,7 @@ export default function ModalLayout({
44
44
  {/* HEADER */}
45
45
  <View
46
46
  style={[
47
- tw`absolute top-0 right-0 left-0 px-6 pr-3 pt-2 z-10 w-full bg-white ${title ? 'pb-1' : 'pb-0'}`,
47
+ tw`absolute top-0 right-0 left-0 px-6 pr-3 pt-2 z-10 w-full bg-white ${title ? 'pb-2 shadow-md' : 'pb-0'}`,
48
48
  // {height: 64},
49
49
  ]}
50
50
  >
@@ -54,7 +54,7 @@ export default function ModalLayout({
54
54
  button={
55
55
  <EButtonIcon
56
56
  type="close"
57
- iconColor="slate-800"
57
+ iconColor="slate-900"
58
58
  onPress={() => navigation.goBack()}
59
59
  />
60
60
  }
@@ -73,7 +73,7 @@ export default function ModalLayout({
73
73
  >
74
74
  {children}
75
75
  </ScrollView>
76
- {bottomButton ? <View style={tw` px-6 mb-4 `}>
76
+ {bottomButton ? <View style={tw` px-6 mb-4 pt-2 border-t border-slate-300`}>
77
77
  {bottomButton}
78
78
  </View> : <></>}
79
79
  </View>
@@ -26,7 +26,9 @@ export default function PageHeaderSecondary({
26
26
  >
27
27
  <View style={tw` flex-1 justify-center items-center`}>
28
28
  {title ? (
29
- <EText size="base" style={tw`font-semibold`}>
29
+ <EText
30
+ size="lg"
31
+ style={tw`text-slate-800 font-bold`}>
30
32
  {title}
31
33
  </EText>
32
34
  ) : null}
@@ -36,7 +38,7 @@ export default function PageHeaderSecondary({
36
38
  </EText>
37
39
  ) : null}
38
40
  </View>
39
- <View style={[tw`absolute right-3`, {
41
+ <View style={[tw`absolute right-0`, {
40
42
  paddingTop: Platform.OS === "android" ? insets.top + 8 : 8,
41
43
  }]}>{button}</View>
42
44
  </View>
@@ -25,6 +25,7 @@ interface BaseLayoutProps {
25
25
  menuButton?: boolean;
26
26
  paddingTop?: number;
27
27
  hideBackBtn?: boolean;
28
+ scrollViewRef?: any;
28
29
  }
29
30
 
30
31
  export default function SecondaryBaseLayout({
@@ -39,7 +40,8 @@ export default function SecondaryBaseLayout({
39
40
  border,
40
41
  menuButton,
41
42
  paddingTop,
42
- hideBackBtn
43
+ hideBackBtn,
44
+ scrollViewRef
43
45
  }: BaseLayoutProps) {
44
46
  const insets = useSafeAreaInsets();
45
47
 
@@ -77,6 +79,7 @@ export default function SecondaryBaseLayout({
77
79
  </PageHeader>
78
80
  </View>
79
81
  <ScrollView
82
+ ref={scrollViewRef}
80
83
  style={[
81
84
  tw`flex-1`,
82
85
  { paddingBottom: insets.bottom, paddingTop: !title ? 80 : 80 },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "fln-espranza",
3
- "version": "0.0.47",
3
+ "version": "0.0.49",
4
4
  "description": "All components used inside FLN Project of Espranza Innovations",
5
5
  "main": "index.ts",
6
6
  "scripts": {