From f589b1d78b69b92ea2ffca59c34fe757eff4b6ab Mon Sep 17 00:00:00 2001
From: Evan <evan.mclaughlin.m@gmail.com>
Date: Tue, 2 Sep 2025 09:39:22 -0400
Subject: [PATCH] fix(props): add support for number innerPadding value

---
 src/utils/mjml-component-utils.ts | 1 +
 test/mjml-props.test.tsx          | 4 ++--
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/utils/mjml-component-utils.ts b/src/utils/mjml-component-utils.ts
index 37baf0b..75e1e95 100644
--- a/src/utils/mjml-component-utils.ts
+++ b/src/utils/mjml-component-utils.ts
@@ -51,6 +51,7 @@ const numberToPixel = [
   "line-height",
   "icon-padding",
   "text-padding",
+  "inner-padding",
 ];
 
 function convertPropValueToMjml(
diff --git a/test/mjml-props.test.tsx b/test/mjml-props.test.tsx
index b5dbf71..4f346d0 100644
--- a/test/mjml-props.test.tsx
+++ b/test/mjml-props.test.tsx
@@ -86,12 +86,12 @@ describe("mjml components prop values", () => {
   it("padding and other props convert number type props to pixel values", () => {
     const { MjmlButton } = mjmlComponents;
     const button = (
-      <MjmlButton padding={16} width={300} height={56}>
+      <MjmlButton padding={16} width={300} height={56} innerPadding={10}>
         Single num
       </MjmlButton>
     );
     expect(renderToMjml(button)).toBe(
-      '<mj-button padding="16px" width="300px" height="56px">Single num</mj-button>'
+      '<mj-button padding="16px" width="300px" height="56px" inner-padding="10px">Single num</mj-button>'
     );
   });