Avoid quoting CSS variables in formatFontFamily

[nextend]

What?

Fixes an issue where font families defined as CSS variables in theme.json (e.g., "fontFamily": "var(--font-family-variable)") are incorrectly quoted when rendered in the Site Editor → Styles → Typography → Fonts panel.

Why?

Currently, when a font family is defined using a CSS variable in theme.json, it is rendered with quotes in the Site Editor UI. This causes the font not to be recognized or applied correctly. However, in other parts of the system (like frontend rendering), these variables are left unquoted and work as expected. This inconsistency leads to bugs and confusion for theme developers and users.

How?

Updated the formatFontFamily utility to detect and preserve valid CSS variable definitions using a regular expression (/^var(--[a-zA-Z0-9_-]+(,.+)?)$/). When such a value is found, it is returned as-is, without additional formatting or quoting. Other font family names continue to be trimmed and quoted when necessary.

Testing Instructions

1. Testing Instructions
2. Add a theme.json to your theme with a fontFamilies entry like this:

{
  "settings": {
    "typography": {
      "fontFamilies": [
        {
          "name": "Base font",
          "slug": "base-font",
          "fontFamily": "var(--font-family-variable)"
        }
      ]
    }
  }
}

3. Open the Site Editor.
4. Go to Styles → Typography → Fonts.
5. Confirm that the font variable var(--font-family-variable) appears without surrounding quotes. (Inspect the element)

[github-actions]

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: nextend <nextendweb@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

[github-actions]

👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @nextend! In case you missed it, we'd love to have you join us in our Slack community.

If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information.