Components

ContentUnavailableView

ContentUnavailableView presents polished empty states for missing data, search misses, and first-run experiences.

Example

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

Default

Loading preview…

Code
'use client';
import { Button } from '@swiftuijs/ui';
import { Text } from '@swiftuijs/ui';
import { ContentUnavailableView } from '@swiftuijs/ui';
export default function Example() {
    return ((<ContentUnavailableView icon={<Text style={{ fontSize: '2rem' }}>☆</Text>} title="No favorites yet" description="Items you save will appear here." actions={<Button>Add item</Button>}/>));
}

Usage and limitations

  • Keep title concise and action-oriented.
  • actions can contain one or more buttons or links.

API reference

PropTypeRequiredDescription
titleReactNodeYesThe primary title shown to the user.
descriptionReactNodeNoSupporting text shown below the title.
iconReactNodeNoOptional leading visual, such as an icon.
actionsReactNodeNoOptional actions rendered below the copy.

Inherits additional props from IBaseComponent.

Edit this page on GitHubReport an issue

ContentTransition

ContentTransition adapts SwiftUI's content-transition modifiers into brief feedback when its content changes.

ContextMenu

ContextMenu presents a menu of actions from a context interaction. On the web this maps to the native right-click gesture while preserving SwiftUI's contextual action model.