sligify() in Frontend works differently than in Core - Cyrillic chars are omitted

[ildar170975]

Checklist

• I have updated to the latest available Home Assistant version.
• I have cleared the cache of my browser.
• I have tried a different browser to see if it is related to my browser.
• I have tried reproducing the issue in safe mode to rule out problems with unsupported custom resources.

Describe the issue you are experiencing

This could be a long tale, please be patient.

Consider these zones:

zone:
  - name: "testing Zone ABC"
    latitude: 40
    longitude: 60
    radius: 100
    passive: false
    icon: mdi:store

  - name: "testing Зона 321"
    latitude: 70
    longitude: 50
    radius: 100
    passive: false
    icon: mdi:store

The 1st zone has a Latin name, the 2nd zone has some Cyrillic chars.
When a person arrives to these zones:

A color of the 1st entity is red due to a custom theme:

state-device_tracker-testing_zone_abc-color: red

But for the 2nd entity a color is --state-device_tracker-active-color for any of these variants in a custom theme:

  state-device_tracker-testing_зона_321-color: lightgreen
  state-device_tracker-testing_zona_321-color: yellow

although both vars got proper values and can be used in Frontend:

Code inspector says that a color for ha-state-icon is:

and here a whole Cyrillic part is absent.

I think the problem is with slugify.ts which works differently than a similar function in Core: the function in Frontend seems to replace all unknown chars with a delimiter:

frontend/src/common/string/slugify.ts

Line 18 in 8390c6e

.replace(/[^a-z0-9]+/g, delimiter) // Replace all non-word characters

Although a similar function in Core treats a name in Cyrillic properly - look how entity_id was created from a Cyrillic name:

Why this is important?
Probably person & device_tracker entities are only domains in STATE_COLORED_DOMAIN that may have states with a not-Latin values.
It is possible to define CSS theme vars for these domains (even with non-Latin chars, see an example above).
If the current issue is solved - then it would be possible to define custom colors in themes for zones (this issue).

Describe the behavior you expected

Cyrillic chars should not be omitted while processing a state.

Steps to reproduce the issue

see above

What version of Home Assistant Core has the issue?

2024.12

What was the last working version of Home Assistant Core?

No response

In which browser are you experiencing the issue with?

Chrome 131.0.6778.109

Which operating system are you using to run this browser?

Win10x64

State of relevant entities

No response

Problem-relevant frontend configuration

No response

Javascript errors shown in your browser console/inspector

No response

Additional information

No response