@dimina-kit/compiler 0.0.2-dev.20260718085557 → 0.0.2-dev.20260718095333

package/dist/compile-core.node-chunks/{style-compiler-4F5PSTLH.js → style-compiler-YWVITCJW.js}

@@ -14,7 +14,7 @@ import {
   resetStoreInfo,
   tagWhiteList,
   transformRpx
-} from "./chunk-O5CWW2ZX.js";
+} from "./chunk-QVEZ34FP.js";
 
 // ../../dimina/fe/packages/compiler/src/core/style-compiler.js
 import path from "node:path";
@@ -61,7 +61,7 @@ if (!isMainThread) {
 }
 async function compileSS(pages, root, progress) {
   for (const page of pages) {
-    const code = await buildCompileCss(page, [], /* @__PURE__ */ new Set()) || "";
+    const code = await buildCompileCss(page, /* @__PURE__ */ new Set()) || "";
     const filename = `${page.path.replace(/\//g, "_")}`;
     if (root) {
       const subDir = `${getTargetPath()}/${root}`;
@@ -79,33 +79,63 @@ async function compileSS(pages, root, progress) {
     progress.completedTasks++;
   }
 }
-async function buildCompileCss(module, depthChain = [], compiledPaths = /* @__PURE__ */ new Set()) {
-  const currentPath = module.path || module.absolutePath;
-  if (depthChain.includes(currentPath)) {
-    console.warn("[style]", `\u68C0\u6D4B\u5230\u5FAA\u73AF\u4F9D\u8D56: ${[...depthChain, currentPath].join(" -> ")}`);
-    return "";
-  }
-  if (depthChain.length > 20) {
-    console.warn("[style]", `\u68C0\u6D4B\u5230\u6DF1\u5EA6\u4F9D\u8D56: ${[...depthChain, currentPath].join(" -> ")}`);
-    return "";
-  }
-  if (compiledPaths.has(currentPath)) {
-    return "";
-  }
-  compiledPaths.add(currentPath);
-  depthChain = [...depthChain, currentPath];
-  let result = await enhanceCSS(module) || "";
-  if (module.usingComponents) {
-    for (const componentInfo of Object.values(module.usingComponents)) {
-      const componentModule = getComponent(componentInfo);
-      if (!componentModule) {
-        continue;
+async function buildCompileCss(module, compiledPaths = /* @__PURE__ */ new Set()) {
+  let result = "";
+  const pendingModules = [module];
+  while (pendingModules.length > 0) {
+    const currentModule = pendingModules.pop();
+    const currentPath = currentModule.path || currentModule.absolutePath;
+    if (compiledPaths.has(currentPath)) {
+      continue;
+    }
+    compiledPaths.add(currentPath);
+    result += await enhanceCSS(currentModule) || "";
+    const componentPaths = Object.values(currentModule.usingComponents || {});
+    for (let index = componentPaths.length - 1; index >= 0; index--) {
+      const componentModule = getComponent(componentPaths[index]);
+      if (componentModule) {
+        pendingModules.push(componentModule);
       }
-      result += await buildCompileCss(componentModule, depthChain, compiledPaths) || "";
     }
   }
   return result;
 }
+function boostExternalClassSelectors(cssCode, moduleId) {
+  if (!moduleId || !cssCode) {
+    return cssCode;
+  }
+  const scopeAttribute = `data-v-${moduleId}`;
+  const externalScopeAttribute = "data-dd-external-class-scope";
+  const ast = postcss.parse(cssCode);
+  ast.walkRules((rule) => {
+    if (!rule.selector.includes(`[${scopeAttribute}]`)) {
+      return;
+    }
+    rule.selector = selectorParser((selectors) => {
+      for (const selector of [...selectors.nodes]) {
+        const boostedSelector = selector.clone();
+        const scopeNodes = [];
+        boostedSelector.walkAttributes((attribute) => {
+          if (attribute.attribute === scopeAttribute) {
+            scopeNodes.push(attribute);
+          }
+        });
+        const targetScope = scopeNodes.at(-1);
+        if (!targetScope) {
+          continue;
+        }
+        targetScope.parent.insertAfter(targetScope, selectorParser.attribute({
+          attribute: externalScopeAttribute,
+          operator: "~=",
+          quoteMark: '"',
+          value: scopeAttribute
+        }));
+        selectors.append(boostedSelector);
+      }
+    }).processSync(rule.selector);
+  });
+  return ast.toResult().css;
+}
 async function enhanceCSS(module) {
   const absolutePath = module.absolutePath ? module.absolutePath : getAbsolutePath(module.path);
   if (!absolutePath) {
@@ -153,7 +183,7 @@ async function enhanceCSS(module) {
       const str = node.params.replace(/^['"]|['"]$/g, "");
       const importFullPath = resolveStyleImportPath(absolutePath, str);
       node.remove();
-      promises.push(buildCompileCss({ absolutePath: importFullPath, id: module.id }, [], /* @__PURE__ */ new Set()));
+      promises.push(buildCompileCss({ absolutePath: importFullPath, id: module.id }, /* @__PURE__ */ new Set()));
     } else if (node.type === "rule") {
       if (node.selector.includes("::v-deep")) {
         node.selector = node.selector.replace(/::v-deep\s+(\S[^{]*)/g, ":deep($1)");
@@ -183,11 +213,11 @@ async function enhanceCSS(module) {
     id: moduleId,
     scoped: !!moduleId
   }).code;
-  const cleanedCode = await removeBaseComponentScope(scopedCode, moduleId);
+  const externalClassCode = boostExternalClassSelectors(scopedCode, moduleId);
   const res = await postcss([
     autoprefixer({ overrideBrowserslist: ["cover 99.5%"] }),
     cssnano()
-  ]).process(cleanedCode, { from: void 0 });
+  ]).process(externalClassCode, { from: void 0 });
   const importCss = (await Promise.all(promises)).filter(Boolean).join("");
   const result = importCss + res.css;
   compileRes.set(cacheKey, result);
@@ -234,44 +264,25 @@ function normalizeRootStyleImports(source, workPath = getWorkPath()) {
     return `${prefix}${path.join(workPath, importPath)}${suffix}`;
   });
 }
-async function removeBaseComponentScope(css, moduleId) {
-  if (!moduleId) return css;
-  const ast = postcss.parse(css);
-  const scopeAttrName = `data-v-${moduleId}`;
-  ast.walkRules((rule) => {
-    const hasBaseComponent = tagWhiteList.some(
-      (tag) => rule.selector.includes(`.dd-${tag}`)
-    );
-    if (hasBaseComponent && rule.selector.includes(scopeAttrName)) {
-      rule.selector = selectorParser((selectors) => {
-        selectors.walkAttributes((attr) => {
-          if (attr.attribute === scopeAttrName) {
-            attr.remove();
-          }
-        });
-      }).processSync(rule.selector);
-    }
-  });
-  return ast.toResult().css;
-}
 function ensureImportSemicolons(css) {
   return css.replace(/@import[^;\n]*$/gm, (match) => {
     return match.endsWith(";") ? match : `${match};`;
   });
 }
 function processHostSelector(selector, moduleId) {
-  return selector.replace(/^:host$/, `[data-v-${moduleId}]`).replace(/:host\(([^)]+)\)/g, `[data-v-${moduleId}]$1`).replace(/:host\s+/g, `[data-v-${moduleId}] `).replace(/:host(?=\.|#|:)/g, `[data-v-${moduleId}]`);
+  const hostSelector = `[data-dd-style-host~="${moduleId}"]`;
+  return selector.replace(/:host\(([^)]+)\)/g, `${hostSelector}$1`).replace(/:host(?![\w-])/g, hostSelector);
 }
 function __resetStyleState() {
   compileRes.clear();
 }
 export {
   __resetStyleState,
+  boostExternalClassSelectors,
   compileSS,
   ensureImportSemicolons,
   normalizeCssUrlValue,
   normalizeRootStyleImports,
   processHostSelector,
-  removeBaseComponentScope,
   resolveStyleImportPath
 };