Documentation
Component for rendering different content based on screen size.
import { AdaptiveWrapper } from "@/components/common/adaptive-wrapper"
;<AdaptiveWrapper
mobile={<MobileView />}
tablet={<TabletView />}
desktop={<DesktopView />}
/>
| Prop | Type | Default | Description |
|---|---|---|---|
mobile | ReactNode | - | Content for mobile screens (required) |
tablet | ReactNode | - | Content for tablet screens |
desktop | ReactNode | - | Content for desktop screens |
className | string | - | Additional CSS classes |
<AdaptiveWrapper
mobile={<SimpleListView />}
tablet={<GridView />}
desktop={<DetailedGridView />}
/>