@usewaypoint/email-builder 0.0.4 → 0.0.6

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.
Files changed (42) hide show
  1. package/dist/{Reader/core.d.ts → index.d.mts} +39 -9
  2. package/dist/index.d.ts +1864 -3
  3. package/dist/index.js +307 -7
  4. package/dist/index.mjs +273 -0
  5. package/package.json +22 -14
  6. package/dist/Reader/core.d.ts.map +0 -1
  7. package/dist/Reader/core.js +0 -80
  8. package/dist/Reader/core.js.map +0 -1
  9. package/dist/blocks/ColumnsContainer/ColumnsContainerPropsSchema.d.ts +0 -136
  10. package/dist/blocks/ColumnsContainer/ColumnsContainerPropsSchema.d.ts.map +0 -1
  11. package/dist/blocks/ColumnsContainer/ColumnsContainerPropsSchema.js +0 -16
  12. package/dist/blocks/ColumnsContainer/ColumnsContainerPropsSchema.js.map +0 -1
  13. package/dist/blocks/ColumnsContainer/ColumnsContainerReader.d.ts +0 -4
  14. package/dist/blocks/ColumnsContainer/ColumnsContainerReader.d.ts.map +0 -1
  15. package/dist/blocks/ColumnsContainer/ColumnsContainerReader.js +0 -23
  16. package/dist/blocks/ColumnsContainer/ColumnsContainerReader.js.map +0 -1
  17. package/dist/blocks/Container/ContainerPropsSchema.d.ts +0 -83
  18. package/dist/blocks/Container/ContainerPropsSchema.d.ts.map +0 -1
  19. package/dist/blocks/Container/ContainerPropsSchema.js +0 -12
  20. package/dist/blocks/Container/ContainerPropsSchema.js.map +0 -1
  21. package/dist/blocks/Container/ContainerReader.d.ts +0 -4
  22. package/dist/blocks/Container/ContainerReader.d.ts.map +0 -1
  23. package/dist/blocks/Container/ContainerReader.js +0 -9
  24. package/dist/blocks/Container/ContainerReader.js.map +0 -1
  25. package/dist/blocks/EmailLayout/EmailLayoutPropsSchema.d.ts +0 -22
  26. package/dist/blocks/EmailLayout/EmailLayoutPropsSchema.d.ts.map +0 -1
  27. package/dist/blocks/EmailLayout/EmailLayoutPropsSchema.js +0 -28
  28. package/dist/blocks/EmailLayout/EmailLayoutPropsSchema.js.map +0 -1
  29. package/dist/blocks/EmailLayout/EmailLayoutReader.d.ts +0 -4
  30. package/dist/blocks/EmailLayout/EmailLayoutReader.d.ts.map +0 -1
  31. package/dist/blocks/EmailLayout/EmailLayoutReader.js +0 -51
  32. package/dist/blocks/EmailLayout/EmailLayoutReader.js.map +0 -1
  33. package/dist/index.d.ts.map +0 -1
  34. package/dist/index.js.map +0 -1
  35. package/dist/renderers/renderToStaticMarkup.d.ts +0 -7
  36. package/dist/renderers/renderToStaticMarkup.d.ts.map +0 -1
  37. package/dist/renderers/renderToStaticMarkup.js +0 -10
  38. package/dist/renderers/renderToStaticMarkup.js.map +0 -1
  39. package/dist/renderers/renderToStaticMarkup.spec.d.ts +0 -5
  40. package/dist/renderers/renderToStaticMarkup.spec.d.ts.map +0 -1
  41. package/dist/renderers/renderToStaticMarkup.spec.js +0 -20
  42. package/dist/renderers/renderToStaticMarkup.spec.js.map +0 -1
package/dist/index.js CHANGED
@@ -1,7 +1,307 @@
1
- export { default as renderToStaticMarkup } from './renderers/renderToStaticMarkup';
2
- export { ReaderBlockSchema,
3
- //
4
- ReaderDocumentSchema,
5
- //
6
- ReaderBlock, default as Reader, } from './Reader/core';
7
- //# sourceMappingURL=index.js.map
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __defProps = Object.defineProperties;
5
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
6
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
7
+ var __getOwnPropNames = Object.getOwnPropertyNames;
8
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
9
+ var __getProtoOf = Object.getPrototypeOf;
10
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
11
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
12
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
13
+ var __spreadValues = (a, b) => {
14
+ for (var prop in b || (b = {}))
15
+ if (__hasOwnProp.call(b, prop))
16
+ __defNormalProp(a, prop, b[prop]);
17
+ if (__getOwnPropSymbols)
18
+ for (var prop of __getOwnPropSymbols(b)) {
19
+ if (__propIsEnum.call(b, prop))
20
+ __defNormalProp(a, prop, b[prop]);
21
+ }
22
+ return a;
23
+ };
24
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
25
+ var __objRest = (source, exclude) => {
26
+ var target = {};
27
+ for (var prop in source)
28
+ if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
29
+ target[prop] = source[prop];
30
+ if (source != null && __getOwnPropSymbols)
31
+ for (var prop of __getOwnPropSymbols(source)) {
32
+ if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
33
+ target[prop] = source[prop];
34
+ }
35
+ return target;
36
+ };
37
+ var __export = (target, all) => {
38
+ for (var name in all)
39
+ __defProp(target, name, { get: all[name], enumerable: true });
40
+ };
41
+ var __copyProps = (to, from, except, desc) => {
42
+ if (from && typeof from === "object" || typeof from === "function") {
43
+ for (let key of __getOwnPropNames(from))
44
+ if (!__hasOwnProp.call(to, key) && key !== except)
45
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
46
+ }
47
+ return to;
48
+ };
49
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
50
+ // If the importer is in node compatibility mode or this is not an ESM
51
+ // file that has been converted to a CommonJS file using a Babel-
52
+ // compatible transform (i.e. "__esModule" has not been set), then set
53
+ // "default" to the CommonJS "module.exports" for node compatibility.
54
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
55
+ mod
56
+ ));
57
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
58
+
59
+ // src/index.ts
60
+ var src_exports = {};
61
+ __export(src_exports, {
62
+ Reader: () => Reader,
63
+ ReaderBlock: () => ReaderBlock,
64
+ ReaderBlockSchema: () => ReaderBlockSchema,
65
+ ReaderDocumentSchema: () => ReaderDocumentSchema,
66
+ renderToStaticMarkup: () => renderToStaticMarkup
67
+ });
68
+ module.exports = __toCommonJS(src_exports);
69
+
70
+ // src/renderers/renderToStaticMarkup.tsx
71
+ var import_react5 = __toESM(require("react"));
72
+ var import_server = require("react-dom/server");
73
+
74
+ // src/Reader/core.tsx
75
+ var import_react4 = __toESM(require("react"));
76
+ var import_zod4 = require("zod");
77
+ var import_block_avatar = require("@usewaypoint/block-avatar");
78
+ var import_block_button = require("@usewaypoint/block-button");
79
+ var import_block_divider = require("@usewaypoint/block-divider");
80
+ var import_block_heading = require("@usewaypoint/block-heading");
81
+ var import_block_html = require("@usewaypoint/block-html");
82
+ var import_block_image = require("@usewaypoint/block-image");
83
+ var import_block_spacer = require("@usewaypoint/block-spacer");
84
+ var import_block_text = require("@usewaypoint/block-text");
85
+ var import_document_core = require("@usewaypoint/document-core");
86
+
87
+ // src/blocks/ColumnsContainer/ColumnsContainerPropsSchema.ts
88
+ var import_zod = require("zod");
89
+ var import_block_columns_container = require("@usewaypoint/block-columns-container");
90
+ var BasePropsShape = import_block_columns_container.ColumnsContainerPropsSchema.shape.props.unwrap().unwrap().shape;
91
+ var ColumnsContainerPropsSchema = import_zod.z.object({
92
+ style: import_block_columns_container.ColumnsContainerPropsSchema.shape.style,
93
+ props: import_zod.z.object(__spreadProps(__spreadValues({}, BasePropsShape), {
94
+ columns: import_zod.z.tuple([
95
+ import_zod.z.object({ childrenIds: import_zod.z.array(import_zod.z.string()) }),
96
+ import_zod.z.object({ childrenIds: import_zod.z.array(import_zod.z.string()) }),
97
+ import_zod.z.object({ childrenIds: import_zod.z.array(import_zod.z.string()) })
98
+ ])
99
+ })).optional().nullable()
100
+ });
101
+ var ColumnsContainerPropsSchema_default = ColumnsContainerPropsSchema;
102
+
103
+ // src/blocks/ColumnsContainer/ColumnsContainerReader.tsx
104
+ var import_react = __toESM(require("react"));
105
+ var import_block_columns_container2 = require("@usewaypoint/block-columns-container");
106
+ function ColumnsContainerReader({ style, props }) {
107
+ const _a = props != null ? props : {}, { columns } = _a, restProps = __objRest(_a, ["columns"]);
108
+ let cols = void 0;
109
+ if (columns) {
110
+ cols = columns.map((col) => col.childrenIds.map((childId) => /* @__PURE__ */ import_react.default.createElement(ReaderBlock, { key: childId, id: childId })));
111
+ }
112
+ return /* @__PURE__ */ import_react.default.createElement(import_block_columns_container2.ColumnsContainer, { props: restProps, columns: cols, style });
113
+ }
114
+
115
+ // src/blocks/Container/ContainerPropsSchema.tsx
116
+ var import_zod2 = require("zod");
117
+ var import_block_container = require("@usewaypoint/block-container");
118
+ var ContainerPropsSchema = import_zod2.z.object({
119
+ style: import_block_container.ContainerPropsSchema.shape.style,
120
+ props: import_zod2.z.object({
121
+ childrenIds: import_zod2.z.array(import_zod2.z.string()).optional().nullable()
122
+ }).optional().nullable()
123
+ });
124
+
125
+ // src/blocks/Container/ContainerReader.tsx
126
+ var import_react2 = __toESM(require("react"));
127
+ var import_block_container2 = require("@usewaypoint/block-container");
128
+ function ContainerReader({ style, props }) {
129
+ var _a;
130
+ const childrenIds = (_a = props == null ? void 0 : props.childrenIds) != null ? _a : [];
131
+ return /* @__PURE__ */ import_react2.default.createElement(import_block_container2.Container, { style }, childrenIds.map((childId) => /* @__PURE__ */ import_react2.default.createElement(ReaderBlock, { key: childId, id: childId })));
132
+ }
133
+
134
+ // src/blocks/EmailLayout/EmailLayoutPropsSchema.tsx
135
+ var import_zod3 = require("zod");
136
+ var COLOR_SCHEMA = import_zod3.z.string().regex(/^#[0-9a-fA-F]{6}$/).nullable().optional();
137
+ var FONT_FAMILY_SCHEMA = import_zod3.z.enum([
138
+ "MODERN_SANS",
139
+ "BOOK_SANS",
140
+ "ORGANIC_SANS",
141
+ "GEOMETRIC_SANS",
142
+ "HEAVY_SANS",
143
+ "ROUNDED_SANS",
144
+ "MODERN_SERIF",
145
+ "BOOK_SERIF",
146
+ "MONOSPACE"
147
+ ]).nullable().optional();
148
+ var EmailLayoutPropsSchema = import_zod3.z.object({
149
+ backdropColor: COLOR_SCHEMA,
150
+ borderColor: COLOR_SCHEMA,
151
+ borderRadius: import_zod3.z.number().optional().nullable(),
152
+ canvasColor: COLOR_SCHEMA,
153
+ textColor: COLOR_SCHEMA,
154
+ fontFamily: FONT_FAMILY_SCHEMA,
155
+ childrenIds: import_zod3.z.array(import_zod3.z.string()).optional().nullable()
156
+ });
157
+
158
+ // src/blocks/EmailLayout/EmailLayoutReader.tsx
159
+ var import_react3 = __toESM(require("react"));
160
+ function getFontFamily(fontFamily) {
161
+ const f = fontFamily != null ? fontFamily : "MODERN_SANS";
162
+ switch (f) {
163
+ case "MODERN_SANS":
164
+ return '"Helvetica Neue", "Arial Nova", "Nimbus Sans", Arial, sans-serif';
165
+ case "BOOK_SANS":
166
+ return 'Optima, Candara, "Noto Sans", source-sans-pro, sans-serif';
167
+ case "ORGANIC_SANS":
168
+ return 'Seravek, "Gill Sans Nova", Ubuntu, Calibri, "DejaVu Sans", source-sans-pro, sans-serif';
169
+ case "GEOMETRIC_SANS":
170
+ return 'Avenir, "Avenir Next LT Pro", Montserrat, Corbel, "URW Gothic", source-sans-pro, sans-serif';
171
+ case "HEAVY_SANS":
172
+ return 'Bahnschrift, "DIN Alternate", "Franklin Gothic Medium", "Nimbus Sans Narrow", sans-serif-condensed, sans-serif';
173
+ case "ROUNDED_SANS":
174
+ return 'ui-rounded, "Hiragino Maru Gothic ProN", Quicksand, Comfortaa, Manjari, "Arial Rounded MT Bold", Calibri, source-sans-pro, sans-serif';
175
+ case "MODERN_SERIF":
176
+ return 'Charter, "Bitstream Charter", "Sitka Text", Cambria, serif';
177
+ case "BOOK_SERIF":
178
+ return '"Iowan Old Style", "Palatino Linotype", "URW Palladio L", P052, serif';
179
+ case "MONOSPACE":
180
+ return '"Nimbus Mono PS", "Courier New", "Cutive Mono", monospace';
181
+ }
182
+ }
183
+ function getBorder({ borderColor }) {
184
+ if (!borderColor) {
185
+ return void 0;
186
+ }
187
+ return `1px solid ${borderColor}`;
188
+ }
189
+ function EmailLayoutReader(props) {
190
+ var _a, _b, _c, _d, _e;
191
+ const childrenIds = (_a = props.childrenIds) != null ? _a : [];
192
+ return /* @__PURE__ */ import_react3.default.createElement(
193
+ "div",
194
+ {
195
+ style: {
196
+ backgroundColor: (_b = props.backdropColor) != null ? _b : "#F5F5F5",
197
+ color: (_c = props.textColor) != null ? _c : "#262626",
198
+ fontFamily: getFontFamily(props.fontFamily),
199
+ fontSize: "16px",
200
+ fontWeight: "400",
201
+ letterSpacing: "0.15008px",
202
+ lineHeight: "1.5",
203
+ margin: "0",
204
+ padding: "32px 0",
205
+ minHeight: "100%",
206
+ width: "100%"
207
+ }
208
+ },
209
+ /* @__PURE__ */ import_react3.default.createElement(
210
+ "table",
211
+ {
212
+ align: "center",
213
+ width: "100%",
214
+ style: {
215
+ margin: "0 auto",
216
+ maxWidth: "600px",
217
+ backgroundColor: (_d = props.canvasColor) != null ? _d : "#FFFFFF",
218
+ borderRadius: (_e = props.borderRadius) != null ? _e : void 0,
219
+ border: getBorder(props)
220
+ },
221
+ role: "presentation",
222
+ cellSpacing: "0",
223
+ cellPadding: "0",
224
+ border: 0
225
+ },
226
+ /* @__PURE__ */ import_react3.default.createElement("tbody", null, /* @__PURE__ */ import_react3.default.createElement("tr", { style: { width: "100%" } }, /* @__PURE__ */ import_react3.default.createElement("td", null, childrenIds.map((childId) => /* @__PURE__ */ import_react3.default.createElement(ReaderBlock, { key: childId, id: childId })))))
227
+ )
228
+ );
229
+ }
230
+
231
+ // src/Reader/core.tsx
232
+ var ReaderContext = (0, import_react4.createContext)({});
233
+ function useReaderDocument() {
234
+ return (0, import_react4.useContext)(ReaderContext);
235
+ }
236
+ var READER_DICTIONARY = (0, import_document_core.buildBlockConfigurationDictionary)({
237
+ ColumnsContainer: {
238
+ schema: ColumnsContainerPropsSchema_default,
239
+ Component: ColumnsContainerReader
240
+ },
241
+ Container: {
242
+ schema: ContainerPropsSchema,
243
+ Component: ContainerReader
244
+ },
245
+ EmailLayout: {
246
+ schema: EmailLayoutPropsSchema,
247
+ Component: EmailLayoutReader
248
+ },
249
+ //
250
+ Avatar: {
251
+ schema: import_block_avatar.AvatarPropsSchema,
252
+ Component: import_block_avatar.Avatar
253
+ },
254
+ Button: {
255
+ schema: import_block_button.ButtonPropsSchema,
256
+ Component: import_block_button.Button
257
+ },
258
+ Divider: {
259
+ schema: import_block_divider.DividerPropsSchema,
260
+ Component: import_block_divider.Divider
261
+ },
262
+ Heading: {
263
+ schema: import_block_heading.HeadingPropsSchema,
264
+ Component: import_block_heading.Heading
265
+ },
266
+ Html: {
267
+ schema: import_block_html.HtmlPropsSchema,
268
+ Component: import_block_html.Html
269
+ },
270
+ Image: {
271
+ schema: import_block_image.ImagePropsSchema,
272
+ Component: import_block_image.Image
273
+ },
274
+ Spacer: {
275
+ schema: import_block_spacer.SpacerPropsSchema,
276
+ Component: import_block_spacer.Spacer
277
+ },
278
+ Text: {
279
+ schema: import_block_text.TextPropsSchema,
280
+ Component: import_block_text.Text
281
+ }
282
+ });
283
+ var ReaderBlockSchema = (0, import_document_core.buildBlockConfigurationSchema)(READER_DICTIONARY);
284
+ var ReaderDocumentSchema = import_zod4.z.record(import_zod4.z.string(), ReaderBlockSchema);
285
+ var BaseReaderBlock = (0, import_document_core.buildBlockComponent)(READER_DICTIONARY);
286
+ function ReaderBlock({ id }) {
287
+ const document = useReaderDocument();
288
+ return /* @__PURE__ */ import_react4.default.createElement(BaseReaderBlock, __spreadValues({}, document[id]));
289
+ }
290
+ function Reader({ document, rootBlockId }) {
291
+ return /* @__PURE__ */ import_react4.default.createElement(ReaderContext.Provider, { value: document }, /* @__PURE__ */ import_react4.default.createElement(ReaderBlock, { id: rootBlockId }));
292
+ }
293
+
294
+ // src/renderers/renderToStaticMarkup.tsx
295
+ function renderToStaticMarkup(document, { rootBlockId }) {
296
+ return "<!DOCTYPE html>" + (0, import_server.renderToStaticMarkup)(
297
+ /* @__PURE__ */ import_react5.default.createElement("html", null, /* @__PURE__ */ import_react5.default.createElement("body", null, /* @__PURE__ */ import_react5.default.createElement(Reader, { document, rootBlockId })))
298
+ );
299
+ }
300
+ // Annotate the CommonJS export names for ESM import in node:
301
+ 0 && (module.exports = {
302
+ Reader,
303
+ ReaderBlock,
304
+ ReaderBlockSchema,
305
+ ReaderDocumentSchema,
306
+ renderToStaticMarkup
307
+ });
package/dist/index.mjs ADDED
@@ -0,0 +1,273 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __defProps = Object.defineProperties;
3
+ var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
4
+ var __getOwnPropSymbols = Object.getOwnPropertySymbols;
5
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
6
+ var __propIsEnum = Object.prototype.propertyIsEnumerable;
7
+ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
8
+ var __spreadValues = (a, b) => {
9
+ for (var prop in b || (b = {}))
10
+ if (__hasOwnProp.call(b, prop))
11
+ __defNormalProp(a, prop, b[prop]);
12
+ if (__getOwnPropSymbols)
13
+ for (var prop of __getOwnPropSymbols(b)) {
14
+ if (__propIsEnum.call(b, prop))
15
+ __defNormalProp(a, prop, b[prop]);
16
+ }
17
+ return a;
18
+ };
19
+ var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
20
+ var __objRest = (source, exclude) => {
21
+ var target = {};
22
+ for (var prop in source)
23
+ if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
24
+ target[prop] = source[prop];
25
+ if (source != null && __getOwnPropSymbols)
26
+ for (var prop of __getOwnPropSymbols(source)) {
27
+ if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
28
+ target[prop] = source[prop];
29
+ }
30
+ return target;
31
+ };
32
+
33
+ // src/renderers/renderToStaticMarkup.tsx
34
+ import React5 from "react";
35
+ import { renderToStaticMarkup as baseRenderToStaticMarkup } from "react-dom/server";
36
+
37
+ // src/Reader/core.tsx
38
+ import React4, { createContext, useContext } from "react";
39
+ import { z as z4 } from "zod";
40
+ import { Avatar, AvatarPropsSchema } from "@usewaypoint/block-avatar";
41
+ import { Button, ButtonPropsSchema } from "@usewaypoint/block-button";
42
+ import { Divider, DividerPropsSchema } from "@usewaypoint/block-divider";
43
+ import { Heading, HeadingPropsSchema } from "@usewaypoint/block-heading";
44
+ import { Html, HtmlPropsSchema } from "@usewaypoint/block-html";
45
+ import { Image, ImagePropsSchema } from "@usewaypoint/block-image";
46
+ import { Spacer, SpacerPropsSchema } from "@usewaypoint/block-spacer";
47
+ import { Text, TextPropsSchema } from "@usewaypoint/block-text";
48
+ import {
49
+ buildBlockComponent,
50
+ buildBlockConfigurationDictionary,
51
+ buildBlockConfigurationSchema
52
+ } from "@usewaypoint/document-core";
53
+
54
+ // src/blocks/ColumnsContainer/ColumnsContainerPropsSchema.ts
55
+ import { z } from "zod";
56
+ import { ColumnsContainerPropsSchema as BaseColumnsContainerPropsSchema } from "@usewaypoint/block-columns-container";
57
+ var BasePropsShape = BaseColumnsContainerPropsSchema.shape.props.unwrap().unwrap().shape;
58
+ var ColumnsContainerPropsSchema = z.object({
59
+ style: BaseColumnsContainerPropsSchema.shape.style,
60
+ props: z.object(__spreadProps(__spreadValues({}, BasePropsShape), {
61
+ columns: z.tuple([
62
+ z.object({ childrenIds: z.array(z.string()) }),
63
+ z.object({ childrenIds: z.array(z.string()) }),
64
+ z.object({ childrenIds: z.array(z.string()) })
65
+ ])
66
+ })).optional().nullable()
67
+ });
68
+ var ColumnsContainerPropsSchema_default = ColumnsContainerPropsSchema;
69
+
70
+ // src/blocks/ColumnsContainer/ColumnsContainerReader.tsx
71
+ import React from "react";
72
+ import { ColumnsContainer as BaseColumnsContainer } from "@usewaypoint/block-columns-container";
73
+ function ColumnsContainerReader({ style, props }) {
74
+ const _a = props != null ? props : {}, { columns } = _a, restProps = __objRest(_a, ["columns"]);
75
+ let cols = void 0;
76
+ if (columns) {
77
+ cols = columns.map((col) => col.childrenIds.map((childId) => /* @__PURE__ */ React.createElement(ReaderBlock, { key: childId, id: childId })));
78
+ }
79
+ return /* @__PURE__ */ React.createElement(BaseColumnsContainer, { props: restProps, columns: cols, style });
80
+ }
81
+
82
+ // src/blocks/Container/ContainerPropsSchema.tsx
83
+ import { z as z2 } from "zod";
84
+ import { ContainerPropsSchema as BaseContainerPropsSchema } from "@usewaypoint/block-container";
85
+ var ContainerPropsSchema = z2.object({
86
+ style: BaseContainerPropsSchema.shape.style,
87
+ props: z2.object({
88
+ childrenIds: z2.array(z2.string()).optional().nullable()
89
+ }).optional().nullable()
90
+ });
91
+
92
+ // src/blocks/Container/ContainerReader.tsx
93
+ import React2 from "react";
94
+ import { Container as BaseContainer } from "@usewaypoint/block-container";
95
+ function ContainerReader({ style, props }) {
96
+ var _a;
97
+ const childrenIds = (_a = props == null ? void 0 : props.childrenIds) != null ? _a : [];
98
+ return /* @__PURE__ */ React2.createElement(BaseContainer, { style }, childrenIds.map((childId) => /* @__PURE__ */ React2.createElement(ReaderBlock, { key: childId, id: childId })));
99
+ }
100
+
101
+ // src/blocks/EmailLayout/EmailLayoutPropsSchema.tsx
102
+ import { z as z3 } from "zod";
103
+ var COLOR_SCHEMA = z3.string().regex(/^#[0-9a-fA-F]{6}$/).nullable().optional();
104
+ var FONT_FAMILY_SCHEMA = z3.enum([
105
+ "MODERN_SANS",
106
+ "BOOK_SANS",
107
+ "ORGANIC_SANS",
108
+ "GEOMETRIC_SANS",
109
+ "HEAVY_SANS",
110
+ "ROUNDED_SANS",
111
+ "MODERN_SERIF",
112
+ "BOOK_SERIF",
113
+ "MONOSPACE"
114
+ ]).nullable().optional();
115
+ var EmailLayoutPropsSchema = z3.object({
116
+ backdropColor: COLOR_SCHEMA,
117
+ borderColor: COLOR_SCHEMA,
118
+ borderRadius: z3.number().optional().nullable(),
119
+ canvasColor: COLOR_SCHEMA,
120
+ textColor: COLOR_SCHEMA,
121
+ fontFamily: FONT_FAMILY_SCHEMA,
122
+ childrenIds: z3.array(z3.string()).optional().nullable()
123
+ });
124
+
125
+ // src/blocks/EmailLayout/EmailLayoutReader.tsx
126
+ import React3 from "react";
127
+ function getFontFamily(fontFamily) {
128
+ const f = fontFamily != null ? fontFamily : "MODERN_SANS";
129
+ switch (f) {
130
+ case "MODERN_SANS":
131
+ return '"Helvetica Neue", "Arial Nova", "Nimbus Sans", Arial, sans-serif';
132
+ case "BOOK_SANS":
133
+ return 'Optima, Candara, "Noto Sans", source-sans-pro, sans-serif';
134
+ case "ORGANIC_SANS":
135
+ return 'Seravek, "Gill Sans Nova", Ubuntu, Calibri, "DejaVu Sans", source-sans-pro, sans-serif';
136
+ case "GEOMETRIC_SANS":
137
+ return 'Avenir, "Avenir Next LT Pro", Montserrat, Corbel, "URW Gothic", source-sans-pro, sans-serif';
138
+ case "HEAVY_SANS":
139
+ return 'Bahnschrift, "DIN Alternate", "Franklin Gothic Medium", "Nimbus Sans Narrow", sans-serif-condensed, sans-serif';
140
+ case "ROUNDED_SANS":
141
+ return 'ui-rounded, "Hiragino Maru Gothic ProN", Quicksand, Comfortaa, Manjari, "Arial Rounded MT Bold", Calibri, source-sans-pro, sans-serif';
142
+ case "MODERN_SERIF":
143
+ return 'Charter, "Bitstream Charter", "Sitka Text", Cambria, serif';
144
+ case "BOOK_SERIF":
145
+ return '"Iowan Old Style", "Palatino Linotype", "URW Palladio L", P052, serif';
146
+ case "MONOSPACE":
147
+ return '"Nimbus Mono PS", "Courier New", "Cutive Mono", monospace';
148
+ }
149
+ }
150
+ function getBorder({ borderColor }) {
151
+ if (!borderColor) {
152
+ return void 0;
153
+ }
154
+ return `1px solid ${borderColor}`;
155
+ }
156
+ function EmailLayoutReader(props) {
157
+ var _a, _b, _c, _d, _e;
158
+ const childrenIds = (_a = props.childrenIds) != null ? _a : [];
159
+ return /* @__PURE__ */ React3.createElement(
160
+ "div",
161
+ {
162
+ style: {
163
+ backgroundColor: (_b = props.backdropColor) != null ? _b : "#F5F5F5",
164
+ color: (_c = props.textColor) != null ? _c : "#262626",
165
+ fontFamily: getFontFamily(props.fontFamily),
166
+ fontSize: "16px",
167
+ fontWeight: "400",
168
+ letterSpacing: "0.15008px",
169
+ lineHeight: "1.5",
170
+ margin: "0",
171
+ padding: "32px 0",
172
+ minHeight: "100%",
173
+ width: "100%"
174
+ }
175
+ },
176
+ /* @__PURE__ */ React3.createElement(
177
+ "table",
178
+ {
179
+ align: "center",
180
+ width: "100%",
181
+ style: {
182
+ margin: "0 auto",
183
+ maxWidth: "600px",
184
+ backgroundColor: (_d = props.canvasColor) != null ? _d : "#FFFFFF",
185
+ borderRadius: (_e = props.borderRadius) != null ? _e : void 0,
186
+ border: getBorder(props)
187
+ },
188
+ role: "presentation",
189
+ cellSpacing: "0",
190
+ cellPadding: "0",
191
+ border: 0
192
+ },
193
+ /* @__PURE__ */ React3.createElement("tbody", null, /* @__PURE__ */ React3.createElement("tr", { style: { width: "100%" } }, /* @__PURE__ */ React3.createElement("td", null, childrenIds.map((childId) => /* @__PURE__ */ React3.createElement(ReaderBlock, { key: childId, id: childId })))))
194
+ )
195
+ );
196
+ }
197
+
198
+ // src/Reader/core.tsx
199
+ var ReaderContext = createContext({});
200
+ function useReaderDocument() {
201
+ return useContext(ReaderContext);
202
+ }
203
+ var READER_DICTIONARY = buildBlockConfigurationDictionary({
204
+ ColumnsContainer: {
205
+ schema: ColumnsContainerPropsSchema_default,
206
+ Component: ColumnsContainerReader
207
+ },
208
+ Container: {
209
+ schema: ContainerPropsSchema,
210
+ Component: ContainerReader
211
+ },
212
+ EmailLayout: {
213
+ schema: EmailLayoutPropsSchema,
214
+ Component: EmailLayoutReader
215
+ },
216
+ //
217
+ Avatar: {
218
+ schema: AvatarPropsSchema,
219
+ Component: Avatar
220
+ },
221
+ Button: {
222
+ schema: ButtonPropsSchema,
223
+ Component: Button
224
+ },
225
+ Divider: {
226
+ schema: DividerPropsSchema,
227
+ Component: Divider
228
+ },
229
+ Heading: {
230
+ schema: HeadingPropsSchema,
231
+ Component: Heading
232
+ },
233
+ Html: {
234
+ schema: HtmlPropsSchema,
235
+ Component: Html
236
+ },
237
+ Image: {
238
+ schema: ImagePropsSchema,
239
+ Component: Image
240
+ },
241
+ Spacer: {
242
+ schema: SpacerPropsSchema,
243
+ Component: Spacer
244
+ },
245
+ Text: {
246
+ schema: TextPropsSchema,
247
+ Component: Text
248
+ }
249
+ });
250
+ var ReaderBlockSchema = buildBlockConfigurationSchema(READER_DICTIONARY);
251
+ var ReaderDocumentSchema = z4.record(z4.string(), ReaderBlockSchema);
252
+ var BaseReaderBlock = buildBlockComponent(READER_DICTIONARY);
253
+ function ReaderBlock({ id }) {
254
+ const document = useReaderDocument();
255
+ return /* @__PURE__ */ React4.createElement(BaseReaderBlock, __spreadValues({}, document[id]));
256
+ }
257
+ function Reader({ document, rootBlockId }) {
258
+ return /* @__PURE__ */ React4.createElement(ReaderContext.Provider, { value: document }, /* @__PURE__ */ React4.createElement(ReaderBlock, { id: rootBlockId }));
259
+ }
260
+
261
+ // src/renderers/renderToStaticMarkup.tsx
262
+ function renderToStaticMarkup(document, { rootBlockId }) {
263
+ return "<!DOCTYPE html>" + baseRenderToStaticMarkup(
264
+ /* @__PURE__ */ React5.createElement("html", null, /* @__PURE__ */ React5.createElement("body", null, /* @__PURE__ */ React5.createElement(Reader, { document, rootBlockId })))
265
+ );
266
+ }
267
+ export {
268
+ Reader,
269
+ ReaderBlock,
270
+ ReaderBlockSchema,
271
+ ReaderDocumentSchema,
272
+ renderToStaticMarkup
273
+ };
package/package.json CHANGED
@@ -1,9 +1,17 @@
1
1
  {
2
2
  "name": "@usewaypoint/email-builder",
3
- "version": "0.0.4",
3
+ "version": "0.0.6",
4
4
  "description": "React component to render email messages",
5
- "main": "dist/index.js",
6
- "types": "dist/index.d.ts",
5
+ "main": "./dist/index.js",
6
+ "module": "./dist/index.mjs",
7
+ "types": "./dist/index.d.ts",
8
+ "exports": {
9
+ ".": {
10
+ "require": "./dist/index.js",
11
+ "import": "./dist/index.mjs",
12
+ "types": "./dist/index.d.ts"
13
+ }
14
+ },
7
15
  "files": [
8
16
  "dist"
9
17
  ],
@@ -18,16 +26,16 @@
18
26
  "zod": "^1 || ^2 || ^3"
19
27
  },
20
28
  "dependencies": {
21
- "@usewaypoint/block-avatar": "^0.0.1",
22
- "@usewaypoint/block-button": "^0.0.2",
23
- "@usewaypoint/block-columns-container": "^0.0.2",
24
- "@usewaypoint/block-container": "^0.0.1",
25
- "@usewaypoint/block-divider": "^0.0.3",
26
- "@usewaypoint/block-heading": "^0.0.2",
27
- "@usewaypoint/block-html": "^0.0.2",
28
- "@usewaypoint/block-image": "^0.0.4",
29
- "@usewaypoint/block-spacer": "^0.0.2",
30
- "@usewaypoint/block-text": "^0.0.2",
31
- "@usewaypoint/document-core": "^0.0.4"
29
+ "@usewaypoint/block-avatar": "^0.0.3",
30
+ "@usewaypoint/block-button": "^0.0.3",
31
+ "@usewaypoint/block-columns-container": "^0.0.3",
32
+ "@usewaypoint/block-container": "^0.0.2",
33
+ "@usewaypoint/block-divider": "^0.0.4",
34
+ "@usewaypoint/block-heading": "^0.0.3",
35
+ "@usewaypoint/block-html": "^0.0.3",
36
+ "@usewaypoint/block-image": "^0.0.5",
37
+ "@usewaypoint/block-spacer": "^0.0.3",
38
+ "@usewaypoint/block-text": "^0.0.4",
39
+ "@usewaypoint/document-core": "^0.0.6"
32
40
  }
33
41
  }
@@ -1 +0,0 @@
1
- {"version":3,"file":"core.d.ts","sourceRoot":"","sources":["../../src/Reader/core.tsx"],"names":[],"mappings":"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"}