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.
- package/lib/index.d.ts +1 -0
- package/lib/index.js +2 -1
- package/lib/index.js.map +1 -1
- package/lib/index2.js +194 -2
- package/lib/index2.js.map +1 -1
- package/lib/index3.js +1 -0
- package/lib/index3.js.map +1 -1
- package/lib/typings/mjml-browser.d.ts +37 -0
- package/lib/utils/MjmlToJson.d.ts +5 -0
- package/lib/utils/parseXMLtoBlock.d.ts +2 -0
- package/package.json +18 -7
- package/readme.md +117 -1
@@ -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
|
+
}
|
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.
|
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
|
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": "
|
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
|
+
```
|