@vaadin/dashboard 25.1.0-beta1 → 25.1.0-beta2
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/custom-elements.json +3 -195
- package/package.json +10 -10
- package/src/vaadin-dashboard-layout-mixin.js +0 -1
- package/src/vaadin-dashboard.js +1 -1
- package/web-types.json +15 -7
- package/web-types.lit.json +2 -2
package/custom-elements.json
CHANGED
|
@@ -62,71 +62,6 @@
|
|
|
62
62
|
}
|
|
63
63
|
]
|
|
64
64
|
},
|
|
65
|
-
{
|
|
66
|
-
"kind": "javascript-module",
|
|
67
|
-
"path": "src/vaadin-dashboard-button.js",
|
|
68
|
-
"declarations": [
|
|
69
|
-
{
|
|
70
|
-
"kind": "class",
|
|
71
|
-
"description": "An element used internally by `<vaadin-dashboard>`. Not intended to be used separately.",
|
|
72
|
-
"name": "DashboardButton",
|
|
73
|
-
"members": [],
|
|
74
|
-
"mixins": [
|
|
75
|
-
{
|
|
76
|
-
"name": "ButtonMixin",
|
|
77
|
-
"package": "@vaadin/button/src/vaadin-button-mixin.js"
|
|
78
|
-
},
|
|
79
|
-
{
|
|
80
|
-
"name": "ElementMixin",
|
|
81
|
-
"package": "@vaadin/component-base/src/element-mixin.js"
|
|
82
|
-
},
|
|
83
|
-
{
|
|
84
|
-
"name": "ThemableMixin",
|
|
85
|
-
"package": "@vaadin/vaadin-themable-mixin/vaadin-themable-mixin.js"
|
|
86
|
-
},
|
|
87
|
-
{
|
|
88
|
-
"name": "PolylitMixin",
|
|
89
|
-
"package": "@vaadin/component-base/src/polylit-mixin.js"
|
|
90
|
-
},
|
|
91
|
-
{
|
|
92
|
-
"name": "LumoInjectionMixin",
|
|
93
|
-
"package": "@vaadin/vaadin-themable-mixin/lumo-injection-mixin.js"
|
|
94
|
-
}
|
|
95
|
-
],
|
|
96
|
-
"superclass": {
|
|
97
|
-
"name": "LitElement",
|
|
98
|
-
"package": "lit"
|
|
99
|
-
},
|
|
100
|
-
"tagName": "vaadin-dashboard-button",
|
|
101
|
-
"customElement": true,
|
|
102
|
-
"attributes": [
|
|
103
|
-
{
|
|
104
|
-
"name": "tabindex",
|
|
105
|
-
"type": {
|
|
106
|
-
"text": "number"
|
|
107
|
-
},
|
|
108
|
-
"description": "Indicates whether the element can be focused and where it participates in sequential keyboard navigation.",
|
|
109
|
-
"fieldName": "tabindex",
|
|
110
|
-
"inheritedFrom": {
|
|
111
|
-
"name": "TabindexMixin",
|
|
112
|
-
"package": "@vaadin/a11y-base/src/tabindex-mixin.js"
|
|
113
|
-
}
|
|
114
|
-
}
|
|
115
|
-
],
|
|
116
|
-
"events": []
|
|
117
|
-
}
|
|
118
|
-
],
|
|
119
|
-
"exports": [
|
|
120
|
-
{
|
|
121
|
-
"kind": "js",
|
|
122
|
-
"name": "DashboardButton",
|
|
123
|
-
"declaration": {
|
|
124
|
-
"name": "DashboardButton",
|
|
125
|
-
"module": "src/vaadin-dashboard-button.js"
|
|
126
|
-
}
|
|
127
|
-
}
|
|
128
|
-
]
|
|
129
|
-
},
|
|
130
65
|
{
|
|
131
66
|
"kind": "javascript-module",
|
|
132
67
|
"path": "src/vaadin-dashboard-helpers.js",
|
|
@@ -428,36 +363,7 @@
|
|
|
428
363
|
}
|
|
429
364
|
}
|
|
430
365
|
],
|
|
431
|
-
"attributes": [
|
|
432
|
-
{
|
|
433
|
-
"name": "focused",
|
|
434
|
-
"type": {
|
|
435
|
-
"text": "boolean"
|
|
436
|
-
},
|
|
437
|
-
"fieldName": "__focused"
|
|
438
|
-
},
|
|
439
|
-
{
|
|
440
|
-
"name": "move-mode",
|
|
441
|
-
"type": {
|
|
442
|
-
"text": "boolean"
|
|
443
|
-
},
|
|
444
|
-
"fieldName": "__moveMode"
|
|
445
|
-
},
|
|
446
|
-
{
|
|
447
|
-
"name": "resize-mode",
|
|
448
|
-
"type": {
|
|
449
|
-
"text": "boolean"
|
|
450
|
-
},
|
|
451
|
-
"fieldName": "__resizeMode"
|
|
452
|
-
},
|
|
453
|
-
{
|
|
454
|
-
"name": "selected",
|
|
455
|
-
"type": {
|
|
456
|
-
"text": "boolean"
|
|
457
|
-
},
|
|
458
|
-
"fieldName": "__selected"
|
|
459
|
-
}
|
|
460
|
-
],
|
|
366
|
+
"attributes": [],
|
|
461
367
|
"mixins": [
|
|
462
368
|
{
|
|
463
369
|
"name": "ResizeMixin",
|
|
@@ -708,39 +614,6 @@
|
|
|
708
614
|
}
|
|
709
615
|
],
|
|
710
616
|
"attributes": [
|
|
711
|
-
{
|
|
712
|
-
"name": "focused",
|
|
713
|
-
"type": {
|
|
714
|
-
"text": "boolean"
|
|
715
|
-
},
|
|
716
|
-
"fieldName": "__focused",
|
|
717
|
-
"inheritedFrom": {
|
|
718
|
-
"name": "DashboardItemMixin",
|
|
719
|
-
"module": "src/vaadin-dashboard-item-mixin.js"
|
|
720
|
-
}
|
|
721
|
-
},
|
|
722
|
-
{
|
|
723
|
-
"name": "move-mode",
|
|
724
|
-
"type": {
|
|
725
|
-
"text": "boolean"
|
|
726
|
-
},
|
|
727
|
-
"fieldName": "__moveMode",
|
|
728
|
-
"inheritedFrom": {
|
|
729
|
-
"name": "DashboardItemMixin",
|
|
730
|
-
"module": "src/vaadin-dashboard-item-mixin.js"
|
|
731
|
-
}
|
|
732
|
-
},
|
|
733
|
-
{
|
|
734
|
-
"name": "resize-mode",
|
|
735
|
-
"type": {
|
|
736
|
-
"text": "boolean"
|
|
737
|
-
},
|
|
738
|
-
"fieldName": "__resizeMode",
|
|
739
|
-
"inheritedFrom": {
|
|
740
|
-
"name": "DashboardItemMixin",
|
|
741
|
-
"module": "src/vaadin-dashboard-item-mixin.js"
|
|
742
|
-
}
|
|
743
|
-
},
|
|
744
617
|
{
|
|
745
618
|
"name": "section-title",
|
|
746
619
|
"type": {
|
|
@@ -748,17 +621,6 @@
|
|
|
748
621
|
},
|
|
749
622
|
"description": "The title of the section",
|
|
750
623
|
"fieldName": "sectionTitle"
|
|
751
|
-
},
|
|
752
|
-
{
|
|
753
|
-
"name": "selected",
|
|
754
|
-
"type": {
|
|
755
|
-
"text": "boolean"
|
|
756
|
-
},
|
|
757
|
-
"fieldName": "__selected",
|
|
758
|
-
"inheritedFrom": {
|
|
759
|
-
"name": "DashboardItemMixin",
|
|
760
|
-
"module": "src/vaadin-dashboard-item-mixin.js"
|
|
761
|
-
}
|
|
762
624
|
}
|
|
763
625
|
],
|
|
764
626
|
"mixins": [
|
|
@@ -855,50 +717,6 @@
|
|
|
855
717
|
}
|
|
856
718
|
],
|
|
857
719
|
"attributes": [
|
|
858
|
-
{
|
|
859
|
-
"name": "focused",
|
|
860
|
-
"type": {
|
|
861
|
-
"text": "boolean"
|
|
862
|
-
},
|
|
863
|
-
"fieldName": "__focused",
|
|
864
|
-
"inheritedFrom": {
|
|
865
|
-
"name": "DashboardItemMixin",
|
|
866
|
-
"module": "src/vaadin-dashboard-item-mixin.js"
|
|
867
|
-
}
|
|
868
|
-
},
|
|
869
|
-
{
|
|
870
|
-
"name": "move-mode",
|
|
871
|
-
"type": {
|
|
872
|
-
"text": "boolean"
|
|
873
|
-
},
|
|
874
|
-
"fieldName": "__moveMode",
|
|
875
|
-
"inheritedFrom": {
|
|
876
|
-
"name": "DashboardItemMixin",
|
|
877
|
-
"module": "src/vaadin-dashboard-item-mixin.js"
|
|
878
|
-
}
|
|
879
|
-
},
|
|
880
|
-
{
|
|
881
|
-
"name": "resize-mode",
|
|
882
|
-
"type": {
|
|
883
|
-
"text": "boolean"
|
|
884
|
-
},
|
|
885
|
-
"fieldName": "__resizeMode",
|
|
886
|
-
"inheritedFrom": {
|
|
887
|
-
"name": "DashboardItemMixin",
|
|
888
|
-
"module": "src/vaadin-dashboard-item-mixin.js"
|
|
889
|
-
}
|
|
890
|
-
},
|
|
891
|
-
{
|
|
892
|
-
"name": "selected",
|
|
893
|
-
"type": {
|
|
894
|
-
"text": "boolean"
|
|
895
|
-
},
|
|
896
|
-
"fieldName": "__selected",
|
|
897
|
-
"inheritedFrom": {
|
|
898
|
-
"name": "DashboardItemMixin",
|
|
899
|
-
"module": "src/vaadin-dashboard-item-mixin.js"
|
|
900
|
-
}
|
|
901
|
-
},
|
|
902
720
|
{
|
|
903
721
|
"name": "widget-title",
|
|
904
722
|
"type": {
|
|
@@ -1018,19 +836,9 @@
|
|
|
1018
836
|
"kind": "field",
|
|
1019
837
|
"name": "i18n",
|
|
1020
838
|
"description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following structure and default values:\n```js\n{\n selectSection: 'Select section for editing',\n selectWidget: 'Select widget for editing',\n remove: 'Remove',\n resize: 'Resize',\n resizeApply: 'Apply',\n resizeShrinkWidth: 'Shrink width',\n resizeGrowWidth: 'Grow width',\n resizeShrinkHeight: 'Shrink height',\n resizeGrowHeight: 'Grow height',\n move: 'Move',\n moveApply: 'Apply',\n moveForward: 'Move Forward',\n moveBackward: 'Move Backward',\n}\n```",
|
|
1021
|
-
"
|
|
1022
|
-
"
|
|
1023
|
-
"text": "!DashboardI18n"
|
|
1024
|
-
}
|
|
839
|
+
"type": {
|
|
840
|
+
"text": "Object"
|
|
1025
841
|
},
|
|
1026
|
-
"parameters": [
|
|
1027
|
-
{
|
|
1028
|
-
"name": "value",
|
|
1029
|
-
"type": {
|
|
1030
|
-
"text": "Object"
|
|
1031
|
-
}
|
|
1032
|
-
}
|
|
1033
|
-
],
|
|
1034
842
|
"inheritedFrom": {
|
|
1035
843
|
"name": "I18nMixin",
|
|
1036
844
|
"package": "@vaadin/component-base/src/i18n-mixin.js"
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vaadin/dashboard",
|
|
3
|
-
"version": "25.1.0-
|
|
3
|
+
"version": "25.1.0-beta2",
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
@@ -37,18 +37,18 @@
|
|
|
37
37
|
],
|
|
38
38
|
"dependencies": {
|
|
39
39
|
"@open-wc/dedupe-mixin": "^1.3.0",
|
|
40
|
-
"@vaadin/a11y-base": "25.1.0-
|
|
41
|
-
"@vaadin/button": "25.1.0-
|
|
42
|
-
"@vaadin/component-base": "25.1.0-
|
|
43
|
-
"@vaadin/vaadin-themable-mixin": "25.1.0-
|
|
40
|
+
"@vaadin/a11y-base": "25.1.0-beta2",
|
|
41
|
+
"@vaadin/button": "25.1.0-beta2",
|
|
42
|
+
"@vaadin/component-base": "25.1.0-beta2",
|
|
43
|
+
"@vaadin/vaadin-themable-mixin": "25.1.0-beta2",
|
|
44
44
|
"lit": "^3.0.0"
|
|
45
45
|
},
|
|
46
46
|
"devDependencies": {
|
|
47
|
-
"@vaadin/aura": "25.1.0-
|
|
48
|
-
"@vaadin/chai-plugins": "25.1.0-
|
|
49
|
-
"@vaadin/test-runner-commands": "25.1.0-
|
|
47
|
+
"@vaadin/aura": "25.1.0-beta2",
|
|
48
|
+
"@vaadin/chai-plugins": "25.1.0-beta2",
|
|
49
|
+
"@vaadin/test-runner-commands": "25.1.0-beta2",
|
|
50
50
|
"@vaadin/testing-helpers": "^2.0.0",
|
|
51
|
-
"@vaadin/vaadin-lumo-styles": "25.1.0-
|
|
51
|
+
"@vaadin/vaadin-lumo-styles": "25.1.0-beta2",
|
|
52
52
|
"sinon": "^21.0.0"
|
|
53
53
|
},
|
|
54
54
|
"cvdlName": "vaadin-dashboard",
|
|
@@ -57,5 +57,5 @@
|
|
|
57
57
|
"web-types.json",
|
|
58
58
|
"web-types.lit.json"
|
|
59
59
|
],
|
|
60
|
-
"gitHead": "
|
|
60
|
+
"gitHead": "ffbedbae08a5160d13bcd1c6fcaa328df5103a05"
|
|
61
61
|
}
|
package/src/vaadin-dashboard.js
CHANGED
package/web-types.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$schema": "https://json.schemastore.org/web-types",
|
|
3
3
|
"name": "@vaadin/dashboard",
|
|
4
|
-
"version": "25.1.0-
|
|
4
|
+
"version": "25.1.0-beta2",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"contributions": {
|
|
7
7
|
"html": {
|
|
@@ -15,7 +15,9 @@
|
|
|
15
15
|
"description": "Whether the dashboard layout is dense.",
|
|
16
16
|
"value": {
|
|
17
17
|
"type": [
|
|
18
|
-
"boolean"
|
|
18
|
+
"boolean",
|
|
19
|
+
"null",
|
|
20
|
+
"undefined"
|
|
19
21
|
]
|
|
20
22
|
}
|
|
21
23
|
},
|
|
@@ -49,7 +51,9 @@
|
|
|
49
51
|
"description": "Whether the dashboard layout is dense.",
|
|
50
52
|
"value": {
|
|
51
53
|
"type": [
|
|
52
|
-
"boolean"
|
|
54
|
+
"boolean",
|
|
55
|
+
"null",
|
|
56
|
+
"undefined"
|
|
53
57
|
]
|
|
54
58
|
}
|
|
55
59
|
},
|
|
@@ -158,14 +162,16 @@
|
|
|
158
162
|
},
|
|
159
163
|
{
|
|
160
164
|
"name": "vaadin-dashboard",
|
|
161
|
-
"description": "A responsive, grid-based dashboard layout component\n\n### Quick Start\n\nAssign an array to the [`items`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-
|
|
165
|
+
"description": "A responsive, grid-based dashboard layout component\n\n### Quick Start\n\nAssign an array to the [`items`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-beta2/#/elements/vaadin-dashboard#property-items) property.\nSet a renderer function to the [`renderer`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-beta2/#/elements/vaadin-dashboard#property-renderer) property.\n\nThe widgets and the sections will be generated and configured based on the renderer and the items provided.\n\n```html\n<vaadin-dashboard></vaadin-dashboard>\n```\n```js\nconst dashboard = document.querySelector('vaadin-dashboard');\n\ndashboard.items = [\n { title: 'Widget 1 title', content: 'Text 1', rowspan: 2 },\n { title: 'Widget 2 title', content: 'Text 2', colspan: 2 },\n {\n title: 'Section title',\n items: [{ title: 'Widget in section title', content: 'Text 3' }]\n },\n // ... more items\n];\n\ndashboard.renderer = (root, _dashboard, { item }) => {\n const widget = root.firstElementChild || document.createElement('vaadin-dashboard-widget');\n if (!root.contains(widget)) {\n root.appendChild(widget);\n }\n widget.widgetTitle = item.title;\n widget.textContent = item.content;\n};\n```\n\n### Styling\n\nThe following custom properties are available:\n\nCustom Property | Description\n------------------------------------|-------------\n`--vaadin-dashboard-col-min-width` | minimum column width of the dashboard\n`--vaadin-dashboard-col-max-width` | maximum column width of the dashboard\n`--vaadin-dashboard-row-min-height` | minimum row height of the dashboard\n`--vaadin-dashboard-col-max-count` | maximum column count of the dashboard\n`--vaadin-dashboard-gap` | gap between child elements. Must be in length units (0 is not allowed, 0px is)\n`--vaadin-dashboard-padding` | space around the dashboard's outer edges. Must be in length units (0 is not allowed, 0px is)\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n---------------------|-------------\n`editable` | Set when the dashboard is editable.\n`dense-layout` | Set when the dashboard is in dense mode.\n`item-selected` | Set when an item is selected.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
|
|
162
166
|
"attributes": [
|
|
163
167
|
{
|
|
164
168
|
"name": "dense-layout",
|
|
165
169
|
"description": "Whether the dashboard layout is dense.",
|
|
166
170
|
"value": {
|
|
167
171
|
"type": [
|
|
168
|
-
"boolean"
|
|
172
|
+
"boolean",
|
|
173
|
+
"null",
|
|
174
|
+
"undefined"
|
|
169
175
|
]
|
|
170
176
|
}
|
|
171
177
|
},
|
|
@@ -210,7 +216,9 @@
|
|
|
210
216
|
"description": "Whether the dashboard layout is dense.",
|
|
211
217
|
"value": {
|
|
212
218
|
"type": [
|
|
213
|
-
"boolean"
|
|
219
|
+
"boolean",
|
|
220
|
+
"null",
|
|
221
|
+
"undefined"
|
|
214
222
|
]
|
|
215
223
|
}
|
|
216
224
|
},
|
|
@@ -230,7 +238,7 @@
|
|
|
230
238
|
"description": "The object used to localize this component. To change the default\nlocalization, replace this with an object that provides all properties, or\njust the individual properties you want to change.\n\nThe object has the following structure and default values:\n```js\n{\n selectSection: 'Select section for editing',\n selectWidget: 'Select widget for editing',\n remove: 'Remove',\n resize: 'Resize',\n resizeApply: 'Apply',\n resizeShrinkWidth: 'Shrink width',\n resizeGrowWidth: 'Grow width',\n resizeShrinkHeight: 'Shrink height',\n resizeGrowHeight: 'Grow height',\n move: 'Move',\n moveApply: 'Apply',\n moveForward: 'Move Forward',\n moveBackward: 'Move Backward',\n}\n```",
|
|
231
239
|
"value": {
|
|
232
240
|
"type": [
|
|
233
|
-
"
|
|
241
|
+
"?"
|
|
234
242
|
]
|
|
235
243
|
}
|
|
236
244
|
},
|
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/dashboard",
|
|
4
|
-
"version": "25.1.0-
|
|
4
|
+
"version": "25.1.0-beta2",
|
|
5
5
|
"description-markup": "markdown",
|
|
6
6
|
"framework": "lit",
|
|
7
7
|
"framework-config": {
|
|
@@ -65,7 +65,7 @@
|
|
|
65
65
|
},
|
|
66
66
|
{
|
|
67
67
|
"name": "vaadin-dashboard",
|
|
68
|
-
"description": "A responsive, grid-based dashboard layout component\n\n### Quick Start\n\nAssign an array to the [`items`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-
|
|
68
|
+
"description": "A responsive, grid-based dashboard layout component\n\n### Quick Start\n\nAssign an array to the [`items`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-beta2/#/elements/vaadin-dashboard#property-items) property.\nSet a renderer function to the [`renderer`](https://cdn.vaadin.com/vaadin-web-components/25.1.0-beta2/#/elements/vaadin-dashboard#property-renderer) property.\n\nThe widgets and the sections will be generated and configured based on the renderer and the items provided.\n\n```html\n<vaadin-dashboard></vaadin-dashboard>\n```\n```js\nconst dashboard = document.querySelector('vaadin-dashboard');\n\ndashboard.items = [\n { title: 'Widget 1 title', content: 'Text 1', rowspan: 2 },\n { title: 'Widget 2 title', content: 'Text 2', colspan: 2 },\n {\n title: 'Section title',\n items: [{ title: 'Widget in section title', content: 'Text 3' }]\n },\n // ... more items\n];\n\ndashboard.renderer = (root, _dashboard, { item }) => {\n const widget = root.firstElementChild || document.createElement('vaadin-dashboard-widget');\n if (!root.contains(widget)) {\n root.appendChild(widget);\n }\n widget.widgetTitle = item.title;\n widget.textContent = item.content;\n};\n```\n\n### Styling\n\nThe following custom properties are available:\n\nCustom Property | Description\n------------------------------------|-------------\n`--vaadin-dashboard-col-min-width` | minimum column width of the dashboard\n`--vaadin-dashboard-col-max-width` | maximum column width of the dashboard\n`--vaadin-dashboard-row-min-height` | minimum row height of the dashboard\n`--vaadin-dashboard-col-max-count` | maximum column count of the dashboard\n`--vaadin-dashboard-gap` | gap between child elements. Must be in length units (0 is not allowed, 0px is)\n`--vaadin-dashboard-padding` | space around the dashboard's outer edges. Must be in length units (0 is not allowed, 0px is)\n\nThe following state attributes are available for styling:\n\nAttribute | Description\n---------------------|-------------\n`editable` | Set when the dashboard is editable.\n`dense-layout` | Set when the dashboard is in dense mode.\n`item-selected` | Set when an item is selected.\n\nSee [Styling Components](https://vaadin.com/docs/latest/styling/styling-components) documentation.",
|
|
69
69
|
"extension": true,
|
|
70
70
|
"attributes": [
|
|
71
71
|
{
|