Skip to main content

useResponsiveProp

useResponsiveProp is a custom hook to get the appropriate value from a responsive style object based on the current screen size.

Import#

import { useResponsiveProp } from "pearl-ui";

Return value#

The useResponsiveProp hook returns the value that corresponds to the breakpoint of the active device.

Usage#

const responsiveWidth = useResponsiveProp({  phone: "100%",  tablet: "50%",  largeTablet: 300,});

Parameters#

NameRequiredTypeDescription
propValuetrue{breakpoint: value}An object that specifies the values based on the different breakpoints.