Button Options

const options = {

topBar: {

leftButtons: [

{

id: 'id',

text: 'Button',

},

],

},

};

allCaps

This option will set whether characters are all capitalized or not.

Type	Required	Platform	Default
boolean	No	Android	true

fontSize

If the button has text, this option is used to set font size in DP.

Type	Required	Platform
number	No	Both

fontFamily

Type	Required	Platform
string	No	Both

fontStyle

Type	Required	Platform
enum('normal', 'italic')	No	Both

fontWeight

Type	Required	Platform
enum('normal', 'bold', '100', '200', '300', '400', '500', '600', '700', '800', '900')	No	Both

id

Buttons are identified by their id property. When a button is clicked, a buttonPress event is emitted to js, containing the id of the clicked button.

Type	Required	Platform
string	Yes	Both

icon

Button icon. If the button is pushed to the overflow menu, the button text is used instead.

Type	Required	Platform
ImageResource	No	Both

sfSymbol

SF Symbol to show as the back button

Type	Required	Platform
string	No	iOS 13+

text

Button text. Ignored if an icon is specified, unless the button is displayed in the overflow menu.

Type	Required	Platform
string	No	Both

showAsAction

Type	Required	Platform
enum('always', 'never', 'withText', 'ifRoom')	No	Android

• ifRoom - Only add button to the TopBar if there is room for it, otherwise add it to the overflow menu.
• never - Never place this button in the TopBar. Instead, list the button in the overflow menu.
• always - Always place this button in the app bar.

component

Set a react component as this button's view which will be displayed instead of the regular view.

Type	Required	Platform
Component	No	Both

iconInsets

IconInsets are applied to the icon to translate its original position on the screen.

Type	Required	Platform
IconInsets	No	iOS

systemItem

System icon; ignored if an icon is specified. For more information, see apple's guidelines.

Type	Required	Platform
enum('done', 'cancel', 'edit', 'save', 'add', 'flexibleSpace', 'fixedSpace', 'compose', 'reply', 'action', 'organize', 'bookmarks', 'search', 'refresh', 'stop', 'camera', 'trash', 'play', 'pause', 'rewind', 'fastForward', 'undo', 'redo')	No	iOS

iconBackground

iconBackground is applied to the icon's background.

Type	Required	Platform
iconBackground	No	Both

hideSharedBackground

Hide the shared Liquid-Glass / Platter background that UIKit draws behind every bar button item starting with iOS 26. RNN defaults this to true for buttons that paint their own chrome (custom react component views and icons with iconBackground) so the system Platter does not double-decorate them. Set to false to keep the system-drawn background.

Type	Required	Platform	Default
boolean	No	iOS 26+	true