@progress/kendo-angular-gauges 19.1.2-develop.4 → 19.1.2-develop.5

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 (93) hide show
  1. package/arc-gauge/arc-center-template.directive.d.ts +10 -20
  2. package/arc-gauge/arc-gauge.component.d.ts +12 -10
  3. package/arc-gauge/arc-gauge.module.d.ts +5 -6
  4. package/arc-gauge/color.component.d.ts +36 -1
  5. package/arc-gauge/colors.component.d.ts +5 -3
  6. package/arc-gauge/gauge-area.component.d.ts +22 -2
  7. package/arc-gauge/labels.component.d.ts +23 -1
  8. package/arc-gauge/scale.component.d.ts +40 -1
  9. package/circular-gauge/center-template.directive.d.ts +9 -20
  10. package/circular-gauge/circular-gauge.component.d.ts +4 -2
  11. package/circular-gauge/circular-gauge.module.d.ts +6 -7
  12. package/circular-gauge/gauge-area.component.d.ts +16 -2
  13. package/circular-gauge/labels.component.d.ts +23 -1
  14. package/circular-gauge/scale.component.d.ts +18 -1
  15. package/directives.d.ts +5 -5
  16. package/esm2022/arc-gauge/arc-center-template.directive.mjs +10 -20
  17. package/esm2022/arc-gauge/arc-gauge.component.mjs +12 -10
  18. package/esm2022/arc-gauge/arc-gauge.module.mjs +5 -6
  19. package/esm2022/arc-gauge/color.component.mjs +36 -1
  20. package/esm2022/arc-gauge/colors.component.mjs +5 -3
  21. package/esm2022/arc-gauge/gauge-area.component.mjs +22 -2
  22. package/esm2022/arc-gauge/labels.component.mjs +23 -1
  23. package/esm2022/arc-gauge/scale.component.mjs +40 -1
  24. package/esm2022/circular-gauge/center-template.directive.mjs +9 -20
  25. package/esm2022/circular-gauge/circular-gauge.component.mjs +4 -2
  26. package/esm2022/circular-gauge/circular-gauge.module.mjs +6 -7
  27. package/esm2022/circular-gauge/gauge-area.component.mjs +16 -2
  28. package/esm2022/circular-gauge/labels.component.mjs +23 -1
  29. package/esm2022/circular-gauge/scale.component.mjs +18 -1
  30. package/esm2022/directives.mjs +5 -5
  31. package/esm2022/gauges.module.mjs +3 -3
  32. package/esm2022/linear-gauge/gauge-area.component.mjs +10 -2
  33. package/esm2022/linear-gauge/labels.component.mjs +11 -1
  34. package/esm2022/linear-gauge/linear-gauge.component.mjs +6 -4
  35. package/esm2022/linear-gauge/linear-gauge.module.mjs +4 -4
  36. package/esm2022/linear-gauge/pointer.component.mjs +32 -1
  37. package/esm2022/linear-gauge/pointers.component.mjs +5 -3
  38. package/esm2022/linear-gauge/range.component.mjs +13 -1
  39. package/esm2022/linear-gauge/ranges.component.mjs +8 -3
  40. package/esm2022/linear-gauge/scale.component.mjs +28 -1
  41. package/esm2022/package-metadata.mjs +2 -2
  42. package/esm2022/radial-gauge/gauge-area.component.mjs +17 -2
  43. package/esm2022/radial-gauge/labels.component.mjs +14 -1
  44. package/esm2022/radial-gauge/pointer.component.mjs +23 -1
  45. package/esm2022/radial-gauge/pointers.component.mjs +8 -3
  46. package/esm2022/radial-gauge/radial-gauge.component.mjs +9 -5
  47. package/esm2022/radial-gauge/radial-gauge.module.mjs +5 -5
  48. package/esm2022/radial-gauge/range.component.mjs +13 -1
  49. package/esm2022/radial-gauge/ranges.component.mjs +8 -3
  50. package/esm2022/radial-gauge/scale.component.mjs +27 -1
  51. package/fesm2022/progress-kendo-angular-gauges.mjs +480 -129
  52. package/gauges.module.d.ts +3 -3
  53. package/linear-gauge/gauge-area.component.d.ts +10 -2
  54. package/linear-gauge/labels.component.d.ts +11 -1
  55. package/linear-gauge/linear-gauge.component.d.ts +6 -4
  56. package/linear-gauge/linear-gauge.module.d.ts +4 -4
  57. package/linear-gauge/pointer.component.d.ts +32 -1
  58. package/linear-gauge/pointers.component.d.ts +5 -3
  59. package/linear-gauge/range.component.d.ts +13 -1
  60. package/linear-gauge/ranges.component.d.ts +8 -3
  61. package/linear-gauge/scale.component.d.ts +28 -1
  62. package/package.json +6 -6
  63. package/radial-gauge/gauge-area.component.d.ts +17 -2
  64. package/radial-gauge/labels.component.d.ts +14 -1
  65. package/radial-gauge/pointer.component.d.ts +23 -1
  66. package/radial-gauge/pointers.component.d.ts +8 -3
  67. package/radial-gauge/radial-gauge.component.d.ts +9 -5
  68. package/radial-gauge/radial-gauge.module.d.ts +5 -5
  69. package/radial-gauge/range.component.d.ts +13 -1
  70. package/radial-gauge/ranges.component.d.ts +8 -3
  71. package/radial-gauge/scale.component.d.ts +27 -1
  72. package/types/arc-scale.interface.d.ts +8 -8
  73. package/types/border.interface.d.ts +4 -4
  74. package/types/cap.interface.d.ts +3 -3
  75. package/types/circular-gauge-scale.interface.d.ts +1 -1
  76. package/types/color-range.interface.d.ts +5 -5
  77. package/types/dash-type.interface.d.ts +1 -1
  78. package/types/gauge-area.interface.d.ts +7 -7
  79. package/types/labels.interface.d.ts +10 -10
  80. package/types/line-cap.d.ts +1 -1
  81. package/types/line.interface.d.ts +5 -5
  82. package/types/linear-pointer-shape.d.ts +1 -1
  83. package/types/linear-pointer.interface.d.ts +9 -9
  84. package/types/linear-scale.interface.d.ts +5 -5
  85. package/types/margin.interface.d.ts +5 -5
  86. package/types/padding.interface.d.ts +5 -5
  87. package/types/radial-label-position.d.ts +1 -1
  88. package/types/radial-labels.interface.d.ts +5 -1
  89. package/types/radial-pointer.interface.d.ts +7 -7
  90. package/types/radial-scale.interface.d.ts +8 -8
  91. package/types/range.interface.d.ts +5 -5
  92. package/types/scale.interface.d.ts +10 -10
  93. package/types/ticks.interface.d.ts +5 -5
@@ -5,29 +5,19 @@
5
5
  import { TemplateRef } from '@angular/core';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
- * A directive that selects a [template](link:site.data.urls.angular['templatesyntax'])
9
- * within the `<kendo-arcgauge>` component which will be used for the center template
8
+ * Represents a directive that allows customizing the center part of the `<kendo-arcgauge>` component.
9
+ * Use this directive to create a center template
10
10
  * ([more information and example]({% slug centertemplate_arcgauge %})).
11
11
  *
12
- * @example
13
- * ```ts
14
- * import { Component } from '@angular/core';
15
- *
16
- * _@Component({
17
- * selector: 'my-app',
18
- * template: `
19
- * <kendo-arcgauge [value]="value">
20
- * <ng-template kendoArcGaugeCenterTemplate let-value="value">
21
- * {{ value }}%
22
- * </ng-template>
23
- * </kendo-arcgauge>
24
- *
25
- * `
26
- * })
27
- * export class AppComponent {
28
- * public value: number = 10;
29
- * }
12
+ * The template context provides access to the current ArcGauge value through the `value` field.
30
13
  *
14
+ * @example
15
+ * ```html
16
+ * <kendo-arcgauge [value]="value">
17
+ * <ng-template kendoArcGaugeCenterTemplate let-value="value">
18
+ * {{ value }}%
19
+ * </ng-template>
20
+ * </kendo-arcgauge>
31
21
  * ```
32
22
  */
33
23
  export declare class ArcCenterTemplateDirective {
@@ -18,7 +18,7 @@ import * as i0 from "@angular/core";
18
18
  * ```ts
19
19
  * import { Component } from '@angular/core';
20
20
  *
21
- * _@Component({
21
+ * @Component({
22
22
  * selector: 'my-app',
23
23
  * template: `
24
24
  * <kendo-arcgauge [value]="value" [scale]="{ max: 100 }">
@@ -31,29 +31,31 @@ import * as i0 from "@angular/core";
31
31
  * class AppComponent {
32
32
  * public value: number = 10;
33
33
  * }
34
- *
35
34
  * ```
35
+ *
36
+ * @remarks
37
+ * Supported children components are: {@link ArcScaleComponent}, {@link ArcLabelsComponent}, {@link ArcGaugeAreaComponent}, {@link ColorsComponent}.
36
38
  */
37
39
  export declare class ArcGaugeComponent extends GaugeComponent {
38
40
  protected changeDetector: ChangeDetectorRef;
39
41
  /**
40
- * The value of the gauge.
42
+ * Sets the value of the gauge.
41
43
  */
42
44
  value: number;
43
45
  /**
44
- * The color of the value pointer. Accepts a valid CSS color string, including hex and rgb.
46
+ * Sets the color of the value pointer. Accepts a valid CSS color string, including hex and rgb.
45
47
  */
46
48
  color: string;
47
49
  /**
48
- * The color ranges of the value pointer.
50
+ * Sets the color ranges of the value pointer.
49
51
  */
50
52
  colors: ColorRange[];
51
53
  /**
52
- * The opacity of the value pointer.
54
+ * Sets the opacity of the value pointer.
53
55
  */
54
56
  opacity: number;
55
57
  /**
56
- * The scale options of the ArcGauge.
58
+ * Sets the scale options of the ArcGauge.
57
59
  */
58
60
  scale: ArcScale;
59
61
  centerTemplate: ArcCenterTemplateDirective;
@@ -64,14 +66,14 @@ export declare class ArcGaugeComponent extends GaugeComponent {
64
66
  ngOnInit(): void;
65
67
  ngAfterViewChecked(): void;
66
68
  /**
67
- * Exports the gauge as a Drawing `Scene`.
69
+ * Exports the Gauge as a Drawing `Scene`.
68
70
  *
69
- * @returns {Promise<Group>} - A promise that will be resolved with the export visual.
71
+ * @returns A promise that resolves with the export visual.
70
72
  */
71
73
  exportVisual(): Promise<Group>;
72
74
  /**
73
75
  * Detects the size of the container and redraws the Gauge.
74
- * Resizing is automatic unless you set the `resizeRateLimit` option to `0`.
76
+ * Resizing happens automatically unless you set the `resizeRateLimit` option to `0`.
75
77
  */
76
78
  resize(): void;
77
79
  protected createInstance(element: any, options: any, theme: any, context: any): void;
@@ -11,25 +11,24 @@ import * as i5 from "./labels.component";
11
11
  import * as i6 from "./colors.component";
12
12
  import * as i7 from "./color.component";
13
13
  /**
14
- * A [module](link:site.data.urls.angular['ngmodules']) that includes the ArcGauge component and its directives.
15
- * Imports the `ArcGaugeModule` into your application
14
+ * Represents the [`NgModule`](link:site.data.urls.angular['ngmodules']) definition that includes the ArcGauge component and its directives.
15
+ * Import the `ArcGaugeModule` into your application
16
16
  * [root module](link:site.data.urls.angular['ngmodules']#angular-modularity) or any other sub-module
17
17
  * that will use the ArcGauge component.
18
18
  *
19
19
  * @example
20
- * ```ts-no-run
20
+ * ```typescript
21
21
  * import { NgModule } from '@angular/core';
22
22
  * import { BrowserModule } from '@angular/platform-browser';
23
23
  * import { ArcGaugeModule } from '@progress/kendo-angular-gauges';
24
24
  * import { AppComponent } from './app.component';
25
25
  *
26
- * _@NgModule({
26
+ * @NgModule({
27
27
  * bootstrap: [AppComponent],
28
28
  * declarations: [AppComponent],
29
29
  * imports: [BrowserModule, ArcGaugeModule]
30
30
  * })
31
- * export class AppModule {
32
- * }
31
+ * export class AppModule { }
33
32
  * ```
34
33
  */
35
34
  export declare class ArcGaugeModule {
@@ -7,12 +7,47 @@ import { CollectionItemComponent } from '../base-components';
7
7
  import { ColorRange } from '../types';
8
8
  import * as i0 from "@angular/core";
9
9
  /**
10
- * The configuration options for an ArcGauge color item.
10
+ * Represents the configuration options for an ArcGauge color item.
11
+ *
12
+ * @example
13
+ * ```ts
14
+ * import { Component } from '@angular/core';
15
+ *
16
+ * @Component({
17
+ * selector: 'my-app',
18
+ * template: `
19
+ * <kendo-arcgauge [value]="value">
20
+ * <kendo-arcgauge-colors>
21
+ * <kendo-arcgauge-color
22
+ * [from]="0"
23
+ * [to]="50"
24
+ * color="green">
25
+ * </kendo-arcgauge-color>
26
+ * </kendo-arcgauge-colors>
27
+ * </kendo-arcgauge>
28
+ * `
29
+ * })
30
+ * export class AppComponent {
31
+ * public value: number = 25;
32
+ * }
33
+ * ```
11
34
  */
12
35
  export declare class ColorComponent extends CollectionItemComponent implements ColorRange {
36
+ /**
37
+ * Sets the color of the range. Accepts a valid CSS color string, including hex and rgb.
38
+ */
13
39
  color?: string;
40
+ /**
41
+ * Sets the opacity of the range.
42
+ */
14
43
  opacity?: number;
44
+ /**
45
+ * Sets the start value of the range.
46
+ */
15
47
  from?: number;
48
+ /**
49
+ * Sets the end value of the range.
50
+ */
16
51
  to?: number;
17
52
  constructor(configurationService: ConfigurationService, collectionChangesService: CollectionChangesService);
18
53
  static ɵfac: i0.ɵɵFactoryDeclaration<ColorComponent, never>;
@@ -7,14 +7,14 @@ import { CollectionComponent, CollectionItemComponent } from '../base-components
7
7
  import { CollectionChangesService, ConfigurationService } from '../services';
8
8
  import * as i0 from "@angular/core";
9
9
  /**
10
- * A collection of one or more ArcGauge colors
10
+ * Represents a collection of one or more ArcGauge colors
11
11
  * ([more information and example]({% slug colorranges_arcgauge %})).
12
12
  *
13
13
  * @example
14
14
  * ```ts
15
15
  * import { Component } from '@angular/core';
16
16
  *
17
- * _@Component({
17
+ * @Component({
18
18
  * selector: 'my-app',
19
19
  * template: `
20
20
  * <kendo-arcgauge [value]="value">
@@ -45,8 +45,10 @@ import * as i0 from "@angular/core";
45
45
  * color: '#f31700'
46
46
  * }];
47
47
  * }
48
- *
49
48
  * ```
49
+ *
50
+ * @remarks
51
+ * Supported children components are: {@link ColorComponent}.
50
52
  */
51
53
  export declare class ColorsComponent extends CollectionComponent {
52
54
  children: QueryList<CollectionItemComponent>;
@@ -6,8 +6,28 @@ import { GaugeAreaComponent } from '../base-components';
6
6
  import { ConfigurationService } from '../services';
7
7
  import * as i0 from "@angular/core";
8
8
  /**
9
- * The configuration options of the ArcGauge area.
10
- * Represents the entire visible area of the ArcGauge.
9
+ * Represents the configuration options of the ArcGauge area.
10
+ * Controls the entire visible area of the ArcGauge.
11
+ *
12
+ * @example
13
+ * ```ts
14
+ * import { Component } from '@angular/core';
15
+ *
16
+ * @Component({
17
+ * selector: 'my-app',
18
+ * template: `
19
+ * <kendo-arcgauge [value]="value">
20
+ * <kendo-arcgauge-area
21
+ * background="lightgray"
22
+ * [margin]="10">
23
+ * </kendo-arcgauge-area>
24
+ * </kendo-arcgauge>
25
+ * `
26
+ * })
27
+ * export class AppComponent {
28
+ * public value: number = 40;
29
+ * }
30
+ * ```
11
31
  */
12
32
  export declare class ArcGaugeAreaComponent extends GaugeAreaComponent {
13
33
  protected configurationService: ConfigurationService;
@@ -6,7 +6,29 @@ import { RadialLabelsComponent } from '../radial-gauge/labels.component';
6
6
  import { ConfigurationService } from '../services';
7
7
  import * as i0 from "@angular/core";
8
8
  /**
9
- * The configuration options for the scale labels of the ArcGauge.
9
+ * Represents the configuration options for the scale labels of the ArcGauge.
10
+ *
11
+ * @example
12
+ * ```ts
13
+ * import { Component } from '@angular/core';
14
+ *
15
+ * @Component({
16
+ * selector: 'my-app',
17
+ * template: `
18
+ * <kendo-arcgauge [value]="value">
19
+ * <kendo-arcgauge-scale>
20
+ * <kendo-arcgauge-scale-labels
21
+ * color="blue"
22
+ * font="12px Arial">
23
+ * </kendo-arcgauge-scale-labels>
24
+ * </kendo-arcgauge-scale>
25
+ * </kendo-arcgauge>
26
+ * `
27
+ * })
28
+ * export class AppComponent {
29
+ * public value: number = 50;
30
+ * }
31
+ * ```
10
32
  */
11
33
  export declare class ArcLabelsComponent extends RadialLabelsComponent {
12
34
  protected configurationService: ConfigurationService;
@@ -7,15 +7,54 @@ import { ConfigurationService } from '../services';
7
7
  import { ArcScale, RadialLabels, LineCap } from '../types';
8
8
  import * as i0 from "@angular/core";
9
9
  /**
10
- * The configuration options for the scale of the ArcGauge
10
+ * Represents the configuration options for the scale of the ArcGauge
11
11
  * ([see example]({% slug scaleoptions_arcgauge %})).
12
+ *
13
+ * @example
14
+ * ```ts
15
+ * import { Component } from '@angular/core';
16
+ *
17
+ * @Component({
18
+ * selector: 'my-app',
19
+ * template: `
20
+ * <kendo-arcgauge [value]="value">
21
+ * <kendo-arcgauge-scale
22
+ * [startAngle]="-90"
23
+ * [endAngle]="90"
24
+ * [rangeDistance]="10">
25
+ * </kendo-arcgauge-scale>
26
+ * </kendo-arcgauge>
27
+ * `
28
+ * })
29
+ * export class AppComponent {
30
+ * public value: number = 30;
31
+ * }
32
+ * ```
33
+ *
34
+ * @remarks
35
+ * Supported children components are: {@link ArcLabelsComponent}
12
36
  */
13
37
  export declare class ArcScaleComponent extends ScaleComponent implements ArcScale {
14
38
  protected configurationService: ConfigurationService;
39
+ /**
40
+ * Sets the scale labels configuration.
41
+ */
15
42
  labels?: RadialLabels;
43
+ /**
44
+ * Sets the distance between the scale ranges in pixels.
45
+ */
16
46
  rangeDistance?: number;
47
+ /**
48
+ * Sets the line cap style for the scale ranges.
49
+ */
17
50
  rangeLineCap?: LineCap;
51
+ /**
52
+ * Sets the start angle of the Gauge in degrees.
53
+ */
18
54
  startAngle?: number;
55
+ /**
56
+ * Sets the end angle of the Gauge in degrees.
57
+ */
19
58
  endAngle?: number;
20
59
  constructor(configurationService: ConfigurationService);
21
60
  static ɵfac: i0.ɵɵFactoryDeclaration<ArcScaleComponent, never>;
@@ -5,29 +5,18 @@
5
5
  import { TemplateRef } from '@angular/core';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
- * A directive that selects a [template](link:site.data.urls.angular['templatesyntax'])
9
- * within the `<kendo-circulargauge>` component which will be used for the center template
8
+ * Represents a directive that allows customizing the center part of the `<kendo-circulargauge>` component
10
9
  * ([more information and example]({% slug centertemplate_circulargauge %})).
11
10
  *
12
- * @example
13
- * ```ts
14
- * import { Component } from '@angular/core';
15
- *
16
- * _@Component({
17
- * selector: 'my-app',
18
- * template: `
19
- * <kendo-circulargauge [value]="value">
20
- * <ng-template kendoCircularGaugeCenterTemplate let-value="value">
21
- * {{ value }}%
22
- * </ng-template>
23
- * </kendo-circulargauge>
24
- *
25
- * `
26
- * })
27
- * export class AppComponent {
28
- * public value: number = 10;
29
- * }
11
+ * The template context provides access to the current CircularGauge value through the `value` field.
30
12
  *
13
+ * @example
14
+ * ```html
15
+ * <kendo-circulargauge [value]="value">
16
+ * <ng-template kendoCircularGaugeCenterTemplate let-value="value">
17
+ * { value }}%
18
+ * </ng-template>
19
+ * </kendo-circulargauge>
31
20
  * ```
32
21
  */
33
22
  export declare class CircularGaugeCenterTemplateDirective {
@@ -26,12 +26,14 @@ import * as i0 from "@angular/core";
26
26
  * class AppComponent {
27
27
  * public value: number = 10;
28
28
  * }
29
- *
30
29
  * ```
30
+ *
31
+ * @remarks
32
+ * Supported children components are: {@link CircularGaugeScaleComponent}, {@link CircularGaugeLabelsComponent}, {@link CircularGaugeAreaComponent}.
31
33
  */
32
34
  export declare class CircularGaugeComponent extends ArcGaugeComponent {
33
35
  /**
34
- * The scale options of the gauge.
36
+ * Specifies the scale options of the Gauge.
35
37
  */
36
38
  scale: CircularGaugeScale;
37
39
  centerTemplate: CircularGaugeCenterTemplateDirective;
@@ -9,25 +9,24 @@ import * as i3 from "./gauge-area.component";
9
9
  import * as i4 from "./scale.component";
10
10
  import * as i5 from "./labels.component";
11
11
  /**
12
- * A [module](link:site.data.urls.angular['ngmodules']) that includes the CircularGauge component and its directives.
13
- * Imports the `CircularGaugeModule` into your application
12
+ * Represents the [`NgModule`](link:site.data.urls.angular['ngmodules']) definition that includes the CircularGauge component and its directives.
13
+ * Import the `CircularGaugeModule` into your application
14
14
  * [root module](link:site.data.urls.angular['ngmodules']#angular-modularity) or any other sub-module
15
- * that will use the CircularGauge component.
15
+ * that uses the CircularGauge component.
16
16
  *
17
17
  * @example
18
- * ```ts-no-run
18
+ * ```ts
19
19
  * import { NgModule } from '@angular/core';
20
20
  * import { BrowserModule } from '@angular/platform-browser';
21
21
  * import { CircularGaugeModule } from '@progress/kendo-angular-gauges';
22
22
  * import { AppComponent } from './app.component';
23
23
  *
24
- * _@NgModule({
24
+ * @NgModule({
25
25
  * bootstrap: [AppComponent],
26
26
  * declarations: [AppComponent],
27
27
  * imports: [BrowserModule, CircularGaugeModule]
28
28
  * })
29
- * export class AppModule {
30
- * }
29
+ * export class AppModule { }
31
30
  * ```
32
31
  */
33
32
  export declare class CircularGaugeModule {
@@ -5,8 +5,22 @@
5
5
  import { ArcGaugeAreaComponent } from '../arc-gauge/gauge-area.component';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
- * The configuration options of the Circular Gauge area.
9
- * Represents the entire visible area of the Circular Gauge.
8
+ * Represents the configuration options of the Circular Gauge area.
9
+ * Sets up the entire visible area of the CircularGauge.
10
+ *
11
+ * @example
12
+ * ```typescript
13
+ * @Component({
14
+ * selector: 'my-app',
15
+ * template: `
16
+ * <kendo-circulargauge>
17
+ * <kendo-circulargauge-area background="lightblue" margin="10">
18
+ * </kendo-circulargauge-area>
19
+ * </kendo-circulargauge>
20
+ * `
21
+ * })
22
+ * export class AppComponent { }
23
+ * ```
10
24
  */
11
25
  export declare class CircularGaugeAreaComponent extends ArcGaugeAreaComponent {
12
26
  static ɵfac: i0.ɵɵFactoryDeclaration<CircularGaugeAreaComponent, never>;
@@ -5,7 +5,29 @@
5
5
  import { ArcLabelsComponent } from '../arc-gauge/labels.component';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
- * The configuration options for the scale labels of the Circular Gauge.
8
+ * Represents the configuration options for the scale labels of the Circular Gauge.
9
+ *
10
+ * @example
11
+ * ```ts
12
+ * import { Component } from '@angular/core';
13
+ *
14
+ * @Component({
15
+ * selector: 'my-app',
16
+ * template: `
17
+ * <kendo-circulargauge [value]="value">
18
+ * <kendo-circulargauge-scale>
19
+ * <kendo-circulargauge-scale-labels
20
+ * color="blue"
21
+ * font="12px Arial">
22
+ * </kendo-circulargauge-scale-labels>
23
+ * </kendo-circulargauge-scale>
24
+ * </kendo-circulargauge>
25
+ * `
26
+ * })
27
+ * export class AppComponent {
28
+ * public value: number = 75;
29
+ * }
30
+ * ```
9
31
  */
10
32
  export declare class CircularGaugeLabelsComponent extends ArcLabelsComponent {
11
33
  static ɵfac: i0.ɵɵFactoryDeclaration<CircularGaugeLabelsComponent, never>;
@@ -6,8 +6,25 @@ import { ArcScaleComponent } from '../arc-gauge/scale.component';
6
6
  import { CircularGaugeScale } from '../types';
7
7
  import * as i0 from "@angular/core";
8
8
  /**
9
- * The configuration options for the scale of the Circular Gauge
9
+ * Represents the configuration options for the scale of the Circular Gauge
10
10
  * ([see example]({% slug scaleoptions_circulargauge %})).
11
+ *
12
+ * @example
13
+ * ```typescript
14
+ * @Component({
15
+ * selector: 'my-app',
16
+ * template: `
17
+ * <kendo-circulargauge>
18
+ * <kendo-circulargauge-scale [min]="0" [max]="100">
19
+ * </kendo-circulargauge-scale>
20
+ * </kendo-circulargauge>
21
+ * `
22
+ * })
23
+ * class AppComponent { }
24
+ * ```
25
+ *
26
+ * @remarks
27
+ * Supported children components are: {@link CircularGaugeLabelsComponent}
11
28
  */
12
29
  export declare class CircularGaugeScaleComponent extends ArcScaleComponent implements CircularGaugeScale {
13
30
  /**
package/directives.d.ts CHANGED
@@ -31,22 +31,22 @@ import { RadialRangeComponent } from "./radial-gauge/range.component";
31
31
  import { RadialRangesComponent } from "./radial-gauge/ranges.component";
32
32
  import { RadialScaleComponent } from "./radial-gauge/scale.component";
33
33
  /**
34
- * Utility array that contains all `ArcGauge` related components and directives
34
+ * Use this utility array to access all ArcGauge-related components and directives in a standalone Angular component.
35
35
  */
36
36
  export declare const KENDO_ARCGAUGE: readonly [typeof ArcGaugeComponent, typeof ArcCenterTemplateDirective, typeof ArcGaugeAreaComponent, typeof ArcScaleComponent, typeof ArcLabelsComponent, typeof ColorsComponent, typeof ColorComponent];
37
37
  /**
38
- * Utility array that contains all `CircularGauge` related components and directives
38
+ * Use this utility array to access all CircularGauge-related components and directives in a standalone Angular component.
39
39
  */
40
40
  export declare const KENDO_CIRCULARGAUGE: readonly [typeof CircularGaugeComponent, typeof CircularGaugeCenterTemplateDirective, typeof CircularGaugeAreaComponent, typeof CircularGaugeScaleComponent, typeof CircularGaugeLabelsComponent];
41
41
  /**
42
- * Utility array that contains all `LinearGauge` related components and directives
42
+ * Use this utility array to access all LinearGauge-related components and directives in a standalone Angular component.
43
43
  */
44
44
  export declare const KENDO_LINEARGAUGE: readonly [typeof LinearGaugeComponent, typeof LinearGaugeAreaComponent, typeof LinearScaleComponent, typeof LinearLabelsComponent, typeof LinearPointersComponent, typeof LinearPointerComponent, typeof LinearRangeComponent, typeof LinearRangesComponent];
45
45
  /**
46
- * Utility array that contains all `RadialGauge` related components and directives
46
+ * Use this utility array to access all RadialGauge-related components and directives in a standalone Angular component.
47
47
  */
48
48
  export declare const KENDO_RADIALGAUGE: readonly [typeof RadialGaugeComponent, typeof RadialGaugeAreaComponent, typeof RadialScaleComponent, typeof RadialLabelsComponent, typeof RadialPointersComponent, typeof RadialPointerComponent, typeof RadialRangeComponent, typeof RadialRangesComponent];
49
49
  /**
50
- * Utility array that contains all `@progress/kendo-angular-gauges` related components and directives
50
+ * Use this utility array to access all `@progress/kendo-angular-gauges`-related components and directives in a standalone Angular component.
51
51
  */
52
52
  export declare const KENDO_GAUGES: readonly [typeof ArcGaugeComponent, typeof ArcCenterTemplateDirective, typeof ArcGaugeAreaComponent, typeof ArcScaleComponent, typeof ArcLabelsComponent, typeof ColorsComponent, typeof ColorComponent, typeof CircularGaugeComponent, typeof CircularGaugeCenterTemplateDirective, typeof CircularGaugeAreaComponent, typeof CircularGaugeScaleComponent, typeof CircularGaugeLabelsComponent, typeof LinearGaugeComponent, typeof LinearGaugeAreaComponent, typeof LinearScaleComponent, typeof LinearLabelsComponent, typeof LinearPointersComponent, typeof LinearPointerComponent, typeof LinearRangeComponent, typeof LinearRangesComponent, typeof RadialGaugeComponent, typeof RadialGaugeAreaComponent, typeof RadialScaleComponent, typeof RadialLabelsComponent, typeof RadialPointersComponent, typeof RadialPointerComponent, typeof RadialRangeComponent, typeof RadialRangesComponent];
@@ -5,29 +5,19 @@
5
5
  import { Directive, TemplateRef, Optional } from '@angular/core';
6
6
  import * as i0 from "@angular/core";
7
7
  /**
8
- * A directive that selects a [template](link:site.data.urls.angular['templatesyntax'])
9
- * within the `<kendo-arcgauge>` component which will be used for the center template
8
+ * Represents a directive that allows customizing the center part of the `<kendo-arcgauge>` component.
9
+ * Use this directive to create a center template
10
10
  * ([more information and example]({% slug centertemplate_arcgauge %})).
11
11
  *
12
- * @example
13
- * ```ts
14
- * import { Component } from '@angular/core';
15
- *
16
- * _@Component({
17
- * selector: 'my-app',
18
- * template: `
19
- * <kendo-arcgauge [value]="value">
20
- * <ng-template kendoArcGaugeCenterTemplate let-value="value">
21
- * {{ value }}%
22
- * </ng-template>
23
- * </kendo-arcgauge>
24
- *
25
- * `
26
- * })
27
- * export class AppComponent {
28
- * public value: number = 10;
29
- * }
12
+ * The template context provides access to the current ArcGauge value through the `value` field.
30
13
  *
14
+ * @example
15
+ * ```html
16
+ * <kendo-arcgauge [value]="value">
17
+ * <ng-template kendoArcGaugeCenterTemplate let-value="value">
18
+ * {{ value }}%
19
+ * </ng-template>
20
+ * </kendo-arcgauge>
31
21
  * ```
32
22
  */
33
23
  export class ArcCenterTemplateDirective {
@@ -23,7 +23,7 @@ import * as i3 from "@progress/kendo-angular-l10n";
23
23
  * ```ts
24
24
  * import { Component } from '@angular/core';
25
25
  *
26
- * _@Component({
26
+ * @Component({
27
27
  * selector: 'my-app',
28
28
  * template: `
29
29
  * <kendo-arcgauge [value]="value" [scale]="{ max: 100 }">
@@ -36,29 +36,31 @@ import * as i3 from "@progress/kendo-angular-l10n";
36
36
  * class AppComponent {
37
37
  * public value: number = 10;
38
38
  * }
39
- *
40
39
  * ```
40
+ *
41
+ * @remarks
42
+ * Supported children components are: {@link ArcScaleComponent}, {@link ArcLabelsComponent}, {@link ArcGaugeAreaComponent}, {@link ColorsComponent}.
41
43
  */
42
44
  export class ArcGaugeComponent extends GaugeComponent {
43
45
  changeDetector;
44
46
  /**
45
- * The value of the gauge.
47
+ * Sets the value of the gauge.
46
48
  */
47
49
  value;
48
50
  /**
49
- * The color of the value pointer. Accepts a valid CSS color string, including hex and rgb.
51
+ * Sets the color of the value pointer. Accepts a valid CSS color string, including hex and rgb.
50
52
  */
51
53
  color;
52
54
  /**
53
- * The color ranges of the value pointer.
55
+ * Sets the color ranges of the value pointer.
54
56
  */
55
57
  colors;
56
58
  /**
57
- * The opacity of the value pointer.
59
+ * Sets the opacity of the value pointer.
58
60
  */
59
61
  opacity;
60
62
  /**
61
- * The scale options of the ArcGauge.
63
+ * Sets the scale options of the ArcGauge.
62
64
  */
63
65
  scale;
64
66
  centerTemplate;
@@ -85,16 +87,16 @@ export class ArcGaugeComponent extends GaugeComponent {
85
87
  }
86
88
  }
87
89
  /**
88
- * Exports the gauge as a Drawing `Scene`.
90
+ * Exports the Gauge as a Drawing `Scene`.
89
91
  *
90
- * @returns {Promise<Group>} - A promise that will be resolved with the export visual.
92
+ * @returns A promise that resolves with the export visual.
91
93
  */
92
94
  exportVisual() {
93
95
  return drawDOM(this.element.nativeElement);
94
96
  }
95
97
  /**
96
98
  * Detects the size of the container and redraws the Gauge.
97
- * Resizing is automatic unless you set the `resizeRateLimit` option to `0`.
99
+ * Resizing happens automatically unless you set the `resizeRateLimit` option to `0`.
98
100
  */
99
101
  resize() {
100
102
  super.resize();