Button

const Button: ForwardRefExoticComponent<ButtonProps & RefAttributes<ButtonHandle>>;

Focusable button that triggers an action on Enter or Space.

Examples

<Button
  label="Save"
  onPress={() => save()}
  style={{ border: "round", paddingX: 2 }}
  focusedStyle={{ bg: "cyan", color: "black" }}
/>

// Using children for custom content
<Button onPress={handleClick}>
  <Text style={{ bold: true }}>🚀 Launch</Text>
</Button>

---

Properties

Property	Type	Description
children?	ReactNode	Custom content. Takes precedence over label when both are provided.
disabled?	boolean	When true, the button is skipped in the focus order and ignores input.
focusedStyle?	Style	Style applied when the button is focused (merged with style).
label?	string	Shorthand text label. When provided and children is absent, renders the label as text.
onPress?	() => void	Callback fired when the button is activated (Enter or Space).
style?	Style	Base style for the button container.

---

ButtonHandle

Handle for Button

Extends

• FocusableHandle

Methods

blur()

blur(): void;

Programmatically blur (unfocus) this element

Returns

void

Inherited from

FocusableHandle.blur

---

focus()

focus(): void;

Programmatically focus this element

Returns

void

Inherited from

FocusableHandle.focus

---

scrollIntoView()

scrollIntoView(options?): void;

Scroll the nearest parent ScrollView to make this element visible. Behaves like the DOM Element.scrollIntoView() method. No-op if the element is not inside a ScrollView.

Parameters

Parameter	Type	Description
options?	ScrollIntoViewOptions	Alignment options (default: { block: "nearest" })

Returns

void

Example

const inputRef = useRef<InputHandle>(null);

// Minimal scroll — just enough to make it visible
inputRef.current?.scrollIntoView();

// Center the element in the viewport
inputRef.current?.scrollIntoView({ block: "center" });

Inherited from

FocusableHandle.scrollIntoView

Properties

Property	Modifier	Type	Description	Inherited from
isFocused	readonly	boolean	Whether this element is currently focused	FocusableHandle.isFocused