svelte-qparam

// extract.js
import { array, define } from 'svelte-qparam'
import { boolean, number, string } from 'svelte-qparam/serde'

export const extract = define({
  str: string,
  num: number,
  bool_array: array(boolean)
})

// +page.js
import { extract } from 'extract.js'

export const load = ({ url }) => {
  const { values, qparams } = extract(url)

  /* {
    str: string;
    num: number;
    bool_array: boolean[];
  } */
  console.log(values)

  return {
    qparams
  }
}

<!-- +page.svelte -->
<script>
  let { data } = $props()

  let { qparams: q } = data
</script>

<div>
  <button onclick={() => {
    q.bool_array = [true, false, true]
  }}> Set bool_array = [true, false, true] </button>
</div>
<output>
  <code>load_str = {q.str}</code>
  <code>load_num = {q.num}</code>
  <code>load_bool_array = {JSON.stringify(q.bool_array)}</code>
</output>