@pagenflow/email 1.1.6 → 1.1.8

package/dist/index.esm.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import React, { memo, createElement, Fragment, useEffect } from 'react';
+import React, { memo, Fragment, useEffect } from 'react';
 
 function Body({ children, config = {} }) {
     var _a, _b, _c, _d;
@@ -17332,7 +17332,6 @@ function Button({ config, devMode }) {
     color = "#ffffff", padding = "12px 24px", borderRadius = "3px", width, justifyContent = "center", } = config;
     // 1. Link (A) Tag Styles (Fallback for Webmail/Mobile)
     const linkStyle = {
-        color: color,
         textDecoration: "none",
         display: "block",
         // Apply padding here for simplicity, though the TD is more reliable
@@ -17365,7 +17364,7 @@ function Button({ config, devMode }) {
     <!--[if mso]>
     <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="${href}" style="height:${vmlHeight}px;v-text-anchor:middle;width:${vmlWidth}px;" arcsize="${(parseInt(borderRadius) / vmlHeight) * 100}%" strokecolor="${vmlFillColor}" fillcolor="${vmlFillColor}">
       <w:anchorlock/>
-      <center style="color:${color};font-family:Arial,sans-serif;font-size:16px;font-weight:bold;">
+      <center style="color:${color};font-family:${linkStyle.fontFamily};font-size:${linkStyle.fontSize};font-weight:${linkStyle.fontWeight};">
         ${typeof children === "string" ? children : ""}
       </center>
     </v:roundrect>
@@ -17384,16 +17383,24 @@ function Button({ config, devMode }) {
             border: "0 solid",
             margin: 0,
             padding: 0,
-        }, children: jsx("tbody", { children: jsx("tr", { children: jsxs("td", { children: [jsx("div", { dangerouslySetInnerHTML: { __html: vmlButton } }), jsx("div", { dangerouslySetInnerHTML: { __html: `<!--[if !mso]><!-->` } }), jsx("table", { role: "presentation", cellPadding: 0, cellSpacing: 0, border: 0, style: {
-                                borderCollapse: "collapse",
-                                width: "100%",
-                            }, children: jsx("tbody", { children: jsx("tr", { children: jsx("td", { style: buttonTdStyle, children: createElement(devMode ? "button" : "a", Object.assign(Object.assign({}, (devMode
-                                            ? {}
-                                            : {
-                                                href,
-                                                target: "_blank",
-                                                rel: "noopener noreferrer",
-                                            })), { style: linkStyle, draggable: false }), children) }) }) }) }), jsx("div", { dangerouslySetInnerHTML: { __html: `<!--<![endif]-->` } })] }) }) }) }));
+        }, children: jsx("tbody", { children: jsx("tr", { children: jsx("td", { dangerouslySetInnerHTML: {
+                        __html: `
+      ${vmlButton}
+      <!--[if !mso]><!-->
+      <table role="presentation" cellpadding="0" cellspacing="0" border="0" style="border-collapse: collapse; width: 100%;">
+        <tbody>
+          <tr>
+            <td style="background-color: ${buttonTdStyle.backgroundColor}; border-radius: ${buttonTdStyle.borderRadius}; padding: ${buttonTdStyle.padding}; width: ${buttonTdStyle.width};">
+              <a href="${href}" target="_blank" rel="noopener noreferrer" style="color: ${color}; text-decoration: ${linkStyle.textDecoration}; display: ${linkStyle.display}; padding: ${linkStyle.padding}; word-break: ${linkStyle.wordBreak}; font-family: ${linkStyle.fontFamily}; font-size: ${linkStyle.fontSize}; font-weight: ${linkStyle.fontWeight}; line-height: ${linkStyle.lineHeight};">
+                ${typeof children === "string" ? children : ""}
+              </a>
+            </td>
+          </tr>
+        </tbody>
+      </table>
+      <!--<![endif]-->
+    `,
+                    } }) }) }) }));
 }
 var Button_default = memo(Button, arePropsEqual);