native-pytech 1.0.141 → 1.0.143

package/dist/libs/editPage/src/components/Header/index.d.ts

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

package/dist/libs/editPage/src/components/Header/index.js

@@ -0,0 +1,17 @@
+import { memo } from "react";
+import { router, Stack } from "expo-router";
+export default memo(({ saveEnabled, onPressSave }) => {
+    return (<>
+            <Stack.Toolbar placement="left">
+                <Stack.Toolbar.Button onPress={() => router.back()}>
+                    <Stack.Toolbar.Icon sf="xmark"/>
+                </Stack.Toolbar.Button>
+            </Stack.Toolbar>
+
+            <Stack.Toolbar placement="right">
+                <Stack.Toolbar.Button disabled={!saveEnabled} variant="done" onPress={onPressSave}>
+                    <Stack.Toolbar.Icon sf="checkmark"/>
+                </Stack.Toolbar.Button>
+            </Stack.Toolbar>
+        </>);
+});

package/dist/libs/editPage/src/components/Header/index.web.d.ts

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

package/dist/libs/editPage/src/components/Header/index.web.js

@@ -0,0 +1,17 @@
+import { memo } from "react";
+import { Stack } from "expo-router";
+import { Pressable, StyleSheet } from "react-native";
+import { Ionicons } from "@expo/vector-icons";
+import Colors from "../../../../../libs/constants/colors";
+export default memo(({ saveEnabled, onPressSave }) => {
+    return (<Stack.Screen options={{
+            headerRight: () => (<Pressable disabled={!saveEnabled} onPress={onPressSave} style={[styles.pressable, { opacity: saveEnabled ? 1 : 0.5 }]}>
+                        <Ionicons name="checkmark" size={24} color={Colors.especiales.azul}/>
+                    </Pressable>)
+        }}/>);
+});
+const styles = StyleSheet.create({
+    pressable: {
+        padding: 10,
+    }
+});

package/dist/libs/editPage/src/components/Header/types.d.ts

@@ -0,0 +1,5 @@
+type Props = {
+    saveEnabled: boolean;
+    onPressSave: () => Promise<void>;
+};
+export default Props;

package/dist/libs/editPage/src/components/Header/types.js

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

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

@@ -1,3 +1,3 @@
 import type Props from './types';
-declare const _default: ({ ...props }: Props) => null;
+declare const _default: import("react").MemoExoticComponent<({ label, minLengthSpacer, placeholder, ...textFieldProps }: Props) => import("react").JSX.Element>;
 export default _default;

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

@@ -1 +1,8 @@
-export default ({ ...props }) => null;
+import { memo } from 'react';
+import Table from '../../../../../libs/table';
+import { useApp } from '../../../../../libs/providers/App';
+import TextField from '../TextField';
+export default memo(({ label, minLengthSpacer, placeholder, ...textFieldProps }) => {
+    const { colorScheme } = useApp();
+    return (<Table.Option id={label ?? ''} colorScheme={colorScheme} childrenLeft={label ? <Table.Option.Components.Text text={label}/> : <Table.Option.Components.Text text={placeholder ?? ''}/>} childrenRight={<TextField placeholder={label ? placeholder : undefined} {...textFieldProps}/>}/>);
+});

package/dist/libs/editPage/src/components/ItemDate/index.d.ts

@@ -1,3 +1,3 @@
 import type Props from './types';
-declare const _default: ({ ...props }: Props) => null;
+declare const _default: import("react").MemoExoticComponent<({ itemKey, label, defaultValue, minDate, maxDate, }: Props) => import("react").JSX.Element>;
 export default _default;

package/dist/libs/editPage/src/components/ItemDate/index.js

@@ -1 +1,48 @@
-export default ({ ...props }) => null;
+import { memo, useCallback, useEffect, useRef, useState } from 'react';
+import { Pressable, StyleSheet } from 'react-native';
+import Table from '../../../../../libs/table';
+import { useApp } from '../../../../../libs/providers/App';
+import Formats from '../../../../../libs/constants/formats';
+import { usePage } from '../../context/page';
+import Colors from '../../../../../libs/constants/colors';
+export default memo(({ itemKey, label, defaultValue, minDate = new Date(new Date().setFullYear(new Date().getFullYear() - 100)), maxDate = new Date(), }) => {
+    const { colorScheme } = useApp();
+    const { store, registerItem } = usePage();
+    const [selection, setSelection] = useState(defaultValue);
+    const inputRef = useRef(null);
+    // Key
+    const keyRef = useRef(itemKey);
+    useEffect(() => {
+        keyRef.current = registerItem(itemKey);
+    }, []);
+    // Hooks
+    useEffect(() => setSelection(defaultValue), [defaultValue]);
+    const onValueChange = useCallback((value_str) => {
+        const [year, month, day] = value_str.split('-').map(Number);
+        const value = new Date(year, month - 1, day);
+        setSelection(value);
+        store.values[keyRef.current ?? 0].set({
+            value: value,
+            hasChanged: value.getTime() !== defaultValue?.getTime(),
+            isValid: true,
+        });
+    }, []);
+    return (<Table.Option id={label ?? ''} colorScheme={colorScheme} childrenLeft={<Table.Option.Components.Text text={label ?? 'Seleccione una fecha'}/>} childrenRight={(<>
+                    <Pressable onPress={() => inputRef.current?.showPicker()} style={[styles.container, { backgroundColor: Colors.especiales.azul }]}>
+                        <Table.Option.Components.Text text={selection ? Formats.dateToTextFormat(selection, 'dd/MM/yyyy') : ''} style={{ color: 'white', userSelect: 'none' }}/>
+                        <input ref={inputRef} type="date" value={selection ? Formats.dateToTextFormat(selection, 'yyyy-MM-dd') : ''} onChange={(e) => onValueChange(e.target.value)} style={{
+                all: 'unset',
+                visibility: 'hidden',
+                width: 0,
+                position: 'absolute'
+            }}/>
+                    </Pressable>
+                </>)}/>);
+});
+const styles = StyleSheet.create({
+    container: {
+        padding: 10,
+        paddingHorizontal: 30,
+        borderRadius: 20
+    },
+});

package/dist/libs/editPage/src/components/Screen/index.d.ts

@@ -1,4 +1,4 @@
 declare const _default: ({ children }: {
     children: React.ReactNode;
-}) => null;
+}) => import("react").JSX.Element;
 export default _default;

package/dist/libs/editPage/src/components/Screen/index.js

@@ -1 +1,7 @@
-export default ({ children }) => null;
+import { ScrollView } from 'react-native';
+import Table from '../../../../../libs/table';
+export default ({ children }) => (<ScrollView showsVerticalScrollIndicator={false}>
+		<Table>
+			{children}
+		</Table>
+	</ScrollView>);

package/dist/libs/editPage/src/components/TextField/index.d.ts

@@ -1,3 +1,3 @@
 import type Props from './types';
-declare const _default: ({ ...props }: Props) => null;
+declare const _default: import("react").MemoExoticComponent<({ itemKey, defaultValue, placeholder, keyboardType, autocapitalization, secureTextEntry, isValid, }: Props) => import("react").JSX.Element>;
 export default _default;

package/dist/libs/editPage/src/components/TextField/index.js

@@ -1 +1,28 @@
-export default ({ ...props }) => null;
+import { memo, useRef, useCallback, useEffect } from "react";
+import { useValue } from "@legendapp/state/react";
+import { useApp } from '../../../../../libs/providers/App';
+import Table from '../../../../../libs/table';
+import { usePage } from '../../context/page';
+import Colors from '../../../../../libs/constants/colors';
+export default memo(({ itemKey, defaultValue, placeholder, keyboardType, autocapitalization = true, secureTextEntry, isValid, }) => {
+    const { colorScheme } = useApp();
+    const { store, registerItem, onSubmit: _onSubmit } = usePage();
+    const isUniqueItem = useValue(() => store.isUniqueItem.get());
+    const ref = useRef(null);
+    // Key
+    const keyRef = useRef(itemKey ?? 0);
+    useEffect(() => {
+        keyRef.current = registerItem(itemKey, ref);
+        onValueChange(defaultValue ?? '');
+    }, []);
+    // onChange
+    const onValueChange = useCallback((value) => {
+        const _value = value.trim() === '' ? null : value.trim();
+        store.values[keyRef.current].set({
+            value: _value,
+            hasChanged: _value != defaultValue,
+            isValid: isValid?.(_value) ?? true,
+        });
+    }, []);
+    return <Table.Option.Components.TextInput onChangeText={onValueChange} value={defaultValue} placeholderTextColor={Colors[colorScheme].SearchBarText} placeholder={placeholder ?? defaultValue} keyboardType={keyboardType} autoFocus={isUniqueItem} autoCapitalize={!autocapitalization ? 'none' : undefined} secureTextEntry={secureTextEntry} onSubmitEditing={() => _onSubmit(keyRef.current)}/>;
+});

package/dist/libs/editPage/src/components/TextField/types.d.ts

@@ -14,7 +14,7 @@ type Props = {
     /**
         Keyboard type. Uses the keyboardType modifier.
     */
-    keyboardType?: "default" | "email-address" | "numeric" | "phone-pad" | "ascii-capable" | "numbers-and-punctuation" | "url" | "name-phone-pad" | "decimal-pad" | "twitter" | "web-search" | "ascii-capable-number-pad";
+    keyboardType?: "default" | "email-address" | "numeric" | "phone-pad" | "ascii-capable" | "numbers-and-punctuation" | "url" | "name-phone-pad" | "decimal-pad" | "twitter" | "web-search";
     /**
         If true, the text field will be autocapitalized. Uses the textInputAutocapitalization modifier.
         @default true

package/dist/libs/editPage/src/components/Wrapper/index.js

@@ -1,8 +1,9 @@
 import { useObservable, useValue } from '@legendapp/state/react';
-import { Stack, router } from 'expo-router';
+import { router } from 'expo-router';
 import { memo, useCallback, useMemo, useRef } from 'react';
 import { Provider } from '../../context/page';
 import Screen from '../Screen';
+import Header from '../Header';
 export default memo(({ children, onSave }) => {
     const textFieldsRefs = useRef({});
     const indexRef = useRef(0);
@@ -21,6 +22,7 @@ export default memo(({ children, onSave }) => {
         },
     });
     const saveEnabled = useValue(() => store.saveEnabled.get());
+    console.log('saveEnabled', saveEnabled);
     // onPress
     const onPressSave = useCallback(async () => {
         // Obtengo los valores del store
@@ -50,10 +52,9 @@ export default memo(({ children, onSave }) => {
         textFieldsRefs.current[nextKey].current?.focus();
     };
     const onSubmit = async (itemKey) => {
-        console.log('onSubmit', 'itemKey', itemKey);
         // Guarda los cambios
         if (store.isUniqueItem.peek()) {
-            if (!saveEnabled)
+            if (!store.saveEnabled.peek())
                 return;
             await onPressSave();
             return;
@@ -63,18 +64,7 @@ export default memo(({ children, onSave }) => {
     };
     const value = useMemo(() => ({ store, onSubmit, registerItem }), []);
     return (<>
-			<Stack.Toolbar placement="left">
-				<Stack.Toolbar.Button onPress={() => router.back()}>
-					<Stack.Toolbar.Icon sf="xmark"/>
-				</Stack.Toolbar.Button>
-			</Stack.Toolbar>
-
-			<Stack.Toolbar placement="right">
-				<Stack.Toolbar.Button disabled={!saveEnabled} variant="done" onPress={onPressSave}>
-					<Stack.Toolbar.Icon sf="checkmark"/>
-				</Stack.Toolbar.Button>
-			</Stack.Toolbar>
-
+			<Header saveEnabled={saveEnabled} onPressSave={onPressSave}/>
 			<Screen>
 				<Provider value={value}>
 					{children}

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

@@ -49,7 +49,7 @@ const styles = StyleSheet.create({
     pressable: {
         backgroundColor: Colors.especiales.azul,
         padding: 10,
-        borderRadius: 10
+        borderRadius: 20
     },
     label: {
         color: 'white',

package/dist/libs/table/src/components/OptionComponents/text.js

@@ -16,5 +16,6 @@ const Component = memo(({ text, enabled = true, style = {}, colorScheme, fontSca
 const styles = StyleSheet.create({
     text: {
         fontSize: 17,
+        userSelect: 'none'
     }
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "native-pytech",
-  "version": "1.0.141",
+  "version": "1.0.143",
   "description": "Libreria de React Native Pytech",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",