@hpcc-js/dgrid2 3.1.0 → 3.1.1

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@hpcc-js/dgrid2",
-    "version": "3.1.0",
+    "version": "3.1.1",
     "description": "hpcc-js - DGrid2",
     "type": "module",
     "exports": {
@@ -41,13 +41,8 @@
     },
     "devDependencies": {
         "@hpcc-js/esbuild-plugins": "^1.3.0",
-        "react": "18.3.1",
-        "react-data-grid": "7.0.0-beta.47",
-        "react-dom": "18.3.1"
-    },
-    "peerDependencies": {
-        "react": "^17.0.0 || ^18.0.0",
-        "react-dom": "^17.0.0 || ^18.0.0"
+        "@hpcc-js/preact-shim": "^3.0.0",
+        "react-data-grid": "7.0.0-beta.47"
     },
     "repository": {
         "type": "git",
@@ -60,5 +55,5 @@
         "url": "https://github.com/hpcc-systems/Visualization/issues"
     },
     "homepage": "https://github.com/hpcc-systems/Visualization",
-    "gitHead": "658c50fd965a7744ba8db675ba6878607c44d5e2"
+    "gitHead": "b4f63e027feea45ebdfc578ef9c85d107bd97322"
 }

package/src/__package__.ts

@@ -1,3 +1,3 @@
 export const PKG_NAME = "@hpcc-js/dgrid2";
-export const PKG_VERSION = "3.1.0";
-export const BUILD_VERSION = "3.2.0";
+export const PKG_VERSION = "3.1.1";
+export const BUILD_VERSION = "3.2.1";

package/src/hooks.ts

@@ -1,5 +1,5 @@
-import React from "react";
 import { Widget } from "@hpcc-js/common";
+import * as React from "react";
 
 export function useData(widget: Widget): [string[], Array<string | number>[]] {
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -9,3 +9,4 @@ export function useData(widget: Widget): [string[], Array<string | number>[]] {
 
     return [columns, data];
 }
+

package/src/reactTable.tsx

@@ -1,4 +1,4 @@
-import React from "react";
+import * as React from "react";
 import DataGrid, { Column, SelectColumn, SortColumn } from "react-data-grid";
 import { format, timeFormat, timeParse } from "@hpcc-js/common";
 import { useData } from "./hooks.ts";
@@ -33,7 +33,7 @@ const EmptyRowsRenderer: React.FunctionComponent<EmptyRowsRendererProps> = ({
 };
 
 interface ColumnEx<TRow, TSummaryRow = unknown> extends Column<TRow, TSummaryRow> {
-    renderCell?: (props: any) => React.JSX.Element;
+    renderCell?: (props: any) => any;
     __hpcc_pattern?: ReturnType<typeof timeParse>;
     __hpcc_format?: ReturnType<typeof format> | ReturnType<typeof timeFormat>;
 }
@@ -145,7 +145,7 @@ export const ReactTable: React.FunctionComponent<ReactTableProps> = ({
         rows={rows}
         rowKeyGetter={rowKeyGetter}
         rowHeight={20}
-        renderers={{ noRowsFallback: <EmptyRowsRenderer message={table.noDataMessage()} /> }}
+        renderers={{ noRowsFallback: <EmptyRowsRenderer message={table.noDataMessage()} /> as any }}
         className={table.darkMode() ? "rdg-dark" : "rdg-light"}
         sortColumns={sortColumn ? [sortColumn] : []}
         onSortColumnsChange={onSortColumnsChange}

package/src/table.ts

@@ -1,6 +1,6 @@
-import React from "react";
-import { createRoot, Root } from "react-dom/client";
+import * as React from "react";
 import { HTMLWidget } from "@hpcc-js/common";
+import { render, unmountComponentAtNode } from "react-dom";
 import { ReactTable } from "./reactTable.tsx";
 
 import "./table.css";
@@ -10,7 +10,6 @@ export type ColumnType = "boolean" | "number" | "string" | "time";
 export class Table extends HTMLWidget {
 
     protected _div;
-    protected _root: Root;
 
     constructor() {
         super();
@@ -59,18 +58,17 @@ export class Table extends HTMLWidget {
             .append("div")
             .style("display", "grid")
             ;
-        this._root = createRoot(this._div.node());
     }
 
     update(domNode, element) {
         super.update(domNode, element);
         this._div.style("width", this.width() + "px");
         this._div.style("height", this.height() + "px");
-        this._root.render(React.createElement(ReactTable, { table: this }));
+        render(React.createElement(ReactTable, { table: this }), this._div.node());
     }
 
     exit(domNode, element) {
-        this._root.unmount();
+        unmountComponentAtNode(this._div.node());
         this._div.remove();
         super.exit(domNode, element);
     }

package/types/__package__.d.ts

@@ -1,3 +1,3 @@
 export declare const PKG_NAME = "@hpcc-js/dgrid2";
-export declare const PKG_VERSION = "3.1.0";
-export declare const BUILD_VERSION = "3.2.0";
+export declare const PKG_VERSION = "3.1.1";
+export declare const BUILD_VERSION = "3.2.1";

package/types/reactTable.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+import * as React from "react";
 import type { Table } from "./table.ts";
 import "react-data-grid/lib/styles.css";
 export type QuerySortItem = {

package/types/table.d.ts

@@ -1,10 +1,8 @@
-import { Root } from "react-dom/client";
 import { HTMLWidget } from "@hpcc-js/common";
 import "./table.css";
 export type ColumnType = "boolean" | "number" | "string" | "time";
 export declare class Table extends HTMLWidget {
     protected _div: any;
-    protected _root: Root;
     constructor();
     columnType(column: string): ColumnType;
     columnType(column: string, type: ColumnType): this;