@vuu-ui/vuu-data-react 0.13.4 → 0.13.6

package/cjs/hooks/useSessionDataSource.js

@@ -12,19 +12,23 @@ const useSessionDataSource = ({
   const { id, load, save, loadSession, saveSession, title } = vuuLayout.useViewContext();
   const { VuuDataSource } = vuuUtils.useData();
   const { "datasource-config": dataSourceConfigFromState } = react.useMemo(() => load?.() ?? NO_CONFIG, [load]);
+  const dataSourceConfigRef = react.useRef(
+    dataSourceConfigFromState
+  );
   const handleDataSourceConfigChange = react.useCallback(
     (config, _range, confirmed) => {
       if (confirmed !== false) {
         const { noChanges } = vuuUtils.isConfigChanged(
-          dataSourceConfigFromState,
+          dataSourceConfigRef.current,
           config
         );
         if (noChanges === false) {
+          dataSourceConfigRef.current = config;
           save?.(config, "datasource-config");
         }
       }
     },
-    [dataSourceConfigFromState, save]
+    [save]
   );
   const dataSource = react.useMemo(() => {
     let ds = loadSession?.(dataSourceSessionKey);
@@ -42,7 +46,7 @@ const useSessionDataSource = ({
       // bufferSize: 0,
       viewport: id,
       table: tableSchema.table,
-      ...dataSourceConfigFromState,
+      ...dataSourceConfigRef.current,
       columns,
       title
     });

package/cjs/hooks/useSessionDataSource.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSessionDataSource.js","sources":["../../src/hooks/useSessionDataSource.ts"],"sourcesContent":["import type {\n  DataSource,\n  DataSourceConfig,\n  DataSourceConfigChangeHandler,\n  TableSchema,\n} from \"@vuu-ui/vuu-data-types\";\nimport { useViewContext } from \"@vuu-ui/vuu-layout\";\nimport type { VuuRange } from \"@vuu-ui/vuu-protocol-types\";\nimport { isConfigChanged, useData } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useMemo } from \"react\";\n\ntype SessionDataSourceConfig = {\n  \"datasource-config\"?: DataSourceConfig;\n};\n\nconst NO_CONFIG: SessionDataSourceConfig = {};\n\nexport const useSessionDataSource = ({\n  dataSourceSessionKey = \"data-source\",\n  tableSchema,\n}: {\n  dataSourceSessionKey?: string;\n  tableSchema: TableSchema;\n}) => {\n  const { id, load, save, loadSession, saveSession, title } = useViewContext();\n  const { VuuDataSource } = useData();\n\n  const { \"datasource-config\": dataSourceConfigFromState } =\n    useMemo<SessionDataSourceConfig>(() => load?.() ?? NO_CONFIG, [load]);\n\n  const handleDataSourceConfigChange =\n    useCallback<DataSourceConfigChangeHandler>(\n      (\n        config: DataSourceConfig | undefined,\n        _range: VuuRange,\n        confirmed?: boolean,\n      ) => {\n        if (confirmed !== false) {\n          const { noChanges } = isConfigChanged(\n            dataSourceConfigFromState,\n            config,\n          );\n          if (noChanges === false) {\n            save?.(config, \"datasource-config\");\n          }\n        }\n      },\n      [dataSourceConfigFromState, save],\n    );\n\n  const dataSource: DataSource = useMemo(() => {\n    let ds = loadSession?.(dataSourceSessionKey) as DataSource;\n    if (ds) {\n      if (dataSourceConfigFromState) {\n        // this won't do anything if dataSource config already matches this\n        // This is only really used when injecting a dataSource into session\n        // state in Showcase examples\n        // DO we definitely need this ? If not apply config can be provate\n        ds.applyConfig(dataSourceConfigFromState, true);\n      }\n\n      if (ds.range.from > 0) {\n        // UI does not currently restore scroll position, so always reset to top of dataset\n        ds.range = ds.range.reset;\n      }\n\n      return ds;\n    }\n\n    const columns =\n      dataSourceConfigFromState?.columns ??\n      tableSchema.columns.map((col) => col.name);\n\n    ds = new VuuDataSource({\n      // bufferSize: 0,\n      viewport: id,\n      table: tableSchema.table,\n      ...dataSourceConfigFromState,\n      columns,\n      title,\n    });\n    ds.on(\"config\", handleDataSourceConfigChange);\n    saveSession?.(ds, \"data-source\");\n    return ds;\n  }, [\n    VuuDataSource,\n    dataSourceConfigFromState,\n    dataSourceSessionKey,\n    handleDataSourceConfigChange,\n    id,\n    loadSession,\n    saveSession,\n    tableSchema.columns,\n    tableSchema.table,\n    title,\n  ]);\n\n  return dataSource;\n};\n"],"names":["useViewContext","useData","useMemo","useCallback","isConfigChanged"],"mappings":";;;;;;AAeA,MAAM,YAAqC,EAAC;AAErC,MAAM,uBAAuB,CAAC;AAAA,EACnC,oBAAuB,GAAA,aAAA;AAAA,EACvB;AACF,CAGM,KAAA;AACJ,EAAM,MAAA,EAAE,IAAI,IAAM,EAAA,IAAA,EAAM,aAAa,WAAa,EAAA,KAAA,KAAUA,wBAAe,EAAA;AAC3E,EAAM,MAAA,EAAE,aAAc,EAAA,GAAIC,gBAAQ,EAAA;AAElC,EAAM,MAAA,EAAE,mBAAqB,EAAA,yBAAA,EAC3B,GAAAC,aAAA,CAAiC,MAAM,IAAA,IAAY,IAAA,SAAA,EAAW,CAAC,IAAI,CAAC,CAAA;AAEtE,EAAA,MAAM,4BACJ,GAAAC,iBAAA;AAAA,IACE,CACE,MACA,EAAA,MAAA,EACA,SACG,KAAA;AACH,MAAA,IAAI,cAAc,KAAO,EAAA;AACvB,QAAM,MAAA,EAAE,WAAc,GAAAC,wBAAA;AAAA,UACpB,yBAAA;AAAA,UACA;AAAA,SACF;AACA,QAAA,IAAI,cAAc,KAAO,EAAA;AACvB,UAAA,IAAA,GAAO,QAAQ,mBAAmB,CAAA;AAAA;AACpC;AACF,KACF;AAAA,IACA,CAAC,2BAA2B,IAAI;AAAA,GAClC;AAEF,EAAM,MAAA,UAAA,GAAyBF,cAAQ,MAAM;AAC3C,IAAI,IAAA,EAAA,GAAK,cAAc,oBAAoB,CAAA;AAC3C,IAAA,IAAI,EAAI,EAAA;AACN,MAAA,IAAI,yBAA2B,EAAA;AAK7B,QAAG,EAAA,CAAA,WAAA,CAAY,2BAA2B,IAAI,CAAA;AAAA;AAGhD,MAAI,IAAA,EAAA,CAAG,KAAM,CAAA,IAAA,GAAO,CAAG,EAAA;AAErB,QAAG,EAAA,CAAA,KAAA,GAAQ,GAAG,KAAM,CAAA,KAAA;AAAA;AAGtB,MAAO,OAAA,EAAA;AAAA;AAGT,IAAM,MAAA,OAAA,GACJ,2BAA2B,OAC3B,IAAA,WAAA,CAAY,QAAQ,GAAI,CAAA,CAAC,GAAQ,KAAA,GAAA,CAAI,IAAI,CAAA;AAE3C,IAAA,EAAA,GAAK,IAAI,aAAc,CAAA;AAAA;AAAA,MAErB,QAAU,EAAA,EAAA;AAAA,MACV,OAAO,WAAY,CAAA,KAAA;AAAA,MACnB,GAAG,yBAAA;AAAA,MACH,OAAA;AAAA,MACA;AAAA,KACD,CAAA;AACD,IAAG,EAAA,CAAA,EAAA,CAAG,UAAU,4BAA4B,CAAA;AAC5C,IAAA,WAAA,GAAc,IAAI,aAAa,CAAA;AAC/B,IAAO,OAAA,EAAA;AAAA,GACN,EAAA;AAAA,IACD,aAAA;AAAA,IACA,yBAAA;AAAA,IACA,oBAAA;AAAA,IACA,4BAAA;AAAA,IACA,EAAA;AAAA,IACA,WAAA;AAAA,IACA,WAAA;AAAA,IACA,WAAY,CAAA,OAAA;AAAA,IACZ,WAAY,CAAA,KAAA;AAAA,IACZ;AAAA,GACD,CAAA;AAED,EAAO,OAAA,UAAA;AACT;;;;"}
+{"version":3,"file":"useSessionDataSource.js","sources":["../../src/hooks/useSessionDataSource.ts"],"sourcesContent":["import type {\n  DataSource,\n  DataSourceConfig,\n  DataSourceConfigChangeHandler,\n  TableSchema,\n} from \"@vuu-ui/vuu-data-types\";\nimport { useViewContext } from \"@vuu-ui/vuu-layout\";\nimport type { VuuRange } from \"@vuu-ui/vuu-protocol-types\";\nimport { isConfigChanged, useData } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useMemo, useRef } from \"react\";\n\ntype SessionState = {\n  \"datasource-config\"?: DataSourceConfig;\n};\n\nconst NO_CONFIG: SessionState = {};\n\nexport const useSessionDataSource = ({\n  dataSourceSessionKey = \"data-source\",\n  tableSchema,\n}: {\n  dataSourceSessionKey?: string;\n  tableSchema: TableSchema;\n}) => {\n  const { id, load, save, loadSession, saveSession, title } = useViewContext();\n  const { VuuDataSource } = useData();\n\n  const { \"datasource-config\": dataSourceConfigFromState } =\n    useMemo<SessionState>(() => load?.() ?? NO_CONFIG, [load]);\n\n  const dataSourceConfigRef = useRef<DataSourceConfig | undefined>(\n    dataSourceConfigFromState,\n  );\n\n  const handleDataSourceConfigChange =\n    useCallback<DataSourceConfigChangeHandler>(\n      (\n        config: DataSourceConfig | undefined,\n        _range: VuuRange,\n        confirmed?: boolean,\n      ) => {\n        if (confirmed !== false) {\n          const { noChanges } = isConfigChanged(\n            dataSourceConfigRef.current,\n            config,\n          );\n          if (noChanges === false) {\n            dataSourceConfigRef.current = config;\n            save?.(config, \"datasource-config\");\n          }\n        }\n      },\n      [save],\n    );\n\n  const dataSource: DataSource = useMemo(() => {\n    let ds = loadSession?.(dataSourceSessionKey) as DataSource;\n    if (ds) {\n      if (dataSourceConfigFromState) {\n        // this won't do anything if dataSource config already matches this\n        // This is only really used when injecting a dataSource into session\n        // state in Showcase examples\n        // DO we definitely need this ? If not apply config can be provate\n        ds.applyConfig(dataSourceConfigFromState, true);\n      }\n\n      if (ds.range.from > 0) {\n        // UI does not currently restore scroll position, so always reset to top of dataset\n        ds.range = ds.range.reset;\n      }\n\n      return ds;\n    }\n\n    const columns =\n      dataSourceConfigFromState?.columns ??\n      tableSchema.columns.map((col) => col.name);\n\n    ds = new VuuDataSource({\n      // bufferSize: 0,\n      viewport: id,\n      table: tableSchema.table,\n      ...dataSourceConfigRef.current,\n      columns,\n      title,\n    });\n    ds.on(\"config\", handleDataSourceConfigChange);\n    saveSession?.(ds, \"data-source\");\n    return ds;\n  }, [\n    VuuDataSource,\n    dataSourceConfigFromState,\n    dataSourceSessionKey,\n    handleDataSourceConfigChange,\n    id,\n    loadSession,\n    saveSession,\n    tableSchema.columns,\n    tableSchema.table,\n    title,\n  ]);\n\n  return dataSource;\n};\n"],"names":["useViewContext","useData","useMemo","useRef","useCallback","isConfigChanged"],"mappings":";;;;;;AAeA,MAAM,YAA0B,EAAC;AAE1B,MAAM,uBAAuB,CAAC;AAAA,EACnC,oBAAuB,GAAA,aAAA;AAAA,EACvB;AACF,CAGM,KAAA;AACJ,EAAM,MAAA,EAAE,IAAI,IAAM,EAAA,IAAA,EAAM,aAAa,WAAa,EAAA,KAAA,KAAUA,wBAAe,EAAA;AAC3E,EAAM,MAAA,EAAE,aAAc,EAAA,GAAIC,gBAAQ,EAAA;AAElC,EAAM,MAAA,EAAE,mBAAqB,EAAA,yBAAA,EAC3B,GAAAC,aAAA,CAAsB,MAAM,IAAA,IAAY,IAAA,SAAA,EAAW,CAAC,IAAI,CAAC,CAAA;AAE3D,EAAA,MAAM,mBAAsB,GAAAC,YAAA;AAAA,IAC1B;AAAA,GACF;AAEA,EAAA,MAAM,4BACJ,GAAAC,iBAAA;AAAA,IACE,CACE,MACA,EAAA,MAAA,EACA,SACG,KAAA;AACH,MAAA,IAAI,cAAc,KAAO,EAAA;AACvB,QAAM,MAAA,EAAE,WAAc,GAAAC,wBAAA;AAAA,UACpB,mBAAoB,CAAA,OAAA;AAAA,UACpB;AAAA,SACF;AACA,QAAA,IAAI,cAAc,KAAO,EAAA;AACvB,UAAA,mBAAA,CAAoB,OAAU,GAAA,MAAA;AAC9B,UAAA,IAAA,GAAO,QAAQ,mBAAmB,CAAA;AAAA;AACpC;AACF,KACF;AAAA,IACA,CAAC,IAAI;AAAA,GACP;AAEF,EAAM,MAAA,UAAA,GAAyBH,cAAQ,MAAM;AAC3C,IAAI,IAAA,EAAA,GAAK,cAAc,oBAAoB,CAAA;AAC3C,IAAA,IAAI,EAAI,EAAA;AACN,MAAA,IAAI,yBAA2B,EAAA;AAK7B,QAAG,EAAA,CAAA,WAAA,CAAY,2BAA2B,IAAI,CAAA;AAAA;AAGhD,MAAI,IAAA,EAAA,CAAG,KAAM,CAAA,IAAA,GAAO,CAAG,EAAA;AAErB,QAAG,EAAA,CAAA,KAAA,GAAQ,GAAG,KAAM,CAAA,KAAA;AAAA;AAGtB,MAAO,OAAA,EAAA;AAAA;AAGT,IAAM,MAAA,OAAA,GACJ,2BAA2B,OAC3B,IAAA,WAAA,CAAY,QAAQ,GAAI,CAAA,CAAC,GAAQ,KAAA,GAAA,CAAI,IAAI,CAAA;AAE3C,IAAA,EAAA,GAAK,IAAI,aAAc,CAAA;AAAA;AAAA,MAErB,QAAU,EAAA,EAAA;AAAA,MACV,OAAO,WAAY,CAAA,KAAA;AAAA,MACnB,GAAG,mBAAoB,CAAA,OAAA;AAAA,MACvB,OAAA;AAAA,MACA;AAAA,KACD,CAAA;AACD,IAAG,EAAA,CAAA,EAAA,CAAG,UAAU,4BAA4B,CAAA;AAC5C,IAAA,WAAA,GAAc,IAAI,aAAa,CAAA;AAC/B,IAAO,OAAA,EAAA;AAAA,GACN,EAAA;AAAA,IACD,aAAA;AAAA,IACA,yBAAA;AAAA,IACA,oBAAA;AAAA,IACA,4BAAA;AAAA,IACA,EAAA;AAAA,IACA,WAAA;AAAA,IACA,WAAA;AAAA,IACA,WAAY,CAAA,OAAA;AAAA,IACZ,WAAY,CAAA,KAAA;AAAA,IACZ;AAAA,GACD,CAAA;AAED,EAAO,OAAA,UAAA;AACT;;;;"}

package/esm/hooks/useSessionDataSource.js

@@ -1,6 +1,6 @@
 import { useViewContext } from '@vuu-ui/vuu-layout';
 import { useData, isConfigChanged } from '@vuu-ui/vuu-utils';
-import { useMemo, useCallback } from 'react';
+import { useMemo, useRef, useCallback } from 'react';
 
 const NO_CONFIG = {};
 const useSessionDataSource = ({
@@ -10,19 +10,23 @@ const useSessionDataSource = ({
   const { id, load, save, loadSession, saveSession, title } = useViewContext();
   const { VuuDataSource } = useData();
   const { "datasource-config": dataSourceConfigFromState } = useMemo(() => load?.() ?? NO_CONFIG, [load]);
+  const dataSourceConfigRef = useRef(
+    dataSourceConfigFromState
+  );
   const handleDataSourceConfigChange = useCallback(
     (config, _range, confirmed) => {
       if (confirmed !== false) {
         const { noChanges } = isConfigChanged(
-          dataSourceConfigFromState,
+          dataSourceConfigRef.current,
           config
         );
         if (noChanges === false) {
+          dataSourceConfigRef.current = config;
           save?.(config, "datasource-config");
         }
       }
     },
-    [dataSourceConfigFromState, save]
+    [save]
   );
   const dataSource = useMemo(() => {
     let ds = loadSession?.(dataSourceSessionKey);
@@ -40,7 +44,7 @@ const useSessionDataSource = ({
       // bufferSize: 0,
       viewport: id,
       table: tableSchema.table,
-      ...dataSourceConfigFromState,
+      ...dataSourceConfigRef.current,
       columns,
       title
     });

package/esm/hooks/useSessionDataSource.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSessionDataSource.js","sources":["../../src/hooks/useSessionDataSource.ts"],"sourcesContent":["import type {\n  DataSource,\n  DataSourceConfig,\n  DataSourceConfigChangeHandler,\n  TableSchema,\n} from \"@vuu-ui/vuu-data-types\";\nimport { useViewContext } from \"@vuu-ui/vuu-layout\";\nimport type { VuuRange } from \"@vuu-ui/vuu-protocol-types\";\nimport { isConfigChanged, useData } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useMemo } from \"react\";\n\ntype SessionDataSourceConfig = {\n  \"datasource-config\"?: DataSourceConfig;\n};\n\nconst NO_CONFIG: SessionDataSourceConfig = {};\n\nexport const useSessionDataSource = ({\n  dataSourceSessionKey = \"data-source\",\n  tableSchema,\n}: {\n  dataSourceSessionKey?: string;\n  tableSchema: TableSchema;\n}) => {\n  const { id, load, save, loadSession, saveSession, title } = useViewContext();\n  const { VuuDataSource } = useData();\n\n  const { \"datasource-config\": dataSourceConfigFromState } =\n    useMemo<SessionDataSourceConfig>(() => load?.() ?? NO_CONFIG, [load]);\n\n  const handleDataSourceConfigChange =\n    useCallback<DataSourceConfigChangeHandler>(\n      (\n        config: DataSourceConfig | undefined,\n        _range: VuuRange,\n        confirmed?: boolean,\n      ) => {\n        if (confirmed !== false) {\n          const { noChanges } = isConfigChanged(\n            dataSourceConfigFromState,\n            config,\n          );\n          if (noChanges === false) {\n            save?.(config, \"datasource-config\");\n          }\n        }\n      },\n      [dataSourceConfigFromState, save],\n    );\n\n  const dataSource: DataSource = useMemo(() => {\n    let ds = loadSession?.(dataSourceSessionKey) as DataSource;\n    if (ds) {\n      if (dataSourceConfigFromState) {\n        // this won't do anything if dataSource config already matches this\n        // This is only really used when injecting a dataSource into session\n        // state in Showcase examples\n        // DO we definitely need this ? If not apply config can be provate\n        ds.applyConfig(dataSourceConfigFromState, true);\n      }\n\n      if (ds.range.from > 0) {\n        // UI does not currently restore scroll position, so always reset to top of dataset\n        ds.range = ds.range.reset;\n      }\n\n      return ds;\n    }\n\n    const columns =\n      dataSourceConfigFromState?.columns ??\n      tableSchema.columns.map((col) => col.name);\n\n    ds = new VuuDataSource({\n      // bufferSize: 0,\n      viewport: id,\n      table: tableSchema.table,\n      ...dataSourceConfigFromState,\n      columns,\n      title,\n    });\n    ds.on(\"config\", handleDataSourceConfigChange);\n    saveSession?.(ds, \"data-source\");\n    return ds;\n  }, [\n    VuuDataSource,\n    dataSourceConfigFromState,\n    dataSourceSessionKey,\n    handleDataSourceConfigChange,\n    id,\n    loadSession,\n    saveSession,\n    tableSchema.columns,\n    tableSchema.table,\n    title,\n  ]);\n\n  return dataSource;\n};\n"],"names":[],"mappings":";;;;AAeA,MAAM,YAAqC,EAAC;AAErC,MAAM,uBAAuB,CAAC;AAAA,EACnC,oBAAuB,GAAA,aAAA;AAAA,EACvB;AACF,CAGM,KAAA;AACJ,EAAM,MAAA,EAAE,IAAI,IAAM,EAAA,IAAA,EAAM,aAAa,WAAa,EAAA,KAAA,KAAU,cAAe,EAAA;AAC3E,EAAM,MAAA,EAAE,aAAc,EAAA,GAAI,OAAQ,EAAA;AAElC,EAAM,MAAA,EAAE,mBAAqB,EAAA,yBAAA,EAC3B,GAAA,OAAA,CAAiC,MAAM,IAAA,IAAY,IAAA,SAAA,EAAW,CAAC,IAAI,CAAC,CAAA;AAEtE,EAAA,MAAM,4BACJ,GAAA,WAAA;AAAA,IACE,CACE,MACA,EAAA,MAAA,EACA,SACG,KAAA;AACH,MAAA,IAAI,cAAc,KAAO,EAAA;AACvB,QAAM,MAAA,EAAE,WAAc,GAAA,eAAA;AAAA,UACpB,yBAAA;AAAA,UACA;AAAA,SACF;AACA,QAAA,IAAI,cAAc,KAAO,EAAA;AACvB,UAAA,IAAA,GAAO,QAAQ,mBAAmB,CAAA;AAAA;AACpC;AACF,KACF;AAAA,IACA,CAAC,2BAA2B,IAAI;AAAA,GAClC;AAEF,EAAM,MAAA,UAAA,GAAyB,QAAQ,MAAM;AAC3C,IAAI,IAAA,EAAA,GAAK,cAAc,oBAAoB,CAAA;AAC3C,IAAA,IAAI,EAAI,EAAA;AACN,MAAA,IAAI,yBAA2B,EAAA;AAK7B,QAAG,EAAA,CAAA,WAAA,CAAY,2BAA2B,IAAI,CAAA;AAAA;AAGhD,MAAI,IAAA,EAAA,CAAG,KAAM,CAAA,IAAA,GAAO,CAAG,EAAA;AAErB,QAAG,EAAA,CAAA,KAAA,GAAQ,GAAG,KAAM,CAAA,KAAA;AAAA;AAGtB,MAAO,OAAA,EAAA;AAAA;AAGT,IAAM,MAAA,OAAA,GACJ,2BAA2B,OAC3B,IAAA,WAAA,CAAY,QAAQ,GAAI,CAAA,CAAC,GAAQ,KAAA,GAAA,CAAI,IAAI,CAAA;AAE3C,IAAA,EAAA,GAAK,IAAI,aAAc,CAAA;AAAA;AAAA,MAErB,QAAU,EAAA,EAAA;AAAA,MACV,OAAO,WAAY,CAAA,KAAA;AAAA,MACnB,GAAG,yBAAA;AAAA,MACH,OAAA;AAAA,MACA;AAAA,KACD,CAAA;AACD,IAAG,EAAA,CAAA,EAAA,CAAG,UAAU,4BAA4B,CAAA;AAC5C,IAAA,WAAA,GAAc,IAAI,aAAa,CAAA;AAC/B,IAAO,OAAA,EAAA;AAAA,GACN,EAAA;AAAA,IACD,aAAA;AAAA,IACA,yBAAA;AAAA,IACA,oBAAA;AAAA,IACA,4BAAA;AAAA,IACA,EAAA;AAAA,IACA,WAAA;AAAA,IACA,WAAA;AAAA,IACA,WAAY,CAAA,OAAA;AAAA,IACZ,WAAY,CAAA,KAAA;AAAA,IACZ;AAAA,GACD,CAAA;AAED,EAAO,OAAA,UAAA;AACT;;;;"}
+{"version":3,"file":"useSessionDataSource.js","sources":["../../src/hooks/useSessionDataSource.ts"],"sourcesContent":["import type {\n  DataSource,\n  DataSourceConfig,\n  DataSourceConfigChangeHandler,\n  TableSchema,\n} from \"@vuu-ui/vuu-data-types\";\nimport { useViewContext } from \"@vuu-ui/vuu-layout\";\nimport type { VuuRange } from \"@vuu-ui/vuu-protocol-types\";\nimport { isConfigChanged, useData } from \"@vuu-ui/vuu-utils\";\nimport { useCallback, useMemo, useRef } from \"react\";\n\ntype SessionState = {\n  \"datasource-config\"?: DataSourceConfig;\n};\n\nconst NO_CONFIG: SessionState = {};\n\nexport const useSessionDataSource = ({\n  dataSourceSessionKey = \"data-source\",\n  tableSchema,\n}: {\n  dataSourceSessionKey?: string;\n  tableSchema: TableSchema;\n}) => {\n  const { id, load, save, loadSession, saveSession, title } = useViewContext();\n  const { VuuDataSource } = useData();\n\n  const { \"datasource-config\": dataSourceConfigFromState } =\n    useMemo<SessionState>(() => load?.() ?? NO_CONFIG, [load]);\n\n  const dataSourceConfigRef = useRef<DataSourceConfig | undefined>(\n    dataSourceConfigFromState,\n  );\n\n  const handleDataSourceConfigChange =\n    useCallback<DataSourceConfigChangeHandler>(\n      (\n        config: DataSourceConfig | undefined,\n        _range: VuuRange,\n        confirmed?: boolean,\n      ) => {\n        if (confirmed !== false) {\n          const { noChanges } = isConfigChanged(\n            dataSourceConfigRef.current,\n            config,\n          );\n          if (noChanges === false) {\n            dataSourceConfigRef.current = config;\n            save?.(config, \"datasource-config\");\n          }\n        }\n      },\n      [save],\n    );\n\n  const dataSource: DataSource = useMemo(() => {\n    let ds = loadSession?.(dataSourceSessionKey) as DataSource;\n    if (ds) {\n      if (dataSourceConfigFromState) {\n        // this won't do anything if dataSource config already matches this\n        // This is only really used when injecting a dataSource into session\n        // state in Showcase examples\n        // DO we definitely need this ? If not apply config can be provate\n        ds.applyConfig(dataSourceConfigFromState, true);\n      }\n\n      if (ds.range.from > 0) {\n        // UI does not currently restore scroll position, so always reset to top of dataset\n        ds.range = ds.range.reset;\n      }\n\n      return ds;\n    }\n\n    const columns =\n      dataSourceConfigFromState?.columns ??\n      tableSchema.columns.map((col) => col.name);\n\n    ds = new VuuDataSource({\n      // bufferSize: 0,\n      viewport: id,\n      table: tableSchema.table,\n      ...dataSourceConfigRef.current,\n      columns,\n      title,\n    });\n    ds.on(\"config\", handleDataSourceConfigChange);\n    saveSession?.(ds, \"data-source\");\n    return ds;\n  }, [\n    VuuDataSource,\n    dataSourceConfigFromState,\n    dataSourceSessionKey,\n    handleDataSourceConfigChange,\n    id,\n    loadSession,\n    saveSession,\n    tableSchema.columns,\n    tableSchema.table,\n    title,\n  ]);\n\n  return dataSource;\n};\n"],"names":[],"mappings":";;;;AAeA,MAAM,YAA0B,EAAC;AAE1B,MAAM,uBAAuB,CAAC;AAAA,EACnC,oBAAuB,GAAA,aAAA;AAAA,EACvB;AACF,CAGM,KAAA;AACJ,EAAM,MAAA,EAAE,IAAI,IAAM,EAAA,IAAA,EAAM,aAAa,WAAa,EAAA,KAAA,KAAU,cAAe,EAAA;AAC3E,EAAM,MAAA,EAAE,aAAc,EAAA,GAAI,OAAQ,EAAA;AAElC,EAAM,MAAA,EAAE,mBAAqB,EAAA,yBAAA,EAC3B,GAAA,OAAA,CAAsB,MAAM,IAAA,IAAY,IAAA,SAAA,EAAW,CAAC,IAAI,CAAC,CAAA;AAE3D,EAAA,MAAM,mBAAsB,GAAA,MAAA;AAAA,IAC1B;AAAA,GACF;AAEA,EAAA,MAAM,4BACJ,GAAA,WAAA;AAAA,IACE,CACE,MACA,EAAA,MAAA,EACA,SACG,KAAA;AACH,MAAA,IAAI,cAAc,KAAO,EAAA;AACvB,QAAM,MAAA,EAAE,WAAc,GAAA,eAAA;AAAA,UACpB,mBAAoB,CAAA,OAAA;AAAA,UACpB;AAAA,SACF;AACA,QAAA,IAAI,cAAc,KAAO,EAAA;AACvB,UAAA,mBAAA,CAAoB,OAAU,GAAA,MAAA;AAC9B,UAAA,IAAA,GAAO,QAAQ,mBAAmB,CAAA;AAAA;AACpC;AACF,KACF;AAAA,IACA,CAAC,IAAI;AAAA,GACP;AAEF,EAAM,MAAA,UAAA,GAAyB,QAAQ,MAAM;AAC3C,IAAI,IAAA,EAAA,GAAK,cAAc,oBAAoB,CAAA;AAC3C,IAAA,IAAI,EAAI,EAAA;AACN,MAAA,IAAI,yBAA2B,EAAA;AAK7B,QAAG,EAAA,CAAA,WAAA,CAAY,2BAA2B,IAAI,CAAA;AAAA;AAGhD,MAAI,IAAA,EAAA,CAAG,KAAM,CAAA,IAAA,GAAO,CAAG,EAAA;AAErB,QAAG,EAAA,CAAA,KAAA,GAAQ,GAAG,KAAM,CAAA,KAAA;AAAA;AAGtB,MAAO,OAAA,EAAA;AAAA;AAGT,IAAM,MAAA,OAAA,GACJ,2BAA2B,OAC3B,IAAA,WAAA,CAAY,QAAQ,GAAI,CAAA,CAAC,GAAQ,KAAA,GAAA,CAAI,IAAI,CAAA;AAE3C,IAAA,EAAA,GAAK,IAAI,aAAc,CAAA;AAAA;AAAA,MAErB,QAAU,EAAA,EAAA;AAAA,MACV,OAAO,WAAY,CAAA,KAAA;AAAA,MACnB,GAAG,mBAAoB,CAAA,OAAA;AAAA,MACvB,OAAA;AAAA,MACA;AAAA,KACD,CAAA;AACD,IAAG,EAAA,CAAA,EAAA,CAAG,UAAU,4BAA4B,CAAA;AAC5C,IAAA,WAAA,GAAc,IAAI,aAAa,CAAA;AAC/B,IAAO,OAAA,EAAA;AAAA,GACN,EAAA;AAAA,IACD,aAAA;AAAA,IACA,yBAAA;AAAA,IACA,oBAAA;AAAA,IACA,4BAAA;AAAA,IACA,EAAA;AAAA,IACA,WAAA;AAAA,IACA,WAAA;AAAA,IACA,WAAY,CAAA,OAAA;AAAA,IACZ,WAAY,CAAA,KAAA;AAAA,IACZ;AAAA,GACD,CAAA;AAED,EAAO,OAAA,UAAA;AACT;;;;"}

package/package.json

@@ -1,23 +1,23 @@
 {
-  "version": "0.13.4",
+  "version": "0.13.6",
   "author": "heswell",
   "license": "Apache-2.0",
   "devDependencies": {
-    "@vuu-ui/vuu-data-types": "0.13.4",
-    "@vuu-ui/vuu-filter-types": "0.13.4",
-    "@vuu-ui/vuu-popups": "0.13.4",
-    "@vuu-ui/vuu-protocol-types": "0.13.4",
-    "@vuu-ui/vuu-table-types": "0.13.4"
+    "@vuu-ui/vuu-data-types": "0.13.6",
+    "@vuu-ui/vuu-filter-types": "0.13.6",
+    "@vuu-ui/vuu-popups": "0.13.6",
+    "@vuu-ui/vuu-protocol-types": "0.13.6",
+    "@vuu-ui/vuu-table-types": "0.13.6"
   },
   "dependencies": {
-    "@vuu-ui/vuu-context-menu": "0.13.4",
-    "@vuu-ui/vuu-data-remote": "0.13.4",
-    "@vuu-ui/vuu-filter-parser": "0.13.4",
-    "@vuu-ui/vuu-layout": "0.13.4",
-    "@vuu-ui/vuu-popups": "0.13.4",
-    "@vuu-ui/vuu-ui-controls": "0.13.4",
-    "@vuu-ui/vuu-utils": "0.13.4",
-    "@vuu-ui/vuu-table": "0.13.4",
+    "@vuu-ui/vuu-context-menu": "0.13.6",
+    "@vuu-ui/vuu-data-remote": "0.13.6",
+    "@vuu-ui/vuu-filter-parser": "0.13.6",
+    "@vuu-ui/vuu-layout": "0.13.6",
+    "@vuu-ui/vuu-popups": "0.13.6",
+    "@vuu-ui/vuu-ui-controls": "0.13.6",
+    "@vuu-ui/vuu-utils": "0.13.6",
+    "@vuu-ui/vuu-table": "0.13.6",
     "@salt-ds/core": "1.43.0",
     "@salt-ds/styles": "0.2.1",
     "@salt-ds/window": "0.1.1"
@@ -30,16 +30,19 @@
   "files": [
     "README.md",
     "esm",
-    "cjs"
+    "cjs",
+    "/types"
   ],
   "exports": {
     ".": {
       "require": "./cjs/index.js",
-      "import": "./esm/index.js"
+      "import": "./esm/index.js",
+      "types": "./types/index.d.ts"
     }
   },
   "main": "cjs/index.js",
   "module": "esm/index.js",
   "name": "@vuu-ui/vuu-data-react",
-  "type": "module"
+  "type": "module",
+  "types": "types/index.d.ts"
 }

package/types/data-editing/EditForm.d.ts

@@ -0,0 +1,5 @@
+import { HTMLAttributes } from "react";
+import { EditFormHookProps } from "./useEditForm";
+export interface EditFormProps extends EditFormHookProps, Omit<HTMLAttributes<HTMLDivElement>, "onSubmit"> {
+}
+export declare const EditForm: ({ className, dataSource, formFieldDescriptors, onSubmit: onSubmitProp, ...htmlAttributes }: EditFormProps) => import("react/jsx-runtime").JSX.Element;

package/types/data-editing/UnsavedChangesReport.d.ts

@@ -0,0 +1,6 @@
+import { Entity } from "@vuu-ui/vuu-utils";
+export interface UnsavedChangesReportProps<T extends Entity = Entity> {
+    entity: T;
+    editedEntity: T;
+}
+export declare const UnsavedChangesReport: ({ entity, editedEntity, }: UnsavedChangesReportProps) => import("react/jsx-runtime").JSX.Element;

package/types/data-editing/edit-rule-validation-checker.d.ts

@@ -0,0 +1,4 @@
+import type { DataValueDescriptor, DataValueValidationChecker, EditPhase, EditRuleValidationSuccessResult, EditValidationRule } from "@vuu-ui/vuu-data-types";
+export declare const OK: EditRuleValidationSuccessResult;
+export declare function getEditValidationRules(descriptor: DataValueDescriptor, editPhase: EditPhase | "*"): EditValidationRule[];
+export declare const buildValidationChecker: (rules: EditValidationRule[]) => DataValueValidationChecker;

package/types/data-editing/edit-validation-rules.d.ts

@@ -0,0 +1 @@
+export declare const registerRules: () => void;

package/types/data-editing/form-edit-state.d.ts

@@ -0,0 +1,7 @@
+import { Entity } from "@vuu-ui/vuu-utils";
+export type FormEditState = {
+    isClean: boolean;
+    editedFields: string[];
+};
+export declare const CLEAN_FORM: FormEditState;
+export declare const buildFormEditState: (entity: Entity | undefined, newEntity: Entity) => FormEditState;

package/types/data-editing/get-data-item-edit-control.d.ts

@@ -0,0 +1,18 @@
+import type { DataValueDescriptor, TableSchemaTable } from "@vuu-ui/vuu-data-types";
+import { VuuTypeaheadInputProps } from "@vuu-ui/vuu-ui-controls";
+import { CommitHandler } from "@vuu-ui/vuu-utils";
+import { InputProps } from "@salt-ds/core";
+export interface DataItemEditControlProps {
+    InputProps?: Partial<InputProps>;
+    TypeaheadProps?: Pick<VuuTypeaheadInputProps, "highlightFirstSuggestion">;
+    commitWhenCleared?: boolean;
+    /**
+     * A table column or form field Descriptor.
+     */
+    dataDescriptor: DataValueDescriptor;
+    errorMessage?: string;
+    onCommit: CommitHandler<HTMLElement>;
+    table?: TableSchemaTable;
+}
+export type ValidationStatus = "initial" | true | string;
+export declare const getDataItemEditControl: ({ InputProps, TypeaheadProps, commitWhenCleared, dataDescriptor, errorMessage, onCommit, table, }: DataItemEditControlProps) => import("react/jsx-runtime").JSX.Element;

package/types/data-editing/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./get-data-item-edit-control";
+export * from "./EditForm";
+export * from "./edit-rule-validation-checker";
+export * from "./UnsavedChangesReport";
+export * from "./useEditForm";
+export * from "./form-edit-state";

package/types/data-editing/useEditForm.d.ts

@@ -0,0 +1,21 @@
+import type { DataSource, DataValueDescriptor } from "@vuu-ui/vuu-data-types";
+import { CommitHandler, Entity } from "@vuu-ui/vuu-utils";
+import { FocusEventHandler, SyntheticEvent } from "react";
+export interface EditFormHookProps {
+    dataSource?: DataSource;
+    formFieldDescriptors: DataValueDescriptor[];
+    onSubmit?: () => void;
+}
+export declare const useEditForm: ({ dataSource, formFieldDescriptors, onSubmit, }: EditFormHookProps) => {
+    editedFields: string[];
+    editEntity: Entity | undefined;
+    errorMessages: Record<string, string>;
+    formFieldsContainerRef: import("react").RefObject<HTMLDivElement | null>;
+    isClean: boolean;
+    ok: boolean;
+    onCancel: () => Promise<void>;
+    onChange: (evt: SyntheticEvent<HTMLInputElement>) => void;
+    onCommit: CommitHandler<HTMLElement>;
+    onFocus: FocusEventHandler;
+    onSubmit: () => Promise<void>;
+};

package/types/datasource-provider/RestDataSourceProvider.d.ts

@@ -0,0 +1,11 @@
+import { TableSchema } from "@vuu-ui/vuu-data-types";
+import { ReactNode } from "react";
+export type RestDataSourceExtension = {
+    createHttpHeaders?: () => Headers;
+};
+export declare const isRestDataSourceExtension: (o?: unknown) => o is RestDataSourceExtension;
+export declare const RestDataSourceProvider: ({ children, createHttpHeaders, tableSchemas, url, }: {
+    children: ReactNode;
+    tableSchemas?: Record<string, TableSchema>;
+    url: string;
+} & RestDataSourceExtension) => import("react/jsx-runtime").JSX.Element;

package/types/datasource-provider/VuuDataSourceProvider.d.ts

@@ -0,0 +1,8 @@
+import { ReactNode } from "react";
+export declare const VuuDataSourceProvider: ({ authenticate, autoConnect, autoLogin, children, websocketUrl, }: {
+    authenticate?: boolean;
+    autoConnect?: boolean;
+    autoLogin?: boolean;
+    children: ReactNode;
+    websocketUrl?: string;
+}) => import("react/jsx-runtime").JSX.Element;

package/types/datasource-provider/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./RestDataSourceProvider";
+export * from "./VuuDataSourceProvider";

package/types/datasource-provider/useAutoLoginToVuuServer.d.ts

@@ -0,0 +1,7 @@
+export declare const useAutoLoginToVuuServer: ({ authenticate, autoConnect, secure, websocketUrl, }?: {
+    authenticate?: boolean;
+    autoConnect?: boolean;
+    autoLogin?: boolean;
+    secure?: boolean;
+    websocketUrl?: string;
+}) => import("react/jsx-runtime").JSX.Element | undefined;

package/types/hooks/index.d.ts

@@ -0,0 +1,6 @@
+export * from "./useLookupValues";
+export * from "./useSessionDataSource";
+export * from "./useVuuMenuActions";
+export * from "./useVuuTables";
+export * from "./useVisualLinks";
+export * from "./useTypeaheadSuggestions";

package/types/hooks/useLookupValues.d.ts

@@ -0,0 +1,5 @@
+import { ColumnDescriptor, ListOption } from "@vuu-ui/vuu-table-types";
+export declare const useLookupValues: (column: ColumnDescriptor, initialValueProp: number | string) => {
+    initialValue: ListOption | null;
+    values: ListOption[];
+};

package/types/hooks/useSessionDataSource.d.ts

@@ -0,0 +1,5 @@
+import type { DataSource, TableSchema } from "@vuu-ui/vuu-data-types";
+export declare const useSessionDataSource: ({ dataSourceSessionKey, tableSchema, }: {
+    dataSourceSessionKey?: string;
+    tableSchema: TableSchema;
+}) => DataSource;

package/types/hooks/useTypeaheadSuggestions.d.ts

@@ -0,0 +1,4 @@
+import { SuggestionFetcher, TableSchemaTable } from "@vuu-ui/vuu-data-types";
+import { TypeaheadParams } from "@vuu-ui/vuu-protocol-types";
+export declare const getTypeaheadParams: (table: TableSchemaTable, column: string, text?: string, selectedValues?: string[]) => TypeaheadParams;
+export declare const useTypeaheadSuggestions: () => SuggestionFetcher;

package/types/hooks/useVisualLinks.d.ts

@@ -0,0 +1,2 @@
+import { DataSource } from "@vuu-ui/vuu-data-types";
+export declare const useVisualLinks: (dataSource: DataSource) => void;

package/types/hooks/useVuuMenuActions.d.ts

@@ -0,0 +1,44 @@
+import { type MenuActionHandler, type MenuBuilder } from "@vuu-ui/vuu-context-menu";
+import { DataSource, DataSourceVisualLinkCreatedMessage, RpcResponseHandler } from "@vuu-ui/vuu-data-types";
+import type { LinkDescriptorWithLabel, VuuDataRowDto, VuuMenu, VuuMenuItem, VuuRowDataItemType } from "@vuu-ui/vuu-protocol-types";
+import { TableContextMenuOptions, TableMenuLocation } from "@vuu-ui/vuu-table";
+import type { ColumnDescriptor } from "@vuu-ui/vuu-table-types";
+export interface VuuMenuActionHookResult {
+    menuBuilder: MenuBuilder<TableMenuLocation, TableContextMenuOptions>;
+    menuActionHandler: MenuActionHandler;
+}
+export interface MenuActionConfig {
+    vuuMenu?: VuuMenu;
+    visualLink?: DataSourceVisualLinkCreatedMessage;
+    visualLinks?: LinkDescriptorWithLabel[];
+}
+export interface VuuMenuActionHookProps {
+    /**
+     * By default, vuuMenuActions will be handled automatically. When activated, a
+     * message will be sent to server and response will be handled here too.
+     * This prop allows client to provide a custom handler for a menu Item. This will
+     * take priority and if handler returns true, no further processing for the menu
+     * item will be handled by Vuu. This can also be used to prevent an item from being
+     * actioned, even when no custom handling is intended. If the handler returns false,
+     * Vuu will process the menuItem.
+     */
+    clientSideMenuActionHandler?: MenuActionHandler;
+    dataSource?: DataSource;
+    menuActionConfig?: MenuActionConfig;
+    onRpcResponse?: RpcResponseHandler;
+}
+export interface VuuCellContextMenuItemOptions extends VuuMenuItem {
+    rowKey: string;
+    field: string;
+    value: VuuRowDataItemType;
+}
+export interface VuuRowContextMenuItemOptions extends VuuMenuItem {
+    rowKey: string;
+    row: VuuDataRowDto;
+}
+export interface VuuSelectedRowsContextMenuItemOptions extends VuuMenuItem {
+    columns: ColumnDescriptor[];
+}
+export declare const isRowMenu: (options: VuuMenuItem) => options is VuuRowContextMenuItemOptions;
+export declare const isSelectionMenu: (options: VuuMenuItem) => options is VuuSelectedRowsContextMenuItemOptions;
+export declare const useVuuMenuActions: ({ clientSideMenuActionHandler, dataSource, onRpcResponse, }: VuuMenuActionHookProps) => VuuMenuActionHookResult;

package/types/hooks/useVuuTables.d.ts

@@ -0,0 +1,2 @@
+import type { TableSchema } from "@vuu-ui/vuu-data-types";
+export declare const useVuuTables: () => TableSchema[] | undefined;

package/types/index.d.ts

@@ -0,0 +1,4 @@
+export * from "./data-editing";
+export * from "./datasource-provider";
+export * from "./hooks";
+export * from "./session-editing-form";

package/types/session-editing-form/SessionEditingForm.d.ts

@@ -0,0 +1,24 @@
+import { DataSource, TableSchema } from "@vuu-ui/vuu-data-types";
+import { VuuColumnDataType } from "@vuu-ui/vuu-protocol-types";
+import { HTMLAttributes } from "react";
+export type FormFieldDescriptor = {
+    isKeyField?: boolean;
+    label?: string;
+    name: string;
+    type: VuuColumnDataType;
+    description: string;
+    readonly?: boolean;
+    required?: boolean;
+};
+export type FormConfig = {
+    title: string;
+    key: string;
+    fields: FormFieldDescriptor[];
+};
+export interface SessionEditingFormProps extends HTMLAttributes<HTMLDivElement> {
+    config: FormConfig;
+    onClose?: () => void;
+    dataSource?: DataSource;
+    schema?: TableSchema;
+}
+export declare const SessionEditingForm: ({ className, config: { fields, key: keyField }, dataSource: dataSourceProp, id: idProp, onClose, schema, ...htmlAttributes }: SessionEditingFormProps) => import("react/jsx-runtime").JSX.Element;

package/types/session-editing-form/index.d.ts

@@ -0,0 +1 @@
+export * from "./SessionEditingForm";