@jay-framework/compiler-jay-html 0.20.0 → 0.22.0

package/dist/index.d.cts

@@ -29,6 +29,7 @@ interface ContractProp {
     name: string;
     dataType: JayType;
     required?: boolean;
+    phase?: RenderingPhase;
     description?: Array<string>;
     default?: string;
 }
@@ -174,6 +175,7 @@ interface JayHeadlessImports {
     contract?: Contract;
     contractPath?: string;
     metadata?: Record<string, unknown>;
+    headlessProps?: Record<string, string>;
 }
 interface JayHtmlHeadLink {
     rel: string;

package/dist/index.js

@@ -2,8 +2,8 @@ import { JayImportedType, isObjectType as isObjectType$1, isImportedType, isRecu
 import path from "path";
 import { getLogger } from "@jay-framework/logger";
 import fs from "fs/promises";
-import { analyzeExportedTypes } from "@jay-framework/compiler-analyze-exported-types";
 import fs$1 from "fs";
+import { analyzeExportedTypes } from "@jay-framework/compiler-analyze-exported-types";
 import { createRequire } from "module";
 var commonjsGlobal = typeof globalThis !== "undefined" ? globalThis : typeof window !== "undefined" ? window : typeof global !== "undefined" ? global : typeof self !== "undefined" ? self : {};
 function getDefaultExportFromCjs(x) {
@@ -18324,6 +18324,13 @@ function parseHeadfullImports(elements, validations, filePath, options, importRe
     }
   });
 }
+function dedentYaml(text2) {
+  const lines = text2.split("\n").filter((l) => l.trim().length > 0);
+  if (lines.length === 0)
+    return "";
+  const minIndent = Math.min(...lines.map((l) => l.match(/^\s*/)?.[0].length ?? 0));
+  return lines.map((l) => l.slice(minIndent)).join("\n");
+}
 async function parseHeadlessImports(elements, validations, filePath, importResolver, projectRoot) {
   const result = [];
   for await (const element of elements) {
@@ -18338,6 +18345,23 @@ async function parseHeadlessImports(elements, validations, filePath, importResol
       validations.push("headless import must specify contract attribute");
       continue;
     }
+    let headlessProps;
+    const propsText = dedentYaml(element.textContent ?? "");
+    if (propsText) {
+      try {
+        const parsed = jsYaml.load(propsText);
+        if (parsed && typeof parsed === "object") {
+          headlessProps = {};
+          for (const [k, v] of Object.entries(parsed)) {
+            headlessProps[k] = String(v);
+          }
+        }
+      } catch (e2) {
+        validations.push(
+          `Failed to parse props YAML in <script type="application/jay-headless" contract="${contractAttr}">: ${e2.message}`
+        );
+      }
+    }
     const resolveResult = importResolver.resolvePluginComponent(
       pluginAttr,
       contractAttr,
@@ -18446,7 +18470,8 @@ async function parseHeadlessImports(elements, validations, filePath, importResol
           codeLink,
           contract: loadedContract,
           contractPath: contractFile,
-          metadata: contractMetadata
+          metadata: contractMetadata,
+          headlessProps
         });
       });
     } catch (e2) {
@@ -18893,6 +18918,26 @@ function parseHeadMeta(root) {
   }
   return { title, meta, links };
 }
+function resolveNestedCssImports(css, cssDir, visited) {
+  if (!css.includes("@import"))
+    return css;
+  const seen = visited ?? /* @__PURE__ */ new Set();
+  return css.replace(/@import\s+(?:url\(\s*)?['"]([^'"]+)['"]\s*\)?;?/g, (match, importPath) => {
+    if (importPath.startsWith("http") || importPath.startsWith("//"))
+      return match;
+    const resolved = path.resolve(cssDir, importPath);
+    if (seen.has(resolved))
+      return `/* circular import: ${importPath} */`;
+    seen.add(resolved);
+    try {
+      const imported = fs$1.readFileSync(resolved, "utf-8");
+      return `/* @import ${importPath} */
+${resolveNestedCssImports(imported, path.dirname(resolved), seen)}`;
+    } catch {
+      return `/* @import not found: ${importPath} */`;
+    }
+  });
+}
 async function extractCss(root, filePath) {
   const cssParts = [];
   const validations = [];
@@ -18909,8 +18954,12 @@ async function extractCss(root, filePath) {
         linkedCssFiles.push(cssFilePath);
         try {
           const cssContent = await fs.readFile(cssFilePath, "utf-8");
+          const resolvedCss = resolveNestedCssImports(
+            cssContent,
+            path.dirname(cssFilePath)
+          );
           cssParts.push(`/* External CSS: ${href} */
-${cssContent}`);
+${resolvedCss}`);
         } catch (error) {
           validations.push(`CSS file not found or unreadable: ${href}`);
         }
@@ -19715,10 +19764,22 @@ function parseProp(prop) {
     return new WithValidations(void 0, validations);
   }
   const description = parseDescription(prop.description);
+  let phase = "slow";
+  if (prop.phase) {
+    const validPhases = ["slow", "fast", "fast+interactive"];
+    if (!validPhases.includes(prop.phase)) {
+      validations.push(
+        `Prop [${prop.name}] has invalid phase [${prop.phase}]. Valid phases are: ${validPhases.join(", ")}`
+      );
+    } else {
+      phase = prop.phase;
+    }
+  }
   const contractProp = {
     name: prop.name,
     dataType,
     ...prop.required && { required: prop.required },
+    phase,
     ...description && { description },
     ...prop.default !== void 0 && { default: prop.default }
   };
@@ -19762,11 +19823,18 @@ function parseContract(contractYaml, fileName) {
       });
     }
     let parsedParams;
-    if (parsedYaml.params && typeof parsedYaml.params === "object" && !Array.isArray(parsedYaml.params)) {
-      parsedParams = Object.entries(parsedYaml.params).map(([name, value]) => ({
-        name,
-        kind: typeof value === "string" && value.endsWith("?") ? "optional" : typeof value === "string" && value.endsWith("[]") ? "catch-all" : "required"
-      }));
+    if (parsedYaml.params && typeof parsedYaml.params === "object") {
+      if (Array.isArray(parsedYaml.params)) {
+        parsedParams = parsedYaml.params.map((p) => ({
+          name: p.name,
+          kind: p.kind === "optional" ? "optional" : p.kind === "catch-all" ? "catch-all" : "required"
+        }));
+      } else {
+        parsedParams = Object.entries(parsedYaml.params).map(([name, value]) => ({
+          name,
+          kind: typeof value === "string" && value.endsWith("?") ? "optional" : typeof value === "string" && value.endsWith("[]") ? "catch-all" : "required"
+        }));
+      }
       if (parsedParams.length === 0)
         parsedParams = void 0;
     }
@@ -20681,14 +20749,24 @@ function renderHydrate(types2, body, importStatements, elementType, preRenderTyp
   if (!rootElement.val) {
     return new RenderFragment("", Imports.none(), rootElement.validations);
   }
-  let renderedHydrate = renderHydrateElementContent(
-    rootElement.val,
-    context,
-    buildRenderContext(context),
-    null,
-    true
-    // forceAdopt — root element always needs adoption
+  const rootComponentMatch = getComponentName(
+    rootElement.val.rawTagName,
+    context.importedSymbols,
+    context.headlessContractNames
   );
+  let renderedHydrate;
+  if (rootComponentMatch !== null && rootComponentMatch.kind === "headless-instance") {
+    renderedHydrate = renderHydrateElement(rootElement.val, context);
+  } else {
+    renderedHydrate = renderHydrateElementContent(
+      rootElement.val,
+      context,
+      buildRenderContext(context),
+      null,
+      true
+      // forceAdopt — root element always needs adoption
+    );
+  }
   renderedHydrate = optimizeRefs(renderedHydrate, headlessImports);
   const { renderedRefsManager, refsManagerImport } = renderReferenceManager(
     renderedHydrate.refs,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jay-framework/compiler-jay-html",
-  "version": "0.20.0",
+  "version": "0.22.0",
   "description": "",
   "license": "Apache-2.0",
   "main": "dist/index.js",
@@ -34,12 +34,12 @@
   },
   "author": "",
   "dependencies": {
-    "@jay-framework/compiler-analyze-exported-types": "^0.20.0",
-    "@jay-framework/compiler-shared": "^0.20.0",
-    "@jay-framework/component": "^0.20.0",
-    "@jay-framework/logger": "^0.20.0",
-    "@jay-framework/runtime": "^0.20.0",
-    "@jay-framework/secure": "^0.20.0",
+    "@jay-framework/compiler-analyze-exported-types": "^0.22.0",
+    "@jay-framework/compiler-shared": "^0.22.0",
+    "@jay-framework/component": "^0.22.0",
+    "@jay-framework/logger": "^0.22.0",
+    "@jay-framework/runtime": "^0.22.0",
+    "@jay-framework/secure": "^0.22.0",
     "@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.20.0",
-    "@jay-framework/dev-environment": "^0.20.0",
+    "@jay-framework/4-react": "^0.22.0",
+    "@jay-framework/dev-environment": "^0.22.0",
     "@testing-library/jest-dom": "^6.2.0",
     "@types/js-beautify": "^1",
     "@types/node": "^20.11.5",