react-crud-mobile 1.0.342 → 1.0.343
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.
- package/dist/elements/UI.d.ts +1 -0
- package/dist/react-crud-mobile.cjs.development.js +100 -2
- package/dist/react-crud-mobile.cjs.development.js.map +1 -1
- package/dist/react-crud-mobile.cjs.production.min.js +1 -1
- package/dist/react-crud-mobile.cjs.production.min.js.map +1 -1
- package/dist/react-crud-mobile.esm.js +100 -2
- package/dist/react-crud-mobile.esm.js.map +1 -1
- package/package.json +2 -2
- package/src/elements/UI.tsx +1 -0
- package/src/elements/UIElement.tsx +2 -0
- package/src/elements/core/UIModal.tsx +13 -8
package/dist/elements/UI.d.ts
CHANGED
|
@@ -11,6 +11,7 @@ import { ButtonType } from 'react-crud-utils';
|
|
|
11
11
|
import { LinkType } from 'react-crud-utils';
|
|
12
12
|
declare const UI: {
|
|
13
13
|
List: (props: ListType) => import("react").JSX.Element;
|
|
14
|
+
Row: (props: UserType) => import("react").JSX.Element;
|
|
14
15
|
Value: (props: UserType) => import("react").JSX.Element;
|
|
15
16
|
Label: (props: UserType) => import("react").JSX.Element;
|
|
16
17
|
Repeat: (props: ListType) => import("react").JSX.Element;
|
|
@@ -936,6 +936,98 @@ function UIQuantity(props) {
|
|
|
936
936
|
});
|
|
937
937
|
}
|
|
938
938
|
|
|
939
|
+
function UIModal(props) {
|
|
940
|
+
var _useState = React.useState(false),
|
|
941
|
+
modalVisible = _useState[0],
|
|
942
|
+
setModalVisible = _useState[1];
|
|
943
|
+
var scope = props.scope;
|
|
944
|
+
var label = scope.getLabel();
|
|
945
|
+
var theme = reactCrudUtils.useTheme();
|
|
946
|
+
var style = function style(part, extra) {
|
|
947
|
+
return _extends({}, styles$a[part], scope.getStyle(part), extra);
|
|
948
|
+
};
|
|
949
|
+
var toggle = function toggle(vis) {
|
|
950
|
+
modalVisible = vis;
|
|
951
|
+
setModalVisible(modalVisible);
|
|
952
|
+
};
|
|
953
|
+
scope.show = function () {
|
|
954
|
+
toggle(true);
|
|
955
|
+
};
|
|
956
|
+
scope.hide = function () {
|
|
957
|
+
toggle(true);
|
|
958
|
+
};
|
|
959
|
+
return /*#__PURE__*/jsxRuntime.jsxs(reactNative.Modal, {
|
|
960
|
+
animationType: "slide",
|
|
961
|
+
transparent: true,
|
|
962
|
+
visible: modalVisible,
|
|
963
|
+
onRequestClose: function onRequestClose() {
|
|
964
|
+
return setModalVisible(false);
|
|
965
|
+
},
|
|
966
|
+
children: [/*#__PURE__*/jsxRuntime.jsx(reactNative.StatusBar, {
|
|
967
|
+
barStyle: "dark-content",
|
|
968
|
+
backgroundColor: theme.colors.primary
|
|
969
|
+
}), /*#__PURE__*/jsxRuntime.jsxs(reactNative.SafeAreaView, {
|
|
970
|
+
style: style('modalSafe'),
|
|
971
|
+
children: [/*#__PURE__*/jsxRuntime.jsxs(reactNative.View, {
|
|
972
|
+
style: style('modalHeader'),
|
|
973
|
+
children: [/*#__PURE__*/jsxRuntime.jsx(reactNative.TouchableOpacity, {
|
|
974
|
+
onPress: function onPress() {
|
|
975
|
+
return setModalVisible(false);
|
|
976
|
+
},
|
|
977
|
+
style: style('modalCloseButton'),
|
|
978
|
+
children: /*#__PURE__*/jsxRuntime.jsx(reactNative.Text, {
|
|
979
|
+
style: style('modalCloseText'),
|
|
980
|
+
children: "X"
|
|
981
|
+
})
|
|
982
|
+
}), /*#__PURE__*/jsxRuntime.jsx(reactNative.Text, {
|
|
983
|
+
style: style('modalTitle'),
|
|
984
|
+
children: label
|
|
985
|
+
})]
|
|
986
|
+
}), /*#__PURE__*/jsxRuntime.jsx(reactNative.View, {
|
|
987
|
+
style: style('modalContent'),
|
|
988
|
+
children: /*#__PURE__*/jsxRuntime.jsx(UIChildren, {
|
|
989
|
+
scope: scope,
|
|
990
|
+
children: props.children
|
|
991
|
+
})
|
|
992
|
+
})]
|
|
993
|
+
})]
|
|
994
|
+
});
|
|
995
|
+
}
|
|
996
|
+
var styles$a = /*#__PURE__*/reactNative.StyleSheet.create({
|
|
997
|
+
modalSafe: {
|
|
998
|
+
flex: 1,
|
|
999
|
+
backgroundColor: '#f5f5f5',
|
|
1000
|
+
paddingTop: reactNative.StatusBar.currentHeight || 0
|
|
1001
|
+
},
|
|
1002
|
+
modalHeader: {
|
|
1003
|
+
flexDirection: 'row',
|
|
1004
|
+
alignItems: 'center',
|
|
1005
|
+
padding: 15,
|
|
1006
|
+
backgroundColor: '#6200ea'
|
|
1007
|
+
},
|
|
1008
|
+
modalCloseButton: {
|
|
1009
|
+
padding: 10
|
|
1010
|
+
},
|
|
1011
|
+
modalCloseText: {
|
|
1012
|
+
fontSize: 18,
|
|
1013
|
+
color: 'white'
|
|
1014
|
+
},
|
|
1015
|
+
modalTitle: {
|
|
1016
|
+
fontSize: 18,
|
|
1017
|
+
color: 'white',
|
|
1018
|
+
fontWeight: 'bold',
|
|
1019
|
+
marginLeft: 10
|
|
1020
|
+
},
|
|
1021
|
+
modalContent: {
|
|
1022
|
+
flex: 1,
|
|
1023
|
+
width: '100%',
|
|
1024
|
+
alignSelf: 'flex-start',
|
|
1025
|
+
flexDirection: 'row',
|
|
1026
|
+
flexWrap: 'wrap',
|
|
1027
|
+
padding: 20
|
|
1028
|
+
}
|
|
1029
|
+
});
|
|
1030
|
+
|
|
939
1031
|
function UIElement(props) {
|
|
940
1032
|
var _original$list, _original$load;
|
|
941
1033
|
var _useState = React.useState(reactCrudUtils.ScopeUtils.create(props)),
|
|
@@ -956,6 +1048,7 @@ function UIElement(props) {
|
|
|
956
1048
|
};
|
|
957
1049
|
var router = {
|
|
958
1050
|
list: UIList,
|
|
1051
|
+
dialog: UIModal,
|
|
959
1052
|
repeat: UIList,
|
|
960
1053
|
tabs: ElTabs,
|
|
961
1054
|
chart: ElChart
|
|
@@ -1045,7 +1138,7 @@ function UIElement(props) {
|
|
|
1045
1138
|
var _elementStyle$type;
|
|
1046
1139
|
var type = reactCrudUtils.Utils.nvl(original.type, 'none');
|
|
1047
1140
|
var key = reactCrudUtils.Utils.nvl(part, 'root');
|
|
1048
|
-
var def = _extends({}, styles$
|
|
1141
|
+
var def = _extends({}, styles$b[key], elementStyle == null || (_elementStyle$type = elementStyle[type]) == null ? void 0 : _elementStyle$type[key]);
|
|
1049
1142
|
var hasChild = hasChildren();
|
|
1050
1143
|
if (!part && !hasChild) {
|
|
1051
1144
|
def = _extends({}, def);
|
|
@@ -1286,7 +1379,7 @@ elementStyle.toggle = /*#__PURE__*/reactNative.StyleSheet.create({
|
|
|
1286
1379
|
})
|
|
1287
1380
|
});
|
|
1288
1381
|
elementStyle.list = /*#__PURE__*/_extends({}, elementStyle.card);
|
|
1289
|
-
var styles$
|
|
1382
|
+
var styles$b = /*#__PURE__*/reactNative.StyleSheet.create({
|
|
1290
1383
|
root: {
|
|
1291
1384
|
gap: 5,
|
|
1292
1385
|
flexDirection: 'column',
|
|
@@ -1358,6 +1451,11 @@ var UI = {
|
|
|
1358
1451
|
type: "list"
|
|
1359
1452
|
}));
|
|
1360
1453
|
},
|
|
1454
|
+
Row: function Row(props) {
|
|
1455
|
+
return /*#__PURE__*/jsxRuntime.jsx(UIElement, _extends({}, props, {
|
|
1456
|
+
type: "row"
|
|
1457
|
+
}));
|
|
1458
|
+
},
|
|
1361
1459
|
Value: function Value(props) {
|
|
1362
1460
|
return /*#__PURE__*/jsxRuntime.jsx(UIElement, _extends({}, props, {
|
|
1363
1461
|
type: "value"
|