FileInput

FileInput is a simple input field.

Code Example

<script setup lang="ts">
const value = ref('')
</script>

<template>
  <FileInput />
</template>

Components

FileInput is a standalone component.

FileInput can be customized with the following props:

Prop	Type	Description
`join`	boolean	Use inside Join to group items together.
`color`	string	Sets the color to one of the below prop names.
neutral	boolean	Sets the color to neutral.
primary	boolean	Sets the color to primary.
secondary	boolean	Sets the color to secondary.
accent	boolean	Sets the color to accent.
info	boolean	Sets the color to info.
success	boolean	Sets the color to success.
warning	boolean	Sets the color to warning.
error	boolean	Sets the color to error.
`bordered`	boolean	Enables the bordered style on the button
`ghost`	boolean	Enables the ghost style on the button
`disabled`	boolean	Disables the button both visually and functionally.
`size`	string	Sets the size. Can be set to one of the below size prop names.
`lg`	boolean	Sets the size to `lg`
`md`	boolean	Sets the size to `md` (the default)
`sm`	boolean	Sets the size to `sm`
`xs`	boolean	Sets the size to `xs`

Code Example

<FileInput primary />

The bordered prop adds a base-colored bordered around the input.

Code Example

<FileInput bordered />

The ghost prop removes the background.

Code Example

<FileInput ghost />

Code Example

<FileInput disabled />

Code Example

<FileInput lg />