Hidden

Supports rendering content responsively based on the viewport size

Can be applied to other components without rendering an additional wrapper



Usage

Hidden gives a way to hide content according to the passed value.

hide property supports responsive syntax, which means you can control the visibility based on the viewport size.

If you need to hide an element without adding any additional wrappers, you can use the render props approach with Hidden.

If you need to keep the space for the element reserved, you can use the visibility flag to toggle CSS visibility: hidden instead of display: none.

Properties

Name
Type
children
React.ReactNode
(className) => React.ReactNode
hide
boolean
visibility
boolean
as
string
inline
boolean