native-pytech 1.0.200 → 1.0.203

package/dist/libs/pickerPage/src/components/Page/types.d.ts

@@ -0,0 +1,30 @@
+type Props = {
+    /**
+        Children to be rendered inside the picker.
+    */
+    children: React.ReactNode;
+    /**
+        Selected value.
+    */
+    selected?: string;
+    /**
+        Function to be called when the user selects a selection.
+    */
+    onSelectionChange?: (selection: string) => void | Promise<void>;
+    /**
+        Function to be called when the user changes the search text.
+    */
+    onChangeSearchText?: (text: string) => void;
+    /**
+        Placeholder for the search bar.
+        @default 'Buscar'
+    */
+    placeholderSearchBar?: string;
+    /**
+        Adjusts the row insets on ios.
+        Is is useful when uses items with gradients.
+        @platform ios
+    */
+    adjustRowInsets?: boolean;
+};
+export default Props;

package/dist/libs/pickerPage/src/components/Page/types.js

@@ -0,0 +1 @@
+export {};

package/dist/libs/pickerPage/src/context/page.d.ts

@@ -0,0 +1,7 @@
+export declare const Provider: import("react").Provider<{
+    selected?: string;
+    onSelectionChange?: (selection: string) => void;
+} | null>, usePage: () => {
+    selected?: string;
+    onSelectionChange?: (selection: string) => void;
+};

package/dist/libs/pickerPage/src/context/page.js

@@ -0,0 +1,2 @@
+import Utils from '../../../../libs/constants/utils';
+export const [Provider, usePage] = Utils.createCtx();

package/dist/libs/providers/App/index.d.ts

@@ -0,0 +1,10 @@
+import { ColorSchemeType } from "../constants";
+import type Props from './types';
+import './styles.css';
+declare const useApp: () => {
+    colorScheme: ColorSchemeType;
+    fontScale: number;
+};
+export { useApp };
+declare const _default: import("react").MemoExoticComponent<({ listStackNames, getBackgroundColor, getSession, renderItemLoading, onLoadingRealsed, }: Props) => import("react").JSX.Element>;
+export default _default;

package/dist/libs/providers/App/index.js

@@ -0,0 +1,59 @@
+import { memo, useMemo, useState, useRef } from "react";
+import { Stack, useRouter } from "expo-router";
+import { useColorScheme, useWindowDimensions, View, StyleSheet } from "react-native";
+import { SafeAreaProvider } from 'react-native-safe-area-context';
+import { DarkTheme, DefaultTheme, ThemeProvider } from 'expo-router';
+import Utils from "../../../libs/constants/utils";
+import LoginSvg from '../../assets/images/login_letras.svg';
+import LoginSvgDark from '../../assets/images/login_letras_dark.svg';
+import Hooks from '../../../libs/constants/hooks';
+import colors from "../constants";
+import './styles.css';
+const [Provider, useApp] = Utils.createCtx();
+export { useApp };
+export default memo(({ listStackNames = [], getBackgroundColor, getSession, renderItemLoading = ({ colorScheme }) => (colorScheme === 'dark' ?
+    <LoginSvgDark width={200} height={200}/>
+    :
+        <LoginSvg width={200} height={200}/>), onLoadingRealsed, }) => {
+    // -------------- Variables --------------
+    const colorScheme = useColorScheme();
+    const Theme = colors[colorScheme];
+    const { fontScale } = useWindowDimensions();
+    const router = useRouter();
+    const [isLoading, setIsLoading] = useState(true);
+    const hasSessionRef = useRef(false);
+    // -------------- Effects --------------
+    Hooks.useEffectWithoutFirstRender(() => {
+        if (!isLoading)
+            onLoadingRealsed?.({ router, hasSession: hasSessionRef.current });
+    }, [isLoading]);
+    Hooks.useAsyncEffect(async (isMounted) => {
+        hasSessionRef.current = (await getSession?.()) ?? true;
+        if (!isMounted)
+            return;
+        setIsLoading(false);
+    }, []);
+    // -------------- Return --------------
+    const value = useMemo(() => ({ colorScheme: colorScheme, fontScale: fontScale }), [colorScheme, fontScale]);
+    if (isLoading) {
+        return (<View style={[styles.container, { backgroundColor: getBackgroundColor?.({ colorScheme }) || Theme.backgroundColor }]}>
+                {renderItemLoading({ colorScheme })}
+            </View>);
+    }
+    return (<SafeAreaProvider>
+            <ThemeProvider value={colorScheme === 'dark' ? DarkTheme : DefaultTheme}>
+                <Provider value={value}>
+                    <Stack screenOptions={{ headerShown: false }}>
+                        {listStackNames?.map((name) => (<Stack.Screen key={name} name={name}/>))}
+                    </Stack>
+                </Provider>
+            </ThemeProvider>
+        </SafeAreaProvider>);
+});
+const styles = StyleSheet.create({
+    container: {
+        flex: 1,
+        alignItems: 'center',
+        justifyContent: 'center',
+    }
+});

package/dist/libs/providers/App/types.d.ts

@@ -0,0 +1,35 @@
+import { ColorSchemeType } from "../../../libs/constants/colors";
+import { ImperativeRouter } from "expo-router";
+type Props = {
+    /**
+     Lista de nombres de los Stacks que se deben renderizar.
+     */
+    listStackNames?: string[];
+    /**
+        Función para obtener el color de fondo de las paginas por defecto.
+    */
+    getBackgroundColor?: ({ colorScheme }: {
+        colorScheme: ColorSchemeType;
+    }) => string;
+    /**
+        Función para inicializar la sesión.
+        @default true
+    */
+    getSession?: () => Promise<boolean>;
+    /**
+     Función para renderizar el item cuando está cargando.
+        @default LoginSvg (white | black)
+    */
+    renderItemLoading?: ({ colorScheme }: {
+        colorScheme: ColorSchemeType;
+    }) => React.ReactNode;
+    /**
+        Función para ejecutar cuando se realice el cambio de estado de loading a false.
+        Se utiliza para redirigir a la página de inicio.
+    */
+    onLoadingRealsed?: ({ router, hasSession }: {
+        router: ImperativeRouter;
+        hasSession: boolean;
+    }) => void;
+};
+export default Props;

package/dist/libs/providers/App/types.js

@@ -0,0 +1 @@
+export {};

package/dist/libs/providers/constants.d.ts

@@ -0,0 +1,10 @@
+declare const colors: {
+    light: {
+        backgroundColor: string;
+    };
+    dark: {
+        backgroundColor: string;
+    };
+};
+export { type ColorSchemeType } from "../../libs/constants/colors";
+export default colors;

package/dist/libs/providers/constants.js

@@ -0,0 +1,10 @@
+import colorsLib from "../../libs/constants/colors";
+const colors = {
+    light: {
+        backgroundColor: colorsLib.light.backgroundColor3,
+    },
+    dark: {
+        backgroundColor: colorsLib.dark.backgroundColor3,
+    }
+};
+export default colors;

package/dist/libs/sections/Icon/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from './src';
+export { default as Props } from './types';

package/dist/libs/sections/Icon/index.js

@@ -0,0 +1 @@
+export { default } from './src';

package/dist/libs/sections/Icon/src/Section.ios.d.ts

@@ -0,0 +1,6 @@
+import { VStackProps } from '@expo/ui/swift-ui';
+type Props = VStackProps & {
+    children: React.ReactNode;
+};
+declare const _default: import("react").MemoExoticComponent<({ children, modifiers, ...vStackProps }: Props) => import("react").JSX.Element>;
+export default _default;

package/dist/libs/sections/Icon/src/Section.ios.js

@@ -0,0 +1,17 @@
+import { Section, VStack } from '@expo/ui/swift-ui';
+import { containerRelativeFrame, listRowBackground, frame, listRowInsets } from '@expo/ui/swift-ui/modifiers';
+import { memo, useMemo } from 'react';
+export default memo(({ children, modifiers, ...vStackProps }) => {
+    const _modifiers = useMemo(() => [
+        ...(modifiers ?? []),
+        frame({ alignment: 'center' }),
+        containerRelativeFrame({ axes: 'horizontal' }),
+        listRowBackground('transparent'),
+        listRowInsets({ bottom: 0.1 })
+    ], [modifiers]);
+    return (<Section>
+            <VStack spacing={20} modifiers={_modifiers} {...vStackProps}>
+                {children}
+            </VStack>
+        </Section>);
+});

package/dist/libs/sections/Icon/src/index.d.ts

@@ -0,0 +1,3 @@
+import Props from '../types';
+declare const _default: import("react").MemoExoticComponent<({ title, subtitle, gradientProps, buttonProps }: Props) => import("react").JSX.Element>;
+export default _default;

package/dist/libs/sections/Icon/src/index.ios.d.ts

@@ -0,0 +1,3 @@
+import Props from '../types';
+declare const _default: import("react").MemoExoticComponent<({ title, subtitle, gradientProps, buttonProps }: Props) => import("react").JSX.Element>;
+export default _default;

package/dist/libs/sections/Icon/src/index.ios.js

@@ -0,0 +1,26 @@
+import { Button, VStack } from '@expo/ui/swift-ui';
+import { frame, font, buttonStyle } from '@expo/ui/swift-ui/modifiers';
+import { memo } from 'react';
+import Gradient from '../../../../libs/components/Gradient';
+import Text from '../../../../libs/swiftui/src/components/Text';
+import Section from './Section.ios';
+export default memo(({ title, subtitle, gradientProps, buttonProps }) => {
+    const spacing = gradientProps?.type === 'extraLarge' ? 10 : 20;
+    return (<Section spacing={spacing}>
+            {gradientProps && (<Gradient {...gradientProps}/>)}
+
+            {(title || subtitle) && (subtitle ? (<VStack modifiers={[frame({ alignment: 'center' })]} spacing={2}>
+                        <Title title={title}/>
+                        <Text secondary>
+                            {subtitle}
+                        </Text>
+                    </VStack>) : (<Title title={title}/>))}
+
+            {buttonProps && (<Button {...buttonProps} modifiers={[buttonStyle('bordered')]}/>)}
+        </Section>);
+});
+const Title = memo(({ title }) => {
+    return (<Text modifiers={[font({ weight: 'bold', size: 30 })]}>
+            {title}
+        </Text>);
+});

package/dist/libs/sections/Icon/src/index.js

@@ -0,0 +1,59 @@
+import { View, Text, Pressable, StyleSheet } from "react-native";
+import { memo } from 'react';
+import Gradient from "../../../../libs/components/Gradient";
+import Colors from "../../../../libs/constants/colors";
+import { useApp } from "../../../../libs/providers/App";
+export default memo(({ title, subtitle, gradientProps, buttonProps }) => {
+    const { colorScheme } = useApp();
+    const spacing = gradientProps?.type === 'extraLarge' ? 10 : 20;
+    return (<View style={[styles.container, { gap: spacing }]}>
+            {gradientProps && (<Gradient {...gradientProps}/>)}
+
+            {(title || subtitle) && (subtitle ? (<View style={styles.containerTitle}>
+                        <Title title={title} colorScheme={colorScheme}/>
+                        <Text style={[styles.subtitle, { color: Colors[colorScheme].text2 }]}>
+                            {subtitle}
+                        </Text>
+                    </View>) : (<Title title={title} colorScheme={colorScheme}/>))}
+
+            {buttonProps && (<Pressable onPress={buttonProps.onPress} style={styles.pressable}>
+                    <Text style={styles.label}>{buttonProps.label}</Text>
+                </Pressable>)}
+        </View>);
+});
+const Title = memo(({ title, colorScheme }) => {
+    return (<Text style={[styles.title, { color: Colors[colorScheme].text }]}>
+            {title}
+        </Text>);
+});
+const styles = StyleSheet.create({
+    container: {
+        padding: 16,
+        flex: 1,
+        marginBottom: 30,
+        justifyContent: 'center',
+        alignItems: 'center'
+    },
+    containerTitle: {
+        flexDirection: 'column',
+        alignItems: 'center',
+        gap: 2
+    },
+    title: {
+        fontWeight: 'bold',
+        fontSize: 30
+    },
+    subtitle: {
+        fontSize: 17
+    },
+    pressable: {
+        backgroundColor: Colors.especiales.azul,
+        padding: 10,
+        borderRadius: 20
+    },
+    label: {
+        color: 'white',
+        fontSize: 17,
+        fontWeight: 'semibold'
+    }
+});

package/dist/libs/sections/Icon/types.d.ts

@@ -0,0 +1,25 @@
+import { Props as GradientProps } from '../../../libs/components/Gradient';
+type Props = {
+    /**
+        The title of the icon section.
+    */
+    title?: string;
+    /**
+        The subtitle of the icon section.
+    */
+    subtitle?: string;
+    /**
+        If it is given, displays a gradient.
+    */
+    gradientProps?: Omit<GradientProps, 'type'> & {
+        type: 'extraLarge' | 'extraExtraLarge';
+    };
+    /**
+        If it is given, displays a button.
+    */
+    buttonProps?: {
+        label: string;
+        onPress: () => void;
+    };
+};
+export default Props;

package/dist/libs/sections/Icon/types.js

@@ -0,0 +1 @@
+export {};

package/dist/libs/segmentedControl/index.d.ts

@@ -0,0 +1,2 @@
+export { default } from "./src/components/Wrapper";
+export { default as Provider, useShared } from "./src/context/shared";

package/dist/libs/segmentedControl/index.js

@@ -0,0 +1,2 @@
+export { default } from "./src/components/Wrapper";
+export { default as Provider, useShared } from "./src/context/shared";

package/dist/libs/segmentedControl/src/colors.d.ts

@@ -0,0 +1,15 @@
+export declare const colors: {
+    light: {
+        text: string;
+        text2: string;
+        background: string;
+        chip: string;
+    };
+    dark: {
+        text: string;
+        text2: string;
+        background: string;
+        chip: string;
+    };
+};
+export default colors;

package/dist/libs/segmentedControl/src/colors.js

@@ -0,0 +1,16 @@
+import colorsLib from "../../../libs/constants/colors";
+export const colors = {
+    light: {
+        text: colorsLib.light.text,
+        text2: colorsLib.light.text2Libretas,
+        background: colorsLib.light.backgroundColor,
+        chip: 'hsl(0, 0%, 93%)',
+    },
+    dark: {
+        text: colorsLib.dark.text,
+        text2: colorsLib.dark.text2Libretas,
+        background: colorsLib.dark.backgroundColor2,
+        chip: 'hsl(0, 0%, 23%)',
+    }
+};
+export default colors;

package/dist/libs/segmentedControl/src/components/AnimatedChip/index.d.ts

@@ -0,0 +1,3 @@
+import Props from './types';
+declare const _default: import("react").MemoExoticComponent<({ isScrollable, onFinishedSelectedIndex, onChangeEqualWidths, widthsShared, widthContainerShared }: Props) => import("react").JSX.Element>;
+export default _default;

package/dist/libs/segmentedControl/src/components/AnimatedChip/index.js

@@ -0,0 +1,79 @@
+import { memo } from 'react';
+import { View, StyleSheet } from 'react-native';
+import Animated, { interpolate, useAnimatedStyle, useDerivedValue, useAnimatedReaction } from 'react-native-reanimated';
+import { scheduleOnRN } from 'react-native-worklets';
+import { useApp } from '../../../../../libs/providers/App';
+import { useShared } from '../../context/shared';
+import colors from '../../colors';
+export default memo(({ isScrollable, onFinishedSelectedIndex, onChangeEqualWidths, widthsShared, widthContainerShared }) => {
+    // ---------------- Variables ----------------
+    const { colorScheme } = useApp();
+    const Theme = colors[colorScheme];
+    const { selectedIndexShared } = useShared();
+    // ---------------- useDerivedValue ----------------
+    const equalWidthsShared = useDerivedValue(() => {
+        if (!isScrollable)
+            return true;
+        const widthContainer = widthContainerShared.value;
+        const widths = widthsShared.value;
+        const sumWidths = widths.reduce((acc, width) => acc + width, 0);
+        return sumWidths <= widthContainer;
+    });
+    const idxInferiorShared = useDerivedValue(() => Math.floor(selectedIndexShared.value));
+    const idxSuperiorShared = useDerivedValue(() => Math.ceil(selectedIndexShared.value));
+    const leftChipShared = useDerivedValue(() => {
+        const widths = widthsShared.value;
+        const inferior = idxInferiorShared.value;
+        const superior = idxSuperiorShared.value;
+        // Los widths son iguales
+        if (equalWidthsShared.value) {
+            const width = widthContainerShared.value / widths.length;
+            const newLeft = interpolate(selectedIndexShared.value, [inferior, superior], [inferior * width, superior * width]);
+            return newLeft;
+        }
+        // Varian los widths
+        const leftInferior = widths.slice(0, inferior).reduce((acc, width) => acc + (width || 0), 0);
+        const leftSuperior = widths.slice(0, superior).reduce((acc, width) => acc + (width || 0), 0);
+        const newLeft = interpolate(selectedIndexShared.value, [inferior, superior], [leftInferior, leftSuperior]);
+        return newLeft;
+    });
+    const widthChipShared = useDerivedValue(() => {
+        const widths = widthsShared.value;
+        if (equalWidthsShared.value)
+            return widthContainerShared.value / widths.length;
+        const inferior = idxInferiorShared.value;
+        const superior = idxSuperiorShared.value;
+        const widthInferior = widths[inferior] || 0;
+        const widthSuperior = widths[superior] || 0;
+        const newWidth = interpolate(selectedIndexShared.value, [inferior, superior], [widthInferior, widthSuperior]);
+        return newWidth;
+    });
+    // ---------------- useAnimatedReaction ----------------
+    useAnimatedReaction(() => selectedIndexShared.value, (value, prev) => {
+        if (prev === value)
+            return;
+        const hasFinished = Number.isInteger(value);
+        if (hasFinished && onFinishedSelectedIndex)
+            scheduleOnRN(onFinishedSelectedIndex, value);
+    });
+    useAnimatedReaction(() => equalWidthsShared.value, (value) => {
+        onChangeEqualWidths && scheduleOnRN(onChangeEqualWidths, value);
+    });
+    // ---------------- useAnimatedStyle ----------------
+    const animatedStyle = useAnimatedStyle(() => {
+        return { width: widthChipShared.value, left: leftChipShared.value };
+    });
+    return (<Animated.View style={[styles.container, animatedStyle]}>
+            <View style={[styles.chip, { backgroundColor: Theme.chip }]}/>
+        </Animated.View>);
+});
+const styles = StyleSheet.create({
+    container: {
+        position: 'absolute',
+        height: '100%',
+    },
+    chip: {
+        flex: 1,
+        borderRadius: 999,
+    },
+});

package/dist/libs/segmentedControl/src/components/AnimatedChip/types.d.ts

@@ -0,0 +1,28 @@
+import type { SharedValue } from "react-native-reanimated";
+type Props = {
+    /**
+        Para ver el ancho del chip.
+    */
+    isScrollable: boolean;
+    /**
+        Se ejecuta cuando el index seleccionado ha terminado de animar (selectedIndexShared).
+        Está dentro de un useAnimatedReaction. Se ejecuta con scheduleOnRN.
+    */
+    onFinishedSelectedIndex?: (index: number) => void;
+    /**
+        Se ejecuta cuando cambia el valor de equalWidthsShared.
+        Está dentro de un useAnimatedReaction. Se ejecuta con scheduleOnRN.
+    */
+    onChangeEqualWidths?: (equalWidths: boolean) => void;
+    /**
+        Usado en el cálculo de equalWidthsShared, leftChipShared, widthChipShared.
+        Se utiliza dentro de useDerivedValue.
+    */
+    widthsShared: SharedValue<number[]>;
+    /**
+        Usado en el cálculo de equalWidthsShared, leftChipShared, widthChipShared.
+        Se utiliza dentro de useDerivedValue.
+    */
+    widthContainerShared: SharedValue<number>;
+};
+export default Props;

package/dist/libs/segmentedControl/src/components/AnimatedChip/types.js

@@ -0,0 +1 @@
+export {};

package/dist/libs/segmentedControl/src/components/Container/index.d.ts

@@ -0,0 +1,3 @@
+import Props from './types';
+declare const _default: import("react").MemoExoticComponent<({ children, onLayout, style }: Props) => import("react").JSX.Element>;
+export default _default;

package/dist/libs/segmentedControl/src/components/Container/index.ios.d.ts

@@ -0,0 +1,3 @@
+import Props from './types';
+declare const _default: import("react").MemoExoticComponent<({ children, onLayout, style }: Props) => import("react").JSX.Element>;
+export default _default;

package/dist/libs/segmentedControl/src/components/Container/index.ios.js

@@ -0,0 +1,15 @@
+import { GlassView } from "expo-glass-effect";
+import { memo } from "react";
+import { StyleSheet } from "react-native";
+export default memo(({ children, onLayout, style }) => {
+    return (<GlassView glassEffectStyle={'clear'} style={[styles.container, style]} onLayout={onLayout}>
+            {children}
+        </GlassView>);
+});
+const styles = StyleSheet.create({
+    container: {
+        borderRadius: 999,
+        minHeight: 32,
+        overflow: 'hidden',
+    }
+});

package/dist/libs/segmentedControl/src/components/Container/index.js

@@ -0,0 +1,18 @@
+import { memo } from "react";
+import { View, StyleSheet } from "react-native";
+import { useApp } from "../../../../../libs/providers/App";
+import colors from "../../colors";
+export default memo(({ children, onLayout, style }) => {
+    const { colorScheme } = useApp();
+    const Theme = colors[colorScheme];
+    return (<View style={[styles.container, { backgroundColor: Theme.background }, style]} onLayout={onLayout}>
+            {children}
+        </View>);
+});
+const styles = StyleSheet.create({
+    container: {
+        borderRadius: 999,
+        minHeight: 32,
+        overflow: 'hidden',
+    }
+});

package/dist/libs/segmentedControl/src/components/Container/types.d.ts

@@ -0,0 +1,16 @@
+import { LayoutChangeEvent, StyleProp, ViewStyle } from "react-native";
+type Props = {
+    /**
+        Children del componente.
+    */
+    children: React.ReactNode;
+    /**
+        Función para obtener el ancho del contenedor.
+    */
+    onLayout: (event: LayoutChangeEvent) => void;
+    /**
+        Style del contenedor.
+    */
+    style?: StyleProp<ViewStyle>;
+};
+export default Props;

package/dist/libs/segmentedControl/src/components/Container/types.js

@@ -0,0 +1 @@
+export {};

package/dist/libs/segmentedControl/src/components/Item/index.d.ts

@@ -0,0 +1,3 @@
+import type Props from "./types";
+declare const _default: import("react").MemoExoticComponent<({ text, onPress, onLayout, textStyle, }: Props) => import("react").JSX.Element>;
+export default _default;

package/dist/libs/segmentedControl/src/components/Item/index.js

@@ -0,0 +1,26 @@
+import { memo } from "react";
+import { Pressable, StyleSheet, Text } from "react-native";
+import { useApp } from "../../../../../libs/providers/App";
+import colors from "../../colors";
+export default memo(({ text, onPress, onLayout, textStyle, }) => {
+    const { colorScheme } = useApp();
+    const Theme = colors[colorScheme];
+    return (<Pressable style={styles.pressable} onPress={onPress} onLayout={onLayout}>
+            <Text numberOfLines={1} style={[styles.text, { color: Theme.text }, textStyle]}>
+                {text}
+            </Text>
+        </Pressable>);
+});
+const styles = StyleSheet.create({
+    pressable: {
+        flex: 1,
+        alignItems: 'center',
+        justifyContent: 'center',
+        paddingHorizontal: 15,
+        overflow: 'hidden',
+    },
+    text: {
+        fontSize: 13,
+        fontWeight: '600',
+    }
+});

package/dist/libs/segmentedControl/src/components/Item/types.d.ts

@@ -0,0 +1,20 @@
+import { LayoutChangeEvent, StyleProp, TextStyle } from "react-native";
+type Props = {
+    /**
+        Texto del item.
+    */
+    text: string;
+    /**
+        onPress del Pressable.
+    */
+    onPress: () => void;
+    /**
+        onLayout del Pressable.
+    */
+    onLayout: (event: LayoutChangeEvent) => void;
+    /**
+        style del texto.
+    */
+    textStyle?: StyleProp<TextStyle>;
+};
+export default Props;

package/dist/libs/segmentedControl/src/components/Item/types.js

@@ -0,0 +1 @@
+export {};

package/dist/libs/segmentedControl/src/components/Segmented/index.d.ts

@@ -0,0 +1,3 @@
+import Props from './types';
+declare const _default: import("react").MemoExoticComponent<({ data, selectedIndex, setCurrentSelectedIndex, isScrollable, style, contentContainerStyle, ...itemProps }: Props) => import("react").JSX.Element>;
+export default _default;