cx 24.4.0 → 24.4.2

package/src/charts/Swimlanes.scss

@@ -1,14 +1,14 @@
-@mixin cx-swimlanes($name: "swimlanes", $besm: $cx-besm, $lane-color: $cx-default-swimlanes-lane-background-color) {
-   $block: map-get($besm, block);
-   $element: map-get($besm, element);
-   $state: map-get($besm, state);
-
-   .#{$element}#{$name}-lane {
-      fill: $lane-color;
-      stroke: none;
-   }
-}
-
-@if (cx-should-include("cx/charts/Swimlanes")) {
-   @include cx-swimlanes();
-}
+@mixin cx-swimlanes($name: "swimlanes", $besm: $cx-besm, $lane-color: $cx-default-swimlanes-lane-background-color) {
+   $block: map-get($besm, block);
+   $element: map-get($besm, element);
+   $state: map-get($besm, state);
+
+   .#{$element}#{$name}-lane {
+      fill: $lane-color;
+      stroke: none;
+   }
+}
+
+@if (cx-should-include("cx/charts/Swimlanes")) {
+   @include cx-swimlanes();
+}

package/src/charts/axis/Axis.scss

@@ -1,23 +1,23 @@
-
-@mixin cxb-axis() {
-   shape-rendering: crispEdges;
-}
-
-@mixin cxe-axis-ticks() {
-   stroke: $cx-axis-ticks-stroke;
-   stroke-width: 1px;
-}
-
-@mixin cxe-axis-line() {
-   stroke: $cx-axis-line-stroke;
-   stroke-width: 1px;
-}
-
-@mixin cxe-axis-label() {
-   font-size: smaller;
-   fill: currentColor;
-}
-
-@mixin cxe-axis-label-offset() {
-   visibility: hidden;
+
+@mixin cxb-axis() {
+   shape-rendering: crispEdges;
+}
+
+@mixin cxe-axis-ticks() {
+   stroke: $cx-axis-ticks-stroke;
+   stroke-width: 1px;
+}
+
+@mixin cxe-axis-line() {
+   stroke: $cx-axis-line-stroke;
+   stroke-width: 1px;
+}
+
+@mixin cxe-axis-label() {
+   font-size: smaller;
+   fill: currentColor;
+}
+
+@mixin cxe-axis-label-offset() {
+   visibility: hidden;
 }

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

@@ -1,22 +1,22 @@
-import * as Cx from '../../core';
-import {AxisProps} from './Axis';
-
-interface CategoryAxisProps extends AxisProps {
-   
-   /** Uniform axes provide exact size and offset for all entries, while non-uniform axes adapt their size and offset to the number of entries under each category. */
-   uniform?: Cx.BooleanProp,
-
-   /** Names corresponding the given `values`. For example, `values` may be 0 .. 11 and `names` could be Jan .. Dec. */
-   names?: Cx.Prop<any[] | Cx.Config>,
-
-   /** Values used to initialize the axis. If an object is provided, keys are used for values and values are used for names. */
-   values?: Cx.Prop<any[] | Cx.Config>,
-
-   /** Sometimes, there is not enough data and each category takes a lot of space. `minSize` can be used to add fake entries up to the specified number, so everything looks normal. */
-   minSize?: Cx.NumberProp,
-
-   /** Base CSS class to be applied to the element. Defaults to `categoryaxis`. */
-   baseClass?: string
-}
-
+import * as Cx from '../../core';
+import {AxisProps} from './Axis';
+
+interface CategoryAxisProps extends AxisProps {
+   
+   /** Uniform axes provide exact size and offset for all entries, while non-uniform axes adapt their size and offset to the number of entries under each category. */
+   uniform?: Cx.BooleanProp,
+
+   /** Names corresponding the given `values`. For example, `values` may be 0 .. 11 and `names` could be Jan .. Dec. */
+   names?: Cx.Prop<any[] | Cx.Config>,
+
+   /** Values used to initialize the axis. If an object is provided, keys are used for values and values are used for names. */
+   values?: Cx.Prop<any[] | Cx.Config>,
+
+   /** Sometimes, there is not enough data and each category takes a lot of space. `minSize` can be used to add fake entries up to the specified number, so everything looks normal. */
+   minSize?: Cx.NumberProp,
+
+   /** Base CSS class to be applied to the element. Defaults to `categoryaxis`. */
+   baseClass?: string
+}
+
 export class CategoryAxis extends Cx.Widget<CategoryAxisProps> {}

package/src/charts/axis/CategoryAxis.js

@@ -1,225 +1,225 @@
-import {Axis} from './Axis';
-import {VDOM} from '../../ui/Widget';
-import {isUndefined} from '../../util/isUndefined';
-import {isArray} from '../../util/isArray';
-
-export class CategoryAxis extends Axis {
-
-   declareData() {
-      super.declareData(...arguments, {
-         inverted: undefined,
-         uniform: undefined,
-         names: undefined,
-         values: undefined,
-         minSize: undefined
-      })
-   }
-
-   initInstance(context, instance) {
-      instance.calculator = new CategoryScale();
-   }
-
-   explore(context, instance) {
-      super.explore(context, instance);
-      var {values, names, inverted, uniform, minSize} = instance.data;
-      instance.calculator.reset(inverted, uniform, values, names, minSize);
-   }
-
-   render(context, instance, key) {
-      var {data, calculator} = instance;
-
-      if (!data.bounds.valid())
-         return null;
-
-      var formatter = v => calculator.names[v] || v;
-
-      return <g key={key} className={data.classNames} style={data.style}>
-         {this.renderTicksAndLabels(context, instance, formatter)}
-      </g>
-   }
-
-
-}
-
-CategoryAxis.prototype.baseClass = 'categoryaxis';
-CategoryAxis.prototype.anchors = '0 1 1 0';
-CategoryAxis.prototype.vertical = false;
-CategoryAxis.prototype.inverted = false;
-CategoryAxis.prototype.uniform = false;
-CategoryAxis.prototype.labelOffset = 10;
-CategoryAxis.prototype.labelRotation = 0;
-CategoryAxis.prototype.labelAnchor = 'auto';
-CategoryAxis.prototype.labelDx = 'auto';
-CategoryAxis.prototype.labelDy = 'auto';
-CategoryAxis.prototype.minSize = 1;
-
-Axis.alias('category', CategoryAxis);
-
-class CategoryScale {
-
-   reset(inverted, uniform, values, names, minSize) {
-      this.padding = 0.5;
-      delete this.min;
-      delete this.max;
-      delete this.minValue;
-      delete this.maxValue;
-      this.minSize = minSize;
-      this.valuesMap = {};
-      this.valueList = [];
-      this.inverted = inverted;
-      this.uniform = uniform;
-      this.valueStacks = {};
-      this.names = {};
-
-      if (values) {
-         if (isArray(values))
-            values.forEach(v=>this.acknowledge(v));
-         else if (typeof values == 'object')
-            for (var k in values) {
-               this.acknowledge(k);
-               this.names[k] = values[k];
-            }
-      }
-
-      if (names) {
-         if (isArray(names)) {
-            values = values || [];
-            names.forEach((name, index) => {
-               var value = values[index];
-               this.names[value != null ? value : index] = name;
-            })
-         }
-         else
-            this.names = names;
-      }
-   }
-
-   decodeValue(n) {
-      return n;
-   }
-
-   encodeValue(v) {
-      return v;
-   }
-
-   map(v, offset = 0) {
-
-      var index = this.valuesMap[v] || 0;
-
-      return this.origin + (index + offset - this.min + this.padding) * this.factor;
-   }
-
-
-   measure(a, b) {
-
-      this.a = a;
-      this.b = b;
-
-      if (this.min == null)
-         this.min = this.minValue || 0;
-
-      if (this.max == null)
-         this.max = !isNaN(this.maxValue) ? this.maxValue : 100;
-
-      var sign = this.inverted ? -1 : 1;
-
-      if (this.max - this.min + 1 < this.minSize) {
-         this.factor = sign * (this.b - this.a) / this.minSize;
-         this.origin = (this.b + this.a) * 0.5 - this.factor * (this.max - this.min + 1) / 2;
-      }
-      else {
-         this.factor = sign * (this.b - this.a) / (this.max - this.min + 2 * this.padding);
-         this.origin = this.a * (1 + sign) / 2 + this.b * (1 - sign) / 2; //a || b
-      }
-   }
-
-   hash() {
-      return {
-         origin: this.origin,
-         factor: this.factor,
-         min: this.min,
-         minSize: this.minSize,
-         padding: this.padding,
-         values: this.valueList.join(':'),
-         names: JSON.stringify(this.names)
-      }
-   }
-
-   isSame(x) {
-      var h = this.hash();
-      var same = x && !Object.keys(h).some(k=>x[k] !== h[k]);
-      this.shouldUpdate = !same;
-      return same;
-   }
-
-   acknowledge(value, width = 0, offset = 0) {
-
-      var index = this.valuesMap[value];
-      if (isUndefined(index)) {
-         index = this.valueList.length;
-         this.valueList.push(value);
-         this.valuesMap[value] = index;
-      }
-
-      if (this.minValue == null || index < this.minValue) {
-         this.minValue = index;
-         this.padding = Math.max(this.padding, Math.abs(offset - width / 2));
-      }
-      
-      if (this.maxValue == null || index > this.maxValue) {
-         this.maxValue = index;
-         this.padding = Math.max(this.padding, Math.abs(offset + width / 2));
-      }
-   }
-
-   book(value, name) {
-      if (this.uniform)
-         value = 0;
-
-      var stack = this.valueStacks[value];
-      if (!stack)
-         stack = this.valueStacks[value] = {
-            index: {},
-            count: 0
-         };
-      if (!stack.index.hasOwnProperty(name))
-         stack.index[name] = stack.count++;
-   }
-
-   locate(value, name) {
-      if (this.uniform)
-         value = 0;
-
-      var stack = this.valueStacks[value];
-      if (!stack)
-         return [0, 1];
-
-      return [stack.index[name], stack.count];
-   }
-
-   trackValue(v, offset = 0, constrain = false) {
-      let index = Math.round((v - this.origin) / this.factor - offset + this.min - this.padding);
-      if (index < this.min)
-         index = this.min;
-      if (index > this.max)
-         index = this.max;
-      return this.valueList[index];
-   }
-
-   findTickSize(minPxDist) {
-      return 1;
-   }
-
-   getTickSizes() {
-      return [1];
-   }
-
-   getTicks(tickSizes) {
-      return tickSizes.map(size => this.valueList);
-   }
-
-   mapGridlines() {
-      return Array.from({length: this.valueList.length + 1})
-                  .map((_, index) => this.origin + (index - 0.5 - this.min + this.padding) * this.factor);
-   }
+import {Axis} from './Axis';
+import {VDOM} from '../../ui/Widget';
+import {isUndefined} from '../../util/isUndefined';
+import {isArray} from '../../util/isArray';
+
+export class CategoryAxis extends Axis {
+
+   declareData() {
+      super.declareData(...arguments, {
+         inverted: undefined,
+         uniform: undefined,
+         names: undefined,
+         values: undefined,
+         minSize: undefined
+      })
+   }
+
+   initInstance(context, instance) {
+      instance.calculator = new CategoryScale();
+   }
+
+   explore(context, instance) {
+      super.explore(context, instance);
+      var {values, names, inverted, uniform, minSize} = instance.data;
+      instance.calculator.reset(inverted, uniform, values, names, minSize);
+   }
+
+   render(context, instance, key) {
+      var {data, calculator} = instance;
+
+      if (!data.bounds.valid())
+         return null;
+
+      var formatter = v => calculator.names[v] || v;
+
+      return <g key={key} className={data.classNames} style={data.style}>
+         {this.renderTicksAndLabels(context, instance, formatter)}
+      </g>
+   }
+
+
+}
+
+CategoryAxis.prototype.baseClass = 'categoryaxis';
+CategoryAxis.prototype.anchors = '0 1 1 0';
+CategoryAxis.prototype.vertical = false;
+CategoryAxis.prototype.inverted = false;
+CategoryAxis.prototype.uniform = false;
+CategoryAxis.prototype.labelOffset = 10;
+CategoryAxis.prototype.labelRotation = 0;
+CategoryAxis.prototype.labelAnchor = 'auto';
+CategoryAxis.prototype.labelDx = 'auto';
+CategoryAxis.prototype.labelDy = 'auto';
+CategoryAxis.prototype.minSize = 1;
+
+Axis.alias('category', CategoryAxis);
+
+class CategoryScale {
+
+   reset(inverted, uniform, values, names, minSize) {
+      this.padding = 0.5;
+      delete this.min;
+      delete this.max;
+      delete this.minValue;
+      delete this.maxValue;
+      this.minSize = minSize;
+      this.valuesMap = {};
+      this.valueList = [];
+      this.inverted = inverted;
+      this.uniform = uniform;
+      this.valueStacks = {};
+      this.names = {};
+
+      if (values) {
+         if (isArray(values))
+            values.forEach(v=>this.acknowledge(v));
+         else if (typeof values == 'object')
+            for (var k in values) {
+               this.acknowledge(k);
+               this.names[k] = values[k];
+            }
+      }
+
+      if (names) {
+         if (isArray(names)) {
+            values = values || [];
+            names.forEach((name, index) => {
+               var value = values[index];
+               this.names[value != null ? value : index] = name;
+            })
+         }
+         else
+            this.names = names;
+      }
+   }
+
+   decodeValue(n) {
+      return n;
+   }
+
+   encodeValue(v) {
+      return v;
+   }
+
+   map(v, offset = 0) {
+
+      var index = this.valuesMap[v] || 0;
+
+      return this.origin + (index + offset - this.min + this.padding) * this.factor;
+   }
+
+
+   measure(a, b) {
+
+      this.a = a;
+      this.b = b;
+
+      if (this.min == null)
+         this.min = this.minValue || 0;
+
+      if (this.max == null)
+         this.max = !isNaN(this.maxValue) ? this.maxValue : 100;
+
+      var sign = this.inverted ? -1 : 1;
+
+      if (this.max - this.min + 1 < this.minSize) {
+         this.factor = sign * (this.b - this.a) / this.minSize;
+         this.origin = (this.b + this.a) * 0.5 - this.factor * (this.max - this.min + 1) / 2;
+      }
+      else {
+         this.factor = sign * (this.b - this.a) / (this.max - this.min + 2 * this.padding);
+         this.origin = this.a * (1 + sign) / 2 + this.b * (1 - sign) / 2; //a || b
+      }
+   }
+
+   hash() {
+      return {
+         origin: this.origin,
+         factor: this.factor,
+         min: this.min,
+         minSize: this.minSize,
+         padding: this.padding,
+         values: this.valueList.join(':'),
+         names: JSON.stringify(this.names)
+      }
+   }
+
+   isSame(x) {
+      var h = this.hash();
+      var same = x && !Object.keys(h).some(k=>x[k] !== h[k]);
+      this.shouldUpdate = !same;
+      return same;
+   }
+
+   acknowledge(value, width = 0, offset = 0) {
+
+      var index = this.valuesMap[value];
+      if (isUndefined(index)) {
+         index = this.valueList.length;
+         this.valueList.push(value);
+         this.valuesMap[value] = index;
+      }
+
+      if (this.minValue == null || index < this.minValue) {
+         this.minValue = index;
+         this.padding = Math.max(this.padding, Math.abs(offset - width / 2));
+      }
+      
+      if (this.maxValue == null || index > this.maxValue) {
+         this.maxValue = index;
+         this.padding = Math.max(this.padding, Math.abs(offset + width / 2));
+      }
+   }
+
+   book(value, name) {
+      if (this.uniform)
+         value = 0;
+
+      var stack = this.valueStacks[value];
+      if (!stack)
+         stack = this.valueStacks[value] = {
+            index: {},
+            count: 0
+         };
+      if (!stack.index.hasOwnProperty(name))
+         stack.index[name] = stack.count++;
+   }
+
+   locate(value, name) {
+      if (this.uniform)
+         value = 0;
+
+      var stack = this.valueStacks[value];
+      if (!stack)
+         return [0, 1];
+
+      return [stack.index[name], stack.count];
+   }
+
+   trackValue(v, offset = 0, constrain = false) {
+      let index = Math.round((v - this.origin) / this.factor - offset + this.min - this.padding);
+      if (index < this.min)
+         index = this.min;
+      if (index > this.max)
+         index = this.max;
+      return this.valueList[index];
+   }
+
+   findTickSize(minPxDist) {
+      return 1;
+   }
+
+   getTickSizes() {
+      return [1];
+   }
+
+   getTicks(tickSizes) {
+      return tickSizes.map(size => this.valueList);
+   }
+
+   mapGridlines() {
+      return Array.from({length: this.valueList.length + 1})
+                  .map((_, index) => this.origin + (index - 0.5 - this.min + this.padding) * this.factor);
+   }
 }

package/src/charts/axis/CategoryAxis.scss

@@ -1,33 +1,33 @@
-
-@mixin cx-categoryaxis(
-   $name: 'categoryaxis',
-   $besm: $cx-besm
-) {
-   $block: map-get($besm, block);
-   $element: map-get($besm, element);
-   $state: map-get($besm, state);
-
-   .#{$block}#{$name} {
-      @include cxb-axis();
-   }
-
-   .#{$element}#{$name}-ticks {
-      @include cxe-axis-ticks();
-   }
-
-   .#{$element}#{$name}-line {
-      @include cxe-axis-line();
-   }
-
-   .#{$element}#{$name}-label {
-      @include cxe-axis-label();
-   }
-
-   .#{$element}#{$name}-label-offset {
-      @include cxe-axis-label-offset();
-   }
-}
-
-@if (cx-should-include('cx/charts/CategoryAxis')) {
-   @include cx-categoryaxis();
+
+@mixin cx-categoryaxis(
+   $name: 'categoryaxis',
+   $besm: $cx-besm
+) {
+   $block: map-get($besm, block);
+   $element: map-get($besm, element);
+   $state: map-get($besm, state);
+
+   .#{$block}#{$name} {
+      @include cxb-axis();
+   }
+
+   .#{$element}#{$name}-ticks {
+      @include cxe-axis-ticks();
+   }
+
+   .#{$element}#{$name}-line {
+      @include cxe-axis-line();
+   }
+
+   .#{$element}#{$name}-label {
+      @include cxe-axis-label();
+   }
+
+   .#{$element}#{$name}-label-offset {
+      @include cxe-axis-label-offset();
+   }
+}
+
+@if (cx-should-include('cx/charts/CategoryAxis')) {
+   @include cx-categoryaxis();
 }