@unocss/svelte-scoped 66.5.10 → 66.5.12
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/preprocess-DHIfuYme.d.mts +7 -0
- package/dist/preprocess-smYe4zo2.mjs +563 -0
- package/dist/preprocess.d.mts +3 -9
- package/dist/preprocess.mjs +4 -9
- package/dist/{shared/svelte-scoped.BG2YMHlZ.d.mts → types-lojsQv1_.d.mts} +13 -16
- package/dist/vite.d.mts +12 -11
- package/dist/vite.mjs +238 -255
- package/package.json +7 -8
- package/dist/preprocess.d.ts +0 -9
- package/dist/shared/svelte-scoped.BF7qdJQ6.mjs +0 -575
- package/dist/shared/svelte-scoped.BG2YMHlZ.d.ts +0 -58
- package/dist/vite.d.ts +0 -42
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { a as UnocssSveltePreprocessOptions, t as SvelteScopedContext } from "./types-lojsQv1_.mjs";
|
|
2
|
+
import { PreprocessorGroup } from "svelte/types/compiler/preprocess";
|
|
3
|
+
|
|
4
|
+
//#region src/_preprocess/index.d.ts
|
|
5
|
+
declare function UnocssSveltePreprocess(options?: UnocssSveltePreprocessOptions, unoContextFromVite?: SvelteScopedContext, isViteBuild?: () => boolean): PreprocessorGroup;
|
|
6
|
+
//#endregion
|
|
7
|
+
export { UnocssSveltePreprocess as t };
|
|
@@ -0,0 +1,563 @@
|
|
|
1
|
+
import process from "node:process";
|
|
2
|
+
import { createRecoveryConfigLoader } from "@unocss/config";
|
|
3
|
+
import { createGenerator, expandVariantGroup, regexScopePlaceholder, toArray, warnOnce } from "@unocss/core";
|
|
4
|
+
import presetWind3 from "@unocss/preset-wind3";
|
|
5
|
+
import MagicString from "magic-string";
|
|
6
|
+
import * as acorn from "acorn";
|
|
7
|
+
import { walk } from "zimmerframe";
|
|
8
|
+
import { clone, generate, parse, walk as walk$1 } from "css-tree";
|
|
9
|
+
|
|
10
|
+
//#region src/_preprocess/transformClasses/addGeneratedStyles.ts
|
|
11
|
+
const actualStylesTagWithCapturedDirectivesRE = new RegExp(/(?<!<!--\s*)/.source + /<style([^>]*)>[\s\S]*?<\/style\s*>/.source, "g");
|
|
12
|
+
const captureOpeningStyleTagWithAttributesRE = /(<style[^>]*>)/;
|
|
13
|
+
function addGeneratedStylesIntoStyleBlock(code, styles) {
|
|
14
|
+
if (code.match(actualStylesTagWithCapturedDirectivesRE)) return code.replace(captureOpeningStyleTagWithAttributesRE, `$1${styles}`);
|
|
15
|
+
return `${code}\n<style>${styles}</style>`;
|
|
16
|
+
}
|
|
17
|
+
|
|
18
|
+
//#endregion
|
|
19
|
+
//#region src/_preprocess/transformClasses/findClasses.ts
|
|
20
|
+
const classesRE$1 = /class=(["'`])([\s\S]*?)\1/g;
|
|
21
|
+
const classDirectivesRE = /class:(\S+?)="?\{/g;
|
|
22
|
+
const classDirectivesShorthandRE = /class:([^=>\s/]+)[{>\s/]/g;
|
|
23
|
+
const classClsxRE = /(?<prefix>class=\{\w*)[[{(]/g;
|
|
24
|
+
function findClasses(code) {
|
|
25
|
+
const matchedClasses = [...code.matchAll(classesRE$1)];
|
|
26
|
+
const matchedClassDirectives = [...code.matchAll(classDirectivesRE)];
|
|
27
|
+
const matchedClassDirectivesShorthand = [...code.matchAll(classDirectivesShorthandRE)];
|
|
28
|
+
const matchedClassClsx = [...code.matchAll(classClsxRE)];
|
|
29
|
+
const classes = parseMatches(matchedClasses, "regular", 7);
|
|
30
|
+
const classDirectives = parseMatches(matchedClassDirectives, "directive", 6);
|
|
31
|
+
const classDirectivesShorthand = parseMatches(matchedClassDirectivesShorthand, "directiveShorthand", 6);
|
|
32
|
+
const classClsx = parseMatchesWithAcorn(matchedClassClsx, code);
|
|
33
|
+
return [
|
|
34
|
+
...classes,
|
|
35
|
+
...classDirectives,
|
|
36
|
+
...classDirectivesShorthand,
|
|
37
|
+
...classClsx
|
|
38
|
+
];
|
|
39
|
+
}
|
|
40
|
+
function parseMatches(matches, type, prefixLength) {
|
|
41
|
+
return matches.map((match) => {
|
|
42
|
+
const body = match[type === "regular" ? 2 : 1];
|
|
43
|
+
const start = match.index + prefixLength;
|
|
44
|
+
return {
|
|
45
|
+
body: body.trim(),
|
|
46
|
+
start,
|
|
47
|
+
end: start + body.length,
|
|
48
|
+
type
|
|
49
|
+
};
|
|
50
|
+
}).filter(hasBody);
|
|
51
|
+
}
|
|
52
|
+
function hasBody(foundClass) {
|
|
53
|
+
return foundClass.body;
|
|
54
|
+
}
|
|
55
|
+
function parseMatchesWithAcorn(matches, code) {
|
|
56
|
+
return matches.flatMap((match) => {
|
|
57
|
+
const start = match.index + match.groups.prefix.length;
|
|
58
|
+
const ast = acorn.parseExpressionAt(code, start, {
|
|
59
|
+
sourceType: "module",
|
|
60
|
+
ecmaVersion: 16,
|
|
61
|
+
locations: true
|
|
62
|
+
});
|
|
63
|
+
const classes = [];
|
|
64
|
+
function fromProperty(body, node, property) {
|
|
65
|
+
return {
|
|
66
|
+
body,
|
|
67
|
+
start: node.start,
|
|
68
|
+
end: node.end,
|
|
69
|
+
type: property.shorthand ? "clsxObjectShorthand" : "clsxObject"
|
|
70
|
+
};
|
|
71
|
+
}
|
|
72
|
+
function fromString(body, node) {
|
|
73
|
+
return {
|
|
74
|
+
body,
|
|
75
|
+
start: node.start + 1,
|
|
76
|
+
end: node.end - 1,
|
|
77
|
+
type: "regular"
|
|
78
|
+
};
|
|
79
|
+
}
|
|
80
|
+
walk(ast, { property: void 0 }, {
|
|
81
|
+
Property(node, { visit }) {
|
|
82
|
+
visit(node.key, { property: node });
|
|
83
|
+
},
|
|
84
|
+
Identifier(node, { state, next }) {
|
|
85
|
+
if (state.property) classes.push(fromProperty(node.name, node, state.property));
|
|
86
|
+
next();
|
|
87
|
+
},
|
|
88
|
+
Literal(node, { state, next }) {
|
|
89
|
+
if (typeof node.value === "string") {
|
|
90
|
+
const body = node.value;
|
|
91
|
+
if (state.property) classes.push(fromProperty(body, node, state.property));
|
|
92
|
+
else classes.push(fromString(body, node));
|
|
93
|
+
}
|
|
94
|
+
next();
|
|
95
|
+
},
|
|
96
|
+
TemplateLiteral(node, { state, next }) {
|
|
97
|
+
if (node.expressions.length === 0 && node.quasis.length === 1) {
|
|
98
|
+
const body = node.quasis[0].value.raw;
|
|
99
|
+
if (state.property) classes.push(fromProperty(body, node, state.property));
|
|
100
|
+
else classes.push(fromString(body, node));
|
|
101
|
+
}
|
|
102
|
+
next();
|
|
103
|
+
}
|
|
104
|
+
});
|
|
105
|
+
return classes;
|
|
106
|
+
}).filter(hasBody);
|
|
107
|
+
}
|
|
108
|
+
|
|
109
|
+
//#endregion
|
|
110
|
+
//#region src/_preprocess/transformClasses/hash.ts
|
|
111
|
+
function hash(str) {
|
|
112
|
+
let i;
|
|
113
|
+
let l;
|
|
114
|
+
let hval = 2166136261;
|
|
115
|
+
for (i = 0, l = str.length; i < l; i++) {
|
|
116
|
+
hval ^= str.charCodeAt(i);
|
|
117
|
+
hval += (hval << 1) + (hval << 4) + (hval << 7) + (hval << 8) + (hval << 24);
|
|
118
|
+
}
|
|
119
|
+
return `00000${(hval >>> 0).toString(36)}`.slice(-6);
|
|
120
|
+
}
|
|
121
|
+
|
|
122
|
+
//#endregion
|
|
123
|
+
//#region src/_preprocess/transformClasses/generateClassName.ts
|
|
124
|
+
function generateClassName(body, options, filename) {
|
|
125
|
+
const { classPrefix = "uno-", combine = true, hashFn = hash } = options;
|
|
126
|
+
if (combine) return `${classPrefix}${hashFn(body + filename)}`;
|
|
127
|
+
else return `_${body}_${hashFn(filename)}`;
|
|
128
|
+
}
|
|
129
|
+
|
|
130
|
+
//#endregion
|
|
131
|
+
//#region src/_preprocess/transformClasses/isShortcut.ts
|
|
132
|
+
function isShortcut(token, shortcuts) {
|
|
133
|
+
return shortcuts.some((s) => s[0] === token);
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
//#endregion
|
|
137
|
+
//#region src/_preprocess/transformClasses/needsGenerated.ts
|
|
138
|
+
async function needsGenerated(token, uno) {
|
|
139
|
+
if (uno.config.safelist.includes(token)) return false;
|
|
140
|
+
return !!await uno.parseToken(token);
|
|
141
|
+
}
|
|
142
|
+
|
|
143
|
+
//#endregion
|
|
144
|
+
//#region src/_preprocess/transformClasses/sortClassesIntoCategories.ts
|
|
145
|
+
async function sortClassesIntoCategories(body, options, uno, filename) {
|
|
146
|
+
const { combine = true } = options;
|
|
147
|
+
const rulesToGenerate = {};
|
|
148
|
+
const ignore = [];
|
|
149
|
+
const classes = body.trim().split(/\s+/);
|
|
150
|
+
const knownClassesToCombine = [];
|
|
151
|
+
for (const token of classes) {
|
|
152
|
+
if (!(isShortcut(token, uno.config.shortcuts) || await needsGenerated(token, uno))) {
|
|
153
|
+
ignore.push(token);
|
|
154
|
+
continue;
|
|
155
|
+
}
|
|
156
|
+
if (combine) knownClassesToCombine.push(token);
|
|
157
|
+
else {
|
|
158
|
+
const generatedClassName = generateClassName(token, options, filename);
|
|
159
|
+
rulesToGenerate[generatedClassName] = [token];
|
|
160
|
+
}
|
|
161
|
+
}
|
|
162
|
+
if (knownClassesToCombine.length) {
|
|
163
|
+
const generatedClassName = generateClassName(knownClassesToCombine.join(" "), options, filename);
|
|
164
|
+
rulesToGenerate[generatedClassName] = knownClassesToCombine;
|
|
165
|
+
}
|
|
166
|
+
return {
|
|
167
|
+
rulesToGenerate,
|
|
168
|
+
ignore
|
|
169
|
+
};
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
//#endregion
|
|
173
|
+
//#region src/_preprocess/transformClasses/processExpressions.ts
|
|
174
|
+
const expressionsRE = /\S*\{[^{}]+\}\S*/g;
|
|
175
|
+
const classesRE = /(?<=\?\s*|:\s*)(["'`])([\s\S]*?)\1/g;
|
|
176
|
+
async function processExpressions(body, options, uno, filename) {
|
|
177
|
+
const rulesToGenerate = {};
|
|
178
|
+
const updatedExpressions = [];
|
|
179
|
+
let restOfBody = body;
|
|
180
|
+
const expressions = [...body.matchAll(expressionsRE)];
|
|
181
|
+
for (let [expression] of expressions) {
|
|
182
|
+
restOfBody = restOfBody.replace(expression, "").trim();
|
|
183
|
+
const classes = [...expression.matchAll(classesRE)];
|
|
184
|
+
for (const [withQuotes, quoteMark, withoutQuotes] of classes) {
|
|
185
|
+
const { rulesToGenerate: rulesFromExpression, ignore } = await sortClassesIntoCategories(withoutQuotes, options, uno, filename);
|
|
186
|
+
Object.assign(rulesToGenerate, rulesFromExpression);
|
|
187
|
+
const updatedClasses = Object.keys(rulesFromExpression).concat(ignore).join(" ");
|
|
188
|
+
expression = expression.replace(withQuotes, quoteMark + updatedClasses + quoteMark);
|
|
189
|
+
}
|
|
190
|
+
updatedExpressions.push(expression);
|
|
191
|
+
}
|
|
192
|
+
return {
|
|
193
|
+
rulesToGenerate,
|
|
194
|
+
updatedExpressions,
|
|
195
|
+
restOfBody
|
|
196
|
+
};
|
|
197
|
+
}
|
|
198
|
+
|
|
199
|
+
//#endregion
|
|
200
|
+
//#region src/_preprocess/transformClasses/processClassBody.ts
|
|
201
|
+
async function processClassBody({ body, start, end }, options, uno, filename) {
|
|
202
|
+
const { rulesToGenerate: rulesFromExpressions, restOfBody, updatedExpressions } = await processExpressions(expandVariantGroup(body), options, uno, filename);
|
|
203
|
+
const { rulesToGenerate: rulesFromRegularClasses, ignore } = await sortClassesIntoCategories(restOfBody, options, uno, filename);
|
|
204
|
+
const rulesToGenerate = {
|
|
205
|
+
...rulesFromExpressions,
|
|
206
|
+
...rulesFromRegularClasses
|
|
207
|
+
};
|
|
208
|
+
if (!Object.keys(rulesToGenerate).length) return {};
|
|
209
|
+
return {
|
|
210
|
+
rulesToGenerate,
|
|
211
|
+
codeUpdate: {
|
|
212
|
+
content: Object.keys(rulesFromRegularClasses).concat(ignore).concat(updatedExpressions).join(" "),
|
|
213
|
+
start,
|
|
214
|
+
end
|
|
215
|
+
}
|
|
216
|
+
};
|
|
217
|
+
}
|
|
218
|
+
|
|
219
|
+
//#endregion
|
|
220
|
+
//#region src/_preprocess/transformClasses/processDirective.ts
|
|
221
|
+
async function processDirective({ body: token, start, end, type }, options, uno, filename) {
|
|
222
|
+
if (!(isShortcut(token, uno.config.shortcuts) || await needsGenerated(token, uno))) return;
|
|
223
|
+
const generatedClassName = generateClassName(token, options, filename);
|
|
224
|
+
const content = type === "directiveShorthand" ? `${generatedClassName}={${token}}` : generatedClassName;
|
|
225
|
+
return {
|
|
226
|
+
rulesToGenerate: { [generatedClassName]: [token] },
|
|
227
|
+
codeUpdate: {
|
|
228
|
+
content,
|
|
229
|
+
start,
|
|
230
|
+
end
|
|
231
|
+
}
|
|
232
|
+
};
|
|
233
|
+
}
|
|
234
|
+
|
|
235
|
+
//#endregion
|
|
236
|
+
//#region src/_preprocess/transformClasses/processClsx.ts
|
|
237
|
+
async function processClsx(cls, options, uno, filename) {
|
|
238
|
+
if (cls.type === "clsxObject") {
|
|
239
|
+
const { rulesToGenerate, codeUpdate } = await processClassBody({
|
|
240
|
+
...cls,
|
|
241
|
+
type: "regular"
|
|
242
|
+
}, options, uno, filename);
|
|
243
|
+
if (rulesToGenerate && codeUpdate) {
|
|
244
|
+
codeUpdate.content = `"${codeUpdate.content}"`;
|
|
245
|
+
return {
|
|
246
|
+
rulesToGenerate,
|
|
247
|
+
codeUpdate
|
|
248
|
+
};
|
|
249
|
+
}
|
|
250
|
+
} else if (cls.type === "clsxObjectShorthand") {
|
|
251
|
+
const { rulesToGenerate, codeUpdate } = await processDirective({
|
|
252
|
+
...cls,
|
|
253
|
+
type: "directive"
|
|
254
|
+
}, options, uno, filename) ?? {};
|
|
255
|
+
if (rulesToGenerate && codeUpdate) {
|
|
256
|
+
codeUpdate.content = `"${codeUpdate.content}": ${cls.body}`;
|
|
257
|
+
return {
|
|
258
|
+
rulesToGenerate,
|
|
259
|
+
codeUpdate
|
|
260
|
+
};
|
|
261
|
+
}
|
|
262
|
+
}
|
|
263
|
+
}
|
|
264
|
+
|
|
265
|
+
//#endregion
|
|
266
|
+
//#region src/_preprocess/transformClasses/processClasses.ts
|
|
267
|
+
async function processClasses(classes, options, uno, filename) {
|
|
268
|
+
const result = {
|
|
269
|
+
rulesToGenerate: {},
|
|
270
|
+
codeUpdates: []
|
|
271
|
+
};
|
|
272
|
+
for (const foundClass of classes) {
|
|
273
|
+
const { rulesToGenerate, codeUpdate } = await processClass(foundClass, options, uno, filename);
|
|
274
|
+
if (rulesToGenerate) Object.assign(result.rulesToGenerate, rulesToGenerate);
|
|
275
|
+
if (codeUpdate) result.codeUpdates.push(codeUpdate);
|
|
276
|
+
}
|
|
277
|
+
return result;
|
|
278
|
+
}
|
|
279
|
+
async function processClass(foundClass, options, uno, filename) {
|
|
280
|
+
if (foundClass.type === "regular") return await processClassBody(foundClass, options, uno, filename);
|
|
281
|
+
if (foundClass.type === "clsxObject" || foundClass.type === "clsxObjectShorthand") return await processClsx(foundClass, options, uno, filename) ?? {};
|
|
282
|
+
return await processDirective(foundClass, options, uno, filename) ?? {};
|
|
283
|
+
}
|
|
284
|
+
|
|
285
|
+
//#endregion
|
|
286
|
+
//#region src/_preprocess/transformClasses/wrapGlobal.ts
|
|
287
|
+
const EXTRACT_SELECTOR_RE = new RegExp(/(?<![\d(])/.source + /([[.][\s\S]+?)/.source + /(\{[\s\S]+?\})/.source, "g");
|
|
288
|
+
function wrapSelectorsWithGlobal(css) {
|
|
289
|
+
return css.replace(EXTRACT_SELECTOR_RE, ":global($1)$2");
|
|
290
|
+
}
|
|
291
|
+
|
|
292
|
+
//#endregion
|
|
293
|
+
//#region src/_preprocess/transformClasses/index.ts
|
|
294
|
+
async function transformClasses({ content, filename, uno, options }) {
|
|
295
|
+
const classesToProcess = findClasses(content);
|
|
296
|
+
if (!classesToProcess.length) return;
|
|
297
|
+
const { rulesToGenerate, codeUpdates } = await processClasses(classesToProcess, options, uno, filename);
|
|
298
|
+
if (!Object.keys(rulesToGenerate).length) return;
|
|
299
|
+
const { map, code } = updateTemplateCodeIfNeeded(codeUpdates, content, filename);
|
|
300
|
+
return {
|
|
301
|
+
code: addGeneratedStylesIntoStyleBlock(code, await generateStyles(rulesToGenerate, uno)),
|
|
302
|
+
map
|
|
303
|
+
};
|
|
304
|
+
}
|
|
305
|
+
function updateTemplateCodeIfNeeded(codeUpdates, source, filename) {
|
|
306
|
+
if (!codeUpdates.length) return {
|
|
307
|
+
code: source,
|
|
308
|
+
map: void 0
|
|
309
|
+
};
|
|
310
|
+
const s = new MagicString(source);
|
|
311
|
+
for (const { start, end, content } of codeUpdates) s.overwrite(start, end, content);
|
|
312
|
+
return {
|
|
313
|
+
code: s.toString(),
|
|
314
|
+
map: s.generateMap({
|
|
315
|
+
hires: true,
|
|
316
|
+
source: filename
|
|
317
|
+
})
|
|
318
|
+
};
|
|
319
|
+
}
|
|
320
|
+
const REMOVE_COMMENTS_TO_MAKE_GLOBAL_WRAPPING_EASY = true;
|
|
321
|
+
async function generateStyles(rulesToGenerate, uno) {
|
|
322
|
+
const shortcutsForThisComponent = Object.entries(rulesToGenerate);
|
|
323
|
+
uno.config.shortcuts.push(...shortcutsForThisComponent);
|
|
324
|
+
const selectorsToGenerate = Object.keys(rulesToGenerate);
|
|
325
|
+
const { css } = await uno.generate(selectorsToGenerate, {
|
|
326
|
+
preflights: false,
|
|
327
|
+
safelist: false,
|
|
328
|
+
minify: REMOVE_COMMENTS_TO_MAKE_GLOBAL_WRAPPING_EASY
|
|
329
|
+
});
|
|
330
|
+
return wrapSelectorsWithGlobal(css);
|
|
331
|
+
}
|
|
332
|
+
|
|
333
|
+
//#endregion
|
|
334
|
+
//#region src/_preprocess/transformApply/getUtils.ts
|
|
335
|
+
async function getUtils(body, uno) {
|
|
336
|
+
return (await parseUtils(expandVariantGroup(body).split(/\s+/g).map((className) => className.trim().replace(/\\/, "")), uno)).sort(([aIndex], [bIndex]) => aIndex - bIndex).sort(([, , , aParent], [, , , bParent]) => (aParent ? uno.parentOrders.get(aParent) ?? 0 : 0) - (bParent ? uno.parentOrders.get(bParent) ?? 0 : 0)).reduce((acc, item) => {
|
|
337
|
+
const [, selector, body$1, parent] = item;
|
|
338
|
+
const sibling = acc.find(([, targetSelector, , targetParent]) => targetSelector === selector && targetParent === parent);
|
|
339
|
+
if (sibling) sibling[2] += body$1;
|
|
340
|
+
else acc.push([...item]);
|
|
341
|
+
return acc;
|
|
342
|
+
}, []);
|
|
343
|
+
}
|
|
344
|
+
async function parseUtils(classNames, uno) {
|
|
345
|
+
const foundUtils = [];
|
|
346
|
+
for (const token of classNames) {
|
|
347
|
+
const util = await uno.parseToken(token, "-");
|
|
348
|
+
if (util) foundUtils.push(util);
|
|
349
|
+
else warnOnce(`'${token}' not found. You have a typo or need to add a preset.`);
|
|
350
|
+
}
|
|
351
|
+
return foundUtils.flat();
|
|
352
|
+
}
|
|
353
|
+
|
|
354
|
+
//#endregion
|
|
355
|
+
//#region src/_preprocess/transformApply/removeOuterQuotes.ts
|
|
356
|
+
function removeOuterQuotes(input) {
|
|
357
|
+
if (!input) return "";
|
|
358
|
+
return /^(['"]).*\1$/.test(input) ? input.slice(1, -1) : input;
|
|
359
|
+
}
|
|
360
|
+
|
|
361
|
+
//#endregion
|
|
362
|
+
//#region src/_preprocess/transformApply/writeUtilStyles.ts
|
|
363
|
+
function writeUtilStyles([, selector, body, parent], s, node, childNode) {
|
|
364
|
+
if (!selector) return;
|
|
365
|
+
const selectorChanged = selector !== ".\\-";
|
|
366
|
+
if (!parent && !selectorChanged) return s.appendRight(childNode.loc.end.offset, body);
|
|
367
|
+
const originalSelector = generate(node.prelude);
|
|
368
|
+
if (parent && !selectorChanged) {
|
|
369
|
+
const css$1 = `${parent}{${originalSelector}{${body}}}`;
|
|
370
|
+
return s.appendLeft(node.loc.end.offset, css$1);
|
|
371
|
+
}
|
|
372
|
+
const rule = `${surroundAllButOriginalSelectorWithGlobal(originalSelector, generateUpdatedSelector(selector.replace(regexScopePlaceholder, " "), node.prelude))}{${body}}`;
|
|
373
|
+
const css = parent ? `${parent}{${rule}}` : rule;
|
|
374
|
+
s.appendLeft(node.loc.end.offset, css);
|
|
375
|
+
}
|
|
376
|
+
function generateUpdatedSelector(selector, _prelude) {
|
|
377
|
+
const selectorAST = parse(selector, { context: "selector" });
|
|
378
|
+
const prelude = clone(_prelude);
|
|
379
|
+
prelude.children.forEach((child) => {
|
|
380
|
+
const parentSelectorAst = clone(selectorAST);
|
|
381
|
+
parentSelectorAst.children.forEach((i) => {
|
|
382
|
+
if (i.type === "ClassSelector" && i.name === "\\-") Object.assign(i, clone(child));
|
|
383
|
+
});
|
|
384
|
+
Object.assign(child, parentSelectorAst);
|
|
385
|
+
});
|
|
386
|
+
return generate(prelude);
|
|
387
|
+
}
|
|
388
|
+
function surroundAllButOriginalSelectorWithGlobal(originalSelector, updatedSelector) {
|
|
389
|
+
const wrapWithGlobal = (str) => `:global(${str})`;
|
|
390
|
+
const originalSelectors = originalSelector.split(",").map((s) => s.trim());
|
|
391
|
+
const updatedSelectors = updatedSelector.split(",").map((s) => s.trim());
|
|
392
|
+
return originalSelectors.map((original, index) => {
|
|
393
|
+
const [prefix, suffix] = updatedSelectors[index].split(original).map((s) => s.trim());
|
|
394
|
+
const wrappedPrefix = prefix ? wrapWithGlobal(prefix) : "";
|
|
395
|
+
if (!suffix) return `${wrappedPrefix} ${original}`.trim();
|
|
396
|
+
const indexOfFirstCombinator = findFirstCombinatorIndex(suffix);
|
|
397
|
+
if (indexOfFirstCombinator === -1) return `${wrappedPrefix} ${original}${suffix}`.trim();
|
|
398
|
+
return `${wrappedPrefix} ${original}${suffix.substring(0, indexOfFirstCombinator).trim()} ${wrapWithGlobal(suffix.substring(indexOfFirstCombinator).trim())}`.trim();
|
|
399
|
+
}).join(", ");
|
|
400
|
+
}
|
|
401
|
+
function findFirstCombinatorIndex(input) {
|
|
402
|
+
for (const c of [
|
|
403
|
+
" ",
|
|
404
|
+
">",
|
|
405
|
+
"~",
|
|
406
|
+
"+"
|
|
407
|
+
]) {
|
|
408
|
+
const indexOfFirstCombinator = input.indexOf(c);
|
|
409
|
+
if (indexOfFirstCombinator !== -1) return indexOfFirstCombinator;
|
|
410
|
+
}
|
|
411
|
+
return -1;
|
|
412
|
+
}
|
|
413
|
+
|
|
414
|
+
//#endregion
|
|
415
|
+
//#region src/_preprocess/transformApply/index.ts
|
|
416
|
+
async function transformApply(ctx) {
|
|
417
|
+
const ast = parse(ctx.s.original, {
|
|
418
|
+
parseAtrulePrelude: false,
|
|
419
|
+
positions: true
|
|
420
|
+
});
|
|
421
|
+
if (ast.type !== "StyleSheet") return ctx.s;
|
|
422
|
+
const stack = [];
|
|
423
|
+
walk$1(ast, (node) => {
|
|
424
|
+
if (node.type === "Rule") stack.push(handleApply(ctx, node));
|
|
425
|
+
});
|
|
426
|
+
await Promise.all(stack);
|
|
427
|
+
return ctx.s;
|
|
428
|
+
}
|
|
429
|
+
/** transformerDirectives's handleApply function checks for style nesting (childNode.type === 'Raw') but we are not supporting it here as it is not valid syntax in Svelte style tags. If browser support becomes mainstream and Svelte updates in kind, we can support that. */
|
|
430
|
+
async function handleApply(ctx, node) {
|
|
431
|
+
const parsePromises = node.block.children.map(async (childNode) => {
|
|
432
|
+
await parseApply(ctx, node, childNode);
|
|
433
|
+
});
|
|
434
|
+
await Promise.all(parsePromises);
|
|
435
|
+
}
|
|
436
|
+
async function parseApply({ s, uno, applyVariables }, node, childNode) {
|
|
437
|
+
const body = getChildNodeValue(childNode, applyVariables);
|
|
438
|
+
if (!body) return;
|
|
439
|
+
const utils = await getUtils(body, uno);
|
|
440
|
+
if (!utils.length) return;
|
|
441
|
+
let end = childNode.loc.end.offset;
|
|
442
|
+
if (s.slice(end, end + 1) === ";") end += 1;
|
|
443
|
+
s.remove(childNode.loc.start.offset, end);
|
|
444
|
+
for (const util of utils) writeUtilStyles(util, s, node, childNode);
|
|
445
|
+
}
|
|
446
|
+
function getChildNodeValue(childNode, applyVariables) {
|
|
447
|
+
if (childNode.type === "Atrule" && childNode.name === "apply" && childNode.prelude && childNode.prelude.type === "Raw") return childNode.prelude.value.trim();
|
|
448
|
+
if (childNode.type === "Declaration" && applyVariables.includes(childNode.property) && childNode.value.type === "Raw") return removeOuterQuotes(childNode.value.value.trim());
|
|
449
|
+
}
|
|
450
|
+
|
|
451
|
+
//#endregion
|
|
452
|
+
//#region src/_preprocess/transformTheme.ts
|
|
453
|
+
const themeRE = /theme\((.+?)\)/g;
|
|
454
|
+
function transformTheme(s, theme) {
|
|
455
|
+
return s.replace(themeRE, (_, match) => {
|
|
456
|
+
return getThemeValue(match.slice(1, -1), theme);
|
|
457
|
+
});
|
|
458
|
+
}
|
|
459
|
+
function getThemeValue(rawArguments, theme) {
|
|
460
|
+
const keys = rawArguments.split(".");
|
|
461
|
+
let current = theme;
|
|
462
|
+
for (const key of keys) if (current[key] === void 0) throw new Error(`"${rawArguments}" is not found in your theme`);
|
|
463
|
+
else current = current[key];
|
|
464
|
+
return current;
|
|
465
|
+
}
|
|
466
|
+
|
|
467
|
+
//#endregion
|
|
468
|
+
//#region src/_preprocess/transformStyle.ts
|
|
469
|
+
const DEFAULT_APPLY_VARIABLES = ["--at-apply"];
|
|
470
|
+
function checkForApply(content, _applyVariables) {
|
|
471
|
+
if (_applyVariables === false) return {
|
|
472
|
+
hasApply: false,
|
|
473
|
+
applyVariables: []
|
|
474
|
+
};
|
|
475
|
+
const applyVariables = toArray(_applyVariables || DEFAULT_APPLY_VARIABLES);
|
|
476
|
+
return {
|
|
477
|
+
hasApply: content.includes("@apply") || applyVariables.some((v) => content.includes(v)),
|
|
478
|
+
applyVariables
|
|
479
|
+
};
|
|
480
|
+
}
|
|
481
|
+
async function transformStyle({ content, uno, prepend, filename, applyVariables, transformThemeFn }) {
|
|
482
|
+
const s = new MagicString(content);
|
|
483
|
+
if (applyVariables?.length) await transformApply({
|
|
484
|
+
s,
|
|
485
|
+
uno,
|
|
486
|
+
applyVariables
|
|
487
|
+
});
|
|
488
|
+
if (transformThemeFn) transformTheme(s, uno.config.theme);
|
|
489
|
+
if (!s.hasChanged()) return;
|
|
490
|
+
if (prepend) s.prepend(prepend);
|
|
491
|
+
return {
|
|
492
|
+
code: s.toString(),
|
|
493
|
+
map: s.generateMap({
|
|
494
|
+
hires: true,
|
|
495
|
+
source: filename || ""
|
|
496
|
+
})
|
|
497
|
+
};
|
|
498
|
+
}
|
|
499
|
+
|
|
500
|
+
//#endregion
|
|
501
|
+
//#region src/_preprocess/index.ts
|
|
502
|
+
function UnocssSveltePreprocess(options = {}, unoContextFromVite, isViteBuild) {
|
|
503
|
+
if (!options.classPrefix) options.classPrefix = "usp-";
|
|
504
|
+
let uno;
|
|
505
|
+
const makeGenerator = async () => {
|
|
506
|
+
if (unoContextFromVite) {
|
|
507
|
+
await unoContextFromVite.ready;
|
|
508
|
+
return unoContextFromVite.uno;
|
|
509
|
+
}
|
|
510
|
+
const defaults = { presets: [presetWind3()] };
|
|
511
|
+
return await createGenerator((await createRecoveryConfigLoader()(process.cwd(), options.configOrPath)).config, defaults);
|
|
512
|
+
};
|
|
513
|
+
return {
|
|
514
|
+
markup: async ({ content, filename }) => {
|
|
515
|
+
uno ??= await makeGenerator();
|
|
516
|
+
if (isViteBuild && options.combine === void 0) options.combine = isViteBuild();
|
|
517
|
+
return await transformClasses({
|
|
518
|
+
content,
|
|
519
|
+
filename: filename || "",
|
|
520
|
+
uno,
|
|
521
|
+
options
|
|
522
|
+
});
|
|
523
|
+
},
|
|
524
|
+
style: async ({ content, attributes, filename }) => {
|
|
525
|
+
const svelte3AddPreflights = attributes["uno:preflights"];
|
|
526
|
+
const svelte3AddSafelist = attributes["uno:safelist"];
|
|
527
|
+
const svelte4DeprecatedAddPreflights = attributes.uno && attributes.preflights;
|
|
528
|
+
const svelte4DeprecatedAddSafelist = attributes.uno && attributes.safelist;
|
|
529
|
+
let addPreflights = attributes["uno-preflights"] || svelte3AddPreflights || svelte4DeprecatedAddPreflights;
|
|
530
|
+
let addSafelist = attributes["uno-safelist"] || svelte3AddSafelist || svelte4DeprecatedAddSafelist;
|
|
531
|
+
if (unoContextFromVite && (addPreflights || addSafelist)) {
|
|
532
|
+
addPreflights = false;
|
|
533
|
+
addSafelist = false;
|
|
534
|
+
warnOnce("Notice for those transitioning to @unocss/svelte-scoped/vite: uno-preflights and uno-safelist are only for use in component libraries. Please see the documentation for how to add preflights and safelist into your head tag. If you are consuming a component library built by @unocss/svelte-scoped/preprocess, you can ignore this upgrade notice.");
|
|
535
|
+
}
|
|
536
|
+
const { hasApply, applyVariables } = checkForApply(content, options.applyVariables);
|
|
537
|
+
const hasThemeFn = options.transformThemeDirective === false ? false : !!content.match(themeRE);
|
|
538
|
+
if (!(addPreflights || addSafelist || hasApply || hasThemeFn)) return;
|
|
539
|
+
uno ??= await makeGenerator();
|
|
540
|
+
let preflightsSafelistCss = "";
|
|
541
|
+
if (addPreflights || addSafelist) {
|
|
542
|
+
const { css } = await uno.generate([], {
|
|
543
|
+
preflights: !!addPreflights,
|
|
544
|
+
safelist: !!addSafelist,
|
|
545
|
+
minify: true
|
|
546
|
+
});
|
|
547
|
+
preflightsSafelistCss = wrapSelectorsWithGlobal(css);
|
|
548
|
+
}
|
|
549
|
+
if (hasApply || hasThemeFn) return await transformStyle({
|
|
550
|
+
content,
|
|
551
|
+
uno,
|
|
552
|
+
filename,
|
|
553
|
+
prepend: preflightsSafelistCss,
|
|
554
|
+
applyVariables,
|
|
555
|
+
transformThemeFn: hasThemeFn
|
|
556
|
+
});
|
|
557
|
+
if (preflightsSafelistCss) return { code: preflightsSafelistCss + content };
|
|
558
|
+
}
|
|
559
|
+
};
|
|
560
|
+
}
|
|
561
|
+
|
|
562
|
+
//#endregion
|
|
563
|
+
export { UnocssSveltePreprocess as t };
|
package/dist/preprocess.d.mts
CHANGED
|
@@ -1,9 +1,3 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
3
|
-
export {
|
|
4
|
-
import '@unocss/config';
|
|
5
|
-
import '@unocss/core';
|
|
6
|
-
|
|
7
|
-
declare function UnocssSveltePreprocess(options?: UnocssSveltePreprocessOptions, unoContextFromVite?: SvelteScopedContext, isViteBuild?: () => boolean): PreprocessorGroup;
|
|
8
|
-
|
|
9
|
-
export { SvelteScopedContext, UnocssSveltePreprocessOptions, UnocssSveltePreprocess as default };
|
|
1
|
+
import { a as UnocssSveltePreprocessOptions, i as TransformDirectivesOptions, n as TransformApplyOptions, r as TransformClassesOptions, t as SvelteScopedContext } from "./types-lojsQv1_.mjs";
|
|
2
|
+
import { t as UnocssSveltePreprocess } from "./preprocess-DHIfuYme.mjs";
|
|
3
|
+
export { SvelteScopedContext, TransformApplyOptions, TransformClassesOptions, TransformDirectivesOptions, UnocssSveltePreprocessOptions, UnocssSveltePreprocess as default };
|
package/dist/preprocess.mjs
CHANGED
|
@@ -1,9 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
import
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
import '@unocss/preset-wind3';
|
|
6
|
-
import 'magic-string';
|
|
7
|
-
import 'acorn';
|
|
8
|
-
import 'zimmerframe';
|
|
9
|
-
import 'css-tree';
|
|
1
|
+
import { t as UnocssSveltePreprocess } from "./preprocess-smYe4zo2.mjs";
|
|
2
|
+
import { a as UnocssSveltePreprocessOptions, i as TransformDirectivesOptions, n as TransformApplyOptions, r as TransformClassesOptions, t as SvelteScopedContext } from "./types-lojsQv1_.d.mts";
|
|
3
|
+
|
|
4
|
+
export { SvelteScopedContext, TransformApplyOptions, TransformClassesOptions, TransformDirectivesOptions, UnocssSveltePreprocessOptions, UnocssSveltePreprocess as default };
|
|
@@ -1,31 +1,30 @@
|
|
|
1
|
-
import { LoadConfigResult } from
|
|
2
|
-
import {
|
|
1
|
+
import { LoadConfigResult } from "@unocss/config";
|
|
2
|
+
import { UnoGenerator, UserConfig } from "@unocss/core";
|
|
3
3
|
|
|
4
|
+
//#region src/_preprocess/types.d.ts
|
|
4
5
|
interface UnocssSveltePreprocessOptions extends TransformClassesOptions, TransformApplyOptions, TransformDirectivesOptions {
|
|
5
6
|
/**
|
|
6
7
|
* UnoCSS config or path to config file. If not provided, will load unocss.config.ts/js. It's recommended to use the separate config file if you are having trouble with the UnoCSS extension in VSCode.
|
|
7
8
|
*/
|
|
8
|
-
configOrPath?: UserConfig | string
|
|
9
|
+
configOrPath?: UserConfig | string;
|
|
9
10
|
}
|
|
10
|
-
|
|
11
11
|
interface TransformClassesOptions {
|
|
12
12
|
/**
|
|
13
13
|
* Prefix for compiled class names. Distinct between `@unocss/svelte-scoped/vite` and `@unocss/svelte-scoped/preprocessor` to avoid bugs when using a component library built with `@unocss/svelte-scoped/preprocessor` in a project using `@unocss/svelte-scoped/vite`.
|
|
14
14
|
* @default 'uno-' // `@unocss/svelte-scoped/vite`
|
|
15
15
|
* @default 'usp-' // `@unocss/svelte-scoped/preprocessor`
|
|
16
16
|
*/
|
|
17
|
-
classPrefix?: string
|
|
17
|
+
classPrefix?: string;
|
|
18
18
|
/**
|
|
19
19
|
* Add hash and combine recognized tokens (optimal for production); set false in dev mode for easy dev tools toggling to allow for design adjustments in the browser
|
|
20
20
|
* @default true
|
|
21
21
|
*/
|
|
22
|
-
combine?: boolean
|
|
22
|
+
combine?: boolean;
|
|
23
23
|
/**
|
|
24
24
|
* Used to generate hash for compiled class names
|
|
25
25
|
*/
|
|
26
|
-
hashFn?: (str: string) => string
|
|
26
|
+
hashFn?: (str: string) => string;
|
|
27
27
|
}
|
|
28
|
-
|
|
29
28
|
interface TransformApplyOptions {
|
|
30
29
|
/**
|
|
31
30
|
* Transform CSS custom properties (recommended for CSS syntax compatibility) or @apply directives.
|
|
@@ -34,9 +33,8 @@ interface TransformApplyOptions {
|
|
|
34
33
|
*
|
|
35
34
|
* @default ['--at-apply', '@apply']
|
|
36
35
|
*/
|
|
37
|
-
applyVariables?: string | string[] | false
|
|
36
|
+
applyVariables?: string | string[] | false;
|
|
38
37
|
}
|
|
39
|
-
|
|
40
38
|
interface TransformDirectivesOptions {
|
|
41
39
|
/**
|
|
42
40
|
* Transform the `theme()` directive (recommended for CSS syntax compatibility).
|
|
@@ -47,12 +45,11 @@ interface TransformDirectivesOptions {
|
|
|
47
45
|
*
|
|
48
46
|
* @default true
|
|
49
47
|
*/
|
|
50
|
-
transformThemeDirective?: boolean
|
|
48
|
+
transformThemeDirective?: boolean;
|
|
51
49
|
}
|
|
52
|
-
|
|
53
50
|
interface SvelteScopedContext {
|
|
54
|
-
uno: UnoGenerator
|
|
55
|
-
ready: Promise<LoadConfigResult<UserConfig
|
|
51
|
+
uno: UnoGenerator;
|
|
52
|
+
ready: Promise<LoadConfigResult<UserConfig>>;
|
|
56
53
|
}
|
|
57
|
-
|
|
58
|
-
export
|
|
54
|
+
//#endregion
|
|
55
|
+
export { UnocssSveltePreprocessOptions as a, TransformDirectivesOptions as i, TransformApplyOptions as n, TransformClassesOptions as r, SvelteScopedContext as t };
|