cx 25.1.0 → 25.1.2

package/dist/widgets.js

@@ -10804,7 +10804,11 @@ var MonthPicker = /*#__PURE__*/ (function (_Field) {
 		if (!this.range && data.value) data.date = monthStart(parseDateInvariant(data.value));
 		if (this.range) {
 			if (data.from) data.from = monthStart(parseDateInvariant(data.from));
-			if (data.to) data.to = monthStart(parseDateInvariant(data.to));
+			if (data.to) {
+				var date = parseDateInvariant(data.to);
+				if (this.inclusiveTo) date.setDate(date.getDate() + 1);
+				data.to = monthStart(date);
+			}
 		}
 		if (data.refDate) data.refDate = monthStart(parseDateInvariant(data.refDate));
 		if (data.maxValue) data.maxValue = monthStart(parseDateInvariant(data.maxValue));
@@ -10852,7 +10856,9 @@ var MonthPicker = /*#__PURE__*/ (function (_Field) {
 		if (this.onBeforeSelect && instance.invoke("onBeforeSelect", e, instance, date1, date2) === false) return;
 		if (this.range) {
 			instance.set("from", encode(date1));
-			instance.set("to", encode(date2));
+			var toDate = new Date(date2);
+			if (this.inclusiveTo) toDate.setDate(toDate.getDate() - 1);
+			instance.set("to", encode(toDate));
 		} else instance.set("value", encode(date1));
 		if (this.onSelect) instance.invoke("onSelect", instance, date1, date2);
 	};
@@ -10869,6 +10875,7 @@ MonthPicker.prototype.maxValueErrorText = "Select {0:d} or before.";
 MonthPicker.prototype.maxExclusiveErrorText = "Select a date before {0:d}.";
 MonthPicker.prototype.minValueErrorText = "Select {0:d} or later.";
 MonthPicker.prototype.minExclusiveErrorText = "Select a date after {0:d}.";
+MonthPicker.prototype.inclusiveTo = false;
 Localization.registerPrototype("cx/widgets/MonthPicker", MonthPicker);
 Widget.alias("month-picker", MonthPicker);
 var validationCheck = function validationCheck(date, data) {
@@ -12090,7 +12097,7 @@ var MonthField = /*#__PURE__*/ (function (_Field) {
 		} else if (this.range && data.from && data.to) {
 			data.from = parseDateInvariant(data.from);
 			data.to = parseDateInvariant(data.to);
-			data.to.setDate(data.to.getDate() - 1);
+			if (!this.inclusiveTo) data.to.setDate(data.to.getDate() - 1);
 			var fromStr = this.culture.format(data.from, formatOptions);
 			var toStr = this.culture.format(data.to, formatOptions);
 			if (fromStr != toStr) data.formatted = fromStr + " - " + toStr;
@@ -12173,7 +12180,12 @@ var MonthField = /*#__PURE__*/ (function (_Field) {
 		});
 		if (this.range) {
 			var d1 = date1 ? encode(date1) : this.emptyValue;
-			var d2 = date2 ? encode(date2) : this.emptyValue;
+			var toDate = date2;
+			if (date2 && this.inclusiveTo) {
+				toDate = new Date(date2);
+				toDate.setDate(toDate.getDate() - 1);
+			}
+			var d2 = toDate ? encode(toDate) : this.emptyValue;
 			instance.set("from", d1);
 			instance.set("to", d2);
 		} else {
@@ -12195,6 +12207,7 @@ MonthField.prototype.showClear = true;
 MonthField.prototype.alwaysShowClear = false;
 MonthField.prototype.range = false;
 MonthField.prototype.reactOn = "enter blur";
+MonthField.prototype.inclusiveTo = false;
 Localization.registerPrototype("cx/widgets/MonthField", MonthField);
 Widget.alias("monthfield", MonthField);
 var MonthInput = /*#__PURE__*/ (function (_VDOM$Component) {
@@ -12235,6 +12248,7 @@ var MonthInput = /*#__PURE__*/ (function (_VDOM$Component) {
 					this.props.monthPicker,
 					{
 						encoding: widget.encoding,
+						inclusiveTo: widget.inclusiveTo,
 						autoFocus: true,
 						onFocusOut: function onFocusOut(e) {
 							_this2.closeDropdown(e);

package/package.json

@@ -1,32 +1,32 @@
-{
-   "name": "cx",
-   "version": "25.1.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",
-   "scripts": {
-      "build": "node build/index"
-   },
-   "author": "Codaxy",
-   "license": "MIT",
-   "bugs": {
-      "url": "https://github.com/codaxy/cxjs"
-   },
-   "homepage": "https://cxjs.io",
-   "dependencies": {
-      "intl-io": "^0.4.3",
-      "route-parser": "^0.0.5"
-   },
-   "peerDependencies": {
-      "@types/react": "*",
-      "react": "*",
-      "react-dom": "*"
-   },
-   "repository": {
-      "type": "git",
-      "url": "git@github.com:codaxy/cxjs.git"
-   },
-   "devDependencies": {
-      "react-test-renderer": "^18.3.1"
-   }
-}
+{
+   "name": "cx",
+   "version": "25.1.2",
+   "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",
+   "scripts": {
+      "build": "node build/index"
+   },
+   "author": "Codaxy",
+   "license": "MIT",
+   "bugs": {
+      "url": "https://github.com/codaxy/cxjs"
+   },
+   "homepage": "https://cxjs.io",
+   "dependencies": {
+      "intl-io": "^0.4.3",
+      "route-parser": "^0.0.5"
+   },
+   "peerDependencies": {
+      "@types/react": "*",
+      "react": "*",
+      "react-dom": "*"
+   },
+   "repository": {
+      "type": "git",
+      "url": "git@github.com:codaxy/cxjs.git"
+   },
+   "devDependencies": {
+      "react-test-renderer": "^18.3.1"
+   }
+}

package/src/charts/Legend.js

@@ -1,167 +1,167 @@
-import { Widget, VDOM } from "../ui/Widget";
-import { HtmlElement } from "../widgets/HtmlElement";
-import { PureContainer } from "../ui/PureContainer";
-import { getShape } from "./shapes";
-import { isUndefined } from "../util/isUndefined";
-import { isNonEmptyArray } from "../util/isNonEmptyArray";
-import { parseStyle } from "../util/parseStyle";
-import { withHoverSync } from "../ui/HoverSync";
-
-export class Legend extends HtmlElement {
-   declareData() {
-      super.declareData(...arguments, {
-         shape: undefined,
-         entryStyle: { structured: true },
-         entryClass: { structured: true },
-      });
-   }
-
-   init() {
-      this.entryStyle = parseStyle(this.entryStyle);
-      super.init();
-   }
-
-   prepareData(context, instance) {
-      let { data } = instance;
-      data.stateMods = Object.assign(data.stateMods || {}, {
-         vertical: this.vertical,
-      });
-      super.prepareData(context, instance);
-   }
-
-   isValidHtmlAttribute(attrName) {
-      switch (attrName) {
-         case "shapeSize":
-         case "svgSize":
-         case "shape":
-         case "entryStyle":
-         case "entryClass":
-            return false;
-
-         default:
-            return super.isValidHtmlAttribute(attrName);
-      }
-   }
-
-   explore(context, instance) {
-      if (!context.legends) context.legends = {};
-
-      instance.legends = context.legends;
-
-      context.addLegendEntry = (legendName, entry) => {
-         if (!legendName) return;
-
-         //case when all legends are scoped and new entry is added outside the scope
-         if (!context.legends) return;
-
-         let legend = context.legends[legendName];
-         if (!legend)
-            legend = context.legends[legendName] = {
-               entries: [],
-               names: {},
-            };
-
-         if (!legend.names[entry.name]) {
-            legend.entries.push(entry);
-            legend.names[entry.name] = entry;
-         }
-      };
-
-      super.explore(context, instance);
-   }
-
-   renderChildren(context, instance) {
-      const CSS = this.CSS;
-
-      let entries = instance.legends[this.name] && instance.legends[this.name].entries,
-         list;
-
-      let { entryClass, entryStyle, shape } = instance.data;
-
-      if (isNonEmptyArray(entries)) {
-         list = entries.map((e, i) =>
-            withHoverSync(i, e.hoverSync, e.hoverChannel, e.hoverId, ({ onMouseMove, onMouseLeave, hover }) => (
-               <div
-                  key={i}
-                  className={CSS.expand(
-                     CSS.element(this.baseClass, "entry", {
-                        "color-root": true,
-                        hover,
-                        disabled: e.disabled,
-                        selected: e.selected,
-                     }),
-                     entryClass,
-                  )}
-                  style={entryStyle}
-                  onClick={e.onClick}
-                  onMouseMove={onMouseMove}
-                  onMouseLeave={onMouseLeave}
-               >
-                  {this.renderShape(e, shape)}
-                  <div>{e.displayText || e.name}</div>
-               </div>
-            )),
-         );
-      }
-
-      return [list, super.renderChildren(context, instance)];
-   }
-
-   renderShape(entry, legendEntriesShape) {
-      const className = this.CSS.element(this.baseClass, "shape", {
-         [`color-${entry.colorIndex}`]: entry.colorIndex != null && (isUndefined(entry.active) || entry.active),
-      });
-      const shape = getShape(legendEntriesShape || entry.shape || "square");
-
-      // if the entry has a custom fill or stroke set, use it for both values
-      let style = { ...entry.style };
-      style.fill = style.fill ?? style.stroke;
-      style.stroke = style.stroke ?? style.fill;
-
-      return (
-         <svg
-            className={this.CSS.element(this.baseClass, "svg")}
-            style={{
-               width: `${this.svgSize}px`,
-               height: `${this.svgSize}px`,
-            }}
-         >
-            {shape(this.svgSize / 2, this.svgSize / 2, entry.shapeSize || this.shapeSize, {
-               style,
-               className,
-            })}
-         </svg>
-      );
-   }
-}
-
-Legend.prototype.name = "legend";
-Legend.prototype.baseClass = "legend";
-Legend.prototype.vertical = false;
-Legend.prototype.memoize = false;
-Legend.prototype.shapeSize = 18;
-Legend.prototype.shape = null;
-Legend.prototype.svgSize = 20;
-
-Widget.alias("legend", Legend);
-
-Legend.Scope = class extends PureContainer {
-   explore(context, instance) {
-      context.push("legends", (instance.legends = {}));
-      super.explore(context, instance);
-   }
-
-   exploreCleanup(context, instance) {
-      context.pop("legends");
-   }
-
-   prepare(context, instance) {
-      context.push("legends", instance.legends);
-   }
-
-   prepareCleanup(context, instance) {
-      context.pop("legends");
-   }
-};
-
-export const LegendScope = Legend.Scope;
+import { Widget, VDOM } from "../ui/Widget";
+import { HtmlElement } from "../widgets/HtmlElement";
+import { PureContainer } from "../ui/PureContainer";
+import { getShape } from "./shapes";
+import { isUndefined } from "../util/isUndefined";
+import { isNonEmptyArray } from "../util/isNonEmptyArray";
+import { parseStyle } from "../util/parseStyle";
+import { withHoverSync } from "../ui/HoverSync";
+
+export class Legend extends HtmlElement {
+   declareData() {
+      super.declareData(...arguments, {
+         shape: undefined,
+         entryStyle: { structured: true },
+         entryClass: { structured: true },
+      });
+   }
+
+   init() {
+      this.entryStyle = parseStyle(this.entryStyle);
+      super.init();
+   }
+
+   prepareData(context, instance) {
+      let { data } = instance;
+      data.stateMods = Object.assign(data.stateMods || {}, {
+         vertical: this.vertical,
+      });
+      super.prepareData(context, instance);
+   }
+
+   isValidHtmlAttribute(attrName) {
+      switch (attrName) {
+         case "shapeSize":
+         case "svgSize":
+         case "shape":
+         case "entryStyle":
+         case "entryClass":
+            return false;
+
+         default:
+            return super.isValidHtmlAttribute(attrName);
+      }
+   }
+
+   explore(context, instance) {
+      if (!context.legends) context.legends = {};
+
+      instance.legends = context.legends;
+
+      context.addLegendEntry = (legendName, entry) => {
+         if (!legendName) return;
+
+         //case when all legends are scoped and new entry is added outside the scope
+         if (!context.legends) return;
+
+         let legend = context.legends[legendName];
+         if (!legend)
+            legend = context.legends[legendName] = {
+               entries: [],
+               names: {},
+            };
+
+         if (!legend.names[entry.name]) {
+            legend.entries.push(entry);
+            legend.names[entry.name] = entry;
+         }
+      };
+
+      super.explore(context, instance);
+   }
+
+   renderChildren(context, instance) {
+      const CSS = this.CSS;
+
+      let entries = instance.legends[this.name] && instance.legends[this.name].entries,
+         list;
+
+      let { entryClass, entryStyle, shape } = instance.data;
+
+      if (isNonEmptyArray(entries)) {
+         list = entries.map((e, i) =>
+            withHoverSync(i, e.hoverSync, e.hoverChannel, e.hoverId, ({ onMouseMove, onMouseLeave, hover }) => (
+               <div
+                  key={i}
+                  className={CSS.expand(
+                     CSS.element(this.baseClass, "entry", {
+                        "color-root": true,
+                        hover,
+                        disabled: e.disabled,
+                        selected: e.selected,
+                     }),
+                     entryClass,
+                  )}
+                  style={entryStyle}
+                  onClick={e.onClick}
+                  onMouseMove={onMouseMove}
+                  onMouseLeave={onMouseLeave}
+               >
+                  {this.renderShape(e, shape)}
+                  <div>{e.displayText || e.name}</div>
+               </div>
+            )),
+         );
+      }
+
+      return [list, super.renderChildren(context, instance)];
+   }
+
+   renderShape(entry, legendEntriesShape) {
+      const className = this.CSS.element(this.baseClass, "shape", {
+         [`color-${entry.colorIndex}`]: entry.colorIndex != null && (isUndefined(entry.active) || entry.active),
+      });
+      const shape = getShape(legendEntriesShape || entry.shape || "square");
+
+      // if the entry has a custom fill or stroke set, use it for both values
+      let style = { ...entry.style };
+      style.fill = style.fill ?? style.stroke;
+      style.stroke = style.stroke ?? style.fill;
+
+      return (
+         <svg
+            className={this.CSS.element(this.baseClass, "svg")}
+            style={{
+               width: `${this.svgSize}px`,
+               height: `${this.svgSize}px`,
+            }}
+         >
+            {shape(this.svgSize / 2, this.svgSize / 2, entry.shapeSize || this.shapeSize, {
+               style,
+               className,
+            })}
+         </svg>
+      );
+   }
+}
+
+Legend.prototype.name = "legend";
+Legend.prototype.baseClass = "legend";
+Legend.prototype.vertical = false;
+Legend.prototype.memoize = false;
+Legend.prototype.shapeSize = 18;
+Legend.prototype.shape = null;
+Legend.prototype.svgSize = 20;
+
+Widget.alias("legend", Legend);
+
+Legend.Scope = class extends PureContainer {
+   explore(context, instance) {
+      context.push("legends", (instance.legends = {}));
+      super.explore(context, instance);
+   }
+
+   exploreCleanup(context, instance) {
+      context.pop("legends");
+   }
+
+   prepare(context, instance) {
+      context.push("legends", instance.legends);
+   }
+
+   prepareCleanup(context, instance) {
+      context.pop("legends");
+   }
+};
+
+export const LegendScope = Legend.Scope;

package/src/charts/Legend.scss

@@ -1,40 +1,40 @@
-@mixin cx-legend($name: "legend", $besm: $cx-besm) {
-   $block: map-get($besm, block);
-   $element: map-get($besm, element);
-   $state: map-get($besm, state);
-
-   .#{$block}#{$name} {
-      display: flex;
-      justify-content: center;
-      align-items: flex-start;
-      flex-wrap: wrap;
-      gap: 5px 10px;
-   }
-
-   .#{$block}#{$name}.#{$state}vertical {
-      flex-direction: column;
-   }
-
-   .#{$element}#{$name}-entry {
-      display: flex;
-      align-items: center;
-      padding: 5px;
-      gap: 5px;
-      font-size: smaller;
-      position: relative;
-      box-sizing: border-box;
-      cursor: pointer;
-   }
-
-   .#{$element}#{$name}-svg {
-      flex-shrink: 0;
-   }
-
-   .#{$element}#{$name}-shape {
-      fill: rgba(128, 128, 128, 0.1);
-   }
-}
-
-@if (cx-should-include("cx/charts/Legend")) {
-   @include cx-legend();
-}
+@mixin cx-legend($name: "legend", $besm: $cx-besm) {
+   $block: map-get($besm, block);
+   $element: map-get($besm, element);
+   $state: map-get($besm, state);
+
+   .#{$block}#{$name} {
+      display: flex;
+      justify-content: center;
+      align-items: flex-start;
+      flex-wrap: wrap;
+      gap: 5px 10px;
+   }
+
+   .#{$block}#{$name}.#{$state}vertical {
+      flex-direction: column;
+   }
+
+   .#{$element}#{$name}-entry {
+      display: flex;
+      align-items: center;
+      padding: 5px;
+      gap: 5px;
+      font-size: smaller;
+      position: relative;
+      box-sizing: border-box;
+      cursor: pointer;
+   }
+
+   .#{$element}#{$name}-svg {
+      flex-shrink: 0;
+   }
+
+   .#{$element}#{$name}-shape {
+      fill: rgba(128, 128, 128, 0.1);
+   }
+}
+
+@if (cx-should-include("cx/charts/Legend")) {
+   @include cx-legend();
+}