react-crud-mobile 1.3.1 → 1.3.3

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} />;
+}

package/src/elements/core/UIToggle.tsx

@@ -1,102 +1,102 @@
-import React, { useState } from 'react';
-import { ChildType, Utils } from 'react-crud-utils';
-import { StyleSheet, Text, TouchableHighlight, View } from 'react-native';
-import UIListRow from './UIListRow';
-
-export default function UIToggle(props: ChildType) {
-  const scope = props.scope;
-  const options = Utils.nvl(scope.getOptions(), []);
-  const value = scope.getInputValue();
-
-  let [index, setIndex] = useState(0);
-
-  const isSelected = (item: any) => {
-    return item?.value === value;
-  };
-
-  const onClick = (item: any) => {
-    scope.changeValue(item.object);
-    setIndex(++index);
-  };
-
-  const Item = ({ item, index }) => {
-    let selected = isSelected(item);
-    let style: any = { ...styles.text };
-
-    if (selected) style.color = '#ffffff';
-
-    if (Utils.isEmpty(props.children)) {
-      return <Text style={style}>{item.label}</Text>;
-    }
-
-    return (
-      <UIListRow scope={scope} item={item.object} index={index}>
-        {props.children}
-      </UIListRow>
-    );
-  };
-
-  const getItemStyle = (item: any) => {
-    let style = { ...styles.item, ...scope.getStyle('item') };
-
-    let wPart = 100 / options.length;
-    let width = Math.floor(wPart) + '%';
-
-    if (isSelected(item)) {
-      let selectedColor = scope.getPart('selectedColor', undefined, 'primary');
-      let st = scope.getStyle('selected', {
-        backgroundColor: selectedColor,
-        color: '#ffffff',
-      });
-
-      style = { ...style, ...st };
-
-      if (!style.color) {
-        style.color = '#ffffff';
-      }
-    }
-
-    style.width = width;
-
-    return style;
-  };
-
-  return (
-    <>
-      {options.map((item: any, i: number) => (
-        <TouchableHighlight
-          key={`k-${i}`}
-          style={getItemStyle(item)}
-          onPress={e => {
-            onClick(item);
-          }}
-        >
-          <Item item={item} index={i} />
-        </TouchableHighlight>
-      ))}
-    </>
-  );
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    width: '100%',
-    gap: 10,
-    justifyContent: 'center',
-    flexDirection: 'row',
-  },
-  item: {
-    padding: 10,
-    marginVertical: 8,
-    backgroundColor: 'background',
-    borderRadius: 8,
-    justifyContent: 'center',
-    width: 'auto',
-    flexDirection: 'row',
-  },
-  text: {
-    fontSize: 15,
-    fontWeight: '500',
-  },
-});
+import React, { useState } from 'react';
+import { ChildType, Utils } from 'react-crud-utils';
+import { StyleSheet, Text, TouchableHighlight, View } from 'react-native';
+import UIListRow from './UIListRow';
+
+export default function UIToggle(props: ChildType) {
+  const scope = props.scope;
+  const options = Utils.nvl(scope.getOptions(), []);
+  const value = scope.getInputValue();
+
+  let [index, setIndex] = useState(0);
+
+  const isSelected = (item: any) => {
+    return item?.value === value;
+  };
+
+  const onClick = (item: any) => {
+    scope.changeValue(item.object);
+    setIndex(++index);
+  };
+
+  const Item = ({ item, index }) => {
+    let selected = isSelected(item);
+    let style: any = { ...styles.text };
+
+    if (selected) style.color = '#ffffff';
+
+    if (Utils.isEmpty(props.children)) {
+      return <Text style={style}>{item.label}</Text>;
+    }
+
+    return (
+      <UIListRow scope={scope} item={item.object} index={index}>
+        {props.children}
+      </UIListRow>
+    );
+  };
+
+  const getItemStyle = (item: any) => {
+    let style = { ...styles.item, ...scope.getStyle('item') };
+
+    let wPart = 100 / options.length;
+    let width = Math.floor(wPart) + '%';
+
+    if (isSelected(item)) {
+      let selectedColor = scope.getPart('selectedColor', undefined, 'primary');
+      let st = scope.getStyle('selected', {
+        backgroundColor: selectedColor,
+        color: '#ffffff',
+      });
+
+      style = { ...style, ...st };
+
+      if (!style.color) {
+        style.color = '#ffffff';
+      }
+    }
+
+    style.width = width;
+
+    return style;
+  };
+
+  return (
+    <>
+      {options.map((item: any, i: number) => (
+        <TouchableHighlight
+          key={`k-${i}`}
+          style={getItemStyle(item)}
+          onPress={e => {
+            onClick(item);
+          }}
+        >
+          <Item item={item} index={i} />
+        </TouchableHighlight>
+      ))}
+    </>
+  );
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    width: '100%',
+    gap: 10,
+    justifyContent: 'center',
+    flexDirection: 'row',
+  },
+  item: {
+    padding: 10,
+    marginVertical: 8,
+    backgroundColor: 'background',
+    borderRadius: 8,
+    justifyContent: 'center',
+    width: 'auto',
+    flexDirection: 'row',
+  },
+  text: {
+    fontSize: 15,
+    fontWeight: '500',
+  },
+});

package/src/elements/core/UIView.tsx

@@ -1,94 +1,94 @@
-import { ScrollView, StyleSheet, Text, View } from 'react-native';
-
-import UIChildren from '../UIChildren';
-import {
-  ChildType,
-  ComponentUtils,
-  HtmlUtils,
-  Utils,
-  ViewUtils,
-} from 'react-crud-utils';
-import { useEffect, useRef } from 'react';
-import UIToast from './UIToast';
-import MobileUtils from '../../utils/MobileUtils';
-
-export default function UIView({ scope, children }: ChildType) {
-  const theme = scope.getTheme();
-  const header = scope.getPart('header', null, []);
-  const headerStyle = Utils.nvl(theme.styles?.defaults?.header, {});
-  const headerTextStyle = Utils.nvl(theme.styles?.defaults?.headerText, {});
-  const scrollRef = useRef(null);
-
-  useEffect(() => {
-    MobileUtils.syncTheme();
-  }, []);
-
-  const onScroll = () => {
-    const crud = ViewUtils.getCrud();
-
-    Utils.each(crud.scroll, s => {
-      if (s.onScroll) {
-        s.onScroll.call(s);
-      }
-    });
-  };
-
-  let headerStyleFull = Utils.call(() => {
-    let css = scope.getStyle('header', headerStyle);
-    let bg = css.backgroundColor;
-
-    if (bg) {
-      css.color = HtmlUtils.getTextColor(bg);
-    }
-    return css;
-  });
-
-  let hasHeader = !Utils.isEmpty(header);
-  let AuxHeader = () => {
-    if (typeof header === 'string') {
-      return <Text style={headerTextStyle}>{header}</Text>;
-    }
-    return <>{header}</>;
-  };
-
-  scope.put('scrollRef', scrollRef);
-
-  ComponentUtils.setViewScope(scope);
-
-  return (
-    <>
-      {hasHeader && (
-        <View style={headerStyleFull}>
-          <AuxHeader />
-        </View>
-      )}
-      <View style={scope.getStyle('container', styles.container)}>
-        <ScrollView
-          onScroll={onScroll}
-          scrollEventThrottle={16}
-          ref={scrollRef}
-          nestedScrollEnabled={true}
-          keyboardShouldPersistTaps="handled"
-          contentContainerStyle={scope.getStyle('contentContainer', {
-            paddingBottom: 50,
-          })}
-          style={scope.getStyle('scroll', styles.scroll)}
-        >
-          <UIChildren scope={scope}>{children}</UIChildren>
-        </ScrollView>
-      </View>
-      <UIToast /> {/* <- este componente precisa estar aqui */}
-    </>
-  );
-}
-
-const styles = StyleSheet.create({
-  scroll: {
-    paddingTop: 10,
-    paddingBottom: 10,
-    paddingLeft: 15,
-    paddingRight: 15,
-  },
-  container: {},
-  view: {},
-});
+import { ScrollView, StyleSheet, Text, View } from 'react-native';
+
+import UIChildren from '../UIChildren';
+import {
+  ChildType,
+  ComponentUtils,
+  HtmlUtils,
+  Utils,
+  ViewUtils,
+} from 'react-crud-utils';
+import { useEffect, useRef } from 'react';
+import UIToast from './UIToast';
+import MobileUtils from '../../utils/MobileUtils';
+
+export default function UIView({ scope, children }: ChildType) {
+  const theme = scope.getTheme();
+  const header = scope.getPart('header', null, []);
+  const headerStyle = Utils.nvl(theme.styles?.defaults?.header, {});
+  const headerTextStyle = Utils.nvl(theme.styles?.defaults?.headerText, {});
+  const scrollRef = useRef(null);
+
+  useEffect(() => {
+    MobileUtils.syncTheme();
+  }, []);
+
+  const onScroll = () => {
+    const crud = ViewUtils.getCrud();
+
+    Utils.each(crud.scroll, s => {
+      if (s.onScroll) {
+        s.onScroll.call(s);
+      }
+    });
+  };
+
+  let headerStyleFull = Utils.call(() => {
+    let css = scope.getStyle('header', headerStyle);
+    let bg = css.backgroundColor;
+
+    if (bg) {
+      css.color = HtmlUtils.getTextColor(bg);
+    }
+    return css;
+  });
+
+  let hasHeader = !Utils.isEmpty(header);
+  let AuxHeader = () => {
+    if (typeof header === 'string') {
+      return <Text style={headerTextStyle}>{header}</Text>;
+    }
+    return <>{header}</>;
+  };
+
+  scope.put('scrollRef', scrollRef);
+
+  ComponentUtils.setViewScope(scope);
+
+  return (
+    <>
+      {hasHeader && (
+        <View style={headerStyleFull}>
+          <AuxHeader />
+        </View>
+      )}
+      <View style={scope.getStyle('container', styles.container)}>
+        <ScrollView
+          onScroll={onScroll}
+          scrollEventThrottle={16}
+          ref={scrollRef}
+          nestedScrollEnabled={true}
+          keyboardShouldPersistTaps="handled"
+          contentContainerStyle={scope.getStyle('contentContainer', {
+            paddingBottom: 50,
+          })}
+          style={scope.getStyle('scroll', styles.scroll)}
+        >
+          <UIChildren scope={scope}>{children}</UIChildren>
+        </ScrollView>
+      </View>
+      <UIToast /> {/* <- este componente precisa estar aqui */}
+    </>
+  );
+}
+
+const styles = StyleSheet.create({
+  scroll: {
+    paddingTop: 10,
+    paddingBottom: 10,
+    paddingLeft: 15,
+    paddingRight: 15,
+  },
+  container: {},
+  view: {},
+});

package/src/elements/index.ts

@@ -1 +1 @@
-export { default as UI } from "./UI";
+export { default as UI } from "./UI";