import * as React from 'react';
import { HorizontalAlignment_$type } from "igniteui-react-core";
import { UnknownValuePlotting_$type } from "igniteui-react-core";
import { TrendLineType_$type } from "igniteui-react-core";
import { IgrChartSeriesEventArgs } from './igr-chart-series-event-args';
import { brushToString, stringToBrush, toBrushCollection, fromBrushCollection, fromRect, toRect, ensureBool, ensureEnum, isValidProp, getModifiedProps, toSpinal, initializePropertiesFromCss, NamePatcher } from "igniteui-react-core";
import { MarkerType_$type } from "./MarkerType";
import { delegateCombine, delegateRemove } from "igniteui-react-core";
import { IgrDomainChartSeriesPointerEventArgs } from './igr-domain-chart-series-pointer-event-args';
import { MarkerTypeCollection as MarkerTypeCollection_internal } from './MarkerTypeCollection';
import { IgrMarkerTypeCollection } from './igr-marker-type-collection';
import { SyncableObservableCollection$1 } from "igniteui-react-core";
import { ToolTipType_$type } from "./ToolTipType";
import { CrosshairsDisplayMode_$type } from "./CrosshairsDisplayMode";
import { IgrCalloutStyleUpdatingEventArgs } from "./igr-callout-style-updating-event-args";
import { ComputedPlotAreaMarginMode_$type } from './ComputedPlotAreaMarginMode';
import { SeriesHighlightingMode_$type } from './SeriesHighlightingMode';
import { SeriesHighlightingBehavior_$type } from './SeriesHighlightingBehavior';
import { LegendHighlightingMode_$type } from './LegendHighlightingMode';
import { SeriesOutlineMode_$type } from './SeriesOutlineMode';
import { MarkerOutlineMode_$type } from './MarkerOutlineMode';
import { MarkerFillMode_$type } from './MarkerFillMode';
export class IgrDomainChart extends React.Component {
    constructor(props) {
        super(props);
        this._calloutsDataSource = null;
        this._markerTypes = null;
        this.__p = null;
        this._hasUserValues = new Set();
        this._stylingContainer = null;
        this._stylingParent = null;
        this._inStyling = false;
        this._seriesAdded = null;
        this._seriesAdded_wrapped = null;
        this._seriesRemoved = null;
        this._seriesRemoved_wrapped = null;
        this._seriesPointerEnter = null;
        this._seriesPointerEnter_wrapped = null;
        this._seriesPointerLeave = null;
        this._seriesPointerLeave_wrapped = null;
        this._seriesPointerMove = null;
        this._seriesPointerMove_wrapped = null;
        this._seriesPointerDown = null;
        this._seriesPointerDown_wrapped = null;
        this._seriesPointerUp = null;
        this._seriesPointerUp_wrapped = null;
        this._calloutStyleUpdating = null;
        this._calloutStyleUpdating_wrapped = null;
        if (this._styling) {
            NamePatcher.ensureStylablePatched(Object.getPrototypeOf(this));
        }
        this._implementation = this.createImplementation();
        this._implementation.externalObject = this;
        this.onImplementationCreated();
    }
    createImplementation() {
        return null;
    }
    get i() {
        return this._implementation;
    }
    onImplementationCreated() {
    }
    componentDidMount() {
        for (const p of Object.keys(this.props)) {
            if (isValidProp(this, p)) {
                this[p] = this.props[p];
            }
        }
    }
    shouldComponentUpdate(nextProps, nextState) {
        const mod = getModifiedProps(this.props, nextProps);
        for (const p of Object.keys(mod)) {
            if (isValidProp(this, p)) {
                this[p] = mod[p];
            }
        }
        return true;
    }
    render() {
        return null;
    }
    /**
    * Sets or gets the template reference to use for tooltips for all the series.
    *
    *
    */
    get tooltipTemplate() {
        return this.i.tooltipTemplate;
    }
    set tooltipTemplate(v) {
        this.i.tooltipTemplate = v;
    }
    /**
    * Sets or gets the template references to use for tooltips for all the series, in order.
    *
    *
    */
    get tooltipTemplates() {
        let ret = [];
        if (this.i.tooltipTemplates) {
            for (let ii = 0; ii < this.i.tooltipTemplates.count; ii++) {
                ret.push(this.i.tooltipTemplates.item(ii));
            }
        }
        return ret;
    }
    set tooltipTemplates(v) {
        this.i.tooltipTemplates.clear();
        if (v) {
            for (let ii = 0; ii < v.length; ii++) {
                this.i.tooltipTemplates.add(v[ii]);
            }
        }
    }
    get legend() {
        if (this.i.legend != null)
            return this.i.legend.externalObject;
    }
    set legend(v) {
        if (v != undefined && v != null)
            this.i.legend = v.i;
    }
    set calloutsDataSource(value) {
        this._calloutsDataSource = value;
        this.bindCalloutsData();
    }
    get calloutsDataSource() {
        return this._calloutsDataSource;
    }
    bindCalloutsData() {
        if (this.i != null && this.i !== undefined) {
            this.i.calloutsItemsSource = this._calloutsDataSource;
        }
    }
    /**
 * Gets or sets the scaling value used to affect the pixel density of the control.
 * A higher scaling ratio will produce crisper visuals at the expense of memory.  Lower values will cause the control
 * to appear blurry.
*/
    get pixelScalingRatio() {
        return this.i.dj;
    }
    set pixelScalingRatio(v) {
        this.i.dj = +v;
    }
    /**
     * Gets or sets the left margin of chart title
    *
    *  Use `titleLeftMargin` property for the left margin of chart title.
    *
    * ```ts
    * this.chart.titleLeftMargin = 10;
    * ```
    *
    * ```ts
    *  <IgrCategoryChart dataSource={this.state.data}
    *                    titleLeftMargin={20}>
    *  </IgrCategoryChart>
    * ```
    */
    get titleLeftMargin() {
        return this.i.dx;
    }
    set titleLeftMargin(v) {
        this.i.dx = +v;
    }
    /**
     * Gets or sets the right margin of chart title
    *
    *  Use `titleLeftMargin` property for the right margin of chart title.
    *
    * ```ts
    * this.chart.titleRightMargin = 10;
    * ```
    *
    * ```ts
    * <IgrCategoryChart
    * 				dataSource={this.state.data}
    *                 titleRightMargin = 10>
    *  </IgrCategoryChart>
    * ```
    */
    get titleRightMargin() {
        return this.i.dy;
    }
    set titleRightMargin(v) {
        this.i.dy = +v;
    }
    /**
     * Gets or sets the top margin of chart title
    *
    *  Use `titleTopMargin` property for the top margin of chart title.
    *
    * ```ts
    * this.chart.titleTopMargin = 10;
    * ```
    *
    * ```ts
    * <IgrCategoryChart dataSource={this.state.data}
    *                titleTopMargin={10} />
    * ```
    */
    get titleTopMargin() {
        return this.i.dz;
    }
    set titleTopMargin(v) {
        this.i.dz = +v;
    }
    /**
     * Gets or sets the bottom margin of chart title
    *
    *  Use `titleBottomMargin` property for the bottom margin of chart title.
    *
    * ```ts
    *  this.chart.titleBottomMargin = 5;
    * ```
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	dataSource={this.categoryData}
    * 	subtitle= "CategoryChart Subtitle"
    * 	subtitleAlignment="Right"
    * 	titleBottomMargin={5}/>
    * ```
    */
    get titleBottomMargin() {
        return this.i.dw;
    }
    set titleBottomMargin(v) {
        this.i.dw = +v;
    }
    /**
     * Gets or sets the left margin of chart subtitle
    *
    * Use `subtitleLeftMargin` property for the left margin of chart subtitle.
    *
    * ```ts
    * this.chart.subtitleLeftMargin = 20 ;
    * ```
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	dataSource={this.categoryData}
    * 	subtitle= "CategoryChart Subtitle"
    * 	subtitleLeftMargin= {20}/>
    * ```
    */
    get subtitleLeftMargin() {
        return this.i.ds;
    }
    set subtitleLeftMargin(v) {
        this.i.ds = +v;
    }
    /**
     * Gets or sets the top margin of chart subtitle
    *
    * Use `subtitleTopMargin` property for the top margin of chart subtitle.
    *
    * ```ts
    * this.chart.subtitleTopMargin = 10;
    * ```
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	dataSource={this.categoryData}
    * 	subtitle= "CategoryChart Subtitle"
    * 	subtitleTopMargin= {10}/>
    * ```
    */
    get subtitleTopMargin() {
        return this.i.du;
    }
    set subtitleTopMargin(v) {
        this.i.du = +v;
    }
    /**
     * Gets or sets the right margin of chart subtitle
    *
    * Use `subtitleRightMargin` property for the right margin of chart subtitle.
    *
    * ```ts
    *  this.chart.subtitleRightMargin = 20 ;
    * ```
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	dataSource={this.categoryData}
    * 	subtitle= "CategoryChart Subtitle"
    * 	subtitleAlignment="Right"
    * 	subtitleRightMargin ={20}/>
    * ```
    */
    get subtitleRightMargin() {
        return this.i.dt;
    }
    set subtitleRightMargin(v) {
        this.i.dt = +v;
    }
    /**
     * Gets or sets the bottom margin of chart subtitle
    *
    * Use `subtitleBottomMargin` property for the bottom margin of chart subtitle.
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	dataSource={this.categoryData}
    * 	subtitle= "CategoryChart Subtitle"
    * 	subtitleBottomMargin= {10}/>
    * ```
    *
    * ```ts
    * this.chart.subtitleBottomMargin = 10 ;
    * ```
    */
    get subtitleBottomMargin() {
        return this.i.dr;
    }
    set subtitleBottomMargin(v) {
        this.i.dr = +v;
    }
    /**
     * Gets or sets color of chart subtitle
    *
    * Use `subtitleTextColor` property to color the subtitle.
    *
    * ```ts
    * this.chart.subtitleTextColor = "#ff0000" ;
    * ```
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	dataSource={this.categoryData}
    * 	subtitle= "CategoryChart Subtitle"
    * 	subtitleTextColor="#ff0000"/>
    * ```
    */
    get subtitleTextColor() {
        return brushToString(this.i.jf);
    }
    set subtitleTextColor(v) {
        this.i.jf = stringToBrush(v);
    }
    /**
     * Gets or sets color of chart title
    *
    *  Use `titleTextColor` property to color the chart title
    *
    * ```ts
    *  this.chart.titleTextColor="red" ;
    * ```
    *
    * ```ts
    * <IgrCategoryChart
    * 		dataSource={this.state.data}
    * 		width="700px"
    * 		height="500px"
    * 		xAxisTitle="Countries"
    * 		titleTextColor="Red" />
    *
    * ```
    */
    get titleTextColor() {
        return brushToString(this.i.jg);
    }
    set titleTextColor(v) {
        this.i.jg = stringToBrush(v);
    }
    /**
     * Gets or sets the left margin of the chart content.
    *
    * Use the 'leftMargin' property for the left margin of the chart content.
    *
    * ```ts
    *  this.chart.leftMargin = 20;
    * ```
    *
    * ```ts
    *  <IgrCategoryChart dataSource={this.state.data}
    *                    leftMargin= {20}/>
    * ```
    */
    get leftMargin() {
        return this.i.dh;
    }
    set leftMargin(v) {
        this.i.dh = +v;
    }
    /**
     * Gets or sets the top margin of the chart content.
    *
    * Use `topMargin` property for the margin of the chart content.
    *
    * ```ts
    * this.chart.topMargin=20;
    * ```
    *
    * ```ts
    * <IgrCategoryChart dataSource={this.state.data}
    *                topMargin={10} />
    * ```
    */
    get topMargin() {
        return this.i.d0;
    }
    set topMargin(v) {
        this.i.d0 = +v;
    }
    /**
     * Gets or sets the right margin of the chart content.
    *
    * Use `rightMargin` property for the right margin of the chart content.
    *
    * ```ts
    *   this.chart.rightMargin = 20 ;
    * ```
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	markerTypes={this.state.markersTypes}
    * 	dataSource={this.categoryData}
    * 	rightMargin= {4}/>
    * ```
    */
    get rightMargin() {
        return this.i.dq;
    }
    set rightMargin(v) {
        this.i.dq = +v;
    }
    /**
     * Gets or sets the bottom margin around the chart content.
    *
    * Use the `bottomMargin` property for the bottom margin around the chart content.
    *
    * ```ts
    * this.chart.bottomMargin=20;
    * ```
    *
    * ```ts
    *  <IgrCategoryChart dataSource={this.state.data}
    *                    bottomMargin= 20 />
    * ```
    */
    get bottomMargin() {
        return this.i.dg;
    }
    set bottomMargin(v) {
        this.i.dg = +v;
    }
    /**
     * Gets or sets the duration used for animating series plots when the data is changing
    *
    * Use the `transitionDuration` property to animating between data values.
    *
    * ```ts
    * this.chart.transitionDuratio= 500;
    * ```
    *
    * ```ts
    * <IgrCategoryChart dataSource={this.state.data}
    *                transitionDuratio={500} />
    * ```
    */
    get transitionDuration() {
        return this.i.d9;
    }
    set transitionDuration(v) {
        this.i.d9 = +v;
    }
    /**
     * Gets or sets the easing function used for animating series plots when the data is changing.
     * This can be set to one of the known values "linear" or "cubic," or it can be set to an easing function which takes a single numeric parameter and returns a number.
    *
    * The 'transitionInEasingFunction' property used for easing function for animating series plots when the chart is loading into view.
    *
    * ```ts
    * this.chart.transitionInEasingFunction=  this.cubicFunc;
    *
    * cubicFunc(time: number) : number
    *   {
    *     return time;
    *   }
    * ```
    *
    * ```ts
    * <IgrCategoryChart dataSource={this.state.data}
    *                transitionInEasingFunction="cubic" />
    * ```
    */
    get transitionEasingFunction() {
        return this.i.bf;
    }
    set transitionEasingFunction(v) {
        this.i.bf = v;
    }
    /**
     * Gets or sets CSS font property for the chart subtitle
    *
    * Use `subtitleTextStyle` property for the CSS font of the chart subtitle.
    *
    * ```ts
    * this.chart.subtitleTextStyle= "16pt Verdona";
    * ```
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	dataSource={this.categoryData}
    * 	subtitleTextStyle="16pt Verdona"/>
    * ```
    */
    get subtitleTextStyle() {
        return this.i.gi;
    }
    set subtitleTextStyle(v) {
        this.i.gi = v;
    }
    /**
     * Gets or sets CSS font property for the chart title
    *
    * Use `titleTextStyle` property for the CSS font property of the chart title
    *
    * ```ts
    * this.chart.xAxisTitleTextStyle = "24pt Verdona";
    * ```
    *
    * ```ts
    * <IgrCategoryChart dataSource={this.state.data}
    *                 width="700px"
    *                 height="500px"
    *                 xAxisTitle="Countries"
    *                 xAxisTitleTextColor="gray"
    *                 xAxisTitleTextStyle="12pt Verdana"
    *                 xAxisTitleAngle={0}
    *                 yAxisTitle="Trillions of Watt-hours (TWh)"
    *                 yAxisTitleTextStyle="12pt Verdana"
    *                 yAxisTitleTextColor="gray"
    *                 yAxisTitleAngle={90}
    *                 yAxisTitleLeftMargin={5}>
    *  </IgrCategoryChart>
    * ```
    */
    get titleTextStyle() {
        return this.i.gt;
    }
    set titleTextStyle(v) {
        this.i.gt = v;
    }
    /**
     * Gets or sets a set of property paths that should be included for consideration by the category chart, leaving the remainder excluded. If null, all properties will be considered.
    *
    * The `includedProperties` property used to include the properties for the consideration of the category chart.
    *
    * ```ts
    * this.chart.includedProperties = ["ProductName", "Cost"];
    * ```
    *
    * ```ts
    * 	<IgrCategoryChart
    * 		chartType="Line"
    * 		markerTypes={this.state.markersTypes}
    * 		dataSource={this.categoryData}
    * 		excludedProperties="value" />
    * ```
    */
    get includedProperties() {
        return this.i.d;
    }
    set includedProperties(v) {
        this.i.d = v;
    }
    /**
     * Gets or sets a set of property paths that should be excluded from consideration by the category chart.
    *
    * The `excludedProperties` property used for the property paths that should be excluded from consideration by the category chart.
    *
    * ```ts
    * this.chart.excludedProperties = ["ID", "Discount"];
    * ```
    *
    * ```ts
    * 	<IgrCategoryChart
    * 	chartType="Line"
    * 	markerTypes={this.state.markersTypes}
    * 	dataSource={this.categoryData}
    * 	excludedProperties="value" />
    * ```
    */
    get excludedProperties() {
        return this.i.c;
    }
    set excludedProperties(v) {
        this.i.c = v;
    }
    /**
     * Gets or sets the palette of brushes to use for coloring the chart series.
     * The value provided should be an array of CSS color strings or JavaScript objects defining gradients. Optionally the first element can be a string reading "RGB" or "HSV" to specify the interpolation mode of the collection
    *
    * Use the `brushes` property to  set the brushes.
    *
    * ```ts
    * this.chart.brushes = ["#ff0000","#00ff00"];
    * ```
    */
    get brushes() {
        return fromBrushCollection(this.i.j);
    }
    set brushes(v) {
        this.i.j = toBrushCollection(v);
    }
    /**
     * Gets or sets the palette of brushes to use for outlines on the chart series.
     * The value provided should be an array of CSS color strings or JavaScript objects defining gradients. Optionally the first element can be a string reading "RGB" or "HSV" to specify the interpolation mode of the collection
    *
    *  Use the `outlines` property to sets the palette of brushes to use for outlines on the chart series
    *
    * ```ts
    * <IgrCategoryChart
    * 	chartType="Line"
    * 	outlines= "#ff0000"
    * 	dataSource={this.categoryData}/>
    * ```
    */
    get outlines() {
        return fromBrushCollection(this.i.n);
    }
    set outlines(v) {
        this.i.n = toBrushCollection(v);
    }
    /**
     * Gets or sets whether the chart can be horizontally zoomed through user interactions.
    *
    * Use the `isHorizontalZoomEnabled` property to allow chart horizontally zoomed .
    *
    * ```ts
    *  <IgrCategoryChart dataSource={this.state.data}
    *                    width="700px"
    *                    height="500px"
    *                    xAxisLabelTextStyle="10pt Verdana"
    *                    xAxisLabelTopMargin={5}
    *                    xAxisLabelTextColor="gray"
    *                    yAxisLabelTextStyle="10pt Verdana"
    *                    yAxisLabelRightMargin={5}
    *                    yAxisLabelTextColor="gray"
    * 				   isHorizontalZoomEnabled= true/>
    * ```
    *
    * ```ts
    *  <IgrCategoryChart dataSource={this.state.data}
    *                    IsHorizontalZoomEnabled= true />
    * ```
    *
    * ```ts
    * this.chart.isHorizontalZoomEnabled = true;
    * ```
    */
    get isHorizontalZoomEnabled() {
        return this.i.b5;
    }
    set isHorizontalZoomEnabled(v) {
        this.i.b5 = ensureBool(v);
    }
    /**
     * Gets or sets whether the chart can be vertically zoomed through user interactions.
    *
    * Use the `isVerticalZoomEnabled` property to allow chart zoom vertically.
    *
    * ```ts
    *  this.chart.isVerticalZoomEnabled = true;
    * ```
    *
    * ```ts
    *  <IgrCategoryChart dataSource={this.state.data}
    *                   isVerticalZoomEnabled= "true"/>
    * ```
    */
    get isVerticalZoomEnabled() {
        return this.i.cb;
    }
    set isVerticalZoomEnabled(v) {
        this.i.cb = ensureBool(v);
    }
    /**
     * Gets or sets whether the chart can highlight series through user interactions.
     * This property applies to Category Chart and Financial Chart controls.
    */
    get isSeriesHighlightingEnabled() {
        return this.i.b7;
    }
    set isSeriesHighlightingEnabled(v) {
        this.i.b7 = ensureBool(v);
    }
    /**
     * Gets or sets the rectangle representing the current scroll and zoom state of the chart.
     * WindowRect is expressed as a Rectangle with coordinates and sizes between 0 and 1.
    *
    * Use `windowRect` property representing the current scroll and zoom state of the chart.
    *
    * ```ts
    * this.chart.windowRect =[0,0,1,1];
    * ```
    *
    * ```ts
    * <IgrCategoryChart dataSource={this.state.data}
    *                WindowRect={1,0,1,1} />
    * ```
    */
    get windowRect() {
        return fromRect(this.i.jk);
    }
    set windowRect(v) {
        this.i.jk = toRect(v);
    }
    /**
     * Gets a rectangle representing the bounds of the plot area.
    *
    * `viewport` property representing the bounds of the plot area.
    *
    * ```ts
    * let viewport:Rect =  this.chart.viewport;
    * ```
    */
    get viewport() {
        return fromRect(this.i.jj);
    }
    /**
     * Gets or sets text to display above the plot area.
    *
    * Use the `chartTitle` property to display the text above the plot area.
    *
    * ```ts
    *  this.chart.title= "This is a Title";
    * ```
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	dataSource={this.categoryData}
    * 	title= "CategoryChart Subtitle"	/>
    * ```
    */
    get chartTitle() {
        return this.i.gm;
    }
    set chartTitle(v) {
        this.i.gm = v;
    }
    /**
     * Gets or sets text to display below the Title, above the plot area.
    *
    * Use the `subtitle` property to display the text below  and above the plot area.
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	dataSource={this.categoryData}
    * 	subtitle= "CategoryChart Subtitle"/>
    * ```
    *
    * ```ts
    *  this.chart.subtitle ="CategoryChart Subtitle" ;
    * ```
    */
    get subtitle() {
        return this.i.gb;
    }
    set subtitle(v) {
        this.i.gb = v;
    }
    /**
     * Gets or sets horizontal alignment which determines the title position, relative to the left and right edges of the control.
    *
    * Use the `titleAlignment` property for the horizontal alignment of the title.
    *
    * ```ts
    * this.chart.titleAlignment = HorizontalAlignment.Center;
    * ```
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	dataSource={this.categoryData}
    * 	titleAlignment= "Center"/>
    * ```
    */
    get titleAlignment() {
        return this.i.i8;
    }
    set titleAlignment(v) {
        this.i.i8 = ensureEnum(HorizontalAlignment_$type, v);
    }
    /**
     * Gets or sets horizontal alignment which determines the subtitle position, relative to the left and right edges of the control.
    *
    * Use the `subtitleAlignment` property to Gets or sets horizontal alignment.
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	dataSource={this.categoryData}
    * 	subtitle= "CategoryChart Subtitle"
    * 	subtitleAlignment="Right"/>
    * ```
    *
    * ```ts
    * this.chart.subtitleAlignment = HorizontalAlignment.Right;
    * ```
    */
    get subtitleAlignment() {
        return this.i.i7;
    }
    set subtitleAlignment(v) {
        this.i.i7 = ensureEnum(HorizontalAlignment_$type, v);
    }
    /**
     * Gets or sets the behavior that determines how unknown values will be plotted on the chart.
     * Null and Double.NaN are two examples of unknown values.
    *
    * Use the `unknownValuePlotting` property to determines the behavior that how unknown values will be plotted on the chart.
    *
    * ```ts
    * this.chart.unknownValuePlotting =UnknownValuePlotting.DontPlot;
    * ```
    *
    * ```ts
    * <IgrCategoryChart dataSource={this.state.data}
    *                unknownValuePlotting= "dontPlot" />
    * ```
    */
    get unknownValuePlotting() {
        return this.i.bb;
    }
    set unknownValuePlotting(v) {
        this.i.bb = ensureEnum(UnknownValuePlotting_$type, v);
    }
    /**
     * Gets or sets the rendering resolution for all series in this chart.
     * Where n = Resolution, for every n horizontal pixels, combine all items into a single data point.  When Resolution = 0, all data points will be rendered as graphical objects.  Charts with a higher resolution will have faster performance.
    *
    * Use the `resolution` property if the callouts should be display.
    *
    * ```ts
    *   this.chart.resolution = 2 ;
    * ```
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	markerTypes={this.state.markersTypes}
    * 	dataSource={this.categoryData}
    * 	calloutsVisible="true"
    * 	resolution= {2}/>
    * ```
    */
    get resolution() {
        return this.i.dp;
    }
    set resolution(v) {
        this.i.dp = +v;
    }
    /**
     * Gets or sets the thickness for all series in this chart. Depending on the ChartType, this can be the main brush used, or just the outline.
    *
    * Use the `thickness` property for the thickness of all the series in this chart.
    */
    get thickness() {
        return this.i.dv;
    }
    set thickness(v) {
        this.i.dv = +v;
    }
    /**
     * Gets or sets the OutlineMode for all series in this chart.
    */
    get outlineMode() {
        return this.i.a5;
    }
    set outlineMode(v) {
        this.i.a5 = ensureEnum(SeriesOutlineMode_$type, v);
    }
    /**
     * Gets or sets the MarkerOutlineMode for all series in this chart.
    */
    get markerOutlineMode() {
        return this.i.ao;
    }
    set markerOutlineMode(v) {
        this.i.ao = ensureEnum(MarkerOutlineMode_$type, v);
    }
    /**
     * Gets or sets the MarkerFillMode for all series in this chart.
    */
    get markerFillMode() {
        return this.i.am;
    }
    set markerFillMode(v) {
        this.i.am = ensureEnum(MarkerFillMode_$type, v);
    }
    /**
     * Gets or sets the MarkerFillOpacity for all series in this chart.
    */
    get markerFillOpacity() {
        return this.i.di;
    }
    set markerFillOpacity(v) {
        this.i.di = +v;
    }
    /**
     * Gets or sets the marker shapes used for indicating location of data points in this chart.
     * This property applies only to these chart types: point, line, spline, bubble, and polygon
    */
    get markerTypes() {
        if (this._markerTypes === null) {
            let coll = new IgrMarkerTypeCollection();
            let innerColl = this.i.as;
            if (!innerColl) {
                innerColl = new MarkerTypeCollection_internal();
            }
            this._markerTypes = coll._fromInner(innerColl);
            this.i.as = innerColl;
        }
        return this._markerTypes;
    }
    set markerTypes(v) {
        if (this._markerTypes !== null) {
            this._markerTypes._setSyncTarget(null);
            this._markerTypes = null;
        }
        let coll = new IgrMarkerTypeCollection();
        this._markerTypes = coll._fromOuter(v);
        let syncColl = new SyncableObservableCollection$1(MarkerType_$type);
        let innerColl = this.i.as;
        if (!innerColl) {
            innerColl = new MarkerTypeCollection_internal();
        }
        syncColl._inner = innerColl;
        syncColl.clear();
        this._markerTypes._setSyncTarget(syncColl);
        this.i.as = innerColl;
    }
    /**
     * Gets or sets the palette of brushes used for rendering fill area of data point markers.
     * This property applies only to these chart types: point, line, spline, bubble, and polygon
    *
    * `markerBrushes` property used for rendering fill area of data point markers.
    *
    * ```ts
    *  this.chart.markerBrushes=[ "#ff0000", "#ffff00", "#00ffff" ];
    * ```
    *
    * ```ts
    * <IgrCategoryChart
    *     chartType="Line"
    *     markerBrushes ="#ffff00"
    *     dataSource={this.categoryData}/>
    * ```
    */
    get markerBrushes() {
        return fromBrushCollection(this.i.l);
    }
    set markerBrushes(v) {
        this.i.l = toBrushCollection(v);
    }
    /**
     * Gets or sets the palette of brushes used for rendering outlines of data point markers.
     * This property applies only to these chart types: point, line, spline, bubble, and polygon
    *
    * `markerOutlines` property used for rendering outlines of data point markers.
    *
    * ```ts
    * this.chart.markerOutlines= ["#ff0000", "#ffff00", "#00ffff"] ;
    * ```
    *
    * ```ts
    * <IgrCategoryChart
    * 	chartType="Line"
    * 	markerOutlines= "#ff0000"
    * 	dataSource={this.categoryData}/>
    * ```
    */
    get markerOutlines() {
        return fromBrushCollection(this.i.m);
    }
    set markerOutlines(v) {
        this.i.m = toBrushCollection(v);
    }
    /**
     * Gets or sets the maximum number of markers displyed in the plot area of the chart.
    *
    * `markerMaxCount` property used to display maximum number of markers in the plot area of the chart.
    *
    * ```ts
    *  this.chart.markerMaxCount = 100 ;
    * ```
    *
    * ```ts
    * <IgrCategoryChart
    * 	chartType="Line"
    * 	markerMaxCount= {2}
    * 	dataSource={this.categoryData}/>
    * ```
    */
    get markerMaxCount() {
        return this.i.d8;
    }
    set markerMaxCount(v) {
        this.i.d8 = +v;
    }
    /**
     * Gets or sets whether the series animations should be allowed when a range change has been detected on an axis.
    */
    get animateSeriesWhenAxisRangeChanges() {
        return this.i.bv;
    }
    set animateSeriesWhenAxisRangeChanges(v) {
        this.i.bv = ensureBool(v);
    }
    /**
     * Gets or sets the palette of brushes to used for coloring trend lines in this chart.
     * The value provided should be an array of CSS color strings or JavaScript objects defining gradients. Optionally the first element can be a string reading "RGB" or "HSV" to specify the interpolation mode of the collection
    *
    * Use the `trendLineBrushes` property for coloring trend lines in the chart.
    *
    * ```ts
    * this.chart.trendLineBrushes=["#ff0000", "#ffff00", "#00ffff"]	;
    * ```
    *
    * ```ts
    * <IgrCategoryChart dataSource={this.state.data}
    *                trendLineBrushes="#ffff00" />
    * ```
    */
    get trendLineBrushes() {
        return fromBrushCollection(this.i.o);
    }
    set trendLineBrushes(v) {
        this.i.o = toBrushCollection(v);
    }
    /**
     * Gets or sets the formula used for calculating trend lines in this chart.
     * This property applies only to these chart types: point, line, spline, and bubble
    *
    * Use the `trendLineType` property for calculating trend lines.
    *
    * ```ts
    * this.chart.trendLineType = TrendLineType.CubicFit;
    * ```
    *
    * ```ts
    * <IgrCategoryChart dataSource={this.state.data}
    *                trendLineType="CubicFit" />
    * ```
    */
    get trendLineType() {
        return this.i.a9;
    }
    set trendLineType(v) {
        this.i.a9 = ensureEnum(TrendLineType_$type, v);
    }
    /**
     * Gets or sets the thickness of the trend lines in this chart.
     * This property applies only to these chart types: point, line, spline, and bubble
    *
    * Use the `trendLineThickness` property for the thickness of the trend lines in the chart.
    *
    * ```ts
    * this.chart.trendLineThickness=2;
    * ```
    *
    * ```ts
    * <IgrCategoryChart dataSource={this.state.data}
    *                trendLineThickness={2} />
    * ```
    */
    get trendLineThickness() {
        return this.i.d1;
    }
    set trendLineThickness(v) {
        this.i.d1 = +v;
    }
    /**
     * Gets or sets a value indicating whether grid and tick lines are aligned to device pixels.
    *
    * Use `alignsGridLinesToPixels` propert to indicat whether grid and tick lines are aligned to device pixels.
    *
    * ```ts
    *  this.chart.alignsGridLinesToPixels= true;
    * ```
    */
    get alignsGridLinesToPixels() {
        return this.i.bu;
    }
    set alignsGridLinesToPixels(v) {
        this.i.bu = ensureBool(v);
    }
    /**
     * Margin applied to the Left of the plot area.
    */
    get plotAreaMarginLeft() {
        return this.i.dl;
    }
    set plotAreaMarginLeft(v) {
        this.i.dl = +v;
    }
    /**
     * Margin applied to the Top of the plot area.
    */
    get plotAreaMarginTop() {
        return this.i.dn;
    }
    set plotAreaMarginTop(v) {
        this.i.dn = +v;
    }
    /**
     * Margin applied to the right of the plot area.
    */
    get plotAreaMarginRight() {
        return this.i.dm;
    }
    set plotAreaMarginRight(v) {
        this.i.dm = +v;
    }
    /**
     * Margin applied below the plot area.
    */
    get plotAreaMarginBottom() {
        return this.i.dk;
    }
    set plotAreaMarginBottom(v) {
        this.i.dk = +v;
    }
    /**
     * Gets or sets the highlighting mode to use for the series in the component, when supported. This takes precedence over the series level IsHightlightingEnabled.
    */
    get computedPlotAreaMarginMode() {
        return this.i.t;
    }
    set computedPlotAreaMarginMode(v) {
        this.i.t = ensureEnum(ComputedPlotAreaMarginMode_$type, v);
    }
    /**
     * Gets or sets the highlighting mode to use for the series in the component, when supported. This takes precedence over the series level IsHightlightingEnabled.
    */
    get highlightingMode() {
        return this.i.a3;
    }
    set highlightingMode(v) {
        this.i.a3 = ensureEnum(SeriesHighlightingMode_$type, v);
    }
    /**
     * Gets or sets the highlighting Behavior to use for the series in the component, when supported. This takes precedence over the series level IsHightlightingEnabled.
    */
    get highlightingBehavior() {
        return this.i.a1;
    }
    set highlightingBehavior(v) {
        this.i.a1 = ensureEnum(SeriesHighlightingBehavior_$type, v);
    }
    /**
     * Gets or sets the highlighting mode to use for the legend linked to the component, when supported.
    */
    get legendHighlightingMode() {
        return this.i.ak;
    }
    set legendHighlightingMode(v) {
        this.i.ak = ensureEnum(LegendHighlightingMode_$type, v);
    }
    /**
     * Gets or sets a whether the series viewer should auto expand margins to accomodate the initial horizontal axis labels.
    */
    get shouldAutoExpandMarginForInitialLabels() {
        return this.i.cd;
    }
    set shouldAutoExpandMarginForInitialLabels(v) {
        this.i.cd = ensureBool(v);
    }
    /**
     * Gets or sets the extra amount the series viewer should auto expand margins to accommodate the initial horizontal axis labels.
    */
    get autoExpandMarginExtraPadding() {
        return this.i.de;
    }
    set autoExpandMarginExtraPadding(v) {
        this.i.de = +v;
    }
    /**
     * Gets or sets the maximum amount the series viewer should auto expand margins to accommodate the initial horizontal axis labels.
    */
    get autoExpandMarginMaximumValue() {
        return this.i.df;
    }
    set autoExpandMarginMaximumValue(v) {
        this.i.df = +v;
    }
    get trendLinePeriod() {
        return this.i.ea;
    }
    set trendLinePeriod(v) {
        this.i.ea = +v;
    }
    /**
     * Gets or sets the style of tooltip to be displayed.
    */
    get toolTipType() {
        return this.i.a7;
    }
    set toolTipType(v) {
        this.i.a7 = ensureEnum(ToolTipType_$type, v);
    }
    /**
     * Gets or sets the crosshairs to be displayed.
    */
    get crosshairsDisplayMode() {
        return this.i.v;
    }
    set crosshairsDisplayMode(v) {
        this.i.v = ensureEnum(CrosshairsDisplayMode_$type, v);
    }
    /**
     * Gets or sets whether crosshairs will snap to the nearest data point.
    */
    get crosshairsSnapToData() {
        return this.i.b0;
    }
    set crosshairsSnapToData(v) {
        this.i.b0 = ensureBool(v);
    }
    /**
     * Gets or sets whether annotations are shown along the axis for crosshair values
    */
    get crosshairsAnnotationEnabled() {
        return this.i.bz;
    }
    set crosshairsAnnotationEnabled(v) {
        this.i.bz = ensureBool(v);
    }
    /**
     * Gets or sets whether annotations for the final value of each series is displayed on the axis.
    */
    get finalValueAnnotationsVisible() {
        return this.i.b1;
    }
    set finalValueAnnotationsVisible(v) {
        this.i.b1 = ensureBool(v);
    }
    /**
     * Gets or sets if callouts should be displayed.
    */
    get calloutsVisible() {
        return this.i.by;
    }
    set calloutsVisible(v) {
        this.i.by = ensureBool(v);
    }
    /**
     * Gets or sets if event annotations should be displayed.
    */
    get calloutStyleUpdatingEventEnabled() {
        return this.i.bx;
    }
    set calloutStyleUpdatingEventEnabled(v) {
        this.i.bx = ensureBool(v);
    }
    /**
     * Gets or sets the member path of the X data for the callouts.
    */
    get calloutsXMemberPath() {
        return this.i.e6;
    }
    set calloutsXMemberPath(v) {
        this.i.e6 = v;
    }
    /**
     * Gets or sets the member path of the Y data for the callouts.
    */
    get calloutsYMemberPath() {
        return this.i.e8;
    }
    set calloutsYMemberPath(v) {
        this.i.e8 = v;
    }
    /**
     * Gets or sets the member path of the label data for the callouts.
    */
    get calloutsLabelMemberPath() {
        return this.i.e2;
    }
    set calloutsLabelMemberPath(v) {
        this.i.e2 = v;
    }
    /**
     * Gets or sets the member path of the content data for the callouts.
    */
    get calloutsContentMemberPath() {
        return this.i.ez;
    }
    set calloutsContentMemberPath(v) {
        this.i.ez = v;
    }
    findByName(name) {
        if (this.legend && this.legend.name && this.legend.name == name) {
            return this.legend;
        }
        if (this.markerTypes != null && this.markerTypes.findByName && this.markerTypes.findByName(name)) {
            return this.markerTypes.findByName(name);
        }
        return null;
    }
    get hasUserValues() {
        return this._hasUserValues;
    }
    __m(propertyName) {
        if (!this._inStyling) {
            this._hasUserValues.add(propertyName);
        }
    }
    _styling(container, component, parent) {
        if (this._inStyling) {
            return;
        }
        this._inStyling = true;
        this._stylingContainer = container;
        this._stylingParent = component;
        let genericPrefix = "";
        let typeName = this.i.$type.name;
        if (typeName.indexOf("Xam") === 0) {
            typeName = typeName.substring(3);
        }
        genericPrefix = toSpinal("DomainChart");
        let additionalPrefixes = [];
        let prefix = toSpinal(typeName);
        additionalPrefixes.push(prefix + "-");
        let b = this.i.$type.baseType;
        while (b && b.name != "Object" &&
            b.name != "Base" &&
            b.name != "Control" &&
            b.Name != "DependencyObject" &&
            b.Name != "FrameworkElement") {
            typeName = b.name;
            if (typeName.indexOf("Xam") === 0) {
                typeName = typeName.substring(3);
            }
            let basePrefix = toSpinal(typeName);
            additionalPrefixes.push(basePrefix + "-");
            b = b.baseType;
        }
        if (parent) {
            let parentTypeName = parent.i.$type.name;
            if (parentTypeName.indexOf("Xam") === 0) {
                parentTypeName = parentTypeName.substring(3);
            }
            let parentPrefix = toSpinal(parentTypeName);
            additionalPrefixes.push(parentPrefix + "-" + genericPrefix + "-");
            additionalPrefixes.push(parentPrefix + "-" + prefix + "-");
        }
        initializePropertiesFromCss(container, this, genericPrefix + "-", this.hasUserValues, false, additionalPrefixes);
        if (this._otherStyling) {
            this._otherStyling(container, component, parent);
        }
        this._inStyling = false;
    }
    /**
 * Provides a container for this control

*
* `provideContainer` method provide container for the control.
*
* ```ts
*     this.chart.provideContainer("Container");
* ```
*/
    provideContainer(container) {
        this.i.provideContainer(container);
    }
    /**
     * Destroy this control
    
    *
    * Use the `destroy` property to destroy the chart.
    *
    * ```ts
    * this.chart.destroy();
    * ```
    */
    destroy() {
        this.i.destroy();
    }
    /**
     * Called when the control has been resized.
    
    *
    * `notifyResized` method Called when the control has been resized.
    *
    * ```ts
    * this.chart.notifyResized();
    * ```
    */
    notifyResized() {
        this.i.notifyResized();
    }
    notifyVisualPropertiesChanged() {
        this.i.h4();
    }
    /**
     * Forces any pending refresh to the chart to be finished.
    
    *
    * Method `flush` used to Forces any pending deferred work to render on the chart before continuing.
    *
    * ```ts
    * this.chart.flush();
    * ```
    */
    flush() {
        this.i.hg();
    }
    /**
     * Hides the active main tooltip, if displayed.
    
    *
    * Use the `hideToolTip` method to hide the active tooltip.
    *
    * ```ts
    * this.chart.hideToolTip();
    * ```
    */
    hideToolTip() {
        this.i.hj();
    }
    notifySetItem(source_, index, oldItem, newItem) {
        this.i.h3(source_, index, oldItem, newItem);
    }
    /**
     * Used to manually notify the chart that the data source has reset or cleared its items.
    
    *
    * Use `notifyClearItems` method to notifies the chart that the items have been cleared from an associated data source.
    *
    * ```ts
    * this.chart.notifyClearItems(this.data);
    * ```
    */
    notifyClearItems(source_) {
        this.i.hz(source_);
    }
    notifyInsertItem(source_, index, newItem) {
        this.i.h0(source_, index, newItem);
    }
    notifyRemoveItem(source_, index, oldItem) {
        this.i.h1(source_, index, oldItem);
    }
    /**
     * Event raised when a series is initialized and added to this chart.
    *
    * `SeriesAdded` event raised when a series is initialized and added to this chart.
    *
    * ````ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	markerTypes={this.state.markersTypes}
    * 	dataSource={this.categoryData}
    * 	seriesAdded={this.CategoryChart_SeriesAdded}/>
    * ``
    *
    * ```ts
    * CategoryChart_SeriesAdded(sender:any ,aregs:ChartSeriesEventArgs)
    * {
    * }
    * ````
    */
    get seriesAdded() {
        return this._seriesAdded;
    }
    set seriesAdded(ev) {
        if (this._seriesAdded_wrapped !== null) {
            this.i.seriesAdded = delegateRemove(this.i.seriesAdded, this._seriesAdded_wrapped);
            this._seriesAdded_wrapped = null;
            this._seriesAdded = null;
        }
        this._seriesAdded = ev;
        this._seriesAdded_wrapped = (o, e) => {
            let outerArgs = new IgrChartSeriesEventArgs();
            outerArgs._provideImplementation(e);
            if (this.beforeSeriesAdded) {
                this.beforeSeriesAdded(this, outerArgs);
            }
            if (this._seriesAdded) {
                this._seriesAdded(this, outerArgs);
            }
        };
        this.i.seriesAdded = delegateCombine(this.i.seriesAdded, this._seriesAdded_wrapped);
    }
    /**
     * Event raised when a series is removed from this chart.
    *
    * `SeriesRemoved` event raised when a series is removed from this chart.
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	markerTypes={this.state.markersTypes}
    * 	dataSource={this.categoryData}
    * 	seriesRemoved={this.CategoryChart_seriesRemoved}/>
    * ```
    *
    * ```ts
    *  CategoryChart_seriesRemoved(sender: any , aregs: ChartSeriesEventArgs)
    *   {
    *
    *   }
    * ```
    */
    get seriesRemoved() {
        return this._seriesRemoved;
    }
    set seriesRemoved(ev) {
        if (this._seriesRemoved_wrapped !== null) {
            this.i.seriesRemoved = delegateRemove(this.i.seriesRemoved, this._seriesRemoved_wrapped);
            this._seriesRemoved_wrapped = null;
            this._seriesRemoved = null;
        }
        this._seriesRemoved = ev;
        this._seriesRemoved_wrapped = (o, e) => {
            let outerArgs = new IgrChartSeriesEventArgs();
            outerArgs._provideImplementation(e);
            if (this.beforeSeriesRemoved) {
                this.beforeSeriesRemoved(this, outerArgs);
            }
            if (this._seriesRemoved) {
                this._seriesRemoved(this, outerArgs);
            }
        };
        this.i.seriesRemoved = delegateCombine(this.i.seriesRemoved, this._seriesRemoved_wrapped);
    }
    /**
     * Occurs when the pointer enters a Series.
    *
    * `SeriesPointerEnter` event raised when the pointer enters a Series.
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	markerTypes={this.state.markersTypes}
    * 	dataSource={this.categoryData}
    * 	seriesPointerEnter={this.CategoryChart_seriesPointerDown}/>
    * ```
    *
    * ```ts
    * CategoryChart_seriesPointerEnter(sender: any , aregs: ChartSeriesEventArgs)
    *   {
    *
    *   }
    * ```
    */
    get seriesPointerEnter() {
        return this._seriesPointerEnter;
    }
    set seriesPointerEnter(ev) {
        if (this._seriesPointerEnter_wrapped !== null) {
            this.i.seriesPointerEnter = delegateRemove(this.i.seriesPointerEnter, this._seriesPointerEnter_wrapped);
            this._seriesPointerEnter_wrapped = null;
            this._seriesPointerEnter = null;
        }
        this._seriesPointerEnter = ev;
        this._seriesPointerEnter_wrapped = (o, e) => {
            let outerArgs = new IgrDomainChartSeriesPointerEventArgs();
            outerArgs._provideImplementation(e);
            if (this.beforeSeriesPointerEnter) {
                this.beforeSeriesPointerEnter(this, outerArgs);
            }
            if (this._seriesPointerEnter) {
                this._seriesPointerEnter(this, outerArgs);
            }
        };
        this.i.seriesPointerEnter = delegateCombine(this.i.seriesPointerEnter, this._seriesPointerEnter_wrapped);
    }
    /**
     * Occurs when the pointer leaves a Series.
    *
    * `SeriesPointerLeave` event raised when the pointer leaves a Series.
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	markerTypes={this.state.markersTypes}
    * 	dataSource={this.categoryData}
    * 	seriesPointerLeave={this.CategoryChart_seriesPointerLeave}/>
    * ```
    *
    * ```ts
    * CategoryChart_seriesPointerLeave(sender: any , aregs: ChartSeriesEventArgs)
    *   {
    *
    *   }
    * ```
    */
    get seriesPointerLeave() {
        return this._seriesPointerLeave;
    }
    set seriesPointerLeave(ev) {
        if (this._seriesPointerLeave_wrapped !== null) {
            this.i.seriesPointerLeave = delegateRemove(this.i.seriesPointerLeave, this._seriesPointerLeave_wrapped);
            this._seriesPointerLeave_wrapped = null;
            this._seriesPointerLeave = null;
        }
        this._seriesPointerLeave = ev;
        this._seriesPointerLeave_wrapped = (o, e) => {
            let outerArgs = new IgrDomainChartSeriesPointerEventArgs();
            outerArgs._provideImplementation(e);
            if (this.beforeSeriesPointerLeave) {
                this.beforeSeriesPointerLeave(this, outerArgs);
            }
            if (this._seriesPointerLeave) {
                this._seriesPointerLeave(this, outerArgs);
            }
        };
        this.i.seriesPointerLeave = delegateCombine(this.i.seriesPointerLeave, this._seriesPointerLeave_wrapped);
    }
    /**
     * Occurs when the pointer moves over a Series.
    *
    * `SeriesPointerMove` event raised when the pointer moves over a Series.
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	markerTypes={this.state.markersTypes}
    * 	dataSource={this.categoryData}
    * 	seriesPointerMove={this.CategoryChart_seriesPointerMove}/>
    * ```
    *
    * ```ts
    *  CategoryChart_seriesPointerMove(sender: any , aregs: ChartSeriesEventArgs)
    *   {
    *
    *   }
    * ```
    */
    get seriesPointerMove() {
        return this._seriesPointerMove;
    }
    set seriesPointerMove(ev) {
        if (this._seriesPointerMove_wrapped !== null) {
            this.i.seriesPointerMove = delegateRemove(this.i.seriesPointerMove, this._seriesPointerMove_wrapped);
            this._seriesPointerMove_wrapped = null;
            this._seriesPointerMove = null;
        }
        this._seriesPointerMove = ev;
        this._seriesPointerMove_wrapped = (o, e) => {
            let outerArgs = new IgrDomainChartSeriesPointerEventArgs();
            outerArgs._provideImplementation(e);
            if (this.beforeSeriesPointerMove) {
                this.beforeSeriesPointerMove(this, outerArgs);
            }
            if (this._seriesPointerMove) {
                this._seriesPointerMove(this, outerArgs);
            }
        };
        this.i.seriesPointerMove = delegateCombine(this.i.seriesPointerMove, this._seriesPointerMove_wrapped);
    }
    /**
     * Occurs when the pointer is pressed down over a Series.
    *
    * `SeriesPointerDown` event raised when the pointer is pressed down over a Series
    *
    * ````ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	markerTypes={this.state.markersTypes}
    * 	dataSource={this.categoryData}
    * 	seriesPointerDown={this.CategoryChart_seriesPointerDown}/>
    * ``
    *
    * ```ts
    * CategoryChart_seriesPointerDown(sender: any , aregs: ChartSeriesEventArgs)
    *   {
    *
    *   }
    * ````
    */
    get seriesPointerDown() {
        return this._seriesPointerDown;
    }
    set seriesPointerDown(ev) {
        if (this._seriesPointerDown_wrapped !== null) {
            this.i.seriesPointerDown = delegateRemove(this.i.seriesPointerDown, this._seriesPointerDown_wrapped);
            this._seriesPointerDown_wrapped = null;
            this._seriesPointerDown = null;
        }
        this._seriesPointerDown = ev;
        this._seriesPointerDown_wrapped = (o, e) => {
            let outerArgs = new IgrDomainChartSeriesPointerEventArgs();
            outerArgs._provideImplementation(e);
            if (this.beforeSeriesPointerDown) {
                this.beforeSeriesPointerDown(this, outerArgs);
            }
            if (this._seriesPointerDown) {
                this._seriesPointerDown(this, outerArgs);
            }
        };
        this.i.seriesPointerDown = delegateCombine(this.i.seriesPointerDown, this._seriesPointerDown_wrapped);
    }
    /**
     * Occurs when the pointer is released over a Series.
    *
    * `SeriesPointerUp` event raised when the pointer is released over a Series.
    *
    * ```ts
    *  <IgrCategoryChart
    * 	width="100%"
    * 	height="100%"
    * 	chartType="Line"
    * 	markerTypes={this.state.markersTypes}
    * 	dataSource={this.categoryData}
    * 	seriesPointerUp={this.CategoryChart_seriesPointerUp}/>
    * ```
    *
    * ```ts
    *  CategoryChart_seriesPointerUp(sender: any , aregs: ChartSeriesEventArgs)
    *   {
    *
    *   }
    * ```
    */
    get seriesPointerUp() {
        return this._seriesPointerUp;
    }
    set seriesPointerUp(ev) {
        if (this._seriesPointerUp_wrapped !== null) {
            this.i.seriesPointerUp = delegateRemove(this.i.seriesPointerUp, this._seriesPointerUp_wrapped);
            this._seriesPointerUp_wrapped = null;
            this._seriesPointerUp = null;
        }
        this._seriesPointerUp = ev;
        this._seriesPointerUp_wrapped = (o, e) => {
            let outerArgs = new IgrDomainChartSeriesPointerEventArgs();
            outerArgs._provideImplementation(e);
            if (this.beforeSeriesPointerUp) {
                this.beforeSeriesPointerUp(this, outerArgs);
            }
            if (this._seriesPointerUp) {
                this._seriesPointerUp(this, outerArgs);
            }
        };
        this.i.seriesPointerUp = delegateCombine(this.i.seriesPointerUp, this._seriesPointerUp_wrapped);
    }
    /**
     * Occurs when the style of a callout is updated.
    */
    get calloutStyleUpdating() {
        return this._calloutStyleUpdating;
    }
    set calloutStyleUpdating(ev) {
        if (this._calloutStyleUpdating_wrapped !== null) {
            this.i.calloutStyleUpdating = delegateRemove(this.i.calloutStyleUpdating, this._calloutStyleUpdating_wrapped);
            this._calloutStyleUpdating_wrapped = null;
            this._calloutStyleUpdating = null;
        }
        this._calloutStyleUpdating = ev;
        this._calloutStyleUpdating_wrapped = (o, e) => {
            let outerArgs = new IgrCalloutStyleUpdatingEventArgs();
            outerArgs._provideImplementation(e);
            if (this.beforeCalloutStyleUpdating) {
                this.beforeCalloutStyleUpdating(this, outerArgs);
            }
            if (this._calloutStyleUpdating) {
                this._calloutStyleUpdating(this, outerArgs);
            }
        };
        this.i.calloutStyleUpdating = delegateCombine(this.i.calloutStyleUpdating, this._calloutStyleUpdating_wrapped);
    }
}
//# sourceMappingURL=igr-domain-chart.js.map
