cx 24.4.0 → 24.4.2

package/src/svg/BoundedObject.js

@@ -1,59 +1,59 @@
-import {Widget, VDOM} from '../ui/Widget';
-import {PureContainer} from '../ui/PureContainer';
-import {Rect} from './util/Rect';
-
-export class BoundedObject extends PureContainer {
-
-   declareData() {
-      return super.declareData({
-         anchors: undefined,
-         offset: undefined,
-         margin: undefined,
-         padding: undefined
-      }, ...arguments)
-   }
-
-   prepareData(context, instance) {
-      super.prepareData(context, instance);
-      var {data} = instance;
-      data.anchors = Rect.convert(data.anchors);
-      data.offset = Rect.convert(data.offset);
-      data.margin = Rect.convertMargin(data.margin);
-      data.padding = Rect.convertMargin(data.padding);
-   }
-   
-   calculateBounds(context, instance) {
-      var {data} = instance;
-      return Rect.add(Rect.add(Rect.multiply(instance.parentRect, data.anchors), data.offset), data.margin);
-   }
-
-   prepareBounds(context, instance) {
-      var {data} = instance;
-      if (instance.shouldUpdate || !instance.cached.parentRect || !instance.cached.parentRect.isEqual(context.parentRect) || !data.bounds) {
-         if (!context.parentRect)
-            throw new Error('Parent bounds were not provided through the context.');
-         instance.parentRect = context.parentRect;
-         instance.cache('parentRect' , context.parentRect);
-         instance.markShouldUpdate(context);
-         data.bounds = this.calculateBounds(context, instance);
-         data.childrenBounds = Rect.add(data.bounds, data.padding);
-      }
-   }
-
-   prepare(context, instance) {
-      this.prepareBounds(context, instance);
-      context.push('parentRect', instance.data.childrenBounds);
-   }
-
-   prepareCleanup(context, instance) {
-      context.pop('parentRect');
-   }
-}
-
-BoundedObject.prototype.anchors = 0;
-BoundedObject.prototype.margin = 0;
-BoundedObject.prototype.offset = 0;
-BoundedObject.prototype.padding = 0;
-BoundedObject.prototype.isPureContainer = false;
-BoundedObject.prototype.styled = true;
-
+import {Widget, VDOM} from '../ui/Widget';
+import {PureContainer} from '../ui/PureContainer';
+import {Rect} from './util/Rect';
+
+export class BoundedObject extends PureContainer {
+
+   declareData() {
+      return super.declareData({
+         anchors: undefined,
+         offset: undefined,
+         margin: undefined,
+         padding: undefined
+      }, ...arguments)
+   }
+
+   prepareData(context, instance) {
+      super.prepareData(context, instance);
+      var {data} = instance;
+      data.anchors = Rect.convert(data.anchors);
+      data.offset = Rect.convert(data.offset);
+      data.margin = Rect.convertMargin(data.margin);
+      data.padding = Rect.convertMargin(data.padding);
+   }
+   
+   calculateBounds(context, instance) {
+      var {data} = instance;
+      return Rect.add(Rect.add(Rect.multiply(instance.parentRect, data.anchors), data.offset), data.margin);
+   }
+
+   prepareBounds(context, instance) {
+      var {data} = instance;
+      if (instance.shouldUpdate || !instance.cached.parentRect || !instance.cached.parentRect.isEqual(context.parentRect) || !data.bounds) {
+         if (!context.parentRect)
+            throw new Error('Parent bounds were not provided through the context.');
+         instance.parentRect = context.parentRect;
+         instance.cache('parentRect' , context.parentRect);
+         instance.markShouldUpdate(context);
+         data.bounds = this.calculateBounds(context, instance);
+         data.childrenBounds = Rect.add(data.bounds, data.padding);
+      }
+   }
+
+   prepare(context, instance) {
+      this.prepareBounds(context, instance);
+      context.push('parentRect', instance.data.childrenBounds);
+   }
+
+   prepareCleanup(context, instance) {
+      context.pop('parentRect');
+   }
+}
+
+BoundedObject.prototype.anchors = 0;
+BoundedObject.prototype.margin = 0;
+BoundedObject.prototype.offset = 0;
+BoundedObject.prototype.padding = 0;
+BoundedObject.prototype.isPureContainer = false;
+BoundedObject.prototype.styled = true;
+

package/src/svg/ClipRect.d.ts

@@ -1,5 +1,5 @@
-import * as Cx from '../core';
-import {BoundedObject, BoundedObjectProps} from './BoundedObject';
-
-// no new props defined in ClipRect, so inheriting BoundedObject directly
+import * as Cx from '../core';
+import {BoundedObject, BoundedObjectProps} from './BoundedObject';
+
+// no new props defined in ClipRect, so inheriting BoundedObject directly
 export class ClipRect extends BoundedObject {}

package/src/svg/ClipRect.js

@@ -1,23 +1,23 @@
-import {Widget, VDOM} from '../ui/Widget';
-import {BoundedObject} from './BoundedObject';
-import {Rect} from './util/Rect';
-
-export class ClipRect extends BoundedObject {
-
-   prepareBounds(context, instance) {
-      super.prepareBounds(context, instance);
-      var {data} = instance;
-      data.clipId = context.addClipRect(data.bounds);
-   }
-
-   render(context, instance, key) {
-      var {data} = instance;
-      return <g key={key} clipPath={`url(#${data.clipId})`}>
-         {this.renderChildren(context, instance)}
-      </g>
-   }
-}
-
-ClipRect.prototype.anchors = '0 1 1 0';
-
-
+import {Widget, VDOM} from '../ui/Widget';
+import {BoundedObject} from './BoundedObject';
+import {Rect} from './util/Rect';
+
+export class ClipRect extends BoundedObject {
+
+   prepareBounds(context, instance) {
+      super.prepareBounds(context, instance);
+      var {data} = instance;
+      data.clipId = context.addClipRect(data.bounds);
+   }
+
+   render(context, instance, key) {
+      var {data} = instance;
+      return <g key={key} clipPath={`url(#${data.clipId})`}>
+         {this.renderChildren(context, instance)}
+      </g>
+   }
+}
+
+ClipRect.prototype.anchors = '0 1 1 0';
+
+

package/src/svg/Ellipse.d.ts

@@ -1,24 +1,24 @@
-import * as Cx from '../core';
-import {TextualBoundedObject, TextualBoundedObjectProps} from './TextualBoundedObject';
-
-interface EllipseProps extends TextualBoundedObjectProps {
-   
-   /** 
-    * Index of the color in the default color palette. Setting this property will set 
-    * both fill and stroke on the object. Use `style` or a CSS class to remove stroke or fill 
-    * if they are not necessary. 
-    */
-   colorIndex?: Cx.NumberProp,
-
-   /** A color used to paint the box. */
-   fill?: Cx.StringProp,
-   
-   /** A color used to paint the outline of the box. */
-   stroke?: Cx.StringProp,
-
-   /** Base CSS class to be applied to the element. Defaults to `ellipse`. */
-   baseClass?: string
-
-}
-
+import * as Cx from '../core';
+import {TextualBoundedObject, TextualBoundedObjectProps} from './TextualBoundedObject';
+
+interface EllipseProps extends TextualBoundedObjectProps {
+   
+   /** 
+    * Index of the color in the default color palette. Setting this property will set 
+    * both fill and stroke on the object. Use `style` or a CSS class to remove stroke or fill 
+    * if they are not necessary. 
+    */
+   colorIndex?: Cx.NumberProp,
+
+   /** A color used to paint the box. */
+   fill?: Cx.StringProp,
+   
+   /** A color used to paint the outline of the box. */
+   stroke?: Cx.StringProp,
+
+   /** Base CSS class to be applied to the element. Defaults to `ellipse`. */
+   baseClass?: string
+
+}
+
 export class Ellipse extends Cx.Widget<EllipseProps> {}

package/src/svg/Ellipse.js

@@ -1,37 +1,37 @@
-import {Widget, VDOM} from '../ui/Widget';
-import {TextualBoundedObject} from './TextualBoundedObject';
-
-export class Ellipse extends TextualBoundedObject {
-
-   declareData() {
-      super.declareData(...arguments, {
-         colorIndex: undefined,
-         fill: undefined,
-         stroke: undefined
-      })
-   }
-
-   render(context, instance, key) {
-      var {data} = instance;
-      var {bounds, colorIndex} = data;
-      if (!bounds.valid())
-         return false;
-      return <g key={key} className={data.classNames}>
-         <ellipse className={this.CSS.element(this.baseClass, 'rect', colorIndex!=null && 'color-'+colorIndex)}
-                  cx={(bounds.l+bounds.r)/2}
-                  cy={(bounds.t+bounds.b)/2}
-                  rx={bounds.width()/2}
-                  ry={bounds.height()/2}
-                  style={data.style}
-                  fill={data.fill}
-                  stroke={data.stroke}
-         />
-         {this.renderChildren(context, instance)}
-      </g>;
-   }
-}
-
-Ellipse.prototype.baseClass = 'ellipse';
-Ellipse.prototype.anchors = '0 1 1 0';
-
+import {Widget, VDOM} from '../ui/Widget';
+import {TextualBoundedObject} from './TextualBoundedObject';
+
+export class Ellipse extends TextualBoundedObject {
+
+   declareData() {
+      super.declareData(...arguments, {
+         colorIndex: undefined,
+         fill: undefined,
+         stroke: undefined
+      })
+   }
+
+   render(context, instance, key) {
+      var {data} = instance;
+      var {bounds, colorIndex} = data;
+      if (!bounds.valid())
+         return false;
+      return <g key={key} className={data.classNames}>
+         <ellipse className={this.CSS.element(this.baseClass, 'rect', colorIndex!=null && 'color-'+colorIndex)}
+                  cx={(bounds.l+bounds.r)/2}
+                  cy={(bounds.t+bounds.b)/2}
+                  rx={bounds.width()/2}
+                  ry={bounds.height()/2}
+                  style={data.style}
+                  fill={data.fill}
+                  stroke={data.stroke}
+         />
+         {this.renderChildren(context, instance)}
+      </g>;
+   }
+}
+
+Ellipse.prototype.baseClass = 'ellipse';
+Ellipse.prototype.anchors = '0 1 1 0';
+
 Widget.alias('ellipse', Ellipse);

package/src/svg/Line.d.ts

@@ -1,21 +1,21 @@
-import * as Cx from '../core';
-import {TextualBoundedObject, TextualBoundedObjectProps} from './TextualBoundedObject';
-
-interface LineProps extends TextualBoundedObjectProps {
-   
-   /** 
-    * Index of the color in the default color palette. Setting this property will set 
-    * both fill and stroke on the object. Use `style` or a CSS class to remove stroke or fill 
-    * if they are not necessary. 
-    */
-   colorIndex?: Cx.NumberProp,
-   
-   /** A color used to paint the outline of the box. */
-   stroke?: Cx.StringProp,
-
-   /** Base CSS class to be applied to the element. Defaults to `line`. */
-   baseClass?: string
-
-}
-
+import * as Cx from '../core';
+import {TextualBoundedObject, TextualBoundedObjectProps} from './TextualBoundedObject';
+
+interface LineProps extends TextualBoundedObjectProps {
+   
+   /** 
+    * Index of the color in the default color palette. Setting this property will set 
+    * both fill and stroke on the object. Use `style` or a CSS class to remove stroke or fill 
+    * if they are not necessary. 
+    */
+   colorIndex?: Cx.NumberProp,
+   
+   /** A color used to paint the outline of the box. */
+   stroke?: Cx.StringProp,
+
+   /** Base CSS class to be applied to the element. Defaults to `line`. */
+   baseClass?: string
+
+}
+
 export class Line extends Cx.Widget<LineProps> {}

package/src/svg/Line.js

@@ -1,33 +1,33 @@
-import {Widget, VDOM} from '../ui/Widget';
-import {TextualBoundedObject} from './TextualBoundedObject';
-
-export class Line extends TextualBoundedObject {
-
-   declareData() {
-      super.declareData(...arguments, {
-         colorIndex: undefined,
-         stroke: undefined
-      })
-   }
-
-   render(context, instance, key) {
-      var {data, colorIndex} = instance;
-      var {bounds} = data;
-      return <g key={key} className={data.classNames}>
-         <line className={this.CSS.element(this.baseClass, 'line', colorIndex!=null && 'color-'+colorIndex)}
-               x1={bounds.l}
-               y1={bounds.t}
-               x2={bounds.r}
-               y2={bounds.b}
-               style={data.style}
-               stroke={data.stroke}
-         />
-         {this.renderChildren(context, instance)}
-      </g>;
-   }
-}
-
-Line.prototype.anchors = '0 1 1 0';
-Line.prototype.baseClass = 'line';
-
+import {Widget, VDOM} from '../ui/Widget';
+import {TextualBoundedObject} from './TextualBoundedObject';
+
+export class Line extends TextualBoundedObject {
+
+   declareData() {
+      super.declareData(...arguments, {
+         colorIndex: undefined,
+         stroke: undefined
+      })
+   }
+
+   render(context, instance, key) {
+      var {data, colorIndex} = instance;
+      var {bounds} = data;
+      return <g key={key} className={data.classNames}>
+         <line className={this.CSS.element(this.baseClass, 'line', colorIndex!=null && 'color-'+colorIndex)}
+               x1={bounds.l}
+               y1={bounds.t}
+               x2={bounds.r}
+               y2={bounds.b}
+               style={data.style}
+               stroke={data.stroke}
+         />
+         {this.renderChildren(context, instance)}
+      </g>;
+   }
+}
+
+Line.prototype.anchors = '0 1 1 0';
+Line.prototype.baseClass = 'line';
+
 Widget.alias('line', Line);

package/src/svg/NonOverlappingRect.d.ts

@@ -1,5 +1,5 @@
-import * as Cx from "../core";
-import { BoundedObject, BoundedObjectProps } from "./BoundedObject";
-
-// no new props defined in NonOverlappingRect, so inheriting BoundedObject directly
-export class NonOverlappingRect extends BoundedObject {}
+import * as Cx from "../core";
+import { BoundedObject, BoundedObjectProps } from "./BoundedObject";
+
+// no new props defined in NonOverlappingRect, so inheriting BoundedObject directly
+export class NonOverlappingRect extends BoundedObject {}

package/src/svg/NonOverlappingRect.js

@@ -1,15 +1,15 @@
-import { BoundedObject } from "./BoundedObject";
-
-export class NonOverlappingRect extends BoundedObject {
-   prepare(context, instance) {
-      super.prepare(context, instance); //calculate bounds
-      if (!context.addNonOverlappingBoundingObject)
-         throw new Error("Components of type NonOverlappingRect can appaear only within a NonOverlappingRectGroup.");
-      context.addNonOverlappingBoundingObject(instance);
-   }
-
-   render(context, instance, key) {
-      if (instance.overlapping) return null;
-      return super.render(context, instance, key);
-   }
+import { BoundedObject } from "./BoundedObject";
+
+export class NonOverlappingRect extends BoundedObject {
+   prepare(context, instance) {
+      super.prepare(context, instance); //calculate bounds
+      if (!context.addNonOverlappingBoundingObject)
+         throw new Error("Components of type NonOverlappingRect can appaear only within a NonOverlappingRectGroup.");
+      context.addNonOverlappingBoundingObject(instance);
+   }
+
+   render(context, instance, key) {
+      if (instance.overlapping) return null;
+      return super.render(context, instance, key);
+   }
 }

package/src/svg/NonOverlappingRectGroup.d.ts

@@ -1,3 +1,3 @@
-import { PureContainer } from "./../ui/PureContainer";
-
-export class NonOverlappingRectGroup extends PureContainer {}
+import { PureContainer } from "./../ui/PureContainer";
+
+export class NonOverlappingRectGroup extends PureContainer {}

package/src/svg/NonOverlappingRectGroup.js

@@ -1,37 +1,37 @@
-import { PureContainer } from "../ui/PureContainer";
-
-export class NonOverlappingRectGroup extends PureContainer {
-   prepare(context, instance) {
-      instance.nonOverlappingObjects = [];
-      context.push("addNonOverlappingBoundingObject", objectInstance => {
-         instance.nonOverlappingObjects.push(objectInstance);
-      });
-   }
-
-   prepareCleanup(context, instance) {
-      context.pop("addNonOverlappingBoundingObject");
-      instance.nonOverlappingObjects.sort((a, b) => (a.data.bounds.r - b.data.bounds.r));
-      let visibleObjects = [];
-      for (let item of instance.nonOverlappingObjects) {
-         let overlapping = false;
-         let at = visibleObjects.length - 1;
-         while (at >= 0 && visibleObjects[at].data.bounds.r > item.data.bounds.l) {
-            let r1 = visibleObjects[at].data.bounds;
-            let r2 = item.data.bounds;
-            let width = Math.min(r1.r, r2.r) - Math.max(r1.l, r2.l);
-            let height = Math.min(r1.b, r2.b) - Math.max(r1.t, r2.t);
-            if (width > 0 && height > 0) {
-               overlapping = true;
-               break;
-            }
-            at--;
-         }
-         if (item.overlapping !== overlapping) {
-            item.overlapping = overlapping;
-            item.markShouldUpdate(context);
-         }
-         if (!overlapping)
-            visibleObjects.push(item);
-      }
-   }
+import { PureContainer } from "../ui/PureContainer";
+
+export class NonOverlappingRectGroup extends PureContainer {
+   prepare(context, instance) {
+      instance.nonOverlappingObjects = [];
+      context.push("addNonOverlappingBoundingObject", objectInstance => {
+         instance.nonOverlappingObjects.push(objectInstance);
+      });
+   }
+
+   prepareCleanup(context, instance) {
+      context.pop("addNonOverlappingBoundingObject");
+      instance.nonOverlappingObjects.sort((a, b) => (a.data.bounds.r - b.data.bounds.r));
+      let visibleObjects = [];
+      for (let item of instance.nonOverlappingObjects) {
+         let overlapping = false;
+         let at = visibleObjects.length - 1;
+         while (at >= 0 && visibleObjects[at].data.bounds.r > item.data.bounds.l) {
+            let r1 = visibleObjects[at].data.bounds;
+            let r2 = item.data.bounds;
+            let width = Math.min(r1.r, r2.r) - Math.max(r1.l, r2.l);
+            let height = Math.min(r1.b, r2.b) - Math.max(r1.t, r2.t);
+            if (width > 0 && height > 0) {
+               overlapping = true;
+               break;
+            }
+            at--;
+         }
+         if (item.overlapping !== overlapping) {
+            item.overlapping = overlapping;
+            item.markShouldUpdate(context);
+         }
+         if (!overlapping)
+            visibleObjects.push(item);
+      }
+   }
 }

package/src/svg/Rectangle.d.ts

@@ -1,24 +1,24 @@
-import * as Cx from '../core';
-import {TextualBoundedObject, TextualBoundedObjectProps} from './TextualBoundedObject';
-
-interface RectangleProps extends TextualBoundedObjectProps {
-   
-   /** 
-    * Index of the color in the default color palette. Setting this property will set 
-    * both fill and stroke on the object. Use `style` or a CSS class to remove stroke or fill 
-    * if they are not necessary. 
-    */
-   colorIndex?: Cx.NumberProp,
-
-   /** A color used to paint the box. */
-   fill?: Cx.StringProp,
-   
-   /** A color used to paint the outline of the box. */
-   stroke?: Cx.StringProp,
-
-   /** Base CSS class to be applied to the element. Defaults to `rectangle`. */
-   baseClass?: string
-
-}
-
+import * as Cx from '../core';
+import {TextualBoundedObject, TextualBoundedObjectProps} from './TextualBoundedObject';
+
+interface RectangleProps extends TextualBoundedObjectProps {
+   
+   /** 
+    * Index of the color in the default color palette. Setting this property will set 
+    * both fill and stroke on the object. Use `style` or a CSS class to remove stroke or fill 
+    * if they are not necessary. 
+    */
+   colorIndex?: Cx.NumberProp,
+
+   /** A color used to paint the box. */
+   fill?: Cx.StringProp,
+   
+   /** A color used to paint the outline of the box. */
+   stroke?: Cx.StringProp,
+
+   /** Base CSS class to be applied to the element. Defaults to `rectangle`. */
+   baseClass?: string
+
+}
+
 export class Rectangle extends Cx.Widget<RectangleProps> {}

package/src/svg/Rectangle.js

@@ -1,37 +1,37 @@
-import {Widget, VDOM} from '../ui/Widget';
-import {TextualBoundedObject} from './TextualBoundedObject';
-
-export class Rectangle extends TextualBoundedObject {
-
-   declareData() {
-      super.declareData(...arguments, {
-         colorIndex: undefined,
-         fill: undefined,
-         stroke: undefined
-      })
-   }
-
-   render(context, instance, key) {
-      var {data} = instance;
-      var {bounds, colorIndex} = data;
-      if (!bounds.valid())
-         return false;
-      return <g key={key} className={data.classNames}>
-         <rect className={this.CSS.element(this.baseClass, 'rect', colorIndex!=null && 'color-'+colorIndex)}
-               x={bounds.l}
-               y={bounds.t}
-               width={bounds.width()}
-               height={bounds.height()}
-               style={data.style}
-               fill={data.fill}
-               stroke={data.stroke}
-         />
-         {this.renderChildren(context, instance)}
-      </g>;
-   }
-}
-
-Rectangle.prototype.baseClass = 'rectangle';
-Rectangle.prototype.anchors = '0 1 1 0';
-
+import {Widget, VDOM} from '../ui/Widget';
+import {TextualBoundedObject} from './TextualBoundedObject';
+
+export class Rectangle extends TextualBoundedObject {
+
+   declareData() {
+      super.declareData(...arguments, {
+         colorIndex: undefined,
+         fill: undefined,
+         stroke: undefined
+      })
+   }
+
+   render(context, instance, key) {
+      var {data} = instance;
+      var {bounds, colorIndex} = data;
+      if (!bounds.valid())
+         return false;
+      return <g key={key} className={data.classNames}>
+         <rect className={this.CSS.element(this.baseClass, 'rect', colorIndex!=null && 'color-'+colorIndex)}
+               x={bounds.l}
+               y={bounds.t}
+               width={bounds.width()}
+               height={bounds.height()}
+               style={data.style}
+               fill={data.fill}
+               stroke={data.stroke}
+         />
+         {this.renderChildren(context, instance)}
+      </g>;
+   }
+}
+
+Rectangle.prototype.baseClass = 'rectangle';
+Rectangle.prototype.anchors = '0 1 1 0';
+
 Widget.alias('rectangle', Rectangle);