Components

LabeledContent

LabeledContent presents a label and related value using the same compact summary pattern as SwiftUI.

Example

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

Default

Loading preview…

Code
'use client';
import { LabeledContent } from '@swiftuijs/ui';
export default function Example() {
    return (<LabeledContent label="Email" value="[email protected]"></LabeledContent>);
}

Usage and limitations

  • Use value for simple text values.
  • Pass children when the trailing content needs richer formatting.

API reference

PropTypeRequiredDescription
labelReactNodeYesThe descriptive label shown on the leading side.
valueReactNodeNoThe trailing value content.

Inherits additional props from IBaseComponent.

Edit this page on GitHubReport an issue

Label

Combine a title with an optional icon.

LazyHGrid

A measured, virtualized horizontal grid. Only the viewport and a small overscan window mount, including when scrolling the page.