file-input · Admiral UI kit

Example

Portrait

Pick an image to see the thumbnail.

Laravel

<x-admin::file-input name="g_portrait" label="Portrait" accept="image/*" hint="Pick an image to see the thumbnail." />

Props

Prop	Required	Default	Options
`name`		`null`
`label`		`null`
`hint`		`null`
`error`		`null`
`id`		`null`
`accept`		`null`
`multiple`		`false`
`current`		`null`
`removable`		`false`
`optional`		`false`
`required`		`false`

Other attributes, such as wire:model or data-*, pass through to the element.

Other stacks

React and Vue: import { FileInput } from "@admiral/ui-kit/react" (or /vue). See the React and Vue guide.

HTML, for any stack

<div class="adm-field">
            <label class="adm-label" for="g_portrait">Portrait</label>
        <div class="adm-file">
                    <img class="adm-file__preview" data-adm-file-preview alt=""  hidden >
                <input
            type="file"
             name="g_portrait"              id="g_portrait"              accept="image/*"                                                  aria-describedby="g_portrait-hint"             class="adm-file__input"
        >
    </div>
    <span class="adm-hint" id="g_portrait-hint">Pick an image to see the thumbnail.</span>    </div>