From ef597ae65bf5a170a811e523b0edb00d15e4c8af Mon Sep 17 00:00:00 2001
From: David Calhoun <github@davidcalhoun.me>
Date: Fri, 4 Aug 2023 10:12:53 -0400
Subject: [PATCH] fix: RichText applies direction-specific padding

Certain contexts apply different padding for different directions, e.g.
horizontal vs vertical, left vs right.
---
 .../test/__snapshots__/edit.native.js.snap    |  2 ++
 .../test/__snapshots__/edit.native.js.snap    | 12 ++++++++++--
 .../test/__snapshots__/edit.native.js.snap    |  5 ++++-
 .../test/__snapshots__/edit.native.js.snap    | 10 ++++++++--
 .../test/__snapshots__/edit.native.js.snap    | 19 ++++++++++++++++---
 .../rich-text/src/component/index.native.js   | 15 ++++++++++-----
 .../test/__snapshots__/index.native.js.snap   | 10 ++++++++--
 7 files changed, 58 insertions(+), 15 deletions(-)

diff --git a/packages/block-library/src/audio/test/__snapshots__/edit.native.js.snap b/packages/block-library/src/audio/test/__snapshots__/edit.native.js.snap
index dca3f782efc676..675e9ad097c195 100644
--- a/packages/block-library/src/audio/test/__snapshots__/edit.native.js.snap
+++ b/packages/block-library/src/audio/test/__snapshots__/edit.native.js.snap
@@ -129,6 +129,7 @@ exports[`Audio block renders audio block error state without crashing 1`] = `
         style={
           [
             undefined,
+            {},
             undefined,
           ]
         }
@@ -355,6 +356,7 @@ exports[`Audio block renders audio file without crashing 1`] = `
         style={
           [
             undefined,
+            {},
             undefined,
           ]
         }
diff --git a/packages/block-library/src/file/test/__snapshots__/edit.native.js.snap b/packages/block-library/src/file/test/__snapshots__/edit.native.js.snap
index 5ce876137ade00..7a99d3dec493fe 100644
--- a/packages/block-library/src/file/test/__snapshots__/edit.native.js.snap
+++ b/packages/block-library/src/file/test/__snapshots__/edit.native.js.snap
@@ -60,6 +60,7 @@ exports[`File block renders file error state without crashing 1`] = `
         style={
           [
             undefined,
+            {},
             undefined,
           ]
         }
@@ -174,7 +175,10 @@ exports[`File block renders file error state without crashing 1`] = `
       <View
         style={
           [
-            undefined,
+            {
+              "backgroundColor": undefined,
+            },
+            {},
             undefined,
           ]
         }
@@ -311,6 +315,7 @@ exports[`File block renders file without crashing 1`] = `
         style={
           [
             undefined,
+            {},
             undefined,
           ]
         }
@@ -399,7 +404,10 @@ exports[`File block renders file without crashing 1`] = `
       <View
         style={
           [
-            undefined,
+            {
+              "backgroundColor": undefined,
+            },
+            {},
             undefined,
           ]
         }
diff --git a/packages/block-library/src/paragraph/test/__snapshots__/edit.native.js.snap b/packages/block-library/src/paragraph/test/__snapshots__/edit.native.js.snap
index adc6ab4210efa5..c70baad3d15c1d 100644
--- a/packages/block-library/src/paragraph/test/__snapshots__/edit.native.js.snap
+++ b/packages/block-library/src/paragraph/test/__snapshots__/edit.native.js.snap
@@ -4,7 +4,10 @@ exports[`Paragraph block should render without crashing and match snapshot 1`] =
 <View
   style={
     [
-      undefined,
+      {
+        "backgroundColor": undefined,
+      },
+      {},
       undefined,
     ]
   }
diff --git a/packages/block-library/src/preformatted/test/__snapshots__/edit.native.js.snap b/packages/block-library/src/preformatted/test/__snapshots__/edit.native.js.snap
index db1c80c514206b..dbd05920aeb107 100644
--- a/packages/block-library/src/preformatted/test/__snapshots__/edit.native.js.snap
+++ b/packages/block-library/src/preformatted/test/__snapshots__/edit.native.js.snap
@@ -13,7 +13,10 @@ exports[`Preformatted should match snapshot when content is empty 1`] = `
   <View
     style={
       [
-        undefined,
+        {
+          "backgroundColor": undefined,
+        },
+        {},
         undefined,
       ]
     }
@@ -60,7 +63,10 @@ exports[`Preformatted should match snapshot when content is not empty 1`] = `
   <View
     style={
       [
-        undefined,
+        {
+          "backgroundColor": undefined,
+        },
+        {},
         undefined,
       ]
     }
diff --git a/packages/block-library/src/search/test/__snapshots__/edit.native.js.snap b/packages/block-library/src/search/test/__snapshots__/edit.native.js.snap
index e40797aea57757..b9e860d45e8d90 100644
--- a/packages/block-library/src/search/test/__snapshots__/edit.native.js.snap
+++ b/packages/block-library/src/search/test/__snapshots__/edit.native.js.snap
@@ -15,6 +15,7 @@ exports[`Search Block renders block with button inside option 1`] = `
       style={
         [
           undefined,
+          {},
           undefined,
         ]
       }
@@ -139,7 +140,10 @@ exports[`Search Block renders block with button inside option 1`] = `
         <View
           style={
             [
-              undefined,
+              {
+                "backgroundColor": undefined,
+              },
+              {},
               undefined,
             ]
           }
@@ -229,6 +233,7 @@ exports[`Search Block renders block with icon button option matches snapshot 1`]
       style={
         [
           undefined,
+          {},
           undefined,
         ]
       }
@@ -423,7 +428,10 @@ exports[`Search Block renders block with label hidden matches snapshot 1`] = `
         <View
           style={
             [
-              undefined,
+              {
+                "backgroundColor": undefined,
+              },
+              {},
               undefined,
             ]
           }
@@ -513,6 +521,7 @@ exports[`Search Block renders with default configuration matches snapshot 1`] =
       style={
         [
           undefined,
+          {},
           undefined,
         ]
       }
@@ -637,7 +646,10 @@ exports[`Search Block renders with default configuration matches snapshot 1`] =
         <View
           style={
             [
-              undefined,
+              {
+                "backgroundColor": undefined,
+              },
+              {},
               undefined,
             ]
           }
@@ -727,6 +739,7 @@ exports[`Search Block renders with no-button option matches snapshot 1`] = `
       style={
         [
           undefined,
+          {},
           undefined,
         ]
       }
diff --git a/packages/rich-text/src/component/index.native.js b/packages/rich-text/src/component/index.native.js
index 47b47d58c59885..8f4232b39d3930 100644
--- a/packages/rich-text/src/component/index.native.js
+++ b/packages/rich-text/src/component/index.native.js
@@ -1182,12 +1182,17 @@ export class RichText extends Component {
 			maxWidth && this.state.width && maxWidth - this.state.width < 10
 				? maxWidth
 				: this.state.width;
+
+		const paddingStyles = {};
+		for ( const key in style ) {
+			if ( /padding/.test( key ) ) {
+				paddingStyles[ key ] = style[ key ];
+			}
+		}
+
 		const containerStyles = [
-			style?.padding &&
-				style?.backgroundColor && {
-					padding: style.padding,
-					backgroundColor: style.backgroundColor,
-				},
+			style && { backgroundColor: style.backgroundColor },
+			paddingStyles,
 			containerWidth && {
 				width: containerWidth,
 			},
diff --git a/packages/rich-text/src/test/__snapshots__/index.native.js.snap b/packages/rich-text/src/test/__snapshots__/index.native.js.snap
index c9d3d62e40ce9d..5ab5ad8c0738f0 100644
--- a/packages/rich-text/src/test/__snapshots__/index.native.js.snap
+++ b/packages/rich-text/src/test/__snapshots__/index.native.js.snap
@@ -10,7 +10,10 @@ exports[`<RichText/> Font Size should update the font size when style prop with
 <View
   style={
     [
-      undefined,
+      {
+        "backgroundColor": undefined,
+      },
+      {},
       undefined,
     ]
   }
@@ -46,7 +49,10 @@ exports[`<RichText/> Font Size should update the font size with decimals when st
 <View
   style={
     [
-      undefined,
+      {
+        "backgroundColor": undefined,
+      },
+      {},
       undefined,
     ]
   }