react-crud-mobile 1.0.533 → 1.0.535

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.
@@ -1,173 +1,173 @@
1
- import React, { useState } from 'react';
2
- import { ChildType, ComponentUtils, Utils } from 'react-crud-utils';
3
- import { StyleSheet, Text, TouchableHighlight, View } from 'react-native';
4
- import UIListRow from './UIListRow';
5
- import UI from '../UI';
6
- import { Ionicons } from '@expo/vector-icons';
7
-
8
- export default function UIList(props: ChildType) {
9
- const scope = props.scope;
10
- const crud = scope.crud;
11
- const original = scope.original;
12
- const cols = Utils.nvl(original.cols, 1);
13
- const rowWidth = Math.floor(100 / cols) + '%';
14
- const items = Utils.nvl(scope.getItems(), []);
15
- const styles = { repeat: stylesRepeat, list: stylesList }?.[original.type];
16
- const add = ComponentUtils.getDefine(props, 'add');
17
- const hideAddWhenEmpty = original.hideAddWhenEmpty;
18
-
19
- const onClick = (item: any) => {
20
- scope.call('click', { value: item, item, edit: true });
21
- };
22
-
23
- const getStyle = (key: string, extra?: any) => {
24
- return scope.getStyle(key, { ...extra, ...styles[key] });
25
- };
26
-
27
- const getRowStyle = (extra?: any) => {
28
- let row = getStyle('row', {});
29
-
30
- if (cols > 0) {
31
- row.width = rowWidth;
32
- }
33
-
34
- return row;
35
- };
36
-
37
- const getContainerStyle = (extra?: any) => {
38
- let row = getStyle('container', {});
39
-
40
- if (cols > 1) {
41
- row = { ...row, flexDirection: 'row', flexWrap: 'wrap' };
42
- }
43
-
44
- return row;
45
- };
46
-
47
- const isShowAdd = () => {
48
- if (!Utils.isEmpty(items)) {
49
- return true;
50
- }
51
- return hideAddWhenEmpty !== true;
52
- };
53
-
54
- let Empty = () => {
55
- if (!Utils.isEmpty(items)) {
56
- return <></>;
57
- }
58
-
59
- let empty = scope.attr('empty', 'Sem registro');
60
-
61
- if (!empty) {
62
- return <></>;
63
- }
64
-
65
- if (typeof empty === 'string') {
66
- return (
67
- <Text
68
- style={scope.getStyle('empty', {
69
- flex: 1,
70
- fontWeight: 500,
71
- fontSize: 20,
72
- padding: 10,
73
- textAlign: 'center',
74
- justifyContent: 'center',
75
- alignItems: 'center',
76
- })}
77
- >
78
- {empty}
79
- </Text>
80
- );
81
- }
82
-
83
- return <>{empty}</>;
84
- };
85
-
86
- return (
87
- <>
88
- {original.search !== false && (
89
- <UI.Text
90
- placeholder="Pesquisar..."
91
- field="query"
92
- crud={crud}
93
- right={<Ionicons name="search" size={20} color="#888" />}
94
- />
95
- )}
96
-
97
- <View style={getContainerStyle()}>
98
- <Empty />
99
- {items.map((item: any, i: number) => (
100
- <TouchableHighlight
101
- key={`k-${i}`}
102
- style={getRowStyle()}
103
- underlayColor={'transparent'}
104
- onPress={e => {
105
- onClick(item);
106
- }}
107
- >
108
- <UIListRow scope={scope} item={item} index={i}>
109
- {props.children}
110
- </UIListRow>
111
- </TouchableHighlight>
112
- ))}
113
- {isShowAdd() && <>{add}</>}
114
- </View>
115
- </>
116
- );
117
- }
118
-
119
- const stylesList = StyleSheet.create({
120
- container: {
121
- flex: 1,
122
- width: '100%',
123
- flexDirection: 'row',
124
- flexWrap: 'wrap',
125
- alignItems: 'stretch',
126
- },
127
- row: {
128
- padding: 5,
129
- margin: 3,
130
- width: '100%',
131
- backgroundColor: '#f5f5f5',
132
- gap: 10,
133
- borderRadius: 8,
134
- },
135
- rowInner: {
136
- flexGrow: 1, // ✅ cresce conforme o conteúdo
137
- justifyContent: 'center',
138
- alignItems: 'center',
139
- borderRadius: 8,
140
- padding: 10,
141
- width: '100%',
142
- },
143
- text: {
144
- fontSize: 18,
145
- fontWeight: 'bold',
146
- },
147
- });
148
-
149
- const stylesRepeat = StyleSheet.create({
150
- container: {
151
- flex: 1,
152
- width: '100%',
153
- flexDirection: 'row',
154
- flexWrap: 'wrap',
155
- gap: 10,
156
- alignItems: 'stretch',
157
- },
158
- row: {
159
- padding: 0,
160
- width: '100%',
161
- },
162
- rowInner: {
163
- flexGrow: 1, // ✅ cresce conforme o conteúdo
164
- justifyContent: 'center',
165
- alignItems: 'center',
166
- padding: 0,
167
- width: '100%',
168
- },
169
- text: {
170
- fontSize: 18,
171
- fontWeight: 'bold',
172
- },
173
- });
1
+ import React, { useState } from 'react';
2
+ import { ChildType, ComponentUtils, Utils } from 'react-crud-utils';
3
+ import { StyleSheet, Text, TouchableHighlight, View } from 'react-native';
4
+ import UIListRow from './UIListRow';
5
+ import UI from '../UI';
6
+ import { Ionicons } from '@expo/vector-icons';
7
+
8
+ export default function UIList(props: ChildType) {
9
+ const scope = props.scope;
10
+ const crud = scope.crud;
11
+ const original = scope.original;
12
+ const cols = Utils.nvl(original.cols, 1);
13
+ const rowWidth = Math.floor(100 / cols) + '%';
14
+ const items = Utils.nvl(scope.getItems(), []);
15
+ const styles = { repeat: stylesRepeat, list: stylesList }?.[original.type];
16
+ const add = ComponentUtils.getDefine(props, 'add');
17
+ const hideAddWhenEmpty = original.hideAddWhenEmpty;
18
+
19
+ const onClick = (item: any) => {
20
+ scope.call('click', { value: item, item, edit: true });
21
+ };
22
+
23
+ const getStyle = (key: string, extra?: any) => {
24
+ return scope.getStyle(key, { ...extra, ...styles[key] });
25
+ };
26
+
27
+ const getRowStyle = (extra?: any) => {
28
+ let row = getStyle('row', {});
29
+
30
+ if (cols > 0) {
31
+ row.width = rowWidth;
32
+ }
33
+
34
+ return row;
35
+ };
36
+
37
+ const getContainerStyle = (extra?: any) => {
38
+ let row = getStyle('container', {});
39
+
40
+ if (cols > 1) {
41
+ row = { ...row, flexDirection: 'row', flexWrap: 'wrap' };
42
+ }
43
+
44
+ return row;
45
+ };
46
+
47
+ const isShowAdd = () => {
48
+ if (!Utils.isEmpty(items)) {
49
+ return true;
50
+ }
51
+ return hideAddWhenEmpty !== true;
52
+ };
53
+
54
+ let Empty = () => {
55
+ if (!Utils.isEmpty(items)) {
56
+ return <></>;
57
+ }
58
+
59
+ let empty = scope.attr('empty', 'Sem registro');
60
+
61
+ if (!empty) {
62
+ return <></>;
63
+ }
64
+
65
+ if (typeof empty === 'string') {
66
+ return (
67
+ <Text
68
+ style={scope.getStyle('empty', {
69
+ flex: 1,
70
+ fontWeight: 500,
71
+ fontSize: 20,
72
+ padding: 10,
73
+ textAlign: 'center',
74
+ justifyContent: 'center',
75
+ alignItems: 'center',
76
+ })}
77
+ >
78
+ {empty}
79
+ </Text>
80
+ );
81
+ }
82
+
83
+ return <>{empty}</>;
84
+ };
85
+
86
+ return (
87
+ <>
88
+ {original.search !== false && (
89
+ <UI.Text
90
+ placeholder="Pesquisar..."
91
+ field="query"
92
+ crud={crud}
93
+ right={<Ionicons name="search" size={20} color="#888" />}
94
+ />
95
+ )}
96
+
97
+ <View style={getContainerStyle()}>
98
+ <Empty />
99
+ {items.map((item: any, i: number) => (
100
+ <TouchableHighlight
101
+ key={`k-${i}`}
102
+ style={getRowStyle()}
103
+ underlayColor={'transparent'}
104
+ onPress={e => {
105
+ onClick(item);
106
+ }}
107
+ >
108
+ <UIListRow scope={scope} item={item} index={i}>
109
+ {props.children}
110
+ </UIListRow>
111
+ </TouchableHighlight>
112
+ ))}
113
+ {isShowAdd() && <>{add}</>}
114
+ </View>
115
+ </>
116
+ );
117
+ }
118
+
119
+ const stylesList = StyleSheet.create({
120
+ container: {
121
+ flex: 1,
122
+ width: '100%',
123
+ flexDirection: 'row',
124
+ flexWrap: 'wrap',
125
+ alignItems: 'stretch',
126
+ },
127
+ row: {
128
+ padding: 5,
129
+ margin: 3,
130
+ width: '100%',
131
+ backgroundColor: '#f5f5f5',
132
+ gap: 10,
133
+ borderRadius: 8,
134
+ },
135
+ rowInner: {
136
+ flexGrow: 1, // ✅ cresce conforme o conteúdo
137
+ justifyContent: 'center',
138
+ alignItems: 'center',
139
+ borderRadius: 8,
140
+ padding: 10,
141
+ width: '100%',
142
+ },
143
+ text: {
144
+ fontSize: 18,
145
+ fontWeight: 'bold',
146
+ },
147
+ });
148
+
149
+ const stylesRepeat = StyleSheet.create({
150
+ container: {
151
+ flex: 1,
152
+ width: '100%',
153
+ flexDirection: 'row',
154
+ flexWrap: 'wrap',
155
+ gap: 10,
156
+ alignItems: 'stretch',
157
+ },
158
+ row: {
159
+ padding: 0,
160
+ width: '100%',
161
+ },
162
+ rowInner: {
163
+ flexGrow: 1, // ✅ cresce conforme o conteúdo
164
+ justifyContent: 'center',
165
+ alignItems: 'center',
166
+ padding: 0,
167
+ width: '100%',
168
+ },
169
+ text: {
170
+ fontSize: 18,
171
+ fontWeight: 'bold',
172
+ },
173
+ });
@@ -1,32 +1,32 @@
1
- import React, { useState } from 'react';
2
- import { ChildType, ScopeUtils, Utils } from 'react-crud-utils';
3
- import UIChildren from '../UIChildren';
4
-
5
- interface UIListRowType extends ChildType {
6
- item: any;
7
- index: number;
8
- }
9
-
10
- export default function UIListRow(props: UIListRowType) {
11
- const parent = props.scope;
12
- const item = props.item;
13
- const index = props.index;
14
- const name = `${parent.key('row', index)}`;
15
- const row = {
16
- parent,
17
- name,
18
- crud: parent.crud,
19
- index,
20
- type: 'row',
21
- data: item,
22
- };
23
- let [scope] = useState(ScopeUtils.create(row));
24
-
25
- return (
26
- <>
27
- <UIChildren scope={scope} crud={scope.crud}>
28
- {props.children}
29
- </UIChildren>
30
- </>
31
- );
32
- }
1
+ import React, { useState } from 'react';
2
+ import { ChildType, ScopeUtils, Utils } from 'react-crud-utils';
3
+ import UIChildren from '../UIChildren';
4
+
5
+ interface UIListRowType extends ChildType {
6
+ item: any;
7
+ index: number;
8
+ }
9
+
10
+ export default function UIListRow(props: UIListRowType) {
11
+ const parent = props.scope;
12
+ const item = props.item;
13
+ const index = props.index;
14
+ const name = `${parent.key('row', index)}`;
15
+ const row = {
16
+ parent,
17
+ name,
18
+ crud: parent.crud,
19
+ index,
20
+ type: 'row',
21
+ data: item,
22
+ };
23
+ let [scope] = useState(ScopeUtils.create(row));
24
+
25
+ return (
26
+ <>
27
+ <UIChildren scope={scope} crud={scope.crud}>
28
+ {props.children}
29
+ </UIChildren>
30
+ </>
31
+ );
32
+ }