ferns-ui 0.23.0 → 0.23.1

package/dist/FernsProvider.js

@@ -1,7 +1,9 @@
 import React from "react";
+import { Host } from "react-native-portalize";
 import { ToastProvider } from "react-native-toast-notifications";
 import { Toast } from "./Toast";
 export function FernsProvider({ children }) {
-    return (React.createElement(ToastProvider, { animationDuration: 250, animationType: "slide-in", duration: 50000, offset: 50, placement: "bottom", renderToast: (toastOptions) => React.createElement(Toast, Object.assign({}, toastOptions)), swipeEnabled: true }, children));
+    return (React.createElement(ToastProvider, { animationDuration: 250, animationType: "slide-in", duration: 50000, offset: 50, placement: "bottom", renderToast: (toastOptions) => React.createElement(Toast, Object.assign({}, toastOptions)), swipeEnabled: true },
+        React.createElement(Host, null, children)));
 }
 //# sourceMappingURL=FernsProvider.js.map

package/dist/FernsProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"FernsProvider.js","sourceRoot":"","sources":["../src/FernsProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,aAAa,EAAC,MAAM,kCAAkC,CAAC;AAE/D,OAAO,EAAC,KAAK,EAAC,MAAM,SAAS,CAAC;AAE9B,MAAM,UAAU,aAAa,CAAC,EAAC,QAAQ,EAA8B;IACnE,OAAO,CACL,oBAAC,aAAa,IACZ,iBAAiB,EAAE,GAAG,EACtB,aAAa,EAAC,UAAU,EACxB,QAAQ,EAAE,KAAK,EACf,MAAM,EAAE,EAAE,EACV,SAAS,EAAC,QAAQ,EAClB,WAAW,EAAE,CAAC,YAAY,EAAE,EAAE,CAAC,oBAAC,KAAK,oBAAM,YAAoB,EAAI,EACnE,YAAY,UAEX,QAAQ,CACK,CACjB,CAAC;AACJ,CAAC"}
+{"version":3,"file":"FernsProvider.js","sourceRoot":"","sources":["../src/FernsProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAC,IAAI,EAAC,MAAM,wBAAwB,CAAC;AAC5C,OAAO,EAAC,aAAa,EAAC,MAAM,kCAAkC,CAAC;AAE/D,OAAO,EAAC,KAAK,EAAC,MAAM,SAAS,CAAC;AAE9B,MAAM,UAAU,aAAa,CAAC,EAAC,QAAQ,EAA8B;IACnE,OAAO,CACL,oBAAC,aAAa,IACZ,iBAAiB,EAAE,GAAG,EACtB,aAAa,EAAC,UAAU,EACxB,QAAQ,EAAE,KAAK,EACf,MAAM,EAAE,EAAE,EACV,SAAS,EAAC,QAAQ,EAClB,WAAW,EAAE,CAAC,YAAY,EAAE,EAAE,CAAC,oBAAC,KAAK,oBAAM,YAAoB,EAAI,EACnE,YAAY;QAEZ,oBAAC,IAAI,QAAE,QAAQ,CAAQ,CACT,CACjB,CAAC;AACJ,CAAC"}

package/dist/PickerSelect.d.ts

@@ -1,6 +1,5 @@
-import PropTypes from "prop-types";
-import React, { PureComponent } from "react";
-declare const defaultStyles: {
+/// <reference types="react" />
+export declare const defaultStyles: {
     viewContainer: {
         alignSelf: "stretch";
     };
@@ -81,94 +80,30 @@ declare const defaultStyles: {
         opacity: number;
     };
 };
-export default class RNPickerSelect extends PureComponent<any, any> {
-    static propTypes: {
-        onValueChange: PropTypes.Validator<(...args: any[]) => any>;
-        items: PropTypes.Validator<(PropTypes.InferProps<{
-            label: PropTypes.Validator<string>;
-            value: PropTypes.Validator<any>;
-            inputLabel: PropTypes.Requireable<string>;
-            key: PropTypes.Requireable<React.ReactText>;
-            color: PropTypes.Requireable<string>;
-        }> | null | undefined)[]>;
-        value: PropTypes.Requireable<any>;
-        placeholder: PropTypes.Requireable<PropTypes.InferProps<{
-            label: PropTypes.Requireable<string>;
-            value: PropTypes.Requireable<any>;
-            key: PropTypes.Requireable<React.ReactText>;
-            color: PropTypes.Requireable<string>;
-        }>>;
-        disabled: PropTypes.Requireable<boolean>;
-        itemKey: PropTypes.Requireable<React.ReactText>;
-        style: PropTypes.Requireable<PropTypes.InferProps<{}>>;
-        children: PropTypes.Requireable<any>;
-        onOpen: PropTypes.Requireable<(...args: any[]) => any>;
-        useNativeAndroidPickerStyle: PropTypes.Requireable<boolean>;
-        fixAndroidTouchableBug: PropTypes.Requireable<boolean>;
-        doneText: PropTypes.Requireable<string>;
-        onDonePress: PropTypes.Requireable<(...args: any[]) => any>;
-        onUpArrow: PropTypes.Requireable<(...args: any[]) => any>;
-        onDownArrow: PropTypes.Requireable<(...args: any[]) => any>;
-        onClose: PropTypes.Requireable<(...args: any[]) => any>;
-        modalProps: PropTypes.Requireable<PropTypes.InferProps<{}>>;
-        textInputProps: PropTypes.Requireable<PropTypes.InferProps<{}>>;
-        pickerProps: PropTypes.Requireable<PropTypes.InferProps<{}>>;
-        touchableDoneProps: PropTypes.Requireable<PropTypes.InferProps<{}>>;
-        touchableWrapperProps: PropTypes.Requireable<PropTypes.InferProps<{}>>;
-        Icon: PropTypes.Requireable<(...args: any[]) => any>;
-        InputAccessoryView: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-    static defaultProps: {
-        value: undefined;
-        placeholder: {
-            label: string;
-            value: null;
-            color: string;
-        };
-        disabled: boolean;
-        itemKey: null;
-        style: {};
-        children: null;
-        useNativeAndroidPickerStyle: boolean;
-        fixAndroidTouchableBug: boolean;
-        doneText: string;
-        onDonePress: null;
-        onUpArrow: null;
-        onDownArrow: null;
-        onOpen: null;
-        onClose: null;
-        modalProps: {};
-        textInputProps: {};
-        pickerProps: {};
-        touchableDoneProps: {};
-        touchableWrapperProps: {};
-        Icon: null;
-        InputAccessoryView: null;
-    };
-    inputRef: any;
-    static handlePlaceholder({ placeholder }: any): any[];
-    static getSelectedItem({ items, key, value }: any): {
-        selectedItem: any;
-        idx: any;
-    };
-    constructor(props: any);
-    componentDidUpdate(prevProps: Readonly<any>, prevState: Readonly<any>): void;
-    onUpArrow(): void;
-    onDownArrow(): void;
-    onValueChange(value: any, index: any): void;
-    onOrientationChange({ nativeEvent }: any): void;
-    setInputRef(ref: any): void;
-    getPlaceholderStyle(): any;
-    triggerOpenCloseCallbacks(): void;
-    togglePicker(animate?: boolean, postToggleCallback?: any): void;
-    renderPickerItems(): any;
-    renderInputAccessoryView(): JSX.Element;
-    renderIcon(): JSX.Element | null;
-    renderTextInputOrChildren(): JSX.Element;
-    renderIOS(): JSX.Element;
-    renderAndroidHeadless(): JSX.Element;
-    renderAndroidNativePickerStyle(): JSX.Element;
-    renderWeb(): JSX.Element;
-    render(): JSX.Element;
+interface RNPickerSelectProps {
+    onValueChange: (value: any, index: any) => void;
+    items: any[];
+    value?: any;
+    placeholder?: any;
+    disabled?: boolean;
+    itemKey?: string | number;
+    style?: any;
+    children?: any;
+    onOpen?: () => void;
+    useNativeAndroidPickerStyle?: boolean;
+    fixAndroidTouchableBug?: boolean;
+    doneText?: string;
+    onDonePress?: () => void;
+    onUpArrow?: () => void;
+    onDownArrow?: () => void;
+    onClose?: () => void;
+    modalProps?: any;
+    textInputProps?: any;
+    pickerProps?: any;
+    touchableDoneProps?: any;
+    touchableWrapperProps?: any;
+    Icon?: any;
+    InputAccessoryView?: any;
 }
-export { defaultStyles };
+export declare function RNPickerSelect({ onValueChange, value, items, placeholder, disabled, itemKey, style, children, useNativeAndroidPickerStyle, fixAndroidTouchableBug, doneText, onDonePress, onUpArrow, onDownArrow, onOpen, onClose, modalProps, textInputProps, pickerProps, touchableDoneProps, touchableWrapperProps, Icon, InputAccessoryView, }: RNPickerSelectProps): JSX.Element;
+export {};

package/dist/PickerSelect.js

@@ -19,10 +19,9 @@
 // with react-native-picker in Expo, then converted to TS.
 import { Picker } from "@react-native-picker/picker";
 import isEqual from "lodash/isEqual";
-import PropTypes from "prop-types";
-import React, { PureComponent } from "react";
+import React, { useCallback, useEffect, useMemo, useState } from "react";
 import { Keyboard, Modal, Platform, StyleSheet, Text, TextInput, TouchableOpacity, View, } from "react-native";
-const defaultStyles = StyleSheet.create({
+export const defaultStyles = StyleSheet.create({
     viewContainer: {
         alignSelf: "stretch",
     },
@@ -91,152 +90,98 @@ const defaultStyles = StyleSheet.create({
         opacity: 0,
     },
 });
-export default class RNPickerSelect extends PureComponent {
-    constructor(props) {
-        super(props);
-        const items = RNPickerSelect.handlePlaceholder({
-            placeholder: props.placeholder,
-        }).concat(props.items);
-        const { selectedItem } = RNPickerSelect.getSelectedItem({
-            items,
-            key: props.itemKey,
-            value: props.value,
-        });
-        this.state = {
-            items,
-            selectedItem,
-            showPicker: false,
-            animationType: undefined,
-            orientation: "portrait",
-            doneDepressed: false,
-        };
-        this.onUpArrow = this.onUpArrow.bind(this);
-        this.onDownArrow = this.onDownArrow.bind(this);
-        this.onValueChange = this.onValueChange.bind(this);
-        this.onOrientationChange = this.onOrientationChange.bind(this);
-        this.setInputRef = this.setInputRef.bind(this);
-        this.togglePicker = this.togglePicker.bind(this);
-        this.renderInputAccessoryView = this.renderInputAccessoryView.bind(this);
-    }
-    static handlePlaceholder({ placeholder }) {
+export function RNPickerSelect({ onValueChange, value, items, placeholder = {
+    label: "Select an item...",
+    value: null,
+    color: "#9EA0A4",
+}, disabled = false, itemKey, style = defaultStyles, children, useNativeAndroidPickerStyle = true, fixAndroidTouchableBug = false, doneText = "Done", onDonePress, onUpArrow, onDownArrow, onOpen, onClose, modalProps, textInputProps, pickerProps, touchableDoneProps, touchableWrapperProps, Icon, InputAccessoryView, }) {
+    const [selectedItem, setSelectedItem] = useState();
+    const [showPicker, setShowPicker] = useState(false);
+    const [animationType, setAnimationType] = useState(undefined);
+    const [orientation, setOrientation] = useState("portrait");
+    const [doneDepressed, setDoneDepressed] = useState(false);
+    const options = useMemo(() => {
         if (isEqual(placeholder, {})) {
-            return [];
+            return [...items];
+        }
+        else {
+            return [placeholder, ...items];
         }
-        return [placeholder];
-    }
-    static getSelectedItem({ items, key, value }) {
-        let idx = items.findIndex((item) => {
+    }, [items, placeholder]);
+    const getSelectedItem = useCallback((key, val) => {
+        let idx = options.findIndex((item) => {
             if (item.key && key) {
                 return isEqual(item.key, key);
             }
-            return isEqual(item.value, value);
+            return isEqual(item.value, val);
         });
         if (idx === -1) {
             idx = 0;
         }
         return {
-            selectedItem: items[idx] || {},
+            selectedItem: options[idx] || {},
             idx,
         };
-    }
-    componentDidUpdate(prevProps, prevState) {
-        // update items if items or placeholder prop changes
-        const items = RNPickerSelect.handlePlaceholder({
-            placeholder: this.props.placeholder,
-        }).concat(this.props.items);
-        const itemsChanged = !isEqual(prevState.items, items);
-        // update selectedItem if value prop is defined and differs from currently selected item
-        const { selectedItem, idx } = RNPickerSelect.getSelectedItem({
-            items,
-            key: this.props.itemKey,
-            value: this.props.value,
-        });
-        const selectedItemChanged = !isEqual(this.props.value, undefined) && !isEqual(prevState.selectedItem, selectedItem);
-        if (itemsChanged || selectedItemChanged) {
-            this.props.onValueChange(selectedItem.value, idx);
-            this.setState(Object.assign(Object.assign({}, (itemsChanged ? { items } : {})), (selectedItemChanged ? { selectedItem } : {})));
-        }
-    }
-    onUpArrow() {
-        const { onUpArrow } = this.props;
-        this.togglePicker(false, onUpArrow);
-    }
-    onDownArrow() {
-        const { onDownArrow } = this.props;
-        this.togglePicker(false, onDownArrow);
-    }
-    onValueChange(value, index) {
-        const { onValueChange } = this.props;
-        onValueChange(value, index);
-        this.setState((prevState) => {
-            return {
-                selectedItem: prevState.items[index],
-            };
-        });
-    }
-    onOrientationChange({ nativeEvent }) {
-        this.setState({
-            orientation: nativeEvent.orientation,
-        });
-    }
-    setInputRef(ref) {
-        this.inputRef = ref;
-    }
-    getPlaceholderStyle() {
-        const { placeholder, style } = this.props;
-        const { selectedItem } = this.state;
-        if (!isEqual(placeholder, {}) && selectedItem.label === placeholder.label) {
-            return Object.assign(Object.assign({}, defaultStyles.placeholder), style.placeholder);
+    }, [options]);
+    useEffect(() => {
+        const item = getSelectedItem(itemKey, value);
+        setSelectedItem(item.selectedItem);
+    }, [getSelectedItem, itemKey, value]);
+    const onUpArrowEvent = () => {
+        togglePicker(false, onUpArrow);
+    };
+    const onDownArrowEvent = () => {
+        togglePicker(false, onDownArrow);
+    };
+    const onValueChangeEvent = (val, index) => {
+        const item = getSelectedItem(itemKey, val);
+        onValueChange(val, index);
+        setSelectedItem(item.selectedItem);
+    };
+    const onOrientationChange = ({ nativeEvent }) => {
+        setOrientation(nativeEvent.orientation);
+    };
+    const getPlaceholderStyle = () => {
+        if (!isEqual(placeholder, {}) && (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.label) === (placeholder === null || placeholder === void 0 ? void 0 : placeholder.label)) {
+            return Object.assign(Object.assign({}, defaultStyles.placeholder), style === null || style === void 0 ? void 0 : style.placeholder);
         }
         return {};
-    }
-    triggerOpenCloseCallbacks() {
-        const { onOpen, onClose } = this.props;
-        const { showPicker } = this.state;
+    };
+    const triggerOpenCloseCallbacks = () => {
         if (!showPicker && onOpen) {
             onOpen();
         }
         if (showPicker && onClose) {
             onClose();
         }
-    }
-    togglePicker(animate = false, postToggleCallback) {
-        const { modalProps, disabled } = this.props;
-        const { showPicker } = this.state;
+    };
+    const togglePicker = (animate = false, postToggleCallback) => {
         if (disabled) {
             return;
         }
         if (!showPicker) {
             Keyboard.dismiss();
         }
-        const animationType = modalProps && modalProps.animationType ? modalProps.animationType : "slide";
-        this.triggerOpenCloseCallbacks();
-        this.setState((prevState) => {
-            return {
-                animationType: animate ? animationType : undefined,
-                showPicker: !prevState.showPicker,
-            };
-        }, () => {
-            if (postToggleCallback) {
-                postToggleCallback();
-            }
-        });
-    }
-    renderPickerItems() {
-        const { items } = this.state;
-        return items.map((item) => {
+        setAnimationType(modalProps && (modalProps === null || modalProps === void 0 ? void 0 : modalProps.animationType) ? modalProps === null || modalProps === void 0 ? void 0 : modalProps.animationType : "slide");
+        triggerOpenCloseCallbacks();
+        setAnimationType(animate ? animationType : undefined);
+        setShowPicker(!showPicker);
+        if (postToggleCallback) {
+            postToggleCallback();
+        }
+    };
+    const renderPickerItems = () => {
+        return options === null || options === void 0 ? void 0 : options.map((item) => {
             return (React.createElement(Picker.Item, { key: item.key || item.label, color: item.color, label: item.label, value: item.value }));
         });
-    }
-    renderInputAccessoryView() {
-        const { InputAccessoryView, doneText, onUpArrow, onDownArrow, onDonePress, style, touchableDoneProps, } = this.props;
-        const { doneDepressed } = this.state;
+    };
+    const renderInputAccessoryView = () => {
         if (InputAccessoryView) {
             return React.createElement(InputAccessoryView, { testID: "custom_input_accessory_view" });
         }
         return (React.createElement(View, { style: [defaultStyles.modalViewMiddle, style.modalViewMiddle], testID: "input_accessory_view" },
             React.createElement(View, { style: [defaultStyles.chevronContainer, style.chevronContainer] },
-                React.createElement(TouchableOpacity, { activeOpacity: onUpArrow ? 0.5 : 1, onPress: onUpArrow ? this.onUpArrow : undefined },
+                React.createElement(TouchableOpacity, { activeOpacity: onUpArrow ? 0.5 : 1, onPress: onUpArrow ? onUpArrowEvent : undefined },
                     React.createElement(View, { style: [
                             defaultStyles.chevron,
                             style.chevron,
@@ -244,7 +189,7 @@ export default class RNPickerSelect extends PureComponent {
                             style.chevronUp,
                             onUpArrow ? [defaultStyles.chevronActive, style.chevronActive] : {},
                         ] })),
-                React.createElement(TouchableOpacity, { activeOpacity: onDownArrow ? 0.5 : 1, onPress: onDownArrow ? this.onDownArrow : undefined },
+                React.createElement(TouchableOpacity, { activeOpacity: onDownArrow ? 0.5 : 1, onPress: onDownArrow ? onDownArrowEvent : undefined },
                     React.createElement(View, { style: [
                             defaultStyles.chevron,
                             style.chevron,
@@ -253,11 +198,11 @@ export default class RNPickerSelect extends PureComponent {
                             onDownArrow ? [defaultStyles.chevronActive, style.chevronActive] : {},
                         ] }))),
             React.createElement(TouchableOpacity, Object.assign({ hitSlop: { top: 4, right: 4, bottom: 4, left: 4 }, testID: "done_button", onPress: () => {
-                    this.togglePicker(true, onDonePress);
+                    togglePicker(true, onDonePress);
                 }, onPressIn: () => {
-                    this.setState({ doneDepressed: true });
+                    setDoneDepressed(true);
                 }, onPressOut: () => {
-                    this.setState({ doneDepressed: false });
+                    setDoneDepressed(false);
                 } }, touchableDoneProps),
                 React.createElement(View, { testID: "needed_for_touchable" },
                     React.createElement(Text, { allowFontScaling: false, style: [
@@ -265,32 +210,27 @@ export default class RNPickerSelect extends PureComponent {
                             style.done,
                             doneDepressed ? [defaultStyles.doneDepressed, style.doneDepressed] : {},
                         ], testID: "done_text" }, doneText)))));
-    }
-    renderIcon() {
-        const { style, Icon } = this.props;
+    };
+    const renderIcon = () => {
         if (!Icon) {
             return null;
         }
         return (React.createElement(View, { style: [defaultStyles.iconContainer, style.iconContainer], testID: "icon_container" },
             React.createElement(Icon, { testID: "icon" })));
-    }
-    renderTextInputOrChildren() {
-        const { children, style, textInputProps } = this.props;
-        const { selectedItem } = this.state;
+    };
+    const renderTextInputOrChildren = () => {
         const containerStyle = Platform.OS === "ios" ? style.inputIOSContainer : style.inputAndroidContainer;
         if (children) {
             return (React.createElement(View, { pointerEvents: "box-only", style: containerStyle }, children));
         }
         return (React.createElement(View, { pointerEvents: "box-only", style: containerStyle },
-            React.createElement(TextInput, Object.assign({ ref: this.setInputRef, editable: false, style: [
+            React.createElement(TextInput, Object.assign({ editable: false, style: [
                     Platform.OS === "ios" ? style.inputIOS : style.inputAndroid,
-                    this.getPlaceholderStyle(),
-                ], testID: "text_input", value: selectedItem.inputLabel ? selectedItem.inputLabel : selectedItem.label }, textInputProps)),
-            this.renderIcon()));
-    }
-    renderIOS() {
-        const { style, modalProps, pickerProps, touchableWrapperProps } = this.props;
-        const { animationType, orientation, selectedItem, showPicker } = this.state;
+                    getPlaceholderStyle(),
+                ], testID: "text_input", value: (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.inputLabel) ? selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.inputLabel : selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.label }, textInputProps)),
+            renderIcon()));
+    };
+    const renderIOS = () => {
         return (React.createElement(View, { style: [defaultStyles.viewContainer, style.viewContainer] },
             React.createElement(TouchableOpacity, Object.assign({ activeOpacity: 1, style: {
                     flexDirection: "row",
@@ -299,135 +239,58 @@ export default class RNPickerSelect extends PureComponent {
                     minHeight: (style === null || style === void 0 ? void 0 : style.minHeight) || 50,
                     width: "100%",
                 }, testID: "ios_touchable_wrapper", onPress: () => {
-                    this.togglePicker(true);
-                } }, touchableWrapperProps), this.renderTextInputOrChildren()),
-            React.createElement(Modal, Object.assign({ animationType: animationType, supportedOrientations: ["portrait", "landscape"], testID: "ios_modal", transparent: true, visible: showPicker, onOrientationChange: this.onOrientationChange }, modalProps),
+                    togglePicker(true);
+                } }, touchableWrapperProps), renderTextInputOrChildren()),
+            React.createElement(Modal, Object.assign({ animationType: animationType, supportedOrientations: ["portrait", "landscape"], testID: "ios_modal", transparent: true, visible: showPicker, onOrientationChange: onOrientationChange }, modalProps),
                 React.createElement(TouchableOpacity, { style: [defaultStyles.modalViewTop, style.modalViewTop], testID: "ios_modal_top", onPress: () => {
-                        this.togglePicker(true);
+                        togglePicker(true);
                     } }),
-                this.renderInputAccessoryView(),
+                renderInputAccessoryView(),
                 React.createElement(View, { style: [
                         defaultStyles.modalViewBottom,
                         { height: orientation === "portrait" ? 215 : 162 },
                         style.modalViewBottom,
                     ] },
-                    React.createElement(Picker, Object.assign({ selectedValue: selectedItem.value, testID: "ios_picker", onValueChange: this.onValueChange }, pickerProps), this.renderPickerItems())))));
-    }
-    renderAndroidHeadless() {
-        const { disabled, Icon, style, pickerProps, onOpen, touchableWrapperProps, fixAndroidTouchableBug, } = this.props;
-        const { selectedItem } = this.state;
+                    React.createElement(Picker, Object.assign({ selectedValue: selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.value, testID: "ios_picker", onValueChange: onValueChangeEvent }, pickerProps), renderPickerItems())))));
+    };
+    const renderAndroidHeadless = () => {
         const Component = fixAndroidTouchableBug ? View : TouchableOpacity;
         return (React.createElement(Component, Object.assign({ activeOpacity: 1, testID: "android_touchable_wrapper", onPress: onOpen }, touchableWrapperProps),
             React.createElement(View, { style: style.headlessAndroidContainer },
-                this.renderTextInputOrChildren(),
-                React.createElement(Picker, Object.assign({ enabled: !disabled, selectedValue: selectedItem.value, style: [
+                renderTextInputOrChildren(),
+                React.createElement(Picker, Object.assign({ enabled: !disabled, selectedValue: selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.value, style: [
                         Icon ? { backgroundColor: "transparent" } : {},
                         defaultStyles.headlessAndroidPicker,
                         style.headlessAndroidPicker,
-                    ], testID: "android_picker_headless", onValueChange: this.onValueChange }, pickerProps), this.renderPickerItems()))));
-    }
-    renderAndroidNativePickerStyle() {
-        const { disabled, Icon, style, pickerProps } = this.props;
-        const { selectedItem } = this.state;
+                    ], testID: "android_picker_headless", onValueChange: onValueChangeEvent }, pickerProps), renderPickerItems()))));
+    };
+    const renderAndroidNativePickerStyle = () => {
         return (React.createElement(View, { style: [defaultStyles.viewContainer, style.viewContainer] },
-            React.createElement(Picker, Object.assign({ enabled: !disabled, selectedValue: selectedItem.value, style: [
+            React.createElement(Picker, Object.assign({ enabled: !disabled, selectedValue: selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.value, style: [
                     Icon ? { backgroundColor: "transparent" } : {},
                     style.inputAndroid,
                     { width: "100%" },
-                    this.getPlaceholderStyle(),
-                ], testID: "android_picker", onValueChange: this.onValueChange }, pickerProps), this.renderPickerItems()),
-            this.renderIcon()));
-    }
-    renderWeb() {
-        const { disabled, style, pickerProps } = this.props;
-        const { selectedItem } = this.state;
+                    getPlaceholderStyle(),
+                ], testID: "android_picker", onValueChange: onValueChangeEvent }, pickerProps), renderPickerItems()),
+            renderIcon()));
+    };
+    const renderWeb = () => {
         return (React.createElement(View, { style: [defaultStyles.viewContainer, style.viewContainer] },
-            React.createElement(Picker, Object.assign({ enabled: !disabled, selectedValue: selectedItem.value, style: [{ width: "100%", height: "100%", border: "none" }, style.inputWeb], testID: "web_picker", onValueChange: this.onValueChange }, pickerProps), this.renderPickerItems()),
-            this.renderIcon()));
-    }
-    render() {
-        const { children, useNativeAndroidPickerStyle } = this.props;
+            React.createElement(Picker, Object.assign({ enabled: !disabled, selectedValue: selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.value, style: [{ width: "100%", height: "100%", border: "none" }, style.inputWeb], testID: "web_picker", onValueChange: onValueChangeEvent }, pickerProps), renderPickerItems()),
+            renderIcon()));
+    };
+    const render = () => {
         if (Platform.OS === "ios") {
-            return this.renderIOS();
+            return renderIOS();
         }
         if (Platform.OS === "web") {
-            return this.renderWeb();
+            return renderWeb();
         }
         if (children || !useNativeAndroidPickerStyle) {
-            return this.renderAndroidHeadless();
+            return renderAndroidHeadless();
         }
-        return this.renderAndroidNativePickerStyle();
-    }
+        return renderAndroidNativePickerStyle();
+    };
+    return render();
 }
-RNPickerSelect.propTypes = {
-    onValueChange: PropTypes.func.isRequired,
-    items: PropTypes.arrayOf(PropTypes.shape({
-        label: PropTypes.string.isRequired,
-        value: PropTypes.any.isRequired,
-        inputLabel: PropTypes.string,
-        key: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-        color: PropTypes.string,
-    })).isRequired,
-    value: PropTypes.any,
-    placeholder: PropTypes.shape({
-        label: PropTypes.string,
-        value: PropTypes.any,
-        key: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-        color: PropTypes.string,
-    }),
-    disabled: PropTypes.bool,
-    itemKey: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
-    style: PropTypes.shape({}),
-    children: PropTypes.any,
-    onOpen: PropTypes.func,
-    useNativeAndroidPickerStyle: PropTypes.bool,
-    fixAndroidTouchableBug: PropTypes.bool,
-    // Custom Modal props (iOS only)
-    doneText: PropTypes.string,
-    onDonePress: PropTypes.func,
-    onUpArrow: PropTypes.func,
-    onDownArrow: PropTypes.func,
-    onClose: PropTypes.func,
-    // Modal props (iOS only)
-    modalProps: PropTypes.shape({}),
-    // TextInput props
-    textInputProps: PropTypes.shape({}),
-    // Picker props
-    pickerProps: PropTypes.shape({}),
-    // Touchable Done props (iOS only)
-    touchableDoneProps: PropTypes.shape({}),
-    // Touchable wrapper props
-    touchableWrapperProps: PropTypes.shape({}),
-    // Custom Icon
-    Icon: PropTypes.func,
-    InputAccessoryView: PropTypes.func,
-};
-RNPickerSelect.defaultProps = {
-    value: undefined,
-    placeholder: {
-        label: "Select an item...",
-        value: null,
-        color: "#9EA0A4",
-    },
-    disabled: false,
-    itemKey: null,
-    style: {},
-    children: null,
-    useNativeAndroidPickerStyle: true,
-    fixAndroidTouchableBug: false,
-    doneText: "Done",
-    onDonePress: null,
-    onUpArrow: null,
-    onDownArrow: null,
-    onOpen: null,
-    onClose: null,
-    modalProps: {},
-    textInputProps: {},
-    pickerProps: {},
-    touchableDoneProps: {},
-    touchableWrapperProps: {},
-    Icon: null,
-    InputAccessoryView: null,
-};
-export { defaultStyles };
 //# sourceMappingURL=PickerSelect.js.map