chore: v11 FileUploader

For better compatibility with existing codebases sizes `field` and `small` are still supported. Note that flagship implementation does the same thing.
This commit is contained in:
Gregor Wassmann 2023-03-27 17:39:02 +02:00 committed by Enrico Sacchetti
commit 85bbaed3e2
No known key found for this signature in database
GPG key ID: 3374B89ECA60D796
5 changed files with 13 additions and 13 deletions

View file

@ -1361,7 +1361,7 @@ None.
| Prop name | Required | Kind | Reactive | Type | Default value | Description |
| :-------------- | :------- | :--------------- | :------- | -------------------------------------------------------- | ------------------------------------------------ | ------------------------------------------------ |
| status | No | <code>let</code> | No | <code>"uploading" &#124; "edit" &#124; "complete"</code> | <code>"uploading"</code> | Specify the file uploader status |
| size | No | <code>let</code> | No | <code>"default" &#124; "field" &#124; "small"</code> | <code>"default"</code> | Specify the size of button skeleton |
| size | No | <code>let</code> | No | <code>"sm" &#124; "md" &#124; "lg"</code> | <code>"lg"</code> | Specify the size of button skeleton |
| iconDescription | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the ARIA label used for the status icons |
| invalid | No | <code>let</code> | No | <code>boolean</code> | <code>false</code> | Set to `true` to indicate an invalid state |
| errorSubject | No | <code>let</code> | No | <code>string</code> | <code>""</code> | Specify the error subject text |

View file

@ -4263,8 +4263,8 @@
"name": "size",
"kind": "let",
"description": "Specify the size of button skeleton",
"type": "\"default\" | \"field\" | \"small\"",
"value": "\"default\"",
"type": "\"sm\" | \"md\" | \"lg\"",
"value": "\"lg\"",
"isFunction": false,
"isFunctionDeclaration": false,
"isRequired": false,

View file

@ -95,11 +95,11 @@ Use the `errorSubject` and `errorBody` props to customize the error message.
## Item sizes
The default `FileUploaderItem` size is "default".
The default `FileUploaderItem` size is "lg".
<FileUploaderItem size="default" name="README.md" status="uploading" />
<FileUploaderItem size="field" name="README.md" status="uploading" />
<FileUploaderItem size="small" name="README.md" status="uploading" />
<FileUploaderItem size="lg" name="README.md" status="uploading" />
<FileUploaderItem size="md" name="README.md" status="uploading" />
<FileUploaderItem size="sm" name="README.md" status="uploading" />
## Drop container

View file

@ -11,9 +11,9 @@
/**
* Specify the size of button skeleton
* @type {"default" | "field" | "small"}
* @type {"sm" | "md" | "lg"}
*/
export let size = "default";
export let size = "lg";
/** Specify the ARIA label used for the status icons */
export let iconDescription = "";
@ -45,8 +45,8 @@
id="{id}"
class:bx--file__selected-file="{true}"
class:bx--file__selected-file--invalid="{invalid}"
class:bx--file__selected-file--md="{size === 'field'}"
class:bx--file__selected-file--sm="{size === 'small'}"
class:bx--file__selected-file--md="{size === 'md' || size === 'field'}"
class:bx--file__selected-file--sm="{size === 'sm' || size === 'small'}"
{...$$restProps}
on:mouseover
on:mouseenter

View file

@ -12,9 +12,9 @@ export interface FileUploaderItemProps extends RestProps {
/**
* Specify the size of button skeleton
* @default "default"
* @default "lg"
*/
size?: "default" | "field" | "small";
size?: "sm" | "md" | "lg";
/**
* Specify the ARIA label used for the status icons