Common props
Apply shared layout, appearance, identity, and accessibility props to NatUI components.
Most host components accept these optional properties:
| Prop | Type | Purpose |
|---|---|---|
padding | number | EdgeInsets | Uniform or per-edge inset |
background | Color | Background color |
cornerRadius | number | Rounded background corners |
frame | Frame | Fixed and minimum or maximum dimensions |
opacity | number | Visual opacity |
disabled | boolean | Disables interaction |
hidden | boolean | Hides the native view |
color | Color | Foreground color |
help | string | Native tooltip |
tag | string | Stable row identity for selection |
badge | string | number | Short badge on supported rows or tabs |
accessibilityLabel | string | Assistive-technology label |
accessibilityHint | string | Result or purpose of activation |
accessibilityIdentifier | string | Stable UI automation identifier |
Colors are #RRGGBB or #RRGGBBAA strings.
<Text
padding={{ top: 8, bottom: 8, leading: 12, trailing: 12 }}
background="#E94F37"
color="#FFFFFF"
cornerRadius={8}
frame={{ minWidth: 120, maxWidth: 'infinity' }}
accessibilityLabel="Build status"
>
Ready
</Text>Frames
Frame accepts width, height, minWidth, maxWidth, minHeight, and maxHeight. A maximum can be a number or "infinity".
All dimensions use logical points. A frame participates in native layout and is not a CSS box.
JSON boundary
Props that cross to the host must contain strings, finite numbers, booleans, null, arrays, or plain objects made from those values. Event-handler functions stay in JavaScript and are never serialized.
When a prop contains an invalid value such as a BigInt, a circular object, a class instance, a nested function, or a non-finite number, NatUI reports the component kind and prop path, then omits the value.
Platform details
- Container foreground color cascades to descendants until a child supplies
its own
color. - Rounded panel backgrounds clip their children to
cornerRadius. Imagepaints padding, background, and corner radius around its native symbol on both hosts.- Accessibility identifiers map to AX identifiers on macOS and Automation IDs on Windows.