@sqrzro/ui 4.0.0-alpha.41 → 4.0.0-alpha.42

package/dist/components/index.d.ts

@@ -31,14 +31,6 @@ export type { AppForbiddenErrorProps } from './errors/AppForbiddenError';
 export { default as AppForbiddenError } from './errors/AppForbiddenError';
 export type { AppNotFoundErrorProps } from './errors/AppNotFoundError';
 export { default as AppNotFoundError } from './errors/AppNotFoundError';
-export type { MailProps } from './mail/Mail';
-export { default as Mail } from './mail/Mail';
-export type { MailBlockProps } from './mail/MailBlock';
-export { default as MailBlock } from './mail/MailBlock';
-export type { MailButtonProps } from './mail/MailButton';
-export { default as MailButton } from './mail/MailButton';
-export type { MailTableProps } from './mail/MailTable';
-export { default as MailTable } from './mail/MailTable';
 export type { ModalProps } from './modals/Modal';
 export { default as Modal } from './modals/Modal';
 export type { ModalLauncherProps } from './modals/ModalLauncher';

package/dist/components/index.js

@@ -15,10 +15,6 @@ export { default as Summary } from './elements/Summary';
 export { default as AppError } from './errors/AppError';
 export { default as AppForbiddenError } from './errors/AppForbiddenError';
 export { default as AppNotFoundError } from './errors/AppNotFoundError';
-export { default as Mail } from './mail/Mail';
-export { default as MailBlock } from './mail/MailBlock';
-export { default as MailButton } from './mail/MailButton';
-export { default as MailTable } from './mail/MailTable';
 export { default as Modal } from './modals/Modal';
 export { default as ModalLauncher } from './modals/ModalLauncher';
 export { default as Container } from './utility/Container';

package/dist/{components/mail → mail}/Mail/index.d.ts

@@ -1,7 +1,8 @@
-import type { AppConfig } from '@sqrzro/config';
-export type MailProps = AppConfig['mail'] & {
+import { DeepPartial } from '@sqrzro/utility';
+import { MailConfigObject } from '../utility/interfaces';
+export interface MailProps extends DeepPartial<MailConfigObject> {
     children: React.ReactNode;
     title: string;
-};
+}
 declare function Mail({ children, logo, styles, title, }: Readonly<MailProps>): Promise<React.ReactElement>;
 export default Mail;

package/dist/{components/mail → mail}/Mail/index.js

@@ -1,28 +1,11 @@
+'use server';
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-/* eslint-disable max-lines-per-function, react/jsx-max-depth, react/no-danger */
 import { Fragment } from 'react';
-import { deepMerge } from '@sqrzro/utility';
-import { getConfig } from '../../../addon/config';
-const DEFAULT_STYLES = {
-    styles: {
-        root: {
-            backgroundColor: '#f5f5f5',
-        },
-        panel: {
-            backgroundColor: '#ffffff',
-            padding: 40,
-        },
-        title: {
-            color: '#62748e',
-            fontSize: 20,
-            fontWeight: 'bold',
-        },
-    },
-};
+import getMailConfig from '../utility/get-mail-config';
 const HALF = 2;
 async function Mail({ children, logo, styles, title, }) {
-    const styleConfig = deepMerge(DEFAULT_STYLES?.styles || {}, getConfig().app.mail?.styles || {}, styles || {});
-    const logoData = await (await import('../../../utility/convert-to-datauri')).default(logo ?? getConfig().app.mail?.logo ?? '');
+    const mailConfig = getMailConfig({ styles });
+    const logoData = await (await import('../utility/convert-to-datauri')).default(logo ?? mailConfig.logo ?? '');
     return (_jsxs("html", { lang: "en", children: [_jsxs("head", { children: [_jsx("meta", { charSet: "utf-8" }), _jsx("style", { dangerouslySetInnerHTML: {
                             __html: `
                         body {
@@ -48,66 +31,76 @@ async function Mail({ children, logo, styles, title, }) {
                             }
                         }
                     `,
-                        } })] }), _jsx("body", { children: _jsx("table", { border: 0, cellPadding: 0, cellSpacing: 0, width: "100%", children: _jsxs("tbody", { children: [_jsx("tr", { children: _jsx("td", { className: "padding", colSpan: 3, height: "20", style: { backgroundColor: styleConfig.root.backgroundColor } }) }), _jsxs("tr", { children: [_jsx("td", { className: "padding", style: { backgroundColor: styleConfig.root.backgroundColor }, width: "20" }), _jsx("td", { align: "center", style: { backgroundColor: styleConfig.root.backgroundColor }, children: _jsx("table", { border: 0, cellPadding: 0, cellSpacing: 0, className: "container", width: "650", children: _jsxs("tbody", { children: [_jsxs("tr", { children: [_jsx("td", { className: "padding", height: "20", style: {
-                                                                    backgroundColor: styleConfig.panel.backgroundColor,
+                        } })] }), _jsx("body", { children: _jsx("table", { border: 0, cellPadding: 0, cellSpacing: 0, width: "100%", children: _jsxs("tbody", { children: [_jsx("tr", { children: _jsx("td", { className: "padding", colSpan: 3, height: "20", style: { backgroundColor: mailConfig.styles.root.backgroundColor } }) }), _jsxs("tr", { children: [_jsx("td", { className: "padding", style: { backgroundColor: mailConfig.styles.root.backgroundColor }, width: "20" }), _jsx("td", { align: "center", style: { backgroundColor: mailConfig.styles.root.backgroundColor }, children: _jsx("table", { border: 0, cellPadding: 0, cellSpacing: 0, className: "container", width: "650", children: _jsxs("tbody", { children: [_jsxs("tr", { children: [_jsx("td", { className: "padding", height: "20", style: {
+                                                                    backgroundColor: mailConfig.styles.panel.backgroundColor,
                                                                 }, width: "20", children: _jsx("div", { className: "padding", style: {
-                                                                        backgroundColor: styleConfig.root.backgroundColor,
-                                                                        height: styleConfig.panel.padding,
-                                                                        width: styleConfig.panel.padding,
+                                                                        backgroundColor: mailConfig.styles.root.backgroundColor,
+                                                                        height: mailConfig.styles.panel.padding,
+                                                                        width: mailConfig.styles.panel.padding,
                                                                     }, children: _jsx("div", { className: "padding", style: {
-                                                                            backgroundColor: styleConfig.panel.backgroundColor,
-                                                                            borderTopLeftRadius: styleConfig.panel.padding / HALF,
-                                                                            height: styleConfig.panel.padding,
-                                                                            width: styleConfig.panel.padding,
+                                                                            backgroundColor: mailConfig.styles.panel
+                                                                                .backgroundColor,
+                                                                            borderTopLeftRadius: mailConfig.styles.panel.padding /
+                                                                                HALF,
+                                                                            height: mailConfig.styles.panel.padding,
+                                                                            width: mailConfig.styles.panel.padding,
                                                                         } }) }) }), _jsx("td", { className: "container", style: {
-                                                                    backgroundColor: styleConfig.panel.backgroundColor,
-                                                                }, width: "610" }), _jsx("td", { className: "padding", height: styleConfig.panel.padding, style: {
-                                                                    backgroundColor: styleConfig.panel.backgroundColor,
-                                                                }, width: styleConfig.panel.padding, children: _jsx("div", { className: "padding", style: {
-                                                                        backgroundColor: styleConfig.root.backgroundColor,
-                                                                        height: styleConfig.panel.padding,
-                                                                        width: styleConfig.panel.padding,
+                                                                    backgroundColor: mailConfig.styles.panel.backgroundColor,
+                                                                }, width: "610" }), _jsx("td", { className: "padding", height: mailConfig.styles.panel.padding, style: {
+                                                                    backgroundColor: mailConfig.styles.panel.backgroundColor,
+                                                                }, width: mailConfig.styles.panel.padding, children: _jsx("div", { className: "padding", style: {
+                                                                        backgroundColor: mailConfig.styles.root.backgroundColor,
+                                                                        height: mailConfig.styles.panel.padding,
+                                                                        width: mailConfig.styles.panel.padding,
                                                                     }, children: _jsx("div", { className: "padding", style: {
-                                                                            backgroundColor: styleConfig.panel.backgroundColor,
-                                                                            borderTopRightRadius: styleConfig.panel.padding / HALF,
-                                                                            height: styleConfig.panel.padding,
-                                                                            width: styleConfig.panel.padding,
+                                                                            backgroundColor: mailConfig.styles.panel
+                                                                                .backgroundColor,
+                                                                            borderTopRightRadius: mailConfig.styles.panel.padding /
+                                                                                HALF,
+                                                                            height: mailConfig.styles.panel.padding,
+                                                                            width: mailConfig.styles.panel.padding,
                                                                         } }) }) })] }), _jsxs("tr", { children: [_jsx("td", { className: "padding", style: {
-                                                                    backgroundColor: styleConfig.panel.backgroundColor,
-                                                                }, width: styleConfig.panel.padding }), _jsx("td", { style: {
-                                                                    backgroundColor: styleConfig.panel.backgroundColor,
-                                                                }, children: _jsx("table", { border: 0, cellPadding: 0, cellSpacing: 0, width: "100%", children: _jsxs("tbody", { children: [logoData ? (_jsxs(Fragment, { children: [_jsx("tr", { children: _jsx("td", { children: _jsx("table", { border: 0, cellPadding: 0, cellSpacing: 0, width: 240, children: _jsx("tbody", { children: _jsx("tr", { children: _jsx("td", { children: _jsx("img", { alt: "Logo", src: logoData, width: 240 }) }) }) }) }) }) }), _jsx("tr", { children: _jsx("td", { height: styleConfig.panel
+                                                                    backgroundColor: mailConfig.styles.panel.backgroundColor,
+                                                                }, width: mailConfig.styles.panel.padding }), _jsx("td", { style: {
+                                                                    backgroundColor: mailConfig.styles.panel.backgroundColor,
+                                                                }, children: _jsx("table", { border: 0, cellPadding: 0, cellSpacing: 0, width: "100%", children: _jsxs("tbody", { children: [logoData ? (_jsxs(Fragment, { children: [_jsx("tr", { children: _jsx("td", { children: _jsx("table", { border: 0, cellPadding: 0, cellSpacing: 0, width: 240, children: _jsx("tbody", { children: _jsx("tr", { children: _jsx("td", { children: _jsx("img", { alt: "Logo", src: logoData, width: 240 }) }) }) }) }) }) }), _jsx("tr", { children: _jsx("td", { height: mailConfig.styles.panel
                                                                                                 .padding }) })] })) : null, _jsx("tr", { children: _jsx("td", { style: {
-                                                                                        color: styleConfig.title.color,
-                                                                                        fontSize: styleConfig.title.fontSize,
-                                                                                        fontWeight: styleConfig.title
+                                                                                        color: mailConfig.styles.title
+                                                                                            .color,
+                                                                                        fontSize: mailConfig.styles.title
+                                                                                            .fontSize,
+                                                                                        fontWeight: mailConfig.styles.title
                                                                                             .fontWeight,
-                                                                                    }, children: title }) }), _jsx("tr", { children: _jsx("td", { height: styleConfig.panel.padding }) }), _jsx("tr", { children: _jsx("td", { children: children }) })] }) }) }), _jsx("td", { className: "padding", style: {
-                                                                    backgroundColor: styleConfig.panel.backgroundColor,
-                                                                }, width: styleConfig.panel.padding })] }), _jsxs("tr", { children: [_jsx("td", { className: "padding", height: styleConfig.panel.padding, style: {
-                                                                    backgroundColor: styleConfig.panel.backgroundColor,
-                                                                }, width: styleConfig.panel.padding, children: _jsx("div", { className: "padding", style: {
-                                                                        backgroundColor: styleConfig.root.backgroundColor,
-                                                                        height: styleConfig.panel.padding,
-                                                                        width: styleConfig.panel.padding,
+                                                                                    }, children: title }) }), _jsx("tr", { children: _jsx("td", { height: mailConfig.styles.panel.padding }) }), _jsx("tr", { children: _jsx("td", { children: children }) })] }) }) }), _jsx("td", { className: "padding", style: {
+                                                                    backgroundColor: mailConfig.styles.panel.backgroundColor,
+                                                                }, width: mailConfig.styles.panel.padding })] }), _jsxs("tr", { children: [_jsx("td", { className: "padding", height: mailConfig.styles.panel.padding, style: {
+                                                                    backgroundColor: mailConfig.styles.panel.backgroundColor,
+                                                                }, width: mailConfig.styles.panel.padding, children: _jsx("div", { className: "padding", style: {
+                                                                        backgroundColor: mailConfig.styles.root.backgroundColor,
+                                                                        height: mailConfig.styles.panel.padding,
+                                                                        width: mailConfig.styles.panel.padding,
                                                                     }, children: _jsx("div", { className: "padding", style: {
-                                                                            backgroundColor: styleConfig.panel.backgroundColor,
-                                                                            borderBottomLeftRadius: styleConfig.panel.padding / HALF,
-                                                                            height: styleConfig.panel.padding,
-                                                                            width: styleConfig.panel.padding,
+                                                                            backgroundColor: mailConfig.styles.panel
+                                                                                .backgroundColor,
+                                                                            borderBottomLeftRadius: mailConfig.styles.panel.padding /
+                                                                                HALF,
+                                                                            height: mailConfig.styles.panel.padding,
+                                                                            width: mailConfig.styles.panel.padding,
                                                                         } }) }) }), _jsx("td", { className: "container", style: {
-                                                                    backgroundColor: styleConfig.panel.backgroundColor,
-                                                                }, width: "610" }), _jsx("td", { className: "padding", height: styleConfig.panel.padding, style: {
-                                                                    backgroundColor: styleConfig.panel.backgroundColor,
-                                                                }, width: styleConfig.panel.padding, children: _jsx("div", { className: "padding", style: {
-                                                                        backgroundColor: styleConfig.root.backgroundColor,
-                                                                        height: styleConfig.panel.padding,
-                                                                        width: styleConfig.panel.padding,
+                                                                    backgroundColor: mailConfig.styles.panel.backgroundColor,
+                                                                }, width: "610" }), _jsx("td", { className: "padding", height: mailConfig.styles.panel.padding, style: {
+                                                                    backgroundColor: mailConfig.styles.panel.backgroundColor,
+                                                                }, width: mailConfig.styles.panel.padding, children: _jsx("div", { className: "padding", style: {
+                                                                        backgroundColor: mailConfig.styles.root.backgroundColor,
+                                                                        height: mailConfig.styles.panel.padding,
+                                                                        width: mailConfig.styles.panel.padding,
                                                                     }, children: _jsx("div", { className: "padding", style: {
-                                                                            backgroundColor: styleConfig.panel.backgroundColor,
-                                                                            borderBottomRightRadius: styleConfig.panel.padding / HALF,
-                                                                            height: styleConfig.panel.padding,
-                                                                            width: styleConfig.panel.padding,
-                                                                        } }) }) })] })] }) }) }), _jsx("td", { className: "padding", style: { backgroundColor: styleConfig.root.backgroundColor }, width: "20" })] }), _jsx("tr", { children: _jsx("td", { className: "padding", colSpan: 3, height: "20", style: { backgroundColor: styleConfig.root.backgroundColor } }) })] }) }) })] }));
+                                                                            backgroundColor: mailConfig.styles.panel
+                                                                                .backgroundColor,
+                                                                            borderBottomRightRadius: mailConfig.styles.panel.padding /
+                                                                                HALF,
+                                                                            height: mailConfig.styles.panel.padding,
+                                                                            width: mailConfig.styles.panel.padding,
+                                                                        } }) }) })] })] }) }) }), _jsx("td", { className: "padding", style: { backgroundColor: mailConfig.styles.root.backgroundColor }, width: "20" })] }), _jsx("tr", { children: _jsx("td", { className: "padding", colSpan: 3, height: "20", style: { backgroundColor: mailConfig.styles.root.backgroundColor } }) })] }) }) })] }));
 }
 export default Mail;

package/dist/mail/MailButton/index.d.ts

@@ -0,0 +1,8 @@
+import type { DeepPartial } from '@sqrzro/utility';
+import { MailConfigObject } from '../utility/interfaces';
+export interface MailButtonProps extends DeepPartial<MailConfigObject> {
+    children: string;
+    href: string;
+}
+declare function MailButton({ children, href, styles, }: MailButtonProps): Promise<React.ReactElement>;
+export default MailButton;

package/dist/mail/MailButton/index.js

@@ -0,0 +1,28 @@
+'use server';
+import { jsx as _jsx } from "react/jsx-runtime";
+import getMailConfig from '../utility/get-mail-config';
+function calculateWidth(text) {
+    const characterWidth = 8;
+    const padding = 50;
+    return text.length * characterWidth + padding;
+}
+async function MailButton({ children, href, styles, }) {
+    const mailConfig = getMailConfig({ styles });
+    const calculatedWidth = calculateWidth(children);
+    return (_jsx("div", { dangerouslySetInnerHTML: {
+            __html: `
+                    <!--[if mso]>
+                    <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="${href}" style="height:${mailConfig.styles.button.height}px;v-text-anchor:middle;width:${calculatedWidth}px;" arcsize="50%" stroke="f" fillcolor="${mailConfig.styles.button.backgroundColor}">
+                        <w:anchorlock/>
+                        <center>
+                            <![endif]-->
+                            <a href="${href}"
+                                style="background-color:${mailConfig.styles.button.backgroundColor};border-radius:${mailConfig.styles.button.borderRadius}px;color:${mailConfig.styles.button.color};display:inline-block;font-weight:bold;line-height:${mailConfig.styles.button.height}px;text-align:center;text-decoration:none;width:${calculatedWidth}px;-webkit-text-size-adjust:none;">${children}</a>
+                            <!--[if mso]>
+                        </center>
+                    </v:roundrect>
+                    <![endif]-->
+        `,
+        } }));
+}
+export default MailButton;

package/dist/mail/index.d.ts

@@ -0,0 +1,8 @@
+export type { MailProps } from './Mail';
+export { default as Mail } from './Mail';
+export type { MailBlockProps } from './MailBlock';
+export { default as MailBlock } from './MailBlock';
+export type { MailButtonProps } from './MailButton';
+export { default as MailButton } from './MailButton';
+export type { MailTableProps } from './MailTable';
+export { default as MailTable } from './MailTable';

package/dist/mail/index.js

@@ -0,0 +1,4 @@
+export { default as Mail } from './Mail';
+export { default as MailBlock } from './MailBlock';
+export { default as MailButton } from './MailButton';
+export { default as MailTable } from './MailTable';

package/dist/{utility → mail/utility}/convert-to-datauri.js

@@ -3,7 +3,8 @@ import fs from 'node:fs';
 import path from 'node:path';
 async function convertToDataURI(fileName) {
     try {
-        const filePath = path.resolve('./src', `.${fileName}`);
+        const filePath = path.resolve(fileName);
+        console.log('Converting file to Data URI:', filePath);
         const mimeType = 'image/' + path.extname(filePath).slice(1);
         const imageData = fs.readFileSync(filePath);
         const base64Image = Buffer.from(imageData).toString('base64');

package/dist/mail/utility/get-mail-config.d.ts

@@ -0,0 +1,4 @@
+import type { DeepPartial } from '@sqrzro/utility';
+import type { MailConfigObject } from './interfaces';
+declare function getMailConfig(overrides?: DeepPartial<MailConfigObject>): MailConfigObject;
+export default getMailConfig;

package/dist/mail/utility/get-mail-config.js

@@ -0,0 +1,34 @@
+import { deepMerge } from '@sqrzro/utility';
+const DEFAULT_STYLES = {
+    styles: {
+        button: {
+            backgroundColor: '#0f172b',
+            borderRadius: 4,
+            color: '#ffffff',
+            height: 40,
+        },
+        panel: {
+            backgroundColor: '#ffffff',
+            padding: 40,
+        },
+        root: {
+            backgroundColor: '#f5f5f5',
+        },
+        title: {
+            color: '#62748e',
+            fontSize: 20,
+            fontWeight: 'bold',
+        },
+    },
+};
+function getMailConfig(overrides) {
+    const string = process.env.MAIL_CONFIG || '{}';
+    try {
+        const object = JSON.parse(string);
+        return deepMerge(DEFAULT_STYLES, object, overrides || {});
+    }
+    catch (err) {
+        return deepMerge(DEFAULT_STYLES, overrides || {});
+    }
+}
+export default getMailConfig;

package/dist/mail/utility/interfaces.d.ts

@@ -0,0 +1,23 @@
+export interface MailConfigObject {
+    logo?: string;
+    styles: {
+        root: {
+            backgroundColor: string;
+        };
+        panel: {
+            backgroundColor: string;
+            padding: number;
+        };
+        button: {
+            backgroundColor: string;
+            borderRadius: number;
+            color: string;
+            height: number;
+        };
+        title: {
+            color: string;
+            fontSize: number;
+            fontWeight: string;
+        };
+    };
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sqrzro/ui",
   "type": "module",
-  "version": "4.0.0-alpha.41",
+  "version": "4.0.0-alpha.42",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "license": "ISC",
@@ -26,6 +26,10 @@
       "types": "./dist/hooks/index.d.ts",
       "default": "./dist/hooks/index.js"
     },
+    "./mail": {
+      "types": "./dist/mail/index.d.ts",
+      "default": "./dist/mail/index.js"
+    },
     "./navigation": {
       "types": "./dist/navigation/index.d.ts",
       "default": "./dist/navigation/index.js"
@@ -53,9 +57,8 @@
     "react-dom": "^19.2.4",
     "tailwind-merge": "^3.5.0",
     "use-deep-compare-effect": "^1.8.1",
-    "@sqrzro/addons": "^4.0.0-alpha.5",
-    "@sqrzro/utility": "^4.0.0-alpha.15",
-    "@sqrzro/config": "^4.0.0-alpha.3"
+    "@sqrzro/addons": "^4.0.0-alpha.6",
+    "@sqrzro/utility": "^4.0.0-alpha.16"
   },
   "devDependencies": {
     "@storybook/addon-a11y": "^10.2.14",

package/dist/addon/config.d.ts

@@ -1,5 +0,0 @@
-import { AppConfig } from '@sqrzro/config';
-import type { NodePgDatabase } from 'drizzle-orm/node-postgres';
-import type { UIAddonConfigObject, BaseUIAddonConfigObject } from './interfaces';
-export declare function setConfig(db: NodePgDatabase, appConfig: AppConfig, cfg?: Partial<BaseUIAddonConfigObject>): void;
-export declare function getConfig(): UIAddonConfigObject;

package/dist/addon/config.js

@@ -1,12 +0,0 @@
-import { MissingConfigError } from '@sqrzro/addons';
-import applyDefaults from './defaults';
-let config = null;
-export function setConfig(db, appConfig, cfg) {
-    config = { ...applyDefaults(cfg), db, app: appConfig };
-}
-export function getConfig() {
-    if (!config) {
-        throw new MissingConfigError('ui');
-    }
-    return config;
-}

package/dist/addon/defaults.d.ts

@@ -1,3 +0,0 @@
-import type { BaseUIAddonConfigObject } from './interfaces';
-declare function applyDefaults(config?: Partial<BaseUIAddonConfigObject>): BaseUIAddonConfigObject;
-export default applyDefaults;

package/dist/addon/defaults.js

@@ -1,6 +0,0 @@
-import { deepMerge } from '@sqrzro/utility';
-const defaults = {};
-function applyDefaults(config) {
-    return deepMerge(defaults, config || {});
-}
-export default applyDefaults;

package/dist/addon/index.d.ts

@@ -1,5 +0,0 @@
-import type { AddonRegisterFunction } from '@sqrzro/addons';
-import { BaseUIAddonConfigObject } from './interfaces';
-export * from './interfaces';
-declare const withUI: AddonRegisterFunction<BaseUIAddonConfigObject>;
-export default withUI;

package/dist/addon/index.js

@@ -1,8 +0,0 @@
-import { setConfig } from './config';
-export * from './interfaces';
-const withUI = (config) => ({
-    register: (db, appConfig) => {
-        setConfig(db, appConfig, config);
-    },
-});
-export default withUI;

package/dist/addon/interfaces.d.ts

@@ -1,8 +0,0 @@
-import { AppConfig } from '@sqrzro/config';
-import type { NodePgDatabase } from 'drizzle-orm/node-postgres';
-export interface BaseUIAddonConfigObject {
-}
-export interface UIAddonConfigObject extends BaseUIAddonConfigObject {
-    app: AppConfig;
-    db: NodePgDatabase;
-}

package/dist/components/mail/MailButton/index.d.ts

@@ -1,7 +0,0 @@
-import type { AppConfig } from '@sqrzro/config';
-export type MailButtonProps = AppConfig['mail'] & {
-    children: string;
-    href: string;
-};
-declare function MailButton({ children, href, styles }: Readonly<MailButtonProps>): React.ReactElement;
-export default MailButton;

package/dist/components/mail/MailButton/index.js

@@ -1,38 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { deepMerge } from '@sqrzro/utility';
-import { getConfig } from '../../../addon/config';
-const DEFAULT_STYLES = {
-    styles: {
-        button: {
-            backgroundColor: '#f26c25',
-            borderRadius: 20,
-            color: '#ffffff',
-            height: 40,
-        },
-    },
-};
-function calculateWidth(text) {
-    const characterWidth = 8;
-    const padding = 50;
-    return text.length * characterWidth + padding;
-}
-function MailButton({ children, href, styles }) {
-    const styleConfig = deepMerge(DEFAULT_STYLES?.styles || {}, getConfig().app.mail?.styles || {}, styles || {});
-    const calculatedWidth = calculateWidth(children);
-    return (_jsx("div", { dangerouslySetInnerHTML: {
-            __html: `
-                    <!--[if mso]>
-                    <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="${href}" style="height:${styleConfig.button.height}px;v-text-anchor:middle;width:${calculatedWidth}px;" arcsize="50%" stroke="f" fillcolor="${styleConfig.button.backgroundColor}">
-                        <w:anchorlock/>
-                        <center>
-                            <![endif]-->
-                            <a href="${href}"
-                                style="background-color:${styleConfig.button.backgroundColor};border-radius:${styleConfig.button.borderRadius}px;color:${styleConfig.button.color};display:inline-block;font-weight:bold;line-height:${styleConfig.button.height}px;text-align:center;text-decoration:none;width:${calculatedWidth}px;-webkit-text-size-adjust:none;">${children}</a>
-                            <!--[if mso]>
-                        </center>
-                    </v:roundrect>
-                    <![endif]-->
-        `,
-        } }));
-}
-export default MailButton;