vue-instantsearch 4.4.2 → 4.5.0

package/CHANGELOG.md

@@ -1,3 +1,17 @@
+# [4.5.0](https://github.com/algolia/vue-instantsearch/compare/v4.4.2...v4.5.0) (2022-09-07)
+
+
+### Bug Fixes
+
+* **nuxt:** only write $nuxt if it's writable ([#1117](https://github.com/algolia/vue-instantsearch/issues/1117)) ([bdecca9](https://github.com/algolia/vue-instantsearch/commit/bdecca9334322e9405ca21e6c6d51735d3ec042f)), closes [/github.com/algolia/vue-instantsearch/commit/acda29326475bd1b73f12b058a0c02df00b8b239#commitcomment-67430759](https://github.com//github.com/algolia/vue-instantsearch/commit/acda29326475bd1b73f12b058a0c02df00b8b239/issues/commitcomment-67430759)
+
+
+### Features
+
+* **can-refine:** provide `canRefine` for multiple widget slots ([#1141](https://github.com/algolia/vue-instantsearch/issues/1141)) ([424316d](https://github.com/algolia/vue-instantsearch/commit/424316d8c6e23d4573c0d6a63c56ef919da864e1))
+
+
+
 ## [4.4.2](https://github.com/algolia/vue-instantsearch/compare/v4.4.1...v4.4.2) (2022-07-25)
 
 

package/package.json

@@ -16,7 +16,7 @@
     "autocomplete"
   ],
   "license": "MIT",
-  "version": "4.4.2",
+  "version": "4.5.0",
   "files": [
     "vue2",
     "vue3",
@@ -46,7 +46,7 @@
     "release": "shipjs prepare"
   },
   "dependencies": {
-    "instantsearch.js": "^4.43.0",
+    "instantsearch.js": "^4.45.0",
     "mitt": "^2.1.0"
   },
   "peerDependencies": {
@@ -133,11 +133,11 @@
   "bundlesize": [
     {
       "path": "./vue2/umd/index.js",
-      "maxSize": "56.50 kB"
+      "maxSize": "56.75 kB"
     },
     {
       "path": "./vue3/umd/index.js",
-      "maxSize": "57.75 kB"
+      "maxSize": "58.00 kB"
     },
     {
       "path": "./vue2/cjs/index.js",

package/src/components/Breadcrumb.vue

@@ -64,9 +64,7 @@ export default {
         $$widgetType: 'ais.breadcrumb',
       }
     ),
-    createPanelConsumerMixin({
-      mapStateToCanRefine: state => Boolean(state.canRefine),
-    }),
+    createPanelConsumerMixin(),
     createSuitMixin({ name: 'Breadcrumb' }),
   ],
   props: {

package/src/components/ClearRefinements.vue

@@ -37,9 +37,7 @@ export default {
         $$widgetType: 'ais.clearRefinements',
       }
     ),
-    createPanelConsumerMixin({
-      mapStateToCanRefine: state => Boolean(state.hasRefinements),
-    }),
+    createPanelConsumerMixin(),
     createSuitMixin({ name: 'ClearRefinements' }),
   ],
   props: {

package/src/components/CurrentRefinements.vue

@@ -71,10 +71,7 @@ export default {
         $$widgetType: 'ais.currentRefinements',
       }
     ),
-    createPanelConsumerMixin({
-      mapStateToCanRefine: state =>
-        Boolean(state.items) && state.items.length > 0,
-    }),
+    createPanelConsumerMixin(),
   ],
   props: {
     includedAttributes: {

package/src/components/HierarchicalMenu.vue

@@ -1,11 +1,11 @@
 <template>
   <div
     v-if="state"
-    :class="[suit(), !canRefine && suit('', 'noRefinement')]"
+    :class="[suit(), !state.canRefine && suit('', 'noRefinement')]"
   >
     <slot
       :items="state.items"
-      :can-refine="canRefine"
+      :can-refine="state.canRefine"
       :can-toggle-show-more="state.canToggleShowMore"
       :is-showing-more="state.isShowingMore"
       :refine="state.refine"
@@ -46,9 +46,6 @@ import { createPanelConsumerMixin } from '../mixins/panel';
 import HierarchicalMenuList from './HierarchicalMenuList.vue';
 import { createSuitMixin } from '../mixins/suit';
 
-const mapStateToCanRefine = state =>
-  Boolean(state.items) && state.items.length > 0;
-
 export default {
   name: 'AisHierarchicalMenu',
   mixins: [
@@ -61,9 +58,7 @@ export default {
         $$widgetType: 'ais.hierarchicalMenu',
       }
     ),
-    createPanelConsumerMixin({
-      mapStateToCanRefine,
-    }),
+    createPanelConsumerMixin(),
   ],
   components: {
     HierarchicalMenuList,
@@ -120,9 +115,6 @@ export default {
         transformItems: this.transformItems,
       };
     },
-    canRefine() {
-      return mapStateToCanRefine(this.state);
-    },
   },
 };
 </script>

package/src/components/HitsPerPage.vue

@@ -7,6 +7,7 @@
       :items="state.items"
       :refine="state.refine"
       :hasNoResults="state.hasNoResults"
+      :canRefine="state.canRefine"
     >
       <select
         :class="suit('select')"
@@ -42,9 +43,7 @@ export default {
         $$widgetType: 'ais.hitsPerPage',
       }
     ),
-    createPanelConsumerMixin({
-      mapStateToCanRefine: state => state.hasNoResults === false,
-    }),
+    createPanelConsumerMixin(),
   ],
   props: {
     items: {

package/src/components/Menu.vue

@@ -61,9 +61,7 @@ export default {
         $$widgetType: 'ais.menu',
       }
     ),
-    createPanelConsumerMixin({
-      mapStateToCanRefine: state => Boolean(state.canRefine),
-    }),
+    createPanelConsumerMixin(),
   ],
   props: {
     attribute: {

package/src/components/MenuSelect.vue

@@ -53,9 +53,7 @@ export default {
         $$widgetType: 'ais.menuSelect',
       }
     ),
-    createPanelConsumerMixin({
-      mapStateToCanRefine: state => Boolean(state.canRefine),
-    }),
+    createPanelConsumerMixin(),
   ],
   props: {
     attribute: {

package/src/components/NumericMenu.vue

@@ -1,11 +1,11 @@
 <template>
   <div
     v-if="state"
-    :class="[suit(), !canRefine && suit('', 'noRefinement')]"
+    :class="[suit(), !state.canRefine && suit('', 'noRefinement')]"
   >
     <slot
       :items="state.items"
-      :can-refine="canRefine"
+      :can-refine="state.canRefine"
       :refine="state.refine"
       :createURL="state.createURL"
       :send-event="state.sendEvent"
@@ -51,9 +51,7 @@ export default {
       }
     ),
     createSuitMixin({ name: 'NumericMenu' }),
-    createPanelConsumerMixin({
-      mapStateToCanRefine: state => state.hasNoResults === false,
-    }),
+    createPanelConsumerMixin(),
   ],
   props: {
     attribute: {
@@ -77,9 +75,6 @@ export default {
         items: this.items,
       };
     },
-    canRefine() {
-      return !this.state.hasNoResults;
-    },
   },
 };
 </script>

package/src/components/Pagination.vue

@@ -183,9 +183,7 @@ export default {
         $$widgetType: 'ais.pagination',
       }
     ),
-    createPanelConsumerMixin({
-      mapStateToCanRefine: state => state.nbPages > 1,
-    }),
+    createPanelConsumerMixin(),
   ],
   props: {
     padding: {

package/src/components/RangeInput.vue

@@ -1,12 +1,12 @@
 <template>
   <div
     v-if="state"
-    :class="[suit(), !canRefine && suit('', 'noRefinement')]"
+    :class="[suit(), !state.canRefine && suit('', 'noRefinement')]"
   >
     <slot
       :current-refinement="values"
       :refine="refine"
-      :can-refine="canRefine"
+      :can-refine="state.canRefine"
       :range="state.range"
       :send-event="state.sendEvent"
     >
@@ -60,9 +60,6 @@ import { createWidgetMixin } from '../mixins/widget';
 import { createPanelConsumerMixin } from '../mixins/panel';
 import { createSuitMixin } from '../mixins/suit';
 
-const mapStateToCanRefine = state =>
-  state && Boolean(state.range) && state.range.min !== state.range.max;
-
 export default {
   name: 'AisRangeInput',
   mixins: [
@@ -75,9 +72,7 @@ export default {
         $$widgetType: 'ais.rangeInput',
       }
     ),
-    createPanelConsumerMixin({
-      mapStateToCanRefine,
-    }),
+    createPanelConsumerMixin(),
   ],
   props: {
     attribute: {
@@ -119,9 +114,6 @@ export default {
         precision: this.precision,
       };
     },
-    canRefine() {
-      return mapStateToCanRefine(this.state);
-    },
     step() {
       return 1 / Math.pow(10, this.precision);
     },

package/src/components/RatingMenu.vue

@@ -8,6 +8,7 @@
       :refine="state.refine"
       :createURL="state.createURL"
       :send-event="state.sendEvent"
+      :can-refine="state.canRefine"
     >
       <svg
         xmlns="http://www.w3.org/2000/svg"
@@ -95,9 +96,7 @@ export default {
         $$widgetType: 'ais.ratingMenu',
       }
     ),
-    createPanelConsumerMixin({
-      mapStateToCanRefine: state => state.hasNoResults === false,
-    }),
+    createPanelConsumerMixin(),
   ],
   props: {
     attribute: {

package/src/components/RefinementList.vue

@@ -118,9 +118,7 @@ export default {
         $$widgetType: 'ais.refinementList',
       }
     ),
-    createPanelConsumerMixin({
-      mapStateToCanRefine: state => Boolean(state.canRefine),
-    }),
+    createPanelConsumerMixin(),
   ],
   props: {
     attribute: {

package/src/components/SortBy.vue

@@ -8,6 +8,7 @@
       :has-no-results="state.hasNoResults"
       :refine="state.refine"
       :current-refinement="state.currentRefinement"
+      :can-refine="state.canRefine"
     >
       <select
         :class="suit('select')"
@@ -42,9 +43,7 @@ export default {
       }
     ),
 
-    createPanelConsumerMixin({
-      mapStateToCanRefine: state => state.hasNoResults === false,
-    }),
+    createPanelConsumerMixin(),
   ],
   props: {
     items: {

package/src/components/ToggleRefinement.vue

@@ -1,11 +1,11 @@
 <template>
   <div
     v-if="state"
-    :class="[suit(), !canRefine && suit('', 'noRefinement')]"
+    :class="[suit(), !state.canRefine && suit('', 'noRefinement')]"
   >
     <slot
       :value="state.value"
-      :can-refine="canRefine"
+      :can-refine="state.canRefine"
       :refine="state.refine"
       :createURL="state.createURL"
       :send-event="state.sendEvent"
@@ -35,8 +35,6 @@ import { createWidgetMixin } from '../mixins/widget';
 import { createPanelConsumerMixin } from '../mixins/panel';
 import { createSuitMixin } from '../mixins/suit';
 
-const mapStateToCanRefine = state => Boolean(state.value && state.value.count);
-
 export default {
   name: 'AisToggleRefinement',
   mixins: [
@@ -49,9 +47,7 @@ export default {
         $$widgetType: 'ais.toggleRefinement',
       }
     ),
-    createPanelConsumerMixin({
-      mapStateToCanRefine,
-    }),
+    createPanelConsumerMixin(),
   ],
   props: {
     attribute: {
@@ -82,9 +78,6 @@ export default {
         off: this.off,
       };
     },
-    canRefine() {
-      return mapStateToCanRefine(this.state);
-    },
   },
 };
 </script>

package/src/components/__tests__/Breadcrumb.js

@@ -182,31 +182,6 @@ describe('default render', () => {
   });
 });
 
-describe('panel', () => {
-  it('calls the Panel mixin with `canRefine`', async () => {
-    __setState({ ...defaultState });
-
-    const wrapper = mount(Breadcrumb, {
-      propsData: defaultProps,
-    });
-
-    const mapStateToCanRefine = () =>
-      wrapper.vm.mapStateToCanRefine(wrapper.vm.state);
-
-    expect(mapStateToCanRefine()).toBe(true);
-
-    await wrapper.setData({
-      state: {
-        canRefine: false,
-      },
-    });
-
-    expect(mapStateToCanRefine()).toBe(false);
-
-    expect(wrapper.vm.mapStateToCanRefine({})).toBe(false);
-  });
-});
-
 describe('custom default render', () => {
   const defaultSlot = `
     <template v-slot="{ items, canRefine, refine, createURL }">

package/src/components/__tests__/ClearRefinements.js

@@ -187,26 +187,3 @@ describe('custom resetLabel render', () => {
     expect(wrapper.html()).toMatchSnapshot();
   });
 });
-
-it('calls the Panel mixin with `hasRefinement`', async () => {
-  __setState({
-    hasRefinements: true,
-  });
-
-  const wrapper = mount(ClearRefinements);
-
-  const mapStateToCanRefine = () =>
-    wrapper.vm.mapStateToCanRefine(wrapper.vm.state);
-
-  expect(mapStateToCanRefine()).toBe(true);
-
-  await wrapper.setData({
-    state: {
-      hasRefinements: false,
-    },
-  });
-
-  expect(mapStateToCanRefine()).toBe(false);
-
-  expect(wrapper.vm.mapStateToCanRefine({})).toBe(false);
-});

package/src/components/__tests__/CurrentRefinements.js

@@ -167,23 +167,6 @@ describe.each([
   });
 });
 
-it('calls the Panel mixin with `canRefine`', async () => {
-  __setState({ items: [{}] });
-
-  const wrapper = mount(CurrentRefinements);
-
-  const mapStateToCanRefine = () =>
-    wrapper.vm.mapStateToCanRefine(wrapper.vm.state);
-
-  expect(mapStateToCanRefine()).toBe(true);
-
-  await wrapper.setData({ state: { items: [] } });
-
-  expect(mapStateToCanRefine()).toBe(false);
-
-  expect(wrapper.vm.mapStateToCanRefine({})).toBe(false);
-});
-
 it('calls `refine` with a refinement', async () => {
   const spies = [jest.fn(), jest.fn()];
 

package/src/components/__tests__/HierarchicalMenu.js

@@ -116,6 +116,7 @@ const defaultState = {
   createURL: () => {},
   isShowingMore: false,
   canToggleShowMore: true,
+  canRefine: true,
   toggleShowMore: () => {},
   sendEvent: () => {},
 };
@@ -266,6 +267,7 @@ describe('default render', () => {
     __setState({
       ...defaultState,
       items: [],
+      canRefine: false,
     });
 
     const wrapper = mount(HierarchicalMenu, {
@@ -466,25 +468,6 @@ describe('default render', () => {
   });
 });
 
-it('calls the Panel mixin with `items.length`', async () => {
-  __setState({ ...defaultState });
-
-  const wrapper = mount(HierarchicalMenu, {
-    propsData: defaultProps,
-  });
-
-  const mapStateToCanRefine = () =>
-    wrapper.vm.mapStateToCanRefine(wrapper.vm.state);
-
-  expect(mapStateToCanRefine()).toBe(true);
-
-  await wrapper.setData({ state: { items: [] } });
-
-  expect(mapStateToCanRefine()).toBe(false);
-
-  expect(wrapper.vm.mapStateToCanRefine({})).toBe(false);
-});
-
 it('exposes send-event method for insights middleware', async () => {
   const sendEvent = jest.fn();
   __setState({
@@ -574,6 +557,7 @@ describe('custom default render', () => {
     __setState({
       ...defaultState,
       items: [],
+      canRefine: false,
     });
 
     const wrapper = mount({

package/src/components/__tests__/HitsPerPage.js

@@ -76,29 +76,3 @@ it('calls `refine` with the `value` on `change`', async () => {
 
   expect(wrapper.vm.state.refine).toHaveBeenLastCalledWith(20);
 });
-
-it('calls the Panel mixin with `hasNoResults`', async () => {
-  __setState({
-    ...defaultState,
-    hasNoResults: false,
-  });
-
-  const wrapper = mount(HitsPerPage, {
-    propsData: defaultProps,
-  });
-
-  const mapStateToCanRefine = () =>
-    wrapper.vm.mapStateToCanRefine(wrapper.vm.state);
-
-  expect(mapStateToCanRefine()).toBe(true);
-
-  await wrapper.setData({
-    state: {
-      hasNoResults: true,
-    },
-  });
-
-  expect(mapStateToCanRefine()).toBe(false);
-
-  expect(wrapper.vm.mapStateToCanRefine({})).toBe(false);
-});

package/src/components/__tests__/Menu.js

@@ -325,28 +325,6 @@ describe('default render', () => {
   });
 });
 
-it('calls the Panel mixin with `canRefine`', async () => {
-  __setState({ ...defaultState });
-
-  const wrapper = mount(Menu, {
-    propsData: defaultProps,
-  });
-
-  const mapStateToCanRefine = () =>
-    wrapper.vm.mapStateToCanRefine(wrapper.vm.state);
-
-  expect(mapStateToCanRefine()).toBe(true);
-
-  await wrapper.setData({
-    state: {
-      canRefine: false,
-    },
-  });
-  expect(mapStateToCanRefine()).toBe(false);
-
-  expect(wrapper.vm.mapStateToCanRefine({})).toBe(false);
-});
-
 it('exposes send-event method for insights middleware', async () => {
   const sendEvent = jest.fn();
   __setState({

package/src/components/__tests__/MenuSelect.js

@@ -201,29 +201,6 @@ describe('default render', () => {
   });
 });
 
-it('calls the Panel mixin with `canRefine`', async () => {
-  __setState({ ...defaultState });
-
-  const wrapper = mount(MenuSelect, {
-    propsData: defaultProps,
-  });
-
-  const mapStateToCanRefine = () =>
-    wrapper.vm.mapStateToCanRefine(wrapper.vm.state);
-
-  expect(mapStateToCanRefine()).toBe(true);
-
-  await wrapper.setData({
-    state: {
-      canRefine: false,
-    },
-  });
-
-  expect(mapStateToCanRefine()).toBe(false);
-
-  expect(wrapper.vm.mapStateToCanRefine({})).toBe(false);
-});
-
 it('exposes send-event method for insights middleware', async () => {
   const sendEvent = jest.fn();
   __setState({

package/src/components/__tests__/NumericMenu.js

@@ -41,6 +41,7 @@ const moreThan500 = {
 const defaultState = {
   items: [all, lessThan10, from10to100, from100to500, moreThan500],
   hasNoResults: false,
+  canRefine: true,
   createURL: () => {},
   refine: () => {},
 };
@@ -125,7 +126,7 @@ describe('default render', () => {
   it('renders correctly without refinement', () => {
     __setState({
       ...defaultState,
-      hasNoResults: true,
+      canRefine: false,
     });
 
     const props = {
@@ -190,29 +191,6 @@ describe('default render', () => {
   });
 });
 
-it('calls the Panel mixin with `hasNoResults`', async () => {
-  __setState({ ...defaultState });
-
-  const wrapper = mount(NumericMenu, {
-    propsData: defaultProps,
-  });
-
-  const mapStateToCanRefine = () =>
-    wrapper.vm.mapStateToCanRefine(wrapper.vm.state);
-
-  expect(mapStateToCanRefine()).toBe(true);
-
-  await wrapper.setData({
-    state: {
-      hasNoResults: true,
-    },
-  });
-
-  expect(mapStateToCanRefine()).toBe(false);
-
-  expect(wrapper.vm.mapStateToCanRefine({})).toBe(false);
-});
-
 it('exposes send-event method for insights middleware', async () => {
   const sendEvent = jest.fn();
   __setState({
@@ -281,7 +259,7 @@ describe('custom default render', () => {
   it('renders correctly without refinement', () => {
     __setState({
       ...defaultState,
-      hasNoResults: true,
+      canRefine: false,
     });
 
     const wrapper = mount({

package/src/components/__tests__/Pagination.js

@@ -143,27 +143,6 @@ it('Moves to the previous page on that button', async () => {
   );
 });
 
-it('calls the Panel mixin with `nbPages`', async () => {
-  __setState({ ...defaultState });
-
-  const wrapper = mount(Pagination);
-
-  const mapStateToCanRefine = () =>
-    wrapper.vm.mapStateToCanRefine(wrapper.vm.state);
-
-  expect(mapStateToCanRefine()).toBe(true);
-
-  await wrapper.setData({
-    state: {
-      nbPages: 1,
-    },
-  });
-
-  expect(mapStateToCanRefine()).toBe(false);
-
-  expect(wrapper.vm.mapStateToCanRefine({})).toBe(false);
-});
-
 it('implements showFirst', async () => {
   __setState({ ...defaultState });