@unocss/transformer-directives 0.61.3 → 0.61.4

package/dist/index.mjs

@@ -2,7 +2,7 @@ import { expandVariantGroup, notNull, regexScopePlaceholder, toArray, cssIdRE }
 import { generate, parse, clone, List, walk } from 'css-tree';
 import { transformThemeString, hasThemeFn } from '@unocss/rule-utils';
 
-const screenRuleRE = /(@screen) (.+) /g;
+const screenRuleRE = /(@screen [^{]+)(.+)/g;
 function handleScreen({ code, uno }, node) {
   let breakpointName = "";
   let prefix = "";
@@ -46,8 +46,8 @@ function handleScreen({ code, uno }, node) {
   for (const match2 of matches) {
     code.overwrite(
       offset + match2.index,
-      offset + match2.index + match2[0].length,
-      `${generateMediaQuery(breakpointName, prefix)} `
+      offset + match2.index + match2[1].length,
+      `${generateMediaQuery(breakpointName, prefix)}`
     );
   }
 }
@@ -59,26 +59,24 @@ function calcMaxWidthBySize(size) {
 }
 
 async function handleApply(ctx, node) {
-  const { code, uno, options, filename, offset } = ctx;
-  const calcOffset = (pos) => offset ? pos + offset : pos;
+  const { code, uno, options, filename } = ctx;
   await Promise.all(
     node.block.children.map(async (childNode) => {
       if (childNode.type === "Raw")
-        return transformDirectives(code, uno, options, filename, childNode.value, calcOffset(childNode.loc.start.offset));
+        return transformDirectives(code, uno, options, filename, childNode.value, childNode.loc.start.offset);
       await parseApply(ctx, node, childNode);
     }).toArray()
   );
 }
-async function parseApply({ code, uno, offset, applyVariable }, node, childNode) {
-  const calcOffset = (pos) => offset ? pos + offset : pos;
+async function parseApply({ code, uno, applyVariable }, node, childNode) {
   const original = code.original;
   let body;
   if (childNode.type === "Atrule" && childNode.name === "apply" && childNode.prelude && childNode.prelude.type === "Raw") {
     body = removeQuotes(childNode.prelude.value.trim());
   } else if (childNode.type === "Declaration" && applyVariable.includes(childNode.property) && (childNode.value.type === "Value" || childNode.value.type === "Raw")) {
     let rawValue = original.slice(
-      calcOffset(childNode.value.loc.start.offset),
-      calcOffset(childNode.value.loc.end.offset)
+      childNode.value.loc.start.offset,
+      childNode.value.loc.end.offset
     ).trim();
     rawValue = removeQuotes(rawValue);
     const items = rawValue.split(/\s+/g).filter(Boolean).map((i) => removeQuotes(i));
@@ -100,12 +98,13 @@ async function parseApply({ code, uno, offset, applyVariable }, node, childNode)
   }, []);
   if (!utils.length)
     return;
-  const simicolonOffset = original[calcOffset(childNode.loc.end.offset)] === ";" ? 1 : 0;
+  const simicolonOffset = original[childNode.loc.end.offset] === ";" ? 1 : 0;
   for (const i of utils) {
     const [, _selector, body2, parent] = i;
     const selectorOrGroup = _selector?.replace(regexScopePlaceholder, " ") || _selector;
     if (parent || selectorOrGroup && selectorOrGroup !== ".\\-") {
       let newSelector = generate(node.prelude);
+      const className = code.slice(node.prelude.loc.start.offset, node.prelude.loc.end.offset);
       if (selectorOrGroup && selectorOrGroup !== ".\\-") {
         const ruleAST = parse(`${selectorOrGroup}{}`, {
           context: "rule"
@@ -122,20 +121,20 @@ async function parseApply({ code, uno, offset, applyVariable }, node, childNode)
         });
         newSelector = generate(prelude);
       }
-      let css = `${newSelector}{${body2}}`;
+      let css = `${newSelector.replace(/.\\-/g, className)}{${body2}}`;
       if (parent)
         css = `${parent}{${css}}`;
-      code.appendLeft(calcOffset(node.loc.end.offset), css);
+      code.appendLeft(node.loc.end.offset, css);
     } else {
       if (body2.includes("@"))
         code.appendRight(original.length + simicolonOffset, body2);
       else
-        code.appendRight(calcOffset(childNode.loc.end.offset + simicolonOffset), body2);
+        code.appendRight(childNode.loc.end.offset + simicolonOffset, body2);
     }
   }
   code.remove(
-    calcOffset(childNode.loc.start.offset),
-    calcOffset(childNode.loc.end.offset + simicolonOffset)
+    childNode.loc.start.offset,
+    childNode.loc.end.offset + simicolonOffset
   );
 }
 function removeQuotes(value) {
@@ -177,7 +176,8 @@ async function transformDirectives(code, uno, options, filename, originalCode, o
     parseCustomProperty: true,
     parseAtrulePrelude: false,
     positions: true,
-    filename
+    filename,
+    offset
   });
   if (ast.type !== "StyleSheet")
     return;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@unocss/transformer-directives",
   "type": "module",
-  "version": "0.61.3",
+  "version": "0.61.4",
   "description": "UnoCSS transformer for `@apply` directive",
   "author": "hannoeru <me@hanlee.co>",
   "license": "MIT",
@@ -33,8 +33,8 @@
   ],
   "dependencies": {
     "css-tree": "^2.3.1",
-    "@unocss/core": "0.61.3",
-    "@unocss/rule-utils": "0.61.3"
+    "@unocss/rule-utils": "0.61.4",
+    "@unocss/core": "0.61.4"
   },
   "devDependencies": {
     "magic-string": "^0.30.10"