context1.js

// formThemeContext.js

const FormThemeContext = createContext({
    radio: {},
    textInput: {},
    integerInput: {}
});

export default FormThemeContext;

const DwellingCharacteristics = () => (
    <FormThemeContext.Provider
        value={
            textInput: {
                color: 'blue'
            },
            radio: {
                container: {
                    backgroundColor: 'red'
                }
            }
        }
    >
        <Section {...{chapter}}/>
    </FormThemeContext.Provider>
)

// ..... Radio/index.js
import styles from './styles';

const Radio = () => (
    <FormThemeContext.Consumer>
        {({radio = {}}) => (
            <View
                style={composeStyles(styles.container, radio.container)}
            >
               ...
            </View>
        )}
    </FormThemeContext.Consumer/>
)

context2.js

// formThemeContext.js

const defaultTheme = {
    radio: {},
    textInput: {},
    integerInput: {}
};

export createFormTheme = (theme) => ({...defaultTheme, ...theme});

const FormThemeContext = createContext(defaultTheme);

export FormThemeContext;

const DwellingCharacteristics = () => (
    <FormThemeContext.Provider
        value={createFormTheme(
            textInput: {
                color: 'blue'
            },
            radio: {
                container: {
                    backgroundColor: 'red'
                },
                ...
            }
        )}
    >
        <Section {...{chapter}}/>
    </FormThemeContext.Provider>
)

// ..... Radio/index.js
import styles from './styles';

const Radio = () => (
    <FormThemeContext.Consumer>
        {({radio}}) => (
            <View
                style={composeStyles(styles.container, radio.container)}
            >
               ...
            </View>
        )}
    </FormThemeContext.Consumer/>
)