mcp/carbon-components-svelte
1
0
Fork 0
mirror of https://github.com/carbon-design-system/carbon-components-svelte.git synced 2025-09-15 02:11:05 +00:00
Code Issues Projects Releases Packages Wiki Activity

fix FileUploader (#437)

Browse source 
* fix FileUploader

* FileList -> File[]
This commit is contained in:
water_lift 2020-12-01 10:43:39 +08:00 • committed by GitHub
commit 495ae2780a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 22 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

22
COMPONENT_INDEX.md
View file

@ -1058,7 +1058,7 @@ None.
| Prop name | Kind | Reactive | Type | Default value | Description | | Prop name | Kind | Reactive | Type | Default value | Description |
| :--------------- | :----------------- | :------- | :----------------------------------------------------------------------------------------- | --------------------------------------- | --------------------------------------------------------------------- | | :--------------- | :----------------- | :------- | :----------------------------------------------------------------------------------------- | --------------------------------------- | --------------------------------------------------------------------- |
| files | <code>let</code> | Yes | <code>FileList</code> | <code>[]</code> | Obtain the uploaded file names | | files | <code>let</code> | Yes | <code>File[]</code> | <code>[]</code> | Obtain the uploaded file names |
| status | <code>let</code> | No | <code>"uploading" &#124; "edit" &#124; "complete"</code> | <code>"uploading"</code> | Specify the file uploader status | | status | <code>let</code> | No | <code>"uploading" &#124; "edit" &#124; "complete"</code> | <code>"uploading"</code> | Specify the file uploader status |
| accept | <code>let</code> | No | <code>string[]</code> | <code>[]</code> | Specify the accepted file types | | accept | <code>let</code> | No | <code>string[]</code> | <code>[]</code> | Specify the accepted file types |
| multiple | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to allow multiple files | | multiple | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to allow multiple files |
@ -1076,16 +1076,16 @@ None.
### Events ### Events
| Event name | Type | Detail | | Event name | Type | Detail |
| :--------- | :--------- | :-------------------- | | :--------- | :--------- | :------------------ |
| add | dispatched | <code>FileList</code> | | add | dispatched | <code>File[]</code> |
| remove | dispatched | <code>FileList</code> | | remove | dispatched | <code>File[]</code> |
| click | forwarded | -- | | click | forwarded | -- |
| mouseover | forwarded | -- | | mouseover | forwarded | -- |
| mouseenter | forwarded | -- | | mouseenter | forwarded | -- |
| mouseleave | forwarded | -- | | mouseleave | forwarded | -- |
| change | forwarded | -- | | change | forwarded | -- |
| keydown | forwarded | -- | | keydown | forwarded | -- |
## `FileUploaderButton` ## `FileUploaderButton`

6
docs/src/COMPONENT_API.json
View file

@ -4142,7 +4142,7 @@
"name": "files", "name": "files",
"kind": "let", "kind": "let",
"description": "Obtain the uploaded file names", "description": "Obtain the uploaded file names",
"type": "FileList", "type": "File[]",
"value": "[]", "value": "[]",
"isFunction": false, "isFunction": false,
"constant": false, "constant": false,
@ -4231,8 +4231,8 @@
], ],
"slots": [], "slots": [],
"events": [ "events": [
{ "type": "dispatched", "name": "add", "detail": "FileList" }, { "type": "dispatched", "name": "add", "detail": "File[]" },
{ "type": "dispatched", "name": "remove", "detail": "FileList" }, { "type": "dispatched", "name": "remove", "detail": "File[]" },
{ "type": "forwarded", "name": "click", "element": "div" }, { "type": "forwarded", "name": "click", "element": "div" },
{ "type": "forwarded", "name": "mouseover", "element": "div" }, { "type": "forwarded", "name": "mouseover", "element": "div" },
{ "type": "forwarded", "name": "mouseenter", "element": "div" }, { "type": "forwarded", "name": "mouseenter", "element": "div" },

10
src/FileUploader/FileUploader.svelte
View file

@ -1,7 +1,7 @@
<script> <script>
/** /**
* @event {FileList} add * @event {File[]} add
* @event {FileList} remove * @event {File[]} remove
*/ */
/** /**
@ -18,7 +18,7 @@
/** /**
* Obtain the uploaded file names * Obtain the uploaded file names
* @type {FileList} * @type {File[]}
*/ */
export let files = []; export let files = [];
@ -95,11 +95,11 @@
kind="{kind}" kind="{kind}"
on:change on:change
on:change="{({ target }) => { on:change="{({ target }) => {
files = [...target.files].map(({ name }) => name); files = [...target.files];
}}" }}"
/> />
<div class:bx--file-container="{true}"> <div class:bx--file-container="{true}">
{#each files as name, i (name)} {#each files as { name }, i (name)}
<span class:bx--file__selected-file="{true}"> <span class:bx--file__selected-file="{true}">
<p class:bx--file-filename="{true}">{name}</p> <p class:bx--file-filename="{true}">{name}</p>
<span class:bx--file__state-container="{true}"> <span class:bx--file__state-container="{true}">

6
types/FileUploader/FileUploader.d.ts vendored
View file

@ -17,7 +17,7 @@ export interface FileUploaderProps extends svelte.JSX.HTMLAttributes<HTMLElement
* Obtain the uploaded file names * Obtain the uploaded file names
* @default [] * @default []
*/ */
files?: FileList; files?: File[];
/** /**
* Set to `true` to allow multiple files * Set to `true` to allow multiple files
@ -73,8 +73,8 @@ export default class FileUploader {
$$prop_def: FileUploaderProps; $$prop_def: FileUploaderProps;
$$slot_def: {}; $$slot_def: {};
$on(eventname: "add", cb: (event: CustomEvent<FileList>) => void): () => void; $on(eventname: "add", cb: (event: CustomEvent<File[]>) => void): () => void;
$on(eventname: "remove", cb: (event: CustomEvent<FileList>) => void): () => void; $on(eventname: "remove", cb: (event: CustomEvent<File[]>) => void): () => void;
$on(eventname: "click", cb: (event: WindowEventMap["click"]) => void): () => void; $on(eventname: "click", cb: (event: WindowEventMap["click"]) => void): () => void;
$on(eventname: "mouseover", cb: (event: WindowEventMap["mouseover"]) => void): () => void; $on(eventname: "mouseover", cb: (event: WindowEventMap["mouseover"]) => void): () => void;
$on(eventname: "mouseenter", cb: (event: WindowEventMap["mouseenter"]) => void): () => void; $on(eventname: "mouseenter", cb: (event: WindowEventMap["mouseenter"]) => void): () => void;