Skip to content

Commit ec98541

Browse files
Merge branch 'next' into feat/theme-patch
2 parents ecdb00f + 74a908c commit ec98541

58 files changed

Lines changed: 1157 additions & 731 deletions

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

cypress/test-apps/js/app.tsx

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
/** @jsx h */
22
import {
33
autocomplete,
4+
AutocompleteComponents,
45
getAlgoliaHits,
5-
snippetHit,
66
} from '@algolia/autocomplete-js';
77
import {
88
AutocompleteInsightsApi,
@@ -102,10 +102,11 @@ autocomplete({
102102
</Fragment>
103103
);
104104
},
105-
item({ item }) {
105+
item({ item, components }) {
106106
return (
107107
<ProductItem
108108
hit={item}
109+
components={components}
109110
insights={state.context.algoliaInsightsPlugin.insights}
110111
/>
111112
);
@@ -124,20 +125,21 @@ autocomplete({
124125
type ProductItemProps = {
125126
hit: ProductHit;
126127
insights: AutocompleteInsightsApi;
128+
components: AutocompleteComponents;
127129
};
128130

129-
function ProductItem({ hit, insights }: ProductItemProps) {
131+
function ProductItem({ hit, insights, components }: ProductItemProps) {
130132
return (
131133
<Fragment>
132134
<div className="aa-ItemIcon aa-ItemIcon--alignTop">
133135
<img src={hit.image} alt={hit.name} width="40" height="40" />
134136
</div>
135137
<div className="aa-ItemContent">
136138
<div className="aa-ItemContentTitle">
137-
{snippetHit<ProductHit>({ hit, attribute: 'name' })}
139+
<components.Snippet hit={hit} attribute="name" />
138140
</div>
139141
<div className="aa-ItemContentDescription">
140-
{snippetHit<ProductHit>({ hit, attribute: 'description' })}
142+
<components.Snippet hit={hit} attribute="description" />
141143
</div>
142144
</div>
143145
<div className="aa-ItemActions">

cypress/test-apps/js/categoriesPlugin.tsx

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@
22
import {
33
AutocompletePlugin,
44
getAlgoliaFacetHits,
5-
highlightHit,
65
} from '@algolia/autocomplete-js';
76
import { SearchClient } from 'algoliasearch/lite';
87
import { h, Fragment } from 'preact';
@@ -52,7 +51,7 @@ export function createCategoriesPlugin({
5251
</Fragment>
5352
);
5453
},
55-
item({ item }) {
54+
item({ item, components }) {
5655
return (
5756
<Fragment>
5857
<div className="aa-ItemIcon aa-ItemIcon--noBorder">
@@ -73,10 +72,7 @@ export function createCategoriesPlugin({
7372
</div>
7473
<div className="aa-ItemContent">
7574
<div className="aa-ItemContentTitle">
76-
{highlightHit<CategoryItem>({
77-
hit: item,
78-
attribute: 'label',
79-
})}
75+
<components.Highlight hit={item} attribute="label" />
8076
</div>
8177
</div>
8278
</Fragment>

cypress/test-apps/js/env.ts

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
1-
import { h } from 'preact';
1+
import * as preact from 'preact';
22

33
// Parcel picks the `source` field of the monorepo packages and thus doesn't
4-
// apply the Babel config to replace our `__DEV__` global expression.
5-
// We therefore need to manually override it in the example app.
4+
// apply the Babel config. We therefore need to manually override the constants
5+
// in the app, as well as the React pragmas.
66
// See https://twitter.com/devongovett/status/1134231234605830144
77
(global as any).__DEV__ = process.env.NODE_ENV !== 'production';
88
(global as any).__TEST__ = false;
9-
(global as any).h = h;
9+
(global as any).h = preact.h;
10+
(global as any).React = preact;

examples/playground/app.tsx

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
/** @jsx h */
22
import {
33
autocomplete,
4+
AutocompleteComponents,
45
getAlgoliaHits,
5-
snippetHit,
66
} from '@algolia/autocomplete-js';
77
import {
88
AutocompleteInsightsApi,
@@ -104,10 +104,11 @@ autocomplete({
104104
</Fragment>
105105
);
106106
},
107-
item({ item }) {
107+
item({ item, components }) {
108108
return (
109109
<ProductItem
110110
hit={item}
111+
components={components}
111112
insights={state.context.algoliaInsightsPlugin.insights}
112113
/>
113114
);
@@ -126,9 +127,10 @@ autocomplete({
126127
type ProductItemProps = {
127128
hit: ProductHit;
128129
insights: AutocompleteInsightsApi;
130+
components: AutocompleteComponents;
129131
};
130132

131-
function ProductItem({ hit, insights }: ProductItemProps) {
133+
function ProductItem({ hit, insights, components }: ProductItemProps) {
132134
return (
133135
<Fragment>
134136
<div className="aa-ItemContent">
@@ -138,7 +140,7 @@ function ProductItem({ hit, insights }: ProductItemProps) {
138140

139141
<div className="aa-ItemContentBody">
140142
<div className="aa-ItemContentTitle">
141-
{snippetHit<ProductHit>({ hit, attribute: 'name' })}
143+
<components.Snippet hit={hit} attribute="name" />
142144
</div>
143145
<div className="aa-ItemContentDescription">
144146
By <strong>{hit.brand}</strong> in{' '}

examples/playground/categoriesPlugin.tsx

Lines changed: 2 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,6 @@
22
import {
33
AutocompletePlugin,
44
getAlgoliaFacetHits,
5-
highlightHit,
65
} from '@algolia/autocomplete-js';
76
import { SearchClient } from 'algoliasearch/lite';
87
import { h, Fragment } from 'preact';
@@ -56,7 +55,7 @@ export function createCategoriesPlugin({
5655
</Fragment>
5756
);
5857
},
59-
item({ item }) {
58+
item({ item, components }) {
6059
return (
6160
<Fragment>
6261
<div className="aa-ItemContent">
@@ -78,10 +77,7 @@ export function createCategoriesPlugin({
7877
</div>
7978

8079
<div className="aa-ItemContentTitle">
81-
{highlightHit<CategoryHit>({
82-
hit: item,
83-
attribute: 'label',
84-
})}
80+
<components.Highlight hit={item} attribute="label" />
8581
</div>
8682
</div>
8783
</Fragment>

examples/playground/env.ts

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
1-
import { h } from 'preact';
1+
import * as preact from 'preact';
22

33
// Parcel picks the `source` field of the monorepo packages and thus doesn't
4-
// apply the Babel config to replace our `__DEV__` global expression.
5-
// We therefore need to manually override it in the example app.
4+
// apply the Babel config. We therefore need to manually override the constants
5+
// in the app, as well as the React pragmas.
66
// See https://twitter.com/devongovett/status/1134231234605830144
77
(global as any).__DEV__ = process.env.NODE_ENV !== 'production';
88
(global as any).__TEST__ = false;
9-
(global as any).h = h;
9+
(global as any).h = preact.h;
10+
(global as any).React = preact;
Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
1-
import { h } from 'preact';
1+
import * as preact from 'preact';
22

33
// Parcel picks the `source` field of the monorepo packages and thus doesn't
4-
// apply the Babel config to replace our `__DEV__` global expression.
5-
// We therefore need to manually override it in the example app.
4+
// apply the Babel config. We therefore need to manually override the constants
5+
// in the app, as well as the React pragmas.
66
// See https://twitter.com/devongovett/status/1134231234605830144
77
(global as any).__DEV__ = process.env.NODE_ENV !== 'production';
88
(global as any).__TEST__ = false;
9-
(global as any).h = h;
9+
(global as any).h = preact.h;
10+
(global as any).React = preact;

examples/query-suggestions-with-hits/app.tsx

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
/** @jsx h */
22
import {
33
autocomplete,
4+
AutocompleteComponents,
45
getAlgoliaHits,
5-
snippetHit,
66
} from '@algolia/autocomplete-js';
77
import {
88
AutocompleteInsightsApi,
@@ -85,10 +85,11 @@ autocomplete({
8585
</Fragment>
8686
);
8787
},
88-
item({ item }) {
88+
item({ item, components }) {
8989
return (
9090
<ProductItem
9191
hit={item}
92+
components={components}
9293
insights={state.context.algoliaInsightsPlugin.insights}
9394
/>
9495
);
@@ -107,17 +108,18 @@ autocomplete({
107108
type ProductItemProps = {
108109
hit: ProductHit;
109110
insights: AutocompleteInsightsApi;
111+
components: AutocompleteComponents;
110112
};
111113

112-
function ProductItem({ hit, insights }: ProductItemProps) {
114+
function ProductItem({ hit, insights, components }: ProductItemProps) {
113115
return (
114116
<Fragment>
115117
<div className="aa-ItemIcon aa-ItemIcon--alignTop">
116118
<img src={hit.image} alt={hit.name} width="40" height="40" />
117119
</div>
118120
<div className="aa-ItemContent">
119121
<div className="aa-ItemContentTitle">
120-
{snippetHit<ProductHit>({ hit, attribute: 'name' })}
122+
<components.Snippet hit={hit} attribute="name" />
121123
</div>
122124
<div className="aa-ItemContentDescription">
123125
From <strong>{hit.brand}</strong> in{' '}
Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,10 @@
1-
import { h } from 'preact';
1+
import * as preact from 'preact';
22

33
// Parcel picks the `source` field of the monorepo packages and thus doesn't
4-
// apply the Babel config to replace our `__DEV__` global expression.
5-
// We therefore need to manually override it in the example app.
4+
// apply the Babel config. We therefore need to manually override the constants
5+
// in the app, as well as the React pragmas.
66
// See https://twitter.com/devongovett/status/1134231234605830144
77
(global as any).__DEV__ = process.env.NODE_ENV !== 'production';
88
(global as any).__TEST__ = false;
9-
(global as any).h = h;
9+
(global as any).h = preact.h;
10+
(global as any).React = preact;

examples/query-suggestions-with-inline-categories/app.tsx

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/** @jsx h */
2-
import { autocomplete, reverseHighlightHit } from '@algolia/autocomplete-js';
2+
import { autocomplete } from '@algolia/autocomplete-js';
33
import { createQuerySuggestionsPlugin } from '@algolia/autocomplete-plugin-query-suggestions';
44
import algoliasearch from 'algoliasearch';
55
import { h, Fragment } from 'preact';
@@ -30,7 +30,7 @@ const querySuggestionsPlugin = createQuerySuggestionsPlugin({
3030
...source,
3131
templates: {
3232
...source.templates,
33-
item({ item, createElement }) {
33+
item({ item, components }) {
3434
return (
3535
<Fragment>
3636
<div className="aa-ItemIcon aa-ItemIcon--noBorder">
@@ -46,11 +46,7 @@ const querySuggestionsPlugin = createQuerySuggestionsPlugin({
4646

4747
<div className="aa-ItemContent">
4848
<div className="aa-ItemContentTitle">
49-
{reverseHighlightHit<any>({
50-
hit: item,
51-
attribute: 'query',
52-
createElement,
53-
})}
49+
<components.ReverseHighlight hit={item} attribute="query" />
5450
</div>
5551

5652
{item.__autocomplete_qsCategory && (
@@ -73,6 +69,7 @@ const querySuggestionsPlugin = createQuerySuggestionsPlugin({
7369
className="aa-ItemActionButton"
7470
title={`Fill query with "${item.query}"`}
7571
onClick={(event) => {
72+
event.preventDefault();
7673
event.stopPropagation();
7774
onTapAhead(item);
7875
}}

0 commit comments

Comments
 (0)