@vaadin/charts 25.4.0-alpha3 → 25.4.0-alpha5

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.
@@ -4,7 +4,7 @@
4
4
  "modules": [
5
5
  {
6
6
  "kind": "javascript-module",
7
- "path": "vaadin-chart.js",
7
+ "path": "vaadin-chart-series.js",
8
8
  "declarations": [],
9
9
  "exports": [
10
10
  {
@@ -12,14 +12,14 @@
12
12
  "name": "*",
13
13
  "declaration": {
14
14
  "name": "*",
15
- "module": "src/vaadin-chart.js"
15
+ "module": "src/vaadin-chart-series.js"
16
16
  }
17
17
  }
18
18
  ]
19
19
  },
20
20
  {
21
21
  "kind": "javascript-module",
22
- "path": "vaadin-chart-series.js",
22
+ "path": "vaadin-chart.js",
23
23
  "declarations": [],
24
24
  "exports": [
25
25
  {
@@ -27,7 +27,7 @@
27
27
  "name": "*",
28
28
  "declaration": {
29
29
  "name": "*",
30
- "module": "src/vaadin-chart-series.js"
30
+ "module": "src/vaadin-chart.js"
31
31
  }
32
32
  }
33
33
  ]
@@ -48,8 +48,7 @@
48
48
  "type": {
49
49
  "text": "Options | undefined"
50
50
  },
51
- "description": "Represents additional JSON configuration.",
52
- "attribute": "additional-options"
51
+ "description": "Represents additional JSON configuration."
53
52
  },
54
53
  {
55
54
  "kind": "field",
@@ -58,8 +57,7 @@
58
57
  "type": {
59
58
  "text": "ChartCategories | undefined"
60
59
  },
61
- "description": "If categories are present names are used instead of numbers for the category axis.\nThe format of categories can be an `Array` with a list of categories, such as `['2010', '2011', '2012']`\nor a mapping `Object`, like `{0:'1',9:'Target (10)', 15: 'Max'}`.",
62
- "attribute": "categories"
60
+ "description": "If categories are present names are used instead of numbers for the category axis.\nThe format of categories can be an `Array` with a list of categories, such as `['2010', '2011', '2012']`\nor a mapping `Object`, like `{0:'1',9:'Target (10)', 15: 'Max'}`."
63
61
  },
64
62
  {
65
63
  "kind": "field",
@@ -108,8 +106,7 @@
108
106
  "type": {
109
107
  "text": "!Highcharts.Chart | undefined"
110
108
  },
111
- "description": "Configuration object that exposes the JS Api to configure the chart.\n\nMost important methods are:\n- `addSeries (Object options, [Boolean redraw], [Mixed animation])`\n- `addAxis (Object options, [Boolean isX], [Boolean redraw], [Mixed animation])`\n- `setTitle (Object title, object subtitle, Boolean redraw)`\n\nMost important properties are:\n- `configuration.series`: An array of the chart's series. Detailed API for Series object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Series)\n- `configuration.xAxis`: An array of the chart's x axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.yAxis`: An array of the chart's y axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.title`: The chart title.\n\nFor detailed documentation of available API check the [API site](http://api.highcharts.com/class-reference/classes.list)",
112
- "attribute": "configuration"
109
+ "description": "Configuration object that exposes the JS Api to configure the chart.\n\nMost important methods are:\n- `addSeries (Object options, [Boolean redraw], [Mixed animation])`\n- `addAxis (Object options, [Boolean isX], [Boolean redraw], [Mixed animation])`\n- `setTitle (Object title, object subtitle, Boolean redraw)`\n\nMost important properties are:\n- `configuration.series`: An array of the chart's series. Detailed API for Series object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Series)\n- `configuration.xAxis`: An array of the chart's x axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.yAxis`: An array of the chart's y axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.title`: The chart title.\n\nFor detailed documentation of available API check the [API site](http://api.highcharts.com/class-reference/classes.list)"
113
110
  },
114
111
  {
115
112
  "kind": "field",
@@ -234,22 +231,6 @@
234
231
  ],
235
232
  "events": [],
236
233
  "attributes": [
237
- {
238
- "name": "additional-options",
239
- "type": {
240
- "text": "Options | undefined"
241
- },
242
- "description": "Represents additional JSON configuration.",
243
- "fieldName": "additionalOptions"
244
- },
245
- {
246
- "name": "categories",
247
- "type": {
248
- "text": "ChartCategories | undefined"
249
- },
250
- "description": "If categories are present names are used instead of numbers for the category axis.\nThe format of categories can be an `Array` with a list of categories, such as `['2010', '2011', '2012']`\nor a mapping `Object`, like `{0:'1',9:'Target (10)', 15: 'Max'}`.",
251
- "fieldName": "categories"
252
- },
253
234
  {
254
235
  "name": "category-max",
255
236
  "type": {
@@ -282,14 +263,6 @@
282
263
  "description": "Specifies whether to show chart in 3 or in 2 dimensions.\nSome display angles are added by default to the \"chart.options3d\" (`{alpha: 15, beta: 15, depth: 50}`).\n3D display options can be modified via `additionalOptions`.\nThe thickness of a Pie chart can be set on `additionalOptions` through `plotOptions.pie.depth`.\n3D is supported by Bar, Column, Pie and Scatter3D charts.\nMore info available at [Highcharts](https://www.highcharts.com/docs/chart-concepts/3d-charts).",
283
264
  "fieldName": "chart3d"
284
265
  },
285
- {
286
- "name": "configuration",
287
- "type": {
288
- "text": "!Highcharts.Chart | undefined"
289
- },
290
- "description": "Configuration object that exposes the JS Api to configure the chart.\n\nMost important methods are:\n- `addSeries (Object options, [Boolean redraw], [Mixed animation])`\n- `addAxis (Object options, [Boolean isX], [Boolean redraw], [Mixed animation])`\n- `setTitle (Object title, object subtitle, Boolean redraw)`\n\nMost important properties are:\n- `configuration.series`: An array of the chart's series. Detailed API for Series object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Series)\n- `configuration.xAxis`: An array of the chart's x axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.yAxis`: An array of the chart's y axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.title`: The chart title.\n\nFor detailed documentation of available API check the [API site](http://api.highcharts.com/class-reference/classes.list)",
291
- "fieldName": "configuration"
292
- },
293
266
  {
294
267
  "name": "empty-text",
295
268
  "type": {
@@ -403,8 +376,7 @@
403
376
  "type": {
404
377
  "text": "SeriesOptionsType | undefined"
405
378
  },
406
- "description": "Represents additional JSON configuration.",
407
- "attribute": "additional-options"
379
+ "description": "Represents additional JSON configuration."
408
380
  },
409
381
  {
410
382
  "kind": "field",
@@ -444,8 +416,7 @@
444
416
  "text": "!ChartSeriesOptions"
445
417
  },
446
418
  "description": "Object with the configured options defined and used to create a series.",
447
- "readonly": true,
448
- "attribute": "options"
419
+ "readonly": true
449
420
  },
450
421
  {
451
422
  "kind": "method",
@@ -528,19 +499,10 @@
528
499
  "type": {
529
500
  "text": "ChartSeriesValues"
530
501
  },
531
- "description": "An array of data used by the series.\nFormat depends on the chart type and can be:\n - An array of numerical values `[y0, y1, y2, y3,...]`\n - An array of arrays with 2 values (`x`, `y`) `[ [x0, y0], [x1, y1], [x2, y2], ... ]`\n - An array of objects, each one describing one point `[ {x: x0, y: y0, name: 'Point0', color: '#FF0000'}, {...}, ...]`\n\n See more in [API Site](https://api.highcharts.com/highcharts/series)",
532
- "attribute": "values"
502
+ "description": "An array of data used by the series.\nFormat depends on the chart type and can be:\n - An array of numerical values `[y0, y1, y2, y3,...]`\n - An array of arrays with 2 values (`x`, `y`) `[ [x0, y0], [x1, y1], [x2, y2], ... ]`\n - An array of objects, each one describing one point `[ {x: x0, y: y0, name: 'Point0', color: '#FF0000'}, {...}, ...]`\n\n See more in [API Site](https://api.highcharts.com/highcharts/series)"
533
503
  }
534
504
  ],
535
505
  "attributes": [
536
- {
537
- "name": "additional-options",
538
- "type": {
539
- "text": "SeriesOptionsType | undefined"
540
- },
541
- "description": "Represents additional JSON configuration.",
542
- "fieldName": "additionalOptions"
543
- },
544
506
  {
545
507
  "name": "markers",
546
508
  "type": {
@@ -565,15 +527,6 @@
565
527
  "description": "The width of the neck, the lower part of the funnel.\nA number defines pixel width, a percentage string defines a percentage of the plot area width. Defaults to 30%.\nNote that this property only applies for \"funnel\" charts.",
566
528
  "fieldName": "neckWidth"
567
529
  },
568
- {
569
- "name": "options",
570
- "type": {
571
- "text": "!ChartSeriesOptions"
572
- },
573
- "description": "Object with the configured options defined and used to create a series.",
574
- "readonly": true,
575
- "fieldName": "options"
576
- },
577
530
  {
578
531
  "name": "stack",
579
532
  "type": {
@@ -621,14 +574,6 @@
621
574
  },
622
575
  "description": "Value-axis minimum-value.\nSets the value to a series bound by 'unit' property.\nOtherwise sets the value to the first series.\nUndefined by default (determined from data).",
623
576
  "fieldName": "valueMin"
624
- },
625
- {
626
- "name": "values",
627
- "type": {
628
- "text": "ChartSeriesValues"
629
- },
630
- "description": "An array of data used by the series.\nFormat depends on the chart type and can be:\n - An array of numerical values `[y0, y1, y2, y3,...]`\n - An array of arrays with 2 values (`x`, `y`) `[ [x0, y0], [x1, y1], [x2, y2], ... ]`\n - An array of objects, each one describing one point `[ {x: x0, y: y0, name: 'Point0', color: '#FF0000'}, {...}, ...]`\n\n See more in [API Site](https://api.highcharts.com/highcharts/series)",
631
- "fieldName": "values"
632
577
  }
633
578
  ],
634
579
  "parameters": [
@@ -666,7 +611,6 @@
666
611
  "text": "SeriesOptionsType | undefined"
667
612
  },
668
613
  "description": "Represents additional JSON configuration.",
669
- "attribute": "additional-options",
670
614
  "inheritedFrom": {
671
615
  "name": "ChartSeriesMixin",
672
616
  "module": "src/vaadin-chart-series-mixin.js"
@@ -723,7 +667,6 @@
723
667
  },
724
668
  "description": "Object with the configured options defined and used to create a series.",
725
669
  "readonly": true,
726
- "attribute": "options",
727
670
  "inheritedFrom": {
728
671
  "name": "ChartSeriesMixin",
729
672
  "module": "src/vaadin-chart-series-mixin.js"
@@ -839,7 +782,6 @@
839
782
  "text": "ChartSeriesValues"
840
783
  },
841
784
  "description": "An array of data used by the series.\nFormat depends on the chart type and can be:\n - An array of numerical values `[y0, y1, y2, y3,...]`\n - An array of arrays with 2 values (`x`, `y`) `[ [x0, y0], [x1, y1], [x2, y2], ... ]`\n - An array of objects, each one describing one point `[ {x: x0, y: y0, name: 'Point0', color: '#FF0000'}, {...}, ...]`\n\n See more in [API Site](https://api.highcharts.com/highcharts/series)",
842
- "attribute": "values",
843
785
  "inheritedFrom": {
844
786
  "name": "ChartSeriesMixin",
845
787
  "module": "src/vaadin-chart-series-mixin.js"
@@ -863,18 +805,6 @@
863
805
  "tagName": "vaadin-chart-series",
864
806
  "customElement": true,
865
807
  "attributes": [
866
- {
867
- "name": "additional-options",
868
- "type": {
869
- "text": "SeriesOptionsType | undefined"
870
- },
871
- "description": "Represents additional JSON configuration.",
872
- "fieldName": "additionalOptions",
873
- "inheritedFrom": {
874
- "name": "ChartSeriesMixin",
875
- "module": "src/vaadin-chart-series-mixin.js"
876
- }
877
- },
878
808
  {
879
809
  "name": "markers",
880
810
  "type": {
@@ -911,19 +841,6 @@
911
841
  "module": "src/vaadin-chart-series-mixin.js"
912
842
  }
913
843
  },
914
- {
915
- "name": "options",
916
- "type": {
917
- "text": "!ChartSeriesOptions"
918
- },
919
- "description": "Object with the configured options defined and used to create a series.",
920
- "readonly": true,
921
- "fieldName": "options",
922
- "inheritedFrom": {
923
- "name": "ChartSeriesMixin",
924
- "module": "src/vaadin-chart-series-mixin.js"
925
- }
926
- },
927
844
  {
928
845
  "name": "stack",
929
846
  "type": {
@@ -995,18 +912,6 @@
995
912
  "name": "ChartSeriesMixin",
996
913
  "module": "src/vaadin-chart-series-mixin.js"
997
914
  }
998
- },
999
- {
1000
- "name": "values",
1001
- "type": {
1002
- "text": "ChartSeriesValues"
1003
- },
1004
- "description": "An array of data used by the series.\nFormat depends on the chart type and can be:\n - An array of numerical values `[y0, y1, y2, y3,...]`\n - An array of arrays with 2 values (`x`, `y`) `[ [x0, y0], [x1, y1], [x2, y2], ... ]`\n - An array of objects, each one describing one point `[ {x: x0, y: y0, name: 'Point0', color: '#FF0000'}, {...}, ...]`\n\n See more in [API Site](https://api.highcharts.com/highcharts/series)",
1005
- "fieldName": "values",
1006
- "inheritedFrom": {
1007
- "name": "ChartSeriesMixin",
1008
- "module": "src/vaadin-chart-series-mixin.js"
1009
- }
1010
915
  }
1011
916
  ],
1012
917
  "events": []
@@ -1040,7 +945,6 @@
1040
945
  "text": "Options | undefined"
1041
946
  },
1042
947
  "description": "Represents additional JSON configuration.",
1043
- "attribute": "additional-options",
1044
948
  "inheritedFrom": {
1045
949
  "name": "ChartMixin",
1046
950
  "module": "src/vaadin-chart-mixin.js"
@@ -1054,7 +958,6 @@
1054
958
  "text": "ChartCategories | undefined"
1055
959
  },
1056
960
  "description": "If categories are present names are used instead of numbers for the category axis.\nThe format of categories can be an `Array` with a list of categories, such as `['2010', '2011', '2012']`\nor a mapping `Object`, like `{0:'1',9:'Target (10)', 15: 'Max'}`.",
1057
- "attribute": "categories",
1058
961
  "inheritedFrom": {
1059
962
  "name": "ChartMixin",
1060
963
  "module": "src/vaadin-chart-mixin.js"
@@ -1124,7 +1027,6 @@
1124
1027
  "text": "!Highcharts.Chart | undefined"
1125
1028
  },
1126
1029
  "description": "Configuration object that exposes the JS Api to configure the chart.\n\nMost important methods are:\n- `addSeries (Object options, [Boolean redraw], [Mixed animation])`\n- `addAxis (Object options, [Boolean isX], [Boolean redraw], [Mixed animation])`\n- `setTitle (Object title, object subtitle, Boolean redraw)`\n\nMost important properties are:\n- `configuration.series`: An array of the chart's series. Detailed API for Series object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Series)\n- `configuration.xAxis`: An array of the chart's x axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.yAxis`: An array of the chart's y axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.title`: The chart title.\n\nFor detailed documentation of available API check the [API site](http://api.highcharts.com/class-reference/classes.list)",
1127
- "attribute": "configuration",
1128
1030
  "inheritedFrom": {
1129
1031
  "name": "ChartMixin",
1130
1032
  "module": "src/vaadin-chart-mixin.js"
@@ -1536,30 +1438,6 @@
1536
1438
  }
1537
1439
  ],
1538
1440
  "attributes": [
1539
- {
1540
- "name": "additional-options",
1541
- "type": {
1542
- "text": "Options | undefined"
1543
- },
1544
- "description": "Represents additional JSON configuration.",
1545
- "fieldName": "additionalOptions",
1546
- "inheritedFrom": {
1547
- "name": "ChartMixin",
1548
- "module": "src/vaadin-chart-mixin.js"
1549
- }
1550
- },
1551
- {
1552
- "name": "categories",
1553
- "type": {
1554
- "text": "ChartCategories | undefined"
1555
- },
1556
- "description": "If categories are present names are used instead of numbers for the category axis.\nThe format of categories can be an `Array` with a list of categories, such as `['2010', '2011', '2012']`\nor a mapping `Object`, like `{0:'1',9:'Target (10)', 15: 'Max'}`.",
1557
- "fieldName": "categories",
1558
- "inheritedFrom": {
1559
- "name": "ChartMixin",
1560
- "module": "src/vaadin-chart-mixin.js"
1561
- }
1562
- },
1563
1441
  {
1564
1442
  "name": "category-max",
1565
1443
  "type": {
@@ -1608,18 +1486,6 @@
1608
1486
  "module": "src/vaadin-chart-mixin.js"
1609
1487
  }
1610
1488
  },
1611
- {
1612
- "name": "configuration",
1613
- "type": {
1614
- "text": "!Highcharts.Chart | undefined"
1615
- },
1616
- "description": "Configuration object that exposes the JS Api to configure the chart.\n\nMost important methods are:\n- `addSeries (Object options, [Boolean redraw], [Mixed animation])`\n- `addAxis (Object options, [Boolean isX], [Boolean redraw], [Mixed animation])`\n- `setTitle (Object title, object subtitle, Boolean redraw)`\n\nMost important properties are:\n- `configuration.series`: An array of the chart's series. Detailed API for Series object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Series)\n- `configuration.xAxis`: An array of the chart's x axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.yAxis`: An array of the chart's y axes. Detailed API for Axis object is\n available in [API Site](http://api.highcharts.com/class-reference/Highcharts.Axis)\n- `configuration.title`: The chart title.\n\nFor detailed documentation of available API check the [API site](http://api.highcharts.com/class-reference/classes.list)",
1617
- "fieldName": "configuration",
1618
- "inheritedFrom": {
1619
- "name": "ChartMixin",
1620
- "module": "src/vaadin-chart-mixin.js"
1621
- }
1622
- },
1623
1489
  {
1624
1490
  "name": "empty-text",
1625
1491
  "type": {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vaadin/charts",
3
- "version": "25.4.0-alpha3",
3
+ "version": "25.4.0-alpha5",
4
4
  "publishConfig": {
5
5
  "access": "public"
6
6
  },
@@ -35,17 +35,17 @@
35
35
  ],
36
36
  "dependencies": {
37
37
  "@open-wc/dedupe-mixin": "^1.3.0",
38
- "@vaadin/component-base": "25.4.0-alpha3",
39
- "@vaadin/vaadin-themable-mixin": "25.4.0-alpha3",
38
+ "@vaadin/component-base": "25.4.0-alpha5",
39
+ "@vaadin/vaadin-themable-mixin": "25.4.0-alpha5",
40
40
  "highcharts": "12.2.0",
41
41
  "lit": "^3.0.0"
42
42
  },
43
43
  "devDependencies": {
44
- "@vaadin/aura": "25.4.0-alpha3",
45
- "@vaadin/chai-plugins": "25.4.0-alpha3",
46
- "@vaadin/test-runner-commands": "25.4.0-alpha3",
44
+ "@vaadin/aura": "25.4.0-alpha5",
45
+ "@vaadin/chai-plugins": "25.4.0-alpha5",
46
+ "@vaadin/test-runner-commands": "25.4.0-alpha5",
47
47
  "@vaadin/testing-helpers": "^2.0.0",
48
- "@vaadin/vaadin-lumo-styles": "25.4.0-alpha3",
48
+ "@vaadin/vaadin-lumo-styles": "25.4.0-alpha5",
49
49
  "sinon": "^22.0.0"
50
50
  },
51
51
  "cvdlName": "vaadin-chart",
@@ -54,5 +54,5 @@
54
54
  "web-types.json",
55
55
  "web-types.lit.json"
56
56
  ],
57
- "gitHead": "db7e679c1a8af00840cc05ddcbefff68dfed1e45"
57
+ "gitHead": "65e9c9e49c0a723b08ee91b9aae8b901e91a3597"
58
58
  }
package/web-types.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/charts",
4
- "version": "25.4.0-alpha3",
4
+ "version": "25.4.0-alpha5",
5
5
  "description-markup": "markdown",
6
6
  "contributions": {
7
7
  "html": {
@@ -206,7 +206,7 @@
206
206
  },
207
207
  {
208
208
  "name": "vaadin-chart",
209
- "description": "`<vaadin-chart>` is a Web Component for creating high quality charts.\n\n### Basic use\n\nThere are two ways of configuring your `<vaadin-chart>` element: **HTML API**, **JS API** and **JSON API**.\nNote that you can make use of all APIs in your element.\n\n#### Using HTML API\n\n`vaadin-chart` has a set of attributes to make it easier for you to customize your chart.\n\n```html\n<vaadin-chart title=\"The chart title\" subtitle=\"The chart subtitle\">\n <vaadin-chart-series\n type=\"column\"\n title=\"The series title\"\n values=\"[10, 20, 30]\"\n ></vaadin-chart-series>\n</vaadin-chart>\n```\n\n> Note that while you can set type for each series individually, for some types, such as `'bar'`, `'gauge'` and `'solidgauge'`, you\n> have to set it as the default series type on `<vaadin-chart>` in order to work properly.\n\n#### Using JS API\n\nUse [`configuration`](https://cdn.vaadin.com/vaadin-web-components/25.4.0-alpha3/#/elements/vaadin-chart#property-configuration) property to set chart title, categories and data:\n\n```js\nconst chart = document.querySelector('vaadin-chart');\n\n// Wait for default configuration to be ready\nrequestAnimationFrame(() => {\n const configuration = chart.configuration;\n configuration.setTitle({ text: 'The chart title' });\n // By default there is one X axis, it is referenced by configuration.xAxis[0].\n configuration.xAxis[0].setCategories(['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']);\n configuration.addSeries({\n type: 'column',\n data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]\n });\n});\n```\n\n#### Using JS JSON API\n\nUse [`updateConfiguration`](https://cdn.vaadin.com/vaadin-web-components/25.4.0-alpha3/#/elements/vaadin-chart#method-updateConfiguration) method to set chart title, categories and data:\n\n```js\nconst chart = document.querySelector('vaadin-chart');\nchart.updateConfiguration({\n title: {\n text: 'The chart title'\n },\n subtitle: {\n text: 'Subtitle'\n },\n xAxis: {\n categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']\n },\n series: [{\n type: 'column',\n data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]\n }]\n});\n```\n\n**Note:** chart style customization cannot be done via the JS or JSON API.\nStyling properties in the JSON configuration will be ignored. The following section discusses chart styling.\n\n### CSS Styling\n\nChart appearance is primarily controlled by CSS style rules.\nA comprehensive list of the supported style classes can be found at\nhttps://www.highcharts.com/docs/chart-design-and-style/style-by-css\n\nSee also the [Chart Styling](https://vaadin.com/docs/latest/components/charts/css-styling) documentation.\n\n### RTL support\n\n`vaadin-charts` as well as [Highcharts](https://www.highcharts.com/) by itself are not adjusting the layout\nbased on the `dir` attribute. In order to make `vaadin-charts` display RTL content properly additional\nJSON configuration should be used.\nEach chart should be updated based on the specific needs, but general recommendations are:\n\n 1. Set `reversed` to true for xAxis (https://api.highcharts.com/highcharts/xAxis.reversed).\n 2. Set `useHTML` to true for text elements, i.e. `tooltip` (https://api.highcharts.com/highcharts/tooltip.useHTML).\n 3. Set `rtl` to true for `legend` (https://api.highcharts.com/highcharts/legend.rtl).\n\n### Setting colors\n\nAlthough charts can be styled as described above, there is a simpler way for setting colors.\nColors can be set using CSS custom properties `--vaadin-charts-color-{n}` (where `n` goes from `0 - 9`).\n\nFor example `--vaadin-charts-color-0` sets the color of the first series on a chart.",
209
+ "description": "`<vaadin-chart>` is a Web Component for creating high quality charts.\n\n### Basic use\n\nThere are two ways of configuring your `<vaadin-chart>` element: **HTML API**, **JS API** and **JSON API**.\nNote that you can make use of all APIs in your element.\n\n#### Using HTML API\n\n`vaadin-chart` has a set of attributes to make it easier for you to customize your chart.\n\n```html\n<vaadin-chart title=\"The chart title\" subtitle=\"The chart subtitle\">\n <vaadin-chart-series\n type=\"column\"\n title=\"The series title\"\n values=\"[10, 20, 30]\"\n ></vaadin-chart-series>\n</vaadin-chart>\n```\n\n> Note that while you can set type for each series individually, for some types, such as `'bar'`, `'gauge'` and `'solidgauge'`, you\n> have to set it as the default series type on `<vaadin-chart>` in order to work properly.\n\n#### Using JS API\n\nUse [`configuration`](https://cdn.vaadin.com/vaadin-web-components/25.4.0-alpha5/#/elements/vaadin-chart#property-configuration) property to set chart title, categories and data:\n\n```js\nconst chart = document.querySelector('vaadin-chart');\n\n// Wait for default configuration to be ready\nrequestAnimationFrame(() => {\n const configuration = chart.configuration;\n configuration.setTitle({ text: 'The chart title' });\n // By default there is one X axis, it is referenced by configuration.xAxis[0].\n configuration.xAxis[0].setCategories(['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']);\n configuration.addSeries({\n type: 'column',\n data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]\n });\n});\n```\n\n#### Using JS JSON API\n\nUse [`updateConfiguration`](https://cdn.vaadin.com/vaadin-web-components/25.4.0-alpha5/#/elements/vaadin-chart#method-updateConfiguration) method to set chart title, categories and data:\n\n```js\nconst chart = document.querySelector('vaadin-chart');\nchart.updateConfiguration({\n title: {\n text: 'The chart title'\n },\n subtitle: {\n text: 'Subtitle'\n },\n xAxis: {\n categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']\n },\n series: [{\n type: 'column',\n data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]\n }]\n});\n```\n\n**Note:** chart style customization cannot be done via the JS or JSON API.\nStyling properties in the JSON configuration will be ignored. The following section discusses chart styling.\n\n### CSS Styling\n\nChart appearance is primarily controlled by CSS style rules.\nA comprehensive list of the supported style classes can be found at\nhttps://www.highcharts.com/docs/chart-design-and-style/style-by-css\n\nSee also the [Chart Styling](https://vaadin.com/docs/latest/components/charts/css-styling) documentation.\n\n### RTL support\n\n`vaadin-charts` as well as [Highcharts](https://www.highcharts.com/) by itself are not adjusting the layout\nbased on the `dir` attribute. In order to make `vaadin-charts` display RTL content properly additional\nJSON configuration should be used.\nEach chart should be updated based on the specific needs, but general recommendations are:\n\n 1. Set `reversed` to true for xAxis (https://api.highcharts.com/highcharts/xAxis.reversed).\n 2. Set `useHTML` to true for text elements, i.e. `tooltip` (https://api.highcharts.com/highcharts/tooltip.useHTML).\n 3. Set `rtl` to true for `legend` (https://api.highcharts.com/highcharts/legend.rtl).\n\n### Setting colors\n\nAlthough charts can be styled as described above, there is a simpler way for setting colors.\nColors can be set using CSS custom properties `--vaadin-charts-color-{n}` (where `n` goes from `0 - 9`).\n\nFor example `--vaadin-charts-color-0` sets the color of the first series on a chart.",
210
210
  "attributes": [
211
211
  {
212
212
  "name": "category-max",
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "$schema": "https://json.schemastore.org/web-types",
3
3
  "name": "@vaadin/charts",
4
- "version": "25.4.0-alpha3",
4
+ "version": "25.4.0-alpha5",
5
5
  "description-markup": "markdown",
6
6
  "framework": "lit",
7
7
  "framework-config": {
@@ -100,7 +100,7 @@
100
100
  },
101
101
  {
102
102
  "name": "vaadin-chart",
103
- "description": "`<vaadin-chart>` is a Web Component for creating high quality charts.\n\n### Basic use\n\nThere are two ways of configuring your `<vaadin-chart>` element: **HTML API**, **JS API** and **JSON API**.\nNote that you can make use of all APIs in your element.\n\n#### Using HTML API\n\n`vaadin-chart` has a set of attributes to make it easier for you to customize your chart.\n\n```html\n<vaadin-chart title=\"The chart title\" subtitle=\"The chart subtitle\">\n <vaadin-chart-series\n type=\"column\"\n title=\"The series title\"\n values=\"[10, 20, 30]\"\n ></vaadin-chart-series>\n</vaadin-chart>\n```\n\n> Note that while you can set type for each series individually, for some types, such as `'bar'`, `'gauge'` and `'solidgauge'`, you\n> have to set it as the default series type on `<vaadin-chart>` in order to work properly.\n\n#### Using JS API\n\nUse [`configuration`](https://cdn.vaadin.com/vaadin-web-components/25.4.0-alpha3/#/elements/vaadin-chart#property-configuration) property to set chart title, categories and data:\n\n```js\nconst chart = document.querySelector('vaadin-chart');\n\n// Wait for default configuration to be ready\nrequestAnimationFrame(() => {\n const configuration = chart.configuration;\n configuration.setTitle({ text: 'The chart title' });\n // By default there is one X axis, it is referenced by configuration.xAxis[0].\n configuration.xAxis[0].setCategories(['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']);\n configuration.addSeries({\n type: 'column',\n data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]\n });\n});\n```\n\n#### Using JS JSON API\n\nUse [`updateConfiguration`](https://cdn.vaadin.com/vaadin-web-components/25.4.0-alpha3/#/elements/vaadin-chart#method-updateConfiguration) method to set chart title, categories and data:\n\n```js\nconst chart = document.querySelector('vaadin-chart');\nchart.updateConfiguration({\n title: {\n text: 'The chart title'\n },\n subtitle: {\n text: 'Subtitle'\n },\n xAxis: {\n categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']\n },\n series: [{\n type: 'column',\n data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]\n }]\n});\n```\n\n**Note:** chart style customization cannot be done via the JS or JSON API.\nStyling properties in the JSON configuration will be ignored. The following section discusses chart styling.\n\n### CSS Styling\n\nChart appearance is primarily controlled by CSS style rules.\nA comprehensive list of the supported style classes can be found at\nhttps://www.highcharts.com/docs/chart-design-and-style/style-by-css\n\nSee also the [Chart Styling](https://vaadin.com/docs/latest/components/charts/css-styling) documentation.\n\n### RTL support\n\n`vaadin-charts` as well as [Highcharts](https://www.highcharts.com/) by itself are not adjusting the layout\nbased on the `dir` attribute. In order to make `vaadin-charts` display RTL content properly additional\nJSON configuration should be used.\nEach chart should be updated based on the specific needs, but general recommendations are:\n\n 1. Set `reversed` to true for xAxis (https://api.highcharts.com/highcharts/xAxis.reversed).\n 2. Set `useHTML` to true for text elements, i.e. `tooltip` (https://api.highcharts.com/highcharts/tooltip.useHTML).\n 3. Set `rtl` to true for `legend` (https://api.highcharts.com/highcharts/legend.rtl).\n\n### Setting colors\n\nAlthough charts can be styled as described above, there is a simpler way for setting colors.\nColors can be set using CSS custom properties `--vaadin-charts-color-{n}` (where `n` goes from `0 - 9`).\n\nFor example `--vaadin-charts-color-0` sets the color of the first series on a chart.",
103
+ "description": "`<vaadin-chart>` is a Web Component for creating high quality charts.\n\n### Basic use\n\nThere are two ways of configuring your `<vaadin-chart>` element: **HTML API**, **JS API** and **JSON API**.\nNote that you can make use of all APIs in your element.\n\n#### Using HTML API\n\n`vaadin-chart` has a set of attributes to make it easier for you to customize your chart.\n\n```html\n<vaadin-chart title=\"The chart title\" subtitle=\"The chart subtitle\">\n <vaadin-chart-series\n type=\"column\"\n title=\"The series title\"\n values=\"[10, 20, 30]\"\n ></vaadin-chart-series>\n</vaadin-chart>\n```\n\n> Note that while you can set type for each series individually, for some types, such as `'bar'`, `'gauge'` and `'solidgauge'`, you\n> have to set it as the default series type on `<vaadin-chart>` in order to work properly.\n\n#### Using JS API\n\nUse [`configuration`](https://cdn.vaadin.com/vaadin-web-components/25.4.0-alpha5/#/elements/vaadin-chart#property-configuration) property to set chart title, categories and data:\n\n```js\nconst chart = document.querySelector('vaadin-chart');\n\n// Wait for default configuration to be ready\nrequestAnimationFrame(() => {\n const configuration = chart.configuration;\n configuration.setTitle({ text: 'The chart title' });\n // By default there is one X axis, it is referenced by configuration.xAxis[0].\n configuration.xAxis[0].setCategories(['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']);\n configuration.addSeries({\n type: 'column',\n data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]\n });\n});\n```\n\n#### Using JS JSON API\n\nUse [`updateConfiguration`](https://cdn.vaadin.com/vaadin-web-components/25.4.0-alpha5/#/elements/vaadin-chart#method-updateConfiguration) method to set chart title, categories and data:\n\n```js\nconst chart = document.querySelector('vaadin-chart');\nchart.updateConfiguration({\n title: {\n text: 'The chart title'\n },\n subtitle: {\n text: 'Subtitle'\n },\n xAxis: {\n categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']\n },\n series: [{\n type: 'column',\n data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]\n }]\n});\n```\n\n**Note:** chart style customization cannot be done via the JS or JSON API.\nStyling properties in the JSON configuration will be ignored. The following section discusses chart styling.\n\n### CSS Styling\n\nChart appearance is primarily controlled by CSS style rules.\nA comprehensive list of the supported style classes can be found at\nhttps://www.highcharts.com/docs/chart-design-and-style/style-by-css\n\nSee also the [Chart Styling](https://vaadin.com/docs/latest/components/charts/css-styling) documentation.\n\n### RTL support\n\n`vaadin-charts` as well as [Highcharts](https://www.highcharts.com/) by itself are not adjusting the layout\nbased on the `dir` attribute. In order to make `vaadin-charts` display RTL content properly additional\nJSON configuration should be used.\nEach chart should be updated based on the specific needs, but general recommendations are:\n\n 1. Set `reversed` to true for xAxis (https://api.highcharts.com/highcharts/xAxis.reversed).\n 2. Set `useHTML` to true for text elements, i.e. `tooltip` (https://api.highcharts.com/highcharts/tooltip.useHTML).\n 3. Set `rtl` to true for `legend` (https://api.highcharts.com/highcharts/legend.rtl).\n\n### Setting colors\n\nAlthough charts can be styled as described above, there is a simpler way for setting colors.\nColors can be set using CSS custom properties `--vaadin-charts-color-{n}` (where `n` goes from `0 - 9`).\n\nFor example `--vaadin-charts-color-0` sets the color of the first series on a chart.",
104
104
  "extension": true,
105
105
  "attributes": [
106
106
  {