@draftbit/core 47.7.12-476d3f.2 → 47.7.12-e0681f.2

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 (111) hide show
  1. package/lib/commonjs/components/Picker/Picker.js +1 -0
  2. package/lib/commonjs/components/Picker/PickerComponent.android.js +1 -0
  3. package/lib/commonjs/components/Picker/PickerComponent.ios.js +1 -0
  4. package/lib/commonjs/components/Picker/PickerComponent.web.js +1 -0
  5. package/lib/commonjs/components/Picker/PickerTypes.js +1 -0
  6. package/lib/commonjs/components/TextField.js +1 -1
  7. package/lib/commonjs/hooks.js +1 -1
  8. package/lib/commonjs/index.js +1 -1
  9. package/lib/commonjs/utilities.js +1 -1
  10. package/lib/typescript/src/components/Picker/Picker.d.ts +36 -0
  11. package/lib/typescript/src/components/Picker/Picker.js +288 -0
  12. package/lib/typescript/src/components/Picker/Picker.js.map +1 -0
  13. package/lib/typescript/src/components/Picker/PickerComponent.android.d.ts +6 -0
  14. package/lib/typescript/src/components/Picker/PickerComponent.android.js +70 -0
  15. package/lib/typescript/src/components/Picker/PickerComponent.android.js.map +1 -0
  16. package/lib/typescript/src/components/Picker/PickerComponent.ios.d.ts +7 -0
  17. package/lib/typescript/src/components/Picker/PickerComponent.ios.js +80 -0
  18. package/lib/typescript/src/components/Picker/PickerComponent.ios.js.map +1 -0
  19. package/lib/typescript/src/components/Picker/PickerComponent.web.d.ts +6 -0
  20. package/lib/typescript/src/components/Picker/PickerComponent.web.js +71 -0
  21. package/lib/typescript/src/components/Picker/PickerComponent.web.js.map +1 -0
  22. package/lib/typescript/src/components/Picker/PickerTypes.d.ts +18 -0
  23. package/lib/typescript/src/components/Picker/PickerTypes.js +2 -0
  24. package/lib/typescript/src/components/Picker/PickerTypes.js.map +1 -0
  25. package/lib/typescript/src/components/TextField.d.ts +3 -3
  26. package/lib/typescript/src/components/TextField.js +7 -11
  27. package/lib/typescript/src/components/TextField.js.map +1 -1
  28. package/lib/typescript/src/hooks.js +2 -2
  29. package/lib/typescript/src/index.d.ts +1 -1
  30. package/lib/typescript/src/index.js +1 -1
  31. package/lib/typescript/src/index.js.map +1 -1
  32. package/lib/typescript/src/utilities.d.ts +0 -8
  33. package/lib/typescript/src/utilities.js +1 -22
  34. package/lib/typescript/src/utilities.js.map +1 -1
  35. package/lib/typescript/tsconfig.tsbuildinfo +1 -1
  36. package/package.json +3 -5
  37. package/src/components/Picker/Picker.js +288 -0
  38. package/src/components/Picker/Picker.js.map +1 -0
  39. package/src/components/Picker/Picker.tsx +509 -0
  40. package/src/components/Picker/PickerComponent.android.js +70 -0
  41. package/src/components/Picker/PickerComponent.android.js.map +1 -0
  42. package/src/components/Picker/PickerComponent.android.tsx +116 -0
  43. package/src/components/Picker/PickerComponent.ios.js +80 -0
  44. package/src/components/Picker/PickerComponent.ios.js.map +1 -0
  45. package/src/components/Picker/PickerComponent.ios.tsx +142 -0
  46. package/src/components/Picker/PickerComponent.web.js +71 -0
  47. package/src/components/Picker/PickerComponent.web.js.map +1 -0
  48. package/src/components/Picker/PickerComponent.web.tsx +117 -0
  49. package/src/components/Picker/PickerTypes.js +2 -0
  50. package/src/components/Picker/PickerTypes.js.map +1 -0
  51. package/src/components/Picker/PickerTypes.ts +18 -0
  52. package/src/components/TextField.js +7 -11
  53. package/src/components/TextField.js.map +1 -1
  54. package/src/components/TextField.tsx +9 -17
  55. package/src/hooks.js +2 -2
  56. package/src/hooks.ts +2 -2
  57. package/src/index.js +1 -1
  58. package/src/index.js.map +1 -1
  59. package/src/index.tsx +1 -1
  60. package/src/utilities.js +1 -22
  61. package/src/utilities.js.map +1 -1
  62. package/src/utilities.ts +1 -33
  63. package/lib/commonjs/components/Picker/NativePicker.js +0 -1
  64. package/lib/commonjs/components/Picker/PickerCommon.js +0 -1
  65. package/lib/commonjs/components/Picker/PickerInputContainer.js +0 -1
  66. package/lib/commonjs/components/Picker/dropdown/DropDownPicker.js +0 -1
  67. package/lib/commonjs/components/Picker/dropdown/MultiSelectPicker.js +0 -1
  68. package/lib/commonjs/components/Picker/dropdown/PickerItem.js +0 -1
  69. package/lib/commonjs/components/Picker/index.js +0 -1
  70. package/lib/typescript/src/components/Picker/NativePicker.d.ts +0 -6
  71. package/lib/typescript/src/components/Picker/NativePicker.js +0 -95
  72. package/lib/typescript/src/components/Picker/NativePicker.js.map +0 -1
  73. package/lib/typescript/src/components/Picker/PickerCommon.d.ts +0 -45
  74. package/lib/typescript/src/components/Picker/PickerCommon.js +0 -23
  75. package/lib/typescript/src/components/Picker/PickerCommon.js.map +0 -1
  76. package/lib/typescript/src/components/Picker/PickerInputContainer.d.ts +0 -11
  77. package/lib/typescript/src/components/Picker/PickerInputContainer.js +0 -37
  78. package/lib/typescript/src/components/Picker/PickerInputContainer.js.map +0 -1
  79. package/lib/typescript/src/components/Picker/dropdown/DropDownPicker.d.ts +0 -6
  80. package/lib/typescript/src/components/Picker/dropdown/DropDownPicker.js +0 -67
  81. package/lib/typescript/src/components/Picker/dropdown/DropDownPicker.js.map +0 -1
  82. package/lib/typescript/src/components/Picker/dropdown/MultiSelectPicker.d.ts +0 -6
  83. package/lib/typescript/src/components/Picker/dropdown/MultiSelectPicker.js +0 -9
  84. package/lib/typescript/src/components/Picker/dropdown/MultiSelectPicker.js.map +0 -1
  85. package/lib/typescript/src/components/Picker/dropdown/PickerItem.d.ts +0 -14
  86. package/lib/typescript/src/components/Picker/dropdown/PickerItem.js +0 -9
  87. package/lib/typescript/src/components/Picker/dropdown/PickerItem.js.map +0 -1
  88. package/lib/typescript/src/components/Picker/index.d.ts +0 -10
  89. package/lib/typescript/src/components/Picker/index.js +0 -18
  90. package/lib/typescript/src/components/Picker/index.js.map +0 -1
  91. package/src/components/Picker/NativePicker.js +0 -95
  92. package/src/components/Picker/NativePicker.js.map +0 -1
  93. package/src/components/Picker/NativePicker.tsx +0 -158
  94. package/src/components/Picker/PickerCommon.js +0 -23
  95. package/src/components/Picker/PickerCommon.js.map +0 -1
  96. package/src/components/Picker/PickerCommon.ts +0 -81
  97. package/src/components/Picker/PickerInputContainer.js +0 -37
  98. package/src/components/Picker/PickerInputContainer.js.map +0 -1
  99. package/src/components/Picker/PickerInputContainer.tsx +0 -89
  100. package/src/components/Picker/dropdown/DropDownPicker.js +0 -67
  101. package/src/components/Picker/dropdown/DropDownPicker.js.map +0 -1
  102. package/src/components/Picker/dropdown/DropDownPicker.tsx +0 -153
  103. package/src/components/Picker/dropdown/MultiSelectPicker.js +0 -9
  104. package/src/components/Picker/dropdown/MultiSelectPicker.js.map +0 -1
  105. package/src/components/Picker/dropdown/MultiSelectPicker.tsx +0 -16
  106. package/src/components/Picker/dropdown/PickerItem.js +0 -9
  107. package/src/components/Picker/dropdown/PickerItem.js.map +0 -1
  108. package/src/components/Picker/dropdown/PickerItem.tsx +0 -19
  109. package/src/components/Picker/index.js +0 -18
  110. package/src/components/Picker/index.js.map +0 -1
  111. package/src/components/Picker/index.tsx +0 -27
@@ -1,89 +0,0 @@
1
- import React from "react";
2
- import { View, StyleSheet } from "react-native";
3
- import omit from "lodash.omit";
4
- import {
5
- extractSizeStyles,
6
- extractPositionStyles,
7
- extractFlexItemStyles,
8
- extractBorderAndMarginStyles,
9
- } from "../../utilities";
10
- import TextField from "../TextField";
11
- import Touchable from "../Touchable";
12
- import {
13
- PickerInputContainerProps as ExposedPickerInputContainerProps,
14
- PickerOption,
15
- } from "./PickerCommon";
16
-
17
- interface PickerInputContainerProps extends ExposedPickerInputContainerProps {
18
- selectedValue?: string | number | (string | number)[];
19
- options: PickerOption[];
20
- zIndex?: number;
21
- onPress?: () => void;
22
- testID?: string;
23
- }
24
-
25
- const PickerInputContainer: React.FC<
26
- React.PropsWithChildren<PickerInputContainerProps>
27
- > = ({
28
- options = [],
29
- onPress,
30
- Icon,
31
- style,
32
- selectedValue,
33
- disabled = false,
34
- zIndex,
35
- children,
36
- testID,
37
- ...rest
38
- }) => {
39
- const containerStyle = StyleSheet.flatten([
40
- extractSizeStyles(style),
41
- extractPositionStyles(style),
42
- extractFlexItemStyles(style),
43
- extractBorderAndMarginStyles(style).marginStyles,
44
- ]);
45
-
46
- const textFieldStyle = omit(
47
- StyleSheet.flatten(style),
48
- Object.keys(containerStyle)
49
- );
50
-
51
- let selectedLabel: string | number | undefined = "";
52
- if (Array.isArray(selectedValue)) {
53
- selectedLabel = selectedValue
54
- .map(
55
- (value) =>
56
- options.find((option) => option.value === value)?.label.toString() ||
57
- value
58
- )
59
- .join(", ");
60
- } else {
61
- selectedLabel =
62
- options
63
- .find((option) => option.value === selectedValue)
64
- ?.label.toString() || selectedValue;
65
- }
66
-
67
- return (
68
- <View testID={testID} style={[containerStyle, { zIndex }]}>
69
- <TextField
70
- Icon={Icon}
71
- numberOfLines={1}
72
- onChangeText={() => {}}
73
- value={selectedLabel?.toString()}
74
- editable={false}
75
- disabled={disabled}
76
- style={textFieldStyle}
77
- {...rest}
78
- />
79
- <Touchable
80
- style={StyleSheet.absoluteFillObject}
81
- disabled={disabled}
82
- onPress={onPress}
83
- />
84
- {children}
85
- </View>
86
- );
87
- };
88
-
89
- export default PickerInputContainer;
@@ -1,67 +0,0 @@
1
- import * as React from "react";
2
- import { Keyboard } from "react-native";
3
- import { extractStyles, flattenReactFragments, useDeepCompareMemo, } from "../../../utilities";
4
- import { normalizeToPickerOptions, } from "../PickerCommon";
5
- import PickerInputContainer from "../PickerInputContainer";
6
- import DropDownPickerComponent from "react-native-dropdown-picker";
7
- import { withTheme } from "../../../theming";
8
- import PickerItem from "./PickerItem";
9
- const DropDownPicker = ({ theme, options: optionsProp = [], onValueChange, Icon, placeholder, value, autoDismissKeyboard = true, selectedIconName = "Feather/check", selectedIconColor = theme.colors.strong, selectedIconSize = 20, dropDownBackgroundColor = theme.colors.background, dropDownBorderColor = theme.colors.divider, dropDownBorderWidth = 1, dropDownBorderRadius = 8, children: childrenProp, ...rest }) => {
10
- const [pickerVisible, setPickerVisible] = React.useState(false);
11
- const [internalValue, setInternalValue] = React.useState();
12
- const isMultiSelect = Array.isArray(value);
13
- const pickerItemProps = React.useMemo(() => {
14
- const children = flattenReactFragments(React.Children.toArray(childrenProp));
15
- let firstPickerItem; // Only the props of the first PickerItem are used, any others are ignored
16
- for (const child of children) {
17
- if (child.type === PickerItem) {
18
- firstPickerItem = child;
19
- break;
20
- }
21
- }
22
- return (firstPickerItem === null || firstPickerItem === void 0 ? void 0 : firstPickerItem.props) || {};
23
- }, [childrenProp]);
24
- const { viewStyles: pickerItemViewStyles, textStyles: pickerItemTextStyles } = extractStyles(pickerItemProps.style);
25
- const options = useDeepCompareMemo(() => normalizeToPickerOptions(optionsProp).map((option) => ({
26
- label: option.label.toString(),
27
- value: option.value,
28
- })), [optionsProp]);
29
- React.useEffect(() => {
30
- onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange((isMultiSelect ? internalValue !== null && internalValue !== void 0 ? internalValue : [] : internalValue !== null && internalValue !== void 0 ? internalValue : "") // cannot determine if multiselect or not on compile time
31
- );
32
- // onValueChange excluded to prevent running on every re-render when using an anoymous function, which is the common case
33
- // eslint-disable-next-line react-hooks/exhaustive-deps
34
- }, [internalValue]);
35
- React.useEffect(() => {
36
- if (pickerVisible && autoDismissKeyboard) {
37
- Keyboard.dismiss();
38
- }
39
- }, [pickerVisible, autoDismissKeyboard]);
40
- return (React.createElement(PickerInputContainer, { testID: "dropdown-picker", Icon: Icon, placeholder: placeholder, selectedValue: value, options: options, onPress: () => setPickerVisible(!pickerVisible), zIndex: pickerVisible ? 100 : undefined, ...rest },
41
- React.createElement(DropDownPickerComponent, { open: pickerVisible, setOpen: setPickerVisible, value: (value || null), setValue: setInternalValue, items: options, placeholder: placeholder, listMode: "SCROLLVIEW", multiple: isMultiSelect, style: { display: "none" }, listItemLabelStyle: [
42
- { color: theme.colors.strong, fontSize: 14 },
43
- pickerItemTextStyles,
44
- ], selectedItemLabelStyle: [
45
- pickerItemProps.selectedTextColor
46
- ? {
47
- color: pickerItemProps.selectedTextColor,
48
- }
49
- : {},
50
- pickerItemProps.selectedTextSize
51
- ? {
52
- fontSize: pickerItemProps.selectedTextSize,
53
- }
54
- : {},
55
- ], listItemContainerStyle: pickerItemViewStyles, selectedItemContainerStyle: pickerItemProps.selectedBackgroundColor
56
- ? {
57
- backgroundColor: pickerItemProps.selectedBackgroundColor,
58
- }
59
- : {}, dropDownContainerStyle: {
60
- borderColor: dropDownBorderColor,
61
- borderWidth: dropDownBorderWidth,
62
- borderRadius: dropDownBorderRadius,
63
- backgroundColor: dropDownBackgroundColor,
64
- }, TickIconComponent: () => (React.createElement(Icon, { name: selectedIconName, size: selectedIconSize, color: selectedIconColor })) })));
65
- };
66
- export default withTheme(DropDownPicker);
67
- //# sourceMappingURL=DropDownPicker.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"DropDownPicker.js","sourceRoot":"","sources":["DropDownPicker.tsx"],"names":[],"mappings":"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"}
@@ -1,153 +0,0 @@
1
- import * as React from "react";
2
- import { Keyboard } from "react-native";
3
- import {
4
- extractStyles,
5
- flattenReactFragments,
6
- useDeepCompareMemo,
7
- } from "../../../utilities";
8
- import {
9
- CommonDropDownPickerProps,
10
- MultiSelectPickerProps,
11
- SinglePickerProps,
12
- normalizeToPickerOptions,
13
- } from "../PickerCommon";
14
- import PickerInputContainer from "../PickerInputContainer";
15
- import DropDownPickerComponent from "react-native-dropdown-picker";
16
- import { withTheme } from "../../../theming";
17
- import PickerItem, { PickerItemProps } from "./PickerItem";
18
-
19
- const DropDownPicker: React.FC<
20
- React.PropsWithChildren<
21
- CommonDropDownPickerProps & (SinglePickerProps | MultiSelectPickerProps)
22
- >
23
- > = ({
24
- theme,
25
- options: optionsProp = [],
26
- onValueChange,
27
- Icon,
28
- placeholder,
29
- value,
30
- autoDismissKeyboard = true,
31
- selectedIconName = "Feather/check",
32
- selectedIconColor = theme.colors.strong,
33
- selectedIconSize = 20,
34
- dropDownBackgroundColor = theme.colors.background,
35
- dropDownBorderColor = theme.colors.divider,
36
- dropDownBorderWidth = 1,
37
- dropDownBorderRadius = 8,
38
- children: childrenProp,
39
- ...rest
40
- }) => {
41
- const [pickerVisible, setPickerVisible] = React.useState(false);
42
- const [internalValue, setInternalValue] = React.useState<
43
- string | number | (string | number)[]
44
- >();
45
-
46
- const isMultiSelect = Array.isArray(value);
47
-
48
- const pickerItemProps: PickerItemProps = React.useMemo(() => {
49
- const children = flattenReactFragments(
50
- React.Children.toArray(childrenProp) as React.ReactElement[]
51
- );
52
-
53
- let firstPickerItem; // Only the props of the first PickerItem are used, any others are ignored
54
- for (const child of children) {
55
- if (child.type === PickerItem) {
56
- firstPickerItem = child;
57
- break;
58
- }
59
- }
60
-
61
- return firstPickerItem?.props || {};
62
- }, [childrenProp]);
63
-
64
- const { viewStyles: pickerItemViewStyles, textStyles: pickerItemTextStyles } =
65
- extractStyles(pickerItemProps.style);
66
-
67
- const options = useDeepCompareMemo(
68
- () =>
69
- normalizeToPickerOptions(optionsProp).map((option) => ({
70
- label: option.label.toString(),
71
- value: option.value,
72
- })),
73
- [optionsProp]
74
- );
75
-
76
- React.useEffect(() => {
77
- onValueChange?.(
78
- (isMultiSelect ? internalValue ?? [] : internalValue ?? "") as any // cannot determine if multiselect or not on compile time
79
- );
80
- // onValueChange excluded to prevent running on every re-render when using an anoymous function, which is the common case
81
- // eslint-disable-next-line react-hooks/exhaustive-deps
82
- }, [internalValue]);
83
-
84
- React.useEffect(() => {
85
- if (pickerVisible && autoDismissKeyboard) {
86
- Keyboard.dismiss();
87
- }
88
- }, [pickerVisible, autoDismissKeyboard]);
89
-
90
- return (
91
- <PickerInputContainer
92
- testID="dropdown-picker"
93
- Icon={Icon}
94
- placeholder={placeholder}
95
- selectedValue={value}
96
- options={options}
97
- onPress={() => setPickerVisible(!pickerVisible)}
98
- zIndex={pickerVisible ? 100 : undefined} // Guarantees drop down is rendered above all sibling components
99
- {...rest}
100
- >
101
- <DropDownPickerComponent
102
- open={pickerVisible}
103
- setOpen={setPickerVisible}
104
- value={(value || null) as any}
105
- setValue={setInternalValue}
106
- items={options}
107
- placeholder={placeholder}
108
- listMode="SCROLLVIEW"
109
- multiple={isMultiSelect}
110
- style={{ display: "none" }} // To not render the default input container
111
- listItemLabelStyle={[
112
- { color: theme.colors.strong, fontSize: 14 },
113
- pickerItemTextStyles,
114
- ]}
115
- selectedItemLabelStyle={[
116
- pickerItemProps.selectedTextColor
117
- ? {
118
- color: pickerItemProps.selectedTextColor,
119
- }
120
- : {},
121
- pickerItemProps.selectedTextSize
122
- ? {
123
- fontSize: pickerItemProps.selectedTextSize,
124
- }
125
- : {},
126
- ]}
127
- listItemContainerStyle={pickerItemViewStyles}
128
- selectedItemContainerStyle={
129
- pickerItemProps.selectedBackgroundColor
130
- ? {
131
- backgroundColor: pickerItemProps.selectedBackgroundColor,
132
- }
133
- : {}
134
- }
135
- dropDownContainerStyle={{
136
- borderColor: dropDownBorderColor,
137
- borderWidth: dropDownBorderWidth,
138
- borderRadius: dropDownBorderRadius,
139
- backgroundColor: dropDownBackgroundColor,
140
- }}
141
- TickIconComponent={() => (
142
- <Icon
143
- name={selectedIconName}
144
- size={selectedIconSize}
145
- color={selectedIconColor}
146
- />
147
- )}
148
- />
149
- </PickerInputContainer>
150
- );
151
- };
152
-
153
- export default withTheme(DropDownPicker);
@@ -1,9 +0,0 @@
1
- import * as React from "react";
2
- import DropDownPicker from "./DropDownPicker";
3
- import { withTheme } from "../../../theming";
4
- const MultiSelectPicker = ({ value, ...rest }) => {
5
- //@ts-ignore Ignore theme type issues
6
- return React.createElement(DropDownPicker, { value: value || [], ...rest });
7
- };
8
- export default withTheme(MultiSelectPicker);
9
- //# sourceMappingURL=MultiSelectPicker.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"MultiSelectPicker.js","sourceRoot":"","sources":["MultiSelectPicker.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,OAAO,cAAc,MAAM,kBAAkB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAE7C,MAAM,iBAAiB,GAEnB,CAAC,EAAE,KAAK,EAAE,GAAG,IAAI,EAAE,EAAE,EAAE;IACzB,qCAAqC;IACrC,OAAO,oBAAC,cAAc,IAAC,KAAK,EAAE,KAAK,IAAI,EAAE,KAAM,IAAI,GAAI,CAAC;AAC1D,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC,iBAAiB,CAAC,CAAC"}
@@ -1,16 +0,0 @@
1
- import * as React from "react";
2
- import {
3
- CommonDropDownPickerProps,
4
- MultiSelectPickerProps,
5
- } from "../PickerCommon";
6
- import DropDownPicker from "./DropDownPicker";
7
- import { withTheme } from "../../../theming";
8
-
9
- const MultiSelectPicker: React.FC<
10
- React.PropsWithChildren<CommonDropDownPickerProps & MultiSelectPickerProps>
11
- > = ({ value, ...rest }) => {
12
- //@ts-ignore Ignore theme type issues
13
- return <DropDownPicker value={value || []} {...rest} />;
14
- };
15
-
16
- export default withTheme(MultiSelectPicker);
@@ -1,9 +0,0 @@
1
- /**
2
- * Renders nothing, only serves as a container for the props
3
- * Prop values are used by the DropDownPicker
4
- */
5
- export const PickerItem = () => {
6
- return null;
7
- };
8
- export default PickerItem;
9
- //# sourceMappingURL=PickerItem.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"PickerItem.js","sourceRoot":"","sources":["PickerItem.tsx"],"names":[],"mappings":"AAUA;;;GAGG;AACH,MAAM,CAAC,MAAM,UAAU,GAA8B,GAAG,EAAE;IACxD,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAEF,eAAe,UAAU,CAAC"}
@@ -1,19 +0,0 @@
1
- import React from "react";
2
- import { StyleProp, ViewStyle, TextStyle } from "react-native";
3
-
4
- export interface PickerItemProps {
5
- selectedTextSize?: number;
6
- selectedTextColor?: string;
7
- selectedBackgroundColor?: string;
8
- style?: StyleProp<ViewStyle | TextStyle>;
9
- }
10
-
11
- /**
12
- * Renders nothing, only serves as a container for the props
13
- * Prop values are used by the DropDownPicker
14
- */
15
- export const PickerItem: React.FC<PickerItemProps> = () => {
16
- return null;
17
- };
18
-
19
- export default PickerItem;
@@ -1,18 +0,0 @@
1
- import React from "react";
2
- import NativePicker from "./NativePicker";
3
- import DropDownPicker from "./dropdown/DropDownPicker";
4
- import { withTheme } from "../../theming";
5
- const SinglePicker = ({ mode = "native", ...rest }) => {
6
- switch (mode) {
7
- case "native":
8
- //@ts-ignore Ignore theme type issues
9
- return React.createElement(NativePicker, { ...rest });
10
- case "dropdown":
11
- //@ts-ignore
12
- return React.createElement(DropDownPicker, { ...rest });
13
- }
14
- };
15
- export const Picker = withTheme(SinglePicker);
16
- export { default as MultiSelectPicker } from "./dropdown/MultiSelectPicker";
17
- export { default as PickerItem } from "./dropdown/PickerItem";
18
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,cAAc,MAAM,2BAA2B,CAAC;AACvD,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAM1C,MAAM,YAAY,GAAmD,CAAC,EACpE,IAAI,GAAG,QAAQ,EACf,GAAG,IAAI,EACR,EAAE,EAAE;IACH,QAAQ,IAAI,EAAE;QACZ,KAAK,QAAQ;YACX,qCAAqC;YACrC,OAAO,oBAAC,YAAY,OAAK,IAAI,GAAI,CAAC;QACpC,KAAK,UAAU;YACb,YAAY;YACZ,OAAO,oBAAC,cAAc,OAAK,IAAI,GAAI,CAAC;KACvC;AACH,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAG,SAAS,CAAC,YAAY,CAAC,CAAC;AAC9C,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,8BAA8B,CAAC;AAC5E,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,uBAAuB,CAAC"}
@@ -1,27 +0,0 @@
1
- import React from "react";
2
- import { CommonDropDownPickerProps, SinglePickerProps } from "./PickerCommon";
3
- import NativePicker from "./NativePicker";
4
- import DropDownPicker from "./dropdown/DropDownPicker";
5
- import { withTheme } from "../../theming";
6
-
7
- interface PickerProps extends CommonDropDownPickerProps, SinglePickerProps {
8
- mode?: "native" | "dropdown";
9
- }
10
-
11
- const SinglePicker: React.FC<React.PropsWithChildren<PickerProps>> = ({
12
- mode = "native",
13
- ...rest
14
- }) => {
15
- switch (mode) {
16
- case "native":
17
- //@ts-ignore Ignore theme type issues
18
- return <NativePicker {...rest} />;
19
- case "dropdown":
20
- //@ts-ignore
21
- return <DropDownPicker {...rest} />;
22
- }
23
- };
24
-
25
- export const Picker = withTheme(SinglePicker);
26
- export { default as MultiSelectPicker } from "./dropdown/MultiSelectPicker";
27
- export { default as PickerItem } from "./dropdown/PickerItem";