Skip to main content

Input

Components​

The Input component family provides the following components:

ActiveImageInput​

A component to handle input of an image and upload it (active)

You can import the ActiveImageInput component from the input component family in the @freesewing/react package:

Javascript
import { ActiveImageInput } from "@freesewing/react/components/Input"

ButtonFrame​

A component to wrap content in a button

You can import the ButtonFrame component from the input component family in the @freesewing/react package:

Javascript
import { ButtonFrame } from "@freesewing/react/components/Input"

DesignInput​

A component to handle input of a design name (a select)

You can import the DesignInput component from the input component family in the @freesewing/react package:

Javascript
import { DesignInput } from "@freesewing/react/components/Input"

EmailInput​

A component to handle input of email addresses

You can import the EmailInput component from the input component family in the @freesewing/react package:

Javascript
import { EmailInput } from "@freesewing/react/components/Input"

Fieldset​

A component for a fieldset, which wraps form elements and providers labels.

You can import the Fieldset component from the input component family in the @freesewing/react package:

Javascript
import { Fieldset } from "@freesewing/react/components/Input"

FileInput​

A component to handle input of file (upload)

You can import the FileInput component from the input component family in the @freesewing/react package:

Javascript
import { FileInput } from "@freesewing/react/components/Input"

ImageInput​

A component to handle input of an image

You can import the ImageInput component from the input component family in the @freesewing/react package:

Javascript
import { ImageInput } from "@freesewing/react/components/Input"

ListInput​

A component to handle input of list of items to pick from

You can import the ListInput component from the input component family in the @freesewing/react package:

Javascript
import { ListInput } from "@freesewing/react/components/Input"

MarkdownInput​

A component to handle input of markdown content

You can import the MarkdownInput component from the input component family in the @freesewing/react package:

Javascript
import { MarkdownInput } from "@freesewing/react/components/Input"

MeasurementInput​

A component to handle input of markdown content

You can import the MeasurementInput component from the input component family in the @freesewing/react package:

Javascript
import { MeasurementInput } from "@freesewing/react/components/Input"

MfaInput​

A component to handle input of MFA codes. Essentially a NumberInput with some default props set.

You can import the MfaInput component from the input component family in the @freesewing/react package:

Javascript
import { MfaInput } from "@freesewing/react/components/Input"

NumberInput​

A component to handle input of numbers

You can import the NumberInput component from the input component family in the @freesewing/react package:

Javascript
import { NumberInput } from "@freesewing/react/components/Input"

PassiveImageInput​

A component to handle input of an image and not upload it (inactive)

You can import the PassiveImageInput component from the input component family in the @freesewing/react package:

Javascript
import { PassiveImageInput } from "@freesewing/react/components/Input"

PasswordInput​

A component to handle input of passwords

You can import the PasswordInput component from the input component family in the @freesewing/react package:

Javascript
import { PasswordInput } from "@freesewing/react/components/Input"

StringInput​

A component to handle input of strings (single-line text)

You can import the StringInput component from the input component family in the @freesewing/react package:

Javascript
import { StringInput } from "@freesewing/react/components/Input"

ToggleInput​

A component to handle input of booleans (yes/no or on/off)

You can import the ToggleInput component from the input component family in the @freesewing/react package:

Javascript
import { ToggleInput } from "@freesewing/react/components/Input"