@vaadin/upload 25.0.0-beta6 → 25.0.0-beta7

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.
Files changed (6) hide show
  1. package/package.json +10 -10
  2. package/src/styles/vaadin-upload-base-styles.js +2 -1
  3. package/src/vaadin-upload.d.ts +15 -0
  4. package/src/vaadin-upload.js +19 -0
  5. package/web-types.json +2 -2
  6. package/web-types.lit.json +2 -2
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vaadin/upload",
3
- "version": "25.0.0-beta6",
3
+ "version": "25.0.0-beta7",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -34,23 +34,23 @@
34
34
  ],
35
35
  "dependencies": {
36
36
  "@open-wc/dedupe-mixin": "^1.3.0",
37
- "@vaadin/a11y-base": "25.0.0-beta6",
38
- "@vaadin/button": "25.0.0-beta6",
39
- "@vaadin/component-base": "25.0.0-beta6",
40
- "@vaadin/progress-bar": "25.0.0-beta6",
41
- "@vaadin/vaadin-themable-mixin": "25.0.0-beta6",
37
+ "@vaadin/a11y-base": "25.0.0-beta7",
38
+ "@vaadin/button": "25.0.0-beta7",
39
+ "@vaadin/component-base": "25.0.0-beta7",
40
+ "@vaadin/progress-bar": "25.0.0-beta7",
41
+ "@vaadin/vaadin-themable-mixin": "25.0.0-beta7",
42
42
  "lit": "^3.0.0"
43
43
  },
44
44
  "devDependencies": {
45
- "@vaadin/chai-plugins": "25.0.0-beta6",
46
- "@vaadin/test-runner-commands": "25.0.0-beta6",
45
+ "@vaadin/chai-plugins": "25.0.0-beta7",
46
+ "@vaadin/test-runner-commands": "25.0.0-beta7",
47
47
  "@vaadin/testing-helpers": "^2.0.0",
48
- "@vaadin/vaadin-lumo-styles": "25.0.0-beta6",
48
+ "@vaadin/vaadin-lumo-styles": "25.0.0-beta7",
49
49
  "sinon": "^21.0.0"
50
50
  },
51
51
  "web-types": [
52
52
  "web-types.json",
53
53
  "web-types.lit.json"
54
54
  ],
55
- "gitHead": "b6b638bee18aa62f095e0a0b7bf16a39db756f84"
55
+ "gitHead": "f12f14c37d2c0a72f708baff4a95230168d58dcc"
56
56
  }
package/src/styles/vaadin-upload-base-styles.js CHANGED
@@ -21,7 +21,8 @@ export const uploadStyles = css`
21
21
 
22
22
  :host([dragover-valid]) {
23
23
  --vaadin-upload-background: var(--vaadin-background-container);
24
- --vaadin-upload-border: 1px dashed var(--vaadin-text-color);
24
+ --vaadin-upload-border-color: var(--vaadin-text-color);
25
+ border-style: dashed;
25
26
  }
26
27
 
27
28
  :host([hidden]) {
package/src/vaadin-upload.d.ts CHANGED
@@ -147,6 +147,21 @@ export interface UploadEventMap extends HTMLElementEventMap, UploadCustomEventMa
147
147
  * `dragover-valid` | Set when the dragged file is valid with `maxFiles` and `accept` criteria
148
148
  * `max-files-reached` | Set when maximum number of files that the user is allowed to add has been reached
149
149
  *
150
+ * The following custom CSS properties are available for styling:
151
+ *
152
+ * Custom CSS property | Description
153
+ * -----------------------------------------|-------------
154
+ * `--vaadin-upload-background` | The host element background
155
+ * `--vaadin-upload-border-color` | The host element border color
156
+ * `--vaadin-upload-border-radius` | The host element border radius
157
+ * `--vaadin-upload-border-width` | The host element border width
158
+ * `--vaadin-upload-padding` | The host element padding
159
+ * `--vaadin-upload-drop-label-color` | The drop label color
160
+ * `--vaadin-upload-drop-label-font-size` | The drop label font size
161
+ * `--vaadin-upload-drop-label-font-weight` | The drop label font weight
162
+ * `--vaadin-upload-drop-label-gap` | The drop label gap
163
+ * `--vaadin-upload-drop-label-line-height` | The drop label line height
164
+ *
150
165
  * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.
151
166
  *
152
167
  * @fires {CustomEvent} file-reject - Fired when a file cannot be added to the queue due to a constrain.
package/src/vaadin-upload.js CHANGED
@@ -45,6 +45,21 @@ import { UploadMixin } from './vaadin-upload-mixin.js';
45
45
  * `dragover-valid` | Set when the dragged file is valid with `maxFiles` and `accept` criteria
46
46
  * `max-files-reached` | Set when maximum number of files that the user is allowed to add has been reached
47
47
  *
48
+ * The following custom CSS properties are available for styling:
49
+ *
50
+ * Custom CSS property | Description
51
+ * -----------------------------------------|-------------
52
+ * `--vaadin-upload-background` | The host element background
53
+ * `--vaadin-upload-border-color` | The host element border color
54
+ * `--vaadin-upload-border-radius` | The host element border radius
55
+ * `--vaadin-upload-border-width` | The host element border width
56
+ * `--vaadin-upload-padding` | The host element padding
57
+ * `--vaadin-upload-drop-label-color` | The drop label color
58
+ * `--vaadin-upload-drop-label-font-size` | The drop label font size
59
+ * `--vaadin-upload-drop-label-font-weight` | The drop label font weight
60
+ * `--vaadin-upload-drop-label-gap` | The drop label gap
61
+ * `--vaadin-upload-drop-label-line-height` | The drop label line height
62
+ *
48
63
  * See [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.
49
64
  *
50
65
  * @fires {CustomEvent} file-reject - Fired when a file cannot be added to the queue due to a constrain.
@@ -75,6 +90,10 @@ class Upload extends UploadMixin(ElementMixin(ThemableMixin(PolylitMixin(LumoInj
75
90
  return uploadStyles;
76
91
  }
77
92
 
93
+ static get lumoInjector() {
94
+ return { ...super.lumoInjector, includeBaseStyles: true };
95
+ }
96
+
78
97
  /** @protected */
79
98
  render() {
80
99
  return html`
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-beta6",
4
+ "version": "25.0.0-beta7",
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```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\n---------------------|---------------------------------\n`disabled` | Set when the element is disabled\n`nodrop` | Set when drag and drop is disabled (e.g., on touch devices)\n`dragover` | Set when the file is being dragged over the element\n`dragover-valid` | Set when the dragged file is valid with `maxFiles` and `accept` criteria\n`max-files-reached` | Set when maximum number of files that the user is allowed to add has been reached\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\n---------------------|---------------------------------\n`disabled` | Set when the element is disabled\n`nodrop` | Set when drag and drop is disabled (e.g., on touch devices)\n`dragover` | Set when the file is being dragged over the element\n`dragover-valid` | Set when the dragged file is valid with `maxFiles` and `accept` criteria\n`max-files-reached` | Set when maximum number of files that the user is allowed to add has been reached\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property | Description\n-----------------------------------------|-------------\n`--vaadin-upload-background` | The host element background\n`--vaadin-upload-border-color` | The host element border color\n`--vaadin-upload-border-radius` | The host element border radius\n`--vaadin-upload-border-width` | The host element border width\n`--vaadin-upload-padding` | The host element padding\n`--vaadin-upload-drop-label-color` | The drop label color\n`--vaadin-upload-drop-label-font-size` | The drop label font size\n`--vaadin-upload-drop-label-font-weight` | The drop label font weight\n`--vaadin-upload-drop-label-gap` | The drop label gap\n`--vaadin-upload-drop-label-line-height` | The drop label line height\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
267
267
  "attributes": [
268
268
  {
269
269
  "name": "disabled",
package/web-types.lit.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-beta6",
4
+ "version": "25.0.0-beta7",
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```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\n---------------------|---------------------------------\n`disabled` | Set when the element is disabled\n`nodrop` | Set when drag and drop is disabled (e.g., on touch devices)\n`dragover` | Set when the file is being dragged over the element\n`dragover-valid` | Set when the dragged file is valid with `maxFiles` and `accept` criteria\n`max-files-reached` | Set when maximum number of files that the user is allowed to add has been reached\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\n---------------------|---------------------------------\n`disabled` | Set when the element is disabled\n`nodrop` | Set when drag and drop is disabled (e.g., on touch devices)\n`dragover` | Set when the file is being dragged over the element\n`dragover-valid` | Set when the dragged file is valid with `maxFiles` and `accept` criteria\n`max-files-reached` | Set when maximum number of files that the user is allowed to add has been reached\n\nThe following custom CSS properties are available for styling:\n\nCustom CSS property | Description\n-----------------------------------------|-------------\n`--vaadin-upload-background` | The host element background\n`--vaadin-upload-border-color` | The host element border color\n`--vaadin-upload-border-radius` | The host element border radius\n`--vaadin-upload-border-width` | The host element border width\n`--vaadin-upload-padding` | The host element padding\n`--vaadin-upload-drop-label-color` | The drop label color\n`--vaadin-upload-drop-label-font-size` | The drop label font size\n`--vaadin-upload-drop-label-font-weight` | The drop label font weight\n`--vaadin-upload-drop-label-gap` | The drop label gap\n`--vaadin-upload-drop-label-line-height` | The drop label line height\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
125
125
  "extension": true,
126
126
  "attributes": [
127
127
  {