@accessible/visually-hidden NPM

A React component for adding visually hidden styles to elements

Quick Start

Simply wrap a child element that accepts a style prop and this component will add visually hidden styles to it without overwriting styles already present on the child.

// VisuallyHidden is the component
// visuallyHidden is a style object
import {VisuallyHidden, visuallyHidden} from '@accessible/visually-hidden'

export default (props) => (
  <VisuallyHidden>
    <input type='checkbox' {...props} />
  </VisuallyHidden>
)
// <input type='checkbox' style='...'/>