Combobox: update chevron colors

[ashetland]

Check existing issues

• [X] I have checked for existing issues to avoid duplicates

Actual Behavior

Combobox's chevrons are ui-text-1 in all states.

Expected Behavior

For system consistency, chevrons should be ui-text-3 when idle and ui-text-1 when hovered or pressed.

Reproduction Sample

https://codepen.io/ashetland/pen/MWZpgRd

Reproduction Steps

Interact with Combobox.

Reproduction Version

v1.8.0

Relevant Info

Figma designs for Combobox here.

Regression?

No response

Priority impact

p4 - not time sensitive

Impact

No response

Calcite package

• [X] @esri/calcite-components
• [ ] @esri/calcite-components-react

Esri team

ArcGIS Web Analysis

[github-actions[bot]]

cc @geospatialem, @brittneytewks

[brittneytewks]

Removed Figma changes label as this will be tracked in monday.com

[github-actions[bot]]

Installed and assigned for verification.

[DitwanP]

When the combobox is expanded, the color of the chevron is not ui-text-3 except for the split second when you press on an option. You can hold the mouse down on an option to see the color change. It looks like its because it's in a focused state and not really "idle". In the pen below you can see what I'm talking about, the input-time-picker works because it's not actually focused after press, and I'm not sure about select because it's covered by options when expanded

@ashetland Thoughts on this? Depending on what you think I might have to reopen the issue for date picker chevron colors as well.

@aPreciado88 for 👀

https://codepen.io/Ditwan-Price/pen/JjVzKWp?editors=1000

[ashetland]

Nice catch! I think this may just be an issue with Combobox because two things are focused at the same time. I'd consider this dual focus to be a bug, fwiw. I'm not sure I understand the need for this dual focus state.

That said, if there's no other way around this, I'd suggest we leave the chevron text.3 at all times. What I may see as a bug, others may feel is a feature 😁.

[aPreciado88]

@DitwanP @ashetland I confirmed with @jcfranco that the double focus is intentional. I can update the chevron's color to always be ui-text-3 like Aaron suggested. Or I can change it to only be ui-text-1 when the combobox is being hovered or clicked. Please let me know which option you like better.

[ashetland]

That might be a better compromise, @aPreciado88. I like that at least the hover state would match across components even if the focus state is slightly off on Combobox. Let's try it!

[aPreciado88]

@ashetland The changes are up!

[ashetland]

Looks good!

[github-actions[bot]]

Installed and assigned for verification.

[DitwanP]

🍠 Verified on 2.8.0-next.14