[field] Force show whitespace if only change in segment

sanity-io · Oct 6, 2020 · aaeebf4 · aaeebf4
1 parent a58aaee
commit aaeebf4
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 1 deletion.
diff --git a/packages/@sanity/field/src/diff/annotations/AnnotatedStringDiff.css b/packages/@sanity/field/src/diff/annotations/AnnotatedStringDiff.css
@@ -50,3 +50,8 @@
   text-decoration: line-through;
   mix-blend-mode: multiply;
 }
+
+.empty {
+  white-space: pre-line;
+  white-space: break-spaces;
+}
diff --git a/packages/@sanity/field/src/diff/annotations/AnnotatedStringDiff.tsx b/packages/@sanity/field/src/diff/annotations/AnnotatedStringDiff.tsx
@@ -14,11 +14,12 @@ function FormattedPreviewText({
 }) {
   const startsWithWhitespace = text.startsWith(' ')
   const endsWithWhitespace = text.endsWith(' ')
+  const isWhitespace = text.trim().length === 0 ? styles.empty : false
 
   return (
     <>
       {isFirstSegment && startsWithWhitespace && <>&nbsp;</>}
-      {text}
+      {isWhitespace ? <span className={styles.empty}>{text}</span> : text}
       {isLastSegment && endsWithWhitespace && <>&nbsp;</>}
     </>
   )