@progress/kendo-angular-chart-wizard 16.6.0-develop.10

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 (54) hide show
  1. package/LICENSE.md +11 -0
  2. package/NOTICE.txt +200 -0
  3. package/README.md +32 -0
  4. package/chart-wizard-state.d.ts +149 -0
  5. package/chart-wizard.component.d.ts +80 -0
  6. package/chart-wizard.module.d.ts +19 -0
  7. package/common/get-wizard-data-from-data-rows.d.ts +41 -0
  8. package/common/index.d.ts +5 -0
  9. package/common/models.d.ts +19 -0
  10. package/directives.d.ts +10 -0
  11. package/esm2020/chart-wizard-state.mjs +502 -0
  12. package/esm2020/chart-wizard.component.mjs +552 -0
  13. package/esm2020/chart-wizard.module.mjs +53 -0
  14. package/esm2020/common/get-wizard-data-from-data-rows.mjs +27 -0
  15. package/esm2020/common/index.mjs +5 -0
  16. package/esm2020/common/models.mjs +5 -0
  17. package/esm2020/directives.mjs +13 -0
  18. package/esm2020/events/export-event.mjs +18 -0
  19. package/esm2020/events/index.mjs +5 -0
  20. package/esm2020/events/preventable-event.mjs +30 -0
  21. package/esm2020/grid-integration/get-grid-selected-rows.mjs +48 -0
  22. package/esm2020/grid-integration/get-wizard-data-from-grid-selection.mjs +13 -0
  23. package/esm2020/grid-integration/grid-chart-wizard.directive.mjs +74 -0
  24. package/esm2020/grid-integration/index.mjs +7 -0
  25. package/esm2020/index.mjs +11 -0
  26. package/esm2020/package-metadata.mjs +15 -0
  27. package/esm2020/progress-kendo-angular-chart-wizard.mjs +8 -0
  28. package/esm2020/property-pane/chart-tab.component.mjs +257 -0
  29. package/esm2020/property-pane/data-tab.component.mjs +229 -0
  30. package/esm2020/property-pane/form-field.component.mjs +245 -0
  31. package/esm2020/property-pane/format-tab.component.mjs +945 -0
  32. package/esm2020/series-type-button.component.mjs +67 -0
  33. package/esm2020/state.service.mjs +32 -0
  34. package/events/export-event.d.ts +24 -0
  35. package/events/index.d.ts +5 -0
  36. package/events/preventable-event.d.ts +24 -0
  37. package/fesm2015/progress-kendo-angular-chart-wizard.mjs +2999 -0
  38. package/fesm2020/progress-kendo-angular-chart-wizard.mjs +2993 -0
  39. package/grid-integration/get-grid-selected-rows.d.ts +20 -0
  40. package/grid-integration/get-wizard-data-from-grid-selection.d.ts +19 -0
  41. package/grid-integration/grid-chart-wizard.directive.d.ts +42 -0
  42. package/grid-integration/index.d.ts +7 -0
  43. package/index.d.ts +12 -0
  44. package/package-metadata.d.ts +9 -0
  45. package/package.json +65 -0
  46. package/property-pane/chart-tab.component.d.ts +35 -0
  47. package/property-pane/data-tab.component.d.ts +33 -0
  48. package/property-pane/form-field.component.d.ts +45 -0
  49. package/property-pane/format-tab.component.d.ts +102 -0
  50. package/schematics/collection.json +12 -0
  51. package/schematics/ngAdd/index.js +8 -0
  52. package/schematics/ngAdd/schema.json +24 -0
  53. package/series-type-button.component.d.ts +24 -0
  54. package/state.service.d.ts +23 -0
package/esm2020/property-pane/format-tab.component.mjs ADDED
@@ -0,0 +1,945 @@
1
+ /**-----------------------------------------------------------------------------------------
2
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
3
+ * Licensed under commercial license. See LICENSE.md in the project root for more information
4
+ *-------------------------------------------------------------------------------------------*/
5
+ import { ChangeDetectionStrategy, ChangeDetectorRef, Component } from '@angular/core';
6
+ import { ActionTypes, fontNames, fontSizes, parseFont, positions, rotations, updateState } from '../chart-wizard-state';
7
+ import { StateService } from '../state.service';
8
+ import { ChartWizardPropertyPaneFormFieldComponent } from './form-field.component';
9
+ import { ExpansionPanelComponent } from '@progress/kendo-angular-layout';
10
+ import { LabelComponent } from '@progress/kendo-angular-label';
11
+ import { SwitchComponent } from '@progress/kendo-angular-inputs';
12
+ import { DropDownListComponent } from '@progress/kendo-angular-dropdowns';
13
+ import { LocalizationService } from '@progress/kendo-angular-l10n';
14
+ import * as i0 from "@angular/core";
15
+ import * as i1 from "../state.service";
16
+ import * as i2 from "@progress/kendo-angular-l10n";
17
+ /**
18
+ * @hidden
19
+ */
20
+ export class ChartWizardPropertyPaneDataTabComponent {
21
+ constructor(stateService, localization, cdr) {
22
+ this.stateService = stateService;
23
+ this.localization = localization;
24
+ this.cdr = cdr;
25
+ this.chartTitles = [
26
+ { text: 'Chart Title', value: 'Chart Title' },
27
+ { text: 'Chart Subtitle', value: 'Chart Subtitle' },
28
+ ];
29
+ this.titleText = ActionTypes.titleText;
30
+ this.titleFontName = ActionTypes.titleFontName;
31
+ this.titleFontSize = ActionTypes.titleFontSize;
32
+ this.titleColor = ActionTypes.titleColor;
33
+ this.subtitleText = ActionTypes.subtitleText;
34
+ this.subtitleFontName = ActionTypes.subtitleFontName;
35
+ this.subtitleFontSize = ActionTypes.subtitleFontSize;
36
+ this.subtitleColor = ActionTypes.subtitleColor;
37
+ this.areaMarginLeft = ActionTypes.areaMarginLeft;
38
+ this.areaMarginRight = ActionTypes.areaMarginRight;
39
+ this.areaMarginTop = ActionTypes.areaMarginTop;
40
+ this.areaMarginBottom = ActionTypes.areaMarginBottom;
41
+ this.areaBackground = ActionTypes.areaBackground;
42
+ this.legendVisible = ActionTypes.legendVisible;
43
+ this.legendFontName = ActionTypes.legendFontName;
44
+ this.legendFontSize = ActionTypes.legendFontSize;
45
+ this.legendColor = ActionTypes.legendColor;
46
+ this.legendPosition = ActionTypes.legendPosition;
47
+ this.seriesColor = ActionTypes.seriesColor;
48
+ this.seriesLabel = ActionTypes.seriesLabel;
49
+ this.categoryAxisTitleText = ActionTypes.categoryAxisTitleText;
50
+ this.categoryAxisTitleFontName = ActionTypes.categoryAxisTitleFontName;
51
+ this.categoryAxisTitleFontSize = ActionTypes.categoryAxisTitleFontSize;
52
+ this.categoryAxisTitleColor = ActionTypes.categoryAxisTitleColor;
53
+ this.categoryAxisLabelsFontName = ActionTypes.categoryAxisLabelsFontName;
54
+ this.categoryAxisLabelsFontSize = ActionTypes.categoryAxisLabelsFontSize;
55
+ this.categoryAxisLabelsColor = ActionTypes.categoryAxisLabelsColor;
56
+ this.categoryAxisLabelsRotation = ActionTypes.categoryAxisLabelsRotation;
57
+ this.categoryAxisReverseOrder = ActionTypes.categoryAxisReverseOrder;
58
+ this.valueAxisTitleText = ActionTypes.valueAxisTitleText;
59
+ this.valueAxisTitleFontName = ActionTypes.valueAxisTitleFontName;
60
+ this.valueAxisTitleFontSize = ActionTypes.valueAxisTitleFontSize;
61
+ this.valueAxisTitleColor = ActionTypes.valueAxisTitleColor;
62
+ this.valueAxisLabelsFontName = ActionTypes.valueAxisLabelsFontName;
63
+ this.valueAxisLabelsFontSize = ActionTypes.valueAxisLabelsFontSize;
64
+ this.valueAxisLabelsColor = ActionTypes.valueAxisLabelsColor;
65
+ this.valueAxisLabelsRotation = ActionTypes.valueAxisLabelsRotation;
66
+ this.parseFont = parseFont;
67
+ this.fontNames = fontNames;
68
+ this.fontSizes = fontSizes;
69
+ this.legendPositions = positions;
70
+ this.labelsRotation = rotations;
71
+ }
72
+ get chartTitleTypeText() {
73
+ return this.stateService.currentTitle === 'Chart Title'
74
+ ? this.stateService.state.title?.text
75
+ : this.stateService.state.subtitle?.text;
76
+ }
77
+ get chartTitleTypeFont() {
78
+ return this.stateService.currentTitle === 'Chart Title'
79
+ ? parseFont(this.stateService.state.title?.font).name
80
+ : parseFont(this.stateService.state.subtitle?.font).name;
81
+ }
82
+ get chartTitleTypeFontSize() {
83
+ return this.stateService.currentTitle === 'Chart Title'
84
+ ? parseFont(this.stateService.state.title?.font).size
85
+ : parseFont(this.stateService.state.subtitle?.font).size;
86
+ }
87
+ get chartTitleTypeColor() {
88
+ return this.stateService.currentTitle === 'Chart Title'
89
+ ? this.stateService.state.title?.color
90
+ : this.stateService.state.subtitle?.color;
91
+ }
92
+ get chartTitleTypeAction() {
93
+ return this.stateService.currentTitle === 'Chart Title' ? this.titleText : this.subtitleText;
94
+ }
95
+ get chartTitleTypeFontAction() {
96
+ return this.stateService.currentTitle === 'Chart Title' ? this.titleFontName : this.subtitleFontName;
97
+ }
98
+ get chartTitleTypeColorAction() {
99
+ return this.stateService.currentTitle === 'Chart Title' ? this.titleColor : this.subtitleColor;
100
+ }
101
+ get chartTitleTypeFontSizeAction() {
102
+ return this.stateService.currentTitle === 'Chart Title' ? this.titleFontSize : this.subtitleFontSize;
103
+ }
104
+ ngAfterViewChecked() {
105
+ this.localization.changes.subscribe(() => {
106
+ this.cdr.detectChanges();
107
+ });
108
+ }
109
+ ngOnDestroy() {
110
+ this.localization.changes.unsubscribe();
111
+ }
112
+ updateState(action, value) {
113
+ this.stateService.state = updateState(this.stateService.state, action, value);
114
+ }
115
+ changeCurrentTitle(value) {
116
+ this.stateService.currentTitle = value;
117
+ }
118
+ toggleSeriesLabels(value) {
119
+ this.updateCurrentSeries(this.stateService.currentSeries);
120
+ this.stateService.currentSeries.labels = { visible: value };
121
+ this.updateState(this.seriesLabel, this.stateService.currentSeries);
122
+ }
123
+ updateCurrentSeries(value) {
124
+ this.stateService.currentSeries = this.stateService.state.series.find((series) => series.name === value.name);
125
+ }
126
+ updateSeriesColor(value) {
127
+ this.updateCurrentSeries(this.stateService.currentSeries);
128
+ this.stateService.currentSeries.color = value;
129
+ this.updateState(this.seriesColor, this.stateService.currentSeries);
130
+ }
131
+ onExpandedChange(panel, expanded) {
132
+ expanded
133
+ ? (this.stateService.currentFormatExpansionPanel = panel)
134
+ : (this.stateService.currentFormatExpansionPanel = null);
135
+ }
136
+ isExpanded(panel) {
137
+ return this.stateService.currentFormatExpansionPanel === panel;
138
+ }
139
+ }
140
+ ChartWizardPropertyPaneDataTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardPropertyPaneDataTabComponent, deps: [{ token: i1.StateService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
141
+ ChartWizardPropertyPaneDataTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChartWizardPropertyPaneDataTabComponent, isStandalone: true, selector: "kendo-chart-wizard-property-pane-format-tab", ngImport: i0, template: `
142
+ <section>
143
+ <kendo-expansionpanel
144
+ title="Chart Area"
145
+ [expanded]="isExpanded('Chart Area')"
146
+ (expandedChange)="onExpandedChange('Chart Area', $event)"
147
+ [attr.dir]="stateService.direction"
148
+ >
149
+ <form class="k-form k-form-md">
150
+ <fieldset class="k-form-fieldset">
151
+ <legend class="k-form-legend">Margins</legend>
152
+ <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
153
+ <kendo-chart-wizard-property-pane-form-field
154
+ text="Left"
155
+ inputType="numeric"
156
+ [value]="$any(stateService.state.area?.margin).left"
157
+ (valueChange)="updateState(areaMarginLeft, $event)"
158
+ >
159
+ </kendo-chart-wizard-property-pane-form-field>
160
+ <kendo-chart-wizard-property-pane-form-field
161
+ text="Right"
162
+ inputType="numeric"
163
+ [value]="$any(stateService.state.area?.margin).right"
164
+ (valueChange)="updateState(areaMarginRight, $event)"
165
+ >
166
+ </kendo-chart-wizard-property-pane-form-field>
167
+ <kendo-chart-wizard-property-pane-form-field
168
+ text="Top"
169
+ inputType="numeric"
170
+ [value]="$any(stateService.state.area?.margin).top"
171
+ (valueChange)="updateState(areaMarginTop, $event)"
172
+ >
173
+ </kendo-chart-wizard-property-pane-form-field>
174
+ <kendo-chart-wizard-property-pane-form-field
175
+ text="Bottom"
176
+ inputType="numeric"
177
+ [value]="$any(stateService.state.area?.margin).bottom"
178
+ (valueChange)="updateState(areaMarginBottom, $event)"
179
+ >
180
+ </kendo-chart-wizard-property-pane-form-field>
181
+ </div>
182
+ </fieldset>
183
+ <fieldset class="k-form-fieldset">
184
+ <legend class="k-form-legend">Background</legend>
185
+ <kendo-chart-wizard-property-pane-form-field
186
+ text="Color"
187
+ inputType="colorPicker"
188
+ [value]="stateService.state.area?.background"
189
+ (valueChange)="updateState(areaBackground, $event)"
190
+ >
191
+ </kendo-chart-wizard-property-pane-form-field>
192
+ </fieldset>
193
+ </form>
194
+ </kendo-expansionpanel>
195
+ </section>
196
+ <section>
197
+ <kendo-expansionpanel
198
+ title="Title"
199
+ [expanded]="isExpanded('Title')"
200
+ (expandedChange)="onExpandedChange('Title', $event)"
201
+ >
202
+ <form class="k-form k-form-md">
203
+ <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
204
+ <kendo-chart-wizard-property-pane-form-field
205
+ text="Apply to"
206
+ inputType="dropDownList"
207
+ [data]="chartTitles"
208
+ [colSpan]="2"
209
+ [value]="stateService.currentTitle"
210
+ (valueChange)="changeCurrentTitle($event)"
211
+ >
212
+ </kendo-chart-wizard-property-pane-form-field>
213
+ <kendo-chart-wizard-property-pane-form-field
214
+ text="Title"
215
+ inputType="text"
216
+ [colSpan]="2"
217
+ [value]="chartTitleTypeText"
218
+ (valueChange)="updateState(chartTitleTypeAction, $event)"
219
+ >
220
+ </kendo-chart-wizard-property-pane-form-field>
221
+ <kendo-chart-wizard-property-pane-form-field
222
+ text="Font"
223
+ inputType="comboBox"
224
+ [data]="fontNames"
225
+ [colSpan]="2"
226
+ [value]="chartTitleTypeFont"
227
+ placeholder="(Inherited font)"
228
+ (valueChange)="updateState(chartTitleTypeFontAction, $event)"
229
+ >
230
+ </kendo-chart-wizard-property-pane-form-field>
231
+ <kendo-chart-wizard-property-pane-form-field
232
+ text="Size"
233
+ inputType="comboBox"
234
+ [data]="fontSizes"
235
+ [value]="chartTitleTypeFontSize"
236
+ (valueChange)="updateState(chartTitleTypeFontSizeAction, $event)"
237
+ >
238
+ </kendo-chart-wizard-property-pane-form-field>
239
+ <kendo-chart-wizard-property-pane-form-field
240
+ text="Color"
241
+ inputType="colorPicker"
242
+ [value]="chartTitleTypeColor"
243
+ (valueChange)="updateState(chartTitleTypeColorAction, $event)"
244
+ >
245
+ </kendo-chart-wizard-property-pane-form-field>
246
+ </div>
247
+ </form>
248
+ </kendo-expansionpanel>
249
+ </section>
250
+ <section>
251
+ <kendo-expansionpanel
252
+ title="Legend"
253
+ [expanded]="isExpanded('Legend')"
254
+ (expandedChange)="onExpandedChange('Legend', $event)"
255
+ >
256
+ <form class="k-form k-form-md">
257
+ <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
258
+ <kendo-label [for]="toggleLegend" text="Show Legend"></kendo-label>
259
+ <kendo-switch
260
+ #toggleLegend
261
+ onLabel="On"
262
+ offLabel="Off"
263
+ thumbRounded="full"
264
+ size="medium"
265
+ [checked]="stateService.state.legend?.visible"
266
+ (valueChange)="updateState(legendVisible, $event)"
267
+ ></kendo-switch>
268
+ <kendo-chart-wizard-property-pane-form-field
269
+ text="Font"
270
+ inputType="comboBox"
271
+ [data]="fontNames"
272
+ [colSpan]="2"
273
+ placeholder="(Inherited font)"
274
+ [value]="parseFont(stateService.state.legend?.labels?.font).name"
275
+ (valueChange)="updateState(legendFontName, $event)"
276
+ >
277
+ </kendo-chart-wizard-property-pane-form-field>
278
+ <kendo-chart-wizard-property-pane-form-field
279
+ text="Size"
280
+ inputType="comboBox"
281
+ [data]="fontSizes"
282
+ placeholder="px"
283
+ [value]="parseFont(stateService.state.legend?.labels?.font).size"
284
+ (valueChange)="updateState(legendFontSize, $event)"
285
+ >
286
+ </kendo-chart-wizard-property-pane-form-field>
287
+ <kendo-chart-wizard-property-pane-form-field
288
+ text="Color"
289
+ inputType="colorPicker"
290
+ [value]="stateService.state.legend?.labels?.color"
291
+ (valueChange)="updateState(legendColor, $event)"
292
+ >
293
+ </kendo-chart-wizard-property-pane-form-field>
294
+ <kendo-chart-wizard-property-pane-form-field
295
+ text="Position"
296
+ inputType="dropDownList"
297
+ [colSpan]="2"
298
+ [data]="legendPositions"
299
+ [value]="stateService.state.legend?.position"
300
+ (valueChange)="updateState(legendPosition, $event)"
301
+ >
302
+ </kendo-chart-wizard-property-pane-form-field>
303
+ </div>
304
+ </form>
305
+ </kendo-expansionpanel>
306
+ </section>
307
+ <section>
308
+ <kendo-expansionpanel
309
+ title="Series"
310
+ [expanded]="isExpanded('Series')"
311
+ (expandedChange)="onExpandedChange('Series', $event)"
312
+ >
313
+ <form class="k-form k-form-md">
314
+ <div class="k-form-field">
315
+ <kendo-label [for]="seriesDropDown" class="k-form-label" text="Apply to"></kendo-label>
316
+ <div class="k-form-field-wrap">
317
+ <kendo-dropdownlist
318
+ #seriesDropDown
319
+ [data]="stateService.state.series"
320
+ textField="name"
321
+ valueField="name"
322
+ fillMode="outline"
323
+ rounded="medium"
324
+ size="medium"
325
+ [value]="stateService.currentSeries"
326
+ (valueChange)="updateCurrentSeries($event)"
327
+ ></kendo-dropdownlist>
328
+ </div>
329
+ </div>
330
+
331
+ <kendo-chart-wizard-property-pane-form-field
332
+ text="Color"
333
+ [value]="stateService.currentSeries?.color"
334
+ inputType="colorPicker"
335
+ (valueChange)="updateSeriesColor($event)"
336
+ >
337
+ </kendo-chart-wizard-property-pane-form-field>
338
+ <kendo-chart-wizard-property-pane-form-field
339
+ text="Show Labels"
340
+ [value]="stateService.currentSeries.labels?.visible"
341
+ [isLabelInsideFormFieldWrap]="true"
342
+ inputType="checkbox"
343
+ (valueChange)="toggleSeriesLabels($event)"
344
+ >
345
+ </kendo-chart-wizard-property-pane-form-field>
346
+ </form>
347
+ </kendo-expansionpanel>
348
+ </section>
349
+ <section class="k-row-start-1 k-row-end-3 k-col-start-3">
350
+ <kendo-expansionpanel
351
+ title="Category axis"
352
+ [expanded]="isExpanded('Category Axis')"
353
+ (expandedChange)="onExpandedChange('Category Axis', $event)"
354
+ >
355
+ <form class="k-form k-form-md">
356
+ <fieldset class="k-form-fieldset">
357
+ <legend class="k-form-legend">Title</legend>
358
+ <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
359
+ <kendo-chart-wizard-property-pane-form-field
360
+ inputType="text"
361
+ [hasLabel]="false"
362
+ [colSpan]="2"
363
+ placeholder="Axis Title"
364
+ [value]="stateService.state.categoryAxis[0]?.title?.text"
365
+ (valueChange)="updateState(categoryAxisTitleText, $event)"
366
+ >
367
+ </kendo-chart-wizard-property-pane-form-field>
368
+ <kendo-chart-wizard-property-pane-form-field
369
+ text="Font"
370
+ inputType="comboBox"
371
+ [data]="fontNames"
372
+ [colSpan]="2"
373
+ placeholder="(Inherited font)"
374
+ [value]="parseFont(stateService.state.categoryAxis[0]?.title?.font).name"
375
+ (valueChange)="updateState(categoryAxisTitleFontName, $event)"
376
+ >
377
+ </kendo-chart-wizard-property-pane-form-field>
378
+ <kendo-chart-wizard-property-pane-form-field
379
+ text="Size"
380
+ inputType="comboBox"
381
+ placeholder="px"
382
+ [data]="fontSizes"
383
+ [value]="parseFont(stateService.state.categoryAxis[0]?.title?.font).size"
384
+ (valueChange)="updateState(categoryAxisTitleFontSize, $event)"
385
+ >
386
+ </kendo-chart-wizard-property-pane-form-field>
387
+ <kendo-chart-wizard-property-pane-form-field
388
+ text="Color"
389
+ inputType="colorPicker"
390
+ [value]="stateService.state.categoryAxis[0]?.title?.color"
391
+ (valueChange)="updateState(categoryAxisTitleColor, $event)"
392
+ >
393
+ </kendo-chart-wizard-property-pane-form-field>
394
+ </div>
395
+ </fieldset>
396
+ <fieldset class="k-form-fieldset">
397
+ <legend class="k-form-legend">Labels</legend>
398
+ <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
399
+ <kendo-chart-wizard-property-pane-form-field
400
+ text="Font"
401
+ inputType="comboBox"
402
+ [data]="fontNames"
403
+ placeholder="(Inherited font)"
404
+ [value]="parseFont(stateService.state.categoryAxis[0]?.labels?.font).name"
405
+ (valueChange)="updateState(categoryAxisLabelsFontName, $event)"
406
+ >
407
+ </kendo-chart-wizard-property-pane-form-field>
408
+ <kendo-chart-wizard-property-pane-form-field
409
+ text="Size"
410
+ inputType="comboBox"
411
+ [data]="fontSizes"
412
+ placeholder="px"
413
+ [value]="parseFont(stateService.state.categoryAxis[0]?.labels?.font).size"
414
+ (valueChange)="updateState(categoryAxisLabelsFontSize, $event)"
415
+ >
416
+ </kendo-chart-wizard-property-pane-form-field>
417
+ <kendo-chart-wizard-property-pane-form-field
418
+ text="Color"
419
+ inputType="colorPicker"
420
+ [value]="stateService.state.categoryAxis[0]?.labels?.color || ''"
421
+ (valueChange)="updateState(categoryAxisLabelsColor, $event)"
422
+ >
423
+ </kendo-chart-wizard-property-pane-form-field>
424
+ <kendo-chart-wizard-property-pane-form-field
425
+ text="Rotation"
426
+ inputType="dropDownList"
427
+ [data]="labelsRotation"
428
+ [value]="stateService.state.categoryAxis[0]?.labels?.rotation"
429
+ (valueChange)="updateState(categoryAxisLabelsRotation, $event)"
430
+ >
431
+ </kendo-chart-wizard-property-pane-form-field>
432
+ <span></span>
433
+ <kendo-chart-wizard-property-pane-form-field
434
+ text="Reverse Order"
435
+ [isLabelInsideFormFieldWrap]="true"
436
+ inputType="checkbox"
437
+ [colSpan]="2"
438
+ [value]="stateService.state.categoryAxis[0]?.reverse"
439
+ (valueChange)="updateState(categoryAxisReverseOrder, $event)"
440
+ >
441
+ </kendo-chart-wizard-property-pane-form-field>
442
+ </div>
443
+ </fieldset>
444
+ </form>
445
+ </kendo-expansionpanel>
446
+ </section>
447
+ <section class="k-row-start-1 k-row-end-3 k-col-start-4">
448
+ <kendo-expansionpanel
449
+ title="Value axis"
450
+ [expanded]="isExpanded('Value Axis')"
451
+ (expandedChange)="onExpandedChange('Value Axis', $event)"
452
+ >
453
+ <form class="k-form k-form-md">
454
+ <fieldset class="k-form-fieldset">
455
+ <legend class="k-form-legend">Title</legend>
456
+ <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
457
+ <kendo-chart-wizard-property-pane-form-field
458
+ inputType="text"
459
+ [hasLabel]="false"
460
+ [colSpan]="2"
461
+ placeholder="Axis Title"
462
+ [value]="stateService.state.valueAxis[0]?.title?.text"
463
+ (valueChange)="updateState(valueAxisTitleText, $event)"
464
+ >
465
+ </kendo-chart-wizard-property-pane-form-field>
466
+ <kendo-chart-wizard-property-pane-form-field
467
+ text="Font"
468
+ inputType="comboBox"
469
+ [colSpan]="2"
470
+ [data]="fontNames"
471
+ placeholder="(Inherited font)"
472
+ [value]="parseFont(stateService.state.valueAxis[0]?.title?.font).name"
473
+ (valueChange)="updateState(valueAxisTitleFontName, $event)"
474
+ >
475
+ </kendo-chart-wizard-property-pane-form-field>
476
+ <kendo-chart-wizard-property-pane-form-field
477
+ text="Size"
478
+ inputType="comboBox"
479
+ placeholder="px"
480
+ [data]="fontSizes"
481
+ [value]="parseFont(stateService.state.valueAxis[0]?.title?.font).size"
482
+ (valueChange)="updateState(valueAxisTitleFontSize, $event)"
483
+ >
484
+ </kendo-chart-wizard-property-pane-form-field>
485
+ <kendo-chart-wizard-property-pane-form-field
486
+ text="Color"
487
+ inputType="colorPicker"
488
+ [value]="stateService.state.valueAxis[0]?.title?.color"
489
+ (valueChange)="updateState(valueAxisTitleColor, $event)"
490
+ >
491
+ </kendo-chart-wizard-property-pane-form-field>
492
+ </div>
493
+ </fieldset>
494
+ <fieldset class="k-form-fieldset">
495
+ <legend class="k-form-legend">Labels</legend>
496
+ <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
497
+ <kendo-chart-wizard-property-pane-form-field
498
+ text="Font"
499
+ inputType="comboBox"
500
+ [data]="fontNames"
501
+ placeholder="(Inherited font)"
502
+ [value]="parseFont(stateService.state.valueAxis[0]?.labels?.font).name"
503
+ (valueChange)="updateState(valueAxisLabelsFontName, $event)"
504
+ >
505
+ </kendo-chart-wizard-property-pane-form-field>
506
+ <kendo-chart-wizard-property-pane-form-field
507
+ text="Size"
508
+ inputType="comboBox"
509
+ [data]="fontSizes"
510
+ placeholder="px"
511
+ [value]="parseFont(stateService.state.valueAxis[0]?.labels?.font).size"
512
+ (valueChange)="updateState(valueAxisLabelsFontSize, $event)"
513
+ >
514
+ </kendo-chart-wizard-property-pane-form-field>
515
+ <kendo-chart-wizard-property-pane-form-field
516
+ text="Color"
517
+ inputType="colorPicker"
518
+ [value]="stateService.state.valueAxis[0]?.labels?.color || ''"
519
+ (valueChange)="updateState(valueAxisLabelsColor, $event)"
520
+ >
521
+ </kendo-chart-wizard-property-pane-form-field>
522
+ <kendo-chart-wizard-property-pane-form-field
523
+ text="Rotation"
524
+ inputType="dropDownList"
525
+ [data]="labelsRotation"
526
+ [value]="stateService.state.valueAxis[0]?.labels?.rotation"
527
+ (valueChange)="updateState(valueAxisLabelsRotation, $event)"
528
+ >
529
+ </kendo-chart-wizard-property-pane-form-field>
530
+ </div>
531
+ </fieldset>
532
+ </form>
533
+ </kendo-expansionpanel>
534
+ </section>
535
+ `, isInline: true, dependencies: [{ kind: "component", type: ExpansionPanelComponent, selector: "kendo-expansionpanel", inputs: ["title", "subtitle", "disabled", "expanded", "svgExpandIcon", "svgCollapseIcon", "expandIcon", "collapseIcon", "animation"], outputs: ["expandedChange", "action", "expand", "collapse"], exportAs: ["kendoExpansionPanel"] }, { kind: "component", type: ChartWizardPropertyPaneFormFieldComponent, selector: "kendo-chart-wizard-property-pane-form-field", inputs: ["currentState", "action", "class", "inputType", "text", "data", "placeholder", "colSpan", "hasLabel", "isLabelInsideFormFieldWrap", "value"], outputs: ["valueChange"] }, { kind: "component", type: LabelComponent, selector: "kendo-label", inputs: ["text", "for", "optional", "labelCssStyle", "labelCssClass"], exportAs: ["kendoLabel"] }, { kind: "component", type: SwitchComponent, selector: "kendo-switch", inputs: ["focusableId", "onLabel", "offLabel", "checked", "disabled", "readonly", "tabindex", "size", "thumbRounded", "trackRounded", "tabIndex"], outputs: ["focus", "blur", "valueChange"], exportAs: ["kendoSwitch"] }, { kind: "component", type: DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
536
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardPropertyPaneDataTabComponent, decorators: [{
537
+ type: Component,
538
+ args: [{
539
+ selector: 'kendo-chart-wizard-property-pane-format-tab',
540
+ changeDetection: ChangeDetectionStrategy.OnPush,
541
+ template: `
542
+ <section>
543
+ <kendo-expansionpanel
544
+ title="Chart Area"
545
+ [expanded]="isExpanded('Chart Area')"
546
+ (expandedChange)="onExpandedChange('Chart Area', $event)"
547
+ [attr.dir]="stateService.direction"
548
+ >
549
+ <form class="k-form k-form-md">
550
+ <fieldset class="k-form-fieldset">
551
+ <legend class="k-form-legend">Margins</legend>
552
+ <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
553
+ <kendo-chart-wizard-property-pane-form-field
554
+ text="Left"
555
+ inputType="numeric"
556
+ [value]="$any(stateService.state.area?.margin).left"
557
+ (valueChange)="updateState(areaMarginLeft, $event)"
558
+ >
559
+ </kendo-chart-wizard-property-pane-form-field>
560
+ <kendo-chart-wizard-property-pane-form-field
561
+ text="Right"
562
+ inputType="numeric"
563
+ [value]="$any(stateService.state.area?.margin).right"
564
+ (valueChange)="updateState(areaMarginRight, $event)"
565
+ >
566
+ </kendo-chart-wizard-property-pane-form-field>
567
+ <kendo-chart-wizard-property-pane-form-field
568
+ text="Top"
569
+ inputType="numeric"
570
+ [value]="$any(stateService.state.area?.margin).top"
571
+ (valueChange)="updateState(areaMarginTop, $event)"
572
+ >
573
+ </kendo-chart-wizard-property-pane-form-field>
574
+ <kendo-chart-wizard-property-pane-form-field
575
+ text="Bottom"
576
+ inputType="numeric"
577
+ [value]="$any(stateService.state.area?.margin).bottom"
578
+ (valueChange)="updateState(areaMarginBottom, $event)"
579
+ >
580
+ </kendo-chart-wizard-property-pane-form-field>
581
+ </div>
582
+ </fieldset>
583
+ <fieldset class="k-form-fieldset">
584
+ <legend class="k-form-legend">Background</legend>
585
+ <kendo-chart-wizard-property-pane-form-field
586
+ text="Color"
587
+ inputType="colorPicker"
588
+ [value]="stateService.state.area?.background"
589
+ (valueChange)="updateState(areaBackground, $event)"
590
+ >
591
+ </kendo-chart-wizard-property-pane-form-field>
592
+ </fieldset>
593
+ </form>
594
+ </kendo-expansionpanel>
595
+ </section>
596
+ <section>
597
+ <kendo-expansionpanel
598
+ title="Title"
599
+ [expanded]="isExpanded('Title')"
600
+ (expandedChange)="onExpandedChange('Title', $event)"
601
+ >
602
+ <form class="k-form k-form-md">
603
+ <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
604
+ <kendo-chart-wizard-property-pane-form-field
605
+ text="Apply to"
606
+ inputType="dropDownList"
607
+ [data]="chartTitles"
608
+ [colSpan]="2"
609
+ [value]="stateService.currentTitle"
610
+ (valueChange)="changeCurrentTitle($event)"
611
+ >
612
+ </kendo-chart-wizard-property-pane-form-field>
613
+ <kendo-chart-wizard-property-pane-form-field
614
+ text="Title"
615
+ inputType="text"
616
+ [colSpan]="2"
617
+ [value]="chartTitleTypeText"
618
+ (valueChange)="updateState(chartTitleTypeAction, $event)"
619
+ >
620
+ </kendo-chart-wizard-property-pane-form-field>
621
+ <kendo-chart-wizard-property-pane-form-field
622
+ text="Font"
623
+ inputType="comboBox"
624
+ [data]="fontNames"
625
+ [colSpan]="2"
626
+ [value]="chartTitleTypeFont"
627
+ placeholder="(Inherited font)"
628
+ (valueChange)="updateState(chartTitleTypeFontAction, $event)"
629
+ >
630
+ </kendo-chart-wizard-property-pane-form-field>
631
+ <kendo-chart-wizard-property-pane-form-field
632
+ text="Size"
633
+ inputType="comboBox"
634
+ [data]="fontSizes"
635
+ [value]="chartTitleTypeFontSize"
636
+ (valueChange)="updateState(chartTitleTypeFontSizeAction, $event)"
637
+ >
638
+ </kendo-chart-wizard-property-pane-form-field>
639
+ <kendo-chart-wizard-property-pane-form-field
640
+ text="Color"
641
+ inputType="colorPicker"
642
+ [value]="chartTitleTypeColor"
643
+ (valueChange)="updateState(chartTitleTypeColorAction, $event)"
644
+ >
645
+ </kendo-chart-wizard-property-pane-form-field>
646
+ </div>
647
+ </form>
648
+ </kendo-expansionpanel>
649
+ </section>
650
+ <section>
651
+ <kendo-expansionpanel
652
+ title="Legend"
653
+ [expanded]="isExpanded('Legend')"
654
+ (expandedChange)="onExpandedChange('Legend', $event)"
655
+ >
656
+ <form class="k-form k-form-md">
657
+ <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
658
+ <kendo-label [for]="toggleLegend" text="Show Legend"></kendo-label>
659
+ <kendo-switch
660
+ #toggleLegend
661
+ onLabel="On"
662
+ offLabel="Off"
663
+ thumbRounded="full"
664
+ size="medium"
665
+ [checked]="stateService.state.legend?.visible"
666
+ (valueChange)="updateState(legendVisible, $event)"
667
+ ></kendo-switch>
668
+ <kendo-chart-wizard-property-pane-form-field
669
+ text="Font"
670
+ inputType="comboBox"
671
+ [data]="fontNames"
672
+ [colSpan]="2"
673
+ placeholder="(Inherited font)"
674
+ [value]="parseFont(stateService.state.legend?.labels?.font).name"
675
+ (valueChange)="updateState(legendFontName, $event)"
676
+ >
677
+ </kendo-chart-wizard-property-pane-form-field>
678
+ <kendo-chart-wizard-property-pane-form-field
679
+ text="Size"
680
+ inputType="comboBox"
681
+ [data]="fontSizes"
682
+ placeholder="px"
683
+ [value]="parseFont(stateService.state.legend?.labels?.font).size"
684
+ (valueChange)="updateState(legendFontSize, $event)"
685
+ >
686
+ </kendo-chart-wizard-property-pane-form-field>
687
+ <kendo-chart-wizard-property-pane-form-field
688
+ text="Color"
689
+ inputType="colorPicker"
690
+ [value]="stateService.state.legend?.labels?.color"
691
+ (valueChange)="updateState(legendColor, $event)"
692
+ >
693
+ </kendo-chart-wizard-property-pane-form-field>
694
+ <kendo-chart-wizard-property-pane-form-field
695
+ text="Position"
696
+ inputType="dropDownList"
697
+ [colSpan]="2"
698
+ [data]="legendPositions"
699
+ [value]="stateService.state.legend?.position"
700
+ (valueChange)="updateState(legendPosition, $event)"
701
+ >
702
+ </kendo-chart-wizard-property-pane-form-field>
703
+ </div>
704
+ </form>
705
+ </kendo-expansionpanel>
706
+ </section>
707
+ <section>
708
+ <kendo-expansionpanel
709
+ title="Series"
710
+ [expanded]="isExpanded('Series')"
711
+ (expandedChange)="onExpandedChange('Series', $event)"
712
+ >
713
+ <form class="k-form k-form-md">
714
+ <div class="k-form-field">
715
+ <kendo-label [for]="seriesDropDown" class="k-form-label" text="Apply to"></kendo-label>
716
+ <div class="k-form-field-wrap">
717
+ <kendo-dropdownlist
718
+ #seriesDropDown
719
+ [data]="stateService.state.series"
720
+ textField="name"
721
+ valueField="name"
722
+ fillMode="outline"
723
+ rounded="medium"
724
+ size="medium"
725
+ [value]="stateService.currentSeries"
726
+ (valueChange)="updateCurrentSeries($event)"
727
+ ></kendo-dropdownlist>
728
+ </div>
729
+ </div>
730
+
731
+ <kendo-chart-wizard-property-pane-form-field
732
+ text="Color"
733
+ [value]="stateService.currentSeries?.color"
734
+ inputType="colorPicker"
735
+ (valueChange)="updateSeriesColor($event)"
736
+ >
737
+ </kendo-chart-wizard-property-pane-form-field>
738
+ <kendo-chart-wizard-property-pane-form-field
739
+ text="Show Labels"
740
+ [value]="stateService.currentSeries.labels?.visible"
741
+ [isLabelInsideFormFieldWrap]="true"
742
+ inputType="checkbox"
743
+ (valueChange)="toggleSeriesLabels($event)"
744
+ >
745
+ </kendo-chart-wizard-property-pane-form-field>
746
+ </form>
747
+ </kendo-expansionpanel>
748
+ </section>
749
+ <section class="k-row-start-1 k-row-end-3 k-col-start-3">
750
+ <kendo-expansionpanel
751
+ title="Category axis"
752
+ [expanded]="isExpanded('Category Axis')"
753
+ (expandedChange)="onExpandedChange('Category Axis', $event)"
754
+ >
755
+ <form class="k-form k-form-md">
756
+ <fieldset class="k-form-fieldset">
757
+ <legend class="k-form-legend">Title</legend>
758
+ <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
759
+ <kendo-chart-wizard-property-pane-form-field
760
+ inputType="text"
761
+ [hasLabel]="false"
762
+ [colSpan]="2"
763
+ placeholder="Axis Title"
764
+ [value]="stateService.state.categoryAxis[0]?.title?.text"
765
+ (valueChange)="updateState(categoryAxisTitleText, $event)"
766
+ >
767
+ </kendo-chart-wizard-property-pane-form-field>
768
+ <kendo-chart-wizard-property-pane-form-field
769
+ text="Font"
770
+ inputType="comboBox"
771
+ [data]="fontNames"
772
+ [colSpan]="2"
773
+ placeholder="(Inherited font)"
774
+ [value]="parseFont(stateService.state.categoryAxis[0]?.title?.font).name"
775
+ (valueChange)="updateState(categoryAxisTitleFontName, $event)"
776
+ >
777
+ </kendo-chart-wizard-property-pane-form-field>
778
+ <kendo-chart-wizard-property-pane-form-field
779
+ text="Size"
780
+ inputType="comboBox"
781
+ placeholder="px"
782
+ [data]="fontSizes"
783
+ [value]="parseFont(stateService.state.categoryAxis[0]?.title?.font).size"
784
+ (valueChange)="updateState(categoryAxisTitleFontSize, $event)"
785
+ >
786
+ </kendo-chart-wizard-property-pane-form-field>
787
+ <kendo-chart-wizard-property-pane-form-field
788
+ text="Color"
789
+ inputType="colorPicker"
790
+ [value]="stateService.state.categoryAxis[0]?.title?.color"
791
+ (valueChange)="updateState(categoryAxisTitleColor, $event)"
792
+ >
793
+ </kendo-chart-wizard-property-pane-form-field>
794
+ </div>
795
+ </fieldset>
796
+ <fieldset class="k-form-fieldset">
797
+ <legend class="k-form-legend">Labels</legend>
798
+ <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
799
+ <kendo-chart-wizard-property-pane-form-field
800
+ text="Font"
801
+ inputType="comboBox"
802
+ [data]="fontNames"
803
+ placeholder="(Inherited font)"
804
+ [value]="parseFont(stateService.state.categoryAxis[0]?.labels?.font).name"
805
+ (valueChange)="updateState(categoryAxisLabelsFontName, $event)"
806
+ >
807
+ </kendo-chart-wizard-property-pane-form-field>
808
+ <kendo-chart-wizard-property-pane-form-field
809
+ text="Size"
810
+ inputType="comboBox"
811
+ [data]="fontSizes"
812
+ placeholder="px"
813
+ [value]="parseFont(stateService.state.categoryAxis[0]?.labels?.font).size"
814
+ (valueChange)="updateState(categoryAxisLabelsFontSize, $event)"
815
+ >
816
+ </kendo-chart-wizard-property-pane-form-field>
817
+ <kendo-chart-wizard-property-pane-form-field
818
+ text="Color"
819
+ inputType="colorPicker"
820
+ [value]="stateService.state.categoryAxis[0]?.labels?.color || ''"
821
+ (valueChange)="updateState(categoryAxisLabelsColor, $event)"
822
+ >
823
+ </kendo-chart-wizard-property-pane-form-field>
824
+ <kendo-chart-wizard-property-pane-form-field
825
+ text="Rotation"
826
+ inputType="dropDownList"
827
+ [data]="labelsRotation"
828
+ [value]="stateService.state.categoryAxis[0]?.labels?.rotation"
829
+ (valueChange)="updateState(categoryAxisLabelsRotation, $event)"
830
+ >
831
+ </kendo-chart-wizard-property-pane-form-field>
832
+ <span></span>
833
+ <kendo-chart-wizard-property-pane-form-field
834
+ text="Reverse Order"
835
+ [isLabelInsideFormFieldWrap]="true"
836
+ inputType="checkbox"
837
+ [colSpan]="2"
838
+ [value]="stateService.state.categoryAxis[0]?.reverse"
839
+ (valueChange)="updateState(categoryAxisReverseOrder, $event)"
840
+ >
841
+ </kendo-chart-wizard-property-pane-form-field>
842
+ </div>
843
+ </fieldset>
844
+ </form>
845
+ </kendo-expansionpanel>
846
+ </section>
847
+ <section class="k-row-start-1 k-row-end-3 k-col-start-4">
848
+ <kendo-expansionpanel
849
+ title="Value axis"
850
+ [expanded]="isExpanded('Value Axis')"
851
+ (expandedChange)="onExpandedChange('Value Axis', $event)"
852
+ >
853
+ <form class="k-form k-form-md">
854
+ <fieldset class="k-form-fieldset">
855
+ <legend class="k-form-legend">Title</legend>
856
+ <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
857
+ <kendo-chart-wizard-property-pane-form-field
858
+ inputType="text"
859
+ [hasLabel]="false"
860
+ [colSpan]="2"
861
+ placeholder="Axis Title"
862
+ [value]="stateService.state.valueAxis[0]?.title?.text"
863
+ (valueChange)="updateState(valueAxisTitleText, $event)"
864
+ >
865
+ </kendo-chart-wizard-property-pane-form-field>
866
+ <kendo-chart-wizard-property-pane-form-field
867
+ text="Font"
868
+ inputType="comboBox"
869
+ [colSpan]="2"
870
+ [data]="fontNames"
871
+ placeholder="(Inherited font)"
872
+ [value]="parseFont(stateService.state.valueAxis[0]?.title?.font).name"
873
+ (valueChange)="updateState(valueAxisTitleFontName, $event)"
874
+ >
875
+ </kendo-chart-wizard-property-pane-form-field>
876
+ <kendo-chart-wizard-property-pane-form-field
877
+ text="Size"
878
+ inputType="comboBox"
879
+ placeholder="px"
880
+ [data]="fontSizes"
881
+ [value]="parseFont(stateService.state.valueAxis[0]?.title?.font).size"
882
+ (valueChange)="updateState(valueAxisTitleFontSize, $event)"
883
+ >
884
+ </kendo-chart-wizard-property-pane-form-field>
885
+ <kendo-chart-wizard-property-pane-form-field
886
+ text="Color"
887
+ inputType="colorPicker"
888
+ [value]="stateService.state.valueAxis[0]?.title?.color"
889
+ (valueChange)="updateState(valueAxisTitleColor, $event)"
890
+ >
891
+ </kendo-chart-wizard-property-pane-form-field>
892
+ </div>
893
+ </fieldset>
894
+ <fieldset class="k-form-fieldset">
895
+ <legend class="k-form-legend">Labels</legend>
896
+ <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
897
+ <kendo-chart-wizard-property-pane-form-field
898
+ text="Font"
899
+ inputType="comboBox"
900
+ [data]="fontNames"
901
+ placeholder="(Inherited font)"
902
+ [value]="parseFont(stateService.state.valueAxis[0]?.labels?.font).name"
903
+ (valueChange)="updateState(valueAxisLabelsFontName, $event)"
904
+ >
905
+ </kendo-chart-wizard-property-pane-form-field>
906
+ <kendo-chart-wizard-property-pane-form-field
907
+ text="Size"
908
+ inputType="comboBox"
909
+ [data]="fontSizes"
910
+ placeholder="px"
911
+ [value]="parseFont(stateService.state.valueAxis[0]?.labels?.font).size"
912
+ (valueChange)="updateState(valueAxisLabelsFontSize, $event)"
913
+ >
914
+ </kendo-chart-wizard-property-pane-form-field>
915
+ <kendo-chart-wizard-property-pane-form-field
916
+ text="Color"
917
+ inputType="colorPicker"
918
+ [value]="stateService.state.valueAxis[0]?.labels?.color || ''"
919
+ (valueChange)="updateState(valueAxisLabelsColor, $event)"
920
+ >
921
+ </kendo-chart-wizard-property-pane-form-field>
922
+ <kendo-chart-wizard-property-pane-form-field
923
+ text="Rotation"
924
+ inputType="dropDownList"
925
+ [data]="labelsRotation"
926
+ [value]="stateService.state.valueAxis[0]?.labels?.rotation"
927
+ (valueChange)="updateState(valueAxisLabelsRotation, $event)"
928
+ >
929
+ </kendo-chart-wizard-property-pane-form-field>
930
+ </div>
931
+ </fieldset>
932
+ </form>
933
+ </kendo-expansionpanel>
934
+ </section>
935
+ `,
936
+ standalone: true,
937
+ imports: [
938
+ ExpansionPanelComponent,
939
+ ChartWizardPropertyPaneFormFieldComponent,
940
+ LabelComponent,
941
+ SwitchComponent,
942
+ DropDownListComponent
943
+ ]
944
+ }]
945
+ }], ctorParameters: function () { return [{ type: i1.StateService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }]; } });