Yamada UIにスターをあげる

スター
Yamada UIYamada UIv1.7.2

FileInput

FileInputは、ユーザーがファイルを選択するために使用されるコンポーネントです。

ソース@yamada-ui/file-input

Props

FileInputProps

colorScheme

説明

The visual color appearance of the component.

タイプ

"blackAlpha" | "whiteAlpha" | "amber" | "blue" | "info" | "link" | "primary" | "cyan" | "emerald" | "flashy" | "fuchsia" | "gray" | "green" | "success" | "indigo" | "lime" | "neutral" | "orange" | "warning" | "pink" | "purple" | "red" | "danger" | "rose" | "sky" | "teal" | "violet" | "secondary" | "yellow"

component

説明

The component that displays uploaded files.

タイプ

FC<{ index: number; value: File }>

defaultValue

説明

The initial value of the file input.

タイプ

File[]

disabled

説明

If true, the form control will be disabled.

タイプ

boolean

デフォルト

false

errorBorderColor

説明

The border color when the input is invalid.

タイプ

"border" | BorderColor | "amber.50" | "amber.100" | "amber.200" | "amber.300" | "amber.400" | "amber.500" | "amber.600" | "amber.700" | "amber.800" | "amber.900" | ... 320 more ... | [...]

focusBorderColor

説明

The border color when the input is focused.

タイプ

"border" | BorderColor | "amber.50" | "amber.100" | "amber.200" | "amber.300" | "amber.400" | "amber.500" | "amber.600" | "amber.700" | "amber.800" | "amber.900" | ... 320 more ... | [...]

format

説明

A callback that formats the name of the uploaded file.

タイプ

(value: File, index: number) => string

invalid

説明

If true, the form control will be invalid.

タイプ

boolean

デフォルト

false

isDisabled

非推奨

説明

If true, the form control will be disabled.

非推奨

Use disabled instead.

タイプ

boolean

デフォルト

false

isInvalid

非推奨

説明

If true, the form control will be invalid.

非推奨

Use invalid instead.

タイプ

boolean

デフォルト

false

isReadOnly

非推奨

説明

If true, the form control will be readonly.

非推奨

Use readOnly instead.

タイプ

boolean

デフォルト

false

isRequired

非推奨

説明

If true, the form control will be required.

非推奨

Use required instead.

タイプ

boolean

デフォルト

false

onChange

説明

Function to be called when a file change event occurs.

タイプ

(files: File[] | undefined) => void

readOnly

説明

If true, the form control will be readonly.

タイプ

boolean

デフォルト

false

required

説明

If true, the form control will be required.

タイプ

boolean

デフォルト

false

resetRef

説明

Ref to a reset function.

タイプ

type ONLY_FOR_FORMAT = | ((instance: (() => void) | null) => void) | MutableRefObject<(() => void) | null>

separator

説明

The string to separate uploaded files.

タイプ

string

デフォルト

','

size

説明

The size of the FileInput.

タイプ

"xs" | "sm" | "md" | "lg" | "xl"

デフォルト

"md"

value

説明

The value of the file input.

タイプ

File[]

variant

説明

The variant of the FileInput.

タイプ

"filled" | "flushed" | "outline" | "unstyled"

デフォルト

"outline"

GitHubでこのページを編集する

ColorPickerFileButton