@unocss/transformer-directives 0.26.3 → 0.27.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.
Files changed (4) hide show
  1. package/dist/index.cjs +15 -21
  2. package/dist/index.d.ts +2 -1
  3. package/dist/index.mjs +16 -22
  4. package/package.json +5 -2
package/dist/index.cjs CHANGED
@@ -17,32 +17,32 @@ function transformerDirectives() {
17
17
  }
18
18
  };
19
19
  }
20
- async function transformDirectives(css, uno, filename) {
21
- if (!css.includes("@apply"))
22
- return css;
23
- const ast = cssTree.parse(css, {
20
+ async function transformDirectives(code, uno, filename) {
21
+ if (!code.original.includes("@apply"))
22
+ return;
23
+ const ast = cssTree.parse(code.original, {
24
24
  parseAtrulePrelude: false,
25
25
  positions: true,
26
26
  filename
27
27
  });
28
28
  if (ast.type !== "StyleSheet")
29
- return css;
29
+ return;
30
30
  const stack = [];
31
- const processNode = async (node, item, list) => {
31
+ const processNode = async (node, _item, _list) => {
32
32
  if (node.type !== "Rule")
33
33
  return;
34
- await Promise.all(node.block.children.map(async (childNode, childItem) => {
34
+ await Promise.all(node.block.children.map(async (childNode, _childItem) => {
35
35
  if (!(childNode.type === "Atrule" && childNode.name === "apply" && childNode.prelude))
36
36
  return;
37
37
  if (childNode.prelude.type !== "Raw")
38
38
  return;
39
39
  const classNames = core.expandVariantGroup(childNode.prelude.value).split(/\s+/g);
40
- const utils = (await Promise.all(classNames.map((i) => uno.parseToken(i, "-")))).filter(core.notNull).flat().sort((a, b) => a[0] - b[0]).reduce((acc, item2) => {
41
- const target = acc.find((i) => i[1] === item2[1] && i[3] === item2[3]);
40
+ const utils = (await Promise.all(classNames.map((i) => uno.parseToken(i, "-")))).filter(core.notNull).flat().sort((a, b) => a[0] - b[0]).sort((a, b) => (a[3] ? uno.parentOrders.get(a[3]) ?? 0 : 0) - (b[3] ? uno.parentOrders.get(b[3]) ?? 0 : 0)).reduce((acc, item) => {
41
+ const target = acc.find((i) => i[1] === item[1] && i[3] === item[3]);
42
42
  if (target)
43
- target[2] += item2[2];
43
+ target[2] += item[2];
44
44
  else
45
- acc.push([...item2]);
45
+ acc.push([...item]);
46
46
  return acc;
47
47
  }, []);
48
48
  if (!utils.length)
@@ -53,8 +53,7 @@ async function transformDirectives(css, uno, filename) {
53
53
  const selector = _selector?.replace(core.regexScopePlaceholder, " ") || _selector;
54
54
  if (parent) {
55
55
  const newNodeCss = `${parent}{${parentSelector}{${body}}}`;
56
- const insertNodeAst = cssTree.parse(newNodeCss);
57
- list.insertList(insertNodeAst.children, item);
56
+ code.appendLeft(node.loc.end.offset, newNodeCss);
58
57
  } else if (selector && selector !== ".\\-") {
59
58
  const selectorAST = cssTree.parse(selector, {
60
59
  context: "selector"
@@ -69,21 +68,16 @@ async function transformDirectives(css, uno, filename) {
69
68
  Object.assign(child, parentSelectorAst);
70
69
  });
71
70
  const newNodeCss = `${cssTree.generate(prelude)}{${body}}`;
72
- const insertNodeAst = cssTree.parse(newNodeCss);
73
- list.insertList(insertNodeAst.children, item);
71
+ code.appendLeft(node.loc.end.offset, newNodeCss);
74
72
  } else {
75
- const rules = new cssTree.List().fromArray(body.replace(/;$/, "").split(";")).map((i2) => cssTree.parse(i2, {
76
- context: "declaration"
77
- }));
78
- node.block.children.insertList(rules, childItem);
73
+ code.appendRight(childNode.loc.end.offset, body);
79
74
  }
80
75
  }
81
- node.block.children.remove(childItem);
76
+ code.remove(childNode.loc.start.offset, childNode.loc.end.offset);
82
77
  }).toArray());
83
78
  };
84
79
  cssTree.walk(ast, (...args) => stack.push(processNode(...args)));
85
80
  await Promise.all(stack);
86
- return cssTree.generate(ast);
87
81
  }
88
82
 
89
83
  exports["default"] = transformerDirectives;
package/dist/index.d.ts CHANGED
@@ -1,6 +1,7 @@
1
1
  import { SourceCodeTransformer, UnoGenerator } from '@unocss/core';
2
+ import MagicString from 'magic-string-extra';
2
3
 
3
4
  declare function transformerDirectives(): SourceCodeTransformer;
4
- declare function transformDirectives(css: string, uno: UnoGenerator, filename?: string): Promise<string>;
5
+ declare function transformDirectives(code: MagicString, uno: UnoGenerator, filename?: string): Promise<void>;
5
6
 
6
7
  export { transformerDirectives as default, transformDirectives };
package/dist/index.mjs CHANGED
@@ -1,5 +1,5 @@
1
1
  import { expandVariantGroup, notNull, regexScopePlaceholder } from '@unocss/core';
2
- import { parse, walk, generate, clone, List } from 'css-tree';
2
+ import { parse, walk, generate, clone } from 'css-tree';
3
3
 
4
4
  const regexCssId = /\.(css|postcss|sass|scss|less|stylus|styl)$/;
5
5
 
@@ -13,32 +13,32 @@ function transformerDirectives() {
13
13
  }
14
14
  };
15
15
  }
16
- async function transformDirectives(css, uno, filename) {
17
- if (!css.includes("@apply"))
18
- return css;
19
- const ast = parse(css, {
16
+ async function transformDirectives(code, uno, filename) {
17
+ if (!code.original.includes("@apply"))
18
+ return;
19
+ const ast = parse(code.original, {
20
20
  parseAtrulePrelude: false,
21
21
  positions: true,
22
22
  filename
23
23
  });
24
24
  if (ast.type !== "StyleSheet")
25
- return css;
25
+ return;
26
26
  const stack = [];
27
- const processNode = async (node, item, list) => {
27
+ const processNode = async (node, _item, _list) => {
28
28
  if (node.type !== "Rule")
29
29
  return;
30
- await Promise.all(node.block.children.map(async (childNode, childItem) => {
30
+ await Promise.all(node.block.children.map(async (childNode, _childItem) => {
31
31
  if (!(childNode.type === "Atrule" && childNode.name === "apply" && childNode.prelude))
32
32
  return;
33
33
  if (childNode.prelude.type !== "Raw")
34
34
  return;
35
35
  const classNames = expandVariantGroup(childNode.prelude.value).split(/\s+/g);
36
- const utils = (await Promise.all(classNames.map((i) => uno.parseToken(i, "-")))).filter(notNull).flat().sort((a, b) => a[0] - b[0]).reduce((acc, item2) => {
37
- const target = acc.find((i) => i[1] === item2[1] && i[3] === item2[3]);
36
+ const utils = (await Promise.all(classNames.map((i) => uno.parseToken(i, "-")))).filter(notNull).flat().sort((a, b) => a[0] - b[0]).sort((a, b) => (a[3] ? uno.parentOrders.get(a[3]) ?? 0 : 0) - (b[3] ? uno.parentOrders.get(b[3]) ?? 0 : 0)).reduce((acc, item) => {
37
+ const target = acc.find((i) => i[1] === item[1] && i[3] === item[3]);
38
38
  if (target)
39
- target[2] += item2[2];
39
+ target[2] += item[2];
40
40
  else
41
- acc.push([...item2]);
41
+ acc.push([...item]);
42
42
  return acc;
43
43
  }, []);
44
44
  if (!utils.length)
@@ -49,8 +49,7 @@ async function transformDirectives(css, uno, filename) {
49
49
  const selector = _selector?.replace(regexScopePlaceholder, " ") || _selector;
50
50
  if (parent) {
51
51
  const newNodeCss = `${parent}{${parentSelector}{${body}}}`;
52
- const insertNodeAst = parse(newNodeCss);
53
- list.insertList(insertNodeAst.children, item);
52
+ code.appendLeft(node.loc.end.offset, newNodeCss);
54
53
  } else if (selector && selector !== ".\\-") {
55
54
  const selectorAST = parse(selector, {
56
55
  context: "selector"
@@ -65,21 +64,16 @@ async function transformDirectives(css, uno, filename) {
65
64
  Object.assign(child, parentSelectorAst);
66
65
  });
67
66
  const newNodeCss = `${generate(prelude)}{${body}}`;
68
- const insertNodeAst = parse(newNodeCss);
69
- list.insertList(insertNodeAst.children, item);
67
+ code.appendLeft(node.loc.end.offset, newNodeCss);
70
68
  } else {
71
- const rules = new List().fromArray(body.replace(/;$/, "").split(";")).map((i2) => parse(i2, {
72
- context: "declaration"
73
- }));
74
- node.block.children.insertList(rules, childItem);
69
+ code.appendRight(childNode.loc.end.offset, body);
75
70
  }
76
71
  }
77
- node.block.children.remove(childItem);
72
+ code.remove(childNode.loc.start.offset, childNode.loc.end.offset);
78
73
  }).toArray());
79
74
  };
80
75
  walk(ast, (...args) => stack.push(processNode(...args)));
81
76
  await Promise.all(stack);
82
- return generate(ast);
83
77
  }
84
78
 
85
79
  export { transformerDirectives as default, transformDirectives };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@unocss/transformer-directives",
3
- "version": "0.26.3",
3
+ "version": "0.27.1",
4
4
  "description": "UnoCSS transformer for `@apply` directive",
5
5
  "keywords": [
6
6
  "unocss",
@@ -31,9 +31,12 @@
31
31
  "module": "./dist/index.mjs",
32
32
  "types": "./dist/index.d.ts",
33
33
  "dependencies": {
34
- "@unocss/core": "0.26.3",
34
+ "@unocss/core": "0.27.1",
35
35
  "css-tree": "^2.0.4"
36
36
  },
37
+ "devDependencies": {
38
+ "magic-string-extra": "^0.1.2"
39
+ },
37
40
  "scripts": {
38
41
  "build": "unbuild",
39
42
  "stub": "unbuild --stub"