Skip to main content

useVisuallyHidden

The useVisuallyHidden is a custom hook for visually hiding content.

Submit feedback
github
import { useVisuallyHidden } from '@uhg-abyss/web/hooks/useVisuallyHidden';

Usage

export const useVisuallyHidden = () => {
const visuallyHiddenProps = {
style: {
border: 0,
clip: 'rect(0 0 0 0)',
clipPath: 'inset(50%)',
height: 1,
margin: '0 -1px -1px 0',
overflow: 'hidden',
padding: 0,
position: 'absolute',
width: 1,
whiteSpace: 'nowrap',
},
};
return { visuallyHiddenProps };
};
Table of Contents