@amcharts/amcharts5 5.2.49 → 5.3.0

package/.internal/themes/DefaultTheme.js

@@ -1,4 +1,3 @@
-import { __extends } from "tslib";
 import { Theme } from "../core/Theme";
 import { p100, p50 } from "../core/util/Percent";
 import { Color } from "../core/util/Color";
@@ -10,839 +9,830 @@ import * as $ease from "../core/util/Ease";
 export function setColor(rule, key, ic, name) {
     // TODO this shouldn't use get, figure out a better way
     rule.set(key, ic.get(name));
-    ic.on(name, function (value) {
+    ic.on(name, (value) => {
         rule.set(key, value);
     });
 }
 /**
  * @ignore
  */
-var DefaultTheme = /** @class */ (function (_super) {
-    __extends(DefaultTheme, _super);
-    function DefaultTheme() {
-        return _super !== null && _super.apply(this, arguments) || this;
-    }
-    Object.defineProperty(DefaultTheme.prototype, "setupDefaultRules", {
-        enumerable: false,
-        configurable: true,
-        writable: true,
-        value: function () {
-            _super.prototype.setupDefaultRules.call(this);
-            var language = this._root.language;
-            var ic = this._root.interfaceColors;
-            var horizontalLayout = this._root.horizontalLayout;
-            var verticalLayout = this._root.verticalLayout;
-            var r = this.rule.bind(this);
-            /**
-             * ========================================================================
-             * core
-             * ========================================================================
-             */
-            r("InterfaceColors").setAll({
-                stroke: Color.fromHex(0xe5e5e5),
-                fill: Color.fromHex(0xf3f3f3),
-                primaryButton: Color.fromHex(0x6794dc),
-                primaryButtonHover: Color.fromHex(0x6771dc),
-                primaryButtonDown: Color.fromHex(0x68dc76),
-                primaryButtonActive: Color.fromHex(0x68dc76),
-                primaryButtonText: Color.fromHex(0xffffff),
-                primaryButtonStroke: Color.fromHex(0xffffff),
-                secondaryButton: Color.fromHex(0xd9d9d9),
-                secondaryButtonHover: Color.fromHex(0xa3a3a3),
-                secondaryButtonDown: Color.fromHex(0x8d8d8d),
-                secondaryButtonActive: Color.fromHex(0xe6e6e6),
-                secondaryButtonText: Color.fromHex(0x000000),
-                secondaryButtonStroke: Color.fromHex(0xffffff),
-                grid: Color.fromHex(0x000000),
-                background: Color.fromHex(0xffffff),
-                alternativeBackground: Color.fromHex(0x000000),
-                text: Color.fromHex(0x000000),
-                alternativeText: Color.fromHex(0xffffff),
-                disabled: Color.fromHex(0xadadad),
-                positive: Color.fromHex(0x50b300),
-                negative: Color.fromHex(0xb30000)
-            });
-            {
-                var rule = r("ColorSet");
-                rule.setAll({
-                    passOptions: {
-                        hue: 0.05,
-                        saturation: 0,
-                        lightness: 0
-                    },
-                    colors: [
-                        Color.fromHex(0x67b7dc)
-                    ],
-                    step: 1,
-                    //baseColor: Color.fromRGB(103, 183, 220),
-                    //count: 20,
-                    reuse: false,
-                    startIndex: 0
-                });
-                rule.setPrivate("currentStep", 0);
-                rule.setPrivate("currentPass", 0);
-            }
-            r("Entity").setAll({
-                stateAnimationDuration: 0,
-                stateAnimationEasing: $ease.out($ease.cubic)
-            });
-            r("Component").setAll({
-                interpolationDuration: 0,
-                interpolationEasing: $ease.out($ease.cubic)
-            });
-            r("Sprite").setAll({
-                visible: true,
-                scale: 1,
-                opacity: 1,
-                rotation: 0,
-                position: "relative",
-                tooltipX: p50,
-                tooltipY: p50,
-                tooltipPosition: "fixed",
-                isMeasured: true
-            });
-            r("Sprite").states.create("default", { "visible": true, opacity: 1 });
-            r("Container").setAll({
-                interactiveChildren: true,
-                setStateOnChildren: false
-            });
-            r("Graphics").setAll({
-                strokeWidth: 1
-            });
-            r("Chart").setAll({
-                width: p100,
-                height: p100,
-                interactiveChildren: false
-            });
-            /**
-             * ------------------------------------------------------------------------
-             * core: alignment
-             * ------------------------------------------------------------------------
-             */
-            r("Sprite", ["horizontal", "center"]).setAll({
-                centerX: p50,
-                x: p50
-            });
-            r("Sprite", ["vertical", "center"]).setAll({
-                centerY: p50,
-                y: p50
-            });
-            r("Container", ["horizontal", "layout"]).setAll({
-                layout: horizontalLayout
-            });
-            r("Container", ["vertical", "layout"]).setAll({
-                layout: verticalLayout
-            });
-            /**
-             * ------------------------------------------------------------------------
-             * core: patterns
-             * ------------------------------------------------------------------------
-             */
-            r("Pattern").setAll({
-                repetition: "repeat",
-                width: 50,
-                height: 50,
-                rotation: 0,
-                fillOpacity: 1
-            });
-            r("LinePattern").setAll({
-                gap: 6,
-                colorOpacity: 1,
-                width: 49,
-                height: 49
-            });
-            r("RectanglePattern").setAll({
-                gap: 6,
-                checkered: false,
-                centered: true,
-                maxWidth: 5,
-                maxHeight: 5,
-                width: 48,
-                height: 48,
-                strokeWidth: 0
-            });
-            r("CirclePattern").setAll({
-                gap: 5,
-                checkered: false,
-                centered: false,
-                radius: 3,
-                strokeWidth: 0,
-                width: 45,
-                height: 45
-            });
-            /**
-             * ------------------------------------------------------------------------
-             * core: gradients
-             * ------------------------------------------------------------------------
-             */
-            r("LinearGradient").setAll({
-                rotation: 90
-            });
-            /**
-             * ------------------------------------------------------------------------
-             * core: Legend
-             * ------------------------------------------------------------------------
-             */
-            r("Legend").setAll({
-                fillField: "fill",
-                strokeField: "stroke",
-                nameField: "name",
-                layout: GridLayout.new(this._root, {}),
-                layer: 30,
-                clickTarget: "itemContainer"
-            });
-            // Class: Container
-            r("Container", ["legend", "item", "itemcontainer"]).setAll({
-                paddingLeft: 5,
-                paddingRight: 5,
-                paddingBottom: 5,
-                paddingTop: 5,
-                layout: horizontalLayout,
-                setStateOnChildren: true,
-                interactiveChildren: false,
-                ariaChecked: true,
-                focusable: true,
-                ariaLabel: language.translate("Press ENTER to toggle"),
-                role: "checkbox"
-            });
-            {
-                var rule = r("Rectangle", ["legend", "item", "background"]);
-                rule.setAll({
-                    fillOpacity: 0,
-                });
-                setColor(rule, "fill", ic, "background");
-            }
-            r("Container", ["legend", "marker"]).setAll({
-                setStateOnChildren: true,
-                centerY: p50,
-                paddingLeft: 0,
-                paddingRight: 0,
-                paddingBottom: 0,
-                paddingTop: 0,
-                width: 18,
-                height: 18
+export class DefaultTheme extends Theme {
+    setupDefaultRules() {
+        super.setupDefaultRules();
+        const language = this._root.language;
+        const ic = this._root.interfaceColors;
+        const horizontalLayout = this._root.horizontalLayout;
+        const verticalLayout = this._root.verticalLayout;
+        const r = this.rule.bind(this);
+        /**
+         * ========================================================================
+         * core
+         * ========================================================================
+         */
+        r("InterfaceColors").setAll({
+            stroke: Color.fromHex(0xe5e5e5),
+            fill: Color.fromHex(0xf3f3f3),
+            primaryButton: Color.fromHex(0x6794dc),
+            primaryButtonHover: Color.fromHex(0x6771dc),
+            primaryButtonDown: Color.fromHex(0x68dc76),
+            primaryButtonActive: Color.fromHex(0x68dc76),
+            primaryButtonText: Color.fromHex(0xffffff),
+            primaryButtonStroke: Color.fromHex(0xffffff),
+            secondaryButton: Color.fromHex(0xd9d9d9),
+            secondaryButtonHover: Color.fromHex(0xa3a3a3),
+            secondaryButtonDown: Color.fromHex(0x8d8d8d),
+            secondaryButtonActive: Color.fromHex(0xe6e6e6),
+            secondaryButtonText: Color.fromHex(0x000000),
+            secondaryButtonStroke: Color.fromHex(0xffffff),
+            grid: Color.fromHex(0x000000),
+            background: Color.fromHex(0xffffff),
+            alternativeBackground: Color.fromHex(0x000000),
+            text: Color.fromHex(0x000000),
+            alternativeText: Color.fromHex(0xffffff),
+            disabled: Color.fromHex(0xadadad),
+            positive: Color.fromHex(0x50b300),
+            negative: Color.fromHex(0xb30000)
+        });
+        {
+            const rule = r("ColorSet");
+            rule.setAll({
+                passOptions: {
+                    hue: 0.05,
+                    saturation: 0,
+                    lightness: 0
+                },
+                colors: [
+                    Color.fromHex(0x67b7dc)
+                ],
+                step: 1,
+                //baseColor: Color.fromRGB(103, 183, 220),
+                //count: 20,
+                reuse: false,
+                startIndex: 0
+            });
+            rule.setPrivate("currentStep", 0);
+            rule.setPrivate("currentPass", 0);
+        }
+        r("Entity").setAll({
+            stateAnimationDuration: 0,
+            stateAnimationEasing: $ease.out($ease.cubic)
+        });
+        r("Component").setAll({
+            interpolationDuration: 0,
+            interpolationEasing: $ease.out($ease.cubic)
+        });
+        r("Sprite").setAll({
+            visible: true,
+            scale: 1,
+            opacity: 1,
+            rotation: 0,
+            position: "relative",
+            tooltipX: p50,
+            tooltipY: p50,
+            tooltipPosition: "fixed",
+            isMeasured: true
+        });
+        r("Sprite").states.create("default", { "visible": true, opacity: 1 });
+        r("Container").setAll({
+            interactiveChildren: true,
+            setStateOnChildren: false
+        });
+        r("Graphics").setAll({
+            strokeWidth: 1
+        });
+        r("Chart").setAll({
+            width: p100,
+            height: p100,
+            interactiveChildren: false
+        });
+        /**
+         * ------------------------------------------------------------------------
+         * core: alignment
+         * ------------------------------------------------------------------------
+         */
+        r("Sprite", ["horizontal", "center"]).setAll({
+            centerX: p50,
+            x: p50
+        });
+        r("Sprite", ["vertical", "center"]).setAll({
+            centerY: p50,
+            y: p50
+        });
+        r("Container", ["horizontal", "layout"]).setAll({
+            layout: horizontalLayout
+        });
+        r("Container", ["vertical", "layout"]).setAll({
+            layout: verticalLayout
+        });
+        /**
+         * ------------------------------------------------------------------------
+         * core: patterns
+         * ------------------------------------------------------------------------
+         */
+        r("Pattern").setAll({
+            repetition: "repeat",
+            width: 50,
+            height: 50,
+            rotation: 0,
+            fillOpacity: 1
+        });
+        r("LinePattern").setAll({
+            gap: 6,
+            colorOpacity: 1,
+            width: 49,
+            height: 49
+        });
+        r("RectanglePattern").setAll({
+            gap: 6,
+            checkered: false,
+            centered: true,
+            maxWidth: 5,
+            maxHeight: 5,
+            width: 48,
+            height: 48,
+            strokeWidth: 0
+        });
+        r("CirclePattern").setAll({
+            gap: 5,
+            checkered: false,
+            centered: false,
+            radius: 3,
+            strokeWidth: 0,
+            width: 45,
+            height: 45
+        });
+        /**
+         * ------------------------------------------------------------------------
+         * core: gradients
+         * ------------------------------------------------------------------------
+         */
+        r("LinearGradient").setAll({
+            rotation: 90
+        });
+        /**
+         * ------------------------------------------------------------------------
+         * core: Legend
+         * ------------------------------------------------------------------------
+         */
+        r("Legend").setAll({
+            fillField: "fill",
+            strokeField: "stroke",
+            nameField: "name",
+            layout: GridLayout.new(this._root, {}),
+            layer: 30,
+            clickTarget: "itemContainer"
+        });
+        // Class: Container
+        r("Container", ["legend", "item", "itemcontainer"]).setAll({
+            paddingLeft: 5,
+            paddingRight: 5,
+            paddingBottom: 5,
+            paddingTop: 5,
+            layout: horizontalLayout,
+            setStateOnChildren: true,
+            interactiveChildren: false,
+            ariaChecked: true,
+            focusable: true,
+            ariaLabel: language.translate("Press ENTER to toggle"),
+            role: "checkbox"
+        });
+        {
+            const rule = r("Rectangle", ["legend", "item", "background"]);
+            rule.setAll({
+                fillOpacity: 0,
+            });
+            setColor(rule, "fill", ic, "background");
+        }
+        r("Container", ["legend", "marker"]).setAll({
+            setStateOnChildren: true,
+            centerY: p50,
+            paddingLeft: 0,
+            paddingRight: 0,
+            paddingBottom: 0,
+            paddingTop: 0,
+            width: 18,
+            height: 18
+        });
+        r("RoundedRectangle", ["legend", "marker", "rectangle"]).setAll({
+            width: p100,
+            height: p100,
+            cornerRadiusBL: 3,
+            cornerRadiusTL: 3,
+            cornerRadiusBR: 3,
+            cornerRadiusTR: 3
+        });
+        {
+            const rule = r("RoundedRectangle", ["legend", "marker", "rectangle"]).states.create("disabled", {});
+            setColor(rule, "fill", ic, "disabled");
+            setColor(rule, "stroke", ic, "disabled");
+        }
+        r("Label", ["legend", "label"]).setAll({
+            centerY: p50,
+            marginLeft: 5,
+            paddingRight: 0,
+            paddingLeft: 0,
+            paddingTop: 0,
+            paddingBottom: 0,
+            populateText: true
+        });
+        {
+            const rule = r("Label", ["legend", "label"]).states.create("disabled", {});
+            setColor(rule, "fill", ic, "disabled");
+        }
+        r("Label", ["legend", "value", "label"]).setAll({
+            centerY: p50,
+            marginLeft: 5,
+            paddingRight: 0,
+            paddingLeft: 0,
+            paddingTop: 0,
+            paddingBottom: 0,
+            width: 50,
+            centerX: p100,
+            populateText: true
+        });
+        {
+            const rule = r("Label", ["legend", "value", "label"]).states.create("disabled", {});
+            setColor(rule, "fill", ic, "disabled");
+        }
+        /**
+         * ------------------------------------------------------------------------
+         * core: HeatLegend
+         * ------------------------------------------------------------------------
+         */
+        r("HeatLegend").setAll({
+            stepCount: 1
+        });
+        r("RoundedRectangle", ["heatlegend", "marker"]).setAll({
+            cornerRadiusTR: 0,
+            cornerRadiusBR: 0,
+            cornerRadiusTL: 0,
+            cornerRadiusBL: 0
+        });
+        r("RoundedRectangle", ["vertical", "heatlegend", "marker"]).setAll({
+            height: p100,
+            width: 15
+        });
+        r("RoundedRectangle", ["horizontal", "heatlegend", "marker"]).setAll({
+            width: p100,
+            height: 15
+        });
+        r("HeatLegend", ["vertical"]).setAll({
+            height: p100
+        });
+        r("HeatLegend", ["horizontal"]).setAll({
+            width: p100
+        });
+        r("Label", ["heatlegend", "start"]).setAll({
+            paddingLeft: 5,
+            paddingRight: 5,
+            paddingTop: 5,
+            paddingBottom: 5
+        });
+        r("Label", ["heatlegend", "end"]).setAll({
+            paddingLeft: 5,
+            paddingRight: 5,
+            paddingTop: 5,
+            paddingBottom: 5
+        });
+        /**
+         * ------------------------------------------------------------------------
+         * core: Labels
+         * ------------------------------------------------------------------------
+         */
+        {
+            const rule = r("Label");
+            rule.setAll({
+                paddingTop: 8,
+                paddingBottom: 8,
+                paddingLeft: 10,
+                paddingRight: 10,
+                fontFamily: "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"",
+                fontSize: "1em",
+                populateText: false
             });
-            r("RoundedRectangle", ["legend", "marker", "rectangle"]).setAll({
-                width: p100,
-                height: p100,
-                cornerRadiusBL: 3,
-                cornerRadiusTL: 3,
-                cornerRadiusBR: 3,
-                cornerRadiusTR: 3
+            setColor(rule, "fill", ic, "text");
+        }
+        r("RadialLabel").setAll({
+            textType: "regular",
+            centerY: p50,
+            centerX: p50,
+            inside: false,
+            radius: 0,
+            baseRadius: p100,
+            orientation: "auto",
+            textAlign: "center"
+        });
+        /**
+         * ------------------------------------------------------------------------
+         * core: Elements and shapes
+         * ------------------------------------------------------------------------
+         */
+        r("RoundedRectangle").setAll({
+            cornerRadiusTL: 8,
+            cornerRadiusBL: 8,
+            cornerRadiusTR: 8,
+            cornerRadiusBR: 8
+        });
+        r("PointedRectangle").setAll({
+            pointerBaseWidth: 15,
+            pointerLength: 10,
+            cornerRadius: 8
+        });
+        r("Slice").setAll({
+            shiftRadius: 0,
+            dRadius: 0,
+            dInnerRadius: 0
+        });
+        {
+            const rule = r("Tick");
+            rule.setAll({
+                strokeOpacity: .15,
+                isMeasured: false,
+                length: 4.5,
+                position: "absolute"
+            });
+            setColor(rule, "stroke", ic, "grid");
+        }
+        r("Bullet").setAll({
+            locationX: 0.5,
+            locationY: 0.5
+        });
+        /**
+         * ------------------------------------------------------------------------
+         * core: Tooltip
+         * ------------------------------------------------------------------------
+         */
+        r("Tooltip").setAll({
+            position: "absolute",
+            getFillFromSprite: true,
+            getStrokeFromSprite: false,
+            autoTextColor: true,
+            paddingTop: 9,
+            paddingBottom: 8,
+            paddingLeft: 10,
+            paddingRight: 10,
+            marginBottom: 5,
+            pointerOrientation: "vertical",
+            centerX: p50,
+            centerY: p50,
+            animationEasing: $ease.out($ease.cubic),
+            exportable: false
+            //layer: 100
+        });
+        {
+            const rule = r("PointedRectangle", ["tooltip", "background"]);
+            rule.setAll({
+                strokeOpacity: 0.9,
+                cornerRadius: 4,
+                pointerLength: 4,
+                pointerBaseWidth: 8,
+                fillOpacity: 0.9,
+                stroke: Color.fromHex(0xffffff)
             });
-            {
-                var rule = r("RoundedRectangle", ["legend", "marker", "rectangle"]).states.create("disabled", {});
-                setColor(rule, "fill", ic, "disabled");
-                setColor(rule, "stroke", ic, "disabled");
-            }
-            r("Label", ["legend", "label"]).setAll({
-                centerY: p50,
-                marginLeft: 5,
+        }
+        {
+            const rule = r("Label", ["tooltip"]);
+            rule.setAll({
+                role: "tooltip",
+                populateText: true,
                 paddingRight: 0,
-                paddingLeft: 0,
                 paddingTop: 0,
-                paddingBottom: 0,
-                populateText: true
-            });
-            {
-                var rule = r("Label", ["legend", "label"]).states.create("disabled", {});
-                setColor(rule, "fill", ic, "disabled");
-            }
-            r("Label", ["legend", "value", "label"]).setAll({
-                centerY: p50,
-                marginLeft: 5,
-                paddingRight: 0,
                 paddingLeft: 0,
-                paddingTop: 0,
-                paddingBottom: 0,
-                width: 50,
-                centerX: p100,
-                populateText: true
-            });
-            {
-                var rule = r("Label", ["legend", "value", "label"]).states.create("disabled", {});
-                setColor(rule, "fill", ic, "disabled");
-            }
-            /**
-             * ------------------------------------------------------------------------
-             * core: HeatLegend
-             * ------------------------------------------------------------------------
-             */
-            r("HeatLegend").setAll({
-                stepCount: 1
-            });
-            r("RoundedRectangle", ["heatlegend", "marker"]).setAll({
-                cornerRadiusTR: 0,
-                cornerRadiusBR: 0,
-                cornerRadiusTL: 0,
-                cornerRadiusBL: 0
-            });
-            r("RoundedRectangle", ["vertical", "heatlegend", "marker"]).setAll({
-                height: p100,
-                width: 15
-            });
-            r("RoundedRectangle", ["horizontal", "heatlegend", "marker"]).setAll({
-                width: p100,
-                height: 15
-            });
-            r("HeatLegend", ["vertical"]).setAll({
-                height: p100
+                paddingBottom: 0
             });
-            r("HeatLegend", ["horizontal"]).setAll({
-                width: p100
-            });
-            r("Label", ["heatlegend", "start"]).setAll({
-                paddingLeft: 5,
-                paddingRight: 5,
-                paddingTop: 5,
-                paddingBottom: 5
+            setColor(rule, "fill", ic, "alternativeText");
+        }
+        /**
+         * ------------------------------------------------------------------------
+         * core: Button
+         * ------------------------------------------------------------------------
+         */
+        r("Button").setAll({
+            paddingTop: 8,
+            paddingBottom: 8,
+            paddingLeft: 10,
+            paddingRight: 10,
+            interactive: true,
+            layout: horizontalLayout,
+            interactiveChildren: false,
+            setStateOnChildren: true,
+            focusable: true
+        });
+        r("Button").states.create("hover", {});
+        r("Button").states.create("down", { stateAnimationDuration: 0 });
+        r("Button").states.create("active", {});
+        {
+            const rule = r("RoundedRectangle", ["button", "background"]);
+            setColor(rule, "fill", ic, "primaryButton");
+            setColor(rule, "stroke", ic, "primaryButtonStroke");
+        }
+        {
+            const rule = r("RoundedRectangle", ["button", "background"]).states.create("hover", {});
+            setColor(rule, "fill", ic, "primaryButtonHover");
+        }
+        {
+            const rule = r("RoundedRectangle", ["button", "background"]).states.create("down", { stateAnimationDuration: 0 });
+            setColor(rule, "fill", ic, "primaryButtonDown");
+        }
+        {
+            const rule = r("RoundedRectangle", ["button", "background"]).states.create("active", {});
+            setColor(rule, "fill", ic, "primaryButtonActive");
+        }
+        {
+            const rule = r("Graphics", ["button", "icon"]);
+            setColor(rule, "stroke", ic, "primaryButtonText");
+        }
+        {
+            const rule = r("Label", ["button"]);
+            setColor(rule, "fill", ic, "primaryButtonText");
+        }
+        /**
+         * ------------------------------------------------------------------------
+         * charts/xy: ZoomOutButton
+         * ------------------------------------------------------------------------
+         */
+        r("Button", ["zoom"]).setAll({
+            paddingTop: 18,
+            paddingBottom: 18,
+            paddingLeft: 12,
+            paddingRight: 12,
+            centerX: 46,
+            centerY: -10,
+            y: 0,
+            x: p100,
+            role: "button",
+            ariaLabel: language.translate("Zoom Out"),
+            layer: 30
+        });
+        {
+            const rule = r("RoundedRectangle", ["background", "button", "zoom"]);
+            rule.setAll({
+                cornerRadiusBL: 40,
+                cornerRadiusBR: 40,
+                cornerRadiusTL: 40,
+                cornerRadiusTR: 40
+            });
+            setColor(rule, "fill", ic, "primaryButton");
+        }
+        {
+            const rule = r("RoundedRectangle", ["background", "button", "zoom"]).states.create("hover", {});
+            setColor(rule, "fill", ic, "primaryButtonHover");
+        }
+        {
+            const rule = r("RoundedRectangle", ["background", "button", "zoom"]).states.create("down", { stateAnimationDuration: 0 });
+            setColor(rule, "fill", ic, "primaryButtonDown");
+        }
+        {
+            const rule = r("Graphics", ["icon", "button", "zoom"]);
+            rule.setAll({
+                crisp: true,
+                strokeOpacity: 0.7,
+                draw: (display) => {
+                    display.moveTo(0, 0);
+                    display.lineTo(12, 0);
+                }
             });
-            r("Label", ["heatlegend", "end"]).setAll({
-                paddingLeft: 5,
-                paddingRight: 5,
-                paddingTop: 5,
-                paddingBottom: 5
+            setColor(rule, "stroke", ic, "primaryButtonText");
+        }
+        /**
+         * ------------------------------------------------------------------------
+         * core: ResizeButton
+         * ------------------------------------------------------------------------
+         */
+        r("Button", ["resize"]).setAll({
+            paddingTop: 9,
+            paddingBottom: 9,
+            paddingLeft: 13,
+            paddingRight: 13,
+            draggable: true,
+            centerX: p50,
+            centerY: p50,
+            position: "absolute",
+            role: "slider",
+            ariaValueMin: "0",
+            ariaValueMax: "100",
+            ariaLabel: language.translate("Use up and down arrows to move selection")
+        });
+        {
+            const rule = r("RoundedRectangle", ["background", "resize", "button"]);
+            rule.setAll({
+                cornerRadiusBL: 40,
+                cornerRadiusBR: 40,
+                cornerRadiusTL: 40,
+                cornerRadiusTR: 40
+            });
+            setColor(rule, "fill", ic, "secondaryButton");
+            setColor(rule, "stroke", ic, "secondaryButtonStroke");
+        }
+        {
+            const rule = r("RoundedRectangle", ["background", "resize", "button"]).states.create("hover", {});
+            setColor(rule, "fill", ic, "secondaryButtonHover");
+        }
+        {
+            const rule = r("RoundedRectangle", ["background", "resize", "button"]).states.create("down", { stateAnimationDuration: 0 });
+            setColor(rule, "fill", ic, "secondaryButtonDown");
+        }
+        {
+            const rule = r("Graphics", ["resize", "button", "icon"]);
+            rule.setAll({
+                crisp: true,
+                strokeOpacity: 0.5,
+                draw: (display) => {
+                    display.moveTo(0, 0.5);
+                    display.lineTo(0, 12.5);
+                    display.moveTo(4, 0.5);
+                    display.lineTo(4, 12.5);
+                }
             });
-            /**
-             * ------------------------------------------------------------------------
-             * core: Labels
-             * ------------------------------------------------------------------------
-             */
-            {
-                var rule = r("Label");
-                rule.setAll({
-                    paddingTop: 8,
-                    paddingBottom: 8,
-                    paddingLeft: 10,
-                    paddingRight: 10,
-                    fontFamily: "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"",
-                    fontSize: "1em",
-                    populateText: false
-                });
-                setColor(rule, "fill", ic, "text");
-            }
-            r("RadialLabel").setAll({
-                textType: "regular",
-                centerY: p50,
-                centerX: p50,
-                inside: false,
-                radius: 0,
-                baseRadius: p100,
-                orientation: "auto",
-                textAlign: "center"
+            setColor(rule, "stroke", ic, "secondaryButtonText");
+        }
+        r("Button", ["resize", "vertical"]).setAll({
+            rotation: 90,
+            cursorOverStyle: "ns-resize"
+        });
+        r("Button", ["resize", "horizontal"]).setAll({
+            cursorOverStyle: "ew-resize"
+        });
+        /**
+         * ------------------------------------------------------------------------
+         * core: PlayButton
+         * ------------------------------------------------------------------------
+         */
+        r("Button", ["play"]).setAll({
+            paddingTop: 13,
+            paddingBottom: 13,
+            paddingLeft: 14,
+            paddingRight: 14,
+            ariaLabel: language.translate("Play"),
+            toggleKey: "active"
+        });
+        {
+            const rule = r("RoundedRectangle", ["play", "background"]);
+            rule.setAll({
+                strokeOpacity: 0.5,
+                cornerRadiusBL: 100,
+                cornerRadiusBR: 100,
+                cornerRadiusTL: 100,
+                cornerRadiusTR: 100
+            });
+            setColor(rule, "fill", ic, "primaryButton");
+        }
+        {
+            const rule = r("Graphics", ["play", "icon"]);
+            rule.setAll({
+                stateAnimationDuration: 0,
+                dx: 1,
+                draw: (display) => {
+                    display.moveTo(0, -5);
+                    display.lineTo(8, 0);
+                    display.lineTo(0, 5);
+                    display.lineTo(0, -5);
+                }
             });
-            /**
-             * ------------------------------------------------------------------------
-             * core: Elements and shapes
-             * ------------------------------------------------------------------------
-             */
-            r("RoundedRectangle").setAll({
+            setColor(rule, "fill", ic, "primaryButtonText");
+        }
+        r("Graphics", ["play", "icon"]).states.create("default", {
+            stateAnimationDuration: 0
+        });
+        r("Graphics", ["play", "icon"]).states.create("active", {
+            stateAnimationDuration: 0,
+            draw: (display) => {
+                display.moveTo(-4, -5);
+                display.lineTo(-1, -5);
+                display.lineTo(-1, 5);
+                display.lineTo(-4, 5);
+                display.lineTo(-4, -5);
+                display.moveTo(4, -5);
+                display.lineTo(1, -5);
+                display.lineTo(1, 5);
+                display.lineTo(4, 5);
+                display.lineTo(4, -5);
+            }
+        });
+        /**
+         * ------------------------------------------------------------------------
+         * core: SwitchButton
+         * ------------------------------------------------------------------------
+         */
+        r("Button", ["switch"]).setAll({
+            paddingTop: 4,
+            paddingBottom: 4,
+            paddingLeft: 4,
+            paddingRight: 4,
+            ariaLabel: language.translate("Press ENTER to toggle"),
+            toggleKey: "active",
+            width: 40,
+            height: 24,
+            layout: null
+        });
+        {
+            const rule = r("RoundedRectangle", ["switch", "background"]);
+            rule.setAll({
+                strokeOpacity: 0.5,
+                cornerRadiusBL: 100,
+                cornerRadiusBR: 100,
+                cornerRadiusTL: 100,
+                cornerRadiusTR: 100
+            });
+            setColor(rule, "fill", ic, "primaryButton");
+        }
+        {
+            const rule = r("Circle", ["switch", "icon"]);
+            rule.setAll({
+                radius: 8,
+                centerY: 0,
+                centerX: 0,
+                dx: 0
+            });
+            setColor(rule, "fill", ic, "primaryButtonText");
+        }
+        r("Graphics", ["switch", "icon"]).states.create("active", {
+            dx: 16
+        });
+        /**
+         * ------------------------------------------------------------------------
+         * core: Scrollbar
+         * ------------------------------------------------------------------------
+         */
+        r("Scrollbar").setAll({
+            start: 0,
+            end: 1,
+            layer: 30,
+            animationEasing: $ease.out($ease.cubic)
+        });
+        r("Scrollbar", ["vertical"]).setAll({
+            marginRight: 13,
+            marginLeft: 13,
+            minWidth: 12,
+            height: p100
+        });
+        r("Scrollbar", ["horizontal"]).setAll({
+            marginTop: 13,
+            marginBottom: 13,
+            minHeight: 12,
+            width: p100
+        });
+        this.rule("Button", ["scrollbar"]).setAll({
+            exportable: false
+        });
+        {
+            const rule = r("RoundedRectangle", ["scrollbar", "main", "background"]);
+            rule.setAll({
                 cornerRadiusTL: 8,
                 cornerRadiusBL: 8,
                 cornerRadiusTR: 8,
-                cornerRadiusBR: 8
+                cornerRadiusBR: 8,
+                fillOpacity: 0.8,
             });
-            r("PointedRectangle").setAll({
-                pointerBaseWidth: 15,
-                pointerLength: 10,
-                cornerRadius: 8
-            });
-            r("Slice").setAll({
-                shiftRadius: 0,
-                dRadius: 0,
-                dInnerRadius: 0
-            });
-            {
-                var rule = r("Tick");
-                rule.setAll({
-                    strokeOpacity: .15,
-                    isMeasured: false,
-                    length: 4.5,
-                    position: "absolute"
-                });
-                setColor(rule, "stroke", ic, "grid");
-            }
-            r("Bullet").setAll({
-                locationX: 0.5,
-                locationY: 0.5
-            });
-            /**
-             * ------------------------------------------------------------------------
-             * core: Tooltip
-             * ------------------------------------------------------------------------
-             */
-            r("Tooltip").setAll({
-                position: "absolute",
-                getFillFromSprite: true,
-                getStrokeFromSprite: false,
-                autoTextColor: true,
-                paddingTop: 9,
-                paddingBottom: 8,
-                paddingLeft: 10,
-                paddingRight: 10,
-                marginBottom: 5,
-                pointerOrientation: "vertical",
-                centerX: p50,
-                centerY: p50,
-                animationEasing: $ease.out($ease.cubic),
-                exportable: false
-                //layer: 100
-            });
-            {
-                var rule = r("PointedRectangle", ["tooltip", "background"]);
-                rule.setAll({
-                    strokeOpacity: 0.9,
-                    cornerRadius: 4,
-                    pointerLength: 4,
-                    pointerBaseWidth: 8,
-                    fillOpacity: 0.9,
-                    stroke: Color.fromHex(0xffffff)
-                });
-            }
-            {
-                var rule = r("Label", ["tooltip"]);
-                rule.setAll({
-                    role: "tooltip",
-                    populateText: true,
-                    paddingRight: 0,
-                    paddingTop: 0,
-                    paddingLeft: 0,
-                    paddingBottom: 0
-                });
-                setColor(rule, "fill", ic, "alternativeText");
-            }
-            /**
-             * ------------------------------------------------------------------------
-             * core: Button
-             * ------------------------------------------------------------------------
-             */
-            r("Button").setAll({
-                paddingTop: 8,
-                paddingBottom: 8,
-                paddingLeft: 10,
-                paddingRight: 10,
-                interactive: true,
-                layout: horizontalLayout,
-                interactiveChildren: false,
-                setStateOnChildren: true,
-                focusable: true
-            });
-            r("Button").states.create("hover", {});
-            r("Button").states.create("down", { stateAnimationDuration: 0 });
-            r("Button").states.create("active", {});
-            {
-                var rule = r("RoundedRectangle", ["button", "background"]);
-                setColor(rule, "fill", ic, "primaryButton");
-                setColor(rule, "stroke", ic, "primaryButtonStroke");
-            }
-            {
-                var rule = r("RoundedRectangle", ["button", "background"]).states.create("hover", {});
-                setColor(rule, "fill", ic, "primaryButtonHover");
-            }
-            {
-                var rule = r("RoundedRectangle", ["button", "background"]).states.create("down", { stateAnimationDuration: 0 });
-                setColor(rule, "fill", ic, "primaryButtonDown");
-            }
-            {
-                var rule = r("RoundedRectangle", ["button", "background"]).states.create("active", {});
-                setColor(rule, "fill", ic, "primaryButtonActive");
-            }
-            {
-                var rule = r("Graphics", ["button", "icon"]);
-                setColor(rule, "stroke", ic, "primaryButtonText");
-            }
-            {
-                var rule = r("Label", ["button"]);
-                setColor(rule, "fill", ic, "primaryButtonText");
-            }
-            /**
-             * ------------------------------------------------------------------------
-             * charts/xy: ZoomOutButton
-             * ------------------------------------------------------------------------
-             */
-            r("Button", ["zoom"]).setAll({
-                paddingTop: 18,
-                paddingBottom: 18,
-                paddingLeft: 12,
-                paddingRight: 12,
-                centerX: 46,
-                centerY: -10,
-                y: 0,
-                x: p100,
-                role: "button",
-                ariaLabel: language.translate("Zoom Out"),
-                layer: 30
-            });
-            {
-                var rule = r("RoundedRectangle", ["background", "button", "zoom"]);
-                rule.setAll({
-                    cornerRadiusBL: 40,
-                    cornerRadiusBR: 40,
-                    cornerRadiusTL: 40,
-                    cornerRadiusTR: 40
-                });
-                setColor(rule, "fill", ic, "primaryButton");
-            }
-            {
-                var rule = r("RoundedRectangle", ["background", "button", "zoom"]).states.create("hover", {});
-                setColor(rule, "fill", ic, "primaryButtonHover");
-            }
-            {
-                var rule = r("RoundedRectangle", ["background", "button", "zoom"]).states.create("down", { stateAnimationDuration: 0 });
-                setColor(rule, "fill", ic, "primaryButtonDown");
-            }
-            {
-                var rule = r("Graphics", ["icon", "button", "zoom"]);
-                rule.setAll({
-                    strokeOpacity: 0.7,
-                    draw: function (display) {
-                        display.moveTo(0, 0);
-                        display.lineTo(12, 0);
-                    }
-                });
-                setColor(rule, "stroke", ic, "primaryButtonText");
-            }
-            /**
-             * ------------------------------------------------------------------------
-             * core: ResizeButton
-             * ------------------------------------------------------------------------
-             */
-            r("Button", ["resize"]).setAll({
-                paddingTop: 9,
-                paddingBottom: 9,
-                paddingLeft: 13,
-                paddingRight: 13,
-                draggable: true,
-                centerX: p50,
-                centerY: p50,
-                position: "absolute",
+            setColor(rule, "fill", ic, "fill");
+        }
+        {
+            const rule = r("RoundedRectangle", ["scrollbar", "thumb"]);
+            rule.setAll({
                 role: "slider",
-                ariaValueMin: "0",
-                ariaValueMax: "100",
-                ariaLabel: language.translate("Use up and down arrows to move selection")
-            });
-            {
-                var rule = r("RoundedRectangle", ["background", "resize", "button"]);
-                rule.setAll({
-                    cornerRadiusBL: 40,
-                    cornerRadiusBR: 40,
-                    cornerRadiusTL: 40,
-                    cornerRadiusTR: 40
-                });
-                setColor(rule, "fill", ic, "secondaryButton");
-                setColor(rule, "stroke", ic, "secondaryButtonStroke");
-            }
-            {
-                var rule = r("RoundedRectangle", ["background", "resize", "button"]).states.create("hover", {});
-                setColor(rule, "fill", ic, "secondaryButtonHover");
-            }
-            {
-                var rule = r("RoundedRectangle", ["background", "resize", "button"]).states.create("down", { stateAnimationDuration: 0 });
-                setColor(rule, "fill", ic, "secondaryButtonDown");
-            }
-            {
-                var rule = r("Graphics", ["resize", "button", "icon"]);
-                rule.setAll({
-                    strokeOpacity: 0.7,
-                    draw: function (display) {
-                        display.moveTo(0, 0);
-                        display.lineTo(0, 12);
-                        display.moveTo(4, 0);
-                        display.lineTo(4, 12);
-                    }
-                });
-                setColor(rule, "stroke", ic, "secondaryButtonText");
-            }
-            r("Button", ["resize", "vertical"]).setAll({
-                rotation: 90,
-                cursorOverStyle: "ns-resize"
-            });
-            r("Button", ["resize", "horizontal"]).setAll({
-                cursorOverStyle: "ew-resize"
-            });
-            /**
-             * ------------------------------------------------------------------------
-             * core: PlayButton
-             * ------------------------------------------------------------------------
-             */
-            r("Button", ["play"]).setAll({
-                paddingTop: 13,
-                paddingBottom: 13,
-                paddingLeft: 14,
-                paddingRight: 14,
-                ariaLabel: language.translate("Play"),
-                toggleKey: "active"
-            });
-            {
-                var rule = r("RoundedRectangle", ["play", "background"]);
-                rule.setAll({
-                    strokeOpacity: 0.5,
-                    cornerRadiusBL: 100,
-                    cornerRadiusBR: 100,
-                    cornerRadiusTL: 100,
-                    cornerRadiusTR: 100
-                });
-                setColor(rule, "fill", ic, "primaryButton");
-            }
-            {
-                var rule = r("Graphics", ["play", "icon"]);
-                rule.setAll({
-                    stateAnimationDuration: 0,
-                    dx: 1,
-                    draw: function (display) {
-                        display.moveTo(0, -5);
-                        display.lineTo(8, 0);
-                        display.lineTo(0, 5);
-                        display.lineTo(0, -5);
-                    }
-                });
-                setColor(rule, "fill", ic, "primaryButtonText");
-            }
-            r("Graphics", ["play", "icon"]).states.create("default", {
-                stateAnimationDuration: 0
-            });
-            r("Graphics", ["play", "icon"]).states.create("active", {
-                stateAnimationDuration: 0,
-                draw: function (display) {
-                    display.moveTo(-4, -5);
-                    display.lineTo(-1, -5);
-                    display.lineTo(-1, 5);
-                    display.lineTo(-4, 5);
-                    display.lineTo(-4, -5);
-                    display.moveTo(4, -5);
-                    display.lineTo(1, -5);
-                    display.lineTo(1, 5);
-                    display.lineTo(4, 5);
-                    display.lineTo(4, -5);
-                }
-            });
-            /**
-             * ------------------------------------------------------------------------
-             * core: SwitchButton
-             * ------------------------------------------------------------------------
-             */
-            r("Button", ["switch"]).setAll({
-                paddingTop: 4,
-                paddingBottom: 4,
-                paddingLeft: 4,
-                paddingRight: 4,
-                ariaLabel: language.translate("Press ENTER to toggle"),
-                toggleKey: "active",
-                width: 40,
-                height: 24,
-                layout: null
-            });
-            {
-                var rule = r("RoundedRectangle", ["switch", "background"]);
-                rule.setAll({
-                    strokeOpacity: 0.5,
-                    cornerRadiusBL: 100,
-                    cornerRadiusBR: 100,
-                    cornerRadiusTL: 100,
-                    cornerRadiusTR: 100
-                });
-                setColor(rule, "fill", ic, "primaryButton");
-            }
-            {
-                var rule = r("Circle", ["switch", "icon"]);
-                rule.setAll({
-                    radius: 8,
-                    centerY: 0,
-                    centerX: 0,
-                    dx: 0
-                });
-                setColor(rule, "fill", ic, "primaryButtonText");
-            }
-            r("Graphics", ["switch", "icon"]).states.create("active", {
-                dx: 16
-            });
-            /**
-             * ------------------------------------------------------------------------
-             * core: Scrollbar
-             * ------------------------------------------------------------------------
-             */
-            r("Scrollbar").setAll({
-                start: 0,
-                end: 1,
-                layer: 30,
-                animationEasing: $ease.out($ease.cubic)
-            });
-            r("Scrollbar", ["vertical"]).setAll({
-                marginRight: 13,
-                marginLeft: 13,
-                minWidth: 12,
-                height: p100
-            });
-            r("Scrollbar", ["horizontal"]).setAll({
-                marginTop: 13,
-                marginBottom: 13,
-                minHeight: 12,
-                width: p100
-            });
-            this.rule("Button", ["scrollbar"]).setAll({
-                exportable: false
-            });
-            {
-                var rule = r("RoundedRectangle", ["scrollbar", "main", "background"]);
-                rule.setAll({
-                    cornerRadiusTL: 8,
-                    cornerRadiusBL: 8,
-                    cornerRadiusTR: 8,
-                    cornerRadiusBR: 8,
-                    fillOpacity: 0.8,
-                });
-                setColor(rule, "fill", ic, "fill");
-            }
-            {
-                var rule = r("RoundedRectangle", ["scrollbar", "thumb"]);
-                rule.setAll({
-                    role: "slider",
-                    ariaLive: "polite",
-                    position: "absolute",
-                    draggable: true
-                });
-                setColor(rule, "fill", ic, "secondaryButton");
-            }
-            {
-                var rule = r("RoundedRectangle", ["scrollbar", "thumb"]).states.create("hover", {});
-                setColor(rule, "fill", ic, "secondaryButtonHover");
-            }
-            {
-                var rule = r("RoundedRectangle", ["scrollbar", "thumb"]).states.create("down", { stateAnimationDuration: 0 });
-                setColor(rule, "fill", ic, "secondaryButtonDown");
-            }
-            r("RoundedRectangle", ["scrollbar", "thumb", "vertical"]).setAll({
-                x: p50,
-                width: p100,
-                centerX: p50,
-                ariaLabel: language.translate("Use up and down arrows to move selection")
-            });
-            r("RoundedRectangle", ["scrollbar", "thumb", "horizontal"]).setAll({
-                y: p50,
-                centerY: p50,
-                height: p100,
-                ariaLabel: language.translate("Use left and right arrows to move selection")
-            });
-            // @todo: is this needed? used to be "ContentScrollbar"
-            // r("Scrollbar", ["content?"]).setAll({
-            // 	marginRight: 0,
-            // 	marginLeft: 5,
-            // 	layer: 5
-            // });
-            /**
-             * ========================================================================
-             * charts/xy
-             * ========================================================================
-             *
-             * This needs to be in DefaultTheme because it's the only theme that is
-             * automatically applied to Root, and tooltips different ancestors
-             * than actual charts using them.
-             */
-            {
-                var rule = r("PointedRectangle", ["axis", "tooltip", "background"]);
-                rule.setAll({
-                    cornerRadius: 0
-                });
-                setColor(rule, "fill", ic, "alternativeBackground");
-            }
-            r("Label", ["axis", "tooltip"]).setAll({
-                role: undefined
-            });
-            r("Label", ["axis", "tooltip", "y"]).setAll({
-                textAlign: "right"
-            });
-            r("Label", ["axis", "tooltip", "y", "opposite"]).setAll({
-                textAlign: "left"
-            });
-            r("Label", ["axis", "tooltip", "x"]).setAll({
-                textAlign: "center"
-            });
-            r("Tooltip", ["categoryaxis"]).setAll({
-                labelText: "{category}"
-            });
-            /**
-             * ------------------------------------------------------------------------
-             * Shapes
-             * ------------------------------------------------------------------------
-             */
-            // Class: Graphics
-            r("Star").setAll({
-                spikes: 5,
-                innerRadius: 5,
-                radius: 10
-            });
-            // STOCK
-            r("Tooltip", ["stock"]).setAll({
-                paddingTop: 6,
-                paddingBottom: 5,
-                paddingLeft: 7,
-                paddingRight: 7
-            });
-            r("PointedRectangle", ["tooltip", "stock", "axis"]).setAll({
-                pointerLength: 0,
-                pointerBaseWidth: 0,
-                cornerRadius: 3
-            });
-            r("Label", ["tooltip", "stock"]).setAll({
-                fontSize: "0.8em"
-            });
-            // resizer
-            r("SpriteResizer").setAll({
-                rotationStep: 10
-            });
-            {
-                var rule = r("Container", ["resizer", "grip"]);
-                rule.states.create("hover", {});
-            }
-            {
-                var rule = r("RoundedRectangle", ["resizer", "grip"]);
-                rule.setAll({
-                    strokeOpacity: 0.7,
-                    strokeWidth: 1,
-                    fillOpacity: 1,
-                    width: 12,
-                    height: 12
-                });
-                setColor(rule, "fill", ic, "background");
-                setColor(rule, "stroke", ic, "alternativeBackground");
-            }
-            {
-                var rule = r("RoundedRectangle", ["resizer", "grip", "outline"]);
-                rule.setAll({
-                    strokeOpacity: 0,
-                    fillOpacity: 0,
-                    width: 20,
-                    height: 20
-                });
-                rule.states.create("hover", {
-                    fillOpacity: 0.3
-                });
-                setColor(rule, "fill", ic, "alternativeBackground");
-            }
-            r("RoundedRectangle", ["resizer", "grip", "left"]).setAll({
-                cornerRadiusBL: 0,
-                cornerRadiusBR: 0,
-                cornerRadiusTL: 0,
-                cornerRadiusTR: 0
+                ariaLive: "polite",
+                position: "absolute",
+                draggable: true
             });
-            r("RoundedRectangle", ["resizer", "grip", "right"]).setAll({
-                cornerRadiusBL: 0,
-                cornerRadiusBR: 0,
-                cornerRadiusTL: 0,
-                cornerRadiusTR: 0
+            setColor(rule, "fill", ic, "secondaryButton");
+        }
+        {
+            const rule = r("RoundedRectangle", ["scrollbar", "thumb"]).states.create("hover", {});
+            setColor(rule, "fill", ic, "secondaryButtonHover");
+        }
+        {
+            const rule = r("RoundedRectangle", ["scrollbar", "thumb"]).states.create("down", { stateAnimationDuration: 0 });
+            setColor(rule, "fill", ic, "secondaryButtonDown");
+        }
+        r("RoundedRectangle", ["scrollbar", "thumb", "vertical"]).setAll({
+            x: p50,
+            width: p100,
+            centerX: p50,
+            ariaLabel: language.translate("Use up and down arrows to move selection")
+        });
+        r("RoundedRectangle", ["scrollbar", "thumb", "horizontal"]).setAll({
+            y: p50,
+            centerY: p50,
+            height: p100,
+            ariaLabel: language.translate("Use left and right arrows to move selection")
+        });
+        // @todo: is this needed? used to be "ContentScrollbar"
+        // r("Scrollbar", ["content?"]).setAll({
+        // 	marginRight: 0,
+        // 	marginLeft: 5,
+        // 	layer: 5
+        // });
+        /**
+         * ========================================================================
+         * charts/xy
+         * ========================================================================
+         *
+         * This needs to be in DefaultTheme because it's the only theme that is
+         * automatically applied to Root, and tooltips different ancestors
+         * than actual charts using them.
+         */
+        {
+            const rule = r("PointedRectangle", ["axis", "tooltip", "background"]);
+            rule.setAll({
+                cornerRadius: 0
+            });
+            setColor(rule, "fill", ic, "alternativeBackground");
+        }
+        r("Label", ["axis", "tooltip"]).setAll({
+            role: undefined
+        });
+        r("Label", ["axis", "tooltip", "y"]).setAll({
+            textAlign: "right"
+        });
+        r("Label", ["axis", "tooltip", "y", "opposite"]).setAll({
+            textAlign: "left"
+        });
+        r("Label", ["axis", "tooltip", "x"]).setAll({
+            textAlign: "center"
+        });
+        r("Tooltip", ["categoryaxis"]).setAll({
+            labelText: "{category}"
+        });
+        /**
+         * ------------------------------------------------------------------------
+         * Shapes
+         * ------------------------------------------------------------------------
+         */
+        // Class: Graphics
+        r("Star").setAll({
+            spikes: 5,
+            innerRadius: 5,
+            radius: 10
+        });
+        // STOCK
+        r("Tooltip", ["stock"]).setAll({
+            paddingTop: 6,
+            paddingBottom: 5,
+            paddingLeft: 7,
+            paddingRight: 7
+        });
+        r("PointedRectangle", ["tooltip", "stock", "axis"]).setAll({
+            pointerLength: 0,
+            pointerBaseWidth: 0,
+            cornerRadius: 3
+        });
+        r("Label", ["tooltip", "stock"]).setAll({
+            fontSize: "0.8em"
+        });
+        // resizer
+        r("SpriteResizer").setAll({
+            rotationStep: 10
+        });
+        {
+            const rule = r("Container", ["resizer", "grip"]);
+            rule.states.create("hover", {});
+        }
+        {
+            const rule = r("RoundedRectangle", ["resizer", "grip"]);
+            rule.setAll({
+                strokeOpacity: 0.7,
+                strokeWidth: 1,
+                fillOpacity: 1,
+                width: 12,
+                height: 12
+            });
+            setColor(rule, "fill", ic, "background");
+            setColor(rule, "stroke", ic, "alternativeBackground");
+        }
+        {
+            const rule = r("RoundedRectangle", ["resizer", "grip", "outline"]);
+            rule.setAll({
+                strokeOpacity: 0,
+                fillOpacity: 0,
+                width: 20,
+                height: 20
+            });
+            rule.states.create("hover", {
+                fillOpacity: 0.3
+            });
+            setColor(rule, "fill", ic, "alternativeBackground");
+        }
+        r("RoundedRectangle", ["resizer", "grip", "left"]).setAll({
+            cornerRadiusBL: 0,
+            cornerRadiusBR: 0,
+            cornerRadiusTL: 0,
+            cornerRadiusTR: 0
+        });
+        r("RoundedRectangle", ["resizer", "grip", "right"]).setAll({
+            cornerRadiusBL: 0,
+            cornerRadiusBR: 0,
+            cornerRadiusTL: 0,
+            cornerRadiusTR: 0
+        });
+        {
+            const rule = r("Rectangle", ["resizer", "rectangle"]);
+            rule.setAll({
+                strokeDasharray: [2, 2],
+                strokeOpacity: 0.5,
+                strokeWidth: 1
             });
-            {
-                var rule = r("Rectangle", ["resizer", "rectangle"]);
-                rule.setAll({
-                    strokeDasharray: [2, 2],
-                    strokeOpacity: 0.5,
-                    strokeWidth: 1
-                });
-                setColor(rule, "stroke", ic, "alternativeBackground");
-            }
+            setColor(rule, "stroke", ic, "alternativeBackground");
         }
-    });
-    return DefaultTheme;
-}(Theme));
-export { DefaultTheme };
+    }
+}
 //# sourceMappingURL=DefaultTheme.js.map