V99TextField

I. Props

Name	Type	Default	Description
style	ViewStyle | undefined	-	Set style of V99TextField
title	string	-	Set title
description	string	-	Set description
type	'success' | 'error' | 'warning'	large	The description type of V99TextField
textarea	boolean	false	If true, show TextArea. The default value is false.

II. Usage

import { V99TextField } from 'v99-kits'

III. textFields type & textFieldToken

• TextField default
• TextField disable
• TextField default type success
• TextField default type error
• TextField default type warning disable

1. TextField default

Example

        <V99Box paddingHorizontal={V99Spacing.s16} paddingTop={V99Spacing.s20}>
            <V99Text T1 marginVertical={V99Spacing.s16}>
                TextField default
            </V99Text>
            <V99TextField
                title={'Title'}
                placeholder={'Content'}
                description={'This is the description area'}
                autoCapitalize={'words'}
            />
        </V99Box>

Demo

2. TextField disable

Example

        <V99Box paddingHorizontal={V99Spacing.s16} paddingTop={V99Spacing.s20}>
            <V99Text T1 marginVertical={V99Spacing.s16}>
                TextField disable
            </V99Text>
            <V99TextField
                title={'Title'}
                placeholder={'Content'}
                description={'This is the description area'}
                disabled={true}
            />
        </V99Box>

Demo

3. TextField default type success

Example

        <V99Box paddingHorizontal={V99Spacing.s16} paddingTop={V99Spacing.s20}>
            <V99Text T1 marginVertical={V99Spacing.s16}>
                TextField default type success
            </V99Text>
            <V99TextField
                title={'Title'}
                placeholder={'Content'}
                description={'This is the description area'}
                type={'success'}
            />
        </V99Box>

Demo

4. TextField area type error

Example

        <V99Box paddingHorizontal={V99Spacing.s16} paddingTop={V99Spacing.s20}>
            <V99Text T1 marginVertical={V99Spacing.s16}>
                TextField area type error
            </V99Text>
            <V99TextField
                title={'Title'}
                placeholder={'Content'}
                description={'This is the description area'}
                type={'error'}
                textarea
            />
        </V99Box>

Demo

5. TextField area type warning disable

Example

        <V99Box paddingHorizontal={V99Spacing.s16} paddingTop={V99Spacing.s20}>
            <V99Text T1 marginVertical={V99Spacing.s16}>
                TextField area type warning disable
            </V99Text>
            <V99TextField
                title={'Title'}
                placeholder={'Content'}
                description={'This is the description area'}
                type={'warning'}
                textarea
                disabled
            />
        </V99Box>

Demo