@deephaven/jsapi-components 0.43.0 → 0.44.0

package/dist/ColumnNameError.js

@@ -0,0 +1,11 @@
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+class ColumnNameError extends Error {
+  constructor() {
+    super(...arguments);
+    _defineProperty(this, "isColumnNameError", true);
+  }
+}
+export default ColumnNameError;
+//# sourceMappingURL=ColumnNameError.js.map

package/dist/ColumnNameError.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnNameError.js","names":["ColumnNameError","Error"],"sources":["../src/ColumnNameError.ts"],"sourcesContent":["class ColumnNameError extends Error {\n  isColumnNameError = true;\n}\n\nexport default ColumnNameError;\n"],"mappings":";;;AAAA,MAAMA,eAAe,SAASC,KAAK,CAAC;EAAA;IAAA;IAAA,2CACd,IAAI;EAAA;AAC1B;AAEA,eAAeD,eAAe"}

package/dist/HookTestUtils.js

@@ -0,0 +1,16 @@
+import React from 'react';
+import { ApiContext } from '@deephaven/jsapi-bootstrap';
+export function makeApiContextWrapper(dh) {
+  return function ApiContextWrapper(_ref) {
+    var {
+      children
+    } = _ref;
+    return /*#__PURE__*/React.createElement(ApiContext.Provider, {
+      value: dh
+    }, children);
+  };
+}
+export default {
+  makeApiContextWrapper
+};
+//# sourceMappingURL=HookTestUtils.js.map

package/dist/HookTestUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HookTestUtils.js","names":["React","ApiContext","makeApiContextWrapper","dh","ApiContextWrapper","children"],"sources":["../src/HookTestUtils.tsx"],"sourcesContent":["import React, { ReactNode } from 'react';\nimport { ApiContext } from '@deephaven/jsapi-bootstrap';\nimport type { dh as DhType } from '@deephaven/jsapi-types';\n\nexport function makeApiContextWrapper(dh: DhType) {\n  return function ApiContextWrapper({ children }: { children?: ReactNode }) {\n    return <ApiContext.Provider value={dh}>{children}</ApiContext.Provider>;\n  };\n}\n\nexport default {\n  makeApiContextWrapper,\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAqB,OAAO;AACxC,SAASC,UAAU,QAAQ,4BAA4B;AAGvD,OAAO,SAASC,qBAAqB,CAACC,EAAU,EAAE;EAChD,OAAO,SAASC,iBAAiB,OAAyC;IAAA,IAAxC;MAAEC;IAAmC,CAAC;IACtE,oBAAO,oBAAC,UAAU,CAAC,QAAQ;MAAC,KAAK,EAAEF;IAAG,GAAEE,QAAQ,CAAuB;EACzE,CAAC;AACH;AAEA,eAAe;EACbH;AACF,CAAC"}

package/dist/RefreshTokenBootstrap.js

@@ -0,0 +1,38 @@
+import React, { useCallback, useEffect, useState } from 'react';
+import { useApi, useClient } from '@deephaven/jsapi-bootstrap';
+import useBroadcastLoginListener from "./useBroadcastLoginListener.js";
+import { readRefreshToken, RefreshTokenContext, storeRefreshToken } from "./RefreshTokenUtils.js";
+/**
+ * RefreshTokenBootstrap component. Handles storing and reading the refresh token.
+ */
+export function RefreshTokenBootstrap(_ref) {
+  var {
+    children
+  } = _ref;
+  var api = useApi();
+  var client = useClient();
+  var [token, setToken] = useState(readRefreshToken());
+  useEffect(function listenForTokenUpdates() {
+    var cleanup = client.addEventListener(api.CoreClient.EVENT_REFRESH_TOKEN_UPDATED, event => {
+      var {
+        detail: newToken
+      } = event;
+      storeRefreshToken(newToken);
+      setToken(newToken);
+    });
+    return cleanup;
+  }, [api, client, token]);
+  var onLogin = useCallback(() => {
+    setToken(readRefreshToken());
+  }, []);
+  var onLogout = useCallback(() => {
+    storeRefreshToken(null);
+    setToken(null);
+  }, []);
+  useBroadcastLoginListener(onLogin, onLogout);
+  return /*#__PURE__*/React.createElement(RefreshTokenContext.Provider, {
+    value: token
+  }, children);
+}
+export default RefreshTokenBootstrap;
+//# sourceMappingURL=RefreshTokenBootstrap.js.map

package/dist/RefreshTokenBootstrap.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RefreshTokenBootstrap.js","names":["React","useCallback","useEffect","useState","useApi","useClient","useBroadcastLoginListener","readRefreshToken","RefreshTokenContext","storeRefreshToken","RefreshTokenBootstrap","children","api","client","token","setToken","listenForTokenUpdates","cleanup","addEventListener","CoreClient","EVENT_REFRESH_TOKEN_UPDATED","event","detail","newToken","onLogin","onLogout"],"sources":["../src/RefreshTokenBootstrap.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useState } from 'react';\nimport { useApi, useClient } from '@deephaven/jsapi-bootstrap';\nimport useBroadcastLoginListener from './useBroadcastLoginListener';\nimport {\n  readRefreshToken,\n  RefreshTokenContext,\n  storeRefreshToken,\n} from './RefreshTokenUtils';\n\nexport type RefreshTokenBootstrapProps = {\n  /**\n   * The children to render wrapped with the RefreshTokenContext.\n   */\n  children: React.ReactNode;\n};\n\n/**\n * RefreshTokenBootstrap component. Handles storing and reading the refresh token.\n */\nexport function RefreshTokenBootstrap({\n  children,\n}: RefreshTokenBootstrapProps) {\n  const api = useApi();\n  const client = useClient();\n  const [token, setToken] = useState(readRefreshToken());\n\n  useEffect(\n    function listenForTokenUpdates() {\n      const cleanup = client.addEventListener(\n        api.CoreClient.EVENT_REFRESH_TOKEN_UPDATED,\n        (event: CustomEvent) => {\n          const { detail: newToken } = event;\n          storeRefreshToken(newToken);\n          setToken(newToken);\n        }\n      );\n      return cleanup;\n    },\n    [api, client, token]\n  );\n\n  const onLogin = useCallback(() => {\n    setToken(readRefreshToken());\n  }, []);\n\n  const onLogout = useCallback(() => {\n    storeRefreshToken(null);\n    setToken(null);\n  }, []);\n\n  useBroadcastLoginListener(onLogin, onLogout);\n\n  return (\n    <RefreshTokenContext.Provider value={token}>\n      {children}\n    </RefreshTokenContext.Provider>\n  );\n}\n\nexport default RefreshTokenBootstrap;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC/D,SAASC,MAAM,EAAEC,SAAS,QAAQ,4BAA4B;AAAC,OACxDC,yBAAyB;AAAA,SAE9BC,gBAAgB,EAChBC,mBAAmB,EACnBC,iBAAiB;AAUnB;AACA;AACA;AACA,OAAO,SAASC,qBAAqB,OAEN;EAAA,IAFO;IACpCC;EAC0B,CAAC;EAC3B,IAAMC,GAAG,GAAGR,MAAM,EAAE;EACpB,IAAMS,MAAM,GAAGR,SAAS,EAAE;EAC1B,IAAM,CAACS,KAAK,EAAEC,QAAQ,CAAC,GAAGZ,QAAQ,CAACI,gBAAgB,EAAE,CAAC;EAEtDL,SAAS,CACP,SAASc,qBAAqB,GAAG;IAC/B,IAAMC,OAAO,GAAGJ,MAAM,CAACK,gBAAgB,CACrCN,GAAG,CAACO,UAAU,CAACC,2BAA2B,EACzCC,KAAkB,IAAK;MACtB,IAAM;QAAEC,MAAM,EAAEC;MAAS,CAAC,GAAGF,KAAK;MAClCZ,iBAAiB,CAACc,QAAQ,CAAC;MAC3BR,QAAQ,CAACQ,QAAQ,CAAC;IACpB,CAAC,CACF;IACD,OAAON,OAAO;EAChB,CAAC,EACD,CAACL,GAAG,EAAEC,MAAM,EAAEC,KAAK,CAAC,CACrB;EAED,IAAMU,OAAO,GAAGvB,WAAW,CAAC,MAAM;IAChCc,QAAQ,CAACR,gBAAgB,EAAE,CAAC;EAC9B,CAAC,EAAE,EAAE,CAAC;EAEN,IAAMkB,QAAQ,GAAGxB,WAAW,CAAC,MAAM;IACjCQ,iBAAiB,CAAC,IAAI,CAAC;IACvBM,QAAQ,CAAC,IAAI,CAAC;EAChB,CAAC,EAAE,EAAE,CAAC;EAENT,yBAAyB,CAACkB,OAAO,EAAEC,QAAQ,CAAC;EAE5C,oBACE,oBAAC,mBAAmB,CAAC,QAAQ;IAAC,KAAK,EAAEX;EAAM,GACxCH,QAAQ,CACoB;AAEnC;AAEA,eAAeD,qBAAqB"}

package/dist/RefreshTokenUtils.js

@@ -0,0 +1,44 @@
+import { createContext } from 'react';
+import Cookies from 'js-cookie';
+import Log from '@deephaven/log';
+export var REFRESH_TOKEN_KEY = 'io.deephaven.web.client.auth.refreshToken';
+export var RefreshTokenContext = /*#__PURE__*/createContext(null);
+var log = Log.module('RefreshTokenUtils');
+
+/**
+ * Read the refresh token from our cookie store
+ * @returns RefreshToken if it exists, null otherwise
+ */
+export function readRefreshToken() {
+  var cookieToken = Cookies.get(REFRESH_TOKEN_KEY);
+  try {
+    if (cookieToken != null) {
+      return JSON.parse(cookieToken);
+    }
+  } catch (e) {
+    log.error('Error parsing refresh token', cookieToken, e);
+  }
+  return null;
+}
+
+/**
+ * Store the provided refresh token as a cookie
+ * @param token The refresh token to store
+ */
+export function storeRefreshToken(token) {
+  if (token == null) {
+    Cookies.remove(REFRESH_TOKEN_KEY);
+    return;
+  }
+  var cookieToken = JSON.stringify({
+    bytes: token.bytes,
+    expiry: token.expiry
+  });
+  var expires = new Date(token.expiry);
+  Cookies.set(REFRESH_TOKEN_KEY, cookieToken, {
+    secure: true,
+    sameSite: 'strict',
+    expires
+  });
+}
+//# sourceMappingURL=RefreshTokenUtils.js.map

package/dist/RefreshTokenUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"RefreshTokenUtils.js","names":["createContext","Cookies","Log","REFRESH_TOKEN_KEY","RefreshTokenContext","log","module","readRefreshToken","cookieToken","get","JSON","parse","e","error","storeRefreshToken","token","remove","stringify","bytes","expiry","expires","Date","set","secure","sameSite"],"sources":["../src/RefreshTokenUtils.ts"],"sourcesContent":["import { createContext } from 'react';\nimport Cookies from 'js-cookie';\nimport Log from '@deephaven/log';\n\nexport const REFRESH_TOKEN_KEY = 'io.deephaven.web.client.auth.refreshToken';\n\nexport type RefreshToken = { bytes: string; expiry: number };\n\nexport const RefreshTokenContext = createContext<RefreshToken | null>(null);\n\nconst log = Log.module('RefreshTokenUtils');\n\n/**\n * Read the refresh token from our cookie store\n * @returns RefreshToken if it exists, null otherwise\n */\nexport function readRefreshToken(): RefreshToken | null {\n  const cookieToken = Cookies.get(REFRESH_TOKEN_KEY);\n  try {\n    if (cookieToken != null) {\n      return JSON.parse(cookieToken);\n    }\n  } catch (e) {\n    log.error('Error parsing refresh token', cookieToken, e);\n  }\n  return null;\n}\n\n/**\n * Store the provided refresh token as a cookie\n * @param token The refresh token to store\n */\nexport function storeRefreshToken(token: RefreshToken | null) {\n  if (token == null) {\n    Cookies.remove(REFRESH_TOKEN_KEY);\n    return;\n  }\n\n  const cookieToken = JSON.stringify({\n    bytes: token.bytes,\n    expiry: token.expiry,\n  });\n  const expires = new Date(token.expiry);\n\n  Cookies.set(REFRESH_TOKEN_KEY, cookieToken, {\n    secure: true,\n    sameSite: 'strict',\n    expires,\n  });\n}\n"],"mappings":"AAAA,SAASA,aAAa,QAAQ,OAAO;AACrC,OAAOC,OAAO,MAAM,WAAW;AAC/B,OAAOC,GAAG,MAAM,gBAAgB;AAEhC,OAAO,IAAMC,iBAAiB,GAAG,2CAA2C;AAI5E,OAAO,IAAMC,mBAAmB,gBAAGJ,aAAa,CAAsB,IAAI,CAAC;AAE3E,IAAMK,GAAG,GAAGH,GAAG,CAACI,MAAM,CAAC,mBAAmB,CAAC;;AAE3C;AACA;AACA;AACA;AACA,OAAO,SAASC,gBAAgB,GAAwB;EACtD,IAAMC,WAAW,GAAGP,OAAO,CAACQ,GAAG,CAACN,iBAAiB,CAAC;EAClD,IAAI;IACF,IAAIK,WAAW,IAAI,IAAI,EAAE;MACvB,OAAOE,IAAI,CAACC,KAAK,CAACH,WAAW,CAAC;IAChC;EACF,CAAC,CAAC,OAAOI,CAAC,EAAE;IACVP,GAAG,CAACQ,KAAK,CAAC,6BAA6B,EAAEL,WAAW,EAAEI,CAAC,CAAC;EAC1D;EACA,OAAO,IAAI;AACb;;AAEA;AACA;AACA;AACA;AACA,OAAO,SAASE,iBAAiB,CAACC,KAA0B,EAAE;EAC5D,IAAIA,KAAK,IAAI,IAAI,EAAE;IACjBd,OAAO,CAACe,MAAM,CAACb,iBAAiB,CAAC;IACjC;EACF;EAEA,IAAMK,WAAW,GAAGE,IAAI,CAACO,SAAS,CAAC;IACjCC,KAAK,EAAEH,KAAK,CAACG,KAAK;IAClBC,MAAM,EAAEJ,KAAK,CAACI;EAChB,CAAC,CAAC;EACF,IAAMC,OAAO,GAAG,IAAIC,IAAI,CAACN,KAAK,CAACI,MAAM,CAAC;EAEtClB,OAAO,CAACqB,GAAG,CAACnB,iBAAiB,EAAEK,WAAW,EAAE;IAC1Ce,MAAM,EAAE,IAAI;IACZC,QAAQ,EAAE,QAAQ;IAClBJ;EACF,CAAC,CAAC;AACJ"}

package/dist/TableDisconnectError.js

@@ -0,0 +1,11 @@
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+class TableDisconnectError extends Error {
+  constructor() {
+    super(...arguments);
+    _defineProperty(this, "isTableDisconnectError", true);
+  }
+}
+export default TableDisconnectError;
+//# sourceMappingURL=TableDisconnectError.js.map

package/dist/TableDisconnectError.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableDisconnectError.js","names":["TableDisconnectError","Error"],"sources":["../src/TableDisconnectError.ts"],"sourcesContent":["class TableDisconnectError extends Error {\n  isTableDisconnectError = true;\n}\n\nexport default TableDisconnectError;\n"],"mappings":";;;AAAA,MAAMA,oBAAoB,SAASC,KAAK,CAAC;EAAA;IAAA;IAAA,gDACd,IAAI;EAAA;AAC/B;AAEA,eAAeD,oBAAoB"}

package/dist/TableInput.css

@@ -0,0 +1,14 @@
+/* stylelint-disable scss/at-import-no-partial-leading-underscore */
+.table-input-container .select-value-list-scroll-pane {
+  min-height: 2.4rem;
+  max-height: 12rem;
+  z-index: 0;
+}
+.table-input-container .meta-row {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: space-between;
+  padding-top: 0.25rem;
+}
+
+/*# sourceMappingURL=TableInput.css.map */

package/dist/TableInput.css.map

@@ -0,0 +1 @@
+{"version":3,"sourceRoot":"","sources":["../../../node_modules/@deephaven/components/scss/custom.scss","../src/TableInput.scss","../../../node_modules/@deephaven/components/scss/new_variables.scss"],"names":[],"mappings":"AAAA;ACGE;EACE;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA,aCVO","file":"TableInput.css","sourcesContent":["/* stylelint-disable scss/at-import-no-partial-leading-underscore */\n// Consumers should be able to resolve bootstrap/ to node_modules/bootstrap\n\n//Make bootstrap functions available for use in overrides\n@import 'bootstrap/scss/_functions.scss';\n@import './bootstrap_overrides.scss';\n\n//_variable imports come after bootstrap default overrides,\n// makes all other variables and mixins from bootstrap available\n/// with just importing customer.scss\n@import 'bootstrap/scss/_variables.scss';\n@import 'bootstrap/scss/_mixins.scss';\n\n//New variables come after imports\n@import './new_variables.scss';\n","@import '@deephaven/components/scss/custom.scss';\n\n.table-input-container {\n  .select-value-list-scroll-pane {\n    min-height: 2.4rem;\n    max-height: 12rem;\n    z-index: 0;\n  }\n  .meta-row {\n    display: flex;\n    flex-wrap: wrap;\n    justify-content: space-between;\n    padding-top: $spacer-1;\n  }\n}\n","//Set of spacer variables from the spacer map\n$spacer-0: map-get($spacers, 0); //0\n$spacer-1: map-get($spacers, 1);\n$spacer-2: map-get($spacers, 2);\n$spacer-3: map-get($spacers, 3);\n$spacer-4: map-get($spacers, 4);\n$spacer-5: map-get($spacers, 5);\n\n//Marching Ants for golden layout dropzone and drag and drop\n//top bottom, left right.\n//create 4 background images that are 50% color 1, 50% color 2 using graidents,  two veritical, two horizontal\n//size them to ant-size and thickness\n//position those images along the egdes and make top/bottom repeat-x and left/right repeat-y\n//then offest each of those background positions by ant-size in animation to make them march.\n$ant-size: 8px;\n$ant-thickness: 1px;\n\n@mixin ants-base($color-1: black, $color-2: white) {\n  background-image: linear-gradient(to right, $color-2 50%, $color-1 50%),\n    linear-gradient(to right, $color-2 50%, $color-1 50%),\n    linear-gradient(to bottom, $color-2 50%, $color-1 50%),\n    linear-gradient(to bottom, $color-2 50%, $color-1 50%);\n  background-size: $ant-size $ant-thickness, $ant-size $ant-thickness,\n    $ant-thickness $ant-size, $ant-thickness $ant-size;\n  background-position: 0 top, 0 bottom, left 0, right 0;\n  background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;\n  animation: march 0.5s;\n  animation-timing-function: linear;\n  animation-iteration-count: infinite;\n}\n\n@mixin drag-stack($pseudo-element) {\n  &::#{$pseudo-element} {\n    content: ' ';\n    background: $primary;\n    box-shadow: $box-shadow;\n    border-radius: $border-radius;\n    position: absolute;\n    height: 100%;\n    width: 100%;\n    @content;\n  }\n}\n\n$focus-bg-transparency: 0.12;\n$hover-bg-transparency: 0.14;\n$active-bg-transparency: 0.28;\n$exception-transparency: 0.13;\n"]}

package/dist/TableInput.js

@@ -0,0 +1,216 @@
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+import React, { useCallback, useState, useRef, useEffect, useMemo } from 'react';
+import classNames from 'classnames';
+import { LoadingOverlay, SearchInput, SelectValueList } from '@deephaven/components';
+import { PromiseUtils } from '@deephaven/utils';
+import Log from '@deephaven/log';
+import { Formatter, FormatterUtils } from '@deephaven/jsapi-utils';
+import { useApi } from '@deephaven/jsapi-bootstrap';
+import useTableColumn from "./useTableColumn.js";
+import "./TableInput.css";
+var log = Log.module('TableInput');
+var SIZE_LIMIT = 250;
+function TableInput(props) {
+  var _table$size, _error$message;
+  var {
+    className = undefined,
+    columnName,
+    settings,
+    defaultValue = [],
+    isInvalid = false,
+    onChange = () => false,
+    onBlur = () => false,
+    table: tablePromise
+  } = props;
+  var parentRef = useRef(null);
+  var dh = useApi();
+  var formatter = useMemo(() => {
+    var columnFormats = FormatterUtils.getColumnFormats(settings);
+    var dateTimeFormatterOptions = FormatterUtils.getDateTimeFormatterOptions(settings);
+    var {
+      defaultDecimalFormatOptions = {},
+      defaultIntegerFormatOptions = {}
+    } = settings;
+    return new Formatter(dh, columnFormats, dateTimeFormatterOptions, defaultDecimalFormatOptions, defaultIntegerFormatOptions);
+  }, [dh, settings]);
+  var [searchValue, setSearchValue] = useState('');
+  var [selection, setSelection] = useState(new Set(defaultValue));
+  var [table, setTable] = useState();
+  var listRef = useRef(null);
+  var itemCount = Math.min((_table$size = table === null || table === void 0 ? void 0 : table.size) !== null && _table$size !== void 0 ? _table$size : 0, SIZE_LIMIT);
+  var {
+    column,
+    data,
+    error
+  } = useTableColumn(table, 0, SIZE_LIMIT - 1, columnName);
+  var formatValue = useCallback(value => column ? formatter.getFormattedString(value, column.type, column.name) : "".concat(value), [column, formatter]);
+  var [items, updatedSelection] = useMemo(() => {
+    var removedItems = new Set(selection);
+    var result = [];
+    if (data == null) {
+      // Viewport not initialized
+      return [result, null];
+    }
+    data.forEach(v => {
+      var value = "".concat(v);
+      var isSelected = selection.has(value);
+      if (isSelected) {
+        removedItems.delete(value);
+      }
+      result.push({
+        value,
+        displayValue: formatValue(v),
+        isSelected
+      });
+    });
+    if (removedItems.size > 0) {
+      log.debug2('Selection has items that are missing from the viewport');
+      var newSelection = new Set(selection);
+      Array.from(removedItems).forEach(value => {
+        newSelection.delete(value);
+      });
+      return [result, newSelection];
+    }
+    return [result, null];
+  }, [data, selection, formatValue]);
+  useEffect(() => {
+    if (updatedSelection !== null) {
+      setSelection(updatedSelection);
+      onChange(Array.from(updatedSelection));
+    }
+  }, [onChange, updatedSelection]);
+  var initTable = useCallback( /*#__PURE__*/function () {
+    var _ref = _asyncToGenerator(function* (promise) {
+      try {
+        var resolved = yield promise;
+        log.debug('Table resolved', resolved);
+        setTable(resolved);
+      } catch (e) {
+        if (PromiseUtils.isCanceled(e)) {
+          return;
+        }
+        log.error(e);
+      }
+    });
+    return function (_x) {
+      return _ref.apply(this, arguments);
+    };
+  }(), []);
+  useEffect(() => {
+    var cancelablePromise = PromiseUtils.makeCancelable(tablePromise);
+    initTable(cancelablePromise);
+    return () => {
+      log.debug2('Cancel table promise');
+      cancelablePromise.cancel();
+    };
+  }, [tablePromise, initTable]);
+
+  // Scroll the item matching the input into view
+  var handleSearchChange = useCallback(e => {
+    var {
+      value
+    } = e.target;
+    setSearchValue(value);
+    var index = items.findIndex(item => item.displayValue.includes(value));
+    if (index > -1) {
+      var _listRef$current;
+      log.debug2("Found ".concat(value, " at index ").concat(index));
+      (_listRef$current = listRef.current) === null || _listRef$current === void 0 ? void 0 : _listRef$current.scrollIntoView(index);
+    } else {
+      log.debug2("".concat(value, " not found"));
+    }
+  }, [items, listRef]);
+  var handleSelect = useCallback(index => {
+    log.debug('handleSelect', index);
+    if (index >= items.length) {
+      log.error('Invalid index', index);
+      return;
+    }
+    var selectedValue = items[index].value;
+    var newSelection = new Set(selection);
+    if (items[index].isSelected) {
+      newSelection.delete(selectedValue);
+    } else {
+      newSelection.add(selectedValue);
+    }
+    setSelection(newSelection);
+    onChange(Array.from(newSelection));
+  }, [onChange, items, selection]);
+  var handleSelectAll = useCallback(() => {
+    var values = items.map(item => item.value);
+    var newSelection = new Set(values);
+    setSelection(newSelection);
+    onChange(values);
+  }, [items, onChange]);
+  var handleClearSelection = useCallback(() => {
+    setSelection(new Set());
+    onChange([]);
+  }, [onChange]);
+  var handleViewportChange = useCallback(() => {
+    // no-op
+  }, []);
+  var handleChildBlur = useCallback(e => {
+    var _parentRef$current;
+    var {
+      relatedTarget
+    } = e;
+    log.debug('handleChildBlur', relatedTarget, relatedTarget instanceof HTMLElement, parentRef.current, (_parentRef$current = parentRef.current) === null || _parentRef$current === void 0 ? void 0 : _parentRef$current.contains(relatedTarget));
+    if (!relatedTarget || parentRef.current && relatedTarget instanceof HTMLElement && !parentRef.current.contains(relatedTarget)) {
+      onBlur();
+    }
+  }, [onBlur]);
+  var isEmpty = items.length === 0;
+  return /*#__PURE__*/React.createElement("div", {
+    ref: parentRef,
+    className: classNames('table-input-container d-flex flex-column position-relative', className)
+  }, /*#__PURE__*/React.createElement(SearchInput, {
+    disabled: !!error || isEmpty,
+    value: searchValue,
+    placeholder: "Search",
+    onChange: handleSearchChange,
+    className: "mb-2 d-flex",
+    onBlur: handleChildBlur
+  }), /*#__PURE__*/React.createElement(SelectValueList, {
+    className: "table-input-list",
+    disabled: table === undefined || isEmpty,
+    isInvalid: isInvalid,
+    items: isEmpty ? [{
+      value: 'Empty',
+      isSelected: false
+    }] : items,
+    itemCount: itemCount,
+    offset: 0,
+    onSelect: handleSelect,
+    onViewportChange: handleViewportChange,
+    ref: listRef,
+    onBlur: handleChildBlur
+  }), table && /*#__PURE__*/React.createElement("div", {
+    className: "meta-row"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "d-flex align-items-center text-muted small"
+  }, table != null && table.size > itemCount && /*#__PURE__*/React.createElement(React.Fragment, null, "Table is too large, showing the first ", SIZE_LIMIT, " items.")), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    className: "btn btn-link",
+    onBlur: handleChildBlur,
+    onClick: handleSelectAll
+  }, "Select All"), /*#__PURE__*/React.createElement("button", {
+    type: "button",
+    className: "btn btn-link mr-a",
+    onBlur: handleChildBlur,
+    onClick: handleClearSelection
+  }, "Clear"))), table == null || error && /*#__PURE__*/React.createElement("div", {
+    className: "h-100 w-100 position-absolute"
+  }, /*#__PURE__*/React.createElement(LoadingOverlay, {
+    isLoaded: table != null,
+    isLoading: table == null && error == null,
+    errorMessage: (_error$message = error === null || error === void 0 ? void 0 : error.message) !== null && _error$message !== void 0 ? _error$message : null
+  })));
+}
+TableInput.displayName = 'TableInput';
+TableInput.defaultProps = {
+  isInvalid: false,
+  className: undefined
+};
+export default TableInput;
+//# sourceMappingURL=TableInput.js.map

package/dist/TableInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableInput.js","names":["React","useCallback","useState","useRef","useEffect","useMemo","classNames","LoadingOverlay","SearchInput","SelectValueList","PromiseUtils","Log","Formatter","FormatterUtils","useApi","useTableColumn","log","module","SIZE_LIMIT","TableInput","props","className","undefined","columnName","settings","defaultValue","isInvalid","onChange","onBlur","table","tablePromise","parentRef","dh","formatter","columnFormats","getColumnFormats","dateTimeFormatterOptions","getDateTimeFormatterOptions","defaultDecimalFormatOptions","defaultIntegerFormatOptions","searchValue","setSearchValue","selection","setSelection","Set","setTable","listRef","itemCount","Math","min","size","column","data","error","formatValue","value","getFormattedString","type","name","items","updatedSelection","removedItems","result","forEach","v","isSelected","has","delete","push","displayValue","debug2","newSelection","Array","from","initTable","promise","resolved","debug","e","isCanceled","cancelablePromise","makeCancelable","cancel","handleSearchChange","target","index","findIndex","item","includes","current","scrollIntoView","handleSelect","length","selectedValue","add","handleSelectAll","values","map","handleClearSelection","handleViewportChange","handleChildBlur","relatedTarget","HTMLElement","contains","isEmpty","message","displayName","defaultProps"],"sources":["../src/TableInput.tsx"],"sourcesContent":["import React, {\n  useCallback,\n  useState,\n  useRef,\n  useEffect,\n  useMemo,\n} from 'react';\nimport classNames from 'classnames';\nimport {\n  LoadingOverlay,\n  SearchInput,\n  SelectValueList,\n} from '@deephaven/components';\nimport type { LongWrapper, Table } from '@deephaven/jsapi-types';\nimport { PromiseUtils } from '@deephaven/utils';\nimport Log from '@deephaven/log';\nimport { Formatter, FormatterUtils, Settings } from '@deephaven/jsapi-utils';\nimport { useApi } from '@deephaven/jsapi-bootstrap';\nimport useTableColumn from './useTableColumn';\n\nimport './TableInput.scss';\n\nconst log = Log.module('TableInput');\n\ntype Value = LongWrapper | string;\n\ninterface SelectValueItem {\n  displayValue: string;\n  value: Value;\n  isSelected: boolean;\n}\n\ninterface TableInputProps {\n  className?: string;\n  columnName: string;\n  settings: Settings;\n  defaultValue: Value[];\n  isInvalid?: boolean;\n  table: Promise<Table>;\n  onChange(items: Value[]): void;\n  onBlur?: () => void;\n}\n\nconst SIZE_LIMIT = 250;\n\nfunction TableInput(props: TableInputProps): JSX.Element {\n  const {\n    className = undefined,\n    columnName,\n    settings,\n    defaultValue = [],\n    isInvalid = false,\n    onChange = () => false,\n    onBlur = () => false,\n    table: tablePromise,\n  } = props;\n  const parentRef = useRef<HTMLDivElement>(null);\n  const dh = useApi();\n  const formatter = useMemo(() => {\n    const columnFormats = FormatterUtils.getColumnFormats(settings);\n    const dateTimeFormatterOptions = FormatterUtils.getDateTimeFormatterOptions(\n      settings\n    );\n    const {\n      defaultDecimalFormatOptions = {},\n      defaultIntegerFormatOptions = {},\n    } = settings;\n    return new Formatter(\n      dh,\n      columnFormats,\n      dateTimeFormatterOptions,\n      defaultDecimalFormatOptions,\n      defaultIntegerFormatOptions\n    );\n  }, [dh, settings]);\n  const [searchValue, setSearchValue] = useState('');\n  const [selection, setSelection] = useState(new Set(defaultValue));\n  const [table, setTable] = useState<Table | undefined>();\n  const listRef = useRef<SelectValueList<Value>>(null);\n\n  const itemCount = Math.min(table?.size ?? 0, SIZE_LIMIT);\n\n  const { column, data, error } = useTableColumn(\n    table,\n    0,\n    SIZE_LIMIT - 1,\n    columnName\n  );\n\n  const formatValue = useCallback(\n    value =>\n      column\n        ? formatter.getFormattedString(value, column.type, column.name)\n        : `${value}`,\n    [column, formatter]\n  );\n\n  const [items, updatedSelection] = useMemo(() => {\n    const removedItems = new Set(selection);\n    const result: SelectValueItem[] = [];\n    if (data == null) {\n      // Viewport not initialized\n      return [result, null];\n    }\n    (data as Value[]).forEach(v => {\n      const value = `${v}`;\n      const isSelected = selection.has(value);\n      if (isSelected) {\n        removedItems.delete(value);\n      }\n      result.push({\n        value,\n        displayValue: formatValue(v),\n        isSelected,\n      });\n    });\n\n    if (removedItems.size > 0) {\n      log.debug2('Selection has items that are missing from the viewport');\n      const newSelection = new Set(selection);\n      Array.from(removedItems).forEach(value => {\n        newSelection.delete(value);\n      });\n      return [result, newSelection];\n    }\n    return [result, null];\n  }, [data, selection, formatValue]);\n\n  useEffect(() => {\n    if (updatedSelection !== null) {\n      setSelection(updatedSelection);\n      onChange(Array.from(updatedSelection));\n    }\n  }, [onChange, updatedSelection]);\n\n  const initTable = useCallback(async promise => {\n    try {\n      const resolved = await promise;\n      log.debug('Table resolved', resolved);\n      setTable(resolved);\n    } catch (e) {\n      if (PromiseUtils.isCanceled(e)) {\n        return;\n      }\n      log.error(e);\n    }\n  }, []);\n\n  useEffect(() => {\n    const cancelablePromise = PromiseUtils.makeCancelable(tablePromise);\n    initTable(cancelablePromise);\n    return () => {\n      log.debug2('Cancel table promise');\n      cancelablePromise.cancel();\n    };\n  }, [tablePromise, initTable]);\n\n  // Scroll the item matching the input into view\n  const handleSearchChange = useCallback(\n    e => {\n      const { value } = e.target;\n      setSearchValue(value);\n      const index = items.findIndex(item => item.displayValue.includes(value));\n      if (index > -1) {\n        log.debug2(`Found ${value} at index ${index}`);\n        listRef.current?.scrollIntoView(index);\n      } else {\n        log.debug2(`${value} not found`);\n      }\n    },\n    [items, listRef]\n  );\n\n  const handleSelect = useCallback(\n    index => {\n      log.debug('handleSelect', index);\n      if (index >= items.length) {\n        log.error('Invalid index', index);\n        return;\n      }\n      const selectedValue = items[index].value;\n      const newSelection = new Set(selection);\n      if (items[index].isSelected) {\n        newSelection.delete(selectedValue);\n      } else {\n        newSelection.add(selectedValue);\n      }\n      setSelection(newSelection);\n      onChange(Array.from(newSelection));\n    },\n    [onChange, items, selection]\n  );\n\n  const handleSelectAll = useCallback(() => {\n    const values = items.map(item => item.value);\n    const newSelection = new Set(values);\n    setSelection(newSelection);\n    onChange(values);\n  }, [items, onChange]);\n\n  const handleClearSelection = useCallback(() => {\n    setSelection(new Set());\n    onChange([]);\n  }, [onChange]);\n\n  const handleViewportChange = useCallback(() => {\n    // no-op\n  }, []);\n\n  const handleChildBlur = useCallback(\n    (e: React.FocusEvent<Element>) => {\n      const { relatedTarget } = e;\n      log.debug(\n        'handleChildBlur',\n        relatedTarget,\n        relatedTarget instanceof HTMLElement,\n        parentRef.current,\n        parentRef.current?.contains(relatedTarget)\n      );\n      if (\n        !relatedTarget ||\n        (parentRef.current &&\n          relatedTarget instanceof HTMLElement &&\n          !parentRef.current.contains(relatedTarget))\n      ) {\n        onBlur();\n      }\n    },\n    [onBlur]\n  );\n\n  const isEmpty = items.length === 0;\n\n  return (\n    <div\n      ref={parentRef}\n      className={classNames(\n        'table-input-container d-flex flex-column position-relative',\n        className\n      )}\n    >\n      <SearchInput\n        disabled={!!error || isEmpty}\n        value={searchValue}\n        placeholder=\"Search\"\n        onChange={handleSearchChange}\n        className=\"mb-2 d-flex\"\n        onBlur={handleChildBlur}\n      />\n      <SelectValueList\n        className=\"table-input-list\"\n        disabled={table === undefined || isEmpty}\n        isInvalid={isInvalid}\n        items={isEmpty ? [{ value: 'Empty', isSelected: false }] : items}\n        itemCount={itemCount}\n        offset={0}\n        onSelect={handleSelect}\n        onViewportChange={handleViewportChange}\n        ref={listRef}\n        onBlur={handleChildBlur}\n      />\n\n      {table && (\n        <div className=\"meta-row\">\n          <div className=\"d-flex align-items-center text-muted small\">\n            {table != null && table.size > itemCount && (\n              <>Table is too large, showing the first {SIZE_LIMIT} items.</>\n            )}\n          </div>\n          <div>\n            <button\n              type=\"button\"\n              className=\"btn btn-link\"\n              onBlur={handleChildBlur}\n              onClick={handleSelectAll}\n            >\n              Select All\n            </button>\n            <button\n              type=\"button\"\n              className=\"btn btn-link mr-a\"\n              onBlur={handleChildBlur}\n              onClick={handleClearSelection}\n            >\n              Clear\n            </button>\n          </div>\n        </div>\n      )}\n\n      {table == null ||\n        (error && (\n          <div className=\"h-100 w-100 position-absolute\">\n            <LoadingOverlay\n              isLoaded={table != null}\n              isLoading={table == null && error == null}\n              errorMessage={error?.message ?? null}\n            />\n          </div>\n        ))}\n    </div>\n  );\n}\n\nTableInput.displayName = 'TableInput';\n\nTableInput.defaultProps = {\n  isInvalid: false,\n  className: undefined,\n};\n\nexport default TableInput;\n"],"mappings":"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"}

package/dist/index.js

@@ -0,0 +1,18 @@
+export * from "./HookTestUtils.js";
+export { default as TableInput } from "./TableInput.js";
+export * from "./RefreshTokenBootstrap.js";
+export * from "./RefreshTokenUtils.js";
+export { default as useBroadcastChannel } from "./useBroadcastChannel.js";
+export { default as useBroadcastLoginListener } from "./useBroadcastLoginListener.js";
+export { default as useDebouncedViewportSearch } from "./useDebouncedViewportSearch.js";
+export { default as useInitializeViewportData } from "./useInitializeViewportData.js";
+export { default as useTable } from "./useTable.js";
+export { default as useTableColumn } from "./useTableColumn.js";
+export { default as useTableListener } from "./useTableListener.js";
+export { default as useSelectDistinctTable } from "./useSelectDistinctTable.js";
+export { default as useSetPaddedViewportCallback } from "./useSetPaddedViewportCallback.js";
+export { default as useTableClose } from "./useTableClose.js";
+export { default as useTableSize } from "./useTableSize.js";
+export { default as useTableUtils } from "./useTableUtils.js";
+export { default as useViewportData } from "./useViewportData.js";
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default","TableInput","useBroadcastChannel","useBroadcastLoginListener","useDebouncedViewportSearch","useInitializeViewportData","useTable","useTableColumn","useTableListener","useSelectDistinctTable","useSetPaddedViewportCallback","useTableClose","useTableSize","useTableUtils","useViewportData"],"sources":["../src/index.ts"],"sourcesContent":["export * from './HookTestUtils';\nexport { default as TableInput } from './TableInput';\nexport * from './RefreshTokenBootstrap';\nexport * from './RefreshTokenUtils';\nexport { default as useBroadcastChannel } from './useBroadcastChannel';\nexport { default as useBroadcastLoginListener } from './useBroadcastLoginListener';\nexport { default as useDebouncedViewportSearch } from './useDebouncedViewportSearch';\nexport { default as useInitializeViewportData } from './useInitializeViewportData';\nexport { default as useTable } from './useTable';\nexport { default as useTableColumn } from './useTableColumn';\nexport { default as useTableListener } from './useTableListener';\nexport { default as useSelectDistinctTable } from './useSelectDistinctTable';\nexport { default as useSetPaddedViewportCallback } from './useSetPaddedViewportCallback';\nexport { default as useTableClose } from './useTableClose';\nexport { default as useTableSize } from './useTableSize';\nexport { default as useTableUtils } from './useTableUtils';\nexport { default as useViewportData } from './useViewportData';\nexport type { UseSelectDistinctTableResult } from './useSelectDistinctTable';\nexport type { UseViewportDataResult } from './useViewportData';\n"],"mappings":";SACSA,OAAO,IAAIC,UAAU;AAAA;AAAA;AAAA,SAGrBD,OAAO,IAAIE,mBAAmB;AAAA,SAC9BF,OAAO,IAAIG,yBAAyB;AAAA,SACpCH,OAAO,IAAII,0BAA0B;AAAA,SACrCJ,OAAO,IAAIK,yBAAyB;AAAA,SACpCL,OAAO,IAAIM,QAAQ;AAAA,SACnBN,OAAO,IAAIO,cAAc;AAAA,SACzBP,OAAO,IAAIQ,gBAAgB;AAAA,SAC3BR,OAAO,IAAIS,sBAAsB;AAAA,SACjCT,OAAO,IAAIU,4BAA4B;AAAA,SACvCV,OAAO,IAAIW,aAAa;AAAA,SACxBX,OAAO,IAAIY,YAAY;AAAA,SACvBZ,OAAO,IAAIa,aAAa;AAAA,SACxBb,OAAO,IAAIc,eAAe"}

package/dist/useBroadcastChannel.js

@@ -0,0 +1,33 @@
+import { BROADCAST_CHANNEL_NAME, isMessage } from '@deephaven/jsapi-utils';
+import Log from '@deephaven/log';
+import { EMPTY_FUNCTION } from '@deephaven/utils';
+import { useEffect, useMemo } from 'react';
+var log = Log.module('useBroadcastChannel');
+export function useBroadcastChannel() {
+  var onEvent = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : EMPTY_FUNCTION;
+  var name = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : BROADCAST_CHANNEL_NAME;
+  var channel = useMemo(() => new BroadcastChannel(name), [name]);
+  useEffect(() => () => {
+    channel.close();
+  }, [channel]);
+  useEffect(() => {
+    function handleEvent(event) {
+      var {
+        data
+      } = event;
+      if (!isMessage(data)) {
+        log.debug('Ignoring non-deephaven message', data);
+        return;
+      }
+      log.debug('event received', data);
+      onEvent(event);
+    }
+    channel.addEventListener('message', handleEvent);
+    return () => {
+      channel.removeEventListener('message', handleEvent);
+    };
+  }, [channel, onEvent]);
+  return channel;
+}
+export default useBroadcastChannel;
+//# sourceMappingURL=useBroadcastChannel.js.map

package/dist/useBroadcastChannel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useBroadcastChannel.js","names":["BROADCAST_CHANNEL_NAME","isMessage","Log","EMPTY_FUNCTION","useEffect","useMemo","log","module","useBroadcastChannel","onEvent","name","channel","BroadcastChannel","close","handleEvent","event","data","debug","addEventListener","removeEventListener"],"sources":["../src/useBroadcastChannel.ts"],"sourcesContent":["import {\n  BROADCAST_CHANNEL_NAME,\n  isMessage,\n  Message,\n} from '@deephaven/jsapi-utils';\nimport Log from '@deephaven/log';\nimport { EMPTY_FUNCTION } from '@deephaven/utils';\nimport { useEffect, useMemo } from 'react';\n\nconst log = Log.module('useBroadcastChannel');\n\nexport function useBroadcastChannel(\n  onEvent: (event: MessageEvent<Message<unknown>>) => void = EMPTY_FUNCTION,\n  name = BROADCAST_CHANNEL_NAME\n) {\n  const channel = useMemo(() => new BroadcastChannel(name), [name]);\n  useEffect(\n    () => () => {\n      channel.close();\n    },\n    [channel]\n  );\n\n  useEffect(() => {\n    function handleEvent(event: MessageEvent) {\n      const { data } = event;\n      if (!isMessage(data)) {\n        log.debug('Ignoring non-deephaven message', data);\n        return;\n      }\n      log.debug('event received', data);\n      onEvent(event);\n    }\n    channel.addEventListener('message', handleEvent);\n    return () => {\n      channel.removeEventListener('message', handleEvent);\n    };\n  }, [channel, onEvent]);\n\n  return channel;\n}\n\nexport default useBroadcastChannel;\n"],"mappings":"AAAA,SACEA,sBAAsB,EACtBC,SAAS,QAEJ,wBAAwB;AAC/B,OAAOC,GAAG,MAAM,gBAAgB;AAChC,SAASC,cAAc,QAAQ,kBAAkB;AACjD,SAASC,SAAS,EAAEC,OAAO,QAAQ,OAAO;AAE1C,IAAMC,GAAG,GAAGJ,GAAG,CAACK,MAAM,CAAC,qBAAqB,CAAC;AAE7C,OAAO,SAASC,mBAAmB,GAGjC;EAAA,IAFAC,OAAwD,uEAAGN,cAAc;EAAA,IACzEO,IAAI,uEAAGV,sBAAsB;EAE7B,IAAMW,OAAO,GAAGN,OAAO,CAAC,MAAM,IAAIO,gBAAgB,CAACF,IAAI,CAAC,EAAE,CAACA,IAAI,CAAC,CAAC;EACjEN,SAAS,CACP,MAAM,MAAM;IACVO,OAAO,CAACE,KAAK,EAAE;EACjB,CAAC,EACD,CAACF,OAAO,CAAC,CACV;EAEDP,SAAS,CAAC,MAAM;IACd,SAASU,WAAW,CAACC,KAAmB,EAAE;MACxC,IAAM;QAAEC;MAAK,CAAC,GAAGD,KAAK;MACtB,IAAI,CAACd,SAAS,CAACe,IAAI,CAAC,EAAE;QACpBV,GAAG,CAACW,KAAK,CAAC,gCAAgC,EAAED,IAAI,CAAC;QACjD;MACF;MACAV,GAAG,CAACW,KAAK,CAAC,gBAAgB,EAAED,IAAI,CAAC;MACjCP,OAAO,CAACM,KAAK,CAAC;IAChB;IACAJ,OAAO,CAACO,gBAAgB,CAAC,SAAS,EAAEJ,WAAW,CAAC;IAChD,OAAO,MAAM;MACXH,OAAO,CAACQ,mBAAmB,CAAC,SAAS,EAAEL,WAAW,CAAC;IACrD,CAAC;EACH,CAAC,EAAE,CAACH,OAAO,EAAEF,OAAO,CAAC,CAAC;EAEtB,OAAOE,OAAO;AAChB;AAEA,eAAeH,mBAAmB"}

package/dist/useBroadcastLoginListener.js

@@ -0,0 +1,15 @@
+import { isBroadcastLoginMessage, isBroadcastLogoutMessage } from '@deephaven/jsapi-utils';
+import { useCallback } from 'react';
+import useBroadcastChannel from "./useBroadcastChannel.js";
+export function useBroadcastLoginListener(onLogin, onLogout) {
+  var onMessage = useCallback(event => {
+    if (isBroadcastLoginMessage(event.data)) {
+      onLogin === null || onLogin === void 0 ? void 0 : onLogin(event.data);
+    } else if (isBroadcastLogoutMessage(event.data)) {
+      onLogout === null || onLogout === void 0 ? void 0 : onLogout(event.data);
+    }
+  }, [onLogin, onLogout]);
+  useBroadcastChannel(onMessage);
+}
+export default useBroadcastLoginListener;
+//# sourceMappingURL=useBroadcastLoginListener.js.map

package/dist/useBroadcastLoginListener.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useBroadcastLoginListener.js","names":["isBroadcastLoginMessage","isBroadcastLogoutMessage","useCallback","useBroadcastChannel","useBroadcastLoginListener","onLogin","onLogout","onMessage","event","data"],"sources":["../src/useBroadcastLoginListener.ts"],"sourcesContent":["import {\n  BroadcastLoginMessage,\n  BroadcastLogoutMessage,\n  isBroadcastLoginMessage,\n  isBroadcastLogoutMessage,\n  Message,\n} from '@deephaven/jsapi-utils';\nimport { useCallback } from 'react';\nimport useBroadcastChannel from './useBroadcastChannel';\n\nexport function useBroadcastLoginListener(\n  onLogin?: (message: BroadcastLoginMessage) => void,\n  onLogout?: (message: BroadcastLogoutMessage) => void\n) {\n  const onMessage = useCallback(\n    (event: MessageEvent<Message<unknown>>) => {\n      if (isBroadcastLoginMessage(event.data)) {\n        onLogin?.(event.data);\n      } else if (isBroadcastLogoutMessage(event.data)) {\n        onLogout?.(event.data);\n      }\n    },\n    [onLogin, onLogout]\n  );\n\n  useBroadcastChannel(onMessage);\n}\n\nexport default useBroadcastLoginListener;\n"],"mappings":"AAAA,SAGEA,uBAAuB,EACvBC,wBAAwB,QAEnB,wBAAwB;AAC/B,SAASC,WAAW,QAAQ,OAAO;AAAC,OAC7BC,mBAAmB;AAE1B,OAAO,SAASC,yBAAyB,CACvCC,OAAkD,EAClDC,QAAoD,EACpD;EACA,IAAMC,SAAS,GAAGL,WAAW,CAC1BM,KAAqC,IAAK;IACzC,IAAIR,uBAAuB,CAACQ,KAAK,CAACC,IAAI,CAAC,EAAE;MACvCJ,OAAO,aAAPA,OAAO,uBAAPA,OAAO,CAAGG,KAAK,CAACC,IAAI,CAAC;IACvB,CAAC,MAAM,IAAIR,wBAAwB,CAACO,KAAK,CAACC,IAAI,CAAC,EAAE;MAC/CH,QAAQ,aAARA,QAAQ,uBAARA,QAAQ,CAAGE,KAAK,CAACC,IAAI,CAAC;IACxB;EACF,CAAC,EACD,CAACJ,OAAO,EAAEC,QAAQ,CAAC,CACpB;EAEDH,mBAAmB,CAACI,SAAS,CAAC;AAChC;AAEA,eAAeH,yBAAyB"}

package/dist/useDebouncedViewportSearch.js

@@ -0,0 +1,46 @@
+import debounce from 'lodash.debounce';
+import { TableUtils } from '@deephaven/jsapi-utils';
+import { useApi } from '@deephaven/jsapi-bootstrap';
+import Log from '@deephaven/log';
+import { useEffect, useMemo } from 'react';
+var log = Log.module('useDebouncedViewportSearch');
+export var DEBOUNCE_VIEWPORT_SEARCH_MS = 200;
+
+/**
+ * React hook that returns a debounced search callback for filtering a table
+ * viewport.
+ * @param viewportData Table viewport to filter
+ * @param columnName Column name to filter by
+ * @param debounceMs Millisecond value to debounce
+ * @returns A debounced search function
+ */
+export default function useDebouncedViewportSearch(viewportData, columnName) {
+  var debounceMs = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : DEBOUNCE_VIEWPORT_SEARCH_MS;
+  var dh = useApi();
+  var tableUtils = useMemo(() => new TableUtils(dh), [dh]);
+  var {
+    table,
+    applyFiltersAndRefresh
+  } = viewportData;
+  var debouncedSearch = useMemo(() => debounce(searchText => {
+    log.debug("Applying debounced searchText '".concat(searchText, "'"));
+    if (table == null) {
+      return;
+    }
+    var searchTextTrimmed = searchText.trim();
+    if (searchTextTrimmed === '') {
+      applyFiltersAndRefresh([]);
+      return;
+    }
+    var column = table.findColumn(columnName);
+    var value = tableUtils.makeFilterValue(column.type, searchTextTrimmed);
+    var filter = [column.filter().contains(value)];
+    applyFiltersAndRefresh(filter);
+  }, debounceMs), [applyFiltersAndRefresh, columnName, debounceMs, table, tableUtils]);
+  useEffect(() => () => {
+    log.debug('Cancelling debounced search function');
+    debouncedSearch.cancel();
+  }, [debouncedSearch]);
+  return debouncedSearch;
+}
+//# sourceMappingURL=useDebouncedViewportSearch.js.map

package/dist/useDebouncedViewportSearch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDebouncedViewportSearch.js","names":["debounce","TableUtils","useApi","Log","useEffect","useMemo","log","module","DEBOUNCE_VIEWPORT_SEARCH_MS","useDebouncedViewportSearch","viewportData","columnName","debounceMs","dh","tableUtils","table","applyFiltersAndRefresh","debouncedSearch","searchText","debug","searchTextTrimmed","trim","column","findColumn","value","makeFilterValue","type","filter","contains","cancel"],"sources":["../src/useDebouncedViewportSearch.ts"],"sourcesContent":["import debounce from 'lodash.debounce';\nimport type { Table, TreeTable } from '@deephaven/jsapi-types';\nimport { TableUtils } from '@deephaven/jsapi-utils';\nimport { useApi } from '@deephaven/jsapi-bootstrap';\nimport Log from '@deephaven/log';\nimport { useEffect, useMemo } from 'react';\nimport { UseViewportDataResult } from './useViewportData';\n\nconst log = Log.module('useDebouncedViewportSearch');\n\nexport const DEBOUNCE_VIEWPORT_SEARCH_MS = 200;\n\n/**\n * React hook that returns a debounced search callback for filtering a table\n * viewport.\n * @param viewportData Table viewport to filter\n * @param columnName Column name to filter by\n * @param debounceMs Millisecond value to debounce\n * @returns A debounced search function\n */\nexport default function useDebouncedViewportSearch<\n  I,\n  T extends Table | TreeTable\n>(\n  viewportData: UseViewportDataResult<I, T>,\n  columnName: string,\n  debounceMs = DEBOUNCE_VIEWPORT_SEARCH_MS\n): (searchText: string) => void {\n  const dh = useApi();\n  const tableUtils = useMemo(() => new TableUtils(dh), [dh]);\n  const { table, applyFiltersAndRefresh } = viewportData;\n\n  const debouncedSearch = useMemo(\n    () =>\n      debounce((searchText: string) => {\n        log.debug(`Applying debounced searchText '${searchText}'`);\n\n        if (table == null) {\n          return;\n        }\n\n        const searchTextTrimmed = searchText.trim();\n\n        if (searchTextTrimmed === '') {\n          applyFiltersAndRefresh([]);\n          return;\n        }\n\n        const column = table.findColumn(columnName);\n        const value = tableUtils.makeFilterValue(\n          column.type,\n          searchTextTrimmed\n        );\n        const filter = [column.filter().contains(value)];\n\n        applyFiltersAndRefresh(filter);\n      }, debounceMs),\n    [applyFiltersAndRefresh, columnName, debounceMs, table, tableUtils]\n  );\n\n  useEffect(\n    () => () => {\n      log.debug('Cancelling debounced search function');\n      debouncedSearch.cancel();\n    },\n    [debouncedSearch]\n  );\n\n  return debouncedSearch;\n}\n"],"mappings":"AAAA,OAAOA,QAAQ,MAAM,iBAAiB;AAEtC,SAASC,UAAU,QAAQ,wBAAwB;AACnD,SAASC,MAAM,QAAQ,4BAA4B;AACnD,OAAOC,GAAG,MAAM,gBAAgB;AAChC,SAASC,SAAS,EAAEC,OAAO,QAAQ,OAAO;AAG1C,IAAMC,GAAG,GAAGH,GAAG,CAACI,MAAM,CAAC,4BAA4B,CAAC;AAEpD,OAAO,IAAMC,2BAA2B,GAAG,GAAG;;AAE9C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,0BAA0B,CAIhDC,YAAyC,EACzCC,UAAkB,EAEY;EAAA,IAD9BC,UAAU,uEAAGJ,2BAA2B;EAExC,IAAMK,EAAE,GAAGX,MAAM,EAAE;EACnB,IAAMY,UAAU,GAAGT,OAAO,CAAC,MAAM,IAAIJ,UAAU,CAACY,EAAE,CAAC,EAAE,CAACA,EAAE,CAAC,CAAC;EAC1D,IAAM;IAAEE,KAAK;IAAEC;EAAuB,CAAC,GAAGN,YAAY;EAEtD,IAAMO,eAAe,GAAGZ,OAAO,CAC7B,MACEL,QAAQ,CAAEkB,UAAkB,IAAK;IAC/BZ,GAAG,CAACa,KAAK,0CAAmCD,UAAU,OAAI;IAE1D,IAAIH,KAAK,IAAI,IAAI,EAAE;MACjB;IACF;IAEA,IAAMK,iBAAiB,GAAGF,UAAU,CAACG,IAAI,EAAE;IAE3C,IAAID,iBAAiB,KAAK,EAAE,EAAE;MAC5BJ,sBAAsB,CAAC,EAAE,CAAC;MAC1B;IACF;IAEA,IAAMM,MAAM,GAAGP,KAAK,CAACQ,UAAU,CAACZ,UAAU,CAAC;IAC3C,IAAMa,KAAK,GAAGV,UAAU,CAACW,eAAe,CACtCH,MAAM,CAACI,IAAI,EACXN,iBAAiB,CAClB;IACD,IAAMO,MAAM,GAAG,CAACL,MAAM,CAACK,MAAM,EAAE,CAACC,QAAQ,CAACJ,KAAK,CAAC,CAAC;IAEhDR,sBAAsB,CAACW,MAAM,CAAC;EAChC,CAAC,EAAEf,UAAU,CAAC,EAChB,CAACI,sBAAsB,EAAEL,UAAU,EAAEC,UAAU,EAAEG,KAAK,EAAED,UAAU,CAAC,CACpE;EAEDV,SAAS,CACP,MAAM,MAAM;IACVE,GAAG,CAACa,KAAK,CAAC,sCAAsC,CAAC;IACjDF,eAAe,CAACY,MAAM,EAAE;EAC1B,CAAC,EACD,CAACZ,eAAe,CAAC,CAClB;EAED,OAAOA,eAAe;AACxB"}

package/dist/useInitializeViewportData.js

@@ -0,0 +1,62 @@
+import { useEffect } from 'react';
+import { useListData } from '@react-stately/data';
+import { generateEmptyKeyedItems } from '@deephaven/jsapi-utils';
+import { usePrevious } from '@deephaven/react-hooks';
+import useTableSize from "./useTableSize.js";
+/**
+ * Initializes a ListData instance that can be used for windowed views of a
+ * Table. The list must always contain a KeyedItem for every record in the table,
+ * so it is pre-populated with empty items that can be updated with real data as
+ * the window changes.
+ *
+ * IMPORTANT: this will create an empty KeyedItem object for every row in the
+ * source table. This is intended for "human" sized tables such as those used in
+ * admin panels. This is not suitable for "machine" scale with millions+ rows.
+ * @param table The table that will be used to determine the list size.
+ * @returns a React Stately ListData object. Note that this object is recreated
+ * by React Stately on every render.
+ */
+export default function useInitializeViewportData(table) {
+  var viewportData = useListData({});
+  var prevTable = usePrevious(table);
+
+  // If the table changes size, we need to re-initialize it.
+  var size = Math.max(0, useTableSize(table));
+
+  // We only want this to fire 1x once the table exists. Note that `useListData`
+  // has no way to respond to a reference change of the `table` instance so we
+  // have to manually delete any previous keyed items from the list.
+  useEffect(() => {
+    var currentSize = viewportData.items.length;
+
+    // If our table instance has changed, we want to clear all items from state
+    if (table !== prevTable && currentSize) {
+      viewportData.remove(...viewportData.items.map(_ref => {
+        var {
+          key
+        } = _ref;
+        return key;
+      }));
+      currentSize = 0;
+    }
+    if (!table) {
+      return;
+    }
+    if (size > currentSize) {
+      viewportData.insert(currentSize, ...generateEmptyKeyedItems(currentSize, size - 1));
+    } else if (size < currentSize) {
+      var keys = viewportData.items.slice(size).map(_ref2 => {
+        var {
+          key
+        } = _ref2;
+        return key;
+      });
+      viewportData.remove(...keys);
+    }
+
+    // Intentionally excluding viewportData since it changes on every render.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [size, table]);
+  return viewportData;
+}
+//# sourceMappingURL=useInitializeViewportData.js.map

package/dist/useInitializeViewportData.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useInitializeViewportData.js","names":["useEffect","useListData","generateEmptyKeyedItems","usePrevious","useTableSize","useInitializeViewportData","table","viewportData","prevTable","size","Math","max","currentSize","items","length","remove","map","key","insert","keys","slice"],"sources":["../src/useInitializeViewportData.ts"],"sourcesContent":["import { useEffect } from 'react';\nimport { ListData, useListData } from '@react-stately/data';\nimport type { Table, TreeTable } from '@deephaven/jsapi-types';\nimport { KeyedItem, generateEmptyKeyedItems } from '@deephaven/jsapi-utils';\nimport { usePrevious } from '@deephaven/react-hooks';\nimport useTableSize from './useTableSize';\n\n/**\n * Initializes a ListData instance that can be used for windowed views of a\n * Table. The list must always contain a KeyedItem for every record in the table,\n * so it is pre-populated with empty items that can be updated with real data as\n * the window changes.\n *\n * IMPORTANT: this will create an empty KeyedItem object for every row in the\n * source table. This is intended for \"human\" sized tables such as those used in\n * admin panels. This is not suitable for \"machine\" scale with millions+ rows.\n * @param table The table that will be used to determine the list size.\n * @returns a React Stately ListData object. Note that this object is recreated\n * by React Stately on every render.\n */\nexport default function useInitializeViewportData<T>(\n  table: Table | TreeTable | null\n): ListData<KeyedItem<T>> {\n  const viewportData = useListData<KeyedItem<T>>({});\n\n  const prevTable = usePrevious(table);\n\n  // If the table changes size, we need to re-initialize it.\n  const size = Math.max(0, useTableSize(table));\n\n  // We only want this to fire 1x once the table exists. Note that `useListData`\n  // has no way to respond to a reference change of the `table` instance so we\n  // have to manually delete any previous keyed items from the list.\n  useEffect(() => {\n    let currentSize = viewportData.items.length;\n\n    // If our table instance has changed, we want to clear all items from state\n    if (table !== prevTable && currentSize) {\n      viewportData.remove(...viewportData.items.map(({ key }) => key));\n      currentSize = 0;\n    }\n\n    if (!table) {\n      return;\n    }\n\n    if (size > currentSize) {\n      viewportData.insert(\n        currentSize,\n        ...generateEmptyKeyedItems<T>(currentSize, size - 1)\n      );\n    } else if (size < currentSize) {\n      const keys = viewportData.items.slice(size).map(({ key }) => key);\n      viewportData.remove(...keys);\n    }\n\n    // Intentionally excluding viewportData since it changes on every render.\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [size, table]);\n\n  return viewportData;\n}\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,OAAO;AACjC,SAAmBC,WAAW,QAAQ,qBAAqB;AAE3D,SAAoBC,uBAAuB,QAAQ,wBAAwB;AAC3E,SAASC,WAAW,QAAQ,wBAAwB;AAAC,OAC9CC,YAAY;AAEnB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,yBAAyB,CAC/CC,KAA+B,EACP;EACxB,IAAMC,YAAY,GAAGN,WAAW,CAAe,CAAC,CAAC,CAAC;EAElD,IAAMO,SAAS,GAAGL,WAAW,CAACG,KAAK,CAAC;;EAEpC;EACA,IAAMG,IAAI,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEP,YAAY,CAACE,KAAK,CAAC,CAAC;;EAE7C;EACA;EACA;EACAN,SAAS,CAAC,MAAM;IACd,IAAIY,WAAW,GAAGL,YAAY,CAACM,KAAK,CAACC,MAAM;;IAE3C;IACA,IAAIR,KAAK,KAAKE,SAAS,IAAII,WAAW,EAAE;MACtCL,YAAY,CAACQ,MAAM,CAAC,GAAGR,YAAY,CAACM,KAAK,CAACG,GAAG,CAAC;QAAA,IAAC;UAAEC;QAAI,CAAC;QAAA,OAAKA,GAAG;MAAA,EAAC,CAAC;MAChEL,WAAW,GAAG,CAAC;IACjB;IAEA,IAAI,CAACN,KAAK,EAAE;MACV;IACF;IAEA,IAAIG,IAAI,GAAGG,WAAW,EAAE;MACtBL,YAAY,CAACW,MAAM,CACjBN,WAAW,EACX,GAAGV,uBAAuB,CAAIU,WAAW,EAAEH,IAAI,GAAG,CAAC,CAAC,CACrD;IACH,CAAC,MAAM,IAAIA,IAAI,GAAGG,WAAW,EAAE;MAC7B,IAAMO,IAAI,GAAGZ,YAAY,CAACM,KAAK,CAACO,KAAK,CAACX,IAAI,CAAC,CAACO,GAAG,CAAC;QAAA,IAAC;UAAEC;QAAI,CAAC;QAAA,OAAKA,GAAG;MAAA,EAAC;MACjEV,YAAY,CAACQ,MAAM,CAAC,GAAGI,IAAI,CAAC;IAC9B;;IAEA;IACA;EACF,CAAC,EAAE,CAACV,IAAI,EAAEH,KAAK,CAAC,CAAC;EAEjB,OAAOC,YAAY;AACrB"}

package/dist/useSelectDistinctTable.js

@@ -0,0 +1,43 @@
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+import { useCallback, useEffect } from 'react';
+import { usePromiseFactory } from '@deephaven/react-hooks';
+
+/**
+ * Return type of `useSelectDistinctTable` hook.
+ */
+
+/**
+ * Creates and subscribes to a `selectDistinct` derived table and unsubscribes
+ * on unmount.
+ * @param table The table to call `selectDistinct` on.
+ * @param columnNames The list of column names to pass to `selectDistinct`.
+ */
+export default function useSelectDistinctTable(table) {
+  for (var _len = arguments.length, columnNames = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
+    columnNames[_key - 1] = arguments[_key];
+  }
+  var selectDistinct = useCallback( /*#__PURE__*/_asyncToGenerator(function* () {
+    var _table$selectDistinct;
+    return (_table$selectDistinct = table === null || table === void 0 ? void 0 : table.selectDistinct(table.findColumns(columnNames))) !== null && _table$selectDistinct !== void 0 ? _table$selectDistinct : null;
+  }),
+  // Disabling the exhaustive checks due to the spreading of `columnNames`
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  [table, ...columnNames]);
+  var {
+    data: distinctTable,
+    error,
+    isError,
+    isLoading
+  } = usePromiseFactory(selectDistinct, []);
+  useEffect(() => () => {
+    distinctTable === null || distinctTable === void 0 ? void 0 : distinctTable.close();
+  }, [distinctTable]);
+  return {
+    distinctTable,
+    error,
+    isError,
+    isLoading
+  };
+}
+//# sourceMappingURL=useSelectDistinctTable.js.map

package/dist/useSelectDistinctTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSelectDistinctTable.js","names":["useCallback","useEffect","usePromiseFactory","useSelectDistinctTable","table","columnNames","selectDistinct","findColumns","data","distinctTable","error","isError","isLoading","close"],"sources":["../src/useSelectDistinctTable.ts"],"sourcesContent":["import { useCallback, useEffect } from 'react';\nimport type { Table, TreeTable } from '@deephaven/jsapi-types';\nimport { usePromiseFactory } from '@deephaven/react-hooks';\n\n/**\n * Return type of `useSelectDistinctTable` hook.\n */\nexport interface UseSelectDistinctTableResult {\n  distinctTable: Table | null;\n  error: string | Error | null;\n  isError: boolean;\n  isLoading: boolean;\n}\n\n/**\n * Creates and subscribes to a `selectDistinct` derived table and unsubscribes\n * on unmount.\n * @param table The table to call `selectDistinct` on.\n * @param columnNames The list of column names to pass to `selectDistinct`.\n */\nexport default function useSelectDistinctTable(\n  table: Table | TreeTable | null,\n  ...columnNames: string[]\n): UseSelectDistinctTableResult {\n  const selectDistinct = useCallback(\n    async () => table?.selectDistinct(table.findColumns(columnNames)) ?? null,\n    // Disabling the exhaustive checks due to the spreading of `columnNames`\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n    [table, ...columnNames]\n  );\n\n  const { data: distinctTable, error, isError, isLoading } = usePromiseFactory(\n    selectDistinct,\n    []\n  );\n\n  useEffect(\n    () => () => {\n      distinctTable?.close();\n    },\n    [distinctTable]\n  );\n\n  return { distinctTable, error, isError, isLoading };\n}\n"],"mappings":";;AAAA,SAASA,WAAW,EAAEC,SAAS,QAAQ,OAAO;AAE9C,SAASC,iBAAiB,QAAQ,wBAAwB;;AAE1D;AACA;AACA;;AAQA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,sBAAsB,CAC5CC,KAA+B,EAED;EAAA,kCAD3BC,WAAW;IAAXA,WAAW;EAAA;EAEd,IAAMC,cAAc,GAAGN,WAAW,iCAChC;IAAA;IAAA,gCAAYI,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEE,cAAc,CAACF,KAAK,CAACG,WAAW,CAACF,WAAW,CAAC,CAAC,yEAAI,IAAI;EAAA;EACzE;EACA;EACA,CAACD,KAAK,EAAE,GAAGC,WAAW,CAAC,CACxB;EAED,IAAM;IAAEG,IAAI,EAAEC,aAAa;IAAEC,KAAK;IAAEC,OAAO;IAAEC;EAAU,CAAC,GAAGV,iBAAiB,CAC1EI,cAAc,EACd,EAAE,CACH;EAEDL,SAAS,CACP,MAAM,MAAM;IACVQ,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAEI,KAAK,EAAE;EACxB,CAAC,EACD,CAACJ,aAAa,CAAC,CAChB;EAED,OAAO;IAAEA,aAAa;IAAEC,KAAK;IAAEC,OAAO;IAAEC;EAAU,CAAC;AACrD"}

package/dist/useSetPaddedViewportCallback.js

@@ -0,0 +1,20 @@
+import { useCallback } from 'react';
+import { getSize, padFirstAndLastRow } from '@deephaven/jsapi-utils';
+
+/**
+ * Creates a callback function that will set a Table viewport. The callback has
+ * a closure over the Table, a desired viewport size, and additional padding.
+ * These will be combined with a first row index passed to the callback to
+ * calculate the final viewport.
+ * @param table Table to call `setViewport` on.
+ * @param viewportSize The desired viewport size.
+ * @param viewportPadding Padding to add before and after the viewport.
+ * @returns A callback function for setting the viewport.
+ */
+export default function useSetPaddedViewportCallback(table, viewportSize, viewportPadding) {
+  return useCallback(function setPaddedViewport(firstRow) {
+    var [first, last] = padFirstAndLastRow(firstRow, viewportSize, viewportPadding, getSize(table));
+    table === null || table === void 0 ? void 0 : table.setViewport(first, last);
+  }, [table, viewportPadding, viewportSize]);
+}
+//# sourceMappingURL=useSetPaddedViewportCallback.js.map

package/dist/useSetPaddedViewportCallback.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSetPaddedViewportCallback.js","names":["useCallback","getSize","padFirstAndLastRow","useSetPaddedViewportCallback","table","viewportSize","viewportPadding","setPaddedViewport","firstRow","first","last","setViewport"],"sources":["../src/useSetPaddedViewportCallback.ts"],"sourcesContent":["import { useCallback } from 'react';\nimport type { Table, TreeTable } from '@deephaven/jsapi-types';\nimport { getSize, padFirstAndLastRow } from '@deephaven/jsapi-utils';\n\n/**\n * Creates a callback function that will set a Table viewport. The callback has\n * a closure over the Table, a desired viewport size, and additional padding.\n * These will be combined with a first row index passed to the callback to\n * calculate the final viewport.\n * @param table Table to call `setViewport` on.\n * @param viewportSize The desired viewport size.\n * @param viewportPadding Padding to add before and after the viewport.\n * @returns A callback function for setting the viewport.\n */\nexport default function useSetPaddedViewportCallback(\n  table: Table | TreeTable | null,\n  viewportSize: number,\n  viewportPadding: number\n) {\n  return useCallback(\n    function setPaddedViewport(firstRow: number) {\n      const [first, last] = padFirstAndLastRow(\n        firstRow,\n        viewportSize,\n        viewportPadding,\n        getSize(table)\n      );\n\n      table?.setViewport(first, last);\n    },\n    [table, viewportPadding, viewportSize]\n  );\n}\n"],"mappings":"AAAA,SAASA,WAAW,QAAQ,OAAO;AAEnC,SAASC,OAAO,EAAEC,kBAAkB,QAAQ,wBAAwB;;AAEpE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,4BAA4B,CAClDC,KAA+B,EAC/BC,YAAoB,EACpBC,eAAuB,EACvB;EACA,OAAON,WAAW,CAChB,SAASO,iBAAiB,CAACC,QAAgB,EAAE;IAC3C,IAAM,CAACC,KAAK,EAAEC,IAAI,CAAC,GAAGR,kBAAkB,CACtCM,QAAQ,EACRH,YAAY,EACZC,eAAe,EACfL,OAAO,CAACG,KAAK,CAAC,CACf;IAEDA,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEO,WAAW,CAACF,KAAK,EAAEC,IAAI,CAAC;EACjC,CAAC,EACD,CAACN,KAAK,EAAEE,eAAe,EAAED,YAAY,CAAC,CACvC;AACH"}

package/dist/useTable.js

@@ -0,0 +1,63 @@
+import { useCallback, useEffect, useState } from 'react';
+import { useApi } from '@deephaven/jsapi-bootstrap';
+import Log from '@deephaven/log';
+import useTableListener from "./useTableListener.js";
+import ColumnNameError from "./ColumnNameError.js";
+import TableDisconnectError from "./TableDisconnectError.js";
+var log = Log.module('useTable');
+var useTable = (table, firstRow, lastRow, columnNames) => {
+  var dh = useApi();
+  var [columns, setColumns] = useState(undefined);
+  var [data, setData] = useState([]);
+  var [columnError, setColumnError] = useState(null);
+  var [tableError, setTableError] = useState(null);
+  useEffect(() => {
+    if (columnNames === undefined) {
+      setColumns(table === null || table === void 0 ? void 0 : table.columns);
+      setColumnError(null);
+      return;
+    }
+    try {
+      setColumns(table === null || table === void 0 ? void 0 : table.findColumns(columnNames));
+      setColumnError(null);
+    } catch (e) {
+      log.error("Column not found", e, columnNames);
+      setColumnError(new ColumnNameError('Invalid columnNames argument'));
+    }
+  }, [table, columnNames]);
+  useEffect(() => {
+    if (!columns || !table) {
+      log.debug2('Table or column not initialized, skip viewport update.');
+      return;
+    }
+    log.debug2('Setting viewport', firstRow, lastRow);
+    table.setViewport(firstRow, lastRow, columns);
+  }, [columns, table, firstRow, lastRow]);
+  var handleUpdate = useCallback(_ref => {
+    var {
+      detail
+    } = _ref;
+    if (!columns) {
+      log.error('Columns not initialized.');
+      return;
+    }
+    var viewportData = columns.map(column => detail.rows.map(r => r.get(column)));
+    setData(viewportData);
+  }, [columns]);
+  var handleDisconnect = useCallback(() => {
+    setTableError(new TableDisconnectError('Table disconnected'));
+  }, []);
+  var handleReconnect = useCallback(() => {
+    setTableError(null);
+  }, []);
+  useTableListener(table, dh.Table.EVENT_UPDATED, handleUpdate);
+  useTableListener(table, dh.Table.EVENT_DISCONNECT, handleDisconnect);
+  useTableListener(table, dh.Table.EVENT_RECONNECT, handleReconnect);
+  return {
+    columns,
+    data,
+    error: tableError !== null && tableError !== void 0 ? tableError : columnError
+  };
+};
+export default useTable;
+//# sourceMappingURL=useTable.js.map

package/dist/useTable.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTable.js","names":["useCallback","useEffect","useState","useApi","Log","useTableListener","ColumnNameError","TableDisconnectError","log","module","useTable","table","firstRow","lastRow","columnNames","dh","columns","setColumns","undefined","data","setData","columnError","setColumnError","tableError","setTableError","findColumns","e","error","debug2","setViewport","handleUpdate","detail","viewportData","map","column","rows","r","get","handleDisconnect","handleReconnect","Table","EVENT_UPDATED","EVENT_DISCONNECT","EVENT_RECONNECT"],"sources":["../src/useTable.ts"],"sourcesContent":["import { useCallback, useEffect, useState } from 'react';\nimport { useApi } from '@deephaven/jsapi-bootstrap';\nimport type { Column, Row, Table } from '@deephaven/jsapi-types';\nimport Log from '@deephaven/log';\nimport useTableListener from './useTableListener';\nimport ColumnNameError from './ColumnNameError';\nimport TableDisconnectError from './TableDisconnectError';\n\nconst log = Log.module('useTable');\n\nconst useTable = (\n  table: Table | undefined,\n  firstRow: number,\n  lastRow: number,\n  columnNames?: string[]\n): {\n  columns: Column[] | undefined;\n  data: unknown[][];\n  error: Error | null;\n} => {\n  const dh = useApi();\n  const [columns, setColumns] = useState<Column[] | undefined>(undefined);\n  const [data, setData] = useState<unknown[][]>([]);\n  const [columnError, setColumnError] = useState<Error | null>(null);\n  const [tableError, setTableError] = useState<Error | null>(null);\n\n  useEffect(() => {\n    if (columnNames === undefined) {\n      setColumns(table?.columns);\n      setColumnError(null);\n      return;\n    }\n    try {\n      setColumns(table?.findColumns(columnNames));\n      setColumnError(null);\n    } catch (e) {\n      log.error(`Column not found`, e, columnNames);\n      setColumnError(new ColumnNameError('Invalid columnNames argument'));\n    }\n  }, [table, columnNames]);\n\n  useEffect(() => {\n    if (!columns || !table) {\n      log.debug2('Table or column not initialized, skip viewport update.');\n      return;\n    }\n    log.debug2('Setting viewport', firstRow, lastRow);\n    table.setViewport(firstRow, lastRow, columns);\n  }, [columns, table, firstRow, lastRow]);\n\n  const handleUpdate = useCallback(\n    ({ detail }) => {\n      if (!columns) {\n        log.error('Columns not initialized.');\n        return;\n      }\n      const viewportData = columns.map(column =>\n        (detail.rows as Row[]).map(r => r.get(column))\n      );\n      setData(viewportData);\n    },\n    [columns]\n  );\n\n  const handleDisconnect = useCallback(() => {\n    setTableError(new TableDisconnectError('Table disconnected'));\n  }, []);\n\n  const handleReconnect = useCallback(() => {\n    setTableError(null);\n  }, []);\n\n  useTableListener(table, dh.Table.EVENT_UPDATED, handleUpdate);\n  useTableListener(table, dh.Table.EVENT_DISCONNECT, handleDisconnect);\n  useTableListener(table, dh.Table.EVENT_RECONNECT, handleReconnect);\n\n  return { columns, data, error: tableError ?? columnError };\n};\n\nexport default useTable;\n"],"mappings":"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"}

package/dist/useTableClose.js

@@ -0,0 +1,19 @@
+import { useEffect } from 'react';
+import { isClosed } from '@deephaven/jsapi-utils';
+
+/**
+ * React hook that closes a given table when the reference changes or when the
+ * component unmounts.
+ * @param table
+ */
+export default function useTableClose(table) {
+  useEffect(() => () => {
+    if (table == null) {
+      return;
+    }
+    if (!isClosed(table)) {
+      table.close();
+    }
+  }, [table]);
+}
+//# sourceMappingURL=useTableClose.js.map

package/dist/useTableClose.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableClose.js","names":["useEffect","isClosed","useTableClose","table","close"],"sources":["../src/useTableClose.ts"],"sourcesContent":["import { useEffect } from 'react';\nimport type { Table, TreeTable } from '@deephaven/jsapi-types';\nimport { isClosed } from '@deephaven/jsapi-utils';\n\n/**\n * React hook that closes a given table when the reference changes or when the\n * component unmounts.\n * @param table\n */\nexport default function useTableClose(\n  table: Table | TreeTable | null | undefined\n): void {\n  useEffect(\n    () => () => {\n      if (table == null) {\n        return;\n      }\n\n      if (!isClosed(table)) {\n        table.close();\n      }\n    },\n    [table]\n  );\n}\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,OAAO;AAEjC,SAASC,QAAQ,QAAQ,wBAAwB;;AAEjD;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,aAAa,CACnCC,KAA2C,EACrC;EACNH,SAAS,CACP,MAAM,MAAM;IACV,IAAIG,KAAK,IAAI,IAAI,EAAE;MACjB;IACF;IAEA,IAAI,CAACF,QAAQ,CAACE,KAAK,CAAC,EAAE;MACpBA,KAAK,CAACC,KAAK,EAAE;IACf;EACF,CAAC,EACD,CAACD,KAAK,CAAC,CACR;AACH"}

package/dist/useTableColumn.js

@@ -0,0 +1,25 @@
+import { useMemo } from 'react';
+import useTable from "./useTable.js";
+/**
+ * Subscribe to viewport updates on a single table column
+ * @param table Table to get the data from
+ * @param firstRow First viewport row
+ * @param lastRow Last viewport row
+ * @param columnName Column to get the data from
+ * @returns Column object, data array for the column, error, setViewport method
+ */
+var useTableColumn = (table, firstRow, lastRow, columnName) => {
+  var columnNames = useMemo(() => [columnName], [columnName]);
+  var {
+    columns = [],
+    data = [],
+    error
+  } = useTable(table, firstRow, lastRow, columnNames);
+  return {
+    column: columns[0],
+    data: data[0],
+    error
+  };
+};
+export default useTableColumn;
+//# sourceMappingURL=useTableColumn.js.map

package/dist/useTableColumn.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableColumn.js","names":["useMemo","useTable","useTableColumn","table","firstRow","lastRow","columnName","columnNames","columns","data","error","column"],"sources":["../src/useTableColumn.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport type { Column, Table } from '@deephaven/jsapi-types';\nimport useTable from './useTable';\n\n/**\n * Subscribe to viewport updates on a single table column\n * @param table Table to get the data from\n * @param firstRow First viewport row\n * @param lastRow Last viewport row\n * @param columnName Column to get the data from\n * @returns Column object, data array for the column, error, setViewport method\n */\nconst useTableColumn = (\n  table: Table | undefined,\n  firstRow: number,\n  lastRow: number,\n  columnName: string\n): {\n  column: Column | undefined;\n  data: unknown[];\n  error: Error | null;\n} => {\n  const columnNames = useMemo(() => [columnName], [columnName]);\n  const { columns = [], data = [], error } = useTable(\n    table,\n    firstRow,\n    lastRow,\n    columnNames\n  );\n  return {\n    column: columns[0],\n    data: data[0],\n    error,\n  };\n};\n\nexport default useTableColumn;\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,OAAO;AAAC,OAEzBC,QAAQ;AAEf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAMC,cAAc,GAAG,CACrBC,KAAwB,EACxBC,QAAgB,EAChBC,OAAe,EACfC,UAAkB,KAKf;EACH,IAAMC,WAAW,GAAGP,OAAO,CAAC,MAAM,CAACM,UAAU,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;EAC7D,IAAM;IAAEE,OAAO,GAAG,EAAE;IAAEC,IAAI,GAAG,EAAE;IAAEC;EAAM,CAAC,GAAGT,QAAQ,CACjDE,KAAK,EACLC,QAAQ,EACRC,OAAO,EACPE,WAAW,CACZ;EACD,OAAO;IACLI,MAAM,EAAEH,OAAO,CAAC,CAAC,CAAC;IAClBC,IAAI,EAAEA,IAAI,CAAC,CAAC,CAAC;IACbC;EACF,CAAC;AACH,CAAC;AAED,eAAeR,cAAc"}

package/dist/useTableListener.js

@@ -0,0 +1,13 @@
+import { useEffect } from 'react';
+import Log from '@deephaven/log';
+var log = Log.module('useTableListener');
+export var useTableListener = (eventEmitter, eventName, callback) => useEffect(function initEventEmitter() {
+  if (eventEmitter == null) {
+    log.debug2('Emitter undefined, skipping addEventListener', eventName);
+    return;
+  }
+  log.debug2('Adding listener', eventName);
+  return eventEmitter.addEventListener(eventName, callback);
+}, [eventEmitter, eventName, callback]);
+export default useTableListener;
+//# sourceMappingURL=useTableListener.js.map

package/dist/useTableListener.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableListener.js","names":["useEffect","Log","log","module","useTableListener","eventEmitter","eventName","callback","initEventEmitter","debug2","addEventListener"],"sources":["../src/useTableListener.ts"],"sourcesContent":["import { useEffect } from 'react';\nimport type { Evented, EventListener } from '@deephaven/jsapi-types';\nimport Log from '@deephaven/log';\n\nconst log = Log.module('useTableListener');\n\nexport const useTableListener = (\n  eventEmitter: Evented | undefined | null,\n  eventName: string,\n  callback: EventListener\n): void =>\n  useEffect(\n    function initEventEmitter() {\n      if (eventEmitter == null) {\n        log.debug2('Emitter undefined, skipping addEventListener', eventName);\n        return;\n      }\n      log.debug2('Adding listener', eventName);\n      return eventEmitter.addEventListener(eventName, callback);\n    },\n    [eventEmitter, eventName, callback]\n  );\n\nexport default useTableListener;\n"],"mappings":"AAAA,SAASA,SAAS,QAAQ,OAAO;AAEjC,OAAOC,GAAG,MAAM,gBAAgB;AAEhC,IAAMC,GAAG,GAAGD,GAAG,CAACE,MAAM,CAAC,kBAAkB,CAAC;AAE1C,OAAO,IAAMC,gBAAgB,GAAG,CAC9BC,YAAwC,EACxCC,SAAiB,EACjBC,QAAuB,KAEvBP,SAAS,CACP,SAASQ,gBAAgB,GAAG;EAC1B,IAAIH,YAAY,IAAI,IAAI,EAAE;IACxBH,GAAG,CAACO,MAAM,CAAC,8CAA8C,EAAEH,SAAS,CAAC;IACrE;EACF;EACAJ,GAAG,CAACO,MAAM,CAAC,iBAAiB,EAAEH,SAAS,CAAC;EACxC,OAAOD,YAAY,CAACK,gBAAgB,CAACJ,SAAS,EAAEC,QAAQ,CAAC;AAC3D,CAAC,EACD,CAACF,YAAY,EAAEC,SAAS,EAAEC,QAAQ,CAAC,CACpC;AAEH,eAAeH,gBAAgB"}

package/dist/useTableSize.js

@@ -0,0 +1,20 @@
+import { useState } from 'react';
+import { useApi } from '@deephaven/jsapi-bootstrap';
+import { getSize } from '@deephaven/jsapi-utils';
+import useTableListener from "./useTableListener.js";
+/**
+ * React hook that returns the size of a given table or zero if table is null or
+ * undefined. The hook subscribes to the dh.Table.EVENT_SIZECHANGED event and
+ * triggers a re-render if any events are received to ensure we have the current
+ * size.
+ * @param table The table to check the size on.
+ */
+export default function useTableSize(table) {
+  var [, forceRerender] = useState(0);
+  var dh = useApi();
+  useTableListener(table, dh.Table.EVENT_SIZECHANGED, () => {
+    forceRerender(i => i + 1);
+  });
+  return getSize(table);
+}
+//# sourceMappingURL=useTableSize.js.map

package/dist/useTableSize.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableSize.js","names":["useState","useApi","getSize","useTableListener","useTableSize","table","forceRerender","dh","Table","EVENT_SIZECHANGED","i"],"sources":["../src/useTableSize.ts"],"sourcesContent":["import { useState } from 'react';\nimport { useApi } from '@deephaven/jsapi-bootstrap';\nimport type { Table, TreeTable } from '@deephaven/jsapi-types';\nimport { getSize } from '@deephaven/jsapi-utils';\nimport useTableListener from './useTableListener';\n\n/**\n * React hook that returns the size of a given table or zero if table is null or\n * undefined. The hook subscribes to the dh.Table.EVENT_SIZECHANGED event and\n * triggers a re-render if any events are received to ensure we have the current\n * size.\n * @param table The table to check the size on.\n */\nexport default function useTableSize(\n  table: Table | TreeTable | null | undefined\n): number {\n  const [, forceRerender] = useState(0);\n\n  const dh = useApi();\n\n  useTableListener(table, dh.Table.EVENT_SIZECHANGED, () => {\n    forceRerender(i => i + 1);\n  });\n\n  return getSize(table);\n}\n"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,OAAO;AAChC,SAASC,MAAM,QAAQ,4BAA4B;AAEnD,SAASC,OAAO,QAAQ,wBAAwB;AAAC,OAC1CC,gBAAgB;AAEvB;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,YAAY,CAClCC,KAA2C,EACnC;EACR,IAAM,GAAGC,aAAa,CAAC,GAAGN,QAAQ,CAAC,CAAC,CAAC;EAErC,IAAMO,EAAE,GAAGN,MAAM,EAAE;EAEnBE,gBAAgB,CAACE,KAAK,EAAEE,EAAE,CAACC,KAAK,CAACC,iBAAiB,EAAE,MAAM;IACxDH,aAAa,CAACI,CAAC,IAAIA,CAAC,GAAG,CAAC,CAAC;EAC3B,CAAC,CAAC;EAEF,OAAOR,OAAO,CAACG,KAAK,CAAC;AACvB"}

package/dist/useTableUtils.js

@@ -0,0 +1,12 @@
+import { useMemo } from 'react';
+import { useApi } from '@deephaven/jsapi-bootstrap';
+import { TableUtils } from '@deephaven/jsapi-utils';
+
+/**
+ * Get a `TableUtils` instance using `dh` api from the current context.
+ */
+export default function useTableUtils() {
+  var dh = useApi();
+  return useMemo(() => new TableUtils(dh), [dh]);
+}
+//# sourceMappingURL=useTableUtils.js.map

package/dist/useTableUtils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableUtils.js","names":["useMemo","useApi","TableUtils","useTableUtils","dh"],"sources":["../src/useTableUtils.ts"],"sourcesContent":["import { useMemo } from 'react';\nimport { useApi } from '@deephaven/jsapi-bootstrap';\nimport { TableUtils } from '@deephaven/jsapi-utils';\n\n/**\n * Get a `TableUtils` instance using `dh` api from the current context.\n */\nexport default function useTableUtils(): TableUtils {\n  const dh = useApi();\n  return useMemo(() => new TableUtils(dh), [dh]);\n}\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,OAAO;AAC/B,SAASC,MAAM,QAAQ,4BAA4B;AACnD,SAASC,UAAU,QAAQ,wBAAwB;;AAEnD;AACA;AACA;AACA,eAAe,SAASC,aAAa,GAAe;EAClD,IAAMC,EAAE,GAAGH,MAAM,EAAE;EACnB,OAAOD,OAAO,CAAC,MAAM,IAAIE,UAAU,CAACE,EAAE,CAAC,EAAE,CAACA,EAAE,CAAC,CAAC;AAChD"}

package/dist/useViewportData.js

@@ -0,0 +1,55 @@
+import { useCallback, useEffect } from 'react';
+import { createOnTableUpdatedHandler, defaultRowDeserializer, isClosed } from '@deephaven/jsapi-utils';
+import { useApi } from '@deephaven/jsapi-bootstrap';
+import useInitializeViewportData from "./useInitializeViewportData.js";
+import useSetPaddedViewportCallback from "./useSetPaddedViewportCallback.js";
+import useTableListener from "./useTableListener.js";
+import useTableSize from "./useTableSize.js";
+/**
+ * Sets up state management for windowed Table viewports. Returns a ListData
+ * instance for managing items associated with the Table + a `setViewport`
+ * callback for changing the current viewport.
+ *
+ * IMPORTANT: this will create an empty KeyedItem object for every row in the
+ * source table. This is intended for "human" sized tables such as those used in
+ * admin panels. This is not suitable for "machine" scale with millions+ rows.
+ * @param table
+ * @param viewportSize
+ * @param viewportPadding
+ * @returns An object for managing Table viewport state. Note that the returned
+ * object changes on every render due to the `viewportData` not being memoized.
+ * This is due to the underlying React Stately `useListData` implementation that
+ * also changes its returned object on every render.
+ */
+export default function useViewportData(_ref) {
+  var {
+    table,
+    viewportSize = 10,
+    viewportPadding = 50,
+    deserializeRow = defaultRowDeserializer
+  } = _ref;
+  var viewportData = useInitializeViewportData(table);
+  var setViewport = useSetPaddedViewportCallback(table, viewportSize, viewportPadding);
+  var applyFiltersAndRefresh = useCallback(filters => {
+    table === null || table === void 0 ? void 0 : table.applyFilter(filters);
+    setViewport(0);
+  }, [setViewport, table]);
+  var dh = useApi();
+  useTableListener(table, dh.Table.EVENT_UPDATED, createOnTableUpdatedHandler(viewportData, deserializeRow));
+  var size = useTableSize(table);
+  useEffect(() => {
+    if (table && !isClosed(table)) {
+      // Hydrate the viewport with real data. This will fetch data from index
+      // 0 to the end of the viewport + padding.
+      setViewport(0);
+    }
+  }, [table, setViewport, size]);
+  return {
+    viewportData,
+    size,
+    table,
+    applyFiltersAndRefresh,
+    setViewport
+  };
+}
+//# sourceMappingURL=useViewportData.js.map

package/dist/useViewportData.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useViewportData.js","names":["useCallback","useEffect","createOnTableUpdatedHandler","defaultRowDeserializer","isClosed","useApi","useInitializeViewportData","useSetPaddedViewportCallback","useTableListener","useTableSize","useViewportData","table","viewportSize","viewportPadding","deserializeRow","viewportData","setViewport","applyFiltersAndRefresh","filters","applyFilter","dh","Table","EVENT_UPDATED","size"],"sources":["../src/useViewportData.ts"],"sourcesContent":["import { useCallback, useEffect } from 'react';\nimport { ListData } from '@react-stately/data';\nimport type { FilterCondition, Table, TreeTable } from '@deephaven/jsapi-types';\nimport {\n  KeyedItem,\n  RowDeserializer,\n  createOnTableUpdatedHandler,\n  defaultRowDeserializer,\n  isClosed,\n} from '@deephaven/jsapi-utils';\nimport { useApi } from '@deephaven/jsapi-bootstrap';\nimport useInitializeViewportData from './useInitializeViewportData';\nimport useSetPaddedViewportCallback from './useSetPaddedViewportCallback';\nimport useTableListener from './useTableListener';\nimport useTableSize from './useTableSize';\n\nexport interface UseViewportDataProps<TItem, TTable extends Table | TreeTable> {\n  table: TTable | null;\n  viewportSize?: number;\n  viewportPadding?: number;\n  deserializeRow?: RowDeserializer<TItem>;\n}\n\nexport interface UseViewportDataResult<\n  TItem,\n  TTable extends Table | TreeTable\n> {\n  /** Manages deserialized row items associated with a DH Table */\n  viewportData: ListData<KeyedItem<TItem>>;\n  /** Size of the underlying Table */\n  size: number;\n\n  table: TTable | null;\n  /** Apply filters and refresh viewport. */\n  applyFiltersAndRefresh: (filters: FilterCondition[]) => void;\n  /** Set the viewport of the Table */\n  setViewport: (firstRow: number) => void;\n}\n\n/**\n * Sets up state management for windowed Table viewports. Returns a ListData\n * instance for managing items associated with the Table + a `setViewport`\n * callback for changing the current viewport.\n *\n * IMPORTANT: this will create an empty KeyedItem object for every row in the\n * source table. This is intended for \"human\" sized tables such as those used in\n * admin panels. This is not suitable for \"machine\" scale with millions+ rows.\n * @param table\n * @param viewportSize\n * @param viewportPadding\n * @returns An object for managing Table viewport state. Note that the returned\n * object changes on every render due to the `viewportData` not being memoized.\n * This is due to the underlying React Stately `useListData` implementation that\n * also changes its returned object on every render.\n */\nexport default function useViewportData<\n  TItem,\n  TTable extends Table | TreeTable\n>({\n  table,\n  viewportSize = 10,\n  viewportPadding = 50,\n  deserializeRow = defaultRowDeserializer,\n}: UseViewportDataProps<TItem, TTable>): UseViewportDataResult<TItem, TTable> {\n  const viewportData = useInitializeViewportData<TItem>(table);\n\n  const setViewport = useSetPaddedViewportCallback(\n    table,\n    viewportSize,\n    viewportPadding\n  );\n\n  const applyFiltersAndRefresh = useCallback(\n    (filters: FilterCondition[]) => {\n      table?.applyFilter(filters);\n      setViewport(0);\n    },\n    [setViewport, table]\n  );\n\n  const dh = useApi();\n\n  useTableListener(\n    table,\n    dh.Table.EVENT_UPDATED,\n    createOnTableUpdatedHandler(viewportData, deserializeRow)\n  );\n\n  const size = useTableSize(table);\n\n  useEffect(() => {\n    if (table && !isClosed(table)) {\n      // Hydrate the viewport with real data. This will fetch data from index\n      // 0 to the end of the viewport + padding.\n      setViewport(0);\n    }\n  }, [table, setViewport, size]);\n\n  return {\n    viewportData,\n    size,\n    table,\n    applyFiltersAndRefresh,\n    setViewport,\n  };\n}\n"],"mappings":"AAAA,SAASA,WAAW,EAAEC,SAAS,QAAQ,OAAO;AAG9C,SAGEC,2BAA2B,EAC3BC,sBAAsB,EACtBC,QAAQ,QACH,wBAAwB;AAC/B,SAASC,MAAM,QAAQ,4BAA4B;AAAC,OAC7CC,yBAAyB;AAAA,OACzBC,4BAA4B;AAAA,OAC5BC,gBAAgB;AAAA,OAChBC,YAAY;AAyBnB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,eAAe,OAQuC;EAAA,IAL5E;IACAC,KAAK;IACLC,YAAY,GAAG,EAAE;IACjBC,eAAe,GAAG,EAAE;IACpBC,cAAc,GAAGX;EACkB,CAAC;EACpC,IAAMY,YAAY,GAAGT,yBAAyB,CAAQK,KAAK,CAAC;EAE5D,IAAMK,WAAW,GAAGT,4BAA4B,CAC9CI,KAAK,EACLC,YAAY,EACZC,eAAe,CAChB;EAED,IAAMI,sBAAsB,GAAGjB,WAAW,CACvCkB,OAA0B,IAAK;IAC9BP,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAEQ,WAAW,CAACD,OAAO,CAAC;IAC3BF,WAAW,CAAC,CAAC,CAAC;EAChB,CAAC,EACD,CAACA,WAAW,EAAEL,KAAK,CAAC,CACrB;EAED,IAAMS,EAAE,GAAGf,MAAM,EAAE;EAEnBG,gBAAgB,CACdG,KAAK,EACLS,EAAE,CAACC,KAAK,CAACC,aAAa,EACtBpB,2BAA2B,CAACa,YAAY,EAAED,cAAc,CAAC,CAC1D;EAED,IAAMS,IAAI,GAAGd,YAAY,CAACE,KAAK,CAAC;EAEhCV,SAAS,CAAC,MAAM;IACd,IAAIU,KAAK,IAAI,CAACP,QAAQ,CAACO,KAAK,CAAC,EAAE;MAC7B;MACA;MACAK,WAAW,CAAC,CAAC,CAAC;IAChB;EACF,CAAC,EAAE,CAACL,KAAK,EAAEK,WAAW,EAAEO,IAAI,CAAC,CAAC;EAE9B,OAAO;IACLR,YAAY;IACZQ,IAAI;IACJZ,KAAK;IACLM,sBAAsB;IACtBD;EACF,CAAC;AACH"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deephaven/jsapi-components",
-  "version": "0.43.0",
+  "version": "0.44.0",
   "description": "Deephaven JSAPI Components",
   "author": "Deephaven Data Labs LLC",
   "license": "Apache-2.0",
@@ -22,13 +22,13 @@
     "build:sass": "sass --embed-sources --load-path=../../node_modules ./src:./dist"
   },
   "dependencies": {
-    "@deephaven/components": "^0.43.0",
-    "@deephaven/jsapi-bootstrap": "^0.43.0",
-    "@deephaven/jsapi-types": "^0.43.0",
-    "@deephaven/jsapi-utils": "^0.43.0",
-    "@deephaven/log": "^0.43.0",
-    "@deephaven/react-hooks": "^0.43.0",
-    "@deephaven/utils": "^0.43.0",
+    "@deephaven/components": "^0.44.0",
+    "@deephaven/jsapi-bootstrap": "^0.44.0",
+    "@deephaven/jsapi-types": "^0.44.0",
+    "@deephaven/jsapi-utils": "^0.44.0",
+    "@deephaven/log": "^0.44.0",
+    "@deephaven/react-hooks": "^0.44.0",
+    "@deephaven/utils": "^0.44.0",
     "@react-stately/data": "^3.9.1",
     "@types/js-cookie": "^3.0.3",
     "classnames": "^2.3.2",
@@ -37,7 +37,7 @@
     "prop-types": "^15.8.1"
   },
   "devDependencies": {
-    "@deephaven/jsapi-shim": "^0.43.0",
+    "@deephaven/jsapi-shim": "^0.44.0",
     "react-test-renderer": "^17.0.2"
   },
   "peerDependencies": {
@@ -52,5 +52,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "b16776b5bdc15a02cd2897cd79d562ea38c60ed8"
+  "gitHead": "ba13c9139b3b7a5f5d64d79069f1de9d4727eeb6"
 }