react-crud-mobile 1.0.671 → 1.0.673

package/src/elements/core/UIList.tsx

@@ -1,133 +1,133 @@
-import React, { useState } from 'react';
-import { ChildType, ComponentUtils, ScopeUtils, Utils } from 'react-crud-utils';
-import { StyleSheet, Text, TouchableHighlight, View } from 'react-native';
-import UIListRow from './UIListRow';
-import UI from '../UI';
-import { Ionicons } from '@expo/vector-icons';
-
-export default function UIList(props: ChildType) {
-  const scope = props.scope;
-  const crud = scope.crud;
-  const original = scope.original;
-  const cols = Utils.nvl(original.cols, 1);
-  const items = Utils.nvl(scope.getItems(), []);
-  const styles = { repeat: stylesRepeat, list: stylesList }?.[original.type];
-  const add = ComponentUtils.getDefine(props, 'add');
-  const hideAddWhenEmpty = original.hideAddWhenEmpty;
-
-  let [index, setIndex] = useState(0);
-
-  scope.update = () => {
-    scope.updateIndex = ++index;
-
-    setIndex(index);
-  };
-
-  const getStyle = (key: string, extra?: any) => {
-    return scope.getStyle(key, { ...extra, ...styles[key] });
-  };
-
-  const getContainerStyle = (extra?: any) => {
-    let row = getStyle('container', {});
-
-    if (cols > 1) {
-      row = { ...row, flexDirection: 'row', flexWrap: 'wrap' };
-    }
-
-    return row;
-  };
-
-  const isShowAdd = () => {
-    if (!Utils.isEmpty(items)) {
-      return true;
-    }
-    return hideAddWhenEmpty !== true;
-  };
-
-  let Empty = () => {
-    if (!Utils.isEmpty(items)) {
-      return <></>;
-    }
-
-    let empty = scope.attr('empty', 'Sem registro');
-
-    if (!empty) {
-      return <></>;
-    }
-
-    if (typeof empty === 'string') {
-      return (
-        <Text
-          style={scope.getStyle('empty', {
-            flex: 1,
-            fontWeight: 500,
-            fontSize: 20,
-            padding: 10,
-            textAlign: 'center',
-            justifyContent: 'center',
-            alignItems: 'center',
-          })}
-        >
-          {empty}
-        </Text>
-      );
-    }
-
-    return <>{empty}</>;
-  };
-
-  let keyData = scope.key('data');
-
-  return (
-    <>
-      {original.search !== false && (
-        <UI.Text
-          placeholder="Pesquisar..."
-          field="query"
-          crud={crud}
-          right={<Ionicons name="search" size={20} color="#888" />}
-        />
-      )}
-
-      <View key={keyData} style={getContainerStyle()}>
-        <Empty />
-        {items.map((item: any, i: number) => (
-          <UIListRow index={i} item={item} scope={scope}>
-            {props.children}
-          </UIListRow>
-        ))}
-        {isShowAdd() && <>{add}</>}
-      </View>
-    </>
-  );
-}
-
-const stylesList = StyleSheet.create({
-  container: {
-    flex: 1,
-    width: '100%',
-    flexDirection: 'row',
-    flexWrap: 'wrap',
-    alignItems: 'stretch',
-    gap: 10,
-  },
-  text: {
-    fontSize: 18,
-    fontWeight: 'bold',
-  },
-});
-
-const stylesRepeat = StyleSheet.create({
-  container: {
-    flex: 1,
-    width: '100%',
-    flexDirection: 'row',
-    flexWrap: 'wrap',
-    gap: 10,
-    alignItems: 'stretch',
-  },
-  text: {
-    fontSize: 18,
-    fontWeight: 'bold',
-  },
-});
+import React, { useState } from 'react';
+import { ChildType, ComponentUtils, ScopeUtils, Utils } from 'react-crud-utils';
+import { StyleSheet, Text, TouchableHighlight, View } from 'react-native';
+import UIListRow from './UIListRow';
+import UI from '../UI';
+import { Ionicons } from '@expo/vector-icons';
+
+export default function UIList(props: ChildType) {
+  const scope = props.scope;
+  const crud = scope.crud;
+  const original = scope.original;
+  const cols = Utils.nvl(original.cols, 1);
+  const items = Utils.nvl(scope.getItems(), []);
+  const styles = { repeat: stylesRepeat, list: stylesList }?.[original.type];
+  const add = ComponentUtils.getDefine(props, 'add');
+  const hideAddWhenEmpty = original.hideAddWhenEmpty;
+
+  let [index, setIndex] = useState(0);
+
+  scope.update = () => {
+    scope.updateIndex = ++index;
+
+    setIndex(index);
+  };
+
+  const getStyle = (key: string, extra?: any) => {
+    return scope.getStyle(key, { ...extra, ...styles[key] });
+  };
+
+  const getContainerStyle = (extra?: any) => {
+    let row = getStyle('container', {});
+
+    if (cols > 1) {
+      row = { ...row, flexDirection: 'row', flexWrap: 'wrap' };
+    }
+
+    return row;
+  };
+
+  const isShowAdd = () => {
+    if (!Utils.isEmpty(items)) {
+      return true;
+    }
+    return hideAddWhenEmpty !== true;
+  };
+
+  let Empty = () => {
+    if (!Utils.isEmpty(items)) {
+      return <></>;
+    }
+
+    let empty = scope.attr('empty', 'Sem registro');
+
+    if (!empty) {
+      return <></>;
+    }
+
+    if (typeof empty === 'string') {
+      return (
+        <Text
+          style={scope.getStyle('empty', {
+            flex: 1,
+            fontWeight: 500,
+            fontSize: 20,
+            padding: 10,
+            textAlign: 'center',
+            justifyContent: 'center',
+            alignItems: 'center',
+          })}
+        >
+          {empty}
+        </Text>
+      );
+    }
+
+    return <>{empty}</>;
+  };
+
+  let keyData = scope.key('data');
+
+  return (
+    <>
+      {original.search !== false && (
+        <UI.Text
+          placeholder="Pesquisar..."
+          field="query"
+          crud={crud}
+          right={<Ionicons name="search" size={20} color="#888" />}
+        />
+      )}
+
+      <View key={keyData} style={getContainerStyle()}>
+        <Empty />
+        {items.map((item: any, i: number) => (
+          <UIListRow index={i} item={item} scope={scope}>
+            {props.children}
+          </UIListRow>
+        ))}
+        {isShowAdd() && <>{add}</>}
+      </View>
+    </>
+  );
+}
+
+const stylesList = StyleSheet.create({
+  container: {
+    flex: 1,
+    width: '100%',
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    alignItems: 'stretch',
+    gap: 10,
+  },
+  text: {
+    fontSize: 18,
+    fontWeight: 'bold',
+  },
+});
+
+const stylesRepeat = StyleSheet.create({
+  container: {
+    flex: 1,
+    width: '100%',
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    gap: 10,
+    alignItems: 'stretch',
+  },
+  text: {
+    fontSize: 18,
+    fontWeight: 'bold',
+  },
+});

package/src/elements/core/UIListItem.tsx

@@ -1,32 +1,32 @@
-import { useState } from 'react';
-import { ChildType, Utils } from 'react-crud-utils';
-import { FlatList, StyleSheet, Switch, Text, View } from 'react-native';
-
-interface UIListItemType extends ChildType {
-  data: any;
-}
-
-export default function UIListItem(props: UIListItemType) {
-  const scope = props.scope;
-  const crud = props.crud;
-
-  return <View style={styles.item}></View>;
-}
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    padding: 20,
-    backgroundColor: '#fff',
-  },
-  item: {
-    padding: 15,
-    marginVertical: 8,
-    backgroundColor: '#f9c2ff',
-    borderRadius: 8,
-  },
-  text: {
-    fontSize: 18,
-    fontWeight: 'bold',
-  },
-});
+import { useState } from 'react';
+import { ChildType, Utils } from 'react-crud-utils';
+import { FlatList, StyleSheet, Switch, Text, View } from 'react-native';
+
+interface UIListItemType extends ChildType {
+  data: any;
+}
+
+export default function UIListItem(props: UIListItemType) {
+  const scope = props.scope;
+  const crud = props.crud;
+
+  return <View style={styles.item}></View>;
+}
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    padding: 20,
+    backgroundColor: '#fff',
+  },
+  item: {
+    padding: 15,
+    marginVertical: 8,
+    backgroundColor: '#f9c2ff',
+    borderRadius: 8,
+  },
+  text: {
+    fontSize: 18,
+    fontWeight: 'bold',
+  },
+});

package/src/elements/core/UIListRow.tsx

@@ -1,117 +1,117 @@
-import React, { useRef, useState } from 'react';
-import { ChildType, ScopeUtils, Utils } from 'react-crud-utils';
-import UIChildren from '../UIChildren';
-import { StyleSheet, TouchableHighlight, View } from 'react-native';
-import { useIsVisible } from '../../hooks/useIsVisible';
-
-interface UIListRowType extends ChildType {
-  item: any;
-  index: number;
-}
-
-export default function UIListRow(props: UIListRowType) {
-  const scope = props.scope;
-  const index = props.index;
-  const original = scope.original;
-  const item = props.item;
-  const cols = Utils.nvl(original.cols, 1);
-  const rowWidth = Math.floor(100 / cols) + '%';
-  const styles = { repeat: stylesRepeat, list: stylesList }?.[original.type];
-  const name = `${scope.key('row', index, '')}`;
-  const [row] = useState(
-    ScopeUtils.create({
-      ...original,
-      parent: scope,
-      name,
-      crud: scope.crud,
-      index,
-      type: 'row',
-      data: item,
-    })
-  );
-
-  const targetRef = useRef(null);
-  const isVisible = useIsVisible(targetRef, row);
-
-  const onClick = (item: any) => {
-    row.call('click', { value: item, item, edit: true, index });
-  };
-
-  const Child = () => {
-    if (!isVisible && original.useIsInView && !row.visible && index > 20) {
-      return <></>;
-    }
-    return (
-      <>
-        <UIChildren scope={row} crud={row.crud}>
-          {props.children}
-        </UIChildren>
-      </>
-    );
-  };
-
-  const ListItem = () => {
-    let [updateIndex, setUpdateIndex] = useState(0);
-    let key = scope.key('item');
-
-    const getRowStyle = () => {
-      let css = row.getStyle('row', { ...styles.row, minHeight: 40 });
-
-      if (cols > 0) {
-        css.width = rowWidth;
-      }
-
-      return css;
-    };
-
-    row.update = () => {
-      scope.updateIndex = scope.updateIndex + 1;
-
-      setUpdateIndex(++updateIndex);
-    };
-
-    if (!original.click) {
-      return (
-        <View key={key} style={getRowStyle()} ref={targetRef}>
-          <Child />
-        </View>
-      );
-    }
-    return (
-      <TouchableHighlight
-        key={key}
-        style={getRowStyle()}
-        underlayColor={'transparent'}
-        ref={targetRef}
-        onPress={e => {
-          e.stopPropagation();
-          onClick(item);
-        }}
-      >
-        <Child />
-      </TouchableHighlight>
-    );
-  };
-
-  return <ListItem />;
-}
-
-const stylesList = StyleSheet.create({
-  row: {
-    padding: 5,
-    margin: 0,
-    width: '100%',
-    backgroundColor: '#f5f5f5',
-    gap: 10,
-    borderRadius: 8,
-    justifyContent: 'center',
-  },
-});
-
-const stylesRepeat = StyleSheet.create({
-  row: {
-    padding: 0,
-    width: '100%',
-    justifyContent: 'center',
-  },
-});
+import React, { useRef, useState } from 'react';
+import { ChildType, ScopeUtils, Utils } from 'react-crud-utils';
+import UIChildren from '../UIChildren';
+import { StyleSheet, TouchableHighlight, View } from 'react-native';
+import { useIsVisible } from '../../hooks/useIsVisible';
+
+interface UIListRowType extends ChildType {
+  item: any;
+  index: number;
+}
+
+export default function UIListRow(props: UIListRowType) {
+  const scope = props.scope;
+  const index = props.index;
+  const original = scope.original;
+  const item = props.item;
+  const cols = Utils.nvl(original.cols, 1);
+  const rowWidth = Math.floor(100 / cols) + '%';
+  const styles = { repeat: stylesRepeat, list: stylesList }?.[original.type];
+  const name = `${scope.key('row', index, '')}`;
+  const [row] = useState(
+    ScopeUtils.create({
+      ...original,
+      parent: scope,
+      name,
+      crud: scope.crud,
+      index,
+      type: 'row',
+      data: item,
+    })
+  );
+
+  const targetRef = useRef(null);
+  const isVisible = useIsVisible(targetRef, row);
+
+  const onClick = (item: any) => {
+    row.call('click', { value: item, item, edit: true, index });
+  };
+
+  const Child = () => {
+    if (!isVisible && original.useIsInView && !row.visible && index > 20) {
+      return <></>;
+    }
+    return (
+      <>
+        <UIChildren scope={row} crud={row.crud}>
+          {props.children}
+        </UIChildren>
+      </>
+    );
+  };
+
+  const ListItem = () => {
+    let [updateIndex, setUpdateIndex] = useState(0);
+    let key = scope.key('item');
+
+    const getRowStyle = () => {
+      let css = row.getStyle('row', { ...styles.row, minHeight: 40 });
+
+      if (cols > 0) {
+        css.width = rowWidth;
+      }
+
+      return css;
+    };
+
+    row.update = () => {
+      scope.updateIndex = scope.updateIndex + 1;
+
+      setUpdateIndex(++updateIndex);
+    };
+
+    if (!original.click) {
+      return (
+        <View key={key} style={getRowStyle()} ref={targetRef}>
+          <Child />
+        </View>
+      );
+    }
+    return (
+      <TouchableHighlight
+        key={key}
+        style={getRowStyle()}
+        underlayColor={'transparent'}
+        ref={targetRef}
+        onPress={e => {
+          e.stopPropagation();
+          onClick(item);
+        }}
+      >
+        <Child />
+      </TouchableHighlight>
+    );
+  };
+
+  return <ListItem />;
+}
+
+const stylesList = StyleSheet.create({
+  row: {
+    padding: 5,
+    margin: 0,
+    width: '100%',
+    backgroundColor: '#f5f5f5',
+    gap: 10,
+    borderRadius: 8,
+    justifyContent: 'center',
+  },
+});
+
+const stylesRepeat = StyleSheet.create({
+  row: {
+    padding: 0,
+    width: '100%',
+    justifyContent: 'center',
+  },
+});