@deephaven/jsapi-components 0.83.1-beta.0 → 0.84.0
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/usePickerWithSelectedValues.d.ts +3 -1
- package/dist/usePickerWithSelectedValues.d.ts.map +1 -1
- package/dist/usePickerWithSelectedValues.js +4 -2
- package/dist/usePickerWithSelectedValues.js.map +1 -1
- package/dist/useSearchableViewportData.d.ts +15 -5
- package/dist/useSearchableViewportData.d.ts.map +1 -1
- package/dist/useSearchableViewportData.js +27 -12
- package/dist/useSearchableViewportData.js.map +1 -1
- package/package.json +9 -9
|
@@ -28,13 +28,15 @@ export interface UsePickerWithSelectedValuesResult<TItem, TValue> {
|
|
|
28
28
|
* @param mapItemToValue A function to map an item to a value
|
|
29
29
|
* @param filterConditionFactories Optional filter condition factories to apply to the list
|
|
30
30
|
* @param trimSearchText Whether to trim the search text before filtering. Defaults to false
|
|
31
|
+
* @param timeZone The timezone to use for date parsing
|
|
31
32
|
*/
|
|
32
|
-
export declare function usePickerWithSelectedValues<TItem, TValue>({ maybeTable, columnName, mapItemToValue, filterConditionFactories, trimSearchText, }: {
|
|
33
|
+
export declare function usePickerWithSelectedValues<TItem, TValue>({ maybeTable, columnName, mapItemToValue, filterConditionFactories, trimSearchText, timeZone, }: {
|
|
33
34
|
maybeTable: dh.Table | null;
|
|
34
35
|
columnName: string;
|
|
35
36
|
mapItemToValue: (item: KeyedItem<TItem>) => TValue;
|
|
36
37
|
filterConditionFactories?: FilterConditionFactory[];
|
|
37
38
|
trimSearchText?: boolean;
|
|
39
|
+
timeZone: string;
|
|
38
40
|
}): UsePickerWithSelectedValuesResult<TItem, TValue>;
|
|
39
41
|
export default usePickerWithSelectedValues;
|
|
40
42
|
//# sourceMappingURL=usePickerWithSelectedValues.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePickerWithSelectedValues.d.ts","sourceRoot":"","sources":["../src/usePickerWithSelectedValues.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAkC,MAAM,OAAO,CAAC;AAC5D,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAGL,sBAAsB,EACvB,MAAM,wBAAwB,CAAC;AAOhC,OAAO,EACL,SAAS,EAET,UAAU,EAGX,MAAM,kBAAkB,CAAC;AAE1B,OAAwB,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAK3E,MAAM,WAAW,iCAAiC,CAAC,KAAK,EAAE,MAAM;IAC9D,IAAI,EAAE,qBAAqB,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,CAAC;IAC7C,4BAA4B,EAAE,OAAO,CAAC;IACtC,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,OAAO,GAAG,IAAI,CAAC;IACjC,4BAA4B,EAAE,OAAO,CAAC;IACtC,WAAW,EAAE,GAAG,GAAG,IAAI,CAAC;IACxB,gBAAgB,EAAE,WAAW,CAAC,MAAM,EAAE;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACzD,kBAAkB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,WAAW,EAAE,CAAC,GAAG,EAAE,GAAG,GAAG,IAAI,KAAK,IAAI,CAAC;IACvC,WAAW,EAAE,CAAC,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IACnD,cAAc,EAAE,CAAC,MAAM,EAAE,UAAU,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;CACtD;AAED
|
|
1
|
+
{"version":3,"file":"usePickerWithSelectedValues.d.ts","sourceRoot":"","sources":["../src/usePickerWithSelectedValues.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAkC,MAAM,OAAO,CAAC;AAC5D,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAGL,sBAAsB,EACvB,MAAM,wBAAwB,CAAC;AAOhC,OAAO,EACL,SAAS,EAET,UAAU,EAGX,MAAM,kBAAkB,CAAC;AAE1B,OAAwB,EAAE,qBAAqB,EAAE,MAAM,mBAAmB,CAAC;AAK3E,MAAM,WAAW,iCAAiC,CAAC,KAAK,EAAE,MAAM;IAC9D,IAAI,EAAE,qBAAqB,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,CAAC;IAC7C,4BAA4B,EAAE,OAAO,CAAC;IACtC,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,OAAO,GAAG,IAAI,CAAC;IACjC,4BAA4B,EAAE,OAAO,CAAC;IACtC,WAAW,EAAE,GAAG,GAAG,IAAI,CAAC;IACxB,gBAAgB,EAAE,WAAW,CAAC,MAAM,EAAE;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACzD,kBAAkB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACjD,WAAW,EAAE,CAAC,GAAG,EAAE,GAAG,GAAG,IAAI,KAAK,IAAI,CAAC;IACvC,WAAW,EAAE,CAAC,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;IACnD,cAAc,EAAE,CAAC,MAAM,EAAE,UAAU,CAAC,MAAM,CAAC,KAAK,IAAI,CAAC;CACtD;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,2BAA2B,CAAC,KAAK,EAAE,MAAM,EAAE,EACzD,UAAU,EACV,UAAU,EACV,cAAc,EACd,wBAA6B,EAC7B,cAAsB,EACtB,QAAQ,GACT,EAAE;IACD,UAAU,EAAE,EAAE,CAAC,KAAK,GAAG,IAAI,CAAC;IAC5B,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,EAAE,CAAC,IAAI,EAAE,SAAS,CAAC,KAAK,CAAC,KAAK,MAAM,CAAC;IACnD,wBAAwB,CAAC,EAAE,sBAAsB,EAAE,CAAC;IACpD,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,EAAE,MAAM,CAAC;CAClB,GAAG,iCAAiC,CAAC,KAAK,EAAE,MAAM,CAAC,CAgOnD;AAED,eAAe,2BAA2B,CAAC"}
|
|
@@ -18,6 +18,7 @@ import useTableClose from "./useTableClose.js";
|
|
|
18
18
|
* @param mapItemToValue A function to map an item to a value
|
|
19
19
|
* @param filterConditionFactories Optional filter condition factories to apply to the list
|
|
20
20
|
* @param trimSearchText Whether to trim the search text before filtering. Defaults to false
|
|
21
|
+
* @param timeZone The timezone to use for date parsing
|
|
21
22
|
*/
|
|
22
23
|
export function usePickerWithSelectedValues(_ref) {
|
|
23
24
|
var {
|
|
@@ -25,7 +26,8 @@ export function usePickerWithSelectedValues(_ref) {
|
|
|
25
26
|
columnName,
|
|
26
27
|
mapItemToValue,
|
|
27
28
|
filterConditionFactories = [],
|
|
28
|
-
trimSearchText = false
|
|
29
|
+
trimSearchText = false,
|
|
30
|
+
timeZone
|
|
29
31
|
} = _ref;
|
|
30
32
|
var {
|
|
31
33
|
itemHeight
|
|
@@ -64,7 +66,7 @@ export function usePickerWithSelectedValues(_ref) {
|
|
|
64
66
|
// If value exists check is still loading or if debounce hasn't completed, set
|
|
65
67
|
// `searchTextExists` to null since it is indeterminate.
|
|
66
68
|
var searchTextExists = isApplyingFilter || valueExistsIsLoading ? null : valueExists;
|
|
67
|
-
var searchTextFilter = useMemo(() => createSearchTextFilter(tableUtils, columnName, appliedSearchText), [appliedSearchText, columnName, tableUtils]);
|
|
69
|
+
var searchTextFilter = useMemo(() => createSearchTextFilter(tableUtils, columnName, appliedSearchText, timeZone), [appliedSearchText, columnName, tableUtils, timeZone]);
|
|
68
70
|
|
|
69
71
|
// Filter out selected values from the picker
|
|
70
72
|
var excludeSelectedValuesFilter = useMemo(() => createSelectedValuesFilter(tableUtils, columnName, new Set(selectedValueMap.keys()), false, true), [columnName, selectedValueMap, tableUtils]);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePickerWithSelectedValues.js","names":["useCallback","useMemo","useState","createSearchTextFilter","createSelectedValuesFilter","useDebouncedCallback","useDebouncedValue","usePromiseFactory","usePickerItemScale","SEARCH_DEBOUNCE_MS","VIEWPORT_PADDING","VIEWPORT_SIZE","useFilterConditionFactories","useViewportData","useViewportFilter","useTableUtils","useTableClose","usePickerWithSelectedValues","_ref","maybeTable","columnName","mapItemToValue","filterConditionFactories","trimSearchText","itemHeight","tableUtils","searchText","setSearchText","appliedSearchText","setAppliedSearchText","applySearchText","text","trim","searchTextMaybeTrimmed","selectedKey","setSelectedKey","selectedValueMap","setSelectedValueMap","Map","data","valueExists","isLoading","valueExistsIsLoading","doesColumnValueExist","isDebouncing","isApplyingFilter","searchTextExists","searchTextFilter","excludeSelectedValuesFilter","Set","keys","listTable","createDistinctSortedColumnTable","list","table","viewportSize","viewportPadding","hasSearchTextWithZeroResults","length","size","searchTextIsInSelectedValues","has","onDebouncedSearchTextChange","onSearchTextChange","setSelectedKeyOnNextFrame","onSelectKey","key","item","viewportData","findItem","value","prev","next","set","onAddValues","values","onRemoveValues","delete","filter"],"sources":["../src/usePickerWithSelectedValues.ts"],"sourcesContent":["import { Key, useCallback, useMemo, useState } from 'react';\nimport type { dh } from '@deephaven/jsapi-types';\nimport {\n createSearchTextFilter,\n createSelectedValuesFilter,\n FilterConditionFactory,\n} from '@deephaven/jsapi-utils';\nimport {\n useDebouncedCallback,\n useDebouncedValue,\n usePromiseFactory,\n} from '@deephaven/react-hooks';\nimport { usePickerItemScale } from '@deephaven/components';\nimport {\n KeyedItem,\n SEARCH_DEBOUNCE_MS,\n SelectionT,\n VIEWPORT_PADDING,\n VIEWPORT_SIZE,\n} from '@deephaven/utils';\nimport useFilterConditionFactories from './useFilterConditionFactories';\nimport useViewportData, { UseViewportDataResult } from './useViewportData';\nimport useViewportFilter from './useViewportFilter';\nimport useTableUtils from './useTableUtils';\nimport useTableClose from './useTableClose';\n\nexport interface UsePickerWithSelectedValuesResult<TItem, TValue> {\n list: UseViewportDataResult<TItem, dh.Table>;\n hasSearchTextWithZeroResults: boolean;\n searchText: string;\n searchTextExists: boolean | null;\n searchTextIsInSelectedValues: boolean;\n selectedKey: Key | null;\n selectedValueMap: ReadonlyMap<TValue, { value: TValue }>;\n onSearchTextChange: (searchText: string) => void;\n onSelectKey: (key: Key | null) => void;\n onAddValues: (values: ReadonlySet<TValue>) => void;\n onRemoveValues: (values: SelectionT<TValue>) => void;\n}\n\n/**\n * Manages a list of available items that can be searched and selected. Selected\n * items are removed from the list and managed in a selectedValueMap data\n * structure. Useful for components that contain a picker but show selected\n * values in a separate component.\n * @param maybeTable The table to get the list of items from\n * @param columnName The column name to get the list of items from\n * @param mapItemToValue A function to map an item to a value\n * @param filterConditionFactories Optional filter condition factories to apply to the list\n * @param trimSearchText Whether to trim the search text before filtering. Defaults to false\n */\nexport function usePickerWithSelectedValues<TItem, TValue>({\n maybeTable,\n columnName,\n mapItemToValue,\n filterConditionFactories = [],\n trimSearchText = false,\n}: {\n maybeTable: dh.Table | null;\n columnName: string;\n mapItemToValue: (item: KeyedItem<TItem>) => TValue;\n filterConditionFactories?: FilterConditionFactory[];\n trimSearchText?: boolean;\n}): UsePickerWithSelectedValuesResult<TItem, TValue> {\n const { itemHeight } = usePickerItemScale();\n\n const tableUtils = useTableUtils();\n\n // `searchText` should always be up to date for controlled search input.\n // `appliedSearchText` will get updated after a delay to avoid updating\n // filters on every key stroke. It will also be trimmed of leading / trailing\n // spaces if `trimSearchText` is true.\n const [searchText, setSearchText] = useState('');\n const [appliedSearchText, setAppliedSearchText] = useState('');\n\n const applySearchText = useCallback(\n (text: string) => {\n setAppliedSearchText(trimSearchText ? text.trim() : text);\n },\n [trimSearchText]\n );\n\n const searchTextMaybeTrimmed = useMemo(\n () => (trimSearchText ? searchText.trim() : searchText),\n [searchText, trimSearchText]\n );\n\n const [selectedKey, setSelectedKey] = useState<Key | null>(null);\n const [selectedValueMap, setSelectedValueMap] = useState<\n Map<TValue, { value: TValue }>\n >(() => new Map());\n\n const { data: valueExists, isLoading: valueExistsIsLoading } =\n usePromiseFactory(tableUtils.doesColumnValueExist, [\n maybeTable,\n columnName,\n appliedSearchText,\n false /* isCaseSensitive */,\n ]);\n\n // The `searchTextFilter` starts getting applied to the list whenever\n // `appliedSearchText` changes, after which there is a small delay before the\n // items are in sync. Use a debounce timer to allow a little extra time\n // before calculating `searchTextExists` below. Note that there are 2 debounce\n // timers at play here:\n // 1. `onDebouncedSearchTextChange` applies the search text after user stops typing\n // 2. `useDebouncedValue` debounces whenever the result of the first debounce\n // changes, and `isApplyingFilter` will be true while this 2nd timer is active.\n const { isDebouncing: isApplyingFilter } = useDebouncedValue(\n appliedSearchText,\n SEARCH_DEBOUNCE_MS\n );\n\n // If value exists check is still loading or if debounce hasn't completed, set\n // `searchTextExists` to null since it is indeterminate.\n const searchTextExists =\n isApplyingFilter || valueExistsIsLoading ? null : valueExists;\n\n const searchTextFilter = useMemo(\n () => createSearchTextFilter(tableUtils, columnName, appliedSearchText),\n [appliedSearchText, columnName, tableUtils]\n );\n\n // Filter out selected values from the picker\n const excludeSelectedValuesFilter = useMemo(\n () =>\n createSelectedValuesFilter(\n tableUtils,\n columnName,\n new Set(selectedValueMap.keys()),\n false,\n true\n ),\n [columnName, selectedValueMap, tableUtils]\n );\n\n const { data: listTable } = usePromiseFactory(\n tableUtils.createDistinctSortedColumnTable,\n [maybeTable, columnName, 'asc', ...filterConditionFactories]\n );\n\n useTableClose(listTable);\n\n const list = useViewportData<TItem, dh.Table>({\n table: listTable,\n itemHeight,\n viewportSize: VIEWPORT_SIZE,\n viewportPadding: VIEWPORT_PADDING,\n });\n\n const hasSearchTextWithZeroResults =\n searchTextMaybeTrimmed.length > 0 && list.size === 0;\n const searchTextIsInSelectedValues = selectedValueMap.has(\n searchTextMaybeTrimmed as TValue\n );\n\n const onDebouncedSearchTextChange = useDebouncedCallback(\n applySearchText,\n SEARCH_DEBOUNCE_MS\n );\n\n const onSearchTextChange = useCallback(\n (text: string) => {\n setSearchText(text);\n onDebouncedSearchTextChange(text);\n },\n [onDebouncedSearchTextChange]\n );\n\n const setSelectedKeyOnNextFrame = useDebouncedCallback(setSelectedKey, 0);\n\n const onSelectKey = useCallback(\n (key: Key | null) => {\n setSearchText('');\n applySearchText('');\n\n // Set the selection temporarily to avoid the picker staying open\n setSelectedKey(key);\n\n // Clear the selection on next frame since selected items get removed from\n // the list and added to `selectedValues` Map\n setSelectedKeyOnNextFrame(null);\n\n // key will be null in scenarios where search text doesn't match an item\n // and user clicks outside of picker\n if (key == null) {\n return;\n }\n\n const item = list.viewportData.findItem(key);\n\n if (item == null) {\n return;\n }\n\n const value = mapItemToValue(item);\n\n setSelectedValueMap(prev => {\n const next = new Map(prev);\n next.set(value, { value });\n return next;\n });\n },\n [\n applySearchText,\n setSelectedKeyOnNextFrame,\n list.viewportData,\n mapItemToValue,\n ]\n );\n\n const onAddValues = useCallback((values: ReadonlySet<TValue>) => {\n setSelectedValueMap(prev => {\n if (values.size === 0) {\n return prev;\n }\n\n const next = new Map(prev);\n\n // eslint-disable-next-line no-restricted-syntax\n for (const value of values) {\n next.set(value, { value });\n }\n\n return next;\n });\n }, []);\n\n const onRemoveValues = useCallback((values: SelectionT<TValue>) => {\n setSelectedValueMap(prev => {\n if (values === 'all') {\n return new Map();\n }\n\n const next = new Map(prev);\n\n // eslint-disable-next-line no-restricted-syntax\n for (const value of values) {\n next.delete(value);\n }\n\n return next;\n });\n }, []);\n\n const filter = useFilterConditionFactories(\n list.table,\n searchTextFilter,\n excludeSelectedValuesFilter\n );\n\n useViewportFilter(list, filter);\n\n return useMemo(\n () => ({\n list,\n hasSearchTextWithZeroResults,\n searchText,\n searchTextExists,\n searchTextIsInSelectedValues,\n selectedKey,\n selectedValueMap,\n onSearchTextChange,\n onSelectKey,\n onAddValues,\n onRemoveValues,\n }),\n [\n hasSearchTextWithZeroResults,\n list,\n onAddValues,\n onRemoveValues,\n onSearchTextChange,\n onSelectKey,\n searchText,\n searchTextExists,\n searchTextIsInSelectedValues,\n selectedKey,\n selectedValueMap,\n ]\n );\n}\n\nexport default usePickerWithSelectedValues;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"usePickerWithSelectedValues.js","names":["useCallback","useMemo","useState","createSearchTextFilter","createSelectedValuesFilter","useDebouncedCallback","useDebouncedValue","usePromiseFactory","usePickerItemScale","SEARCH_DEBOUNCE_MS","VIEWPORT_PADDING","VIEWPORT_SIZE","useFilterConditionFactories","useViewportData","useViewportFilter","useTableUtils","useTableClose","usePickerWithSelectedValues","_ref","maybeTable","columnName","mapItemToValue","filterConditionFactories","trimSearchText","timeZone","itemHeight","tableUtils","searchText","setSearchText","appliedSearchText","setAppliedSearchText","applySearchText","text","trim","searchTextMaybeTrimmed","selectedKey","setSelectedKey","selectedValueMap","setSelectedValueMap","Map","data","valueExists","isLoading","valueExistsIsLoading","doesColumnValueExist","isDebouncing","isApplyingFilter","searchTextExists","searchTextFilter","excludeSelectedValuesFilter","Set","keys","listTable","createDistinctSortedColumnTable","list","table","viewportSize","viewportPadding","hasSearchTextWithZeroResults","length","size","searchTextIsInSelectedValues","has","onDebouncedSearchTextChange","onSearchTextChange","setSelectedKeyOnNextFrame","onSelectKey","key","item","viewportData","findItem","value","prev","next","set","onAddValues","values","onRemoveValues","delete","filter"],"sources":["../src/usePickerWithSelectedValues.ts"],"sourcesContent":["import { Key, useCallback, useMemo, useState } from 'react';\nimport type { dh } from '@deephaven/jsapi-types';\nimport {\n createSearchTextFilter,\n createSelectedValuesFilter,\n FilterConditionFactory,\n} from '@deephaven/jsapi-utils';\nimport {\n useDebouncedCallback,\n useDebouncedValue,\n usePromiseFactory,\n} from '@deephaven/react-hooks';\nimport { usePickerItemScale } from '@deephaven/components';\nimport {\n KeyedItem,\n SEARCH_DEBOUNCE_MS,\n SelectionT,\n VIEWPORT_PADDING,\n VIEWPORT_SIZE,\n} from '@deephaven/utils';\nimport useFilterConditionFactories from './useFilterConditionFactories';\nimport useViewportData, { UseViewportDataResult } from './useViewportData';\nimport useViewportFilter from './useViewportFilter';\nimport useTableUtils from './useTableUtils';\nimport useTableClose from './useTableClose';\n\nexport interface UsePickerWithSelectedValuesResult<TItem, TValue> {\n list: UseViewportDataResult<TItem, dh.Table>;\n hasSearchTextWithZeroResults: boolean;\n searchText: string;\n searchTextExists: boolean | null;\n searchTextIsInSelectedValues: boolean;\n selectedKey: Key | null;\n selectedValueMap: ReadonlyMap<TValue, { value: TValue }>;\n onSearchTextChange: (searchText: string) => void;\n onSelectKey: (key: Key | null) => void;\n onAddValues: (values: ReadonlySet<TValue>) => void;\n onRemoveValues: (values: SelectionT<TValue>) => void;\n}\n\n/**\n * Manages a list of available items that can be searched and selected. Selected\n * items are removed from the list and managed in a selectedValueMap data\n * structure. Useful for components that contain a picker but show selected\n * values in a separate component.\n * @param maybeTable The table to get the list of items from\n * @param columnName The column name to get the list of items from\n * @param mapItemToValue A function to map an item to a value\n * @param filterConditionFactories Optional filter condition factories to apply to the list\n * @param trimSearchText Whether to trim the search text before filtering. Defaults to false\n * @param timeZone The timezone to use for date parsing\n */\nexport function usePickerWithSelectedValues<TItem, TValue>({\n maybeTable,\n columnName,\n mapItemToValue,\n filterConditionFactories = [],\n trimSearchText = false,\n timeZone,\n}: {\n maybeTable: dh.Table | null;\n columnName: string;\n mapItemToValue: (item: KeyedItem<TItem>) => TValue;\n filterConditionFactories?: FilterConditionFactory[];\n trimSearchText?: boolean;\n timeZone: string;\n}): UsePickerWithSelectedValuesResult<TItem, TValue> {\n const { itemHeight } = usePickerItemScale();\n\n const tableUtils = useTableUtils();\n\n // `searchText` should always be up to date for controlled search input.\n // `appliedSearchText` will get updated after a delay to avoid updating\n // filters on every key stroke. It will also be trimmed of leading / trailing\n // spaces if `trimSearchText` is true.\n const [searchText, setSearchText] = useState('');\n const [appliedSearchText, setAppliedSearchText] = useState('');\n\n const applySearchText = useCallback(\n (text: string) => {\n setAppliedSearchText(trimSearchText ? text.trim() : text);\n },\n [trimSearchText]\n );\n\n const searchTextMaybeTrimmed = useMemo(\n () => (trimSearchText ? searchText.trim() : searchText),\n [searchText, trimSearchText]\n );\n\n const [selectedKey, setSelectedKey] = useState<Key | null>(null);\n const [selectedValueMap, setSelectedValueMap] = useState<\n Map<TValue, { value: TValue }>\n >(() => new Map());\n\n const { data: valueExists, isLoading: valueExistsIsLoading } =\n usePromiseFactory(tableUtils.doesColumnValueExist, [\n maybeTable,\n columnName,\n appliedSearchText,\n false /* isCaseSensitive */,\n ]);\n\n // The `searchTextFilter` starts getting applied to the list whenever\n // `appliedSearchText` changes, after which there is a small delay before the\n // items are in sync. Use a debounce timer to allow a little extra time\n // before calculating `searchTextExists` below. Note that there are 2 debounce\n // timers at play here:\n // 1. `onDebouncedSearchTextChange` applies the search text after user stops typing\n // 2. `useDebouncedValue` debounces whenever the result of the first debounce\n // changes, and `isApplyingFilter` will be true while this 2nd timer is active.\n const { isDebouncing: isApplyingFilter } = useDebouncedValue(\n appliedSearchText,\n SEARCH_DEBOUNCE_MS\n );\n\n // If value exists check is still loading or if debounce hasn't completed, set\n // `searchTextExists` to null since it is indeterminate.\n const searchTextExists =\n isApplyingFilter || valueExistsIsLoading ? null : valueExists;\n\n const searchTextFilter = useMemo(\n () =>\n createSearchTextFilter(\n tableUtils,\n columnName,\n appliedSearchText,\n timeZone\n ),\n [appliedSearchText, columnName, tableUtils, timeZone]\n );\n\n // Filter out selected values from the picker\n const excludeSelectedValuesFilter = useMemo(\n () =>\n createSelectedValuesFilter(\n tableUtils,\n columnName,\n new Set(selectedValueMap.keys()),\n false,\n true\n ),\n [columnName, selectedValueMap, tableUtils]\n );\n\n const { data: listTable } = usePromiseFactory(\n tableUtils.createDistinctSortedColumnTable,\n [maybeTable, columnName, 'asc', ...filterConditionFactories]\n );\n\n useTableClose(listTable);\n\n const list = useViewportData<TItem, dh.Table>({\n table: listTable,\n itemHeight,\n viewportSize: VIEWPORT_SIZE,\n viewportPadding: VIEWPORT_PADDING,\n });\n\n const hasSearchTextWithZeroResults =\n searchTextMaybeTrimmed.length > 0 && list.size === 0;\n const searchTextIsInSelectedValues = selectedValueMap.has(\n searchTextMaybeTrimmed as TValue\n );\n\n const onDebouncedSearchTextChange = useDebouncedCallback(\n applySearchText,\n SEARCH_DEBOUNCE_MS\n );\n\n const onSearchTextChange = useCallback(\n (text: string) => {\n setSearchText(text);\n onDebouncedSearchTextChange(text);\n },\n [onDebouncedSearchTextChange]\n );\n\n const setSelectedKeyOnNextFrame = useDebouncedCallback(setSelectedKey, 0);\n\n const onSelectKey = useCallback(\n (key: Key | null) => {\n setSearchText('');\n applySearchText('');\n\n // Set the selection temporarily to avoid the picker staying open\n setSelectedKey(key);\n\n // Clear the selection on next frame since selected items get removed from\n // the list and added to `selectedValues` Map\n setSelectedKeyOnNextFrame(null);\n\n // key will be null in scenarios where search text doesn't match an item\n // and user clicks outside of picker\n if (key == null) {\n return;\n }\n\n const item = list.viewportData.findItem(key);\n\n if (item == null) {\n return;\n }\n\n const value = mapItemToValue(item);\n\n setSelectedValueMap(prev => {\n const next = new Map(prev);\n next.set(value, { value });\n return next;\n });\n },\n [\n applySearchText,\n setSelectedKeyOnNextFrame,\n list.viewportData,\n mapItemToValue,\n ]\n );\n\n const onAddValues = useCallback((values: ReadonlySet<TValue>) => {\n setSelectedValueMap(prev => {\n if (values.size === 0) {\n return prev;\n }\n\n const next = new Map(prev);\n\n // eslint-disable-next-line no-restricted-syntax\n for (const value of values) {\n next.set(value, { value });\n }\n\n return next;\n });\n }, []);\n\n const onRemoveValues = useCallback((values: SelectionT<TValue>) => {\n setSelectedValueMap(prev => {\n if (values === 'all') {\n return new Map();\n }\n\n const next = new Map(prev);\n\n // eslint-disable-next-line no-restricted-syntax\n for (const value of values) {\n next.delete(value);\n }\n\n return next;\n });\n }, []);\n\n const filter = useFilterConditionFactories(\n list.table,\n searchTextFilter,\n excludeSelectedValuesFilter\n );\n\n useViewportFilter(list, filter);\n\n return useMemo(\n () => ({\n list,\n hasSearchTextWithZeroResults,\n searchText,\n searchTextExists,\n searchTextIsInSelectedValues,\n selectedKey,\n selectedValueMap,\n onSearchTextChange,\n onSelectKey,\n onAddValues,\n onRemoveValues,\n }),\n [\n hasSearchTextWithZeroResults,\n list,\n onAddValues,\n onRemoveValues,\n onSearchTextChange,\n onSelectKey,\n searchText,\n searchTextExists,\n searchTextIsInSelectedValues,\n selectedKey,\n selectedValueMap,\n ]\n );\n}\n\nexport default usePickerWithSelectedValues;\n"],"mappings":"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"}
|
|
@@ -1,16 +1,26 @@
|
|
|
1
1
|
import type { dh } from '@deephaven/jsapi-types';
|
|
2
2
|
import { FilterConditionFactory } from '@deephaven/jsapi-utils';
|
|
3
|
-
import { UseViewportDataResult } from './useViewportData';
|
|
4
|
-
export interface
|
|
5
|
-
|
|
3
|
+
import { UseViewportDataProps, UseViewportDataResult } from './useViewportData';
|
|
4
|
+
export interface UseSearchableViewportDataProps<TData> extends UseViewportDataProps<TData, dh.Table> {
|
|
5
|
+
additionalFilterConditionFactories?: FilterConditionFactory[];
|
|
6
|
+
searchColumnNames: string | string[];
|
|
7
|
+
timeZone: string;
|
|
8
|
+
}
|
|
9
|
+
export interface SearchableViewportData<TData> extends UseViewportDataResult<TData, dh.Table> {
|
|
6
10
|
onSearchTextChange: (searchText: string) => void;
|
|
7
11
|
}
|
|
8
12
|
/**
|
|
9
13
|
* Use a viewport data list with a search text filter. Supports additional filters.
|
|
10
|
-
* @param
|
|
14
|
+
* @param table The table to use
|
|
15
|
+
* @param itemHeight The height of each item
|
|
16
|
+
* @param scrollDebounce The debounce time for scroll events
|
|
17
|
+
* @param viewportSize The size of the viewport
|
|
18
|
+
* @param viewportPadding The padding around the viewport
|
|
19
|
+
* @param deserializeRow The row deserializer
|
|
11
20
|
* @param searchColumnNames The column names to search
|
|
21
|
+
* @param timeZone Timezone to use for date parsing
|
|
12
22
|
* @param additionalFilterConditionFactories Additional filter condition factories
|
|
13
23
|
*/
|
|
14
|
-
export declare function useSearchableViewportData<TData>(
|
|
24
|
+
export declare function useSearchableViewportData<TData>({ additionalFilterConditionFactories, searchColumnNames, timeZone, ...props }: UseSearchableViewportDataProps<TData>): SearchableViewportData<TData>;
|
|
15
25
|
export default useSearchableViewportData;
|
|
16
26
|
//# sourceMappingURL=useSearchableViewportData.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSearchableViewportData.d.ts","sourceRoot":"","sources":["../src/useSearchableViewportData.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAEL,sBAAsB,EACvB,MAAM,wBAAwB,CAAC;AAShC,OAAwB,
|
|
1
|
+
{"version":3,"file":"useSearchableViewportData.d.ts","sourceRoot":"","sources":["../src/useSearchableViewportData.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,wBAAwB,CAAC;AACjD,OAAO,EAEL,sBAAsB,EACvB,MAAM,wBAAwB,CAAC;AAShC,OAAwB,EACtB,oBAAoB,EACpB,qBAAqB,EACtB,MAAM,mBAAmB,CAAC;AAI3B,MAAM,WAAW,8BAA8B,CAAC,KAAK,CACnD,SAAQ,oBAAoB,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC;IAC7C,kCAAkC,CAAC,EAAE,sBAAsB,EAAE,CAAC;IAC9D,iBAAiB,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IACrC,QAAQ,EAAE,MAAM,CAAC;CAClB;AAED,MAAM,WAAW,sBAAsB,CAAC,KAAK,CAC3C,SAAQ,qBAAqB,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC;IAC9C,kBAAkB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CAClD;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,yBAAyB,CAAC,KAAK,EAAE,EAC/C,kCAAuC,EACvC,iBAAiB,EACjB,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,8BAA8B,CAAC,KAAK,CAAC,GAAG,sBAAsB,CAAC,KAAK,CAAC,CAwCvE;AAED,eAAe,yBAAyB,CAAC"}
|
|
@@ -1,3 +1,11 @@
|
|
|
1
|
+
var _excluded = ["additionalFilterConditionFactories", "searchColumnNames", "timeZone"];
|
|
2
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
3
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
4
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
5
|
+
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return typeof key === "symbol" ? key : String(key); }
|
|
6
|
+
function _toPrimitive(input, hint) { if (typeof input !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (typeof res !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
7
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
8
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
1
9
|
import { useMemo, useState } from 'react';
|
|
2
10
|
import { createSearchTextFilter } from '@deephaven/jsapi-utils';
|
|
3
11
|
import { SEARCH_DEBOUNCE_MS, TABLE_ROW_HEIGHT, VIEWPORT_PADDING, VIEWPORT_SIZE } from '@deephaven/utils';
|
|
@@ -8,30 +16,37 @@ import useFilterConditionFactories from "./useFilterConditionFactories.js";
|
|
|
8
16
|
import useViewportFilter from "./useViewportFilter.js";
|
|
9
17
|
/**
|
|
10
18
|
* Use a viewport data list with a search text filter. Supports additional filters.
|
|
11
|
-
* @param
|
|
19
|
+
* @param table The table to use
|
|
20
|
+
* @param itemHeight The height of each item
|
|
21
|
+
* @param scrollDebounce The debounce time for scroll events
|
|
22
|
+
* @param viewportSize The size of the viewport
|
|
23
|
+
* @param viewportPadding The padding around the viewport
|
|
24
|
+
* @param deserializeRow The row deserializer
|
|
12
25
|
* @param searchColumnNames The column names to search
|
|
26
|
+
* @param timeZone Timezone to use for date parsing
|
|
13
27
|
* @param additionalFilterConditionFactories Additional filter condition factories
|
|
14
28
|
*/
|
|
15
|
-
export function useSearchableViewportData(
|
|
29
|
+
export function useSearchableViewportData(_ref) {
|
|
30
|
+
var {
|
|
31
|
+
additionalFilterConditionFactories = [],
|
|
32
|
+
searchColumnNames,
|
|
33
|
+
timeZone
|
|
34
|
+
} = _ref,
|
|
35
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
16
36
|
var tableUtils = useTableUtils();
|
|
17
37
|
var [searchText, setSearchText] = useState('');
|
|
18
|
-
var searchTextFilter = useMemo(() => createSearchTextFilter(tableUtils, searchColumnNames, searchText), [searchColumnNames, searchText, tableUtils]);
|
|
38
|
+
var searchTextFilter = useMemo(() => createSearchTextFilter(tableUtils, searchColumnNames, searchText, timeZone), [searchColumnNames, searchText, tableUtils, timeZone]);
|
|
19
39
|
var onSearchTextChange = useDebouncedCallback(setSearchText, SEARCH_DEBOUNCE_MS);
|
|
20
|
-
var list = useViewportData({
|
|
21
|
-
table: maybeTable,
|
|
40
|
+
var list = useViewportData(_objectSpread({
|
|
22
41
|
itemHeight: TABLE_ROW_HEIGHT,
|
|
23
42
|
viewportSize: VIEWPORT_SIZE,
|
|
24
43
|
viewportPadding: VIEWPORT_PADDING
|
|
25
|
-
});
|
|
26
|
-
for (var _len = arguments.length, additionalFilterConditionFactories = new Array(_len > 2 ? _len - 2 : 0), _key = 2; _key < _len; _key++) {
|
|
27
|
-
additionalFilterConditionFactories[_key - 2] = arguments[_key];
|
|
28
|
-
}
|
|
44
|
+
}, props));
|
|
29
45
|
var filter = useFilterConditionFactories(list.table, searchTextFilter, ...additionalFilterConditionFactories);
|
|
30
46
|
useViewportFilter(list, filter);
|
|
31
|
-
return {
|
|
32
|
-
list,
|
|
47
|
+
return _objectSpread(_objectSpread({}, list), {}, {
|
|
33
48
|
onSearchTextChange
|
|
34
|
-
};
|
|
49
|
+
});
|
|
35
50
|
}
|
|
36
51
|
export default useSearchableViewportData;
|
|
37
52
|
//# sourceMappingURL=useSearchableViewportData.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useSearchableViewportData.js","names":["useMemo","useState","createSearchTextFilter","SEARCH_DEBOUNCE_MS","TABLE_ROW_HEIGHT","VIEWPORT_PADDING","VIEWPORT_SIZE","useDebouncedCallback","useTableUtils","useViewportData","useFilterConditionFactories","useViewportFilter","useSearchableViewportData","
|
|
1
|
+
{"version":3,"file":"useSearchableViewportData.js","names":["useMemo","useState","createSearchTextFilter","SEARCH_DEBOUNCE_MS","TABLE_ROW_HEIGHT","VIEWPORT_PADDING","VIEWPORT_SIZE","useDebouncedCallback","useTableUtils","useViewportData","useFilterConditionFactories","useViewportFilter","useSearchableViewportData","_ref","additionalFilterConditionFactories","searchColumnNames","timeZone","props","_objectWithoutProperties","_excluded","tableUtils","searchText","setSearchText","searchTextFilter","onSearchTextChange","list","_objectSpread","itemHeight","viewportSize","viewportPadding","filter","table"],"sources":["../src/useSearchableViewportData.ts"],"sourcesContent":["import { useMemo, useState } from 'react';\nimport type { dh } from '@deephaven/jsapi-types';\nimport {\n createSearchTextFilter,\n FilterConditionFactory,\n} from '@deephaven/jsapi-utils';\nimport {\n SEARCH_DEBOUNCE_MS,\n TABLE_ROW_HEIGHT,\n VIEWPORT_PADDING,\n VIEWPORT_SIZE,\n} from '@deephaven/utils';\nimport { useDebouncedCallback } from '@deephaven/react-hooks';\nimport { useTableUtils } from './useTableUtils';\nimport useViewportData, {\n UseViewportDataProps,\n UseViewportDataResult,\n} from './useViewportData';\nimport useFilterConditionFactories from './useFilterConditionFactories';\nimport useViewportFilter from './useViewportFilter';\n\nexport interface UseSearchableViewportDataProps<TData>\n extends UseViewportDataProps<TData, dh.Table> {\n additionalFilterConditionFactories?: FilterConditionFactory[];\n searchColumnNames: string | string[];\n timeZone: string;\n}\n\nexport interface SearchableViewportData<TData>\n extends UseViewportDataResult<TData, dh.Table> {\n onSearchTextChange: (searchText: string) => void;\n}\n\n/**\n * Use a viewport data list with a search text filter. Supports additional filters.\n * @param table The table to use\n * @param itemHeight The height of each item\n * @param scrollDebounce The debounce time for scroll events\n * @param viewportSize The size of the viewport\n * @param viewportPadding The padding around the viewport\n * @param deserializeRow The row deserializer\n * @param searchColumnNames The column names to search\n * @param timeZone Timezone to use for date parsing\n * @param additionalFilterConditionFactories Additional filter condition factories\n */\nexport function useSearchableViewportData<TData>({\n additionalFilterConditionFactories = [],\n searchColumnNames,\n timeZone,\n ...props\n}: UseSearchableViewportDataProps<TData>): SearchableViewportData<TData> {\n const tableUtils = useTableUtils();\n\n const [searchText, setSearchText] = useState<string>('');\n\n const searchTextFilter = useMemo(\n () =>\n createSearchTextFilter(\n tableUtils,\n searchColumnNames,\n searchText,\n timeZone\n ),\n [searchColumnNames, searchText, tableUtils, timeZone]\n );\n\n const onSearchTextChange = useDebouncedCallback(\n setSearchText,\n SEARCH_DEBOUNCE_MS\n );\n\n const list = useViewportData<TData, dh.Table>({\n itemHeight: TABLE_ROW_HEIGHT,\n viewportSize: VIEWPORT_SIZE,\n viewportPadding: VIEWPORT_PADDING,\n ...props,\n });\n\n const filter = useFilterConditionFactories(\n list.table,\n searchTextFilter,\n ...additionalFilterConditionFactories\n );\n\n useViewportFilter(list, filter);\n\n return {\n ...list,\n onSearchTextChange,\n };\n}\n\nexport default useSearchableViewportData;\n"],"mappings":";;;;;;;;AAAA,SAASA,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AAEzC,SACEC,sBAAsB,QAEjB,wBAAwB;AAC/B,SACEC,kBAAkB,EAClBC,gBAAgB,EAChBC,gBAAgB,EAChBC,aAAa,QACR,kBAAkB;AACzB,SAASC,oBAAoB,QAAQ,wBAAwB;AAAC,SACrDC,aAAa;AAAA,OACfC,eAAe;AAAA,OAIfC,2BAA2B;AAAA,OAC3BC,iBAAiB;AAcxB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,yBAAyBA,CAAAC,IAAA,EAKgC;EAAA,IALxB;MAC/CC,kCAAkC,GAAG,EAAE;MACvCC,iBAAiB;MACjBC;IAEqC,CAAC,GAAAH,IAAA;IADnCI,KAAK,GAAAC,wBAAA,CAAAL,IAAA,EAAAM,SAAA;EAER,IAAMC,UAAU,GAAGZ,aAAa,CAAC,CAAC;EAElC,IAAM,CAACa,UAAU,EAAEC,aAAa,CAAC,GAAGrB,QAAQ,CAAS,EAAE,CAAC;EAExD,IAAMsB,gBAAgB,GAAGvB,OAAO,CAC9B,MACEE,sBAAsB,CACpBkB,UAAU,EACVL,iBAAiB,EACjBM,UAAU,EACVL,QACF,CAAC,EACH,CAACD,iBAAiB,EAAEM,UAAU,EAAED,UAAU,EAAEJ,QAAQ,CACtD,CAAC;EAED,IAAMQ,kBAAkB,GAAGjB,oBAAoB,CAC7Ce,aAAa,EACbnB,kBACF,CAAC;EAED,IAAMsB,IAAI,GAAGhB,eAAe,CAAAiB,aAAA;IAC1BC,UAAU,EAAEvB,gBAAgB;IAC5BwB,YAAY,EAAEtB,aAAa;IAC3BuB,eAAe,EAAExB;EAAgB,GAC9BY,KAAK,CACT,CAAC;EAEF,IAAMa,MAAM,GAAGpB,2BAA2B,CACxCe,IAAI,CAACM,KAAK,EACVR,gBAAgB,EAChB,GAAGT,kCACL,CAAC;EAEDH,iBAAiB,CAACc,IAAI,EAAEK,MAAM,CAAC;EAE/B,OAAAJ,aAAA,CAAAA,aAAA,KACKD,IAAI;IACPD;EAAkB;AAEtB;AAEA,eAAeZ,yBAAyB"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@deephaven/jsapi-components",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.84.0",
|
|
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.
|
|
26
|
-
"@deephaven/jsapi-bootstrap": "^0.
|
|
25
|
+
"@deephaven/components": "^0.84.0",
|
|
26
|
+
"@deephaven/jsapi-bootstrap": "^0.84.0",
|
|
27
27
|
"@deephaven/jsapi-types": "1.0.0-dev0.34.0",
|
|
28
|
-
"@deephaven/jsapi-utils": "^0.
|
|
29
|
-
"@deephaven/log": "^0.
|
|
30
|
-
"@deephaven/react-hooks": "^0.
|
|
31
|
-
"@deephaven/utils": "^0.
|
|
28
|
+
"@deephaven/jsapi-utils": "^0.84.0",
|
|
29
|
+
"@deephaven/log": "^0.84.0",
|
|
30
|
+
"@deephaven/react-hooks": "^0.84.0",
|
|
31
|
+
"@deephaven/utils": "^0.84.0",
|
|
32
32
|
"@types/js-cookie": "^3.0.3",
|
|
33
33
|
"classnames": "^2.3.2",
|
|
34
34
|
"js-cookie": "^3.0.5",
|
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
"prop-types": "^15.8.1"
|
|
37
37
|
},
|
|
38
38
|
"devDependencies": {
|
|
39
|
-
"@deephaven/jsapi-shim": "^0.
|
|
39
|
+
"@deephaven/jsapi-shim": "^0.84.0",
|
|
40
40
|
"react-test-renderer": "^17.0.2"
|
|
41
41
|
},
|
|
42
42
|
"peerDependencies": {
|
|
@@ -51,5 +51,5 @@
|
|
|
51
51
|
"publishConfig": {
|
|
52
52
|
"access": "public"
|
|
53
53
|
},
|
|
54
|
-
"gitHead": "
|
|
54
|
+
"gitHead": "22fc1939f0dc5b42b4a7fa5d16556548519eeb6b"
|
|
55
55
|
}
|