Fix warning of props being passed to DOM

vivid-planet · Dec 10, 2024 · 494f48f · 494f48f
1 parent 626c019
commit 494f48f
Showing 1 changed file with 9 additions and 5 deletions.
diff --git a/site/src/common/components/Typography.tsx b/site/src/common/components/Typography.tsx
@@ -191,11 +191,15 @@ const variantToElementMap: Record<TypographyVariant, "h1" | "h2" | "h3" | "h4" |
     p200: "p",
 };
 
-export const Typography = styled.div.attrs<{
-    as?: unknown;
-    variant?: TypographyVariant;
-    bottomSpacing?: boolean;
-}>((props) => ({ as: props.as ?? variantToElementMap[props.variant ?? "p300"] }))`
+export const Typography = styled.div
+    .withConfig({
+        shouldForwardProp: (prop) => !["variant", "bottomSpacing"].includes(prop),
+    })
+    .attrs<{
+        as?: unknown;
+        variant?: TypographyVariant;
+        bottomSpacing?: boolean;
+    }>((props) => ({ as: props.as ?? variantToElementMap[props.variant ?? "p300"] }))`
     font-family: ${({ theme }) => theme.fontFamily};
     ${({ variant = "p300" }) => typographyVariantStyle[variant]};
     margin-top: 0;