AuthContext
AuthContext, set up a React Context
Create universal native apps with React that run on Android, iOS, and the web. Iterate with confidence.
View all tagsAuthContext, set up a React Context
A package to implement almost full authentication and protect routes with Expo Router.
Avatars can be used to represent people or objects. It supports images, Icons, or letters.
Small numerical value or status descriptor for UI elements.
To use a icon font, you have to make sure you import them into your project. Only after the font is loaded, you can use Icon set.
Bottom sheets are surfaces containing supplementary content, anchored to the bottom of the screen.
FlexNative Buttons package is part of FlexNative for React Native, it provides a clickable UI library and functionality.
The CheckBox is typically used to represent boolean values via a binary checked state.
React component that allows users to select items from a list.
FlexNative provides a number of built-in Core Components ready for you to use in your app.
This section show how to consume (use) theme colors for your components.
@flexnative/icons package uses custom icon fonts created based on a IcoMoon.
BaseTheme\
The following examples demonstrates the FlexNative Check List in action.
The following examples demonstrates the Numeric Text Boxes in action.
The following examples demonstrates the Text Boxes in action.
The theme object is where you define your application's color palette, type scale, borders, border radius values, and more.
This guide provides an example that demonstrates how to implement authentication and protect routes with Expo Router using @flexnative/authentication.
Below example shows a full example how to extend ThemeProvider and implement setColorScheme method to support to dark mode
Component
This function abstracts away the complexities of fetching stored items differently based on the execution context, providing a simple and unified API for retrieving data across different environments.
FlexNative is a component library that enables developers to build universal design systems.
Block component it is a wrapper over the React-Native View component,
AvatarGroup is part of the @flexnative/avatar package.
Avatar with icons.
FlexNative suite delivers more than integrated font icons for its components.
Avatar with images.
FlexNative Inputs package is part of FlexNative for React Native,
FlexNative is a component library that enables developers to build universal design systems.
Useful components for creating responsive and consistent layouts, the FlexNative Layout component provides a powerful
The Local Storage Packages is part of FlexNative, that provides an asynchronous, unencrypted, persistent, key-value storage API.
The following examples demonstrates the FlexNative Check List in action.
The following examples demonstrates the Numeric Text Boxes in action.
The following examples demonstrates the Text Boxes in action.
Component to display messages that require attention with colored message blocks,
Useful components related with Navigation.
API
This function is designed to abstract away the complexities of environment-specific storage management, allowing for consistent storage operations across various platforms.
FlexNative ThemeProvider is part of FlexNative and is a component that makes the theme available throughout your app.
API
The FlexNative Skeleton Loading is part of the FlexNative and is available under the @flexnative/skeleton-loading NPM package.
Spinner is part of the @flexnative/icons package.
The FlexNative Tags is part of the FlexNative and is available under the @flexnative/tags NPM package.
API
Avatar with text.
The FlexNative Theme Context is part of the FlexNative and is available under the @flexnative/theme-context NPM package.
useAuthState is a basic hook that persists tokens securely on native with expo-secure-store and in local storage on web.
The following example demonstrates the Icons in action.
Some utilities methods related with Authentication.