@draftbit/core 44.1.13-2d7ff5.0 → 44.1.13-94423a.0
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/lib/commonjs/Provider.js.map +1 -1
- package/lib/commonjs/components/Picker/PickerComponent.android.js +16 -41
- package/lib/commonjs/components/Picker/PickerComponent.android.js.map +1 -1
- package/lib/commonjs/components/Picker/PickerComponent.ios.js +31 -73
- package/lib/commonjs/components/Picker/PickerComponent.ios.js.map +1 -1
- package/lib/commonjs/components/Picker/PickerComponent.web.js +16 -41
- package/lib/commonjs/components/Picker/PickerComponent.web.js.map +1 -1
- package/lib/commonjs/components/RowHeadlineImageIcon.js.map +1 -1
- package/lib/commonjs/components/Typography.js.map +1 -1
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/mappings/CircleImage.js.map +1 -1
- package/lib/commonjs/mappings/RadioButtonGroup.js.map +1 -1
- package/lib/commonjs/mappings/RowHeadlineImageIcon.js.map +1 -1
- package/lib/commonjs/mappings/SafeAreaView.js.map +1 -1
- package/lib/commonjs/mappings/TextArea.js.map +1 -1
- package/lib/module/components/Picker/PickerComponent.android.js +19 -39
- package/lib/module/components/Picker/PickerComponent.android.js.map +1 -1
- package/lib/module/components/Picker/PickerComponent.ios.js +35 -66
- package/lib/module/components/Picker/PickerComponent.ios.js.map +1 -1
- package/lib/module/components/Picker/PickerComponent.web.js +19 -39
- package/lib/module/components/Picker/PickerComponent.web.js.map +1 -1
- package/package.json +2 -2
- package/src/components/Picker/PickerComponent.android.js +16 -18
- package/src/components/Picker/PickerComponent.android.tsx +18 -40
- package/src/components/Picker/PickerComponent.ios.js +32 -41
- package/src/components/Picker/PickerComponent.ios.tsx +37 -72
- package/src/components/Picker/PickerComponent.web.js +16 -18
- package/src/components/Picker/PickerComponent.web.tsx +18 -40
|
@@ -1,69 +1,38 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
import {
|
|
5
|
-
import
|
|
6
|
-
import Button from "../DeprecatedButton";
|
|
7
|
-
const {
|
|
8
|
-
width: deviceWidth,
|
|
9
|
-
height: deviceHeight
|
|
10
|
-
} = Dimensions.get("screen");
|
|
11
|
-
export const PickerComponent = _ref => {
|
|
12
|
-
let {
|
|
13
|
-
Icon,
|
|
14
|
-
togglePickerVisible,
|
|
15
|
-
pickerOptions,
|
|
16
|
-
internalValue,
|
|
17
|
-
handleValueChange
|
|
18
|
-
} = _ref;
|
|
19
|
-
return /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(View, {
|
|
20
|
-
style: styles.iosPicker
|
|
21
|
-
}, /*#__PURE__*/React.createElement(SafeAreaView, {
|
|
22
|
-
style: styles.iosSafeArea
|
|
23
|
-
}, /*#__PURE__*/React.createElement(Button, {
|
|
24
|
-
Icon: Icon,
|
|
25
|
-
type: "text",
|
|
26
|
-
onPress: togglePickerVisible,
|
|
27
|
-
style: styles.iosButton
|
|
28
|
-
}, "Close"), /*#__PURE__*/React.createElement(NativePicker, {
|
|
29
|
-
style: styles.iosNativePicker,
|
|
30
|
-
selectedValue: internalValue,
|
|
31
|
-
onValueChange: handleValueChange
|
|
32
|
-
}, pickerOptions.map(option => /*#__PURE__*/React.createElement(NativePicker.Item, {
|
|
33
|
-
label: option.label,
|
|
34
|
-
value: option.value,
|
|
35
|
-
key: option.value
|
|
36
|
-
}))))));
|
|
37
|
-
};
|
|
38
|
-
const styles = StyleSheet.create({
|
|
39
|
-
iosPicker: {
|
|
40
|
-
position: "absolute",
|
|
41
|
-
bottom: 0,
|
|
42
|
-
left: 0,
|
|
43
|
-
right: 0,
|
|
44
|
-
flexDirection: "row",
|
|
45
|
-
justifyContent: "center",
|
|
46
|
-
width: deviceWidth,
|
|
47
|
-
// TODO
|
|
48
|
-
maxWidth: deviceWidth,
|
|
49
|
-
maxHeight: deviceHeight,
|
|
50
|
-
backgroundColor: "green" // TODO
|
|
51
|
-
// backgroundColor: "rgba(255, 255, 255, 1)",
|
|
2
|
+
import {
|
|
3
|
+
/* View, StyleSheet, Dimensions, */
|
|
4
|
+
Text } from "react-native"; // import { SafeAreaView } from "react-native-safe-area-context";
|
|
5
|
+
// import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
52
6
|
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
}
|
|
7
|
+
export const PickerComponent = () => {
|
|
8
|
+
return /*#__PURE__*/React.createElement(Text, null, "ios");
|
|
9
|
+
}; // const styles = StyleSheet.create({
|
|
10
|
+
// iosPicker: {
|
|
11
|
+
// position: "absolute",
|
|
12
|
+
// bottom: 0,
|
|
13
|
+
// left: 0,
|
|
14
|
+
// right: 0,
|
|
15
|
+
// flexDirection: "row",
|
|
16
|
+
// justifyContent: "center",
|
|
17
|
+
// width: deviceWidth, // TODO
|
|
18
|
+
// maxWidth: deviceWidth,
|
|
19
|
+
// maxHeight: deviceHeight,
|
|
20
|
+
// backgroundColor: "green", // TODO
|
|
21
|
+
// // backgroundColor: "rgba(255, 255, 255, 1)",
|
|
22
|
+
// },
|
|
23
|
+
// iosSafeArea: {
|
|
24
|
+
// backgroundColor: "yellow",
|
|
25
|
+
// // backgroundColor: "white",// TODO
|
|
26
|
+
// flexDirection: "column",
|
|
27
|
+
// width: deviceWidth,
|
|
28
|
+
// maxWidth: deviceWidth,
|
|
29
|
+
// },
|
|
30
|
+
// iosButton: {
|
|
31
|
+
// alignSelf: "flex-end",
|
|
32
|
+
// },
|
|
33
|
+
// iosNativePicker: {
|
|
34
|
+
// //backgroundColor: "white",// TODO
|
|
35
|
+
// backgroundColor: "red",
|
|
36
|
+
// },
|
|
37
|
+
// });
|
|
69
38
|
//# sourceMappingURL=PickerComponent.ios.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["PickerComponent.ios.tsx"],"names":["React","
|
|
1
|
+
{"version":3,"sources":["PickerComponent.ios.tsx"],"names":["React","Text","PickerComponent"],"mappings":"AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA;AAAS;AAAoCC,IAA7C,QAAyD,cAAzD,C,CACA;AACA;;AAkBA,OAAO,MAAMC,eAA+C,GAAG,MAAM;AACnE,sBAAO,oBAAC,IAAD,cAAP;AACD,CAFM,C,CAIP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","sourcesContent":["import * as React from \"react\";\nimport { /* View, StyleSheet, Dimensions, */ Text } from \"react-native\";\n// import { SafeAreaView } from \"react-native-safe-area-context\";\n// import { Picker as NativePicker } from \"@react-native-picker/picker\";\n\nimport type { IconSlot } from \"../../interfaces/Icon\";\n// import Portal from \"../Portal/Portal\";\n// import Button from \"../DeprecatedButton\";\nimport { PickerOption } from \"./Picker\";\n\n// const { width: deviceWidth, height: deviceHeight } = Dimensions.get(\"screen\");\n\ninterface PickerComponentProps {\n Icon: IconSlot[\"Icon\"];\n androidPickerRef: React.RefObject<any>;\n togglePickerVisible: () => void;\n pickerOptions: PickerOption[];\n internalValue: string | undefined;\n handleValueChange: (newValue: string, itemIndex: number) => void;\n}\n\nexport const PickerComponent: React.FC<PickerComponentProps> = () => {\n return <Text>ios</Text>;\n};\n\n// const styles = StyleSheet.create({\n// iosPicker: {\n// position: \"absolute\",\n// bottom: 0,\n// left: 0,\n// right: 0,\n// flexDirection: \"row\",\n// justifyContent: \"center\",\n// width: deviceWidth, // TODO\n// maxWidth: deviceWidth,\n// maxHeight: deviceHeight,\n// backgroundColor: \"green\", // TODO\n// // backgroundColor: \"rgba(255, 255, 255, 1)\",\n// },\n// iosSafeArea: {\n// backgroundColor: \"yellow\",\n// // backgroundColor: \"white\",// TODO\n// flexDirection: \"column\",\n// width: deviceWidth,\n// maxWidth: deviceWidth,\n// },\n// iosButton: {\n// alignSelf: \"flex-end\",\n// },\n// iosNativePicker: {\n// //backgroundColor: \"white\",// TODO\n// backgroundColor: \"red\",\n// },\n// });\n"]}
|
|
@@ -1,41 +1,21 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import {
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
onBlur: togglePickerVisible
|
|
22
|
-
}, pickerOptions.map(option => /*#__PURE__*/React.createElement(NativePicker.Item, {
|
|
23
|
-
label: option.label,
|
|
24
|
-
value: option.value,
|
|
25
|
-
key: option.value
|
|
26
|
-
})));
|
|
27
|
-
};
|
|
28
|
-
const styles = StyleSheet.create({
|
|
29
|
-
nonIosPicker: {
|
|
30
|
-
opacity: 0,
|
|
31
|
-
position: "absolute",
|
|
32
|
-
top: 0,
|
|
33
|
-
left: 0,
|
|
34
|
-
right: 0,
|
|
35
|
-
bottom: 0,
|
|
36
|
-
width: "100%",
|
|
37
|
-
maxWidth: deviceWidth,
|
|
38
|
-
maxHeight: deviceHeight
|
|
39
|
-
}
|
|
40
|
-
});
|
|
2
|
+
import {
|
|
3
|
+
/* StyleSheet, Dimensions, */
|
|
4
|
+
Text } from "react-native"; // import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
5
|
+
|
|
6
|
+
export const PickerComponent = () => {
|
|
7
|
+
return /*#__PURE__*/React.createElement(Text, null, "web");
|
|
8
|
+
}; // const styles = StyleSheet.create({
|
|
9
|
+
// nonIosPicker: {
|
|
10
|
+
// opacity: 0,
|
|
11
|
+
// position: "absolute",
|
|
12
|
+
// top: 0,
|
|
13
|
+
// left: 0,
|
|
14
|
+
// right: 0,
|
|
15
|
+
// bottom: 0,
|
|
16
|
+
// width: "100%",
|
|
17
|
+
// maxWidth: deviceWidth,
|
|
18
|
+
// maxHeight: deviceHeight,
|
|
19
|
+
// },
|
|
20
|
+
// });
|
|
41
21
|
//# sourceMappingURL=PickerComponent.web.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["PickerComponent.web.tsx"],"names":["React","
|
|
1
|
+
{"version":3,"sources":["PickerComponent.web.tsx"],"names":["React","Text","PickerComponent"],"mappings":"AAAA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA;AAAS;AAA+BC,IAAxC,QAAoD,cAApD,C,CAEA;;AAiBA,OAAO,MAAMC,eAA+C,GAAG,MAAM;AACnE,sBAAO,oBAAC,IAAD,cAAP;AACD,CAFM,C,CAIP;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA","sourcesContent":["import * as React from \"react\";\nimport { /* StyleSheet, Dimensions, */ Text } from \"react-native\";\n\n// import { Picker as NativePicker } from \"@react-native-picker/picker\";\n\nimport type { IconSlot } from \"../../interfaces/Icon\";\n\nimport { PickerOption } from \"./Picker\";\n\n// const { width: deviceWidth, height: deviceHeight } = Dimensions.get(\"screen\");\n\ninterface PickerComponentProps {\n Icon: IconSlot[\"Icon\"];\n androidPickerRef: React.RefObject<any>;\n togglePickerVisible: () => void;\n pickerOptions: PickerOption[];\n internalValue: string | undefined;\n handleValueChange: (newValue: string, itemIndex: number) => void;\n}\n\nexport const PickerComponent: React.FC<PickerComponentProps> = () => {\n return <Text>web</Text>;\n};\n\n// const styles = StyleSheet.create({\n// nonIosPicker: {\n// opacity: 0,\n// position: \"absolute\",\n// top: 0,\n// left: 0,\n// right: 0,\n// bottom: 0,\n// width: \"100%\",\n// maxWidth: deviceWidth,\n// maxHeight: deviceHeight,\n// },\n// });\n"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@draftbit/core",
|
|
3
|
-
"version": "44.1.13-
|
|
3
|
+
"version": "44.1.13-94423a.0+94423af1",
|
|
4
4
|
"description": "Core (non-native) Components",
|
|
5
5
|
"main": "lib/commonjs/index.js",
|
|
6
6
|
"module": "lib/module/index.js",
|
|
@@ -79,5 +79,5 @@
|
|
|
79
79
|
]
|
|
80
80
|
]
|
|
81
81
|
},
|
|
82
|
-
"gitHead": "
|
|
82
|
+
"gitHead": "94423af1aae09c965f8983ad72e09ae6b9cf253f"
|
|
83
83
|
}
|
|
@@ -1,20 +1,18 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import { StyleSheet, Dimensions } from "react-native";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
export const PickerComponent = ({ androidPickerRef, togglePickerVisible, pickerOptions, internalValue, handleValueChange, }) => {
|
|
6
|
-
return (React.createElement(NativePicker, { selectedValue: internalValue, onValueChange: handleValueChange, style: styles.nonIosPicker, ref: androidPickerRef, onBlur: togglePickerVisible }, pickerOptions.map((option) => (React.createElement(NativePicker.Item, { label: option.label, value: option.value, key: option.value })))));
|
|
2
|
+
import { /* StyleSheet, Dimensions, View, */ Text } from "react-native";
|
|
3
|
+
export const PickerComponent = () => {
|
|
4
|
+
return React.createElement(Text, null, "android");
|
|
7
5
|
};
|
|
8
|
-
const styles = StyleSheet.create({
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
});
|
|
6
|
+
// const styles = StyleSheet.create({
|
|
7
|
+
// nonIosPicker: {
|
|
8
|
+
// opacity: 0,
|
|
9
|
+
// position: "absolute",
|
|
10
|
+
// top: 0,
|
|
11
|
+
// left: 0,
|
|
12
|
+
// right: 0,
|
|
13
|
+
// bottom: 0,
|
|
14
|
+
// width: "100%",
|
|
15
|
+
// maxWidth: deviceWidth,
|
|
16
|
+
// maxHeight: deviceHeight,
|
|
17
|
+
// },
|
|
18
|
+
// });
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import { StyleSheet, Dimensions } from "react-native";
|
|
2
|
+
import { /* StyleSheet, Dimensions, View, */ Text } from "react-native";
|
|
3
3
|
|
|
4
|
-
import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
4
|
+
// import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
5
5
|
|
|
6
6
|
import type { IconSlot } from "../../interfaces/Icon";
|
|
7
7
|
|
|
8
8
|
import { PickerOption } from "./Picker";
|
|
9
9
|
|
|
10
|
-
const { width: deviceWidth, height: deviceHeight } = Dimensions.get("screen");
|
|
10
|
+
// const { width: deviceWidth, height: deviceHeight } = Dimensions.get("screen");
|
|
11
11
|
|
|
12
12
|
interface PickerComponentProps {
|
|
13
13
|
Icon: IconSlot["Icon"];
|
|
@@ -18,42 +18,20 @@ interface PickerComponentProps {
|
|
|
18
18
|
handleValueChange: (newValue: string, itemIndex: number) => void;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
|
-
export const PickerComponent: React.FC<PickerComponentProps> = ({
|
|
22
|
-
|
|
23
|
-
togglePickerVisible,
|
|
24
|
-
pickerOptions,
|
|
25
|
-
internalValue,
|
|
26
|
-
handleValueChange,
|
|
27
|
-
}) => {
|
|
28
|
-
return (
|
|
29
|
-
<NativePicker
|
|
30
|
-
selectedValue={internalValue}
|
|
31
|
-
onValueChange={handleValueChange}
|
|
32
|
-
style={styles.nonIosPicker}
|
|
33
|
-
ref={androidPickerRef}
|
|
34
|
-
onBlur={togglePickerVisible}
|
|
35
|
-
>
|
|
36
|
-
{(pickerOptions as unknown as PickerOption[]).map((option) => (
|
|
37
|
-
<NativePicker.Item
|
|
38
|
-
label={option.label}
|
|
39
|
-
value={option.value}
|
|
40
|
-
key={option.value}
|
|
41
|
-
/>
|
|
42
|
-
))}
|
|
43
|
-
</NativePicker>
|
|
44
|
-
);
|
|
21
|
+
export const PickerComponent: React.FC<PickerComponentProps> = () => {
|
|
22
|
+
return <Text>android</Text>;
|
|
45
23
|
};
|
|
46
24
|
|
|
47
|
-
const styles = StyleSheet.create({
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
});
|
|
25
|
+
// const styles = StyleSheet.create({
|
|
26
|
+
// nonIosPicker: {
|
|
27
|
+
// opacity: 0,
|
|
28
|
+
// position: "absolute",
|
|
29
|
+
// top: 0,
|
|
30
|
+
// left: 0,
|
|
31
|
+
// right: 0,
|
|
32
|
+
// bottom: 0,
|
|
33
|
+
// width: "100%",
|
|
34
|
+
// maxWidth: deviceWidth,
|
|
35
|
+
// maxHeight: deviceHeight,
|
|
36
|
+
// },
|
|
37
|
+
// });
|
|
@@ -1,43 +1,34 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import { View, StyleSheet, Dimensions } from "react-native";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
import Portal from "../Portal/Portal";
|
|
6
|
-
import Button from "../DeprecatedButton";
|
|
7
|
-
const { width: deviceWidth, height: deviceHeight } = Dimensions.get("screen");
|
|
8
|
-
export const PickerComponent = ({ Icon, togglePickerVisible, pickerOptions, internalValue, handleValueChange, }) => {
|
|
9
|
-
return (React.createElement(Portal, null,
|
|
10
|
-
React.createElement(View, { style: styles.iosPicker },
|
|
11
|
-
React.createElement(SafeAreaView, { style: styles.iosSafeArea },
|
|
12
|
-
React.createElement(Button, { Icon: Icon, type: "text", onPress: togglePickerVisible, style: styles.iosButton }, "Close"),
|
|
13
|
-
React.createElement(NativePicker, { style: styles.iosNativePicker, selectedValue: internalValue, onValueChange: handleValueChange }, pickerOptions.map((option) => (React.createElement(NativePicker.Item, { label: option.label, value: option.value, key: option.value }))))))));
|
|
2
|
+
import { /* View, StyleSheet, Dimensions, */ Text } from "react-native";
|
|
3
|
+
export const PickerComponent = () => {
|
|
4
|
+
return React.createElement(Text, null, "ios");
|
|
14
5
|
};
|
|
15
|
-
const styles = StyleSheet.create({
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
});
|
|
6
|
+
// const styles = StyleSheet.create({
|
|
7
|
+
// iosPicker: {
|
|
8
|
+
// position: "absolute",
|
|
9
|
+
// bottom: 0,
|
|
10
|
+
// left: 0,
|
|
11
|
+
// right: 0,
|
|
12
|
+
// flexDirection: "row",
|
|
13
|
+
// justifyContent: "center",
|
|
14
|
+
// width: deviceWidth, // TODO
|
|
15
|
+
// maxWidth: deviceWidth,
|
|
16
|
+
// maxHeight: deviceHeight,
|
|
17
|
+
// backgroundColor: "green", // TODO
|
|
18
|
+
// // backgroundColor: "rgba(255, 255, 255, 1)",
|
|
19
|
+
// },
|
|
20
|
+
// iosSafeArea: {
|
|
21
|
+
// backgroundColor: "yellow",
|
|
22
|
+
// // backgroundColor: "white",// TODO
|
|
23
|
+
// flexDirection: "column",
|
|
24
|
+
// width: deviceWidth,
|
|
25
|
+
// maxWidth: deviceWidth,
|
|
26
|
+
// },
|
|
27
|
+
// iosButton: {
|
|
28
|
+
// alignSelf: "flex-end",
|
|
29
|
+
// },
|
|
30
|
+
// iosNativePicker: {
|
|
31
|
+
// //backgroundColor: "white",// TODO
|
|
32
|
+
// backgroundColor: "red",
|
|
33
|
+
// },
|
|
34
|
+
// });
|
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import { View, StyleSheet, Dimensions } from "react-native";
|
|
3
|
-
import { SafeAreaView } from "react-native-safe-area-context";
|
|
4
|
-
import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
2
|
+
import { /* View, StyleSheet, Dimensions, */ Text } from "react-native";
|
|
3
|
+
// import { SafeAreaView } from "react-native-safe-area-context";
|
|
4
|
+
// import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
5
5
|
|
|
6
6
|
import type { IconSlot } from "../../interfaces/Icon";
|
|
7
|
-
import Portal from "../Portal/Portal";
|
|
8
|
-
import Button from "../DeprecatedButton";
|
|
7
|
+
// import Portal from "../Portal/Portal";
|
|
8
|
+
// import Button from "../DeprecatedButton";
|
|
9
9
|
import { PickerOption } from "./Picker";
|
|
10
10
|
|
|
11
|
-
const { width: deviceWidth, height: deviceHeight } = Dimensions.get("screen");
|
|
11
|
+
// const { width: deviceWidth, height: deviceHeight } = Dimensions.get("screen");
|
|
12
12
|
|
|
13
13
|
interface PickerComponentProps {
|
|
14
14
|
Icon: IconSlot["Icon"];
|
|
@@ -19,71 +19,36 @@ interface PickerComponentProps {
|
|
|
19
19
|
handleValueChange: (newValue: string, itemIndex: number) => void;
|
|
20
20
|
}
|
|
21
21
|
|
|
22
|
-
export const PickerComponent: React.FC<PickerComponentProps> = ({
|
|
23
|
-
|
|
24
|
-
togglePickerVisible,
|
|
25
|
-
pickerOptions,
|
|
26
|
-
internalValue,
|
|
27
|
-
handleValueChange,
|
|
28
|
-
}) => {
|
|
29
|
-
return (
|
|
30
|
-
<Portal>
|
|
31
|
-
<View style={styles.iosPicker}>
|
|
32
|
-
<SafeAreaView style={styles.iosSafeArea}>
|
|
33
|
-
<Button
|
|
34
|
-
Icon={Icon}
|
|
35
|
-
type="text"
|
|
36
|
-
onPress={togglePickerVisible}
|
|
37
|
-
style={styles.iosButton}
|
|
38
|
-
>
|
|
39
|
-
{"Close"}
|
|
40
|
-
</Button>
|
|
41
|
-
|
|
42
|
-
<NativePicker
|
|
43
|
-
style={styles.iosNativePicker}
|
|
44
|
-
selectedValue={internalValue}
|
|
45
|
-
onValueChange={handleValueChange}
|
|
46
|
-
>
|
|
47
|
-
{(pickerOptions as unknown as PickerOption[]).map((option) => (
|
|
48
|
-
<NativePicker.Item
|
|
49
|
-
label={option.label}
|
|
50
|
-
value={option.value}
|
|
51
|
-
key={option.value}
|
|
52
|
-
/>
|
|
53
|
-
))}
|
|
54
|
-
</NativePicker>
|
|
55
|
-
</SafeAreaView>
|
|
56
|
-
</View>
|
|
57
|
-
</Portal>
|
|
58
|
-
);
|
|
22
|
+
export const PickerComponent: React.FC<PickerComponentProps> = () => {
|
|
23
|
+
return <Text>ios</Text>;
|
|
59
24
|
};
|
|
60
25
|
|
|
61
|
-
const styles = StyleSheet.create({
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
});
|
|
26
|
+
// const styles = StyleSheet.create({
|
|
27
|
+
// iosPicker: {
|
|
28
|
+
// position: "absolute",
|
|
29
|
+
// bottom: 0,
|
|
30
|
+
// left: 0,
|
|
31
|
+
// right: 0,
|
|
32
|
+
// flexDirection: "row",
|
|
33
|
+
// justifyContent: "center",
|
|
34
|
+
// width: deviceWidth, // TODO
|
|
35
|
+
// maxWidth: deviceWidth,
|
|
36
|
+
// maxHeight: deviceHeight,
|
|
37
|
+
// backgroundColor: "green", // TODO
|
|
38
|
+
// // backgroundColor: "rgba(255, 255, 255, 1)",
|
|
39
|
+
// },
|
|
40
|
+
// iosSafeArea: {
|
|
41
|
+
// backgroundColor: "yellow",
|
|
42
|
+
// // backgroundColor: "white",// TODO
|
|
43
|
+
// flexDirection: "column",
|
|
44
|
+
// width: deviceWidth,
|
|
45
|
+
// maxWidth: deviceWidth,
|
|
46
|
+
// },
|
|
47
|
+
// iosButton: {
|
|
48
|
+
// alignSelf: "flex-end",
|
|
49
|
+
// },
|
|
50
|
+
// iosNativePicker: {
|
|
51
|
+
// //backgroundColor: "white",// TODO
|
|
52
|
+
// backgroundColor: "red",
|
|
53
|
+
// },
|
|
54
|
+
// });
|
|
@@ -1,20 +1,18 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import { StyleSheet, Dimensions } from "react-native";
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
export const PickerComponent = ({ androidPickerRef, togglePickerVisible, pickerOptions, internalValue, handleValueChange, }) => {
|
|
6
|
-
return (React.createElement(NativePicker, { selectedValue: internalValue, onValueChange: handleValueChange, style: styles.nonIosPicker, ref: androidPickerRef, onBlur: togglePickerVisible }, pickerOptions.map((option) => (React.createElement(NativePicker.Item, { label: option.label, value: option.value, key: option.value })))));
|
|
2
|
+
import { /* StyleSheet, Dimensions, */ Text } from "react-native";
|
|
3
|
+
export const PickerComponent = () => {
|
|
4
|
+
return React.createElement(Text, null, "web");
|
|
7
5
|
};
|
|
8
|
-
const styles = StyleSheet.create({
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
});
|
|
6
|
+
// const styles = StyleSheet.create({
|
|
7
|
+
// nonIosPicker: {
|
|
8
|
+
// opacity: 0,
|
|
9
|
+
// position: "absolute",
|
|
10
|
+
// top: 0,
|
|
11
|
+
// left: 0,
|
|
12
|
+
// right: 0,
|
|
13
|
+
// bottom: 0,
|
|
14
|
+
// width: "100%",
|
|
15
|
+
// maxWidth: deviceWidth,
|
|
16
|
+
// maxHeight: deviceHeight,
|
|
17
|
+
// },
|
|
18
|
+
// });
|
|
@@ -1,13 +1,13 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
import { StyleSheet, Dimensions } from "react-native";
|
|
2
|
+
import { /* StyleSheet, Dimensions, */ Text } from "react-native";
|
|
3
3
|
|
|
4
|
-
import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
4
|
+
// import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
5
5
|
|
|
6
6
|
import type { IconSlot } from "../../interfaces/Icon";
|
|
7
7
|
|
|
8
8
|
import { PickerOption } from "./Picker";
|
|
9
9
|
|
|
10
|
-
const { width: deviceWidth, height: deviceHeight } = Dimensions.get("screen");
|
|
10
|
+
// const { width: deviceWidth, height: deviceHeight } = Dimensions.get("screen");
|
|
11
11
|
|
|
12
12
|
interface PickerComponentProps {
|
|
13
13
|
Icon: IconSlot["Icon"];
|
|
@@ -18,42 +18,20 @@ interface PickerComponentProps {
|
|
|
18
18
|
handleValueChange: (newValue: string, itemIndex: number) => void;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
|
-
export const PickerComponent: React.FC<PickerComponentProps> = ({
|
|
22
|
-
|
|
23
|
-
togglePickerVisible,
|
|
24
|
-
pickerOptions,
|
|
25
|
-
internalValue,
|
|
26
|
-
handleValueChange,
|
|
27
|
-
}) => {
|
|
28
|
-
return (
|
|
29
|
-
<NativePicker
|
|
30
|
-
selectedValue={internalValue}
|
|
31
|
-
onValueChange={handleValueChange}
|
|
32
|
-
style={styles.nonIosPicker}
|
|
33
|
-
ref={androidPickerRef}
|
|
34
|
-
onBlur={togglePickerVisible}
|
|
35
|
-
>
|
|
36
|
-
{(pickerOptions as unknown as PickerOption[]).map((option) => (
|
|
37
|
-
<NativePicker.Item
|
|
38
|
-
label={option.label}
|
|
39
|
-
value={option.value}
|
|
40
|
-
key={option.value}
|
|
41
|
-
/>
|
|
42
|
-
))}
|
|
43
|
-
</NativePicker>
|
|
44
|
-
);
|
|
21
|
+
export const PickerComponent: React.FC<PickerComponentProps> = () => {
|
|
22
|
+
return <Text>web</Text>;
|
|
45
23
|
};
|
|
46
24
|
|
|
47
|
-
const styles = StyleSheet.create({
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
});
|
|
25
|
+
// const styles = StyleSheet.create({
|
|
26
|
+
// nonIosPicker: {
|
|
27
|
+
// opacity: 0,
|
|
28
|
+
// position: "absolute",
|
|
29
|
+
// top: 0,
|
|
30
|
+
// left: 0,
|
|
31
|
+
// right: 0,
|
|
32
|
+
// bottom: 0,
|
|
33
|
+
// width: "100%",
|
|
34
|
+
// maxWidth: deviceWidth,
|
|
35
|
+
// maxHeight: deviceHeight,
|
|
36
|
+
// },
|
|
37
|
+
// });
|