Container

Wrapper responsif untuk membatasi lebar konten dan menjaga ritme horizontal layout halaman.

import { Container } from "@naraya/ui";

Container dipakai sebagai outer wrapper section/page supaya konten tidak terlalu melebar di layar besar.

Default (xl)

Container default size = xl

<Container>...</Container>

Size variants

size="sm"

size="md"

size="lg"

size="xl"

size="2xl"

size="full"

<Container size="sm" />
<Container size="md" />
<Container size="lg" />
<Container size="xl" />
<Container size="2xl" />
<Container size="full" />

Flush container

Flush menghapus horizontal padding default container.

<Container flush>...</Container>

Prop	Type	Default	Description
as	`ElementType`	`"div"`	Render sebagai tag lain.
size	`"sm" \| "md" \| "lg" \| "xl" \| "2xl" \| "full"`	`"xl"`	Lebar maksimum container.
flush	`boolean`	`false`	Hilangkan padding horizontal bawaan.
...rest	`HTMLAttributes<HTMLElement>`	—	Props native element.

--space-4/6/8

Padding horizontal/vertical container

--breakpoint-*

Batas max-width per size