@vaadin/upload 25.0.0-alpha7 → 25.0.0-alpha9

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vaadin/upload",
3
- "version": "25.0.0-alpha7",
3
+ "version": "25.0.0-alpha9",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -21,6 +21,8 @@
21
21
  "type": "module",
22
22
  "files": [
23
23
  "src",
24
+ "!src/styles/*-base-styles.d.ts",
25
+ "!src/styles/*-base-styles.js",
24
26
  "theme",
25
27
  "vaadin-*.d.ts",
26
28
  "vaadin-*.js",
@@ -35,17 +37,17 @@
35
37
  ],
36
38
  "dependencies": {
37
39
  "@open-wc/dedupe-mixin": "^1.3.0",
38
- "@vaadin/a11y-base": "25.0.0-alpha7",
39
- "@vaadin/button": "25.0.0-alpha7",
40
- "@vaadin/component-base": "25.0.0-alpha7",
41
- "@vaadin/progress-bar": "25.0.0-alpha7",
42
- "@vaadin/vaadin-lumo-styles": "25.0.0-alpha7",
43
- "@vaadin/vaadin-themable-mixin": "25.0.0-alpha7",
40
+ "@vaadin/a11y-base": "25.0.0-alpha9",
41
+ "@vaadin/button": "25.0.0-alpha9",
42
+ "@vaadin/component-base": "25.0.0-alpha9",
43
+ "@vaadin/progress-bar": "25.0.0-alpha9",
44
+ "@vaadin/vaadin-lumo-styles": "25.0.0-alpha9",
45
+ "@vaadin/vaadin-themable-mixin": "25.0.0-alpha9",
44
46
  "lit": "^3.0.0"
45
47
  },
46
48
  "devDependencies": {
47
- "@vaadin/chai-plugins": "25.0.0-alpha7",
48
- "@vaadin/test-runner-commands": "25.0.0-alpha7",
49
+ "@vaadin/chai-plugins": "25.0.0-alpha9",
50
+ "@vaadin/test-runner-commands": "25.0.0-alpha9",
49
51
  "@vaadin/testing-helpers": "^2.0.0",
50
52
  "sinon": "^18.0.0"
51
53
  },
@@ -53,5 +55,5 @@
53
55
  "web-types.json",
54
56
  "web-types.lit.json"
55
57
  ],
56
- "gitHead": "87f72707ce6866892f8be5782fa0da008e87dcbc"
58
+ "gitHead": "bbe4720721e0955ffc87a79b412bee38b1f0eb1e"
57
59
  }
@@ -0,0 +1,8 @@
1
+ /**
2
+ * @license
3
+ * Copyright (c) 2016 - 2025 Vaadin Ltd.
4
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
5
+ */
6
+ import type { CSSResult } from 'lit';
7
+
8
+ export const uploadStyles: CSSResult;
@@ -0,0 +1,58 @@
1
+ /**
2
+ * @license
3
+ * Copyright (c) 2016 - 2025 Vaadin Ltd.
4
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
5
+ */
6
+ import '@vaadin/component-base/src/style-props.js';
7
+ import { css } from 'lit';
8
+
9
+ export const uploadStyles = css`
10
+ :host {
11
+ background: var(--vaadin-upload-background, transparent);
12
+ border: var(
13
+ --vaadin-upload-border,
14
+ var(--vaadin-upload-border-width, 1px) solid var(--vaadin-upload-border-color, var(--vaadin-border-color))
15
+ );
16
+ border-radius: var(--vaadin-upload-border-radius, var(--vaadin-radius-m));
17
+ box-sizing: border-box;
18
+ display: flex;
19
+ flex-direction: column;
20
+ padding: var(--vaadin-upload-padding, var(--vaadin-padding));
21
+ position: relative;
22
+ }
23
+
24
+ :host([dragover-valid]) {
25
+ --vaadin-upload-background: var(--vaadin-background-container);
26
+ --vaadin-upload-border: 1px dashed var(--vaadin-color);
27
+ }
28
+
29
+ :host([hidden]) {
30
+ display: none !important;
31
+ }
32
+
33
+ [hidden] {
34
+ display: none !important;
35
+ }
36
+
37
+ [part='primary-buttons'] {
38
+ align-items: center;
39
+ display: flex;
40
+ gap: var(--vaadin-gap-container-inline);
41
+ }
42
+
43
+ [part='drop-label'] {
44
+ align-items: center;
45
+ color: var(--vaadin-upload-drop-label-color, var(--vaadin-color));
46
+ display: flex;
47
+ font-size: var(--vaadin-upload-drop-label-font-size, inherit);
48
+ font-weight: var(--vaadin-upload-drop-label-font-weight, inherit);
49
+ gap: var(--vaadin-upload-drop-label-gap, var(--vaadin-gap-container-inline));
50
+ line-height: var(--vaadin-upload-drop-label-line-height, inherit);
51
+ }
52
+
53
+ :host([nodrop]) {
54
+ --vaadin-upload-border: none;
55
+ --vaadin-upload-border-radius: 0;
56
+ --vaadin-upload-padding: 0;
57
+ }
58
+ `;
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * @license
3
- * Copyright (c) 2000 - 2025 Vaadin Ltd.
3
+ * Copyright (c) 2016 - 2025 Vaadin Ltd.
4
4
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
5
5
  */
6
6
  import type { CSSResult } from 'lit';
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * @license
3
- * Copyright (c) 2000 - 2025 Vaadin Ltd.
3
+ * Copyright (c) 2016 - 2025 Vaadin Ltd.
4
4
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
5
5
  */
6
6
  import { css } from 'lit';
@@ -0,0 +1,8 @@
1
+ /**
2
+ * @license
3
+ * Copyright (c) 2016 - 2025 Vaadin Ltd.
4
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
5
+ */
6
+ import type { CSSResult } from 'lit';
7
+
8
+ export const uploadFileStyles: CSSResult;
@@ -0,0 +1,137 @@
1
+ /**
2
+ * @license
3
+ * Copyright (c) 2016 - 2025 Vaadin Ltd.
4
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
5
+ */
6
+ import '@vaadin/component-base/src/style-props.js';
7
+ import { css } from 'lit';
8
+
9
+ export const uploadFileStyles = css`
10
+ :host {
11
+ align-items: center;
12
+ display: grid;
13
+ gap: var(--vaadin-upload-file-gap, var(--vaadin-gap-container-block));
14
+ grid-template-columns: var(--vaadin-icon-size, 1lh) minmax(0, 1fr) auto;
15
+ padding: var(--vaadin-upload-file-padding, var(--vaadin-padding));
16
+ }
17
+
18
+ [hidden] {
19
+ display: none;
20
+ }
21
+
22
+ [part='row'] {
23
+ display: contents;
24
+ }
25
+
26
+ [part='info'] {
27
+ display: contents;
28
+ }
29
+
30
+ [part='done-icon']:not([hidden]),
31
+ [part='warning-icon']:not([hidden]) {
32
+ display: flex;
33
+ }
34
+
35
+ [part='done-icon']::before,
36
+ [part='warning-icon']::before {
37
+ content: '';
38
+ display: inline-block;
39
+ flex: none;
40
+ height: var(--vaadin-icon-size, 1lh);
41
+ width: var(--vaadin-icon-size, 1lh);
42
+ }
43
+
44
+ [part='done-icon']::before {
45
+ background: var(--vaadin-upload-file-done-color, currentColor);
46
+ mask-image: var(--_vaadin-icon-checkmark);
47
+ }
48
+
49
+ [part='warning-icon']::before {
50
+ background: var(--vaadin-upload-file-warning-color, currentColor);
51
+ mask-image: var(--_vaadin-icon-warn);
52
+ }
53
+
54
+ [part='meta'] {
55
+ grid-column: 2;
56
+ }
57
+
58
+ [part='name'] {
59
+ color: var(--vaadin-upload-file-name-color, var(--vaadin-color));
60
+ font-size: var(--vaadin-upload-file-name-font-size, inherit);
61
+ font-weight: var(--vaadin-upload-file-name-font-weight, inherit);
62
+ line-height: var(--vaadin-upload-file-name-line-height, inherit);
63
+ overflow: hidden;
64
+ text-overflow: ellipsis;
65
+ }
66
+
67
+ [part='status'] {
68
+ color: var(--vaadin-upload-file-status-color, var(--vaadin-color-subtle));
69
+ font-size: var(--vaadin-upload-file-status-font-size, inherit);
70
+ font-weight: var(--vaadin-upload-file-status-font-weight, inherit);
71
+ line-height: var(--vaadin-upload-file-status-line-height, inherit);
72
+ }
73
+
74
+ [part='error'] {
75
+ color: var(--vaadin-upload-file-error-color, var(--vaadin-color));
76
+ font-size: var(--vaadin-upload-file-error-font-size, inherit);
77
+ font-weight: var(--vaadin-upload-file-error-font-weight, inherit);
78
+ line-height: var(--vaadin-upload-file-error-line-height, inherit);
79
+ }
80
+
81
+ button {
82
+ background: var(--vaadin-upload-file-button-background, transparent);
83
+ border: var(
84
+ --vaadin-upload-file-button-border,
85
+ var(--vaadin-upload-file-button-border-width, 1px) solid
86
+ var(--vaadin-upload-file-button-border-color, transparent)
87
+ );
88
+ border-radius: var(--vaadin-upload-file-button-border-radius, var(--vaadin-radius-m));
89
+ color: var(--vaadin-upload-file-button-text-color, var(--vaadin-color));
90
+ cursor: var(--vaadin-clickable-cursor);
91
+ flex-shrink: 0;
92
+ font-family: var(--vaadin-upload-file-button-font-family, inherit);
93
+ font-size: var(--vaadin-upload-file-button-font-size, inherit);
94
+ font-weight: var(--vaadin-upload-file-button-font-weight, 500);
95
+ height: var(--vaadin-upload-file-button-height, auto);
96
+ line-height: var(--vaadin-upload-file-button-line-height, inherit);
97
+ padding: var(--vaadin-upload-file-button-padding, var(--vaadin-padding-container));
98
+ }
99
+
100
+ [part='start-button']::before,
101
+ [part='retry-button']::before,
102
+ [part='remove-button']::before {
103
+ background: currentColor;
104
+ content: '';
105
+ display: block;
106
+ height: var(--vaadin-icon-size, 1lh);
107
+ width: var(--vaadin-icon-size, 1lh);
108
+ }
109
+
110
+ [part='start-button']::before {
111
+ mask-image: var(--_vaadin-icon-play);
112
+ }
113
+
114
+ [part='retry-button']::before {
115
+ mask-image: var(--_vaadin-icon-refresh);
116
+ }
117
+
118
+ [part='remove-button']::before {
119
+ mask-image: var(--_vaadin-icon-cross);
120
+ }
121
+
122
+ ::slotted([slot='progress']) {
123
+ grid-column: 2 / -1;
124
+ width: auto;
125
+ }
126
+
127
+ :host([complete]) ::slotted([slot='progress']),
128
+ :host([error]) ::slotted([slot='progress']) {
129
+ display: none;
130
+ }
131
+
132
+ @media (forced-colors: active) {
133
+ :is([part$='icon'], [part$='button'])::before {
134
+ background: CanvasText;
135
+ }
136
+ }
137
+ `;
@@ -0,0 +1,8 @@
1
+ /**
2
+ * @license
3
+ * Copyright (c) 2016 - 2025 Vaadin Ltd.
4
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
5
+ */
6
+ import type { CSSResult } from 'lit';
7
+
8
+ export const uploadFileListStyles: CSSResult;
@@ -0,0 +1,35 @@
1
+ /**
2
+ * @license
3
+ * Copyright (c) 2016 - 2025 Vaadin Ltd.
4
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
5
+ */
6
+ import '@vaadin/component-base/src/style-props.js';
7
+ import { css } from 'lit';
8
+
9
+ export const uploadFileListStyles = css`
10
+ :host {
11
+ display: block;
12
+ }
13
+
14
+ :host([hidden]) {
15
+ display: none !important;
16
+ }
17
+
18
+ [part='list'] {
19
+ list-style-type: none;
20
+ margin: 0;
21
+ padding: 0;
22
+ }
23
+
24
+ ::slotted(:first-child) {
25
+ margin-top: var(--vaadin-upload-gap, var(--vaadin-gap-container-block));
26
+ }
27
+
28
+ ::slotted(li:not(:last-of-type)) {
29
+ border-bottom: var(
30
+ --vaadin-upload-file-list-border,
31
+ var(--vaadin-upload-file-list-border-width, 1px) solid
32
+ var(--vaadin-upload-file-list-border-color, var(--vaadin-border-color))
33
+ );
34
+ }
35
+ `;
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * @license
3
- * Copyright (c) 2000 - 2025 Vaadin Ltd.
3
+ * Copyright (c) 2016 - 2025 Vaadin Ltd.
4
4
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
5
5
  */
6
6
  import type { CSSResult } from 'lit';
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * @license
3
- * Copyright (c) 2000 - 2025 Vaadin Ltd.
3
+ * Copyright (c) 2016 - 2025 Vaadin Ltd.
4
4
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
5
5
  */
6
6
  import { css } from 'lit';
@@ -0,0 +1,8 @@
1
+ /**
2
+ * @license
3
+ * Copyright (c) 2016 - 2025 Vaadin Ltd.
4
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
5
+ */
6
+ import type { CSSResult } from 'lit';
7
+
8
+ export const uploadIconStyles: CSSResult;
@@ -0,0 +1,33 @@
1
+ /**
2
+ * @license
3
+ * Copyright (c) 2016 - 2025 Vaadin Ltd.
4
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
5
+ */
6
+ import '@vaadin/component-base/src/style-props.js';
7
+ import { css } from 'lit';
8
+
9
+ export const uploadIconStyles = css`
10
+ :host {
11
+ display: inline-flex;
12
+ }
13
+
14
+ :host::before {
15
+ background: var(--vaadin-upload-icon-color, currentColor);
16
+ content: '';
17
+ display: inline-block;
18
+ flex: none;
19
+ height: var(--vaadin-icon-size, 1lh);
20
+ mask-image: var(--_vaadin-icon-upload);
21
+ width: var(--vaadin-icon-size, 1lh);
22
+ }
23
+
24
+ :host([hidden]) {
25
+ display: none !important;
26
+ }
27
+
28
+ @media (forced-colors: active) {
29
+ :host::before {
30
+ background: CanvasText;
31
+ }
32
+ }
33
+ `;
@@ -0,0 +1,8 @@
1
+ /**
2
+ * @license
3
+ * Copyright (c) 2016 - 2025 Vaadin Ltd.
4
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
5
+ */
6
+ import type { CSSResult } from 'lit';
7
+
8
+ export const uploadIconStyles: CSSResult;
@@ -0,0 +1,16 @@
1
+ /**
2
+ * @license
3
+ * Copyright (c) 2016 - 2025 Vaadin Ltd.
4
+ * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
5
+ */
6
+ import { css } from 'lit';
7
+
8
+ export const uploadIconStyles = css`
9
+ :host {
10
+ display: inline-block;
11
+ }
12
+
13
+ :host([hidden]) {
14
+ display: none !important;
15
+ }
16
+ `;
@@ -21,7 +21,7 @@ import { UploadFileListMixin } from './vaadin-upload-file-list-mixin.js';
21
21
  * @mixes UploadFileListMixin
22
22
  * @private
23
23
  */
24
- class UploadFileList extends UploadFileListMixin(ThemableMixin(LumoInjectionMixin(PolylitMixin(LitElement)))) {
24
+ class UploadFileList extends UploadFileListMixin(ThemableMixin(PolylitMixin(LumoInjectionMixin(LitElement)))) {
25
25
  static get is() {
26
26
  return 'vaadin-upload-file-list';
27
27
  }
@@ -54,7 +54,7 @@ import { UploadFileMixin } from './vaadin-upload-file-mixin.js';
54
54
  * @mixes UploadFileMixin
55
55
  * @mixes ThemableMixin
56
56
  */
57
- class UploadFile extends UploadFileMixin(ThemableMixin(LumoInjectionMixin(PolylitMixin(LitElement)))) {
57
+ class UploadFile extends UploadFileMixin(ThemableMixin(PolylitMixin(LumoInjectionMixin(LitElement)))) {
58
58
  static get is() {
59
59
  return 'vaadin-upload-file';
60
60
  }
@@ -3,10 +3,11 @@
3
3
  * Copyright (c) 2016 - 2025 Vaadin Ltd.
4
4
  * This program is available under Apache License Version 2.0, available at https://vaadin.com/license/
5
5
  */
6
- import { css, html, LitElement } from 'lit';
6
+ import { html, LitElement } from 'lit';
7
7
  import { defineCustomElement } from '@vaadin/component-base/src/define.js';
8
8
  import { LumoInjectionMixin } from '@vaadin/vaadin-themable-mixin/lumo-injection-mixin.js';
9
9
  import { ThemableMixin } from '@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js';
10
+ import { uploadIconStyles } from './styles/vaadin-upload-icon-core-styles.js';
10
11
 
11
12
  /**
12
13
  * An element used internally by `<vaadin-upload>`. Not intended to be used separately.
@@ -21,15 +22,7 @@ class UploadIcon extends ThemableMixin(LumoInjectionMixin(LitElement)) {
21
22
  }
22
23
 
23
24
  static get styles() {
24
- return css`
25
- :host {
26
- display: inline-block;
27
- }
28
-
29
- :host([hidden]) {
30
- display: none !important;
31
- }
32
- `;
25
+ return uploadIconStyles;
33
26
  }
34
27
 
35
28
  static get lumoInjector() {
@@ -118,7 +118,7 @@ export interface UploadEventMap extends HTMLElementEventMap, UploadCustomEventMa
118
118
  *
119
119
  * Example:
120
120
  *
121
- * ```
121
+ * ```html
122
122
  * <vaadin-upload></vaadin-upload>
123
123
  * ```
124
124
  *
@@ -22,7 +22,7 @@ import { UploadMixin } from './vaadin-upload-mixin.js';
22
22
  *
23
23
  * Example:
24
24
  *
25
- * ```
25
+ * ```html
26
26
  * <vaadin-upload></vaadin-upload>
27
27
  * ```
28
28
  *
@@ -66,7 +66,7 @@ import { UploadMixin } from './vaadin-upload-mixin.js';
66
66
  * @mixes ElementMixin
67
67
  * @mixes UploadMixin
68
68
  */
69
- class Upload extends UploadMixin(ElementMixin(ThemableMixin(LumoInjectionMixin(PolylitMixin(LitElement))))) {
69
+ class Upload extends UploadMixin(ElementMixin(ThemableMixin(PolylitMixin(LumoInjectionMixin(LitElement))))) {
70
70
  static get is() {
71
71
  return 'vaadin-upload';
72
72
  }
package/web-types.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/upload",
4
- "version": "25.0.0-alpha7",
4
+ "version": "25.0.0-alpha9",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {
@@ -263,7 +263,7 @@
263
263
  },
264
264
  {
265
265
  "name": "vaadin-upload",
266
- "description": "`<vaadin-upload>` is a Web Component for uploading multiple files with drag and drop support.\n\nExample:\n\n```\n<vaadin-upload></vaadin-upload>\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n-------------------|-------------------------------------\n`primary-buttons` | Upload container\n`drop-label` | Element wrapping drop label and icon\n\nThe following state attributes are available for styling:\n\nAttribute | Description | Part name\n---|---|---\n`disabled` | Set when the element is disabled | `:host`\n`nodrop` | Set when drag and drop is disabled (e. g., on touch devices) | `:host`\n`dragover` | A file is being dragged over the element | `:host`\n`dragover-valid` | A dragged file is valid with `maxFiles` and `accept` criteria | `:host`\n`max-files-reached` | The maximum number of files that the user is allowed to add to the upload has been reached | `:host`\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
266
+ "description": "`<vaadin-upload>` is a Web Component for uploading multiple files with drag and drop support.\n\nExample:\n\n```html\n<vaadin-upload></vaadin-upload>\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n-------------------|-------------------------------------\n`primary-buttons` | Upload container\n`drop-label` | Element wrapping drop label and icon\n\nThe following state attributes are available for styling:\n\nAttribute | Description | Part name\n---|---|---\n`disabled` | Set when the element is disabled | `:host`\n`nodrop` | Set when drag and drop is disabled (e. g., on touch devices) | `:host`\n`dragover` | A file is being dragged over the element | `:host`\n`dragover-valid` | A dragged file is valid with `maxFiles` and `accept` criteria | `:host`\n`max-files-reached` | The maximum number of files that the user is allowed to add to the upload has been reached | `:host`\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
267
267
  "attributes": [
268
268
  {
269
269
  "name": "disabled",
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/upload",
4
- "version": "25.0.0-alpha7",
4
+ "version": "25.0.0-alpha9",
5
5
  "description-markup": "markdown",
6
6
  "framework": "lit",
7
7
  "framework-config": {
@@ -121,7 +121,7 @@
121
121
  },
122
122
  {
123
123
  "name": "vaadin-upload",
124
- "description": "`<vaadin-upload>` is a Web Component for uploading multiple files with drag and drop support.\n\nExample:\n\n```\n<vaadin-upload></vaadin-upload>\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n-------------------|-------------------------------------\n`primary-buttons` | Upload container\n`drop-label` | Element wrapping drop label and icon\n\nThe following state attributes are available for styling:\n\nAttribute | Description | Part name\n---|---|---\n`disabled` | Set when the element is disabled | `:host`\n`nodrop` | Set when drag and drop is disabled (e. g., on touch devices) | `:host`\n`dragover` | A file is being dragged over the element | `:host`\n`dragover-valid` | A dragged file is valid with `maxFiles` and `accept` criteria | `:host`\n`max-files-reached` | The maximum number of files that the user is allowed to add to the upload has been reached | `:host`\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
124
+ "description": "`<vaadin-upload>` is a Web Component for uploading multiple files with drag and drop support.\n\nExample:\n\n```html\n<vaadin-upload></vaadin-upload>\n```\n\n### Styling\n\nThe following shadow DOM parts are available for styling:\n\nPart name | Description\n-------------------|-------------------------------------\n`primary-buttons` | Upload container\n`drop-label` | Element wrapping drop label and icon\n\nThe following state attributes are available for styling:\n\nAttribute | Description | Part name\n---|---|---\n`disabled` | Set when the element is disabled | `:host`\n`nodrop` | Set when drag and drop is disabled (e. g., on touch devices) | `:host`\n`dragover` | A file is being dragged over the element | `:host`\n`dragover-valid` | A dragged file is valid with `maxFiles` and `accept` criteria | `:host`\n`max-files-reached` | The maximum number of files that the user is allowed to add to the upload has been reached | `:host`\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
125
125
  "extension": true,
126
126
  "attributes": [
127
127
  {