@jay-framework/compiler-jay-html 0.24.7 → 0.25.1

package/dist/index.js

@@ -5777,6 +5777,7 @@ parse$1.TextNode = text_1.default;
 parse$1.NodeType = type_1.default;
 const COORD_ATTR$1 = "jay-coordinate-base";
 const SCOPE_ATTR = "jay-scope";
+const AUTO_REF_PATTERN = /^AR\d+$/;
 function assignCoordinatesToJayHtml(jayHtml, headlessContractNames) {
   const root = parse_2(jayHtml, {
     comment: true,
@@ -5790,6 +5791,12 @@ function assignCoordinatesToJayHtml(jayHtml, headlessContractNames) {
 function nextScopeId(counter) {
   return `S${counter.next++}`;
 }
+function isScopeAnchorDiv(node2) {
+  if (node2.nodeType !== NodeType.ELEMENT_NODE) return false;
+  const el = node2;
+  if (el.tagName?.toLowerCase() !== "div") return false;
+  return (el.getAttribute("style") ?? "").replace(/\s+/g, "").includes("display:contents");
+}
 function assignCoordinates(body, options) {
   if (!options._refCounters) options._refCounters = /* @__PURE__ */ new Map();
   const rootChildren = body.childNodes.filter(
@@ -5814,13 +5821,22 @@ function walkChildren(parent, parentCoord, scopeId, options, counter) {
       const contractName = tagName.substring(4);
       if (options.headlessContractNames.has(contractName)) {
         let ref = element.getAttribute("ref");
+        const explicitRef = !!ref && !AUTO_REF_PATTERN.test(ref);
         if (!ref) {
           const idx = options._refCounters.get(contractName) ?? 0;
           options._refCounters.set(contractName, idx + 1);
           ref = `AR${idx}`;
           element.setAttribute("ref", ref);
         }
-        assignHeadlessInstance(element, contractName, ref, parentCoord, options, counter);
+        assignHeadlessInstance(
+          element,
+          contractName,
+          ref,
+          parentCoord,
+          options,
+          counter,
+          explicitRef
+        );
         continue;
       }
     }
@@ -5843,7 +5859,7 @@ function walkChildren(parent, parentCoord, scopeId, options, counter) {
     walkChildren(element, coord, scopeId, options, counter);
   }
 }
-function assignHeadlessInstance(element, contractName, ref, parentCoord, options, counter) {
+function assignHeadlessInstance(element, contractName, ref, parentCoord, options, counter, explicitRef) {
   const instanceCoord = `${parentCoord}/${contractName}:${ref}`;
   element.setAttribute(COORD_ATTR$1, instanceCoord);
   const childScopeId = nextScopeId(counter);
@@ -5851,8 +5867,10 @@ function assignHeadlessInstance(element, contractName, ref, parentCoord, options
   const significantTemplateChildren = element.childNodes.filter(
     (n) => n.nodeType === NodeType.ELEMENT_NODE || n.nodeType === NodeType.TEXT_NODE && (n.innerText || "").trim() !== ""
   );
-  if (significantTemplateChildren.length > 1) {
+  const alreadyWrapped = significantTemplateChildren.length === 1 && isScopeAnchorDiv(significantTemplateChildren[0]);
+  if (!alreadyWrapped && (explicitRef || significantTemplateChildren.length > 1)) {
     const wrapper = parse_2("<div></div>").querySelector("div");
+    if (explicitRef) wrapper.setAttribute("class", ref);
     wrapper.setAttribute("style", "display: contents");
     const children = element.childNodes;
     element.innerHTML = "";
@@ -5871,6 +5889,7 @@ function walkForEachChildren(parent, itemScopeId, options, counter) {
       const contractName = tagName.substring(4);
       if (options.headlessContractNames.has(contractName)) {
         let ref = element.getAttribute("ref");
+        const explicitRef = !!ref && !AUTO_REF_PATTERN.test(ref);
         if (!ref) {
           const counterKey = `forEach/${contractName}`;
           const idx = options._refCounters.get(counterKey) ?? 0;
@@ -5878,7 +5897,15 @@ function walkForEachChildren(parent, itemScopeId, options, counter) {
           ref = `AR${idx}`;
           element.setAttribute("ref", ref);
         }
-        assignHeadlessInstance(element, contractName, ref, itemScopeId, options, counter);
+        assignHeadlessInstance(
+          element,
+          contractName,
+          ref,
+          itemScopeId,
+          options,
+          counter,
+          explicitRef
+        );
         continue;
       }
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jay-framework/compiler-jay-html",
-  "version": "0.24.7",
+  "version": "0.25.1",
   "description": "",
   "license": "Apache-2.0",
   "main": "dist/index.js",
@@ -34,12 +34,12 @@
   },
   "author": "",
   "dependencies": {
-    "@jay-framework/compiler-analyze-exported-types": "^0.24.7",
-    "@jay-framework/compiler-shared": "^0.24.7",
-    "@jay-framework/component": "^0.24.7",
-    "@jay-framework/logger": "^0.24.7",
-    "@jay-framework/runtime": "^0.24.7",
-    "@jay-framework/secure": "^0.24.7",
+    "@jay-framework/compiler-analyze-exported-types": "^0.25.1",
+    "@jay-framework/compiler-shared": "^0.25.1",
+    "@jay-framework/component": "^0.25.1",
+    "@jay-framework/logger": "^0.25.1",
+    "@jay-framework/runtime": "^0.25.1",
+    "@jay-framework/secure": "^0.25.1",
     "@types/js-yaml": "^4.0.9",
     "change-case": "^4.1.2",
     "he": "^1.2.0",
@@ -52,8 +52,8 @@
   },
   "devDependencies": {
     "@caiogondim/strip-margin": "^1.0.0",
-    "@jay-framework/4-react": "^0.24.7",
-    "@jay-framework/dev-environment": "^0.24.7",
+    "@jay-framework/4-react": "^0.25.1",
+    "@jay-framework/dev-environment": "^0.25.1",
     "@testing-library/jest-dom": "^6.2.0",
     "@types/js-beautify": "^1",
     "@types/node": "^20.11.5",