Stack

Storybook

Stack components provide consistent vertical or horizontal spacing between child elements. They simplify layout by automatically applying spacing between items without the need for manual margin management.

React

To implement Stack component into your project you'll need to add the import:

import { Stack } from "@shoptet/ui";

After adding import into your project you can use it simply like:

<Stack
  grow
  shrink
  padding
  reverse
  wrap
  align="center"
  gap="xl"
  maxWidth="large"
  justify="center"
>
  <span>Child</span>
  <span>Child</span>
  <span>Child</span>
</Stack>