diff --git a/example/src/Examples/RadioButtonExample.tsx b/example/src/Examples/RadioButtonExample.tsx index d77eb6f3c9..6ccf8ea542 100644 --- a/example/src/Examples/RadioButtonExample.tsx +++ b/example/src/Examples/RadioButtonExample.tsx @@ -8,7 +8,7 @@ import { useTheme, } from 'react-native-paper'; -type State = 'normal' | 'normal-ios' | 'custom'; +type State = 'normal' | 'normal-ios' | 'normal-item' | 'custom'; const RadioButtonExample = () => { const [checked, setChecked] = React.useState('normal'); @@ -59,6 +59,12 @@ const RadioButtonExample = () => { + setChecked('normal-item')} + /> Checked (Disabled) @@ -67,6 +73,18 @@ const RadioButtonExample = () => { Unchecked (Disabled) + + ); }; diff --git a/src/components/RadioButton/RadioButtonItem.tsx b/src/components/RadioButton/RadioButtonItem.tsx index 9cffcc3d67..b9cd890dd8 100644 --- a/src/components/RadioButton/RadioButtonItem.tsx +++ b/src/components/RadioButton/RadioButtonItem.tsx @@ -23,6 +23,10 @@ export type Props = { * Label to be displayed on the item. */ label: string; + /** + * Whether radio is disabled. + */ + disabled?: boolean; /** * Function to execute on press. */ @@ -98,6 +102,7 @@ class RadioButtonItem extends React.Component { style, labelStyle, onPress, + disabled, color, uncheckedColor, status, @@ -109,12 +114,15 @@ class RadioButtonItem extends React.Component { {(context?: RadioButtonContextType) => { return ( - handlePress({ - onPress: onPress, - onValueChange: context?.onValueChange, - value, - }) + onPress={ + disabled + ? undefined + : () => + handlePress({ + onPress: onPress, + onValueChange: context?.onValueChange, + value, + }) } > @@ -125,6 +133,7 @@ class RadioButtonItem extends React.Component {