@vaadin/charts 25.0.0-alpha9 → 25.0.0-beta1

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 (18) hide show
  1. package/package.json +9 -12
  2. package/src/helpers.js +46 -0
  3. package/src/styles/vaadin-chart-base-styles.js +488 -310
  4. package/src/vaadin-chart-mixin.d.ts +9 -2
  5. package/src/vaadin-chart-mixin.js +131 -73
  6. package/src/vaadin-chart-series.d.ts +11 -11
  7. package/src/vaadin-chart-series.js +11 -11
  8. package/src/vaadin-chart.d.ts +46 -67
  9. package/src/vaadin-chart.js +50 -69
  10. package/vaadin-chart.js +1 -1
  11. package/web-types.json +9 -5
  12. package/web-types.lit.json +12 -5
  13. package/src/styles/vaadin-chart-core-styles.d.ts +0 -13
  14. package/src/styles/vaadin-chart-core-styles.js +0 -1063
  15. package/theme/lumo/vaadin-chart-styles.d.ts +0 -5
  16. package/theme/lumo/vaadin-chart-styles.js +0 -96
  17. package/theme/lumo/vaadin-chart.d.ts +0 -2
  18. package/theme/lumo/vaadin-chart.js +0 -2
package/theme/lumo/vaadin-chart-styles.d.ts DELETED
@@ -1,5 +0,0 @@
1
- import '@vaadin/vaadin-lumo-styles/color.js';
2
- import '@vaadin/vaadin-lumo-styles/typography.js';
3
- declare const chartColors: import("lit").CSSResult;
4
- declare const chartTheme: import("lit").CSSResult;
5
- export { chartColors, chartTheme };
package/theme/lumo/vaadin-chart-styles.js DELETED
@@ -1,96 +0,0 @@
1
- import '@vaadin/vaadin-lumo-styles/color.js';
2
- import '@vaadin/vaadin-lumo-styles/typography.js';
3
- import { css, registerStyles } from '@vaadin/vaadin-themable-mixin/register-styles.js';
4
-
5
- const chartColors = css`
6
- :host {
7
- --vaadin-charts-color-0: #5ac2f7;
8
- --vaadin-charts-color-1: #1676f3;
9
- --vaadin-charts-color-2: #ff7d94;
10
- --vaadin-charts-color-3: #c5164e;
11
- --vaadin-charts-color-4: #15c15d;
12
- --vaadin-charts-color-5: #0e8151;
13
- --vaadin-charts-color-6: #c18ed2;
14
- --vaadin-charts-color-7: #9233b3;
15
- --vaadin-charts-color-8: #fda253;
16
- --vaadin-charts-color-9: #e24932;
17
- --vaadin-charts-color-positive: var(--vaadin-charts-color-4, #15c15d);
18
- --vaadin-charts-color-negative: var(--vaadin-charts-color-9, #e24932);
19
- }
20
-
21
- :host([theme~='gradient']) {
22
- --vaadin-charts-color-0: #1676f3;
23
- --vaadin-charts-color-1: #13bbf0;
24
- --vaadin-charts-color-2: #1ee;
25
- --vaadin-charts-color-3: #0cd9bf;
26
- --vaadin-charts-color-4: #06be81;
27
- --vaadin-charts-color-5: #00a344;
28
- --vaadin-charts-color-6: #41c639;
29
- --vaadin-charts-color-7: #8aed2c;
30
- --vaadin-charts-color-8: #c0e632;
31
- --vaadin-charts-color-9: #f6db3a;
32
- --vaadin-charts-color-positive: var(--vaadin-charts-color-6);
33
- --vaadin-charts-color-negative: var(--vaadin-charts-color-1);
34
- }
35
-
36
- :host([theme~='monotone']) {
37
- --vaadin-charts-color-0: #1676f3;
38
- --vaadin-charts-color-1: #4795f5;
39
- --vaadin-charts-color-2: #71b0f7;
40
- --vaadin-charts-color-3: #a0cef9;
41
- --vaadin-charts-color-4: #bce0fa;
42
- --vaadin-charts-color-5: #a8d8ed;
43
- --vaadin-charts-color-6: #7fc3dd;
44
- --vaadin-charts-color-7: #54adcc;
45
- --vaadin-charts-color-8: #2b99bc;
46
- --vaadin-charts-color-9: #0284ac;
47
- --vaadin-charts-color-positive: var(--vaadin-charts-color-3);
48
- --vaadin-charts-color-negative: var(--vaadin-charts-color-9);
49
- }
50
-
51
- :host([theme~='classic']) {
52
- --vaadin-charts-color-0: #7cb5ec;
53
- --vaadin-charts-color-1: #434348;
54
- --vaadin-charts-color-2: #90ed7d;
55
- --vaadin-charts-color-3: #f7a35c;
56
- --vaadin-charts-color-4: #8085e9;
57
- --vaadin-charts-color-5: #f15c80;
58
- --vaadin-charts-color-6: #e4d354;
59
- --vaadin-charts-color-7: #2b908f;
60
- --vaadin-charts-color-8: #f45b5b;
61
- --vaadin-charts-color-9: #91e8e1;
62
- }
63
- `;
64
-
65
- const chartTheme = css`
66
- :host {
67
- --vaadin-charts-background: var(--lumo-base-color);
68
- --vaadin-charts-title-label: var(--lumo-header-text-color);
69
- --vaadin-charts-axis-title: var(--lumo-secondary-text-color);
70
- --vaadin-charts-axis-label: var(--lumo-secondary-text-color);
71
- --vaadin-charts-data-label: var(--lumo-body-text-color);
72
- --vaadin-charts-secondary-label: var(--lumo-secondary-text-color);
73
- --vaadin-charts-axis-line: var(--lumo-contrast-5pct);
74
- --vaadin-charts-grid-line: var(--lumo-contrast-20pct);
75
- --vaadin-charts-disabled-label: var(--lumo-disabled-text-color);
76
- --vaadin-charts-contrast: var(--lumo-contrast);
77
- --vaadin-charts-contrast-5pct: var(--lumo-contrast-5pct);
78
- --vaadin-charts-contrast-10pct: var(--lumo-contrast-10pct);
79
- --vaadin-charts-contrast-20pct: var(--lumo-contrast-20pct);
80
- --vaadin-charts-contrast-60pct: var(--lumo-contrast-60pct);
81
- --vaadin-charts-tooltip-background: var(--lumo-base-color);
82
- --vaadin-charts-tooltip-border-color: inherit;
83
- --vaadin-charts-button-label: var(--lumo-primary-text-color);
84
- --vaadin-charts-button-background: var(--lumo-contrast-5pct);
85
- --vaadin-charts-button-hover-background: var(--lumo-primary-color-10pct);
86
- --vaadin-charts-button-active-label: var(--lumo-primary-contrast-color);
87
- --vaadin-charts-button-active-background: var(--lumo-primary-color);
88
- --vaadin-charts-xaxis-line-width: 0;
89
- --vaadin-charts-tooltip-background-opacity: 1;
90
- font-family: var(--lumo-font-family);
91
- }
92
- `;
93
-
94
- registerStyles('vaadin-chart', [chartColors, chartTheme], { moduleId: 'lumo-chart' });
95
-
96
- export { chartColors, chartTheme };
package/theme/lumo/vaadin-chart.d.ts DELETED
@@ -1,2 +0,0 @@
1
- import './vaadin-chart-styles.js';
2
- import '../../src/vaadin-chart.js';
package/theme/lumo/vaadin-chart.js DELETED
@@ -1,2 +0,0 @@
1
- import './vaadin-chart-styles.js';
2
- import '../../src/vaadin-chart.js';