Skip to content

Commit 9a38842

Browse files
francoischalifourfrancoischalifour
committed
feat: update Autocomplete version
1 parent 371c788 commit 9a38842

12 files changed

Lines changed: 3431 additions & 3060 deletions

‎.eslintrc.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ module.exports = {
2424
'react/no-unescaped-entities': 0,
2525
'eslint-comments/disable-enable-pair': ['error', { allowWholeFile: true }],
2626
'import/extensions': 0,
27+
'no-unused-expressions': 0,
2728
complexity: 0,
2829
'import/order': [
2930
'error',

‎bundlesize.config.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,11 @@
66
},
77
{
88
"path": "packages/docsearch-react/dist/umd/index.js",
9-
"maxSize": "17 kB"
9+
"maxSize": "18 kB"
1010
},
1111
{
1212
"path": "packages/docsearch-js/dist/umd/index.js",
13-
"maxSize": "24 kB"
13+
"maxSize": "24.5 kB"
1414
}
1515
]
1616
}

‎packages/docsearch-react/package.json‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -35,9 +35,9 @@
3535
},
3636
"dependencies": {
3737
"@docsearch/css": "^1.0.0-alpha.28",
38-
"@francoischalifour/autocomplete-core": "^1.0.0-alpha.28",
39-
"@francoischalifour/autocomplete-preset-algolia": "^1.0.0-alpha.28",
40-
"algoliasearch": "^4.0.0"
38+
"@algolia/autocomplete-core": "^1.0.0-alpha.35",
39+
"@algolia/autocomplete-preset-algolia": "^1.0.0-alpha.35",
40+
"algoliasearch": "^4.8.0"
4141
},
4242
"peerDependencies": {
4343
"react": "^16.8.0",

‎packages/docsearch-react/src/DocSearch.tsx‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
import {
22
AutocompleteState,
3-
PublicAutocompleteOptions,
4-
} from '@francoischalifour/autocomplete-core';
3+
AutocompleteOptions,
4+
} from '@algolia/autocomplete-core';
55
import React from 'react';
66
import { createPortal } from 'react-dom';
77

@@ -16,7 +16,7 @@ import {
1616
import { useDocSearchKeyboardEvents } from './useDocSearchKeyboardEvents';
1717

1818
export interface DocSearchProps
19-
extends Pick<PublicAutocompleteOptions<InternalDocSearchHit>, 'navigator'> {
19+
extends Pick<AutocompleteOptions<InternalDocSearchHit>, 'navigator'> {
2020
appId?: string;
2121
apiKey: string;
2222
indexName: string;

‎packages/docsearch-react/src/DocSearchModal.tsx‎

Lines changed: 38 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import {
22
AutocompleteState,
33
createAutocomplete,
4-
} from '@francoischalifour/autocomplete-core';
5-
import { getAlgoliaResults } from '@francoischalifour/autocomplete-preset-algolia';
4+
} from '@algolia/autocomplete-core';
5+
import { getAlgoliaResults } from '@algolia/autocomplete-preset-algolia';
66
import React from 'react';
77

88
import { MAX_QUERY_SIZE } from './constants';
@@ -47,8 +47,13 @@ export function DocSearchModal({
4747
AutocompleteState<InternalDocSearchHit>
4848
>({
4949
query: '',
50-
suggestions: [],
51-
} as any);
50+
collections: [],
51+
completion: null,
52+
context: {},
53+
isOpen: false,
54+
selectedItemId: null,
55+
status: 'idle',
56+
});
5257

5358
const containerRef = React.useRef<HTMLDivElement | null>(null);
5459
const modalRef = React.useRef<HTMLDivElement | null>(null);
@@ -134,33 +139,39 @@ export function DocSearchModal({
134139

135140
return [
136141
{
137-
onSelect({ suggestion }) {
138-
saveRecentSearch(suggestion);
139-
onClose();
142+
onSelect({ item, event }) {
143+
saveRecentSearch(item);
144+
145+
if (!event.shiftKey && !event.ctrlKey && !event.metaKey) {
146+
onClose();
147+
}
140148
},
141-
getSuggestionUrl({ suggestion }) {
142-
return suggestion.url;
149+
getItemUrl({ item }) {
150+
return item.url;
143151
},
144-
getSuggestions() {
152+
getItems() {
145153
return recentSearches.getAll();
146154
},
147155
},
148156
{
149-
onSelect({ suggestion }) {
150-
saveRecentSearch(suggestion);
151-
onClose();
157+
onSelect({ item, event }) {
158+
saveRecentSearch(item);
159+
160+
if (!event.shiftKey && !event.ctrlKey && !event.metaKey) {
161+
onClose();
162+
}
152163
},
153-
getSuggestionUrl({ suggestion }) {
154-
return suggestion.url;
164+
getItemUrl({ item }) {
165+
return item.url;
155166
},
156-
getSuggestions() {
167+
getItems() {
157168
return favoriteSearches.getAll();
158169
},
159170
},
160171
];
161172
}
162173

163-
return getAlgoliaResults({
174+
return getAlgoliaResults<DocSearchHit>({
164175
searchClient,
165176
queries: [
166177
{
@@ -209,7 +220,7 @@ export function DocSearchModal({
209220
throw error;
210221
})
211222
.then((results) => {
212-
const hits: DocSearchHit[] = results[0].hits;
223+
const hits = results[0].hits;
213224
const nbHits: number = results[0].nbHits;
214225
const sources = groupBy(hits, (hit) => hit.hierarchy.lvl0);
215226

@@ -228,14 +239,17 @@ export function DocSearchModal({
228239

229240
return Object.values<DocSearchHit[]>(sources).map((items) => {
230241
return {
231-
onSelect({ suggestion }) {
232-
saveRecentSearch(suggestion);
233-
onClose();
242+
onSelect({ item, event }) {
243+
saveRecentSearch(item);
244+
245+
if (!event.shiftKey && !event.ctrlKey && !event.metaKey) {
246+
onClose();
247+
}
234248
},
235-
getSuggestionUrl({ suggestion }) {
236-
return suggestion.url;
249+
getItemUrl({ item }) {
250+
return item.url;
237251
},
238-
getSuggestions() {
252+
getItems() {
239253
return Object.values(
240254
groupBy(items, (item) => item.hierarchy.lvl1)
241255
)

‎packages/docsearch-react/src/Results.tsx‎

Lines changed: 7 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,4 @@
1-
import {
2-
AutocompleteApi,
3-
AutocompleteState,
4-
} from '@francoischalifour/autocomplete-core';
1+
import { AutocompleteApi, AutocompleteState } from '@algolia/autocomplete-core';
52
import React from 'react';
63

74
import { DocSearchProps } from './DocSearch';
@@ -16,7 +13,7 @@ interface ResultsProps<TItem>
1613
React.KeyboardEvent
1714
> {
1815
title: string;
19-
suggestion: AutocompleteState<TItem>['suggestions'][0];
16+
collection: AutocompleteState<TItem>['collections'][0];
2017
renderIcon(props: { item: TItem; index: number }): React.ReactNode;
2118
renderAction(props: {
2219
item: TItem;
@@ -30,16 +27,16 @@ interface ResultsProps<TItem>
3027
export function Results<TItem extends StoredDocSearchHit>(
3128
props: ResultsProps<TItem>
3229
) {
33-
if (!props.suggestion || props.suggestion.items.length === 0) {
30+
if (!props.collection || props.collection.items.length === 0) {
3431
return null;
3532
}
3633

3734
return (
3835
<section className="DocSearch-Hits">
3936
<div className="DocSearch-Hit-source">{props.title}</div>
4037

41-
<ul {...props.getMenuProps()}>
42-
{props.suggestion.items.map((item, index) => {
38+
<ul {...props.getListProps()}>
39+
{props.collection.items.map((item, index) => {
4340
return (
4441
<Result
4542
key={[props.title, item.objectID].join(':')}
@@ -66,7 +63,7 @@ function Result<TItem extends StoredDocSearchHit>({
6663
renderAction,
6764
getItemProps,
6865
onItemClick,
69-
suggestion,
66+
collection,
7067
hitComponent,
7168
}: ResultProps<TItem>) {
7269
const [isDeleting, setIsDeleting] = React.useState(false);
@@ -102,7 +99,7 @@ function Result<TItem extends StoredDocSearchHit>({
10299
}}
103100
{...getItemProps({
104101
item,
105-
source: suggestion.source,
102+
source: collection.source,
106103
onClick() {
107104
onItemClick(item);
108105
},

‎packages/docsearch-react/src/ResultsScreen.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,19 +10,19 @@ type ResultsScreenProps = ScreenStateProps<InternalDocSearchHit>;
1010
export function ResultsScreen(props: ResultsScreenProps) {
1111
return (
1212
<div className="DocSearch-Dropdown-Container">
13-
{props.state.suggestions.map((suggestion, index) => {
14-
if (suggestion.items.length === 0) {
13+
{props.state.collections.map((collection, index) => {
14+
if (collection.items.length === 0) {
1515
return null;
1616
}
1717

18-
const title = suggestion.items[0].hierarchy.lvl0;
18+
const title = collection.items[0].hierarchy.lvl0;
1919

2020
return (
2121
<Results
2222
{...props}
2323
key={index}
2424
title={title}
25-
suggestion={suggestion}
25+
collection={collection}
2626
renderIcon={({ item, index }) => (
2727
<>
2828
{item.__docsearch_parent && (
@@ -35,7 +35,7 @@ export function ResultsScreen(props: ResultsScreenProps) {
3535
strokeLinejoin="round"
3636
>
3737
{item.__docsearch_parent !==
38-
suggestion.items[index + 1]?.__docsearch_parent ? (
38+
collection.items[index + 1]?.__docsearch_parent ? (
3939
<path d="M8 6v21M20 27H8.3" />
4040
) : (
4141
<path d="M8 6v42M20 27H8.3" />

‎packages/docsearch-react/src/ScreenState.tsx‎

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,4 @@
1-
import {
2-
AutocompleteApi,
3-
AutocompleteState,
4-
} from '@francoischalifour/autocomplete-core';
1+
import { AutocompleteApi, AutocompleteState } from '@algolia/autocomplete-core';
52
import React from 'react';
63

74
import { DocSearchProps } from './DocSearch';
@@ -36,15 +33,15 @@ export const ScreenState = React.memo(
3633
return <ErrorScreen />;
3734
}
3835

39-
const hasSuggestions = props.state.suggestions.some(
40-
(suggestion) => suggestion.items.length > 0
36+
const hasCollections = props.state.collections.some(
37+
(collection) => collection.items.length > 0
4138
);
4239

4340
if (!props.state.query) {
44-
return <StartScreen {...props} hasSuggestions={hasSuggestions} />;
41+
return <StartScreen {...props} hasCollections={hasCollections} />;
4542
}
4643

47-
if (hasSuggestions === false) {
44+
if (hasCollections === false) {
4845
return <NoResultsScreen {...props} />;
4946
}
5047

‎packages/docsearch-react/src/SearchBox.tsx‎

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,4 @@
1-
import {
2-
AutocompleteApi,
3-
AutocompleteState,
4-
} from '@francoischalifour/autocomplete-core';
1+
import { AutocompleteApi, AutocompleteState } from '@algolia/autocomplete-core';
52
import React, { MutableRefObject } from 'react';
63

74
import { MAX_QUERY_SIZE } from './constants';
@@ -44,9 +41,6 @@ export function SearchBox(props: SearchBoxProps) {
4441
return (
4542
<>
4643
<form
47-
action=""
48-
role="search"
49-
noValidate
5044
className="DocSearch-Form"
5145
onSubmit={(event) => {
5246
event.preventDefault();
@@ -77,7 +71,6 @@ export function SearchBox(props: SearchBoxProps) {
7771
title="Clear the query"
7872
className="DocSearch-Reset"
7973
hidden={!props.state.query}
80-
onClick={onReset}
8174
>
8275
<ResetIcon />
8376
</button>

‎packages/docsearch-react/src/StartScreen.tsx‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,11 @@ import { ScreenStateProps } from './ScreenState';
66
import { InternalDocSearchHit } from './types';
77

88
interface StartScreenProps extends ScreenStateProps<InternalDocSearchHit> {
9-
hasSuggestions: boolean;
9+
hasCollections: boolean;
1010
}
1111

1212
export function StartScreen(props: StartScreenProps) {
13-
if (props.state.status === 'idle' && props.hasSuggestions === false) {
13+
if (props.state.status === 'idle' && props.hasCollections === false) {
1414
if (props.disableUserPersonalization) {
1515
return null;
1616
}
@@ -22,7 +22,7 @@ export function StartScreen(props: StartScreenProps) {
2222
);
2323
}
2424

25-
if (props.hasSuggestions === false) {
25+
if (props.hasCollections === false) {
2626
return null;
2727
}
2828

@@ -31,7 +31,7 @@ export function StartScreen(props: StartScreenProps) {
3131
<Results
3232
{...props}
3333
title="Recent"
34-
suggestion={props.state.suggestions[0]}
34+
collection={props.state.collections[0]}
3535
renderIcon={() => (
3636
<div className="DocSearch-Hit-icon">
3737
<RecentIcon />
@@ -83,7 +83,7 @@ export function StartScreen(props: StartScreenProps) {
8383
<Results
8484
{...props}
8585
title="Favorites"
86-
suggestion={props.state.suggestions[1]}
86+
collection={props.state.collections[1]}
8787
renderIcon={() => (
8888
<div className="DocSearch-Hit-icon">
8989
<StarIcon />

0 commit comments

Comments
 (0)
⚡