feat(components): Update Chip.Prefix to conditionally render based on…

… content presence
GetJobber · Sep 17, 2024 · e86679b · e86679b
1 parent 165f302
commit e86679b
Showing 1 changed file with 3 additions and 1 deletion.
diff --git a/packages/components/src/Chip/Chip.tsx b/packages/components/src/Chip/Chip.tsx
@@ -34,6 +34,8 @@ export const Chip = ({
   const prefix = useChildComponent(children, d => d.type === Chip.Prefix);
   const suffix = useChildComponent(children, d => d.type === Chip.Suffix);
 
+  const prefixHasContent = !!prefix?.props?.children;
+
   const [labelRef, labelFullyVisible] = useInView<HTMLSpanElement>();
   const [headingRef, headingFullyVisible] = useInView<HTMLSpanElement>();
   const tooltipMessage = getTooltipMessage(
@@ -59,7 +61,7 @@ export const Chip = ({
         data-testid={testID}
         type="button"
       >
-        {prefix}
+        {prefixHasContent && prefix}
         <div className={styles.chipContent}>
           {heading && (
             <>