import * as tslib_1 from "tslib";
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';
var IgrDomainChart = /** @class */ /*@__PURE__*/ (function (_super) {
    tslib_1.__extends(IgrDomainChart, _super);
    function IgrDomainChart(props) {
        var _this = _super.call(this, props) || this;
        _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();
        return _this;
    }
    IgrDomainChart.prototype.createImplementation = function () {
        return null;
    };
    Object.defineProperty(IgrDomainChart.prototype, "i", {
        get: function () {
            return this._implementation;
        },
        enumerable: true,
        configurable: true
    });
    IgrDomainChart.prototype.onImplementationCreated = function () {
    };
    IgrDomainChart.prototype.componentDidMount = function () {
        var e_1, _a;
        try {
            for (var _b = tslib_1.__values(Object.keys(this.props)), _c = _b.next(); !_c.done; _c = _b.next()) {
                var p = _c.value;
                if (isValidProp(this, p)) {
                    this[p] = this.props[p];
                }
            }
        }
        catch (e_1_1) {
            e_1 = { error: e_1_1 };
        }
        finally {
            try {
                if (_c && !_c.done && (_a = _b.return))
                    _a.call(_b);
            }
            finally {
                if (e_1)
                    throw e_1.error;
            }
        }
    };
    IgrDomainChart.prototype.shouldComponentUpdate = function (nextProps, nextState) {
        var e_2, _a;
        var mod = getModifiedProps(this.props, nextProps);
        try {
            for (var _b = tslib_1.__values(Object.keys(mod)), _c = _b.next(); !_c.done; _c = _b.next()) {
                var p = _c.value;
                if (isValidProp(this, p)) {
                    this[p] = mod[p];
                }
            }
        }
        catch (e_2_1) {
            e_2 = { error: e_2_1 };
        }
        finally {
            try {
                if (_c && !_c.done && (_a = _b.return))
                    _a.call(_b);
            }
            finally {
                if (e_2)
                    throw e_2.error;
            }
        }
        return true;
    };
    IgrDomainChart.prototype.render = function () {
        return null;
    };
    Object.defineProperty(IgrDomainChart.prototype, "tooltipTemplate", {
        /**
        * Sets or gets the template reference to use for tooltips for all the series.
        *
        *
        */
        get: function () {
            return this.i.tooltipTemplate;
        },
        set: function (v) {
            this.i.tooltipTemplate = v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "tooltipTemplates", {
        /**
        * Sets or gets the template references to use for tooltips for all the series, in order.
        *
        *
        */
        get: function () {
            var ret = [];
            if (this.i.tooltipTemplates) {
                for (var ii = 0; ii < this.i.tooltipTemplates.count; ii++) {
                    ret.push(this.i.tooltipTemplates.item(ii));
                }
            }
            return ret;
        },
        set: function (v) {
            this.i.tooltipTemplates.clear();
            if (v) {
                for (var ii = 0; ii < v.length; ii++) {
                    this.i.tooltipTemplates.add(v[ii]);
                }
            }
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "legend", {
        get: function () {
            if (this.i.legend != null)
                return this.i.legend.externalObject;
        },
        set: function (v) {
            if (v != undefined && v != null)
                this.i.legend = v.i;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "calloutsDataSource", {
        get: function () {
            return this._calloutsDataSource;
        },
        set: function (value) {
            this._calloutsDataSource = value;
            this.bindCalloutsData();
        },
        enumerable: true,
        configurable: true
    });
    IgrDomainChart.prototype.bindCalloutsData = function () {
        if (this.i != null && this.i !== undefined) {
            this.i.calloutsItemsSource = this._calloutsDataSource;
        }
    };
    Object.defineProperty(IgrDomainChart.prototype, "pixelScalingRatio", {
        /**
     * 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: function () {
            return this.i.dj;
        },
        set: function (v) {
            this.i.dj = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "titleLeftMargin", {
        /**
         * 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: function () {
            return this.i.dx;
        },
        set: function (v) {
            this.i.dx = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "titleRightMargin", {
        /**
         * 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: function () {
            return this.i.dy;
        },
        set: function (v) {
            this.i.dy = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "titleTopMargin", {
        /**
         * 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: function () {
            return this.i.dz;
        },
        set: function (v) {
            this.i.dz = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "titleBottomMargin", {
        /**
         * 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: function () {
            return this.i.dw;
        },
        set: function (v) {
            this.i.dw = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "subtitleLeftMargin", {
        /**
         * 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: function () {
            return this.i.ds;
        },
        set: function (v) {
            this.i.ds = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "subtitleTopMargin", {
        /**
         * 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: function () {
            return this.i.du;
        },
        set: function (v) {
            this.i.du = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "subtitleRightMargin", {
        /**
         * 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: function () {
            return this.i.dt;
        },
        set: function (v) {
            this.i.dt = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "subtitleBottomMargin", {
        /**
         * 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: function () {
            return this.i.dr;
        },
        set: function (v) {
            this.i.dr = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "subtitleTextColor", {
        /**
         * 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: function () {
            return brushToString(this.i.jf);
        },
        set: function (v) {
            this.i.jf = stringToBrush(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "titleTextColor", {
        /**
         * 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: function () {
            return brushToString(this.i.jg);
        },
        set: function (v) {
            this.i.jg = stringToBrush(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "leftMargin", {
        /**
         * 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: function () {
            return this.i.dh;
        },
        set: function (v) {
            this.i.dh = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "topMargin", {
        /**
         * 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: function () {
            return this.i.d0;
        },
        set: function (v) {
            this.i.d0 = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "rightMargin", {
        /**
         * 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: function () {
            return this.i.dq;
        },
        set: function (v) {
            this.i.dq = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "bottomMargin", {
        /**
         * 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: function () {
            return this.i.dg;
        },
        set: function (v) {
            this.i.dg = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "transitionDuration", {
        /**
         * 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: function () {
            return this.i.d9;
        },
        set: function (v) {
            this.i.d9 = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "transitionEasingFunction", {
        /**
         * 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: function () {
            return this.i.bf;
        },
        set: function (v) {
            this.i.bf = v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "subtitleTextStyle", {
        /**
         * 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: function () {
            return this.i.gi;
        },
        set: function (v) {
            this.i.gi = v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "titleTextStyle", {
        /**
         * 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: function () {
            return this.i.gt;
        },
        set: function (v) {
            this.i.gt = v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "includedProperties", {
        /**
         * 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: function () {
            return this.i.d;
        },
        set: function (v) {
            this.i.d = v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "excludedProperties", {
        /**
         * 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: function () {
            return this.i.c;
        },
        set: function (v) {
            this.i.c = v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "brushes", {
        /**
         * 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: function () {
            return fromBrushCollection(this.i.j);
        },
        set: function (v) {
            this.i.j = toBrushCollection(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "outlines", {
        /**
         * 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: function () {
            return fromBrushCollection(this.i.n);
        },
        set: function (v) {
            this.i.n = toBrushCollection(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "isHorizontalZoomEnabled", {
        /**
         * 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: function () {
            return this.i.b5;
        },
        set: function (v) {
            this.i.b5 = ensureBool(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "isVerticalZoomEnabled", {
        /**
         * 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: function () {
            return this.i.cb;
        },
        set: function (v) {
            this.i.cb = ensureBool(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "isSeriesHighlightingEnabled", {
        /**
         * Gets or sets whether the chart can highlight series through user interactions.
         * This property applies to Category Chart and Financial Chart controls.
        */
        get: function () {
            return this.i.b7;
        },
        set: function (v) {
            this.i.b7 = ensureBool(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "windowRect", {
        /**
         * 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: function () {
            return fromRect(this.i.jk);
        },
        set: function (v) {
            this.i.jk = toRect(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "viewport", {
        /**
         * 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: function () {
            return fromRect(this.i.jj);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "chartTitle", {
        /**
         * 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: function () {
            return this.i.gm;
        },
        set: function (v) {
            this.i.gm = v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "subtitle", {
        /**
         * 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: function () {
            return this.i.gb;
        },
        set: function (v) {
            this.i.gb = v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "titleAlignment", {
        /**
         * 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: function () {
            return this.i.i8;
        },
        set: function (v) {
            this.i.i8 = ensureEnum(HorizontalAlignment_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "subtitleAlignment", {
        /**
         * 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: function () {
            return this.i.i7;
        },
        set: function (v) {
            this.i.i7 = ensureEnum(HorizontalAlignment_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "unknownValuePlotting", {
        /**
         * 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: function () {
            return this.i.bb;
        },
        set: function (v) {
            this.i.bb = ensureEnum(UnknownValuePlotting_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "resolution", {
        /**
         * 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: function () {
            return this.i.dp;
        },
        set: function (v) {
            this.i.dp = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "thickness", {
        /**
         * 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: function () {
            return this.i.dv;
        },
        set: function (v) {
            this.i.dv = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "outlineMode", {
        /**
         * Gets or sets the OutlineMode for all series in this chart.
        */
        get: function () {
            return this.i.a5;
        },
        set: function (v) {
            this.i.a5 = ensureEnum(SeriesOutlineMode_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "markerOutlineMode", {
        /**
         * Gets or sets the MarkerOutlineMode for all series in this chart.
        */
        get: function () {
            return this.i.ao;
        },
        set: function (v) {
            this.i.ao = ensureEnum(MarkerOutlineMode_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "markerFillMode", {
        /**
         * Gets or sets the MarkerFillMode for all series in this chart.
        */
        get: function () {
            return this.i.am;
        },
        set: function (v) {
            this.i.am = ensureEnum(MarkerFillMode_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "markerFillOpacity", {
        /**
         * Gets or sets the MarkerFillOpacity for all series in this chart.
        */
        get: function () {
            return this.i.di;
        },
        set: function (v) {
            this.i.di = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "markerTypes", {
        /**
         * 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: function () {
            if (this._markerTypes === null) {
                var coll = new IgrMarkerTypeCollection();
                var innerColl = this.i.as;
                if (!innerColl) {
                    innerColl = new MarkerTypeCollection_internal();
                }
                this._markerTypes = coll._fromInner(innerColl);
                this.i.as = innerColl;
            }
            return this._markerTypes;
        },
        set: function (v) {
            if (this._markerTypes !== null) {
                this._markerTypes._setSyncTarget(null);
                this._markerTypes = null;
            }
            var coll = new IgrMarkerTypeCollection();
            this._markerTypes = coll._fromOuter(v);
            var syncColl = new SyncableObservableCollection$1(MarkerType_$type);
            var innerColl = this.i.as;
            if (!innerColl) {
                innerColl = new MarkerTypeCollection_internal();
            }
            syncColl._inner = innerColl;
            syncColl.clear();
            this._markerTypes._setSyncTarget(syncColl);
            this.i.as = innerColl;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "markerBrushes", {
        /**
         * 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: function () {
            return fromBrushCollection(this.i.l);
        },
        set: function (v) {
            this.i.l = toBrushCollection(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "markerOutlines", {
        /**
         * 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: function () {
            return fromBrushCollection(this.i.m);
        },
        set: function (v) {
            this.i.m = toBrushCollection(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "markerMaxCount", {
        /**
         * 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: function () {
            return this.i.d8;
        },
        set: function (v) {
            this.i.d8 = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "animateSeriesWhenAxisRangeChanges", {
        /**
         * Gets or sets whether the series animations should be allowed when a range change has been detected on an axis.
        */
        get: function () {
            return this.i.bv;
        },
        set: function (v) {
            this.i.bv = ensureBool(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "trendLineBrushes", {
        /**
         * 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: function () {
            return fromBrushCollection(this.i.o);
        },
        set: function (v) {
            this.i.o = toBrushCollection(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "trendLineType", {
        /**
         * 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: function () {
            return this.i.a9;
        },
        set: function (v) {
            this.i.a9 = ensureEnum(TrendLineType_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "trendLineThickness", {
        /**
         * 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: function () {
            return this.i.d1;
        },
        set: function (v) {
            this.i.d1 = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "alignsGridLinesToPixels", {
        /**
         * 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: function () {
            return this.i.bu;
        },
        set: function (v) {
            this.i.bu = ensureBool(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "plotAreaMarginLeft", {
        /**
         * Margin applied to the Left of the plot area.
        */
        get: function () {
            return this.i.dl;
        },
        set: function (v) {
            this.i.dl = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "plotAreaMarginTop", {
        /**
         * Margin applied to the Top of the plot area.
        */
        get: function () {
            return this.i.dn;
        },
        set: function (v) {
            this.i.dn = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "plotAreaMarginRight", {
        /**
         * Margin applied to the right of the plot area.
        */
        get: function () {
            return this.i.dm;
        },
        set: function (v) {
            this.i.dm = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "plotAreaMarginBottom", {
        /**
         * Margin applied below the plot area.
        */
        get: function () {
            return this.i.dk;
        },
        set: function (v) {
            this.i.dk = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "computedPlotAreaMarginMode", {
        /**
         * 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: function () {
            return this.i.t;
        },
        set: function (v) {
            this.i.t = ensureEnum(ComputedPlotAreaMarginMode_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "highlightingMode", {
        /**
         * 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: function () {
            return this.i.a3;
        },
        set: function (v) {
            this.i.a3 = ensureEnum(SeriesHighlightingMode_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "highlightingBehavior", {
        /**
         * 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: function () {
            return this.i.a1;
        },
        set: function (v) {
            this.i.a1 = ensureEnum(SeriesHighlightingBehavior_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "legendHighlightingMode", {
        /**
         * Gets or sets the highlighting mode to use for the legend linked to the component, when supported.
        */
        get: function () {
            return this.i.ak;
        },
        set: function (v) {
            this.i.ak = ensureEnum(LegendHighlightingMode_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "shouldAutoExpandMarginForInitialLabels", {
        /**
         * Gets or sets a whether the series viewer should auto expand margins to accomodate the initial horizontal axis labels.
        */
        get: function () {
            return this.i.cd;
        },
        set: function (v) {
            this.i.cd = ensureBool(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "autoExpandMarginExtraPadding", {
        /**
         * Gets or sets the extra amount the series viewer should auto expand margins to accommodate the initial horizontal axis labels.
        */
        get: function () {
            return this.i.de;
        },
        set: function (v) {
            this.i.de = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "autoExpandMarginMaximumValue", {
        /**
         * Gets or sets the maximum amount the series viewer should auto expand margins to accommodate the initial horizontal axis labels.
        */
        get: function () {
            return this.i.df;
        },
        set: function (v) {
            this.i.df = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "trendLinePeriod", {
        get: function () {
            return this.i.ea;
        },
        set: function (v) {
            this.i.ea = +v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "toolTipType", {
        /**
         * Gets or sets the style of tooltip to be displayed.
        */
        get: function () {
            return this.i.a7;
        },
        set: function (v) {
            this.i.a7 = ensureEnum(ToolTipType_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "crosshairsDisplayMode", {
        /**
         * Gets or sets the crosshairs to be displayed.
        */
        get: function () {
            return this.i.v;
        },
        set: function (v) {
            this.i.v = ensureEnum(CrosshairsDisplayMode_$type, v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "crosshairsSnapToData", {
        /**
         * Gets or sets whether crosshairs will snap to the nearest data point.
        */
        get: function () {
            return this.i.b0;
        },
        set: function (v) {
            this.i.b0 = ensureBool(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "crosshairsAnnotationEnabled", {
        /**
         * Gets or sets whether annotations are shown along the axis for crosshair values
        */
        get: function () {
            return this.i.bz;
        },
        set: function (v) {
            this.i.bz = ensureBool(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "finalValueAnnotationsVisible", {
        /**
         * Gets or sets whether annotations for the final value of each series is displayed on the axis.
        */
        get: function () {
            return this.i.b1;
        },
        set: function (v) {
            this.i.b1 = ensureBool(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "calloutsVisible", {
        /**
         * Gets or sets if callouts should be displayed.
        */
        get: function () {
            return this.i.by;
        },
        set: function (v) {
            this.i.by = ensureBool(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "calloutStyleUpdatingEventEnabled", {
        /**
         * Gets or sets if event annotations should be displayed.
        */
        get: function () {
            return this.i.bx;
        },
        set: function (v) {
            this.i.bx = ensureBool(v);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "calloutsXMemberPath", {
        /**
         * Gets or sets the member path of the X data for the callouts.
        */
        get: function () {
            return this.i.e6;
        },
        set: function (v) {
            this.i.e6 = v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "calloutsYMemberPath", {
        /**
         * Gets or sets the member path of the Y data for the callouts.
        */
        get: function () {
            return this.i.e8;
        },
        set: function (v) {
            this.i.e8 = v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "calloutsLabelMemberPath", {
        /**
         * Gets or sets the member path of the label data for the callouts.
        */
        get: function () {
            return this.i.e2;
        },
        set: function (v) {
            this.i.e2 = v;
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "calloutsContentMemberPath", {
        /**
         * Gets or sets the member path of the content data for the callouts.
        */
        get: function () {
            return this.i.ez;
        },
        set: function (v) {
            this.i.ez = v;
        },
        enumerable: true,
        configurable: true
    });
    IgrDomainChart.prototype.findByName = function (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;
    };
    Object.defineProperty(IgrDomainChart.prototype, "hasUserValues", {
        get: function () {
            return this._hasUserValues;
        },
        enumerable: true,
        configurable: true
    });
    IgrDomainChart.prototype.__m = function (propertyName) {
        if (!this._inStyling) {
            this._hasUserValues.add(propertyName);
        }
    };
    IgrDomainChart.prototype._styling = function (container, component, parent) {
        if (this._inStyling) {
            return;
        }
        this._inStyling = true;
        this._stylingContainer = container;
        this._stylingParent = component;
        var genericPrefix = "";
        var typeName = this.i.$type.name;
        if (typeName.indexOf("Xam") === 0) {
            typeName = typeName.substring(3);
        }
        genericPrefix = toSpinal("DomainChart");
        var additionalPrefixes = [];
        var prefix = toSpinal(typeName);
        additionalPrefixes.push(prefix + "-");
        var 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);
            }
            var basePrefix = toSpinal(typeName);
            additionalPrefixes.push(basePrefix + "-");
            b = b.baseType;
        }
        if (parent) {
            var parentTypeName = parent.i.$type.name;
            if (parentTypeName.indexOf("Xam") === 0) {
                parentTypeName = parentTypeName.substring(3);
            }
            var 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");
* ```
*/
    IgrDomainChart.prototype.provideContainer = function (container) {
        this.i.provideContainer(container);
    };
    /**
     * Destroy this control
    
    *
    * Use the `destroy` property to destroy the chart.
    *
    * ```ts
    * this.chart.destroy();
    * ```
    */
    IgrDomainChart.prototype.destroy = function () {
        this.i.destroy();
    };
    /**
     * Called when the control has been resized.
    
    *
    * `notifyResized` method Called when the control has been resized.
    *
    * ```ts
    * this.chart.notifyResized();
    * ```
    */
    IgrDomainChart.prototype.notifyResized = function () {
        this.i.notifyResized();
    };
    IgrDomainChart.prototype.notifyVisualPropertiesChanged = function () {
        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();
    * ```
    */
    IgrDomainChart.prototype.flush = function () {
        this.i.hg();
    };
    /**
     * Hides the active main tooltip, if displayed.
    
    *
    * Use the `hideToolTip` method to hide the active tooltip.
    *
    * ```ts
    * this.chart.hideToolTip();
    * ```
    */
    IgrDomainChart.prototype.hideToolTip = function () {
        this.i.hj();
    };
    IgrDomainChart.prototype.notifySetItem = function (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);
    * ```
    */
    IgrDomainChart.prototype.notifyClearItems = function (source_) {
        this.i.hz(source_);
    };
    IgrDomainChart.prototype.notifyInsertItem = function (source_, index, newItem) {
        this.i.h0(source_, index, newItem);
    };
    IgrDomainChart.prototype.notifyRemoveItem = function (source_, index, oldItem) {
        this.i.h1(source_, index, oldItem);
    };
    Object.defineProperty(IgrDomainChart.prototype, "seriesAdded", {
        /**
         * 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: function () {
            return this._seriesAdded;
        },
        set: function (ev) {
            var _this = this;
            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 = function (o, e) {
                var 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);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "seriesRemoved", {
        /**
         * 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: function () {
            return this._seriesRemoved;
        },
        set: function (ev) {
            var _this = this;
            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 = function (o, e) {
                var 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);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "seriesPointerEnter", {
        /**
         * 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: function () {
            return this._seriesPointerEnter;
        },
        set: function (ev) {
            var _this = this;
            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 = function (o, e) {
                var 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);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "seriesPointerLeave", {
        /**
         * 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: function () {
            return this._seriesPointerLeave;
        },
        set: function (ev) {
            var _this = this;
            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 = function (o, e) {
                var 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);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "seriesPointerMove", {
        /**
         * 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: function () {
            return this._seriesPointerMove;
        },
        set: function (ev) {
            var _this = this;
            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 = function (o, e) {
                var 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);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "seriesPointerDown", {
        /**
         * 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: function () {
            return this._seriesPointerDown;
        },
        set: function (ev) {
            var _this = this;
            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 = function (o, e) {
                var 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);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "seriesPointerUp", {
        /**
         * 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: function () {
            return this._seriesPointerUp;
        },
        set: function (ev) {
            var _this = this;
            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 = function (o, e) {
                var 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);
        },
        enumerable: true,
        configurable: true
    });
    Object.defineProperty(IgrDomainChart.prototype, "calloutStyleUpdating", {
        /**
         * Occurs when the style of a callout is updated.
        */
        get: function () {
            return this._calloutStyleUpdating;
        },
        set: function (ev) {
            var _this = this;
            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 = function (o, e) {
                var 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);
        },
        enumerable: true,
        configurable: true
    });
    return IgrDomainChart;
}(React.Component));
export { IgrDomainChart };
//# sourceMappingURL=igr-domain-chart.js.map
