Components

InputSearch

A text field component that allows users to search. It provides a customizable input field with support for left and right icons and different sizes. Based on React Native TextInput component.

Usage

Screen.tsx

import { InputSearch } from "@/craftrn-ui/components/InputSearch";
 
export const Screen = () => (
  <InputSearch
    placeholder="Search for a destination"
    leftAccessory={
      <View style={styles.leftAccessory}>
        <Search color={theme.colors.contentTertiary} />
      </View>
    }
    rightAccessory={
      <ButtonRound
        renderIcon={(size) => (
          <Slider size={size} color={theme.colors.contentTertiary} />
        )}
        onPress={() => {}}
      />
    }
  />
);

A component that allows users to enter an OTP (One-Time Password) code. It displays a series of input fields, each containing a single character. It also provides a way to import the OTP code from SMS.

InputText

A text field component that allows users to input text. It provides a customizable input field with support for left and right icons and different sizes. Based on React Native TextInput component.

InputSearch

Usage

Props

On this page