Components
MatchedGeometryEffect
MatchedGeometryEffect adapts SwiftUI's `matchedGeometryEffect` modifier into explicit shared metadata on the web.
MatchedGeometryEffect adapts SwiftUI's `matchedGeometryEffect` modifier into explicit shared metadata on the web.
Examples
Shared Card
Preview unavailable for this example in the static docs build.
Show code
<HStack spacing={12}>
<MatchedGeometryEffect id="card" namespace="gallery" role="source">
<Button
style={{
backgroundColor: 'transparent',
border: '1px solid var(--sw-color-primary, #007aff)',
}}>
Compact card
</Button>
</MatchedGeometryEffect>
<MatchedGeometryEffect id="card" namespace="gallery" role="target" properties="frame">
<Button>Expanded card</Button>
</MatchedGeometryEffect>
</HStack>API
| Prop | Type | Required | Description |
|---|---|---|---|
id | string | Yes | No description yet. |
namespace | string | Yes | No description yet. |
role | 'source' | 'target' | No | No description yet. |
properties | 'frame' | 'position' | 'size' | No | No description yet. |
active | boolean | No | No description yet. |
Inherits additional props from IBaseComponent.
Overview
MatchedGeometryEffect adapts SwiftUI's matchedGeometryEffect modifier into explicit shared metadata on the web.
Status: adapted