params are not reactive with remote functions but params.key is

[ak4zh]

Describe the bug

<script>
	import { getCount } from './data.remote';
	import { queryParameters, ssp } from 'sveltekit-search-params';
       
        // this works
        let nonSSP = $state({
            brand: 'audi',
            model: 'a1'
        })
        let nonSSPCountQuery = $derived(getCount(nonSSP))

        // this does not work
        const search = queryParameters({
		brand: ssp.string(),
		model: ssp.string()
	})
	let params = $derived(search)
	let countQuery = $derived(getCount(params))
        // but this works
	let countQueryWithDirectDependency = $derived(getCount(params.brand))
</script>

I have also tried

let params = $derived(queryParameters({
    brand: ssp.string(),
    model: ssp.string()
}))

Reproduction

https://www.sveltelab.dev/llrpqk8ytk63060

Logs

[ak4zh]

It seems the params is always {} and only the attributes change value when accessed directly.

[ak4zh]

Figured I could simply use params.toJSON()

[ak4zh]

Another question is there a better way to subscribe to any change in the params? Typescript seem to be not very happy with params.toJSON() may be simply doing let remoteCount = $derived(page.url.search) would do same.

Currently I am using it like this as I want the remoteCount to refresh every time anything changes in the query parameters.

const params = queryParameters()
let remoteCount = $derived(getRemoteCount(params?.toJSON?.()))

Typescript issue:

This expression is not callable.
  Type 'String' has no call signatures.

[paoloricciuti]

This is weird...where is this error shown?

[ak4zh]

It works but typescript is unhappy about it.

[paoloricciuti]

You are restructuring params from search...this doesn't seem code from this library 😁

[ak4zh]

Sorry for that Search is just a class containing query params

export class Search {
    params = queryParameters({})
}

[ak4zh]

I think typescript is unhappy because queryParameters is of type LooseAutocomplete<Options<T>>

sveltekit-search-params/src/lib/sveltekit-search-params.svelte.ts

Line 329 in f240c0a

): LooseAutocomplete<Options<T>> {

May be we should not return a function and directly a json when calling toJSON or change the queryParameters to also have function return possible.

sveltekit-search-params/src/lib/sveltekit-search-params.svelte.ts

Line 220 in f240c0a

if (name === 'toJSON') {

[paoloricciuti]

Uhhhh yeah It might be...will check as soon as I have time and fix this