@fluixi/compiler 1.0.0-alpha.94 → 1.0.0-alpha.96

package/dist/transform/templates.cjs

@@ -93,7 +93,7 @@ function collectStyles(program, sourceName, options, tags = { html: /* @__PURE__
     const imported = literalsOf.imports.get(name);
     if (imported) {
       const nodes = options?.imported?.get(`${imported.source}#${imported.name}`);
-      if (nodes) return nodes.map(dropLoc);
+      if (nodes) return nodes.map((n) => keepLocIn(n, options?.importedModules));
       plan.references.push({ name: imported.name, source: imported.source, ...at });
       plan.diagnostics.push({
         ...at,
@@ -117,7 +117,7 @@ function collectStyles(program, sourceName, options, tags = { html: /* @__PURE__
     const nodes = resolveLiteral(name, at, []);
     const id = hash(`${sourceName}:css:${name}`);
     plan.edits.push({ start: literal.start, end: literal.end, code: `({ $fxStyle: ${JSON.stringify(id)} })` });
-    if (nodes) plan.literals.push({ id, name, css: printStyle(nodes, options.minify) });
+    if (nodes) plan.literals.push({ id, name, css: printStyle(nodes, options.minify), nodes });
   }
   const scopeOf = /* @__PURE__ */ new Map();
   const names = /* @__PURE__ */ new Map();
@@ -192,7 +192,7 @@ function collectStyles(program, sourceName, options, tags = { html: /* @__PURE__
       if (!plan.scopes.some((s) => s.value === id)) plan.scopes.push({ start: owner.start, end: owner.end, value: id });
       nodes = scopeNodes(nodes, id, (message) => plan.diagnostics.push({ ...at, message }));
     }
-    const printed = module2 ? printStyleWithMap(nodes, options.minify, sourceName, module2) : { css: printStyle(nodes, options.minify) };
+    const printed = module2 ? printStyleWithMap(nodes, options.minify, sourceName, module2, options.importedModules) : { css: printStyle(nodes, options.minify) };
     plan.styles.push({ id, scoped: scoped && !shadow, component, ...printed, ...shadow ? { shadow: true } : {}, ...at });
     if (shadow) shadow.indexes.push(plan.styles.length - 1);
   };
@@ -231,6 +231,11 @@ function staticMember(cls, name) {
     (m) => m.type === "ClassProperty" && m.static && (m.key.type === "Identifier" && m.key.name === name || m.key.type === "StringLiteral" && m.key.value === name)
   );
 }
+var styleIds = {
+  block: (owner, index) => `${owner}.fx-${index}.css`,
+  inline: (owner, index) => `${owner}.fx-${index}.css?inline`,
+  literal: (owner, name) => `${owner}.fx-literal-${name}.css?inline`
+};
 function finishShadowStyles(plan, code, moduleId) {
   const edits = [];
   const imports = [];
@@ -242,7 +247,7 @@ function finishShadowStyles(plan, code, moduleId) {
     return local;
   };
   for (const shadow of plan.shadowClasses.values()) {
-    const blocks = shadow.indexes.map((i) => importOf(`${moduleId}?fx-style&index=${i}&inline&lang.css`));
+    const blocks = shadow.indexes.map((i) => importOf(styleIds.inline(moduleId, i)));
     let value;
     const prop = shadow.styles;
     if (prop?.value) {
@@ -250,7 +255,7 @@ function finishShadowStyles(plan, code, moduleId) {
       let text = code.slice(start, prop.value.end);
       const replacements = [];
       walkIdentifiers(prop.value, (id) => {
-        const local = plan.names?.literals.has(id.name) ? importOf(`${moduleId}?fx-literal=${id.name}&inline&lang.css`) : plan.names?.imports.has(id.name) && !/\.css(\?|$)/.test(plan.names.imports.get(id.name).source) ? importOf(`${plan.names.imports.get(id.name).source}?fx-literal=${plan.names.imports.get(id.name).name}&inline&lang.css`) : void 0;
+        const local = plan.names?.literals.has(id.name) ? importOf(styleIds.literal(moduleId, id.name)) : plan.names?.imports.has(id.name) && !/\.css(\?|$)/.test(plan.names.imports.get(id.name).source) ? importOf(styleIds.literal(plan.names.imports.get(id.name).source, plan.names.imports.get(id.name).name)) : void 0;
         if (local) replacements.push({ at: id.start - start, length: id.name.length, with: local });
       });
       for (const r of replacements.sort((a, b) => b.at - a.at)) text = text.slice(0, r.at) + r.with + text.slice(r.at + r.length);
@@ -532,12 +537,23 @@ function shiftLoc(node, source, start) {
   if (node.kind === "rule" || node.kind === "at-rule") return { ...node, loc, nodes: node.nodes.map((n) => shiftLoc(n, source, start)) };
   return { ...node, loc };
 }
-function dropLoc(node) {
-  const { loc: _loc, ...rest } = node;
-  if (rest.kind === "rule" || rest.kind === "at-rule") return { ...rest, nodes: rest.nodes.map(dropLoc) };
-  return rest;
-}
-function printStyleWithMap(nodes, minify, sourceName, module2) {
+function keepLocIn(node, modules) {
+  const keep = node.loc !== void 0 && modules?.has(node.loc.source) === true;
+  const { loc, ...rest } = node;
+  const kept = keep ? { ...rest, loc } : rest;
+  if (kept.kind === "rule" || kept.kind === "at-rule") return { ...kept, nodes: kept.nodes.map((n) => keepLocIn(n, modules)) };
+  return kept;
+}
+function printStyleWithMap(nodes, minify, sourceName, module2, others) {
+  const sources = [module2];
+  const index = /* @__PURE__ */ new Map([[sourceName, 0]]);
+  const sourceOf = (name) => {
+    if (index.has(name)) return index.get(name);
+    const other = others?.get(name);
+    if (!other) return void 0;
+    index.set(name, sources.push(other) - 1);
+    return index.get(name);
+  };
   const lines = [[]];
   let css = "";
   let column = 0;
@@ -551,7 +567,8 @@ function printStyleWithMap(nodes, minify, sourceName, module2) {
     }
   };
   const mark = (loc) => {
-    if (loc && loc.source === sourceName) lines[lines.length - 1].push([column, 0, loc.line - 1, loc.column]);
+    const at = loc ? sourceOf(loc.source) : void 0;
+    if (loc && at !== void 0) lines[lines.length - 1].push([column, at, loc.line - 1, loc.column]);
   };
   const write = (node, depth) => {
     const pad = minify ? "" : "  ".repeat(depth);
@@ -570,7 +587,7 @@ function printStyleWithMap(nodes, minify, sourceName, module2) {
     }
   };
   for (const node of nodes) write(node, 0);
-  return { css, map: { version: 3, sources: [module2.id], sourcesContent: [module2.code], names: [], mappings: (0, import_sourcemap_codec.encode)(lines) } };
+  return { css, map: { version: 3, sources: sources.map((s) => s.id), sourcesContent: sources.map((s) => s.code), names: [], mappings: (0, import_sourcemap_codec.encode)(lines) } };
 }
 function printStyle(nodes, minify = false) {
   const out = [];
@@ -1698,14 +1715,16 @@ function emitNode(node, used, templates) {
       for (const child of node.children) {
         used.add("insert");
         const childCode = emitNode(child, used, templates);
-        const isFn = child.kind === "expr" && child.reactive || child.kind === "component" || child.kind === "control";
-        parts.push(isFn ? `insert(${el}, ${childCode}, null);` : `insert(${el}, ${childCode});`);
+        const anchored = child.kind === "expr" && (child.reactive || !isLiteralCode(child.code)) || child.kind === "component" || child.kind === "control";
+        parts.push(anchored ? `insert(${el}, ${childCode}, null);` : `insert(${el}, ${childCode});`);
       }
       parts.push(`return ${el};`);
       return `(() => { ${parts.join(" ")} })()`;
     }
   }
 }
+var LITERAL = /^\s*(?:'(?:[^'\\]|\\.)*'|"(?:[^"\\]|\\.)*"|`[^`$]*`|-?\d[\d_.eE+-]*|true|false|null|undefined)\s*$/;
+var isLiteralCode = (code) => LITERAL.test(code);
 function inlineTemplates(code, templates) {
   if (!templates || templates.length === 0) return code;
   const byId = new Map(templates.map((t) => [t.id, JSON.stringify(t.html)]));

package/dist/transform/templates.mjs

@@ -1135,7 +1135,7 @@ function collectStyles(program, sourceName, options, tags = { html: /* @__PURE__
     const imported = literalsOf.imports.get(name);
     if (imported) {
       const nodes = options?.imported?.get(`${imported.source}#${imported.name}`);
-      if (nodes) return nodes.map(dropLoc);
+      if (nodes) return nodes.map((n2) => keepLocIn(n2, options?.importedModules));
       plan.references.push({ name: imported.name, source: imported.source, ...at });
       plan.diagnostics.push({
         ...at,
@@ -1159,7 +1159,7 @@ function collectStyles(program, sourceName, options, tags = { html: /* @__PURE__
     const nodes = resolveLiteral(name, at, []);
     const id = hash(`${sourceName}:css:${name}`);
     plan.edits.push({ start: literal.start, end: literal.end, code: `({ $fxStyle: ${JSON.stringify(id)} })` });
-    if (nodes) plan.literals.push({ id, name, css: printStyle(nodes, options.minify) });
+    if (nodes) plan.literals.push({ id, name, css: printStyle(nodes, options.minify), nodes });
   }
   const scopeOf = /* @__PURE__ */ new Map();
   const names = /* @__PURE__ */ new Map();
@@ -1234,7 +1234,7 @@ function collectStyles(program, sourceName, options, tags = { html: /* @__PURE__
       if (!plan.scopes.some((s) => s.value === id)) plan.scopes.push({ start: owner.start, end: owner.end, value: id });
       nodes = scopeNodes(nodes, id, (message) => plan.diagnostics.push({ ...at, message }));
     }
-    const printed = module ? printStyleWithMap(nodes, options.minify, sourceName, module) : { css: printStyle(nodes, options.minify) };
+    const printed = module ? printStyleWithMap(nodes, options.minify, sourceName, module, options.importedModules) : { css: printStyle(nodes, options.minify) };
     plan.styles.push({ id, scoped: scoped && !shadow, component, ...printed, ...shadow ? { shadow: true } : {}, ...at });
     if (shadow) shadow.indexes.push(plan.styles.length - 1);
   };
@@ -1273,6 +1273,11 @@ function staticMember(cls, name) {
     (m) => m.type === "ClassProperty" && m.static && (m.key.type === "Identifier" && m.key.name === name || m.key.type === "StringLiteral" && m.key.value === name)
   );
 }
+var styleIds = {
+  block: (owner, index) => `${owner}.fx-${index}.css`,
+  inline: (owner, index) => `${owner}.fx-${index}.css?inline`,
+  literal: (owner, name) => `${owner}.fx-literal-${name}.css?inline`
+};
 function finishShadowStyles(plan, code, moduleId) {
   const edits = [];
   const imports = [];
@@ -1284,7 +1289,7 @@ function finishShadowStyles(plan, code, moduleId) {
     return local;
   };
   for (const shadow of plan.shadowClasses.values()) {
-    const blocks = shadow.indexes.map((i) => importOf(`${moduleId}?fx-style&index=${i}&inline&lang.css`));
+    const blocks = shadow.indexes.map((i) => importOf(styleIds.inline(moduleId, i)));
     let value;
     const prop = shadow.styles;
     if (prop?.value) {
@@ -1292,7 +1297,7 @@ function finishShadowStyles(plan, code, moduleId) {
       let text = code.slice(start, prop.value.end);
       const replacements = [];
       walkIdentifiers(prop.value, (id) => {
-        const local = plan.names?.literals.has(id.name) ? importOf(`${moduleId}?fx-literal=${id.name}&inline&lang.css`) : plan.names?.imports.has(id.name) && !/\.css(\?|$)/.test(plan.names.imports.get(id.name).source) ? importOf(`${plan.names.imports.get(id.name).source}?fx-literal=${plan.names.imports.get(id.name).name}&inline&lang.css`) : void 0;
+        const local = plan.names?.literals.has(id.name) ? importOf(styleIds.literal(moduleId, id.name)) : plan.names?.imports.has(id.name) && !/\.css(\?|$)/.test(plan.names.imports.get(id.name).source) ? importOf(styleIds.literal(plan.names.imports.get(id.name).source, plan.names.imports.get(id.name).name)) : void 0;
         if (local) replacements.push({ at: id.start - start, length: id.name.length, with: local });
       });
       for (const r of replacements.sort((a, b) => b.at - a.at)) text = text.slice(0, r.at) + r.with + text.slice(r.at + r.length);
@@ -1574,12 +1579,23 @@ function shiftLoc(node, source, start) {
   if (node.kind === "rule" || node.kind === "at-rule") return { ...node, loc, nodes: node.nodes.map((n2) => shiftLoc(n2, source, start)) };
   return { ...node, loc };
 }
-function dropLoc(node) {
-  const { loc: _loc, ...rest } = node;
-  if (rest.kind === "rule" || rest.kind === "at-rule") return { ...rest, nodes: rest.nodes.map(dropLoc) };
-  return rest;
-}
-function printStyleWithMap(nodes, minify, sourceName, module) {
+function keepLocIn(node, modules) {
+  const keep = node.loc !== void 0 && modules?.has(node.loc.source) === true;
+  const { loc, ...rest } = node;
+  const kept = keep ? { ...rest, loc } : rest;
+  if (kept.kind === "rule" || kept.kind === "at-rule") return { ...kept, nodes: kept.nodes.map((n2) => keepLocIn(n2, modules)) };
+  return kept;
+}
+function printStyleWithMap(nodes, minify, sourceName, module, others) {
+  const sources = [module];
+  const index = /* @__PURE__ */ new Map([[sourceName, 0]]);
+  const sourceOf = (name) => {
+    if (index.has(name)) return index.get(name);
+    const other = others?.get(name);
+    if (!other) return void 0;
+    index.set(name, sources.push(other) - 1);
+    return index.get(name);
+  };
   const lines = [[]];
   let css = "";
   let column = 0;
@@ -1593,7 +1609,8 @@ function printStyleWithMap(nodes, minify, sourceName, module) {
     }
   };
   const mark = (loc) => {
-    if (loc && loc.source === sourceName) lines[lines.length - 1].push([column, 0, loc.line - 1, loc.column]);
+    const at = loc ? sourceOf(loc.source) : void 0;
+    if (loc && at !== void 0) lines[lines.length - 1].push([column, at, loc.line - 1, loc.column]);
   };
   const write = (node, depth) => {
     const pad = minify ? "" : "  ".repeat(depth);
@@ -1612,7 +1629,7 @@ function printStyleWithMap(nodes, minify, sourceName, module) {
     }
   };
   for (const node of nodes) write(node, 0);
-  return { css, map: { version: 3, sources: [module.id], sourcesContent: [module.code], names: [], mappings: encode(lines) } };
+  return { css, map: { version: 3, sources: sources.map((s) => s.id), sourcesContent: sources.map((s) => s.code), names: [], mappings: encode(lines) } };
 }
 function printStyle(nodes, minify = false) {
   const out = [];
@@ -2740,14 +2757,16 @@ function emitNode(node, used, templates) {
       for (const child of node.children) {
         used.add("insert");
         const childCode = emitNode(child, used, templates);
-        const isFn = child.kind === "expr" && child.reactive || child.kind === "component" || child.kind === "control";
-        parts.push(isFn ? `insert(${el}, ${childCode}, null);` : `insert(${el}, ${childCode});`);
+        const anchored = child.kind === "expr" && (child.reactive || !isLiteralCode(child.code)) || child.kind === "component" || child.kind === "control";
+        parts.push(anchored ? `insert(${el}, ${childCode}, null);` : `insert(${el}, ${childCode});`);
       }
       parts.push(`return ${el};`);
       return `(() => { ${parts.join(" ")} })()`;
     }
   }
 }
+var LITERAL = /^\s*(?:'(?:[^'\\]|\\.)*'|"(?:[^"\\]|\\.)*"|`[^`$]*`|-?\d[\d_.eE+-]*|true|false|null|undefined)\s*$/;
+var isLiteralCode = (code) => LITERAL.test(code);
 function inlineTemplates(code, templates) {
   if (!templates || templates.length === 0) return code;
   const byId = new Map(templates.map((t) => [t.id, JSON.stringify(t.html)]));