Fix setting border radius on web in singleline mode (#617)

Expensify · Feb 17, 2025 · 0e8cf49 · 0e8cf49
1 parent 958dbd9
commit 0e8cf49
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 3 deletions.
diff --git a/src/MarkdownTextInputDecoratorViewNativeComponent.ts b/src/MarkdownTextInputDecoratorViewNativeComponent.ts
@@ -37,14 +37,17 @@ interface MarkdownStyle {
   mentionHere: {
     color: ColorValue;
     backgroundColor: ColorValue;
+    borderRadius?: Float;
   };
   mentionUser: {
     color: ColorValue;
     backgroundColor: ColorValue;
+    borderRadius?: Float;
   };
   mentionReport: {
     color: ColorValue;
     backgroundColor: ColorValue;
+    borderRadius?: Float;
   };
   inlineImage: {
     minWidth: Float;

diff --git a/src/web/utils/blockUtils.ts b/src/web/utils/blockUtils.ts
@@ -82,9 +82,11 @@ function addStyleToBlock(targetElement: HTMLElement, type: NodeType, markdownSty
       });
       break;
     case 'text':
-      if (!isMultiline) {
-        Object.assign(node.style, {backgroundColor: targetElement.parentElement?.style.backgroundColor});
-        Object.assign(targetElement.parentElement?.style ?? {}, {backgroundColor: 'transparent'});
+      if (!isMultiline && targetElement.parentElement?.style) {
+        // Move text background styles from parent to the text node
+        const parentElement = targetElement.parentElement;
+        node.style.cssText = parentElement.style.cssText;
+        parentElement.style.cssText = '';
       }
       break;
     default: