SuperDebug collapsable

[Zerotask]

Is your feature request related to a problem? Please describe.
When having large forms the SuperDebug can hinder you a bit and you have to scroll down to see the actual form.

Describe the solution you'd like
Make it optionally collapsable, so you just see the label + status.

<SuperDebug data={registerForm} collapsable />

It should remember the state with a session storage value, so even if I refresh the page, it should stay as before.

[ciscoheat]

Sounds good, how do you propose that the state should be remembered for each instance of the component? Identity won't be preserved after a page refresh.

[Zerotask]

sessionStorage.setItem("sveltekit-superforms", JSON.stringify({
    "debug": {
        "<id>": {
            "collapsed": true
        }
    }
}));

or a similar structure.

Alternatively with a context module, so all your debugs are either open or collapsed.

[ciscoheat]

Storing it is simple, but I don't see how to easily acquire a unique id for each instance over multiple requests, without specifying it as a prop, which is a bit cumbersome? I think having a global setting for all instances is the only simple way.

[ciscoheat]

It's added now, a collapsible prop that will store its state per route in sessionStorage.