feat(js): provide setters and refresh to render API (#598)

Author: francoischalifour

packages/autocomplete-js/src/__tests__/render.test.ts

@@ -536,6 +536,48 @@ describe('render', () => {
     });
   });
 
+  test('provides the scoped API', () => {
+    const container = document.createElement('div');
+    const panelContainer = document.createElement('div');
+
+    document.body.appendChild(panelContainer);
+    autocomplete<{ label: string }>({
+      container,
+      panelContainer,
+      initialState: {
+        isOpen: true,
+      },
+      getSources() {
+        return [
+          {
+            sourceId: 'testSource',
+            getItems() {
+              return [{ label: '1' }];
+            },
+            templates: {
+              item({ item }) {
+                return item.label;
+              },
+            },
+          },
+        ];
+      },
+      render(params) {
+        expect(params).toEqual(
+          expect.objectContaining({
+            refresh: expect.any(Function),
+            setActiveItemId: expect.any(Function),
+            setCollections: expect.any(Function),
+            setContext: expect.any(Function),
+            setIsOpen: expect.any(Function),
+            setQuery: expect.any(Function),
+            setStatus: expect.any(Function),
+          })
+        );
+      },
+    });
+  });
+
   test('does not render the sections without results and noResults template on multi sources', async () => {
     const container = document.createElement('div');
     const panelContainer = document.createElement('div');

packages/autocomplete-js/src/render.tsx

@@ -196,6 +196,7 @@ export function renderPanel<TItem extends BaseItem>(
       createElement,
       Fragment,
       components,
+      ...autocompleteScopeApi,
     },
     dom.panel
   );

packages/autocomplete-js/src/types/AutocompleteRender.ts

@@ -1,11 +1,11 @@
-import { BaseItem } from '@algolia/autocomplete-core';
+import { AutocompleteScopeApi, BaseItem } from '@algolia/autocomplete-core';
 
 import { AutocompleteComponents } from './AutocompleteComponents';
 import { Pragma, PragmaFrag, VNode } from './AutocompleteRenderer';
 import { AutocompleteState } from './AutocompleteState';
 
 export type AutocompleteRender<TItem extends BaseItem> = (
-  params: {
+  params: AutocompleteScopeApi<TItem> & {
     children: VNode;
     state: AutocompleteState<TItem>;
     sections: VNode[];