fix: fix unknown font family support (#4136)

## Description

Last pr introduced a regression when font family is used that isn't in
the stakcs

## Steps for reproduction

1. type a random font family
2. expect it to land in the dom

## Code Review

- [ ] hi @kof, I need you to do
  - conceptual review (architecture, feature-correctness)
  - detailed review (read every line)
  - test it on preview

## Before requesting a review

- [ ] made a self-review
- [ ] added inline comments where things may be not obvious (the "why",
not "what")

## Before merging

- [ ] tested locally and on preview environment (preview dev login:
5de6)
- [ ] updated [test
cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md)
document
- [ ] added tests
- [ ] if any new env variables are added, added them to `.env` file

Author: kof

packages/css-engine/src/core/to-value.test.ts

@@ -46,7 +46,7 @@ describe("Convert WS CSS Values to native CSS strings", () => {
     expect(value).toBe("var(--namespace, normal, 10px)");
   });
 
-  test("fontFamily", () => {
+  test("fontFamily stack", () => {
     expect(
       toValue({
         type: "fontFamily",
@@ -57,6 +57,15 @@ describe("Convert WS CSS Values to native CSS strings", () => {
     );
   });
 
+  test("fontFamily unknown", () => {
+    expect(
+      toValue({
+        type: "fontFamily",
+        value: ["something-random"],
+      })
+    ).toBe("something-random, sans-serif");
+  });
+
   test("Transform font family value to override default fallback", () => {
     const value = toValue(
       {

packages/css-engine/src/core/to-value.ts

@@ -7,6 +7,7 @@ export type TransformValue = (styleValue: StyleValue) => undefined | StyleValue;
 const fallbackTransform: TransformValue = (styleValue) => {
   if (styleValue.type === "fontFamily") {
     const fonts = SYSTEM_FONTS.get(styleValue.value[0])?.stack ?? [
+      styleValue.value[0],
       DEFAULT_FONT_FALLBACK,
     ];
     const value = Array.from(new Set(fonts));