@pandacss/parser 0.5.0 → 0.5.1
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/index.js +26 -34
- package/dist/index.mjs +26 -34
- package/package.json +8 -9
package/dist/index.js
CHANGED
|
@@ -206,7 +206,7 @@ function createParser(options) {
|
|
|
206
206
|
if (jsx) {
|
|
207
207
|
importRegex.push(createImportMatcher(importMap.jsx, [jsx.factory, ...jsx.nodes.map((node) => node.name)]));
|
|
208
208
|
}
|
|
209
|
-
return function
|
|
209
|
+
return function parse2(sourceFile) {
|
|
210
210
|
if (!sourceFile)
|
|
211
211
|
return;
|
|
212
212
|
const filePath = sourceFile.getFilePath();
|
|
@@ -221,11 +221,11 @@ function createParser(options) {
|
|
|
221
221
|
imports.value.length ? `Found import { ${imports} } in ${filePath}` : `No import found in ${filePath}`
|
|
222
222
|
);
|
|
223
223
|
const [css] = importRegex;
|
|
224
|
+
const jsxFactoryAlias = jsx ? imports.getAlias(jsx.factory) : "styled";
|
|
224
225
|
const isValidPattern = imports.createMatch(importMap.pattern);
|
|
225
226
|
const isValidRecipe = imports.createMatch(importMap.recipe);
|
|
226
227
|
const isValidStyleFn = (name) => name === jsx?.factory;
|
|
227
|
-
const isFactory = (name) => jsx && name.startsWith(
|
|
228
|
-
const jsxFactoryAlias = jsx ? imports.getAlias(jsx.factory) : "panda";
|
|
228
|
+
const isFactory = (name) => Boolean(jsx && name.startsWith(jsxFactoryAlias));
|
|
229
229
|
const jsxPatternNodes = new RegExp(
|
|
230
230
|
`^(${jsx?.nodes.map((node) => node.type === "pattern" && node.name).join("|")})$`
|
|
231
231
|
);
|
|
@@ -276,11 +276,9 @@ function createParser(options) {
|
|
|
276
276
|
const matchTag = (0, import_shared2.memo)((tagName) => {
|
|
277
277
|
if (!tagName)
|
|
278
278
|
return false;
|
|
279
|
-
return components.has(tagName) || isUpperCase(tagName) || tagName
|
|
279
|
+
return components.has(tagName) || isUpperCase(tagName) || isFactory(tagName) || isJsxTagRecipe(tagName);
|
|
280
280
|
});
|
|
281
281
|
const matchTagProp = (0, import_shared2.memo)((tagName, propName) => {
|
|
282
|
-
if (propertiesMap.size === 0)
|
|
283
|
-
return true;
|
|
284
282
|
if (Boolean(components.get(tagName)?.has(propName)) || options.jsx?.isStyleProp(propName) || propertiesMap.has(propName))
|
|
285
283
|
return true;
|
|
286
284
|
if (isJsxTagRecipe(tagName)) {
|
|
@@ -292,7 +290,7 @@ function createParser(options) {
|
|
|
292
290
|
const matchFn = (0, import_shared2.memo)((fnName) => {
|
|
293
291
|
if (recipes.has(fnName) || patterns.has(fnName))
|
|
294
292
|
return true;
|
|
295
|
-
if (fnName === cvaAlias || fnName === cssAlias || fnName
|
|
293
|
+
if (fnName === cvaAlias || fnName === cssAlias || isFactory(fnName))
|
|
296
294
|
return true;
|
|
297
295
|
return functions.has(fnName);
|
|
298
296
|
});
|
|
@@ -321,7 +319,7 @@ function createParser(options) {
|
|
|
321
319
|
measure();
|
|
322
320
|
extractResultByName.forEach((result, alias) => {
|
|
323
321
|
const name = imports.getName(alias);
|
|
324
|
-
import_logger.logger.debug(`ast:${name}`, {
|
|
322
|
+
import_logger.logger.debug(`ast:${name}`, name !== alias ? { kind: result.kind, alias } : { kind: result.kind });
|
|
325
323
|
if (result.kind === "function") {
|
|
326
324
|
(0, import_ts_pattern.match)(name).when(css.match, (name2) => {
|
|
327
325
|
result.queryList.forEach((query) => {
|
|
@@ -411,23 +409,16 @@ function createParser(options) {
|
|
|
411
409
|
} else if (result.kind === "component") {
|
|
412
410
|
result.queryList.forEach((query) => {
|
|
413
411
|
const data = combineResult((0, import_extractor.unbox)(query.box));
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
(name2) => {
|
|
418
|
-
collector.setJsx({ name: name2, box: query.box, type: "jsx-factory", data });
|
|
419
|
-
}
|
|
420
|
-
).when(
|
|
412
|
+
(0, import_ts_pattern.match)(name).when(isFactory, (name2) => {
|
|
413
|
+
collector.setJsx({ name: name2, box: query.box, type: "jsx-factory", data });
|
|
414
|
+
}).when(
|
|
421
415
|
(name2) => jsxPatternNodes.test(name2),
|
|
422
416
|
(name2) => {
|
|
423
417
|
collector.setPattern(name2, { type: "jsx-pattern", name: name2, box: query.box, data });
|
|
424
418
|
}
|
|
425
|
-
).when(
|
|
426
|
-
(name2)
|
|
427
|
-
|
|
428
|
-
collector.setRecipe(getRecipeName(name2), { type: "jsx-recipe", name: name2, box: query.box, data });
|
|
429
|
-
}
|
|
430
|
-
).otherwise(() => {
|
|
419
|
+
).when(isJsxTagRecipe, (name2) => {
|
|
420
|
+
collector.setRecipe(getRecipeName(name2), { type: "jsx-recipe", name: name2, box: query.box, data });
|
|
421
|
+
}).otherwise(() => {
|
|
431
422
|
collector.setJsx({ name, box: query.box, type: "jsx", data });
|
|
432
423
|
});
|
|
433
424
|
});
|
|
@@ -497,23 +488,24 @@ const render = ${fileStr.snip(templateStart, templateEnd).toString()}`
|
|
|
497
488
|
};
|
|
498
489
|
|
|
499
490
|
// src/svelte-to-tsx.ts
|
|
500
|
-
var svelte = __toESM(require("svelte/compiler"));
|
|
501
491
|
var import_magic_string2 = __toESM(require("magic-string"));
|
|
492
|
+
var regex_style_tags = /<!--[^]*?-->|<style(\s[^]*?)?(?:>([^]*?)<\/style>|\/>)/gi;
|
|
493
|
+
var regex_script_tags = /<!--[^]*?-->|<script(\s[^]*?)?(?:>([^]*?)<\/script>|\/>)/gi;
|
|
502
494
|
var svelteToTsx = (code) => {
|
|
503
495
|
try {
|
|
504
|
-
const
|
|
505
|
-
const
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
496
|
+
const scripts = [];
|
|
497
|
+
const original = new import_magic_string2.default(code);
|
|
498
|
+
let match2;
|
|
499
|
+
while ((match2 = regex_script_tags.exec(code)) != null) {
|
|
500
|
+
const [fullMatch, _attributesStr, scriptContent] = match2;
|
|
501
|
+
if (scriptContent) {
|
|
502
|
+
scripts.push(scriptContent);
|
|
503
|
+
original.remove(match2.index, match2.index + fullMatch.length);
|
|
504
|
+
}
|
|
509
505
|
}
|
|
510
|
-
const
|
|
511
|
-
const
|
|
512
|
-
|
|
513
|
-
const transformed = new import_magic_string2.default(
|
|
514
|
-
`${moduleContext + "\n"}${scriptContent + "\n"}
|
|
515
|
-
const render = <div>${templateContent}</div>`
|
|
516
|
-
);
|
|
506
|
+
const templateContent = original.toString().trimStart().replace(regex_style_tags, "").replace(regex_style_tags, "");
|
|
507
|
+
const transformed = `${scripts.join("")}
|
|
508
|
+
const render = <div>${templateContent}</div>`;
|
|
517
509
|
return transformed.toString().trim();
|
|
518
510
|
} catch (err) {
|
|
519
511
|
return "";
|
package/dist/index.mjs
CHANGED
|
@@ -168,7 +168,7 @@ function createParser(options) {
|
|
|
168
168
|
if (jsx) {
|
|
169
169
|
importRegex.push(createImportMatcher(importMap.jsx, [jsx.factory, ...jsx.nodes.map((node) => node.name)]));
|
|
170
170
|
}
|
|
171
|
-
return function
|
|
171
|
+
return function parse2(sourceFile) {
|
|
172
172
|
if (!sourceFile)
|
|
173
173
|
return;
|
|
174
174
|
const filePath = sourceFile.getFilePath();
|
|
@@ -183,11 +183,11 @@ function createParser(options) {
|
|
|
183
183
|
imports.value.length ? `Found import { ${imports} } in ${filePath}` : `No import found in ${filePath}`
|
|
184
184
|
);
|
|
185
185
|
const [css] = importRegex;
|
|
186
|
+
const jsxFactoryAlias = jsx ? imports.getAlias(jsx.factory) : "styled";
|
|
186
187
|
const isValidPattern = imports.createMatch(importMap.pattern);
|
|
187
188
|
const isValidRecipe = imports.createMatch(importMap.recipe);
|
|
188
189
|
const isValidStyleFn = (name) => name === jsx?.factory;
|
|
189
|
-
const isFactory = (name) => jsx && name.startsWith(
|
|
190
|
-
const jsxFactoryAlias = jsx ? imports.getAlias(jsx.factory) : "panda";
|
|
190
|
+
const isFactory = (name) => Boolean(jsx && name.startsWith(jsxFactoryAlias));
|
|
191
191
|
const jsxPatternNodes = new RegExp(
|
|
192
192
|
`^(${jsx?.nodes.map((node) => node.type === "pattern" && node.name).join("|")})$`
|
|
193
193
|
);
|
|
@@ -238,11 +238,9 @@ function createParser(options) {
|
|
|
238
238
|
const matchTag = memo2((tagName) => {
|
|
239
239
|
if (!tagName)
|
|
240
240
|
return false;
|
|
241
|
-
return components.has(tagName) || isUpperCase(tagName) || tagName
|
|
241
|
+
return components.has(tagName) || isUpperCase(tagName) || isFactory(tagName) || isJsxTagRecipe(tagName);
|
|
242
242
|
});
|
|
243
243
|
const matchTagProp = memo2((tagName, propName) => {
|
|
244
|
-
if (propertiesMap.size === 0)
|
|
245
|
-
return true;
|
|
246
244
|
if (Boolean(components.get(tagName)?.has(propName)) || options.jsx?.isStyleProp(propName) || propertiesMap.has(propName))
|
|
247
245
|
return true;
|
|
248
246
|
if (isJsxTagRecipe(tagName)) {
|
|
@@ -254,7 +252,7 @@ function createParser(options) {
|
|
|
254
252
|
const matchFn = memo2((fnName) => {
|
|
255
253
|
if (recipes.has(fnName) || patterns.has(fnName))
|
|
256
254
|
return true;
|
|
257
|
-
if (fnName === cvaAlias || fnName === cssAlias || fnName
|
|
255
|
+
if (fnName === cvaAlias || fnName === cssAlias || isFactory(fnName))
|
|
258
256
|
return true;
|
|
259
257
|
return functions.has(fnName);
|
|
260
258
|
});
|
|
@@ -283,7 +281,7 @@ function createParser(options) {
|
|
|
283
281
|
measure();
|
|
284
282
|
extractResultByName.forEach((result, alias) => {
|
|
285
283
|
const name = imports.getName(alias);
|
|
286
|
-
logger.debug(`ast:${name}`, {
|
|
284
|
+
logger.debug(`ast:${name}`, name !== alias ? { kind: result.kind, alias } : { kind: result.kind });
|
|
287
285
|
if (result.kind === "function") {
|
|
288
286
|
match(name).when(css.match, (name2) => {
|
|
289
287
|
result.queryList.forEach((query) => {
|
|
@@ -373,23 +371,16 @@ function createParser(options) {
|
|
|
373
371
|
} else if (result.kind === "component") {
|
|
374
372
|
result.queryList.forEach((query) => {
|
|
375
373
|
const data = combineResult(unbox(query.box));
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
(name2) => {
|
|
380
|
-
collector.setJsx({ name: name2, box: query.box, type: "jsx-factory", data });
|
|
381
|
-
}
|
|
382
|
-
).when(
|
|
374
|
+
match(name).when(isFactory, (name2) => {
|
|
375
|
+
collector.setJsx({ name: name2, box: query.box, type: "jsx-factory", data });
|
|
376
|
+
}).when(
|
|
383
377
|
(name2) => jsxPatternNodes.test(name2),
|
|
384
378
|
(name2) => {
|
|
385
379
|
collector.setPattern(name2, { type: "jsx-pattern", name: name2, box: query.box, data });
|
|
386
380
|
}
|
|
387
|
-
).when(
|
|
388
|
-
(name2)
|
|
389
|
-
|
|
390
|
-
collector.setRecipe(getRecipeName(name2), { type: "jsx-recipe", name: name2, box: query.box, data });
|
|
391
|
-
}
|
|
392
|
-
).otherwise(() => {
|
|
381
|
+
).when(isJsxTagRecipe, (name2) => {
|
|
382
|
+
collector.setRecipe(getRecipeName(name2), { type: "jsx-recipe", name: name2, box: query.box, data });
|
|
383
|
+
}).otherwise(() => {
|
|
393
384
|
collector.setJsx({ name, box: query.box, type: "jsx", data });
|
|
394
385
|
});
|
|
395
386
|
});
|
|
@@ -459,23 +450,24 @@ const render = ${fileStr.snip(templateStart, templateEnd).toString()}`
|
|
|
459
450
|
};
|
|
460
451
|
|
|
461
452
|
// src/svelte-to-tsx.ts
|
|
462
|
-
import * as svelte from "svelte/compiler";
|
|
463
453
|
import MagicString2 from "magic-string";
|
|
454
|
+
var regex_style_tags = /<!--[^]*?-->|<style(\s[^]*?)?(?:>([^]*?)<\/style>|\/>)/gi;
|
|
455
|
+
var regex_script_tags = /<!--[^]*?-->|<script(\s[^]*?)?(?:>([^]*?)<\/script>|\/>)/gi;
|
|
464
456
|
var svelteToTsx = (code) => {
|
|
465
457
|
try {
|
|
466
|
-
const
|
|
467
|
-
const
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
458
|
+
const scripts = [];
|
|
459
|
+
const original = new MagicString2(code);
|
|
460
|
+
let match2;
|
|
461
|
+
while ((match2 = regex_script_tags.exec(code)) != null) {
|
|
462
|
+
const [fullMatch, _attributesStr, scriptContent] = match2;
|
|
463
|
+
if (scriptContent) {
|
|
464
|
+
scripts.push(scriptContent);
|
|
465
|
+
original.remove(match2.index, match2.index + fullMatch.length);
|
|
466
|
+
}
|
|
471
467
|
}
|
|
472
|
-
const
|
|
473
|
-
const
|
|
474
|
-
|
|
475
|
-
const transformed = new MagicString2(
|
|
476
|
-
`${moduleContext + "\n"}${scriptContent + "\n"}
|
|
477
|
-
const render = <div>${templateContent}</div>`
|
|
478
|
-
);
|
|
468
|
+
const templateContent = original.toString().trimStart().replace(regex_style_tags, "").replace(regex_style_tags, "");
|
|
469
|
+
const transformed = `${scripts.join("")}
|
|
470
|
+
const render = <div>${templateContent}</div>`;
|
|
479
471
|
return transformed.toString().trim();
|
|
480
472
|
} catch (err) {
|
|
481
473
|
return "";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pandacss/parser",
|
|
3
|
-
"version": "0.5.
|
|
3
|
+
"version": "0.5.1",
|
|
4
4
|
"description": "The static parser for panda css",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"module": "dist/index.mjs",
|
|
@@ -14,19 +14,18 @@
|
|
|
14
14
|
"@vue/compiler-sfc": "^3.3.4",
|
|
15
15
|
"lil-fp": "1.4.5",
|
|
16
16
|
"magic-string": "^0.30.0",
|
|
17
|
-
"svelte": "^4.0.0",
|
|
18
17
|
"ts-morph": "18.0.0",
|
|
19
18
|
"ts-pattern": "4.3.0",
|
|
20
|
-
"@pandacss/extractor": "0.5.
|
|
21
|
-
"@pandacss/is-valid-prop": "0.5.
|
|
22
|
-
"@pandacss/logger": "0.5.
|
|
23
|
-
"@pandacss/shared": "0.5.
|
|
24
|
-
"@pandacss/types": "0.5.
|
|
19
|
+
"@pandacss/extractor": "0.5.1",
|
|
20
|
+
"@pandacss/is-valid-prop": "0.5.1",
|
|
21
|
+
"@pandacss/logger": "0.5.1",
|
|
22
|
+
"@pandacss/shared": "0.5.1",
|
|
23
|
+
"@pandacss/types": "0.5.1"
|
|
25
24
|
},
|
|
26
25
|
"devDependencies": {
|
|
27
26
|
"hookable": "5.5.3",
|
|
28
|
-
"@pandacss/fixture": "0.5.
|
|
29
|
-
"@pandacss/generator": "0.5.
|
|
27
|
+
"@pandacss/fixture": "0.5.1",
|
|
28
|
+
"@pandacss/generator": "0.5.1"
|
|
30
29
|
},
|
|
31
30
|
"files": [
|
|
32
31
|
"dist"
|