react-crud-mobile 1.3.333 → 1.3.335

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 (39) hide show
  1. package/dist/react-crud-mobile.cjs.development.js.map +1 -1
  2. package/dist/react-crud-mobile.cjs.production.min.js.map +1 -1
  3. package/dist/react-crud-mobile.esm.js.map +1 -1
  4. package/package.json +76 -76
  5. package/src/elements/UI.tsx +77 -77
  6. package/src/elements/UIChildren.tsx +142 -142
  7. package/src/elements/UIComplete.tsx +14 -14
  8. package/src/elements/UIElement.tsx +870 -870
  9. package/src/elements/UITag.tsx +13 -13
  10. package/src/elements/charts/ElChart.tsx +10 -10
  11. package/src/elements/core/GestureView.tsx +16 -16
  12. package/src/elements/core/SafeView.tsx +63 -63
  13. package/src/elements/core/UIAutoComplete.tsx +17 -17
  14. package/src/elements/core/UIButton.tsx +143 -143
  15. package/src/elements/core/UIHeader.tsx +38 -38
  16. package/src/elements/core/UIIcon.tsx +25 -25
  17. package/src/elements/core/UIInclude.tsx +40 -40
  18. package/src/elements/core/UIInput.tsx +147 -147
  19. package/src/elements/core/UILink.tsx +17 -17
  20. package/src/elements/core/UIList.tsx +180 -180
  21. package/src/elements/core/UIListItem.tsx +32 -32
  22. package/src/elements/core/UIListRow.tsx +132 -132
  23. package/src/elements/core/UIModal.tsx +212 -212
  24. package/src/elements/core/UIOption.tsx +17 -17
  25. package/src/elements/core/UIOrder.tsx +194 -194
  26. package/src/elements/core/UIQuantity.tsx +98 -98
  27. package/src/elements/core/UIRadio.tsx +17 -17
  28. package/src/elements/core/UISelect.tsx +175 -175
  29. package/src/elements/core/UISlider.tsx +61 -61
  30. package/src/elements/core/UIStatusBar.tsx +5 -5
  31. package/src/elements/core/UISwitch.tsx +27 -27
  32. package/src/elements/core/UIToast.tsx +44 -44
  33. package/src/elements/core/UIToggle.tsx +114 -114
  34. package/src/elements/core/UIView.tsx +69 -69
  35. package/src/elements/index.ts +1 -1
  36. package/src/elements/tabs/ElTabs.tsx +178 -178
  37. package/src/hooks/useIsVisible.ts +39 -39
  38. package/src/index.ts +1 -1
  39. package/src/utils/MobileUtils.ts +12 -12
@@ -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,147 +1,147 @@
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.call(() => {
9
- let val = Utils.nvl(scope.getValue(), '');
10
-
11
- if (val && val?.push) {
12
- return val.join(', ').trim();
13
- }
14
- return val;
15
- });
16
-
17
- let label = scope.getLabel();
18
- let placeholder = scope.getPart('placeholder', null, label);
19
- let el = scope.original;
20
-
21
- const element = scope.original;
22
- const [height, setHeight] = useState(80);
23
- const [value, setValue] = useState(initial);
24
-
25
- let onChange = v => {
26
- v = scope.changeValue(v);
27
-
28
- setValue(v);
29
- };
30
-
31
- const style = (part: string, extra?: any) => {
32
- return { ...scope.getStyle(part, styles[part]), ...extra };
33
- };
34
-
35
- const CustomIcon = () => {
36
- let icon = el.icon;
37
-
38
- if (icon) {
39
- if (typeof icon === 'string') {
40
- return (
41
- <>
42
- {el.icon && (
43
- <Ionicons
44
- name={el.icon}
45
- size={scope.attr('iconSize', 20)}
46
- color={scope.attr('iconColor', '#888')}
47
- />
48
- )}
49
- </>
50
- );
51
- }
52
- return <>{icon}</>;
53
- }
54
- return <></>;
55
- };
56
-
57
- let type = scope.getPart('type', null, 'text');
58
- let decode = {
59
- textarea: {
60
- multiline: true,
61
- autoHeight: element.autoHeight !== false,
62
- textAlignVertical: 'top',
63
- numberOfLines: 5,
64
- style: { height: Math.max(80, height) },
65
- baseStyle: { paddingVertical: 10 },
66
- },
67
- };
68
-
69
- //v4
70
- let defs = { ...Utils.nvl(decode[type], {}), ...element.inputProps };
71
- let inputStyle = Utils.call(() => {
72
- let size = element.size;
73
- let css: any = {};
74
-
75
- if (size === 'small') {
76
- css.height = 30;
77
- css.fontSize = 12;
78
- }
79
-
80
- css.fontSize = Utils.nvl(element.fontSize, css.fontSize);
81
- css = { ...style(type), ...css, ...style('input') };
82
- css.lineHeight = parseInt(css.fontSize) + 2;
83
- //v1
84
- return css;
85
- });
86
-
87
- if (defs.autoHeight) {
88
- defs.onContentSizeChange = event => {
89
- setHeight(event.nativeEvent.contentSize.height);
90
- };
91
-
92
- inputStyle = { ...inputStyle, ...defs.style };
93
- }
94
-
95
- return (
96
- <>
97
- <View style={style('base', defs?.baseStyle)}>
98
- {scope.getPart('left')}
99
- <TextInput
100
- onChangeText={onChange}
101
- value={value}
102
- placeholder={placeholder}
103
- {...defs}
104
- style={inputStyle}
105
- />
106
- <CustomIcon />
107
- </View>
108
- {scope.getPart('right')}
109
- </>
110
- );
111
- }
112
-
113
- const styles = StyleSheet.create({
114
- base: {
115
- flex: 1,
116
- width: '100%',
117
- paddingBottom: 0,
118
- paddingTop: 0,
119
- alignItems: 'center',
120
- borderWidth: 1,
121
- borderColor: 'borderColor',
122
- borderRadius: 5,
123
- paddingHorizontal: 10,
124
- alignSelf: 'flex-start',
125
- flexDirection: 'row',
126
- flexWrap: 'wrap',
127
- gap: 10,
128
- },
129
- icon: {
130
- marginRight: 10, // Espaço entre ícone e input
131
- },
132
- input: {
133
- marginHorizontal: 0,
134
- marginVertical: 0,
135
- height: 40,
136
- width: '100%',
137
- flex: 1, // Para o input ocupar o espaço restante
138
- },
139
- textarea: {
140
- marginHorizontal: 0,
141
- marginVertical: 0,
142
- width: '100%',
143
- height: 'auto',
144
- alignSelf: 'stretch',
145
- flex: 1, // Para o input ocupar o espaço restante
146
- },
147
- });
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.call(() => {
9
+ let val = Utils.nvl(scope.getValue(), '');
10
+
11
+ if (val && val?.push) {
12
+ return val.join(', ').trim();
13
+ }
14
+ return val;
15
+ });
16
+
17
+ let label = scope.getLabel();
18
+ let placeholder = scope.getPart('placeholder', null, label);
19
+ let el = scope.original;
20
+
21
+ const element = scope.original;
22
+ const [height, setHeight] = useState(80);
23
+ const [value, setValue] = useState(initial);
24
+
25
+ let onChange = v => {
26
+ v = scope.changeValue(v);
27
+
28
+ setValue(v);
29
+ };
30
+
31
+ const style = (part: string, extra?: any) => {
32
+ return { ...scope.getStyle(part, styles[part]), ...extra };
33
+ };
34
+
35
+ const CustomIcon = () => {
36
+ let icon = el.icon;
37
+
38
+ if (icon) {
39
+ if (typeof icon === 'string') {
40
+ return (
41
+ <>
42
+ {el.icon && (
43
+ <Ionicons
44
+ name={el.icon}
45
+ size={scope.attr('iconSize', 20)}
46
+ color={scope.attr('iconColor', '#888')}
47
+ />
48
+ )}
49
+ </>
50
+ );
51
+ }
52
+ return <>{icon}</>;
53
+ }
54
+ return <></>;
55
+ };
56
+
57
+ let type = scope.getPart('type', null, 'text');
58
+ let decode = {
59
+ textarea: {
60
+ multiline: true,
61
+ autoHeight: element.autoHeight !== false,
62
+ textAlignVertical: 'top',
63
+ numberOfLines: 5,
64
+ style: { height: Math.max(80, height) },
65
+ baseStyle: { paddingVertical: 10 },
66
+ },
67
+ };
68
+
69
+ //v4
70
+ let defs = { ...Utils.nvl(decode[type], {}), ...element.inputProps };
71
+ let inputStyle = Utils.call(() => {
72
+ let size = element.size;
73
+ let css: any = {};
74
+
75
+ if (size === 'small') {
76
+ css.height = 30;
77
+ css.fontSize = 12;
78
+ }
79
+
80
+ css.fontSize = Utils.nvl(element.fontSize, css.fontSize);
81
+ css = { ...style(type), ...css, ...style('input') };
82
+ css.lineHeight = parseInt(css.fontSize) + 2;
83
+ //v1
84
+ return css;
85
+ });
86
+
87
+ if (defs.autoHeight) {
88
+ defs.onContentSizeChange = event => {
89
+ setHeight(event.nativeEvent.contentSize.height);
90
+ };
91
+
92
+ inputStyle = { ...inputStyle, ...defs.style };
93
+ }
94
+
95
+ return (
96
+ <>
97
+ <View style={style('base', defs?.baseStyle)}>
98
+ {scope.getPart('left')}
99
+ <TextInput
100
+ onChangeText={onChange}
101
+ value={value}
102
+ placeholder={placeholder}
103
+ {...defs}
104
+ style={inputStyle}
105
+ />
106
+ <CustomIcon />
107
+ </View>
108
+ {scope.getPart('right')}
109
+ </>
110
+ );
111
+ }
112
+
113
+ const styles = StyleSheet.create({
114
+ base: {
115
+ flex: 1,
116
+ width: '100%',
117
+ paddingBottom: 0,
118
+ paddingTop: 0,
119
+ alignItems: 'center',
120
+ borderWidth: 1,
121
+ borderColor: 'borderColor',
122
+ borderRadius: 5,
123
+ paddingHorizontal: 10,
124
+ alignSelf: 'flex-start',
125
+ flexDirection: 'row',
126
+ flexWrap: 'wrap',
127
+ gap: 10,
128
+ },
129
+ icon: {
130
+ marginRight: 10, // Espaço entre ícone e input
131
+ },
132
+ input: {
133
+ marginHorizontal: 0,
134
+ marginVertical: 0,
135
+ height: 40,
136
+ width: '100%',
137
+ flex: 1, // Para o input ocupar o espaço restante
138
+ },
139
+ textarea: {
140
+ marginHorizontal: 0,
141
+ marginVertical: 0,
142
+ width: '100%',
143
+ height: 'auto',
144
+ alignSelf: 'stretch',
145
+ flex: 1, // Para o input ocupar o espaço restante
146
+ },
147
+ });
@@ -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
+ };