highcharts 10.2.0 → 10.2.1

package/es-modules/Extensions/Annotations/Controllables/ControllableLabel.js

@@ -4,22 +4,80 @@
  *
  * */
 'use strict';
-/* *
- *
- *  Imports
- *
- * */
-import '../../../Core/Renderer/SVG/SVGRenderer.js';
-import ControllableMixin from '../Mixins/ControllableMixin.js';
+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 __());
+    };
+})();
+import Controllable from './Controllable.js';
 import F from '../../../Core/FormatUtilities.js';
 var format = F.format;
 import MockPoint from '../MockPoint.js';
-import SVGRenderer from '../../../Core/Renderer/SVG/SVGRenderer.js';
-var symbols = SVGRenderer.prototype.symbols;
 import Tooltip from '../../../Core/Tooltip.js';
 import U from '../../../Core/Utilities.js';
 var extend = U.extend, isNumber = U.isNumber, pick = U.pick;
-/* eslint-disable no-invalid-this, valid-jsdoc */
+/* *
+ *
+ *  Constants
+ *
+ * */
+var composedClasses = [];
+/* *
+ *
+ *  Functions
+ *
+ * */
+/**
+ * General symbol definition for labels with connector
+ * @private
+ */
+function symbolConnector(x, y, w, h, options) {
+    var anchorX = options && options.anchorX, anchorY = options && options.anchorY;
+    var path, yOffset, lateral = w / 2;
+    if (isNumber(anchorX) && isNumber(anchorY)) {
+        path = [['M', anchorX, anchorY]];
+        // Prefer 45 deg connectors
+        yOffset = y - anchorY;
+        if (yOffset < 0) {
+            yOffset = -h - yOffset;
+        }
+        if (yOffset < w) {
+            lateral = anchorX < x + (w / 2) ? yOffset : w - yOffset;
+        }
+        // Anchor below label
+        if (anchorY > y + h) {
+            path.push(['L', x + lateral, y + h]);
+            // Anchor above label
+        }
+        else if (anchorY < y) {
+            path.push(['L', x + lateral, y]);
+            // Anchor left of label
+        }
+        else if (anchorX < x) {
+            path.push(['L', x, y + h / 2]);
+            // Anchor right of label
+        }
+        else if (anchorX > x + w) {
+            path.push(['L', x + w, y + h / 2]);
+        }
+    }
+    return path || [];
+}
+/* *
+ *
+ *  Class
+ *
+ * */
 /**
  * A controllable label class.
  *
@@ -36,36 +94,15 @@ var extend = U.extend, isNumber = U.isNumber, pick = U.pick;
  * @param {number} index
  * Index of the label.
  */
-var ControllableLabel = /** @class */ (function () {
+var ControllableLabel = /** @class */ (function (_super) {
+    __extends(ControllableLabel, _super);
     /* *
      *
      *  Constructors
      *
      * */
     function ControllableLabel(annotation, options, index) {
-        /* *
-         *
-         *  Properties
-         *
-         * */
-        this.addControlPoints = ControllableMixin.addControlPoints;
-        this.attr = ControllableMixin.attr;
-        this.attrsFromOptions = ControllableMixin.attrsFromOptions;
-        this.destroy = ControllableMixin.destroy;
-        this.getPointsOptions = ControllableMixin.getPointsOptions;
-        this.init = ControllableMixin.init;
-        this.linkPoints = ControllableMixin.linkPoints;
-        this.point = ControllableMixin.point;
-        this.rotate = ControllableMixin.rotate;
-        this.scale = ControllableMixin.scale;
-        this.setControlPointsVisibility = (ControllableMixin.setControlPointsVisibility);
-        this.shouldBeDrawn = ControllableMixin.shouldBeDrawn;
-        this.transform = ControllableMixin.transform;
-        this.transformPoint = ControllableMixin.transformPoint;
-        this.translateShape = ControllableMixin.translateShape;
-        this.update = ControllableMixin.update;
-        this.init(annotation, options, index);
-        this.collection = 'labels';
+        return _super.call(this, annotation, options, index, 'label') || this;
     }
     /* *
      *
@@ -110,6 +147,13 @@ var ControllableLabel = /** @class */ (function () {
             y: Math.round(y)
         };
     };
+    ControllableLabel.compose = function (SVGRendererClass) {
+        if (composedClasses.indexOf(SVGRendererClass) === -1) {
+            composedClasses.push(SVGRendererClass);
+            var svgRendererProto = SVGRendererClass.prototype;
+            svgRendererProto.symbols.connector = symbolConnector;
+        }
+    };
     /**
      * Returns new alignment options for a label if the label is outside the
      * plot area. It is almost a one-to-one copy from
@@ -185,7 +229,7 @@ var ControllableLabel = /** @class */ (function () {
      * @param {number} dy translation for y coordinate
      */
     ControllableLabel.prototype.translatePoint = function (dx, dy) {
-        ControllableMixin.translatePoint.call(this, dx, dy, 0);
+        _super.prototype.translatePoint.call(this, dx, dy, 0);
     };
     /**
      * Translate x and y position relative to the label's anchor.
@@ -232,13 +276,17 @@ var ControllableLabel = /** @class */ (function () {
             this.graphic.addClass(options.className);
         }
         this.graphic.labelrank = options.labelrank;
-        ControllableMixin.render.call(this);
+        _super.prototype.render.call(this);
     };
     ControllableLabel.prototype.redraw = function (animation) {
         var options = this.options, text = this.text || options.format || options.text, label = this.graphic, point = this.points[0];
+        if (!label) {
+            this.redraw(animation);
+            return;
+        }
         label.attr({
             text: text ?
-                format(text, point.getLabelConfig(), this.annotation.chart) :
+                format(String(text), point.getLabelConfig(), this.annotation.chart) :
                 options.formatter.call(point, this)
         });
         var anchor = this.anchor(point);
@@ -256,7 +304,7 @@ var ControllableLabel = /** @class */ (function () {
             });
         }
         label.placed = !!attrs;
-        ControllableMixin.redraw.call(this, animation);
+        _super.prototype.redraw.call(this, animation);
     };
     /**
      * All basic shapes don't support alignTo() method except label.
@@ -264,7 +312,7 @@ var ControllableLabel = /** @class */ (function () {
      * options.
      */
     ControllableLabel.prototype.anchor = function (_point) {
-        var anchor = ControllableMixin.anchor.apply(this, arguments), x = this.options.x || 0, y = this.options.y || 0;
+        var anchor = _super.prototype.anchor.apply(this, arguments), x = this.options.x || 0, y = this.options.y || 0;
         anchor.absolutePosition.x -= x;
         anchor.absolutePosition.y -= y;
         anchor.relativePosition.x -= x;
@@ -278,8 +326,8 @@ var ControllableLabel = /** @class */ (function () {
         var item = this.graphic, chart = this.annotation.chart, point = this.points[0], itemOptions = this.options, anchorAbsolutePosition = anchor.absolutePosition, anchorRelativePosition = anchor.relativePosition;
         var itemPosition, alignTo, itemPosRelativeX, itemPosRelativeY, showItem = point.series.visible &&
             MockPoint.prototype.isInsidePlot.call(point);
-        var _a = item.width, width = _a === void 0 ? 0 : _a, _b = item.height, height = _b === void 0 ? 0 : _b;
-        if (showItem) {
+        if (item && showItem) {
+            var _a = item.width, width = _a === void 0 ? 0 : _a, _b = item.height, height = _b === void 0 ? 0 : _b;
             if (itemOptions.distance) {
                 itemPosition = Tooltip.prototype.getPosition.call({
                     chart: chart,
@@ -347,41 +395,10 @@ var ControllableLabel = /** @class */ (function () {
      */
     ControllableLabel.shapesWithoutBackground = ['connector'];
     return ControllableLabel;
-}());
+}(Controllable));
+/* *
+ *
+ *  Default Export
+ *
+ * */
 export default ControllableLabel;
-/**
- * General symbol definition for labels with connector
- * @private
- */
-symbols.connector = function (x, y, w, h, options) {
-    var anchorX = options && options.anchorX, anchorY = options && options.anchorY;
-    var path, yOffset, lateral = w / 2;
-    if (isNumber(anchorX) && isNumber(anchorY)) {
-        path = [['M', anchorX, anchorY]];
-        // Prefer 45 deg connectors
-        yOffset = y - anchorY;
-        if (yOffset < 0) {
-            yOffset = -h - yOffset;
-        }
-        if (yOffset < w) {
-            lateral = anchorX < x + (w / 2) ? yOffset : w - yOffset;
-        }
-        // Anchor below label
-        if (anchorY > y + h) {
-            path.push(['L', x + lateral, y + h]);
-            // Anchor above label
-        }
-        else if (anchorY < y) {
-            path.push(['L', x + lateral, y]);
-            // Anchor left of label
-        }
-        else if (anchorX < x) {
-            path.push(['L', x, y + h / 2]);
-            // Anchor right of label
-        }
-        else if (anchorX > x + w) {
-            path.push(['L', x + w, y + h / 2]);
-        }
-    }
-    return path || [];
-};

package/es-modules/Extensions/Annotations/Controllables/ControllablePath.js

@@ -4,14 +4,98 @@
  *
  * */
 'use strict';
-import ControllableMixin from '../Mixins/ControllableMixin.js';
+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 __());
+    };
+})();
+import Controllable from './Controllable.js';
+import ControllableDefaults from './ControllableDefaults.js';
+var defaultMarkers = ControllableDefaults.defaultMarkers;
 import H from '../../../Core/Globals.js';
-import MarkerMixin from '../Mixins/MarkerMixin.js';
 import U from '../../../Core/Utilities.js';
-var extend = U.extend;
+var addEvent = U.addEvent, defined = U.defined, extend = U.extend, merge = U.merge, uniqueKey = U.uniqueKey;
+/* *
+ *
+ *  Constants
+ *
+ * */
+var composedClasses = [];
+var markerEndSetter = createMarkerSetter('marker-end');
+var markerStartSetter = createMarkerSetter('marker-start');
 // See TRACKER_FILL in highcharts.src.js
 var TRACKER_FILL = 'rgba(192,192,192,' + (H.svg ? 0.0001 : 0.002) + ')';
-/* eslint-disable no-invalid-this, valid-jsdoc */
+/* *
+ *
+ *  Functions
+ *
+ * */
+/**
+ * @private
+ */
+function createMarkerSetter(markerType) {
+    return function (value) {
+        this.attr(markerType, 'url(#' + value + ')');
+    };
+}
+/**
+ * @private
+ */
+function onChartAfterGetContainer() {
+    this.options.defs = merge(defaultMarkers, this.options.defs || {});
+    // objectEach(this.options.defs, function (def): void {
+    //     const attributes = def.attributes;
+    //     if (
+    //         def.tagName === 'marker' &&
+    //         attributes &&
+    //         attributes.id &&
+    //         attributes.display !== 'none'
+    //     ) {
+    //         this.renderer.addMarker(attributes.id, def);
+    //     }
+    // }, this);
+}
+/**
+ * @private
+ */
+function svgRendererAddMarker(id, markerOptions) {
+    var options = { attributes: { id: id } };
+    var attrs = {
+        stroke: markerOptions.color || 'none',
+        fill: markerOptions.color || 'rgba(0, 0, 0, 0.75)'
+    };
+    options.children = (markerOptions.children &&
+        markerOptions.children.map(function (child) {
+            return merge(attrs, child);
+        }));
+    var ast = merge(true, {
+        attributes: {
+            markerWidth: 20,
+            markerHeight: 20,
+            refX: 0,
+            refY: 0,
+            orient: 'auto'
+        }
+    }, markerOptions, options);
+    var marker = this.definition(ast);
+    marker.id = id;
+    return marker;
+}
+/* *
+ *
+ *  Class
+ *
+ * */
 /**
  * A controllable path class.
  *
@@ -30,44 +114,39 @@ var TRACKER_FILL = 'rgba(192,192,192,' + (H.svg ? 0.0001 : 0.002) + ')';
  * @param {number} index
  * Index of the path.
  */
-var ControllablePath = /** @class */ (function () {
+var ControllablePath = /** @class */ (function (_super) {
+    __extends(ControllablePath, _super);
     /* *
      *
      *  Constructors
      *
      * */
     function ControllablePath(annotation, options, index) {
+        var _this = _super.call(this, annotation, options, index, 'shape') || this;
         /* *
          *
          *  Properties
          *
          * */
-        this.addControlPoints = ControllableMixin.addControlPoints;
-        this.anchor = ControllableMixin.anchor;
-        this.attr = ControllableMixin.attr;
-        this.attrsFromOptions = ControllableMixin.attrsFromOptions;
-        this.destroy = ControllableMixin.destroy;
-        this.getPointsOptions = ControllableMixin.getPointsOptions;
-        this.init = ControllableMixin.init;
-        this.linkPoints = ControllableMixin.linkPoints;
-        this.point = ControllableMixin.point;
-        this.rotate = ControllableMixin.rotate;
-        this.scale = ControllableMixin.scale;
-        this.setControlPointsVisibility = (ControllableMixin.setControlPointsVisibility);
-        this.setMarkers = MarkerMixin.setItemMarkers;
-        this.transform = ControllableMixin.transform;
-        this.transformPoint = ControllableMixin.transformPoint;
-        this.translate = ControllableMixin.translate;
-        this.translatePoint = ControllableMixin.translatePoint;
-        this.translateShape = ControllableMixin.translateShape;
-        this.update = ControllableMixin.update;
-        /**
-         * @type 'path'
-         */
-        this.type = 'path';
-        this.init(annotation, options, index);
-        this.collection = 'shapes';
+        _this.type = 'path';
+        return _this;
     }
+    /* *
+     *
+     *  Static Functions
+     *
+     * */
+    ControllablePath.compose = function (ChartClass, SVGRendererClass) {
+        if (composedClasses.indexOf(ChartClass) === -1) {
+            composedClasses.push(ChartClass);
+            addEvent(ChartClass, 'afterGetContainer', onChartAfterGetContainer);
+        }
+        if (composedClasses.indexOf(SVGRendererClass) === -1) {
+            composedClasses.push(SVGRendererClass);
+            var svgRendererProto = SVGRendererClass.prototype;
+            svgRendererProto.addMarker = svgRendererAddMarker;
+        }
+    };
     /* *
      *
      *  Functions
@@ -86,7 +165,8 @@ var ControllablePath = /** @class */ (function () {
                 dOption.call(this) :
                 dOption;
         }
-        var points = this.points, len = points.length, showPath = len, point = points[0], position = showPath && this.anchor(point).absolutePosition, pointIndex = 0, command, d = [];
+        var points = this.points, len = points.length, d = [];
+        var showPath = len, point = points[0], position = showPath && this.anchor(point).absolutePosition, pointIndex = 0, command;
         if (position) {
             d.push(['M', position.x, position.y]);
             while (++pointIndex < len && showPath) {
@@ -105,13 +185,12 @@ var ControllablePath = /** @class */ (function () {
                 showPath = point.series.visible;
             }
         }
-        return showPath ?
+        return (showPath && this.graphic ?
             this.chart.renderer.crispLine(d, this.graphic.strokeWidth()) :
-            null;
+            null);
     };
     ControllablePath.prototype.shouldBeDrawn = function () {
-        return (ControllableMixin.shouldBeDrawn.call(this) ||
-            Boolean(this.options.d));
+        return _super.prototype.shouldBeDrawn.call(this) || !!this.options.d;
     };
     ControllablePath.prototype.render = function (parent) {
         var options = this.options, attrs = this.attrsFromOptions(options);
@@ -138,25 +217,57 @@ var ControllablePath = /** @class */ (function () {
                     options.snap * 2
             });
         }
-        ControllableMixin.render.call(this);
-        extend(this.graphic, {
-            markerStartSetter: MarkerMixin.markerStartSetter,
-            markerEndSetter: MarkerMixin.markerEndSetter
-        });
+        _super.prototype.render.call(this);
+        extend(this.graphic, { markerStartSetter: markerStartSetter, markerEndSetter: markerEndSetter });
         this.setMarkers(this);
     };
     ControllablePath.prototype.redraw = function (animation) {
-        var d = this.toD(), action = animation ? 'animate' : 'attr';
-        if (d) {
-            this.graphic[action]({ d: d });
-            this.tracker[action]({ d: d });
-        }
-        else {
-            this.graphic.attr({ d: 'M 0 ' + -9e9 });
-            this.tracker.attr({ d: 'M 0 ' + -9e9 });
+        if (this.graphic) {
+            var d = this.toD(), action = animation ? 'animate' : 'attr';
+            if (d) {
+                this.graphic[action]({ d: d });
+                this.tracker[action]({ d: d });
+            }
+            else {
+                this.graphic.attr({ d: 'M 0 ' + -9e9 });
+                this.tracker.attr({ d: 'M 0 ' + -9e9 });
+            }
+            this.graphic.placed = this.tracker.placed = !!d;
         }
-        this.graphic.placed = this.tracker.placed = Boolean(d);
-        ControllableMixin.redraw.call(this, animation);
+        _super.prototype.redraw.call(this, animation);
+    };
+    /**
+     * Set markers.
+     * @private
+     * @param {Highcharts.AnnotationControllablePath} item
+     */
+    ControllablePath.prototype.setMarkers = function (item) {
+        var itemOptions = item.options, chart = item.chart, defs = chart.options.defs, fill = itemOptions.fill, color = defined(fill) && fill !== 'none' ?
+            fill :
+            itemOptions.stroke;
+        var setMarker = function (markerType) {
+            var markerId = itemOptions[markerType], def, predefinedMarker, key, marker;
+            if (markerId) {
+                for (key in defs) { // eslint-disable-line guard-for-in
+                    def = defs[key];
+                    if ((markerId === (def.attributes && def.attributes.id) ||
+                        // Legacy, for
+                        // unit-tests/annotations/annotations-shapes
+                        markerId === def.id) &&
+                        def.tagName === 'marker') {
+                        predefinedMarker = def;
+                        break;
+                    }
+                }
+                if (predefinedMarker) {
+                    marker = item[markerType] = chart.renderer
+                        .addMarker((itemOptions.id || uniqueKey()) + '-' + markerId, merge(predefinedMarker, { color: color }));
+                    item.attr(markerType, marker.getAttribute('id'));
+                }
+            }
+        };
+        ['markerStart', 'markerEnd']
+            .forEach(setMarker);
     };
     /* *
      *
@@ -177,5 +288,10 @@ var ControllablePath = /** @class */ (function () {
         zIndex: 'zIndex'
     };
     return ControllablePath;
-}());
+}(Controllable));
+/* *
+ *
+ *  Default Export
+ *
+ * */
 export default ControllablePath;

package/es-modules/Extensions/Annotations/Controllables/ControllableRect.js

@@ -3,17 +3,31 @@
  *  !!!!!!! SOURCE GETS TRANSPILED BY TYPESCRIPT. EDIT TS FILE ONLY. !!!!!!!
  *
  * */
-import ControllableMixin from '../Mixins/ControllableMixin.js';
+'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 __());
+    };
+})();
+import Controllable from './Controllable.js';
 import ControllablePath from './ControllablePath.js';
 import U from '../../../Core/Utilities.js';
 var merge = U.merge;
-/**
- * @typedef {Annotation.ControllablePath.AttrsMap}
- *          Annotation.ControllableRect.AttrsMap
- * @property {string} width=width
- * @property {string} height=height
- */
-/* eslint-disable no-invalid-this, valid-jsdoc */
+/* *
+ *
+ *  Class
+ *
+ * */
 /**
  * A controllable rect class.
  *
@@ -32,43 +46,23 @@ var merge = U.merge;
  * @param {number} index
  * Index of the rectangle
  */
-var ControllableRect = /** @class */ (function () {
+var ControllableRect = /** @class */ (function (_super) {
+    __extends(ControllableRect, _super);
     /* *
      *
      *  Constructors
      *
      * */
     function ControllableRect(annotation, options, index) {
+        var _this = _super.call(this, annotation, options, index, 'shape') || this;
         /* *
          *
          *  Properties
          *
          * */
-        this.addControlPoints = ControllableMixin.addControlPoints;
-        this.anchor = ControllableMixin.anchor;
-        this.attr = ControllableMixin.attr;
-        this.attrsFromOptions = ControllableMixin.attrsFromOptions;
-        this.destroy = ControllableMixin.destroy;
-        this.getPointsOptions = ControllableMixin.getPointsOptions;
-        this.init = ControllableMixin.init;
-        this.linkPoints = ControllableMixin.linkPoints;
-        this.point = ControllableMixin.point;
-        this.rotate = ControllableMixin.rotate;
-        this.scale = ControllableMixin.scale;
-        this.setControlPointsVisibility = (ControllableMixin.setControlPointsVisibility);
-        this.shouldBeDrawn = ControllableMixin.shouldBeDrawn;
-        this.transform = ControllableMixin.transform;
-        this.transformPoint = ControllableMixin.transformPoint;
-        this.translatePoint = ControllableMixin.translatePoint;
-        this.translateShape = ControllableMixin.translateShape;
-        this.update = ControllableMixin.update;
-        /**
-         * @type 'rect'
-         */
-        this.type = 'rect';
-        this.translate = ControllableMixin.translateShape;
-        this.init(annotation, options, index);
-        this.collection = 'shapes';
+        _this.type = 'rect';
+        _this.translate = _super.prototype.translateShape;
+        return _this;
     }
     /* *
      *
@@ -81,26 +75,28 @@ var ControllableRect = /** @class */ (function () {
             .rect(0, -9e9, 0, 0)
             .attr(attrs)
             .add(parent);
-        ControllableMixin.render.call(this);
+        _super.prototype.render.call(this);
     };
     ControllableRect.prototype.redraw = function (animation) {
-        var position = this.anchor(this.points[0]).absolutePosition;
-        if (position) {
-            this.graphic[animation ? 'animate' : 'attr']({
-                x: position.x,
-                y: position.y,
-                width: this.options.width,
-                height: this.options.height
-            });
-        }
-        else {
-            this.attr({
-                x: 0,
-                y: -9e9
-            });
+        if (this.graphic) {
+            var position = this.anchor(this.points[0]).absolutePosition;
+            if (position) {
+                this.graphic[animation ? 'animate' : 'attr']({
+                    x: position.x,
+                    y: position.y,
+                    width: this.options.width,
+                    height: this.options.height
+                });
+            }
+            else {
+                this.attr({
+                    x: 0,
+                    y: -9e9
+                });
+            }
+            this.graphic.placed = Boolean(position);
         }
-        this.graphic.placed = Boolean(position);
-        ControllableMixin.redraw.call(this, animation);
+        _super.prototype.redraw.call(this, animation);
     };
     /* *
      *
@@ -117,5 +113,10 @@ var ControllableRect = /** @class */ (function () {
         height: 'height'
     });
     return ControllableRect;
-}());
+}(Controllable));
+/* *
+ *
+ *  Default Export
+ *
+ * */
 export default ControllableRect;