easy-email-extensions 4.8.0 → 4.11.0

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.
@@ -0,0 +1,37 @@
1
+ declare module 'mjml-browser' {
2
+ const transform: (vml: string, options?: {
3
+ beautify?: boolean;
4
+ minify?: boolean;
5
+ keepComments?: boolean;
6
+ validationLevel: 'strict' | 'soft' | 'skip';
7
+ }) => {
8
+ json: MjmlBlockItem;
9
+ html: string;
10
+ errors: string[];
11
+ };
12
+ export default transform;
13
+ }
14
+ interface MjmlBlockItem {
15
+ file: string;
16
+ absoluteFilePath: string;
17
+ line: number;
18
+ includedIn: any[];
19
+ tagName: string;
20
+ children: IChildrenItem[];
21
+ attributes: IAttributes;
22
+ content?: string;
23
+ }
24
+ interface IChildrenItem {
25
+ file?: string;
26
+ absoluteFilePath?: string;
27
+ line: number;
28
+ includedIn: any[];
29
+ tagName: string;
30
+ children?: IChildrenItem[];
31
+ attributes: IAttributes;
32
+ content?: string;
33
+ inline?: 'inline';
34
+ }
35
+ interface IAttributes {
36
+ [key: string]: any;
37
+ }
@@ -0,0 +1,5 @@
1
+ import { IPage } from 'easy-email-core';
2
+ export declare function MjmlToJson(data: MjmlBlockItem | string): IPage;
3
+ export declare function getMetaDataFromMjml(data?: IChildrenItem): {
4
+ [key: string]: any;
5
+ };
@@ -0,0 +1,2 @@
1
+ import { IBlockData } from 'easy-email-core';
2
+ export declare function parseXMLtoBlock(text: string): IBlockData<any, any>;
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "easy-email-extensions",
3
3
  "license": "MIT",
4
4
  "description": "Email editor",
5
- "version": "4.8.0",
5
+ "version": "4.11.0",
6
6
  "author": "m-Ryan",
7
7
  "repository": {
8
8
  "type": "git",
@@ -19,8 +19,9 @@
19
19
  "scripts": {
20
20
  "dev": "vite",
21
21
  "typings": "tsc --declaration --emitDeclarationOnly --project tsconfig.lib.json && tsc-alias -p tsconfig.alias.json",
22
- "build": "rimraf lib && npm run typings && vite build --config vite.config.ts",
23
- "format": "eslint --fix --ext .tsx,.ts,.tsx src/"
22
+ "build": "rimraf lib && npm run typings && vite build --config vite.config.ts",
23
+ "format": "eslint --fix --ext .tsx,.ts,.tsx src/",
24
+ "test": "jest --coverage"
24
25
  },
25
26
  "husky": {
26
27
  "hooks": {
@@ -33,13 +34,23 @@
33
34
  ]
34
35
  },
35
36
  "devDependencies": {
37
+ "@babel/core": "^7.15.0",
38
+ "@babel/preset-env": "^7.15.0",
39
+ "@babel/preset-react": "^7.14.5",
40
+ "@babel/preset-typescript": "^7.15.0",
41
+ "@types/color": "^3.0.3",
42
+ "@types/jest": "^26.0.24",
43
+ "@types/jsdom": "^16.2.13",
36
44
  "@types/lodash": "^4.14.178",
37
45
  "@types/node": "^16.11.7",
38
46
  "@types/react": "17.0.2",
47
+ "@types/react-color": "^3.0.6",
39
48
  "@types/react-dom": "^17.0.11",
49
+ "@types/uuid": "^8.3.4",
40
50
  "@typescript-eslint/eslint-plugin": "^4.28.3",
41
51
  "@typescript-eslint/parser": "^4.28.3",
42
52
  "@vitejs/plugin-react-refresh": "^1.3.6",
53
+ "babel-jest": "^27.0.6",
43
54
  "cross-env": "^7.0.3",
44
55
  "eslint": "^7.31.0",
45
56
  "eslint-config-prettier": "^8.3.0",
@@ -48,6 +59,8 @@
48
59
  "eslint-plugin-prettier": "^3.4.0",
49
60
  "eslint-plugin-react": "^7.24.0",
50
61
  "eslint-plugin-react-hooks": "^4.2.0",
62
+ "jest": "^27.0.6",
63
+ "jsdom": "^17.0.0",
51
64
  "lerna": "^4.0.0",
52
65
  "less": "^4.1.2",
53
66
  "react": "^17.0.2",
@@ -55,6 +68,7 @@
55
68
  "react-final-form": "^6.5.7",
56
69
  "rollup-plugin-visualizer": "^5.5.2",
57
70
  "sass": "^1.43.4",
71
+ "ts-node": "^10.4.0",
58
72
  "tsc-alias": "^1.4.1",
59
73
  "typescript": "^4.4.4",
60
74
  "vite": "^2.6.14",
@@ -63,9 +77,6 @@
63
77
  },
64
78
  "dependencies": {
65
79
  "@arco-design/web-react": "^2.36.1",
66
- "@types/color": "^3.0.3",
67
- "@types/react-color": "^3.0.6",
68
- "@types/uuid": "^8.3.4",
69
80
  "codemirror": "^5.63.3",
70
81
  "color": "^4.2.3",
71
82
  "final-form": "^4.20.4",
@@ -88,5 +99,5 @@
88
99
  "react-dom": "^17.0.2",
89
100
  "react-final-form": "^6.5.7"
90
101
  },
91
- "gitHead": "053dfd2e8e31457f81fc17f2139b51245eef85c8"
102
+ "gitHead": "deebe2f4a3eba7631d818a3c66c3b953e546da58"
92
103
  }
package/readme.md CHANGED
@@ -2,7 +2,10 @@
2
2
 
3
3
  ## Introduction
4
4
 
5
- Provide default UI components, when they don’t meet your needs, you can refer to it and write your own
5
+ Provide default UI components, when they don’t meet your needs, you can refer to it and write your own.
6
+
7
+ It also provides the following utils:
8
+ - MjmlToJson
6
9
 
7
10
  ## usage
8
11
 
@@ -227,3 +230,116 @@ export default function App() {
227
230
  - compact
228
231
  - categories
229
232
  - showSourceCode
233
+
234
+ ## transform mjml to json
235
+
236
+ ```ts
237
+ import { MjmlToJson } from 'easy-email-extensions';
238
+
239
+ const json = MjmlToJson(`
240
+ <mjml>
241
+ <mj-body>
242
+ <mj-hero mode="fluid-height" background-width="600px" background-height="469px" background-url="https://cloud.githubusercontent.com/assets/1830348/15354890/1442159a-1cf0-11e6-92b1-b861dadf1750.jpg" background-color="#2a3448" padding="100px 0px">
243
+ <mj-text padding="20px" color="#ffffff" font-family="Helvetica" align="center" font-size="45px" line-height="45px" font-weight="900">
244
+ GO TO SPACE
245
+ </mj-text>
246
+ <mj-button href="https://mjml.io/" align="center">
247
+ ORDER YOUR TICKET NOW
248
+ </mj-button>
249
+ </mj-hero>
250
+ </mj-body>
251
+ </mjml>
252
+ `);
253
+
254
+ console.log(json);
255
+ ```
256
+
257
+ // output
258
+
259
+ ```json
260
+ {
261
+ "type": "page",
262
+ "data": {
263
+ "value": {
264
+ "breakpoint": "480px",
265
+ "headAttributes": "",
266
+ "font-size": "14px",
267
+ "line-height": "1.7",
268
+ "headStyles": [],
269
+ "fonts": [],
270
+ "responsive": true,
271
+ "font-family": "lucida Grande,Verdana,Microsoft YaHei",
272
+ "text-color": "#000000"
273
+ }
274
+ },
275
+ "attributes": {
276
+ "background-color": "#efeeea",
277
+ "width": "600px"
278
+ },
279
+ "children": [
280
+ {
281
+ "type": "hero",
282
+ "data": {
283
+ "value": {}
284
+ },
285
+ "attributes": {
286
+ "padding": "100px 0px 100px 0px",
287
+ "border": "none",
288
+ "direction": "ltr",
289
+ "text-align": "center",
290
+ "background-color": "#2a3448",
291
+ "background-position": "center center",
292
+ "mode": "fluid-height",
293
+ "vertical-align": "top",
294
+ "background-url": "https://cloud.githubusercontent.com/assets/1830348/15354890/1442159a-1cf0-11e6-92b1-b861dadf1750.jpg",
295
+ "background-width": "600px",
296
+ "background-height": "469px"
297
+ },
298
+ "children": [
299
+ {
300
+ "type": "text",
301
+ "data": {
302
+ "value": {
303
+ "content": "GO TO SPACE"
304
+ }
305
+ },
306
+ "attributes": {
307
+ "padding": "20px 20px 20px 20px",
308
+ "align": "center",
309
+ "color": "#ffffff",
310
+ "font-size": "45px",
311
+ "line-height": "45px",
312
+ "font-family": "Helvetica",
313
+ "font-weight": "900"
314
+ },
315
+ "children": []
316
+ },
317
+ {
318
+ "type": "button",
319
+ "data": {
320
+ "value": {
321
+ "content": "ORDER YOUR TICKET NOW"
322
+ }
323
+ },
324
+ "attributes": {
325
+ "align": "center",
326
+ "background-color": "#414141",
327
+ "color": "#ffffff",
328
+ "font-weight": "normal",
329
+ "border-radius": "3px",
330
+ "padding": "10px 25px 10px 25px",
331
+ "inner-padding": "10px 25px 10px 25px",
332
+ "line-height": "120%",
333
+ "target": "_blank",
334
+ "vertical-align": "middle",
335
+ "border": "none",
336
+ "text-align": "center",
337
+ "href": "https://mjml.io/"
338
+ },
339
+ "children": []
340
+ }
341
+ ]
342
+ }
343
+ ]
344
+ }
345
+ ```