feat: formAssociated element should treat boolean "disabled" Prop differently about stencil

[alicewriteswrongs]

Hey @danyball, thanks for filing this issue and glad to hear you've been making use of our support for form-associated custom elements!

I just want to check a little bit to make sure I'm understanding the ask here. Right now Stencil and the form-associated custom elements standard interact in a bit of an undesirable way, where if you set a disabled prop that will be added to the element as an attribute, and since for form controls the disabled state is based on whether or not the attribute is present, rather than its value, this results in the form control being disabled whether disabled is set to true or false.

If I've understood that correctly, the request is then to change Stencil's behavior from something like:

flowchart LR
    A[Stencil component has 'disabled' prop] --> B[set disabled attr on element to prop value]

to something like this:

flowchart TD
    A[Stencil component has 'disabled' prop]
    B[Is component form-associated?]
    C[set disabled attr on element to prop value]
    D[What's the value for `disabled`?]
    E[Remove `disabled` attr from element]
    A ---> B
    B --->|yes| D
    B --->|no| C
    D --->|true| C
    D --->|false| E

If I have that all right, then there's a few things to say about this. One is that if we applied this across the board it would be a breaking change, since we'd be changing the behavior of Stencil components where other developers might be depending on the current behavior. On the other hand, we could make this an opt-in change with a plan to make it the default in a future breaking change. Curious to hear your thoughts!