@geekmidas/emailkit 0.0.1 → 0.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,176 +0,0 @@
1
- const require_chunk = require('./chunk-CUT6urMc.cjs');
2
- const react_jsx_runtime = require_chunk.__toESM(require("react/jsx-runtime"));
3
-
4
- //#region src/templates.tsx
5
- const emailStyles = {
6
- container: {
7
- fontFamily: "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif",
8
- lineHeight: 1.6,
9
- color: "#333",
10
- maxWidth: "600px",
11
- margin: "0 auto",
12
- padding: "20px"
13
- },
14
- heading: {
15
- color: "#2c3e50",
16
- marginBottom: "20px"
17
- },
18
- button: {
19
- display: "inline-block",
20
- padding: "12px 24px",
21
- backgroundColor: "#3498db",
22
- color: "#ffffff",
23
- textDecoration: "none",
24
- borderRadius: "4px",
25
- fontWeight: "bold"
26
- },
27
- footer: {
28
- marginTop: "40px",
29
- paddingTop: "20px",
30
- borderTop: "1px solid #eee",
31
- fontSize: "14px",
32
- color: "#666"
33
- }
34
- };
35
- function EmailLayout({ children, preheader, title }) {
36
- return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("html", { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("head", { children: [
37
- /* @__PURE__ */ (0, react_jsx_runtime.jsx)("meta", { charSet: "utf-8" }),
38
- /* @__PURE__ */ (0, react_jsx_runtime.jsx)("meta", {
39
- name: "viewport",
40
- content: "width=device-width, initial-scale=1.0"
41
- }),
42
- title && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("title", { children: title }),
43
- preheader && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
44
- style: {
45
- display: "none",
46
- maxHeight: 0,
47
- overflow: "hidden"
48
- },
49
- children: preheader
50
- })
51
- ] }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("body", {
52
- style: {
53
- margin: 0,
54
- padding: 0,
55
- backgroundColor: "#f4f4f4"
56
- },
57
- children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
58
- style: emailStyles.container,
59
- children
60
- })
61
- })] });
62
- }
63
- function WelcomeEmail({ name, confirmationUrl }) {
64
- return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(EmailLayout, {
65
- title: "Welcome!",
66
- preheader: `Welcome to our service, ${name}!`,
67
- children: [
68
- /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("h1", {
69
- style: emailStyles.heading,
70
- children: [
71
- "Welcome, ",
72
- name,
73
- "!"
74
- ]
75
- }),
76
- /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: "We're excited to have you on board. Your account has been successfully created." }),
77
- confirmationUrl && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: "Please confirm your email address by clicking the button below:" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
78
- style: {
79
- textAlign: "center",
80
- margin: "30px 0"
81
- },
82
- children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
83
- href: confirmationUrl,
84
- style: emailStyles.button,
85
- children: "Confirm Email"
86
- })
87
- })] }),
88
- /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
89
- style: emailStyles.footer,
90
- children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: "If you have any questions, feel free to reply to this email." }), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", { children: [
91
- "Best regards,",
92
- /* @__PURE__ */ (0, react_jsx_runtime.jsx)("br", {}),
93
- "The Team"
94
- ] })]
95
- })
96
- ]
97
- });
98
- }
99
- function PasswordResetEmail({ name, resetUrl, expiresIn }) {
100
- return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(EmailLayout, {
101
- title: "Password Reset Request",
102
- preheader: "Reset your password",
103
- children: [
104
- /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h1", {
105
- style: emailStyles.heading,
106
- children: "Password Reset Request"
107
- }),
108
- /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", { children: [
109
- "Hi ",
110
- name,
111
- ","
112
- ] }),
113
- /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: "We received a request to reset your password. Click the button below to create a new password:" }),
114
- /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
115
- style: {
116
- textAlign: "center",
117
- margin: "30px 0"
118
- },
119
- children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
120
- href: resetUrl,
121
- style: emailStyles.button,
122
- children: "Reset Password"
123
- })
124
- }),
125
- /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", { children: [
126
- "This link will expire in ",
127
- expiresIn,
128
- ". If you didn't request a password reset, you can safely ignore this email."
129
- ] }),
130
- /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
131
- style: emailStyles.footer,
132
- children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: "For security reasons, this link can only be used once." })
133
- })
134
- ]
135
- });
136
- }
137
- function NotificationEmail({ name, title, message, actionUrl, actionText = "View Details" }) {
138
- return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(EmailLayout, {
139
- title,
140
- preheader: message,
141
- children: [
142
- /* @__PURE__ */ (0, react_jsx_runtime.jsx)("h1", {
143
- style: emailStyles.heading,
144
- children: title
145
- }),
146
- /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", { children: [
147
- "Hi ",
148
- name,
149
- ","
150
- ] }),
151
- /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: message }),
152
- actionUrl && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
153
- style: {
154
- textAlign: "center",
155
- margin: "30px 0"
156
- },
157
- children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("a", {
158
- href: actionUrl,
159
- style: emailStyles.button,
160
- children: actionText
161
- })
162
- }),
163
- /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
164
- style: emailStyles.footer,
165
- children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: "This is an automated notification from our system." })
166
- })
167
- ]
168
- });
169
- }
170
-
171
- //#endregion
172
- exports.EmailLayout = EmailLayout;
173
- exports.NotificationEmail = NotificationEmail;
174
- exports.PasswordResetEmail = PasswordResetEmail;
175
- exports.WelcomeEmail = WelcomeEmail;
176
- exports.emailStyles = emailStyles;
@@ -1,171 +0,0 @@
1
- import { Fragment, jsx, jsxs } from "react/jsx-runtime";
2
-
3
- //#region src/templates.tsx
4
- const emailStyles = {
5
- container: {
6
- fontFamily: "-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif",
7
- lineHeight: 1.6,
8
- color: "#333",
9
- maxWidth: "600px",
10
- margin: "0 auto",
11
- padding: "20px"
12
- },
13
- heading: {
14
- color: "#2c3e50",
15
- marginBottom: "20px"
16
- },
17
- button: {
18
- display: "inline-block",
19
- padding: "12px 24px",
20
- backgroundColor: "#3498db",
21
- color: "#ffffff",
22
- textDecoration: "none",
23
- borderRadius: "4px",
24
- fontWeight: "bold"
25
- },
26
- footer: {
27
- marginTop: "40px",
28
- paddingTop: "20px",
29
- borderTop: "1px solid #eee",
30
- fontSize: "14px",
31
- color: "#666"
32
- }
33
- };
34
- function EmailLayout({ children, preheader, title }) {
35
- return /* @__PURE__ */ jsxs("html", { children: [/* @__PURE__ */ jsxs("head", { children: [
36
- /* @__PURE__ */ jsx("meta", { charSet: "utf-8" }),
37
- /* @__PURE__ */ jsx("meta", {
38
- name: "viewport",
39
- content: "width=device-width, initial-scale=1.0"
40
- }),
41
- title && /* @__PURE__ */ jsx("title", { children: title }),
42
- preheader && /* @__PURE__ */ jsx("div", {
43
- style: {
44
- display: "none",
45
- maxHeight: 0,
46
- overflow: "hidden"
47
- },
48
- children: preheader
49
- })
50
- ] }), /* @__PURE__ */ jsx("body", {
51
- style: {
52
- margin: 0,
53
- padding: 0,
54
- backgroundColor: "#f4f4f4"
55
- },
56
- children: /* @__PURE__ */ jsx("div", {
57
- style: emailStyles.container,
58
- children
59
- })
60
- })] });
61
- }
62
- function WelcomeEmail({ name, confirmationUrl }) {
63
- return /* @__PURE__ */ jsxs(EmailLayout, {
64
- title: "Welcome!",
65
- preheader: `Welcome to our service, ${name}!`,
66
- children: [
67
- /* @__PURE__ */ jsxs("h1", {
68
- style: emailStyles.heading,
69
- children: [
70
- "Welcome, ",
71
- name,
72
- "!"
73
- ]
74
- }),
75
- /* @__PURE__ */ jsx("p", { children: "We're excited to have you on board. Your account has been successfully created." }),
76
- confirmationUrl && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("p", { children: "Please confirm your email address by clicking the button below:" }), /* @__PURE__ */ jsx("p", {
77
- style: {
78
- textAlign: "center",
79
- margin: "30px 0"
80
- },
81
- children: /* @__PURE__ */ jsx("a", {
82
- href: confirmationUrl,
83
- style: emailStyles.button,
84
- children: "Confirm Email"
85
- })
86
- })] }),
87
- /* @__PURE__ */ jsxs("div", {
88
- style: emailStyles.footer,
89
- children: [/* @__PURE__ */ jsx("p", { children: "If you have any questions, feel free to reply to this email." }), /* @__PURE__ */ jsxs("p", { children: [
90
- "Best regards,",
91
- /* @__PURE__ */ jsx("br", {}),
92
- "The Team"
93
- ] })]
94
- })
95
- ]
96
- });
97
- }
98
- function PasswordResetEmail({ name, resetUrl, expiresIn }) {
99
- return /* @__PURE__ */ jsxs(EmailLayout, {
100
- title: "Password Reset Request",
101
- preheader: "Reset your password",
102
- children: [
103
- /* @__PURE__ */ jsx("h1", {
104
- style: emailStyles.heading,
105
- children: "Password Reset Request"
106
- }),
107
- /* @__PURE__ */ jsxs("p", { children: [
108
- "Hi ",
109
- name,
110
- ","
111
- ] }),
112
- /* @__PURE__ */ jsx("p", { children: "We received a request to reset your password. Click the button below to create a new password:" }),
113
- /* @__PURE__ */ jsx("p", {
114
- style: {
115
- textAlign: "center",
116
- margin: "30px 0"
117
- },
118
- children: /* @__PURE__ */ jsx("a", {
119
- href: resetUrl,
120
- style: emailStyles.button,
121
- children: "Reset Password"
122
- })
123
- }),
124
- /* @__PURE__ */ jsxs("p", { children: [
125
- "This link will expire in ",
126
- expiresIn,
127
- ". If you didn't request a password reset, you can safely ignore this email."
128
- ] }),
129
- /* @__PURE__ */ jsx("div", {
130
- style: emailStyles.footer,
131
- children: /* @__PURE__ */ jsx("p", { children: "For security reasons, this link can only be used once." })
132
- })
133
- ]
134
- });
135
- }
136
- function NotificationEmail({ name, title, message, actionUrl, actionText = "View Details" }) {
137
- return /* @__PURE__ */ jsxs(EmailLayout, {
138
- title,
139
- preheader: message,
140
- children: [
141
- /* @__PURE__ */ jsx("h1", {
142
- style: emailStyles.heading,
143
- children: title
144
- }),
145
- /* @__PURE__ */ jsxs("p", { children: [
146
- "Hi ",
147
- name,
148
- ","
149
- ] }),
150
- /* @__PURE__ */ jsx("p", { children: message }),
151
- actionUrl && /* @__PURE__ */ jsx("p", {
152
- style: {
153
- textAlign: "center",
154
- margin: "30px 0"
155
- },
156
- children: /* @__PURE__ */ jsx("a", {
157
- href: actionUrl,
158
- style: emailStyles.button,
159
- children: actionText
160
- })
161
- }),
162
- /* @__PURE__ */ jsx("div", {
163
- style: emailStyles.footer,
164
- children: /* @__PURE__ */ jsx("p", { children: "This is an automated notification from our system." })
165
- })
166
- ]
167
- });
168
- }
169
-
170
- //#endregion
171
- export { EmailLayout, NotificationEmail, PasswordResetEmail, WelcomeEmail, emailStyles };
package/src/templates.tsx DELETED
@@ -1,182 +0,0 @@
1
- import type React from 'react';
2
- import type { CSSProperties, ReactElement } from 'react';
3
-
4
- // Common email styling utilities
5
- export const emailStyles = {
6
- container: {
7
- fontFamily:
8
- '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
9
- lineHeight: 1.6,
10
- color: '#333',
11
- maxWidth: '600px',
12
- margin: '0 auto',
13
- padding: '20px',
14
- } as CSSProperties,
15
-
16
- heading: {
17
- color: '#2c3e50',
18
- marginBottom: '20px',
19
- } as CSSProperties,
20
-
21
- button: {
22
- display: 'inline-block',
23
- padding: '12px 24px',
24
- backgroundColor: '#3498db',
25
- color: '#ffffff',
26
- textDecoration: 'none',
27
- borderRadius: '4px',
28
- fontWeight: 'bold',
29
- } as CSSProperties,
30
-
31
- footer: {
32
- marginTop: '40px',
33
- paddingTop: '20px',
34
- borderTop: '1px solid #eee',
35
- fontSize: '14px',
36
- color: '#666',
37
- } as CSSProperties,
38
- };
39
-
40
- // Base layout component for emails
41
- export interface EmailLayoutProps {
42
- children: React.ReactNode;
43
- preheader?: string;
44
- title?: string;
45
- }
46
-
47
- export function EmailLayout({
48
- children,
49
- preheader,
50
- title,
51
- }: EmailLayoutProps): ReactElement {
52
- return (
53
- <html>
54
- <head>
55
- <meta charSet="utf-8" />
56
- <meta name="viewport" content="width=device-width, initial-scale=1.0" />
57
- {title && <title>{title}</title>}
58
- {preheader && (
59
- <div style={{ display: 'none', maxHeight: 0, overflow: 'hidden' }}>
60
- {preheader}
61
- </div>
62
- )}
63
- </head>
64
- <body style={{ margin: 0, padding: 0, backgroundColor: '#f4f4f4' }}>
65
- <div style={emailStyles.container}>{children}</div>
66
- </body>
67
- </html>
68
- );
69
- }
70
-
71
- // Example welcome email template
72
- export interface WelcomeEmailProps {
73
- name: string;
74
- confirmationUrl?: string;
75
- }
76
-
77
- export function WelcomeEmail({
78
- name,
79
- confirmationUrl,
80
- }: WelcomeEmailProps): ReactElement {
81
- return (
82
- <EmailLayout
83
- title="Welcome!"
84
- preheader={`Welcome to our service, ${name}!`}
85
- >
86
- <h1 style={emailStyles.heading}>Welcome, {name}!</h1>
87
- <p>
88
- We're excited to have you on board. Your account has been successfully
89
- created.
90
- </p>
91
- {confirmationUrl && (
92
- <>
93
- <p>Please confirm your email address by clicking the button below:</p>
94
- <p style={{ textAlign: 'center', margin: '30px 0' }}>
95
- <a href={confirmationUrl} style={emailStyles.button}>
96
- Confirm Email
97
- </a>
98
- </p>
99
- </>
100
- )}
101
- <div style={emailStyles.footer}>
102
- <p>If you have any questions, feel free to reply to this email.</p>
103
- <p>
104
- Best regards,
105
- <br />
106
- The Team
107
- </p>
108
- </div>
109
- </EmailLayout>
110
- );
111
- }
112
-
113
- // Example password reset template
114
- export interface PasswordResetEmailProps {
115
- name: string;
116
- resetUrl: string;
117
- expiresIn: string;
118
- }
119
-
120
- export function PasswordResetEmail({
121
- name,
122
- resetUrl,
123
- expiresIn,
124
- }: PasswordResetEmailProps): ReactElement {
125
- return (
126
- <EmailLayout title="Password Reset Request" preheader="Reset your password">
127
- <h1 style={emailStyles.heading}>Password Reset Request</h1>
128
- <p>Hi {name},</p>
129
- <p>
130
- We received a request to reset your password. Click the button below to
131
- create a new password:
132
- </p>
133
- <p style={{ textAlign: 'center', margin: '30px 0' }}>
134
- <a href={resetUrl} style={emailStyles.button}>
135
- Reset Password
136
- </a>
137
- </p>
138
- <p>
139
- This link will expire in {expiresIn}. If you didn't request a password
140
- reset, you can safely ignore this email.
141
- </p>
142
- <div style={emailStyles.footer}>
143
- <p>For security reasons, this link can only be used once.</p>
144
- </div>
145
- </EmailLayout>
146
- );
147
- }
148
-
149
- // Example notification template
150
- export interface NotificationEmailProps {
151
- name: string;
152
- title: string;
153
- message: string;
154
- actionUrl?: string;
155
- actionText?: string;
156
- }
157
-
158
- export function NotificationEmail({
159
- name,
160
- title,
161
- message,
162
- actionUrl,
163
- actionText = 'View Details',
164
- }: NotificationEmailProps): ReactElement {
165
- return (
166
- <EmailLayout title={title} preheader={message}>
167
- <h1 style={emailStyles.heading}>{title}</h1>
168
- <p>Hi {name},</p>
169
- <p>{message}</p>
170
- {actionUrl && (
171
- <p style={{ textAlign: 'center', margin: '30px 0' }}>
172
- <a href={actionUrl} style={emailStyles.button}>
173
- {actionText}
174
- </a>
175
- </p>
176
- )}
177
- <div style={emailStyles.footer}>
178
- <p>This is an automated notification from our system.</p>
179
- </div>
180
- </EmailLayout>
181
- );
182
- }