@utilitywarehouse/hearth-react-native 0.1.0

package/build/components/RadioCard/RadioCard.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { createRadio } from '@gluestack-ui/radio';
+import { View } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { useStyleProps } from '../../hooks';
+import StyledRadioCardGroup from './RadioCardGroup';
+import StyledRadioCardIcon from './RadioCardIcon';
+import StyledRadioCardIndicator from './RadioCardIndicator';
+import StyledRadioCardLabel from './RadioCardLabel';
+import StyledRadioCard from './RadioCardRoot';
+const RadioCardComponent = createRadio({
+    Root: StyledRadioCard,
+    Group: StyledRadioCardGroup,
+    Indicator: StyledRadioCardIndicator,
+    Icon: StyledRadioCardIcon,
+    Label: StyledRadioCardLabel,
+});
+const RadioCardGroup = RadioCardComponent.Group;
+const RadioCardIndicator = RadioCardComponent.Indicator;
+const RadioCardIcon = RadioCardComponent.Icon;
+const RadioCardLabel = RadioCardComponent.Label;
+RadioCardGroup.displayName = 'RadioCardGroup';
+RadioCardIndicator.displayName = 'RadioCardIndicator';
+RadioCardIcon.displayName = 'RadioCardIcon';
+RadioCardLabel.displayName = 'RadioCardLabel';
+const RadioCard = ({ children, label, contentStyle, ...props }) => {
+    const { computedStyles } = useStyleProps(props);
+    return (_jsxs(RadioCardComponent, { ...props, children: [_jsxs(View, { style: styles.radioContainer, children: [_jsx(RadioCardIndicator, { children: _jsx(RadioCardIcon, {}) }), !!label && _jsx(RadioCardLabel, { children: label })] }), !!children && _jsx(View, { style: [computedStyles, contentStyle], children: children })] }));
+};
+const styles = StyleSheet.create(theme => ({
+    radioContainer: {
+        flexDirection: 'row',
+        gap: theme.components.radio.gap,
+    },
+}));
+RadioCard.displayName = 'RadioCard';
+export { RadioCard, RadioCardGroup, RadioCardIcon, RadioCardIndicator, RadioCardLabel };
+export default RadioCard;

package/build/components/RadioCard/RadioCard.props.d.ts

@@ -0,0 +1,16 @@
+import type { PressableProps, ViewStyle } from 'react-native';
+import { ViewProps } from 'react-native';
+import { SpaceValue } from '../../types';
+interface RadioCardProps extends Omit<PressableProps, 'children'> {
+    value: string;
+    onChange?: (isSelected: boolean) => void;
+    children?: ViewProps['children'];
+    label?: string;
+    flexDirection?: ViewStyle['flexDirection'];
+    flexWrap?: ViewStyle['flexWrap'];
+    alignItems?: ViewStyle['alignItems'];
+    justifyContent?: ViewStyle['justifyContent'];
+    contentStyle?: ViewStyle;
+    gap?: SpaceValue;
+}
+export default RadioCardProps;

package/build/components/RadioCard/RadioCard.props.js

@@ -0,0 +1 @@
+export {};

package/build/components/RadioCard/RadioCardGroup.d.ts

@@ -0,0 +1,6 @@
+import RadioCardGroupProps from './RadioCardGroup.props';
+declare const RadioCardGroup: {
+    ({ children, gap, style, flexDirection, flexWrap, justifyContent, alignItems, columns, ...props }: RadioCardGroupProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default RadioCardGroup;

package/build/components/RadioCard/RadioCardGroup.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { View } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { Grid } from '../Grid';
+const RadioCardGroup = ({ children, gap = '200', style, flexDirection = 'row', flexWrap, justifyContent, alignItems, columns, ...props }) => {
+    return columns ? (_jsx(Grid, { ...props, gap: gap, columns: columns, style: style, children: children })) : (_jsx(View, { ...props, style: [
+            styles.containerGap(gap),
+            {
+                flexDirection,
+                flexWrap,
+                justifyContent,
+                alignItems,
+            },
+            style,
+        ], children: children }));
+};
+const styles = StyleSheet.create(theme => ({
+    containerGap: (gap) => ({
+        ...(gap ? { gap: theme.space[gap] } : {}),
+    }),
+}));
+RadioCardGroup.displayName = 'RadioCardGroup';
+export default RadioCardGroup;

package/build/components/RadioCard/RadioCardGroup.props.d.ts

@@ -0,0 +1,26 @@
+import { View, ViewProps, ViewStyle } from 'react-native';
+import { space } from '../../tokens';
+import { GridProps } from '../Grid';
+import { Ref } from 'react';
+type RadioCardGroupBaseProps = {
+    value?: string;
+    onChange?: (value: string) => void;
+    gap?: keyof typeof space;
+    ref?: Ref<View>;
+} & ViewProps;
+type RadioCardGroupFlexProps = {
+    columns?: never;
+    flexDirection?: ViewStyle['flexDirection'];
+    flexWrap?: ViewStyle['flexWrap'];
+    alignItems?: ViewStyle['alignItems'];
+    justifyContent?: ViewStyle['justifyContent'];
+};
+type RadioCardGroupGridProps = {
+    columns: GridProps['columns'];
+    flexDirection?: never;
+    flexWrap?: never;
+    alignItems?: never;
+    justifyContent?: never;
+};
+type RadioCardGroupProps = RadioCardGroupBaseProps & (RadioCardGroupFlexProps | RadioCardGroupGridProps);
+export default RadioCardGroupProps;

package/build/components/RadioCard/RadioCardGroup.props.js

@@ -0,0 +1 @@
+export {};

package/build/components/RadioCard/RadioCardIcon.d.ts

@@ -0,0 +1,6 @@
+import IconProps from '../Icon/Icon.props';
+declare const RadioCardIcon: {
+    ({ style, ...props }: IconProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default RadioCardIcon;

package/build/components/RadioCard/RadioCardIcon.js

@@ -0,0 +1,20 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { StyleSheet } from 'react-native-unistyles';
+import { Icon } from '../Icon';
+import { CircleIcon } from '../Icons';
+import { Platform } from 'react-native';
+const RadioCardIcon = ({ style, ...props }) => {
+    return (_jsx(Icon, { as: CircleIcon, ...props, style: Platform.OS === 'web'
+            ? StyleSheet.compose(styles.container, style)
+            : [styles.container, style] }));
+};
+RadioCardIcon.displayName = 'RadioCardIcon';
+const styles = StyleSheet.create(theme => ({
+    container: {
+        width: 14,
+        height: 14,
+        borderRadius: theme.components.radio.borderRadius,
+        color: theme.components.radio.checked.color,
+    },
+}));
+export default RadioCardIcon;

package/build/components/RadioCard/RadioCardIndicator.d.ts

@@ -0,0 +1,6 @@
+import { ViewProps } from 'react-native';
+declare const RadioCardIndicator: {
+    (props: ViewProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default RadioCardIndicator;

package/build/components/RadioCard/RadioCardIndicator.js

@@ -0,0 +1,56 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { View } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { useRadioCardContext } from './RadioCard.context';
+const RadioCardIndicator = (props) => {
+    const { checked, active } = useRadioCardContext();
+    styles.useVariants({
+        checked,
+        active,
+    });
+    return (_jsx(View, { ...props, style: [styles.container, props.style], children: props.children }));
+};
+const styles = StyleSheet.create(theme => ({
+    outline: {
+        alignSelf: 'flex-start',
+    },
+    container: {
+        justifyContent: 'center',
+        alignItems: 'center',
+        backgroundColor: theme.components.radio.unchecked.backgroundColor,
+        borderColor: theme.components.radio.unchecked.borderColor,
+        borderWidth: theme.components.radio.borderWidth,
+        borderRadius: theme.components.radio.borderRadius,
+        width: 24,
+        height: 24,
+        outlineWidth: theme.components.radio.outlineWidth,
+        outlineStyle: 'solid',
+        outlineColor: 'transparent',
+        _web: {
+            _hover: {
+                outlineColor: theme.components.radio.outlineColorHover,
+            },
+            '_focus-within': {
+                ...theme.helpers.focusVisible,
+            },
+            _active: {
+                outlineColor: theme.components.radio.outlineColorActive,
+            },
+        },
+        variants: {
+            checked: {
+                true: {
+                    borderColor: theme.components.radio.checked.color,
+                    backgroundColor: 'transparent',
+                },
+            },
+            active: {
+                true: {
+                    outlineColor: theme.components.radio.outlineColorActive,
+                },
+            },
+        },
+    },
+}));
+RadioCardIndicator.displayName = 'RadioCardIndicator';
+export default RadioCardIndicator;

package/build/components/RadioCard/RadioCardLabel.d.ts

@@ -0,0 +1,6 @@
+import LabelProps from '../Label/Label.props';
+declare const RadioCardLabel: {
+    ({ children, ...props }: LabelProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default RadioCardLabel;

package/build/components/RadioCard/RadioCardLabel.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Label } from '../Label';
+const RadioCardLabel = ({ children, ...props }) => _jsx(Label, { ...props, children: children });
+RadioCardLabel.displayName = 'RadioCardLabel';
+export default RadioCardLabel;

package/build/components/RadioCard/RadioCardRoot.d.ts

@@ -0,0 +1,12 @@
+import type RadioCardProps from './RadioCard.props';
+declare const RadioCardRoot: {
+    ({ children, style, states, ...props }: RadioCardProps & {
+        states?: {
+            disabled?: boolean;
+            checked?: boolean;
+            active?: boolean;
+        };
+    }): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default RadioCardRoot;

package/build/components/RadioCard/RadioCardRoot.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { StyleSheet } from 'react-native-unistyles';
+import { Pressable } from 'react-native';
+import { RadioCardContext } from './RadioCard.context';
+const RadioCardRoot = ({ children, style, states, ...props }) => {
+    const { checked, active } = states ?? {};
+    const value = useMemo(() => ({
+        checked,
+        active,
+    }), [checked, active]);
+    styles.useVariants({
+        selected: checked,
+    });
+    return (_jsx(RadioCardContext.Provider, { value: value, children: _jsx(Pressable, { ...props, style: [styles.container, style], children: children }) }));
+};
+RadioCardRoot.displayName = 'RadioCardRoot';
+const styles = StyleSheet.create(theme => ({
+    container: {
+        flexDirection: 'column',
+        gap: theme.components.card.selectable.gap,
+        borderRadius: theme.components.card.borderRadius,
+        backgroundColor: theme.components.card.neutral.whiteBackgroundColor,
+        borderWidth: theme.components.card.selectable.borderWidth,
+        borderColor: theme.components.card.selectable.borderColor,
+        alignSelf: 'stretch',
+        padding: {
+            base: theme.components.card.mobile.padding,
+            md: theme.components.card.tablet.padding,
+            lg: theme.components.card.desktop.padding,
+        },
+        variants: {
+            selected: {
+                true: {
+                    borderWidth: theme.components.card.selectable.borderWidthSelected,
+                    borderColor: theme.components.card.selectable.borderColorSelected,
+                    margin: -theme.components.card.selectable.borderWidthSelected / 2,
+                },
+            },
+        },
+        _web: {
+            '_focus-visible': {
+                ...theme.helpers.focusVisible,
+            },
+        },
+    },
+}));
+export default RadioCardRoot;

package/build/components/RadioCard/index.d.ts

@@ -0,0 +1,2 @@
+export { default as RadioCard, RadioCardIndicator, RadioCardLabel, RadioCardIcon, RadioCardGroup, } from './RadioCard';
+export type { default as RadioCardProps } from './RadioCard.props';

package/build/components/RadioCard/index.js

@@ -0,0 +1 @@
+export { default as RadioCard, RadioCardIndicator, RadioCardLabel, RadioCardIcon, RadioCardGroup, } from './RadioCard';

package/build/components/Select/Select.context.d.ts

@@ -0,0 +1,8 @@
+interface SelectContextType {
+    selectedValue?: string | null;
+    onValueChange?: (value: string) => void;
+    close?: () => void;
+}
+export declare const SelectContext: import("react").Context<SelectContextType>;
+export declare const useSelectContext: () => SelectContextType;
+export {};

package/build/components/Select/Select.context.js

@@ -0,0 +1,7 @@
+import { createContext, useContext } from 'react';
+export const SelectContext = createContext({
+    selectedValue: null,
+    onValueChange: () => { },
+    close: () => { },
+});
+export const useSelectContext = () => useContext(SelectContext);

package/build/components/Select/Select.d.ts

@@ -0,0 +1,6 @@
+import SelectProps from './Select.props';
+declare const Select: {
+    ({ options, value, onValueChange, label, placeholder, disabled, leadingIcon: LeadingIcon, validationStatus, required, children, bottomSheetProps, menuHeading, readonly, emptyText, listProps, searchable, searchPlaceholder, ...rest }: SelectProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default Select;

package/build/components/Select/Select.js

@@ -0,0 +1,167 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ExpandSmallIcon } from '@utilitywarehouse/hearth-react-native-icons';
+import React, { useCallback, useRef, useState } from 'react';
+import { Pressable, View } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { BodyText } from '../BodyText';
+import { BottomSheetFlatList, BottomSheetModal, BottomSheetScrollView, BottomSheetView, } from '../BottomSheet';
+import { DetailText } from '../DetailText';
+import { useFormFieldContext } from '../FormField';
+import { Icon } from '../Icon';
+import { Input } from '../Input';
+import { Label } from '../Label';
+import { SelectContext } from './Select.context';
+import SelectOption from './SelectOption';
+const Select = ({ options = [], value, onValueChange, label, placeholder = 'Select an option', disabled = false, leadingIcon: LeadingIcon, validationStatus = 'initial', required = true, children, bottomSheetProps, menuHeading, readonly = false, emptyText = 'No options available', listProps, searchable = false, searchPlaceholder = 'Search', ...rest }) => {
+    const formFieldContext = useFormFieldContext();
+    const validationStatusFromContext = formFieldContext?.validationStatus ?? validationStatus;
+    const isRequired = formFieldContext?.required ?? required;
+    const isDisabled = formFieldContext?.disabled ?? disabled;
+    const isReadonly = formFieldContext?.readonly ?? readonly;
+    const bottomSheetModalRef = useRef(null);
+    const [search, setSearch] = useState('');
+    const [isOpen, setIsOpen] = useState(false);
+    const [selectedLabel, setSelectedLabel] = useState(undefined);
+    // Find selected option from options prop
+    const selectedOption = options.find(option => option.value === value);
+    // Extract selected label from children if not using options prop
+    React.useEffect(() => {
+        if (!selectedOption && children && value) {
+            // Find the selected child component's label
+            React.Children.forEach(children, child => {
+                if (React.isValidElement(child) && child.props.value === value) {
+                    setSelectedLabel(child.props.label);
+                }
+            });
+        }
+        else {
+            setSelectedLabel(undefined);
+        }
+    }, [children, value, selectedOption]);
+    styles.useVariants({
+        disabled: isDisabled,
+        validationStatus: validationStatusFromContext,
+        readonly: isReadonly,
+        hasValue: !!selectedLabel || !!selectedOption?.label,
+    });
+    const filteredOptions = searchable
+        ? options.filter(option => option.label.toLowerCase().includes(search.toLowerCase()))
+        : options;
+    const handleClose = useCallback((index) => {
+        if (index === -1) {
+            setSearch('');
+            setIsOpen(false);
+            return;
+        }
+    }, []);
+    const openBottomSheet = useCallback(() => {
+        if (isDisabled)
+            return;
+        bottomSheetModalRef.current?.present();
+        setIsOpen(true);
+    }, [isDisabled]);
+    const closeBottomSheet = useCallback(() => {
+        bottomSheetModalRef.current?.dismiss();
+        setIsOpen(false);
+        setSearch('');
+    }, []);
+    const renderSelectOption = useCallback(({ item }) => (_jsx(SelectOption, { label: item.label, value: item.value, disabled: item.disabled, leadingIcon: item.leadingIcon, trailingIcon: item.trailingIcon })), []);
+    const renderEmptyComponent = useCallback(() => (_jsx(BottomSheetView, { style: styles.emptyContainer, children: _jsx(DetailText, { children: emptyText }) })), [emptyText]);
+    return (_jsxs(View, { ...rest, style: [styles.container, rest.style], children: [!!label && (_jsx(View, { children: _jsxs(Label, { children: [label, !isRequired && _jsx(Label, { children: " (Optional)" })] }) })), _jsxs(Pressable, { onPress: openBottomSheet, disabled: isDisabled || isReadonly, style: ({ pressed }) => [
+                    styles.selectContainer,
+                    styles.pressedContainer(pressed || isOpen),
+                ], children: [!!LeadingIcon && (_jsx(View, { children: (() => {
+                            const IconAny = Icon;
+                            return _jsx(IconAny, { as: LeadingIcon, style: styles.icon });
+                        })() })), _jsx(View, { style: styles.optionContainer, children: _jsx(BodyText, { numberOfLines: 1, style: styles.placeholderText, children: selectedOption?.label || selectedLabel || placeholder }) }), _jsx(View, { children: _jsx(Icon, { as: ExpandSmallIcon, style: styles.icon }) })] }), _jsx(BottomSheetModal, { ref: bottomSheetModalRef, snapPoints: ['25%', '40%', '80%'], onChange: handleClose, enableDynamicSizing: false, ...bottomSheetProps, children: _jsxs(SelectContext.Provider, { value: {
+                        selectedValue: value,
+                        onValueChange,
+                        close: closeBottomSheet,
+                    }, children: [menuHeading && (_jsx(View, { style: styles.headingContainer, children: _jsx(DetailText, { size: "lg", children: menuHeading }) })), searchable && (_jsx(View, { style: styles.searchContainer, children: _jsx(Input, { placeholder: searchPlaceholder, value: search, onChangeText: setSearch, type: "search" }) })), children ? (_jsx(BottomSheetScrollView, { children: children })) : (_jsx(BottomSheetFlatList, { data: filteredOptions, keyExtractor: (option) => option.value, renderItem: renderSelectOption, ListEmptyComponent: renderEmptyComponent, ...listProps }))] }) })] }));
+};
+const styles = StyleSheet.create(theme => ({
+    container: {
+        gap: theme.components.select.gap,
+    },
+    selectContainer: {
+        flexDirection: 'row',
+        alignItems: 'center',
+        backgroundColor: theme.components.select.backgroundColor,
+        borderWidth: theme.components.select.borderWidth,
+        borderColor: theme.components.select.borderColor,
+        borderRadius: theme.components.select.borderRadius,
+        paddingHorizontal: theme.components.select.paddingHorizontal,
+        paddingVertical: theme.components.select.paddingVertical,
+        gap: theme.components.select.gap,
+        variants: {
+            disabled: {
+                true: {
+                    opacity: theme.opacity.disabled,
+                },
+            },
+            readonly: {
+                true: {
+                    borderColor: theme.components.select.borderColorReadOnly,
+                },
+            },
+            validationStatus: {
+                initial: {},
+                valid: {
+                    borderColor: theme.components.select.borderColorValid,
+                },
+                invalid: {
+                    borderColor: theme.components.select.borderColorInvalid,
+                },
+            },
+        },
+    },
+    disabledContainer: {
+        opacity: 0.5,
+    },
+    optionContainer: {
+        flex: 1,
+    },
+    headingContainer: {
+        paddingHorizontal: theme.components.bottomSheet.padding,
+        marginBottom: theme.components.select.gap,
+    },
+    searchContainer: {
+        paddingTop: 1,
+        paddingHorizontal: theme.components.bottomSheet.padding,
+        paddingBottom: theme.components.select.gap,
+    },
+    pressedContainer: pressed => ({
+        outlineWidth: pressed ? theme.components.select.borderWidth : 0,
+        outlineStyle: 'solid',
+        outlineColor: pressed ? theme.components.select.borderColor : 'transparent',
+        variants: {
+            validationStatus: {
+                initial: {},
+                valid: {
+                    outlineColor: theme.components.select.borderColorValid,
+                },
+                invalid: {
+                    outlineColor: theme.components.select.borderColorInvalid,
+                },
+            },
+        },
+    }),
+    icon: {
+        color: theme.components.icon.color,
+    },
+    placeholderText: {
+        variants: {
+            hasValue: {
+                false: {
+                    color: theme.components.text.colorSecondary,
+                },
+            },
+        },
+    },
+    emptyContainer: {
+        alignItems: 'center',
+        justifyContent: 'center',
+    },
+}));
+Select.displayName = 'Select';
+export default Select;

package/build/components/Select/Select.props.d.ts

@@ -0,0 +1,126 @@
+import { ViewProps } from 'react-native';
+import { BottomSheetProps } from '../BottomSheet';
+type ValidationStatus = 'initial' | 'valid' | 'invalid';
+export interface SelectOptionItemProps {
+    /**
+     * Label to display for this option
+     */
+    label: string;
+    /**
+     * Value for this option
+     */
+    value: string;
+    /**
+     * Optional left icon for this option
+     */
+    leadingIcon?: React.ComponentType;
+    /**
+     * Optional right icon for this option
+     */
+    trailingIcon?: React.ComponentType;
+    /**
+     * Whether this option is disabled
+     */
+    disabled?: boolean;
+}
+interface SelectProps extends ViewProps {
+    /**
+     * Array of options to display in the select
+     */
+    options?: SelectOptionProps[];
+    /**
+     * Currently selected value
+     */
+    value?: string | null;
+    /**
+     * Callback when value changes
+     */
+    onValueChange?: (value: string) => void;
+    /**
+     * Label for the select
+     */
+    label?: string;
+    /**
+     * Placeholder text to show when no value is selected
+     */
+    placeholder?: string;
+    /**
+     * Whether the select is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Leading icon for the select
+     */
+    leadingIcon?: React.ComponentType;
+    /**
+     * Validation status
+     */
+    validationStatus?: ValidationStatus;
+    /**
+     * Whether the select is required
+     */
+    required?: boolean;
+    /**
+     * The heading to display in the bottom sheet
+     */
+    menuHeading?: string;
+    /**
+     * Children to render inside the select (for custom options)
+     */
+    children?: ViewProps['children'];
+    /**
+     * Props passed to the BottomSheetModal
+     */
+    bottomSheetProps?: Partial<BottomSheetProps>;
+    /**
+     * Text to display when no options are available
+     */
+    emptyText?: string;
+    /**
+     * Props to be passed to the bottom sheet flat list
+     */
+    listProps?: any;
+    /**
+     * Optional search functionality for the select
+     */
+    searchable?: boolean;
+    /**
+     * Search placeholder
+     */
+    searchPlaceholder?: string;
+    /**
+     * Whether the select is readonly
+     */
+    readonly?: boolean;
+}
+export interface SelectOptionProps {
+    /**
+     * Label to display for this option
+     */
+    label: string;
+    /**
+     * Value for this option
+     */
+    value: string;
+    /**
+     * Optional left icon
+     */
+    leadingIcon?: React.ComponentType;
+    /**
+     * Optional right icon
+     */
+    trailingIcon?: React.ComponentType;
+    /**
+     * Whether this option is selected
+     */
+    selected?: boolean;
+    /**
+     * Whether this option is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Callback when this option is selected
+     */
+    onPress?: (value: string) => void;
+}
+export default SelectProps;

package/build/components/Select/Select.props.js

@@ -0,0 +1 @@
+export {};

package/build/components/Select/SelectOption.d.ts

@@ -0,0 +1,6 @@
+import { SelectOptionProps } from './Select.props';
+declare const SelectOption: {
+    ({ label, value, leadingIcon: LeftIcon, trailingIcon: RightIcon, selected, disabled, onPress, }: SelectOptionProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default SelectOption;