@gooddata/sdk-ui-semantic-search 10.29.0-alpha.8 → 10.29.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/esm/SearchResultsDropdownList.d.ts.map +1 -1
- package/esm/SearchResultsDropdownList.js +5 -4
- package/esm/SearchResultsDropdownList.js.map +1 -1
- package/esm/hooks/index.d.ts +2 -0
- package/esm/hooks/index.d.ts.map +1 -1
- package/esm/hooks/index.js +3 -1
- package/esm/hooks/index.js.map +1 -1
- package/esm/hooks/useListScroll.d.ts +2 -0
- package/esm/hooks/useListScroll.d.ts.map +1 -0
- package/esm/hooks/useListScroll.js +24 -0
- package/esm/hooks/useListScroll.js.map +1 -0
- package/esm/hooks/useListSelector.d.ts +1 -1
- package/esm/hooks/useListSelector.d.ts.map +1 -1
- package/esm/hooks/useListSelector.js +5 -2
- package/esm/hooks/useListSelector.js.map +1 -1
- package/esm/internal/SearchList.d.ts.map +1 -1
- package/esm/internal/SearchList.js +5 -4
- package/esm/internal/SearchList.js.map +1 -1
- package/package.json +9 -9
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SearchResultsDropdownList.d.ts","sourceRoot":"","sources":["../src/SearchResultsDropdownList.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,qBAAqB,CAAC;AAIhE,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAKtC;;;GAGG;AACH,KAAK,8BAA8B,GAAG;IAClC;;OAEG;IACH,aAAa,EAAE,QAAQ,CAAC,yBAAyB,CAAC,EAAE,CAAC;IACrD;;OAEG;IACH,aAAa,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,QAAQ,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,yBAAyB,KAAK,IAAI,CAAC;CACvD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,yBAAyB,EAAE,KAAK,CAAC,EAAE,CAAC,8BAA8B,
|
1
|
+
{"version":3,"file":"SearchResultsDropdownList.d.ts","sourceRoot":"","sources":["../src/SearchResultsDropdownList.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,yBAAyB,EAAE,MAAM,qBAAqB,CAAC;AAIhE,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAKtC;;;GAGG;AACH,KAAK,8BAA8B,GAAG;IAClC;;OAEG;IACH,aAAa,EAAE,QAAQ,CAAC,yBAAyB,CAAC,EAAE,CAAC;IACrD;;OAEG;IACH,aAAa,EAAE,OAAO,CAAC;IACvB;;OAEG;IACH,QAAQ,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,KAAK,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,yBAAyB,KAAK,IAAI,CAAC;CACvD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,yBAAyB,EAAE,KAAK,CAAC,EAAE,CAAC,8BAA8B,CAiC9E,CAAC"}
|
@@ -1,8 +1,8 @@
|
|
1
|
-
// (C) 2024 GoodData Corporation
|
1
|
+
// (C) 2024-2025 GoodData Corporation
|
2
2
|
import * as React from "react";
|
3
3
|
import { DropdownList } from "@gooddata/sdk-ui-kit";
|
4
4
|
import { ResultsItem } from "./ResultsItem.js";
|
5
|
-
import { useListSelector } from "./hooks/index.js";
|
5
|
+
import { useListScroll, useListSelector } from "./hooks/index.js";
|
6
6
|
const ITEM_HEIGHT = 50;
|
7
7
|
const MAX_ITEMS_UNSCROLLED = 5;
|
8
8
|
/**
|
@@ -11,8 +11,9 @@ const MAX_ITEMS_UNSCROLLED = 5;
|
|
11
11
|
*/
|
12
12
|
export const SearchResultsDropdownList = ({ searchResults, searchLoading, isMobile, width, onSelect, }) => {
|
13
13
|
const onListItemSelect = (item) => onSelect(item.item);
|
14
|
-
const [active, setActive] = useListSelector(searchResults, onListItemSelect);
|
15
|
-
|
14
|
+
const [active, setActive, direction] = useListSelector(searchResults, onListItemSelect);
|
15
|
+
const [scrollToItem, scrollDirection] = useListScroll(active, direction);
|
16
|
+
return (React.createElement(DropdownList, { width: width, height: ITEM_HEIGHT * Math.min(searchResults.length, MAX_ITEMS_UNSCROLLED), isMobile: isMobile, isLoading: searchLoading, itemHeight: ITEM_HEIGHT, scrollToItem: scrollToItem, scrollDirection: scrollDirection, renderItem: ({ item }) => {
|
16
17
|
return (React.createElement(ResultsItem, { listItem: item, isActive: active === item, setActive: setActive, onSelect: onListItemSelect }));
|
17
18
|
}, items: searchResults }));
|
18
19
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SearchResultsDropdownList.js","sourceRoot":"","sources":["../src/SearchResultsDropdownList.tsx"],"names":[],"mappings":"AAAA,
|
1
|
+
{"version":3,"file":"SearchResultsDropdownList.js","sourceRoot":"","sources":["../src/SearchResultsDropdownList.tsx"],"names":[],"mappings":"AAAA,qCAAqC;AAErC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AACpD,OAAO,EAAE,WAAW,EAAE,MAAM,kBAAkB,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,kBAAkB,CAAC;AAGlE,MAAM,WAAW,GAAG,EAAE,CAAC;AACvB,MAAM,oBAAoB,GAAG,CAAC,CAAC;AA6B/B;;;GAGG;AACH,MAAM,CAAC,MAAM,yBAAyB,GAA6C,CAAC,EAChF,aAAa,EACb,aAAa,EACb,QAAQ,EACR,KAAK,EACL,QAAQ,GACX,EAAE,EAAE;IACD,MAAM,gBAAgB,GAAG,CAAC,IAAyC,EAAE,EAAE,CAAC,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;IAC5F,MAAM,CAAC,MAAM,EAAE,SAAS,EAAE,SAAS,CAAC,GAAG,eAAe,CAAC,aAAa,EAAE,gBAAgB,CAAC,CAAC;IACxF,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,aAAa,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IAEzE,OAAO,CACH,oBAAC,YAAY,IACT,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,aAAa,CAAC,MAAM,EAAE,oBAAoB,CAAC,EAC1E,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,aAAa,EACxB,UAAU,EAAE,WAAW,EACvB,YAAY,EAAE,YAAY,EAC1B,eAAe,EAAE,eAAe,EAChC,UAAU,EAAE,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE;YACrB,OAAO,CACH,oBAAC,WAAW,IACR,QAAQ,EAAE,IAAI,EACd,QAAQ,EAAE,MAAM,KAAK,IAAI,EACzB,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,gBAAgB,GAC5B,CACL,CAAC;QACN,CAAC,EACD,KAAK,EAAE,aAAa,GACtB,CACL,CAAC;AACN,CAAC,CAAC"}
|
package/esm/hooks/index.d.ts
CHANGED
package/esm/hooks/index.d.ts.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAEA,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,sBAAsB,CAAC"}
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAEA,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC"}
|
package/esm/hooks/index.js
CHANGED
@@ -1,5 +1,7 @@
|
|
1
|
-
// (C) 2024 GoodData Corporation
|
1
|
+
// (C) 2024-2025 GoodData Corporation
|
2
2
|
export * from "./useSemanticSearch.js";
|
3
3
|
export * from "./useListSelector.js";
|
4
|
+
export * from "./useListScroll.js";
|
5
|
+
export * from "./useSearchMetrics.js";
|
4
6
|
export * from "./useElementWidth.js";
|
5
7
|
//# sourceMappingURL=index.js.map
|
package/esm/hooks/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/hooks/index.ts"],"names":[],"mappings":"AAAA,qCAAqC;AAErC,cAAc,wBAAwB,CAAC;AACvC,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,CAAC;AACnC,cAAc,uBAAuB,CAAC;AACtC,cAAc,sBAAsB,CAAC"}
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"useListScroll.d.ts","sourceRoot":"","sources":["../../src/hooks/useListScroll.ts"],"names":[],"mappings":"AAWA,wBAAgB,aAAa,CAAC,CAAC,EAAE,QAAQ,EAAE,CAAC,EAAE,SAAS,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,2BAe/D"}
|
@@ -0,0 +1,24 @@
|
|
1
|
+
// (C) 2025 GoodData Corporation
|
2
|
+
import * as React from "react";
|
3
|
+
import { useLayoutEffect } from "react";
|
4
|
+
/*
|
5
|
+
* This is the timeout used to wait for the list to change state
|
6
|
+
* before scrolling to the selected item. It will feel more
|
7
|
+
* natural to the user.
|
8
|
+
*/
|
9
|
+
const timeout = 30;
|
10
|
+
export function useListScroll(selected, direction) {
|
11
|
+
const [scrollTo, setScrollTo] = React.useState(undefined);
|
12
|
+
const [scrollDirection, setScrollDirection] = React.useState(1);
|
13
|
+
useLayoutEffect(() => {
|
14
|
+
const tm = setTimeout(() => {
|
15
|
+
setScrollTo(selected);
|
16
|
+
setScrollDirection(direction ?? 1);
|
17
|
+
}, timeout);
|
18
|
+
return () => {
|
19
|
+
clearTimeout(tm);
|
20
|
+
};
|
21
|
+
}, [selected, direction]);
|
22
|
+
return [scrollTo, scrollDirection];
|
23
|
+
}
|
24
|
+
//# sourceMappingURL=useListScroll.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"file":"useListScroll.js","sourceRoot":"","sources":["../../src/hooks/useListScroll.ts"],"names":[],"mappings":"AAAA,gCAAgC;AAChC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,eAAe,EAAE,MAAM,OAAO,CAAC;AAExC;;;;GAIG;AACH,MAAM,OAAO,GAAG,EAAE,CAAC;AAEnB,MAAM,UAAU,aAAa,CAAI,QAAW,EAAE,SAAkB;IAC5D,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAgB,SAAS,CAAC,CAAC;IACzE,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAS,CAAC,CAAC,CAAC;IAExE,eAAe,CAAC,GAAG,EAAE;QACjB,MAAM,EAAE,GAAG,UAAU,CAAC,GAAG,EAAE;YACvB,WAAW,CAAC,QAAQ,CAAC,CAAC;YACtB,kBAAkB,CAAC,SAAS,IAAI,CAAC,CAAC,CAAC;QACvC,CAAC,EAAE,OAAO,CAAC,CAAC;QACZ,OAAO,GAAG,EAAE;YACR,YAAY,CAAC,EAAE,CAAC,CAAC;QACrB,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC,CAAC;IAE1B,OAAO,CAAC,QAAQ,EAAE,eAAe,CAA4B,CAAC;AAClE,CAAC"}
|
@@ -3,5 +3,5 @@
|
|
3
3
|
* calls the onSelect callback when Enter is pressed.
|
4
4
|
* @internal
|
5
5
|
*/
|
6
|
-
export declare const useListSelector: <T>(items: T[], onSelect: (item: T, e: MouseEvent | KeyboardEvent) => void) => [T, (item: T) => void];
|
6
|
+
export declare const useListSelector: <T>(items: T[], onSelect: (item: T, e: MouseEvent | KeyboardEvent) => void) => [T, (item: T) => void, 1 | -1];
|
7
7
|
//# sourceMappingURL=useListSelector.d.ts.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useListSelector.d.ts","sourceRoot":"","sources":["../../src/hooks/useListSelector.ts"],"names":[],"mappings":"AAIA;;;;GAIG;AACH,eAAO,MAAM,eAAe,yCAED,UAAU,GAAG,aAAa,KAAK,IAAI,
|
1
|
+
{"version":3,"file":"useListSelector.d.ts","sourceRoot":"","sources":["../../src/hooks/useListSelector.ts"],"names":[],"mappings":"AAIA;;;;GAIG;AACH,eAAO,MAAM,eAAe,yCAED,UAAU,GAAG,aAAa,KAAK,IAAI,sBA8Ce,IAAI,SAChF,CAAC"}
|
@@ -1,4 +1,4 @@
|
|
1
|
-
// (C) 2024 GoodData Corporation
|
1
|
+
// (C) 2024-2025 GoodData Corporation
|
2
2
|
import * as React from "react";
|
3
3
|
/**
|
4
4
|
* This hook provides keyboard navigation for a list of items. It listens to ArrowUp, ArrowDown and Enter keys and
|
@@ -7,6 +7,7 @@ import * as React from "react";
|
|
7
7
|
*/
|
8
8
|
export const useListSelector = (items, onSelect) => {
|
9
9
|
const [selected, setSelected] = React.useState(0);
|
10
|
+
const [direction, setDirection] = React.useState(1);
|
10
11
|
React.useEffect(() => {
|
11
12
|
setSelected(0);
|
12
13
|
}, [items]);
|
@@ -21,9 +22,11 @@ export const useListSelector = (items, onSelect) => {
|
|
21
22
|
switch (event.key) {
|
22
23
|
case "ArrowDown":
|
23
24
|
setIndex(selected + 1);
|
25
|
+
setDirection(1);
|
24
26
|
break;
|
25
27
|
case "ArrowUp":
|
26
28
|
setIndex(selected - 1);
|
29
|
+
setDirection(-1);
|
27
30
|
break;
|
28
31
|
case "Enter":
|
29
32
|
onSelect(items[selected], event);
|
@@ -37,6 +40,6 @@ export const useListSelector = (items, onSelect) => {
|
|
37
40
|
document.removeEventListener("keydown", listener);
|
38
41
|
};
|
39
42
|
}, [items, onSelect, selected]);
|
40
|
-
return [items[selected], setSelectedItem];
|
43
|
+
return [items[selected], setSelectedItem, direction];
|
41
44
|
};
|
42
45
|
//# sourceMappingURL=useListSelector.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"useListSelector.js","sourceRoot":"","sources":["../../src/hooks/useListSelector.ts"],"names":[],"mappings":"AAAA,
|
1
|
+
{"version":3,"file":"useListSelector.js","sourceRoot":"","sources":["../../src/hooks/useListSelector.ts"],"names":[],"mappings":"AAAA,qCAAqC;AAErC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B;;;;GAIG;AACH,MAAM,CAAC,MAAM,eAAe,GAAG,CAC3B,KAAe,EACf,QAA0D,EAC5D,EAAE;IACA,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAS,CAAC,CAAC,CAAC;IAC1D,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAS,CAAC,CAAC,CAAC;IAE5D,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,WAAW,CAAC,CAAC,CAAC,CAAC;IACnB,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IACZ,MAAM,eAAe,GAAG,KAAK,CAAC,WAAW,CACrC,CAAC,IAAO,EAAE,EAAE;QACR,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;IAC9E,CAAC,EACD,CAAC,KAAK,CAAC,CACV,CAAC;IAEF,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;QACjB,MAAM,QAAQ,GAAG,CAAC,KAAoB,EAAE,EAAE;YACtC,IAAI,CAAC,WAAW,EAAE,SAAS,EAAE,OAAO,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC;gBAAE,OAAO;YAExE,MAAM,QAAQ,GAAG,CAAC,KAAa,EAAE,EAAE,CAAC,WAAW,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC;YAEhG,QAAQ,KAAK,CAAC,GAAG,EAAE,CAAC;gBAChB,KAAK,WAAW;oBACZ,QAAQ,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;oBACvB,YAAY,CAAC,CAAC,CAAC,CAAC;oBAChB,MAAM;gBACV,KAAK,SAAS;oBACV,QAAQ,CAAC,QAAQ,GAAG,CAAC,CAAC,CAAC;oBACvB,YAAY,CAAC,CAAC,CAAC,CAAC,CAAC;oBACjB,MAAM;gBACV,KAAK,OAAO;oBACR,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,KAAK,CAAC,CAAC;YACzC,CAAC;YAED,KAAK,CAAC,wBAAwB,EAAE,CAAC;YACjC,KAAK,CAAC,cAAc,EAAE,CAAC;QAC3B,CAAC,CAAC;QAEF,2DAA2D;QAC3D,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;QAE/C,OAAO,GAAG,EAAE;YACR,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,QAAQ,CAAC,CAAC;QACtD,CAAC,CAAC;IACN,CAAC,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC,CAAC;IAEhC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,eAAe,EAAE,SAAS,CAAmC,CAAC;AAC3F,CAAC,CAAC"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SearchList.d.ts","sourceRoot":"","sources":["../../src/internal/SearchList.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAKtD;;;GAGG;AACH,MAAM,MAAM,eAAe,CAAC,CAAC,IAAI;IAC7B;;OAEG;IACH,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,UAAU,GAAG,aAAa,KAAK,IAAI,CAAC;IACrE;;OAEG;IACH,aAAa,EAAE,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC;CACxD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,UAAU,
|
1
|
+
{"version":3,"file":"SearchList.d.ts","sourceRoot":"","sources":["../../src/internal/SearchList.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,aAAa,CAAC;AAKtD;;;GAGG;AACH,MAAM,MAAM,eAAe,CAAC,CAAC,IAAI;IAC7B;;OAEG;IACH,KAAK,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC;IACrB;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,QAAQ,EAAE,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,UAAU,GAAG,aAAa,KAAK,IAAI,CAAC;IACrE;;OAEG;IACH,aAAa,EAAE,KAAK,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,CAAC;CACxD,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,UAAU,yFAwBtB,CAAC"}
|
@@ -1,7 +1,7 @@
|
|
1
|
-
// (C) 2024 GoodData Corporation
|
1
|
+
// (C) 2024-2025 GoodData Corporation
|
2
2
|
import * as React from "react";
|
3
3
|
import { List } from "@gooddata/sdk-ui-kit";
|
4
|
-
import { useListSelector } from "../hooks/index.js";
|
4
|
+
import { useListScroll, useListSelector } from "../hooks/index.js";
|
5
5
|
const ITEM_HEIGHT = 50;
|
6
6
|
const MAX_ITEMS_UNSCROLLED = 10;
|
7
7
|
/**
|
@@ -9,8 +9,9 @@ const MAX_ITEMS_UNSCROLLED = 10;
|
|
9
9
|
* @internal
|
10
10
|
*/
|
11
11
|
export const SearchList = ({ items, width, onSelect, ItemComponent }) => {
|
12
|
-
const [selected, setSelected] = useListSelector(items, onSelect);
|
13
|
-
|
12
|
+
const [selected, setSelected, direction] = useListSelector(items, onSelect);
|
13
|
+
const [scrollToItem, scrollDirection] = useListScroll(selected, direction);
|
14
|
+
return (React.createElement(List, { width: width, height: ITEM_HEIGHT * Math.min(items.length, MAX_ITEMS_UNSCROLLED), itemHeight: ITEM_HEIGHT, scrollToItem: scrollToItem, scrollDirection: scrollDirection, renderItem: ({ item }) => {
|
14
15
|
return (React.createElement(ItemComponent, { listItem: item, isActive: item === selected, setActive: setSelected, onSelect: onSelect }));
|
15
16
|
}, items: items }));
|
16
17
|
};
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"SearchList.js","sourceRoot":"","sources":["../../src/internal/SearchList.tsx"],"names":[],"mappings":"AAAA,
|
1
|
+
{"version":3,"file":"SearchList.js","sourceRoot":"","sources":["../../src/internal/SearchList.tsx"],"names":[],"mappings":"AAAA,qCAAqC;AAErC,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAGnE,MAAM,WAAW,GAAG,EAAE,CAAC;AACvB,MAAM,oBAAoB,GAAG,EAAE,CAAC;AAyBhC;;;GAGG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAK,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,aAAa,EAAsB,EAAE,EAAE;IAC5F,MAAM,CAAC,QAAQ,EAAE,WAAW,EAAE,SAAS,CAAC,GAAG,eAAe,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC;IAC5E,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,aAAa,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;IAE3E,OAAO,CACH,oBAAC,IAAI,IACD,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,WAAW,GAAG,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,MAAM,EAAE,oBAAoB,CAAC,EAClE,UAAU,EAAE,WAAW,EACvB,YAAY,EAAE,YAAY,EAC1B,eAAe,EAAE,eAAe,EAChC,UAAU,EAAE,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE;YACrB,OAAO,CACH,oBAAC,aAAa,IACV,QAAQ,EAAE,IAAI,EACd,QAAQ,EAAE,IAAI,KAAK,QAAQ,EAC3B,SAAS,EAAE,WAAW,EACtB,QAAQ,EAAE,QAAQ,GACpB,CACL,CAAC;QACN,CAAC,EACD,KAAK,EAAE,KAAK,GACd,CACL,CAAC;AACN,CAAC,CAAC"}
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "@gooddata/sdk-ui-semantic-search",
|
3
|
-
"version": "10.29.0
|
3
|
+
"version": "10.29.0",
|
4
4
|
"description": "GoodData SDK TypeScript & React skeleton",
|
5
5
|
"repository": {
|
6
6
|
"type": "git",
|
@@ -38,12 +38,12 @@
|
|
38
38
|
"react-intl": "^6.4.1",
|
39
39
|
"tslib": "^2.5.0",
|
40
40
|
"classnames": "^2.3.1",
|
41
|
-
"@gooddata/sdk-
|
42
|
-
"@gooddata/sdk-ui": "10.29.0
|
43
|
-
"@gooddata/sdk-
|
44
|
-
"@gooddata/sdk-
|
45
|
-
"@gooddata/sdk-ui-kit": "10.29.0
|
46
|
-
"@gooddata/util": "10.29.0
|
41
|
+
"@gooddata/sdk-backend-spi": "10.29.0",
|
42
|
+
"@gooddata/sdk-ui-theme-provider": "10.29.0",
|
43
|
+
"@gooddata/sdk-ui": "10.29.0",
|
44
|
+
"@gooddata/sdk-model": "10.29.0",
|
45
|
+
"@gooddata/sdk-ui-kit": "10.29.0",
|
46
|
+
"@gooddata/util": "10.29.0"
|
47
47
|
},
|
48
48
|
"peerDependencies": {
|
49
49
|
"react": "^16.10.0 || ^17.0.0 || ^18.0.0",
|
@@ -85,8 +85,8 @@
|
|
85
85
|
"stylelint": "^13.8.0",
|
86
86
|
"stylelint-checkstyle-formatter": "^0.1.2",
|
87
87
|
"stylelint-config-prettier": "^8.0.2",
|
88
|
-
"@gooddata/i18n-toolkit": "10.29.0
|
89
|
-
"@gooddata/sdk-backend-mockingbird": "10.29.0
|
88
|
+
"@gooddata/i18n-toolkit": "10.29.0",
|
89
|
+
"@gooddata/sdk-backend-mockingbird": "10.29.0"
|
90
90
|
},
|
91
91
|
"scripts": {
|
92
92
|
"clean": "rm -rf ci dist esm coverage *.log styles/css tsconfig.tsbuildinfo",
|