Input

Installing

Install the component

npm install @supabase/ui

Getting started

Import the component

import { Input } from '@supabase/ui'

Basic

An Input component will default to using type="text". You can define a label.

type can be used to show what kind of input you need. It supports all Input types, except for the following:

• Number, use InputNumber
• Radio, use Radio
• Checkbox, use Checkbox

Input labels

You can use label, descriptionText and labelOptional to illustrate what your Input is for and demonstrate to the user what they need to input.

Icon

use Icon to inject any Icon component you like.

Copy value

Use copy to add a copy button. It will copy the value of value

Reveal and copy

Use copy to add a copy button. It will copy the value of value

Actions

Use actions to inject any React.ReactNode jsx

Error

Use error with a string to show an error message

Text Area

Use <Input.TextArea> to use a text area input

Text Area with limit

Use <Input.TextArea> to use a text area input

API Reference

Input

Input.TextArea

Coming soon