# Group - **Category:** Layout (`layout`) - **Slug:** `layout/group` - **Status:** stable - **Platforms:** web - **Import:** `import { Group } from "@protocore/pds";` - **Docs:** https://pds.protocore.io/components/layout/group > Alias of HStack — a horizontal flex row with token-based gap, alignment, and justification. ## An alias of HStack **Group** is the Mantine-familiar name for this library's **HStack** — the horizontal `Stack` preset, exported under a second name for discoverability. Props are identical (`gap`, `align`, `justify`, `wrap`, …). See the [Stack](/layout/stack) page for the full API, the equal-height row law, and `VStack`. ## Props | Prop | Type | Required | Default | Description | | --- | --- | --- | --- | --- | | `asChild` | `boolean` | no | — | — | | `className` | `string` | no | — | — | | `style` | `CSSProperties` | no | — | — | ## Examples ### Basics Lay controls out in a row with a token `gap`; use `justify="between"` to push a leading cluster and trailing action apart. ```tsx import { Group, Button, Badge } from "@protocore/pds"; export default function GroupBasics() { return (
SYNCED LAGGING STALLED
); } ``` ## Related `stack`, `grid`, `spacer` --- © Protocore. All rights reserved. Use of the Protocore Design System requires prior written authorization from Protocore (contact@protocore.io). These machine-readable materials must not be ingested into ML-training datasets or derivative design systems. See https://pds.protocore.io/legal/