Fix HSL color decorator regex to support CSS Level 4 syntax variants

[Copilot]

The color decorator was not recognizing valid HSL color syntax variants, specifically space-separated values (CSS Level 4) and decimal hue values.

Problem:
Given this JavaScript code:

const blues = ['hsl(192, 87%, 49%)', 'hsl(192 87% 49%)', 'hsl(192.5, 87.5%, 49.5%)'];

Only the first HSL color would show a color decorator, despite all three being valid CSS syntax.

Root Cause:
The HSL parameter validation regex was too restrictive:

• Required commas between values: \s*,\s*
• Only accepted integer hue values: (36[0]|3[0-5][0-9]|[12][0-9][0-9]|[1-9]?[0-9])

Solution:
Updated the regex patterns to support modern CSS syntax:

1. Flexible separators: Changed \s*,\s* to \s*[,\s]\s* to accept both comma and space separators
2. Decimal hue values: Added (?:\.\d+)? suffix to allow decimal hue values like 192.5
3. Applied to both HSL and HSLA: Ensured consistency across both color formats

Supported HSL Syntax Variants:

• ✅ hsl(192, 87%, 49%) - traditional comma-separated
• ✅ hsl(192 87% 49%) - CSS Level 4 space-separated
• ✅ hsl(192.5, 87.5%, 49.5%) - decimal values with commas
• ✅ hsl(192.5 87.5% 49.5%) - decimal values with spaces
• ✅ All HSLA variants with alpha channel

Testing:

• All existing functionality preserved
• Invalid colors still properly rejected
• Comprehensive test cases added for all syntax variants
• Manual verification confirms the exact issue case now works

Fixes #193512.

Warning

Firewall rules blocked me from connecting to one or more addresses

I tried to connect to the following addresses, but was blocked by firewall rules:

• electronjs.org
  • Triggering command: node-gyp (dns block)

If you need me to access, download, or install something from one of these locations, you can either:

• Configure Actions setup steps to set up my environment, which run before the firewall is enabled
• Add the appropriate URLs or hosts to my firewall allow list

---

💬 Share your feedback on Copilot coding agent for the chance to win a $200 gift card! Click here to start the survey.