Components

SymbolEffect

SymbolEffect adapts SwiftUI's symbol animation modifiers into an explicit wrapper component for the web.

Example

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

Pulse

Loading preview…

Code
'use client';
import { SymbolEffect } from '@swiftuijs/ui';
export default function Example() {
    return (<SymbolEffect effect="pulse">{<span style={{ fontSize: 32 }}>★</span>}</SymbolEffect>);
}

Usage and limitations

  • CSS animations affect the whole child element; native SF Symbol layers and effect options are not implemented.

More examples

Bounce
Appear

API reference

PropTypeRequiredDescription
effect'pulse' | 'bounce' | 'appear'No—
isActivebooleanNo—

Inherits additional props from IBaseComponent.

Edit this page on GitHubReport an issue

SwipeActions

SwipeActions adapts SwiftUI's swipe-revealed row actions into an explicit, accessible web row wrapper. On the web, actions are revealed with a toggle instead of relying on touch-only gestures.

Table

Table renders structured tabular data with explicit `TableColumn` definitions, aligned with SwiftUI's table mental model.