From 8660605cfc6719e7d3a41178a675a9b186deddb1 Mon Sep 17 00:00:00 2001
From: Haroen Viaene <hello@haroen.me>
Date: Fri, 18 Oct 2024 16:17:44 +0200
Subject: [PATCH] fix(widgets): remove answers widget (#6399)

The answers widget has long been deprecated, and is removed without replacement as no answers service exists anymore.

As a userland solution if you're using the answers widget, copy the removed answers files inside your own project and import it locally.

BREAKING CHANGE: the answers widget no longer exists
BREAKING CHANGE: the findAnswers in the helper no longer exists
---
 packages/algoliasearch-helper/index.d.ts      |  16 -
 .../src/algoliasearch.helper.js               |  49 --
 .../spec/algoliasearch.helper/findAnswers.js  | 102 ----
 .../types/algoliasearch.d.ts                  |  19 -
 .../.storybook/static/answers.css             | 132 -----
 .../src/components/Answers/Answers.tsx        |  79 ---
 .../Answers/__tests__/Answers-test.tsx        | 130 -----
 .../answers/__tests__/connectAnswers-test.ts  | 452 ------------------
 .../src/connectors/answers/connectAnswers.ts  | 267 -----------
 .../instantsearch.js/src/connectors/index.ts  |   7 -
 .../src/types/render-state.ts                 |   4 +-
 packages/instantsearch.js/src/types/widget.ts |   2 -
 .../src/widgets/__tests__/index.test.ts       |   4 -
 .../widgets/answers/__tests__/answers-test.ts | 170 -------
 .../src/widgets/answers/answers.tsx           | 201 --------
 .../src/widgets/answers/defaultTemplates.ts   |  15 -
 .../instantsearch.js/src/widgets/index.ts     |   7 -
 .../stories/answers.stories.ts                | 121 -----
 specs/src/pages/widgets/answers.md            |  58 ---
 19 files changed, 1 insertion(+), 1834 deletions(-)
 delete mode 100644 packages/algoliasearch-helper/test/spec/algoliasearch.helper/findAnswers.js
 delete mode 100644 packages/instantsearch.js/.storybook/static/answers.css
 delete mode 100644 packages/instantsearch.js/src/components/Answers/Answers.tsx
 delete mode 100644 packages/instantsearch.js/src/components/Answers/__tests__/Answers-test.tsx
 delete mode 100644 packages/instantsearch.js/src/connectors/answers/__tests__/connectAnswers-test.ts
 delete mode 100644 packages/instantsearch.js/src/connectors/answers/connectAnswers.ts
 delete mode 100644 packages/instantsearch.js/src/widgets/answers/__tests__/answers-test.ts
 delete mode 100644 packages/instantsearch.js/src/widgets/answers/answers.tsx
 delete mode 100644 packages/instantsearch.js/src/widgets/answers/defaultTemplates.ts
 delete mode 100644 packages/instantsearch.js/stories/answers.stories.ts
 delete mode 100644 specs/src/pages/widgets/answers.md

diff --git a/packages/algoliasearch-helper/index.d.ts b/packages/algoliasearch-helper/index.d.ts
index c999bd8956..0b96519966 100644
--- a/packages/algoliasearch-helper/index.d.ts
+++ b/packages/algoliasearch-helper/index.d.ts
@@ -2,7 +2,6 @@ import EventEmitter from '@algolia/events';
 
 // eslint-disable-next-line @typescript-eslint/consistent-type-imports
 import type {
-  FindAnswersResponse,
   FrequentlyBoughtTogetherQuery,
   HighlightResult,
   LookingSimilarQuery,
@@ -163,21 +162,6 @@ declare namespace algoliasearchHelper {
       ) => void
     ): void;
 
-    /**
-     * Start the search for answers with the parameters set in the state.
-     * This method returns a promise.
-     * @param {Object} options - the options for answers API call
-     * @param {string[]} options.attributesForPrediction - Attributes to use for predictions. If empty, `searchableAttributes` is used instead.
-     * @param {string[]} options.queryLanguages - The languages in the query. Currently only supports ['en'].
-     * @param {number} options.nbHits - Maximum number of answers to retrieve from the Answers Engine. Cannot be greater than 1000.
-     * @deprecated answers is deprecated and will be replaced with new initiatives
-     */
-    findAnswers<TObject>(options: {
-      attributesForPrediction: string[];
-      queryLanguages: string[];
-      nbHits: number;
-    }): Promise<FindAnswersResponse<TObject>>;
-
     /**
      * Search for facet values based on an query and the name of a faceted attribute. This
      * triggers a search and will return a promise. On top of using the query, it also sends
diff --git a/packages/algoliasearch-helper/src/algoliasearch.helper.js b/packages/algoliasearch-helper/src/algoliasearch.helper.js
index 2edce2bbf3..ecd5ae229c 100644
--- a/packages/algoliasearch-helper/src/algoliasearch.helper.js
+++ b/packages/algoliasearch-helper/src/algoliasearch.helper.js
@@ -5,9 +5,7 @@ var EventEmitter = require('@algolia/events');
 var DerivedHelper = require('./DerivedHelper');
 var escapeFacetValue = require('./functions/escapeFacetValue').escapeFacetValue;
 var inherits = require('./functions/inherits');
-var merge = require('./functions/merge');
 var objectHasKeys = require('./functions/objectHasKeys');
-var omit = require('./functions/omit');
 var RecommendParameters = require('./RecommendParameters');
 var RecommendResults = require('./RecommendResults');
 var requestBuilder = require('./requestBuilder');
@@ -288,53 +286,6 @@ AlgoliaSearchHelper.prototype.searchOnce = function (options, cb) {
   );
 };
 
-/**
- * Start the search for answers with the parameters set in the state.
- * This method returns a promise.
- * @param {Object} options - the options for answers API call
- * @param {string[]} options.attributesForPrediction - Attributes to use for predictions. If empty, `searchableAttributes` is used instead.
- * @param {string[]} options.queryLanguages - The languages in the query. Currently only supports ['en'].
- * @param {number} options.nbHits - Maximum number of answers to retrieve from the Answers Engine. Cannot be greater than 1000.
- *
- * @return {promise} the answer results
- * @deprecated answers is deprecated and will be replaced with new initiatives
- */
-AlgoliaSearchHelper.prototype.findAnswers = function (options) {
-  // eslint-disable-next-line no-console
-  console.warn('[algoliasearch-helper] answers is no longer supported');
-  var state = this.state;
-  var derivedHelper = this.derivedHelpers[0];
-  if (!derivedHelper) {
-    return Promise.resolve([]);
-  }
-  var derivedState = derivedHelper.getModifiedState(state);
-  var data = merge(
-    {
-      attributesForPrediction: options.attributesForPrediction,
-      nbHits: options.nbHits,
-    },
-    {
-      params: omit(requestBuilder._getHitsSearchParams(derivedState), [
-        'attributesToSnippet',
-        'hitsPerPage',
-        'restrictSearchableAttributes',
-        'snippetEllipsisText',
-      ]),
-    }
-  );
-
-  var errorMessage =
-    'search for answers was called, but this client does not have a function client.initIndex(index).findAnswers';
-  if (typeof this.client.initIndex !== 'function') {
-    throw new Error(errorMessage);
-  }
-  var index = this.client.initIndex(derivedState.index);
-  if (typeof index.findAnswers !== 'function') {
-    throw new Error(errorMessage);
-  }
-  return index.findAnswers(derivedState.query, options.queryLanguages, data);
-};
-
 /**
  * Structure of each result when using
  * [`searchForFacetValues()`](reference.html#AlgoliaSearchHelper#searchForFacetValues)
diff --git a/packages/algoliasearch-helper/test/spec/algoliasearch.helper/findAnswers.js b/packages/algoliasearch-helper/test/spec/algoliasearch.helper/findAnswers.js
deleted file mode 100644
index fe5d20fc0a..0000000000
--- a/packages/algoliasearch-helper/test/spec/algoliasearch.helper/findAnswers.js
+++ /dev/null
@@ -1,102 +0,0 @@
-'use strict';
-
-var algoliasearchHelper = require('../../../index');
-
-function makeFakeFindAnswersResponse() {
-  return {
-    exhaustiveFacetsCount: true,
-    facetHits: [],
-    processingTimeMS: 3,
-  };
-}
-
-function setupTestEnvironment(helperOptions) {
-  var findAnswers = jest.fn(function () {
-    return Promise.resolve([makeFakeFindAnswersResponse()]);
-  });
-
-  var fakeClient = {
-    initIndex: function () {
-      return {
-        findAnswers: findAnswers,
-      };
-    },
-  };
-
-  var helper = algoliasearchHelper(fakeClient, 'index', helperOptions);
-
-  return {
-    findAnswers: findAnswers,
-    helper: helper,
-  };
-}
-
-test('returns an empty array with no derived helper', function () {
-  var env = setupTestEnvironment();
-  var helper = env.helper;
-  var findAnswers = env.findAnswers;
-
-  return helper
-    .findAnswers({
-      attributesForPrediction: ['description'],
-      queryLanguages: ['en'],
-      nbHits: 1,
-    })
-    .then(function (result) {
-      expect(findAnswers).toHaveBeenCalledTimes(0);
-      expect(result).toEqual([]);
-    });
-});
-
-test('returns a correct result with one derivation', function () {
-  var env = setupTestEnvironment();
-  var helper = env.helper;
-  var findAnswers = env.findAnswers;
-
-  helper.derive(function (state) {
-    return state;
-  });
-
-  return helper
-    .findAnswers({
-      attributesForPrediction: ['description'],
-      queryLanguages: ['en'],
-      nbHits: 1,
-    })
-    .then(function (result) {
-      expect(findAnswers).toHaveBeenCalledTimes(1);
-      expect(result).toEqual([makeFakeFindAnswersResponse()]);
-    });
-});
-
-test('runs findAnswers with facets', function () {
-  var env = setupTestEnvironment({ facets: ['facet1'] });
-  var helper = env.helper;
-  var findAnswers = env.findAnswers;
-  helper.addFacetRefinement('facet1', 'facetValue');
-
-  helper.derive(function (state) {
-    return state;
-  });
-
-  helper.setQuery('hello');
-
-  return helper
-    .findAnswers({
-      attributesForPrediction: ['description'],
-      queryLanguages: ['en'],
-      nbHits: 1,
-    })
-    .then(function () {
-      expect(findAnswers).toHaveBeenCalledTimes(1);
-      expect(findAnswers).toHaveBeenCalledWith('hello', ['en'], {
-        attributesForPrediction: ['description'],
-        nbHits: 1,
-        params: {
-          facetFilters: ['facet1:facetValue'],
-          facets: ['facet1'],
-          query: 'hello',
-        },
-      });
-    });
-});
diff --git a/packages/algoliasearch-helper/types/algoliasearch.d.ts b/packages/algoliasearch-helper/types/algoliasearch.d.ts
index 01b7972c0e..3ad8e12e6f 100644
--- a/packages/algoliasearch-helper/types/algoliasearch.d.ts
+++ b/packages/algoliasearch-helper/types/algoliasearch.d.ts
@@ -280,25 +280,6 @@ export type SearchForFacetValuesResponse = PickForClient<{
   v5: AlgoliaSearch.SearchForFacetValuesResponse;
 }>;
 
-export type FindAnswersOptions = PickForClient<{
-  v3: any; // answers only exists in v4
-  // @ts-ignore
-  v4: ClientSearch.FindAnswersOptions;
-  v5: any; // answers only exists in v4
-}>;
-export type FindAnswersResponse<T> = PickForClient<{
-  v3: any; // answers only exists in v4
-  // @ts-ignore
-  v4: ClientSearch.FindAnswersResponse<T>;
-  v5: any; // answers only exists in v4
-}>;
-export type FindAnswers = PickForClient<{
-  v3: any; // answers only exists in v4
-  // @ts-ignore
-  v4: ReturnType<DefaultSearchClient['initIndex']>['findAnswers'];
-  v5: any; // answers only exists in v4
-}>;
-
 export type SupportedLanguage = PickForClient<{
   v3: string;
   v4: string;
diff --git a/packages/instantsearch.js/.storybook/static/answers.css b/packages/instantsearch.js/.storybook/static/answers.css
deleted file mode 100644
index 31663e3fb2..0000000000
--- a/packages/instantsearch.js/.storybook/static/answers.css
+++ /dev/null
@@ -1,132 +0,0 @@
-.my-Answers .ais-Answers-loader {
-  display: none;
-}
-
-.my-Answers .ais-Answers-list {
-  list-style: none;
-  margin: 0;
-  padding: 0;
-}
-
-.my-Answers .ais-Answers-item {
-  height: 10rem;
-  border: 1px solid #ddd;
-  border-radius: 0.5rem;
-}
-
-.my-Answers .title {
-  padding: 0;
-  margin: 1rem;
-  font-size: 1.2rem;
-  color: #333;
-  line-height: 1.4rem;
-}
-
-.my-Answers .separator {
-  border-top: 1px solid #ddd;
-}
-
-.my-Answers .description {
-  margin: 1rem;
-  padding: 0;
-  color: #333;
-  line-height: 1.4rem;
-}
-
-.my-Answers .description em {
-  background-color: #ffc168;
-}
-
-.one-line {
-  display: -webkit-box;
-  -webkit-line-clamp: 1;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-}
-
-.three-lines {
-  display: -webkit-box;
-  -webkit-line-clamp: 3;
-  -webkit-box-orient: vertical;
-  overflow: hidden;
-}
-
-/* skeleton loader from https://codepen.io/jordanmsykes/pen/RgPqgV - begin */
-@keyframes placeHolderShimmer {
-  0% {
-    -webkit-transform: translateZ(0);
-    transform: translateZ(0);
-    background-position: -468px 0;
-  }
-  to {
-    -webkit-transform: translateZ(0);
-    transform: translateZ(0);
-    background-position: 468px 0;
-  }
-}
-
-.card-skeleton {
-  margin-left: 1rem;
-  margin-right: 1rem;
-  width: calc(100% - 2rem);
-  height: 10rem;
-  transition: all 0.3s ease-in-out;
-  -webkit-backface-visibility: hidden;
-  background: #fff;
-  z-index: 10;
-  opacity: 1;
-}
-
-.card-skeleton.hidden {
-  transition: all 0.3s ease-in-out;
-  opacity: 0;
-  height: 0;
-  padding: 0;
-}
-
-.card-skeleton-img {
-  width: 100%;
-  height: 120px;
-  background: #e6e6e6;
-  display: block;
-}
-
-.animated-background {
-  will-change: transform;
-  animation: placeHolderShimmer 1s linear infinite forwards;
-  -webkit-backface-visibility: hidden;
-  background: #e6e6e6;
-  background: linear-gradient(90deg, #eee 8%, #ddd 18%, #eee 33%);
-  background-size: 800px 104px;
-  height: 100%;
-  position: relative;
-}
-
-.skel-mask-container {
-  position: relative;
-}
-
-.skel-mask {
-  background: #fff;
-  position: absolute;
-  z-index: 200;
-}
-
-.skel-mask-1 {
-  width: 100%;
-  height: 15px;
-  top: 0;
-}
-
-.skel-mask-2 {
-  width: 100%;
-  height: 25px;
-  top: 45px;
-}
-
-.skel-mask-3 {
-  width: 100%;
-  height: 15px;
-  top: 145px;
-}
-/* skeleton loader - end */
diff --git a/packages/instantsearch.js/src/components/Answers/Answers.tsx b/packages/instantsearch.js/src/components/Answers/Answers.tsx
deleted file mode 100644
index 3e74ccf476..0000000000
--- a/packages/instantsearch.js/src/components/Answers/Answers.tsx
+++ /dev/null
@@ -1,79 +0,0 @@
-/** @jsx h */
-
-import { cx } from 'instantsearch-ui-components';
-import { h } from 'preact';
-
-import { warning } from '../../lib/utils';
-import Template from '../Template/Template';
-
-import type { ComponentCSSClasses, Hit } from '../../types';
-import type {
-  AnswersCSSClasses,
-  AnswersTemplates,
-} from '../../widgets/answers/answers';
-
-export type AnswersComponentCSSClasses = ComponentCSSClasses<AnswersCSSClasses>;
-
-export type AnswersComponentTemplates = Required<AnswersTemplates>;
-
-export type AnswersProps = {
-  hits: Hit[];
-  isLoading: boolean;
-  cssClasses: AnswersComponentCSSClasses;
-  templateProps: {
-    [key: string]: any;
-    templates: AnswersComponentTemplates;
-  };
-};
-
-const Answers = ({
-  hits,
-  isLoading,
-  cssClasses,
-  templateProps,
-}: AnswersProps) => (
-  <div
-    className={cx(cssClasses.root, hits.length === 0 && cssClasses.emptyRoot)}
-  >
-    <Template
-      {...templateProps}
-      templateKey="header"
-      rootProps={{ className: cssClasses.header }}
-      data={{
-        hits,
-        isLoading,
-      }}
-    />
-    {isLoading ? (
-      <Template
-        {...templateProps}
-        templateKey="loader"
-        rootProps={{ className: cssClasses.loader }}
-      />
-    ) : (
-      <ul className={cssClasses.list}>
-        {hits.map((hit, index) => (
-          <Template
-            {...templateProps}
-            templateKey="item"
-            rootTagName="li"
-            rootProps={{ className: cssClasses.item }}
-            key={hit.objectID}
-            data={{
-              ...hit,
-              get __hitIndex() {
-                warning(
-                  false,
-                  'The `__hitIndex` property is deprecated. Use the absolute `__position` instead.'
-                );
-                return index;
-              },
-            }}
-          />
-        ))}
-      </ul>
-    )}
-  </div>
-);
-
-export default Answers;
diff --git a/packages/instantsearch.js/src/components/Answers/__tests__/Answers-test.tsx b/packages/instantsearch.js/src/components/Answers/__tests__/Answers-test.tsx
deleted file mode 100644
index ab0c552658..0000000000
--- a/packages/instantsearch.js/src/components/Answers/__tests__/Answers-test.tsx
+++ /dev/null
@@ -1,130 +0,0 @@
-/**
- * @jest-environment jsdom
- */
-/** @jsx h */
-
-import { render } from '@testing-library/preact';
-import { h } from 'preact';
-
-import Answers from '../Answers';
-
-import type { AnswersProps } from '../Answers';
-
-const defaultProps: AnswersProps = {
-  hits: [],
-  isLoading: false,
-  cssClasses: {
-    root: 'root',
-    header: 'header',
-    emptyRoot: 'empty',
-    loader: 'loader',
-    list: 'list',
-    item: 'item',
-  },
-  templateProps: {
-    templates: {
-      header: () => 'header',
-      loader: () => 'loader',
-      item: () => 'item',
-    },
-  },
-};
-
-describe('Answers', () => {
-  describe('Rendering', () => {
-    it('renders without anything', () => {
-      const { container } = render(<Answers {...defaultProps} />);
-      expect(container.querySelector('.root')).toHaveClass('empty');
-      expect(container).toMatchInlineSnapshot(`
-        <div>
-          <div
-            class="root empty"
-          >
-            <div
-              class="header"
-            >
-              header
-            </div>
-            <ul
-              class="list"
-            />
-          </div>
-        </div>
-      `);
-    });
-
-    it('renders the loader', () => {
-      const { container } = render(
-        <Answers {...defaultProps} isLoading={true} />
-      );
-      expect(container).toMatchInlineSnapshot(`
-<div>
-  <div
-    class="root empty"
-  >
-    <div
-      class="header"
-    >
-      header
-    </div>
-    <div
-      class="loader"
-    >
-      loader
-    </div>
-  </div>
-</div>
-`);
-    });
-
-    it('renders the header with data', () => {
-      const props: AnswersProps = {
-        ...defaultProps,
-        templateProps: {
-          templates: {
-            ...defaultProps.templateProps.templates,
-            header: ({ hits, isLoading }) => {
-              return `${hits.length} answer(s) ${
-                isLoading ? 'loading' : 'loaded'
-              }`;
-            },
-          },
-        },
-      };
-      const { container } = render(
-        <Answers
-          {...props}
-          isLoading={false}
-          hits={[{ objectID: '1', __position: 1 }]}
-        />
-      );
-      expect(container.querySelector('.header')).toHaveTextContent(
-        '1 answer(s) loaded'
-      );
-    });
-
-    it('renders the answers', () => {
-      const props: AnswersProps = {
-        ...defaultProps,
-        templateProps: {
-          templates: {
-            ...defaultProps.templateProps.templates,
-            item: (hit) => {
-              return `answer: ${hit.title}`;
-            },
-          },
-        },
-      };
-      const { container } = render(
-        <Answers
-          {...props}
-          isLoading={false}
-          hits={[{ objectID: '1', title: 'hello!', __position: 1 }]}
-        />
-      );
-      expect(container.querySelector('.list')).toHaveTextContent(
-        'answer: hello!'
-      );
-    });
-  });
-});
diff --git a/packages/instantsearch.js/src/connectors/answers/__tests__/connectAnswers-test.ts b/packages/instantsearch.js/src/connectors/answers/__tests__/connectAnswers-test.ts
deleted file mode 100644
index 39acb76020..0000000000
--- a/packages/instantsearch.js/src/connectors/answers/__tests__/connectAnswers-test.ts
+++ /dev/null
@@ -1,452 +0,0 @@
-import {
-  createSearchClient,
-  createSingleSearchResponse,
-} from '@instantsearch/mocks';
-import { wait } from '@instantsearch/testutils/wait';
-import algoliasearchHelper, { SearchResults } from 'algoliasearch-helper';
-
-import { createInstantSearch } from '../../../../test/createInstantSearch';
-import {
-  createInitOptions,
-  createRenderOptions,
-} from '../../../../test/createWidget';
-import connectAnswers from '../connectAnswers';
-
-const defaultRenderDebounceTime = 10;
-const defaultSearchDebounceTime = 10;
-const waitForDebounceTime =
-  defaultRenderDebounceTime + defaultSearchDebounceTime + 80;
-
-describe('connectAnswers', () => {
-  describe('Usage', () => {
-    it('throws without render function', () => {
-      expect(() => {
-        // @ts-expect-error: test connectAnswers with invalid parameters
-        connectAnswers()({});
-      }).toThrowErrorMatchingInlineSnapshot(`
-"The render function is not valid (received type Undefined).
-
-See documentation: https://www.algolia.com/doc/api-reference/widgets/answers/js/#connector"
-`);
-    });
-
-    it('throws without `queryLanguages`', () => {
-      expect(() => {
-        // @ts-expect-error: test connectAnswers with invalid parameters
-        connectAnswers(() => {})({});
-      }).toThrowErrorMatchingInlineSnapshot(`
-"The \`queryLanguages\` expects an array of strings.
-
-See documentation: https://www.algolia.com/doc/api-reference/widgets/answers/js/#connector"
-`);
-    });
-  });
-
-  const setupTestEnvironment = ({
-    hits,
-    attributesForPrediction = ['description'],
-    renderDebounceTime = defaultRenderDebounceTime,
-    searchDebounceTime = defaultSearchDebounceTime,
-  }: {
-    hits: any[];
-    attributesForPrediction?: string[];
-    renderDebounceTime?: number;
-    searchDebounceTime?: number;
-  }) => {
-    const renderFn = jest.fn();
-    const unmountFn = jest.fn();
-    const client = createSearchClient({
-      // @ts-ignore-next-line
-      initIndex() {
-        return {
-          findAnswers: () => Promise.resolve({ hits }),
-        };
-      },
-    });
-    const instantSearchInstance = createInstantSearch({ client });
-    const makeWidget = connectAnswers(renderFn, unmountFn);
-    const widget = makeWidget({
-      queryLanguages: ['en'],
-      attributesForPrediction,
-      renderDebounceTime,
-      searchDebounceTime,
-    });
-
-    const helper = algoliasearchHelper(client, '', {});
-
-    return {
-      renderFn,
-      unmountFn,
-      instantSearchInstance,
-      widget,
-      helper,
-    };
-  };
-
-  it('is a widget', () => {
-    const render = jest.fn();
-    const unmount = jest.fn();
-
-    const makeWidget = connectAnswers(render, unmount);
-    const widget = makeWidget({
-      queryLanguages: ['en'],
-      attributesForPrediction: ['description'],
-    });
-
-    expect(widget).toEqual(
-      expect.objectContaining({
-        $$type: 'ais.answers',
-        init: expect.any(Function),
-        render: expect.any(Function),
-        dispose: expect.any(Function),
-        getRenderState: expect.any(Function),
-        getWidgetRenderState: expect.any(Function),
-        getWidgetSearchParameters: expect.any(Function),
-      })
-    );
-  });
-
-  it('Renders during init and render', () => {
-    const { renderFn, widget, instantSearchInstance, helper } =
-      setupTestEnvironment({ hits: [] });
-
-    expect(renderFn).toHaveBeenCalledTimes(0);
-
-    widget.init!(
-      createInitOptions({
-        instantSearchInstance,
-        state: helper.state,
-        helper,
-      })
-    );
-
-    expect(renderFn).toHaveBeenCalledTimes(1);
-    expect(renderFn).toHaveBeenLastCalledWith(
-      expect.objectContaining({
-        instantSearchInstance,
-        hits: [],
-        isLoading: false,
-        widgetParams: {
-          queryLanguages: ['en'],
-          attributesForPrediction: ['description'],
-          renderDebounceTime: 10,
-          searchDebounceTime: 10,
-        },
-      }),
-      true
-    );
-
-    widget.render!(
-      createRenderOptions({
-        results: new SearchResults(helper.state, [
-          createSingleSearchResponse({ hits: [] }),
-        ]),
-        state: helper.state,
-        instantSearchInstance,
-        helper,
-      })
-    );
-
-    expect(renderFn).toHaveBeenCalledTimes(2);
-    expect(renderFn).toHaveBeenLastCalledWith(
-      expect.objectContaining({
-        instantSearchInstance,
-        hits: [],
-        isLoading: false,
-        widgetParams: {
-          queryLanguages: ['en'],
-          attributesForPrediction: ['description'],
-          renderDebounceTime: 10,
-          searchDebounceTime: 10,
-        },
-      }),
-      false
-    );
-  });
-
-  it('renders empty hits when query is not given', () => {
-    const { renderFn, widget, helper, instantSearchInstance } =
-      setupTestEnvironment({ hits: [] });
-
-    widget.init!(
-      createInitOptions({
-        instantSearchInstance,
-        state: helper.state,
-        helper,
-      })
-    );
-
-    helper.state.query = '';
-
-    widget.render!(
-      createRenderOptions({
-        results: new SearchResults(helper.state, [
-          createSingleSearchResponse({ hits: [] }),
-        ]),
-        state: helper.state,
-        instantSearchInstance,
-        helper,
-      })
-    );
-
-    expect(renderFn).toHaveBeenNthCalledWith(
-      2,
-      expect.objectContaining({
-        instantSearchInstance,
-        hits: [],
-        isLoading: false,
-        widgetParams: {
-          queryLanguages: ['en'],
-          attributesForPrediction: ['description'],
-          renderDebounceTime: 10,
-          searchDebounceTime: 10,
-        },
-      }),
-      false
-    );
-  });
-
-  it('renders loader and results when query is given', async () => {
-    const hits = [{ title: '', objectID: 'a' }];
-    const { renderFn, instantSearchInstance, widget, helper } =
-      setupTestEnvironment({
-        hits,
-      });
-
-    widget.init!(
-      createInitOptions({
-        instantSearchInstance,
-        state: helper.state,
-        helper,
-      })
-    );
-
-    helper.state.query = 'a';
-    widget.render!(
-      createRenderOptions({
-        state: helper.state,
-        instantSearchInstance,
-        helper,
-      })
-    );
-
-    // render with isLoading and no hit
-    expect(renderFn).toHaveBeenCalledTimes(2);
-    expect(renderFn).toHaveBeenNthCalledWith(
-      2,
-      expect.objectContaining({
-        hits: [],
-        isLoading: true,
-      }),
-      false
-    );
-
-    await wait(waitForDebounceTime);
-
-    // render with hits
-    const expectedHits = [{ title: '', objectID: 'a', __position: 1 }];
-    expect(renderFn).toHaveBeenCalledTimes(3);
-    expect(renderFn).toHaveBeenNthCalledWith(
-      3,
-      expect.objectContaining({
-        hits: expectedHits,
-        isLoading: false,
-      }),
-      false
-    );
-  });
-
-  it('debounces renders', async () => {
-    const hits = [{ title: '', objectID: 'a' }];
-    const { renderFn, instantSearchInstance, widget, helper } =
-      setupTestEnvironment({
-        hits,
-      });
-
-    widget.init!(
-      createInitOptions({
-        instantSearchInstance,
-        state: helper.state,
-        helper,
-      })
-    );
-
-    helper.state.query = 'a';
-    widget.render!(
-      createRenderOptions({
-        state: helper.state,
-        instantSearchInstance,
-        helper,
-      })
-    );
-
-    // render with isLoading and no hit
-    expect(renderFn).toHaveBeenCalledTimes(2);
-    expect(renderFn).toHaveBeenNthCalledWith(
-      2,
-      expect.objectContaining({
-        hits: [],
-        isLoading: true,
-      }),
-      false
-    );
-
-    // another query
-    helper.state.query = 'ab';
-    widget.render!(
-      createRenderOptions({
-        state: helper.state,
-        instantSearchInstance,
-        helper,
-      })
-    );
-
-    // no debounce for rendering loader
-    expect(renderFn).toHaveBeenCalledTimes(3);
-
-    await wait(waitForDebounceTime);
-
-    const expectedHits = [{ title: '', objectID: 'a', __position: 1 }];
-    expect(renderFn).toHaveBeenCalledTimes(4);
-    expect(renderFn).toHaveBeenNthCalledWith(
-      4,
-      expect.objectContaining({
-        hits: expectedHits,
-        isLoading: false,
-      }),
-      false
-    );
-
-    await wait(waitForDebounceTime);
-
-    // but no more rendering
-    expect(renderFn).toHaveBeenCalledTimes(4);
-  });
-
-  describe('getRenderState', () => {
-    it('returns the render state', () => {
-      const { instantSearchInstance, widget, helper } = setupTestEnvironment({
-        hits: [],
-      });
-
-      expect(
-        widget.getRenderState(
-          {},
-          createInitOptions({
-            instantSearchInstance,
-            state: helper.state,
-            helper,
-          })
-        )
-      ).toEqual({
-        answers: {
-          hits: [],
-          isLoading: false,
-          widgetParams: {
-            queryLanguages: ['en'],
-            attributesForPrediction: ['description'],
-            renderDebounceTime: 10,
-            searchDebounceTime: 10,
-          },
-        },
-      });
-
-      widget.init!(
-        createInitOptions({
-          instantSearchInstance,
-          state: helper.state,
-          helper,
-        })
-      );
-
-      expect(
-        widget.getRenderState(
-          {},
-          createInitOptions({
-            instantSearchInstance,
-            state: helper.state,
-            helper,
-          })
-        )
-      ).toEqual({
-        answers: {
-          hits: [],
-          isLoading: false,
-          widgetParams: {
-            queryLanguages: ['en'],
-            attributesForPrediction: ['description'],
-            renderDebounceTime: 10,
-            searchDebounceTime: 10,
-          },
-        },
-      });
-    });
-  });
-
-  describe('getWidgetRenderState', () => {
-    it('returns the widget render state', async () => {
-      const { instantSearchInstance, widget, helper } = setupTestEnvironment({
-        hits: [{ title: '', objectID: 'a' }],
-      });
-
-      widget.init!(
-        createInitOptions({
-          instantSearchInstance,
-          state: helper.state,
-          helper,
-        })
-      );
-
-      helper.state.query = 'a';
-      widget.render!(
-        createRenderOptions({
-          instantSearchInstance,
-          state: helper.state,
-          helper,
-        })
-      );
-
-      // render the loading state
-      expect(
-        widget.getWidgetRenderState(
-          createRenderOptions({
-            instantSearchInstance,
-            state: helper.state,
-            helper,
-          })
-        )
-      ).toEqual({
-        hits: [],
-        isLoading: true,
-        widgetParams: {
-          queryLanguages: ['en'],
-          attributesForPrediction: ['description'],
-          renderDebounceTime: 10,
-          searchDebounceTime: 10,
-        },
-      });
-
-      await wait(waitForDebounceTime);
-
-      const expectedHits = [{ title: '', objectID: 'a', __position: 1 }];
-      expect(
-        widget.getWidgetRenderState(
-          createRenderOptions({
-            instantSearchInstance,
-            state: helper.state,
-            helper,
-          })
-        )
-      ).toEqual({
-        hits: expectedHits,
-        isLoading: false,
-        widgetParams: {
-          queryLanguages: ['en'],
-          attributesForPrediction: ['description'],
-          renderDebounceTime: 10,
-          searchDebounceTime: 10,
-        },
-      });
-    });
-  });
-});
diff --git a/packages/instantsearch.js/src/connectors/answers/connectAnswers.ts b/packages/instantsearch.js/src/connectors/answers/connectAnswers.ts
deleted file mode 100644
index 47bdadef0b..0000000000
--- a/packages/instantsearch.js/src/connectors/answers/connectAnswers.ts
+++ /dev/null
@@ -1,267 +0,0 @@
-import {
-  checkRendering,
-  createDocumentationMessageGenerator,
-  createConcurrentSafePromise,
-  addQueryID,
-  debounce,
-  addAbsolutePosition,
-  noop,
-  escapeHits,
-} from '../../lib/utils';
-
-import type { DebouncedFunction } from '../../lib/utils';
-import type {
-  Connector,
-  Hit,
-  FindAnswersOptions,
-  FindAnswersResponse,
-  WidgetRenderState,
-  FindAnswers,
-} from '../../types';
-
-type IndexWithAnswers = {
-  readonly findAnswers: any;
-};
-
-function hasFindAnswersMethod(
-  answersIndex: IndexWithAnswers | any
-): answersIndex is IndexWithAnswers {
-  return typeof (answersIndex as IndexWithAnswers).findAnswers === 'function';
-}
-
-const withUsage = createDocumentationMessageGenerator({
-  name: 'answers',
-  connector: true,
-});
-
-export type AnswersRenderState = {
-  /**
-   * The matched hits from Algolia API.
-   */
-  hits: Hit[];
-
-  /**
-   * Whether it's still loading the results from the Answers API.
-   */
-  isLoading: boolean;
-};
-
-export type AnswersConnectorParams = {
-  /**
-   * Attributes to use for predictions.
-   * If empty, we use all `searchableAttributes` to find answers.
-   * All your `attributesForPrediction` must be part of your `searchableAttributes`.
-   */
-  attributesForPrediction?: string[];
-
-  /**
-   * The languages in the query. Currently only supports `en`.
-   */
-  queryLanguages: ['en'];
-
-  /**
-   * Maximum number of answers to retrieve from the Answers Engine.
-   * Cannot be greater than 1000.
-   * @default 1
-   */
-  nbHits?: number;
-
-  /**
-   * Debounce time in milliseconds to debounce render
-   * @default 100
-   */
-  renderDebounceTime?: number;
-
-  /**
-   * Debounce time in milliseconds to debounce search
-   * @default 100
-   */
-  searchDebounceTime?: number;
-
-  /**
-   * Whether to escape HTML tags from hits string values.
-   *
-   * @default true
-   */
-  escapeHTML?: boolean;
-
-  /**
-   * Extra parameters to pass to findAnswers method.
-   * @default {}
-   */
-  extraParameters?: FindAnswersOptions;
-};
-
-export type AnswersWidgetDescription = {
-  $$type: 'ais.answers';
-  renderState: AnswersRenderState;
-  indexRenderState: {
-    answers: WidgetRenderState<AnswersRenderState, AnswersConnectorParams>;
-  };
-};
-
-export type AnswersConnector = Connector<
-  AnswersWidgetDescription,
-  AnswersConnectorParams
->;
-
-/**
- * @deprecated the answers service is no longer offered, and this widget will be removed in InstantSearch.js v5
- */
-const connectAnswers: AnswersConnector = function connectAnswers(
-  renderFn,
-  unmountFn = noop
-) {
-  checkRendering(renderFn, withUsage());
-
-  return (widgetParams) => {
-    const {
-      queryLanguages,
-      attributesForPrediction,
-      nbHits = 1,
-      renderDebounceTime = 100,
-      searchDebounceTime = 100,
-      // @MAJOR: this can default to false
-      escapeHTML = true,
-      extraParameters = {},
-    } = widgetParams || {};
-
-    // @ts-expect-error checking for the wrong value
-    if (!queryLanguages || queryLanguages.length === 0) {
-      throw new Error(
-        withUsage('The `queryLanguages` expects an array of strings.')
-      );
-    }
-
-    const runConcurrentSafePromise =
-      createConcurrentSafePromise<FindAnswersResponse<Hit>>();
-
-    let lastHits: FindAnswersResponse<Hit>['hits'] = [];
-    let isLoading = false;
-    const debouncedRender = debounce(renderFn, renderDebounceTime);
-
-    let debouncedRefine: DebouncedFunction<FindAnswers>;
-
-    return {
-      $$type: 'ais.answers',
-
-      init(initOptions) {
-        const { state, instantSearchInstance } = initOptions;
-        if (typeof instantSearchInstance.client.initIndex !== 'function') {
-          throw new Error(withUsage('`algoliasearch` <5 required.'));
-        }
-        const answersIndex = (instantSearchInstance.client.initIndex as any)(
-          state.index
-        );
-        if (!hasFindAnswersMethod(answersIndex)) {
-          throw new Error(withUsage('`algoliasearch` >= 4.8.0 required.'));
-        }
-        debouncedRefine = debounce(
-          answersIndex.findAnswers as unknown as FindAnswers,
-          searchDebounceTime
-        );
-
-        renderFn(
-          {
-            ...this.getWidgetRenderState(initOptions),
-            instantSearchInstance: initOptions.instantSearchInstance,
-          },
-          true
-        );
-      },
-
-      render(renderOptions) {
-        const query = renderOptions.state.query;
-        if (!query) {
-          // renders nothing with empty query
-          lastHits = [];
-          isLoading = false;
-          renderFn(
-            {
-              ...this.getWidgetRenderState(renderOptions),
-              instantSearchInstance: renderOptions.instantSearchInstance,
-            },
-            false
-          );
-          return;
-        }
-
-        // render the loader
-        lastHits = [];
-        isLoading = true;
-        renderFn(
-          {
-            ...this.getWidgetRenderState(renderOptions),
-            instantSearchInstance: renderOptions.instantSearchInstance,
-          },
-          false
-        );
-
-        // call /answers API
-        runConcurrentSafePromise(
-          debouncedRefine(query, queryLanguages, {
-            ...extraParameters,
-            nbHits,
-            attributesForPrediction,
-          }) as unknown as Promise<FindAnswersResponse<Hit>>
-        ).then((result) => {
-          if (!result) {
-            // It's undefined when it's debounced.
-            return;
-          }
-
-          if (escapeHTML && result.hits.length > 0) {
-            result.hits = escapeHits(result.hits);
-          }
-
-          const hitsWithAbsolutePosition = addAbsolutePosition(
-            result.hits,
-            0,
-            nbHits
-          );
-
-          const hitsWithAbsolutePositionAndQueryID = addQueryID(
-            hitsWithAbsolutePosition,
-            result.queryID
-          );
-
-          lastHits = hitsWithAbsolutePositionAndQueryID;
-          isLoading = false;
-          debouncedRender(
-            {
-              ...this.getWidgetRenderState(renderOptions),
-              instantSearchInstance: renderOptions.instantSearchInstance,
-            },
-            false
-          );
-        });
-      },
-
-      getRenderState(renderState, renderOptions) {
-        return {
-          ...renderState,
-          answers: this.getWidgetRenderState(renderOptions),
-        };
-      },
-
-      getWidgetRenderState() {
-        return {
-          hits: lastHits,
-          isLoading,
-          widgetParams,
-        };
-      },
-
-      dispose({ state }) {
-        unmountFn();
-        return state;
-      },
-
-      getWidgetSearchParameters(state) {
-        return state;
-      },
-    };
-  };
-};
-
-export default connectAnswers;
diff --git a/packages/instantsearch.js/src/connectors/index.ts b/packages/instantsearch.js/src/connectors/index.ts
index f14dcde625..466aa0f8c3 100644
--- a/packages/instantsearch.js/src/connectors/index.ts
+++ b/packages/instantsearch.js/src/connectors/index.ts
@@ -1,15 +1,8 @@
 import { deprecate } from '../lib/utils';
 
-import connectAnswers from './answers/connectAnswers';
 import connectConfigureRelatedItems from './configure-related-items/connectConfigureRelatedItems';
 import connectDynamicWidgets from './dynamic-widgets/connectDynamicWidgets';
 
-/** @deprecated answers is no longer supported */
-export const EXPERIMENTAL_connectAnswers = deprecate(
-  connectAnswers,
-  'answers is no longer supported'
-);
-
 /** @deprecated use connectRelatedItems instead */
 export const EXPERIMENTAL_connectConfigureRelatedItems = deprecate(
   connectConfigureRelatedItems,
diff --git a/packages/instantsearch.js/src/types/render-state.ts b/packages/instantsearch.js/src/types/render-state.ts
index f68d99be66..e1e5ae7889 100644
--- a/packages/instantsearch.js/src/types/render-state.ts
+++ b/packages/instantsearch.js/src/types/render-state.ts
@@ -1,4 +1,3 @@
-import type { AnswersWidgetDescription } from '../connectors/answers/connectAnswers';
 import type { AutocompleteWidgetDescription } from '../connectors/autocomplete/connectAutocomplete';
 import type { BreadcrumbWidgetDescription } from '../connectors/breadcrumb/connectBreadcrumb';
 import type { ClearRefinementsWidgetDescription } from '../connectors/clear-refinements/connectClearRefinements';
@@ -24,8 +23,7 @@ import type { StatsWidgetDescription } from '../connectors/stats/connectStats';
 import type { ToggleRefinementWidgetDescription } from '../connectors/toggle-refinement/connectToggleRefinement';
 import type { VoiceSearchWidgetDescription } from '../connectors/voice-search/connectVoiceSearch';
 
-type ConnectorRenderStates = AnswersWidgetDescription['indexRenderState'] &
-  AutocompleteWidgetDescription['indexRenderState'] &
+type ConnectorRenderStates = AutocompleteWidgetDescription['indexRenderState'] &
   BreadcrumbWidgetDescription['indexRenderState'] &
   ClearRefinementsWidgetDescription['indexRenderState'] &
   ConfigureWidgetDescription['indexRenderState'] &
diff --git a/packages/instantsearch.js/src/types/widget.ts b/packages/instantsearch.js/src/types/widget.ts
index 41c627f343..6aa911114b 100644
--- a/packages/instantsearch.js/src/types/widget.ts
+++ b/packages/instantsearch.js/src/types/widget.ts
@@ -56,7 +56,6 @@ export type DisposeOptions = {
 
 // @MAJOR: Remove these exported types if we don't need them
 export type BuiltinTypes =
-  | 'ais.answers'
   | 'ais.autocomplete'
   | 'ais.breadcrumb'
   | 'ais.clearRefinements'
@@ -93,7 +92,6 @@ export type BuiltinTypes =
   | 'ais.voiceSearch';
 
 export type BuiltinWidgetTypes =
-  | 'ais.answers'
   | 'ais.autocomplete'
   | 'ais.breadcrumb'
   | 'ais.clearRefinements'
diff --git a/packages/instantsearch.js/src/widgets/__tests__/index.test.ts b/packages/instantsearch.js/src/widgets/__tests__/index.test.ts
index 7e82d544bd..2192840fa9 100644
--- a/packages/instantsearch.js/src/widgets/__tests__/index.test.ts
+++ b/packages/instantsearch.js/src/widgets/__tests__/index.test.ts
@@ -127,10 +127,6 @@ function initiateAllWidgets(): Array<[WidgetNames, Widget | IndexWidget]> {
           widgets: [],
         });
       }
-      case 'EXPERIMENTAL_answers': {
-        const EXPERIMENTAL_answers = widget as Widgets['EXPERIMENTAL_answers'];
-        return EXPERIMENTAL_answers({ container, queryLanguages: ['en'] });
-      }
       case 'frequentlyBoughtTogether':
       case 'relatedProducts':
       case 'lookingSimilar': {
diff --git a/packages/instantsearch.js/src/widgets/answers/__tests__/answers-test.ts b/packages/instantsearch.js/src/widgets/answers/__tests__/answers-test.ts
deleted file mode 100644
index 6818c7b791..0000000000
--- a/packages/instantsearch.js/src/widgets/answers/__tests__/answers-test.ts
+++ /dev/null
@@ -1,170 +0,0 @@
-/**
- * @jest-environment jsdom
- */
-/** @jsx h */
-
-import { createSearchClient } from '@instantsearch/mocks';
-import { wait } from '@instantsearch/testutils/wait';
-import { fireEvent } from '@testing-library/preact';
-import algoliasearchHelper from 'algoliasearch-helper';
-
-import { createInitOptions } from '../../../../test/createWidget';
-import instantsearch from '../../../index.es';
-import searchBox from '../../search-box/search-box';
-import answers from '../answers';
-
-describe('answers', () => {
-  describe('Usage', () => {
-    it('throws without `container`', () => {
-      expect(() => {
-        // @ts-expect-error
-        answers({});
-      }).toThrowErrorMatchingInlineSnapshot(`
-"The \`container\` option is required.
-
-See documentation: https://www.algolia.com/doc/api-reference/widgets/answers/js/"
-`);
-    });
-
-    it('throws without `queryLanguages`', () => {
-      const container = document.createElement('div');
-      expect(() => {
-        // @ts-expect-error
-        answers({ container });
-      }).toThrowErrorMatchingInlineSnapshot(`
-"The \`queryLanguages\` expects an array of strings.
-
-See documentation: https://www.algolia.com/doc/api-reference/widgets/answers/js/#connector"
-`);
-    });
-
-    it('throws when searchClient does not support findAnswers', () => {
-      const container = document.createElement('div');
-      const searchClient = createSearchClient({
-        // @ts-ignore-next-line
-        initIndex() {
-          return {};
-        },
-      });
-      const helper = algoliasearchHelper(searchClient, '', {});
-      const search = instantsearch({
-        indexName: 'instant_search',
-        searchClient,
-      });
-      search.helper = helper;
-      const widget = answers({
-        container,
-        queryLanguages: ['en'],
-        attributesForPrediction: ['description'],
-      });
-      expect(() => {
-        widget.init!(
-          createInitOptions({
-            state: helper.state,
-            helper,
-            instantSearchInstance: search,
-          })
-        );
-      }).toThrowErrorMatchingInlineSnapshot(`
-"\`algoliasearch\` >= 4.8.0 required.
-
-See documentation: https://www.algolia.com/doc/api-reference/widgets/answers/js/#connector"
-`);
-    });
-  });
-
-  describe('render', () => {
-    it('renders with empty state', async () => {
-      const container = document.createElement('div');
-      const search = instantsearch({
-        indexName: 'instant_search',
-        searchClient: createSearchClient({
-          // @ts-ignore-next-line
-          initIndex() {
-            return {
-              findAnswers: () => Promise.resolve({ hits: [] }),
-            };
-          },
-        }),
-      });
-      search.addWidgets([
-        answers({
-          container,
-          queryLanguages: ['en'],
-          attributesForPrediction: ['description'],
-        }),
-      ]);
-      search.start();
-      await wait(0);
-      expect(container.innerHTML).toMatchInlineSnapshot(`
-        <div class="ais-Answers ais-Answers--empty">
-          <div class="ais-Answers-header">
-          </div>
-          <ul class="ais-Answers-list">
-          </ul>
-        </div>
-      `);
-    });
-
-    it('renders the answers', async () => {
-      const answersContainer = document.createElement('div');
-      const searchBoxContainer = document.createElement('div');
-      const search = instantsearch({
-        indexName: 'instant_search',
-        searchClient: createSearchClient({
-          // @ts-ignore-next-line
-          initIndex() {
-            return {
-              findAnswers: () => {
-                return Promise.resolve({ hits: [{ title: 'Hello' }] });
-              },
-            };
-          },
-        }),
-      });
-      search.addWidgets([
-        answers({
-          container: answersContainer,
-          queryLanguages: ['en'],
-          attributesForPrediction: ['description'],
-          renderDebounceTime: 10,
-          searchDebounceTime: 10,
-          cssClasses: {
-            root: 'root',
-            loader: 'loader',
-            emptyRoot: 'empty',
-            item: 'item',
-          },
-          templates: {
-            loader: () => 'loading...',
-            item: (hit) => `title: ${hit.title}`,
-          },
-        }),
-        searchBox({
-          container: searchBoxContainer,
-        }),
-      ]);
-      search.start();
-      await wait(0);
-
-      fireEvent.input(searchBoxContainer.querySelector('input')!, {
-        target: { value: 'a' },
-      });
-
-      await wait(0);
-      expect(answersContainer.querySelector('.loader')!.innerHTML).toEqual(
-        'loading...'
-      );
-      expect(answersContainer.querySelector('.root')).toHaveClass('empty');
-
-      await wait(100);
-
-      // debounced render
-      expect(answersContainer.querySelector('.root')).not.toHaveClass('empty');
-      expect(answersContainer.querySelectorAll('.item').length).toEqual(1);
-      expect(answersContainer.querySelector('.item')!.innerHTML).toEqual(
-        'title: Hello'
-      );
-    });
-  });
-});
diff --git a/packages/instantsearch.js/src/widgets/answers/answers.tsx b/packages/instantsearch.js/src/widgets/answers/answers.tsx
deleted file mode 100644
index 35ab9efabd..0000000000
--- a/packages/instantsearch.js/src/widgets/answers/answers.tsx
+++ /dev/null
@@ -1,201 +0,0 @@
-/** @jsx h */
-
-import { cx } from 'instantsearch-ui-components';
-import { h, render } from 'preact';
-
-import Answers from '../../components/Answers/Answers';
-import connectAnswers from '../../connectors/answers/connectAnswers';
-import { component } from '../../lib/suit';
-import { prepareTemplateProps } from '../../lib/templating';
-import {
-  createDocumentationMessageGenerator,
-  deprecate,
-  getContainerNode,
-} from '../../lib/utils';
-
-import defaultTemplates from './defaultTemplates';
-
-import type {
-  AnswersComponentCSSClasses,
-  AnswersComponentTemplates,
-} from '../../components/Answers/Answers';
-import type {
-  AnswersRenderState,
-  AnswersConnectorParams,
-  AnswersWidgetDescription,
-} from '../../connectors/answers/connectAnswers';
-import type { PreparedTemplateProps } from '../../lib/templating';
-import type { WidgetFactory, Template, Hit, Renderer } from '../../types';
-
-const withUsage = createDocumentationMessageGenerator({ name: 'answers' });
-const suit = component('Answers');
-
-const renderer =
-  ({
-    containerNode,
-    cssClasses,
-    renderState,
-    templates,
-  }: {
-    containerNode: HTMLElement;
-    cssClasses: AnswersComponentCSSClasses;
-    renderState: {
-      templateProps?: PreparedTemplateProps<AnswersComponentTemplates>;
-    };
-    templates: AnswersTemplates;
-  }): Renderer<AnswersRenderState, Partial<AnswersWidgetParams>> =>
-  ({ hits, isLoading }, isFirstRendering) => {
-    if (isFirstRendering) {
-      renderState.templateProps = prepareTemplateProps({
-        defaultTemplates,
-        templates,
-      });
-      return;
-    }
-
-    render(
-      <Answers
-        cssClasses={cssClasses}
-        hits={hits}
-        isLoading={isLoading}
-        templateProps={renderState.templateProps!}
-      />,
-      containerNode
-    );
-  };
-
-export type AnswersTemplates = Partial<{
-  /**
-   * Template to use for the header. This template will receive an object containing `hits` and `isLoading`.
-   */
-  header: Template<{
-    hits: Hit[];
-    isLoading: boolean;
-  }>;
-
-  /**
-   * Template to use for the loader.
-   */
-  loader: Template;
-
-  /**
-   * Template to use for each result. This template will receive an object containing a single record.
-   */
-  item: Template<Hit>;
-}>;
-
-export type AnswersCSSClasses = Partial<{
-  /**
-   * CSS class to add to the root element of the widget.
-   */
-  root: string | string[];
-
-  /**
-   * CSS class to add to the wrapping element when no results.
-   */
-  emptyRoot: string | string[];
-
-  /**
-   * CSS classes to add to the header.
-   */
-  header: string | string[];
-
-  /**
-   * CSS classes to add to the loader.
-   */
-  loader: string | string[];
-
-  /**
-   * CSS class to add to the list of results.
-   */
-  list: string | string[];
-
-  /**
-   * CSS class to add to each result.
-   */
-  item: string | string[];
-}>;
-
-export type AnswersWidgetParams = {
-  /**
-   * CSS Selector or HTMLElement to insert the widget.
-   */
-  container: string | HTMLElement;
-
-  /**
-   * The templates to use for the widget.
-   */
-  templates?: AnswersTemplates;
-
-  /**
-   * The CSS classes to override.
-   */
-  cssClasses?: AnswersCSSClasses;
-};
-
-export type AnswersWidget = WidgetFactory<
-  AnswersWidgetDescription & { $$widgetType: 'ais.answers' },
-  AnswersConnectorParams,
-  AnswersWidgetParams
->;
-
-/**
- * @deprecated the answers service is no longer offered, and this widget will be removed in InstantSearch.js v5
- */
-const answersWidget: AnswersWidget = (widgetParams) => {
-  const {
-    container,
-    attributesForPrediction,
-    queryLanguages,
-    nbHits,
-    searchDebounceTime,
-    renderDebounceTime,
-    escapeHTML,
-    extraParameters,
-    templates = {},
-    cssClasses: userCssClasses = {},
-  } = widgetParams || {};
-
-  if (!container) {
-    throw new Error(withUsage('The `container` option is required.'));
-  }
-
-  const containerNode = getContainerNode(container);
-  const cssClasses = {
-    root: cx(suit(), userCssClasses.root),
-    emptyRoot: cx(suit({ modifierName: 'empty' }), userCssClasses.emptyRoot),
-    header: cx(suit({ descendantName: 'header' }), userCssClasses.header),
-    loader: cx(suit({ descendantName: 'loader' }), userCssClasses.loader),
-    list: cx(suit({ descendantName: 'list' }), userCssClasses.list),
-    item: cx(suit({ descendantName: 'item' }), userCssClasses.item),
-  };
-
-  const specializedRenderer = renderer({
-    containerNode,
-    cssClasses,
-    templates,
-    renderState: {},
-  });
-
-  const makeWidget = connectAnswers(specializedRenderer, () =>
-    render(null, containerNode)
-  );
-
-  return {
-    ...makeWidget({
-      attributesForPrediction,
-      queryLanguages,
-      nbHits,
-      searchDebounceTime,
-      renderDebounceTime,
-      escapeHTML,
-      extraParameters,
-    }),
-    $$widgetType: 'ais.answers',
-  };
-};
-
-export default deprecate(
-  answersWidget,
-  'The answers widget is deprecated and will be removed in InstantSearch.js 5.0'
-);
diff --git a/packages/instantsearch.js/src/widgets/answers/defaultTemplates.ts b/packages/instantsearch.js/src/widgets/answers/defaultTemplates.ts
deleted file mode 100644
index 1dd2586a9a..0000000000
--- a/packages/instantsearch.js/src/widgets/answers/defaultTemplates.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import type { AnswersComponentTemplates } from '../../components/Answers/Answers';
-
-const defaultTemplates: AnswersComponentTemplates = {
-  header() {
-    return '';
-  },
-  loader() {
-    return '';
-  },
-  item(item) {
-    return JSON.stringify(item);
-  },
-};
-
-export default defaultTemplates;
diff --git a/packages/instantsearch.js/src/widgets/index.ts b/packages/instantsearch.js/src/widgets/index.ts
index c9796d8c99..4703a77132 100644
--- a/packages/instantsearch.js/src/widgets/index.ts
+++ b/packages/instantsearch.js/src/widgets/index.ts
@@ -1,15 +1,8 @@
 import { deprecate } from '../lib/utils';
 
-import answers from './answers/answers';
 import configureRelatedItems from './configure-related-items/configure-related-items';
 import dynamicWidgets from './dynamic-widgets/dynamic-widgets';
 
-/** @deprecated answers is no longer supported */
-export const EXPERIMENTAL_answers = deprecate(
-  answers,
-  'answers is no longer supported'
-);
-
 /** @deprecated use relatedItems instead */
 export const EXPERIMENTAL_configureRelatedItems = deprecate(
   configureRelatedItems,
diff --git a/packages/instantsearch.js/stories/answers.stories.ts b/packages/instantsearch.js/stories/answers.stories.ts
deleted file mode 100644
index 78c10b610d..0000000000
--- a/packages/instantsearch.js/stories/answers.stories.ts
+++ /dev/null
@@ -1,121 +0,0 @@
-import { storiesOf } from '@storybook/html';
-
-import { withHits } from '../.storybook/decorators';
-import '../.storybook/static/answers.css';
-
-const searchOptions = {
-  appId: 'CKOEQ4XGMU',
-  apiKey: '6560d3886292a5aec86d63b9a2cba447',
-  indexName: 'ted',
-};
-
-storiesOf('Results/Answers', module)
-  .add(
-    'default',
-    withHits(({ search, container, instantsearch }) => {
-      const p = document.createElement('p');
-      p.innerText = `Try to search for "sarah jones"`;
-      const answersContainer = document.createElement('div');
-      container.appendChild(p);
-      container.appendChild(answersContainer);
-
-      search.addWidgets([
-        instantsearch.widgets.EXPERIMENTAL_answers({
-          container: answersContainer,
-          queryLanguages: ['en'],
-          attributesForPrediction: ['description'],
-          templates: {
-            item: (hit, { html }) => html`<p>${hit._answer.extract}</p>`,
-          },
-        }),
-      ]);
-    }, searchOptions)
-  )
-  .add(
-    'with header',
-    withHits(({ search, container, instantsearch }) => {
-      const p = document.createElement('p');
-      p.innerText = `Try to search for "sarah jones"`;
-      const answersContainer = document.createElement('div');
-      container.appendChild(p);
-      container.appendChild(answersContainer);
-
-      search.addWidgets([
-        instantsearch.widgets.EXPERIMENTAL_answers({
-          container: answersContainer,
-          queryLanguages: ['en'],
-          attributesForPrediction: ['description'],
-          templates: {
-            header: ({ hits }) => {
-              return hits.length === 0 ? '' : `<p>Answers</p>`;
-            },
-            item: (hit, { html }) => html`<p>${hit._answer.extract}</p>`,
-          },
-        }),
-      ]);
-    }, searchOptions)
-  )
-  .add(
-    'with loader',
-    withHits(({ search, container, instantsearch }) => {
-      const p = document.createElement('p');
-      p.innerText = `Try to search for "sarah jones"`;
-      const answersContainer = document.createElement('div');
-      container.appendChild(p);
-      container.appendChild(answersContainer);
-
-      search.addWidgets([
-        instantsearch.widgets.EXPERIMENTAL_answers({
-          container: answersContainer,
-          queryLanguages: ['en'],
-          attributesForPrediction: ['description'],
-          templates: {
-            header: ({ hits }, { html }) => {
-              return hits.length === 0 ? '' : html`<p>Answers</p>`;
-            },
-            loader: () => `loading...`,
-            item: (hit, { html }) => html`<p>${hit._answer.extract}</p>`,
-          },
-        }),
-      ]);
-    }, searchOptions)
-  )
-  .add(
-    'full example',
-    withHits(({ search, container, instantsearch }) => {
-      const p = document.createElement('p');
-      p.innerText = `Try to search for "sarah jones"`;
-      const answersContainer = document.createElement('div');
-      container.appendChild(p);
-      container.appendChild(answersContainer);
-
-      search.addWidgets([
-        instantsearch.widgets.EXPERIMENTAL_answers({
-          container: answersContainer,
-          queryLanguages: ['en'],
-          attributesForPrediction: ['description'],
-          cssClasses: {
-            root: 'my-Answers',
-          },
-          templates: {
-            loader: (_, { html }) => html`
-              <div class="card-skeleton">
-                <div class="animated-background">
-                  <div class="skel-mask-container">
-                    <div class="skel-mask skel-mask-1"></div>
-                    <div class="skel-mask skel-mask-2"></div>
-                    <div class="skel-mask skel-mask-3"></div>
-                  </div>
-                </div>
-              </div>
-            `,
-            item: (hit, { html }) => html`
-              <p class="title one-line">${hit.title}</p>
-              <div class="separator"></div>
-              <p class="description three-lines">${hit._answer.extract}</p>
-            `,
-          },
-        }),
-      ]);
-    }, searchOptions)
-  );
diff --git a/specs/src/pages/widgets/answers.md b/specs/src/pages/widgets/answers.md
deleted file mode 100644
index efe968d052..0000000000
--- a/specs/src/pages/widgets/answers.md
+++ /dev/null
@@ -1,58 +0,0 @@
----
-layout: ../../layouts/WidgetLayout.astro
-title: Answers
-type: widget
-html: |
-  <div class="ais-Answers">
-    <div class="ais-Answers-header">Algolia Answers</div>
-    <ul class="ais-Answers-list">
-      <li class="ais-Answers-item">Author Sam Martin shares photos of ...</li>
-      <li class="ais-Answers-item">Beau Lotto's color games puzzle your vision, but they also spotlight what you can't normally see...</li>
-    </ul>
-  </div>
-alt1: empty
-althtml1: |
-  <div class="ais-Answers ais-Answers--empty">
-    <div class="ais-Answers-header">Algolia Answers</div>
-    <ul class="ais-Answers-list"></ul>
-  </div>
-alt2: loading
-althtml2: |
-  <div class="ais-Answers ais-Answers--empty">
-    <div class="ais-Answers-header">Algolia Answers</div>
-    <div class="ais-Answers-loader">loading...</div>
-  </div>
-classes:
-  - name: .ais-Answers
-    description: the root div of the widget
-  - name: .ais-Answers--empty
-    description: the root div of the widget with no items
-  - name: .ais-Answers-header
-    description: the header
-  - name: .ais-Answers-loader
-    description: the loader when it's loading
-  - name: .ais-Answers-list
-    description: the list of Answers result
-  - name: .ais-Answers-item
-    description: the list item
-options:
-  - name: queryLanguages
-    description: The languages in the query. Currently only supports `en`.
-  - name: attributesForPrediction
-    description: |
-      Attributes to use for prediction.
-      If empty, we use all `searchableAttributes` to find answers.
-      All your `attributesForPrediction` must be part of your `searchableAttributes`.
-    default: "['*']"
-  - name: nbHits
-    description: |
-      Maximum number of answers to retrieve from the Answers Engine.
-      Cannot be greater than 1000.
-    default: 1
-  - name: debounceTime
-    description: Debounce time in milliseconds before querying the answers API
-    default: 200
-  - name: escapeHTML
-    description: Whether to escape HTML tags from hits string values.
-    default: true
----