<Button>
A headless Button component for ReactLynx. It provides press state tracking (`active`) and render props for custom styling.
Info
You can check the source code to understand how it works, and you're welcome to submit MRs to enhance its capabilities.
Basic Usage
Button
The root component of the Button, containing all of its child components.
buttonPropsiOSAndroidHarmony
Button supports original view props to be directly spread in this prop.
classNameiOSAndroidHarmony
className
disablediOSAndroidHarmony
Determines whether the button is disabled.
onClickiOSAndroidHarmony
Triggered when the button is clicked.
styleiOSAndroidHarmony
style
childreniOSAndroidHarmony
children
State-based styling & rendering
This component exposes each of its internal states through two interchangeable channels, and the table below maps them one-to-one:
- CSS className — a class like
ui-<state>is toggled on the root node, so you can style it with selectors such as.ui-<state> { ... }. - Render-prop field — when
childrenis a function, the same state is passed in viachildren({ <state>: boolean, ... })for runtime-driven rendering.
ui-active
Whether the button is currently being pressed (and not disabled).
Applied when `status.active` is true.
ui-disabled
Whether the button is disabled.
Applied when `status.disabled` is true.