answers-react-components

A library of React Components for powering Yext Search integrations.

See the full documentation here.

Getting Started

If you are using NPM 7+, you can install the components with the following command:

npm install @yext/answers-react-components

The @yext/answers-headless-react peer dependency will be automatically installed.

If you are using NPM 6 or Yarn, you can install the library and its peer dependencies with this command:

npx install-peerdeps @yext/answers-react-components

The command will work with Yarn so long as NPM 6+ is installed on the machine.

Once the library and its peer dependencies are installed, the components can be rendered using React by placing them inside the AnswersHeadlessProvider with the appropriate credentials:

import { AnswersHeadlessProvider } from '@yext/answers-headless-react';
import { SearchBar, UniversalResults } from '@yext/answers-react-components';

const config = {
  apiKey: '<apiKey>',
  experienceKey: '<experienceKey>',
  locale: 'en',
  experienceVersion: 'PRODUCTION',
}

function App() {
  return (
    <AnswersHeadlessProvider {...config}>
      <SearchBar />
      <UniversalResults />
    </AnswersHeadlessProvider>
  );
}

export default App;