react-crud-mobile 1.3.333 → 1.3.334

package/src/elements/core/UISelect.tsx

@@ -1,175 +1,175 @@
-import { useRef, useState } from 'react';
-import { ChildType, MethodType, Utils, ViewUtils } from 'react-crud-utils';
-import {
-  Text,
-  TouchableOpacity,
-  StyleSheet,
-  Modal,
-  View,
-  SafeAreaView,
-  ScrollView,
-} from 'react-native';
-import { Ionicons } from '@expo/vector-icons';
-import UI from '../UI';
-
-export default function UISelect(props: ChildType) {
-  const [modalVisible, setModalVisible] = useState(false);
-  const scope = props.scope;
-  const original = scope.original;
-  const items = Utils.nvl(scope.getOptions(), []);
-  const placeholder = scope.attr('placeholder', 'Selecione...');
-  const value = scope.getDisplayValue();
-  const theme = scope.getTheme();
-  const headerStyle = Utils.nvl(theme.styles?.defaults?.header, {});
-  const handlePress = () => {
-    setModalVisible(!modalVisible);
-  };
-
-  const scrollRef = useRef(null);
-  const iconColor = Utils.nvl(theme.colors?.text, '#100e0e');
-  const modalColor = Utils.nvl(headerStyle.color, 'white');
-  const defaults = { color: modalColor };
-  const onClick = ({ crud, value }: MethodType) => {
-    let val = value as any;
-
-    if (original.isObject && val?.object) {
-      scope.changeValue(val?.object);
-    } else if (val?.value) {
-      scope.changeValue(val?.value);
-    } else {
-      scope.changeValue(value);
-    }
-
-    setModalVisible(false);
-  };
-
-  const style = (part: string, extra?: any) => {
-    let all = { ...styles[part], ...extra };
-
-    return scope.getStyle(part, all);
-  };
-
-  const isModalVisible = () => {
-    return modalVisible;
-  };
-  //v4
-
-  return (
-    <View
-      key={scope.getName(`${scope.getPart('modal')}_${modalVisible}`)}
-      style={style('selectRoot')}
-    >
-      <TouchableOpacity onPress={handlePress} style={style('selectInput')}>
-        <Text style={style('selectLabel')}>
-          {Utils.nvl(value, placeholder)}
-        </Text>
-        <Ionicons
-          name="chevron-down-outline"
-          size={scope.getPart('iconSize', null, 24)}
-          color={scope.getPart('iconColor', null, iconColor)}
-          style={style('iconStyle', {})}
-        />
-      </TouchableOpacity>
-      <Modal
-        animationType="slide"
-        transparent={true}
-        visible={isModalVisible()}
-        onRequestClose={() => setModalVisible(false)}
-      >
-        <SafeAreaView style={style('modalTop')} />
-        <SafeAreaView style={style('modalSafe')}>
-          <View style={scope.getStyle('header', headerStyle)}>
-            <TouchableOpacity
-              onPress={handlePress}
-              style={style('modalCloseButton')}
-            >
-              <Ionicons
-                name="close"
-                size={24}
-                color={modalColor}
-                style={style('modalCloseText', defaults)}
-              />
-            </TouchableOpacity>
-            <Text style={style('modalTitle', defaults)}>{placeholder}</Text>
-          </View>
-          <ScrollView
-            contentContainerStyle={{ flexGrow: 1, paddingBottom: 50 }}
-            style={style('modalContent')}
-            nestedScrollEnabled={true}
-            ref={scrollRef}
-          >
-            <View
-              style={{
-                flex: 1,
-                paddingLeft: 15,
-                paddingRight: 15,
-                paddingTop: 10,
-                paddingBottom: 10,
-              }}
-            >
-              <UI.List
-                data={items}
-                name={scope.getName('list')}
-                layout="card"
-                search={original.search === true}
-                click={onClick}
-                rowStyle={{
-                  paddingLeft: 15,
-                  paddinRight: 15,
-                  ...original?.rowStyle,
-                }}
-                {...original?.listProps}
-              >
-                <UI.Value value="#{@this.label}" />
-              </UI.List>
-            </View>
-          </ScrollView>
-        </SafeAreaView>
-      </Modal>
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  selectRoot: {
-    justifyContent: 'flex-start',
-    alignItems: 'flex-start',
-    flex: 1,
-  },
-  selectInput: {
-    width: '100%',
-    flexDirection: 'row',
-    borderRadius: 5,
-    paddingHorizontal: 15,
-    borderWidth: 1,
-    borderStyle: 'solid',
-    borderColor: '#dedede',
-    paddingVertical: 10,
-  },
-  selectLabel: { flex: 1 },
-  modalTop: {
-    backgroundColor: 'primary',
-    width: '100%',
-  },
-  modalSafe: {
-    flex: 1,
-    width: '100%',
-    backgroundColor: 'background',
-  },
-  modalCloseButton: {
-    padding: 10,
-  },
-  modalCloseText: {
-    fontSize: 18,
-    color: 'white',
-  },
-  modalTitle: {
-    fontSize: 18,
-    fontWeight: 'bold',
-    marginLeft: 10,
-  },
-  modalContent: {
-    flex: 1,
-    backgroundColor: 'background',
-  },
-});
+import { useRef, useState } from 'react';
+import { ChildType, MethodType, Utils, ViewUtils } from 'react-crud-utils';
+import {
+  Text,
+  TouchableOpacity,
+  StyleSheet,
+  Modal,
+  View,
+  SafeAreaView,
+  ScrollView,
+} from 'react-native';
+import { Ionicons } from '@expo/vector-icons';
+import UI from '../UI';
+
+export default function UISelect(props: ChildType) {
+  const [modalVisible, setModalVisible] = useState(false);
+  const scope = props.scope;
+  const original = scope.original;
+  const items = Utils.nvl(scope.getOptions(), []);
+  const placeholder = scope.attr('placeholder', 'Selecione...');
+  const value = scope.getDisplayValue();
+  const theme = scope.getTheme();
+  const headerStyle = Utils.nvl(theme.styles?.defaults?.header, {});
+  const handlePress = () => {
+    setModalVisible(!modalVisible);
+  };
+
+  const scrollRef = useRef(null);
+  const iconColor = Utils.nvl(theme.colors?.text, '#100e0e');
+  const modalColor = Utils.nvl(headerStyle.color, 'white');
+  const defaults = { color: modalColor };
+  const onClick = ({ crud, value }: MethodType) => {
+    let val = value as any;
+
+    if (original.isObject && val?.object) {
+      scope.changeValue(val?.object);
+    } else if (val?.value) {
+      scope.changeValue(val?.value);
+    } else {
+      scope.changeValue(value);
+    }
+
+    setModalVisible(false);
+  };
+
+  const style = (part: string, extra?: any) => {
+    let all = { ...styles[part], ...extra };
+
+    return scope.getStyle(part, all);
+  };
+
+  const isModalVisible = () => {
+    return modalVisible;
+  };
+  //v4
+
+  return (
+    <View
+      key={scope.getName(`${scope.getPart('modal')}_${modalVisible}`)}
+      style={style('selectRoot')}
+    >
+      <TouchableOpacity onPress={handlePress} style={style('selectInput')}>
+        <Text style={style('selectLabel')}>
+          {Utils.nvl(value, placeholder)}
+        </Text>
+        <Ionicons
+          name="chevron-down-outline"
+          size={scope.getPart('iconSize', null, 24)}
+          color={scope.getPart('iconColor', null, iconColor)}
+          style={style('iconStyle', {})}
+        />
+      </TouchableOpacity>
+      <Modal
+        animationType="slide"
+        transparent={true}
+        visible={isModalVisible()}
+        onRequestClose={() => setModalVisible(false)}
+      >
+        <SafeAreaView style={style('modalTop')} />
+        <SafeAreaView style={style('modalSafe')}>
+          <View style={scope.getStyle('header', headerStyle)}>
+            <TouchableOpacity
+              onPress={handlePress}
+              style={style('modalCloseButton')}
+            >
+              <Ionicons
+                name="close"
+                size={24}
+                color={modalColor}
+                style={style('modalCloseText', defaults)}
+              />
+            </TouchableOpacity>
+            <Text style={style('modalTitle', defaults)}>{placeholder}</Text>
+          </View>
+          <ScrollView
+            contentContainerStyle={{ flexGrow: 1, paddingBottom: 50 }}
+            style={style('modalContent')}
+            nestedScrollEnabled={true}
+            ref={scrollRef}
+          >
+            <View
+              style={{
+                flex: 1,
+                paddingLeft: 15,
+                paddingRight: 15,
+                paddingTop: 10,
+                paddingBottom: 10,
+              }}
+            >
+              <UI.List
+                data={items}
+                name={scope.getName('list')}
+                layout="card"
+                search={original.search === true}
+                click={onClick}
+                rowStyle={{
+                  paddingLeft: 15,
+                  paddinRight: 15,
+                  ...original?.rowStyle,
+                }}
+                {...original?.listProps}
+              >
+                <UI.Value value="#{@this.label}" />
+              </UI.List>
+            </View>
+          </ScrollView>
+        </SafeAreaView>
+      </Modal>
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  selectRoot: {
+    justifyContent: 'flex-start',
+    alignItems: 'flex-start',
+    flex: 1,
+  },
+  selectInput: {
+    width: '100%',
+    flexDirection: 'row',
+    borderRadius: 5,
+    paddingHorizontal: 15,
+    borderWidth: 1,
+    borderStyle: 'solid',
+    borderColor: '#dedede',
+    paddingVertical: 10,
+  },
+  selectLabel: { flex: 1 },
+  modalTop: {
+    backgroundColor: 'primary',
+    width: '100%',
+  },
+  modalSafe: {
+    flex: 1,
+    width: '100%',
+    backgroundColor: 'background',
+  },
+  modalCloseButton: {
+    padding: 10,
+  },
+  modalCloseText: {
+    fontSize: 18,
+    color: 'white',
+  },
+  modalTitle: {
+    fontSize: 18,
+    fontWeight: 'bold',
+    marginLeft: 10,
+  },
+  modalContent: {
+    flex: 1,
+    backgroundColor: 'background',
+  },
+});

package/src/elements/core/UISlider.tsx

@@ -1,61 +1,61 @@
-import { useState } from 'react';
-import { ChildType, ComponentUtils, Utils } from 'react-crud-utils';
-import { Switch } from 'react-native';
-import Slider from '@react-native-community/slider';
-
-export default function UISlider(props: ChildType) {
-  const scope = props.scope;
-  const initial = Utils.nvl(scope.getValue(), 0);
-  const [value, setValue] = useState(initial);
-
-  //redeploy 0
-
-  let onChange = v => {
-    v = Utils.nvl(v, 0);
-
-    console.log(v);
-
-    scope.changeValue(v);
-
-    setValue(v);
-  };
-
-  let step = scope.attr('step', 1);
-  let min = scope.attr('min', 0);
-  let max = scope.attr('min', 100);
-
-  let onSlideScroll = (scrollEnabled: boolean) => {
-    let viewScope = ComponentUtils.getViewScope();
-
-    if (scope.original.debug) {
-      console.log(viewScope);
-    }
-
-    if (viewScope) {
-      let scrollRef = viewScope.get('scrollRef');
-
-      if (scrollRef) scrollRef.current?.setNativeProps?.({ scrollEnabled });
-    }
-  };
-  return (
-    <>
-      <Slider
-        minimumValue={min}
-        maximumValue={max}
-        step={step}
-        minimumTrackTintColor="#1EB1FC"
-        maximumTrackTintColor="#d3d3d3"
-        thumbTintColor="#1EB1FC"
-        value={value}
-        onSlidingStart={() => onSlideScroll(false)}
-        onSlidingComplete={() => onSlideScroll(true)}
-        style={{ width: '100%', height: 40, ...scope.getStyle('element') }}
-        onValueChange={onChange} // Alterna o estado
-      />
-    </>
-  );
-}
-
-const styles = {
-  link: {},
-};
+import { useState } from 'react';
+import { ChildType, ComponentUtils, Utils } from 'react-crud-utils';
+import { Switch } from 'react-native';
+import Slider from '@react-native-community/slider';
+
+export default function UISlider(props: ChildType) {
+  const scope = props.scope;
+  const initial = Utils.nvl(scope.getValue(), 0);
+  const [value, setValue] = useState(initial);
+
+  //redeploy 0
+
+  let onChange = v => {
+    v = Utils.nvl(v, 0);
+
+    console.log(v);
+
+    scope.changeValue(v);
+
+    setValue(v);
+  };
+
+  let step = scope.attr('step', 1);
+  let min = scope.attr('min', 0);
+  let max = scope.attr('min', 100);
+
+  let onSlideScroll = (scrollEnabled: boolean) => {
+    let viewScope = ComponentUtils.getViewScope();
+
+    if (scope.original.debug) {
+      console.log(viewScope);
+    }
+
+    if (viewScope) {
+      let scrollRef = viewScope.get('scrollRef');
+
+      if (scrollRef) scrollRef.current?.setNativeProps?.({ scrollEnabled });
+    }
+  };
+  return (
+    <>
+      <Slider
+        minimumValue={min}
+        maximumValue={max}
+        step={step}
+        minimumTrackTintColor="#1EB1FC"
+        maximumTrackTintColor="#d3d3d3"
+        thumbTintColor="#1EB1FC"
+        value={value}
+        onSlidingStart={() => onSlideScroll(false)}
+        onSlidingComplete={() => onSlideScroll(true)}
+        style={{ width: '100%', height: 40, ...scope.getStyle('element') }}
+        onValueChange={onChange} // Alterna o estado
+      />
+    </>
+  );
+}
+
+const styles = {
+  link: {},
+};

package/src/elements/core/UIStatusBar.tsx

@@ -1,5 +1,5 @@
-import { StatusBar } from 'expo-status-bar';
-
-export default function UIStatusBar() {
-  return <StatusBar style="dark" backgroundColor="#f5f5f5" />;
-}
+import { StatusBar } from 'expo-status-bar';
+
+export default function UIStatusBar() {
+  return <StatusBar style="dark" backgroundColor="#f5f5f5" />;
+}

package/src/elements/core/UISwitch.tsx

@@ -1,27 +1,27 @@
-import { useState } from 'react';
-import { ChildType, Utils } from 'react-crud-utils';
-import { Switch } from 'react-native';
-
-export default function UISwitch(props: ChildType) {
-  const scope = props.scope;
-  const initial = Utils.nvl(scope.getValue(), false) as boolean;
-  const [value, setValue] = useState(initial);
-
-  let onChange = v => {
-    scope.changeValue(v);
-
-    setValue(v);
-  };
-
-  return (
-    <Switch
-      value={value}
-      style={scope.getStyle('element')}
-      onValueChange={onChange} // Alterna o estado
-    />
-  );
-}
-
-const styles = {
-  link: {},
-};
+import { useState } from 'react';
+import { ChildType, Utils } from 'react-crud-utils';
+import { Switch } from 'react-native';
+
+export default function UISwitch(props: ChildType) {
+  const scope = props.scope;
+  const initial = Utils.nvl(scope.getValue(), false) as boolean;
+  const [value, setValue] = useState(initial);
+
+  let onChange = v => {
+    scope.changeValue(v);
+
+    setValue(v);
+  };
+
+  return (
+    <Switch
+      value={value}
+      style={scope.getStyle('element')}
+      onValueChange={onChange} // Alterna o estado
+    />
+  );
+}
+
+const styles = {
+  link: {},
+};

package/src/elements/core/UIToast.tsx

@@ -1,44 +1,44 @@
-import { StyleSheet } from 'react-native';
-import Toast, { BaseToast, ErrorToast } from 'react-native-toast-message';
-
-export default function UIToast() {
-  const toastConfig = {
-    success: props => (
-      <BaseToast
-        {...props}
-        style={styles.darkToast}
-        contentContainerStyle={{ paddingHorizontal: 15 }}
-        text1Style={styles.text}
-        text2Style={styles.text}
-      />
-    ),
-    error: props => (
-      <ErrorToast
-        {...props}
-        style={styles.darkToast}
-        text1Style={styles.text}
-        text2Style={styles.text}
-      />
-    ),
-    info: props => (
-      <BaseToast
-        {...props}
-        style={styles.darkToast}
-        text1Style={styles.text}
-        text2Style={styles.text}
-      />
-    ),
-  };
-
-  const styles = StyleSheet.create({
-    darkToast: {
-      backgroundColor: 'rgba(34, 34, 34, 0.85)',
-      borderLeftColor: '#222', // borda mais escura
-    },
-    text: {
-      color: '#fff', // letras brancas
-      textAlign: 'center',
-    },
-  });
-  return <Toast config={toastConfig} />;
-}
+import { StyleSheet } from 'react-native';
+import Toast, { BaseToast, ErrorToast } from 'react-native-toast-message';
+
+export default function UIToast() {
+  const toastConfig = {
+    success: props => (
+      <BaseToast
+        {...props}
+        style={styles.darkToast}
+        contentContainerStyle={{ paddingHorizontal: 15 }}
+        text1Style={styles.text}
+        text2Style={styles.text}
+      />
+    ),
+    error: props => (
+      <ErrorToast
+        {...props}
+        style={styles.darkToast}
+        text1Style={styles.text}
+        text2Style={styles.text}
+      />
+    ),
+    info: props => (
+      <BaseToast
+        {...props}
+        style={styles.darkToast}
+        text1Style={styles.text}
+        text2Style={styles.text}
+      />
+    ),
+  };
+
+  const styles = StyleSheet.create({
+    darkToast: {
+      backgroundColor: 'rgba(34, 34, 34, 0.85)',
+      borderLeftColor: '#222', // borda mais escura
+    },
+    text: {
+      color: '#fff', // letras brancas
+      textAlign: 'center',
+    },
+  });
+  return <Toast config={toastConfig} />;
+}