react-crud-mobile 1.0.430 → 1.0.431

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (32) hide show
  1. package/dist/react-crud-mobile.cjs.development.js +1 -0
  2. package/dist/react-crud-mobile.cjs.development.js.map +1 -1
  3. package/dist/react-crud-mobile.cjs.production.min.js +1 -1
  4. package/dist/react-crud-mobile.cjs.production.min.js.map +1 -1
  5. package/dist/react-crud-mobile.esm.js +1 -0
  6. package/dist/react-crud-mobile.esm.js.map +1 -1
  7. package/package.json +71 -71
  8. package/src/elements/UI.tsx +65 -65
  9. package/src/elements/UIChildren.tsx +127 -127
  10. package/src/elements/UIComplete.tsx +14 -14
  11. package/src/elements/UIElement.tsx +518 -516
  12. package/src/elements/UITag.tsx +13 -13
  13. package/src/elements/charts/ElChart.tsx +10 -10
  14. package/src/elements/core/UIAutoComplete.tsx +17 -17
  15. package/src/elements/core/UIButton.tsx +73 -73
  16. package/src/elements/core/UIIcon.tsx +8 -8
  17. package/src/elements/core/UIInclude.tsx +40 -40
  18. package/src/elements/core/UIInput.tsx +69 -69
  19. package/src/elements/core/UILink.tsx +17 -17
  20. package/src/elements/core/UIList.tsx +135 -135
  21. package/src/elements/core/UIListItem.tsx +32 -32
  22. package/src/elements/core/UIListRow.tsx +32 -32
  23. package/src/elements/core/UIModal.tsx +139 -139
  24. package/src/elements/core/UIOption.tsx +17 -17
  25. package/src/elements/core/UIQuantity.tsx +97 -97
  26. package/src/elements/core/UIRadio.tsx +17 -17
  27. package/src/elements/core/UISelect.tsx +122 -122
  28. package/src/elements/core/UISwitch.tsx +26 -26
  29. package/src/elements/core/UIToggle.tsx +102 -102
  30. package/src/elements/index.ts +1 -1
  31. package/src/elements/tabs/ElTabs.tsx +178 -178
  32. package/src/index.ts +1 -1
@@ -1,13 +1,13 @@
1
- import React, { useState } from "react";
2
- import { Utils } from "react-crud-utils";
3
-
4
- interface UITagType {
5
- name: string;
6
- [otherOptions: string]: unknown;
7
- }
8
-
9
- export default function UITag(props: UITagType) {
10
- let Aux = Utils.nvl(props.name, "span");
11
-
12
- return <Aux {...props} />;
13
- }
1
+ import React, { useState } from "react";
2
+ import { Utils } from "react-crud-utils";
3
+
4
+ interface UITagType {
5
+ name: string;
6
+ [otherOptions: string]: unknown;
7
+ }
8
+
9
+ export default function UITag(props: UITagType) {
10
+ let Aux = Utils.nvl(props.name, "span");
11
+
12
+ return <Aux {...props} />;
13
+ }
@@ -1,10 +1,10 @@
1
- import React from "react";
2
- import { ChildType, Scope, Utils } from "react-crud-utils";
3
-
4
- export default function ElChart(props: ChildType) {
5
- let scope: Scope = props.scope;
6
- let items: any = scope.getItems();
7
- let columns = Utils.asList(scope.original.columns);
8
-
9
- return <div className="ui-chart-data"></div>;
10
- }
1
+ import React from "react";
2
+ import { ChildType, Scope, Utils } from "react-crud-utils";
3
+
4
+ export default function ElChart(props: ChildType) {
5
+ let scope: Scope = props.scope;
6
+ let items: any = scope.getItems();
7
+ let columns = Utils.asList(scope.original.columns);
8
+
9
+ return <div className="ui-chart-data"></div>;
10
+ }
@@ -1,17 +1,17 @@
1
- import { Text, TouchableOpacity, Linking, StyleSheet } from 'react-native';
2
-
3
- export default function UIAutoComplete(props: any) {
4
- const handlePress = () => {
5
- Linking.openURL('https://reactnative.dev/');
6
- };
7
-
8
- return (
9
- <TouchableOpacity onPress={handlePress}>
10
- <Text style={styles.link}>Clique aqui para acessar o React Native</Text>
11
- </TouchableOpacity>
12
- );
13
- }
14
-
15
- const styles = {
16
- link: {},
17
- };
1
+ import { Text, TouchableOpacity, Linking, StyleSheet } from 'react-native';
2
+
3
+ export default function UIAutoComplete(props: any) {
4
+ const handlePress = () => {
5
+ Linking.openURL('https://reactnative.dev/');
6
+ };
7
+
8
+ return (
9
+ <TouchableOpacity onPress={handlePress}>
10
+ <Text style={styles.link}>Clique aqui para acessar o React Native</Text>
11
+ </TouchableOpacity>
12
+ );
13
+ }
14
+
15
+ const styles = {
16
+ link: {},
17
+ };
@@ -1,73 +1,73 @@
1
- import { Ionicons } from '@expo/vector-icons';
2
- import { ChildType } from 'react-crud-utils';
3
- import { Text, TouchableHighlight, View } from 'react-native';
4
-
5
- export default function UIButton(props: ChildType) {
6
- let scope = props.scope;
7
- let element = scope.original;
8
-
9
- let color = element.color;
10
- let label = element.label;
11
- let icon = element.icon;
12
-
13
- if (!color) color = 'primary';
14
-
15
- const styles: any = {
16
- buttonLabel: {
17
- color: '#ffffff',
18
- fontWeight: '500',
19
- fontSize: 16,
20
- },
21
- buttonInner: {
22
- flexDirection: 'row',
23
- alignItems: 'center',
24
- justifyContent: 'center',
25
- height: 44,
26
- },
27
- buttonIcon: {
28
- color: '#fff',
29
- fontSize: 18,
30
- paddingRight: 10,
31
- },
32
- button: {
33
- alignItems: 'center',
34
- minWidth: 200,
35
- margin: 5,
36
- padding: 0,
37
- paddingHorizontal: 20,
38
- textAlign: 'center',
39
- verticalAling: 'middle',
40
- borderRadius: 24,
41
- backgroundColor: color,
42
- color: '#ffffff',
43
- justifyContent: 'center',
44
- flex: 1,
45
- },
46
- };
47
-
48
- const onClick = (e: any) => {
49
- scope.call('click', {});
50
- };
51
-
52
- const style = (part: string, extra?: any) => {
53
- let s = { ...styles[part], ...extra };
54
- return scope.getStyle(part, s);
55
- };
56
-
57
- return (
58
- <TouchableHighlight
59
- underlayColor={'transparent'}
60
- onPress={onClick}
61
- style={style('button')}
62
- >
63
- <View style={style('buttonInner')}>
64
- {icon && (
65
- <>
66
- <Ionicons size={30} style={style('buttonIcon')} name={icon} />
67
- </>
68
- )}
69
- <Text style={style('buttonLabel')}>{label}</Text>
70
- </View>
71
- </TouchableHighlight>
72
- );
73
- }
1
+ import { Ionicons } from '@expo/vector-icons';
2
+ import { ChildType } from 'react-crud-utils';
3
+ import { Text, TouchableHighlight, View } from 'react-native';
4
+
5
+ export default function UIButton(props: ChildType) {
6
+ let scope = props.scope;
7
+ let element = scope.original;
8
+
9
+ let color = element.color;
10
+ let label = element.label;
11
+ let icon = element.icon;
12
+
13
+ if (!color) color = 'primary';
14
+
15
+ const styles: any = {
16
+ buttonLabel: {
17
+ color: '#ffffff',
18
+ fontWeight: '500',
19
+ fontSize: 16,
20
+ },
21
+ buttonInner: {
22
+ flexDirection: 'row',
23
+ alignItems: 'center',
24
+ justifyContent: 'center',
25
+ height: 44,
26
+ },
27
+ buttonIcon: {
28
+ color: '#fff',
29
+ fontSize: 18,
30
+ paddingRight: 10,
31
+ },
32
+ button: {
33
+ alignItems: 'center',
34
+ minWidth: 200,
35
+ margin: 5,
36
+ padding: 0,
37
+ paddingHorizontal: 20,
38
+ textAlign: 'center',
39
+ verticalAling: 'middle',
40
+ borderRadius: 24,
41
+ backgroundColor: color,
42
+ color: '#ffffff',
43
+ justifyContent: 'center',
44
+ flex: 1,
45
+ },
46
+ };
47
+
48
+ const onClick = (e: any) => {
49
+ scope.call('click', {});
50
+ };
51
+
52
+ const style = (part: string, extra?: any) => {
53
+ let s = { ...styles[part], ...extra };
54
+ return scope.getStyle(part, s);
55
+ };
56
+
57
+ return (
58
+ <TouchableHighlight
59
+ underlayColor={'transparent'}
60
+ onPress={onClick}
61
+ style={style('button')}
62
+ >
63
+ <View style={style('buttonInner')}>
64
+ {icon && (
65
+ <>
66
+ <Ionicons size={30} style={style('buttonIcon')} name={icon} />
67
+ </>
68
+ )}
69
+ <Text style={style('buttonLabel')}>{label}</Text>
70
+ </View>
71
+ </TouchableHighlight>
72
+ );
73
+ }
@@ -1,8 +1,8 @@
1
- import { Ionicons } from '@expo/vector-icons';
2
- import { ChildType } from 'react-crud-utils';
3
-
4
- export default function UIIcon({ scope }: ChildType) {
5
- let name = scope.getValue();
6
-
7
- return <Ionicons name={name} style={scope.getStyle('icon')} />;
8
- }
1
+ import { Ionicons } from '@expo/vector-icons';
2
+ import { ChildType } from 'react-crud-utils';
3
+
4
+ export default function UIIcon({ scope }: ChildType) {
5
+ let name = scope.getValue();
6
+
7
+ return <Ionicons name={name} style={scope.getStyle('icon')} />;
8
+ }
@@ -1,40 +1,40 @@
1
- import UIChildren from '../UIChildren';
2
- import { ComponentUtils, DefineType, Utils } from 'react-crud-utils';
3
-
4
- export default function UIInclude(props: DefineType) {
5
- if (props.rendered === false) {
6
- return <></>;
7
- }
8
-
9
- let includes = ComponentUtils.getDefine(props, props.name, props.position);
10
-
11
- if (Utils.isEmpty(includes)) {
12
- includes = props.default;
13
- }
14
-
15
- if (!Utils.isEmpty(includes)) {
16
- let Aux = (tagProp: any) => {
17
- let Tag: any = props.tag;
18
-
19
- if (!Utils.isEmpty(Tag)) {
20
- return <Tag {...tagProp}>{tagProp.children}</Tag>;
21
- }
22
- return <>{tagProp.children}</>;
23
- };
24
-
25
- return (
26
- <Aux {...props.tagProps}>
27
- <UIChildren
28
- transient
29
- {...props}
30
- scope={props.scope}
31
- crud={props.crud}
32
- part={props.name}
33
- >
34
- {includes}
35
- </UIChildren>
36
- </Aux>
37
- );
38
- }
39
- return <>{includes}</>;
40
- }
1
+ import UIChildren from '../UIChildren';
2
+ import { ComponentUtils, DefineType, Utils } from 'react-crud-utils';
3
+
4
+ export default function UIInclude(props: DefineType) {
5
+ if (props.rendered === false) {
6
+ return <></>;
7
+ }
8
+
9
+ let includes = ComponentUtils.getDefine(props, props.name, props.position);
10
+
11
+ if (Utils.isEmpty(includes)) {
12
+ includes = props.default;
13
+ }
14
+
15
+ if (!Utils.isEmpty(includes)) {
16
+ let Aux = (tagProp: any) => {
17
+ let Tag: any = props.tag;
18
+
19
+ if (!Utils.isEmpty(Tag)) {
20
+ return <Tag {...tagProp}>{tagProp.children}</Tag>;
21
+ }
22
+ return <>{tagProp.children}</>;
23
+ };
24
+
25
+ return (
26
+ <Aux {...props.tagProps}>
27
+ <UIChildren
28
+ transient
29
+ {...props}
30
+ scope={props.scope}
31
+ crud={props.crud}
32
+ part={props.name}
33
+ >
34
+ {includes}
35
+ </UIChildren>
36
+ </Aux>
37
+ );
38
+ }
39
+ return <>{includes}</>;
40
+ }
@@ -1,69 +1,69 @@
1
- import { useState } from 'react';
2
- import { ChildType, Utils } from 'react-crud-utils';
3
- import { StyleSheet, TextInput, View } from 'react-native';
4
- import { Ionicons } from '@expo/vector-icons';
5
-
6
- export default function UIInput(props: ChildType) {
7
- let scope = props.scope;
8
- let initial = Utils.nvl(scope.getValue(), '');
9
-
10
- let label = scope.getLabel();
11
- let placeholder = scope.getPart('placeholder', null, label);
12
- let el = scope.original;
13
-
14
- const [value, setValue] = useState(initial);
15
-
16
- let onChange = v => {
17
- scope.changeValue(v);
18
-
19
- setValue(v);
20
- };
21
-
22
- const style = (part: string, extra?: any) => {
23
- return { ...scope.getStyle(part, styles[part]), ...extra };
24
- };
25
-
26
- return (
27
- <>
28
- {scope.getPart('left')}
29
- <TextInput
30
- style={style('input')}
31
- onChangeText={onChange}
32
- value={value}
33
- placeholder={placeholder}
34
- />
35
- {el.icon && (
36
- <Ionicons
37
- name={el.icon}
38
- size={scope.attr('iconSize', 20)}
39
- color={scope.attr('iconColor', '#888')}
40
- />
41
- )}
42
- {scope.getPart('right')}
43
- </>
44
- );
45
- }
46
-
47
- const styles = StyleSheet.create({
48
- base: {
49
- flexDirection: 'row',
50
- alignItems: 'center',
51
- borderWidth: 1,
52
- borderColor: 'borderColor',
53
- borderRadius: 20,
54
- paddingHorizontal: 10,
55
- paddingVertical: 5,
56
- padding: 10,
57
- paddingLeft: 5,
58
- paddingRight: 10,
59
- },
60
- icon: {
61
- marginRight: 10, // Espaço entre ícone e input
62
- },
63
- input: {
64
- marginHorizontal: 0,
65
- marginVertical: 0,
66
- height: 40,
67
- flex: 1, // Para o input ocupar o espaço restante
68
- },
69
- });
1
+ import { useState } from 'react';
2
+ import { ChildType, Utils } from 'react-crud-utils';
3
+ import { StyleSheet, TextInput, View } from 'react-native';
4
+ import { Ionicons } from '@expo/vector-icons';
5
+
6
+ export default function UIInput(props: ChildType) {
7
+ let scope = props.scope;
8
+ let initial = Utils.nvl(scope.getValue(), '');
9
+
10
+ let label = scope.getLabel();
11
+ let placeholder = scope.getPart('placeholder', null, label);
12
+ let el = scope.original;
13
+
14
+ const [value, setValue] = useState(initial);
15
+
16
+ let onChange = v => {
17
+ scope.changeValue(v);
18
+
19
+ setValue(v);
20
+ };
21
+
22
+ const style = (part: string, extra?: any) => {
23
+ return { ...scope.getStyle(part, styles[part]), ...extra };
24
+ };
25
+
26
+ return (
27
+ <>
28
+ {scope.getPart('left')}
29
+ <TextInput
30
+ style={style('input')}
31
+ onChangeText={onChange}
32
+ value={value}
33
+ placeholder={placeholder}
34
+ />
35
+ {el.icon && (
36
+ <Ionicons
37
+ name={el.icon}
38
+ size={scope.attr('iconSize', 20)}
39
+ color={scope.attr('iconColor', '#888')}
40
+ />
41
+ )}
42
+ {scope.getPart('right')}
43
+ </>
44
+ );
45
+ }
46
+
47
+ const styles = StyleSheet.create({
48
+ base: {
49
+ flexDirection: 'row',
50
+ alignItems: 'center',
51
+ borderWidth: 1,
52
+ borderColor: 'borderColor',
53
+ borderRadius: 20,
54
+ paddingHorizontal: 10,
55
+ paddingVertical: 5,
56
+ padding: 10,
57
+ paddingLeft: 5,
58
+ paddingRight: 10,
59
+ },
60
+ icon: {
61
+ marginRight: 10, // Espaço entre ícone e input
62
+ },
63
+ input: {
64
+ marginHorizontal: 0,
65
+ marginVertical: 0,
66
+ height: 40,
67
+ flex: 1, // Para o input ocupar o espaço restante
68
+ },
69
+ });
@@ -1,17 +1,17 @@
1
- import { Text, TouchableOpacity, Linking, StyleSheet } from 'react-native';
2
-
3
- export default function UILink(props: any) {
4
- const handlePress = () => {
5
- Linking.openURL('https://reactnative.dev/');
6
- };
7
-
8
- return (
9
- <TouchableOpacity onPress={handlePress}>
10
- <Text style={styles.link}>Clique aqui para acessar o React Native</Text>
11
- </TouchableOpacity>
12
- );
13
- }
14
-
15
- const styles = {
16
- link: {},
17
- };
1
+ import { Text, TouchableOpacity, Linking, StyleSheet } from 'react-native';
2
+
3
+ export default function UILink(props: any) {
4
+ const handlePress = () => {
5
+ Linking.openURL('https://reactnative.dev/');
6
+ };
7
+
8
+ return (
9
+ <TouchableOpacity onPress={handlePress}>
10
+ <Text style={styles.link}>Clique aqui para acessar o React Native</Text>
11
+ </TouchableOpacity>
12
+ );
13
+ }
14
+
15
+ const styles = {
16
+ link: {},
17
+ };