Fix Body's font weight (#2765)

sumup-oss · Nov 4, 2024 · 6fdeea0 · 6fdeea0
1 parent 6e67e01
commit 6fdeea0
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 5 deletions.
diff --git a/.changeset/plenty-radios-try.md b/.changeset/plenty-radios-try.md
@@ -0,0 +1,5 @@
+---
+'@sumup-oss/circuit-ui': patch
+---
+
+Fixed the Body's font weight when rendered as a `strong` element.
diff --git a/packages/circuit-ui/components/Body/Body.module.css b/packages/circuit-ui/components/Body/Body.module.css
@@ -21,15 +21,15 @@
 
 /* Weights */
 
-.base.regular {
+.regular {
   font-weight: var(--cui-font-weight-regular);
 }
 
-.base.semibold {
+.semibold {
   font-weight: var(--cui-font-weight-semibold);
 }
 
-.base.bold {
+.bold {
   font-weight: var(--cui-font-weight-bold);
 }
 
@@ -88,7 +88,6 @@
 /* Variants */
 
 .highlight,
-strong.base,
 .base strong {
   font-weight: var(--cui-font-weight-semibold);
 }

diff --git a/packages/circuit-ui/components/Body/Body.tsx b/packages/circuit-ui/components/Body/Body.tsx
@@ -89,6 +89,13 @@ function getHTMLElement(variant?: Variant): AsPropType {
   return 'p';
 }
 
+function getDefaultWeight(as?: AsPropType) {
+  if (as === 'strong') {
+    return 'semibold';
+  }
+  return 'regular';
+}
+
 export const deprecatedSizeMap: Record<string, string> = {
   'one': 'm',
   'two': 's',
@@ -104,7 +111,7 @@ export const Body = forwardRef<HTMLParagraphElement, BodyProps>(
       className,
       as,
       size: legacySize = 'm',
-      weight = 'regular',
+      weight = getDefaultWeight(as),
       decoration,
       color = 'normal',
       variant,