useMediaQuery

Preview

A media-query helper typically drives whether you render a compact mobile variant or a denser desktop layout.

Expanded mode simulates a desktop layout with more room for metadata and supporting actions.

Registry install

pnpm dlx shadcn@latest add https://react.tileui.zmorg.cn/r/use-media-query.json

const isMobile = useMediaQuery('(max-width: 768px)');