remark-docx 0.3.7 → 0.3.9
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/README.md +1 -1
- package/lib/plugins/code/index.cjs +33 -3
- package/lib/plugins/code/index.cjs.map +1 -1
- package/lib/plugins/code/index.js +33 -3
- package/lib/plugins/code/index.js.map +1 -1
- package/lib/plugins/image/index.cjs +6 -3
- package/lib/plugins/image/index.cjs.map +1 -1
- package/lib/plugins/image/index.js +6 -3
- package/lib/plugins/image/index.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -26,8 +26,8 @@ Currently, some of the default styles may not be nice. If you have feature reque
|
|
|
26
26
|
- [x] inlineCode
|
|
27
27
|
- [x] break
|
|
28
28
|
- [x] link / linkReference
|
|
29
|
-
- [x] image / imageReference ([remark-docx/plugins/image](#image) is required)
|
|
30
29
|
- [x] footnote / footnoteReference / footnoteDefinition
|
|
30
|
+
- [x] image / imageReference ([remark-docx/plugins/image](#image) is required)
|
|
31
31
|
- [x] html ([remark-docx/plugins/html](#html) is required)
|
|
32
32
|
- [x] code ([remark-docx/plugins/code](#code) is required)
|
|
33
33
|
- [x] math / inlineMath ([remark-math](https://github.com/remarkjs/remark-math) and [remark-docx/plugins/math](#math) are required)
|
|
@@ -4,6 +4,23 @@ var docx = require('docx');
|
|
|
4
4
|
var shiki = require('shiki');
|
|
5
5
|
var unistUtilVisit = require('unist-util-visit');
|
|
6
6
|
|
|
7
|
+
/**
|
|
8
|
+
* Format to 6 disit hex
|
|
9
|
+
*/
|
|
10
|
+
const formatHex = (str) => {
|
|
11
|
+
// #RGB
|
|
12
|
+
if (str.length === 4) {
|
|
13
|
+
const r = str[1];
|
|
14
|
+
const g = str[2];
|
|
15
|
+
const b = str[3];
|
|
16
|
+
return str[0] + r + r + g + g + b + b;
|
|
17
|
+
}
|
|
18
|
+
// #RRGGBBAA
|
|
19
|
+
if (str.length === 9) {
|
|
20
|
+
return str.slice(0, 7);
|
|
21
|
+
}
|
|
22
|
+
return str;
|
|
23
|
+
};
|
|
7
24
|
/**
|
|
8
25
|
* A plugin to render "code" nodes, with syntax highlighting powered by shiki.
|
|
9
26
|
*/
|
|
@@ -38,17 +55,30 @@ const shikiPlugin = ({ theme, }) => {
|
|
|
38
55
|
lang: lang,
|
|
39
56
|
theme,
|
|
40
57
|
});
|
|
58
|
+
let { bg, fg } = res;
|
|
59
|
+
if (fg) {
|
|
60
|
+
fg = formatHex(fg);
|
|
61
|
+
}
|
|
62
|
+
if (bg) {
|
|
63
|
+
bg = formatHex(bg);
|
|
64
|
+
}
|
|
41
65
|
return res.tokens.map((r) => {
|
|
42
66
|
return new docx.Paragraph({
|
|
43
67
|
shading: {
|
|
44
68
|
type: "clear",
|
|
45
69
|
color: "auto",
|
|
46
|
-
fill:
|
|
70
|
+
fill: bg,
|
|
47
71
|
},
|
|
48
72
|
children: r.map(({ content, bgColor, color, fontStyle }) => {
|
|
73
|
+
if (color) {
|
|
74
|
+
color = formatHex(color);
|
|
75
|
+
}
|
|
76
|
+
if (bgColor) {
|
|
77
|
+
bgColor = formatHex(bgColor);
|
|
78
|
+
}
|
|
49
79
|
return new docx.TextRun({
|
|
50
80
|
text: content,
|
|
51
|
-
color: color !== null && color !== void 0 ? color :
|
|
81
|
+
color: color !== null && color !== void 0 ? color : fg,
|
|
52
82
|
shading: bgColor
|
|
53
83
|
? {
|
|
54
84
|
type: "clear",
|
|
@@ -59,7 +89,7 @@ const shikiPlugin = ({ theme, }) => {
|
|
|
59
89
|
bold: fontStyle === 2,
|
|
60
90
|
italics: fontStyle === 1,
|
|
61
91
|
underline: fontStyle === 4
|
|
62
|
-
? { type: "single", color:
|
|
92
|
+
? { type: "single", color: fg }
|
|
63
93
|
: undefined,
|
|
64
94
|
strike: fontStyle === 8,
|
|
65
95
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../../../src/plugins/code/index.ts"],"sourcesContent":["import { Paragraph, TextRun } from \"docx\";\nimport type { RemarkDocxPlugin } from \"../../types\";\nimport {\n createHighlighter,\n type BundledLanguage,\n type BundledTheme,\n} from \"shiki\";\nimport { visit } from \"unist-util-visit\";\nimport type { FontStyle } from \"shiki/textmate\";\n\nexport interface ShikiPluginOptions {\n /**\n * https://shiki.style/themes\n */\n theme: BundledTheme;\n}\n\n/**\n * A plugin to render \"code\" nodes, with syntax highlighting powered by shiki.\n */\nexport const shikiPlugin = ({\n theme,\n}: ShikiPluginOptions): RemarkDocxPlugin => {\n let highlighter: Awaited<ReturnType<typeof createHighlighter>> | undefined;\n const langs = new Set<string>();\n\n return async ({ root }) => {\n const newLangs: string[] = [];\n\n visit(root, \"code\", ({ lang }) => {\n if (lang) {\n if (!langs.has(lang)) {\n langs.add(lang);\n newLangs.push(lang);\n }\n }\n });\n\n if (!highlighter) {\n highlighter = await createHighlighter({\n themes: [theme],\n langs: [...langs],\n });\n } else {\n await Promise.all(\n newLangs.map((l) => highlighter!.loadLanguage(l as BundledLanguage)),\n );\n }\n\n return {\n code: ({ value, lang }) => {\n if (!lang) {\n return null;\n }\n const res = highlighter!.codeToTokens(value, {\n lang: lang as BundledLanguage,\n theme,\n });\n\n return res.tokens.map((r) => {\n return new Paragraph({\n shading: {\n type: \"clear\",\n color: \"auto\",\n fill:
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../src/plugins/code/index.ts"],"sourcesContent":["import { Paragraph, TextRun } from \"docx\";\nimport type { RemarkDocxPlugin } from \"../../types\";\nimport {\n createHighlighter,\n type BundledLanguage,\n type BundledTheme,\n} from \"shiki\";\nimport { visit } from \"unist-util-visit\";\nimport type { FontStyle } from \"shiki/textmate\";\n\n/**\n * Format to 6 disit hex\n */\nconst formatHex = (str: string): string => {\n // #RGB\n if (str.length === 4) {\n const r = str[1]!;\n const g = str[2]!;\n const b = str[3]!;\n return str[0]! + r + r + g + g + b + b;\n }\n // #RRGGBBAA\n if (str.length === 9) {\n return str.slice(0, 7);\n }\n return str;\n};\n\nexport interface ShikiPluginOptions {\n /**\n * https://shiki.style/themes\n */\n theme: BundledTheme;\n}\n\n/**\n * A plugin to render \"code\" nodes, with syntax highlighting powered by shiki.\n */\nexport const shikiPlugin = ({\n theme,\n}: ShikiPluginOptions): RemarkDocxPlugin => {\n let highlighter: Awaited<ReturnType<typeof createHighlighter>> | undefined;\n const langs = new Set<string>();\n\n return async ({ root }) => {\n const newLangs: string[] = [];\n\n visit(root, \"code\", ({ lang }) => {\n if (lang) {\n if (!langs.has(lang)) {\n langs.add(lang);\n newLangs.push(lang);\n }\n }\n });\n\n if (!highlighter) {\n highlighter = await createHighlighter({\n themes: [theme],\n langs: [...langs],\n });\n } else {\n await Promise.all(\n newLangs.map((l) => highlighter!.loadLanguage(l as BundledLanguage)),\n );\n }\n\n return {\n code: ({ value, lang }) => {\n if (!lang) {\n return null;\n }\n const res = highlighter!.codeToTokens(value, {\n lang: lang as BundledLanguage,\n theme,\n });\n let { bg, fg } = res;\n if (fg) {\n fg = formatHex(fg);\n }\n if (bg) {\n bg = formatHex(bg);\n }\n\n return res.tokens.map((r) => {\n return new Paragraph({\n shading: {\n type: \"clear\",\n color: \"auto\",\n fill: bg,\n },\n children: r.map(({ content, bgColor, color, fontStyle }) => {\n if (color) {\n color = formatHex(color);\n }\n if (bgColor) {\n bgColor = formatHex(bgColor);\n }\n return new TextRun({\n text: content,\n color: color ?? fg,\n shading: bgColor\n ? {\n type: \"clear\",\n color: \"auto\",\n fill: bgColor,\n }\n : undefined,\n bold: fontStyle === (2 satisfies FontStyle.Bold),\n italics: fontStyle === (1 satisfies FontStyle.Italic),\n underline:\n fontStyle === (4 satisfies FontStyle.Underline)\n ? { type: \"single\", color: fg }\n : undefined,\n strike: fontStyle === (8 satisfies FontStyle.Strikethrough),\n });\n }),\n });\n });\n },\n };\n };\n};\n"],"names":["visit","createHighlighter","Paragraph","TextRun"],"mappings":";;;;;;AAUA;;AAEG;AACH,MAAM,SAAS,GAAG,CAAC,GAAW,KAAY;;AAExC,IAAA,IAAI,GAAG,CAAC,MAAM,KAAK,CAAC,EAAE;AACpB,QAAA,MAAM,CAAC,GAAG,GAAG,CAAC,CAAC,CAAE;AACjB,QAAA,MAAM,CAAC,GAAG,GAAG,CAAC,CAAC,CAAE;AACjB,QAAA,MAAM,CAAC,GAAG,GAAG,CAAC,CAAC,CAAE;AACjB,QAAA,OAAO,GAAG,CAAC,CAAC,CAAE,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC;IACxC;;AAEA,IAAA,IAAI,GAAG,CAAC,MAAM,KAAK,CAAC,EAAE;QACpB,OAAO,GAAG,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC;IACxB;AACA,IAAA,OAAO,GAAG;AACZ,CAAC;AASD;;AAEG;MACU,WAAW,GAAG,CAAC,EAC1B,KAAK,GACc,KAAsB;AACzC,IAAA,IAAI,WAAsE;AAC1E,IAAA,MAAM,KAAK,GAAG,IAAI,GAAG,EAAU;AAE/B,IAAA,OAAO,OAAO,EAAE,IAAI,EAAE,KAAI;QACxB,MAAM,QAAQ,GAAa,EAAE;QAE7BA,oBAAK,CAAC,IAAI,EAAE,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,KAAI;YAC/B,IAAI,IAAI,EAAE;gBACR,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE;AACpB,oBAAA,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC;AACf,oBAAA,QAAQ,CAAC,IAAI,CAAC,IAAI,CAAC;gBACrB;YACF;AACF,QAAA,CAAC,CAAC;QAEF,IAAI,CAAC,WAAW,EAAE;YAChB,WAAW,GAAG,MAAMC,uBAAiB,CAAC;gBACpC,MAAM,EAAE,CAAC,KAAK,CAAC;AACf,gBAAA,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC;AAClB,aAAA,CAAC;QACJ;aAAO;YACL,MAAM,OAAO,CAAC,GAAG,CACf,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,KAAK,WAAY,CAAC,YAAY,CAAC,CAAoB,CAAC,CAAC,CACrE;QACH;QAEA,OAAO;YACL,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,KAAI;gBACxB,IAAI,CAAC,IAAI,EAAE;AACT,oBAAA,OAAO,IAAI;gBACb;AACA,gBAAA,MAAM,GAAG,GAAG,WAAY,CAAC,YAAY,CAAC,KAAK,EAAE;AAC3C,oBAAA,IAAI,EAAE,IAAuB;oBAC7B,KAAK;AACN,iBAAA,CAAC;AACF,gBAAA,IAAI,EAAE,EAAE,EAAE,EAAE,EAAE,GAAG,GAAG;gBACpB,IAAI,EAAE,EAAE;AACN,oBAAA,EAAE,GAAG,SAAS,CAAC,EAAE,CAAC;gBACpB;gBACA,IAAI,EAAE,EAAE;AACN,oBAAA,EAAE,GAAG,SAAS,CAAC,EAAE,CAAC;gBACpB;gBAEA,OAAO,GAAG,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,KAAI;oBAC1B,OAAO,IAAIC,cAAS,CAAC;AACnB,wBAAA,OAAO,EAAE;AACP,4BAAA,IAAI,EAAE,OAAO;AACb,4BAAA,KAAK,EAAE,MAAM;AACb,4BAAA,IAAI,EAAE,EAAE;AACT,yBAAA;AACD,wBAAA,QAAQ,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,KAAI;4BACzD,IAAI,KAAK,EAAE;AACT,gCAAA,KAAK,GAAG,SAAS,CAAC,KAAK,CAAC;4BAC1B;4BACA,IAAI,OAAO,EAAE;AACX,gCAAA,OAAO,GAAG,SAAS,CAAC,OAAO,CAAC;4BAC9B;4BACA,OAAO,IAAIC,YAAO,CAAC;AACjB,gCAAA,IAAI,EAAE,OAAO;AACb,gCAAA,KAAK,EAAE,KAAK,KAAA,IAAA,IAAL,KAAK,KAAA,MAAA,GAAL,KAAK,GAAI,EAAE;AAClB,gCAAA,OAAO,EAAE;AACP,sCAAE;AACE,wCAAA,IAAI,EAAE,OAAO;AACb,wCAAA,KAAK,EAAE,MAAM;AACb,wCAAA,IAAI,EAAE,OAAO;AACd;AACH,sCAAE,SAAS;gCACb,IAAI,EAAE,SAAS,KAAM,CAA2B;gCAChD,OAAO,EAAE,SAAS,KAAM,CAA6B;gCACrD,SAAS,EACP,SAAS,KAAM;sCACX,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,EAAE;AAC7B,sCAAE,SAAS;gCACf,MAAM,EAAE,SAAS,KAAM,CAAoC;AAC5D,6BAAA,CAAC;AACJ,wBAAA,CAAC,CAAC;AACH,qBAAA,CAAC;AACJ,gBAAA,CAAC,CAAC;YACJ,CAAC;SACF;AACH,IAAA,CAAC;AACH;;;;"}
|
|
@@ -2,6 +2,23 @@ import { Paragraph, TextRun } from 'docx';
|
|
|
2
2
|
import { createHighlighter } from 'shiki';
|
|
3
3
|
import { visit } from 'unist-util-visit';
|
|
4
4
|
|
|
5
|
+
/**
|
|
6
|
+
* Format to 6 disit hex
|
|
7
|
+
*/
|
|
8
|
+
const formatHex = (str) => {
|
|
9
|
+
// #RGB
|
|
10
|
+
if (str.length === 4) {
|
|
11
|
+
const r = str[1];
|
|
12
|
+
const g = str[2];
|
|
13
|
+
const b = str[3];
|
|
14
|
+
return str[0] + r + r + g + g + b + b;
|
|
15
|
+
}
|
|
16
|
+
// #RRGGBBAA
|
|
17
|
+
if (str.length === 9) {
|
|
18
|
+
return str.slice(0, 7);
|
|
19
|
+
}
|
|
20
|
+
return str;
|
|
21
|
+
};
|
|
5
22
|
/**
|
|
6
23
|
* A plugin to render "code" nodes, with syntax highlighting powered by shiki.
|
|
7
24
|
*/
|
|
@@ -36,17 +53,30 @@ const shikiPlugin = ({ theme, }) => {
|
|
|
36
53
|
lang: lang,
|
|
37
54
|
theme,
|
|
38
55
|
});
|
|
56
|
+
let { bg, fg } = res;
|
|
57
|
+
if (fg) {
|
|
58
|
+
fg = formatHex(fg);
|
|
59
|
+
}
|
|
60
|
+
if (bg) {
|
|
61
|
+
bg = formatHex(bg);
|
|
62
|
+
}
|
|
39
63
|
return res.tokens.map((r) => {
|
|
40
64
|
return new Paragraph({
|
|
41
65
|
shading: {
|
|
42
66
|
type: "clear",
|
|
43
67
|
color: "auto",
|
|
44
|
-
fill:
|
|
68
|
+
fill: bg,
|
|
45
69
|
},
|
|
46
70
|
children: r.map(({ content, bgColor, color, fontStyle }) => {
|
|
71
|
+
if (color) {
|
|
72
|
+
color = formatHex(color);
|
|
73
|
+
}
|
|
74
|
+
if (bgColor) {
|
|
75
|
+
bgColor = formatHex(bgColor);
|
|
76
|
+
}
|
|
47
77
|
return new TextRun({
|
|
48
78
|
text: content,
|
|
49
|
-
color: color !== null && color !== void 0 ? color :
|
|
79
|
+
color: color !== null && color !== void 0 ? color : fg,
|
|
50
80
|
shading: bgColor
|
|
51
81
|
? {
|
|
52
82
|
type: "clear",
|
|
@@ -57,7 +87,7 @@ const shikiPlugin = ({ theme, }) => {
|
|
|
57
87
|
bold: fontStyle === 2,
|
|
58
88
|
italics: fontStyle === 1,
|
|
59
89
|
underline: fontStyle === 4
|
|
60
|
-
? { type: "single", color:
|
|
90
|
+
? { type: "single", color: fg }
|
|
61
91
|
: undefined,
|
|
62
92
|
strike: fontStyle === 8,
|
|
63
93
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/plugins/code/index.ts"],"sourcesContent":["import { Paragraph, TextRun } from \"docx\";\nimport type { RemarkDocxPlugin } from \"../../types\";\nimport {\n createHighlighter,\n type BundledLanguage,\n type BundledTheme,\n} from \"shiki\";\nimport { visit } from \"unist-util-visit\";\nimport type { FontStyle } from \"shiki/textmate\";\n\nexport interface ShikiPluginOptions {\n /**\n * https://shiki.style/themes\n */\n theme: BundledTheme;\n}\n\n/**\n * A plugin to render \"code\" nodes, with syntax highlighting powered by shiki.\n */\nexport const shikiPlugin = ({\n theme,\n}: ShikiPluginOptions): RemarkDocxPlugin => {\n let highlighter: Awaited<ReturnType<typeof createHighlighter>> | undefined;\n const langs = new Set<string>();\n\n return async ({ root }) => {\n const newLangs: string[] = [];\n\n visit(root, \"code\", ({ lang }) => {\n if (lang) {\n if (!langs.has(lang)) {\n langs.add(lang);\n newLangs.push(lang);\n }\n }\n });\n\n if (!highlighter) {\n highlighter = await createHighlighter({\n themes: [theme],\n langs: [...langs],\n });\n } else {\n await Promise.all(\n newLangs.map((l) => highlighter!.loadLanguage(l as BundledLanguage)),\n );\n }\n\n return {\n code: ({ value, lang }) => {\n if (!lang) {\n return null;\n }\n const res = highlighter!.codeToTokens(value, {\n lang: lang as BundledLanguage,\n theme,\n });\n\n return res.tokens.map((r) => {\n return new Paragraph({\n shading: {\n type: \"clear\",\n color: \"auto\",\n fill:
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/plugins/code/index.ts"],"sourcesContent":["import { Paragraph, TextRun } from \"docx\";\nimport type { RemarkDocxPlugin } from \"../../types\";\nimport {\n createHighlighter,\n type BundledLanguage,\n type BundledTheme,\n} from \"shiki\";\nimport { visit } from \"unist-util-visit\";\nimport type { FontStyle } from \"shiki/textmate\";\n\n/**\n * Format to 6 disit hex\n */\nconst formatHex = (str: string): string => {\n // #RGB\n if (str.length === 4) {\n const r = str[1]!;\n const g = str[2]!;\n const b = str[3]!;\n return str[0]! + r + r + g + g + b + b;\n }\n // #RRGGBBAA\n if (str.length === 9) {\n return str.slice(0, 7);\n }\n return str;\n};\n\nexport interface ShikiPluginOptions {\n /**\n * https://shiki.style/themes\n */\n theme: BundledTheme;\n}\n\n/**\n * A plugin to render \"code\" nodes, with syntax highlighting powered by shiki.\n */\nexport const shikiPlugin = ({\n theme,\n}: ShikiPluginOptions): RemarkDocxPlugin => {\n let highlighter: Awaited<ReturnType<typeof createHighlighter>> | undefined;\n const langs = new Set<string>();\n\n return async ({ root }) => {\n const newLangs: string[] = [];\n\n visit(root, \"code\", ({ lang }) => {\n if (lang) {\n if (!langs.has(lang)) {\n langs.add(lang);\n newLangs.push(lang);\n }\n }\n });\n\n if (!highlighter) {\n highlighter = await createHighlighter({\n themes: [theme],\n langs: [...langs],\n });\n } else {\n await Promise.all(\n newLangs.map((l) => highlighter!.loadLanguage(l as BundledLanguage)),\n );\n }\n\n return {\n code: ({ value, lang }) => {\n if (!lang) {\n return null;\n }\n const res = highlighter!.codeToTokens(value, {\n lang: lang as BundledLanguage,\n theme,\n });\n let { bg, fg } = res;\n if (fg) {\n fg = formatHex(fg);\n }\n if (bg) {\n bg = formatHex(bg);\n }\n\n return res.tokens.map((r) => {\n return new Paragraph({\n shading: {\n type: \"clear\",\n color: \"auto\",\n fill: bg,\n },\n children: r.map(({ content, bgColor, color, fontStyle }) => {\n if (color) {\n color = formatHex(color);\n }\n if (bgColor) {\n bgColor = formatHex(bgColor);\n }\n return new TextRun({\n text: content,\n color: color ?? fg,\n shading: bgColor\n ? {\n type: \"clear\",\n color: \"auto\",\n fill: bgColor,\n }\n : undefined,\n bold: fontStyle === (2 satisfies FontStyle.Bold),\n italics: fontStyle === (1 satisfies FontStyle.Italic),\n underline:\n fontStyle === (4 satisfies FontStyle.Underline)\n ? { type: \"single\", color: fg }\n : undefined,\n strike: fontStyle === (8 satisfies FontStyle.Strikethrough),\n });\n }),\n });\n });\n },\n };\n };\n};\n"],"names":[],"mappings":"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"}
|
|
@@ -52,11 +52,14 @@ const browserSvgToPng = async ({ buffer, width, height }) => {
|
|
|
52
52
|
const img = new Image();
|
|
53
53
|
img.src = url;
|
|
54
54
|
await img.decode();
|
|
55
|
+
const dpr = window.devicePixelRatio;
|
|
55
56
|
const canvas = document.createElement("canvas");
|
|
56
|
-
|
|
57
|
-
|
|
57
|
+
const scaledWidth = width * dpr;
|
|
58
|
+
const scaledHeight = height * dpr;
|
|
59
|
+
canvas.width = scaledWidth;
|
|
60
|
+
canvas.height = scaledHeight;
|
|
58
61
|
const ctx = canvas.getContext("2d");
|
|
59
|
-
ctx.drawImage(img, 0, 0,
|
|
62
|
+
ctx.drawImage(img, 0, 0, scaledWidth, scaledHeight);
|
|
60
63
|
return new Promise((resolve) => {
|
|
61
64
|
canvas.toBlob((blob) => {
|
|
62
65
|
blob.arrayBuffer().then(resolve);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.cjs","sources":["../../../src/plugins/image/index.ts"],"sourcesContent":["import { warnOnce } from \"../../utils\";\nimport type { RemarkDocxPlugin } from \"../../types\";\nimport type * as mdast from \"../../mdast\";\nimport { ImageRun } from \"docx\";\nimport { visit } from \"unist-util-visit\";\nimport { imageSize } from \"image-size\";\n\nconst supportedTypes = [\"png\", \"jpg\", \"gif\", \"bmp\", \"svg\"] as const;\n\ntype SupportedImageType = (typeof supportedTypes)[number];\n\ntype ImageData = Readonly<\n {\n data: ArrayBuffer;\n width: number;\n height: number;\n } & (\n | { type: Exclude<SupportedImageType, \"svg\"> }\n | {\n type: Extract<SupportedImageType, \"svg\">;\n fallback: ArrayBuffer;\n }\n )\n>;\n\nconst buildImage = (image: ImageData, node: { alt?: string | null }) => {\n const altText = node.alt ? { name: node.alt } : undefined;\n\n if (image.type === \"svg\") {\n const { type, data, width, height, fallback } = image;\n return new ImageRun({\n type: type,\n data: data,\n transformation: {\n width,\n height,\n },\n // https://github.com/dolanmiu/docx/issues/1162#issuecomment-3228368003\n fallback: { type: \"png\", data: fallback },\n altText,\n });\n }\n\n const { type, data, width, height } = image;\n return new ImageRun({\n type: type,\n data: data,\n transformation: {\n width,\n height,\n },\n altText,\n });\n};\n\nconst isSupportedType = (\n type: string | undefined,\n): type is SupportedImageType => {\n if (!type) return false;\n if ((supportedTypes as readonly string[]).includes(type)) {\n return true;\n }\n return false;\n};\n\ntype LoadFn = (url: string) => Promise<ArrayBuffer>;\n\ntype SvgToPngFn = (options: {\n buffer: ArrayBuffer;\n width: number;\n height: number;\n}) => Promise<ArrayBuffer>;\n\nconst loadWithFetch: LoadFn = async (url) => {\n const res = await fetch(url);\n return res.arrayBuffer();\n};\n\nconst browserSvgToPng: SvgToPngFn = async ({ buffer, width, height }) => {\n const svgBlob = new Blob([buffer], { type: \"image/svg+xml\" });\n const url = URL.createObjectURL(svgBlob);\n\n try {\n const img = new Image();\n img.src = url;\n await img.decode();\n\n const canvas = document.createElement(\"canvas\");\n canvas.width = width;\n canvas.height = height;\n const ctx = canvas.getContext(\"2d\")!;\n ctx.drawImage(img, 0, 0, width, height);\n\n return new Promise<ArrayBuffer>((resolve) => {\n canvas.toBlob((blob) => {\n blob!.arrayBuffer().then(resolve);\n }, \"image/png\");\n });\n } finally {\n URL.revokeObjectURL(url);\n }\n};\n\nexport interface ImagePluginOptions {\n /**\n * A function to resolve image data from url.\n * @default {@link loadWithFetch}\n */\n load?: LoadFn;\n /**\n * A function to convert SVG to PNG. According to the docx specifications, embedding SVG images also requires including PNG.\n * @default {@link browserSvgToPng}, which handles conversion only on browser\n */\n fallbackSvg?: SvgToPngFn;\n}\n\n/**\n * A plugin to render \"image\" nodes\n */\nexport const imagePlugin = ({\n load = loadWithFetch,\n fallbackSvg = browserSvgToPng,\n}: ImagePluginOptions = {}): RemarkDocxPlugin => {\n const images = new Map<string, ImageData>();\n\n return async ({ root, definition }) => {\n const imageList: (mdast.Image | mdast.Definition)[] = [];\n visit(root, \"image\", (node) => {\n imageList.push(node);\n });\n visit(root, \"imageReference\", (node) => {\n const maybeImage = definition(node.identifier)!;\n if (maybeImage) {\n imageList.push(maybeImage);\n }\n });\n\n if (imageList.length !== 0) {\n const promises = new Map<string, Promise<void>>();\n imageList.forEach(({ url }) => {\n if (!images.has(url) && !promises.has(url)) {\n promises.set(\n url,\n (async () => {\n let data: ArrayBuffer;\n try {\n data = await load(url);\n } catch (e) {\n warnOnce(`Failed to load image: ${url} ${e}`);\n return;\n }\n\n const { width, height, type } = imageSize(new Uint8Array(data));\n if (!isSupportedType(type)) {\n warnOnce(`Not supported image type: ${type}`);\n return;\n }\n\n if (type === \"svg\") {\n try {\n const fallback = await fallbackSvg({\n buffer: data,\n width,\n height,\n });\n images.set(url, {\n type,\n width,\n height,\n data,\n fallback: fallback,\n });\n } catch (e) {\n warnOnce(`Failed to create fallback image: ${url} ${e}`);\n return;\n }\n } else {\n images.set(url, { type, width, height, data });\n }\n })(),\n );\n }\n });\n\n await Promise.all(promises.values());\n }\n\n return {\n image: (node) => {\n const data = images.get(node.url);\n if (!data) {\n return [];\n }\n return buildImage(data, node);\n },\n imageReference: (node) => {\n const def = definition(node.identifier);\n if (def == null) {\n return [];\n }\n const data = images.get(def.url);\n if (!data) {\n return [];\n }\n return buildImage(data, node);\n },\n };\n };\n};\n"],"names":["ImageRun","visit","warnOnce","imageSize"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.cjs","sources":["../../../src/plugins/image/index.ts"],"sourcesContent":["import { warnOnce } from \"../../utils\";\nimport type { RemarkDocxPlugin } from \"../../types\";\nimport type * as mdast from \"../../mdast\";\nimport { ImageRun } from \"docx\";\nimport { visit } from \"unist-util-visit\";\nimport { imageSize } from \"image-size\";\n\nconst supportedTypes = [\"png\", \"jpg\", \"gif\", \"bmp\", \"svg\"] as const;\n\ntype SupportedImageType = (typeof supportedTypes)[number];\n\ntype ImageData = Readonly<\n {\n data: ArrayBuffer;\n width: number;\n height: number;\n } & (\n | { type: Exclude<SupportedImageType, \"svg\"> }\n | {\n type: Extract<SupportedImageType, \"svg\">;\n fallback: ArrayBuffer;\n }\n )\n>;\n\nconst buildImage = (image: ImageData, node: { alt?: string | null }) => {\n const altText = node.alt ? { name: node.alt } : undefined;\n\n if (image.type === \"svg\") {\n const { type, data, width, height, fallback } = image;\n return new ImageRun({\n type: type,\n data: data,\n transformation: {\n width,\n height,\n },\n // https://github.com/dolanmiu/docx/issues/1162#issuecomment-3228368003\n fallback: { type: \"png\", data: fallback },\n altText,\n });\n }\n\n const { type, data, width, height } = image;\n return new ImageRun({\n type: type,\n data: data,\n transformation: {\n width,\n height,\n },\n altText,\n });\n};\n\nconst isSupportedType = (\n type: string | undefined,\n): type is SupportedImageType => {\n if (!type) return false;\n if ((supportedTypes as readonly string[]).includes(type)) {\n return true;\n }\n return false;\n};\n\ntype LoadFn = (url: string) => Promise<ArrayBuffer>;\n\ntype SvgToPngFn = (options: {\n buffer: ArrayBuffer;\n width: number;\n height: number;\n}) => Promise<ArrayBuffer>;\n\nconst loadWithFetch: LoadFn = async (url) => {\n const res = await fetch(url);\n return res.arrayBuffer();\n};\n\nconst browserSvgToPng: SvgToPngFn = async ({ buffer, width, height }) => {\n const svgBlob = new Blob([buffer], { type: \"image/svg+xml\" });\n const url = URL.createObjectURL(svgBlob);\n\n try {\n const img = new Image();\n img.src = url;\n await img.decode();\n\n const dpr = window.devicePixelRatio;\n\n const canvas = document.createElement(\"canvas\");\n const scaledWidth = width * dpr;\n const scaledHeight = height * dpr;\n canvas.width = scaledWidth;\n canvas.height = scaledHeight;\n const ctx = canvas.getContext(\"2d\")!;\n ctx.drawImage(img, 0, 0, scaledWidth, scaledHeight);\n\n return new Promise<ArrayBuffer>((resolve) => {\n canvas.toBlob((blob) => {\n blob!.arrayBuffer().then(resolve);\n }, \"image/png\");\n });\n } finally {\n URL.revokeObjectURL(url);\n }\n};\n\nexport interface ImagePluginOptions {\n /**\n * A function to resolve image data from url.\n * @default {@link loadWithFetch}\n */\n load?: LoadFn;\n /**\n * A function to convert SVG to PNG. According to the docx specifications, embedding SVG images also requires including PNG.\n * @default {@link browserSvgToPng}, which handles conversion only on browser\n */\n fallbackSvg?: SvgToPngFn;\n}\n\n/**\n * A plugin to render \"image\" nodes\n */\nexport const imagePlugin = ({\n load = loadWithFetch,\n fallbackSvg = browserSvgToPng,\n}: ImagePluginOptions = {}): RemarkDocxPlugin => {\n const images = new Map<string, ImageData>();\n\n return async ({ root, definition }) => {\n const imageList: (mdast.Image | mdast.Definition)[] = [];\n visit(root, \"image\", (node) => {\n imageList.push(node);\n });\n visit(root, \"imageReference\", (node) => {\n const maybeImage = definition(node.identifier)!;\n if (maybeImage) {\n imageList.push(maybeImage);\n }\n });\n\n if (imageList.length !== 0) {\n const promises = new Map<string, Promise<void>>();\n imageList.forEach(({ url }) => {\n if (!images.has(url) && !promises.has(url)) {\n promises.set(\n url,\n (async () => {\n let data: ArrayBuffer;\n try {\n data = await load(url);\n } catch (e) {\n warnOnce(`Failed to load image: ${url} ${e}`);\n return;\n }\n\n const { width, height, type } = imageSize(new Uint8Array(data));\n if (!isSupportedType(type)) {\n warnOnce(`Not supported image type: ${type}`);\n return;\n }\n\n if (type === \"svg\") {\n try {\n const fallback = await fallbackSvg({\n buffer: data,\n width,\n height,\n });\n images.set(url, {\n type,\n width,\n height,\n data,\n fallback: fallback,\n });\n } catch (e) {\n warnOnce(`Failed to create fallback image: ${url} ${e}`);\n return;\n }\n } else {\n images.set(url, { type, width, height, data });\n }\n })(),\n );\n }\n });\n\n await Promise.all(promises.values());\n }\n\n return {\n image: (node) => {\n const data = images.get(node.url);\n if (!data) {\n return [];\n }\n return buildImage(data, node);\n },\n imageReference: (node) => {\n const def = definition(node.identifier);\n if (def == null) {\n return [];\n }\n const data = images.get(def.url);\n if (!data) {\n return [];\n }\n return buildImage(data, node);\n },\n };\n };\n};\n"],"names":["ImageRun","visit","warnOnce","imageSize"],"mappings":"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"}
|
|
@@ -50,11 +50,14 @@ const browserSvgToPng = async ({ buffer, width, height }) => {
|
|
|
50
50
|
const img = new Image();
|
|
51
51
|
img.src = url;
|
|
52
52
|
await img.decode();
|
|
53
|
+
const dpr = window.devicePixelRatio;
|
|
53
54
|
const canvas = document.createElement("canvas");
|
|
54
|
-
|
|
55
|
-
|
|
55
|
+
const scaledWidth = width * dpr;
|
|
56
|
+
const scaledHeight = height * dpr;
|
|
57
|
+
canvas.width = scaledWidth;
|
|
58
|
+
canvas.height = scaledHeight;
|
|
56
59
|
const ctx = canvas.getContext("2d");
|
|
57
|
-
ctx.drawImage(img, 0, 0,
|
|
60
|
+
ctx.drawImage(img, 0, 0, scaledWidth, scaledHeight);
|
|
58
61
|
return new Promise((resolve) => {
|
|
59
62
|
canvas.toBlob((blob) => {
|
|
60
63
|
blob.arrayBuffer().then(resolve);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../../src/plugins/image/index.ts"],"sourcesContent":["import { warnOnce } from \"../../utils\";\nimport type { RemarkDocxPlugin } from \"../../types\";\nimport type * as mdast from \"../../mdast\";\nimport { ImageRun } from \"docx\";\nimport { visit } from \"unist-util-visit\";\nimport { imageSize } from \"image-size\";\n\nconst supportedTypes = [\"png\", \"jpg\", \"gif\", \"bmp\", \"svg\"] as const;\n\ntype SupportedImageType = (typeof supportedTypes)[number];\n\ntype ImageData = Readonly<\n {\n data: ArrayBuffer;\n width: number;\n height: number;\n } & (\n | { type: Exclude<SupportedImageType, \"svg\"> }\n | {\n type: Extract<SupportedImageType, \"svg\">;\n fallback: ArrayBuffer;\n }\n )\n>;\n\nconst buildImage = (image: ImageData, node: { alt?: string | null }) => {\n const altText = node.alt ? { name: node.alt } : undefined;\n\n if (image.type === \"svg\") {\n const { type, data, width, height, fallback } = image;\n return new ImageRun({\n type: type,\n data: data,\n transformation: {\n width,\n height,\n },\n // https://github.com/dolanmiu/docx/issues/1162#issuecomment-3228368003\n fallback: { type: \"png\", data: fallback },\n altText,\n });\n }\n\n const { type, data, width, height } = image;\n return new ImageRun({\n type: type,\n data: data,\n transformation: {\n width,\n height,\n },\n altText,\n });\n};\n\nconst isSupportedType = (\n type: string | undefined,\n): type is SupportedImageType => {\n if (!type) return false;\n if ((supportedTypes as readonly string[]).includes(type)) {\n return true;\n }\n return false;\n};\n\ntype LoadFn = (url: string) => Promise<ArrayBuffer>;\n\ntype SvgToPngFn = (options: {\n buffer: ArrayBuffer;\n width: number;\n height: number;\n}) => Promise<ArrayBuffer>;\n\nconst loadWithFetch: LoadFn = async (url) => {\n const res = await fetch(url);\n return res.arrayBuffer();\n};\n\nconst browserSvgToPng: SvgToPngFn = async ({ buffer, width, height }) => {\n const svgBlob = new Blob([buffer], { type: \"image/svg+xml\" });\n const url = URL.createObjectURL(svgBlob);\n\n try {\n const img = new Image();\n img.src = url;\n await img.decode();\n\n const canvas = document.createElement(\"canvas\");\n canvas.width = width;\n canvas.height = height;\n const ctx = canvas.getContext(\"2d\")!;\n ctx.drawImage(img, 0, 0, width, height);\n\n return new Promise<ArrayBuffer>((resolve) => {\n canvas.toBlob((blob) => {\n blob!.arrayBuffer().then(resolve);\n }, \"image/png\");\n });\n } finally {\n URL.revokeObjectURL(url);\n }\n};\n\nexport interface ImagePluginOptions {\n /**\n * A function to resolve image data from url.\n * @default {@link loadWithFetch}\n */\n load?: LoadFn;\n /**\n * A function to convert SVG to PNG. According to the docx specifications, embedding SVG images also requires including PNG.\n * @default {@link browserSvgToPng}, which handles conversion only on browser\n */\n fallbackSvg?: SvgToPngFn;\n}\n\n/**\n * A plugin to render \"image\" nodes\n */\nexport const imagePlugin = ({\n load = loadWithFetch,\n fallbackSvg = browserSvgToPng,\n}: ImagePluginOptions = {}): RemarkDocxPlugin => {\n const images = new Map<string, ImageData>();\n\n return async ({ root, definition }) => {\n const imageList: (mdast.Image | mdast.Definition)[] = [];\n visit(root, \"image\", (node) => {\n imageList.push(node);\n });\n visit(root, \"imageReference\", (node) => {\n const maybeImage = definition(node.identifier)!;\n if (maybeImage) {\n imageList.push(maybeImage);\n }\n });\n\n if (imageList.length !== 0) {\n const promises = new Map<string, Promise<void>>();\n imageList.forEach(({ url }) => {\n if (!images.has(url) && !promises.has(url)) {\n promises.set(\n url,\n (async () => {\n let data: ArrayBuffer;\n try {\n data = await load(url);\n } catch (e) {\n warnOnce(`Failed to load image: ${url} ${e}`);\n return;\n }\n\n const { width, height, type } = imageSize(new Uint8Array(data));\n if (!isSupportedType(type)) {\n warnOnce(`Not supported image type: ${type}`);\n return;\n }\n\n if (type === \"svg\") {\n try {\n const fallback = await fallbackSvg({\n buffer: data,\n width,\n height,\n });\n images.set(url, {\n type,\n width,\n height,\n data,\n fallback: fallback,\n });\n } catch (e) {\n warnOnce(`Failed to create fallback image: ${url} ${e}`);\n return;\n }\n } else {\n images.set(url, { type, width, height, data });\n }\n })(),\n );\n }\n });\n\n await Promise.all(promises.values());\n }\n\n return {\n image: (node) => {\n const data = images.get(node.url);\n if (!data) {\n return [];\n }\n return buildImage(data, node);\n },\n imageReference: (node) => {\n const def = definition(node.identifier);\n if (def == null) {\n return [];\n }\n const data = images.get(def.url);\n if (!data) {\n return [];\n }\n return buildImage(data, node);\n },\n };\n };\n};\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../../src/plugins/image/index.ts"],"sourcesContent":["import { warnOnce } from \"../../utils\";\nimport type { RemarkDocxPlugin } from \"../../types\";\nimport type * as mdast from \"../../mdast\";\nimport { ImageRun } from \"docx\";\nimport { visit } from \"unist-util-visit\";\nimport { imageSize } from \"image-size\";\n\nconst supportedTypes = [\"png\", \"jpg\", \"gif\", \"bmp\", \"svg\"] as const;\n\ntype SupportedImageType = (typeof supportedTypes)[number];\n\ntype ImageData = Readonly<\n {\n data: ArrayBuffer;\n width: number;\n height: number;\n } & (\n | { type: Exclude<SupportedImageType, \"svg\"> }\n | {\n type: Extract<SupportedImageType, \"svg\">;\n fallback: ArrayBuffer;\n }\n )\n>;\n\nconst buildImage = (image: ImageData, node: { alt?: string | null }) => {\n const altText = node.alt ? { name: node.alt } : undefined;\n\n if (image.type === \"svg\") {\n const { type, data, width, height, fallback } = image;\n return new ImageRun({\n type: type,\n data: data,\n transformation: {\n width,\n height,\n },\n // https://github.com/dolanmiu/docx/issues/1162#issuecomment-3228368003\n fallback: { type: \"png\", data: fallback },\n altText,\n });\n }\n\n const { type, data, width, height } = image;\n return new ImageRun({\n type: type,\n data: data,\n transformation: {\n width,\n height,\n },\n altText,\n });\n};\n\nconst isSupportedType = (\n type: string | undefined,\n): type is SupportedImageType => {\n if (!type) return false;\n if ((supportedTypes as readonly string[]).includes(type)) {\n return true;\n }\n return false;\n};\n\ntype LoadFn = (url: string) => Promise<ArrayBuffer>;\n\ntype SvgToPngFn = (options: {\n buffer: ArrayBuffer;\n width: number;\n height: number;\n}) => Promise<ArrayBuffer>;\n\nconst loadWithFetch: LoadFn = async (url) => {\n const res = await fetch(url);\n return res.arrayBuffer();\n};\n\nconst browserSvgToPng: SvgToPngFn = async ({ buffer, width, height }) => {\n const svgBlob = new Blob([buffer], { type: \"image/svg+xml\" });\n const url = URL.createObjectURL(svgBlob);\n\n try {\n const img = new Image();\n img.src = url;\n await img.decode();\n\n const dpr = window.devicePixelRatio;\n\n const canvas = document.createElement(\"canvas\");\n const scaledWidth = width * dpr;\n const scaledHeight = height * dpr;\n canvas.width = scaledWidth;\n canvas.height = scaledHeight;\n const ctx = canvas.getContext(\"2d\")!;\n ctx.drawImage(img, 0, 0, scaledWidth, scaledHeight);\n\n return new Promise<ArrayBuffer>((resolve) => {\n canvas.toBlob((blob) => {\n blob!.arrayBuffer().then(resolve);\n }, \"image/png\");\n });\n } finally {\n URL.revokeObjectURL(url);\n }\n};\n\nexport interface ImagePluginOptions {\n /**\n * A function to resolve image data from url.\n * @default {@link loadWithFetch}\n */\n load?: LoadFn;\n /**\n * A function to convert SVG to PNG. According to the docx specifications, embedding SVG images also requires including PNG.\n * @default {@link browserSvgToPng}, which handles conversion only on browser\n */\n fallbackSvg?: SvgToPngFn;\n}\n\n/**\n * A plugin to render \"image\" nodes\n */\nexport const imagePlugin = ({\n load = loadWithFetch,\n fallbackSvg = browserSvgToPng,\n}: ImagePluginOptions = {}): RemarkDocxPlugin => {\n const images = new Map<string, ImageData>();\n\n return async ({ root, definition }) => {\n const imageList: (mdast.Image | mdast.Definition)[] = [];\n visit(root, \"image\", (node) => {\n imageList.push(node);\n });\n visit(root, \"imageReference\", (node) => {\n const maybeImage = definition(node.identifier)!;\n if (maybeImage) {\n imageList.push(maybeImage);\n }\n });\n\n if (imageList.length !== 0) {\n const promises = new Map<string, Promise<void>>();\n imageList.forEach(({ url }) => {\n if (!images.has(url) && !promises.has(url)) {\n promises.set(\n url,\n (async () => {\n let data: ArrayBuffer;\n try {\n data = await load(url);\n } catch (e) {\n warnOnce(`Failed to load image: ${url} ${e}`);\n return;\n }\n\n const { width, height, type } = imageSize(new Uint8Array(data));\n if (!isSupportedType(type)) {\n warnOnce(`Not supported image type: ${type}`);\n return;\n }\n\n if (type === \"svg\") {\n try {\n const fallback = await fallbackSvg({\n buffer: data,\n width,\n height,\n });\n images.set(url, {\n type,\n width,\n height,\n data,\n fallback: fallback,\n });\n } catch (e) {\n warnOnce(`Failed to create fallback image: ${url} ${e}`);\n return;\n }\n } else {\n images.set(url, { type, width, height, data });\n }\n })(),\n );\n }\n });\n\n await Promise.all(promises.values());\n }\n\n return {\n image: (node) => {\n const data = images.get(node.url);\n if (!data) {\n return [];\n }\n return buildImage(data, node);\n },\n imageReference: (node) => {\n const def = definition(node.identifier);\n if (def == null) {\n return [];\n }\n const data = images.get(def.url);\n if (!data) {\n return [];\n }\n return buildImage(data, node);\n },\n };\n };\n};\n"],"names":[],"mappings":";;;;;AAOA,MAAM,cAAc,GAAG,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,CAAU;AAkBnE,MAAM,UAAU,GAAG,CAAC,KAAgB,EAAE,IAA6B,KAAI;AACrE,IAAA,MAAM,OAAO,GAAG,IAAI,CAAC,GAAG,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC,GAAG,EAAE,GAAG,SAAS;AAEzD,IAAA,IAAI,KAAK,CAAC,IAAI,KAAK,KAAK,EAAE;AACxB,QAAA,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK;QACrD,OAAO,IAAI,QAAQ,CAAC;AAClB,YAAA,IAAI,EAAE,IAAI;AACV,YAAA,IAAI,EAAE,IAAI;AACV,YAAA,cAAc,EAAE;gBACd,KAAK;gBACL,MAAM;AACP,aAAA;;YAED,QAAQ,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE;YACzC,OAAO;AACR,SAAA,CAAC;IACJ;IAEA,MAAM,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,KAAK;IAC3C,OAAO,IAAI,QAAQ,CAAC;AAClB,QAAA,IAAI,EAAE,IAAI;AACV,QAAA,IAAI,EAAE,IAAI;AACV,QAAA,cAAc,EAAE;YACd,KAAK;YACL,MAAM;AACP,SAAA;QACD,OAAO;AACR,KAAA,CAAC;AACJ,CAAC;AAED,MAAM,eAAe,GAAG,CACtB,IAAwB,KACM;AAC9B,IAAA,IAAI,CAAC,IAAI;AAAE,QAAA,OAAO,KAAK;AACvB,IAAA,IAAK,cAAoC,CAAC,QAAQ,CAAC,IAAI,CAAC,EAAE;AACxD,QAAA,OAAO,IAAI;IACb;AACA,IAAA,OAAO,KAAK;AACd,CAAC;AAUD,MAAM,aAAa,GAAW,OAAO,GAAG,KAAI;AAC1C,IAAA,MAAM,GAAG,GAAG,MAAM,KAAK,CAAC,GAAG,CAAC;AAC5B,IAAA,OAAO,GAAG,CAAC,WAAW,EAAE;AAC1B,CAAC;AAED,MAAM,eAAe,GAAe,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,KAAI;AACtE,IAAA,MAAM,OAAO,GAAG,IAAI,IAAI,CAAC,CAAC,MAAM,CAAC,EAAE,EAAE,IAAI,EAAE,eAAe,EAAE,CAAC;IAC7D,MAAM,GAAG,GAAG,GAAG,CAAC,eAAe,CAAC,OAAO,CAAC;AAExC,IAAA,IAAI;AACF,QAAA,MAAM,GAAG,GAAG,IAAI,KAAK,EAAE;AACvB,QAAA,GAAG,CAAC,GAAG,GAAG,GAAG;AACb,QAAA,MAAM,GAAG,CAAC,MAAM,EAAE;AAElB,QAAA,MAAM,GAAG,GAAG,MAAM,CAAC,gBAAgB;QAEnC,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC;AAC/C,QAAA,MAAM,WAAW,GAAG,KAAK,GAAG,GAAG;AAC/B,QAAA,MAAM,YAAY,GAAG,MAAM,GAAG,GAAG;AACjC,QAAA,MAAM,CAAC,KAAK,GAAG,WAAW;AAC1B,QAAA,MAAM,CAAC,MAAM,GAAG,YAAY;QAC5B,MAAM,GAAG,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAE;AACpC,QAAA,GAAG,CAAC,SAAS,CAAC,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,WAAW,EAAE,YAAY,CAAC;AAEnD,QAAA,OAAO,IAAI,OAAO,CAAc,CAAC,OAAO,KAAI;AAC1C,YAAA,MAAM,CAAC,MAAM,CAAC,CAAC,IAAI,KAAI;gBACrB,IAAK,CAAC,WAAW,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC;YACnC,CAAC,EAAE,WAAW,CAAC;AACjB,QAAA,CAAC,CAAC;IACJ;YAAU;AACR,QAAA,GAAG,CAAC,eAAe,CAAC,GAAG,CAAC;IAC1B;AACF,CAAC;AAeD;;AAEG;AACI,MAAM,WAAW,GAAG,CAAC,EAC1B,IAAI,GAAG,aAAa,EACpB,WAAW,GAAG,eAAe,GAAA,GACP,EAAE,KAAsB;AAC9C,IAAA,MAAM,MAAM,GAAG,IAAI,GAAG,EAAqB;IAE3C,OAAO,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,KAAI;QACpC,MAAM,SAAS,GAAuC,EAAE;QACxD,KAAK,CAAC,IAAI,EAAE,OAAO,EAAE,CAAC,IAAI,KAAI;AAC5B,YAAA,SAAS,CAAC,IAAI,CAAC,IAAI,CAAC;AACtB,QAAA,CAAC,CAAC;QACF,KAAK,CAAC,IAAI,EAAE,gBAAgB,EAAE,CAAC,IAAI,KAAI;YACrC,MAAM,UAAU,GAAG,UAAU,CAAC,IAAI,CAAC,UAAU,CAAE;YAC/C,IAAI,UAAU,EAAE;AACd,gBAAA,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC;YAC5B;AACF,QAAA,CAAC,CAAC;AAEF,QAAA,IAAI,SAAS,CAAC,MAAM,KAAK,CAAC,EAAE;AAC1B,YAAA,MAAM,QAAQ,GAAG,IAAI,GAAG,EAAyB;YACjD,SAAS,CAAC,OAAO,CAAC,CAAC,EAAE,GAAG,EAAE,KAAI;AAC5B,gBAAA,IAAI,CAAC,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE;oBAC1C,QAAQ,CAAC,GAAG,CACV,GAAG,EACH,CAAC,YAAW;AACV,wBAAA,IAAI,IAAiB;AACrB,wBAAA,IAAI;AACF,4BAAA,IAAI,GAAG,MAAM,IAAI,CAAC,GAAG,CAAC;wBACxB;wBAAE,OAAO,CAAC,EAAE;AACV,4BAAA,QAAQ,CAAC,CAAA,sBAAA,EAAyB,GAAG,IAAI,CAAC,CAAA,CAAE,CAAC;4BAC7C;wBACF;AAEA,wBAAA,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,GAAG,SAAS,CAAC,IAAI,UAAU,CAAC,IAAI,CAAC,CAAC;AAC/D,wBAAA,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,EAAE;AAC1B,4BAAA,QAAQ,CAAC,CAAA,0BAAA,EAA6B,IAAI,CAAA,CAAE,CAAC;4BAC7C;wBACF;AAEA,wBAAA,IAAI,IAAI,KAAK,KAAK,EAAE;AAClB,4BAAA,IAAI;AACF,gCAAA,MAAM,QAAQ,GAAG,MAAM,WAAW,CAAC;AACjC,oCAAA,MAAM,EAAE,IAAI;oCACZ,KAAK;oCACL,MAAM;AACP,iCAAA,CAAC;AACF,gCAAA,MAAM,CAAC,GAAG,CAAC,GAAG,EAAE;oCACd,IAAI;oCACJ,KAAK;oCACL,MAAM;oCACN,IAAI;AACJ,oCAAA,QAAQ,EAAE,QAAQ;AACnB,iCAAA,CAAC;4BACJ;4BAAE,OAAO,CAAC,EAAE;AACV,gCAAA,QAAQ,CAAC,CAAA,iCAAA,EAAoC,GAAG,IAAI,CAAC,CAAA,CAAE,CAAC;gCACxD;4BACF;wBACF;6BAAO;AACL,4BAAA,MAAM,CAAC,GAAG,CAAC,GAAG,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC;wBAChD;oBACF,CAAC,GAAG,CACL;gBACH;AACF,YAAA,CAAC,CAAC;YAEF,MAAM,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC;QACtC;QAEA,OAAO;AACL,YAAA,KAAK,EAAE,CAAC,IAAI,KAAI;gBACd,MAAM,IAAI,GAAG,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC;gBACjC,IAAI,CAAC,IAAI,EAAE;AACT,oBAAA,OAAO,EAAE;gBACX;AACA,gBAAA,OAAO,UAAU,CAAC,IAAI,EAAE,IAAI,CAAC;YAC/B,CAAC;AACD,YAAA,cAAc,EAAE,CAAC,IAAI,KAAI;gBACvB,MAAM,GAAG,GAAG,UAAU,CAAC,IAAI,CAAC,UAAU,CAAC;AACvC,gBAAA,IAAI,GAAG,IAAI,IAAI,EAAE;AACf,oBAAA,OAAO,EAAE;gBACX;gBACA,MAAM,IAAI,GAAG,MAAM,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,CAAC;gBAChC,IAAI,CAAC,IAAI,EAAE;AACT,oBAAA,OAAO,EAAE;gBACX;AACA,gBAAA,OAAO,UAAU,CAAC,IAAI,EAAE,IAAI,CAAC;YAC/B,CAAC;SACF;AACH,IAAA,CAAC;AACH;;;;"}
|