cx 25.5.1 → 25.6.0

package/dist/ui.js

@@ -2981,21 +2981,6 @@ var DataProxy = /*#__PURE__*/ (function (_PureContainer) {
 	_proto.init = function init() {
 		if (!this.data) this.data = {};
 		if (this.alias) this.data[this.alias] = this.value;
-
-		// nesting is required to avoid resetting the store on every render and recalculating the data
-		this.container = PureContainer.create({
-			type: PureContainer,
-			items: this.children || this.items,
-			layout: this.layout,
-			controller: this.controller,
-			outerLayout: this.outerLayout,
-			ws: this.ws,
-		});
-		this.children = [this.container];
-		delete this.items;
-		delete this.controller;
-		delete this.outerLayout;
-		this.layout = UseParentLayout;
 		_PureContainer.prototype.init.call(this);
 	};
 	_proto.initInstance = function initInstance(context, instance) {

package/dist/widgets.js

@@ -7340,7 +7340,10 @@ var Checkbox = /*#__PURE__*/ (function (_Field) {
 			"label",
 			{
 				className: data.classNames,
-				onMouseDown: stopPropagation,
+				onMouseDown: function onMouseDown(e) {
+					e.stopPropagation();
+					if (_this.unfocusable) e.preventDefault();
+				},
 				onMouseMove: function onMouseMove(e) {
 					return tooltipMouseMove$1.apply(void 0, [e].concat(getFieldTooltip(instance)));
 				},
@@ -10881,6 +10884,7 @@ MonthPicker.prototype.range = false;
 MonthPicker.prototype.startYear = 1980;
 MonthPicker.prototype.endYear = 2030;
 MonthPicker.prototype.bufferSize = 15;
+MonthPicker.prototype.hideQuarters = false;
 
 // Localization
 MonthPicker.prototype.maxValueErrorText = "Select {0:d} or before.";
@@ -10913,7 +10917,7 @@ var MonthPickerComponent = /*#__PURE__*/ (function (_VDOM$Component) {
 			cursorQuarter: cursor.getMonth() / 3,
 			column: "M",
 			start: widget.startYear,
-			end: widget.startYear + widget.bufferSize,
+			end: Math.min(widget.startYear + widget.bufferSize, widget.endYear),
 		};
 		_this.handleMouseDown = _this.handleMouseDown.bind(_this);
 		_this.handleMouseUp = _this.handleMouseUp.bind(_this);
@@ -11234,13 +11238,14 @@ var MonthPickerComponent = /*#__PURE__*/ (function (_VDOM$Component) {
 	};
 	_proto2.render = function render() {
 		var _this3 = this;
-		var _this$props$instance = this.props.instance,
-			data = _this$props$instance.data,
-			widget = _this$props$instance.widget;
+		var instance = this.props.instance;
+		var data = instance.data,
+			widget = instance.widget;
 		var CSS = widget.CSS,
 			baseClass = widget.baseClass,
 			startYear = widget.startYear,
-			endYear = widget.endYear;
+			endYear = widget.endYear,
+			hideQuarters = widget.hideQuarters;
 		var years = [];
 		var _this$state2 = this.state,
 			start = _this$state2.start,
@@ -11324,23 +11329,27 @@ var MonthPickerComponent = /*#__PURE__*/ (function (_VDOM$Component) {
 						),
 					);
 				}
-				row.push(
-					/*#__PURE__*/ jsx(
-						"th",
-						{
-							className: CSS.state({
-								cursor:
-									showCursor && this.state.column == "Q" && y == this.state.cursorYear && q == this.state.cursorQuarter,
-							}),
-							"data-point": "Y-" + y + "-Q-" + q,
-							onMouseEnter: this.handleMouseEnter,
-							onMouseDown: this.handleMouseDown,
-							onMouseUp: this.handleMouseUp,
-							children: "Q" + (q + 1),
-						},
-						"q" + q,
-					),
-				);
+				if (!hideQuarters)
+					row.push(
+						/*#__PURE__*/ jsx(
+							"th",
+							{
+								className: CSS.state({
+									cursor:
+										showCursor &&
+										this.state.column == "Q" &&
+										y == this.state.cursorYear &&
+										q == this.state.cursorQuarter,
+								}),
+								"data-point": "Y-" + y + "-Q-" + q,
+								onMouseEnter: this.handleMouseEnter,
+								onMouseDown: this.handleMouseDown,
+								onMouseUp: this.handleMouseUp,
+								children: "Q" + (q + 1),
+							},
+							"q" + q,
+						),
+					);
 				rows.push(row);
 			}
 			years.push(rows);
@@ -12156,7 +12165,7 @@ var MonthField = /*#__PURE__*/ (function (_Field) {
 			{
 				data: instance.data,
 				instance: instance,
-				monthPicker: {
+				monthPicker: _extends({}, this.monthPickerOptions, {
 					value: this.value,
 					from: this.from,
 					to: this.to,
@@ -12169,7 +12178,7 @@ var MonthField = /*#__PURE__*/ (function (_Field) {
 					maxExclusiveErrorText: this.maxExclusiveErrorText,
 					minValueErrorText: this.minValueErrorText,
 					minExclusiveErrorText: this.minExclusiveErrorText,
-				},
+				}),
 				label: this.labelPlacement && getContent(this.renderLabel(context, instance, "label")),
 				help: this.helpPlacement && getContent(this.renderHelp(context, instance, "help")),
 				icon: this.renderIcon(context, instance, "icon"),

package/package.json

@@ -1,6 +1,6 @@
 {
    "name": "cx",
-   "version": "25.5.1",
+   "version": "25.6.0",
    "description": "Advanced JavaScript UI framework for admin and dashboard applications with ready to use grid, form and chart components.",
    "main": "index.js",
    "jsnext:main": "src/index.js",

package/src/charts/LineGraph.js

@@ -103,7 +103,7 @@ export class LineGraph extends Widget {
          if (context.pointReducer && isArray(data.data)) {
             data.data.forEach((p, index) => {
                if (data.area && this.y0Field)
-                  context.pointReducer(p[this.xField], p[this.y0Field], data.name, p, data, index);
+                  context.pointReducer(p[this.xField], p[this.y0Field], data.name, p, data.data, index);
                context.pointReducer(p[this.xField], p[this.yField], data.name, p, data.data, index);
             });
          }

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

@@ -1,46 +1,46 @@
-import * as Cx from "../../core";
-import { AxisProps } from "./Axis";
-
-interface NumericAxisProps extends AxisProps {
-   /** Minimum value. */
-   min?: Cx.NumberProp;
-
-   /** Maximum value. */
-   max?: Cx.NumberProp;
-
-   /** Set to `true` to normalize the input range. */
-   normalized?: Cx.BooleanProp;
-
-   /** Number used to divide values before rendering axis labels. Default value is `1`. */
-   labelDivisor?: Cx.NumberProp;
-
-   /** Base CSS class to be applied to the element. Defaults to `numericaxis`. */
-   baseClass?: string;
-
-   tickDivisions?: Array<number[]>;
-
-   /** A number ranged between `0-2`. `0` means that the range is aligned with the lowest ticks. Default value is `1`, which means that the range is aligned with medium ticks. Use value `2` to align with major ticks. */
-   snapToTicks?: 0 | 1 | 2;
-
-   /** Value format. Default is `n`. */
-   format?: Cx.StringProp;
-
-   /** Size of a zone reserved for labels for both lower and upper end of the axis. */
-   deadZone?: Cx.NumberProp;
-
-   /** Size of a zone reserved for labels near the upper (higher) end of the axis.  */
-   upperDeadZone?: Cx.NumberProp;
-
-   /** Size of a zone reserved for labels near the lower end of the axis.   */
-   lowerDeadZone?: Cx.NumberProp;
-
-   /** Specifies minimum value increment between labels. Useful when formatting is not flexible enough, i.e. set to 1 for integer axes to avoid duplicate labels. */
-   minLabelTickSize?: number;
-}
-
-export class NumericAxis extends Cx.Widget<NumericAxisProps> {
-   static XY(): {
-      x: { type: NumericAxis };
-      y: { type: NumericAxis; vertical: true };
-   };
-}
+import * as Cx from "../../core";
+import { AxisProps } from "./Axis";
+
+interface NumericAxisProps extends AxisProps {
+   /** Minimum value. */
+   min?: Cx.NumberProp;
+
+   /** Maximum value. */
+   max?: Cx.NumberProp;
+
+   /** Set to `true` to normalize the input range. */
+   normalized?: Cx.BooleanProp;
+
+   /** Number used to divide values before rendering axis labels. Default value is `1`. */
+   labelDivisor?: Cx.NumberProp;
+
+   /** Base CSS class to be applied to the element. Defaults to `numericaxis`. */
+   baseClass?: string;
+
+   tickDivisions?: Array<number[]>;
+
+   /** A number ranged between `0-2`. `0` means that the range is aligned with the lowest ticks. Default value is `1`, which means that the range is aligned with medium ticks. Use value `2` to align with major ticks. */
+   snapToTicks?: 0 | 1 | 2;
+
+   /** Value format. Default is `n`. */
+   format?: Cx.StringProp;
+
+   /** Size of a zone reserved for labels for both lower and upper end of the axis. */
+   deadZone?: Cx.NumberProp;
+
+   /** Size of a zone reserved for labels near the upper (higher) end of the axis.  */
+   upperDeadZone?: Cx.NumberProp;
+
+   /** Size of a zone reserved for labels near the lower end of the axis.   */
+   lowerDeadZone?: Cx.NumberProp;
+
+   /** Specifies minimum value increment between labels. Useful when formatting is not flexible enough, i.e. set to 1 for integer axes to avoid duplicate labels. */
+   minLabelTickSize?: number;
+}
+
+export class NumericAxis extends Cx.Widget<NumericAxisProps> {
+   static XY(): {
+      x: { type: NumericAxis };
+      y: { type: NumericAxis; vertical: true };
+   };
+}

package/src/charts/helpers/PointReducer.d.ts

@@ -10,6 +10,15 @@ export interface PointReducerProps extends Cx.PureContainerProps {
 
    /** A callback function used to process accumulated information and write results. */
    onReduce?: (accumulator: Cx.Record, instance?: Instance) => void;
+
+   /** Parameters that trigger filter predicate re-creation. */
+   filterParams?: StructuredProp;
+
+   /** A callback function used to create a predicate for filtering points. */
+   onCreatePointFilter?: (
+      filterParams: any,
+      instance: Instance,
+   ) => (x: number, y: number, name: string, data: any, array?: any[], index?: number) => boolean;
 }
 
 export class PointReducer extends Cx.Widget<PointReducerProps> {}

package/src/charts/helpers/PointReducer.js

@@ -1,34 +1,48 @@
 import { PureContainer } from "../../ui/PureContainer";
 
 export class PointReducer extends PureContainer {
+   declareData() {
+      super.declareData(...arguments, {
+         filterParams: {
+            structured: true,
+         },
+      });
+   }
+
+   prepareData(context, instance) {
+      super.prepareData(context, instance);
+
+      instance.resetAccumulator = () => {
+         let accumulator = {};
+         if (this.onInitAccumulator) {
+            instance.invoke("onInitAccumulator", accumulator, instance);
+            instance.accumulator = accumulator;
+         }
+      };
+
+      if (this.onCreatePointFilter)
+         instance.pointFilter = instance.invoke("onCreatePointFilter", instance.data.filterParams, instance);
+   }
+
    explore(context, instance) {
+      instance.resetAccumulator();
+
       let parentPointReducer = context.pointReducer;
       instance.parentPointTracker = parentPointReducer;
 
-      if (!instance.pointReducer) {
-         let onMap = this.onMap && instance.getCallback("onMap");
-         let accumulator = {};
-         instance.resetAccumulator = () => {
-            accumulator = {};
-            if (this.onInitAccumulator) instance.invoke("onInitAccumulator", accumulator, instance);
-         };
-
-         let pointFilter = null;
-         if (this.onCreatePointFilter) pointFilter = instance.invoke("onCreatePointFilter", instance);
-
-         instance.pointReducer = (x, y, name, data, array, index) => {
-            if (!pointFilter || pointFilter(x, y, name, data, array, index))
-               onMap(accumulator, x, y, name, data, array, index);
-            if (parentPointReducer) parentPointReducer(x, y, name, data, array, index);
-         };
-         instance.write = () => {
-            if (this.onReduce) instance.invoke("onReduce", accumulator, instance);
-         };
-      }
+      let pointFilter = instance.pointFilter;
+      let accumulator = instance.accumulator;
+      let onMap = this.onMap && instance.getCallback("onMap");
+      instance.pointReducer = (x, y, name, data, array, index) => {
+         if (!pointFilter || pointFilter(x, y, name, data, array, index))
+            onMap(accumulator, x, y, name, data, array, index);
+         if (parentPointReducer) parentPointReducer(x, y, name, data, array, index);
+      };
+      instance.write = () => {
+         if (this.onReduce) instance.invoke("onReduce", accumulator, instance);
+      };
 
-      instance.resetAccumulator();
       context.push("pointReducer", instance.pointReducer);
-
       super.explore(context, instance);
    }
 

package/src/data/AugmentedViewBase.js

@@ -1,77 +1,77 @@
-import { View } from "./View";
-import { Binding } from "./Binding";
-
-export class AugmentedViewBase extends View {
-   getData() {
-      if (this.sealed && this.meta.version === this.cache.version && this.meta === this.store.meta)
-         return this.cache.result;
-      let parentStoreData = this.store.getData();
-      let result = this.getBaseData(parentStoreData);
-      this.embedAugmentData(result, parentStoreData);
-      this.cache.result = result;
-      this.cache.parentStoreData = parentStoreData;
-      this.cache.version = this.meta.version;
-      this.meta = this.store.meta;
-      return this.cache.result;
-   }
-
-   getBaseData(parentStoreData) {
-      if (this.sealed || this.immutable || this.store.sealed) return { ...parentStoreData };
-      return parentStoreData;
-   }
-
-   embedAugmentData(result, parentStoreData) {
-      throw new Error("abstract");
-   }
-
-   isExtraKey(key) {
-      throw new Error("abstract");
-   }
-
-   // Stores which need to support nested aliases should override this method
-   getExtraKeyBinding(key) {
-      let binding = Binding.get(key);
-      return this.isExtraKey(binding.parts[0]) ? Binding.get(binding.parts[0]) : null;
-   }
-
-   setExtraKeyValue(key, value) {
-      throw new Error("abstract");
-   }
-
-   deleteExtraKeyValue(key) {
-      throw new Error("abstract");
-   }
-
-   setItem(path, value) {
-      let extraKeyBinding = this.getExtraKeyBinding(path);
-      if (extraKeyBinding) {
-         let binding = Binding.get(path);
-         let newValue = value;
-         if (binding.parts.length > extraKeyBinding.parts.length) {
-            let data = {};
-            this.embedAugmentData(data, this.store.getData());
-            let binding = Binding.get(path);
-            data = binding.set(data, value);
-            newValue = extraKeyBinding.value(data);
-         }
-         return this.setExtraKeyValue(extraKeyBinding.path, newValue);
-      }
-      return super.setItem(path, value);
-   }
-
-   deleteItem(path) {
-      let extraKeyBinding = this.getExtraKeyBinding(path);
-      if (extraKeyBinding) {
-         if (path == extraKeyBinding.path) return this.deleteExtraKeyValue(extraKeyBinding.path);
-         let data = {};
-         this.embedAugmentData(data, this.store.getData());
-         let binding = Binding.get(path);
-         data = binding.delete(data);
-         let newValue = extraKeyBinding.value(data);
-         return this.setExtraKeyValue(extraKeyBinding.path, newValue);
-      }
-      return super.deleteItem(path);
-   }
-}
-
-AugmentedViewBase.prototype.immutable = false;
+import { View } from "./View";
+import { Binding } from "./Binding";
+
+export class AugmentedViewBase extends View {
+   getData() {
+      if (this.sealed && this.meta.version === this.cache.version && this.meta === this.store.meta)
+         return this.cache.result;
+      let parentStoreData = this.store.getData();
+      let result = this.getBaseData(parentStoreData);
+      this.embedAugmentData(result, parentStoreData);
+      this.cache.result = result;
+      this.cache.parentStoreData = parentStoreData;
+      this.cache.version = this.meta.version;
+      this.meta = this.store.meta;
+      return this.cache.result;
+   }
+
+   getBaseData(parentStoreData) {
+      if (this.sealed || this.immutable || this.store.sealed) return { ...parentStoreData };
+      return parentStoreData;
+   }
+
+   embedAugmentData(result, parentStoreData) {
+      throw new Error("abstract");
+   }
+
+   isExtraKey(key) {
+      throw new Error("abstract");
+   }
+
+   // Stores which need to support nested aliases should override this method
+   getExtraKeyBinding(key) {
+      let binding = Binding.get(key);
+      return this.isExtraKey(binding.parts[0]) ? Binding.get(binding.parts[0]) : null;
+   }
+
+   setExtraKeyValue(key, value) {
+      throw new Error("abstract");
+   }
+
+   deleteExtraKeyValue(key) {
+      throw new Error("abstract");
+   }
+
+   setItem(path, value) {
+      let extraKeyBinding = this.getExtraKeyBinding(path);
+      if (extraKeyBinding) {
+         let binding = Binding.get(path);
+         let newValue = value;
+         if (binding.parts.length > extraKeyBinding.parts.length) {
+            let data = {};
+            this.embedAugmentData(data, this.store.getData());
+            let binding = Binding.get(path);
+            data = binding.set(data, value);
+            newValue = extraKeyBinding.value(data);
+         }
+         return this.setExtraKeyValue(extraKeyBinding.path, newValue);
+      }
+      return super.setItem(path, value);
+   }
+
+   deleteItem(path) {
+      let extraKeyBinding = this.getExtraKeyBinding(path);
+      if (extraKeyBinding) {
+         if (path == extraKeyBinding.path) return this.deleteExtraKeyValue(extraKeyBinding.path);
+         let data = {};
+         this.embedAugmentData(data, this.store.getData());
+         let binding = Binding.get(path);
+         data = binding.delete(data);
+         let newValue = extraKeyBinding.value(data);
+         return this.setExtraKeyValue(extraKeyBinding.path, newValue);
+      }
+      return super.deleteItem(path);
+   }
+}
+
+AugmentedViewBase.prototype.immutable = false;

package/src/data/ExposedRecordView.js

@@ -1,75 +1,75 @@
-import { View } from "./View";
-import { Binding } from "./Binding";
-
-export class ExposedRecordView extends View {
-   getData() {
-      if (
-         this.sealed &&
-         this.meta.version === this.cache.version &&
-         this.cache.itemIndex === this.itemIndex &&
-         this.meta === this.store.meta
-      )
-         return this.cache.result;
-
-      this.cache.result = this.embed(this.store.getData());
-      this.cache.version = this.meta.version;
-      this.cache.itemIndex = this.itemIndex;
-      this.meta = this.store.meta;
-      return this.cache.result;
-   }
-
-   embed(data) {
-      const collection = this.collectionBinding.value(data);
-      const record = collection[this.itemIndex];
-      const copy = this.sealed || this.immutable || this.store.sealed ? { ...data } : data;
-      copy[this.recordName] = record;
-      if (this.indexName) copy[this.indexName] = this.itemIndex;
-      return copy;
-   }
-
-   setIndex(index) {
-      this.itemIndex = index;
-   }
-
-   setItem(path, value) {
-      if (path == this.recordName || path.indexOf(this.recordName + ".") == 0) {
-         const storeData = this.store.getData();
-         const collection = this.collectionBinding.value(storeData);
-         const data = this.embed(storeData);
-         const d = Binding.get(path).set(data, value);
-         if (d === data) return false;
-         const record = d[this.recordName];
-         const newCollection = [
-            ...collection.slice(0, this.itemIndex),
-            record,
-            ...collection.slice(this.itemIndex + 1),
-         ];
-         return this.store.setItem(this.collectionBinding.path, newCollection);
-      }
-      return this.store.setItem(path, value);
-   }
-
-   deleteItem(path) {
-      let storeData, collection, newCollection;
-
-      if (path == this.recordName) {
-         storeData = this.store.getData();
-         collection = this.collectionBinding.value(storeData);
-         newCollection = [...collection.slice(0, this.itemIndex), ...collection.slice(this.itemIndex + 1)];
-         return this.store.setItem(this.collectionBinding.path, newCollection);
-      } else if (path.indexOf(this.recordName + ".") == 0) {
-         storeData = this.store.getData();
-         collection = this.collectionBinding.value(storeData);
-         const data = this.embed(storeData);
-         const d = Binding.get(path).delete(data);
-         if (d === data) return false;
-         const record = d[this.recordName];
-         newCollection = [...collection.slice(0, this.itemIndex), record, ...collection.slice(this.itemIndex + 1)];
-         return this.store.setItem(this.collectionBinding.path, newCollection);
-      }
-
-      return this.store.deleteItem(path);
-   }
-}
-
-ExposedRecordView.prototype.immutable = false;
+import { View } from "./View";
+import { Binding } from "./Binding";
+
+export class ExposedRecordView extends View {
+   getData() {
+      if (
+         this.sealed &&
+         this.meta.version === this.cache.version &&
+         this.cache.itemIndex === this.itemIndex &&
+         this.meta === this.store.meta
+      )
+         return this.cache.result;
+
+      this.cache.result = this.embed(this.store.getData());
+      this.cache.version = this.meta.version;
+      this.cache.itemIndex = this.itemIndex;
+      this.meta = this.store.meta;
+      return this.cache.result;
+   }
+
+   embed(data) {
+      const collection = this.collectionBinding.value(data);
+      const record = collection[this.itemIndex];
+      const copy = this.sealed || this.immutable || this.store.sealed ? { ...data } : data;
+      copy[this.recordName] = record;
+      if (this.indexName) copy[this.indexName] = this.itemIndex;
+      return copy;
+   }
+
+   setIndex(index) {
+      this.itemIndex = index;
+   }
+
+   setItem(path, value) {
+      if (path == this.recordName || path.indexOf(this.recordName + ".") == 0) {
+         const storeData = this.store.getData();
+         const collection = this.collectionBinding.value(storeData);
+         const data = this.embed(storeData);
+         const d = Binding.get(path).set(data, value);
+         if (d === data) return false;
+         const record = d[this.recordName];
+         const newCollection = [
+            ...collection.slice(0, this.itemIndex),
+            record,
+            ...collection.slice(this.itemIndex + 1),
+         ];
+         return this.store.setItem(this.collectionBinding.path, newCollection);
+      }
+      return this.store.setItem(path, value);
+   }
+
+   deleteItem(path) {
+      let storeData, collection, newCollection;
+
+      if (path == this.recordName) {
+         storeData = this.store.getData();
+         collection = this.collectionBinding.value(storeData);
+         newCollection = [...collection.slice(0, this.itemIndex), ...collection.slice(this.itemIndex + 1)];
+         return this.store.setItem(this.collectionBinding.path, newCollection);
+      } else if (path.indexOf(this.recordName + ".") == 0) {
+         storeData = this.store.getData();
+         collection = this.collectionBinding.value(storeData);
+         const data = this.embed(storeData);
+         const d = Binding.get(path).delete(data);
+         if (d === data) return false;
+         const record = d[this.recordName];
+         newCollection = [...collection.slice(0, this.itemIndex), record, ...collection.slice(this.itemIndex + 1)];
+         return this.store.setItem(this.collectionBinding.path, newCollection);
+      }
+
+      return this.store.deleteItem(path);
+   }
+}
+
+ExposedRecordView.prototype.immutable = false;