23 lines
1 KiB
TypeScript
23 lines
1 KiB
TypeScript
import './File.sass'
|
|
import { FileField } from '@kobalte/core/file-field'
|
|
|
|
export default () => {
|
|
return (
|
|
<>
|
|
<FileField class="filefield" maxFiles={1} onFileAccept={(data) => console.log('data', data)} onFileReject={(data) => console.log('data', data)} onFileChange={(data) => console.log('data', data)}>
|
|
<FileField.Dropzone class="filefield__dropzone">Drag and drop or click to upload file</FileField.Dropzone>
|
|
<FileField.HiddenInput />
|
|
<FileField.ItemList class="filefield__itemList">
|
|
{() => (
|
|
<FileField.Item class="filefield__item">
|
|
<FileField.ItemPreviewImage class="filefield__itemPreviewImage" />
|
|
<FileField.ItemName class="filefield__itemName" />
|
|
<FileField.ItemSize class="filefield__itemSize" />
|
|
<FileField.ItemDeleteTrigger class="filefield__itemDeleteTrigger">Delete</FileField.ItemDeleteTrigger>
|
|
</FileField.Item>
|
|
)}
|
|
</FileField.ItemList>
|
|
</FileField>
|
|
</>
|
|
)
|
|
}
|