cx 24.4.0 → 24.4.2

package/src/charts/PieChart.scss

@@ -1,27 +1,27 @@
-
-@mixin cx-pieslice(
-   $name: 'pieslice',
-   $besm: $cx-besm
-) {
-   $block: map-get($besm, block);
-   $element: map-get($besm, element);
-   $state: map-get($besm, state);
-
-   .#{$element}#{$name}-slice {
-      stroke-width: 0;
-      fill: #eee;
-      stroke: #ccc;
-
-      &.#{$state}selectable {
-         cursor: pointer;
-      }
-
-      &.#{$state}selected {
-         stroke-width: 2px;
-      }
-   }
-}
-
-@if (cx-should-include('cx/charts/PieSlice')) {
-   @include cx-pieslice();
+
+@mixin cx-pieslice(
+   $name: 'pieslice',
+   $besm: $cx-besm
+) {
+   $block: map-get($besm, block);
+   $element: map-get($besm, element);
+   $state: map-get($besm, state);
+
+   .#{$element}#{$name}-slice {
+      stroke-width: 0;
+      fill: #eee;
+      stroke: #ccc;
+
+      &.#{$state}selectable {
+         cursor: pointer;
+      }
+
+      &.#{$state}selected {
+         stroke-width: 2px;
+      }
+   }
+}
+
+@if (cx-should-include('cx/charts/PieSlice')) {
+   @include cx-pieslice();
 }

package/src/charts/PieLabel.d.ts

@@ -1,26 +1,26 @@
-import * as Cx from "../core";
-import { BoundedObjectProps } from "../svg/BoundedObject";
-
-interface PieLabelProps extends BoundedObjectProps {
-   /** Distance in pixels, for which the labels will be separated from the pie chart. Default value is 100px. */
-   distance: Cx.NumberProp;
-
-   /**
-    * Index of the color in the default color palette.
-    */
-   lineColorIndex?: Cx.NumberProp;
-
-   /** A color used to paint the guideline. */
-   lineStroke?: Cx.StringProp;
-
-   /** CSS class applied to the line element. */
-   lineClass?: Cx.StringProp;
-
-   /** CSS style applied to the line element. */
-   lineStyle?: Cx.StringProp;
-
-   /** Base CSS class to be applied to the element. Defaults to `pielabel`. */
-   baseClass?: string;
-}
-
-export class PieLabel extends Cx.Widget<PieLabelProps> {}
+import * as Cx from "../core";
+import { BoundedObjectProps } from "../svg/BoundedObject";
+
+interface PieLabelProps extends BoundedObjectProps {
+   /** Distance in pixels, for which the labels will be separated from the pie chart. Default value is 100px. */
+   distance: Cx.NumberProp;
+
+   /**
+    * Index of the color in the default color palette.
+    */
+   lineColorIndex?: Cx.NumberProp;
+
+   /** A color used to paint the guideline. */
+   lineStroke?: Cx.StringProp;
+
+   /** CSS class applied to the line element. */
+   lineClass?: Cx.StringProp;
+
+   /** CSS style applied to the line element. */
+   lineStyle?: Cx.StringProp;
+
+   /** Base CSS class to be applied to the element. Defaults to `pielabel`. */
+   baseClass?: string;
+}
+
+export class PieLabel extends Cx.Widget<PieLabelProps> {}

package/src/charts/PieLabel.js

@@ -1,71 +1,71 @@
-import { VDOM } from "../ui/Widget";
-import { BoundedObject } from "../svg/BoundedObject";
-import { Rect } from "../svg/util/Rect";
-import { parseStyle } from "../util/parseStyle";
-
-export class PieLabel extends BoundedObject {
-   init() {
-      this.lineStyle = parseStyle(this.lineStyle);
-      super.init();
-   }
-
-   declareData(...args) {
-      super.declareData(...args, {
-         distance: undefined,
-         lineStyle: { structured: true },
-         lineStroke: undefined,
-         lineClass: { structured: true },
-         lineColorIndex: undefined,
-      });
-   }
-
-   calculateBounds(context, instance) {
-      var { data } = instance;
-      var bounds = Rect.add(Rect.add(Rect.multiply(instance.parentRect, data.anchors), data.offset), data.margin);
-      instance.originalBounds = bounds;
-      instance.actualBounds = context.placePieLabel(bounds, data.distance);
-      return new Rect({ t: 0, r: bounds.width(), b: bounds.height(), l: 0 });
-   }
-
-   prepare(context, instance) {
-      super.prepare(context, instance);
-      if (!context.registerPieLabel)
-         throw new Error("PieLabel components are allowed only within PieLabelsContainer components.");
-      let right = instance.parentRect.r > instance.parentRect.l;
-      context.push("textDirection", right ? "right" : "left");
-      context.registerPieLabel(instance);
-   }
-
-   prepareCleanup(context, instance) {
-      context.pop("textDirection");
-   }
-
-   render(context, instance, key) {
-      let { originalBounds, actualBounds, data } = instance;
-
-      return (
-         <g key={key} className={data.classNames}>
-            <line
-               className={this.CSS.element(
-                  this.baseClass,
-                  "line",
-                  data.lineColorIndex != null && "color-" + data.lineColorIndex
-               )}
-               x1={actualBounds.l < originalBounds.l ? actualBounds.r : actualBounds.l}
-               y1={(actualBounds.t + actualBounds.b) / 2}
-               x2={(originalBounds.l + originalBounds.r) / 2}
-               y2={(originalBounds.t + originalBounds.b) / 2}
-               stroke={data.lineStroke}
-               style={data.lineStyle}
-            />
-            <g transform={`translate(${instance.actualBounds.l} ${instance.actualBounds.t})`}>
-               {this.renderChildren(context, instance)}
-            </g>
-         </g>
-      );
-   }
-}
-
-PieLabel.prototype.distance = 100;
-PieLabel.prototype.baseClass = "pielabel";
-PieLabel.prototype.styled = true;
+import { VDOM } from "../ui/Widget";
+import { BoundedObject } from "../svg/BoundedObject";
+import { Rect } from "../svg/util/Rect";
+import { parseStyle } from "../util/parseStyle";
+
+export class PieLabel extends BoundedObject {
+   init() {
+      this.lineStyle = parseStyle(this.lineStyle);
+      super.init();
+   }
+
+   declareData(...args) {
+      super.declareData(...args, {
+         distance: undefined,
+         lineStyle: { structured: true },
+         lineStroke: undefined,
+         lineClass: { structured: true },
+         lineColorIndex: undefined,
+      });
+   }
+
+   calculateBounds(context, instance) {
+      var { data } = instance;
+      var bounds = Rect.add(Rect.add(Rect.multiply(instance.parentRect, data.anchors), data.offset), data.margin);
+      instance.originalBounds = bounds;
+      instance.actualBounds = context.placePieLabel(bounds, data.distance);
+      return new Rect({ t: 0, r: bounds.width(), b: bounds.height(), l: 0 });
+   }
+
+   prepare(context, instance) {
+      super.prepare(context, instance);
+      if (!context.registerPieLabel)
+         throw new Error("PieLabel components are allowed only within PieLabelsContainer components.");
+      let right = instance.parentRect.r > instance.parentRect.l;
+      context.push("textDirection", right ? "right" : "left");
+      context.registerPieLabel(instance);
+   }
+
+   prepareCleanup(context, instance) {
+      context.pop("textDirection");
+   }
+
+   render(context, instance, key) {
+      let { originalBounds, actualBounds, data } = instance;
+
+      return (
+         <g key={key} className={data.classNames}>
+            <line
+               className={this.CSS.element(
+                  this.baseClass,
+                  "line",
+                  data.lineColorIndex != null && "color-" + data.lineColorIndex
+               )}
+               x1={actualBounds.l < originalBounds.l ? actualBounds.r : actualBounds.l}
+               y1={(actualBounds.t + actualBounds.b) / 2}
+               x2={(originalBounds.l + originalBounds.r) / 2}
+               y2={(originalBounds.t + originalBounds.b) / 2}
+               stroke={data.lineStroke}
+               style={data.lineStyle}
+            />
+            <g transform={`translate(${instance.actualBounds.l} ${instance.actualBounds.t})`}>
+               {this.renderChildren(context, instance)}
+            </g>
+         </g>
+      );
+   }
+}
+
+PieLabel.prototype.distance = 100;
+PieLabel.prototype.baseClass = "pielabel";
+PieLabel.prototype.styled = true;

package/src/charts/PieLabelsContainer.d.ts

@@ -1,6 +1,6 @@
-import { Widget } from "cx/src/core";
-import { BoundedObject, BoundedObjectProps } from "../svg/BoundedObject";
-
-interface PieLabelsContainerProps extends BoundedObjectProps {}
-
-export class PieLabelsContainer extends Widget<PieLabelsContainerProps> {}
+import { Widget } from "cx/src/core";
+import { BoundedObject, BoundedObjectProps } from "../svg/BoundedObject";
+
+interface PieLabelsContainerProps extends BoundedObjectProps {}
+
+export class PieLabelsContainer extends Widget<PieLabelsContainerProps> {}

package/src/charts/PieLabelsContainer.js

@@ -1,55 +1,55 @@
-import { BoundedObject } from "../svg/BoundedObject";
-import { Rect } from "../svg/util/Rect";
-
-export class PieLabelsContainer extends BoundedObject {
-   prepare(context, instance) {
-      super.prepare(context, instance);
-      let { bounds } = instance.data;
-      let cx2 = bounds.l + bounds.r;
-
-      context.push("placePieLabel", (labelBounds, distance) => {
-         let clone = new Rect(labelBounds);
-         let w = clone.r - clone.l;
-         if (clone.l + clone.r > cx2) {
-            clone.r = Math.min(clone.r + distance, bounds.r);
-            clone.l = clone.r - w;
-         } else {
-            clone.l = Math.max(bounds.l, clone.l - distance);
-            clone.r = clone.l + w;
-         }
-         return clone;
-      });
-
-      instance.leftLabels = [];
-      instance.rightLabels = [];
-
-      context.push("registerPieLabel", (label) => {
-         if (label.actualBounds.l + label.actualBounds.r < cx2) instance.leftLabels.push(label);
-         else instance.rightLabels.push(label);
-      });
-   }
-
-   prepareCleanup(context, instance) {
-      context.pop("placePieLabel");
-      context.pop("registerPieLabel");
-      super.prepareCleanup(context, instance);
-      this.distributeLabels(instance.leftLabels, instance);
-      this.distributeLabels(instance.rightLabels, instance);
-   }
-
-   distributeLabels(labels, instance) {
-      labels.sort((a, b) => a.actualBounds.t + a.actualBounds.b - (b.actualBounds.t + b.actualBounds.b));
-      let totalHeight = labels.reduce((h, l) => h + l.actualBounds.height(), 0);
-      let { bounds } = instance.data;
-      let avgHeight = Math.min(totalHeight, bounds.height()) / labels.length;
-      let at = bounds.t;
-      for (let i = 0; i < labels.length; i++) {
-         let ab = labels[i].actualBounds;
-         ab.t = Math.max(at, Math.min(ab.t, bounds.b - (labels.length - i) * avgHeight));
-         ab.b = ab.t + avgHeight;
-         at = ab.b;
-      }
-   }
-}
-
-PieLabelsContainer.prototype.anchors = "0 1 1 0";
+import { BoundedObject } from "../svg/BoundedObject";
+import { Rect } from "../svg/util/Rect";
+
+export class PieLabelsContainer extends BoundedObject {
+   prepare(context, instance) {
+      super.prepare(context, instance);
+      let { bounds } = instance.data;
+      let cx2 = bounds.l + bounds.r;
+
+      context.push("placePieLabel", (labelBounds, distance) => {
+         let clone = new Rect(labelBounds);
+         let w = clone.r - clone.l;
+         if (clone.l + clone.r > cx2) {
+            clone.r = Math.min(clone.r + distance, bounds.r);
+            clone.l = clone.r - w;
+         } else {
+            clone.l = Math.max(bounds.l, clone.l - distance);
+            clone.r = clone.l + w;
+         }
+         return clone;
+      });
+
+      instance.leftLabels = [];
+      instance.rightLabels = [];
+
+      context.push("registerPieLabel", (label) => {
+         if (label.actualBounds.l + label.actualBounds.r < cx2) instance.leftLabels.push(label);
+         else instance.rightLabels.push(label);
+      });
+   }
+
+   prepareCleanup(context, instance) {
+      context.pop("placePieLabel");
+      context.pop("registerPieLabel");
+      super.prepareCleanup(context, instance);
+      this.distributeLabels(instance.leftLabels, instance);
+      this.distributeLabels(instance.rightLabels, instance);
+   }
+
+   distributeLabels(labels, instance) {
+      labels.sort((a, b) => a.actualBounds.t + a.actualBounds.b - (b.actualBounds.t + b.actualBounds.b));
+      let totalHeight = labels.reduce((h, l) => h + l.actualBounds.height(), 0);
+      let { bounds } = instance.data;
+      let avgHeight = Math.min(totalHeight, bounds.height()) / labels.length;
+      let at = bounds.t;
+      for (let i = 0; i < labels.length; i++) {
+         let ab = labels[i].actualBounds;
+         ab.t = Math.max(at, Math.min(ab.t, bounds.b - (labels.length - i) * avgHeight));
+         ab.b = ab.t + avgHeight;
+         at = ab.b;
+      }
+   }
+}
+
+PieLabelsContainer.prototype.anchors = "0 1 1 0";

package/src/charts/Range.d.ts

@@ -1,75 +1,75 @@
-import * as Cx from '../core';
-import { BoundedObject, BoundedObjectProps } from '../svg/BoundedObject';
-
-interface RangeProps extends BoundedObjectProps {
-   
-   /** The `x1` value binding or expression. */
-   x1?: Cx.NumberProp,
-
-   /** The `y1` value binding or expression. */
-   y1?: Cx.NumberProp,
-   
-   /** The `x2` value binding or expression. */
-   x2?: Cx.NumberProp,
-
-   /** The `y2` value binding or expression. */
-   y2?: Cx.NumberProp,
-
-   /** Index of a color from the standard palette of colors. 0-15. */
-   colorIndex?: Cx.NumberProp,
-
-   /** Used to indicate if an item is active or not. Inactive items are shown only in the legend. */
-   active?: Cx.BooleanProp,
-
-   /** Name of the item as it will appear in the legend. */
-   name?: Cx.StringProp,
-
-   /** Name of the legend to be used. Default is `legend`. */
-   legend?: Cx.StringProp,
-
-   invisible?: boolean,
-
-   /**
-    *  Name of the horizontal axis. The value should match one of the horizontal axes set
-    * in the `axes` configuration of the parent `Chart` component. Default value is `x`.
-    */
-   xAxis?: string,
-
-   /** 
-    * Name of the vertical axis. The value should match one of the vertical axes set 
-    * in the `axes` configuration if the parent `Chart` component. Default value is `y`.
-    */
-   yAxis?: string,
-   
-   xSize?: number,
-   ySize?: number,
-   xOffset?: number,
-   yOffset?: number,
-
-   /** Base CSS class to be applied to the element. Defaults to `range`. */
-   baseClass?: string,
-
-   /** Set to `true` to make the range draggable along the X axis. */
-   draggableX?: boolean,
-
-   /** Set to `true` to make the range draggable along the Y axis. */
-   draggableY?: boolean,
-
-   /** Set to `true` to make the range draggable along the X and Y axis. */
-   draggable?: boolean,
-
-   /** Constrain the range position to min/max values of the X axis during drag operations. */
-   constrainX?: boolean,
-
-   /** Constrain the range position to min/max values of the Y axis during drag operations. */
-   constrainY?: boolean,
-
-   /** When set to `true`, it is equivalent to setting `constrainX` and `constrainY` to true. */
-   constrain?: boolean,
-   
-   legendAction?: string,
-   hidden?: boolean
-   
-}
-
+import * as Cx from '../core';
+import { BoundedObject, BoundedObjectProps } from '../svg/BoundedObject';
+
+interface RangeProps extends BoundedObjectProps {
+   
+   /** The `x1` value binding or expression. */
+   x1?: Cx.NumberProp,
+
+   /** The `y1` value binding or expression. */
+   y1?: Cx.NumberProp,
+   
+   /** The `x2` value binding or expression. */
+   x2?: Cx.NumberProp,
+
+   /** The `y2` value binding or expression. */
+   y2?: Cx.NumberProp,
+
+   /** Index of a color from the standard palette of colors. 0-15. */
+   colorIndex?: Cx.NumberProp,
+
+   /** Used to indicate if an item is active or not. Inactive items are shown only in the legend. */
+   active?: Cx.BooleanProp,
+
+   /** Name of the item as it will appear in the legend. */
+   name?: Cx.StringProp,
+
+   /** Name of the legend to be used. Default is `legend`. */
+   legend?: Cx.StringProp,
+
+   invisible?: boolean,
+
+   /**
+    *  Name of the horizontal axis. The value should match one of the horizontal axes set
+    * in the `axes` configuration of the parent `Chart` component. Default value is `x`.
+    */
+   xAxis?: string,
+
+   /** 
+    * Name of the vertical axis. The value should match one of the vertical axes set 
+    * in the `axes` configuration if the parent `Chart` component. Default value is `y`.
+    */
+   yAxis?: string,
+   
+   xSize?: number,
+   ySize?: number,
+   xOffset?: number,
+   yOffset?: number,
+
+   /** Base CSS class to be applied to the element. Defaults to `range`. */
+   baseClass?: string,
+
+   /** Set to `true` to make the range draggable along the X axis. */
+   draggableX?: boolean,
+
+   /** Set to `true` to make the range draggable along the Y axis. */
+   draggableY?: boolean,
+
+   /** Set to `true` to make the range draggable along the X and Y axis. */
+   draggable?: boolean,
+
+   /** Constrain the range position to min/max values of the X axis during drag operations. */
+   constrainX?: boolean,
+
+   /** Constrain the range position to min/max values of the Y axis during drag operations. */
+   constrainY?: boolean,
+
+   /** When set to `true`, it is equivalent to setting `constrainX` and `constrainY` to true. */
+   constrain?: boolean,
+   
+   legendAction?: string,
+   hidden?: boolean
+   
+}
+
 export class Range extends Cx.Widget<RangeProps> {}