Files
HKSingleParty/03_source/mobile/src/pages/DemoReactMovieAppWithAlgolia/components/CustomSearchbox.tsx
2025-06-08 19:07:38 +08:00

19 lines
602 B
TypeScript

import { IonSearchbar } from '@ionic/react';
import { searchCircleOutline } from 'ionicons/icons';
import { connectSearchBox } from 'react-instantsearch-core';
const CustomSearchBox = ({ currentRefinement, refine }): React.JSX.Element => (
<IonSearchbar
animated={true}
onIonCancel={() => refine('')}
value={currentRefinement}
onIonChange={(event) => refine(event.currentTarget.value)}
onKeyUp={(event) => refine(event.currentTarget.value)}
placeholder="Try 'Avengers'"
icon={searchCircleOutline}
slot="end"
/>
);
export default connectSearchBox(CustomSearchBox);