@progress/kendo-react-charts 6.1.1 → 7.0.0-develop.2

package/option-types/subtitle.interface.d.ts

@@ -0,0 +1,65 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Border, Margin, Padding } from '../common/property-types';
+/**
+ * @hidden
+ */
+export interface Subtitle {
+    /**
+     * The alignment of the subtitle.
+     *
+     * By default, the subtitle has the same alignment as the title.
+     *
+     * The available options are:
+     * - `"center"`—The text is aligned to the middle.
+     * - `"left"`—The text is aligned to the left.
+     * - `"right"`—The text is aligned to the right.
+     */
+    align?: 'center' | 'left' | 'right';
+    /**
+     * The background color of the subtitle. Accepts a valid CSS color string, including hex and rgb.
+     */
+    background?: string;
+    /**
+     * The border of the subtitle.
+     */
+    border?: Border;
+    /**
+     * The text color of the subtitle. Accepts a valid CSS color string, including hex and rgb.
+     */
+    color?: string;
+    /**
+     * The font of the subtitle.
+     */
+    font?: string;
+    /**
+     * The margin of the subtitle. A numeric value sets all margins.
+     */
+    margin?: Margin | number;
+    /**
+     * The padding of the subtitle. A numeric value sets all margins.
+     */
+    padding?: Padding | number;
+    /**
+     * The position of the subtitle.
+     *
+     * By default, the subtitle is placed in the same position as the title.
+     *
+     * The available options are:
+     * - `"bottom"`—The title is positioned on the bottom.
+     * - `"top"`—The title is positioned on the top.
+     */
+    position?: 'top' | 'bottom';
+    /**
+     * The text of the chart subtitle. You can also set the text directly for a title with default options.
+     *
+     * You can split the text into multiple lines by using the line feed characters ("\n").
+     */
+    text?: string;
+    /**
+     * If set to `true`, the Chart displays the subtitle. By default, the subtitle is displayed.
+     */
+    visible?: boolean;
+}

package/option-types/title.interface.d.ts

@@ -0,0 +1,59 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Border, Margin, Padding } from '../common/property-types';
+/**
+ * @hidden
+ */
+export interface Title {
+    /**
+     * The alignment of the title.
+     *
+     * The available options are:
+     * - `"center"`—The text is aligned to the middle.
+     * - `"left"`—The text is aligned to the left.
+     * - `"right"`—The text is aligned to the right.
+     */
+    align?: 'center' | 'left' | 'right';
+    /**
+     * The background color of the title. Accepts a valid CSS color string, including hex and rgb.
+     */
+    background?: string;
+    /**
+     * The border of the series.
+     */
+    border?: Border;
+    /**
+     * The text color of the title. Accepts a valid CSS color string, including hex and rgb.
+     */
+    color?: string;
+    /**
+     * The font of the title.
+     */
+    font?: string;
+    /**
+     * The margin of the title. A numeric value sets all margins.
+     */
+    margin?: Margin | number;
+    /**
+     * The padding of the title. A numeric value sets all margins.
+     */
+    padding?: Padding | number;
+    /**
+     * The position of the title.
+     *
+     * The available options are:
+     * - `"bottom"`—The title is positioned on the bottom.
+     * - `"top"`—The title is positioned on the top.
+     */
+    position?: 'top' | 'bottom';
+    /**
+     * The text of the chart title. You can also set the text directly for a title with default options. You can split the text into multiple lines by using the line feed characters ("\n").
+     */
+    text?: string;
+    /**
+     * If set to `true`, the Chart displays the title. By default, the title is displayed.
+     */
+    visible?: boolean;
+}

package/option-types/tooltip.interface.d.ts

@@ -0,0 +1,52 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Border, Padding } from '../common/property-types';
+/**
+ * @hidden
+ */
+export interface Tooltip {
+    /**
+     * The background color of the tooltip. Accepts a valid CSS color string, including hex and rgb.
+     */
+    background?: string;
+    /**
+     * The border configuration options.
+     */
+    border?: Border;
+    /**
+     * The text color of the tooltip. Accepts a valid CSS color string, including hex and rgb.
+     */
+    color?: string;
+    /**
+     * The font of the tooltip.
+     */
+    font?: string;
+    /**
+     * The format of the labels. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService.
+     *
+     * The available format placeholders are:
+     * - Area, Bar, Column, Funnel, Pyramid, Line, and Pie: {0} - value.
+     * - Bubble: {0} - x value, {1} - y value, {2} - size value, {3} - category name.
+     * - Scatter and scatterLine: {0} - x value, {1} - y value.
+     * - Candlestick and OHLC: {0} - open value, {1} - high value, {2} - low value, {3} - close value, {4} - category name.
+     */
+    format?: string;
+    /**
+     * The opacity of the tooltip.
+     */
+    opacity?: number;
+    /**
+     * The padding of the tooltip. A numeric value sets all paddings.
+     */
+    padding?: Padding | number;
+    /**
+     * If set to `true`, the Chart displays a single tooltip for every category ([see example]({% slug tooltips_chart_charts %}#toc-shared-tooltip)).
+     */
+    shared?: boolean;
+    /**
+     * If set to `true`, the Chart displays the series tooltip. By default, the series tooltip is not displayed.
+     */
+    visible?: boolean;
+}

package/option-types/value-axis-item/crosshair.interface.d.ts

@@ -0,0 +1,30 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
+import { ValueAxisCrosshairTooltip } from './crosshair.tooltip.interface';
+/**
+ * @hidden
+ */
+export interface ValueAxisCrosshair {
+    /**
+     * The color of the crosshair. Accepts a valid CSS color string, including hex and rgb.
+     */
+    color?: string;
+    /**
+     * The opacity of the crosshair. By default, the crosshair is opaque.
+     */
+    opacity?: number;
+    /**
+     * If set to `true`, the Chart displays the value axis crosshair. By default, the value axis crosshair is not visible.
+     */
+    visible?: boolean;
+    /**
+     * The width of the crosshair in pixels.
+     */
+    width?: number;
+    /**
+     * The options of the crosshair tooltip. The crosshair tooltip is displayed when the [`valueAxis.crosshair.tooltip.visible`]({% slug api_charts_chartvalueaxiscrosshairtooltipprops %}#toc-visible) option is set to `true`.
+     */
+    tooltip?: ValueAxisCrosshairTooltip;
+}

package/option-types/value-axis-item/crosshair.tooltip.interface.d.ts

@@ -0,0 +1,38 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Border, Padding } from '../../common/property-types';
+/**
+ * @hidden
+ */
+export interface ValueAxisCrosshairTooltip {
+    /**
+     * The background color of the tooltip. Accepts a valid CSS color string, including hex and rgb.
+     */
+    background?: string;
+    /**
+     * The border options of the tooltip.
+     */
+    border?: Border;
+    /**
+     * The text color of the tooltip. Accepts a valid CSS color string, including hex and rgb.
+     */
+    color?: string;
+    /**
+     * The font of the tooltip.
+     */
+    font?: string;
+    /**
+     * The format for displaying the tooltip. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. Contains one placeholder (`"{0}"`) which represents the value.
+     */
+    format?: string;
+    /**
+     * The padding of the crosshair tooltip. A numeric value sets all paddings.
+     */
+    padding?: Padding | number;
+    /**
+     * If set to `true`, the chart displays the value axis crosshair tooltip. By default, the value axis crosshair tooltip is not visible.
+     */
+    visible?: boolean;
+}

package/option-types/value-axis-item/labels.interface.d.ts

@@ -0,0 +1,86 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
+import { drawing } from '@progress/kendo-drawing';
+import { AxisLabelVisualArgs, Border, LabelRotation, Margin } from '../../common/property-types';
+import { Padding } from '../../common/property-types';
+/**
+ * @hidden
+ */
+export interface ValueAxisLabels {
+    /**
+     * The background color of the labels. Accepts a valid CSS color string, including hex and rgb.
+     */
+    background?: string;
+    /**
+     * The border of the labels.
+     */
+    border?: Border;
+    /**
+     * The text color of the labels. Accepts a valid CSS color string, including hex and rgb.
+     */
+    color?: string;
+    /**
+     * The function which returns the label content. The function argument contains a `value` field. It defines the label value. You can split the text into multiple lines by using the line feed characters (`"\n"`).
+     *
+     * The available fields in the function argument are:
+     * - `value`—The category value.
+     * - `format`—The default format of the label.
+     * - `text`—The default label text.
+     * - `index`—The index of the label.
+     * - `count`—The total number of rendered labels.
+     */
+    content?: (e: any) => string;
+    /**
+     * The font style of the labels.
+     */
+    font?: string;
+    /**
+     * The format for displaying the labels. Uses the [`format`]({% slug api_intl_intlservice %}#toc-format) method of IntlService. Contains one placeholder (`"{0}"`) which represents the category value.
+     */
+    format?: string;
+    /**
+     * The margin of the labels. A numeric value sets all margins.
+     */
+    margin?: Margin | number;
+    /**
+     * If set to `true`, the Chart mirrors the axis labels and ticks. If the labels are normally on the left side of the axis, the mirroring of the axis renders them to the right.
+     */
+    mirror?: boolean;
+    /**
+     * The padding of the labels. A numeric value sets all margins.
+     */
+    padding?: Padding | number;
+    /**
+     * The rotation angle (in degrees) of the labels. By default, the labels are not rotated. Angles increase clockwise and zero is to the left. Negative values are acceptable. Can be set to `"auto"` if the axis is horizontal. In this case, the labels will be rotated only if the slot size is not sufficient for the entire labels.
+     */
+    rotation?: LabelRotation | number | 'auto';
+    /**
+     * The number of labels to skip. By default, no labels are skipped.
+     */
+    skip?: number;
+    /**
+     * The label rendering step.
+     * Every n<sup>th</sup> label is rendered where `n` is the step.
+     */
+    step?: number;
+    /**
+     * If set to `true`, the Chart displays the value axis labels. By default, the category axis labels are visible.
+     */
+    visible?: boolean;
+    /**
+     * A function for creating custom visuals for the labels.
+     *
+     * The available argument fields are:
+     * - `createVisual`&mdash;A function for getting the default visual.
+     * - `culture`&mdash;The default culture (if set) on the label.
+     * - `format`&mdash;The default format of the label.
+     * - `options`&mdash;The label options.
+     * - `rect`&mdash;The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines where the visual has to be rendered.
+     * - `sender`&mdash;The Chart instance (might be `undefined`).
+     * - `text`&mdash;The label text.
+     * - `value`&mdash;The category value.
+     */
+    visual?: (e: AxisLabelVisualArgs) => drawing.Element;
+}

package/option-types/value-axis-item/notes.icon.interface.d.ts

@@ -0,0 +1,36 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Border, MarkerType } from '../../common/property-types';
+/**
+ * @hidden
+ */
+export interface ValueAxisNotesIcon {
+    /**
+     * The background color of the notes icon.
+     */
+    background?: string;
+    /**
+     * The border of the notes icon.
+     */
+    border?: Border;
+    /**
+     * The size of the notes icon.
+     */
+    size?: number;
+    /**
+     * The shape of the notes icon.
+     *
+     * The supported values are:
+     * * `"circle"`—The marker shape is a circle.
+     * * `"square"`—The marker shape is a square.
+     * * `"triangle"`—The marker shape is a triangle.
+     * * `"cross"`—The marker shape is a cross.
+     */
+    type?: MarkerType;
+    /**
+     * The visibility of the notes icon.
+     */
+    visible?: boolean;
+}

package/option-types/value-axis-item/notes.interface.d.ts

@@ -0,0 +1,49 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
+import { drawing } from '@progress/kendo-drawing';
+import { AxisNoteVisualArgs, NoteLine, NotePosition } from '../../common/property-types';
+import { ValueAxisNotesIcon } from './notes.icon.interface';
+import { ValueAxisNotesLabel } from './notes.label.interface';
+/**
+ * @hidden
+ */
+export interface ValueAxisNotes {
+    /**
+     * The items of the notes.
+     */
+    data?: any[];
+    /**
+     * The line of the notes.
+     */
+    line?: NoteLine;
+    /**
+     * The position of the value axis note.
+     *
+     * The supported values are:
+     * - `"top"`—The note is positioned on the top.
+     * - `"bottom"`—The note is positioned on the bottom.
+     * - `"left"`—The note is positioned on the left.
+     * - `"right"`—The note is positioned on the right.
+     */
+    position?: NotePosition;
+    /**
+     * A function for creating custom visuals for the notes.
+     *
+     * The available argument fields are:
+     * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %}) that defines the note target rect.
+     * - `options`—The note options.
+     * - `createVisual`—A function that can be used to get the default visual.
+     * - `value`—The note value.
+     */
+    visual?: (e: AxisNoteVisualArgs) => drawing.Element;
+    /**
+     * The icon of the notes.
+     */
+    icon?: ValueAxisNotesIcon;
+    /**
+     * The label of the notes.
+     */
+    label?: ValueAxisNotesLabel;
+}

package/option-types/value-axis-item/notes.label.interface.d.ts

@@ -0,0 +1,50 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
+import { Border, NoteLabelPosition } from '../../common/property-types';
+/**
+ * @hidden
+ */
+export interface ValueAxisNotesLabel {
+    /**
+     * The background color of the label. Accepts a valid CSS color string, including hex and rgb.
+     */
+    background?: string;
+    /**
+     * The border of the label.
+     */
+    border?: Border;
+    /**
+     * The text color of the label. Accepts a valid CSS color string, including hex and rgb.
+     */
+    color?: string;
+    /**
+     * The function which returns the label content. The function argument contains a `value` field. It defines the axis value. You can split the text into multiple lines by using the line feed characters (`"\n"`).
+     */
+    content?: (e: any) => string;
+    /**
+     * The font style of the label.
+     */
+    font?: string;
+    /**
+     * The format used to display the notes label. Uses the IntlService [`format`]({% slug api_intl_intlservice %}#toc-format) method. Contains one placeholder (`"{0}"`) which represents the axis value.
+     */
+    format?: string;
+    /**
+     * The position of the labels.
+     *
+     * The supported values are:
+     * - `"inside"`—The label is positioned inside the icon.
+     * - `"outside"`—The label is positioned outside the icon.
+     */
+    position?: NoteLabelPosition;
+    /**
+     * The rotation angle of the label. By default, the label is not rotated.
+     */
+    rotation?: number;
+    /**
+     * If set to `true`, the Chart displays the value axis notes label. By default, the value axis notes label is visible.
+     */
+    visible?: boolean;
+}

package/option-types/value-axis-item/title.interface.d.ts

@@ -0,0 +1,70 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
+import { drawing } from '@progress/kendo-drawing';
+import { AxisTitlePosition, Border, Margin, Padding, TitleVisualArgs } from '../../common/property-types';
+/**
+ * @hidden
+ */
+export interface ValueAxisTitle {
+    /**
+     * The background color of the title. Accepts a valid CSS color string, including hex and rgb.
+     */
+    background?: string;
+    /**
+     * The border of the title.
+     */
+    border?: Border;
+    /**
+     * The text color of the title. Accepts a valid CSS color string, including hex and rgb.
+     */
+    color?: string;
+    /**
+     * The font style of the title.
+     */
+    font?: string;
+    /**
+     * The margin of the title. A numeric value sets all margins.
+     */
+    margin?: Margin | number;
+    /**
+     * The padding of the title. A numeric value sets all paddings.
+     */
+    padding?: Padding | number;
+    /**
+     * The position of the title.
+     *
+     * The supported values are:
+     * - `"top"`—The axis title is positioned on the top (applicable to the vertical axis).
+     * - `"bottom"`—The axis title is positioned on the bottom (applicable to the vertical axis).
+     * - `"left"`—The axis title is positioned on the left (applicable to the horizontal axis).
+     * - `"right"`—The axis title is positioned on the right (applicable to the horizontal axis).
+     * - `"center"`—The axis title is positioned in the center.
+     */
+    position?: AxisTitlePosition;
+    /**
+     * The rotation angle of the title. By default, the title is not rotated.
+     */
+    rotation?: number;
+    /**
+     * The text of the title. You can split the text into multiple lines by using the line feed characters (`"\n"`).
+     */
+    text?: string;
+    /**
+     * If set to `true`, the Chart displays the value axis title. By default, the value axis title is visible.
+     */
+    visible?: boolean;
+    /**
+     * A function for creating a custom visual for the title.
+     *
+     * The available argument fields are:
+     * - `text`—The label text.
+     * - `rect`—The geometry [`Rect`]({% slug api_kendo-drawing_geometry_rect %})
+     * that defines where the visual has to be rendered.
+     * - `sender`—The Chart instance (might be `undefined`).
+     * - `options`—The label options.
+     * - `createVisual`—A function for getting the default visual.
+     */
+    visual?: (e: TitleVisualArgs) => drawing.Element;
+}

package/option-types/value-axis-item.interface.d.ts

@@ -0,0 +1,118 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the package root for more information
+*-------------------------------------------------------------------------------------------*/
+import { AxisLine, AxisTicks, GridLines, PlotBand } from '../common/property-types';
+import { ValueAxisCrosshair } from './value-axis-item/crosshair.interface';
+import { ValueAxisLabels } from './value-axis-item/labels.interface';
+import { ValueAxisNotes } from './value-axis-item/notes.interface';
+import { ValueAxisTitle } from './value-axis-item/title.interface';
+/**
+ * @hidden
+ */
+export interface ValueAxis {
+    /**
+     * * (Only for objects) The value at which the category axis crosses this axis.
+     * * (Only for arrays) The value indices at which the category axes cross the value axis.
+     * * (Only for dates) The date at which the category axis crosses this axis.
+     */
+    axisCrossingValue?: any | any[];
+    /**
+     * The background color of the axis.
+     */
+    background?: string;
+    /**
+     * The color of the value axis. Accepts a valid CSS color string, including hex and rgb.
+     */
+    color?: string;
+    /**
+     * The configuration of the axis lines. Also affects the major and minor ticks, but not the grid lines.
+     */
+    line?: AxisLine;
+    /**
+     * The configuration of the major grid lines. These are the lines that are an extension of the major ticks through the body of the Chart.
+     */
+    majorGridLines?: GridLines;
+    /**
+     * The configuration of the value axis major ticks.
+     */
+    majorTicks?: AxisTicks;
+    /**
+     * The interval between major divisions. If [`valueAxis.type`]({% slug api_charts_chartvalueaxisitemprops %}#toc-type) is set to `"log"`, the `majorUnit` value is used for the base of the logarithm.
+     */
+    majorUnit?: number;
+    /**
+     * The maximum value of the axis.
+     */
+    max?: any;
+    /**
+     * The minimum value of the axis.
+     */
+    min?: any;
+    /**
+     * The configuration of the minor grid lines. These are the lines that are an extension of the minor ticks through the body of the Chart.
+     */
+    minorGridLines?: GridLines;
+    /**
+     * The configuration of the value axis minor ticks.
+     */
+    minorTicks?: AxisTicks;
+    /**
+     * The interval between minor divisions. It defaults to one-fifth (1/5) of the [`valueAxis.majorUnit`]({% slug api_charts_chartvalueaxisitemprops %}#toc-majorunit). If [`valueAxis.type`]({% slug api_charts_chartvalueaxisitemprops %}#toc-type) is set to `"log"`, the `minorUnit` value represents the number of divisions between two major units and defaults to the major unit minus one.
+     */
+    minorUnit?: number;
+    /**
+     * The unique axis name. Used to associate a series with a value axis by using the [`series.axis`]({% slug api_charts_chartseriesitemprops %}#toc-axis) option.
+     */
+    name?: string;
+    /**
+     * If set to `true`, the Chart prevents the automatic axis range from snapping to zero. Setting it to `false` forces the automatic axis range to snap to zero.
+     */
+    narrowRange?: boolean;
+    /**
+     * The name of the pane that the value axis has to be rendered in. If not set, the axis is rendered in the first (default) pane.
+     */
+    pane?: string;
+    /**
+     * The plot bands of the value axis.
+     */
+    plotBands?: PlotBand[];
+    /**
+     * If set to `true`, the value axis direction is reversed. By default, the categories are listed from left to right and from bottom to top.
+     *
+     * > Radar and Polar Charts do not support reverse value axes.
+     */
+    reverse?: boolean;
+    /**
+     * The axis type.
+     *
+     * The supported values are:
+     * - `"numeric"`—Numeric axis.
+     * - `"log"`—Logarithmic axis.
+     */
+    type?: 'numeric' | 'log';
+    /**
+     * If set to `true`, the Chart displays the value axis. By default, the value axis is visible.
+     */
+    visible?: boolean;
+    /**
+     * The crosshair configuration options.
+     *
+     * The crosshair is displayed when the [`valueAxis.crosshair.visible`]({% slug api_charts_chartvalueaxiscrosshairprops %}#toc-visible) option is set to `true`.
+     */
+    crosshair?: ValueAxisCrosshair;
+    /**
+     * The axis labels configuration.
+     */
+    labels?: ValueAxisLabels;
+    /**
+     * The value axis notes configuration.
+     */
+    notes?: ValueAxisNotes;
+    /**
+     * The title configuration of the value axis.
+     *
+     * To display the title, set the [`valueAxis.title.text`]({% slug api_charts_chartvalueaxistitleprops %}#toc-text) option.
+     */
+    title?: ValueAxisTitle;
+}