@progress/kendo-angular-chart-wizard 16.11.0-develop.9 → 16.12.0-develop.1

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 (29) hide show
  1. package/chart-wizard.component.d.ts +131 -5
  2. package/chart-wizard.module.d.ts +2 -1
  3. package/common/window-settings.d.ts +34 -0
  4. package/directives.d.ts +2 -1
  5. package/esm2020/chart-wizard.component.mjs +736 -38
  6. package/esm2020/chart-wizard.module.mjs +3 -2
  7. package/esm2020/common/window-settings.mjs +5 -0
  8. package/esm2020/directives.mjs +3 -1
  9. package/esm2020/index.mjs +1 -0
  10. package/esm2020/localization/chartwizard-localization.service.mjs +31 -0
  11. package/esm2020/localization/custom-messages.component.mjs +50 -0
  12. package/esm2020/localization/localized-messages.directive.mjs +38 -0
  13. package/esm2020/localization/messages.mjs +233 -0
  14. package/esm2020/package-metadata.mjs +2 -2
  15. package/esm2020/property-pane/chart-tab.component.mjs +39 -36
  16. package/esm2020/property-pane/data-tab.component.mjs +19 -13
  17. package/esm2020/property-pane/form-field.component.mjs +2 -2
  18. package/esm2020/property-pane/format-tab.component.mjs +176 -137
  19. package/fesm2015/progress-kendo-angular-chart-wizard.mjs +1305 -237
  20. package/fesm2020/progress-kendo-angular-chart-wizard.mjs +1301 -237
  21. package/index.d.ts +3 -0
  22. package/localization/chartwizard-localization.service.d.ts +14 -0
  23. package/localization/custom-messages.component.d.ts +25 -0
  24. package/localization/localized-messages.directive.d.ts +16 -0
  25. package/localization/messages.d.ts +437 -0
  26. package/package.json +17 -17
  27. package/property-pane/chart-tab.component.d.ts +3 -2
  28. package/property-pane/data-tab.component.d.ts +4 -1
  29. package/property-pane/format-tab.component.d.ts +15 -7
package/esm2020/property-pane/format-tab.component.mjs CHANGED
@@ -3,7 +3,7 @@
3
3
  * Licensed under commercial license. See LICENSE.md in the project root for more information
4
4
  *-------------------------------------------------------------------------------------------*/
5
5
  import { ChangeDetectionStrategy, ChangeDetectorRef, Component } from '@angular/core';
6
- import { ActionTypes, fontNames, fontSizes, parseFont, positions, rotations, updateState } from '../chart-wizard-state';
6
+ import { ActionTypes, fontNames, fontSizes, parseFont, updateState } from '../chart-wizard-state';
7
7
  import { StateService } from '../state.service';
8
8
  import { ChartWizardPropertyPaneFormFieldComponent } from './form-field.component';
9
9
  import { ExpansionPanelComponent } from '@progress/kendo-angular-layout';
@@ -11,11 +11,11 @@ import { LabelComponent } from '@progress/kendo-angular-label';
11
11
  import { SwitchComponent } from '@progress/kendo-angular-inputs';
12
12
  import { DropDownListComponent } from '@progress/kendo-angular-dropdowns';
13
13
  import { defaultAllSeriesItem, defaultFormat, labelFormats } from '../common/models';
14
- import { LocalizationService } from '@progress/kendo-angular-l10n';
15
14
  import { NgIf } from '@angular/common';
15
+ import { ChartWizardLocalizationService } from '../localization/chartwizard-localization.service';
16
16
  import * as i0 from "@angular/core";
17
17
  import * as i1 from "../state.service";
18
- import * as i2 from "@progress/kendo-angular-l10n";
18
+ import * as i2 from "../localization/chartwizard-localization.service";
19
19
  /**
20
20
  * @hidden
21
21
  */
@@ -25,8 +25,8 @@ export class ChartWizardPropertyPaneFormatTabComponent {
25
25
  this.localization = localization;
26
26
  this.cdr = cdr;
27
27
  this.chartTitles = [
28
- { text: 'Chart Title', value: 'Chart Title' },
29
- { text: 'Chart Subtitle', value: 'Chart Subtitle' },
28
+ { text: this.messageFor('formatTitleChartTitle'), value: 'Chart Title' },
29
+ { text: this.messageFor('formatTitleChartSubtitle'), value: 'Chart Subtitle' },
30
30
  ];
31
31
  this.areaMarginLeft = ActionTypes.areaMarginLeft;
32
32
  this.areaMarginRight = ActionTypes.areaMarginRight;
@@ -57,12 +57,37 @@ export class ChartWizardPropertyPaneFormatTabComponent {
57
57
  this.valueAxisLabelsColor = ActionTypes.valueAxisLabelsColor;
58
58
  this.valueAxisLabelsRotation = ActionTypes.valueAxisLabelsRotation;
59
59
  this.parseFont = parseFont;
60
- this.labelFormats = labelFormats;
61
60
  this.defaultAllSeriesItem = defaultAllSeriesItem;
62
61
  this.fontNames = fontNames;
63
62
  this.fontSizes = fontSizes;
64
- this.legendPositions = positions;
65
- this.labelsRotation = rotations;
63
+ this.labelFormats = [
64
+ { value: '', text: this.messageFor('formatValueAxisLabelsFormatText') },
65
+ { value: 'n0', text: this.messageFor('formatValueAxisLabelsFormatNumber') },
66
+ { value: 'c0', text: this.messageFor('formatValueAxisLabelsFormatCurrency') },
67
+ { value: 'p0', text: this.messageFor('formatValueAxisLabelsFormatPercent') }
68
+ ];
69
+ this.legendPositions = [
70
+ { text: this.messageFor('formatLegendPositionTop'), value: 'top' },
71
+ { text: this.messageFor('formatLegendPositionBottom'), value: 'bottom' },
72
+ { text: this.messageFor('formatLegendPositionLeft'), value: 'left' },
73
+ { text: this.messageFor('formatLegendPositionRight'), value: 'right' }
74
+ ];
75
+ this.labelsCategoryAxisRotation = [
76
+ { text: this.messageFor('formatCategoryAxisLabelsRotationAuto'), value: 'auto' },
77
+ { text: '0°', value: 0 },
78
+ { text: '45°', value: 45 },
79
+ { text: '90°', value: 90 },
80
+ { text: '135°', value: 135 },
81
+ { text: '180°', value: 180 }
82
+ ];
83
+ this.labelsValueAxisRotation = [
84
+ { text: this.messageFor('formatValueAxisLabelsRotationAuto'), value: 'auto' },
85
+ { text: '0°', value: 0 },
86
+ { text: '45°', value: 45 },
87
+ { text: '90°', value: 90 },
88
+ { text: '135°', value: 135 },
89
+ { text: '180°', value: 180 }
90
+ ];
66
91
  }
67
92
  get chartTitleTypeText() {
68
93
  return this.stateService.currentTitle === 'Chart Title'
@@ -97,7 +122,10 @@ export class ChartWizardPropertyPaneFormatTabComponent {
97
122
  return this.stateService.currentTitle === 'Chart Title' ? ActionTypes.titleFontSize : ActionTypes.subtitleFontSize;
98
123
  }
99
124
  get seriesData() {
100
- return [defaultAllSeriesItem, ...this.stateService.state.series];
125
+ return [
126
+ { text: this.messageFor('formatSeriesAllSeries'), name: 'All Series' },
127
+ ...this.stateService.state.series.map(item => ({ text: item.name, ...item }))
128
+ ];
101
129
  }
102
130
  get showLabels() {
103
131
  return this.stateService.currentSeries.name !== defaultAllSeriesItem.name ? this.stateService.state.series.find(s => s.name === this.stateService.currentSeries.name)?.labels?.visible : this.stateService.state.series.every(s => s.labels?.visible);
@@ -141,44 +169,51 @@ export class ChartWizardPropertyPaneFormatTabComponent {
141
169
  this.stateService.currentSeries.color = value;
142
170
  this.updateState(ActionTypes.seriesColor, this.stateService.currentSeries);
143
171
  }
172
+ messageFor(key) {
173
+ return this.localization.get(key);
174
+ }
144
175
  }
145
- ChartWizardPropertyPaneFormatTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardPropertyPaneFormatTabComponent, deps: [{ token: i1.StateService }, { token: i2.LocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
176
+ ChartWizardPropertyPaneFormatTabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: ChartWizardPropertyPaneFormatTabComponent, deps: [{ token: i1.StateService }, { token: i2.ChartWizardLocalizationService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
146
177
  ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: ChartWizardPropertyPaneFormatTabComponent, isStandalone: true, selector: "kendo-chartwizard-property-pane-format-tab", ngImport: i0, template: `
147
178
  <section>
148
179
  <kendo-expansionpanel
149
180
  [style.max-width.px]="576"
150
- title="Chart Area"
181
+ [title]="messageFor('formatChartArea')"
151
182
  [expanded]="true"
152
183
  [attr.dir]="stateService.direction"
153
184
  >
154
185
  <form class="k-form k-form-md">
155
186
  <fieldset class="k-form-fieldset">
156
- <legend class="k-form-legend">Margins</legend>
187
+ <legend class="k-form-legend">{{ messageFor('formatChartAreaMargins') }}</legend>
157
188
  <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
158
189
  <kendo-chartwizard-property-pane-form-field
159
- text="Left"
190
+ [text]="messageFor('formatChartAreaMarginsLeft')"
160
191
  inputType="numeric"
192
+ [placeholder]="messageFor('formatChartAreaMarginsAuto')"
161
193
  [value]="$any(stateService.state.area.margin).left"
162
194
  (valueChange)="updateState(areaMarginLeft, $event)"
163
195
  >
164
196
  </kendo-chartwizard-property-pane-form-field>
165
197
  <kendo-chartwizard-property-pane-form-field
166
- text="Right"
198
+ [text]="messageFor('formatChartAreaMarginsRight')"
167
199
  inputType="numeric"
200
+ [placeholder]="messageFor('formatChartAreaMarginsAuto')"
168
201
  [value]="$any(stateService.state.area.margin).right"
169
202
  (valueChange)="updateState(areaMarginRight, $event)"
170
203
  >
171
204
  </kendo-chartwizard-property-pane-form-field>
172
205
  <kendo-chartwizard-property-pane-form-field
173
- text="Top"
206
+ [text]="messageFor('formatChartAreaMarginsTop')"
174
207
  inputType="numeric"
208
+ [placeholder]="messageFor('formatChartAreaMarginsAuto')"
175
209
  [value]="$any(stateService.state.area.margin).top"
176
210
  (valueChange)="updateState(areaMarginTop, $event)"
177
211
  >
178
212
  </kendo-chartwizard-property-pane-form-field>
179
213
  <kendo-chartwizard-property-pane-form-field
180
- text="Bottom"
214
+ [text]="messageFor('formatChartAreaMarginsBottom')"
181
215
  inputType="numeric"
216
+ [placeholder]="messageFor('formatChartAreaMarginsAuto')"
182
217
  [value]="$any(stateService.state.area.margin).bottom"
183
218
  (valueChange)="updateState(areaMarginBottom, $event)"
184
219
  >
@@ -186,9 +221,9 @@ ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ mi
186
221
  </div>
187
222
  </fieldset>
188
223
  <fieldset class="k-form-fieldset">
189
- <legend class="k-form-legend">Background</legend>
224
+ <legend class="k-form-legend">{{ messageFor('formatChartAreaBackground') }}</legend>
190
225
  <kendo-chartwizard-property-pane-form-field
191
- text="Color"
226
+ [text]="messageFor('formatChartAreaBackgroundColor')"
192
227
  inputType="colorPicker"
193
228
  [value]="stateService.state.area?.background"
194
229
  (valueChange)="updateState(areaBackground, $event)"
@@ -201,13 +236,13 @@ ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ mi
201
236
  <section>
202
237
  <kendo-expansionpanel
203
238
  [style.max-width.px]="576"
204
- title="Title"
239
+ [title]="messageFor('formatTitle')"
205
240
  [expanded]="true"
206
241
  >
207
242
  <form class="k-form k-form-md">
208
243
  <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
209
244
  <kendo-chartwizard-property-pane-form-field
210
- text="Apply to"
245
+ [text]="messageFor('formatTitleApplyTo')"
211
246
  inputType="dropDownList"
212
247
  [data]="chartTitles"
213
248
  [colSpan]="2"
@@ -216,7 +251,7 @@ ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ mi
216
251
  >
217
252
  </kendo-chartwizard-property-pane-form-field>
218
253
  <kendo-chartwizard-property-pane-form-field
219
- text="Title"
254
+ [text]="messageFor('formatTitleLabel')"
220
255
  inputType="text"
221
256
  [colSpan]="2"
222
257
  [value]="chartTitleTypeText"
@@ -224,26 +259,26 @@ ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ mi
224
259
  >
225
260
  </kendo-chartwizard-property-pane-form-field>
226
261
  <kendo-chartwizard-property-pane-form-field
227
- text="Font"
262
+ [text]="messageFor('formatTitleFont')"
228
263
  inputType="comboBox"
229
264
  [data]="fontNames"
230
265
  [colSpan]="2"
231
266
  [value]="chartTitleTypeFont"
232
- placeholder="(Inherited font)"
267
+ [placeholder]="messageFor('formatTitleFontPlaceholder')"
233
268
  (valueChange)="updateState(chartTitleTypeFontAction, $event)"
234
269
  >
235
270
  </kendo-chartwizard-property-pane-form-field>
236
271
  <kendo-chartwizard-property-pane-form-field
237
- text="Size"
272
+ [text]="messageFor('formatTitleSize')"
238
273
  inputType="comboBox"
239
- placeholder="px"
274
+ [placeholder]="messageFor('formatTitleSizePlaceholder')"
240
275
  [data]="fontSizes"
241
276
  [value]="chartTitleTypeFontSize"
242
277
  (valueChange)="updateState(chartTitleTypeFontSizeAction, $event)"
243
278
  >
244
279
  </kendo-chartwizard-property-pane-form-field>
245
280
  <kendo-chartwizard-property-pane-form-field
246
- text="Color"
281
+ [text]="messageFor('formatTitleColor')"
247
282
  inputType="colorPicker"
248
283
  [value]="chartTitleTypeColor"
249
284
  (valueChange)="updateState(chartTitleTypeColorAction, $event)"
@@ -256,12 +291,12 @@ ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ mi
256
291
  <section>
257
292
  <kendo-expansionpanel
258
293
  [style.max-width.px]="576"
259
- title="Legend"
294
+ [title]="messageFor('formatLegend')"
260
295
  [expanded]="true"
261
296
  >
262
297
  <form class="k-form k-form-md">
263
298
  <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
264
- <kendo-label [for]="toggleLegend" text="Show Legend"></kendo-label>
299
+ <kendo-label [for]="toggleLegend" [text]="messageFor('formatLegendShowLegend')"></kendo-label>
265
300
  <kendo-switch
266
301
  #toggleLegend
267
302
  onLabel="On"
@@ -272,33 +307,33 @@ ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ mi
272
307
  (valueChange)="updateState(legendVisible, $event)"
273
308
  ></kendo-switch>
274
309
  <kendo-chartwizard-property-pane-form-field
275
- text="Font"
310
+ [text]="messageFor('formatLegendFont')"
276
311
  inputType="comboBox"
277
312
  [data]="fontNames"
278
313
  [colSpan]="2"
279
- placeholder="(Inherited font)"
314
+ [placeholder]="messageFor('formatLegendFontPlaceholder')"
280
315
  [value]="parseFont(stateService.state.legend?.labels?.font).name"
281
316
  (valueChange)="updateState(legendFontName, $event)"
282
317
  >
283
318
  </kendo-chartwizard-property-pane-form-field>
284
319
  <kendo-chartwizard-property-pane-form-field
285
- text="Size"
320
+ [text]="messageFor('formatLegendSize')"
286
321
  inputType="comboBox"
287
322
  [data]="fontSizes"
288
- placeholder="px"
323
+ [placeholder]="messageFor('formatLegendSizePlaceholder')"
289
324
  [value]="parseFont(stateService.state.legend?.labels?.font).size"
290
325
  (valueChange)="updateState(legendFontSize, $event)"
291
326
  >
292
327
  </kendo-chartwizard-property-pane-form-field>
293
328
  <kendo-chartwizard-property-pane-form-field
294
- text="Color"
329
+ [text]="messageFor('formatLegendColor')"
295
330
  inputType="colorPicker"
296
331
  [value]="stateService.state.legend?.labels?.color"
297
332
  (valueChange)="updateState(legendColor, $event)"
298
333
  >
299
334
  </kendo-chartwizard-property-pane-form-field>
300
335
  <kendo-chartwizard-property-pane-form-field
301
- text="Position"
336
+ [text]="messageFor('formatLegendPosition')"
302
337
  inputType="dropDownList"
303
338
  [colSpan]="2"
304
339
  [data]="legendPositions"
@@ -313,17 +348,17 @@ ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ mi
313
348
  <section>
314
349
  <kendo-expansionpanel
315
350
  [style.max-width.px]="576"
316
- title="Series"
351
+ [title]="messageFor('formatSeries')"
317
352
  [expanded]="true"
318
353
  >
319
354
  <form class="k-form k-form-md">
320
355
  <div class="k-form-field">
321
- <kendo-label [for]="seriesDropDown" class="k-form-label" text="Apply to"></kendo-label>
356
+ <kendo-label [for]="seriesDropDown" class="k-form-label" [text]="messageFor('formatSeriesApplyTo')"></kendo-label>
322
357
  <div class="k-form-field-wrap">
323
358
  <kendo-dropdownlist
324
359
  #seriesDropDown
325
360
  [data]="seriesData"
326
- textField="name"
361
+ textField="text"
327
362
  valueField="name"
328
363
  fillMode="outline"
329
364
  rounded="medium"
@@ -335,7 +370,7 @@ ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ mi
335
370
  </div>
336
371
 
337
372
  <kendo-chartwizard-property-pane-form-field
338
- text="Color"
373
+ [text]="messageFor('formatSeriesColor')"
339
374
  [value]="stateService.currentSeries?.color"
340
375
  inputType="colorPicker"
341
376
  [disabled]="stateService.currentSeries.name === defaultAllSeriesItem.name"
@@ -343,7 +378,7 @@ ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ mi
343
378
  >
344
379
  </kendo-chartwizard-property-pane-form-field>
345
380
  <kendo-chartwizard-property-pane-form-field
346
- text="Show Labels"
381
+ [text]="messageFor('formatSeriesShowLabels')"
347
382
  [value]="showLabels"
348
383
  [isLabelInsideFormFieldWrap]="true"
349
384
  [colSpan]="2"
@@ -357,43 +392,43 @@ ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ mi
357
392
  <section *ngIf="stateService.state.seriesType !== 'pie'" class="k-row-start-1 k-row-end-3 k-col-start-3">
358
393
  <kendo-expansionpanel
359
394
  [style.max-width.px]="576"
360
- [title]="stateService.state.seriesType === 'scatter' ? 'X Axis' : 'Category axis'"
395
+ [title]="stateService.state.seriesType === 'scatter' ? messageFor('formatXAxis') : messageFor('formatCategoryAxis')"
361
396
  [expanded]="true"
362
397
  >
363
398
  <form class="k-form k-form-md">
364
399
  <fieldset class="k-form-fieldset">
365
- <legend class="k-form-legend">Title</legend>
400
+ <legend class="k-form-legend">{{ messageFor('formatCategoryAxisTitle') }}</legend>
366
401
  <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
367
402
  <kendo-chartwizard-property-pane-form-field
368
403
  inputType="text"
369
404
  [hasLabel]="false"
370
405
  [colSpan]="2"
371
- placeholder="Axis Title"
406
+ [placeholder]="messageFor('formatCategoryAxisTitlePlaceholder')"
372
407
  [value]="stateService.state.categoryAxis[0]?.title?.text || null"
373
408
  (valueChange)="updateState(categoryAxisTitleText, $event)"
374
409
  >
375
410
  </kendo-chartwizard-property-pane-form-field>
376
411
  <kendo-chartwizard-property-pane-form-field
377
- text="Font"
412
+ [text]="messageFor('formatCategoryAxisTitleFont')"
378
413
  inputType="comboBox"
379
414
  [data]="fontNames"
380
415
  [colSpan]="2"
381
- placeholder="(Inherited font)"
416
+ [placeholder]="messageFor('formatCategoryAxisTitleFontPlaceholder')"
382
417
  [value]="parseFont(stateService.state.categoryAxis[0]?.title?.font).name"
383
418
  (valueChange)="updateState(categoryAxisTitleFontName, $event)"
384
419
  >
385
420
  </kendo-chartwizard-property-pane-form-field>
386
421
  <kendo-chartwizard-property-pane-form-field
387
- text="Size"
422
+ [text]="messageFor('formatCategoryAxisTitleSize')"
388
423
  inputType="comboBox"
389
- placeholder="px"
424
+ [placeholder]="messageFor('formatCategoryAxisTitleSizePlaceholder')"
390
425
  [data]="fontSizes"
391
426
  [value]="parseFont(stateService.state.categoryAxis[0]?.title?.font).size"
392
427
  (valueChange)="updateState(categoryAxisTitleFontSize, $event)"
393
428
  >
394
429
  </kendo-chartwizard-property-pane-form-field>
395
430
  <kendo-chartwizard-property-pane-form-field
396
- text="Color"
431
+ [text]="messageFor('formatCategoryAxisTitleColor')"
397
432
  inputType="colorPicker"
398
433
  [value]="stateService.state.categoryAxis[0]?.title?.color"
399
434
  (valueChange)="updateState(categoryAxisTitleColor, $event)"
@@ -402,45 +437,45 @@ ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ mi
402
437
  </div>
403
438
  </fieldset>
404
439
  <fieldset class="k-form-fieldset">
405
- <legend class="k-form-legend">Labels</legend>
440
+ <legend class="k-form-legend">{{ messageFor('formatCategoryAxisLabels') }}</legend>
406
441
  <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
407
442
  <kendo-chartwizard-property-pane-form-field
408
- text="Font"
443
+ [text]="messageFor('formatCategoryAxisLabelsFont')"
409
444
  inputType="comboBox"
410
445
  [data]="fontNames"
411
446
  [colSpan]="2"
412
- placeholder="(Inherited font)"
447
+ [placeholder]="messageFor('formatCategoryAxisLabelsFontPlaceholder')"
413
448
  [value]="parseFont(stateService.state.categoryAxis[0]?.labels?.font).name"
414
449
  (valueChange)="updateState(categoryAxisLabelsFontName, $event)"
415
450
  >
416
451
  </kendo-chartwizard-property-pane-form-field>
417
452
  <kendo-chartwizard-property-pane-form-field
418
- text="Size"
453
+ [text]="messageFor('formatCategoryAxisLabelsSize')"
419
454
  inputType="comboBox"
420
455
  [data]="fontSizes"
421
- placeholder="px"
456
+ [placeholder]="messageFor('formatCategoryAxisLabelsSizePlaceholder')"
422
457
  [value]="parseFont(stateService.state.categoryAxis[0]?.labels?.font).size"
423
458
  (valueChange)="updateState(categoryAxisLabelsFontSize, $event)"
424
459
  >
425
460
  </kendo-chartwizard-property-pane-form-field>
426
461
  <kendo-chartwizard-property-pane-form-field
427
- text="Color"
462
+ [text]="messageFor('formatCategoryAxisLabelsColor')"
428
463
  inputType="colorPicker"
429
464
  [value]="stateService.state.categoryAxis[0]?.labels?.color"
430
465
  (valueChange)="updateState(categoryAxisLabelsColor, $event)"
431
466
  >
432
467
  </kendo-chartwizard-property-pane-form-field>
433
468
  <kendo-chartwizard-property-pane-form-field
434
- text="Rotation"
469
+ [text]="messageFor('formatCategoryAxisLabelsRotation')"
435
470
  inputType="dropDownList"
436
- [data]="labelsRotation"
471
+ [data]="labelsCategoryAxisRotation"
437
472
  [value]="stateService.state.categoryAxis[0]?.labels?.rotation"
438
473
  (valueChange)="updateState(categoryAxisLabelsRotation, $event)"
439
474
  >
440
475
  </kendo-chartwizard-property-pane-form-field>
441
476
  <span></span>
442
477
  <kendo-chartwizard-property-pane-form-field
443
- text="Reverse Order"
478
+ [text]="messageFor('formatCategoryAxisLabelsReverseOrder')"
444
479
  [isLabelInsideFormFieldWrap]="true"
445
480
  inputType="checkbox"
446
481
  [colSpan]="2"
@@ -456,43 +491,43 @@ ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ mi
456
491
  <section *ngIf="stateService.state.seriesType !== 'pie'" class="k-row-start-1 k-row-end-3 k-col-start-4">
457
492
  <kendo-expansionpanel
458
493
  [style.max-width.px]="576"
459
- [title]="stateService.state.seriesType === 'scatter' ? 'Y Axis' : 'Value axis'"
494
+ [title]="stateService.state.seriesType === 'scatter' ? messageFor('formatYAxis') : messageFor('formatValueAxis')"
460
495
  [expanded]="true"
461
496
  >
462
497
  <form class="k-form k-form-md">
463
498
  <fieldset class="k-form-fieldset">
464
- <legend class="k-form-legend">Title</legend>
499
+ <legend class="k-form-legend">{{ messageFor('formatValueAxisTitle') }}</legend>
465
500
  <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
466
501
  <kendo-chartwizard-property-pane-form-field
467
502
  inputType="text"
468
503
  [hasLabel]="false"
469
504
  [colSpan]="2"
470
- placeholder="Axis Title"
505
+ [placeholder]="messageFor('formatValueAxisTitlePlaceholder')"
471
506
  [value]="stateService.state.valueAxis[0]?.title?.text || null"
472
507
  (valueChange)="updateState(valueAxisTitleText, $event)"
473
508
  >
474
509
  </kendo-chartwizard-property-pane-form-field>
475
510
  <kendo-chartwizard-property-pane-form-field
476
- text="Font"
511
+ [text]="messageFor('formatValueAxisTitleFont')"
477
512
  inputType="comboBox"
478
513
  [colSpan]="2"
479
514
  [data]="fontNames"
480
- placeholder="(Inherited font)"
515
+ [placeholder]="messageFor('formatValueAxisTitleFontPlaceholder')"
481
516
  [value]="parseFont(stateService.state.valueAxis[0]?.title?.font).name"
482
517
  (valueChange)="updateState(valueAxisTitleFontName, $event)"
483
518
  >
484
519
  </kendo-chartwizard-property-pane-form-field>
485
520
  <kendo-chartwizard-property-pane-form-field
486
- text="Size"
521
+ [text]="messageFor('formatValueAxisTitleSize')"
487
522
  inputType="comboBox"
488
- placeholder="px"
523
+ [placeholder]="messageFor('formatValueAxisTitleSizePlaceholder')"
489
524
  [data]="fontSizes"
490
525
  [value]="parseFont(stateService.state.valueAxis[0]?.title?.font).size"
491
526
  (valueChange)="updateState(valueAxisTitleFontSize, $event)"
492
527
  >
493
528
  </kendo-chartwizard-property-pane-form-field>
494
529
  <kendo-chartwizard-property-pane-form-field
495
- text="Color"
530
+ [text]="messageFor('formatValueAxisTitleColor')"
496
531
  inputType="colorPicker"
497
532
  [value]="stateService.state.valueAxis[0]?.title?.color"
498
533
  (valueChange)="updateState(valueAxisTitleColor, $event)"
@@ -501,10 +536,10 @@ ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ mi
501
536
  </div>
502
537
  </fieldset>
503
538
  <fieldset class="k-form-fieldset">
504
- <legend class="k-form-legend">Labels</legend>
539
+ <legend class="k-form-legend">{{ messageFor('formatValueAxisLabels') }}</legend>
505
540
  <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
506
541
  <kendo-chartwizard-property-pane-form-field
507
- text="Label Format"
542
+ [text]="messageFor('formatValueAxisLabelsFormat')"
508
543
  [colSpan]="2"
509
544
  inputType="dropDownList"
510
545
  [data]="labelFormats"
@@ -513,35 +548,35 @@ ChartWizardPropertyPaneFormatTabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ mi
513
548
  >
514
549
  </kendo-chartwizard-property-pane-form-field>
515
550
  <kendo-chartwizard-property-pane-form-field
516
- text="Font"
551
+ [text]="messageFor('formatValueAxisLabelsFont')"
517
552
  inputType="comboBox"
518
553
  [data]="fontNames"
519
554
  [colSpan]="2"
520
- placeholder="(Inherited font)"
555
+ [placeholder]="messageFor('formatValueAxisLabelsFontPlaceholder')"
521
556
  [value]="parseFont(stateService.state.valueAxis[0]?.labels?.font).name"
522
557
  (valueChange)="updateState(valueAxisLabelsFontName, $event)"
523
558
  >
524
559
  </kendo-chartwizard-property-pane-form-field>
525
560
  <kendo-chartwizard-property-pane-form-field
526
- text="Size"
561
+ [text]="messageFor('formatValueAxisLabelsSize')"
527
562
  inputType="comboBox"
528
563
  [data]="fontSizes"
529
- placeholder="px"
564
+ [placeholder]="messageFor('formatValueAxisLabelsSizePlaceholder')"
530
565
  [value]="parseFont(stateService.state.valueAxis[0]?.labels?.font).size"
531
566
  (valueChange)="updateState(valueAxisLabelsFontSize, $event)"
532
567
  >
533
568
  </kendo-chartwizard-property-pane-form-field>
534
569
  <kendo-chartwizard-property-pane-form-field
535
- text="Color"
570
+ [text]="messageFor('formatValueAxisLabelsColor')"
536
571
  inputType="colorPicker"
537
572
  [value]="stateService.state.valueAxis[0]?.labels?.color"
538
573
  (valueChange)="updateState(valueAxisLabelsColor, $event)"
539
574
  >
540
575
  </kendo-chartwizard-property-pane-form-field>
541
576
  <kendo-chartwizard-property-pane-form-field
542
- text="Rotation"
577
+ [text]="messageFor('formatValueAxisLabelsRotation')"
543
578
  inputType="dropDownList"
544
- [data]="labelsRotation"
579
+ [data]="labelsValueAxisRotation"
545
580
  [value]="stateService.state.valueAxis[0]?.labels?.rotation"
546
581
  (valueChange)="updateState(valueAxisLabelsRotation, $event)"
547
582
  >
@@ -561,38 +596,42 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
561
596
  <section>
562
597
  <kendo-expansionpanel
563
598
  [style.max-width.px]="576"
564
- title="Chart Area"
599
+ [title]="messageFor('formatChartArea')"
565
600
  [expanded]="true"
566
601
  [attr.dir]="stateService.direction"
567
602
  >
568
603
  <form class="k-form k-form-md">
569
604
  <fieldset class="k-form-fieldset">
570
- <legend class="k-form-legend">Margins</legend>
605
+ <legend class="k-form-legend">{{ messageFor('formatChartAreaMargins') }}</legend>
571
606
  <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
572
607
  <kendo-chartwizard-property-pane-form-field
573
- text="Left"
608
+ [text]="messageFor('formatChartAreaMarginsLeft')"
574
609
  inputType="numeric"
610
+ [placeholder]="messageFor('formatChartAreaMarginsAuto')"
575
611
  [value]="$any(stateService.state.area.margin).left"
576
612
  (valueChange)="updateState(areaMarginLeft, $event)"
577
613
  >
578
614
  </kendo-chartwizard-property-pane-form-field>
579
615
  <kendo-chartwizard-property-pane-form-field
580
- text="Right"
616
+ [text]="messageFor('formatChartAreaMarginsRight')"
581
617
  inputType="numeric"
618
+ [placeholder]="messageFor('formatChartAreaMarginsAuto')"
582
619
  [value]="$any(stateService.state.area.margin).right"
583
620
  (valueChange)="updateState(areaMarginRight, $event)"
584
621
  >
585
622
  </kendo-chartwizard-property-pane-form-field>
586
623
  <kendo-chartwizard-property-pane-form-field
587
- text="Top"
624
+ [text]="messageFor('formatChartAreaMarginsTop')"
588
625
  inputType="numeric"
626
+ [placeholder]="messageFor('formatChartAreaMarginsAuto')"
589
627
  [value]="$any(stateService.state.area.margin).top"
590
628
  (valueChange)="updateState(areaMarginTop, $event)"
591
629
  >
592
630
  </kendo-chartwizard-property-pane-form-field>
593
631
  <kendo-chartwizard-property-pane-form-field
594
- text="Bottom"
632
+ [text]="messageFor('formatChartAreaMarginsBottom')"
595
633
  inputType="numeric"
634
+ [placeholder]="messageFor('formatChartAreaMarginsAuto')"
596
635
  [value]="$any(stateService.state.area.margin).bottom"
597
636
  (valueChange)="updateState(areaMarginBottom, $event)"
598
637
  >
@@ -600,9 +639,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
600
639
  </div>
601
640
  </fieldset>
602
641
  <fieldset class="k-form-fieldset">
603
- <legend class="k-form-legend">Background</legend>
642
+ <legend class="k-form-legend">{{ messageFor('formatChartAreaBackground') }}</legend>
604
643
  <kendo-chartwizard-property-pane-form-field
605
- text="Color"
644
+ [text]="messageFor('formatChartAreaBackgroundColor')"
606
645
  inputType="colorPicker"
607
646
  [value]="stateService.state.area?.background"
608
647
  (valueChange)="updateState(areaBackground, $event)"
@@ -615,13 +654,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
615
654
  <section>
616
655
  <kendo-expansionpanel
617
656
  [style.max-width.px]="576"
618
- title="Title"
657
+ [title]="messageFor('formatTitle')"
619
658
  [expanded]="true"
620
659
  >
621
660
  <form class="k-form k-form-md">
622
661
  <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
623
662
  <kendo-chartwizard-property-pane-form-field
624
- text="Apply to"
663
+ [text]="messageFor('formatTitleApplyTo')"
625
664
  inputType="dropDownList"
626
665
  [data]="chartTitles"
627
666
  [colSpan]="2"
@@ -630,7 +669,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
630
669
  >
631
670
  </kendo-chartwizard-property-pane-form-field>
632
671
  <kendo-chartwizard-property-pane-form-field
633
- text="Title"
672
+ [text]="messageFor('formatTitleLabel')"
634
673
  inputType="text"
635
674
  [colSpan]="2"
636
675
  [value]="chartTitleTypeText"
@@ -638,26 +677,26 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
638
677
  >
639
678
  </kendo-chartwizard-property-pane-form-field>
640
679
  <kendo-chartwizard-property-pane-form-field
641
- text="Font"
680
+ [text]="messageFor('formatTitleFont')"
642
681
  inputType="comboBox"
643
682
  [data]="fontNames"
644
683
  [colSpan]="2"
645
684
  [value]="chartTitleTypeFont"
646
- placeholder="(Inherited font)"
685
+ [placeholder]="messageFor('formatTitleFontPlaceholder')"
647
686
  (valueChange)="updateState(chartTitleTypeFontAction, $event)"
648
687
  >
649
688
  </kendo-chartwizard-property-pane-form-field>
650
689
  <kendo-chartwizard-property-pane-form-field
651
- text="Size"
690
+ [text]="messageFor('formatTitleSize')"
652
691
  inputType="comboBox"
653
- placeholder="px"
692
+ [placeholder]="messageFor('formatTitleSizePlaceholder')"
654
693
  [data]="fontSizes"
655
694
  [value]="chartTitleTypeFontSize"
656
695
  (valueChange)="updateState(chartTitleTypeFontSizeAction, $event)"
657
696
  >
658
697
  </kendo-chartwizard-property-pane-form-field>
659
698
  <kendo-chartwizard-property-pane-form-field
660
- text="Color"
699
+ [text]="messageFor('formatTitleColor')"
661
700
  inputType="colorPicker"
662
701
  [value]="chartTitleTypeColor"
663
702
  (valueChange)="updateState(chartTitleTypeColorAction, $event)"
@@ -670,12 +709,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
670
709
  <section>
671
710
  <kendo-expansionpanel
672
711
  [style.max-width.px]="576"
673
- title="Legend"
712
+ [title]="messageFor('formatLegend')"
674
713
  [expanded]="true"
675
714
  >
676
715
  <form class="k-form k-form-md">
677
716
  <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
678
- <kendo-label [for]="toggleLegend" text="Show Legend"></kendo-label>
717
+ <kendo-label [for]="toggleLegend" [text]="messageFor('formatLegendShowLegend')"></kendo-label>
679
718
  <kendo-switch
680
719
  #toggleLegend
681
720
  onLabel="On"
@@ -686,33 +725,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
686
725
  (valueChange)="updateState(legendVisible, $event)"
687
726
  ></kendo-switch>
688
727
  <kendo-chartwizard-property-pane-form-field
689
- text="Font"
728
+ [text]="messageFor('formatLegendFont')"
690
729
  inputType="comboBox"
691
730
  [data]="fontNames"
692
731
  [colSpan]="2"
693
- placeholder="(Inherited font)"
732
+ [placeholder]="messageFor('formatLegendFontPlaceholder')"
694
733
  [value]="parseFont(stateService.state.legend?.labels?.font).name"
695
734
  (valueChange)="updateState(legendFontName, $event)"
696
735
  >
697
736
  </kendo-chartwizard-property-pane-form-field>
698
737
  <kendo-chartwizard-property-pane-form-field
699
- text="Size"
738
+ [text]="messageFor('formatLegendSize')"
700
739
  inputType="comboBox"
701
740
  [data]="fontSizes"
702
- placeholder="px"
741
+ [placeholder]="messageFor('formatLegendSizePlaceholder')"
703
742
  [value]="parseFont(stateService.state.legend?.labels?.font).size"
704
743
  (valueChange)="updateState(legendFontSize, $event)"
705
744
  >
706
745
  </kendo-chartwizard-property-pane-form-field>
707
746
  <kendo-chartwizard-property-pane-form-field
708
- text="Color"
747
+ [text]="messageFor('formatLegendColor')"
709
748
  inputType="colorPicker"
710
749
  [value]="stateService.state.legend?.labels?.color"
711
750
  (valueChange)="updateState(legendColor, $event)"
712
751
  >
713
752
  </kendo-chartwizard-property-pane-form-field>
714
753
  <kendo-chartwizard-property-pane-form-field
715
- text="Position"
754
+ [text]="messageFor('formatLegendPosition')"
716
755
  inputType="dropDownList"
717
756
  [colSpan]="2"
718
757
  [data]="legendPositions"
@@ -727,17 +766,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
727
766
  <section>
728
767
  <kendo-expansionpanel
729
768
  [style.max-width.px]="576"
730
- title="Series"
769
+ [title]="messageFor('formatSeries')"
731
770
  [expanded]="true"
732
771
  >
733
772
  <form class="k-form k-form-md">
734
773
  <div class="k-form-field">
735
- <kendo-label [for]="seriesDropDown" class="k-form-label" text="Apply to"></kendo-label>
774
+ <kendo-label [for]="seriesDropDown" class="k-form-label" [text]="messageFor('formatSeriesApplyTo')"></kendo-label>
736
775
  <div class="k-form-field-wrap">
737
776
  <kendo-dropdownlist
738
777
  #seriesDropDown
739
778
  [data]="seriesData"
740
- textField="name"
779
+ textField="text"
741
780
  valueField="name"
742
781
  fillMode="outline"
743
782
  rounded="medium"
@@ -749,7 +788,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
749
788
  </div>
750
789
 
751
790
  <kendo-chartwizard-property-pane-form-field
752
- text="Color"
791
+ [text]="messageFor('formatSeriesColor')"
753
792
  [value]="stateService.currentSeries?.color"
754
793
  inputType="colorPicker"
755
794
  [disabled]="stateService.currentSeries.name === defaultAllSeriesItem.name"
@@ -757,7 +796,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
757
796
  >
758
797
  </kendo-chartwizard-property-pane-form-field>
759
798
  <kendo-chartwizard-property-pane-form-field
760
- text="Show Labels"
799
+ [text]="messageFor('formatSeriesShowLabels')"
761
800
  [value]="showLabels"
762
801
  [isLabelInsideFormFieldWrap]="true"
763
802
  [colSpan]="2"
@@ -771,43 +810,43 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
771
810
  <section *ngIf="stateService.state.seriesType !== 'pie'" class="k-row-start-1 k-row-end-3 k-col-start-3">
772
811
  <kendo-expansionpanel
773
812
  [style.max-width.px]="576"
774
- [title]="stateService.state.seriesType === 'scatter' ? 'X Axis' : 'Category axis'"
813
+ [title]="stateService.state.seriesType === 'scatter' ? messageFor('formatXAxis') : messageFor('formatCategoryAxis')"
775
814
  [expanded]="true"
776
815
  >
777
816
  <form class="k-form k-form-md">
778
817
  <fieldset class="k-form-fieldset">
779
- <legend class="k-form-legend">Title</legend>
818
+ <legend class="k-form-legend">{{ messageFor('formatCategoryAxisTitle') }}</legend>
780
819
  <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
781
820
  <kendo-chartwizard-property-pane-form-field
782
821
  inputType="text"
783
822
  [hasLabel]="false"
784
823
  [colSpan]="2"
785
- placeholder="Axis Title"
824
+ [placeholder]="messageFor('formatCategoryAxisTitlePlaceholder')"
786
825
  [value]="stateService.state.categoryAxis[0]?.title?.text || null"
787
826
  (valueChange)="updateState(categoryAxisTitleText, $event)"
788
827
  >
789
828
  </kendo-chartwizard-property-pane-form-field>
790
829
  <kendo-chartwizard-property-pane-form-field
791
- text="Font"
830
+ [text]="messageFor('formatCategoryAxisTitleFont')"
792
831
  inputType="comboBox"
793
832
  [data]="fontNames"
794
833
  [colSpan]="2"
795
- placeholder="(Inherited font)"
834
+ [placeholder]="messageFor('formatCategoryAxisTitleFontPlaceholder')"
796
835
  [value]="parseFont(stateService.state.categoryAxis[0]?.title?.font).name"
797
836
  (valueChange)="updateState(categoryAxisTitleFontName, $event)"
798
837
  >
799
838
  </kendo-chartwizard-property-pane-form-field>
800
839
  <kendo-chartwizard-property-pane-form-field
801
- text="Size"
840
+ [text]="messageFor('formatCategoryAxisTitleSize')"
802
841
  inputType="comboBox"
803
- placeholder="px"
842
+ [placeholder]="messageFor('formatCategoryAxisTitleSizePlaceholder')"
804
843
  [data]="fontSizes"
805
844
  [value]="parseFont(stateService.state.categoryAxis[0]?.title?.font).size"
806
845
  (valueChange)="updateState(categoryAxisTitleFontSize, $event)"
807
846
  >
808
847
  </kendo-chartwizard-property-pane-form-field>
809
848
  <kendo-chartwizard-property-pane-form-field
810
- text="Color"
849
+ [text]="messageFor('formatCategoryAxisTitleColor')"
811
850
  inputType="colorPicker"
812
851
  [value]="stateService.state.categoryAxis[0]?.title?.color"
813
852
  (valueChange)="updateState(categoryAxisTitleColor, $event)"
@@ -816,45 +855,45 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
816
855
  </div>
817
856
  </fieldset>
818
857
  <fieldset class="k-form-fieldset">
819
- <legend class="k-form-legend">Labels</legend>
858
+ <legend class="k-form-legend">{{ messageFor('formatCategoryAxisLabels') }}</legend>
820
859
  <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
821
860
  <kendo-chartwizard-property-pane-form-field
822
- text="Font"
861
+ [text]="messageFor('formatCategoryAxisLabelsFont')"
823
862
  inputType="comboBox"
824
863
  [data]="fontNames"
825
864
  [colSpan]="2"
826
- placeholder="(Inherited font)"
865
+ [placeholder]="messageFor('formatCategoryAxisLabelsFontPlaceholder')"
827
866
  [value]="parseFont(stateService.state.categoryAxis[0]?.labels?.font).name"
828
867
  (valueChange)="updateState(categoryAxisLabelsFontName, $event)"
829
868
  >
830
869
  </kendo-chartwizard-property-pane-form-field>
831
870
  <kendo-chartwizard-property-pane-form-field
832
- text="Size"
871
+ [text]="messageFor('formatCategoryAxisLabelsSize')"
833
872
  inputType="comboBox"
834
873
  [data]="fontSizes"
835
- placeholder="px"
874
+ [placeholder]="messageFor('formatCategoryAxisLabelsSizePlaceholder')"
836
875
  [value]="parseFont(stateService.state.categoryAxis[0]?.labels?.font).size"
837
876
  (valueChange)="updateState(categoryAxisLabelsFontSize, $event)"
838
877
  >
839
878
  </kendo-chartwizard-property-pane-form-field>
840
879
  <kendo-chartwizard-property-pane-form-field
841
- text="Color"
880
+ [text]="messageFor('formatCategoryAxisLabelsColor')"
842
881
  inputType="colorPicker"
843
882
  [value]="stateService.state.categoryAxis[0]?.labels?.color"
844
883
  (valueChange)="updateState(categoryAxisLabelsColor, $event)"
845
884
  >
846
885
  </kendo-chartwizard-property-pane-form-field>
847
886
  <kendo-chartwizard-property-pane-form-field
848
- text="Rotation"
887
+ [text]="messageFor('formatCategoryAxisLabelsRotation')"
849
888
  inputType="dropDownList"
850
- [data]="labelsRotation"
889
+ [data]="labelsCategoryAxisRotation"
851
890
  [value]="stateService.state.categoryAxis[0]?.labels?.rotation"
852
891
  (valueChange)="updateState(categoryAxisLabelsRotation, $event)"
853
892
  >
854
893
  </kendo-chartwizard-property-pane-form-field>
855
894
  <span></span>
856
895
  <kendo-chartwizard-property-pane-form-field
857
- text="Reverse Order"
896
+ [text]="messageFor('formatCategoryAxisLabelsReverseOrder')"
858
897
  [isLabelInsideFormFieldWrap]="true"
859
898
  inputType="checkbox"
860
899
  [colSpan]="2"
@@ -870,43 +909,43 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
870
909
  <section *ngIf="stateService.state.seriesType !== 'pie'" class="k-row-start-1 k-row-end-3 k-col-start-4">
871
910
  <kendo-expansionpanel
872
911
  [style.max-width.px]="576"
873
- [title]="stateService.state.seriesType === 'scatter' ? 'Y Axis' : 'Value axis'"
912
+ [title]="stateService.state.seriesType === 'scatter' ? messageFor('formatYAxis') : messageFor('formatValueAxis')"
874
913
  [expanded]="true"
875
914
  >
876
915
  <form class="k-form k-form-md">
877
916
  <fieldset class="k-form-fieldset">
878
- <legend class="k-form-legend">Title</legend>
917
+ <legend class="k-form-legend">{{ messageFor('formatValueAxisTitle') }}</legend>
879
918
  <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
880
919
  <kendo-chartwizard-property-pane-form-field
881
920
  inputType="text"
882
921
  [hasLabel]="false"
883
922
  [colSpan]="2"
884
- placeholder="Axis Title"
923
+ [placeholder]="messageFor('formatValueAxisTitlePlaceholder')"
885
924
  [value]="stateService.state.valueAxis[0]?.title?.text || null"
886
925
  (valueChange)="updateState(valueAxisTitleText, $event)"
887
926
  >
888
927
  </kendo-chartwizard-property-pane-form-field>
889
928
  <kendo-chartwizard-property-pane-form-field
890
- text="Font"
929
+ [text]="messageFor('formatValueAxisTitleFont')"
891
930
  inputType="comboBox"
892
931
  [colSpan]="2"
893
932
  [data]="fontNames"
894
- placeholder="(Inherited font)"
933
+ [placeholder]="messageFor('formatValueAxisTitleFontPlaceholder')"
895
934
  [value]="parseFont(stateService.state.valueAxis[0]?.title?.font).name"
896
935
  (valueChange)="updateState(valueAxisTitleFontName, $event)"
897
936
  >
898
937
  </kendo-chartwizard-property-pane-form-field>
899
938
  <kendo-chartwizard-property-pane-form-field
900
- text="Size"
939
+ [text]="messageFor('formatValueAxisTitleSize')"
901
940
  inputType="comboBox"
902
- placeholder="px"
941
+ [placeholder]="messageFor('formatValueAxisTitleSizePlaceholder')"
903
942
  [data]="fontSizes"
904
943
  [value]="parseFont(stateService.state.valueAxis[0]?.title?.font).size"
905
944
  (valueChange)="updateState(valueAxisTitleFontSize, $event)"
906
945
  >
907
946
  </kendo-chartwizard-property-pane-form-field>
908
947
  <kendo-chartwizard-property-pane-form-field
909
- text="Color"
948
+ [text]="messageFor('formatValueAxisTitleColor')"
910
949
  inputType="colorPicker"
911
950
  [value]="stateService.state.valueAxis[0]?.title?.color"
912
951
  (valueChange)="updateState(valueAxisTitleColor, $event)"
@@ -915,10 +954,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
915
954
  </div>
916
955
  </fieldset>
917
956
  <fieldset class="k-form-fieldset">
918
- <legend class="k-form-legend">Labels</legend>
957
+ <legend class="k-form-legend">{{ messageFor('formatValueAxisLabels') }}</legend>
919
958
  <div class="k-form-layout k-d-grid k-grid-cols-2 k-gap-x-4">
920
959
  <kendo-chartwizard-property-pane-form-field
921
- text="Label Format"
960
+ [text]="messageFor('formatValueAxisLabelsFormat')"
922
961
  [colSpan]="2"
923
962
  inputType="dropDownList"
924
963
  [data]="labelFormats"
@@ -927,35 +966,35 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
927
966
  >
928
967
  </kendo-chartwizard-property-pane-form-field>
929
968
  <kendo-chartwizard-property-pane-form-field
930
- text="Font"
969
+ [text]="messageFor('formatValueAxisLabelsFont')"
931
970
  inputType="comboBox"
932
971
  [data]="fontNames"
933
972
  [colSpan]="2"
934
- placeholder="(Inherited font)"
973
+ [placeholder]="messageFor('formatValueAxisLabelsFontPlaceholder')"
935
974
  [value]="parseFont(stateService.state.valueAxis[0]?.labels?.font).name"
936
975
  (valueChange)="updateState(valueAxisLabelsFontName, $event)"
937
976
  >
938
977
  </kendo-chartwizard-property-pane-form-field>
939
978
  <kendo-chartwizard-property-pane-form-field
940
- text="Size"
979
+ [text]="messageFor('formatValueAxisLabelsSize')"
941
980
  inputType="comboBox"
942
981
  [data]="fontSizes"
943
- placeholder="px"
982
+ [placeholder]="messageFor('formatValueAxisLabelsSizePlaceholder')"
944
983
  [value]="parseFont(stateService.state.valueAxis[0]?.labels?.font).size"
945
984
  (valueChange)="updateState(valueAxisLabelsFontSize, $event)"
946
985
  >
947
986
  </kendo-chartwizard-property-pane-form-field>
948
987
  <kendo-chartwizard-property-pane-form-field
949
- text="Color"
988
+ [text]="messageFor('formatValueAxisLabelsColor')"
950
989
  inputType="colorPicker"
951
990
  [value]="stateService.state.valueAxis[0]?.labels?.color"
952
991
  (valueChange)="updateState(valueAxisLabelsColor, $event)"
953
992
  >
954
993
  </kendo-chartwizard-property-pane-form-field>
955
994
  <kendo-chartwizard-property-pane-form-field
956
- text="Rotation"
995
+ [text]="messageFor('formatValueAxisLabelsRotation')"
957
996
  inputType="dropDownList"
958
- [data]="labelsRotation"
997
+ [data]="labelsValueAxisRotation"
959
998
  [value]="stateService.state.valueAxis[0]?.labels?.rotation"
960
999
  (valueChange)="updateState(valueAxisLabelsRotation, $event)"
961
1000
  >
@@ -976,4 +1015,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
976
1015
  NgIf
977
1016
  ]
978
1017
  }]
979
- }], ctorParameters: function () { return [{ type: i1.StateService }, { type: i2.LocalizationService }, { type: i0.ChangeDetectorRef }]; } });
1018
+ }], ctorParameters: function () { return [{ type: i1.StateService }, { type: i2.ChartWizardLocalizationService }, { type: i0.ChangeDetectorRef }]; } });