Skip to main content

getOptions

Description​

The function extracts filtering options for multiple fields at once

It uses the getOptions helpers inside to collect values for a single field.

Usage​

getOptionsMap(
  data: any[],
  config?: {
    id: string, 
    predicate?: "month" | "year",
    sort?: boolean | ((a: any, b: any) => number),
  }[]
): { [key: string]: any[] };

Parameters​

  • data – (required) a data array to extract values from
  • config - (optional) an array of field settings, each of which having:
    • id – (required) ID of the field to extract options from
    • predicate – (optional) extracts month or year from date fields
    • sort – (optional) a comparison function to sort the result. Dates and numbers are sorted by default in the ascending order; to cancel this, set the sort parameter to false.

Without config the options will be extracted according to data keys from the first data element.

Returns​

An object where each key corresponds to field id and its value is an array of unique values for this field.

Example​

The example shows how to use getOptionsMap to provide options to the FilterBuilder widget based on the actual dataset.

<script>
  import { getData } from "../data";
  import { FilterBuilder, getOptionsMap } from "@svar-ui/svelte-filter";

  const { fields, data } = getData();

  /* data 
  [
    { first_name: "Alex", age: 26,start: new Date(2025, 0, 3) },
    { first_name: "Alex", age: 45, start: new Date(2025, 2, 13) },
    { first_name: "Agata", age: 35, start: new Date(2025, 2, 8) },
  ]
  */

  /* getOptionsMap(data) 
  {
    first_name: ["Alex", "Agata"],
    age: [26, 35, 45],
    start: [new Date(2025, 0, 3), new Date(2025, 2, 8), new Date(2025, 2, 13)]
  }
  */
</script>

<FilterBuilder {fields} options={getOptionsMap(data)}/>