@maizzle/framework 6.0.0-rc.21 → 6.0.0-rc.23
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/dist/build.d.ts.map +1 -1
- package/dist/build.js +11 -0
- package/dist/build.js.map +1 -1
- package/dist/components/Body.vue +1 -1
- package/dist/components/CodeBlock.vue +1 -1
- package/dist/components/CodeInline.vue +72 -2
- package/dist/components/Column.vue +2 -1
- package/dist/components/Container.vue +1 -11
- package/dist/components/Heading.vue +1 -1
- package/dist/components/Img.vue +252 -7
- package/dist/components/Link.vue +1 -1
- package/dist/components/Preheader.vue +35 -5
- package/dist/components/Section.vue +9 -14
- package/dist/components/Tailwind.vue +4 -2
- package/dist/components/Text.vue +2 -2
- package/dist/components/Vml.vue +354 -0
- package/dist/components/utils.d.ts.map +1 -1
- package/dist/components/utils.js.map +1 -1
- package/dist/composables/defineConfig.d.ts +3 -4
- package/dist/composables/defineConfig.d.ts.map +1 -1
- package/dist/composables/defineConfig.js +3 -4
- package/dist/composables/defineConfig.js.map +1 -1
- package/dist/composables/renderContext.d.ts +0 -1
- package/dist/composables/renderContext.d.ts.map +1 -1
- package/dist/composables/renderContext.js.map +1 -1
- package/dist/composables/useBaseUrl.d.ts.map +1 -1
- package/dist/composables/useBaseUrl.js.map +1 -1
- package/dist/composables/useConfig.d.ts.map +1 -1
- package/dist/composables/useConfig.js.map +1 -1
- package/dist/composables/useCurrentTemplate.d.ts.map +1 -1
- package/dist/composables/useCurrentTemplate.js +10 -3
- package/dist/composables/useCurrentTemplate.js.map +1 -1
- package/dist/composables/useDoctype.d.ts.map +1 -1
- package/dist/composables/useDoctype.js.map +1 -1
- package/dist/composables/useEvent.js.map +1 -1
- package/dist/composables/useFont.d.ts.map +1 -1
- package/dist/composables/useFont.js.map +1 -1
- package/dist/composables/useOutlookFallback.d.ts.map +1 -1
- package/dist/composables/useOutlookFallback.js.map +1 -1
- package/dist/composables/usePlaintext.d.ts.map +1 -1
- package/dist/composables/usePlaintext.js.map +1 -1
- package/dist/composables/usePreheader.d.ts +6 -5
- package/dist/composables/usePreheader.d.ts.map +1 -1
- package/dist/composables/usePreheader.js +3 -3
- package/dist/composables/usePreheader.js.map +1 -1
- package/dist/composables/useTransformers.d.ts +1 -1
- package/dist/composables/useTransformers.d.ts.map +1 -1
- package/dist/composables/useTransformers.js +1 -1
- package/dist/composables/useTransformers.js.map +1 -1
- package/dist/composables/useUrlQuery.d.ts.map +1 -1
- package/dist/composables/useUrlQuery.js.map +1 -1
- package/dist/config/defaults.d.ts.map +1 -1
- package/dist/config/defaults.js.map +1 -1
- package/dist/config/index.js +12 -0
- package/dist/config/index.js.map +1 -1
- package/dist/events/index.d.ts +5 -0
- package/dist/events/index.d.ts.map +1 -1
- package/dist/events/index.js +5 -0
- package/dist/events/index.js.map +1 -1
- package/dist/index.d.ts +2 -2
- package/dist/index.js +2 -2
- package/dist/plaintext.d.ts.map +1 -1
- package/dist/plaintext.js.map +1 -1
- package/dist/plugin.js.map +1 -1
- package/dist/plugins/postcss/mergeMediaQueries.d.ts.map +1 -1
- package/dist/plugins/postcss/mergeMediaQueries.js.map +1 -1
- package/dist/plugins/postcss/pruneVars.d.ts.map +1 -1
- package/dist/plugins/postcss/pruneVars.js.map +1 -1
- package/dist/plugins/postcss/quoteFontFamilies.d.ts.map +1 -1
- package/dist/plugins/postcss/quoteFontFamilies.js.map +1 -1
- package/dist/plugins/postcss/removeDeclarations.d.ts.map +1 -1
- package/dist/plugins/postcss/removeDeclarations.js.map +1 -1
- package/dist/plugins/postcss/resolveMaizzleImports.d.ts.map +1 -1
- package/dist/plugins/postcss/resolveMaizzleImports.js.map +1 -1
- package/dist/plugins/postcss/resolveProps.d.ts.map +1 -1
- package/dist/plugins/postcss/resolveProps.js +14 -0
- package/dist/plugins/postcss/resolveProps.js.map +1 -1
- package/dist/plugins/postcss/tailwindCleanup.d.ts.map +1 -1
- package/dist/plugins/postcss/tailwindCleanup.js.map +1 -1
- package/dist/prepare.d.ts.map +1 -1
- package/dist/prepare.js.map +1 -1
- package/dist/render/active.d.ts.map +1 -1
- package/dist/render/active.js.map +1 -1
- package/dist/render/createRenderer.d.ts.map +1 -1
- package/dist/render/createRenderer.js +91 -3
- package/dist/render/createRenderer.js.map +1 -1
- package/dist/render/index.d.ts.map +1 -1
- package/dist/render/index.js +6 -0
- package/dist/render/index.js.map +1 -1
- package/dist/render/injectFonts.js.map +1 -1
- package/dist/render/plugins/codeBlockExtract.d.ts.map +1 -1
- package/dist/render/plugins/codeBlockExtract.js +4 -0
- package/dist/render/plugins/codeBlockExtract.js.map +1 -1
- package/dist/render/plugins/markdownExtract.d.ts.map +1 -1
- package/dist/render/plugins/markdownExtract.js.map +1 -1
- package/dist/render/plugins/rawExtract.d.ts.map +1 -1
- package/dist/render/plugins/rawExtract.js.map +1 -1
- package/dist/render/plugins/rowSourceLocation.d.ts.map +1 -1
- package/dist/render/plugins/rowSourceLocation.js.map +1 -1
- package/dist/serve.d.ts.map +1 -1
- package/dist/serve.js +48 -15
- package/dist/serve.js.map +1 -1
- package/dist/server/compatibility.d.ts.map +1 -1
- package/dist/server/compatibility.js +48 -0
- package/dist/server/compatibility.js.map +1 -1
- package/dist/server/email.js.map +1 -1
- package/dist/server/linter.js +6 -0
- package/dist/server/linter.js.map +1 -1
- package/dist/server/sfc-utils.d.ts.map +1 -1
- package/dist/server/sfc-utils.js.map +1 -1
- package/dist/server/ui/App.vue +17 -16
- package/dist/server/ui/components/Markdown.vue +17 -0
- package/dist/server/ui/components/SidebarClose.vue +1 -1
- package/dist/server/ui/components/ui/checkbox/Checkbox.vue +1 -1
- package/dist/server/ui/components/ui/command/CommandInput.vue +2 -2
- package/dist/server/ui/components/ui/dialog/DialogContent.vue +1 -1
- package/dist/server/ui/components/ui/dialog/DialogScrollContent.vue +1 -1
- package/dist/server/ui/components/ui/dropdown-menu/DropdownMenuCheckboxItem.vue +1 -1
- package/dist/server/ui/components/ui/dropdown-menu/DropdownMenuRadioItem.vue +1 -1
- package/dist/server/ui/components/ui/dropdown-menu/DropdownMenuSubTrigger.vue +1 -1
- package/dist/server/ui/components/ui/sheet/SheetContent.vue +1 -1
- package/dist/server/ui/components/ui/sidebar/SidebarTrigger.vue +1 -1
- package/dist/server/ui/components/ui/tags-input/TagsInputItemDelete.vue +1 -1
- package/dist/server/ui/lib/emulated-dark-mode.ts +25 -10
- package/dist/server/ui/pages/Home.vue +1 -1
- package/dist/server/ui/pages/Preview.vue +32 -18
- package/dist/tests/render/_helpers.js.map +1 -1
- package/dist/transformers/addAttributes.d.ts +18 -8
- package/dist/transformers/addAttributes.d.ts.map +1 -1
- package/dist/transformers/addAttributes.js +22 -8
- package/dist/transformers/addAttributes.js.map +1 -1
- package/dist/transformers/attributeToStyle.d.ts.map +1 -1
- package/dist/transformers/attributeToStyle.js.map +1 -1
- package/dist/transformers/base.d.ts.map +1 -1
- package/dist/transformers/base.js +4 -0
- package/dist/transformers/base.js.map +1 -1
- package/dist/transformers/columnWidth.d.ts.map +1 -1
- package/dist/transformers/columnWidth.js +136 -150
- package/dist/transformers/columnWidth.js.map +1 -1
- package/dist/transformers/entities.d.ts.map +1 -1
- package/dist/transformers/entities.js +1 -0
- package/dist/transformers/entities.js.map +1 -1
- package/dist/transformers/filters/defaults.d.ts.map +1 -1
- package/dist/transformers/filters/defaults.js.map +1 -1
- package/dist/transformers/filters/index.d.ts.map +1 -1
- package/dist/transformers/filters/index.js.map +1 -1
- package/dist/transformers/format.d.ts.map +1 -1
- package/dist/transformers/format.js.map +1 -1
- package/dist/transformers/index.d.ts.map +1 -1
- package/dist/transformers/index.js +33 -5
- package/dist/transformers/index.js.map +1 -1
- package/dist/transformers/inlineCss.d.ts.map +1 -1
- package/dist/transformers/inlineCss.js +27 -9
- package/dist/transformers/inlineCss.js.map +1 -1
- package/dist/transformers/inlineLink.d.ts.map +1 -1
- package/dist/transformers/inlineLink.js.map +1 -1
- package/dist/transformers/minify.d.ts.map +1 -1
- package/dist/transformers/minify.js.map +1 -1
- package/dist/transformers/minifyCodeInline.d.ts +29 -0
- package/dist/transformers/minifyCodeInline.d.ts.map +1 -0
- package/dist/transformers/minifyCodeInline.js +36 -0
- package/dist/transformers/minifyCodeInline.js.map +1 -0
- package/dist/transformers/msoPlaceholders.d.ts +10 -5
- package/dist/transformers/msoPlaceholders.d.ts.map +1 -1
- package/dist/transformers/msoPlaceholders.js +38 -7
- package/dist/transformers/msoPlaceholders.js.map +1 -1
- package/dist/transformers/purgeCss.d.ts.map +1 -1
- package/dist/transformers/purgeCss.js +29 -3
- package/dist/transformers/purgeCss.js.map +1 -1
- package/dist/transformers/removeAttributes.d.ts.map +1 -1
- package/dist/transformers/removeAttributes.js.map +1 -1
- package/dist/transformers/replaceStrings.d.ts.map +1 -1
- package/dist/transformers/replaceStrings.js.map +1 -1
- package/dist/transformers/safeSelectors.d.ts +37 -0
- package/dist/transformers/safeSelectors.d.ts.map +1 -0
- package/dist/transformers/{safeClassNames.js → safeSelectors.js} +37 -6
- package/dist/transformers/safeSelectors.js.map +1 -0
- package/dist/transformers/shorthandCss.d.ts.map +1 -1
- package/dist/transformers/shorthandCss.js +38 -7
- package/dist/transformers/shorthandCss.js.map +1 -1
- package/dist/transformers/sixHex.d.ts.map +1 -1
- package/dist/transformers/sixHex.js.map +1 -1
- package/dist/transformers/tailwindComponent.js +9 -0
- package/dist/transformers/tailwindComponent.js.map +1 -1
- package/dist/transformers/tailwindcss.d.ts.map +1 -1
- package/dist/transformers/tailwindcss.js +22 -0
- package/dist/transformers/tailwindcss.js.map +1 -1
- package/dist/transformers/urlQuery.d.ts.map +1 -1
- package/dist/transformers/urlQuery.js.map +1 -1
- package/dist/types/config.d.ts +6 -10
- package/dist/types/config.d.ts.map +1 -1
- package/dist/types/index.d.ts +1 -1
- package/dist/utils/ast/parser.d.ts.map +1 -1
- package/dist/utils/ast/parser.js.map +1 -1
- package/dist/utils/ast/serializer.d.ts.map +1 -1
- package/dist/utils/ast/serializer.js +27 -17
- package/dist/utils/ast/serializer.js.map +1 -1
- package/dist/utils/ast/walker.d.ts.map +1 -1
- package/dist/utils/ast/walker.js.map +1 -1
- package/dist/utils/compileTailwindCss.d.ts.map +1 -1
- package/dist/utils/compileTailwindCss.js.map +1 -1
- package/dist/utils/componentSources.d.ts.map +1 -1
- package/dist/utils/componentSources.js.map +1 -1
- package/dist/utils/cssBox.d.ts +42 -0
- package/dist/utils/cssBox.d.ts.map +1 -0
- package/dist/utils/cssBox.js +156 -0
- package/dist/utils/cssBox.js.map +1 -0
- package/dist/utils/decodeStyleEntities.d.ts.map +1 -1
- package/dist/utils/decodeStyleEntities.js.map +1 -1
- package/dist/utils/detect.d.ts.map +1 -1
- package/dist/utils/detect.js.map +1 -1
- package/dist/utils/output-markers.d.ts.map +1 -1
- package/dist/utils/output-markers.js.map +1 -1
- package/dist/utils/url.d.ts.map +1 -1
- package/dist/utils/url.js.map +1 -1
- package/dist/utils/watchPaths.js.map +1 -1
- package/node_modules/@clack/core/CHANGELOG.md +6 -0
- package/node_modules/@clack/core/dist/index.d.mts +1 -1
- package/node_modules/@clack/core/dist/index.mjs +8 -8
- package/node_modules/@clack/core/dist/index.mjs.map +1 -1
- package/node_modules/@clack/core/package.json +1 -1
- package/node_modules/@clack/prompts/CHANGELOG.md +13 -0
- package/node_modules/@clack/prompts/README.md +2 -2
- package/node_modules/@clack/prompts/dist/index.d.mts +98 -0
- package/node_modules/@clack/prompts/dist/index.mjs +122 -121
- package/node_modules/@clack/prompts/dist/index.mjs.map +1 -1
- package/node_modules/@clack/prompts/package.json +2 -2
- package/node_modules/fast-wrap-ansi/lib/main.js +0 -1
- package/node_modules/fast-wrap-ansi/package.json +10 -10
- package/node_modules/maizzle/dist/commands/make/config.mjs +7 -6
- package/node_modules/maizzle/dist/commands/new.mjs +15 -84
- package/node_modules/maizzle/package.json +2 -2
- package/node_modules/tinyexec/README.md +8 -0
- package/node_modules/tinyexec/dist/main.d.mts +16 -1
- package/node_modules/tinyexec/dist/main.mjs +163 -457
- package/node_modules/tinyexec/package.json +12 -14
- package/package.json +3 -4
- package/dist/transformers/safeClassNames.d.ts +0 -22
- package/dist/transformers/safeClassNames.d.ts.map +0 -1
- package/dist/transformers/safeClassNames.js.map +0 -1
- package/node_modules/fast-wrap-ansi/lib/main.js.map +0 -1
- package/node_modules/tinyexec/dist/LICENSES.txt +0 -83
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/transformers/index.ts"],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"index.d.ts","names":[],"sources":["../../src/transformers/index.ts"],"mappings":";;;;;;AAuDA;;;;;;;;;;;;;;;;;AAMU;;;;;;;;;;;iBANY,eAAA,CACpB,IAAA,UACA,MAAA,EAAQ,aAAA,EACR,QAAA,WACA,OAAA,WACA,cAAA,GAAiB,aAAA,KAChB,OAAA"}
|
|
@@ -4,7 +4,7 @@ import "../utils/ast/index.js";
|
|
|
4
4
|
import { inlineLinkDom } from "./inlineLink.js";
|
|
5
5
|
import { tailwindComponent } from "./tailwindComponent.js";
|
|
6
6
|
import { tailwindcss } from "./tailwindcss.js";
|
|
7
|
-
import {
|
|
7
|
+
import { safeSelectorsDom } from "./safeSelectors.js";
|
|
8
8
|
import { attributeToStyleDom } from "./attributeToStyle.js";
|
|
9
9
|
import { inlineCssDom } from "./inlineCss.js";
|
|
10
10
|
import { msoPlaceholders } from "./msoPlaceholders.js";
|
|
@@ -12,7 +12,7 @@ import { columnWidth } from "./columnWidth.js";
|
|
|
12
12
|
import { removeAttributesDom } from "./removeAttributes.js";
|
|
13
13
|
import { shorthandCssDom } from "./shorthandCss.js";
|
|
14
14
|
import { sixHexDom } from "./sixHex.js";
|
|
15
|
-
import {
|
|
15
|
+
import { addAttributesDom } from "./addAttributes.js";
|
|
16
16
|
import { filtersDom } from "./filters/index.js";
|
|
17
17
|
import { baseDom } from "./base.js";
|
|
18
18
|
import { entitiesDom } from "./entities.js";
|
|
@@ -20,6 +20,7 @@ import { urlQueryDom } from "./urlQuery.js";
|
|
|
20
20
|
import { purgeCssDom } from "./purgeCss.js";
|
|
21
21
|
import { replaceStrings } from "./replaceStrings.js";
|
|
22
22
|
import { format } from "./format.js";
|
|
23
|
+
import { minifyCodeInline } from "./minifyCodeInline.js";
|
|
23
24
|
import { minify } from "./minify.js";
|
|
24
25
|
//#region src/transformers/index.ts
|
|
25
26
|
/**
|
|
@@ -53,6 +54,18 @@ import { minify } from "./minify.js";
|
|
|
53
54
|
* 16. Minify
|
|
54
55
|
*/
|
|
55
56
|
async function runTransformers(html, config, filePath, doctype, tailwindBlocks) {
|
|
57
|
+
/**
|
|
58
|
+
* Per-transformer skip map — only honored when useTransformers is an object.
|
|
59
|
+
* Whole-pipeline opt-out (`useTransformers === false`) is handled upstream
|
|
60
|
+
* in build.ts / render so we never reach this function in that case.
|
|
61
|
+
*
|
|
62
|
+
* A toggle set to `true` *force-enables* its transformer for this run
|
|
63
|
+
* by layering on the matching config slice (e.g. `prettify: true`
|
|
64
|
+
* sets `html.format = true`). This only applies to transformers
|
|
65
|
+
* whose enable flag is a plain boolean — data-driven ones
|
|
66
|
+
* (filters, baseURL, urlQuery, etc.) need actual config
|
|
67
|
+
* values, so a bare `true` for those is a no-op.
|
|
68
|
+
*/
|
|
56
69
|
const toggles = typeof config.useTransformers === "object" ? config.useTransformers : null;
|
|
57
70
|
const enabled = (key) => toggles?.[key] !== false;
|
|
58
71
|
let effective = config;
|
|
@@ -61,7 +74,7 @@ async function runTransformers(html, config, filePath, doctype, tailwindBlocks)
|
|
|
61
74
|
const htmlOver = {};
|
|
62
75
|
if (toggles.inlineCss === true) cssOver.inline = true;
|
|
63
76
|
if (toggles.purgeCss === true) cssOver.purge = true;
|
|
64
|
-
if (toggles.
|
|
77
|
+
if (toggles.safeSelectors === true) cssOver.safe = true;
|
|
65
78
|
if (toggles.shorthandCss === true) cssOver.shorthand = true;
|
|
66
79
|
if (toggles.sixHex === true) cssOver.sixHex = true;
|
|
67
80
|
if (toggles.prettify === true) htmlOver.format = true;
|
|
@@ -83,7 +96,7 @@ async function runTransformers(html, config, filePath, doctype, tailwindBlocks)
|
|
|
83
96
|
dom = await inlineLinkDom(dom, filePath);
|
|
84
97
|
if (tailwindBlocks?.length) dom = await tailwindComponent(dom, tailwindBlocks, effective, filePath);
|
|
85
98
|
dom = await tailwindcss(dom, effective, filePath);
|
|
86
|
-
if (enabled("
|
|
99
|
+
if (enabled("safeSelectors")) dom = safeSelectorsDom(dom, effective.css);
|
|
87
100
|
if (enabled("attributeToStyle") && typeof effective.css?.inline === "object" && effective.css.inline.attributeToStyle) dom = attributeToStyleDom(dom, effective.css.inline.attributeToStyle);
|
|
88
101
|
if (enabled("inlineCss") && effective.css?.inline) {
|
|
89
102
|
const inlineOptions = typeof effective.css.inline === "object" ? effective.css.inline : {};
|
|
@@ -100,7 +113,7 @@ async function runTransformers(html, config, filePath, doctype, tailwindBlocks)
|
|
|
100
113
|
dom = shorthandCssDom(dom, shorthandOptions);
|
|
101
114
|
}
|
|
102
115
|
if (enabled("sixHex") && effective.css?.sixHex !== false) dom = sixHexDom(dom);
|
|
103
|
-
if (enabled("addAttributes")) dom =
|
|
116
|
+
if (enabled("addAttributes")) dom = addAttributesDom(dom, effective.html?.attributes);
|
|
104
117
|
if (enabled("filters")) dom = filtersDom(dom, effective.filters);
|
|
105
118
|
if (enabled("baseURL") && effective.url?.base) dom = baseDom(dom, effective.url.base);
|
|
106
119
|
if (enabled("urlQuery") && effective.url?.query && Object.keys(effective.url.query).length > 0) {
|
|
@@ -124,7 +137,22 @@ async function runTransformers(html, config, filePath, doctype, tailwindBlocks)
|
|
|
124
137
|
const minifyOptions = typeof effective.html.minify === "object" ? effective.html.minify : {};
|
|
125
138
|
result = minify(result, minifyOptions);
|
|
126
139
|
}
|
|
140
|
+
/**
|
|
141
|
+
* Strip self-closing slashes for HTML5 doctypes, but preserve content
|
|
142
|
+
* inside MSO conditional comments (XML-ish, case/syntax sensitive).
|
|
143
|
+
* MUST run BEFORE minifyCodeInline: at this point, CodeInline's
|
|
144
|
+
* shiki output is still marker-encoded (§MZLT§/§MZGT§), so any
|
|
145
|
+
* ` />` in the highlighted source code (e.g. a Vue self-close
|
|
146
|
+
* tag) hasn't materialized yet and can't be mistakenly
|
|
147
|
+
* stripped from inside a `<code>` element.
|
|
148
|
+
*/
|
|
127
149
|
if (!isXhtml) result = result.replace(/<!--\[if [^\]]*\]>[\s\S]*?<!\[endif\]-->|( \/>)/g, (match, selfClose) => selfClose ? ">" : match);
|
|
150
|
+
/**
|
|
151
|
+
* 16.5. Strip whitespace inside `data-minify-inline` markers (CodeInline's
|
|
152
|
+
* Shiki output, etc.). Runs after format/minify so it cleans up the
|
|
153
|
+
* pretty-printer's indentation between sibling tags.
|
|
154
|
+
*/
|
|
155
|
+
result = minifyCodeInline(result);
|
|
128
156
|
return result;
|
|
129
157
|
}
|
|
130
158
|
//#endregion
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../src/transformers/index.ts"],"sourcesContent":["import { parse, serialize } from '../utils/ast/index.ts'\nimport { inlineLinkDom } from './inlineLink.ts'\nimport { tailwindComponent } from './tailwindComponent.ts'\nimport { tailwindcss } from './tailwindcss.ts'\nimport { safeClassNames } from './safeClassNames.ts'\nimport { attributeToStyleDom } from './attributeToStyle.ts'\nimport { inlineCssDom } from './inlineCss.ts'\nimport { msoPlaceholders } from './msoPlaceholders.ts'\nimport { columnWidth } from './columnWidth.ts'\nimport { removeAttributesDom } from './removeAttributes.ts'\nimport { shorthandCssDom } from './shorthandCss.ts'\nimport { sixHexDom } from './sixHex.ts'\nimport { addAttributes } from './addAttributes.ts'\nimport { filtersDom } from './filters/index.ts'\nimport { baseDom } from './base.ts'\nimport { entitiesDom } from './entities.ts'\nimport { urlQueryDom } from './urlQuery.ts'\nimport { purgeCssDom } from './purgeCss.ts'\nimport { replaceStrings } from './replaceStrings.ts'\nimport { format } from './format.ts'\nimport { minify } from './minify.ts'\nimport type { MaizzleConfig } from '../types/config.ts'\nimport type { TailwindBlock } from '../composables/renderContext.ts'\n\n/**\n * Run all Maizzle transformers on the rendered HTML.\n *\n * The HTML is parsed into a DOM once at the start and passed through all\n * DOM-based transformers as a shared `ChildNode[]`. After all DOM transformers\n * complete, the DOM is serialized back to a string exactly once.\n *\n * String-only transformers (those that rely on external tools that require a\n * raw HTML string) then run on the serialized output.\n *\n * Transformers run in a specific order:\n * 0. Inline link stylesheets — replace `<link rel=\"stylesheet\">` with `<style>` tags\n * 1. Tailwind CSS — compile CSS, lower syntax, optimize (cleanup + merge media queries)\n * 2. Safe class names\n * 3. Attribute to style\n * 4. CSS inliner\n * 5. Remove attributes\n * 6. Shorthand CSS\n * 7. Six-digit HEX\n * 8. Add attributes\n * 9. Filters\n * 10. Base URL\n * 11. URL query\n * 12. Purge CSS (serializes/parses internally around email-comb)\n * 13. Entities\n * + Vue-generated comments stripped here (on serialized string)\n * 14. Replace strings\n * 15. Prettify\n * 16. Minify\n */\nexport async function runTransformers(\n html: string,\n config: MaizzleConfig,\n filePath?: string,\n doctype?: string,\n tailwindBlocks?: TailwindBlock[],\n): Promise<string> {\n // Per-transformer skip map — only honored when useTransformers is an object.\n // Whole-pipeline opt-out (`useTransformers === false`) is handled upstream\n // in build.ts / render so we never reach this function in that case.\n //\n // A toggle set to `true` *force-enables* its transformer for this run by\n // layering on the matching config slice (e.g. `prettify: true` sets\n // `html.format = true`). This only applies to transformers whose\n // enable flag is a plain boolean — data-driven ones (filters,\n // baseURL, urlQuery, etc.) need actual config values, so a\n // bare `true` for those is a no-op.\n const toggles = typeof config.useTransformers === 'object' ? config.useTransformers : null\n const enabled = (key: keyof NonNullable<typeof toggles>) => toggles?.[key] !== false\n\n let effective = config\n if (toggles) {\n const cssOver: Record<string, unknown> = {}\n const htmlOver: Record<string, unknown> = {}\n if (toggles.inlineCss === true) cssOver.inline = true\n if (toggles.purgeCss === true) cssOver.purge = true\n if (toggles.safeClassNames === true) cssOver.safe = true\n if (toggles.shorthandCss === true) cssOver.shorthand = true\n if (toggles.sixHex === true) cssOver.sixHex = true\n if (toggles.prettify === true) htmlOver.format = true\n if (toggles.minify === true) htmlOver.minify = true\n if (toggles.entities === true) htmlOver.decodeEntities = true\n\n if (Object.keys(cssOver).length || Object.keys(htmlOver).length) {\n effective = {\n ...config,\n css: { ...config.css, ...cssOver },\n html: { ...config.html, ...htmlOver },\n }\n }\n }\n\n // Parse once — all DOM transformers share this array\n let dom = parse(html)\n\n // 0. Inline <link> stylesheets\n dom = await inlineLinkDom(dom, filePath)\n\n // 0.5. <Tailwind> component — compile per-block scoped CSS, inject into <head>\n if (tailwindBlocks?.length) {\n dom = await tailwindComponent(dom, tailwindBlocks, effective, filePath)\n }\n\n // 1. Tailwind CSS — always runs first\n dom = await tailwindcss(dom, effective, filePath)\n\n // 2. Safe class names\n if (enabled('safeClassNames')) dom = safeClassNames(dom, effective.css)\n\n // 3. Attribute to style\n if (enabled('attributeToStyle') && typeof effective.css?.inline === 'object' && effective.css.inline.attributeToStyle) {\n dom = attributeToStyleDom(dom, effective.css.inline.attributeToStyle)\n }\n\n // 4. CSS inliner (serializes/parses internally around juice)\n if (enabled('inlineCss') && effective.css?.inline) {\n const inlineOptions = typeof effective.css.inline === 'object' ? effective.css.inline : {}\n dom = inlineCssDom(dom, inlineOptions)\n }\n\n // 4.5. Resolve MSO placeholders (table width + td style) from inlined CSS\n dom = msoPlaceholders(dom)\n\n // 4.6. Resolve Column min-width placeholders from nearest sized ancestor\n dom = columnWidth(dom)\n\n // 5. Remove attributes\n if (enabled('removeAttributes')) {\n const removeRules = effective.html?.attributes?.remove\n dom = removeAttributesDom(dom, Array.isArray(removeRules) ? removeRules : [])\n }\n\n // 6. Shorthand CSS\n if (enabled('shorthandCss') && effective.css?.shorthand) {\n const shorthandOptions = typeof effective.css.shorthand === 'object' ? effective.css.shorthand : {}\n dom = shorthandCssDom(dom, shorthandOptions)\n }\n\n // 7. Six-digit HEX\n if (enabled('sixHex') && effective.css?.sixHex !== false) dom = sixHexDom(dom)\n\n // 8. Add attributes\n if (enabled('addAttributes')) dom = addAttributes(dom, effective.html?.attributes)\n\n // 9. Filters\n if (enabled('filters')) dom = filtersDom(dom, effective.filters)\n\n // 10. Base URL (serializes/parses internally for VML/MSO regex passes)\n if (enabled('baseURL') && effective.url?.base) dom = baseDom(dom, effective.url.base)\n\n // 11. URL query\n if (enabled('urlQuery') && effective.url?.query && Object.keys(effective.url.query).length > 0) {\n const { _options: queryOptions, ...queryParams } = effective.url.query as Record<string, unknown>\n dom = urlQueryDom(dom, queryParams, (queryOptions ?? {}) as import('../types/config.ts').UrlQueryOptions)\n }\n\n // 12. Remove unused CSS (serializes/parses internally around email-comb)\n if (enabled('purgeCss') && effective.css?.purge) {\n const purgeOptions = typeof effective.css.purge === 'object' ? effective.css.purge : {}\n dom = purgeCssDom(dom, purgeOptions)\n }\n\n // 13. Entities\n if (enabled('entities')) dom = entitiesDom(dom, effective.html?.decodeEntities)\n\n // Serialize once — remaining transformers operate on the HTML string\n const isXhtml = doctype ? /xhtml/i.test(doctype) : false\n let result = serialize(dom, { selfClosingTags: isXhtml })\n\n // 14. Replace strings\n if (enabled('replaceStrings')) result = replaceStrings(result, effective)\n\n // 15. Format — skipped when `minify` is enabled\n const minifyWillRun = enabled('minify') && !!effective.html?.minify\n if (enabled('prettify') && !minifyWillRun && effective.html?.format) {\n const formatOptions = typeof effective.html.format === 'object' ? effective.html.format : {}\n result = await format(result, formatOptions)\n }\n\n // 16. Minify\n if (enabled('minify') && effective.html?.minify) {\n const minifyOptions = typeof effective.html.minify === 'object' ? effective.html.minify : {}\n result = minify(result, minifyOptions)\n }\n\n // Strip self-closing slashes for HTML5 doctypes, but preserve content\n // inside MSO conditional comments (which are XML-ish and case/syntax sensitive).\n if (!isXhtml) {\n result = result.replace(\n /<!--\\[if [^\\]]*\\]>[\\s\\S]*?<!\\[endif\\]-->|( \\/>)/g,\n (match, selfClose) => selfClose ? '>' : match,\n )\n }\n\n return result\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../src/transformers/index.ts"],"sourcesContent":["import { parse, serialize } from '../utils/ast/index.ts'\nimport { inlineLinkDom } from './inlineLink.ts'\nimport { tailwindComponent } from './tailwindComponent.ts'\nimport { tailwindcss } from './tailwindcss.ts'\nimport { safeSelectorsDom } from './safeSelectors.ts'\nimport { attributeToStyleDom } from './attributeToStyle.ts'\nimport { inlineCssDom } from './inlineCss.ts'\nimport { msoPlaceholders } from './msoPlaceholders.ts'\nimport { columnWidth } from './columnWidth.ts'\nimport { removeAttributesDom } from './removeAttributes.ts'\nimport { shorthandCssDom } from './shorthandCss.ts'\nimport { sixHexDom } from './sixHex.ts'\nimport { addAttributesDom } from './addAttributes.ts'\nimport { filtersDom } from './filters/index.ts'\nimport { baseDom } from './base.ts'\nimport { entitiesDom } from './entities.ts'\nimport { urlQueryDom } from './urlQuery.ts'\nimport { purgeCssDom } from './purgeCss.ts'\nimport { replaceStrings } from './replaceStrings.ts'\nimport { format } from './format.ts'\nimport { minifyCodeInline } from './minifyCodeInline.ts'\nimport { minify } from './minify.ts'\nimport type { MaizzleConfig } from '../types/config.ts'\nimport type { TailwindBlock } from '../composables/renderContext.ts'\n\n/**\n * Run all Maizzle transformers on the rendered HTML.\n *\n * The HTML is parsed into a DOM once at the start and passed through all\n * DOM-based transformers as a shared `ChildNode[]`. After all DOM transformers\n * complete, the DOM is serialized back to a string exactly once.\n *\n * String-only transformers (those that rely on external tools that require a\n * raw HTML string) then run on the serialized output.\n *\n * Transformers run in a specific order:\n * 0. Inline link stylesheets — replace `<link rel=\"stylesheet\">` with `<style>` tags\n * 1. Tailwind CSS — compile CSS, lower syntax, optimize (cleanup + merge media queries)\n * 2. Safe class names\n * 3. Attribute to style\n * 4. CSS inliner\n * 5. Remove attributes\n * 6. Shorthand CSS\n * 7. Six-digit HEX\n * 8. Add attributes\n * 9. Filters\n * 10. Base URL\n * 11. URL query\n * 12. Purge CSS (serializes/parses internally around email-comb)\n * 13. Entities\n * + Vue-generated comments stripped here (on serialized string)\n * 14. Replace strings\n * 15. Prettify\n * 16. Minify\n */\nexport async function runTransformers(\n html: string,\n config: MaizzleConfig,\n filePath?: string,\n doctype?: string,\n tailwindBlocks?: TailwindBlock[],\n): Promise<string> {\n /**\n * Per-transformer skip map — only honored when useTransformers is an object.\n * Whole-pipeline opt-out (`useTransformers === false`) is handled upstream\n * in build.ts / render so we never reach this function in that case.\n *\n * A toggle set to `true` *force-enables* its transformer for this run\n * by layering on the matching config slice (e.g. `prettify: true`\n * sets `html.format = true`). This only applies to transformers\n * whose enable flag is a plain boolean — data-driven ones\n * (filters, baseURL, urlQuery, etc.) need actual config\n * values, so a bare `true` for those is a no-op.\n */\n const toggles = typeof config.useTransformers === 'object' ? config.useTransformers : null\n const enabled = (key: keyof NonNullable<typeof toggles>) => toggles?.[key] !== false\n\n let effective = config\n if (toggles) {\n const cssOver: Record<string, unknown> = {}\n const htmlOver: Record<string, unknown> = {}\n if (toggles.inlineCss === true) cssOver.inline = true\n if (toggles.purgeCss === true) cssOver.purge = true\n if (toggles.safeSelectors === true) cssOver.safe = true\n if (toggles.shorthandCss === true) cssOver.shorthand = true\n if (toggles.sixHex === true) cssOver.sixHex = true\n if (toggles.prettify === true) htmlOver.format = true\n if (toggles.minify === true) htmlOver.minify = true\n if (toggles.entities === true) htmlOver.decodeEntities = true\n\n if (Object.keys(cssOver).length || Object.keys(htmlOver).length) {\n effective = {\n ...config,\n css: { ...config.css, ...cssOver },\n html: { ...config.html, ...htmlOver },\n }\n }\n }\n\n // Parse once — all DOM transformers share this array\n let dom = parse(html)\n\n // 0. Inline <link> stylesheets\n dom = await inlineLinkDom(dom, filePath)\n\n // 0.5. <Tailwind> component — compile per-block scoped CSS, inject into <head>\n if (tailwindBlocks?.length) {\n dom = await tailwindComponent(dom, tailwindBlocks, effective, filePath)\n }\n\n // 1. Tailwind CSS — always runs first\n dom = await tailwindcss(dom, effective, filePath)\n\n // 2. Safe class names\n if (enabled('safeSelectors')) dom = safeSelectorsDom(dom, effective.css)\n\n // 3. Attribute to style\n if (enabled('attributeToStyle') && typeof effective.css?.inline === 'object' && effective.css.inline.attributeToStyle) {\n dom = attributeToStyleDom(dom, effective.css.inline.attributeToStyle)\n }\n\n // 4. CSS inliner (serializes/parses internally around juice)\n if (enabled('inlineCss') && effective.css?.inline) {\n const inlineOptions = typeof effective.css.inline === 'object' ? effective.css.inline : {}\n dom = inlineCssDom(dom, inlineOptions)\n }\n\n // 4.5. Resolve MSO placeholders (table width + td style) from inlined CSS\n dom = msoPlaceholders(dom)\n\n // 4.6. Resolve Column min-width placeholders from nearest sized ancestor\n dom = columnWidth(dom)\n\n // 5. Remove attributes\n if (enabled('removeAttributes')) {\n const removeRules = effective.html?.attributes?.remove\n dom = removeAttributesDom(dom, Array.isArray(removeRules) ? removeRules : [])\n }\n\n // 6. Shorthand CSS\n if (enabled('shorthandCss') && effective.css?.shorthand) {\n const shorthandOptions = typeof effective.css.shorthand === 'object' ? effective.css.shorthand : {}\n dom = shorthandCssDom(dom, shorthandOptions)\n }\n\n // 7. Six-digit HEX\n if (enabled('sixHex') && effective.css?.sixHex !== false) dom = sixHexDom(dom)\n\n // 8. Add attributes\n if (enabled('addAttributes')) dom = addAttributesDom(dom, effective.html?.attributes)\n\n // 9. Filters\n if (enabled('filters')) dom = filtersDom(dom, effective.filters)\n\n // 10. Base URL (serializes/parses internally for VML/MSO regex passes)\n if (enabled('baseURL') && effective.url?.base) dom = baseDom(dom, effective.url.base)\n\n // 11. URL query\n if (enabled('urlQuery') && effective.url?.query && Object.keys(effective.url.query).length > 0) {\n const { _options: queryOptions, ...queryParams } = effective.url.query as Record<string, unknown>\n dom = urlQueryDom(dom, queryParams, (queryOptions ?? {}) as import('../types/config.ts').UrlQueryOptions)\n }\n\n // 12. Remove unused CSS (serializes/parses internally around email-comb)\n if (enabled('purgeCss') && effective.css?.purge) {\n const purgeOptions = typeof effective.css.purge === 'object' ? effective.css.purge : {}\n dom = purgeCssDom(dom, purgeOptions)\n }\n\n // 13. Entities\n if (enabled('entities')) dom = entitiesDom(dom, effective.html?.decodeEntities)\n\n // Serialize once — remaining transformers operate on the HTML string\n const isXhtml = doctype ? /xhtml/i.test(doctype) : false\n let result = serialize(dom, { selfClosingTags: isXhtml })\n\n // 14. Replace strings\n if (enabled('replaceStrings')) result = replaceStrings(result, effective)\n\n // 15. Format — skipped when `minify` is enabled\n const minifyWillRun = enabled('minify') && !!effective.html?.minify\n if (enabled('prettify') && !minifyWillRun && effective.html?.format) {\n const formatOptions = typeof effective.html.format === 'object' ? effective.html.format : {}\n result = await format(result, formatOptions)\n }\n\n // 16. Minify\n if (enabled('minify') && effective.html?.minify) {\n const minifyOptions = typeof effective.html.minify === 'object' ? effective.html.minify : {}\n result = minify(result, minifyOptions)\n }\n\n /**\n * Strip self-closing slashes for HTML5 doctypes, but preserve content\n * inside MSO conditional comments (XML-ish, case/syntax sensitive).\n * MUST run BEFORE minifyCodeInline: at this point, CodeInline's\n * shiki output is still marker-encoded (§MZLT§/§MZGT§), so any\n * ` />` in the highlighted source code (e.g. a Vue self-close\n * tag) hasn't materialized yet and can't be mistakenly\n * stripped from inside a `<code>` element.\n */\n if (!isXhtml) {\n result = result.replace(\n /<!--\\[if [^\\]]*\\]>[\\s\\S]*?<!\\[endif\\]-->|( \\/>)/g,\n (match, selfClose) => selfClose ? '>' : match,\n )\n }\n\n /**\n * 16.5. Strip whitespace inside `data-minify-inline` markers (CodeInline's\n * Shiki output, etc.). Runs after format/minify so it cleans up the\n * pretty-printer's indentation between sibling tags.\n */\n result = minifyCodeInline(result)\n\n return result\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"inlineCss.d.ts","names":[],"sources":["../../src/transformers/inlineCss.ts"],"mappings":";;;;;;AASA;;UAAiB,gBAAA,SAAyB,OAAA;EAuBrB;;;;;EAjBnB,oBAAA;EAAA;;;;;;EAOA,QAAA;EA6BA;;;;EAxBA,SAAA;EA6BgD
|
|
1
|
+
{"version":3,"file":"inlineCss.d.ts","names":[],"sources":["../../src/transformers/inlineCss.ts"],"mappings":";;;;;;AASA;;UAAiB,gBAAA,SAAyB,OAAA;EAuBrB;;;;;EAjBnB,oBAAA;EAAA;;;;;;EAOA,QAAA;EA6BA;;;;EAxBA,SAAA;EA6BgD;AAAA;AAiBlD;;EAzCE,gBAAA,GAAmB,MAAA;EAyCiD;;;;EApCpE,kBAAA;EAoCoE;AAStE;;;;;EAtCE,aAAA;EAsCuF;;;;;;EA/BvF,cAAA;EA+BuF;AAAA;;;EA1BvF,UAAA,GAAa,MAAA;IAAiB,KAAA;IAAe,GAAA;EAAA;AAAA;;;;;;;;;;;;;;;iBAiB/B,SAAA,CAAU,IAAA,UAAc,OAAA,GAAS,gBAAqB;;;;;;iBAStD,YAAA,CAAa,GAAA,EAAK,SAAA,IAAa,OAAA,GAAS,gBAAA,GAAwB,SAAA"}
|
|
@@ -35,11 +35,28 @@ function inlineCssDom(dom, options = {}) {
|
|
|
35
35
|
if (codeBlocks && typeof codeBlocks === "object") Object.entries(codeBlocks).forEach(([key, value]) => {
|
|
36
36
|
if (value.start && value.end) juice.codeBlocks[key] = value;
|
|
37
37
|
});
|
|
38
|
+
/**
|
|
39
|
+
* Handle style tags with embed attributes. We add a marker attribute
|
|
40
|
+
* that persists through the pipeline, then restore data-embed from
|
|
41
|
+
* it after Juice runs. `amp-custom` (AMP4Email's CSS attribute)
|
|
42
|
+
* is treated the same as embed: contents are preserved,
|
|
43
|
+
* never inlined.
|
|
44
|
+
*/
|
|
38
45
|
walk(dom, (node) => {
|
|
39
46
|
const el = node;
|
|
40
47
|
if (el.name === "style" && el.attribs) {
|
|
48
|
+
/**
|
|
49
|
+
* `amp-custom` → tell juice to skip via data-embed, but don't mirror
|
|
50
|
+
* back to `embed` (user wrote amp-custom, that's what stays in
|
|
51
|
+
* output).
|
|
52
|
+
*/
|
|
53
|
+
if ("amp-custom" in el.attribs && !("data-embed" in el.attribs)) el.attribs["data-embed"] = "";
|
|
54
|
+
/**
|
|
55
|
+
* Sync data-embed ↔ embed. Use `in` so presence-only attrs
|
|
56
|
+
* (<style embed> → attribs.embed === '') still count.
|
|
57
|
+
*/
|
|
41
58
|
if ("embed" in el.attribs && !("data-embed" in el.attribs)) el.attribs["data-embed"] = "";
|
|
42
|
-
if ("data-embed" in el.attribs && !("embed" in el.attribs)) el.attribs.embed = "";
|
|
59
|
+
if ("data-embed" in el.attribs && !("embed" in el.attribs) && !("amp-custom" in el.attribs)) el.attribs.embed = "";
|
|
43
60
|
if ("data-embed" in el.attribs) el.attribs["data-maizzle-embed"] = "";
|
|
44
61
|
}
|
|
45
62
|
});
|
|
@@ -60,14 +77,9 @@ function inlineCssDom(dom, options = {}) {
|
|
|
60
77
|
return dom;
|
|
61
78
|
}
|
|
62
79
|
const result = parse(inlinedHtml);
|
|
63
|
-
walk(result, (node) => {
|
|
80
|
+
if (preferUnitlessValues) walk(result, (node) => {
|
|
64
81
|
const el = node;
|
|
65
|
-
if (el.attribs?.style)
|
|
66
|
-
let style = el.attribs.style.replace(/:\s*/g, ": ").replace(/;\s*/g, "; ").trimEnd();
|
|
67
|
-
if (!style.endsWith(";")) style += ";";
|
|
68
|
-
if (preferUnitlessValues) style = style.replace(/\b0(px|rem|em|%|vh|vw|vmin|vmax|in|cm|mm|pt|pc|ex|ch)\b/g, "0");
|
|
69
|
-
el.attribs.style = style;
|
|
70
|
-
}
|
|
82
|
+
if (el.attribs?.style) el.attribs.style = el.attribs.style.replace(/\b0(px|rem|em|%|vh|vw|vmin|vmax|in|cm|mm|pt|pc|ex|ch)\b/g, "0");
|
|
71
83
|
});
|
|
72
84
|
/**
|
|
73
85
|
* Restore `embed` from our marker so the purge step can detect
|
|
@@ -78,7 +90,13 @@ function inlineCssDom(dom, options = {}) {
|
|
|
78
90
|
walk(result, (node) => {
|
|
79
91
|
const el = node;
|
|
80
92
|
if (el.name === "style" && el.attribs && "data-maizzle-embed" in el.attribs) {
|
|
81
|
-
|
|
93
|
+
/**
|
|
94
|
+
* Only restore `embed` when the original signal was embed/data-embed —
|
|
95
|
+
* an `amp-custom` style was tagged for juice's benefit only and
|
|
96
|
+
* must not pick up a stray `embed` attribute in the rendered
|
|
97
|
+
* output.
|
|
98
|
+
*/
|
|
99
|
+
if (!("amp-custom" in el.attribs)) el.attribs.embed = "";
|
|
82
100
|
delete el.attribs["data-embed"];
|
|
83
101
|
delete el.attribs["data-maizzle-embed"];
|
|
84
102
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"inlineCss.js","names":[],"sources":["../../src/transformers/inlineCss.ts"],"sourcesContent":["import juice from 'juice'\nimport { walk, parse, serialize } from '../utils/ast/index.ts'\nimport type { ChildNode, Element } from 'domhandler'\nimport type { Options as JuiceOptions } from 'juice'\n\n/**\n * Options for the `inlineCss` transformer. Accepts every Juice option plus a\n * handful of Maizzle-specific extras.\n */\nexport interface InlineCssOptions extends JuiceOptions {\n /**\n * Convert `0px`, `0em` etc. to `0` in inline styles.\n *\n * @default true\n */\n preferUnitlessValues?: boolean\n /**\n * CSS selectors to preserve in `<style>` tags, even after inlining.\n * Mapped to Juice's `preservedSelectors` option.\n *\n * @default []\n */\n safelist?: string[]\n /**\n * Additional CSS string to inline alongside `<style>` tag contents.\n * Mapped to Juice's `extraCss` option.\n */\n customCSS?: string\n /**\n * Duplicate CSS properties to HTML attributes.\n * Mapped to Juice's static `styleToAttribute` property.\n */\n styleToAttribute?: Record<string, string>\n /**\n * CSS properties to exclude from inlining.\n * Mapped to Juice's static `excludedProperties` property.\n */\n excludedProperties?: string[]\n /**\n * Elements that can receive `width` HTML attributes.\n * Mapped to Juice's static `widthElements` property.\n *\n * @default ['img', 'video']\n */\n widthElements?: string[]\n /**\n * Elements that can receive `height` HTML attributes.\n * Mapped to Juice's static `heightElements` property.\n *\n * @default ['img', 'video']\n */\n heightElements?: string[]\n /**\n * Template language code blocks to preserve during inlining.\n * Mapped to Juice's static `codeBlocks` property.\n */\n codeBlocks?: Record<string, { start: string; end: string }>\n}\n\n/**\n * Inline CSS from `<style>` tags into `style` attributes on matching elements.\n *\n * @param html HTML string to transform.\n * @param options Juice options plus Maizzle-specific extras.\n * @returns The transformed HTML string.\n *\n * @example\n * import { inlineCss } from '@maizzle/framework'\n *\n * const out = inlineCss('<style>.red{color:red}</style><p class=\"red\">x</p>', {\n * removeStyleTags: true,\n * })\n */\nexport function inlineCss(html: string, options: InlineCssOptions = {}): string {\n return serialize(inlineCssDom(parse(html), options))\n}\n\n/**\n * DOM-form of {@link inlineCss} used by the internal transformer pipeline.\n * Takes a parsed DOM, returns a parsed DOM — avoids the redundant\n * serialize/parse round-trips when chained with other transformers.\n */\nexport function inlineCssDom(dom: ChildNode[], options: InlineCssOptions = {}): ChildNode[] {\n const {\n preferUnitlessValues = true,\n safelist,\n customCSS = '',\n styleToAttribute,\n excludedProperties,\n widthElements,\n heightElements,\n codeBlocks,\n ...juicePassthrough\n } = options\n\n // Configure Juice static properties\n juice.styleToAttribute = styleToAttribute ?? {}\n juice.excludedProperties = ['--tw-shadow', ...(excludedProperties ?? [])]\n juice.widthElements = (widthElements ?? ['img', 'video']).map(i => i.toUpperCase()) as unknown as HTMLElement[]\n juice.heightElements = (heightElements ?? ['img', 'video']).map(i => i.toUpperCase()) as unknown as HTMLElement[]\n\n // Add custom code blocks\n if (codeBlocks && typeof codeBlocks === 'object') {\n Object.entries(codeBlocks).forEach(([key, value]) => {\n if (value.start && value.end) {\n juice.codeBlocks[key] = value\n }\n })\n }\n\n
|
|
1
|
+
{"version":3,"file":"inlineCss.js","names":[],"sources":["../../src/transformers/inlineCss.ts"],"sourcesContent":["import juice from 'juice'\nimport { walk, parse, serialize } from '../utils/ast/index.ts'\nimport type { ChildNode, Element } from 'domhandler'\nimport type { Options as JuiceOptions } from 'juice'\n\n/**\n * Options for the `inlineCss` transformer. Accepts every Juice option plus a\n * handful of Maizzle-specific extras.\n */\nexport interface InlineCssOptions extends JuiceOptions {\n /**\n * Convert `0px`, `0em` etc. to `0` in inline styles.\n *\n * @default true\n */\n preferUnitlessValues?: boolean\n /**\n * CSS selectors to preserve in `<style>` tags, even after inlining.\n * Mapped to Juice's `preservedSelectors` option.\n *\n * @default []\n */\n safelist?: string[]\n /**\n * Additional CSS string to inline alongside `<style>` tag contents.\n * Mapped to Juice's `extraCss` option.\n */\n customCSS?: string\n /**\n * Duplicate CSS properties to HTML attributes.\n * Mapped to Juice's static `styleToAttribute` property.\n */\n styleToAttribute?: Record<string, string>\n /**\n * CSS properties to exclude from inlining.\n * Mapped to Juice's static `excludedProperties` property.\n */\n excludedProperties?: string[]\n /**\n * Elements that can receive `width` HTML attributes.\n * Mapped to Juice's static `widthElements` property.\n *\n * @default ['img', 'video']\n */\n widthElements?: string[]\n /**\n * Elements that can receive `height` HTML attributes.\n * Mapped to Juice's static `heightElements` property.\n *\n * @default ['img', 'video']\n */\n heightElements?: string[]\n /**\n * Template language code blocks to preserve during inlining.\n * Mapped to Juice's static `codeBlocks` property.\n */\n codeBlocks?: Record<string, { start: string; end: string }>\n}\n\n/**\n * Inline CSS from `<style>` tags into `style` attributes on matching elements.\n *\n * @param html HTML string to transform.\n * @param options Juice options plus Maizzle-specific extras.\n * @returns The transformed HTML string.\n *\n * @example\n * import { inlineCss } from '@maizzle/framework'\n *\n * const out = inlineCss('<style>.red{color:red}</style><p class=\"red\">x</p>', {\n * removeStyleTags: true,\n * })\n */\nexport function inlineCss(html: string, options: InlineCssOptions = {}): string {\n return serialize(inlineCssDom(parse(html), options))\n}\n\n/**\n * DOM-form of {@link inlineCss} used by the internal transformer pipeline.\n * Takes a parsed DOM, returns a parsed DOM — avoids the redundant\n * serialize/parse round-trips when chained with other transformers.\n */\nexport function inlineCssDom(dom: ChildNode[], options: InlineCssOptions = {}): ChildNode[] {\n const {\n preferUnitlessValues = true,\n safelist,\n customCSS = '',\n styleToAttribute,\n excludedProperties,\n widthElements,\n heightElements,\n codeBlocks,\n ...juicePassthrough\n } = options\n\n // Configure Juice static properties\n juice.styleToAttribute = styleToAttribute ?? {}\n juice.excludedProperties = ['--tw-shadow', ...(excludedProperties ?? [])]\n juice.widthElements = (widthElements ?? ['img', 'video']).map(i => i.toUpperCase()) as unknown as HTMLElement[]\n juice.heightElements = (heightElements ?? ['img', 'video']).map(i => i.toUpperCase()) as unknown as HTMLElement[]\n\n // Add custom code blocks\n if (codeBlocks && typeof codeBlocks === 'object') {\n Object.entries(codeBlocks).forEach(([key, value]) => {\n if (value.start && value.end) {\n juice.codeBlocks[key] = value\n }\n })\n }\n\n /**\n * Handle style tags with embed attributes. We add a marker attribute\n * that persists through the pipeline, then restore data-embed from\n * it after Juice runs. `amp-custom` (AMP4Email's CSS attribute)\n * is treated the same as embed: contents are preserved,\n * never inlined.\n */\n walk(dom, (node) => {\n const el = node as Element\n if (el.name === 'style' && el.attribs) {\n /**\n * `amp-custom` → tell juice to skip via data-embed, but don't mirror\n * back to `embed` (user wrote amp-custom, that's what stays in\n * output).\n */\n if ('amp-custom' in el.attribs && !('data-embed' in el.attribs)) {\n el.attribs['data-embed'] = ''\n }\n /**\n * Sync data-embed ↔ embed. Use `in` so presence-only attrs\n * (<style embed> → attribs.embed === '') still count.\n */\n if ('embed' in el.attribs && !('data-embed' in el.attribs)) {\n el.attribs['data-embed'] = ''\n }\n if ('data-embed' in el.attribs && !('embed' in el.attribs) && !('amp-custom' in el.attribs)) {\n el.attribs.embed = ''\n }\n\n // Add marker that persists through the pipeline\n if ('data-embed' in el.attribs) {\n el.attribs['data-maizzle-embed'] = ''\n }\n }\n })\n\n // Serialize for juice (juice requires a string)\n const serialized = serialize(dom)\n\n let inlinedHtml: string\n\n try {\n const juiceOptions: JuiceOptions = {\n removeStyleTags: juicePassthrough.removeStyleTags ?? false,\n removeInlinedSelectors: juicePassthrough.removeInlinedSelectors ?? true,\n applyWidthAttributes: juicePassthrough.applyWidthAttributes ?? true,\n applyHeightAttributes: juicePassthrough.applyHeightAttributes ?? true,\n preservedSelectors: safelist ?? [],\n ...customCSS ? { extraCss: customCSS } : {},\n inlineDuplicateProperties: juicePassthrough.inlineDuplicateProperties ?? true,\n ...juicePassthrough,\n }\n\n inlinedHtml = juice(serialized, juiceOptions)\n } catch {\n // If Juice fails, return the dom unchanged\n return dom\n }\n\n const result = parse(inlinedHtml)\n\n if (preferUnitlessValues) {\n walk(result, (node) => {\n const el = node as Element\n if (el.attribs?.style) {\n el.attribs.style = el.attribs.style.replace(\n /\\b0(px|rem|em|%|vh|vw|vmin|vmax|in|cm|mm|pt|pc|ex|ch)\\b/g,\n '0'\n )\n }\n })\n }\n\n /**\n * Restore `embed` from our marker so the purge step can detect\n * these tags and skip them. Drop `data-embed` (juice's name)\n * since it's redundant once `embed` is back, and let purge\n * strip `embed` itself at the end of its run.\n */\n walk(result, (node) => {\n const el = node as Element\n if (el.name === 'style' && el.attribs && 'data-maizzle-embed' in el.attribs) {\n /**\n * Only restore `embed` when the original signal was embed/data-embed —\n * an `amp-custom` style was tagged for juice's benefit only and\n * must not pick up a stray `embed` attribute in the rendered\n * output.\n */\n if (!('amp-custom' in el.attribs)) {\n el.attribs.embed = ''\n }\n delete el.attribs['data-embed']\n delete el.attribs['data-maizzle-embed']\n }\n })\n\n return result\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAyEA,SAAgB,UAAU,MAAc,UAA4B,CAAC,GAAW;CAC9E,OAAO,UAAU,aAAa,MAAM,IAAI,GAAG,OAAO,CAAC;AACrD;;;;;;AAOA,SAAgB,aAAa,KAAkB,UAA4B,CAAC,GAAgB;CAC1F,MAAM,EACJ,uBAAuB,MACvB,UACA,YAAY,IACZ,kBACA,oBACA,eACA,gBACA,YACA,GAAG,qBACD;CAGJ,MAAM,mBAAmB,oBAAoB,CAAC;CAC9C,MAAM,qBAAqB,CAAC,eAAe,GAAI,sBAAsB,CAAC,CAAE;CACxE,MAAM,iBAAiB,iBAAiB,CAAC,OAAO,OAAO,GAAG,KAAI,MAAK,EAAE,YAAY,CAAC;CAClF,MAAM,kBAAkB,kBAAkB,CAAC,OAAO,OAAO,GAAG,KAAI,MAAK,EAAE,YAAY,CAAC;CAGpF,IAAI,cAAc,OAAO,eAAe,UACtC,OAAO,QAAQ,UAAU,EAAE,SAAS,CAAC,KAAK,WAAW;EACnD,IAAI,MAAM,SAAS,MAAM,KACvB,MAAM,WAAW,OAAO;CAE5B,CAAC;;;;;;;;CAUH,KAAK,MAAM,SAAS;EAClB,MAAM,KAAK;EACX,IAAI,GAAG,SAAS,WAAW,GAAG,SAAS;;;;;;GAMrC,IAAI,gBAAgB,GAAG,WAAW,EAAE,gBAAgB,GAAG,UACrD,GAAG,QAAQ,gBAAgB;;;;;GAM7B,IAAI,WAAW,GAAG,WAAW,EAAE,gBAAgB,GAAG,UAChD,GAAG,QAAQ,gBAAgB;GAE7B,IAAI,gBAAgB,GAAG,WAAW,EAAE,WAAW,GAAG,YAAY,EAAE,gBAAgB,GAAG,UACjF,GAAG,QAAQ,QAAQ;GAIrB,IAAI,gBAAgB,GAAG,SACrB,GAAG,QAAQ,wBAAwB;EAEvC;CACF,CAAC;CAGD,MAAM,aAAa,UAAU,GAAG;CAEhC,IAAI;CAEJ,IAAI;EAYF,cAAc,MAAM,YAAY;GAV9B,iBAAiB,iBAAiB,mBAAmB;GACrD,wBAAwB,iBAAiB,0BAA0B;GACnE,sBAAsB,iBAAiB,wBAAwB;GAC/D,uBAAuB,iBAAiB,yBAAyB;GACjE,oBAAoB,YAAY,CAAC;GACjC,GAAG,YAAY,EAAE,UAAU,UAAU,IAAI,CAAC;GAC1C,2BAA2B,iBAAiB,6BAA6B;GACzE,GAAG;EAGsC,CAAC;CAC9C,QAAQ;EAEN,OAAO;CACT;CAEA,MAAM,SAAS,MAAM,WAAW;CAEhC,IAAI,sBACF,KAAK,SAAS,SAAS;EACrB,MAAM,KAAK;EACX,IAAI,GAAG,SAAS,OACd,GAAG,QAAQ,QAAQ,GAAG,QAAQ,MAAM,QAClC,4DACA,GACF;CAEJ,CAAC;;;;;;;CASH,KAAK,SAAS,SAAS;EACrB,MAAM,KAAK;EACX,IAAI,GAAG,SAAS,WAAW,GAAG,WAAW,wBAAwB,GAAG,SAAS;;;;;;;GAO3E,IAAI,EAAE,gBAAgB,GAAG,UACvB,GAAG,QAAQ,QAAQ;GAErB,OAAO,GAAG,QAAQ;GAClB,OAAO,GAAG,QAAQ;EACpB;CACF,CAAC;CAED,OAAO;AACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"inlineLink.d.ts","names":[],"sources":["../../src/transformers/inlineLink.ts"],"mappings":";;;;;AA2BA
|
|
1
|
+
{"version":3,"file":"inlineLink.d.ts","names":[],"sources":["../../src/transformers/inlineLink.ts"],"mappings":";;;;;AA2BA;;;;;;;;AAA0E;AAS1E;;;;;;;;;;;iBATsB,UAAA,CAAW,IAAA,UAAc,QAAA,YAAoB,OAAO;;;AASiB;;;iBAArE,aAAA,CAAc,GAAA,EAAK,SAAA,IAAa,QAAA,YAAoB,OAAA,CAAQ,SAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"inlineLink.js","names":["parse"],"sources":["../../src/transformers/inlineLink.ts"],"sourcesContent":["import { readFileSync } from 'node:fs'\nimport { resolve, dirname } from 'node:path'\nimport type { ChildNode, Element } from 'domhandler'\nimport { parse, serialize, walk } from '../utils/ast/index.ts'\n\n/**\n * Inline `<link rel=\"stylesheet\">` tags as `<style>` tags.\n *\n * - Local file paths are inlined when `filePath` is provided (resolved\n * relative to it).\n * - Remote URLs (`http://` / `https://`) are only inlined when the link\n * carries an `inline` attribute, e.g. `<link rel=\"stylesheet\" inline href=\"…\">`.\n *\n * @param html HTML string to transform.\n * @param filePath Path of the source file the HTML came from, used as the\n * base for resolving relative `href` values. Required for\n * local-file inlining; remote `inline` links work without it.\n * @returns The transformed HTML string.\n *\n * @example\n * import { inlineLink } from '@maizzle/framework'\n *\n * const out = await inlineLink(\n * '<link rel=\"stylesheet\" href=\"./styles.css\">',\n * '/path/to/template.html',\n * )\n */\nexport async function inlineLink(html: string, filePath?: string): Promise<string> {\n return serialize(await inlineLinkDom(parse(html), filePath))\n}\n\n/**\n * DOM-form of {@link inlineLink} used by the internal transformer pipeline.\n * Takes a parsed DOM, returns a parsed DOM — avoids redundant\n * serialize/parse round-trips when chained with other transformers.\n */\nexport async function inlineLinkDom(dom: ChildNode[], filePath?: string): Promise<ChildNode[]> {\n const links: { node: Element; parent: ChildNode; index: number }[] = []\n\n walk(dom, (node) => {\n if ((node as Element).name !== 'link') return\n\n const el = node as Element\n const attrs = el.attribs || {}\n\n if (attrs.rel !== 'stylesheet' || !attrs.href) return\n\n const parent = el.parent as ChildNode\n\n if (parent && 'children' in parent) {\n const index = (parent.children as ChildNode[]).indexOf(el)\n if (index !== -1) {\n links.push({ node: el, parent, index })\n }\n } else {\n // Top-level node\n const index = dom.indexOf(el)\n if (index !== -1) {\n links.push({ node: el, parent: null as any, index })\n }\n }\n })\n\n for (const { node, parent, index } of links) {\n const href = node.attribs.href\n const isRemote = href.startsWith('http://') || href.startsWith('https://')\n\n let css: string | undefined\n\n if (isRemote) {\n if (!('inline' in node.attribs)) continue\n\n try {\n const response = await fetch(href)\n css = await response.text()\n } catch {\n continue\n }\n } else {\n if (!filePath) continue\n\n try {\n const absolutePath = resolve(dirname(filePath), href)\n css = readFileSync(absolutePath, 'utf8')\n } catch {\n continue\n }\n }\n\n const styleNode = {\n type: 'tag',\n name: 'style',\n attribs: {},\n children: [{\n type: 'text',\n data: css,\n parent: null as any,\n }],\n parent: parent || null,\n } as any\n\n // Set parent reference on the text child\n styleNode.children[0].parent = styleNode\n\n const siblings = parent && 'children' in parent\n ? parent.children as ChildNode[]\n : dom\n\n siblings.splice(index, 1, styleNode)\n }\n\n return dom\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,eAAsB,WAAW,MAAc,UAAoC;CACjF,OAAO,UAAU,MAAM,cAAcA,QAAM,
|
|
1
|
+
{"version":3,"file":"inlineLink.js","names":["parse"],"sources":["../../src/transformers/inlineLink.ts"],"sourcesContent":["import { readFileSync } from 'node:fs'\nimport { resolve, dirname } from 'node:path'\nimport type { ChildNode, Element } from 'domhandler'\nimport { parse, serialize, walk } from '../utils/ast/index.ts'\n\n/**\n * Inline `<link rel=\"stylesheet\">` tags as `<style>` tags.\n *\n * - Local file paths are inlined when `filePath` is provided (resolved\n * relative to it).\n * - Remote URLs (`http://` / `https://`) are only inlined when the link\n * carries an `inline` attribute, e.g. `<link rel=\"stylesheet\" inline href=\"…\">`.\n *\n * @param html HTML string to transform.\n * @param filePath Path of the source file the HTML came from, used as the\n * base for resolving relative `href` values. Required for\n * local-file inlining; remote `inline` links work without it.\n * @returns The transformed HTML string.\n *\n * @example\n * import { inlineLink } from '@maizzle/framework'\n *\n * const out = await inlineLink(\n * '<link rel=\"stylesheet\" href=\"./styles.css\">',\n * '/path/to/template.html',\n * )\n */\nexport async function inlineLink(html: string, filePath?: string): Promise<string> {\n return serialize(await inlineLinkDom(parse(html), filePath))\n}\n\n/**\n * DOM-form of {@link inlineLink} used by the internal transformer pipeline.\n * Takes a parsed DOM, returns a parsed DOM — avoids redundant\n * serialize/parse round-trips when chained with other transformers.\n */\nexport async function inlineLinkDom(dom: ChildNode[], filePath?: string): Promise<ChildNode[]> {\n const links: { node: Element; parent: ChildNode; index: number }[] = []\n\n walk(dom, (node) => {\n if ((node as Element).name !== 'link') return\n\n const el = node as Element\n const attrs = el.attribs || {}\n\n if (attrs.rel !== 'stylesheet' || !attrs.href) return\n\n const parent = el.parent as ChildNode\n\n if (parent && 'children' in parent) {\n const index = (parent.children as ChildNode[]).indexOf(el)\n if (index !== -1) {\n links.push({ node: el, parent, index })\n }\n } else {\n // Top-level node\n const index = dom.indexOf(el)\n if (index !== -1) {\n links.push({ node: el, parent: null as any, index })\n }\n }\n })\n\n for (const { node, parent, index } of links) {\n const href = node.attribs.href\n const isRemote = href.startsWith('http://') || href.startsWith('https://')\n\n let css: string | undefined\n\n if (isRemote) {\n if (!('inline' in node.attribs)) continue\n\n try {\n const response = await fetch(href)\n css = await response.text()\n } catch {\n continue\n }\n } else {\n if (!filePath) continue\n\n try {\n const absolutePath = resolve(dirname(filePath), href)\n css = readFileSync(absolutePath, 'utf8')\n } catch {\n continue\n }\n }\n\n const styleNode = {\n type: 'tag',\n name: 'style',\n attribs: {},\n children: [{\n type: 'text',\n data: css,\n parent: null as any,\n }],\n parent: parent || null,\n } as any\n\n // Set parent reference on the text child\n styleNode.children[0].parent = styleNode\n\n const siblings = parent && 'children' in parent\n ? parent.children as ChildNode[]\n : dom\n\n siblings.splice(index, 1, styleNode)\n }\n\n return dom\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,eAAsB,WAAW,MAAc,UAAoC;CACjF,OAAO,UAAU,MAAM,cAAcA,QAAM,IAAI,GAAG,QAAQ,CAAC;AAC7D;;;;;;AAOA,eAAsB,cAAc,KAAkB,UAAyC;CAC7F,MAAM,QAA+D,CAAC;CAEtE,KAAK,MAAM,SAAS;EAClB,IAAK,KAAiB,SAAS,QAAQ;EAEvC,MAAM,KAAK;EACX,MAAM,QAAQ,GAAG,WAAW,CAAC;EAE7B,IAAI,MAAM,QAAQ,gBAAgB,CAAC,MAAM,MAAM;EAE/C,MAAM,SAAS,GAAG;EAElB,IAAI,UAAU,cAAc,QAAQ;GAClC,MAAM,QAAS,OAAO,SAAyB,QAAQ,EAAE;GACzD,IAAI,UAAU,IACZ,MAAM,KAAK;IAAE,MAAM;IAAI;IAAQ;GAAM,CAAC;EAE1C,OAAO;GAEL,MAAM,QAAQ,IAAI,QAAQ,EAAE;GAC5B,IAAI,UAAU,IACZ,MAAM,KAAK;IAAE,MAAM;IAAI,QAAQ;IAAa;GAAM,CAAC;EAEvD;CACF,CAAC;CAED,KAAK,MAAM,EAAE,MAAM,QAAQ,WAAW,OAAO;EAC3C,MAAM,OAAO,KAAK,QAAQ;EAC1B,MAAM,WAAW,KAAK,WAAW,SAAS,KAAK,KAAK,WAAW,UAAU;EAEzE,IAAI;EAEJ,IAAI,UAAU;GACZ,IAAI,EAAE,YAAY,KAAK,UAAU;GAEjC,IAAI;IAEF,MAAM,OAAM,MADW,MAAM,IAAI,GACZ,KAAK;GAC5B,QAAQ;IACN;GACF;EACF,OAAO;GACL,IAAI,CAAC,UAAU;GAEf,IAAI;IAEF,MAAM,aADe,QAAQ,QAAQ,QAAQ,GAAG,IAClB,GAAG,MAAM;GACzC,QAAQ;IACN;GACF;EACF;EAEA,MAAM,YAAY;GAChB,MAAM;GACN,MAAM;GACN,SAAS,CAAC;GACV,UAAU,CAAC;IACT,MAAM;IACN,MAAM;IACN,QAAQ;GACV,CAAC;GACD,QAAQ,UAAU;EACpB;EAGA,UAAU,SAAS,GAAG,SAAS;EAM/B,CAJiB,UAAU,cAAc,SACrC,OAAO,WACP,KAEK,OAAO,OAAO,GAAG,SAAS;CACrC;CAEA,OAAO;AACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"minify.d.ts","names":[],"sources":["../../src/transformers/minify.ts"],"mappings":";;;;AAwBA
|
|
1
|
+
{"version":3,"file":"minify.d.ts","names":[],"sources":["../../src/transformers/minify.ts"],"mappings":";;;;AAwBA;;;;;;;;;AAA4E;;;;iBAA5D,MAAA,CAAO,IAAA,UAAc,OAAA,GAAS,OAAO,CAAC,IAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"minify.js","names":["merge"],"sources":["../../src/transformers/minify.ts"],"sourcesContent":["import { crush } from 'html-crush'\nimport { defu as merge } from 'defu'\nimport type { Opts as HtmlCrushOptions } from 'html-crush'\n\nexport type { Opts as MinifyOptions } from 'html-crush'\n\nconst DEFAULT_OPTIONS: Partial<HtmlCrushOptions> = {\n removeLineBreaks: true,\n}\n\n/**\n * Minify an HTML string using `html-crush`. Maizzle's only default that\n * differs from html-crush's own defaults is `removeLineBreaks: true`.\n *\n * @param html HTML string to minify.\n * @param options [html-crush options](https://codsen.com/os/html-crush) merged\n * on top of the Maizzle defaults.\n * @returns The minified HTML string.\n *\n * @example\n * import { minify } from '@maizzle/framework'\n *\n * const tight = minify('<p> hello </p>', { removeIndentations: true })\n */\nexport function minify(html: string, options: Partial<HtmlCrushOptions> = {}): string {\n const merged = merge(options, DEFAULT_OPTIONS) as Partial<HtmlCrushOptions>\n return crush(html, merged).result\n}\n"],"mappings":";;;AAMA,MAAM,kBAA6C,EACjD,kBAAkB,
|
|
1
|
+
{"version":3,"file":"minify.js","names":["merge"],"sources":["../../src/transformers/minify.ts"],"sourcesContent":["import { crush } from 'html-crush'\nimport { defu as merge } from 'defu'\nimport type { Opts as HtmlCrushOptions } from 'html-crush'\n\nexport type { Opts as MinifyOptions } from 'html-crush'\n\nconst DEFAULT_OPTIONS: Partial<HtmlCrushOptions> = {\n removeLineBreaks: true,\n}\n\n/**\n * Minify an HTML string using `html-crush`. Maizzle's only default that\n * differs from html-crush's own defaults is `removeLineBreaks: true`.\n *\n * @param html HTML string to minify.\n * @param options [html-crush options](https://codsen.com/os/html-crush) merged\n * on top of the Maizzle defaults.\n * @returns The minified HTML string.\n *\n * @example\n * import { minify } from '@maizzle/framework'\n *\n * const tight = minify('<p> hello </p>', { removeIndentations: true })\n */\nexport function minify(html: string, options: Partial<HtmlCrushOptions> = {}): string {\n const merged = merge(options, DEFAULT_OPTIONS) as Partial<HtmlCrushOptions>\n return crush(html, merged).result\n}\n"],"mappings":";;;AAMA,MAAM,kBAA6C,EACjD,kBAAkB,KACpB;;;;;;;;;;;;;;;AAgBA,SAAgB,OAAO,MAAc,UAAqC,CAAC,GAAW;CAEpF,OAAO,MAAM,MADEA,OAAM,SAAS,eACN,CAAC,EAAE;AAC7B"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
//#region src/transformers/minifyCodeInline.d.ts
|
|
2
|
+
/**
|
|
3
|
+
* Restore HTML inside elements marked `data-minify-inline`, then strip the
|
|
4
|
+
* marker attribute and trim formatter-injected whitespace.
|
|
5
|
+
*
|
|
6
|
+
* Named for its primary client, `<CodeInline theme="…">`. The component
|
|
7
|
+
* replaces shiki's structural `<`/`>` with private markers `§MZLT§` /
|
|
8
|
+
* `§MZGT§` so the format pass (oxfmt with `htmlWhitespaceSensitivity:
|
|
9
|
+
* 'ignore'`) can't see them as real angle brackets and reflow the
|
|
10
|
+
* chain of `<span>` tokens. Source-level entities like `<` (a
|
|
11
|
+
* literal `<` in the user's code) are made of `&`, `l`, `t`, `;` —
|
|
12
|
+
* no real `<` — so they pass through this pipeline untouched and
|
|
13
|
+
* land in the browser as entities, rendering correctly as `<`.
|
|
14
|
+
*
|
|
15
|
+
* Runs unconditionally near the end of the pipeline so:
|
|
16
|
+
* 1. The markers always get decoded back to real `<` / `>`.
|
|
17
|
+
* 2. The `data-minify-inline` attribute never leaks to final HTML
|
|
18
|
+
* (whether or not the inner content had markers).
|
|
19
|
+
* 3. Whitespace the formatter injected around the inner content
|
|
20
|
+
* (e.g. between `<code>` and the text node) is trimmed so the
|
|
21
|
+
* inline element lands flush.
|
|
22
|
+
*
|
|
23
|
+
* The marker attribute is intentionally generic so any component facing
|
|
24
|
+
* the same formatter-vs-inline-structure problem can opt in.
|
|
25
|
+
*/
|
|
26
|
+
declare function minifyCodeInline(html: string): string;
|
|
27
|
+
//#endregion
|
|
28
|
+
export { minifyCodeInline };
|
|
29
|
+
//# sourceMappingURL=minifyCodeInline.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"minifyCodeInline.d.ts","names":[],"sources":["../../src/transformers/minifyCodeInline.ts"],"mappings":";;AAwBA;;;;AAA6C;;;;;;;;;;;;;;;;;;;iBAA7B,gBAAA,CAAiB,IAAY"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
//#region src/transformers/minifyCodeInline.ts
|
|
2
|
+
/**
|
|
3
|
+
* Restore HTML inside elements marked `data-minify-inline`, then strip the
|
|
4
|
+
* marker attribute and trim formatter-injected whitespace.
|
|
5
|
+
*
|
|
6
|
+
* Named for its primary client, `<CodeInline theme="…">`. The component
|
|
7
|
+
* replaces shiki's structural `<`/`>` with private markers `§MZLT§` /
|
|
8
|
+
* `§MZGT§` so the format pass (oxfmt with `htmlWhitespaceSensitivity:
|
|
9
|
+
* 'ignore'`) can't see them as real angle brackets and reflow the
|
|
10
|
+
* chain of `<span>` tokens. Source-level entities like `<` (a
|
|
11
|
+
* literal `<` in the user's code) are made of `&`, `l`, `t`, `;` —
|
|
12
|
+
* no real `<` — so they pass through this pipeline untouched and
|
|
13
|
+
* land in the browser as entities, rendering correctly as `<`.
|
|
14
|
+
*
|
|
15
|
+
* Runs unconditionally near the end of the pipeline so:
|
|
16
|
+
* 1. The markers always get decoded back to real `<` / `>`.
|
|
17
|
+
* 2. The `data-minify-inline` attribute never leaks to final HTML
|
|
18
|
+
* (whether or not the inner content had markers).
|
|
19
|
+
* 3. Whitespace the formatter injected around the inner content
|
|
20
|
+
* (e.g. between `<code>` and the text node) is trimmed so the
|
|
21
|
+
* inline element lands flush.
|
|
22
|
+
*
|
|
23
|
+
* The marker attribute is intentionally generic so any component facing
|
|
24
|
+
* the same formatter-vs-inline-structure problem can opt in.
|
|
25
|
+
*/
|
|
26
|
+
function minifyCodeInline(html) {
|
|
27
|
+
if (!html.includes("data-minify-inline")) return html;
|
|
28
|
+
return html.replace(/<([a-zA-Z][\w-]*)([^>]*?)\s+data-minify-inline(?:="[^"]*")?([^>]*)>([\s\S]*?)<\/\1>/g, (_full, tag, before, after, contents) => {
|
|
29
|
+
const cleanedAttrs = `${before}${after}`.replace(/\s+/g, " ").trim();
|
|
30
|
+
return `${cleanedAttrs ? `<${tag} ${cleanedAttrs}>` : `<${tag}>`}${contents.replace(/§MZLT§/g, "<").replace(/§MZGT§/g, ">").trim()}</${tag}>`;
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
//#endregion
|
|
34
|
+
export { minifyCodeInline };
|
|
35
|
+
|
|
36
|
+
//# sourceMappingURL=minifyCodeInline.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"minifyCodeInline.js","names":[],"sources":["../../src/transformers/minifyCodeInline.ts"],"sourcesContent":["/**\n * Restore HTML inside elements marked `data-minify-inline`, then strip the\n * marker attribute and trim formatter-injected whitespace.\n *\n * Named for its primary client, `<CodeInline theme=\"…\">`. The component\n * replaces shiki's structural `<`/`>` with private markers `§MZLT§` /\n * `§MZGT§` so the format pass (oxfmt with `htmlWhitespaceSensitivity:\n * 'ignore'`) can't see them as real angle brackets and reflow the\n * chain of `<span>` tokens. Source-level entities like `<` (a\n * literal `<` in the user's code) are made of `&`, `l`, `t`, `;` —\n * no real `<` — so they pass through this pipeline untouched and\n * land in the browser as entities, rendering correctly as `<`.\n *\n * Runs unconditionally near the end of the pipeline so:\n * 1. The markers always get decoded back to real `<` / `>`.\n * 2. The `data-minify-inline` attribute never leaks to final HTML\n * (whether or not the inner content had markers).\n * 3. Whitespace the formatter injected around the inner content\n * (e.g. between `<code>` and the text node) is trimmed so the\n * inline element lands flush.\n *\n * The marker attribute is intentionally generic so any component facing\n * the same formatter-vs-inline-structure problem can opt in.\n */\nexport function minifyCodeInline(html: string): string {\n if (!html.includes('data-minify-inline')) return html\n\n return html.replace(\n /<([a-zA-Z][\\w-]*)([^>]*?)\\s+data-minify-inline(?:=\"[^\"]*\")?([^>]*)>([\\s\\S]*?)<\\/\\1>/g,\n (_full, tag, before, after, contents) => {\n const cleanedAttrs = `${before}${after}`.replace(/\\s+/g, ' ').trim()\n const open = cleanedAttrs ? `<${tag} ${cleanedAttrs}>` : `<${tag}>`\n const decoded = contents\n .replace(/§MZLT§/g, '<')\n .replace(/§MZGT§/g, '>')\n .trim()\n return `${open}${decoded}</${tag}>`\n },\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAwBA,SAAgB,iBAAiB,MAAsB;CACrD,IAAI,CAAC,KAAK,SAAS,oBAAoB,GAAG,OAAO;CAEjD,OAAO,KAAK,QACV,yFACC,OAAO,KAAK,QAAQ,OAAO,aAAa;EACvC,MAAM,eAAe,GAAG,SAAS,QAAQ,QAAQ,QAAQ,GAAG,EAAE,KAAK;EAMnE,OAAO,GALM,eAAe,IAAI,IAAI,GAAG,aAAa,KAAK,IAAI,IAAI,KACjD,SACb,QAAQ,WAAW,GAAG,EACtB,QAAQ,WAAW,GAAG,EACtB,KACoB,EAAE,IAAI,IAAI;CACnC,CACF;AACF"}
|
|
@@ -13,11 +13,16 @@ import { ChildNode } from "domhandler";
|
|
|
13
13
|
* back to `data-maizzle-msow-fallback` (default `600px`) when the
|
|
14
14
|
* value can't be parsed.
|
|
15
15
|
*
|
|
16
|
-
* MSOTDSTYLE (`__MAIZZLE_MSOTDSTYLE_{id}__`) — emitted by `<Container>`
|
|
17
|
-
* MSO `<td>`. Source element is marked with
|
|
18
|
-
*
|
|
19
|
-
*
|
|
20
|
-
*
|
|
16
|
+
* MSOTDSTYLE (`__MAIZZLE_MSOTDSTYLE_{id}__`) — emitted by `<Container>` and
|
|
17
|
+
* `<Section>`'s MSO `<td>`. Source element is marked with
|
|
18
|
+
* `data-maizzle-mso-td-id`. Extracts from the inlined style:
|
|
19
|
+
* - `background-color` (always, when present) so Word paints the cell.
|
|
20
|
+
* - `padding*` (only when no horizontal border on the element, since
|
|
21
|
+
* Word drops div padding without a border and a copy would
|
|
22
|
+
* double-pad with one).
|
|
23
|
+
* Appends the `data-maizzle-mso-style` value (the user's `msoStyle`
|
|
24
|
+
* prop) last so it wins on duplicates. Empty input resolves to ''
|
|
25
|
+
* so the placeholder collapses cleanly.
|
|
21
26
|
*
|
|
22
27
|
* Single collect-walk + single substitute-walk: the same Container div
|
|
23
28
|
* carries both marker kinds, so one element visit fills both maps.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"msoPlaceholders.d.ts","names":[],"sources":["../../src/transformers/msoPlaceholders.ts"],"mappings":";;;;;
|
|
1
|
+
{"version":3,"file":"msoPlaceholders.d.ts","names":[],"sources":["../../src/transformers/msoPlaceholders.ts"],"mappings":";;;;;AAkDA;;;;;;;;AAA4D;;;;;;;;;;;;;;;;iBAA5C,eAAA,CAAgB,GAAA,EAAK,SAAA,KAAc,SAAS"}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { walk } from "../utils/ast/walker.js";
|
|
2
2
|
import "../utils/ast/index.js";
|
|
3
|
+
import { horizontalBorderPx } from "../utils/cssBox.js";
|
|
4
|
+
import safeParser from "postcss-safe-parser";
|
|
3
5
|
//#region src/transformers/msoPlaceholders.ts
|
|
4
6
|
const RE_MAX_WIDTH = /(?:^|;\s*)max-width:\s*([^;]+)/i;
|
|
5
7
|
const RE_WIDTH = /(?:^|;\s*)width:\s*([^;]+)/i;
|
|
6
8
|
const RE_PERCENT = /^[\d.]+%$/;
|
|
7
|
-
const PADDING_DECL_RE = /(?:^|;)\s*(padding(?:-[a-z-]+)?\s*:\s*[^;]+)/gi;
|
|
8
9
|
function resolveWidth(value) {
|
|
9
10
|
const trimmed = value.trim();
|
|
10
11
|
if (RE_PERCENT.test(trimmed)) return trimmed;
|
|
@@ -31,11 +32,16 @@ function resolveWidth(value) {
|
|
|
31
32
|
* back to `data-maizzle-msow-fallback` (default `600px`) when the
|
|
32
33
|
* value can't be parsed.
|
|
33
34
|
*
|
|
34
|
-
* MSOTDSTYLE (`__MAIZZLE_MSOTDSTYLE_{id}__`) — emitted by `<Container>`
|
|
35
|
-
* MSO `<td>`. Source element is marked with
|
|
36
|
-
*
|
|
37
|
-
*
|
|
38
|
-
*
|
|
35
|
+
* MSOTDSTYLE (`__MAIZZLE_MSOTDSTYLE_{id}__`) — emitted by `<Container>` and
|
|
36
|
+
* `<Section>`'s MSO `<td>`. Source element is marked with
|
|
37
|
+
* `data-maizzle-mso-td-id`. Extracts from the inlined style:
|
|
38
|
+
* - `background-color` (always, when present) so Word paints the cell.
|
|
39
|
+
* - `padding*` (only when no horizontal border on the element, since
|
|
40
|
+
* Word drops div padding without a border and a copy would
|
|
41
|
+
* double-pad with one).
|
|
42
|
+
* Appends the `data-maizzle-mso-style` value (the user's `msoStyle`
|
|
43
|
+
* prop) last so it wins on duplicates. Empty input resolves to ''
|
|
44
|
+
* so the placeholder collapses cleanly.
|
|
39
45
|
*
|
|
40
46
|
* Single collect-walk + single substitute-walk: the same Container div
|
|
41
47
|
* carries both marker kinds, so one element visit fills both maps.
|
|
@@ -62,8 +68,33 @@ function msoPlaceholders(dom) {
|
|
|
62
68
|
delete a["data-maizzle-mso-td-id"];
|
|
63
69
|
const msoStyle = (a["data-maizzle-mso-style"] ?? "").trim().replace(/;\s*$/, "");
|
|
64
70
|
delete a["data-maizzle-mso-style"];
|
|
71
|
+
/**
|
|
72
|
+
* Build the MSO td's inline style from three sources, in CSS priority order
|
|
73
|
+
* (earlier = lower, later wins on dupes):
|
|
74
|
+
*
|
|
75
|
+
* 1. `background-color` (always, when present) — Word paints the cell
|
|
76
|
+
* under any padding area or inline-block gap, not just the div.
|
|
77
|
+
*
|
|
78
|
+
* 2. `padding*` (hoisted only when no horizontal border) — Word drops
|
|
79
|
+
* div padding without a stabilizing border, so the td has to
|
|
80
|
+
* carry it. With a border, Word renders div padding and a td
|
|
81
|
+
* copy would double-pad.
|
|
82
|
+
*
|
|
83
|
+
* 3. The user's `mso-style` prop — last so it overrides anything the
|
|
84
|
+
* auto-hoist computed.
|
|
85
|
+
*/
|
|
65
86
|
const parts = [];
|
|
66
|
-
if (style)
|
|
87
|
+
if (style) {
|
|
88
|
+
const root = safeParser(style);
|
|
89
|
+
let bgDecl;
|
|
90
|
+
root.walkDecls("background-color", (d) => {
|
|
91
|
+
bgDecl = `background-color: ${d.value}${d.important ? " !important" : ""}`;
|
|
92
|
+
});
|
|
93
|
+
if (bgDecl) parts.push(bgDecl);
|
|
94
|
+
if (horizontalBorderPx(root) === 0) root.walkDecls((d) => {
|
|
95
|
+
if (/^padding(-|$)/.test(d.prop)) parts.push(`${d.prop}: ${d.value}${d.important ? " !important" : ""}`);
|
|
96
|
+
});
|
|
97
|
+
}
|
|
67
98
|
if (msoStyle) parts.push(msoStyle);
|
|
68
99
|
tdStyles.set(tdId, parts.length ? ` style="${parts.join("; ")}"` : "");
|
|
69
100
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"msoPlaceholders.js","names":["el"],"sources":["../../src/transformers/msoPlaceholders.ts"],"sourcesContent":["import { walk } from '../utils/ast/index.ts'\nimport type { ChildNode, Element } from 'domhandler'\n\nconst RE_MAX_WIDTH = /(?:^|;\\s*)max-width:\\s*([^;]+)/i\nconst RE_WIDTH = /(?:^|;\\s*)width:\\s*([^;]+)/i\nconst RE_PERCENT = /^[\\d.]+%$/\
|
|
1
|
+
{"version":3,"file":"msoPlaceholders.js","names":["el"],"sources":["../../src/transformers/msoPlaceholders.ts"],"sourcesContent":["import safeParser from 'postcss-safe-parser'\nimport { walk } from '../utils/ast/index.ts'\nimport { horizontalBorderPx } from '../utils/cssBox.ts'\nimport type { ChildNode, Element } from 'domhandler'\n\nconst RE_MAX_WIDTH = /(?:^|;\\s*)max-width:\\s*([^;]+)/i\nconst RE_WIDTH = /(?:^|;\\s*)width:\\s*([^;]+)/i\nconst RE_PERCENT = /^[\\d.]+%$/\n\nfunction resolveWidth(value: string): string | null {\n const trimmed = value.trim()\n if (RE_PERCENT.test(trimmed)) return trimmed\n const m = trimmed.match(/^([\\d.]+)(px|rem|em|pt)?$/i)\n if (!m) return null\n const n = parseFloat(m[1])\n switch ((m[2] || 'px').toLowerCase()) {\n case 'px': return `${Math.round(n)}px`\n case 'rem':\n case 'em': return `${Math.round(n * 16)}px`\n case 'pt': return `${Math.round(n * 1.333)}px`\n default: return null\n }\n}\n\n/**\n * Resolve all `__MAIZZLE_MSO*__` placeholders inside MSO conditional comments\n * by reading inlined style + `data-*` markers on the paired elements.\n *\n * Two placeholder families:\n *\n * MSOW (`__MAIZZLE_MSOW_{id}__`) — emitted by `<Container>` and `<Section>`.\n * Source element is marked with `data-maizzle-msow-id`. Reads inlined\n * `max-width:` (falls back to `width:`) and normalizes to px. Falls\n * back to `data-maizzle-msow-fallback` (default `600px`) when the\n * value can't be parsed.\n *\n * MSOTDSTYLE (`__MAIZZLE_MSOTDSTYLE_{id}__`) — emitted by `<Container>` and\n * `<Section>`'s MSO `<td>`. Source element is marked with\n * `data-maizzle-mso-td-id`. Extracts from the inlined style:\n * - `background-color` (always, when present) so Word paints the cell.\n * - `padding*` (only when no horizontal border on the element, since\n * Word drops div padding without a border and a copy would\n * double-pad with one).\n * Appends the `data-maizzle-mso-style` value (the user's `msoStyle`\n * prop) last so it wins on duplicates. Empty input resolves to ''\n * so the placeholder collapses cleanly.\n *\n * Single collect-walk + single substitute-walk: the same Container div\n * carries both marker kinds, so one element visit fills both maps.\n */\nexport function msoPlaceholders(dom: ChildNode[]): ChildNode[] {\n const widths = new Map<string, string>()\n const tdStyles = new Map<string, string>()\n\n walk(dom, (node) => {\n const el = node as Element\n const a = el.attribs\n if (!a) return\n\n const msowId = a['data-maizzle-msow-id']\n const tdId = a['data-maizzle-mso-td-id']\n if (!msowId && !tdId) return\n\n const style = a.style ?? ''\n\n if (msowId) {\n delete a['data-maizzle-msow-id']\n const fallback = a['data-maizzle-msow-fallback'] ?? '600px'\n delete a['data-maizzle-msow-fallback']\n const raw = style.match(RE_MAX_WIDTH)?.[1] ?? style.match(RE_WIDTH)?.[1]\n const resolved = raw ? resolveWidth(raw) : null\n widths.set(msowId, resolved ?? fallback)\n }\n\n if (tdId) {\n delete a['data-maizzle-mso-td-id']\n const msoStyle = (a['data-maizzle-mso-style'] ?? '').trim().replace(/;\\s*$/, '')\n delete a['data-maizzle-mso-style']\n\n /**\n * Build the MSO td's inline style from three sources, in CSS priority order\n * (earlier = lower, later wins on dupes):\n *\n * 1. `background-color` (always, when present) — Word paints the cell\n * under any padding area or inline-block gap, not just the div.\n *\n * 2. `padding*` (hoisted only when no horizontal border) — Word drops\n * div padding without a stabilizing border, so the td has to\n * carry it. With a border, Word renders div padding and a td\n * copy would double-pad.\n *\n * 3. The user's `mso-style` prop — last so it overrides anything the\n * auto-hoist computed.\n */\n const parts: string[] = []\n if (style) {\n const root = safeParser(style)\n\n let bgDecl: string | undefined\n root.walkDecls('background-color', (d) => {\n bgDecl = `background-color: ${d.value}${d.important ? ' !important' : ''}`\n })\n if (bgDecl) parts.push(bgDecl)\n\n if (horizontalBorderPx(root) === 0) {\n root.walkDecls((d) => {\n if (/^padding(-|$)/.test(d.prop)) {\n parts.push(`${d.prop}: ${d.value}${d.important ? ' !important' : ''}`)\n }\n })\n }\n }\n if (msoStyle) parts.push(msoStyle)\n\n tdStyles.set(tdId, parts.length ? ` style=\"${parts.join('; ')}\"` : '')\n }\n })\n\n if (widths.size === 0 && tdStyles.size === 0) return dom\n\n walk(dom, (node) => {\n if (node.type !== 'comment') return\n let data = (node as any).data as string\n if (!data) return\n const hasMsow = widths.size > 0 && data.includes('__MAIZZLE_MSOW_')\n const hasTd = tdStyles.size > 0 && data.includes('__MAIZZLE_MSOTDSTYLE_')\n if (!hasMsow && !hasTd) return\n\n if (hasMsow) {\n for (const [id, val] of widths) {\n data = data.replaceAll(`__MAIZZLE_MSOW_${id}__`, val)\n }\n }\n if (hasTd) {\n for (const [id, val] of tdStyles) {\n data = data.replaceAll(`__MAIZZLE_MSOTDSTYLE_${id}__`, val)\n }\n }\n ;(node as any).data = data\n })\n\n return dom\n}\n"],"mappings":";;;;;AAKA,MAAM,eAAe;AACrB,MAAM,WAAW;AACjB,MAAM,aAAa;AAEnB,SAAS,aAAa,OAA8B;CAClD,MAAM,UAAU,MAAM,KAAK;CAC3B,IAAI,WAAW,KAAK,OAAO,GAAG,OAAO;CACrC,MAAM,IAAI,QAAQ,MAAM,4BAA4B;CACpD,IAAI,CAAC,GAAG,OAAO;CACf,MAAM,IAAI,WAAW,EAAE,EAAE;CACzB,SAAS,EAAE,MAAM,MAAM,YAAY,GAAnC;EACE,KAAK,MAAM,OAAO,GAAG,KAAK,MAAM,CAAC,EAAE;EACnC,KAAK;EACL,KAAK,MAAM,OAAO,GAAG,KAAK,MAAM,IAAI,EAAE,EAAE;EACxC,KAAK,MAAM,OAAO,GAAG,KAAK,MAAM,IAAI,KAAK,EAAE;EAC3C,SAAS,OAAO;CAClB;AACF;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BA,SAAgB,gBAAgB,KAA+B;CAC7D,MAAM,yBAAS,IAAI,IAAoB;CACvC,MAAM,2BAAW,IAAI,IAAoB;CAEzC,KAAK,MAAM,SAAS;EAElB,MAAM,IAAIA,KAAG;EACb,IAAI,CAAC,GAAG;EAER,MAAM,SAAS,EAAE;EACjB,MAAM,OAAO,EAAE;EACf,IAAI,CAAC,UAAU,CAAC,MAAM;EAEtB,MAAM,QAAQ,EAAE,SAAS;EAEzB,IAAI,QAAQ;GACV,OAAO,EAAE;GACT,MAAM,WAAW,EAAE,iCAAiC;GACpD,OAAO,EAAE;GACT,MAAM,MAAM,MAAM,MAAM,YAAY,IAAI,MAAM,MAAM,MAAM,QAAQ,IAAI;GACtE,MAAM,WAAW,MAAM,aAAa,GAAG,IAAI;GAC3C,OAAO,IAAI,QAAQ,YAAY,QAAQ;EACzC;EAEA,IAAI,MAAM;GACR,OAAO,EAAE;GACT,MAAM,YAAY,EAAE,6BAA6B,IAAI,KAAK,EAAE,QAAQ,SAAS,EAAE;GAC/E,OAAO,EAAE;;;;;;;;;;;;;;;;GAiBT,MAAM,QAAkB,CAAC;GACzB,IAAI,OAAO;IACT,MAAM,OAAO,WAAW,KAAK;IAE7B,IAAI;IACJ,KAAK,UAAU,qBAAqB,MAAM;KACxC,SAAS,qBAAqB,EAAE,QAAQ,EAAE,YAAY,gBAAgB;IACxE,CAAC;IACD,IAAI,QAAQ,MAAM,KAAK,MAAM;IAE7B,IAAI,mBAAmB,IAAI,MAAM,GAC/B,KAAK,WAAW,MAAM;KACpB,IAAI,gBAAgB,KAAK,EAAE,IAAI,GAC7B,MAAM,KAAK,GAAG,EAAE,KAAK,IAAI,EAAE,QAAQ,EAAE,YAAY,gBAAgB,IAAI;IAEzE,CAAC;GAEL;GACA,IAAI,UAAU,MAAM,KAAK,QAAQ;GAEjC,SAAS,IAAI,MAAM,MAAM,SAAS,WAAW,MAAM,KAAK,IAAI,EAAE,KAAK,EAAE;EACvE;CACF,CAAC;CAED,IAAI,OAAO,SAAS,KAAK,SAAS,SAAS,GAAG,OAAO;CAErD,KAAK,MAAM,SAAS;EAClB,IAAI,KAAK,SAAS,WAAW;EAC7B,IAAI,OAAQ,KAAa;EACzB,IAAI,CAAC,MAAM;EACX,MAAM,UAAU,OAAO,OAAO,KAAK,KAAK,SAAS,iBAAiB;EAClE,MAAM,QAAQ,SAAS,OAAO,KAAK,KAAK,SAAS,uBAAuB;EACxE,IAAI,CAAC,WAAW,CAAC,OAAO;EAExB,IAAI,SACF,KAAK,MAAM,CAAC,IAAI,QAAQ,QACtB,OAAO,KAAK,WAAW,kBAAkB,GAAG,KAAK,GAAG;EAGxD,IAAI,OACF,KAAK,MAAM,CAAC,IAAI,QAAQ,UACtB,OAAO,KAAK,WAAW,wBAAwB,GAAG,KAAK,GAAG;EAG7D,KAAc,OAAO;CACxB,CAAC;CAED,OAAO;AACT"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"purgeCss.d.ts","names":[],"sources":["../../src/transformers/purgeCss.ts"],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"purgeCss.d.ts","names":[],"sources":["../../src/transformers/purgeCss.ts"],"mappings":";;;;;;AAsCA;UAAiB,eAAA,SAAwB,OAAA,CAAQ,IAAA,CAAK,IAAA;;;;;;EAMpD,QAAA;AAAA;;;;;AAAQ;AAqBV;;;;;;;;AAAoE;AASpE;;;;iBATgB,QAAA,CAAS,IAAA,UAAc,OAAA,GAAS,eAAoB;;;;;;iBASpD,WAAA,CAAY,GAAA,EAAK,SAAA,IAAa,OAAA,GAAS,eAAA,GAAuB,SAAA"}
|