Listbox disabled state (native)

[ukutaht]

Alternative proposal to #32

The main difference is that instead of managing aria-disabled and tabindex ourselves, we make use of the fact that listbox trigger is rendered as a <button> which comes with a browser native disabled state. In this PR we just render <button disabled="true"> and let the browser manage it natively.

Second difference is moving the disabled attribute to the root <.listbox> Prima component and propagates it via JS hook. The original PR mentions a reason not to do this:

The alternative — having the JS hook copy a disabled flag from the wrapper down onto the button at mount time would leave a brief window after first paint, before the hook mounts, where the trigger is technically still focusable and clickable.

I agree it's not ideal but it is a reasonable compromise. The UI requires javascript and hooks to be initialized in order to work properly. The listbox won't even open before hooks are initialized. Copying the disabled attribute while JS hook is initializing only affects the disabled styling, it does not allow some bad behaviour.

Putting the disabled attribute on the root <.listbox> component feels more native like select. It also allows us to render the hidden input with disabled="true" attribute, which means the input will not be submitted by the browser when disabled, which again aligns better with native form field behaviour.

[RobertJoonas]

Thanks for this! Feels more intuitive indeed to put the disabled attribute on the listbox wrapper itself, and relying on native disabled sounds like a nice simplification too. One suggestion inline though...