Components

Group

Group children in an unstyled HTML container.

Example

Requires React 18.2+ or 19 and shared styles. See setup.

Default

Loading preview…

Code
'use client';
import { Text } from '@swiftuijs/ui';
import { Group } from '@swiftuijs/ui';
export default function Example() {
    return (<Group>{(<>
        <Text>Item 1</Text>
        <Text>Item 2</Text>
        <Text>Item 3</Text>
      </>)}</Group>);
}

Usage and limitations

  • Renders a div, so it can affect flex/grid layout and inherited styles. It is not a React Fragment or a layout-transparent native SwiftUI Group.
  • Use className or style to apply shared styles; conditional rendering and nesting work as in React.
  • Use a Fragment when you need no DOM wrapper.

More examples

With Modifiers
Conditional Rendering
Nested Groups
With Buttons

API reference

This component currently relies on inherited element props.

Inherits additional props from IBaseComponent.

Edit this page on GitHubReport an issue

GridRow

GridRow defines a single row inside `Grid`.

GroupBox

Visually group related content with an optional label.