[Picker Button]: No styling for invalid state

[najikahalsema]

Description

The CSS for the picker button doesn't seem to have any styling specification for an invalid state. While Spectrum doesn't document this usage specifically for a picker button, I would wager that an invalid picker styling also begets an invalid style for the picker button, too, for components like Combobox or a Date Picker.

Steps to reproduce

1. Go here
2. Observe that though <sp-picker-button> has the invalid attribute, the styling is the same as it would be by default.

Expected behavior

The picker button should have a red border when it's invalid:

image from spectrum contributions

Image from Spectrum CSS Combobox documentation. Here, the picker button has a class of Combobox-button.

Screenshots

from @paulodetarsofm

Environment

• Version of the impacted component(s):
• Browser(s) and OS(s):

Additional context

[jenndiaz]

@najikahalsema

We are currently implementing the invalid styling for picker button with a class associated with the parent component, so in the case of an invalid combo box the HTML is:

<button tabindex="-1" class="spectrum-PickerButton spectrum-PickerButton--sizeM spectrum-PickerButton--uiicononly spectrum-PickerButton--quiet spectrum-PickerButton--right spectrum-Combobox-button is-invalid" aria-haspopup="listbox">

And the invalid border color is set with spectrum-Combobox-button

spectrum-css/components/combobox/index.css

Lines 274 to 275 in ce9187d

	&.is-invalid:not(:disabled, .spectrum-PickerButton--quiet) {
	--mod-picker-button-border-color: var(--highcontrast-combobox-border-color-invalid, var(--mod-combobox-border-color-invalid-default, var(--spectrum-combobox-border-color-invalid-default)));

Would using these for combobox and date-picker address the concerns about invalid styling for picker button?

cc: @pfulton

[pfulton]

@najikahalsema just circling back to this and the comment from @jenndiaz above. Is there something else we could do for you here?

[najikahalsema]

This works, but there's another inconsistency. I came across re: the styling of the textfield and the picker button when focusing the combobox. I just haven't been able to articulate it yet. I can make another issue when the time comes, though! Thanks for pinging me.