@guiexpert/solid-table 1.1.96 → 1.1.97

package/DetailComponentRendererWrapper.d.ts

@@ -0,0 +1,28 @@
+import { DetailRenderContextIf, DetailRendererIf, TableApi } from '@guiexpert/table';
+import { JSX } from 'solid-js/jsx-runtime';
+
+/**
+ * The props of a Solid component that renders a detail row (master/detail).
+ *
+ * @since 1.1.97
+ */
+export interface DetailComponentProps<T = any> {
+    row: T;
+    rowIndex: number;
+    tableApi: TableApi;
+    context: DetailRenderContextIf<T>;
+}
+/**
+ * Renders a Solid component as the content of a detail row (master/detail, `tableOptions.masterDetail`). Mounted
+ * once when the detail row becomes visible, kept while scrolling, disposed when the row is collapsed.
+ *
+ * @example
+ * masterDetail: { detailHeight: 180, detailRenderer: new DetailComponentRendererWrapper(OrderItems) }
+ *
+ * @since 1.1.97
+ */
+export declare class DetailComponentRendererWrapper<T = any> implements DetailRendererIf<T> {
+    private readonly code;
+    constructor(code: (props: DetailComponentProps<T>) => JSX.Element);
+    render(container: HTMLDivElement, row: T, context: DetailRenderContextIf<T>): () => void;
+}

package/GuiexpertTableProps.d.ts

@@ -1,4 +1,4 @@
-import { FocusModelIf, GeBatchEditEvent, GeModelChangeEvent, GeMouseEvent, GeRowDragEvent, GeScrollEvent, GeStateChangeEvent, SelectionModelIf, TableApi, TableModelIf, TableOptions } from '@guiexpert/table';
+import { FocusModelIf, GeBatchEditEvent, GeDetailEvent, GeModelChangeEvent, GeMouseEvent, GeRowDragEvent, GeScrollEvent, GeStateChangeEvent, SelectionModelIf, TableApi, TableModelIf, TableOptions } from '@guiexpert/table';
 
 export type GeMouseEventFn = (evt: GeMouseEvent) => void;
 export type GeCheckboxEventFn = (evt: any[]) => void;
@@ -10,6 +10,7 @@ export type GeScrollEventFn = (evt: GeScrollEvent) => void;
 export type GeStateChangeEventFn = (evt: GeStateChangeEvent) => void;
 export type GeRowDragEventFn = (evt: GeRowDragEvent) => void;
 export type GeBatchEditEventFn = (evt: GeBatchEditEvent) => void;
+export type GeDetailEventFn = (evt: GeDetailEvent) => void;
 export interface GuiexpertTableProps {
     tableModel: TableModelIf;
     tableOptions?: TableOptions;
@@ -35,6 +36,8 @@ export interface GuiexpertTableProps {
     rowDragEnd?: GeRowDragEventFn;
     /** Batch edit: values marked, set back, written or discarded (since 1.1.96). */
     batchEditChanged?: GeBatchEditEventFn;
+    /** Master/detail: a detail row was expanded or collapsed (since 1.1.97). */
+    detailExpandedChanged?: GeDetailEventFn;
     tableReady?: GeTableReadyEventFn;
     licenseKey?: string;
     /**

package/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("solid-js/web"),s=require("solid-js"),i=require("@guiexpert/table");class b{constructor(a){this.code=a}render(a,o,n,u,t,d,h){const e=g.mergeProps({rowIndex:o,columnIndex:n,areaIdent:u,areaModel:t,cellValue:d});return g.render(()=>this.code(e),a)}}var m=g.template("<div>");const f=p=>{let a;const o=s.mergeProps({tableModel:null,tableOptions:new i.TableOptions},p),n=(e,r,l)=>{l&&l(r),a&&a.dispatchEvent(new CustomEvent(e,{detail:r,bubbles:e!=="scroll"}))},u={onSelectionChanged:e=>n("selectionChanged",e,o.selectionChanged),onFocusChanged:e=>n("focusChanged",e,o.focusChanged),onScroll:e=>n("scroll",e,o.scroll),onCheckboxChanged:e=>n("checkboxChanged",e,o.checkboxChanged),onContextmenu:e=>n("contextmenu",e,o.contextmenu),onModelChanged:e=>n("modelChanged",e,o.modelChanged),onMouseClicked:e=>n("mouseClicked",e,o.mouseClicked),onMouseDragging:e=>n("mouseDragging",e,o.mouseDragging),onMouseDraggingEnd:e=>n("mouseDraggingEnd",e,o.mouseDraggingEnd),onMouseMoved:e=>n("mouseMoved",e,o.mouseMoved),onStateChanged:e=>n("stateChanged",e,o.stateChanged),onRowDragStart:e=>n("rowDragStart",e,o.rowDragStart),onRowDragMove:e=>n("rowDragMove",e,o.rowDragMove),onRowDragEnd:e=>n("rowDragEnd",e,o.rowDragEnd),onBatchEditChanged:e=>n("batchEditChanged",e,o.batchEditChanged)};let t,d=!1;const h=e=>{e?(t==null||t.showLoadingOverlay(),d=!0):d&&(t==null||t.hideOverlay(),d=!1)};return s.createEffect(()=>{const e=o.tableModel,r=o.tableOptions,l=a;if(!l||!e)return;const C=s.untrack(()=>{const c=new i.TableScope(l,e,new i.SimpleDomService,r??new i.TableOptions,u);return c.firstInit(),t=c,d=!1,h(!!o.loading),n("tableReady",c.getApi(),o.tableReady),c});s.onCleanup(()=>{t===C&&(t=void 0),C.destroy()})}),s.createEffect(()=>{const e=!!o.loading;s.untrack(()=>h(e))}),s.createEffect(()=>{const e=o.licenseKey;e&&i.LicenseManager.getInstance().setLicenseKey(e)}),(()=>{var e=m(),r=a;return typeof r=="function"?g.use(r,e):a=e,e})()};exports.ComponentRendererWrapper=b;exports.GuiexpertTable=f;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const g=require("solid-js/web"),s=require("solid-js"),c=require("@guiexpert/table");class b{constructor(t){this.code=t}render(t,n,o,i,r,d,h){const e=g.mergeProps({rowIndex:n,columnIndex:o,areaIdent:i,areaModel:r,cellValue:d});return g.render(()=>this.code(e),t)}}class m{constructor(t){this.code=t}render(t,n,o){const i={row:n,rowIndex:o.rowIndex,tableApi:o.tableApi,context:o};return g.render(()=>this.code(i),t)}}var f=g.template("<div>");const w=u=>{let t;const n=s.mergeProps({tableModel:null,tableOptions:new c.TableOptions},u),o=(e,a,l)=>{l&&l(a),t&&t.dispatchEvent(new CustomEvent(e,{detail:a,bubbles:e!=="scroll"}))},i={onSelectionChanged:e=>o("selectionChanged",e,n.selectionChanged),onFocusChanged:e=>o("focusChanged",e,n.focusChanged),onScroll:e=>o("scroll",e,n.scroll),onCheckboxChanged:e=>o("checkboxChanged",e,n.checkboxChanged),onContextmenu:e=>o("contextmenu",e,n.contextmenu),onModelChanged:e=>o("modelChanged",e,n.modelChanged),onMouseClicked:e=>o("mouseClicked",e,n.mouseClicked),onMouseDragging:e=>o("mouseDragging",e,n.mouseDragging),onMouseDraggingEnd:e=>o("mouseDraggingEnd",e,n.mouseDraggingEnd),onMouseMoved:e=>o("mouseMoved",e,n.mouseMoved),onStateChanged:e=>o("stateChanged",e,n.stateChanged),onRowDragStart:e=>o("rowDragStart",e,n.rowDragStart),onRowDragMove:e=>o("rowDragMove",e,n.rowDragMove),onRowDragEnd:e=>o("rowDragEnd",e,n.rowDragEnd),onBatchEditChanged:e=>o("batchEditChanged",e,n.batchEditChanged),onDetailExpandedChanged:e=>o("detailExpandedChanged",e,n.detailExpandedChanged)};let r,d=!1;const h=e=>{e?(r==null||r.showLoadingOverlay(),d=!0):d&&(r==null||r.hideOverlay(),d=!1)};return s.createEffect(()=>{const e=n.tableModel,a=n.tableOptions,l=t;if(!l||!e)return;const C=s.untrack(()=>{const p=new c.TableScope(l,e,new c.SimpleDomService,a??new c.TableOptions,i);return p.firstInit(),r=p,d=!1,h(!!n.loading),o("tableReady",p.getApi(),n.tableReady),p});s.onCleanup(()=>{r===C&&(r=void 0),C.destroy()})}),s.createEffect(()=>{const e=!!n.loading;s.untrack(()=>h(e))}),s.createEffect(()=>{const e=n.licenseKey;e&&c.LicenseManager.getInstance().setLicenseKey(e)}),(()=>{var e=f(),a=t;return typeof a=="function"?g.use(a,e):t=e,e})()};exports.ComponentRendererWrapper=b;exports.DetailComponentRendererWrapper=m;exports.GuiexpertTable=w;

package/index.d.ts

@@ -1,5 +1,7 @@
 import { ComponentRendererWrapper } from './ComponentRendererWrapper.js';
+import { DetailComponentRendererWrapper } from './DetailComponentRendererWrapper.js';
 import { default as GuiexpertTable } from './GuiexpertTable.js';
 
 export * from './GuiexpertTableProps.js';
-export { GuiexpertTable, ComponentRendererWrapper };
+export { GuiexpertTable, ComponentRendererWrapper, DetailComponentRendererWrapper };
+export type { DetailComponentProps } from './DetailComponentRendererWrapper.js';

package/index.js

@@ -1,36 +1,45 @@
-import { mergeProps as C, render as f, use as b, template as v } from "solid-js/web";
-import { mergeProps as w, createEffect as c, untrack as u, onCleanup as D } from "solid-js";
-import { TableOptions as p, LicenseManager as M, TableScope as E, SimpleDomService as y } from "@guiexpert/table";
-class R {
-  constructor(a) {
-    this.code = a;
+import { mergeProps as f, render as C, use as b, template as w } from "solid-js/web";
+import { mergeProps as D, createEffect as p, untrack as u, onCleanup as v } from "solid-js";
+import { TableOptions as m, LicenseManager as E, TableScope as M, SimpleDomService as x } from "@guiexpert/table";
+class O {
+  constructor(t) {
+    this.code = t;
   }
-  render(a, o, n, i, t, s, l) {
-    const e = C({
+  render(t, o, n, d, a, s, c) {
+    const e = f({
       rowIndex: o,
       columnIndex: n,
-      areaIdent: i,
-      areaModel: t,
+      areaIdent: d,
+      areaModel: a,
       cellValue: s
     });
-    return f(
+    return C(
       () => this.code(e),
-      a
+      t
     );
   }
 }
-var x = /* @__PURE__ */ v("<div>");
-const L = (h) => {
-  let a;
-  const o = w({
+class I {
+  constructor(t) {
+    this.code = t;
+  }
+  render(t, o, n) {
+    const d = { row: o, rowIndex: n.rowIndex, tableApi: n.tableApi, context: n };
+    return C(() => this.code(d), t);
+  }
+}
+var y = /* @__PURE__ */ w("<div>");
+const L = (g) => {
+  let t;
+  const o = D({
     tableModel: null,
-    tableOptions: new p()
-  }, h), n = (e, r, d) => {
-    d && d(r), a && a.dispatchEvent(new CustomEvent(e, {
+    tableOptions: new m()
+  }, g), n = (e, r, i) => {
+    i && i(r), t && t.dispatchEvent(new CustomEvent(e, {
       detail: r,
       bubbles: e !== "scroll"
     }));
-  }, i = {
+  }, d = {
     onSelectionChanged: (e) => n("selectionChanged", e, o.selectionChanged),
     onFocusChanged: (e) => n("focusChanged", e, o.focusChanged),
     onScroll: (e) => n("scroll", e, o.scroll),
@@ -45,35 +54,37 @@ const L = (h) => {
     onRowDragStart: (e) => n("rowDragStart", e, o.rowDragStart),
     onRowDragMove: (e) => n("rowDragMove", e, o.rowDragMove),
     onRowDragEnd: (e) => n("rowDragEnd", e, o.rowDragEnd),
-    onBatchEditChanged: (e) => n("batchEditChanged", e, o.batchEditChanged)
+    onBatchEditChanged: (e) => n("batchEditChanged", e, o.batchEditChanged),
+    onDetailExpandedChanged: (e) => n("detailExpandedChanged", e, o.detailExpandedChanged)
   };
-  let t, s = !1;
-  const l = (e) => {
-    e ? (t == null || t.showLoadingOverlay(), s = !0) : s && (t == null || t.hideOverlay(), s = !1);
+  let a, s = !1;
+  const c = (e) => {
+    e ? (a == null || a.showLoadingOverlay(), s = !0) : s && (a == null || a.hideOverlay(), s = !1);
   };
-  return c(() => {
-    const e = o.tableModel, r = o.tableOptions, d = a;
-    if (!d || !e)
+  return p(() => {
+    const e = o.tableModel, r = o.tableOptions, i = t;
+    if (!i || !e)
       return;
-    const m = u(() => {
-      const g = new E(d, e, new y(), r ?? new p(), i);
-      return g.firstInit(), t = g, s = !1, l(!!o.loading), n("tableReady", g.getApi(), o.tableReady), g;
+    const h = u(() => {
+      const l = new M(i, e, new x(), r ?? new m(), d);
+      return l.firstInit(), a = l, s = !1, c(!!o.loading), n("tableReady", l.getApi(), o.tableReady), l;
     });
-    D(() => {
-      t === m && (t = void 0), m.destroy();
+    v(() => {
+      a === h && (a = void 0), h.destroy();
     });
-  }), c(() => {
+  }), p(() => {
     const e = !!o.loading;
-    u(() => l(e));
-  }), c(() => {
+    u(() => c(e));
+  }), p(() => {
     const e = o.licenseKey;
-    e && M.getInstance().setLicenseKey(e);
+    e && E.getInstance().setLicenseKey(e);
   }), (() => {
-    var e = x(), r = a;
-    return typeof r == "function" ? b(r, e) : a = e, e;
+    var e = y(), r = t;
+    return typeof r == "function" ? b(r, e) : t = e, e;
   })();
 };
 export {
-  R as ComponentRendererWrapper,
+  O as ComponentRendererWrapper,
+  I as DetailComponentRendererWrapper,
   L as GuiexpertTable
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@guiexpert/solid-table",
-  "version": "1.1.96",
+  "version": "1.1.97",
   "license": "MIT",
   "author": "Dr. Marc Kronberg <info@gui.expert> (https://gui.expert)",
   "repository": {
@@ -31,7 +31,7 @@
   },
   "dependencies": {
     "tslib": "^2.3.0",
-    "@guiexpert/table": "^1.1.96"
+    "@guiexpert/table": "^1.1.97"
   },
   "peerDependencies": {
     "solid-js": "^1.0.0"