Update results when clicking the <input type="search">'s reset icon

I guess this is more a htmx thing, but when using a <input type="search"> input, the native reset cross icon that appears inside the corner of the field is not reactive.

I mean, this clear the input value as expected, but does not update the results like the s-trigger does on keyup: <input type="search" id="keywords" name="keywords" value sprig s-trigger="keyup changed delay:300ms" s-replace="#results" placeholder="keywords" autocomplete="off" spellcheck="false">

I would like it to update the results like if we erase all the text in the field. How can I do, while maintaining the update on keyup? On top of that, I need that the ?page=x query param is reset, so removed from the URL.

The demos in the doc are using simply <input type="text"> instead of <input type="search"> inputs.

[romainpoirier]

I was asking this because {% do sprig.pushUrl('?') %} within the {{ sprig() }} template was replacing the entire path with ?, so I was getting website.dev/? instead of website.dev/section?. Adding {% do sprig.pushUrl('?') %} before/inside/after the sprig form did the same result. I finally found this solution (or workaround) bellow.

Pass craft.app.request.getFullPath as param to the {{ sprig() }} template:

{{ sprig('_sprig/agenda', {
	path: craft.app.request.getFullPath,
	limit: 5
}) }}

Within the {{ sprig() }} template, add this on top of the file:

{% if page ?? 1 == 1 %}
	{% do sprig.pushUrl(path) %}
{% endif %}

This make the path working correctly, and on top of that I’m not getting the unwanted ? empty query param. This is a simple reset solution, as I’m not dealing with other query params that the ?page=x.

[bencroker]

1. {% do sprig.pushUrl('?') %} will set the URL to the current path, with ? at the end.
2. Not that I know of.
3. See the video series on Sprigboard, which contains both a search field and pagination: https://putyourlightson.com/sprig/videos#sprigboard