@deephaven/jsapi-components 0.38.1-beta.7 → 0.38.1-beta.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/TableInput.d.ts.map
CHANGED
|
@@ -1 +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;
|
|
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;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
CHANGED
|
@@ -6,6 +6,7 @@ import { LoadingOverlay, SearchInput, SelectValueList } from '@deephaven/compone
|
|
|
6
6
|
import { PromiseUtils } from '@deephaven/utils';
|
|
7
7
|
import Log from '@deephaven/log';
|
|
8
8
|
import { Formatter, FormatterUtils } from '@deephaven/jsapi-utils';
|
|
9
|
+
import { useApi } from '@deephaven/jsapi-bootstrap';
|
|
9
10
|
import useTableColumn from "./useTableColumn.js";
|
|
10
11
|
import "./TableInput.css";
|
|
11
12
|
var log = Log.module('TableInput');
|
|
@@ -23,6 +24,7 @@ function TableInput(props) {
|
|
|
23
24
|
table: tablePromise
|
|
24
25
|
} = props;
|
|
25
26
|
var parentRef = useRef(null);
|
|
27
|
+
var dh = useApi();
|
|
26
28
|
var formatter = useMemo(() => {
|
|
27
29
|
var columnFormats = FormatterUtils.getColumnFormats(settings);
|
|
28
30
|
var dateTimeFormatterOptions = FormatterUtils.getDateTimeFormatterOptions(settings);
|
|
@@ -30,8 +32,8 @@ function TableInput(props) {
|
|
|
30
32
|
defaultDecimalFormatOptions = {},
|
|
31
33
|
defaultIntegerFormatOptions = {}
|
|
32
34
|
} = settings;
|
|
33
|
-
return new Formatter(columnFormats, dateTimeFormatterOptions, defaultDecimalFormatOptions, defaultIntegerFormatOptions);
|
|
34
|
-
}, [settings]);
|
|
35
|
+
return new Formatter(dh, columnFormats, dateTimeFormatterOptions, defaultDecimalFormatOptions, defaultIntegerFormatOptions);
|
|
36
|
+
}, [dh, settings]);
|
|
35
37
|
var [searchValue, setSearchValue] = useState('');
|
|
36
38
|
var [selection, setSelection] = useState(new Set(defaultValue));
|
|
37
39
|
var [table, setTable] = useState();
|
package/dist/TableInput.js.map
CHANGED
|
@@ -1 +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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"}
|
|
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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"}
|
|
@@ -1 +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;
|
|
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;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
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { useCallback, useEffect } from 'react';
|
|
2
2
|
import { createOnTableUpdatedHandler, defaultRowDeserializer, isClosed } from '@deephaven/jsapi-utils';
|
|
3
|
+
import { useApi } from '@deephaven/jsapi-bootstrap';
|
|
3
4
|
import useInitializeViewportData from "./useInitializeViewportData.js";
|
|
4
5
|
import useSetPaddedViewportCallback from "./useSetPaddedViewportCallback.js";
|
|
5
6
|
import useTableListener from "./useTableListener.js";
|
|
@@ -33,6 +34,7 @@ export default function useViewportData(_ref) {
|
|
|
33
34
|
table === null || table === void 0 ? void 0 : table.applyFilter(filters);
|
|
34
35
|
setViewport(0);
|
|
35
36
|
}, [setViewport, table]);
|
|
37
|
+
var dh = useApi();
|
|
36
38
|
useTableListener(table, dh.Table.EVENT_UPDATED, createOnTableUpdatedHandler(viewportData, deserializeRow));
|
|
37
39
|
var size = useTableSize(table);
|
|
38
40
|
useEffect(() => {
|
|
@@ -1 +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. 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 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,
|
|
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
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@deephaven/jsapi-components",
|
|
3
|
-
"version": "0.38.1-beta.
|
|
3
|
+
"version": "0.38.1-beta.9+4b40e4b8",
|
|
4
4
|
"description": "Deephaven JSAPI Components",
|
|
5
5
|
"author": "Deephaven Data Labs LLC",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -22,13 +22,13 @@
|
|
|
22
22
|
"build:sass": "sass --embed-sources --load-path=../../node_modules ./src:./dist"
|
|
23
23
|
},
|
|
24
24
|
"dependencies": {
|
|
25
|
-
"@deephaven/components": "^0.38.1-beta.
|
|
26
|
-
"@deephaven/jsapi-bootstrap": "^0.38.1-beta.
|
|
27
|
-
"@deephaven/jsapi-types": "^0.38.1-beta.
|
|
28
|
-
"@deephaven/jsapi-utils": "^0.38.1-beta.
|
|
29
|
-
"@deephaven/log": "^0.38.1-beta.
|
|
30
|
-
"@deephaven/react-hooks": "^0.38.1-beta.
|
|
31
|
-
"@deephaven/utils": "^0.38.1-beta.
|
|
25
|
+
"@deephaven/components": "^0.38.1-beta.9+4b40e4b8",
|
|
26
|
+
"@deephaven/jsapi-bootstrap": "^0.38.1-beta.9+4b40e4b8",
|
|
27
|
+
"@deephaven/jsapi-types": "^0.38.1-beta.9+4b40e4b8",
|
|
28
|
+
"@deephaven/jsapi-utils": "^0.38.1-beta.9+4b40e4b8",
|
|
29
|
+
"@deephaven/log": "^0.38.1-beta.9+4b40e4b8",
|
|
30
|
+
"@deephaven/react-hooks": "^0.38.1-beta.9+4b40e4b8",
|
|
31
|
+
"@deephaven/utils": "^0.38.1-beta.9+4b40e4b8",
|
|
32
32
|
"@react-stately/data": "^3.9.1",
|
|
33
33
|
"@types/js-cookie": "^3.0.3",
|
|
34
34
|
"classnames": "^2.3.2",
|
|
@@ -37,8 +37,8 @@
|
|
|
37
37
|
"prop-types": "^15.8.1"
|
|
38
38
|
},
|
|
39
39
|
"devDependencies": {
|
|
40
|
-
"@deephaven/jsapi-shim": "^0.38.1-beta.
|
|
41
|
-
"@deephaven/tsconfig": "^0.38.1-beta.
|
|
40
|
+
"@deephaven/jsapi-shim": "^0.38.1-beta.9+4b40e4b8",
|
|
41
|
+
"@deephaven/tsconfig": "^0.38.1-beta.9+4b40e4b8",
|
|
42
42
|
"react-test-renderer": "^17.0.2"
|
|
43
43
|
},
|
|
44
44
|
"peerDependencies": {
|
|
@@ -53,5 +53,5 @@
|
|
|
53
53
|
"publishConfig": {
|
|
54
54
|
"access": "public"
|
|
55
55
|
},
|
|
56
|
-
"gitHead": "
|
|
56
|
+
"gitHead": "4b40e4b831c3dae4f7b869b71c7f6185560f929e"
|
|
57
57
|
}
|