Problem with ais-range-slider FACET STATS

[seifrached]

Hi everyone,

I tried using an example that works well like vue-instantsearch from official doc https://www.algolia.com but it didn't work !!! Mainly the problem is due "RANGE" value from the slot, always 0 {range.min AND range.max} ! the minimum and maximum value is not automatically computed by Algolia from the data in the index.

<ais-instant-search :search-client="searchClient" index-name="NAME_OF_INDEX">

<ais-range-input attribute="area">
  <template v-slot="{ currentRefinement, range, refine, canRefine }">     
   <label>Area Range</label>     
    <vue-slider
          :min="range.min"
          :max="range.max"
          :value="toValue(currentRefinement, range)"
          :disabled="!canRefine"
          :lazy="true"
          :useKeyboard="true"
          :enableCross="false"
          tooltip="always"
          :duration="0"
          @change="refine({ min: $event[0], max: $event[1] })">
    </vue-slider>
  </template>
</ais-range-input>

</ais-instant-search>

BUT

Trying to use :min="0" :max="100" inside it work ≈ But the problem is that I can't retrieve any record >= to :max="100" !!!

<ais-instant-search :search-client="searchClient" index-name="NAME_OF_INDEX">

<ais-range-input attribute="area" :min="0" :max="100">
  <template v-slot="{ currentRefinement, range, refine, canRefine }">     
   <label>Area Range</label>     
    <vue-slider
          :min="range.min"
          :max="range.max"
          :value="toValue(currentRefinement, range)"
          :disabled="!canRefine"
          :lazy="true"
          :useKeyboard="true"
          :enableCross="false"
          tooltip="always"
          :duration="0"
          @change="refine({ min: $event[0], max: $event[1] })">
    </vue-slider>
  </template>
</ais-range-input>

</ais-instant-search>

methods:{

toValue(value, range) {
console.log(value,range)
           return [
               typeof value.min === "number" ? value.min : range.min,
               typeof value.max === "number" ? value.max : range.max,
           ];
       },
}

console.log(value)
    max: undefined
    min: undefined
=======================
console.log(range)
    max: 0
    min: 0

environment: "Laravel 8 scout", "Vue": "^2.6.12", "Vue-slider-component": "^3.2.20", "@meilisearch/instant-meilisearch": "^0.7.1", AS DRIVER OF SCOUT "algolia/algoliasearch-client-php": "^3.3",

[Haroenv]

This is an issue with meilisearch I think, so I can't help further. Likely the facet isn't set up or mapped correctly, causing the range not to be returned

[seifrached]

This is an issue with meilisearch I think, so I can't help further. Likely the facet isn't set up or mapped correctly, causing the range not to be returned

Thanks