cx 26.9.0 → 26.9.2

package/dist/widgets.js

@@ -18271,7 +18271,7 @@ class Grid extends ContainerBase$1 {
 			},
 		});
 	}
-	renderHeader(context, instance, key, fixed, fixedColumns) {
+	renderHeader(context, instance, key, fixed, fixedColumns, repeated) {
 		let { data, widget, header } = instance;
 		let { CSS, baseClass } = widget;
 		let headerRows = [];
@@ -18427,13 +18427,15 @@ class Grid extends ContainerBase$1 {
 			}
 		});
 		if (headerRows.length == 0) return null;
-		return jsx(
-			"tbody",
+		//headers repeated for each group sit between the data rows, where a second thead
+		//would not be allowed
+		return VDOM$2.createElement(
+			repeated ? "tbody" : "thead",
 			{
+				key: "h" + key,
 				className: CSS.element(baseClass, "header"),
-				children: headerRows,
 			},
-			"h" + key,
+			headerRows,
 		);
 	}
 	onHeaderMouseMove(e, column, columnInstance, gridInstance, headerLine) {
@@ -18541,6 +18543,7 @@ class Grid extends ContainerBase$1 {
 					children: jsx("tr", {
 						children: jsx("td", {
 							colSpan: 1000,
+							role: "columnheader",
 							children: caption,
 						}),
 					}),
@@ -18605,6 +18608,7 @@ class Grid extends ContainerBase$1 {
 						{
 							className: cls,
 							colSpan: colSpan,
+							role: c.caption ? "columnheader" : undefined,
 							style: style,
 							children: v,
 						},
@@ -18771,9 +18775,9 @@ class Grid extends ContainerBase$1 {
 						),
 					);
 				if (g.showHeader) {
-					record.vdom.push(this.renderHeader(context, instance, record.key + "-header", false, false));
+					record.vdom.push(this.renderHeader(context, instance, record.key + "-header", false, false, true));
 					if (hasFixedColumns)
-						record.fixedVdom.push(this.renderHeader(context, instance, record.key + "-header", false, true));
+						record.fixedVdom.push(this.renderHeader(context, instance, record.key + "-header", false, true, true));
 				}
 			}
 			if (record.type == "group-footer") {
@@ -19107,6 +19111,29 @@ class GridComponent extends VDOM$2.Component {
 			);
 		};
 	}
+	groupLooseRows(items) {
+		let { CSS, baseClass } = this.props.instance.widget;
+		let result = [];
+		for (let i = 0; i < items.length; i++) {
+			if (!items[i]?.props?.useTrTag) {
+				result.push(items[i]);
+				continue;
+			}
+			let start = i;
+			while (i + 1 < items.length && items[i + 1]?.props?.useTrTag) i++;
+			result.push(
+				jsx(
+					"tbody",
+					{
+						className: CSS.element(baseClass, "row-group"),
+						children: items.slice(start, i + 1),
+					},
+					`rows-${items[start].key}`,
+				),
+			);
+		}
+		return result;
+	}
 	render() {
 		let { instance, data, fixedFooter, fixedColumnsFixedFooter } = this.props;
 		let { widget, hasFixedColumns } = instance;
@@ -19353,6 +19380,12 @@ class GridComponent extends VDOM$2.Component {
 				if (hasFixedColumns) fixedChildren.push(fixedColumnsFixedFooter);
 			}
 		}
+		//grids with merged cells render rows as tr elements, as rowspan cannot cross row group
+		//boundaries, so consecutive rows have to share a tbody instead of getting one each
+		if (instance.row.hasMergedCells) {
+			children = this.groupLooseRows(children);
+			if (hasFixedColumns) fixedChildren = this.groupLooseRows(fixedChildren);
+		}
 		let shouldRenderFixedFooter = widget.scrollable && (fixedFooter || fixedColumnsFixedFooter);
 		if (hasFixedColumns) {
 			fixedColumnsContent.push(
@@ -20250,16 +20283,18 @@ class GridComponent extends VDOM$2.Component {
 					if (this.state.focused && !this.state.cellEdit && wasCellEditing) FocusManager.focus(this.dom.el);
 					if (scrollIntoView) {
 						let record = this.getRecordAt(index);
-						let item = record && this.dom.table.querySelector(`tbody[data-record-key="${record.key}"]`);
+						//rows are tbody elements, except in grids with merged cells, where they are tr
+						let cellsOf = (rowEl) => (rowEl.tagName == "TR" ? rowEl : rowEl.firstChild).children;
+						let item = record && this.dom.table.querySelector(`[data-record-key="${record.key}"]`);
 						let hscroll = false;
 						if (item) {
 							if (widget.cellEditable)
 								if (this.state.cursorCellIndex >= this.props.instance.fixedColumnCount) {
 									hscroll = true;
-									item = item.firstChild.children[this.state.cursorCellIndex - this.props.instance.fixedColumnCount];
+									item = cellsOf(item)[this.state.cursorCellIndex - this.props.instance.fixedColumnCount];
 								} else {
-									let fixedItem = this.dom.fixedTable.querySelector(`tbody[data-record-key="${record.key}"]`);
-									let cell = fixedItem && fixedItem.firstChild.children[this.state.cursorCellIndex];
+									let fixedItem = this.dom.fixedTable.querySelector(`[data-record-key="${record.key}"]`);
+									let cell = fixedItem && cellsOf(fixedItem)[this.state.cursorCellIndex];
 									if (cell) scrollElementIntoView(cell, false, true, 10);
 								}
 							scrollElementIntoView(item, true, hscroll, widget.cellEditable ? 10 : 0);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "cx",
-  "version": "26.9.0",
+  "version": "26.9.2",
   "description": "Advanced JavaScript UI framework for admin and dashboard applications with ready to use grid, form and chart components.",
   "exports": {
     "./data": {

package/src/data/index.ts

@@ -1,30 +1,31 @@
-export * from "./Binding";
-export * from "./Expression";
-export * from "./StringTemplate";
-export * from "./View";
-export * from "./SubscribableView";
-export * from "./Store";
-export * from "./ExposedRecordView";
-export * from "./ExposedValueView";
-export * from "./ReadOnlyDataView";
-export * from "./ZoomIntoPropertyView";
-export * from "./StructuredSelector";
-export * from "./computable";
-export * from "./getSelector";
-export * from "./isSelector";
-export * from "./Grouper";
-export * from "./comparer";
-export * from "./enableFatArrowExpansion";
-export * from "./ops/index";
-export * from "./diff/index";
-export * from "./Ref";
-export * from "./ArrayRef";
-export * from "./StoreProxy";
-export * from "./AugmentedViewBase";
-export * from "./ArrayElementView";
-export * from "./getAccessor";
-export * from "./defaultCompare";
-export * from "./NestedDataView";
-
-export * from "./createAccessorModelProxy";
-export * from "./Selector";
+export * from "./Binding";
+export * from "./Expression";
+export * from "./StringTemplate";
+export * from "./View";
+export * from "./SubscribableView";
+export * from "./Store";
+export * from "./ExposedRecordView";
+export * from "./ExposedValueView";
+export * from "./ReadOnlyDataView";
+export * from "./ZoomIntoPropertyView";
+export * from "./StructuredSelector";
+export * from "./computable";
+export * from "./getSelector";
+export * from "./isSelector";
+export * from "./Grouper";
+export * from "./comparer";
+export * from "./enableFatArrowExpansion";
+export * from "./ops/index";
+export * from "./diff/index";
+export * from "./Ref";
+export * from "./ArrayRef";
+export * from "./StoreProxy";
+export * from "./AugmentedViewBase";
+export * from "./ArrayElementView";
+export * from "./getAccessor";
+export * from "./defaultCompare";
+export * from "./NestedDataView";
+export * from "./AggregateFunction";
+
+export * from "./createAccessorModelProxy";
+export * from "./Selector";