fix format

resend · Sep 24, 2024 · 7f204d5 · 7f204d5
1 parent d8c80a8
commit 7f204d5
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 14 deletions.
diff --git a/packages/font/src/font.spec.tsx b/packages/font/src/font.spec.tsx
@@ -4,7 +4,7 @@ import { Font } from "./index";
 describe("<Font> component", () => {
   it("renders with default props", async () => {
     const html = await render(
-      <Font fallbackFontFamily="Helvetica" fontFamily="Arial" />
+      <Font fallbackFontFamily="Helvetica" fontFamily="Arial" />,
     );
 
     expect(html).toContain("font-style: normal;");
@@ -23,26 +23,26 @@ describe("<Font> component", () => {
         fallbackFontFamily="Helvetica"
         fontFamily="Example"
         webFont={webFont}
-      />
+      />,
     );
 
     expect(html).toContain("font-family: 'Example';");
     expect(html).toContain(
-      `src: url(${webFont.url}) format('${webFont.format}');`
+      `src: url(${webFont.url}) format('${webFont.format}');`,
     );
   });
 
   it("renders with multiple fallback fonts", async () => {
     const html = await render(
-      <Font fallbackFontFamily={["Helvetica", "Verdana"]} fontFamily="Arial" />
+      <Font fallbackFontFamily={["Helvetica", "Verdana"]} fontFamily="Arial" />,
     );
 
     expect(html).toContain("font-family: 'Arial', Helvetica, Verdana;");
   });
 
   it("renders correctly", async () => {
     const actualOutput = await render(
-      <Font fallbackFontFamily="Verdana" fontFamily="Roboto" />
+      <Font fallbackFontFamily="Verdana" fontFamily="Roboto" />,
     );
     expect(actualOutput).toMatchSnapshot();
   });
@@ -58,13 +58,13 @@ describe("<Font> component", () => {
         fallbackFontFamily={["Helvetica Neue", "Arial"]}
         fontFamily="My 'Custom' Font"
         webFont={webFont}
-      />
+      />,
     );
 
     expect(html).toContain("font-family: 'My \\'Custom\\' Font';");
     expect(html).toContain("Helvetica Neue, Arial");
     expect(html).toContain(
-      'src: url(\\"http://example.com/font.woff\\") format(\'woff\');'
+      "src: url(\\\"http://example.com/font.woff\\\") format('woff');",
     );
   });
-});
+});
diff --git a/packages/font/src/font.tsx b/packages/font/src/font.tsx
@@ -48,7 +48,9 @@ export const Font: React.FC<Readonly<FontProps>> = ({
   fontWeight = 400,
 }) => {
   const src = webFont
-    ? `src: url(${webFont.url.replace(/"/g, '\\"')}) format('${webFont.format}');`
+    ? `src: url(${webFont.url.replace(/"/g, '\\"')}) format('${
+        webFont.format
+      }');`
     : "";
 
   const style = `
@@ -66,11 +68,13 @@ export const Font: React.FC<Readonly<FontProps>> = ({
 
     * {
       font-family: '${fontFamily.replace(/'/g, "\\'")}', ${
-    Array.isArray(fallbackFontFamily)
-      ? fallbackFontFamily.map((font) => font.replace(/'/g, "\\'")).join(", ")
-      : fallbackFontFamily.replace(/'/g, "\\'")
-  };
+        Array.isArray(fallbackFontFamily)
+          ? fallbackFontFamily
+              .map((font) => font.replace(/'/g, "\\'"))
+              .join(", ")
+          : fallbackFontFamily.replace(/'/g, "\\'")
+      };
     }
   `;
   return <style dangerouslySetInnerHTML={{ __html: style }} />;
-};
+};