cx 24.9.4 → 24.10.1

package/dist/svg.js

@@ -91,73 +91,70 @@ Rect.prototype.r = 0; //right
 Rect.prototype.t = 0; //top
 Rect.prototype.b = 0; //bottom
 
-function _arrayLikeToArray(r, a) {
-	(null == a || a > r.length) && (a = r.length);
-	for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
-	return n;
+function _extends() {
+	_extends = Object.assign
+		? Object.assign.bind()
+		: function (target) {
+				for (var i = 1; i < arguments.length; i++) {
+					var source = arguments[i];
+					for (var key in source) {
+						if (Object.prototype.hasOwnProperty.call(source, key)) {
+							target[key] = source[key];
+						}
+					}
+				}
+				return target;
+			};
+	return _extends.apply(this, arguments);
+}
+function _inheritsLoose(subClass, superClass) {
+	subClass.prototype = Object.create(superClass.prototype);
+	subClass.prototype.constructor = subClass;
+	_setPrototypeOf(subClass, superClass);
 }
-function _createForOfIteratorHelperLoose(r, e) {
-	var t = ("undefined" != typeof Symbol && r[Symbol.iterator]) || r["@@iterator"];
-	if (t) return (t = t.call(r)).next.bind(t);
-	if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e) {
-		t && (r = t);
-		var o = 0;
+function _setPrototypeOf(o, p) {
+	_setPrototypeOf = Object.setPrototypeOf
+		? Object.setPrototypeOf.bind()
+		: function _setPrototypeOf(o, p) {
+				o.__proto__ = p;
+				return o;
+			};
+	return _setPrototypeOf(o, p);
+}
+function _unsupportedIterableToArray(o, minLen) {
+	if (!o) return;
+	if (typeof o === "string") return _arrayLikeToArray(o, minLen);
+	var n = Object.prototype.toString.call(o).slice(8, -1);
+	if (n === "Object" && o.constructor) n = o.constructor.name;
+	if (n === "Map" || n === "Set") return Array.from(o);
+	if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
+}
+function _arrayLikeToArray(arr, len) {
+	if (len == null || len > arr.length) len = arr.length;
+	for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
+	return arr2;
+}
+function _createForOfIteratorHelperLoose(o, allowArrayLike) {
+	var it = (typeof Symbol !== "undefined" && o[Symbol.iterator]) || o["@@iterator"];
+	if (it) return (it = it.call(o)).next.bind(it);
+	if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike) {
+		if (it) o = it;
+		var i = 0;
 		return function () {
-			return o >= r.length
-				? {
-						done: !0,
-					}
-				: {
-						done: !1,
-						value: r[o++],
-					};
+			if (i >= o.length)
+				return {
+					done: true,
+				};
+			return {
+				done: false,
+				value: o[i++],
+			};
 		};
 	}
 	throw new TypeError(
 		"Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.",
 	);
 }
-function _extends() {
-	return (
-		(_extends = Object.assign
-			? Object.assign.bind()
-			: function (n) {
-					for (var e = 1; e < arguments.length; e++) {
-						var t = arguments[e];
-						for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
-					}
-					return n;
-				}),
-		_extends.apply(null, arguments)
-	);
-}
-function _inheritsLoose(t, o) {
-	(t.prototype = Object.create(o.prototype)), (t.prototype.constructor = t), _setPrototypeOf(t, o);
-}
-function _setPrototypeOf(t, e) {
-	return (
-		(_setPrototypeOf = Object.setPrototypeOf
-			? Object.setPrototypeOf.bind()
-			: function (t, e) {
-					return (t.__proto__ = e), t;
-				}),
-		_setPrototypeOf(t, e)
-	);
-}
-function _unsupportedIterableToArray(r, a) {
-	if (r) {
-		if ("string" == typeof r) return _arrayLikeToArray(r, a);
-		var t = {}.toString.call(r).slice(8, -1);
-		return (
-			"Object" === t && r.constructor && (t = r.constructor.name),
-			"Map" === t || "Set" === t
-				? Array.from(r)
-				: "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t)
-					? _arrayLikeToArray(r, a)
-					: void 0
-		);
-	}
-}
 
 var BoundedObject = /*#__PURE__*/ (function (_PureContainer) {
 	function BoundedObject() {

package/dist/ui.js

@@ -71,51 +71,6 @@ import { VDOM as VDOM$2 } from "cx-react";
 import { NumberCulture, DateTimeCulture } from "intl-io";
 import { jsx, jsxs } from "react/jsx-runtime";
 
-function _defineProperties(e, r) {
-	for (var t = 0; t < r.length; t++) {
-		var o = r[t];
-		(o.enumerable = o.enumerable || !1),
-			(o.configurable = !0),
-			"value" in o && (o.writable = !0),
-			Object.defineProperty(e, _toPropertyKey(o.key), o);
-	}
-}
-function _createClass(e, r, t) {
-	return (
-		t && _defineProperties(e, t),
-		Object.defineProperty(e, "prototype", {
-			writable: !1,
-		}),
-		e
-	);
-}
-function _extends() {
-	return (
-		(_extends = Object.assign
-			? Object.assign.bind()
-			: function (n) {
-					for (var e = 1; e < arguments.length; e++) {
-						var t = arguments[e];
-						for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
-					}
-					return n;
-				}),
-		_extends.apply(null, arguments)
-	);
-}
-function _inheritsLoose(t, o) {
-	(t.prototype = Object.create(o.prototype)), (t.prototype.constructor = t), _setPrototypeOf(t, o);
-}
-function _setPrototypeOf(t, e) {
-	return (
-		(_setPrototypeOf = Object.setPrototypeOf
-			? Object.setPrototypeOf.bind()
-			: function (t, e) {
-					return (t.__proto__ = e), t;
-				}),
-		_setPrototypeOf(t, e)
-	);
-}
 function _toPrimitive(t, r) {
 	if ("object" != typeof t || !t) return t;
 	var e = t[Symbol.toPrimitive];
@@ -130,6 +85,52 @@ function _toPropertyKey(t) {
 	var i = _toPrimitive(t, "string");
 	return "symbol" == typeof i ? i : i + "";
 }
+function _defineProperties(target, props) {
+	for (var i = 0; i < props.length; i++) {
+		var descriptor = props[i];
+		descriptor.enumerable = descriptor.enumerable || false;
+		descriptor.configurable = true;
+		if ("value" in descriptor) descriptor.writable = true;
+		Object.defineProperty(target, _toPropertyKey(descriptor.key), descriptor);
+	}
+}
+function _createClass(Constructor, protoProps, staticProps) {
+	if (staticProps) _defineProperties(Constructor, staticProps);
+	Object.defineProperty(Constructor, "prototype", {
+		writable: false,
+	});
+	return Constructor;
+}
+function _extends() {
+	_extends = Object.assign
+		? Object.assign.bind()
+		: function (target) {
+				for (var i = 1; i < arguments.length; i++) {
+					var source = arguments[i];
+					for (var key in source) {
+						if (Object.prototype.hasOwnProperty.call(source, key)) {
+							target[key] = source[key];
+						}
+					}
+				}
+				return target;
+			};
+	return _extends.apply(this, arguments);
+}
+function _inheritsLoose(subClass, superClass) {
+	subClass.prototype = Object.create(superClass.prototype);
+	subClass.prototype.constructor = subClass;
+	_setPrototypeOf(subClass, superClass);
+}
+function _setPrototypeOf(o, p) {
+	_setPrototypeOf = Object.setPrototypeOf
+		? Object.setPrototypeOf.bind()
+		: function _setPrototypeOf(o, p) {
+				o.__proto__ = p;
+				return o;
+			};
+	return _setPrototypeOf(o, p);
+}
 
 var computablePrefix = "computable-";
 var triggerPrefix = "trigger-";
@@ -3653,11 +3654,11 @@ var LabelsLeftLayout = /*#__PURE__*/ (function (_PureContainer) {
 		var CSS = this.CSS,
 			baseClass = this.baseClass;
 		var labelClass = CSS.expand(CSS.element(baseClass, "label"), data.labelClass);
-		var _addItem = function addItem(r, key) {
+		var addItem = function addItem(r, key) {
 			if (!r) return;
 			if (r.useParentLayout && isArray(r.content))
 				r.content.forEach(function (x, i) {
-					return _addItem(x, key + "-" + i);
+					return addItem(x, key + "-" + i);
 				});
 			else {
 				result.push(
@@ -3682,7 +3683,7 @@ var LabelsLeftLayout = /*#__PURE__*/ (function (_PureContainer) {
 			}
 		};
 		children.forEach(function (c) {
-			_addItem(c.vdom, c.key);
+			addItem(c.vdom, c.key);
 		});
 		return /*#__PURE__*/ jsx(
 			"table",
@@ -3727,18 +3728,18 @@ var LabelsTopLayout = /*#__PURE__*/ (function (_Container) {
 			fieldCells: [],
 			rowCapacities: [this.columns],
 		};
-		var _processContent = function processContent(r) {
+		var processContent = function processContent(r) {
 			if (!r) return;
 			if (isArray(r.content) && r.useParentLayout)
 				r.content.forEach(function (x) {
-					return _processContent(x);
+					return processContent(x);
 				});
 			else if (r.atomic && r.type == "layout-cell")
 				_this.addItem(state, isArray(r.content) && r.content.length == 1 ? r.content[0] : r.content, r.data);
 			else _this.addItem(state, r, {});
 		};
 		children.forEach(function (item) {
-			return _processContent(item.vdom);
+			return processContent(item.vdom);
 		});
 		this.addRow(state);
 		return /*#__PURE__*/ jsx(

package/dist/widgets.js

@@ -141,41 +141,45 @@ import { HtmlElement as HtmlElement$1 } from "cx/widgets";
 import { parseStyle as parseStyle$1 } from "cx/src/util/parseStyle";
 
 function _extends() {
-	return (
-		(_extends = Object.assign
-			? Object.assign.bind()
-			: function (n) {
-					for (var e = 1; e < arguments.length; e++) {
-						var t = arguments[e];
-						for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
+	_extends = Object.assign
+		? Object.assign.bind()
+		: function (target) {
+				for (var i = 1; i < arguments.length; i++) {
+					var source = arguments[i];
+					for (var key in source) {
+						if (Object.prototype.hasOwnProperty.call(source, key)) {
+							target[key] = source[key];
+						}
 					}
-					return n;
-				}),
-		_extends.apply(null, arguments)
-	);
+				}
+				return target;
+			};
+	return _extends.apply(this, arguments);
 }
-function _inheritsLoose(t, o) {
-	(t.prototype = Object.create(o.prototype)), (t.prototype.constructor = t), _setPrototypeOf(t, o);
+function _inheritsLoose(subClass, superClass) {
+	subClass.prototype = Object.create(superClass.prototype);
+	subClass.prototype.constructor = subClass;
+	_setPrototypeOf(subClass, superClass);
 }
-function _objectWithoutPropertiesLoose(r, e) {
-	if (null == r) return {};
-	var t = {};
-	for (var n in r)
-		if ({}.hasOwnProperty.call(r, n)) {
-			if (e.includes(n)) continue;
-			t[n] = r[n];
-		}
-	return t;
+function _setPrototypeOf(o, p) {
+	_setPrototypeOf = Object.setPrototypeOf
+		? Object.setPrototypeOf.bind()
+		: function _setPrototypeOf(o, p) {
+				o.__proto__ = p;
+				return o;
+			};
+	return _setPrototypeOf(o, p);
 }
-function _setPrototypeOf(t, e) {
-	return (
-		(_setPrototypeOf = Object.setPrototypeOf
-			? Object.setPrototypeOf.bind()
-			: function (t, e) {
-					return (t.__proto__ = e), t;
-				}),
-		_setPrototypeOf(t, e)
-	);
+function _objectWithoutPropertiesLoose(source, excluded) {
+	if (source == null) return {};
+	var target = {};
+	for (var key in source) {
+		if (Object.prototype.hasOwnProperty.call(source, key)) {
+			if (excluded.indexOf(key) >= 0) continue;
+			target[key] = source[key];
+		}
+	}
+	return target;
 }
 
 var impl$1 = false;
@@ -2267,16 +2271,16 @@ function captureMouseOrTouch2(e, _ref2) {
 				e.preventDefault();
 			});
 		};
-		var _end = function end(e) {
+		var end = function end(e) {
 			batchUpdates(function () {
 				el.removeEventListener("touchmove", move);
-				el.removeEventListener("touchend", _end);
+				el.removeEventListener("touchend", end);
 				if (onMouseUp) onMouseUp(e);
 				e.preventDefault();
 			});
 		};
 		el.addEventListener("touchmove", move);
-		el.addEventListener("touchend", _end);
+		el.addEventListener("touchend", end);
 		e.stopPropagation();
 	} else
 		captureMouse2(e, {
@@ -2717,7 +2721,7 @@ function notifyDragMove(e, captureData) {
 		}
 		if (scrollY || scrollX) {
 			if (!scrollTimer) {
-				var _cb = function cb() {
+				var cb = function cb() {
 					if (scrollY) {
 						var current = vscrollParent.scrollTop;
 						var next = Math.min(
@@ -2734,9 +2738,9 @@ function notifyDragMove(e, captureData) {
 						); //60 FPS
 						hscrollParent.scrollLeft = _next;
 					}
-					scrollTimer = requestAnimationFrame(_cb);
+					scrollTimer = requestAnimationFrame(cb);
 				};
-				scrollTimer = requestAnimationFrame(_cb);
+				scrollTimer = requestAnimationFrame(cb);
 			}
 		} else {
 			clearScrollTimer();
@@ -13891,7 +13895,7 @@ var WheelComponent = /*#__PURE__*/ (function (_VDOM$Component) {
 	_proto2.scrollTo = function scrollTo() {
 		var _this4 = this;
 		var size = this.props.size;
-		var _callback = function callback() {
+		var callback = function callback() {
 			if (!_this4.scrolling) return;
 			var x = (_this4.index * _this4.state.wheelHeight) / size;
 			var delta = Math.round(x - _this4.scrollEl.scrollTop);
@@ -13903,11 +13907,11 @@ var WheelComponent = /*#__PURE__*/ (function (_VDOM$Component) {
 			delta = Math.abs(delta) / 10;
 			if (delta < 1) delta = 1;
 			_this4.scrollEl.scrollTop += sign * delta;
-			requestAnimationFrame(_callback);
+			requestAnimationFrame(callback);
 		};
 		if (!this.scrolling) {
 			this.scrolling = true;
-			requestAnimationFrame(_callback);
+			requestAnimationFrame(callback);
 		}
 	};
 	return WheelComponent;

package/package.json

@@ -1,32 +1,32 @@
-{
-   "name": "cx",
-   "version": "24.9.4",
-   "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": "24.10.1",
+   "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

@@ -3,10 +3,24 @@ import { HtmlElement } from "../widgets/HtmlElement";
 import { PureContainer } from "../ui/PureContainer";
 import { getShape } from "./shapes";
 import { isUndefined } from "../util/isUndefined";
-import { isArray } from "../util/isArray";
+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 || {}, {
@@ -15,17 +29,13 @@ export class Legend extends HtmlElement {
       super.prepareData(context, instance);
    }
 
-   declareData() {
-      super.declareData(...arguments, {
-         shape: undefined,
-      });
-   }
-
    isValidHtmlAttribute(attrName) {
       switch (attrName) {
          case "shapeSize":
          case "svgSize":
          case "shape":
+         case "entryStyle":
+         case "entryClass":
             return false;
 
          default:
@@ -66,29 +76,31 @@ export class Legend extends HtmlElement {
       let entries = instance.legends[this.name] && instance.legends[this.name].entries,
          list;
 
-      if (isArray(entries) && entries.length > 0) {
-         list = (
-            <div key="wrap" className={CSS.element(this.baseClass, "wrap")}>
-               {entries.map((e, i) =>
-                  withHoverSync(i, e.hoverSync, e.hoverChannel, e.hoverId, ({ onMouseMove, onMouseLeave, hover }) => (
-                     <div
-                        key={i}
-                        className={CSS.element(this.baseClass, "entry", {
-                           "color-root": true,
-                           hover,
-                           disabled: e.disabled,
-                           selected: e.selected,
-                        })}
-                        onClick={e.onClick}
-                        onMouseMove={onMouseMove}
-                        onMouseLeave={onMouseLeave}
-                     >
-                        {this.renderShape(e, instance.data.shape)}
-                        {e.name}
-                     </div>
-                  )),
-               )}
-            </div>
+      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>
+            )),
          );
       }
 
@@ -101,18 +113,22 @@ export class Legend extends HtmlElement {
       });
       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`,
-               marginTop: `${-this.svgSize / 2}px`,
             }}
          >
             {shape(this.svgSize / 2, this.svgSize / 2, entry.shapeSize || this.shapeSize, {
-               style: entry.style,
-               className: className,
+               style,
+               className,
             })}
          </svg>
       );