Interface icons
Use search. Enumerate every supported name with lumenIconNames.
ActionsReact Native
Icon button
Trigger a native action with a required accessible label and platform icon.
Native example
Use Icon button
Use for compact, familiar actions. Prefer a text button when the icon alone would make the action difficult to understand.
View verified React Native runtime capture
<LumenIconButton
name="settings"
label="Settings"
onPress={openSettings}
/>React Native icon catalog
Choose an icon name
Search the visual catalogs, copy the displayed Lumen name, then use the React Native spelling below. The package includes both catalogs without another native dependency.
Reference
Public API
The primary shared and platform-specific options exposed by LumenIconButton.
| API | Values or type | Default | Description |
|---|---|---|---|
| name or icon | LumenIconName or LumenIconGraphic | Exactly one required | Selects a generated catalog icon or a platform-specific custom graphic. |
| label | String | Required | Provides the accessible action name. |
| onPress | Callback | Required | Runs the action. |
| intent | primary · secondary · quiet · danger | quiet | Selects the semantic action treatment. |
| size | sm · md · lg | md | Selects shared icon and control metrics. |
| disabled | Boolean | false | Controls native disabled state. |
Native behavior
Design and accessibility
When to use it
Use for compact, familiar actions. Prefer a text button when the icon alone would make the action difficult to understand.
Accessibility
The accessible label is required and becomes the native button name. Touch targets remain at least 44 units on mobile.
Shared component