@utilitywarehouse/hearth-react-native 0.1.0

package/build/components/List/ListItem/ListItemTrailingContent.d.ts

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

package/build/components/List/ListItem/ListItemTrailingContent.js

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

package/build/components/List/ListItem/ListItemTrailingIcon.d.ts

@@ -0,0 +1,9 @@
+import { ComponentType } from 'react';
+import { IconProps } from '../../Icon';
+declare const ListItemTrailingIcon: {
+    ({ children, ...props }: IconProps & {
+        as?: ComponentType;
+    }): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default ListItemTrailingIcon;

package/build/components/List/ListItem/ListItemTrailingIcon.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Platform } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { Icon } from '../../Icon';
+const ListItemTrailingIcon = ({ children, ...props }) => {
+    return (_jsx(Icon, { ...props, style: Platform.OS === 'web'
+            ? StyleSheet.compose(styles.icon, props.style)
+            : [styles.icon, props.style], children: children }));
+};
+ListItemTrailingIcon.displayName = 'ListItemTrailingIcon';
+const styles = StyleSheet.create(theme => ({
+    icon: {
+        color: theme.components.icon.color,
+        width: 24,
+        height: 24,
+    },
+}));
+export default ListItemTrailingIcon;

package/build/components/List/ListItem/index.d.ts

@@ -0,0 +1,9 @@
+export { default as ListItem } from './ListItem';
+export { default as ListItemIcon } from './ListItemIcon';
+export { default as ListItemContent } from './ListItemContent';
+export type { default as ListItemProps } from './ListItem.props';
+export { default as ListItemLeadingContent } from './ListItemLeadingContent';
+export { default as ListItemTrailingContent } from './ListItemTrailingContent';
+export { default as ListItemTrailingIcon } from './ListItemTrailingIcon';
+export { default as ListItemHelperText } from './ListItemHelperText';
+export { default as ListItemText } from './ListItemText';

package/build/components/List/ListItem/index.js

@@ -0,0 +1,8 @@
+export { default as ListItem } from './ListItem';
+export { default as ListItemIcon } from './ListItemIcon';
+export { default as ListItemContent } from './ListItemContent';
+export { default as ListItemLeadingContent } from './ListItemLeadingContent';
+export { default as ListItemTrailingContent } from './ListItemTrailingContent';
+export { default as ListItemTrailingIcon } from './ListItemTrailingIcon';
+export { default as ListItemHelperText } from './ListItemHelperText';
+export { default as ListItemText } from './ListItemText';

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

@@ -0,0 +1,4 @@
+export { default as List } from './List';
+export { useListContext } from './List.context';
+export * from './ListItem';
+export * from './ListHeading';

package/build/components/List/index.js

@@ -0,0 +1,4 @@
+export { default as List } from './List';
+export { useListContext } from './List.context';
+export * from './ListItem';
+export * from './ListHeading';

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

@@ -0,0 +1,10 @@
+export declare const RadioContext: import("react").Context<{
+    disabled?: boolean;
+    checked?: boolean;
+    active?: boolean;
+}>;
+export declare const useRadioContext: () => {
+    disabled?: boolean;
+    checked?: boolean;
+    active?: boolean;
+};

package/build/components/Radio/Radio.context.js

@@ -0,0 +1,3 @@
+import { createContext, useContext } from 'react';
+export const RadioContext = createContext({});
+export const useRadioContext = () => useContext(RadioContext);

package/build/components/Radio/Radio.d.ts

@@ -0,0 +1,21 @@
+import RadioProps from './Radio.props';
+declare const RadioGroup: import("react").ForwardRefExoticComponent<import("react").RefAttributes<import("./RadioGroup.props").default & {
+    isCard?: boolean;
+}> & import("./RadioGroup.props").default & {
+    isCard?: boolean;
+} & import("@gluestack-ui/radio/lib/typescript/types").IRadioGroupProps>;
+declare const RadioIndicator: import("react").ForwardRefExoticComponent<import("react").RefAttributes<import("react-native").ViewProps> & import("react-native").ViewProps>;
+declare const RadioIcon: import("react").ForwardRefExoticComponent<import("react").RefAttributes<import("..").IconProps> & import("..").IconProps & {
+    forceMount?: boolean;
+}>;
+declare const RadioLabel: import("react").ForwardRefExoticComponent<import("react").RefAttributes<import("../Label/Label.props").default> & Omit<import("../Label/Label.props").default, "ref">>;
+declare const Radio: {
+    ({ children, label, disabled, helperIcon, helperText, invalidText, validText, validationStatus: validation, showValidationIcon, type, ...props }: RadioProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const RadioTile: {
+    ({ type, ...props }: RadioProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { Radio, RadioGroup, RadioIndicator, RadioIcon, RadioLabel, RadioTile };
+export default Radio;

package/build/components/Radio/Radio.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { createRadio } from '@gluestack-ui/radio';
+import StyledRadio from './RadioRoot';
+import StyledRadioIndicator from './RadioIndicator';
+import StyledRadioIcon from './RadioIcon';
+import StyledRadioLabel from './RadioLabel';
+import StyledRadioGroup from './RadioGroupRoot';
+import { Helper } from '../Helper';
+import { useRadioGroupContext } from './RadioGroup.context';
+import { useFormFieldContext } from '../FormField';
+import RadioTileRoot from './RadioTileRoot';
+import RadioTextContent from './RadioTextContent';
+const RadioComponent = createRadio({
+    Root: StyledRadio,
+    Group: StyledRadioGroup,
+    Indicator: StyledRadioIndicator,
+    Icon: StyledRadioIcon,
+    Label: StyledRadioLabel,
+});
+const RadioGroup = RadioComponent.Group;
+const RadioIndicator = RadioComponent.Indicator;
+const RadioIcon = RadioComponent.Icon;
+const RadioLabel = RadioComponent.Label;
+RadioGroup.displayName = 'RadioGroup';
+RadioIndicator.displayName = 'RadioIndicator';
+RadioIcon.displayName = 'RadioIcon';
+RadioLabel.displayName = 'RadioLabel';
+const Radio = ({ children, label, disabled, helperIcon, helperText, invalidText, validText, validationStatus: validation, showValidationIcon, type = 'default', ...props }) => {
+    const { validationStatus: fieldValidationStatus } = useFormFieldContext();
+    const { validationStatus: groupValidationStatus, type: groupType } = useRadioGroupContext();
+    const validationStatus = fieldValidationStatus ?? groupValidationStatus ?? validation ?? 'initial';
+    const radioType = groupType ?? type;
+    const radioChildren = children ? (children) : (_jsxs(_Fragment, { children: [_jsx(RadioIndicator, { children: _jsx(RadioIcon, {}) }), _jsxs(RadioTextContent, { children: [!!label && _jsx(RadioLabel, { children: label }), !!helperText && _jsx(Helper, { disabled: disabled, icon: helperIcon, text: helperText }), validationStatus === 'invalid' && !!invalidText && (_jsx(Helper, { showIcon: showValidationIcon, disabled: disabled, validationStatus: "invalid", text: invalidText })), validationStatus === 'valid' && !!validText && (_jsx(Helper, { disabled: disabled, showIcon: showValidationIcon, validationStatus: "valid", text: validText }))] })] }));
+    return (_jsx(RadioComponent, { ...props, isDisabled: disabled, children: radioType === 'tile' ? _jsx(RadioTileRoot, { children: radioChildren }) : radioChildren }));
+};
+const RadioTile = ({ type = 'tile', ...props }) => _jsx(Radio, { ...props, type: type });
+RadioTile.displayName = 'RadioTile';
+Radio.displayName = 'Radio';
+export { Radio, RadioGroup, RadioIndicator, RadioIcon, RadioLabel, RadioTile };
+export default Radio;

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

@@ -0,0 +1,29 @@
+import type { ComponentType } from 'react';
+import type { PressableProps, ViewProps } from 'react-native';
+interface RadioBaseProps extends Omit<PressableProps, 'children'> {
+    value: string;
+    onChange?: (isSelected: boolean) => void;
+    disabled?: boolean;
+    validationStatus?: 'valid' | 'invalid' | 'initial';
+    type?: 'default' | 'tile';
+}
+interface RadioWithChildrenProps extends RadioBaseProps {
+    children: ViewProps['children'];
+    label?: never;
+    helperText?: never;
+    helperIcon?: never;
+    invalidText?: never;
+    validText?: never;
+    showValidationIcon?: never;
+}
+interface RadioWithoutChildrenProps extends RadioBaseProps {
+    children?: never;
+    label?: string;
+    helperText?: string;
+    helperIcon?: ComponentType;
+    invalidText?: string;
+    validText?: string;
+    showValidationIcon?: boolean;
+}
+type RadioProps = RadioWithChildrenProps | RadioWithoutChildrenProps;
+export default RadioProps;

package/build/components/Radio/Radio.props.js

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

package/build/components/Radio/RadioGroup.context.d.ts

@@ -0,0 +1,10 @@
+export declare const RadioGroupContext: import("react").Context<{
+    disabled?: boolean;
+    validationStatus?: "valid" | "invalid" | "initial";
+    type?: "default" | "tile";
+}>;
+export declare const useRadioGroupContext: () => {
+    disabled?: boolean;
+    validationStatus?: "valid" | "invalid" | "initial";
+    type?: "default" | "tile";
+};

package/build/components/Radio/RadioGroup.context.js

@@ -0,0 +1,3 @@
+import { createContext, useContext } from 'react';
+export const RadioGroupContext = createContext({});
+export const useRadioGroupContext = () => useContext(RadioGroupContext);

package/build/components/Radio/RadioGroup.d.ts

@@ -0,0 +1,6 @@
+import RadioGroupProps from './RadioGroup.props';
+declare const RadioGroup: {
+    ({ children, disabled, readonly, validationStatus, label, helperText, invalidText, validText, showValidationIcon, helperIcon, type, direction, gap, ...props }: RadioGroupProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default RadioGroup;

package/build/components/Radio/RadioGroup.js

@@ -0,0 +1,49 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import React, { useMemo } from 'react';
+import { View } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { Helper } from '../Helper';
+import { Label } from '../Label';
+import { RadioGroup as RadioGroupComponent } from './Radio';
+import { RadioGroupContext } from './RadioGroup.context';
+import RadioGroupTextContent from './RadioGroupTextContent';
+const RadioGroup = ({ children, disabled, readonly, validationStatus, label, helperText, invalidText, validText, showValidationIcon = true, helperIcon, type, direction = 'column', gap, ...props }) => {
+    const value = useMemo(() => ({ disabled, validationStatus, type }), [disabled, validationStatus, type]);
+    const showHeader = !!label || !!helperText || !!invalidText || !!validText;
+    const childrenArray = React.Children.toArray(children);
+    const childIsCard = type === 'tile' ||
+        childrenArray.some(child => React.isValidElement(child) &&
+            // @ts-expect-error - child.type is not typed
+            (child.props.type === 'tile' || child.type.displayName === 'RadioTile'));
+    styles.useVariants({ type: childIsCard ? 'tile' : 'radio', direction });
+    return (_jsx(RadioGroupContext.Provider, { value: value, children: _jsxs(RadioGroupComponent, { ...props, isDisabled: disabled, isReadOnly: readonly, isCard: childIsCard, children: [showHeader && (_jsxs(RadioGroupTextContent, { children: [!!label && _jsx(Label, { disabled: disabled, children: label }), !!helperText && _jsx(Helper, { disabled: disabled, icon: helperIcon, text: helperText }), validationStatus === 'invalid' && !!invalidText && (_jsx(Helper, { showIcon: showValidationIcon, disabled: disabled, validationStatus: "invalid", text: invalidText })), validationStatus === 'valid' && !!validText && (_jsx(Helper, { disabled: disabled, showIcon: showValidationIcon, validationStatus: "valid", text: validText }))] })), _jsx(View, { style: [styles.container, styles.containerGap(gap)], children: children })] }) }));
+};
+const styles = StyleSheet.create(theme => ({
+    container: {
+        alignItems: 'stretch',
+        variants: {
+            type: {
+                radio: {
+                    gap: theme.components.radio.group.stack.gap,
+                },
+                tile: {
+                    gap: theme.components.radio.tile.group.stack.gap,
+                },
+            },
+            direction: {
+                column: {
+                    flexDirection: 'column',
+                },
+                row: {
+                    flexDirection: 'row',
+                    flexWrap: 'wrap',
+                },
+            },
+        },
+    },
+    containerGap: (gap) => ({
+        ...(gap ? { gap: theme.space[gap] } : {}),
+    }),
+}));
+RadioGroup.displayName = 'RadioGroup';
+export default RadioGroup;

package/build/components/Radio/RadioGroup.props.d.ts

@@ -0,0 +1,20 @@
+import { ComponentType } from 'react';
+import { ViewProps } from 'react-native';
+import { space } from '../../tokens';
+interface RadioGroupProps extends ViewProps {
+    disabled?: boolean;
+    value?: string;
+    onChange?: (value: string) => void;
+    readonly?: boolean;
+    validationStatus?: 'valid' | 'invalid' | 'initial';
+    label?: string;
+    helperText?: string;
+    showValidationIcon?: boolean;
+    invalidText?: string;
+    validText?: string;
+    helperIcon?: ComponentType;
+    type?: 'default' | 'tile';
+    direction?: 'row' | 'column';
+    gap?: keyof typeof space;
+}
+export default RadioGroupProps;

package/build/components/Radio/RadioGroup.props.js

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

package/build/components/Radio/RadioGroupRoot.d.ts

@@ -0,0 +1,8 @@
+import RadioGroupProps from './RadioGroup.props';
+declare const RadioGroupRoot: {
+    ({ children, style, isCard, ...props }: RadioGroupProps & {
+        isCard?: boolean;
+    }): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default RadioGroupRoot;

package/build/components/Radio/RadioGroupRoot.js

@@ -0,0 +1,23 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { StyleSheet } from 'react-native-unistyles';
+import { View } from 'react-native';
+const RadioGroupRoot = ({ children, style, isCard = false, ...props }) => {
+    styles.useVariants({ type: isCard ? 'tile' : 'radio' });
+    return (_jsx(View, { ...props, style: [styles.container, style], children: children }));
+};
+RadioGroupRoot.displayName = 'RadioGroupRoot';
+const styles = StyleSheet.create(theme => ({
+    container: {
+        variants: {
+            type: {
+                tile: {
+                    gap: theme.components.radio.tile.group.gap,
+                },
+                radio: {
+                    gap: theme.components.radio.group.gap,
+                },
+            },
+        },
+    },
+}));
+export default RadioGroupRoot;

package/build/components/Radio/RadioGroupTextContent.d.ts

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

package/build/components/Radio/RadioGroupTextContent.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Flex } from '../Flex';
+const RadioGroupTextContent = ({ children, ...props }) => {
+    return (_jsx(Flex, { direction: "column", space: "none", ...props, children: children }));
+};
+RadioGroupTextContent.displayName = 'RadioGroupTextContent';
+export default RadioGroupTextContent;

package/build/components/Radio/RadioIcon.d.ts

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

package/build/components/Radio/RadioIcon.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 RadioIcon = ({ style, ...props }) => {
+    return (_jsx(Icon, { as: CircleIcon, ...props, style: Platform.OS === 'web'
+            ? StyleSheet.compose(styles.container, style)
+            : [styles.container, style] }));
+};
+RadioIcon.displayName = 'RadioIcon';
+const styles = StyleSheet.create(theme => ({
+    container: {
+        width: 14,
+        height: 14,
+        borderRadius: theme.components.radio.borderRadius,
+        color: theme.components.radio.checked.color,
+    },
+}));
+export default RadioIcon;

package/build/components/Radio/RadioIndicator.d.ts

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

package/build/components/Radio/RadioIndicator.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 { useRadioContext } from './Radio.context';
+const RadioIndicator = (props) => {
+    const { checked, active } = useRadioContext();
+    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,
+                },
+            },
+        },
+    },
+}));
+RadioIndicator.displayName = 'RadioIndicator';
+export default RadioIndicator;

package/build/components/Radio/RadioLabel.d.ts

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

package/build/components/Radio/RadioLabel.js

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

package/build/components/Radio/RadioRoot.d.ts

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

package/build/components/Radio/RadioRoot.js

@@ -0,0 +1,42 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from 'react';
+import { StyleSheet } from 'react-native-unistyles';
+import { Pressable } from 'react-native';
+import { RadioContext } from './Radio.context';
+import { useRadioGroupContext } from './RadioGroup.context';
+const RadioRoot = ({ children, style, states, ...props }) => {
+    const { disabled, checked, active } = states ?? {};
+    const isDisabled = useRadioGroupContext()?.disabled ?? disabled;
+    styles.useVariants({ disabled: isDisabled });
+    const value = useMemo(() => ({
+        disabled: isDisabled,
+        checked,
+        active,
+    }), [isDisabled, checked, active]);
+    return (_jsx(RadioContext.Provider, { value: value, children: _jsx(Pressable, { ...props, style: [styles.container, style], children: children }) }));
+};
+RadioRoot.displayName = 'RadioRoot';
+const styles = StyleSheet.create(theme => ({
+    container: {
+        flexDirection: 'row',
+        alignItems: 'stretch',
+        gap: theme.components.radio.gap,
+        alignSelf: 'stretch',
+        variants: {
+            disabled: {
+                true: {
+                    opacity: theme.opacity.disabled,
+                },
+            },
+        },
+        _web: {
+            '_focus-visible': {
+                outline: 'none',
+            },
+            '_focus-visible > div:nth-child(2)': {
+                ...theme.helpers.focusVisible,
+            },
+        },
+    },
+}));
+export default RadioRoot;

package/build/components/Radio/RadioTextContent.d.ts

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

package/build/components/Radio/RadioTextContent.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Flex } from '../Flex';
+const RadioTextContent = ({ children, ...props }) => {
+    return (_jsx(Flex, { direction: "column", space: "none", ...props, children: children }));
+};
+RadioTextContent.displayName = 'RadioTextContent';
+export default RadioTextContent;

package/build/components/Radio/RadioTileRoot.d.ts

@@ -0,0 +1,8 @@
+import { ViewProps } from 'react-native';
+declare const RadioTileRoot: {
+    ({ children }: {
+        children: ViewProps["children"];
+    }): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export default RadioTileRoot;

package/build/components/Radio/RadioTileRoot.js

@@ -0,0 +1,36 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { View } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { useRadioContext } from './Radio.context';
+const RadioTileRoot = ({ children }) => {
+    const { checked } = useRadioContext();
+    styles.useVariants({
+        checked,
+    });
+    return _jsx(View, { style: styles.container, children: children });
+};
+const styles = StyleSheet.create(theme => ({
+    container: {
+        flexDirection: 'row',
+        justifyContent: 'flex-start',
+        flex: 1,
+        alignSelf: 'stretch',
+        gap: theme.components.radio.gap,
+        padding: theme.components.radio.tile.padding,
+        borderWidth: theme.components.radio.tile.borderWidth,
+        borderColor: theme.components.radio.tile.borderColor,
+        borderRadius: theme.components.radio.tile.borderRadius,
+        backgroundColor: theme.components.radio.tile.backgroundColor,
+        variants: {
+            checked: {
+                true: {
+                    borderWidth: theme.components.radio.tile.borderWidthSelected,
+                    borderColor: theme.components.radio.tile.borderColorSelected,
+                    margin: -theme.components.radio.tile.borderWidthSelected / 2,
+                },
+            },
+        },
+    },
+}));
+RadioTileRoot.displayName = 'RadioTileRoot';
+export default RadioTileRoot;

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

@@ -0,0 +1,5 @@
+export { default as Radio, RadioIndicator, RadioLabel, RadioIcon, RadioTile } from './Radio';
+export { default as RadioGroup } from './RadioGroup';
+export { default as RadioGroupTextContent } from './RadioGroupTextContent';
+export { default as RadioTextContent } from './RadioTextContent';
+export type { default as RadioProps } from './Radio.props';

package/build/components/Radio/index.js

@@ -0,0 +1,4 @@
+export { default as Radio, RadioIndicator, RadioLabel, RadioIcon, RadioTile } from './Radio';
+export { default as RadioGroup } from './RadioGroup';
+export { default as RadioGroupTextContent } from './RadioGroupTextContent';
+export { default as RadioTextContent } from './RadioTextContent';

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

@@ -0,0 +1,8 @@
+export declare const RadioCardContext: import("react").Context<{
+    checked?: boolean;
+    active?: boolean;
+}>;
+export declare const useRadioCardContext: () => {
+    checked?: boolean;
+    active?: boolean;
+};

package/build/components/RadioCard/RadioCard.context.js

@@ -0,0 +1,3 @@
+import { createContext, useContext } from 'react';
+export const RadioCardContext = createContext({});
+export const useRadioCardContext = () => useContext(RadioCardContext);

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

@@ -0,0 +1,36 @@
+import { View } from 'react-native';
+import RadioCardProps from './RadioCard.props';
+declare const RadioCardGroup: import("react").ForwardRefExoticComponent<import("react").RefAttributes<import("./RadioCardGroup.props").default> & ((Omit<{
+    value?: string;
+    onChange?: (value: string) => void;
+    gap?: keyof typeof import("../../tokens").space;
+    ref?: import("react").Ref<View>;
+} & import("react-native").ViewProps & {
+    columns?: never;
+    flexDirection?: import("react-native").ViewStyle["flexDirection"];
+    flexWrap?: import("react-native").ViewStyle["flexWrap"];
+    alignItems?: import("react-native").ViewStyle["alignItems"];
+    justifyContent?: import("react-native").ViewStyle["justifyContent"];
+}, "ref"> | Omit<{
+    value?: string;
+    onChange?: (value: string) => void;
+    gap?: keyof typeof import("../../tokens").space;
+    ref?: import("react").Ref<View>;
+} & import("react-native").ViewProps & {
+    columns: import("..").GridProps["columns"];
+    flexDirection?: never;
+    flexWrap?: never;
+    alignItems?: never;
+    justifyContent?: never;
+}, "ref">) & import("@gluestack-ui/radio/lib/typescript/types").IRadioGroupProps)>;
+declare const RadioCardIndicator: import("react").ForwardRefExoticComponent<import("react").RefAttributes<import("react-native").ViewProps> & import("react-native").ViewProps>;
+declare const RadioCardIcon: import("react").ForwardRefExoticComponent<import("react").RefAttributes<import("..").IconProps> & import("..").IconProps & {
+    forceMount?: boolean;
+}>;
+declare const RadioCardLabel: import("react").ForwardRefExoticComponent<import("react").RefAttributes<import("../Label/Label.props").default> & Omit<import("../Label/Label.props").default, "ref">>;
+declare const RadioCard: {
+    ({ children, label, contentStyle, ...props }: RadioCardProps): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { RadioCard, RadioCardGroup, RadioCardIcon, RadioCardIndicator, RadioCardLabel };
+export default RadioCard;