Node Packaged Modules

    @rnw-community/hoverable
    TypeScript icon, indicating that this package has built-in type declarations

    0.10.0 • Public • Published

    React Native Hoverable

    Bring hover and additional state to custom components and React Native components.

    This package exposes withHover higher order component.

    Following states and props will be added to the passed component:

    state style prop state flag
    Disabled disabledStyle isDisabled
    Active activeStyle isActive
    Hovered hoverStyle isHovered
    Regular style

    Component can only be in one state.

    Hoverable components can be nested, giving ability to receive state from the parent Hoverable component.

    Example usage:

    import { HoverView, withHover } from '@rnw-community/hoverable';
    import { Text } from 'react-native';
    
    const TextComponent = ({style}) => <Text style={style}>I am a component</Text>;
    
    const HoverTextComponent = withHover(TextComponent);
    
    const Example = () => <HoverView>
        <HoverTextComponent hoverStyle={{backgroundColor: 'red'}}/>
        <HoverTextComponent hoverStyle={{backgroundColor: 'green'}}/>
    </HoverView>

    Install

    npm i @rnw-community/hoverable

    DownloadsWeekly Downloads

    5

    Version

    0.10.0

    License

    MIT

    Unpacked Size

    46.3 kB

    Total Files

    44

    Last publish

    Collaborators

    • vitalyiegorov