@deephaven/jsapi-components 0.38.1-beta.5 → 0.38.1-beta.9

package/dist/TableInput.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TableInput.d.ts","sourceRoot":"","sources":["../src/TableInput.tsx"],"names":[],"mappings":";AAaA,OAAO,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAGjE,OAAO,EAA6B,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAG7E,OAAO,mBAAmB,CAAC;AAI3B,KAAK,KAAK,GAAG,WAAW,GAAG,MAAM,CAAC;AAQlC,UAAU,eAAe;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,QAAQ,CAAC;IACnB,YAAY,EAAE,KAAK,EAAE,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IACtB,QAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAID,iBAAS,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,GAAG,CAAC,OAAO,CA+PvD;kBA/PQ,UAAU;;;;;;;AAwQnB,eAAe,UAAU,CAAC"}
+{"version":3,"file":"TableInput.d.ts","sourceRoot":"","sources":["../src/TableInput.tsx"],"names":[],"mappings":";AAaA,OAAO,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAGjE,OAAO,EAA6B,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAI7E,OAAO,mBAAmB,CAAC;AAI3B,KAAK,KAAK,GAAG,WAAW,GAAG,MAAM,CAAC;AAQlC,UAAU,eAAe;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,QAAQ,CAAC;IACnB,YAAY,EAAE,KAAK,EAAE,CAAC;IACtB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,KAAK,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IACtB,QAAQ,CAAC,KAAK,EAAE,KAAK,EAAE,GAAG,IAAI,CAAC;IAC/B,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAID,iBAAS,UAAU,CAAC,KAAK,EAAE,eAAe,GAAG,GAAG,CAAC,OAAO,CAiQvD;kBAjQQ,UAAU;;;;;;;AA0QnB,eAAe,UAAU,CAAC"}

package/dist/TableInput.js

@@ -6,6 +6,7 @@ import { LoadingOverlay, SearchInput, SelectValueList } from '@deephaven/compone
 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');
@@ -23,6 +24,7 @@ function TableInput(props) {
     table: tablePromise
   } = props;
   var parentRef = useRef(null);
+  var dh = useApi();
   var formatter = useMemo(() => {
     var columnFormats = FormatterUtils.getColumnFormats(settings);
     var dateTimeFormatterOptions = FormatterUtils.getDateTimeFormatterOptions(settings);
@@ -30,8 +32,8 @@ function TableInput(props) {
       defaultDecimalFormatOptions = {},
       defaultIntegerFormatOptions = {}
     } = settings;
-    return new Formatter(columnFormats, dateTimeFormatterOptions, 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();

package/dist/TableInput.js.map

@@ -1 +1 @@
-{"version":3,"file":"TableInput.js","names":["React","useCallback","useState","useRef","useEffect","useMemo","classNames","LoadingOverlay","SearchInput","SelectValueList","PromiseUtils","Log","Formatter","FormatterUtils","useTableColumn","log","module","SIZE_LIMIT","TableInput","props","className","undefined","columnName","settings","defaultValue","isInvalid","onChange","onBlur","table","tablePromise","parentRef","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 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 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      columnFormats,\n      dateTimeFormatterOptions,\n      defaultDecimalFormatOptions,\n      defaultIntegerFormatOptions\n    );\n  }, [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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"}
+{"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/useDebouncedViewportSearch.d.ts

@@ -7,6 +7,7 @@ export declare const DEBOUNCE_VIEWPORT_SEARCH_MS = 200;
  * @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<I, T extends Table | TreeTable>(viewportData: UseViewportDataResult<I, T>, columnName: string, debounceMs?: number): (searchText: string) => void;
 //# sourceMappingURL=useDebouncedViewportSearch.d.ts.map

package/dist/useDebouncedViewportSearch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useDebouncedViewportSearch.d.ts","sourceRoot":"","sources":["../src/useDebouncedViewportSearch.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAI/D,OAAO,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAE1D,eAAO,MAAM,2BAA2B,MAAM,CAAC;AAE/C;;;;;;GAMG;AACH,MAAM,CAAC,OAAO,UAAU,0BAA0B,CAChD,CAAC,EACD,CAAC,SAAS,KAAK,GAAG,SAAS,EAE3B,YAAY,EAAE,qBAAqB,CAAC,CAAC,EAAE,CAAC,CAAC,EACzC,UAAU,EAAE,MAAM,EAClB,UAAU,SAA8B,GACvC,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAqC9B"}
+{"version":3,"file":"useDebouncedViewportSearch.d.ts","sourceRoot":"","sources":["../src/useDebouncedViewportSearch.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAK/D,OAAO,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAI1D,eAAO,MAAM,2BAA2B,MAAM,CAAC;AAE/C;;;;;;;GAOG;AACH,MAAM,CAAC,OAAO,UAAU,0BAA0B,CAChD,CAAC,EACD,CAAC,SAAS,KAAK,GAAG,SAAS,EAE3B,YAAY,EAAE,qBAAqB,CAAC,CAAC,EAAE,CAAC,CAAC,EACzC,UAAU,EAAE,MAAM,EAClB,UAAU,SAA8B,GACvC,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CA0C9B"}

package/dist/useDebouncedViewportSearch.js

@@ -1,7 +1,9 @@
 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;
 
 /**
@@ -10,26 +12,33 @@ export var DEBOUNCE_VIEWPORT_SEARCH_MS = 200;
  * @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 => {
-    if (viewportData.table == null) {
+    log.debug("Applying debounced searchText '".concat(searchText, "'"));
+    if (table == null) {
       return;
     }
     var searchTextTrimmed = searchText.trim();
     if (searchTextTrimmed === '') {
-      viewportData.applyFiltersAndRefresh([]);
+      applyFiltersAndRefresh([]);
       return;
     }
-    var column = viewportData.table.findColumn(columnName);
+    var column = table.findColumn(columnName);
     var value = tableUtils.makeFilterValue(column.type, searchTextTrimmed);
     var filter = [column.filter().contains(value)];
-    viewportData.applyFiltersAndRefresh(filter);
-  }, debounceMs), [columnName, debounceMs, tableUtils, viewportData]);
+    applyFiltersAndRefresh(filter);
+  }, debounceMs), [applyFiltersAndRefresh, columnName, debounceMs, table, tableUtils]);
   useEffect(() => () => {
+    log.debug('Cancelling debounced search function');
     debouncedSearch.cancel();
   }, [debouncedSearch]);
   return debouncedSearch;

package/dist/useDebouncedViewportSearch.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDebouncedViewportSearch.js","names":["debounce","TableUtils","useApi","useEffect","useMemo","DEBOUNCE_VIEWPORT_SEARCH_MS","useDebouncedViewportSearch","viewportData","columnName","debounceMs","dh","tableUtils","debouncedSearch","searchText","table","searchTextTrimmed","trim","applyFiltersAndRefresh","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 { useEffect, useMemo } from 'react';\nimport { UseViewportDataResult } from './useViewportData';\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 */\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 debouncedSearch = useMemo(\n    () =>\n      debounce((searchText: string) => {\n        if (viewportData.table == null) {\n          return;\n        }\n\n        const searchTextTrimmed = searchText.trim();\n\n        if (searchTextTrimmed === '') {\n          viewportData.applyFiltersAndRefresh([]);\n          return;\n        }\n\n        const column = viewportData.table.findColumn(columnName);\n        const value = tableUtils.makeFilterValue(\n          column.type,\n          searchTextTrimmed\n        );\n        const filter = [column.filter().contains(value)];\n\n        viewportData.applyFiltersAndRefresh(filter);\n      }, debounceMs),\n    [columnName, debounceMs, tableUtils, viewportData]\n  );\n\n  useEffect(\n    () => () => {\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,SAASC,SAAS,EAAEC,OAAO,QAAQ,OAAO;AAG1C,OAAO,IAAMC,2BAA2B,GAAG,GAAG;;AAE9C;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe,SAASC,0BAA0B,CAIhDC,YAAyC,EACzCC,UAAkB,EAEY;EAAA,IAD9BC,UAAU,uEAAGJ,2BAA2B;EAExC,IAAMK,EAAE,GAAGR,MAAM,EAAE;EACnB,IAAMS,UAAU,GAAGP,OAAO,CAAC,MAAM,IAAIH,UAAU,CAACS,EAAE,CAAC,EAAE,CAACA,EAAE,CAAC,CAAC;EAC1D,IAAME,eAAe,GAAGR,OAAO,CAC7B,MACEJ,QAAQ,CAAEa,UAAkB,IAAK;IAC/B,IAAIN,YAAY,CAACO,KAAK,IAAI,IAAI,EAAE;MAC9B;IACF;IAEA,IAAMC,iBAAiB,GAAGF,UAAU,CAACG,IAAI,EAAE;IAE3C,IAAID,iBAAiB,KAAK,EAAE,EAAE;MAC5BR,YAAY,CAACU,sBAAsB,CAAC,EAAE,CAAC;MACvC;IACF;IAEA,IAAMC,MAAM,GAAGX,YAAY,CAACO,KAAK,CAACK,UAAU,CAACX,UAAU,CAAC;IACxD,IAAMY,KAAK,GAAGT,UAAU,CAACU,eAAe,CACtCH,MAAM,CAACI,IAAI,EACXP,iBAAiB,CAClB;IACD,IAAMQ,MAAM,GAAG,CAACL,MAAM,CAACK,MAAM,EAAE,CAACC,QAAQ,CAACJ,KAAK,CAAC,CAAC;IAEhDb,YAAY,CAACU,sBAAsB,CAACM,MAAM,CAAC;EAC7C,CAAC,EAAEd,UAAU,CAAC,EAChB,CAACD,UAAU,EAAEC,UAAU,EAAEE,UAAU,EAAEJ,YAAY,CAAC,CACnD;EAEDJ,SAAS,CACP,MAAM,MAAM;IACVS,eAAe,CAACa,MAAM,EAAE;EAC1B,CAAC,EACD,CAACb,eAAe,CAAC,CAClB;EAED,OAAOA,eAAe;AACxB"}
+{"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.d.ts

@@ -11,7 +11,8 @@ import { KeyedItem } from '@deephaven/jsapi-utils';
  * 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
+ * @returns a React Stately ListData object. Note that this object is recreated
+ * by React Stately on every render.
  */
 export default function useInitializeViewportData<T>(table: Table | TreeTable | null): ListData<KeyedItem<T>>;
 //# sourceMappingURL=useInitializeViewportData.d.ts.map

package/dist/useInitializeViewportData.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useInitializeViewportData.d.ts","sourceRoot":"","sources":["../src/useInitializeViewportData.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAe,MAAM,qBAAqB,CAAC;AAC5D,OAAO,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAC/D,OAAO,EAAE,SAAS,EAA2B,MAAM,wBAAwB,CAAC;AAI5E;;;;;;;;;;;GAWG;AACH,MAAM,CAAC,OAAO,UAAU,yBAAyB,CAAC,CAAC,EACjD,KAAK,EAAE,KAAK,GAAG,SAAS,GAAG,IAAI,GAC9B,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAuCxB"}
+{"version":3,"file":"useInitializeViewportData.d.ts","sourceRoot":"","sources":["../src/useInitializeViewportData.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAe,MAAM,qBAAqB,CAAC;AAC5D,OAAO,KAAK,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAC/D,OAAO,EAAE,SAAS,EAA2B,MAAM,wBAAwB,CAAC;AAI5E;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,OAAO,UAAU,yBAAyB,CAAC,CAAC,EACjD,KAAK,EAAE,KAAK,GAAG,SAAS,GAAG,IAAI,GAC9B,QAAQ,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAuCxB"}

package/dist/useInitializeViewportData.js

@@ -13,7 +13,8 @@ import useTableSize from "./useTableSize.js";
  * 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
+ * @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({});

package/dist/useInitializeViewportData.js.map

@@ -1 +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\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,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"}
+{"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/useTableUtils.d.ts

@@ -0,0 +1,6 @@
+import { TableUtils } from '@deephaven/jsapi-utils';
+/**
+ * Get a `TableUtils` instance using `dh` api from the current context.
+ */
+export default function useTableUtils(): TableUtils;
+//# sourceMappingURL=useTableUtils.d.ts.map

package/dist/useTableUtils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useTableUtils.d.ts","sourceRoot":"","sources":["../src/useTableUtils.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAEpD;;GAEG;AACH,MAAM,CAAC,OAAO,UAAU,aAAa,IAAI,UAAU,CAGlD"}

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.d.ts

@@ -29,7 +29,10 @@ export interface UseViewportDataResult<TItem, TTable extends Table | TreeTable>
  * @param table
  * @param viewportSize
  * @param viewportPadding
- * @returns An object for managing Table viewport state.
+ * @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<TItem, TTable extends Table | TreeTable>({ table, viewportSize, viewportPadding, deserializeRow, }: UseViewportDataProps<TItem, TTable>): UseViewportDataResult<TItem, TTable>;
 //# sourceMappingURL=useViewportData.d.ts.map

package/dist/useViewportData.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useViewportData.d.ts","sourceRoot":"","sources":["../src/useViewportData.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC/C,OAAO,KAAK,EAAE,eAAe,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAChF,OAAO,EACL,SAAS,EACT,eAAe,EAIhB,MAAM,wBAAwB,CAAC;AAMhC,MAAM,WAAW,oBAAoB,CAAC,KAAK,EAAE,MAAM,SAAS,KAAK,GAAG,SAAS;IAC3E,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC;CACzC;AAED,MAAM,WAAW,qBAAqB,CACpC,KAAK,EACL,MAAM,SAAS,KAAK,GAAG,SAAS;IAEhC,gEAAgE;IAChE,YAAY,EAAE,QAAQ,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC;IACzC,mCAAmC;IACnC,IAAI,EAAE,MAAM,CAAC;IAEb,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,0CAA0C;IAC1C,sBAAsB,EAAE,CAAC,OAAO,EAAE,eAAe,EAAE,KAAK,IAAI,CAAC;IAC7D,oCAAoC;IACpC,WAAW,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED;;;;;;;;;;;;GAYG;AACH,MAAM,CAAC,OAAO,UAAU,eAAe,CACrC,KAAK,EACL,MAAM,SAAS,KAAK,GAAG,SAAS,EAChC,EACA,KAAK,EACL,YAAiB,EACjB,eAAoB,EACpB,cAAuC,GACxC,EAAE,oBAAoB,CAAC,KAAK,EAAE,MAAM,CAAC,GAAG,qBAAqB,CAAC,KAAK,EAAE,MAAM,CAAC,CAwC5E"}
+{"version":3,"file":"useViewportData.d.ts","sourceRoot":"","sources":["../src/useViewportData.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAC/C,OAAO,KAAK,EAAE,eAAe,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAC;AAChF,OAAO,EACL,SAAS,EACT,eAAe,EAIhB,MAAM,wBAAwB,CAAC;AAOhC,MAAM,WAAW,oBAAoB,CAAC,KAAK,EAAE,MAAM,SAAS,KAAK,GAAG,SAAS;IAC3E,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,cAAc,CAAC,EAAE,eAAe,CAAC,KAAK,CAAC,CAAC;CACzC;AAED,MAAM,WAAW,qBAAqB,CACpC,KAAK,EACL,MAAM,SAAS,KAAK,GAAG,SAAS;IAEhC,gEAAgE;IAChE,YAAY,EAAE,QAAQ,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC;IACzC,mCAAmC;IACnC,IAAI,EAAE,MAAM,CAAC;IAEb,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,0CAA0C;IAC1C,sBAAsB,EAAE,CAAC,OAAO,EAAE,eAAe,EAAE,KAAK,IAAI,CAAC;IAC7D,oCAAoC;IACpC,WAAW,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;CACzC;AAED;;;;;;;;;;;;;;;GAeG;AACH,MAAM,CAAC,OAAO,UAAU,eAAe,CACrC,KAAK,EACL,MAAM,SAAS,KAAK,GAAG,SAAS,EAChC,EACA,KAAK,EACL,YAAiB,EACjB,eAAoB,EACpB,cAAuC,GACxC,EAAE,oBAAoB,CAAC,KAAK,EAAE,MAAM,CAAC,GAAG,qBAAqB,CAAC,KAAK,EAAE,MAAM,CAAC,CA0C5E"}

package/dist/useViewportData.js

@@ -1,5 +1,6 @@
 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";
@@ -15,7 +16,10 @@ import useTableSize from "./useTableSize.js";
  * @param table
  * @param viewportSize
  * @param viewportPadding
- * @returns An object for managing Table viewport state.
+ * @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 {
@@ -30,6 +34,7 @@ export default function useViewportData(_ref) {
     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(() => {

package/dist/useViewportData.js.map

@@ -1 +1 @@
-{"version":3,"file":"useViewportData.js","names":["useCallback","useEffect","createOnTableUpdatedHandler","defaultRowDeserializer","isClosed","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 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.\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  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;AAAC,OACzBC,yBAAyB;AAAA,OACzBC,4BAA4B;AAAA,OAC5BC,gBAAgB;AAAA,OAChBC,YAAY;AAyBnB;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,GAAGV;EACkB,CAAC;EACpC,IAAMW,YAAY,GAAGT,yBAAyB,CAAQK,KAAK,CAAC;EAE5D,IAAMK,WAAW,GAAGT,4BAA4B,CAC9CI,KAAK,EACLC,YAAY,EACZC,eAAe,CAChB;EAED,IAAMI,sBAAsB,GAAGhB,WAAW,CACvCiB,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;EAEDH,gBAAgB,CACdG,KAAK,EACLS,EAAE,CAACC,KAAK,CAACC,aAAa,EACtBnB,2BAA2B,CAACY,YAAY,EAAED,cAAc,CAAC,CAC1D;EAED,IAAMS,IAAI,GAAGd,YAAY,CAACE,KAAK,CAAC;EAEhCT,SAAS,CAAC,MAAM;IACd,IAAIS,KAAK,IAAI,CAACN,QAAQ,CAACM,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"}
+{"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.38.1-beta.5+588cb8fd",
+  "version": "0.38.1-beta.9+4b40e4b8",
   "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.38.1-beta.5+588cb8fd",
-    "@deephaven/jsapi-bootstrap": "^0.38.1-beta.5+588cb8fd",
-    "@deephaven/jsapi-types": "^0.38.1-beta.5+588cb8fd",
-    "@deephaven/jsapi-utils": "^0.38.1-beta.5+588cb8fd",
-    "@deephaven/log": "^0.38.1-beta.5+588cb8fd",
-    "@deephaven/react-hooks": "^0.38.1-beta.5+588cb8fd",
-    "@deephaven/utils": "^0.38.1-beta.5+588cb8fd",
+    "@deephaven/components": "^0.38.1-beta.9+4b40e4b8",
+    "@deephaven/jsapi-bootstrap": "^0.38.1-beta.9+4b40e4b8",
+    "@deephaven/jsapi-types": "^0.38.1-beta.9+4b40e4b8",
+    "@deephaven/jsapi-utils": "^0.38.1-beta.9+4b40e4b8",
+    "@deephaven/log": "^0.38.1-beta.9+4b40e4b8",
+    "@deephaven/react-hooks": "^0.38.1-beta.9+4b40e4b8",
+    "@deephaven/utils": "^0.38.1-beta.9+4b40e4b8",
     "@react-stately/data": "^3.9.1",
     "@types/js-cookie": "^3.0.3",
     "classnames": "^2.3.2",
@@ -37,8 +37,8 @@
     "prop-types": "^15.8.1"
   },
   "devDependencies": {
-    "@deephaven/jsapi-shim": "^0.38.1-beta.5+588cb8fd",
-    "@deephaven/tsconfig": "^0.38.1-beta.5+588cb8fd",
+    "@deephaven/jsapi-shim": "^0.38.1-beta.9+4b40e4b8",
+    "@deephaven/tsconfig": "^0.38.1-beta.9+4b40e4b8",
     "react-test-renderer": "^17.0.2"
   },
   "peerDependencies": {
@@ -53,5 +53,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "588cb8fd080ac992da40e9b732d82e206032c9eb"
+  "gitHead": "4b40e4b831c3dae4f7b869b71c7f6185560f929e"
 }