genesys-spark-chart-components 4.12.1-beta.1 → 4.29.0-beta.0

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 (90) hide show
  1. package/LICENSE +2 -2
  2. package/dist/cjs/app-globals-3a1e7e63.js +5 -0
  3. package/dist/cjs/genesys-chart-webcomponents.cjs.js +5 -3
  4. package/dist/cjs/gux-chart-column-beta.cjs.entry.js +124 -123
  5. package/dist/cjs/gux-chart-donut-beta.cjs.entry.js +213 -212
  6. package/dist/cjs/gux-chart-line-beta.cjs.entry.js +120 -119
  7. package/dist/cjs/gux-chart-pie-beta.cjs.entry.js +96 -95
  8. package/dist/cjs/gux-chart-scatter-plot-beta.cjs.entry.js +126 -125
  9. package/dist/cjs/gux-visualization-beta.cjs.entry.js +213 -213
  10. package/dist/cjs/{index-1e13a15f.js → index-a4712860.js} +185 -63
  11. package/dist/cjs/loader.cjs.js +4 -2
  12. package/dist/cjs/log-error-28c7064e.js +21 -0
  13. package/dist/cjs/{usage-30f04ec3.js → usage-3d9281d1.js} +63 -63
  14. package/dist/collection/collection-manifest.json +2 -2
  15. package/dist/collection/components/beta/gux-chart-column/gux-chart-column.js +324 -324
  16. package/dist/collection/components/beta/gux-chart-column/gux-chart-column.locale.js +88 -88
  17. package/dist/collection/components/beta/gux-chart-column/tests/gux-column-chart.spec.js +16 -16
  18. package/dist/collection/components/beta/gux-chart-donut/gux-chart-donut.js +550 -550
  19. package/dist/collection/components/beta/gux-chart-donut/tests/gux-chart-donut.spec.js +5 -5
  20. package/dist/collection/components/beta/gux-chart-line/gux-chart-line.js +375 -375
  21. package/dist/collection/components/beta/gux-chart-line/gux-chart-line.locale.js +88 -88
  22. package/dist/collection/components/beta/gux-chart-line/tests/gux-chart-line.e2e.js +13 -13
  23. package/dist/collection/components/beta/gux-chart-line/tests/gux-chart-line.spec.js +16 -16
  24. package/dist/collection/components/beta/gux-chart-pie/gux-chart-pie.js +266 -266
  25. package/dist/collection/components/beta/gux-chart-pie/tests/gux-chart-pie.spec.js +5 -5
  26. package/dist/collection/components/beta/gux-chart-scatter-plot/gux-chart-scatter-plot.js +347 -347
  27. package/dist/collection/components/beta/gux-chart-scatter-plot/tests/gux-chart-scatter-plot.spec.js +27 -27
  28. package/dist/collection/components/beta/gux-visualization/gux-visualization.js +133 -133
  29. package/dist/collection/components/beta/gux-visualization/gux-visualization.locale.js +88 -88
  30. package/dist/collection/components/beta/gux-visualization/tests/gux-visualization.e2e.js +25 -25
  31. package/dist/collection/components/beta/gux-visualization/tests/gux-visualization.spec.js +26 -26
  32. package/dist/collection/i18n/fetchResources.js +7 -7
  33. package/dist/collection/i18n/index.js +56 -56
  34. package/dist/collection/test/axeConfig.js +4 -4
  35. package/dist/collection/test/e2eTestUtils.js +14 -14
  36. package/dist/collection/test/specTestUtils.js +5 -5
  37. package/dist/collection/utils/dom/get-closest-element.js +12 -12
  38. package/dist/collection/utils/error/log-error.js +2 -2
  39. package/dist/collection/utils/theme/color-palette.js +10 -10
  40. package/dist/collection/utils/tracking/usage.js +47 -47
  41. package/dist/collection/utils/tracking/usage.spec.js +108 -108
  42. package/dist/esm/app-globals-0f993ce5.js +3 -0
  43. package/dist/esm/genesys-chart-webcomponents.js +6 -4
  44. package/dist/esm/gux-chart-column-beta.entry.js +124 -123
  45. package/dist/esm/gux-chart-donut-beta.entry.js +213 -212
  46. package/dist/esm/gux-chart-line-beta.entry.js +120 -119
  47. package/dist/esm/gux-chart-pie-beta.entry.js +96 -95
  48. package/dist/esm/gux-chart-scatter-plot-beta.entry.js +126 -125
  49. package/dist/esm/gux-visualization-beta.entry.js +213 -213
  50. package/dist/esm/{index-701d93cf.js → index-82fd7406.js} +185 -63
  51. package/dist/esm/loader.js +5 -3
  52. package/dist/esm/log-error-ff9bdda4.js +18 -0
  53. package/dist/esm/{usage-61eee3bd.js → usage-4d835ee1.js} +63 -63
  54. package/dist/genesys-chart-webcomponents/genesys-chart-webcomponents.css +1 -1
  55. package/dist/genesys-chart-webcomponents/genesys-chart-webcomponents.esm.js +1 -1
  56. package/dist/genesys-chart-webcomponents/p-01bbadbf.entry.js +11 -0
  57. package/dist/genesys-chart-webcomponents/{p-137f5b8f.entry.js → p-12eb9928.entry.js} +1 -1
  58. package/dist/genesys-chart-webcomponents/p-1bc0cc3a.js +2 -0
  59. package/dist/genesys-chart-webcomponents/{p-b5179379.entry.js → p-25bdbf17.entry.js} +1 -1
  60. package/dist/genesys-chart-webcomponents/{p-c3aa8578.entry.js → p-74011efc.entry.js} +1 -1
  61. package/dist/genesys-chart-webcomponents/{p-97c45977.js → p-7e62b207.js} +1 -1
  62. package/dist/genesys-chart-webcomponents/p-e1255160.js +1 -0
  63. package/dist/genesys-chart-webcomponents/{p-d9928f8c.entry.js → p-e80b1b1c.entry.js} +1 -1
  64. package/dist/genesys-chart-webcomponents/{p-d4a346df.entry.js → p-f6cebcf8.entry.js} +1 -1
  65. package/dist/stencil-wrapper.js +1 -1
  66. package/dist/types/components/beta/gux-chart-column/gux-chart-column.d.ts +45 -45
  67. package/dist/types/components/beta/gux-chart-column/gux-chart-column.locale.d.ts +20 -20
  68. package/dist/types/components/beta/gux-chart-donut/gux-chart-donut.d.ts +30 -30
  69. package/dist/types/components/beta/gux-chart-line/gux-chart-line.d.ts +44 -44
  70. package/dist/types/components/beta/gux-chart-line/gux-chart-line.locale.d.ts +20 -20
  71. package/dist/types/components/beta/gux-chart-pie/gux-chart-pie.d.ts +19 -19
  72. package/dist/types/components/beta/gux-chart-scatter-plot/gux-chart-scatter-plot.d.ts +48 -48
  73. package/dist/types/components/beta/gux-visualization/gux-visualization.d.ts +13 -13
  74. package/dist/types/components/beta/gux-visualization/gux-visualization.locale.d.ts +20 -20
  75. package/dist/types/components.d.ts +12 -0
  76. package/dist/types/i18n/fetchResources.d.ts +3 -3
  77. package/dist/types/i18n/index.d.ts +1 -1
  78. package/dist/types/stencil-public-runtime.d.ts +10 -0
  79. package/dist/types/stencil-wrapper.d.ts +1 -1
  80. package/dist/types/test/axeConfig.d.ts +4 -4
  81. package/dist/types/test/e2eTestUtils.d.ts +4 -4
  82. package/dist/types/test/jestMatcherUtils.d.ts +4 -4
  83. package/dist/types/utils/tracking/usage.d.ts +11 -11
  84. package/package.json +24 -24
  85. package/dist/cjs/log-error-c46b4b4c.js +0 -21
  86. package/dist/component-specs.json +0 -187
  87. package/dist/esm/log-error-0fc61f6f.js +0 -18
  88. package/dist/genesys-chart-webcomponents/p-3e4b3dbc.js +0 -2
  89. package/dist/genesys-chart-webcomponents/p-b901e9e0.entry.js +0 -11
  90. /package/dist/genesys-chart-webcomponents/{p-82f0ea01.js → p-f50e3789.js} +0 -0
@@ -1,131 +1,132 @@
1
- import { r as registerInstance, h, g as getElement } from './index-701d93cf.js';
2
- import { t as trackComponent } from './usage-61eee3bd.js';
3
- import { V as VISUALIZATION_COLORS, l as logError } from './log-error-0fc61f6f.js';
1
+ import { r as registerInstance, h, g as getElement } from './index-82fd7406.js';
2
+ import { t as trackComponent } from './usage-4d835ee1.js';
3
+ import { V as VISUALIZATION_COLORS, l as logError } from './log-error-ff9bdda4.js';
4
4
 
5
5
  const guxChartLineCss = "gux-visualization-beta{height:fit-content;color:#2e394c}";
6
+ const GuxChartLineBetaStyle0 = guxChartLineCss;
6
7
 
7
8
  const DEFAULT_COLOR_FIELD_NAME = 'category';
8
9
  const GuxLineChart = class {
9
- constructor(hostRef) {
10
- registerInstance(this, hostRef);
11
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
12
- this.baseChartSpec = {
13
- $schema: 'https://vega.github.io/schema/vega-lite/v5.json',
14
- mark: {
15
- type: 'line',
16
- interpolate: 'linear',
17
- point: false
18
- },
19
- config: {
20
- axis: {
21
- ticks: false,
22
- titlePadding: 8
23
- },
24
- axisX: {
25
- labelAngle: 0
26
- },
27
- legend: {
28
- symbolType: 'circle'
29
- }
30
- },
31
- encoding: {
32
- x: { type: 'nominal' },
33
- y: { type: 'quantitative' },
34
- color: {
35
- field: DEFAULT_COLOR_FIELD_NAME,
36
- type: 'nominal',
37
- scale: { range: VISUALIZATION_COLORS },
38
- legend: null
39
- },
40
- tooltip: { aggregate: 'count', type: 'quantitative' }
41
- }
42
- };
43
- this.chartData = undefined;
44
- this.xTickLabelSlant = undefined;
45
- this.includeLegend = undefined;
46
- this.legendPosition = 'right';
47
- this.includeDataPointMarkers = undefined;
48
- this.xFieldName = undefined;
49
- this.xAxisTitle = undefined;
50
- this.yFieldName = undefined;
51
- this.yAxisTitle = undefined;
52
- this.legendTitle = undefined;
53
- this.colorFieldName = undefined;
54
- this.strokeDash = undefined;
55
- this.interpolation = undefined;
56
- this.embedOptions = undefined;
57
- }
58
- parseData() {
59
- if (!this.xFieldName || !this.yFieldName) {
60
- logError(this.root, 'requires x-field-name and y-field-name');
61
- }
62
- let chartData = {};
63
- if (this.chartData) {
64
- chartData = { data: this.chartData };
65
- }
66
- if (this.xTickLabelSlant) {
67
- this.baseChartSpec.config.axisX.labelAngle = 45;
68
- }
69
- if (this.includeLegend) {
70
- this.baseChartSpec.encoding.color.legend = true;
71
- }
72
- if (this.legendPosition) {
73
- this.baseChartSpec.config.legend.orient = this.legendPosition;
74
- }
75
- const xFieldName = this.xFieldName;
76
- const xAxisTitle = this.xAxisTitle;
77
- const yFieldName = this.yFieldName;
78
- const yAxisTitle = this.yAxisTitle;
79
- const legendTitle = this.legendTitle;
80
- const colorFieldName = this.colorFieldName || DEFAULT_COLOR_FIELD_NAME;
81
- const interpolation = this.interpolation;
82
- const strokeDash = this.strokeDash;
83
- const includeDataPointMarkers = this.includeDataPointMarkers;
84
- if (xFieldName) {
85
- this.baseChartSpec.encoding.x.field = xFieldName;
86
- }
87
- if (xAxisTitle) {
88
- this.baseChartSpec.encoding.x.title = xAxisTitle;
10
+ constructor(hostRef) {
11
+ registerInstance(this, hostRef);
12
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
13
+ this.baseChartSpec = {
14
+ $schema: 'https://vega.github.io/schema/vega-lite/v5.json',
15
+ mark: {
16
+ type: 'line',
17
+ interpolate: 'linear',
18
+ point: false
19
+ },
20
+ config: {
21
+ axis: {
22
+ ticks: false,
23
+ titlePadding: 8
24
+ },
25
+ axisX: {
26
+ labelAngle: 0
27
+ },
28
+ legend: {
29
+ symbolType: 'circle'
30
+ }
31
+ },
32
+ encoding: {
33
+ x: { type: 'nominal' },
34
+ y: { type: 'quantitative' },
35
+ color: {
36
+ field: DEFAULT_COLOR_FIELD_NAME,
37
+ type: 'nominal',
38
+ scale: { range: VISUALIZATION_COLORS },
39
+ legend: null
40
+ },
41
+ tooltip: { aggregate: 'count', type: 'quantitative' }
42
+ }
43
+ };
44
+ this.chartData = undefined;
45
+ this.xTickLabelSlant = undefined;
46
+ this.includeLegend = undefined;
47
+ this.legendPosition = 'right';
48
+ this.includeDataPointMarkers = undefined;
49
+ this.xFieldName = undefined;
50
+ this.xAxisTitle = undefined;
51
+ this.yFieldName = undefined;
52
+ this.yAxisTitle = undefined;
53
+ this.legendTitle = undefined;
54
+ this.colorFieldName = undefined;
55
+ this.strokeDash = undefined;
56
+ this.interpolation = undefined;
57
+ this.embedOptions = undefined;
89
58
  }
90
- if (yFieldName) {
91
- this.baseChartSpec.encoding.y.field = yFieldName;
92
- }
93
- if (yAxisTitle) {
94
- this.baseChartSpec.encoding.y.title = yAxisTitle;
95
- }
96
- if (colorFieldName) {
97
- this.baseChartSpec.encoding.color.field = colorFieldName;
98
- }
99
- if (legendTitle) {
100
- this.baseChartSpec.encoding.color.title = legendTitle;
101
- }
102
- if (strokeDash) {
103
- this.baseChartSpec.encoding.strokeDash = {
104
- field: colorFieldName,
105
- type: 'nominal'
106
- };
59
+ parseData() {
60
+ if (!this.xFieldName || !this.yFieldName) {
61
+ logError(this.root, 'requires x-field-name and y-field-name');
62
+ }
63
+ let chartData = {};
64
+ if (this.chartData) {
65
+ chartData = { data: this.chartData };
66
+ }
67
+ if (this.xTickLabelSlant) {
68
+ this.baseChartSpec.config.axisX.labelAngle = 45;
69
+ }
70
+ if (this.includeLegend) {
71
+ this.baseChartSpec.encoding.color.legend = true;
72
+ }
73
+ if (this.legendPosition) {
74
+ this.baseChartSpec.config.legend.orient = this.legendPosition;
75
+ }
76
+ const xFieldName = this.xFieldName;
77
+ const xAxisTitle = this.xAxisTitle;
78
+ const yFieldName = this.yFieldName;
79
+ const yAxisTitle = this.yAxisTitle;
80
+ const legendTitle = this.legendTitle;
81
+ const colorFieldName = this.colorFieldName || DEFAULT_COLOR_FIELD_NAME;
82
+ const interpolation = this.interpolation;
83
+ const strokeDash = this.strokeDash;
84
+ const includeDataPointMarkers = this.includeDataPointMarkers;
85
+ if (xFieldName) {
86
+ this.baseChartSpec.encoding.x.field = xFieldName;
87
+ }
88
+ if (xAxisTitle) {
89
+ this.baseChartSpec.encoding.x.title = xAxisTitle;
90
+ }
91
+ if (yFieldName) {
92
+ this.baseChartSpec.encoding.y.field = yFieldName;
93
+ }
94
+ if (yAxisTitle) {
95
+ this.baseChartSpec.encoding.y.title = yAxisTitle;
96
+ }
97
+ if (colorFieldName) {
98
+ this.baseChartSpec.encoding.color.field = colorFieldName;
99
+ }
100
+ if (legendTitle) {
101
+ this.baseChartSpec.encoding.color.title = legendTitle;
102
+ }
103
+ if (strokeDash) {
104
+ this.baseChartSpec.encoding.strokeDash = {
105
+ field: colorFieldName,
106
+ type: 'nominal'
107
+ };
108
+ }
109
+ if (interpolation) {
110
+ this.baseChartSpec.mark.interpolate = interpolation;
111
+ }
112
+ if (includeDataPointMarkers) {
113
+ this.baseChartSpec.mark.point = includeDataPointMarkers;
114
+ }
115
+ const spec = Object.assign(this.baseChartSpec, chartData);
116
+ this.visualizationSpec = spec;
107
117
  }
108
- if (interpolation) {
109
- this.baseChartSpec.mark.interpolate = interpolation;
118
+ componentWillLoad() {
119
+ trackComponent(this.root);
120
+ this.parseData();
110
121
  }
111
- if (includeDataPointMarkers) {
112
- this.baseChartSpec.mark.point = includeDataPointMarkers;
122
+ render() {
123
+ return (h("gux-visualization-beta", { key: 'd312d8b365db65c08f3631bb4976e74f7bf077ac', visualizationSpec: this.visualizationSpec }));
113
124
  }
114
- const spec = Object.assign(this.baseChartSpec, chartData);
115
- this.visualizationSpec = spec;
116
- }
117
- componentWillLoad() {
118
- trackComponent(this.root);
119
- this.parseData();
120
- }
121
- render() {
122
- return (h("gux-visualization-beta", { visualizationSpec: this.visualizationSpec }));
123
- }
124
- get root() { return getElement(this); }
125
- static get watchers() { return {
126
- "chartData": ["parseData"]
127
- }; }
125
+ get root() { return getElement(this); }
126
+ static get watchers() { return {
127
+ "chartData": ["parseData"]
128
+ }; }
128
129
  };
129
- GuxLineChart.style = guxChartLineCss;
130
+ GuxLineChart.style = GuxChartLineBetaStyle0;
130
131
 
131
132
  export { GuxLineChart as gux_chart_line_beta };
@@ -1,109 +1,110 @@
1
- import { r as registerInstance, h, g as getElement } from './index-701d93cf.js';
2
- import { t as trackComponent } from './usage-61eee3bd.js';
3
- import { V as VISUALIZATION_COLORS, l as logError } from './log-error-0fc61f6f.js';
1
+ import { r as registerInstance, h, g as getElement } from './index-82fd7406.js';
2
+ import { t as trackComponent } from './usage-4d835ee1.js';
3
+ import { V as VISUALIZATION_COLORS, l as logError } from './log-error-ff9bdda4.js';
4
4
 
5
5
  const guxChartPieCss = "gux-visualization-beta{height:fit-content;color:#2e394c}";
6
+ const GuxChartPieBetaStyle0 = guxChartPieCss;
6
7
 
7
8
  const DEFAULT_COLOR_FIELD_NAME = 'category';
8
9
  const DEFAULT_LABEL_FIELD_NAME = 'value';
9
10
  const GuxPieChart = class {
10
- constructor(hostRef) {
11
- registerInstance(this, hostRef);
12
- // eslint-disable-next-line @typescript-eslint/no-explicit-any
13
- this.baseChartSpec = {
14
- $schema: 'https://vega.github.io/schema/vega-lite/v5.json',
15
- config: {
16
- legend: {
17
- symbolType: 'circle'
11
+ constructor(hostRef) {
12
+ registerInstance(this, hostRef);
13
+ // eslint-disable-next-line @typescript-eslint/no-explicit-any
14
+ this.baseChartSpec = {
15
+ $schema: 'https://vega.github.io/schema/vega-lite/v5.json',
16
+ config: {
17
+ legend: {
18
+ symbolType: 'circle'
19
+ }
20
+ },
21
+ encoding: {
22
+ theta: { field: 'value', type: 'quantitative', stack: true },
23
+ color: {
24
+ field: DEFAULT_COLOR_FIELD_NAME,
25
+ type: 'nominal',
26
+ scale: { range: VISUALIZATION_COLORS },
27
+ legend: null
28
+ },
29
+ tooltip: { aggregate: 'count', type: 'quantitative' }
30
+ },
31
+ layer: [
32
+ {
33
+ mark: { type: 'arc', outerRadius: 80 }
34
+ },
35
+ {
36
+ mark: { type: 'text', radius: 90 },
37
+ encoding: {
38
+ text: { field: DEFAULT_LABEL_FIELD_NAME, type: 'quantitative' }
39
+ }
40
+ }
41
+ ],
42
+ view: { stroke: null }
43
+ };
44
+ this.chartData = undefined;
45
+ this.includeLegend = undefined;
46
+ this.legendPosition = 'right';
47
+ this.legendTitle = undefined;
48
+ this.colorFieldName = undefined;
49
+ this.outerRadius = undefined;
50
+ this.labelRadius = undefined;
51
+ this.labelField = undefined;
52
+ this.embedOptions = undefined;
53
+ }
54
+ parseData() {
55
+ if (!this.outerRadius) {
56
+ logError(this.root, 'requires outer-radius');
18
57
  }
19
- },
20
- encoding: {
21
- theta: { field: 'value', type: 'quantitative', stack: true },
22
- color: {
23
- field: DEFAULT_COLOR_FIELD_NAME,
24
- type: 'nominal',
25
- scale: { range: VISUALIZATION_COLORS },
26
- legend: null
27
- },
28
- tooltip: { aggregate: 'count', type: 'quantitative' }
29
- },
30
- layer: [
31
- {
32
- mark: { type: 'arc', outerRadius: 80 }
33
- },
34
- {
35
- mark: { type: 'text', radius: 90 },
36
- encoding: {
37
- text: { field: DEFAULT_LABEL_FIELD_NAME, type: 'quantitative' }
38
- }
58
+ let chartData = {};
59
+ if (this.chartData) {
60
+ chartData = { data: this.chartData };
39
61
  }
40
- ],
41
- view: { stroke: null }
42
- };
43
- this.chartData = undefined;
44
- this.includeLegend = undefined;
45
- this.legendPosition = 'right';
46
- this.legendTitle = undefined;
47
- this.colorFieldName = undefined;
48
- this.outerRadius = undefined;
49
- this.labelRadius = undefined;
50
- this.labelField = undefined;
51
- this.embedOptions = undefined;
52
- }
53
- parseData() {
54
- if (!this.outerRadius) {
55
- logError(this.root, 'requires outer-radius');
56
- }
57
- let chartData = {};
58
- if (this.chartData) {
59
- chartData = { data: this.chartData };
60
- }
61
- if (this.includeLegend) {
62
- this.baseChartSpec.encoding.color.legend = true;
63
- }
64
- if (this.legendPosition) {
65
- this.baseChartSpec.config.legend.orient = this.legendPosition;
66
- }
67
- const colorFieldName = this.colorFieldName || DEFAULT_COLOR_FIELD_NAME;
68
- if (colorFieldName) {
69
- this.baseChartSpec.encoding.color.field = colorFieldName;
62
+ if (this.includeLegend) {
63
+ this.baseChartSpec.encoding.color.legend = true;
64
+ }
65
+ if (this.legendPosition) {
66
+ this.baseChartSpec.config.legend.orient = this.legendPosition;
67
+ }
68
+ const colorFieldName = this.colorFieldName || DEFAULT_COLOR_FIELD_NAME;
69
+ if (colorFieldName) {
70
+ this.baseChartSpec.encoding.color.field = colorFieldName;
71
+ }
72
+ const legendTitle = this.legendTitle;
73
+ if (legendTitle) {
74
+ this.baseChartSpec.encoding.color.title = legendTitle;
75
+ }
76
+ const outerRadius = this.outerRadius;
77
+ this.baseChartSpec.layer = [
78
+ {
79
+ mark: { type: 'arc', outerRadius }
80
+ }
81
+ ];
82
+ const labelRadius = this.labelRadius;
83
+ const labelField = this.labelField || DEFAULT_LABEL_FIELD_NAME;
84
+ if (labelRadius) {
85
+ // eslint-disable-next-line @typescript-eslint/no-unsafe-call
86
+ this.baseChartSpec.layer.push({
87
+ mark: { type: 'text', radius: labelRadius },
88
+ encoding: {
89
+ text: { field: labelField, type: 'quantitative' }
90
+ }
91
+ });
92
+ }
93
+ const spec = Object.assign(this.baseChartSpec, chartData);
94
+ this.visualizationSpec = spec;
70
95
  }
71
- const legendTitle = this.legendTitle;
72
- if (legendTitle) {
73
- this.baseChartSpec.encoding.color.title = legendTitle;
96
+ componentWillLoad() {
97
+ trackComponent(this.root);
98
+ this.parseData();
74
99
  }
75
- const outerRadius = this.outerRadius;
76
- this.baseChartSpec.layer = [
77
- {
78
- mark: { type: 'arc', outerRadius }
79
- }
80
- ];
81
- const labelRadius = this.labelRadius;
82
- const labelField = this.labelField || DEFAULT_LABEL_FIELD_NAME;
83
- if (labelRadius) {
84
- // eslint-disable-next-line @typescript-eslint/no-unsafe-call
85
- this.baseChartSpec.layer.push({
86
- mark: { type: 'text', radius: labelRadius },
87
- encoding: {
88
- text: { field: labelField, type: 'quantitative' }
89
- }
90
- });
100
+ render() {
101
+ return (h("gux-visualization-beta", { key: 'b3049772a9d436bf4d6aa1b0e9ebe21a9d9e84e9', visualizationSpec: this.visualizationSpec }));
91
102
  }
92
- const spec = Object.assign(this.baseChartSpec, chartData);
93
- this.visualizationSpec = spec;
94
- }
95
- componentWillLoad() {
96
- trackComponent(this.root);
97
- this.parseData();
98
- }
99
- render() {
100
- return (h("gux-visualization-beta", { visualizationSpec: this.visualizationSpec }));
101
- }
102
- get root() { return getElement(this); }
103
- static get watchers() { return {
104
- "chartData": ["parseData"]
105
- }; }
103
+ get root() { return getElement(this); }
104
+ static get watchers() { return {
105
+ "chartData": ["parseData"]
106
+ }; }
106
107
  };
107
- GuxPieChart.style = guxChartPieCss;
108
+ GuxPieChart.style = GuxChartPieBetaStyle0;
108
109
 
109
110
  export { GuxPieChart as gux_chart_pie_beta };