fix: Add support for 8-digit hex colors in theme system and color utilities

[rebenitez1802]

SUMMARY

This PR adds comprehensive support for 8-digit hex colors (with alpha channel) in Superset's theme system and color utilities. This enables custom
themes to use colors like #FF000080 without breaking existing functionality.

Problem Solved

• Issue: Color utilities failed when custom themes provided 8-digit hex values
• Root Cause: getContrastingColor() incorrectly treated 8-digit hex as RGB format
• Impact: emotion-rgba library incompatible with 8-digit hex colors in components

Changes Made

Color Utilities Enhanced (packages/superset-ui-core/src/color/utils.ts)

• getContrastingColor(): Fixed logic to properly detect RGB vs hex formats, handles 8-digit hex by ignoring alpha channel
• hexToRgb(): Added support for 8-digit hex conversion (ignores alpha for RGB output)
• addAlpha(): Enhanced to replace existing alpha channel instead of appending

Component Fixes

• ActionButtons: Replaced emotion-rgba with addAlpha for gradient backgrounds
• BuilderComponentPane: Replaced emotion-rgba with addAlpha for box shadows

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

TESTING INSTRUCTIONS

Manual Testing:

1. Create a custom theme with 8-digit hex colors:
   {
   "colorPrimary": "#FF000080",
   "colorBgLayout": "#FFFFFF40",
   "colorBorder": "# 00000020"
   }
2. Apply the custom theme and verify:
   - Dashboard FilterBar renders without console errors
   - Dashboard builder components render correctly
   - Color contrasting still works for text readability
   - No visual regressions in existing themes

ADDITIONAL INFORMATION

• Has associated issue:
• Required feature flags:
• Changes UI
• Includes DB Migration (follow approval process in SIP-59)
  • Migration is atomic, supports rollback & is backwards-compatible
  • Confirm DB migration upgrade and downgrade tested
  • Runtime estimates and downtime expectations provided
• Introduces new feature or API
• Removes existing feature or API

[korbit-ai]

Based on your review schedule, I'll hold off on reviewing this PR until it's marked as ready for review. If you'd like me to take a look now, comment /korbit-review.

Your admin can change your review schedule in the Korbit Console

[korbit-ai]

I've completed my review and didn't find any issues.

Files scanned

​

File Path	Reviewed
superset-frontend/src/dashboard/components/nativeFilters/FilterBar/ActionButtons/index.tsx	✅
superset-frontend/src/dashboard/components/BuilderComponentPane/index.tsx	✅
superset-frontend/packages/superset-ui-core/src/color/utils.ts	✅

Explore our documentation to understand the languages and file types we support and the files we ignore.

Check out our docs on how you can make Korbit work best for you and your team.

Loving Korbit!? Share us on LinkedIn Reddit and X

[msyavuz]

Should we convert to rgba if hex is 8 digit instead of ignoring?

[rebenitez1802]

this is not needed anymore