devextreme-react 23.2.6 → 24.1.2-beta

package/cjs/chart.js

@@ -1,7 +1,7 @@
 /*!
  * devextreme-react
- * Version: 23.2.6
- * Build date: Wed May 01 2024
+ * Version: 24.1.2-beta
+ * Build date: Mon May 13 2024
  *
  * Copyright (c) 2012 - 2024 Developer Express Inc. ALL RIGHTS RESERVED
  *
@@ -13,24 +13,24 @@
 
 "use client";
 "use strict";
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        if (typeof b !== "function" && b !== null)
-            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
 var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
-    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
 }) : (function(o, m, k, k2) {
     if (k2 === undefined) k2 = k;
     o[k2] = m[k];
@@ -53,308 +53,132 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Label = exports.Image = exports.HoverStyle = exports.HorizontalLineLabel = exports.HorizontalLine = exports.Height = exports.Hatching = exports.Grid = exports.Format = exports.Font = exports.Export = exports.DragBoxStyle = exports.DataPrepareSettings = exports.Crosshair = exports.ConstantLineStyle = exports.ConstantLineLabel = exports.ConstantLine = exports.Connector = exports.CommonSeriesSettingsSelectionStyle = exports.CommonSeriesSettingsLabel = exports.CommonSeriesSettingsHoverStyle = exports.CommonSeriesSettings = exports.CommonPaneSettings = exports.CommonAxisSettingsTitle = exports.CommonAxisSettingsLabel = exports.CommonAxisSettingsConstantLineStyleLabel = exports.CommonAxisSettingsConstantLineStyle = exports.CommonAxisSettings = exports.CommonAnnotationSettings = exports.Color = exports.ChartTitleSubtitle = exports.ChartTitle = exports.BreakStyle = exports.Break = exports.Border = exports.BackgroundColor = exports.AxisTitle = exports.AxisLabel = exports.AxisConstantLineStyleLabel = exports.AxisConstantLineStyle = exports.ArgumentFormat = exports.ArgumentAxis = exports.AnnotationImage = exports.AnnotationBorder = exports.Annotation = exports.Animation = exports.AggregationInterval = exports.Aggregation = exports.AdaptiveLayout = exports.Chart = void 0;
 exports.ZoomAndPan = exports.Width = exports.WholeRange = exports.VisualRange = exports.VerticalLine = exports.ValueErrorBar = exports.ValueAxis = exports.Url = exports.TooltipBorder = exports.Tooltip = exports.Title = exports.TickInterval = exports.Tick = exports.Subtitle = exports.StripStyleLabel = exports.StripStyle = exports.StripLabel = exports.Strip = exports.Size = exports.Shadow = exports.SeriesTemplate = exports.SeriesBorder = exports.Series = exports.SelectionStyle = exports.ScrollBar = exports.Reduction = exports.PointSelectionStyle = exports.PointImage = exports.PointHoverStyle = exports.PointBorder = exports.Point = exports.PaneBorder = exports.Pane = exports.MinVisualRangeLength = exports.MinorTickInterval = exports.MinorTick = exports.MinorGrid = exports.Margin = exports.LoadingIndicator = exports.Length = exports.LegendTitleSubtitle = exports.LegendTitle = exports.Legend = void 0;
+var React = __importStar(require("react"));
+var react_1 = require("react");
 var chart_1 = __importDefault(require("devextreme/viz/chart"));
-var PropTypes = __importStar(require("prop-types"));
 var component_1 = require("./core/component");
 var nested_option_1 = __importDefault(require("./core/nested-option"));
-var Chart = /** @class */ (function (_super) {
-    __extends(Chart, _super);
-    function Chart() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this._WidgetClass = chart_1.default;
-        _this.useRequestAnimationFrameFlag = true;
-        _this.subscribableOptions = ["argumentAxis", "argumentAxis.categories", "argumentAxis.visualRange", "loadingIndicator", "loadingIndicator.show", "valueAxis", "valueAxis.categories", "valueAxis.visualRange"];
-        _this.independentEvents = ["onArgumentAxisClick", "onDisposing", "onDone", "onDrawn", "onExported", "onExporting", "onFileSaving", "onIncidentOccurred", "onInitialized", "onLegendClick", "onPointClick", "onSeriesClick", "onTooltipHidden", "onTooltipShown", "onZoomEnd", "onZoomStart"];
-        _this._defaults = {
-            defaultArgumentAxis: "argumentAxis",
-            defaultLoadingIndicator: "loadingIndicator",
-            defaultValueAxis: "valueAxis"
-        };
-        _this._expectedChildren = {
-            adaptiveLayout: { optionName: "adaptiveLayout", isCollectionItem: false },
-            animation: { optionName: "animation", isCollectionItem: false },
-            annotation: { optionName: "annotations", isCollectionItem: true },
-            argumentAxis: { optionName: "argumentAxis", isCollectionItem: false },
-            chartTitle: { optionName: "title", isCollectionItem: false },
-            commonAnnotationSettings: { optionName: "commonAnnotationSettings", isCollectionItem: false },
-            commonAxisSettings: { optionName: "commonAxisSettings", isCollectionItem: false },
-            commonPaneSettings: { optionName: "commonPaneSettings", isCollectionItem: false },
-            commonSeriesSettings: { optionName: "commonSeriesSettings", isCollectionItem: false },
-            crosshair: { optionName: "crosshair", isCollectionItem: false },
-            dataPrepareSettings: { optionName: "dataPrepareSettings", isCollectionItem: false },
-            export: { optionName: "export", isCollectionItem: false },
-            legend: { optionName: "legend", isCollectionItem: false },
-            loadingIndicator: { optionName: "loadingIndicator", isCollectionItem: false },
-            margin: { optionName: "margin", isCollectionItem: false },
-            pane: { optionName: "panes", isCollectionItem: true },
-            scrollBar: { optionName: "scrollBar", isCollectionItem: false },
-            series: { optionName: "series", isCollectionItem: true },
-            seriesTemplate: { optionName: "seriesTemplate", isCollectionItem: false },
-            size: { optionName: "size", isCollectionItem: false },
-            title: { optionName: "title", isCollectionItem: false },
-            tooltip: { optionName: "tooltip", isCollectionItem: false },
-            valueAxis: { optionName: "valueAxis", isCollectionItem: true },
-            zoomAndPan: { optionName: "zoomAndPan", isCollectionItem: false }
-        };
-        return _this;
-    }
-    Object.defineProperty(Chart.prototype, "instance", {
-        get: function () {
-            return this._instance;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    return Chart;
-}(component_1.Component));
+var Chart = (0, react_1.memo)((0, react_1.forwardRef)(function (props, ref) {
+    var baseRef = (0, react_1.useRef)(null);
+    (0, react_1.useImperativeHandle)(ref, function () { return ({
+        instance: function () {
+            var _a;
+            return (_a = baseRef.current) === null || _a === void 0 ? void 0 : _a.getInstance();
+        }
+    }); }, [baseRef.current]);
+    var subscribableOptions = (0, react_1.useMemo)(function () { return (["argumentAxis", "argumentAxis.categories", "argumentAxis.visualRange", "loadingIndicator", "loadingIndicator.show", "valueAxis", "valueAxis.categories", "valueAxis.visualRange"]); }, []);
+    var independentEvents = (0, react_1.useMemo)(function () { return (["onArgumentAxisClick", "onDisposing", "onDone", "onDrawn", "onExported", "onExporting", "onFileSaving", "onIncidentOccurred", "onInitialized", "onLegendClick", "onPointClick", "onSeriesClick", "onTooltipHidden", "onTooltipShown", "onZoomEnd", "onZoomStart"]); }, []);
+    var defaults = (0, react_1.useMemo)(function () { return ({
+        defaultArgumentAxis: "argumentAxis",
+        defaultLoadingIndicator: "loadingIndicator",
+        defaultValueAxis: "valueAxis",
+    }); }, []);
+    var expectedChildren = (0, react_1.useMemo)(function () { return ({
+        adaptiveLayout: { optionName: "adaptiveLayout", isCollectionItem: false },
+        animation: { optionName: "animation", isCollectionItem: false },
+        annotation: { optionName: "annotations", isCollectionItem: true },
+        argumentAxis: { optionName: "argumentAxis", isCollectionItem: false },
+        chartTitle: { optionName: "title", isCollectionItem: false },
+        commonAnnotationSettings: { optionName: "commonAnnotationSettings", isCollectionItem: false },
+        commonAxisSettings: { optionName: "commonAxisSettings", isCollectionItem: false },
+        commonPaneSettings: { optionName: "commonPaneSettings", isCollectionItem: false },
+        commonSeriesSettings: { optionName: "commonSeriesSettings", isCollectionItem: false },
+        crosshair: { optionName: "crosshair", isCollectionItem: false },
+        dataPrepareSettings: { optionName: "dataPrepareSettings", isCollectionItem: false },
+        export: { optionName: "export", isCollectionItem: false },
+        legend: { optionName: "legend", isCollectionItem: false },
+        loadingIndicator: { optionName: "loadingIndicator", isCollectionItem: false },
+        margin: { optionName: "margin", isCollectionItem: false },
+        pane: { optionName: "panes", isCollectionItem: true },
+        scrollBar: { optionName: "scrollBar", isCollectionItem: false },
+        series: { optionName: "series", isCollectionItem: true },
+        seriesTemplate: { optionName: "seriesTemplate", isCollectionItem: false },
+        size: { optionName: "size", isCollectionItem: false },
+        title: { optionName: "title", isCollectionItem: false },
+        tooltip: { optionName: "tooltip", isCollectionItem: false },
+        valueAxis: { optionName: "valueAxis", isCollectionItem: true },
+        zoomAndPan: { optionName: "zoomAndPan", isCollectionItem: false }
+    }); }, []);
+    return (React.createElement((component_1.Component), __assign({ WidgetClass: chart_1.default, ref: baseRef, useRequestAnimationFrameFlag: true, subscribableOptions: subscribableOptions, independentEvents: independentEvents, defaults: defaults, expectedChildren: expectedChildren }, props)));
+}));
 exports.Chart = Chart;
-Chart.propTypes = {
-    adaptiveLayout: PropTypes.object,
-    adjustOnZoom: PropTypes.bool,
-    animation: PropTypes.oneOfType([
-        PropTypes.bool,
-        PropTypes.object
-    ]),
-    annotations: PropTypes.array,
-    argumentAxis: PropTypes.object,
-    autoHidePointMarkers: PropTypes.bool,
-    barGroupPadding: PropTypes.number,
-    barGroupWidth: PropTypes.number,
-    commonAnnotationSettings: PropTypes.object,
-    commonAxisSettings: PropTypes.object,
-    commonPaneSettings: PropTypes.object,
-    commonSeriesSettings: PropTypes.object,
-    containerBackgroundColor: PropTypes.string,
-    crosshair: PropTypes.object,
-    customizeAnnotation: PropTypes.func,
-    customizeLabel: PropTypes.func,
-    customizePoint: PropTypes.func,
-    dataPrepareSettings: PropTypes.object,
-    defaultPane: PropTypes.string,
-    disabled: PropTypes.bool,
-    elementAttr: PropTypes.object,
-    export: PropTypes.object,
-    legend: PropTypes.object,
-    loadingIndicator: PropTypes.object,
-    margin: PropTypes.object,
-    maxBubbleSize: PropTypes.number,
-    minBubbleSize: PropTypes.number,
-    negativesAsZeroes: PropTypes.bool,
-    onArgumentAxisClick: PropTypes.func,
-    onDisposing: PropTypes.func,
-    onDone: PropTypes.func,
-    onDrawn: PropTypes.func,
-    onExported: PropTypes.func,
-    onExporting: PropTypes.func,
-    onFileSaving: PropTypes.func,
-    onIncidentOccurred: PropTypes.func,
-    onInitialized: PropTypes.func,
-    onLegendClick: PropTypes.func,
-    onOptionChanged: PropTypes.func,
-    onPointClick: PropTypes.func,
-    onPointHoverChanged: PropTypes.func,
-    onPointSelectionChanged: PropTypes.func,
-    onSeriesClick: PropTypes.func,
-    onSeriesHoverChanged: PropTypes.func,
-    onSeriesSelectionChanged: PropTypes.func,
-    onTooltipHidden: PropTypes.func,
-    onTooltipShown: PropTypes.func,
-    onZoomEnd: PropTypes.func,
-    onZoomStart: PropTypes.func,
-    palette: PropTypes.oneOfType([
-        PropTypes.array,
-        PropTypes.oneOfType([
-            PropTypes.string,
-            PropTypes.oneOf([
-                "Bright",
-                "Harmony Light",
-                "Ocean",
-                "Pastel",
-                "Soft",
-                "Soft Pastel",
-                "Vintage",
-                "Violet",
-                "Carmine",
-                "Dark Moon",
-                "Dark Violet",
-                "Green Mist",
-                "Soft Blue",
-                "Material",
-                "Office"
-            ])
-        ])
-    ]),
-    paletteExtensionMode: PropTypes.oneOfType([
-        PropTypes.string,
-        PropTypes.oneOf([
-            "alternate",
-            "blend",
-            "extrapolate"
-        ])
-    ]),
-    panes: PropTypes.oneOfType([
-        PropTypes.array,
-        PropTypes.object
-    ]),
-    pathModified: PropTypes.bool,
-    pointSelectionMode: PropTypes.oneOfType([
-        PropTypes.string,
-        PropTypes.oneOf([
-            "single",
-            "multiple"
-        ])
-    ]),
-    redrawOnResize: PropTypes.bool,
-    resizePanesOnZoom: PropTypes.bool,
-    resolveLabelOverlapping: PropTypes.oneOfType([
-        PropTypes.string,
-        PropTypes.oneOf([
-            "hide",
-            "none",
-            "stack"
-        ])
-    ]),
-    rotated: PropTypes.bool,
-    rtlEnabled: PropTypes.bool,
-    scrollBar: PropTypes.object,
-    series: PropTypes.oneOfType([
-        PropTypes.array,
-        PropTypes.object
-    ]),
-    seriesSelectionMode: PropTypes.oneOfType([
-        PropTypes.string,
-        PropTypes.oneOf([
-            "single",
-            "multiple"
-        ])
-    ]),
-    seriesTemplate: PropTypes.object,
-    size: PropTypes.object,
-    stickyHovering: PropTypes.bool,
-    synchronizeMultiAxes: PropTypes.bool,
-    theme: PropTypes.oneOfType([
-        PropTypes.string,
-        PropTypes.oneOf([
-            "generic.dark",
-            "generic.light",
-            "generic.contrast",
-            "generic.carmine",
-            "generic.darkmoon",
-            "generic.darkviolet",
-            "generic.greenmist",
-            "generic.softblue",
-            "material.blue.light",
-            "material.lime.light",
-            "material.orange.light",
-            "material.purple.light",
-            "material.teal.light"
-        ])
-    ]),
-    title: PropTypes.oneOfType([
-        PropTypes.object,
-        PropTypes.string
-    ]),
-    tooltip: PropTypes.object,
-    valueAxis: PropTypes.oneOfType([
-        PropTypes.array,
-        PropTypes.object
-    ]),
-    zoomAndPan: PropTypes.object
-};
-var AdaptiveLayout = /** @class */ (function (_super) {
-    __extends(AdaptiveLayout, _super);
-    function AdaptiveLayout() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    AdaptiveLayout.OptionName = "adaptiveLayout";
-    return AdaptiveLayout;
-}(nested_option_1.default));
+var _componentAdaptiveLayout = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var AdaptiveLayout = Object.assign(_componentAdaptiveLayout, {
+    OptionName: "adaptiveLayout",
+});
 exports.AdaptiveLayout = AdaptiveLayout;
-var Aggregation = /** @class */ (function (_super) {
-    __extends(Aggregation, _super);
-    function Aggregation() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Aggregation.OptionName = "aggregation";
-    return Aggregation;
-}(nested_option_1.default));
+var _componentAggregation = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Aggregation = Object.assign(_componentAggregation, {
+    OptionName: "aggregation",
+});
 exports.Aggregation = Aggregation;
-var AggregationInterval = /** @class */ (function (_super) {
-    __extends(AggregationInterval, _super);
-    function AggregationInterval() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    AggregationInterval.OptionName = "aggregationInterval";
-    return AggregationInterval;
-}(nested_option_1.default));
+var _componentAggregationInterval = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var AggregationInterval = Object.assign(_componentAggregationInterval, {
+    OptionName: "aggregationInterval",
+});
 exports.AggregationInterval = AggregationInterval;
-var Animation = /** @class */ (function (_super) {
-    __extends(Animation, _super);
-    function Animation() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Animation.OptionName = "animation";
-    return Animation;
-}(nested_option_1.default));
+var _componentAnimation = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Animation = Object.assign(_componentAnimation, {
+    OptionName: "animation",
+});
 exports.Animation = Animation;
-var Annotation = /** @class */ (function (_super) {
-    __extends(Annotation, _super);
-    function Annotation() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Annotation.OptionName = "annotations";
-    Annotation.IsCollectionItem = true;
-    Annotation.ExpectedChildren = {
+var _componentAnnotation = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Annotation = Object.assign(_componentAnnotation, {
+    OptionName: "annotations",
+    IsCollectionItem: true,
+    ExpectedChildren: {
         annotationBorder: { optionName: "border", isCollectionItem: false },
         annotationImage: { optionName: "image", isCollectionItem: false },
         border: { optionName: "border", isCollectionItem: false },
         font: { optionName: "font", isCollectionItem: false },
         image: { optionName: "image", isCollectionItem: false },
         shadow: { optionName: "shadow", isCollectionItem: false }
-    };
-    Annotation.TemplateProps = [{
+    },
+    TemplateProps: [{
             tmplOption: "template",
             render: "render",
-            component: "component",
-            keyFn: "keyFn"
+            component: "component"
         }, {
             tmplOption: "tooltipTemplate",
             render: "tooltipRender",
-            component: "tooltipComponent",
-            keyFn: "tooltipKeyFn"
-        }];
-    return Annotation;
-}(nested_option_1.default));
+            component: "tooltipComponent"
+        }],
+});
 exports.Annotation = Annotation;
-var AnnotationBorder = /** @class */ (function (_super) {
-    __extends(AnnotationBorder, _super);
-    function AnnotationBorder() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    AnnotationBorder.OptionName = "border";
-    return AnnotationBorder;
-}(nested_option_1.default));
+var _componentAnnotationBorder = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var AnnotationBorder = Object.assign(_componentAnnotationBorder, {
+    OptionName: "border",
+});
 exports.AnnotationBorder = AnnotationBorder;
-var AnnotationImage = /** @class */ (function (_super) {
-    __extends(AnnotationImage, _super);
-    function AnnotationImage() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    AnnotationImage.OptionName = "image";
-    return AnnotationImage;
-}(nested_option_1.default));
+var _componentAnnotationImage = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var AnnotationImage = Object.assign(_componentAnnotationImage, {
+    OptionName: "image",
+});
 exports.AnnotationImage = AnnotationImage;
-var ArgumentAxis = /** @class */ (function (_super) {
-    __extends(ArgumentAxis, _super);
-    function ArgumentAxis() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    ArgumentAxis.OptionName = "argumentAxis";
-    ArgumentAxis.DefaultsProps = {
+var _componentArgumentAxis = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var ArgumentAxis = Object.assign(_componentArgumentAxis, {
+    OptionName: "argumentAxis",
+    DefaultsProps: {
         defaultCategories: "categories",
         defaultVisualRange: "visualRange"
-    };
-    ArgumentAxis.ExpectedChildren = {
+    },
+    ExpectedChildren: {
         aggregationInterval: { optionName: "aggregationInterval", isCollectionItem: false },
         axisConstantLineStyle: { optionName: "constantLineStyle", isCollectionItem: false },
         axisLabel: { optionName: "label", isCollectionItem: false },
@@ -376,238 +200,194 @@ var ArgumentAxis = /** @class */ (function (_super) {
         title: { optionName: "title", isCollectionItem: false },
         visualRange: { optionName: "visualRange", isCollectionItem: false },
         wholeRange: { optionName: "wholeRange", isCollectionItem: false }
-    };
-    return ArgumentAxis;
-}(nested_option_1.default));
+    },
+});
 exports.ArgumentAxis = ArgumentAxis;
-var ArgumentFormat = /** @class */ (function (_super) {
-    __extends(ArgumentFormat, _super);
-    function ArgumentFormat() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    ArgumentFormat.OptionName = "argumentFormat";
-    return ArgumentFormat;
-}(nested_option_1.default));
+var _componentArgumentFormat = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var ArgumentFormat = Object.assign(_componentArgumentFormat, {
+    OptionName: "argumentFormat",
+});
 exports.ArgumentFormat = ArgumentFormat;
-var AxisConstantLineStyle = /** @class */ (function (_super) {
-    __extends(AxisConstantLineStyle, _super);
-    function AxisConstantLineStyle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    AxisConstantLineStyle.OptionName = "constantLineStyle";
-    return AxisConstantLineStyle;
-}(nested_option_1.default));
+var _componentAxisConstantLineStyle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var AxisConstantLineStyle = Object.assign(_componentAxisConstantLineStyle, {
+    OptionName: "constantLineStyle",
+});
 exports.AxisConstantLineStyle = AxisConstantLineStyle;
-var AxisConstantLineStyleLabel = /** @class */ (function (_super) {
-    __extends(AxisConstantLineStyleLabel, _super);
-    function AxisConstantLineStyleLabel() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    AxisConstantLineStyleLabel.OptionName = "label";
-    return AxisConstantLineStyleLabel;
-}(nested_option_1.default));
+var _componentAxisConstantLineStyleLabel = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var AxisConstantLineStyleLabel = Object.assign(_componentAxisConstantLineStyleLabel, {
+    OptionName: "label",
+});
 exports.AxisConstantLineStyleLabel = AxisConstantLineStyleLabel;
-var AxisLabel = /** @class */ (function (_super) {
-    __extends(AxisLabel, _super);
-    function AxisLabel() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    AxisLabel.OptionName = "label";
-    AxisLabel.TemplateProps = [{
+var _componentAxisLabel = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var AxisLabel = Object.assign(_componentAxisLabel, {
+    OptionName: "label",
+    TemplateProps: [{
             tmplOption: "template",
             render: "render",
-            component: "component",
-            keyFn: "keyFn"
-        }];
-    return AxisLabel;
-}(nested_option_1.default));
+            component: "component"
+        }],
+});
 exports.AxisLabel = AxisLabel;
-var AxisTitle = /** @class */ (function (_super) {
-    __extends(AxisTitle, _super);
-    function AxisTitle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    AxisTitle.OptionName = "title";
-    return AxisTitle;
-}(nested_option_1.default));
+var _componentAxisTitle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var AxisTitle = Object.assign(_componentAxisTitle, {
+    OptionName: "title",
+});
 exports.AxisTitle = AxisTitle;
-var BackgroundColor = /** @class */ (function (_super) {
-    __extends(BackgroundColor, _super);
-    function BackgroundColor() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    BackgroundColor.OptionName = "backgroundColor";
-    return BackgroundColor;
-}(nested_option_1.default));
+var _componentBackgroundColor = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var BackgroundColor = Object.assign(_componentBackgroundColor, {
+    OptionName: "backgroundColor",
+});
 exports.BackgroundColor = BackgroundColor;
-var Border = /** @class */ (function (_super) {
-    __extends(Border, _super);
-    function Border() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Border.OptionName = "border";
-    return Border;
-}(nested_option_1.default));
+var _componentBorder = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Border = Object.assign(_componentBorder, {
+    OptionName: "border",
+});
 exports.Border = Border;
-var Break = /** @class */ (function (_super) {
-    __extends(Break, _super);
-    function Break() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Break.OptionName = "breaks";
-    Break.IsCollectionItem = true;
-    return Break;
-}(nested_option_1.default));
+var _componentBreak = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Break = Object.assign(_componentBreak, {
+    OptionName: "breaks",
+    IsCollectionItem: true,
+});
 exports.Break = Break;
-var BreakStyle = /** @class */ (function (_super) {
-    __extends(BreakStyle, _super);
-    function BreakStyle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    BreakStyle.OptionName = "breakStyle";
-    return BreakStyle;
-}(nested_option_1.default));
+var _componentBreakStyle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var BreakStyle = Object.assign(_componentBreakStyle, {
+    OptionName: "breakStyle",
+});
 exports.BreakStyle = BreakStyle;
-var ChartTitle = /** @class */ (function (_super) {
-    __extends(ChartTitle, _super);
-    function ChartTitle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    ChartTitle.OptionName = "title";
-    ChartTitle.ExpectedChildren = {
+var _componentChartTitle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var ChartTitle = Object.assign(_componentChartTitle, {
+    OptionName: "title",
+    ExpectedChildren: {
         chartTitleSubtitle: { optionName: "subtitle", isCollectionItem: false },
         font: { optionName: "font", isCollectionItem: false },
         margin: { optionName: "margin", isCollectionItem: false },
         subtitle: { optionName: "subtitle", isCollectionItem: false }
-    };
-    return ChartTitle;
-}(nested_option_1.default));
+    },
+});
 exports.ChartTitle = ChartTitle;
-var ChartTitleSubtitle = /** @class */ (function (_super) {
-    __extends(ChartTitleSubtitle, _super);
-    function ChartTitleSubtitle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    ChartTitleSubtitle.OptionName = "subtitle";
-    ChartTitleSubtitle.ExpectedChildren = {
+var _componentChartTitleSubtitle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var ChartTitleSubtitle = Object.assign(_componentChartTitleSubtitle, {
+    OptionName: "subtitle",
+    ExpectedChildren: {
         font: { optionName: "font", isCollectionItem: false }
-    };
-    return ChartTitleSubtitle;
-}(nested_option_1.default));
+    },
+});
 exports.ChartTitleSubtitle = ChartTitleSubtitle;
-var Color = /** @class */ (function (_super) {
-    __extends(Color, _super);
-    function Color() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Color.OptionName = "color";
-    return Color;
-}(nested_option_1.default));
+var _componentColor = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Color = Object.assign(_componentColor, {
+    OptionName: "color",
+});
 exports.Color = Color;
-var CommonAnnotationSettings = /** @class */ (function (_super) {
-    __extends(CommonAnnotationSettings, _super);
-    function CommonAnnotationSettings() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CommonAnnotationSettings.OptionName = "commonAnnotationSettings";
-    CommonAnnotationSettings.TemplateProps = [{
+var _componentCommonAnnotationSettings = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var CommonAnnotationSettings = Object.assign(_componentCommonAnnotationSettings, {
+    OptionName: "commonAnnotationSettings",
+    TemplateProps: [{
             tmplOption: "template",
             render: "render",
-            component: "component",
-            keyFn: "keyFn"
+            component: "component"
         }, {
             tmplOption: "tooltipTemplate",
             render: "tooltipRender",
-            component: "tooltipComponent",
-            keyFn: "tooltipKeyFn"
-        }];
-    return CommonAnnotationSettings;
-}(nested_option_1.default));
+            component: "tooltipComponent"
+        }],
+});
 exports.CommonAnnotationSettings = CommonAnnotationSettings;
-var CommonAxisSettings = /** @class */ (function (_super) {
-    __extends(CommonAxisSettings, _super);
-    function CommonAxisSettings() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CommonAxisSettings.OptionName = "commonAxisSettings";
-    CommonAxisSettings.ExpectedChildren = {
+var _componentCommonAxisSettings = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var CommonAxisSettings = Object.assign(_componentCommonAxisSettings, {
+    OptionName: "commonAxisSettings",
+    ExpectedChildren: {
         commonAxisSettingsConstantLineStyle: { optionName: "constantLineStyle", isCollectionItem: false },
         commonAxisSettingsLabel: { optionName: "label", isCollectionItem: false },
         commonAxisSettingsTitle: { optionName: "title", isCollectionItem: false },
         constantLineStyle: { optionName: "constantLineStyle", isCollectionItem: false },
         label: { optionName: "label", isCollectionItem: false },
         title: { optionName: "title", isCollectionItem: false }
-    };
-    return CommonAxisSettings;
-}(nested_option_1.default));
+    },
+});
 exports.CommonAxisSettings = CommonAxisSettings;
-var CommonAxisSettingsConstantLineStyle = /** @class */ (function (_super) {
-    __extends(CommonAxisSettingsConstantLineStyle, _super);
-    function CommonAxisSettingsConstantLineStyle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CommonAxisSettingsConstantLineStyle.OptionName = "constantLineStyle";
-    CommonAxisSettingsConstantLineStyle.ExpectedChildren = {
+var _componentCommonAxisSettingsConstantLineStyle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var CommonAxisSettingsConstantLineStyle = Object.assign(_componentCommonAxisSettingsConstantLineStyle, {
+    OptionName: "constantLineStyle",
+    ExpectedChildren: {
         commonAxisSettingsConstantLineStyleLabel: { optionName: "label", isCollectionItem: false },
         label: { optionName: "label", isCollectionItem: false }
-    };
-    return CommonAxisSettingsConstantLineStyle;
-}(nested_option_1.default));
+    },
+});
 exports.CommonAxisSettingsConstantLineStyle = CommonAxisSettingsConstantLineStyle;
-var CommonAxisSettingsConstantLineStyleLabel = /** @class */ (function (_super) {
-    __extends(CommonAxisSettingsConstantLineStyleLabel, _super);
-    function CommonAxisSettingsConstantLineStyleLabel() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CommonAxisSettingsConstantLineStyleLabel.OptionName = "label";
-    return CommonAxisSettingsConstantLineStyleLabel;
-}(nested_option_1.default));
+var _componentCommonAxisSettingsConstantLineStyleLabel = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var CommonAxisSettingsConstantLineStyleLabel = Object.assign(_componentCommonAxisSettingsConstantLineStyleLabel, {
+    OptionName: "label",
+});
 exports.CommonAxisSettingsConstantLineStyleLabel = CommonAxisSettingsConstantLineStyleLabel;
-var CommonAxisSettingsLabel = /** @class */ (function (_super) {
-    __extends(CommonAxisSettingsLabel, _super);
-    function CommonAxisSettingsLabel() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CommonAxisSettingsLabel.OptionName = "label";
-    CommonAxisSettingsLabel.TemplateProps = [{
+var _componentCommonAxisSettingsLabel = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var CommonAxisSettingsLabel = Object.assign(_componentCommonAxisSettingsLabel, {
+    OptionName: "label",
+    TemplateProps: [{
             tmplOption: "template",
             render: "render",
-            component: "component",
-            keyFn: "keyFn"
-        }];
-    return CommonAxisSettingsLabel;
-}(nested_option_1.default));
+            component: "component"
+        }],
+});
 exports.CommonAxisSettingsLabel = CommonAxisSettingsLabel;
-var CommonAxisSettingsTitle = /** @class */ (function (_super) {
-    __extends(CommonAxisSettingsTitle, _super);
-    function CommonAxisSettingsTitle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CommonAxisSettingsTitle.OptionName = "title";
-    return CommonAxisSettingsTitle;
-}(nested_option_1.default));
+var _componentCommonAxisSettingsTitle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var CommonAxisSettingsTitle = Object.assign(_componentCommonAxisSettingsTitle, {
+    OptionName: "title",
+});
 exports.CommonAxisSettingsTitle = CommonAxisSettingsTitle;
-var CommonPaneSettings = /** @class */ (function (_super) {
-    __extends(CommonPaneSettings, _super);
-    function CommonPaneSettings() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CommonPaneSettings.OptionName = "commonPaneSettings";
-    CommonPaneSettings.ExpectedChildren = {
+var _componentCommonPaneSettings = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var CommonPaneSettings = Object.assign(_componentCommonPaneSettings, {
+    OptionName: "commonPaneSettings",
+    ExpectedChildren: {
         backgroundColor: { optionName: "backgroundColor", isCollectionItem: false },
         border: { optionName: "border", isCollectionItem: false },
         paneBorder: { optionName: "border", isCollectionItem: false }
-    };
-    return CommonPaneSettings;
-}(nested_option_1.default));
+    },
+});
 exports.CommonPaneSettings = CommonPaneSettings;
-var CommonSeriesSettings = /** @class */ (function (_super) {
-    __extends(CommonSeriesSettings, _super);
-    function CommonSeriesSettings() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CommonSeriesSettings.OptionName = "commonSeriesSettings";
-    CommonSeriesSettings.ExpectedChildren = {
+var _componentCommonSeriesSettings = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var CommonSeriesSettings = Object.assign(_componentCommonSeriesSettings, {
+    OptionName: "commonSeriesSettings",
+    ExpectedChildren: {
         aggregation: { optionName: "aggregation", isCollectionItem: false },
         border: { optionName: "border", isCollectionItem: false },
         color: { optionName: "color", isCollectionItem: false },
@@ -621,381 +401,311 @@ var CommonSeriesSettings = /** @class */ (function (_super) {
         selectionStyle: { optionName: "selectionStyle", isCollectionItem: false },
         seriesBorder: { optionName: "border", isCollectionItem: false },
         valueErrorBar: { optionName: "valueErrorBar", isCollectionItem: false }
-    };
-    return CommonSeriesSettings;
-}(nested_option_1.default));
+    },
+});
 exports.CommonSeriesSettings = CommonSeriesSettings;
-var CommonSeriesSettingsHoverStyle = /** @class */ (function (_super) {
-    __extends(CommonSeriesSettingsHoverStyle, _super);
-    function CommonSeriesSettingsHoverStyle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CommonSeriesSettingsHoverStyle.OptionName = "hoverStyle";
-    CommonSeriesSettingsHoverStyle.ExpectedChildren = {
+var _componentCommonSeriesSettingsHoverStyle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var CommonSeriesSettingsHoverStyle = Object.assign(_componentCommonSeriesSettingsHoverStyle, {
+    OptionName: "hoverStyle",
+    ExpectedChildren: {
         border: { optionName: "border", isCollectionItem: false },
         color: { optionName: "color", isCollectionItem: false },
         hatching: { optionName: "hatching", isCollectionItem: false },
         seriesBorder: { optionName: "border", isCollectionItem: false }
-    };
-    return CommonSeriesSettingsHoverStyle;
-}(nested_option_1.default));
+    },
+});
 exports.CommonSeriesSettingsHoverStyle = CommonSeriesSettingsHoverStyle;
-var CommonSeriesSettingsLabel = /** @class */ (function (_super) {
-    __extends(CommonSeriesSettingsLabel, _super);
-    function CommonSeriesSettingsLabel() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CommonSeriesSettingsLabel.OptionName = "label";
-    CommonSeriesSettingsLabel.ExpectedChildren = {
+var _componentCommonSeriesSettingsLabel = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var CommonSeriesSettingsLabel = Object.assign(_componentCommonSeriesSettingsLabel, {
+    OptionName: "label",
+    ExpectedChildren: {
         argumentFormat: { optionName: "argumentFormat", isCollectionItem: false },
         border: { optionName: "border", isCollectionItem: false },
         connector: { optionName: "connector", isCollectionItem: false },
         font: { optionName: "font", isCollectionItem: false },
         format: { optionName: "format", isCollectionItem: false },
         seriesBorder: { optionName: "border", isCollectionItem: false }
-    };
-    return CommonSeriesSettingsLabel;
-}(nested_option_1.default));
+    },
+});
 exports.CommonSeriesSettingsLabel = CommonSeriesSettingsLabel;
-var CommonSeriesSettingsSelectionStyle = /** @class */ (function (_super) {
-    __extends(CommonSeriesSettingsSelectionStyle, _super);
-    function CommonSeriesSettingsSelectionStyle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    CommonSeriesSettingsSelectionStyle.OptionName = "selectionStyle";
-    CommonSeriesSettingsSelectionStyle.ExpectedChildren = {
+var _componentCommonSeriesSettingsSelectionStyle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var CommonSeriesSettingsSelectionStyle = Object.assign(_componentCommonSeriesSettingsSelectionStyle, {
+    OptionName: "selectionStyle",
+    ExpectedChildren: {
         border: { optionName: "border", isCollectionItem: false },
         color: { optionName: "color", isCollectionItem: false },
         hatching: { optionName: "hatching", isCollectionItem: false },
         seriesBorder: { optionName: "border", isCollectionItem: false }
-    };
-    return CommonSeriesSettingsSelectionStyle;
-}(nested_option_1.default));
+    },
+});
 exports.CommonSeriesSettingsSelectionStyle = CommonSeriesSettingsSelectionStyle;
-var Connector = /** @class */ (function (_super) {
-    __extends(Connector, _super);
-    function Connector() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Connector.OptionName = "connector";
-    return Connector;
-}(nested_option_1.default));
+var _componentConnector = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Connector = Object.assign(_componentConnector, {
+    OptionName: "connector",
+});
 exports.Connector = Connector;
-var ConstantLine = /** @class */ (function (_super) {
-    __extends(ConstantLine, _super);
-    function ConstantLine() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    ConstantLine.OptionName = "constantLines";
-    ConstantLine.IsCollectionItem = true;
-    return ConstantLine;
-}(nested_option_1.default));
+var _componentConstantLine = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var ConstantLine = Object.assign(_componentConstantLine, {
+    OptionName: "constantLines",
+    IsCollectionItem: true,
+});
 exports.ConstantLine = ConstantLine;
-var ConstantLineLabel = /** @class */ (function (_super) {
-    __extends(ConstantLineLabel, _super);
-    function ConstantLineLabel() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    ConstantLineLabel.OptionName = "label";
-    return ConstantLineLabel;
-}(nested_option_1.default));
+var _componentConstantLineLabel = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var ConstantLineLabel = Object.assign(_componentConstantLineLabel, {
+    OptionName: "label",
+});
 exports.ConstantLineLabel = ConstantLineLabel;
-var ConstantLineStyle = /** @class */ (function (_super) {
-    __extends(ConstantLineStyle, _super);
-    function ConstantLineStyle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    ConstantLineStyle.OptionName = "constantLineStyle";
-    return ConstantLineStyle;
-}(nested_option_1.default));
+var _componentConstantLineStyle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var ConstantLineStyle = Object.assign(_componentConstantLineStyle, {
+    OptionName: "constantLineStyle",
+});
 exports.ConstantLineStyle = ConstantLineStyle;
-var Crosshair = /** @class */ (function (_super) {
-    __extends(Crosshair, _super);
-    function Crosshair() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Crosshair.OptionName = "crosshair";
-    Crosshair.ExpectedChildren = {
+var _componentCrosshair = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Crosshair = Object.assign(_componentCrosshair, {
+    OptionName: "crosshair",
+    ExpectedChildren: {
         horizontalLine: { optionName: "horizontalLine", isCollectionItem: false },
         horizontalLineLabel: { optionName: "label", isCollectionItem: false },
         label: { optionName: "label", isCollectionItem: false },
         verticalLine: { optionName: "verticalLine", isCollectionItem: false }
-    };
-    return Crosshair;
-}(nested_option_1.default));
+    },
+});
 exports.Crosshair = Crosshair;
-var DataPrepareSettings = /** @class */ (function (_super) {
-    __extends(DataPrepareSettings, _super);
-    function DataPrepareSettings() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    DataPrepareSettings.OptionName = "dataPrepareSettings";
-    return DataPrepareSettings;
-}(nested_option_1.default));
+var _componentDataPrepareSettings = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var DataPrepareSettings = Object.assign(_componentDataPrepareSettings, {
+    OptionName: "dataPrepareSettings",
+});
 exports.DataPrepareSettings = DataPrepareSettings;
-var DragBoxStyle = /** @class */ (function (_super) {
-    __extends(DragBoxStyle, _super);
-    function DragBoxStyle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    DragBoxStyle.OptionName = "dragBoxStyle";
-    return DragBoxStyle;
-}(nested_option_1.default));
+var _componentDragBoxStyle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var DragBoxStyle = Object.assign(_componentDragBoxStyle, {
+    OptionName: "dragBoxStyle",
+});
 exports.DragBoxStyle = DragBoxStyle;
-var Export = /** @class */ (function (_super) {
-    __extends(Export, _super);
-    function Export() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Export.OptionName = "export";
-    return Export;
-}(nested_option_1.default));
+var _componentExport = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Export = Object.assign(_componentExport, {
+    OptionName: "export",
+});
 exports.Export = Export;
-var Font = /** @class */ (function (_super) {
-    __extends(Font, _super);
-    function Font() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Font.OptionName = "font";
-    return Font;
-}(nested_option_1.default));
+var _componentFont = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Font = Object.assign(_componentFont, {
+    OptionName: "font",
+});
 exports.Font = Font;
-var Format = /** @class */ (function (_super) {
-    __extends(Format, _super);
-    function Format() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Format.OptionName = "format";
-    return Format;
-}(nested_option_1.default));
+var _componentFormat = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Format = Object.assign(_componentFormat, {
+    OptionName: "format",
+});
 exports.Format = Format;
-var Grid = /** @class */ (function (_super) {
-    __extends(Grid, _super);
-    function Grid() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Grid.OptionName = "grid";
-    return Grid;
-}(nested_option_1.default));
+var _componentGrid = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Grid = Object.assign(_componentGrid, {
+    OptionName: "grid",
+});
 exports.Grid = Grid;
-var Hatching = /** @class */ (function (_super) {
-    __extends(Hatching, _super);
-    function Hatching() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Hatching.OptionName = "hatching";
-    return Hatching;
-}(nested_option_1.default));
+var _componentHatching = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Hatching = Object.assign(_componentHatching, {
+    OptionName: "hatching",
+});
 exports.Hatching = Hatching;
-var Height = /** @class */ (function (_super) {
-    __extends(Height, _super);
-    function Height() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Height.OptionName = "height";
-    return Height;
-}(nested_option_1.default));
+var _componentHeight = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Height = Object.assign(_componentHeight, {
+    OptionName: "height",
+});
 exports.Height = Height;
-var HorizontalLine = /** @class */ (function (_super) {
-    __extends(HorizontalLine, _super);
-    function HorizontalLine() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    HorizontalLine.OptionName = "horizontalLine";
-    HorizontalLine.ExpectedChildren = {
+var _componentHorizontalLine = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var HorizontalLine = Object.assign(_componentHorizontalLine, {
+    OptionName: "horizontalLine",
+    ExpectedChildren: {
         horizontalLineLabel: { optionName: "label", isCollectionItem: false },
         label: { optionName: "label", isCollectionItem: false }
-    };
-    return HorizontalLine;
-}(nested_option_1.default));
+    },
+});
 exports.HorizontalLine = HorizontalLine;
-var HorizontalLineLabel = /** @class */ (function (_super) {
-    __extends(HorizontalLineLabel, _super);
-    function HorizontalLineLabel() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    HorizontalLineLabel.OptionName = "label";
-    return HorizontalLineLabel;
-}(nested_option_1.default));
+var _componentHorizontalLineLabel = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var HorizontalLineLabel = Object.assign(_componentHorizontalLineLabel, {
+    OptionName: "label",
+});
 exports.HorizontalLineLabel = HorizontalLineLabel;
-var HoverStyle = /** @class */ (function (_super) {
-    __extends(HoverStyle, _super);
-    function HoverStyle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    HoverStyle.OptionName = "hoverStyle";
-    return HoverStyle;
-}(nested_option_1.default));
+var _componentHoverStyle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var HoverStyle = Object.assign(_componentHoverStyle, {
+    OptionName: "hoverStyle",
+});
 exports.HoverStyle = HoverStyle;
-var Image = /** @class */ (function (_super) {
-    __extends(Image, _super);
-    function Image() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Image.OptionName = "image";
-    return Image;
-}(nested_option_1.default));
+var _componentImage = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Image = Object.assign(_componentImage, {
+    OptionName: "image",
+});
 exports.Image = Image;
-var Label = /** @class */ (function (_super) {
-    __extends(Label, _super);
-    function Label() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Label.OptionName = "label";
-    Label.TemplateProps = [{
+var _componentLabel = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Label = Object.assign(_componentLabel, {
+    OptionName: "label",
+    TemplateProps: [{
             tmplOption: "template",
             render: "render",
-            component: "component",
-            keyFn: "keyFn"
-        }];
-    return Label;
-}(nested_option_1.default));
+            component: "component"
+        }],
+});
 exports.Label = Label;
-var Legend = /** @class */ (function (_super) {
-    __extends(Legend, _super);
-    function Legend() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Legend.OptionName = "legend";
-    Legend.ExpectedChildren = {
+var _componentLegend = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Legend = Object.assign(_componentLegend, {
+    OptionName: "legend",
+    ExpectedChildren: {
         annotationBorder: { optionName: "border", isCollectionItem: false },
         border: { optionName: "border", isCollectionItem: false },
         font: { optionName: "font", isCollectionItem: false },
         legendTitle: { optionName: "title", isCollectionItem: false },
         margin: { optionName: "margin", isCollectionItem: false },
         title: { optionName: "title", isCollectionItem: false }
-    };
-    Legend.TemplateProps = [{
+    },
+    TemplateProps: [{
             tmplOption: "markerTemplate",
             render: "markerRender",
-            component: "markerComponent",
-            keyFn: "markerKeyFn"
-        }];
-    return Legend;
-}(nested_option_1.default));
+            component: "markerComponent"
+        }],
+});
 exports.Legend = Legend;
-var LegendTitle = /** @class */ (function (_super) {
-    __extends(LegendTitle, _super);
-    function LegendTitle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    LegendTitle.OptionName = "title";
-    LegendTitle.ExpectedChildren = {
+var _componentLegendTitle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var LegendTitle = Object.assign(_componentLegendTitle, {
+    OptionName: "title",
+    ExpectedChildren: {
         font: { optionName: "font", isCollectionItem: false },
         legendTitleSubtitle: { optionName: "subtitle", isCollectionItem: false },
         margin: { optionName: "margin", isCollectionItem: false },
         subtitle: { optionName: "subtitle", isCollectionItem: false }
-    };
-    return LegendTitle;
-}(nested_option_1.default));
+    },
+});
 exports.LegendTitle = LegendTitle;
-var LegendTitleSubtitle = /** @class */ (function (_super) {
-    __extends(LegendTitleSubtitle, _super);
-    function LegendTitleSubtitle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    LegendTitleSubtitle.OptionName = "subtitle";
-    LegendTitleSubtitle.ExpectedChildren = {
+var _componentLegendTitleSubtitle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var LegendTitleSubtitle = Object.assign(_componentLegendTitleSubtitle, {
+    OptionName: "subtitle",
+    ExpectedChildren: {
         font: { optionName: "font", isCollectionItem: false }
-    };
-    return LegendTitleSubtitle;
-}(nested_option_1.default));
+    },
+});
 exports.LegendTitleSubtitle = LegendTitleSubtitle;
-var Length = /** @class */ (function (_super) {
-    __extends(Length, _super);
-    function Length() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Length.OptionName = "length";
-    return Length;
-}(nested_option_1.default));
+var _componentLength = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Length = Object.assign(_componentLength, {
+    OptionName: "length",
+});
 exports.Length = Length;
-var LoadingIndicator = /** @class */ (function (_super) {
-    __extends(LoadingIndicator, _super);
-    function LoadingIndicator() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    LoadingIndicator.OptionName = "loadingIndicator";
-    LoadingIndicator.DefaultsProps = {
+var _componentLoadingIndicator = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var LoadingIndicator = Object.assign(_componentLoadingIndicator, {
+    OptionName: "loadingIndicator",
+    DefaultsProps: {
         defaultShow: "show"
-    };
-    LoadingIndicator.ExpectedChildren = {
+    },
+    ExpectedChildren: {
         font: { optionName: "font", isCollectionItem: false }
-    };
-    return LoadingIndicator;
-}(nested_option_1.default));
+    },
+});
 exports.LoadingIndicator = LoadingIndicator;
-var Margin = /** @class */ (function (_super) {
-    __extends(Margin, _super);
-    function Margin() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Margin.OptionName = "margin";
-    return Margin;
-}(nested_option_1.default));
+var _componentMargin = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Margin = Object.assign(_componentMargin, {
+    OptionName: "margin",
+});
 exports.Margin = Margin;
-var MinorGrid = /** @class */ (function (_super) {
-    __extends(MinorGrid, _super);
-    function MinorGrid() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    MinorGrid.OptionName = "minorGrid";
-    return MinorGrid;
-}(nested_option_1.default));
+var _componentMinorGrid = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var MinorGrid = Object.assign(_componentMinorGrid, {
+    OptionName: "minorGrid",
+});
 exports.MinorGrid = MinorGrid;
-var MinorTick = /** @class */ (function (_super) {
-    __extends(MinorTick, _super);
-    function MinorTick() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    MinorTick.OptionName = "minorTick";
-    return MinorTick;
-}(nested_option_1.default));
+var _componentMinorTick = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var MinorTick = Object.assign(_componentMinorTick, {
+    OptionName: "minorTick",
+});
 exports.MinorTick = MinorTick;
-var MinorTickInterval = /** @class */ (function (_super) {
-    __extends(MinorTickInterval, _super);
-    function MinorTickInterval() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    MinorTickInterval.OptionName = "minorTickInterval";
-    return MinorTickInterval;
-}(nested_option_1.default));
+var _componentMinorTickInterval = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var MinorTickInterval = Object.assign(_componentMinorTickInterval, {
+    OptionName: "minorTickInterval",
+});
 exports.MinorTickInterval = MinorTickInterval;
-var MinVisualRangeLength = /** @class */ (function (_super) {
-    __extends(MinVisualRangeLength, _super);
-    function MinVisualRangeLength() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    MinVisualRangeLength.OptionName = "minVisualRangeLength";
-    return MinVisualRangeLength;
-}(nested_option_1.default));
+var _componentMinVisualRangeLength = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var MinVisualRangeLength = Object.assign(_componentMinVisualRangeLength, {
+    OptionName: "minVisualRangeLength",
+});
 exports.MinVisualRangeLength = MinVisualRangeLength;
-var Pane = /** @class */ (function (_super) {
-    __extends(Pane, _super);
-    function Pane() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Pane.OptionName = "panes";
-    Pane.IsCollectionItem = true;
-    return Pane;
-}(nested_option_1.default));
+var _componentPane = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Pane = Object.assign(_componentPane, {
+    OptionName: "panes",
+    IsCollectionItem: true,
+});
 exports.Pane = Pane;
-var PaneBorder = /** @class */ (function (_super) {
-    __extends(PaneBorder, _super);
-    function PaneBorder() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    PaneBorder.OptionName = "border";
-    return PaneBorder;
-}(nested_option_1.default));
+var _componentPaneBorder = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var PaneBorder = Object.assign(_componentPaneBorder, {
+    OptionName: "border",
+});
 exports.PaneBorder = PaneBorder;
-var Point = /** @class */ (function (_super) {
-    __extends(Point, _super);
-    function Point() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Point.OptionName = "point";
-    Point.ExpectedChildren = {
+var _componentPoint = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Point = Object.assign(_componentPoint, {
+    OptionName: "point",
+    ExpectedChildren: {
         border: { optionName: "border", isCollectionItem: false },
         color: { optionName: "color", isCollectionItem: false },
         hoverStyle: { optionName: "hoverStyle", isCollectionItem: false },
@@ -1005,264 +715,215 @@ var Point = /** @class */ (function (_super) {
         pointImage: { optionName: "image", isCollectionItem: false },
         pointSelectionStyle: { optionName: "selectionStyle", isCollectionItem: false },
         selectionStyle: { optionName: "selectionStyle", isCollectionItem: false }
-    };
-    return Point;
-}(nested_option_1.default));
+    },
+});
 exports.Point = Point;
-var PointBorder = /** @class */ (function (_super) {
-    __extends(PointBorder, _super);
-    function PointBorder() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    PointBorder.OptionName = "border";
-    return PointBorder;
-}(nested_option_1.default));
+var _componentPointBorder = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var PointBorder = Object.assign(_componentPointBorder, {
+    OptionName: "border",
+});
 exports.PointBorder = PointBorder;
-var PointHoverStyle = /** @class */ (function (_super) {
-    __extends(PointHoverStyle, _super);
-    function PointHoverStyle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    PointHoverStyle.OptionName = "hoverStyle";
-    PointHoverStyle.ExpectedChildren = {
+var _componentPointHoverStyle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var PointHoverStyle = Object.assign(_componentPointHoverStyle, {
+    OptionName: "hoverStyle",
+    ExpectedChildren: {
         border: { optionName: "border", isCollectionItem: false },
         color: { optionName: "color", isCollectionItem: false },
         pointBorder: { optionName: "border", isCollectionItem: false }
-    };
-    return PointHoverStyle;
-}(nested_option_1.default));
+    },
+});
 exports.PointHoverStyle = PointHoverStyle;
-var PointImage = /** @class */ (function (_super) {
-    __extends(PointImage, _super);
-    function PointImage() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    PointImage.OptionName = "image";
-    PointImage.ExpectedChildren = {
+var _componentPointImage = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var PointImage = Object.assign(_componentPointImage, {
+    OptionName: "image",
+    ExpectedChildren: {
         height: { optionName: "height", isCollectionItem: false },
         url: { optionName: "url", isCollectionItem: false },
         width: { optionName: "width", isCollectionItem: false }
-    };
-    return PointImage;
-}(nested_option_1.default));
+    },
+});
 exports.PointImage = PointImage;
-var PointSelectionStyle = /** @class */ (function (_super) {
-    __extends(PointSelectionStyle, _super);
-    function PointSelectionStyle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    PointSelectionStyle.OptionName = "selectionStyle";
-    PointSelectionStyle.ExpectedChildren = {
+var _componentPointSelectionStyle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var PointSelectionStyle = Object.assign(_componentPointSelectionStyle, {
+    OptionName: "selectionStyle",
+    ExpectedChildren: {
         border: { optionName: "border", isCollectionItem: false },
         color: { optionName: "color", isCollectionItem: false },
         pointBorder: { optionName: "border", isCollectionItem: false }
-    };
-    return PointSelectionStyle;
-}(nested_option_1.default));
+    },
+});
 exports.PointSelectionStyle = PointSelectionStyle;
-var Reduction = /** @class */ (function (_super) {
-    __extends(Reduction, _super);
-    function Reduction() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Reduction.OptionName = "reduction";
-    return Reduction;
-}(nested_option_1.default));
+var _componentReduction = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Reduction = Object.assign(_componentReduction, {
+    OptionName: "reduction",
+});
 exports.Reduction = Reduction;
-var ScrollBar = /** @class */ (function (_super) {
-    __extends(ScrollBar, _super);
-    function ScrollBar() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    ScrollBar.OptionName = "scrollBar";
-    return ScrollBar;
-}(nested_option_1.default));
+var _componentScrollBar = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var ScrollBar = Object.assign(_componentScrollBar, {
+    OptionName: "scrollBar",
+});
 exports.ScrollBar = ScrollBar;
-var SelectionStyle = /** @class */ (function (_super) {
-    __extends(SelectionStyle, _super);
-    function SelectionStyle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    SelectionStyle.OptionName = "selectionStyle";
-    return SelectionStyle;
-}(nested_option_1.default));
+var _componentSelectionStyle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var SelectionStyle = Object.assign(_componentSelectionStyle, {
+    OptionName: "selectionStyle",
+});
 exports.SelectionStyle = SelectionStyle;
-var Series = /** @class */ (function (_super) {
-    __extends(Series, _super);
-    function Series() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Series.OptionName = "series";
-    Series.IsCollectionItem = true;
-    return Series;
-}(nested_option_1.default));
+var _componentSeries = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Series = Object.assign(_componentSeries, {
+    OptionName: "series",
+    IsCollectionItem: true,
+});
 exports.Series = Series;
-var SeriesBorder = /** @class */ (function (_super) {
-    __extends(SeriesBorder, _super);
-    function SeriesBorder() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    SeriesBorder.OptionName = "border";
-    return SeriesBorder;
-}(nested_option_1.default));
+var _componentSeriesBorder = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var SeriesBorder = Object.assign(_componentSeriesBorder, {
+    OptionName: "border",
+});
 exports.SeriesBorder = SeriesBorder;
-var SeriesTemplate = /** @class */ (function (_super) {
-    __extends(SeriesTemplate, _super);
-    function SeriesTemplate() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    SeriesTemplate.OptionName = "seriesTemplate";
-    return SeriesTemplate;
-}(nested_option_1.default));
+var _componentSeriesTemplate = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var SeriesTemplate = Object.assign(_componentSeriesTemplate, {
+    OptionName: "seriesTemplate",
+});
 exports.SeriesTemplate = SeriesTemplate;
-var Shadow = /** @class */ (function (_super) {
-    __extends(Shadow, _super);
-    function Shadow() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Shadow.OptionName = "shadow";
-    return Shadow;
-}(nested_option_1.default));
+var _componentShadow = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Shadow = Object.assign(_componentShadow, {
+    OptionName: "shadow",
+});
 exports.Shadow = Shadow;
-var Size = /** @class */ (function (_super) {
-    __extends(Size, _super);
-    function Size() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Size.OptionName = "size";
-    return Size;
-}(nested_option_1.default));
+var _componentSize = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Size = Object.assign(_componentSize, {
+    OptionName: "size",
+});
 exports.Size = Size;
-var Strip = /** @class */ (function (_super) {
-    __extends(Strip, _super);
-    function Strip() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Strip.OptionName = "strips";
-    Strip.IsCollectionItem = true;
-    return Strip;
-}(nested_option_1.default));
+var _componentStrip = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Strip = Object.assign(_componentStrip, {
+    OptionName: "strips",
+    IsCollectionItem: true,
+});
 exports.Strip = Strip;
-var StripLabel = /** @class */ (function (_super) {
-    __extends(StripLabel, _super);
-    function StripLabel() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    StripLabel.OptionName = "label";
-    return StripLabel;
-}(nested_option_1.default));
+var _componentStripLabel = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var StripLabel = Object.assign(_componentStripLabel, {
+    OptionName: "label",
+});
 exports.StripLabel = StripLabel;
-var StripStyle = /** @class */ (function (_super) {
-    __extends(StripStyle, _super);
-    function StripStyle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    StripStyle.OptionName = "stripStyle";
-    StripStyle.ExpectedChildren = {
+var _componentStripStyle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var StripStyle = Object.assign(_componentStripStyle, {
+    OptionName: "stripStyle",
+    ExpectedChildren: {
         label: { optionName: "label", isCollectionItem: false },
         stripStyleLabel: { optionName: "label", isCollectionItem: false }
-    };
-    return StripStyle;
-}(nested_option_1.default));
+    },
+});
 exports.StripStyle = StripStyle;
-var StripStyleLabel = /** @class */ (function (_super) {
-    __extends(StripStyleLabel, _super);
-    function StripStyleLabel() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    StripStyleLabel.OptionName = "label";
-    return StripStyleLabel;
-}(nested_option_1.default));
+var _componentStripStyleLabel = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var StripStyleLabel = Object.assign(_componentStripStyleLabel, {
+    OptionName: "label",
+});
 exports.StripStyleLabel = StripStyleLabel;
-var Subtitle = /** @class */ (function (_super) {
-    __extends(Subtitle, _super);
-    function Subtitle() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Subtitle.OptionName = "subtitle";
-    return Subtitle;
-}(nested_option_1.default));
+var _componentSubtitle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Subtitle = Object.assign(_componentSubtitle, {
+    OptionName: "subtitle",
+});
 exports.Subtitle = Subtitle;
-var Tick = /** @class */ (function (_super) {
-    __extends(Tick, _super);
-    function Tick() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Tick.OptionName = "tick";
-    return Tick;
-}(nested_option_1.default));
+var _componentTick = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Tick = Object.assign(_componentTick, {
+    OptionName: "tick",
+});
 exports.Tick = Tick;
-var TickInterval = /** @class */ (function (_super) {
-    __extends(TickInterval, _super);
-    function TickInterval() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    TickInterval.OptionName = "tickInterval";
-    return TickInterval;
-}(nested_option_1.default));
+var _componentTickInterval = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var TickInterval = Object.assign(_componentTickInterval, {
+    OptionName: "tickInterval",
+});
 exports.TickInterval = TickInterval;
-var Title = /** @class */ (function (_super) {
-    __extends(Title, _super);
-    function Title() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Title.OptionName = "title";
-    return Title;
-}(nested_option_1.default));
+var _componentTitle = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Title = Object.assign(_componentTitle, {
+    OptionName: "title",
+});
 exports.Title = Title;
-var Tooltip = /** @class */ (function (_super) {
-    __extends(Tooltip, _super);
-    function Tooltip() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Tooltip.OptionName = "tooltip";
-    Tooltip.ExpectedChildren = {
+var _componentTooltip = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Tooltip = Object.assign(_componentTooltip, {
+    OptionName: "tooltip",
+    ExpectedChildren: {
         argumentFormat: { optionName: "argumentFormat", isCollectionItem: false },
         border: { optionName: "border", isCollectionItem: false },
         font: { optionName: "font", isCollectionItem: false },
         format: { optionName: "format", isCollectionItem: false },
         shadow: { optionName: "shadow", isCollectionItem: false },
         tooltipBorder: { optionName: "border", isCollectionItem: false }
-    };
-    Tooltip.TemplateProps = [{
+    },
+    TemplateProps: [{
             tmplOption: "contentTemplate",
             render: "contentRender",
-            component: "contentComponent",
-            keyFn: "contentKeyFn"
-        }];
-    return Tooltip;
-}(nested_option_1.default));
+            component: "contentComponent"
+        }],
+});
 exports.Tooltip = Tooltip;
-var TooltipBorder = /** @class */ (function (_super) {
-    __extends(TooltipBorder, _super);
-    function TooltipBorder() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    TooltipBorder.OptionName = "border";
-    return TooltipBorder;
-}(nested_option_1.default));
+var _componentTooltipBorder = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var TooltipBorder = Object.assign(_componentTooltipBorder, {
+    OptionName: "border",
+});
 exports.TooltipBorder = TooltipBorder;
-var Url = /** @class */ (function (_super) {
-    __extends(Url, _super);
-    function Url() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Url.OptionName = "url";
-    return Url;
-}(nested_option_1.default));
+var _componentUrl = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Url = Object.assign(_componentUrl, {
+    OptionName: "url",
+});
 exports.Url = Url;
-var ValueAxis = /** @class */ (function (_super) {
-    __extends(ValueAxis, _super);
-    function ValueAxis() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    ValueAxis.OptionName = "valueAxis";
-    ValueAxis.IsCollectionItem = true;
-    ValueAxis.DefaultsProps = {
+var _componentValueAxis = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var ValueAxis = Object.assign(_componentValueAxis, {
+    OptionName: "valueAxis",
+    IsCollectionItem: true,
+    DefaultsProps: {
         defaultCategories: "categories",
         defaultVisualRange: "visualRange"
-    };
-    ValueAxis.ExpectedChildren = {
+    },
+    ExpectedChildren: {
         axisConstantLineStyle: { optionName: "constantLineStyle", isCollectionItem: false },
         axisLabel: { optionName: "label", isCollectionItem: false },
         axisTitle: { optionName: "title", isCollectionItem: false },
@@ -1277,77 +938,64 @@ var ValueAxis = /** @class */ (function (_super) {
         title: { optionName: "title", isCollectionItem: false },
         visualRange: { optionName: "visualRange", isCollectionItem: false },
         wholeRange: { optionName: "wholeRange", isCollectionItem: false }
-    };
-    return ValueAxis;
-}(nested_option_1.default));
+    },
+});
 exports.ValueAxis = ValueAxis;
-var ValueErrorBar = /** @class */ (function (_super) {
-    __extends(ValueErrorBar, _super);
-    function ValueErrorBar() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    ValueErrorBar.OptionName = "valueErrorBar";
-    return ValueErrorBar;
-}(nested_option_1.default));
+var _componentValueErrorBar = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var ValueErrorBar = Object.assign(_componentValueErrorBar, {
+    OptionName: "valueErrorBar",
+});
 exports.ValueErrorBar = ValueErrorBar;
-var VerticalLine = /** @class */ (function (_super) {
-    __extends(VerticalLine, _super);
-    function VerticalLine() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    VerticalLine.OptionName = "verticalLine";
-    VerticalLine.ExpectedChildren = {
+var _componentVerticalLine = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var VerticalLine = Object.assign(_componentVerticalLine, {
+    OptionName: "verticalLine",
+    ExpectedChildren: {
         horizontalLineLabel: { optionName: "label", isCollectionItem: false },
         label: { optionName: "label", isCollectionItem: false }
-    };
-    return VerticalLine;
-}(nested_option_1.default));
+    },
+});
 exports.VerticalLine = VerticalLine;
-var VisualRange = /** @class */ (function (_super) {
-    __extends(VisualRange, _super);
-    function VisualRange() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    VisualRange.OptionName = "visualRange";
-    VisualRange.DefaultsProps = {
+var _componentVisualRange = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var VisualRange = Object.assign(_componentVisualRange, {
+    OptionName: "visualRange",
+    DefaultsProps: {
         defaultEndValue: "endValue",
         defaultStartValue: "startValue"
-    };
-    return VisualRange;
-}(nested_option_1.default));
+    },
+});
 exports.VisualRange = VisualRange;
-var WholeRange = /** @class */ (function (_super) {
-    __extends(WholeRange, _super);
-    function WholeRange() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    WholeRange.OptionName = "wholeRange";
-    WholeRange.DefaultsProps = {
+var _componentWholeRange = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var WholeRange = Object.assign(_componentWholeRange, {
+    OptionName: "wholeRange",
+    DefaultsProps: {
         defaultEndValue: "endValue",
         defaultStartValue: "startValue"
-    };
-    return WholeRange;
-}(nested_option_1.default));
+    },
+});
 exports.WholeRange = WholeRange;
-var Width = /** @class */ (function (_super) {
-    __extends(Width, _super);
-    function Width() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Width.OptionName = "width";
-    return Width;
-}(nested_option_1.default));
+var _componentWidth = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var Width = Object.assign(_componentWidth, {
+    OptionName: "width",
+});
 exports.Width = Width;
-var ZoomAndPan = /** @class */ (function (_super) {
-    __extends(ZoomAndPan, _super);
-    function ZoomAndPan() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    ZoomAndPan.OptionName = "zoomAndPan";
-    ZoomAndPan.ExpectedChildren = {
+var _componentZoomAndPan = (0, react_1.memo)(function (props) {
+    return React.createElement((nested_option_1.default), __assign({}, props));
+});
+var ZoomAndPan = Object.assign(_componentZoomAndPan, {
+    OptionName: "zoomAndPan",
+    ExpectedChildren: {
         dragBoxStyle: { optionName: "dragBoxStyle", isCollectionItem: false }
-    };
-    return ZoomAndPan;
-}(nested_option_1.default));
+    },
+});
 exports.ZoomAndPan = ZoomAndPan;
 exports.default = Chart;