Why do custom identifiers have such strict validation rules?

[kevinkucharczyk]

Recently, custom identifier hashing was added via #1160

However, the strings that are allowed for custom identifier functions are too restrictive. There is a regex match check here:

vanilla-extract/packages/css/src/identifier.ts

Line 78 in 58005eb

if (!identifier.match(/^[A-Z_][0-9A-Z_]+$/i)) {

, which only allows underscores, letters and numbers.

At the very least I'd like to be able to use hyphens, or escaped period characters, but CSS identifiers allow for more than that: https://stackoverflow.com/a/449000

Can the regex in custom identifiers be expanded to allow more characters? Is there a reason why this check is so strict?

[Yaojian]

@SombreroElGringo Is there a reason why the hyphen (-) cannot returned by the identifier function?

[SombreroElGringo]

@Yaojian no specific reason, I just re-implemented the following change who has been previously discussed/agreed in this PR, but I totally agree with you I think we should have more flexibility on the identifier.

[mrm007]

The hyphen is now allowed: #1292

If you'd like even more flexibility, feel free to open a PR.