Flex
A flexbox container with direction and gap props.
Default
Item 1
Item 2
Item 3
Flex Props
| Prop | Type | Default | Description |
|---|---|---|---|
| direction | "row" | "column" | "row-reverse" | "column-reverse" | "row" | Flex direction |
| align | "start" | "center" | "end" | "stretch" | "baseline" | — | Align items |
| justify | "start" | "center" | "end" | "between" | "around" | "evenly" | — | Justify content |
| wrap | boolean | false | Enable flex wrap |
| gap | "none" | "xs" | "sm" | "md" | "lg" | "xl" | "none" | Gap between items |
| children | ReactNode | — | Content |
| className | string | — | Additional CSS classes |