@draftbit/core 46.4.4-c18fe1.2 → 46.4.4-c96c31.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.
- package/lib/commonjs/Provider.js +9 -0
- package/lib/commonjs/components/Accordion/AccordionGroup.js +14 -0
- package/lib/commonjs/components/Accordion/AccordionItem.js +13 -0
- package/lib/commonjs/components/Accordion/index.js +3 -0
- package/lib/commonjs/components/ActionSheet/ActionSheet.js +9 -0
- package/lib/commonjs/components/ActionSheet/ActionSheetCancel.js +5 -0
- package/lib/commonjs/components/ActionSheet/ActionSheetItem.js +7 -0
- package/lib/commonjs/components/ActionSheet/index.js +4 -0
- package/lib/commonjs/components/AnimatedCircularProgress.js +26 -1
- package/lib/commonjs/components/AspectRatio.js +10 -0
- package/lib/commonjs/components/AvatarEdit.js +12 -0
- package/lib/commonjs/components/Banner.js +23 -9
- package/lib/commonjs/components/Button.js +19 -2
- package/lib/commonjs/components/Card.js +14 -0
- package/lib/commonjs/components/CardBlock.js +15 -0
- package/lib/commonjs/components/CardContainer.js +32 -4
- package/lib/commonjs/components/CardContainerRating.js +34 -6
- package/lib/commonjs/components/CardContainerShortImage.js +28 -4
- package/lib/commonjs/components/CardInline.js +14 -1
- package/lib/commonjs/components/Carousel.js +23 -5
- package/lib/commonjs/components/Checkbox/Checkbox.js +18 -3
- package/lib/commonjs/components/Checkbox/CheckboxGroup.js +11 -0
- package/lib/commonjs/components/Checkbox/CheckboxGroupRow.js +43 -5
- package/lib/commonjs/components/Checkbox/CheckboxRow.js +47 -8
- package/lib/commonjs/components/Checkbox/context.js +5 -0
- package/lib/commonjs/components/Checkbox/index.js +4 -0
- package/lib/commonjs/components/CircleImage.js +10 -15
- package/lib/commonjs/components/CircularProgress.js +26 -8
- package/lib/commonjs/components/Config.js +13 -5
- package/lib/commonjs/components/Container.js +11 -0
- package/lib/commonjs/components/DatePicker/DatePicker.js +65 -23
- package/lib/commonjs/components/DatePicker/DatePickerComponent.js +7 -0
- package/lib/commonjs/components/DatePicker/DatePickerComponent.web.js +10 -0
- package/lib/commonjs/components/DeprecatedButton.js +23 -0
- package/lib/commonjs/components/DeprecatedCardWrapper.js +27 -1
- package/lib/commonjs/components/DeprecatedFAB.js +26 -0
- package/lib/commonjs/components/Divider.js +9 -0
- package/lib/commonjs/components/Elevation.js +25 -2
- package/lib/commonjs/components/FAB.js +10 -0
- package/lib/commonjs/components/FieldSearchBarFull.js +18 -0
- package/lib/commonjs/components/FormRow.js +10 -0
- package/lib/commonjs/components/Header.js +13 -0
- package/lib/commonjs/components/HeaderLarge.js +9 -0
- package/lib/commonjs/components/HeaderMedium.js +9 -0
- package/lib/commonjs/components/HeaderOverline.js +9 -0
- package/lib/commonjs/components/IconButton.js +10 -0
- package/lib/commonjs/components/Image.js +17 -0
- package/lib/commonjs/components/Layout.js +12 -2
- package/lib/commonjs/components/NumberInput.js +21 -8
- package/lib/commonjs/components/Picker/Picker.js +42 -9
- package/lib/commonjs/components/Picker/PickerComponent.android.js +43 -7
- package/lib/commonjs/components/Picker/PickerComponent.ios.js +27 -8
- package/lib/commonjs/components/Picker/PickerComponent.web.js +43 -7
- package/lib/commonjs/components/Portal/Portal.js +14 -4
- package/lib/commonjs/components/Portal/PortalConsumer.js +15 -5
- package/lib/commonjs/components/Portal/PortalHost.js +31 -4
- package/lib/commonjs/components/Portal/PortalManager.js +19 -7
- package/lib/commonjs/components/ProgressBar.js +45 -9
- package/lib/commonjs/components/ProgressCircle.js +10 -0
- package/lib/commonjs/components/ProgressIndicator.js +9 -0
- package/lib/commonjs/components/RadioButton/RadioButton.js +14 -1
- package/lib/commonjs/components/RadioButton/RadioButtonFieldGroup.js +10 -0
- package/lib/commonjs/components/RadioButton/RadioButtonGroup.js +14 -0
- package/lib/commonjs/components/RadioButton/RadioButtonRow.js +44 -6
- package/lib/commonjs/components/RadioButton/context.js +5 -0
- package/lib/commonjs/components/RadioButton/index.js +5 -0
- package/lib/commonjs/components/Row.js +11 -0
- package/lib/commonjs/components/RowBodyIcon.js +10 -0
- package/lib/commonjs/components/RowHeadlineImageCaption.js +11 -2
- package/lib/commonjs/components/RowHeadlineImageIcon.js +10 -0
- package/lib/commonjs/components/SVG.js +9 -0
- package/lib/commonjs/components/ScreenContainer.js +36 -4
- package/lib/commonjs/components/Slider.js +21 -0
- package/lib/commonjs/components/StarRating.js +10 -0
- package/lib/commonjs/components/StepIndicator.js +71 -19
- package/lib/commonjs/components/Stepper.js +28 -8
- package/lib/commonjs/components/Surface.js +14 -0
- package/lib/commonjs/components/Swiper/Swiper.js +8 -0
- package/lib/commonjs/components/Swiper/SwiperItem.js +6 -0
- package/lib/commonjs/components/Swiper/index.js +3 -0
- package/lib/commonjs/components/Switch.js +18 -5
- package/lib/commonjs/components/Text.js +53 -8
- package/lib/commonjs/components/TextField.js +118 -35
- package/lib/commonjs/components/ToggleButton.js +14 -0
- package/lib/commonjs/components/Touchable.js +5 -0
- package/lib/commonjs/components/Touchable.web.js +2 -0
- package/lib/commonjs/components/Typography.js +5 -0
- package/lib/commonjs/components/useAuthState.js +9 -0
- package/lib/commonjs/constants.js +5 -1
- package/lib/commonjs/hooks.js +7 -4
- package/lib/commonjs/index.js +52 -7
- package/lib/commonjs/interfaces/Icon.js +5 -3
- package/lib/commonjs/mappings/Accordion.js +2 -0
- package/lib/commonjs/mappings/AccordionItem.js +2 -0
- package/lib/commonjs/mappings/ActionSheet.js +2 -0
- package/lib/commonjs/mappings/ActionSheetCancel.js +2 -0
- package/lib/commonjs/mappings/ActionSheetItem.js +2 -0
- package/lib/commonjs/mappings/ActivityIndicator.js +2 -0
- package/lib/commonjs/mappings/AudioPlayer.js +2 -0
- package/lib/commonjs/mappings/AvatarEdit.js +2 -0
- package/lib/commonjs/mappings/Banner.js +2 -0
- package/lib/commonjs/mappings/BlurView.js +2 -0
- package/lib/commonjs/mappings/Button.js +5 -6
- package/lib/commonjs/mappings/Card.js +4 -3
- package/lib/commonjs/mappings/CardBlock.js +5 -6
- package/lib/commonjs/mappings/CardContainer.js +7 -5
- package/lib/commonjs/mappings/CardContainerRating.js +4 -4
- package/lib/commonjs/mappings/CardContainerShortImage.js +2 -0
- package/lib/commonjs/mappings/CardInline.js +2 -0
- package/lib/commonjs/mappings/Carousel.js +2 -0
- package/lib/commonjs/mappings/Checkbox.js +2 -0
- package/lib/commonjs/mappings/CheckboxGroup.js +2 -0
- package/lib/commonjs/mappings/CheckboxRow.js +2 -0
- package/lib/commonjs/mappings/CircleImage.js +2 -0
- package/lib/commonjs/mappings/Container.js +2 -0
- package/lib/commonjs/mappings/CustomCode.js +2 -0
- package/lib/commonjs/mappings/DatePicker.js +17 -4
- package/lib/commonjs/mappings/Divider.js +2 -0
- package/lib/commonjs/mappings/FAB.js +2 -0
- package/lib/commonjs/mappings/Fetch.js +2 -0
- package/lib/commonjs/mappings/FieldSearchBarFull.js +3 -2
- package/lib/commonjs/mappings/FlashList.js +2 -0
- package/lib/commonjs/mappings/FlatList.js +2 -0
- package/lib/commonjs/mappings/HeaderLarge.js +2 -0
- package/lib/commonjs/mappings/HeaderMedium.js +2 -0
- package/lib/commonjs/mappings/HeaderOverline.js +2 -0
- package/lib/commonjs/mappings/Icon.js +3 -2
- package/lib/commonjs/mappings/IconButton.js +2 -0
- package/lib/commonjs/mappings/Image.js +2 -0
- package/lib/commonjs/mappings/ImageBackground.js +2 -0
- package/lib/commonjs/mappings/KeyboardAvoidingView.js +2 -0
- package/lib/commonjs/mappings/KeyboardAwareScrollView.js +2 -0
- package/lib/commonjs/mappings/Layout.js +2 -0
- package/lib/commonjs/mappings/LinearGradient.js +2 -0
- package/lib/commonjs/mappings/MapCallout.js +2 -0
- package/lib/commonjs/mappings/MapMarker.js +2 -0
- package/lib/commonjs/mappings/MapView.js +2 -0
- package/lib/commonjs/mappings/Modal.js +2 -0
- package/lib/commonjs/mappings/NumberInput.js +4 -4
- package/lib/commonjs/mappings/Picker.js +4 -4
- package/lib/commonjs/mappings/ProgressBar.js +2 -0
- package/lib/commonjs/mappings/ProgressCircle.js +2 -0
- package/lib/commonjs/mappings/ProgressIndicator.js +2 -0
- package/lib/commonjs/mappings/RadioButton.js +2 -0
- package/lib/commonjs/mappings/RadioButtonGroup.js +2 -0
- package/lib/commonjs/mappings/RadioButtonRow.js +2 -0
- package/lib/commonjs/mappings/RowBodyIcon.js +2 -0
- package/lib/commonjs/mappings/RowHeadlineImageCaption.js +2 -0
- package/lib/commonjs/mappings/RowHeadlineImageIcon.js +8 -12
- package/lib/commonjs/mappings/SVG.js +2 -0
- package/lib/commonjs/mappings/SafeAreaView.js +2 -0
- package/lib/commonjs/mappings/ScrollView.js +2 -0
- package/lib/commonjs/mappings/Slider.js +2 -0
- package/lib/commonjs/mappings/StarRating.js +9 -3
- package/lib/commonjs/mappings/Stepper.js +3 -1
- package/lib/commonjs/mappings/Surface.js +2 -0
- package/lib/commonjs/mappings/Swiper.js +2 -0
- package/lib/commonjs/mappings/SwiperItem.js +2 -0
- package/lib/commonjs/mappings/Switch.js +2 -0
- package/lib/commonjs/mappings/Text.js +5 -5
- package/lib/commonjs/mappings/TextArea.js +3 -2
- package/lib/commonjs/mappings/TextField.js +8 -7
- package/lib/commonjs/mappings/TextInput.js +3 -2
- package/lib/commonjs/mappings/ToggleButton.js +2 -0
- package/lib/commonjs/mappings/Touchable.js +2 -0
- package/lib/commonjs/mappings/Video.js +2 -0
- package/lib/commonjs/mappings/View.js +2 -0
- package/lib/commonjs/mappings/WebView.js +2 -0
- package/lib/commonjs/styles/DarkTheme.js +6 -5
- package/lib/commonjs/styles/DefaultTheme.js +17 -26
- package/lib/commonjs/styles/fonts.js +5 -3
- package/lib/commonjs/styles/overlay.js +14 -5
- package/lib/commonjs/styles/shadow.js +9 -0
- package/lib/commonjs/theming.js +4 -0
- package/lib/commonjs/utilities.js +14 -2
- package/lib/module/Provider.js +1 -0
- package/lib/module/components/Accordion/AccordionGroup.js +4 -0
- package/lib/module/components/Accordion/AccordionItem.js +28 -4
- package/lib/module/components/ActionSheet/ActionSheet.js +2 -0
- package/lib/module/components/ActionSheet/ActionSheetCancel.js +2 -0
- package/lib/module/components/ActionSheet/ActionSheetItem.js +2 -0
- package/lib/module/components/AnimatedCircularProgress.js +6 -0
- package/lib/module/components/AspectRatio.js +6 -0
- package/lib/module/components/AvatarEdit.js +3 -0
- package/lib/module/components/Banner.js +33 -12
- package/lib/module/components/Button.js +41 -12
- package/lib/module/components/Card.js +2 -0
- package/lib/module/components/CardBlock.js +20 -4
- package/lib/module/components/CardContainer.js +7 -0
- package/lib/module/components/CardContainerRating.js +8 -2
- package/lib/module/components/CardContainerShortImage.js +3 -0
- package/lib/module/components/CardInline.js +2 -0
- package/lib/module/components/Carousel.js +41 -11
- package/lib/module/components/Checkbox/Checkbox.js +9 -3
- package/lib/module/components/Checkbox/CheckboxGroup.js +5 -0
- package/lib/module/components/Checkbox/CheckboxGroupRow.js +31 -5
- package/lib/module/components/Checkbox/CheckboxRow.js +34 -8
- package/lib/module/components/Checkbox/context.js +3 -1
- package/lib/module/components/CircleImage.js +3 -0
- package/lib/module/components/CircularProgress.js +22 -8
- package/lib/module/components/Config.js +11 -5
- package/lib/module/components/Container.js +3 -0
- package/lib/module/components/DatePicker/DatePicker.js +73 -30
- package/lib/module/components/DatePicker/DatePickerComponent.js +2 -0
- package/lib/module/components/DatePicker/DatePickerComponent.web.js +2 -0
- package/lib/module/components/DeprecatedButton.js +9 -0
- package/lib/module/components/DeprecatedCardWrapper.js +6 -0
- package/lib/module/components/DeprecatedFAB.js +34 -3
- package/lib/module/components/Divider.js +3 -0
- package/lib/module/components/Elevation.js +3 -0
- package/lib/module/components/FAB.js +3 -0
- package/lib/module/components/FieldSearchBarFull.js +9 -0
- package/lib/module/components/FormRow.js +1 -0
- package/lib/module/components/Header.js +2 -0
- package/lib/module/components/HeaderLarge.js +2 -0
- package/lib/module/components/HeaderMedium.js +2 -0
- package/lib/module/components/HeaderOverline.js +2 -0
- package/lib/module/components/IconButton.js +3 -0
- package/lib/module/components/Image.js +27 -2
- package/lib/module/components/Layout.js +42 -21
- package/lib/module/components/NumberInput.js +16 -8
- package/lib/module/components/Picker/Picker.js +34 -10
- package/lib/module/components/Picker/PickerComponent.android.js +10 -6
- package/lib/module/components/Picker/PickerComponent.ios.js +11 -8
- package/lib/module/components/Picker/PickerComponent.web.js +10 -6
- package/lib/module/components/Portal/Portal.js +6 -4
- package/lib/module/components/Portal/PortalConsumer.js +14 -9
- package/lib/module/components/Portal/PortalHost.js +44 -15
- package/lib/module/components/Portal/PortalManager.js +14 -7
- package/lib/module/components/ProgressBar.js +17 -5
- package/lib/module/components/ProgressCircle.js +2 -0
- package/lib/module/components/ProgressIndicator.js +2 -0
- package/lib/module/components/RadioButton/RadioButton.js +20 -2
- package/lib/module/components/RadioButton/RadioButtonFieldGroup.js +3 -0
- package/lib/module/components/RadioButton/RadioButtonGroup.js +23 -2
- package/lib/module/components/RadioButton/RadioButtonRow.js +32 -6
- package/lib/module/components/RadioButton/context.js +3 -1
- package/lib/module/components/Row.js +2 -0
- package/lib/module/components/RowBodyIcon.js +2 -0
- package/lib/module/components/RowHeadlineImageCaption.js +3 -2
- package/lib/module/components/RowHeadlineImageIcon.js +2 -0
- package/lib/module/components/SVG.js +2 -0
- package/lib/module/components/ScreenContainer.js +6 -0
- package/lib/module/components/Slider.js +10 -0
- package/lib/module/components/StarRating.js +3 -0
- package/lib/module/components/StepIndicator.js +29 -5
- package/lib/module/components/Stepper.js +18 -10
- package/lib/module/components/Surface.js +20 -1
- package/lib/module/components/Swiper/Swiper.js +4 -0
- package/lib/module/components/Swiper/SwiperItem.js +2 -0
- package/lib/module/components/Switch.js +27 -12
- package/lib/module/components/Text.js +10 -3
- package/lib/module/components/TextField.js +105 -35
- package/lib/module/components/ToggleButton.js +5 -0
- package/lib/module/components/Touchable.js +1 -0
- package/lib/module/components/useAuthState.js +4 -0
- package/lib/module/constants.js +1 -2
- package/lib/module/hooks.js +2 -4
- package/lib/module/index.js +2 -5
- package/lib/module/interfaces/Icon.js +1 -2
- package/lib/module/mappings/Button.js +3 -6
- package/lib/module/mappings/Card.js +2 -3
- package/lib/module/mappings/CardBlock.js +3 -6
- package/lib/module/mappings/CardContainer.js +5 -5
- package/lib/module/mappings/CardContainerRating.js +2 -4
- package/lib/module/mappings/DatePicker.js +16 -5
- package/lib/module/mappings/Fetch.js +1 -0
- package/lib/module/mappings/FieldSearchBarFull.js +5 -3
- package/lib/module/mappings/Icon.js +1 -2
- package/lib/module/mappings/NumberInput.js +2 -4
- package/lib/module/mappings/Picker.js +2 -4
- package/lib/module/mappings/RowHeadlineImageIcon.js +6 -12
- package/lib/module/mappings/StarRating.js +8 -3
- package/lib/module/mappings/Stepper.js +2 -2
- package/lib/module/mappings/Text.js +3 -5
- package/lib/module/mappings/TextArea.js +1 -2
- package/lib/module/mappings/TextField.js +6 -7
- package/lib/module/mappings/TextInput.js +1 -2
- package/lib/module/styles/DarkTheme.js +2 -4
- package/lib/module/styles/DefaultTheme.js +13 -26
- package/lib/module/styles/fonts.js +1 -2
- package/lib/module/styles/overlay.js +10 -4
- package/lib/module/styles/shadow.js +6 -0
- package/lib/module/utilities.js +5 -2
- package/lib/typescript/src/components/DatePicker/DatePicker.d.ts +4 -0
- package/lib/typescript/src/components/Stepper.d.ts +1 -2
- package/lib/typescript/src/index.d.ts +0 -1
- package/lib/typescript/src/mappings/DatePicker.d.ts +42 -0
- package/package.json +3 -5
- package/src/components/Carousel.js +2 -2
- package/src/components/Carousel.tsx +2 -2
- package/src/components/DatePicker/DatePicker.js +14 -8
- package/src/components/DatePicker/DatePicker.tsx +23 -7
- package/src/components/Picker/Picker.js +1 -1
- package/src/components/Picker/Picker.tsx +2 -2
- package/src/components/Stepper.js +6 -3
- package/src/components/Stepper.tsx +6 -6
- package/src/index.js +0 -1
- package/src/index.tsx +0 -1
- package/src/mappings/DatePicker.js +21 -1
- package/src/mappings/DatePicker.ts +23 -0
- package/src/mappings/Stepper.js +5 -2
- package/src/mappings/Stepper.ts +5 -1
- package/lib/commonjs/components/BottomSheet/BottomSheet.native.js +0 -58
- package/lib/commonjs/components/BottomSheet/BottomSheet.web.js +0 -83
- package/lib/commonjs/components/BottomSheet/index.js +0 -13
- package/lib/commonjs/components/BottomSheet/types.js +0 -5
- package/lib/commonjs/mappings/BottomSheet.js +0 -20
- package/lib/module/components/BottomSheet/BottomSheet.native.js +0 -49
- package/lib/module/components/BottomSheet/BottomSheet.web.js +0 -75
- package/lib/module/components/BottomSheet/index.js +0 -2
- package/lib/module/components/BottomSheet/types.js +0 -1
- package/lib/module/mappings/BottomSheet.js +0 -13
- package/lib/typescript/src/components/BottomSheet/BottomSheet.native.d.ts +0 -4
- package/lib/typescript/src/components/BottomSheet/BottomSheet.web.d.ts +0 -4
- package/lib/typescript/src/components/BottomSheet/index.d.ts +0 -1
- package/lib/typescript/src/components/BottomSheet/types.d.ts +0 -8
- package/lib/typescript/src/mappings/BottomSheet.d.ts +0 -19
- package/src/components/BottomSheet/BottomSheet.native.js +0 -37
- package/src/components/BottomSheet/BottomSheet.native.tsx +0 -60
- package/src/components/BottomSheet/BottomSheet.web.js +0 -56
- package/src/components/BottomSheet/BottomSheet.web.tsx +0 -90
- package/src/components/BottomSheet/index.js +0 -2
- package/src/components/BottomSheet/index.tsx +0 -2
- package/src/components/BottomSheet/types.js +0 -1
- package/src/components/BottomSheet/types.tsx +0 -8
- package/src/mappings/BottomSheet.js +0 -20
- package/src/mappings/BottomSheet.ts +0 -25
|
@@ -8,16 +8,19 @@ import Portal from "../Portal/Portal";
|
|
|
8
8
|
import Button from "../DeprecatedButton";
|
|
9
9
|
import Touchable from "../Touchable";
|
|
10
10
|
import { extractStyles, extractBorderAndMarginStyles, borderStyleNames, marginStyleNames } from "../../utilities";
|
|
11
|
+
|
|
11
12
|
function normalizeOptions(options) {
|
|
12
13
|
if (options.length === 0) {
|
|
13
14
|
return [];
|
|
14
15
|
}
|
|
16
|
+
|
|
15
17
|
if (typeof options[0] === ("string" || "number")) {
|
|
16
18
|
return options.map(option => ({
|
|
17
19
|
label: String(option),
|
|
18
20
|
value: String(option)
|
|
19
21
|
}));
|
|
20
22
|
}
|
|
23
|
+
|
|
21
24
|
if (isObject(options[0]) && options[0].value !== null && options[0].label !== null) {
|
|
22
25
|
return options.map(option => {
|
|
23
26
|
return {
|
|
@@ -26,8 +29,10 @@ function normalizeOptions(options) {
|
|
|
26
29
|
};
|
|
27
30
|
});
|
|
28
31
|
}
|
|
32
|
+
|
|
29
33
|
throw new Error('Picker options must be either an array of strings or array of { "label": string; "value": string; } objects.');
|
|
30
34
|
}
|
|
35
|
+
|
|
31
36
|
const {
|
|
32
37
|
width: deviceWidth,
|
|
33
38
|
height: deviceHeight
|
|
@@ -36,8 +41,8 @@ const isIos = Platform.OS === "ios";
|
|
|
36
41
|
const unstyledColor = "rgba(165, 173, 183, 1)";
|
|
37
42
|
const disabledColor = "rgb(240, 240, 240)";
|
|
38
43
|
const errorColor = "rgba(255, 69, 100, 1)";
|
|
44
|
+
|
|
39
45
|
const Picker = _ref => {
|
|
40
|
-
var _find;
|
|
41
46
|
let {
|
|
42
47
|
error,
|
|
43
48
|
options = [],
|
|
@@ -59,12 +64,17 @@ const Picker = _ref => {
|
|
|
59
64
|
rightIconName,
|
|
60
65
|
type = "solid"
|
|
61
66
|
} = _ref;
|
|
67
|
+
|
|
68
|
+
var _a, _b;
|
|
69
|
+
|
|
62
70
|
const androidPickerRef = React.useRef(undefined);
|
|
63
71
|
const [internalValue, setInternalValue] = React.useState(value || defaultValue);
|
|
64
72
|
const [pickerVisible, setPickerVisible] = React.useState(false);
|
|
73
|
+
|
|
65
74
|
const togglePickerVisible = () => {
|
|
66
75
|
setPickerVisible(!pickerVisible);
|
|
67
76
|
};
|
|
77
|
+
|
|
68
78
|
React.useEffect(() => {
|
|
69
79
|
if (value != null) {
|
|
70
80
|
setInternalValue(value);
|
|
@@ -76,9 +86,10 @@ const Picker = _ref => {
|
|
|
76
86
|
}
|
|
77
87
|
}, [defaultValue]);
|
|
78
88
|
React.useEffect(() => {
|
|
89
|
+
var _a;
|
|
90
|
+
|
|
79
91
|
if (pickerVisible && androidPickerRef.current) {
|
|
80
|
-
|
|
81
|
-
androidPickerRef === null || androidPickerRef === void 0 ? void 0 : (_androidPickerRef$cur = androidPickerRef.current) === null || _androidPickerRef$cur === void 0 ? void 0 : _androidPickerRef$cur.focus();
|
|
92
|
+
(_a = androidPickerRef === null || androidPickerRef === void 0 ? void 0 : androidPickerRef.current) === null || _a === void 0 ? void 0 : _a.focus();
|
|
82
93
|
}
|
|
83
94
|
}, [pickerVisible, androidPickerRef]);
|
|
84
95
|
const normalizedOptions = normalizeOptions(options);
|
|
@@ -99,9 +110,7 @@ const Picker = _ref => {
|
|
|
99
110
|
borderStyles: extractedBorderStyles,
|
|
100
111
|
marginStyles: extractedMarginStyles
|
|
101
112
|
} = extractBorderAndMarginStyles(viewStyles, additionalBorderStyles, additionalMarginStyles);
|
|
102
|
-
const borderStyles = {
|
|
103
|
-
...{
|
|
104
|
-
...(type === "solid" ? {
|
|
113
|
+
const borderStyles = { ...{ ...(type === "solid" ? {
|
|
105
114
|
borderTopLeftRadius: 5,
|
|
106
115
|
borderTopRightRadius: 5,
|
|
107
116
|
borderBottomRightRadius: 5,
|
|
@@ -128,7 +137,7 @@ const Picker = _ref => {
|
|
|
128
137
|
...extractedMarginStyles
|
|
129
138
|
};
|
|
130
139
|
const stylesWithoutBordersAndMargins = omit(viewStyles, [...borderStyleNames, ...marginStyleNames, ...additionalBorderStyles, ...additionalMarginStyles]);
|
|
131
|
-
const selectedLabel = internalValue && (((
|
|
140
|
+
const selectedLabel = internalValue && ((_b = (_a = pickerOptions.find(option => option.value === internalValue)) === null || _a === void 0 ? void 0 : _a.label) !== null && _b !== void 0 ? _b : internalValue);
|
|
132
141
|
const labelText = label ? /*#__PURE__*/React.createElement(Text, {
|
|
133
142
|
style: {
|
|
134
143
|
textAlign: textStyles.textAlign,
|
|
@@ -157,15 +166,19 @@ const Picker = _ref => {
|
|
|
157
166
|
}
|
|
158
167
|
}) : null;
|
|
159
168
|
const textAlign = textStyles === null || textStyles === void 0 ? void 0 : textStyles.textAlign;
|
|
169
|
+
|
|
160
170
|
const calculateLeftPadding = () => {
|
|
161
171
|
if (leftIconOutset) {
|
|
162
172
|
if (textAlign === "center") {
|
|
163
173
|
return iconSize - Math.abs(8 - iconSize);
|
|
164
174
|
}
|
|
175
|
+
|
|
165
176
|
return iconSize + 8;
|
|
166
177
|
}
|
|
178
|
+
|
|
167
179
|
return 0;
|
|
168
180
|
};
|
|
181
|
+
|
|
169
182
|
const assistiveTextLabel = assistiveText ? /*#__PURE__*/React.createElement(Text, {
|
|
170
183
|
style: {
|
|
171
184
|
textAlign,
|
|
@@ -187,14 +200,18 @@ const Picker = _ref => {
|
|
|
187
200
|
color: unstyledColor
|
|
188
201
|
} : {})
|
|
189
202
|
};
|
|
203
|
+
|
|
190
204
|
const handleValueChange = (newValue, itemIndex) => {
|
|
191
205
|
if (!placeholder || itemIndex > 0) {
|
|
192
206
|
onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(newValue, itemIndex);
|
|
193
207
|
}
|
|
208
|
+
|
|
194
209
|
setInternalValue(newValue);
|
|
195
210
|
};
|
|
211
|
+
|
|
196
212
|
return (
|
|
197
213
|
/*#__PURE__*/
|
|
214
|
+
|
|
198
215
|
/* marginsContainer */
|
|
199
216
|
React.createElement(View, {
|
|
200
217
|
style: [styles.marginsContainer, marginStyles]
|
|
@@ -211,7 +228,7 @@ const Picker = _ref => {
|
|
|
211
228
|
style: styles.primaryTextContainer
|
|
212
229
|
}, labelText, /*#__PURE__*/React.createElement(Text, {
|
|
213
230
|
style: primaryTextStyle
|
|
214
|
-
}, String(selectedLabel
|
|
231
|
+
}, String(selectedLabel !== null && selectedLabel !== void 0 ? selectedLabel : placeholder))), rightIcon)), assistiveTextLabel), isIos && pickerVisible ? /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(View, {
|
|
215
232
|
style: [styles.iosPicker, {
|
|
216
233
|
backgroundColor: colors.divider
|
|
217
234
|
}]
|
|
@@ -244,7 +261,7 @@ const Picker = _ref => {
|
|
|
244
261
|
}))) : null)
|
|
245
262
|
);
|
|
246
263
|
};
|
|
247
|
-
|
|
264
|
+
|
|
248
265
|
const styles = StyleSheet.create({
|
|
249
266
|
marginsContainer: {
|
|
250
267
|
alignSelf: "stretch",
|
|
@@ -314,4 +331,11 @@ const styles = StyleSheet.create({
|
|
|
314
331
|
maxWidth: deviceWidth,
|
|
315
332
|
maxHeight: deviceHeight
|
|
316
333
|
}
|
|
317
|
-
});
|
|
334
|
+
});
|
|
335
|
+
export default withTheme(Picker);ottom: 0,
|
|
336
|
+
width: "100%",
|
|
337
|
+
maxWidth: deviceWidth,
|
|
338
|
+
maxHeight: deviceHeight
|
|
339
|
+
}
|
|
340
|
+
});
|
|
341
|
+
export default withTheme(Picker);
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
+
|
|
2
3
|
import * as React from "react";
|
|
3
4
|
import { View, StyleSheet } from "react-native";
|
|
4
5
|
import omit from "lodash.omit";
|
|
@@ -7,8 +8,10 @@ import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
|
7
8
|
import { extractStyles } from "../../utilities";
|
|
8
9
|
import TextField from "../TextField";
|
|
9
10
|
import Touchable from "../Touchable";
|
|
11
|
+
|
|
10
12
|
const Picker = _ref => {
|
|
11
|
-
var _options$find;
|
|
13
|
+
var _options$find$label, _options$find;
|
|
14
|
+
|
|
12
15
|
let {
|
|
13
16
|
style,
|
|
14
17
|
options,
|
|
@@ -50,10 +53,12 @@ const Picker = _ref => {
|
|
|
50
53
|
}
|
|
51
54
|
} = extractStyles(style);
|
|
52
55
|
const textField = React.useRef(undefined);
|
|
56
|
+
|
|
53
57
|
const onValueChange = (itemValue, itemIndex) => {
|
|
54
58
|
toggleFocus();
|
|
55
59
|
onValueChangeOverride(itemValue, itemIndex);
|
|
56
60
|
};
|
|
61
|
+
|
|
57
62
|
const toggleFocus = () => {
|
|
58
63
|
if (!disabled) {
|
|
59
64
|
// @ts-ignore
|
|
@@ -62,7 +67,7 @@ const Picker = _ref => {
|
|
|
62
67
|
};
|
|
63
68
|
|
|
64
69
|
const stylesWithoutMargin = style && omit(StyleSheet.flatten(style), ["margin", "marginTop", "marginRight", "marginBottom", "marginLeft"]);
|
|
65
|
-
const selectedLabel = selectedValue && (((_options$find = options.find(o => o.value === selectedValue)) === null || _options$find === void 0 ? void 0 : _options$find.label)
|
|
70
|
+
const selectedLabel = selectedValue && ((_options$find$label = (_options$find = options.find(o => o.value === selectedValue)) === null || _options$find === void 0 ? void 0 : _options$find.label) !== null && _options$find$label !== void 0 ? _options$find$label : selectedValue);
|
|
66
71
|
return /*#__PURE__*/React.createElement(Touchable, {
|
|
67
72
|
disabled: disabled,
|
|
68
73
|
onPress: toggleFocus,
|
|
@@ -88,17 +93,16 @@ const Picker = _ref => {
|
|
|
88
93
|
pointerEvents: "none"
|
|
89
94
|
}, /*#__PURE__*/React.createElement(TextField, _extends({}, props, {
|
|
90
95
|
value: selectedLabel,
|
|
91
|
-
placeholder: placeholder
|
|
92
|
-
// @ts-ignore
|
|
96
|
+
placeholder: placeholder // @ts-ignore
|
|
93
97
|
,
|
|
94
98
|
ref: textField // cannot determine if ref is of correct type due to component being wrapped in a withTheme()
|
|
95
99
|
,
|
|
96
|
-
disabled: disabled
|
|
97
|
-
// @ts-expect-error
|
|
100
|
+
disabled: disabled // @ts-expect-error
|
|
98
101
|
,
|
|
99
102
|
style: stylesWithoutMargin
|
|
100
103
|
})))));
|
|
101
104
|
};
|
|
105
|
+
|
|
102
106
|
const styles = StyleSheet.create({
|
|
103
107
|
container: {
|
|
104
108
|
alignSelf: "stretch"
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
+
|
|
2
3
|
import * as React from "react";
|
|
3
4
|
import { View, StyleSheet } from "react-native";
|
|
4
5
|
import { SafeAreaView } from "react-native-safe-area-context";
|
|
@@ -10,8 +11,10 @@ import Button from "../DeprecatedButton";
|
|
|
10
11
|
import TextField from "../TextField";
|
|
11
12
|
import Touchable from "../Touchable";
|
|
12
13
|
import { extractStyles } from "../../utilities";
|
|
14
|
+
|
|
13
15
|
const Picker = _ref => {
|
|
14
|
-
var _options$find;
|
|
16
|
+
var _options$find$label, _options$find;
|
|
17
|
+
|
|
15
18
|
let {
|
|
16
19
|
Icon,
|
|
17
20
|
style,
|
|
@@ -58,14 +61,15 @@ const Picker = _ref => {
|
|
|
58
61
|
} = extractStyles(style);
|
|
59
62
|
const textField = React.useRef(undefined);
|
|
60
63
|
const [pickerVisible, setIsPickerVisible] = React.useState(false);
|
|
64
|
+
|
|
61
65
|
const toggleVisibility = () => {
|
|
62
|
-
setIsPickerVisible(!pickerVisible);
|
|
63
|
-
|
|
66
|
+
setIsPickerVisible(!pickerVisible); // @ts-ignore
|
|
67
|
+
|
|
64
68
|
textField.current.toggleFocus(); // cannot determine if method exists due to component being wrapped in a withTheme()
|
|
65
69
|
};
|
|
66
70
|
|
|
67
71
|
const stylesWithoutMargin = style && omit(StyleSheet.flatten(style), ["margin", "marginTop", "marginRight", "marginBottom", "marginLeft"]);
|
|
68
|
-
const selectedLabel = selectedValue && (((_options$find = options.find(o => o.value === selectedValue)) === null || _options$find === void 0 ? void 0 : _options$find.label)
|
|
72
|
+
const selectedLabel = selectedValue && ((_options$find$label = (_options$find = options.find(o => o.value === selectedValue)) === null || _options$find === void 0 ? void 0 : _options$find.label) !== null && _options$find$label !== void 0 ? _options$find$label : selectedValue);
|
|
69
73
|
return /*#__PURE__*/React.createElement(View, {
|
|
70
74
|
style: [styles.container, viewStyles]
|
|
71
75
|
}, /*#__PURE__*/React.createElement(Touchable, {
|
|
@@ -73,14 +77,12 @@ const Picker = _ref => {
|
|
|
73
77
|
onPress: toggleVisibility
|
|
74
78
|
}, /*#__PURE__*/React.createElement(TextField, _extends({}, props, {
|
|
75
79
|
value: String(selectedLabel),
|
|
76
|
-
placeholder: placeholder
|
|
77
|
-
// @ts-ignore
|
|
80
|
+
placeholder: placeholder // @ts-ignore
|
|
78
81
|
,
|
|
79
82
|
ref: textField // cannot determine if ref is of correct type due to component being wrapped in a withTheme()
|
|
80
83
|
,
|
|
81
84
|
disabled: disabled,
|
|
82
|
-
pointerEvents: "none"
|
|
83
|
-
// @ts-expect-error
|
|
85
|
+
pointerEvents: "none" // @ts-expect-error
|
|
84
86
|
,
|
|
85
87
|
style: stylesWithoutMargin,
|
|
86
88
|
Icon: Icon
|
|
@@ -107,6 +109,7 @@ const Picker = _ref => {
|
|
|
107
109
|
key: o.value
|
|
108
110
|
})))))));
|
|
109
111
|
};
|
|
112
|
+
|
|
110
113
|
const styles = StyleSheet.create({
|
|
111
114
|
container: {
|
|
112
115
|
alignSelf: "stretch"
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
+
|
|
2
3
|
import * as React from "react";
|
|
3
4
|
import { View, StyleSheet } from "react-native";
|
|
4
5
|
import { Picker as NativePicker } from "@react-native-picker/picker";
|
|
@@ -7,8 +8,10 @@ import { withTheme } from "../../theming";
|
|
|
7
8
|
import { extractStyles } from "../../utilities";
|
|
8
9
|
import TextField from "../TextField";
|
|
9
10
|
import Touchable from "../Touchable";
|
|
11
|
+
|
|
10
12
|
const Picker = _ref => {
|
|
11
|
-
var _options$find;
|
|
13
|
+
var _options$find$label, _options$find;
|
|
14
|
+
|
|
12
15
|
let {
|
|
13
16
|
style,
|
|
14
17
|
options,
|
|
@@ -50,10 +53,12 @@ const Picker = _ref => {
|
|
|
50
53
|
}
|
|
51
54
|
} = extractStyles(style);
|
|
52
55
|
const textField = React.useRef(undefined);
|
|
56
|
+
|
|
53
57
|
const onValueChange = (itemValue, itemIndex) => {
|
|
54
58
|
toggleFocus();
|
|
55
59
|
onValueChangeOverride(itemValue, itemIndex);
|
|
56
60
|
};
|
|
61
|
+
|
|
57
62
|
const toggleFocus = () => {
|
|
58
63
|
if (!disabled) {
|
|
59
64
|
// @ts-ignore
|
|
@@ -62,7 +67,7 @@ const Picker = _ref => {
|
|
|
62
67
|
};
|
|
63
68
|
|
|
64
69
|
const stylesWithoutMargin = style && omit(StyleSheet.flatten(style), ["margin", "marginTop", "marginRight", "marginBottom", "marginLeft"]);
|
|
65
|
-
const selectedLabel = selectedValue && (((_options$find = options.find(o => o.value === selectedValue)) === null || _options$find === void 0 ? void 0 : _options$find.label)
|
|
70
|
+
const selectedLabel = selectedValue && ((_options$find$label = (_options$find = options.find(o => o.value === selectedValue)) === null || _options$find === void 0 ? void 0 : _options$find.label) !== null && _options$find$label !== void 0 ? _options$find$label : selectedValue);
|
|
66
71
|
return /*#__PURE__*/React.createElement(Touchable, {
|
|
67
72
|
disabled: disabled,
|
|
68
73
|
onPress: toggleFocus,
|
|
@@ -89,17 +94,16 @@ const Picker = _ref => {
|
|
|
89
94
|
pointerEvents: "none"
|
|
90
95
|
}, /*#__PURE__*/React.createElement(TextField, _extends({}, props, {
|
|
91
96
|
value: selectedLabel,
|
|
92
|
-
placeholder: placeholder
|
|
93
|
-
// @ts-ignore
|
|
97
|
+
placeholder: placeholder // @ts-ignore
|
|
94
98
|
,
|
|
95
99
|
ref: textField // cannot determine if ref is of correct type due to component being wrapped in a withTheme()
|
|
96
100
|
,
|
|
97
|
-
disabled: disabled
|
|
98
|
-
// @ts-expect-error
|
|
101
|
+
disabled: disabled // @ts-expect-error
|
|
99
102
|
,
|
|
100
103
|
style: stylesWithoutMargin
|
|
101
104
|
})))));
|
|
102
105
|
};
|
|
106
|
+
|
|
103
107
|
const styles = StyleSheet.create({
|
|
104
108
|
container: {
|
|
105
109
|
alignSelf: "stretch"
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
function _defineProperty(obj, key, value) {
|
|
2
|
-
|
|
3
|
-
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
1
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
2
|
+
|
|
4
3
|
import * as React from "react";
|
|
5
4
|
import PortalConsumer from "./PortalConsumer";
|
|
6
5
|
import PortalHost, { PortalContext } from "./PortalHost";
|
|
7
6
|
import { ThemeProvider, withTheme } from "../../theming";
|
|
7
|
+
|
|
8
8
|
/**
|
|
9
9
|
* Portal allows to render a component at a different place in the parent tree.
|
|
10
10
|
* You can use it to render content which should appear above other elements, similar to `Modal`.
|
|
@@ -28,7 +28,6 @@ import { ThemeProvider, withTheme } from "../../theming";
|
|
|
28
28
|
*/
|
|
29
29
|
class Portal extends React.Component {
|
|
30
30
|
// @component ./PortalHost.tsx
|
|
31
|
-
|
|
32
31
|
render() {
|
|
33
32
|
const {
|
|
34
33
|
children,
|
|
@@ -40,6 +39,9 @@ class Portal extends React.Component {
|
|
|
40
39
|
theme: theme
|
|
41
40
|
}, children)));
|
|
42
41
|
}
|
|
42
|
+
|
|
43
43
|
}
|
|
44
|
+
|
|
44
45
|
_defineProperty(Portal, "Host", PortalHost);
|
|
46
|
+
|
|
45
47
|
export default withTheme(Portal);
|
|
@@ -1,33 +1,38 @@
|
|
|
1
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
2
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
3
|
-
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
4
1
|
import * as React from "react";
|
|
5
2
|
export default class PortalConsumer extends React.Component {
|
|
6
|
-
constructor() {
|
|
7
|
-
super(...arguments);
|
|
8
|
-
_defineProperty(this, "key", void 0);
|
|
9
|
-
}
|
|
10
3
|
async componentDidMount() {
|
|
11
|
-
this.checkManager();
|
|
4
|
+
this.checkManager(); // Delay updating to prevent React from going to infinite loop
|
|
12
5
|
|
|
13
|
-
// Delay updating to prevent React from going to infinite loop
|
|
14
6
|
await Promise.resolve();
|
|
15
7
|
this.key = this.props.manager.mount(this.props.children);
|
|
16
8
|
}
|
|
9
|
+
|
|
17
10
|
componentDidUpdate() {
|
|
18
11
|
this.checkManager();
|
|
19
12
|
this.props.manager.update(this.key, this.props.children);
|
|
20
13
|
}
|
|
14
|
+
|
|
21
15
|
componentWillUnmount() {
|
|
22
16
|
this.checkManager();
|
|
23
17
|
this.props.manager.unmount(this.key);
|
|
24
18
|
}
|
|
19
|
+
|
|
25
20
|
checkManager() {
|
|
26
21
|
if (!this.props.manager) {
|
|
27
22
|
throw new Error("Looks like you forgot to wrap your root component with `Provider` component from `react-native-paper`.\n\n" + "Please read our getting-started guide and make sure you've followed all the required steps.\n\n" + "https://callstack.github.io/react-native-paper/getting-started.html");
|
|
28
23
|
}
|
|
29
24
|
}
|
|
25
|
+
|
|
26
|
+
render() {
|
|
27
|
+
return null;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
}ap your root component with `Provider` component from `react-native-paper`.\n\n" + "Please read our getting-started guide and make sure you've followed all the required steps.\n\n" + "https://callstack.github.io/react-native-paper/getting-started.html");
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
|
|
30
34
|
render() {
|
|
31
35
|
return null;
|
|
32
36
|
}
|
|
37
|
+
|
|
33
38
|
}
|
|
@@ -1,11 +1,7 @@
|
|
|
1
|
-
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
2
|
-
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
3
|
-
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
4
1
|
import * as React from "react";
|
|
5
2
|
import { View, StyleSheet } from "react-native";
|
|
6
3
|
import PortalManager from "./PortalManager";
|
|
7
4
|
export const PortalContext = /*#__PURE__*/React.createContext(null);
|
|
8
|
-
|
|
9
5
|
/**
|
|
10
6
|
* Portal host renders all of its children `Portal` elements.
|
|
11
7
|
* For example, you can wrap a screen in `Portal.Host` to render items above the screen.
|
|
@@ -30,14 +26,18 @@ export const PortalContext = /*#__PURE__*/React.createContext(null);
|
|
|
30
26
|
*
|
|
31
27
|
* Here any `Portal` elements under `<App />` are rendered alongside `<App />` and will appear above `<App />` like a `Modal`.
|
|
32
28
|
*/
|
|
29
|
+
|
|
33
30
|
export default class PortalHost extends React.Component {
|
|
34
31
|
constructor() {
|
|
35
32
|
super(...arguments);
|
|
36
|
-
|
|
33
|
+
|
|
34
|
+
this.setManager = manager => {
|
|
37
35
|
this.manager = manager;
|
|
38
|
-
}
|
|
39
|
-
|
|
36
|
+
};
|
|
37
|
+
|
|
38
|
+
this.mount = children => {
|
|
40
39
|
const key = this.nextKey++;
|
|
40
|
+
|
|
41
41
|
if (this.manager) {
|
|
42
42
|
this.manager.mount(key, children);
|
|
43
43
|
} else {
|
|
@@ -47,9 +47,11 @@ export default class PortalHost extends React.Component {
|
|
|
47
47
|
children
|
|
48
48
|
});
|
|
49
49
|
}
|
|
50
|
+
|
|
50
51
|
return key;
|
|
51
|
-
}
|
|
52
|
-
|
|
52
|
+
};
|
|
53
|
+
|
|
54
|
+
this.update = (key, children) => {
|
|
53
55
|
if (this.manager) {
|
|
54
56
|
this.manager.update(key, children);
|
|
55
57
|
} else {
|
|
@@ -59,6 +61,7 @@ export default class PortalHost extends React.Component {
|
|
|
59
61
|
children
|
|
60
62
|
};
|
|
61
63
|
const index = this.queue.findIndex(o => o.type === "mount" || o.type === "update" && o.key === key);
|
|
64
|
+
|
|
62
65
|
if (index > -1) {
|
|
63
66
|
// @ts-ignore
|
|
64
67
|
this.queue[index] = op;
|
|
@@ -66,8 +69,9 @@ export default class PortalHost extends React.Component {
|
|
|
66
69
|
this.queue.push(op);
|
|
67
70
|
}
|
|
68
71
|
}
|
|
69
|
-
}
|
|
70
|
-
|
|
72
|
+
};
|
|
73
|
+
|
|
74
|
+
this.unmount = key => {
|
|
71
75
|
if (this.manager) {
|
|
72
76
|
this.manager.unmount(key);
|
|
73
77
|
} else {
|
|
@@ -76,24 +80,29 @@ export default class PortalHost extends React.Component {
|
|
|
76
80
|
key
|
|
77
81
|
});
|
|
78
82
|
}
|
|
79
|
-
}
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
+
};
|
|
84
|
+
|
|
85
|
+
this.nextKey = 0;
|
|
86
|
+
this.queue = [];
|
|
83
87
|
}
|
|
88
|
+
|
|
84
89
|
componentDidMount() {
|
|
85
90
|
const manager = this.manager;
|
|
86
91
|
const queue = this.queue;
|
|
92
|
+
|
|
87
93
|
while (queue.length && manager) {
|
|
88
94
|
const action = queue.pop();
|
|
95
|
+
|
|
89
96
|
if (action) {
|
|
90
97
|
switch (action.type) {
|
|
91
98
|
case "mount":
|
|
92
99
|
manager.mount(action.key, action.children);
|
|
93
100
|
break;
|
|
101
|
+
|
|
94
102
|
case "update":
|
|
95
103
|
manager.update(action.key, action.children);
|
|
96
104
|
break;
|
|
105
|
+
|
|
97
106
|
case "unmount":
|
|
98
107
|
manager.unmount(action.key);
|
|
99
108
|
break;
|
|
@@ -101,6 +110,7 @@ export default class PortalHost extends React.Component {
|
|
|
101
110
|
}
|
|
102
111
|
}
|
|
103
112
|
}
|
|
113
|
+
|
|
104
114
|
render() {
|
|
105
115
|
return /*#__PURE__*/React.createElement(PortalContext.Provider, {
|
|
106
116
|
value: {
|
|
@@ -116,8 +126,27 @@ export default class PortalHost extends React.Component {
|
|
|
116
126
|
ref: this.setManager
|
|
117
127
|
}));
|
|
118
128
|
}
|
|
129
|
+
|
|
119
130
|
}
|
|
131
|
+
PortalHost.displayName = "Portal.Host";
|
|
132
|
+
const styles = StyleSheet.create({
|
|
133
|
+
container: {
|
|
134
|
+
flex: 1
|
|
135
|
+
}
|
|
136
|
+
}); }
|
|
137
|
+
}, /*#__PURE__*/React.createElement(View, {
|
|
138
|
+
style: styles.container,
|
|
139
|
+
collapsable: false,
|
|
140
|
+
pointerEvents: "box-none"
|
|
141
|
+
}, this.props.children), /*#__PURE__*/React.createElement(PortalManager, {
|
|
142
|
+
ref: this.setManager
|
|
143
|
+
}));
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
}
|
|
147
|
+
|
|
120
148
|
_defineProperty(PortalHost, "displayName", "Portal.Host");
|
|
149
|
+
|
|
121
150
|
const styles = StyleSheet.create({
|
|
122
151
|
container: {
|
|
123
152
|
flex: 1
|
|
@@ -1,17 +1,19 @@
|
|
|
1
|
-
function _defineProperty(obj, key, value) {
|
|
2
|
-
|
|
3
|
-
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
1
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
2
|
+
|
|
4
3
|
import * as React from "react";
|
|
5
4
|
import { View, StyleSheet } from "react-native";
|
|
5
|
+
|
|
6
6
|
/**
|
|
7
7
|
* Portal host is the component which actually renders all Portals.
|
|
8
8
|
*/
|
|
9
9
|
export default class PortalManager extends React.PureComponent {
|
|
10
10
|
constructor() {
|
|
11
11
|
super(...arguments);
|
|
12
|
+
|
|
12
13
|
_defineProperty(this, "state", {
|
|
13
14
|
portals: []
|
|
14
15
|
});
|
|
16
|
+
|
|
15
17
|
_defineProperty(this, "mount", (key, children) => {
|
|
16
18
|
this.setState(state => ({
|
|
17
19
|
portals: [...state.portals, {
|
|
@@ -20,21 +22,24 @@ export default class PortalManager extends React.PureComponent {
|
|
|
20
22
|
}]
|
|
21
23
|
}));
|
|
22
24
|
});
|
|
25
|
+
|
|
23
26
|
_defineProperty(this, "update", (key, children) => this.setState(state => ({
|
|
24
27
|
portals: state.portals.map(item => {
|
|
25
28
|
if (item.key === key) {
|
|
26
|
-
return {
|
|
27
|
-
...item,
|
|
29
|
+
return { ...item,
|
|
28
30
|
children
|
|
29
31
|
};
|
|
30
32
|
}
|
|
33
|
+
|
|
31
34
|
return item;
|
|
32
35
|
})
|
|
33
36
|
})));
|
|
37
|
+
|
|
34
38
|
_defineProperty(this, "unmount", key => this.setState(state => ({
|
|
35
39
|
portals: state.portals.filter(item => item.key !== key)
|
|
36
40
|
})));
|
|
37
41
|
}
|
|
42
|
+
|
|
38
43
|
render() {
|
|
39
44
|
return this.state.portals.map(_ref => {
|
|
40
45
|
let {
|
|
@@ -43,11 +48,13 @@ export default class PortalManager extends React.PureComponent {
|
|
|
43
48
|
} = _ref;
|
|
44
49
|
return /*#__PURE__*/React.createElement(View, {
|
|
45
50
|
key: key,
|
|
46
|
-
collapsable: false
|
|
47
|
-
|
|
51
|
+
collapsable: false
|
|
52
|
+
/* Need collapsable=false here to clip the elevations, otherwise they appear above sibling components */
|
|
53
|
+
,
|
|
48
54
|
pointerEvents: "box-none",
|
|
49
55
|
style: StyleSheet.absoluteFill
|
|
50
56
|
}, children);
|
|
51
57
|
});
|
|
52
58
|
}
|
|
59
|
+
|
|
53
60
|
}
|