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

Run "yarn build:docs"

Browse source
This commit is contained in:
Eric Liu 2022-02-21 10:25:40 -08:00
commit 65bbef12c5
3 changed files with 45 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

43
COMPONENT_INDEX.md
View file

@ -1328,18 +1328,19 @@ None.
### Props ### Props
| Prop name | Kind | Reactive | Type | Default value | Description | | Prop name | Kind | Reactive | Type | Default value | Description |
| :------------ | :--------------- | :------- | :----------------------------------------- | ------------------------------------------------ | ------------------------------------------------------------------------------------------------------------ | | :------------ | :--------------- | :------- | :---------------------------------------- | ------------------------------------------------ | ------------------------------------------------------------------------------------------------------------ |
| ref | <code>let</code> | Yes | <code>null &#124; HTMLInputElement</code> | <code>null</code> | Obtain a reference to the input HTML element | | ref | <code>let</code> | Yes | <code>null &#124; HTMLInputElement</code> | <code>null</code> | Obtain a reference to the input HTML element |
| accept | <code>let</code> | No | <code>string[]</code> | <code>[]</code> | Specify the accepted file types | | files | <code>let</code> | Yes | <code>File[]</code> | <code>[]</code> | Obtain a reference to the uploaded files |
| multiple | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to allow multiple files | | accept | <code>let</code> | No | <code>string[]</code> | <code>[]</code> | Specify the accepted file types |
| validateFiles | <code>let</code> | No | <code>(files: FileList) => FileList</code> | <code>(files) => files</code> | Override the default behavior of validating uploaded files<br />The default behavior does not validate files | | multiple | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to allow multiple files |
| labelText | <code>let</code> | No | <code>string</code> | <code>"Add file"</code> | Specify the label text | | validateFiles | <code>let</code> | No | <code>(files: File) => File</code> | <code>(files) => files</code> | Override the default behavior of validating uploaded files<br />The default behavior does not validate files |
| role | <code>let</code> | No | <code>string</code> | <code>"button"</code> | Specify the `role` attribute of the drop container | | labelText | <code>let</code> | No | <code>string</code> | <code>"Add file"</code> | Specify the label text |
| disabled | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the input | | role | <code>let</code> | No | <code>string</code> | <code>"button"</code> | Specify the `role` attribute of the drop container |
| tabindex | <code>let</code> | No | <code>string</code> | <code>"0"</code> | Specify `tabindex` attribute | | disabled | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to disable the input |
| id | <code>let</code> | No | <code>string</code> | <code>"ccs-" + Math.random().toString(36)</code> | Set an id for the input element | | tabindex | <code>let</code> | No | <code>string</code> | <code>"0"</code> | Specify `tabindex` attribute |
| name | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify a name attribute for the input | | id | <code>let</code> | No | <code>string</code> | <code>"ccs-" + Math.random().toString(36)</code> | Set an id for the input element |
| name | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify a name attribute for the input |
### Slots ### Slots
@ -1349,15 +1350,15 @@ None.
### Events ### Events
| Event name | Type | Detail | | Event name | Type | Detail |
| :--------- | :--------- | :-------------------- | | :--------- | :--------- | :------------------ |
| add | dispatched | <code>FileList</code> | | add | dispatched | <code>File[]</code> |
| dragover | forwarded | -- | | change | dispatched | <code>File[]</code> |
| dragleave | forwarded | -- | | dragover | forwarded | -- |
| drop | forwarded | -- | | dragleave | forwarded | -- |
| keydown | forwarded | -- | | drop | forwarded | -- |
| change | forwarded | -- | | keydown | forwarded | -- |
| click | forwarded | -- | | click | forwarded | -- |
## `FileUploaderItem` ## `FileUploaderItem`

17
docs/src/COMPONENT_API.json
View file

@ -3749,6 +3749,17 @@
"constant": false, "constant": false,
"reactive": false "reactive": false
}, },
{
"name": "files",
"kind": "let",
"description": "Obtain a reference to the uploaded files",
"type": "File[]",
"value": "[]",
"isFunction": false,
"isFunctionDeclaration": false,
"constant": false,
"reactive": true
},
{ {
"name": "multiple", "name": "multiple",
"kind": "let", "kind": "let",
@ -3764,7 +3775,7 @@
"name": "validateFiles", "name": "validateFiles",
"kind": "let", "kind": "let",
"description": "Override the default behavior of validating uploaded files\nThe default behavior does not validate files", "description": "Override the default behavior of validating uploaded files\nThe default behavior does not validate files",
"type": "(files: FileList) => FileList", "type": "(files: File) => File",
"value": "(files) => files", "value": "(files) => files",
"isFunction": true, "isFunction": true,
"isFunctionDeclaration": false, "isFunctionDeclaration": false,
@ -3858,12 +3869,12 @@
} }
], ],
"events": [ "events": [
{ "type": "dispatched", "name": "add", "detail": "FileList" }, { "type": "dispatched", "name": "add", "detail": "File[]" },
{ "type": "dispatched", "name": "change", "detail": "File[]" },
{ "type": "forwarded", "name": "dragover", "element": "div" }, { "type": "forwarded", "name": "dragover", "element": "div" },
{ "type": "forwarded", "name": "dragleave", "element": "div" }, { "type": "forwarded", "name": "dragleave", "element": "div" },
{ "type": "forwarded", "name": "drop", "element": "div" }, { "type": "forwarded", "name": "drop", "element": "div" },
{ "type": "forwarded", "name": "keydown", "element": "label" }, { "type": "forwarded", "name": "keydown", "element": "label" },
{ "type": "forwarded", "name": "change", "element": "input" },
{ "type": "forwarded", "name": "click", "element": "input" } { "type": "forwarded", "name": "click", "element": "input" }
], ],
"typedefs": [], "typedefs": [],

12
types/FileUploader/FileUploaderDropContainer.svelte.d.ts vendored
View file

@ -9,6 +9,12 @@ export interface FileUploaderDropContainerProps
*/ */
accept?: string[]; accept?: string[];
/**
* Obtain a reference to the uploaded files
* @default []
*/
files?: File[];
/** /**
* Set to `true` to allow multiple files * Set to `true` to allow multiple files
* @default false * @default false
@ -20,7 +26,7 @@ export interface FileUploaderDropContainerProps
* The default behavior does not validate files * The default behavior does not validate files
* @default (files) => files * @default (files) => files
*/ */
validateFiles?: (files: FileList) => FileList; validateFiles?: (files: File) => File;
/** /**
* Specify the label text * Specify the label text
@ -68,12 +74,12 @@ export interface FileUploaderDropContainerProps
export default class FileUploaderDropContainer extends SvelteComponentTyped< export default class FileUploaderDropContainer extends SvelteComponentTyped<
FileUploaderDropContainerProps, FileUploaderDropContainerProps,
{ {
add: CustomEvent<FileList>; add: CustomEvent<File[]>;
change: CustomEvent<File[]>;
dragover: WindowEventMap["dragover"]; dragover: WindowEventMap["dragover"];
dragleave: WindowEventMap["dragleave"]; dragleave: WindowEventMap["dragleave"];
drop: WindowEventMap["drop"]; drop: WindowEventMap["drop"];
keydown: WindowEventMap["keydown"]; keydown: WindowEventMap["keydown"];
change: WindowEventMap["change"];
click: WindowEventMap["click"]; click: WindowEventMap["click"];
}, },
{ labelText: {} } { labelText: {} }