vue-instantsearch 4.7.0 → 4.7.1

package/src/components/MenuSelect.vue

@@ -14,11 +14,8 @@
         :class="suit('select')"
         @change="refine($event.currentTarget.value)"
       >
-        <option
-          :class="suit('option')"
-          value=""
-        >
-          <slot name="defaultOption">See all</slot>
+        <option :class="suit('option')" value="">
+          <slot name="defaultOption"> See all </slot>
         </option>
         <option
           v-for="item in state.items"
@@ -27,10 +24,9 @@
           :value="item.value"
           :selected="item.isRefined"
         >
-          <slot
-            name="item"
-            :item="item"
-          >{{ item.label }} ({{ item.count }})</slot>
+          <slot name="item" :item="item">
+            {{ item.label }} ({{ item.count }})
+          </slot>
         </option>
       </select>
     </slot>

package/src/components/NumericMenu.vue

@@ -24,7 +24,7 @@
               :value="item.value"
               :checked="item.isRefined"
               @change="state.refine($event.target.value)"
-            >
+            />
             <span :class="suit('labelText')">{{ item.label }}</span>
           </label>
         </li>

package/src/components/Pagination.vue

@@ -1,8 +1,5 @@
 <template>
-  <div
-    v-if="state"
-    :class="suit()"
-  >
+  <div v-if="state" :class="suit()">
     <slot
       :refine="refine"
       :createURL="state.createURL"
@@ -34,13 +31,11 @@
                 aria-label="First"
                 :href="state.createURL(0)"
                 @click.prevent="refine(0)"
-              >‹‹</a>
+                >‹‹</a
+              >
             </template>
             <template v-else>
-              <span
-                :class="suit('link')"
-                aria-label="First"
-              >‹‹</span>
+              <span :class="suit('link')" aria-label="First">‹‹</span>
             </template>
           </slot>
         </li>
@@ -64,13 +59,11 @@
                 aria-label="Previous"
                 :href="state.createURL(state.currentRefinement - 1)"
                 @click.prevent="refine(state.currentRefinement - 1)"
-              >‹</a>
+                >‹</a
+              >
             </template>
             <template v-else>
-              <span
-                :class="suit('link')"
-                aria-label="Previous"
-              >‹</span>
+              <span :class="suit('link')" aria-label="Previous">‹</span>
             </template>
           </slot>
         </li>
@@ -79,7 +72,7 @@
           :class="{
             [suit('item')]: true,
             [suit('item', 'page')]: true,
-            [suit('item', 'selected')]: state.currentRefinement === page
+            [suit('item', 'selected')]: state.currentRefinement === page,
           }"
           v-for="page in state.pages"
           :key="page"
@@ -96,15 +89,16 @@
               :class="suit('link')"
               :href="state.createURL(page)"
               @click.prevent="refine(page)"
-            >{{ page + 1 }}</a>
+              >{{ page + 1 }}</a
+            >
           </slot>
         </li>
 
         <li
           :class="{
             [suit('item')]: true,
-            [suit('item','nextPage')]: true,
-            [suit('item','disabled')]: state.isLastPage
+            [suit('item', 'nextPage')]: true,
+            [suit('item', 'disabled')]: state.isLastPage,
           }"
           v-if="showNext"
         >
@@ -120,21 +114,19 @@
                 aria-label="Next"
                 :href="state.createURL(state.currentRefinement + 1)"
                 @click.prevent="refine(state.currentRefinement + 1)"
-              >›</a>
+                >›</a
+              >
             </template>
             <template v-else>
-              <span
-                :class="suit('link')"
-                aria-label="Next"
-              >›</span>
+              <span :class="suit('link')" aria-label="Next">›</span>
             </template>
           </slot>
         </li>
         <li
           :class="{
             [suit('item')]: true,
-            [suit('item','lastPage')]: true,
-            [suit('item','disabled')]: state.isLastPage,
+            [suit('item', 'lastPage')]: true,
+            [suit('item', 'disabled')]: state.isLastPage,
           }"
           v-if="showLast"
         >
@@ -150,13 +142,11 @@
                 aria-label="Last"
                 :href="state.createURL(state.nbPages - 1)"
                 @click.prevent="refine(state.nbPages - 1)"
-              >››</a>
+                >››</a
+              >
             </template>
             <template v-else>
-              <span
-                :class="suit('link')"
-                aria-label="Last"
-              >››</span>
+              <span :class="suit('link')" aria-label="Last">››</span>
             </template>
           </slot>
         </li>

package/src/components/Panel.vue

@@ -1,25 +1,13 @@
 <template>
   <div :class="[suit(), !canRefine && suit('', 'noRefinement')]">
-    <div
-      v-if="getSlot('header')"
-      :class="suit('header')"
-    >
-      <slot
-        name="header"
-        :has-refinements="canRefine"
-      />
+    <div v-if="getSlot('header')" :class="suit('header')">
+      <slot name="header" :has-refinements="canRefine" />
     </div>
     <div :class="suit('body')">
       <slot :has-refinements="canRefine" />
     </div>
-    <div
-      v-if="getSlot('footer')"
-      :class="suit('footer')"
-    >
-      <slot
-        name="footer"
-        :has-refinements="canRefine"
-      />
+    <div v-if="getSlot('footer')" :class="suit('footer')">
+      <slot name="footer" :has-refinements="canRefine" />
     </div>
   </div>
 </template>

package/src/components/PoweredBy.vue

@@ -13,11 +13,11 @@
         viewBox="0 0 572 64"
       >
         <path
-          :fill="theme === 'dark' ? '#FFF': '#36395a'"
+          :fill="theme === 'dark' ? '#FFF' : '#36395a'"
           d="M16 48.3c-3.4 0-6.3-.6-8.7-1.7A12.4 12.4 0 0 1 1.9 42C.6 40 0 38 0 35.4h6.5a6.7 6.7 0 0 0 3.9 6c1.4.7 3.3 1.1 5.6 1.1 2.2 0 4-.3 5.4-1a7 7 0 0 0 3-2.4 6 6 0 0 0 1-3.4c0-1.5-.6-2.8-1.9-3.7-1.3-1-3.3-1.6-5.9-1.8l-4-.4c-3.7-.3-6.6-1.4-8.8-3.4a10 10 0 0 1-3.3-7.9c0-2.4.6-4.6 1.8-6.4a12 12 0 0 1 5-4.3c2.2-1 4.7-1.6 7.5-1.6s5.5.5 7.6 1.6a12 12 0 0 1 5 4.4c1.2 1.8 1.8 4 1.8 6.7h-6.5a6.4 6.4 0 0 0-3.5-5.9c-1-.6-2.6-1-4.4-1s-3.2.3-4.4 1c-1.1.6-2 1.4-2.6 2.4-.5 1-.8 2-.8 3.1a5 5 0 0 0 1.5 3.6c1 1 2.6 1.7 4.7 1.9l4 .3c2.8.2 5.2.8 7.2 1.8 2.1 1 3.7 2.2 4.9 3.8a9.7 9.7 0 0 1 1.7 5.8c0 2.5-.7 4.7-2 6.6a13 13 0 0 1-5.6 4.4c-2.4 1-5.2 1.6-8.4 1.6Zm35.6 0c-2.6 0-4.8-.4-6.7-1.3a13 13 0 0 1-4.7-3.5 17.1 17.1 0 0 1-3.6-10.4v-1c0-2 .3-3.8 1-5.6a13 13 0 0 1 7.3-8.3 15 15 0 0 1 6.3-1.4A13.2 13.2 0 0 1 64 24.3c1 2.2 1.6 4.6 1.6 7.2V34H39.4v-4.3h21.8l-1.8 2.2c0-2-.3-3.7-.9-5.1a7.3 7.3 0 0 0-2.7-3.4c-1.2-.7-2.7-1.1-4.6-1.1s-3.4.4-4.7 1.3a8 8 0 0 0-2.9 3.6c-.6 1.5-.9 3.3-.9 5.4 0 2 .3 3.7 1 5.3a7.9 7.9 0 0 0 2.8 3.7c1.3.8 3 1.3 5 1.3s3.8-.5 5.1-1.3c1.3-1 2.1-2 2.4-3.2h6a11.8 11.8 0 0 1-7 8.7 16 16 0 0 1-6.4 1.2ZM80 48c-2.2 0-4-.3-5.7-1a8.4 8.4 0 0 1-3.7-3.3 9.7 9.7 0 0 1-1.3-5.2c0-2 .5-3.8 1.5-5.2a9 9 0 0 1 4.3-3.1c1.8-.7 4-1 6.7-1H89v4.1h-7.5c-2 0-3.4.5-4.4 1.4-1 1-1.6 2.1-1.6 3.6s.5 2.7 1.6 3.6c1 1 2.5 1.4 4.4 1.4 1.1 0 2.2-.2 3.2-.7 1-.4 1.9-1 2.6-2 .6-1 1-2.4 1-4.2l1.7 2.1c-.2 2-.7 3.8-1.5 5.2a9 9 0 0 1-3.4 3.3 12 12 0 0 1-5.3 1Zm9.5-.7v-8.8h-1v-10c0-1.8-.5-3.2-1.4-4.1-1-1-2.4-1.4-4.2-1.4a142.9 142.9 0 0 0-10.2.4v-5.6a74.8 74.8 0 0 1 8.6-.4c3 0 5.5.4 7.5 1.2s3.4 2 4.4 3.6c1 1.7 1.4 4 1.4 6.7v18.4h-5Zm12.9 0V17.8h5v12.3h-.2c0-4.2 1-7.4 2.8-9.5a11 11 0 0 1 8.3-3.1h1v5.6h-2a9 9 0 0 0-6.3 2.2c-1.5 1.5-2.2 3.6-2.2 6.4v15.6h-6.4Zm34.4 1a15 15 0 0 1-6.6-1.3c-1.9-.9-3.4-2-4.7-3.5a15.5 15.5 0 0 1-2.7-5c-.6-1.7-1-3.6-1-5.4v-1c0-2 .4-3.8 1-5.6a15 15 0 0 1 2.8-4.9c1.3-1.5 2.8-2.6 4.6-3.5a16.4 16.4 0 0 1 13.3.2c2 1 3.5 2.3 4.8 4a12 12 0 0 1 2 6H144c-.2-1.6-1-3-2.2-4.1a7.5 7.5 0 0 0-5.2-1.7 8 8 0 0 0-4.7 1.3 8 8 0 0 0-2.8 3.6 13.8 13.8 0 0 0 0 10.3c.6 1.5 1.5 2.7 2.8 3.6s2.8 1.3 4.8 1.3c1.5 0 2.7-.2 3.8-.8a7 7 0 0 0 2.6-2c.7-1 1-2 1.2-3.2h6.2a11 11 0 0 1-2 6.2 15.1 15.1 0 0 1-11.8 5.5Zm19.7-1v-40h6.4V31h-1.3c0-3 .4-5.5 1.1-7.6a9.7 9.7 0 0 1 3.5-4.8A9.9 9.9 0 0 1 172 17h.3c3.5 0 6 1.1 7.9 3.5 1.7 2.3 2.6 5.7 2.6 10v16.8h-6.4V29.6c0-2.1-.6-3.8-1.8-5a6.4 6.4 0 0 0-4.8-1.8c-2 0-3.7.7-5 2a7.8 7.8 0 0 0-1.9 5.5v17h-6.4Zm63.8 1a12.2 12.2 0 0 1-10.9-6.2 19 19 0 0 1-1.8-7.3h1.4v12.5h-5.1v-40h6.4v19.8l-2 3.5c.2-3.1.8-5.7 1.9-7.7a11 11 0 0 1 4.4-4.5c1.8-1 3.9-1.5 6.1-1.5a13.4 13.4 0 0 1 12.8 9.1c.7 1.9 1 3.8 1 6v1c0 2.2-.3 4.1-1 6a13.6 13.6 0 0 1-13.2 9.4Zm-1.2-5.5a8.4 8.4 0 0 0 7.9-5c.7-1.5 1.1-3.3 1.1-5.3s-.4-3.8-1.1-5.3a8.7 8.7 0 0 0-3.2-3.6 9.6 9.6 0 0 0-9.2-.2 8.5 8.5 0 0 0-3.3 3.2c-.8 1.4-1.3 3-1.3 5v2.3a9 9 0 0 0 1.3 4.8 9 9 0 0 0 3.4 3c1.4.7 2.8 1 4.4 1Zm27.3 3.9-10-28.9h6.5l9.5 28.9h-6Zm-7.5 12.2v-5.7h4.9c1 0 2-.1 2.9-.4a4 4 0 0 0 2-1.4c.4-.7.9-1.6 1.2-2.7l8.6-30.9h6.2l-9.3 32.4a14 14 0 0 1-2.5 5 8.9 8.9 0 0 1-4 2.8c-1.5.6-3.4.9-5.6.9h-4.4Zm9-12.2v-5.2h6.4v5.2H248Z"
         />
         <path
-          :fill="theme === 'dark' ? '#FFF': '#003DFF'"
+          :fill="theme === 'dark' ? '#FFF' : '#003DFF'"
           d="M534.4 9.1H528a.8.8 0 0 1-.7-.7V1.8c0-.4.2-.7.6-.8l6.5-1c.4 0 .8.2.9.6v7.8c0 .4-.4.7-.8.7zM428 35.2V.8c0-.5-.3-.8-.7-.8h-.2l-6.4 1c-.4 0-.7.4-.7.8v35c0 1.6 0 11.8 12.3 12.2.5 0 .8-.4.8-.8V43c0-.4-.3-.7-.6-.8-4.5-.5-4.5-6-4.5-7zm106.5-21.8H528c-.4 0-.7.4-.7.8v34c0 .4.3.8.7.8h6.5c.4 0 .8-.4.8-.8v-34c0-.5-.4-.8-.8-.8zm-17.7 21.8V.8c0-.5-.3-.8-.8-.8l-6.5 1c-.4 0-.7.4-.7.8v35c0 1.6 0 11.8 12.3 12.2.4 0 .8-.4.8-.8V43c0-.4-.3-.7-.7-.8-4.4-.5-4.4-6-4.4-7zm-22.2-20.6a16.5 16.5 0 0 1 8.6 9.3c.8 2.2 1.3 4.8 1.3 7.5a19.4 19.4 0 0 1-4.6 12.6 14.8 14.8 0 0 1-5.2 3.6c-2 .9-5.2 1.4-6.8 1.4a21 21 0 0 1-6.7-1.4 15.4 15.4 0 0 1-8.6-9.3 21.3 21.3 0 0 1 0-14.4 15.2 15.2 0 0 1 8.6-9.3c2-.8 4.3-1.2 6.7-1.2s4.6.4 6.7 1.2zm-6.7 27.6c2.7 0 4.7-1 6.2-3s2.2-4.3 2.2-7.8-.7-6.3-2.2-8.3-3.5-3-6.2-3-4.7 1-6.1 3c-1.5 2-2.2 4.8-2.2 8.3s.7 5.8 2.2 7.8 3.5 3 6.2 3zm-88.8-28.8c-6.2 0-11.7 3.3-14.8 8.2a18.6 18.6 0 0 0 4.8 25.2c1.8 1.2 4 1.8 6.2 1.7s.1 0 .1 0h.9c4.2-.7 8-4 9.1-8.1v7.4c0 .4.3.7.8.7h6.4a.7.7 0 0 0 .7-.7V14.2c0-.5-.3-.8-.7-.8h-13.5zm6.3 26.5a9.8 9.8 0 0 1-5.7 2h-.5a10 10 0 0 1-9.2-14c1.4-3.7 5-6.3 9-6.3h6.4v18.3zm152.3-26.5h13.5c.5 0 .8.3.8.7v33.7c0 .4-.3.7-.8.7h-6.4a.7.7 0 0 1-.8-.7v-7.4c-1.2 4-4.8 7.4-9 8h-.1a4.2 4.2 0 0 1-.5.1h-.9a10.3 10.3 0 0 1-7-2.6c-4-3.3-6.5-8.4-6.5-14.2 0-3.7 1-7.2 3-10 3-5 8.5-8.3 14.7-8.3zm.6 28.4c2.2-.1 4.2-.6 5.7-2V21.7h-6.3a9.8 9.8 0 0 0-9 6.4 10.2 10.2 0 0 0 9.1 13.9h.5zM452.8 13.4c-6.2 0-11.7 3.3-14.8 8.2a18.5 18.5 0 0 0 3.6 24.3 10.4 10.4 0 0 0 13 .6c2.2-1.5 3.8-3.7 4.5-6.1v7.8c0 2.8-.8 5-2.2 6.3-1.5 1.5-4 2.2-7.5 2.2l-6-.3c-.3 0-.7.2-.8.5l-1.6 5.5c-.1.4.1.8.5 1h.1c2.8.4 5.5.6 7 .6 6.3 0 11-1.4 14-4.1 2.7-2.5 4.2-6.3 4.5-11.4V14.2c0-.5-.4-.8-.8-.8h-13.5zm6.3 8.2v18.3a9.6 9.6 0 0 1-5.6 2h-1a10.3 10.3 0 0 1-8.8-14c1.4-3.7 5-6.3 9-6.3h6.4zM291 31.5A32 32 0 0 1 322.8 0h30.8c.6 0 1.2.5 1.2 1.2v61.5c0 1.1-1.3 1.7-2.2 1l-19.2-17a18 18 0 0 1-11 3.4 18.1 18.1 0 1 1 18.2-14.8c-.1.4-.5.7-.9.6-.1 0-.3 0-.4-.2l-3.8-3.4c-.4-.3-.6-.8-.7-1.4a12 12 0 1 0-2.4 8.3c.4-.4 1-.5 1.6-.2l14.7 13.1v-46H323a26 26 0 1 0 10 49.7c.8-.4 1.6-.2 2.3.3l3 2.7c.3.2.3.7 0 1l-.2.2a32 32 0 0 1-47.2-28.6z"
         />
       </svg>

package/src/components/QueryRuleCustomData.vue

@@ -1,17 +1,8 @@
 <template>
-  <div
-    v-if="state"
-    :class="suit()"
-  >
+  <div v-if="state" :class="suit()">
     <slot :items="state.items">
-      <div
-        v-for="(item, key) in state.items"
-        :key="key"
-      >
-        <slot
-          name="item"
-          :item="item"
-        >
+      <div v-for="(item, key) in state.items" :key="key">
+        <slot name="item" :item="item">
           <pre>{{ item }}</pre>
         </slot>
       </div>

package/src/components/RangeInput.vue

@@ -12,7 +12,12 @@
     >
       <form
         :class="suit('form')"
-        @submit.prevent="refine({ min: pick(minInput, values.min), max: pick(maxInput, values.max) })"
+        @submit.prevent="
+          refine({
+            min: pick(minInput, values.min),
+            max: pick(maxInput, values.max),
+          })
+        "
       >
         <label :class="suit('label')">
           <slot name="minLabel" />
@@ -25,7 +30,7 @@
             :placeholder="state.range.min"
             :value="values.min"
             @change="minInput = $event.currentTarget.value"
-          >
+          />
         </label>
         <span :class="suit('separator')">
           <slot name="separator">to</slot>
@@ -41,13 +46,10 @@
             :placeholder="state.range.max"
             :value="values.max"
             @change="maxInput = $event.currentTarget.value"
-          >
+          />
         </label>
-        <button
-          :class="suit('submit')"
-          type="submit"
-        >
-          <slot name="submitLabel">Go</slot>
+        <button :class="suit('submit')" type="submit">
+          <slot name="submitLabel"> Go </slot>
         </button>
       </form>
     </slot>

package/src/components/RatingMenu.vue

@@ -1,8 +1,5 @@
 <template>
-  <div
-    v-if="state"
-    :class="suit()"
-  >
+  <div v-if="state" :class="suit()">
     <slot
       :items="state.items"
       :refine="state.refine"
@@ -10,21 +7,16 @@
       :send-event="state.sendEvent"
       :can-refine="state.canRefine"
     >
-      <svg
-        xmlns="http://www.w3.org/2000/svg"
-        style="display: none;"
-      >
-        <symbol
-          id="ais-RatingMenu-starSymbol"
-          viewBox="0 0 24 24"
-        >
-          <path d="M12 .288l2.833 8.718h9.167l-7.417 5.389 2.833 8.718-7.416-5.388-7.417 5.388 2.833-8.718-7.416-5.389h9.167z" />
+      <svg xmlns="http://www.w3.org/2000/svg" style="display: none">
+        <symbol id="ais-RatingMenu-starSymbol" viewBox="0 0 24 24">
+          <path
+            d="M12 .288l2.833 8.718h9.167l-7.417 5.389 2.833 8.718-7.416-5.388-7.417 5.388 2.833-8.718-7.416-5.389h9.167z"
+          />
         </symbol>
-        <symbol
-          id="ais-RatingMenu-starEmptySymbol"
-          viewBox="0 0 24 24"
-        >
-          <path d="M12 6.76l1.379 4.246h4.465l-3.612 2.625 1.379 4.246-3.611-2.625-3.612 2.625 1.379-4.246-3.612-2.625h4.465l1.38-4.246zm0-6.472l-2.833 8.718h-9.167l7.416 5.389-2.833 8.718 7.417-5.388 7.416 5.388-2.833-8.718 7.417-5.389h-9.167l-2.833-8.718z" />
+        <symbol id="ais-RatingMenu-starEmptySymbol" viewBox="0 0 24 24">
+          <path
+            d="M12 6.76l1.379 4.246h4.465l-3.612 2.625 1.379 4.246-3.611-2.625-3.612 2.625 1.379-4.246-3.612-2.625h4.465l1.38-4.246zm0-6.472l-2.833 8.718h-9.167l7.416 5.389-2.833 8.718 7.417-5.388 7.416 5.388-2.833-8.718 7.417-5.389h-9.167l-2.833-8.718z"
+          />
         </symbol>
       </svg>
 
@@ -64,10 +56,7 @@
               </svg>
             </template>
 
-            <span
-              :class="suit('label')"
-              aria-hidden="true"
-            >
+            <span :class="suit('label')" aria-hidden="true">
               <slot name="andUp">&amp; Up</slot>
             </span>
             <span :class="suit('count')">{{ item.count }}</span>

package/src/components/RefinementList.vue

@@ -1,9 +1,6 @@
 <template>
   <div
-    :class="[
-      suit(),
-      !state.canRefine && suit('','noRefinement')
-    ]"
+    :class="[suit(), !state.canRefine && suit('', 'noRefinement')]"
     v-if="state"
   >
     <slot
@@ -19,10 +16,7 @@
       :can-refine="state.canRefine"
       :send-event="state.sendEvent"
     >
-      <div
-        :class="suit('searchBox')"
-        v-if="searchable"
-      >
+      <div :class="suit('searchBox')" v-if="searchable">
         <search-input
           v-model="searchForFacetValues"
           :placeholder="searchablePlaceholder"
@@ -38,8 +32,7 @@
       </slot>
       <ul :class="suit('list')">
         <li
-          :class="[
-          suit('item'), item.isRefined && suit('item', 'selected')]"
+          :class="[suit('item'), item.isRefined && suit('item', 'selected')]"
           v-for="item in items"
           :key="item.value"
         >
@@ -56,20 +49,11 @@
                 :value="item.value"
                 :checked="item.isRefined"
                 @change="refine(item.value)"
-              >
-              <span
-                v-if="searchable"
-                :class="suit('labelText')"
-              >
-                <ais-highlight
-                  attribute="item"
-                  :hit="item"
-                />
+              />
+              <span v-if="searchable" :class="suit('labelText')">
+                <ais-highlight attribute="item" :hit="item" />
               </span>
-              <span
-                v-else
-                :class="suit('labelText')"
-              >{{ item.label }}</span>
+              <span v-else :class="suit('labelText')">{{ item.label }}</span>
               <span :class="suit('count')">{{ item.count }}</span>
             </label>
           </slot>
@@ -80,16 +64,15 @@
           suit('showMore'),
           {
             [suit('showMore', 'disabled')]: !state.canToggleShowMore,
-          }
+          },
         ]"
         @click="toggleShowMore"
         v-if="showMore"
         :disabled="!state.canToggleShowMore"
       >
-        <slot
-          name="showMoreLabel"
-          :is-showing-more="state.isShowingMore"
-        >Show {{ state.isShowingMore ? 'less' : 'more' }}</slot>
+        <slot name="showMoreLabel" :is-showing-more="state.isShowingMore">
+          Show {{ state.isShowingMore ? 'less' : 'more' }}
+        </slot>
       </button>
     </slot>
   </div>
@@ -186,7 +169,7 @@ export default {
       return this.state.toggleShowMore || noop;
     },
     items() {
-      return this.state.items.map(item =>
+      return this.state.items.map((item) =>
         Object.assign({}, item, {
           _highlightResult: {
             item: {

package/src/components/RelevantSort.vue

@@ -1,27 +1,15 @@
 <template>
-  <div
-    v-if="state && state.isVirtualReplica"
-    :class="suit()"
-  >
-    <slot
-      :is-relevant-sorted="state.isRelevantSorted"
-      :refine="state.refine"
-    >
+  <div v-if="state && state.isVirtualReplica" :class="suit()">
+    <slot :is-relevant-sorted="state.isRelevantSorted" :refine="state.refine">
       <div :class="suit('text')">
-        <slot
-          name="text"
-          :is-relevant-sorted="state.isRelevantSorted"
-        />
+        <slot name="text" :is-relevant-sorted="state.isRelevantSorted" />
       </div>
-      <button
-        type="button"
-        :class="suit('button')"
-        @click="refine()"
-      >
-        <slot
-          name="button"
-          :is-relevant-sorted="state.isRelevantSorted"
-        >{{ state.isRelevantSorted ? 'See all results' : 'See relevant results' }}</slot>
+      <button type="button" :class="suit('button')" @click="refine()">
+        <slot name="button" :is-relevant-sorted="state.isRelevantSorted">
+          {{
+            state.isRelevantSorted ? 'See all results' : 'See relevant results'
+          }}
+        </slot>
       </button>
     </slot>
   </div>

package/src/components/SearchBox.vue

@@ -1,8 +1,5 @@
 <template>
-  <div
-    v-if="state"
-    :class="suit()"
-  >
+  <div v-if="state" :class="suit()">
     <slot
       :current-refinement="currentRefinement"
       :is-search-stalled="state.isSearchStalled"
@@ -22,47 +19,20 @@
         v-model="currentRefinement"
         ref="searchInput"
       >
-        <template
-          v-slot:loading-indicator
-          v-if="isVue3"
-        >
-          <slot
-            name="loading-indicator"
-          />
+        <template #loading-indicator v-if="isVue3">
+          <slot name="loading-indicator" />
         </template>
-        <slot
-          v-if="isVue2"
-          name="loading-indicator"
-          slot="loading-indicator"
-        />
+        <slot v-if="isVue2" name="loading-indicator" slot="loading-indicator" />
 
-        <template
-          v-slot:submit-icon
-          v-if="isVue3"
-        >
-          <slot
-            name="submit-icon"
-          />
+        <template #submit-icon v-if="isVue3">
+          <slot name="submit-icon" />
         </template>
-        <slot
-          v-if="isVue2"
-          name="submit-icon"
-          slot="submit-icon"
-        />
+        <slot v-if="isVue2" name="submit-icon" slot="submit-icon" />
 
-        <template
-          v-slot:reset-icon
-          v-if="isVue3"
-        >
-          <slot
-            name="reset-icon"
-          />
+        <template #reset-icon v-if="isVue3">
+          <slot name="reset-icon" />
         </template>
-        <slot
-          v-if="isVue2"
-          name="reset-icon"
-          slot="reset-icon"
-        />
+        <slot v-if="isVue2" name="reset-icon" slot="reset-icon" />
       </search-input>
     </slot>
   </div>

package/src/components/SearchInput.vue

@@ -24,9 +24,12 @@
       :value="value || modelValue"
       @focus="$emit('focus', $event)"
       @blur="$emit('blur', $event)"
-      @input="$emit('input', $event.target.value); $emit('update:modelValue', $event.target.value)"
+      @input="
+        $emit('input', $event.target.value);
+        $emit('update:modelValue', $event.target.value);
+      "
       ref="input"
-    >
+    />
     <button
       type="submit"
       :title="submitTitle"
@@ -54,7 +57,10 @@
       type="reset"
       :title="resetTitle"
       :class="suit('reset')"
-      :hidden="(!value && !modelValue) || (showLoadingIndicator && shouldShowLoadingIndicator)"
+      :hidden="
+        (!value && !modelValue) ||
+        (showLoadingIndicator && shouldShowLoadingIndicator)
+      "
     >
       <slot name="reset-icon">
         <svg
@@ -89,20 +95,9 @@
           viewBox="0 0 38 38"
           :class="suit('loadingIcon')"
         >
-          <g
-            fill="none"
-            fill-rule="evenodd"
-          >
-            <g
-              transform="translate(1 1)"
-              stroke-width="2"
-            >
-              <circle
-                stroke-opacity=".5"
-                cx="18"
-                cy="18"
-                r="18"
-              />
+          <g fill="none" fill-rule="evenodd">
+            <g transform="translate(1 1)" stroke-width="2">
+              <circle stroke-opacity=".5" cx="18" cy="18" r="18" />
               <path d="M36 18c0-9.94-8.06-18-18-18">
                 <animateTransform
                   attributeName="transform"

package/src/components/SortBy.vue

@@ -1,8 +1,5 @@
 <template>
-  <div
-    :class="suit()"
-    v-if="state"
-  >
+  <div :class="suit()" v-if="state">
     <slot
       :items="state.options"
       :has-no-results="state.hasNoResults"
@@ -20,7 +17,9 @@
           :class="suit('option')"
           :value="item.value"
           :selected="item.value === state.currentRefinement"
-        >{{ item.label }}</option>
+        >
+          {{ item.label }}
+        </option>
       </select>
     </slot>
   </div>

package/src/components/StateResults.vue

@@ -1,15 +1,10 @@
 <template>
-  <div
-    :class="suit()"
-    v-if="state && state.state && state.results"
-  >
+  <div :class="suit()" v-if="state && state.state && state.results">
     <slot v-bind="stateResults">
       <p>
         Use this component to have a different layout based on a certain state.
       </p>
-      <p>
-        Fill in the slot, and get access to the following things:
-      </p>
+      <p>Fill in the slot, and get access to the following things:</p>
       <pre>results: {{ Object.keys(state.results) }}</pre>
       <pre>state: {{ Object.keys(state.state) }}</pre>
       <pre>status: {{ state.status }}</pre>

package/src/components/Stats.vue

@@ -1,13 +1,16 @@
 <template>
-  <div
-    v-if="state"
-    :class="suit()"
-  >
+  <div v-if="state" :class="suit()">
     <slot
       v-bind="state"
       :results="state.instantSearchInstance.helper.lastResults"
     >
-      <span :class="suit('text')"><template v-if="state.areHitsSorted">{{ state.nbSortedHits.toLocaleString() }} relevant results sorted out of {{ state.nbHits.toLocaleString() }}</template><template v-else>{{ state.nbHits.toLocaleString() }} results</template> found in {{ state.processingTimeMS.toLocaleString() }}ms</span>
+      <!-- prettier-ignore -->
+      <span :class="suit('text')"
+        ><template v-if="state.areHitsSorted"
+          >{{ state.nbSortedHits.toLocaleString() }} relevant results sorted out of {{ state.nbHits.toLocaleString() }}</template
+        ><template v-else>{{ state.nbHits.toLocaleString() }} results</template
+        > found in {{ state.processingTimeMS.toLocaleString() }}ms</span
+      >
     </slot>
   </div>
 </template>

package/src/components/ToggleRefinement.vue

@@ -18,12 +18,11 @@
           :value="on"
           :checked="state.value.isRefined"
           @change="state.refine(state.value)"
-        >
+        />
         <span :class="suit('labelText')">{{ label }}</span>
-        <span
-          v-if="state.value.count !== null"
-          :class="suit('count')"
-        >{{ state.value.count.toLocaleString() }}</span>
+        <span v-if="state.value.count !== null" :class="suit('count')">{{
+          state.value.count.toLocaleString()
+        }}</span>
       </label>
     </slot>
   </div>