Skip to main content
161

Search Lumen

Find components, APIs, guides, and recipes.

GitHub
React Native docs
FeedbackReact Native

Status bar

Present compact textual application status with optional trailing content.

Public APILumenStatusBarReact Native

Native example

Use Status bar

Use for compact persistent application status. Do not replace system status bars or navigation chrome.

View verified React Native runtime capture
Status bar rendered in the Expo web renderer Lumen playground
Verified runtime captureExpo web renderer
tsx
<LumenStatusBar
  message="All changes saved"
  tone="success"
  trailing={<LumenText variant="caption">Just now</LumenText>}
/>

Reference

Public API

The primary shared and platform-specific options exposed by LumenStatusBar.

APIValues or typeDefaultDescription
messagestringRequiredProvides the textual status.
toneneutral · brand · accent · success · warning · dangerneutralSelects the semantic dot color.
trailingReactNodeundefinedProvides optional trailing content.

Native behavior

Design and accessibility

When to use it

Use for compact persistent application status. Do not replace system status bars or navigation chrome.

Accessibility

The visible status dot is decorative; the message carries status meaning in text. Trailing controls retain independent semantics.

Shared component

Available on other platforms

Apple / SwiftUIAndroid / Compose
React Native docsNative primitives