cx 25.6.0 → 25.6.1

package/src/charts/RangeMarker.js

@@ -1,159 +1,159 @@
-import { BoundedObject } from "../svg/BoundedObject";
-import { Rect } from "../svg/util/Rect";
-import { Widget, VDOM } from "../ui/Widget";
-import { parseStyle } from "../util/parseStyle";
-
-export class RangeMarker extends BoundedObject {
-   declareData() {
-      super.declareData(...arguments, {
-         x: undefined,
-         y: undefined,
-         shape: undefined,
-         vertical: undefined,
-         size: undefined,
-         laneOffset: undefined,
-         lineStyle: { structured: true },
-         lineClass: { structured: true },
-         capSize: undefined,
-         inflate: undefined,
-      });
-   }
-
-   init() {
-      this.lineStyle = parseStyle(this.lineStyle);
-      super.init();
-   }
-
-   prepareData(context, instance) {
-      instance.axes = context.axes;
-      instance.xAxis = context.axes[this.xAxis];
-      instance.yAxis = context.axes[this.yAxis];
-      super.prepareData(context, instance);
-   }
-
-   explore(context, instance) {
-      let { data, xAxis, yAxis } = instance;
-
-      if (this.affectsAxes) {
-         if (xAxis && data.x != null) xAxis.acknowledge(data.x, 0, 0);
-         if (yAxis && data.y != null) yAxis.acknowledge(data.y, 0, 0);
-      }
-
-      super.explore(context, instance);
-   }
-
-   calculateBounds(context, instance) {
-      let { data, xAxis, yAxis } = instance;
-
-      let l, r, t, b;
-
-      if (data.x == null || data.y == null) {
-         return super.calculateBounds(context, instance);
-      }
-
-      if (!this.vertical) {
-         l = xAxis.map(data.x, data.laneOffset - data.size / 2) - data.inflate;
-         r = xAxis.map(data.x, data.laneOffset + data.size / 2) + data.inflate;
-         t = b = yAxis.map(data.y);
-         if (data.shape == "max") {
-            b += data.capSize;
-         } else if (data.shape == "min") {
-            t -= data.capSize;
-         }
-      } else {
-         l = r = xAxis.map(data.x);
-         t = yAxis.map(data.y, data.laneOffset - data.size / 2) + data.inflate;
-         b = yAxis.map(data.y, data.laneOffset + data.size / 2) - data.inflate;
-         if (data.shape == "max") {
-            l -= data.capSize;
-         } else if (data.shape == "min") {
-            r += data.capSize;
-         }
-      }
-
-      return new Rect({
-         l,
-         r,
-         t,
-         b,
-      });
-   }
-
-   prepare(context, instance) {
-      super.prepare(context, instance);
-   }
-
-   render(context, instance, key) {
-      var { data } = instance;
-      let { CSS, baseClass } = this;
-      let { bounds, shape } = data;
-
-      let path = "";
-      if (this.vertical) {
-         switch (shape) {
-            default:
-            case "line":
-               path += `M ${bounds.r} ${bounds.t} `;
-               path += `L ${bounds.r} ${bounds.b}`;
-               break;
-            case "max":
-               path += `M ${bounds.l} ${bounds.t} `;
-               path += `L ${bounds.r} ${bounds.t}`;
-               path += `L ${bounds.r} ${bounds.b}`;
-               path += `L ${bounds.l} ${bounds.b}`;
-               break;
-            case "min":
-               path += `M ${bounds.r} ${bounds.t} `;
-               path += `L ${bounds.l} ${bounds.t}`;
-               path += `L ${bounds.l} ${bounds.b}`;
-               path += `L ${bounds.r} ${bounds.b}`;
-               break;
-         }
-      } else {
-         switch (shape) {
-            default:
-            case "line":
-               path += `M ${bounds.r} ${bounds.t} `;
-               path += `L ${bounds.l} ${bounds.t}`;
-               break;
-            case "max":
-               path += `M ${bounds.l} ${bounds.b} `;
-               path += `L ${bounds.l} ${bounds.t}`;
-               path += `L ${bounds.r} ${bounds.t}`;
-               path += `L ${bounds.r} ${bounds.b}`;
-               break;
-            case "min":
-               path += `M ${bounds.l} ${bounds.t} `;
-               path += `L ${bounds.l} ${bounds.b}`;
-               path += `L ${bounds.r} ${bounds.b}`;
-               path += `L ${bounds.r} ${bounds.t}`;
-               break;
-         }
-      }
-
-      return (
-         <g key={key} className={data.classNames} style={data.style}>
-            <path
-               d={path}
-               className={CSS.expand(CSS.element(baseClass, "path"), data.lineClass)}
-               style={data.lineStyle}
-            />
-            {this.renderChildren(context, instance)}
-         </g>
-      );
-   }
-}
-
-RangeMarker.prototype.baseClass = "rangemarker";
-RangeMarker.prototype.xAxis = "x";
-RangeMarker.prototype.yAxis = "y";
-
-RangeMarker.prototype.shape = "line";
-RangeMarker.prototype.vertical = false;
-RangeMarker.prototype.size = 1;
-RangeMarker.prototype.laneOffset = 0;
-RangeMarker.prototype.capSize = 5;
-RangeMarker.prototype.inflate = 0;
-RangeMarker.prototype.affectsAxes = true;
-
-Widget.alias("range-marker", RangeMarker);
+import { BoundedObject } from "../svg/BoundedObject";
+import { Rect } from "../svg/util/Rect";
+import { Widget, VDOM } from "../ui/Widget";
+import { parseStyle } from "../util/parseStyle";
+
+export class RangeMarker extends BoundedObject {
+   declareData() {
+      super.declareData(...arguments, {
+         x: undefined,
+         y: undefined,
+         shape: undefined,
+         vertical: undefined,
+         size: undefined,
+         laneOffset: undefined,
+         lineStyle: { structured: true },
+         lineClass: { structured: true },
+         capSize: undefined,
+         inflate: undefined,
+      });
+   }
+
+   init() {
+      this.lineStyle = parseStyle(this.lineStyle);
+      super.init();
+   }
+
+   prepareData(context, instance) {
+      instance.axes = context.axes;
+      instance.xAxis = context.axes[this.xAxis];
+      instance.yAxis = context.axes[this.yAxis];
+      super.prepareData(context, instance);
+   }
+
+   explore(context, instance) {
+      let { data, xAxis, yAxis } = instance;
+
+      if (this.affectsAxes) {
+         if (xAxis && data.x != null) xAxis.acknowledge(data.x, 0, 0);
+         if (yAxis && data.y != null) yAxis.acknowledge(data.y, 0, 0);
+      }
+
+      super.explore(context, instance);
+   }
+
+   calculateBounds(context, instance) {
+      let { data, xAxis, yAxis } = instance;
+
+      let l, r, t, b;
+
+      if (data.x == null || data.y == null) {
+         return super.calculateBounds(context, instance);
+      }
+
+      if (!this.vertical) {
+         l = xAxis.map(data.x, data.laneOffset - data.size / 2) - data.inflate;
+         r = xAxis.map(data.x, data.laneOffset + data.size / 2) + data.inflate;
+         t = b = yAxis.map(data.y);
+         if (data.shape == "max") {
+            b += data.capSize;
+         } else if (data.shape == "min") {
+            t -= data.capSize;
+         }
+      } else {
+         l = r = xAxis.map(data.x);
+         t = yAxis.map(data.y, data.laneOffset - data.size / 2) + data.inflate;
+         b = yAxis.map(data.y, data.laneOffset + data.size / 2) - data.inflate;
+         if (data.shape == "max") {
+            l -= data.capSize;
+         } else if (data.shape == "min") {
+            r += data.capSize;
+         }
+      }
+
+      return new Rect({
+         l,
+         r,
+         t,
+         b,
+      });
+   }
+
+   prepare(context, instance) {
+      super.prepare(context, instance);
+   }
+
+   render(context, instance, key) {
+      var { data } = instance;
+      let { CSS, baseClass } = this;
+      let { bounds, shape } = data;
+
+      let path = "";
+      if (this.vertical) {
+         switch (shape) {
+            default:
+            case "line":
+               path += `M ${bounds.r} ${bounds.t} `;
+               path += `L ${bounds.r} ${bounds.b}`;
+               break;
+            case "max":
+               path += `M ${bounds.l} ${bounds.t} `;
+               path += `L ${bounds.r} ${bounds.t}`;
+               path += `L ${bounds.r} ${bounds.b}`;
+               path += `L ${bounds.l} ${bounds.b}`;
+               break;
+            case "min":
+               path += `M ${bounds.r} ${bounds.t} `;
+               path += `L ${bounds.l} ${bounds.t}`;
+               path += `L ${bounds.l} ${bounds.b}`;
+               path += `L ${bounds.r} ${bounds.b}`;
+               break;
+         }
+      } else {
+         switch (shape) {
+            default:
+            case "line":
+               path += `M ${bounds.r} ${bounds.t} `;
+               path += `L ${bounds.l} ${bounds.t}`;
+               break;
+            case "max":
+               path += `M ${bounds.l} ${bounds.b} `;
+               path += `L ${bounds.l} ${bounds.t}`;
+               path += `L ${bounds.r} ${bounds.t}`;
+               path += `L ${bounds.r} ${bounds.b}`;
+               break;
+            case "min":
+               path += `M ${bounds.l} ${bounds.t} `;
+               path += `L ${bounds.l} ${bounds.b}`;
+               path += `L ${bounds.r} ${bounds.b}`;
+               path += `L ${bounds.r} ${bounds.t}`;
+               break;
+         }
+      }
+
+      return (
+         <g key={key} className={data.classNames} style={data.style}>
+            <path
+               d={path}
+               className={CSS.expand(CSS.element(baseClass, "path"), data.lineClass)}
+               style={data.lineStyle}
+            />
+            {this.renderChildren(context, instance)}
+         </g>
+      );
+   }
+}
+
+RangeMarker.prototype.baseClass = "rangemarker";
+RangeMarker.prototype.xAxis = "x";
+RangeMarker.prototype.yAxis = "y";
+
+RangeMarker.prototype.shape = "line";
+RangeMarker.prototype.vertical = false;
+RangeMarker.prototype.size = 1;
+RangeMarker.prototype.laneOffset = 0;
+RangeMarker.prototype.capSize = 5;
+RangeMarker.prototype.inflate = 0;
+RangeMarker.prototype.affectsAxes = true;
+
+Widget.alias("range-marker", RangeMarker);

package/src/charts/axis/Axis.d.ts

@@ -1,113 +1,113 @@
-import { Instance } from "./../../ui/Instance.d";
-import * as Cx from "../../core";
-import { BoundedObject, BoundedObjectProps } from "../../svg/BoundedObject";
-
-export interface AxisProps extends BoundedObjectProps {
-   /** Set to `true` for vertical axes. */
-   vertical?: boolean;
-
-   /** Used as a secondary axis. Displayed at the top/right. */
-   secondary?: boolean;
-
-   /** When set to `true`, the values are displayed in descending order. */
-   inverted?: Cx.BooleanProp;
-
-   /** When set to `true`, rendering of visual elements of the axis, such as ticks and labels, is skipped, but their function is preserved. */
-   hidden?: boolean;
-
-   /** Size of the axis tick line. Defaults to 3. */
-   tickSize?: number;
-
-   /** Distance between ticks and the axis. Default is 0. Use negative values for offset to make ticks appear on both sides of the axis. */
-   tickOffset?: number;
-
-   /** The smallest distance between two ticks on the axis. Defaults to 25. */
-   minTickDistance?: number;
-
-   /** The smallest distance between two labels on the vertical axis. Defaults to 40. */
-   minLabelDistanceVertical?: number;
-
-   /** The smallest distance between two labels on the horizontal axis. Defaults to 50.  */
-   minLabelDistanceHorizontal?: number;
-
-   /** Distance between labels and the axis. Defaults to 10. */
-   labelOffset?: number | string;
-
-   /** Label rotation angle in degrees. */
-   labelRotation?: Cx.Prop<number | string>;
-
-   /** Label text-anchor value. Allowed values are start, end and middle. Default value is set based on the value of vertical and secondary flags. */
-   labelAnchor?: "start" | "end" | "middle" | "auto";
-
-   /** Horizontal text offset. */
-   labelDx?: number | string;
-
-   /** Vertical text offset which can be used for vertical alignment. */
-   labelDy?: number | string;
-
-   /** Set to `true` to break long labels into multiple lines. Default value is `false`. Text is split at space characters. See also `labelMaxLineLength` and `labelLineCountDyFactor`. */
-   labelWrap?: boolean;
-
-   /**
-    * Used for vertical adjustment of multi-line labels. Default value is `auto` which means
-    * that value is initialized based on axis configuration. Value `0` means that label will grow towards
-    * the bottom of the screen. Value `-1` will make labels to grow towards the top of the screen.
-    * `-0.5` will make labels vertically centered.
-    */
-   labelLineCountDyFactor?: number | string;
-
-   /**
-    * Used for vertical adjustment of multi-line labels. Default value is 1 which means
-    * that labels are stacked without any space between them. Value of 1.4 will add 40% of the label height as a space between labels.
-    */
-   labelLineHeight?: number | string;
-
-   /** If `labelWrap` is on, this number is used as a measure to split labels into multiple lines. Default value is `10`. */
-   labelMaxLineLength?: number;
-
-   /** Set to true to hide the axis labels. */
-   hideLabels?: boolean;
-
-   /** Set to true to hide the axis line. */
-   hideLine?: boolean;
-
-   /** Set to true to hide the axis ticks. */
-   hideTicks?: boolean;
-
-   /** Additional CSS style to be applied to the axis line. */
-   lineStyle?: Cx.StyleProp;
-
-   /** Additional CSS style to be applied to the axis ticks. */
-   tickStyle?: Cx.StyleProp;
-
-   /** Additional CSS style to be applied to the axis labels. */
-   labelStyle?: Cx.StyleProp;
-
-   /** Additional CSS class to be applied to the axis line. */
-   lineClass?: Cx.ClassProp;
-
-   /** Additional CSS class to be applied to the axis ticks. */
-   tickClass?: Cx.ClassProp;
-
-   /** Additional CSS class to be applied to the axis labels. */
-   labelClass?: Cx.ClassProp;
-
-   onMeasured?: (info: any, instance: Instance) => void;
-
-   /** A function used to create a formatter function for axis labels. See Complex Labels example in the CxJS documentation for more info. */
-   onCreateLabelFormatter?:
-      | string
-      | ((
-           context: any,
-           instance: Instance,
-        ) => (
-           formattedValue: string,
-           value: any,
-           { tickIndex, serieIndex }: { tickIndex: number; serieIndex: number },
-        ) => { text: string; style?: any; className?: string }[]);
-
-   /** Distance between the even labels and the axis. */
-   alternateLabelOffset?: number | string;
-}
-
-export class Axis extends BoundedObject {}
+import { Instance } from "./../../ui/Instance.d";
+import * as Cx from "../../core";
+import { BoundedObject, BoundedObjectProps } from "../../svg/BoundedObject";
+
+export interface AxisProps extends BoundedObjectProps {
+   /** Set to `true` for vertical axes. */
+   vertical?: boolean;
+
+   /** Used as a secondary axis. Displayed at the top/right. */
+   secondary?: boolean;
+
+   /** When set to `true`, the values are displayed in descending order. */
+   inverted?: Cx.BooleanProp;
+
+   /** When set to `true`, rendering of visual elements of the axis, such as ticks and labels, is skipped, but their function is preserved. */
+   hidden?: boolean;
+
+   /** Size of the axis tick line. Defaults to 3. */
+   tickSize?: number;
+
+   /** Distance between ticks and the axis. Default is 0. Use negative values for offset to make ticks appear on both sides of the axis. */
+   tickOffset?: number;
+
+   /** The smallest distance between two ticks on the axis. Defaults to 25. */
+   minTickDistance?: number;
+
+   /** The smallest distance between two labels on the vertical axis. Defaults to 40. */
+   minLabelDistanceVertical?: number;
+
+   /** The smallest distance between two labels on the horizontal axis. Defaults to 50.  */
+   minLabelDistanceHorizontal?: number;
+
+   /** Distance between labels and the axis. Defaults to 10. */
+   labelOffset?: number | string;
+
+   /** Label rotation angle in degrees. */
+   labelRotation?: Cx.Prop<number | string>;
+
+   /** Label text-anchor value. Allowed values are start, end and middle. Default value is set based on the value of vertical and secondary flags. */
+   labelAnchor?: "start" | "end" | "middle" | "auto";
+
+   /** Horizontal text offset. */
+   labelDx?: number | string;
+
+   /** Vertical text offset which can be used for vertical alignment. */
+   labelDy?: number | string;
+
+   /** Set to `true` to break long labels into multiple lines. Default value is `false`. Text is split at space characters. See also `labelMaxLineLength` and `labelLineCountDyFactor`. */
+   labelWrap?: boolean;
+
+   /**
+    * Used for vertical adjustment of multi-line labels. Default value is `auto` which means
+    * that value is initialized based on axis configuration. Value `0` means that label will grow towards
+    * the bottom of the screen. Value `-1` will make labels to grow towards the top of the screen.
+    * `-0.5` will make labels vertically centered.
+    */
+   labelLineCountDyFactor?: number | string;
+
+   /**
+    * Used for vertical adjustment of multi-line labels. Default value is 1 which means
+    * that labels are stacked without any space between them. Value of 1.4 will add 40% of the label height as a space between labels.
+    */
+   labelLineHeight?: number | string;
+
+   /** If `labelWrap` is on, this number is used as a measure to split labels into multiple lines. Default value is `10`. */
+   labelMaxLineLength?: number;
+
+   /** Set to true to hide the axis labels. */
+   hideLabels?: boolean;
+
+   /** Set to true to hide the axis line. */
+   hideLine?: boolean;
+
+   /** Set to true to hide the axis ticks. */
+   hideTicks?: boolean;
+
+   /** Additional CSS style to be applied to the axis line. */
+   lineStyle?: Cx.StyleProp;
+
+   /** Additional CSS style to be applied to the axis ticks. */
+   tickStyle?: Cx.StyleProp;
+
+   /** Additional CSS style to be applied to the axis labels. */
+   labelStyle?: Cx.StyleProp;
+
+   /** Additional CSS class to be applied to the axis line. */
+   lineClass?: Cx.ClassProp;
+
+   /** Additional CSS class to be applied to the axis ticks. */
+   tickClass?: Cx.ClassProp;
+
+   /** Additional CSS class to be applied to the axis labels. */
+   labelClass?: Cx.ClassProp;
+
+   onMeasured?: (info: any, instance: Instance) => void;
+
+   /** A function used to create a formatter function for axis labels. See Complex Labels example in the CxJS documentation for more info. */
+   onCreateLabelFormatter?:
+      | string
+      | ((
+           context: any,
+           instance: Instance,
+        ) => (
+           formattedValue: string,
+           value: any,
+           { tickIndex, serieIndex }: { tickIndex: number; serieIndex: number },
+        ) => { text: string; style?: any; className?: string }[]);
+
+   /** Distance between the even labels and the axis. */
+   alternateLabelOffset?: number | string;
+}
+
+export class Axis extends BoundedObject {}