@jay-framework/compiler-jay-html 0.19.6 → 0.19.8

package/dist/index.d.cts

@@ -180,6 +180,12 @@ interface JayHtmlHeadLink {
     href: string;
     attributes: Record<string, string>;
 }
+interface JayHtmlScript {
+    src?: string;
+    inline?: string;
+    attributes: Record<string, string>;
+    position: 'head' | 'body';
+}
 interface JayHtmlSourceFile extends CompilerSourceFile {
     format: SourceFileFormat.JayHtml;
     baseElementName: string;
@@ -214,6 +220,7 @@ interface JayHtmlSourceFile extends CompilerSourceFile {
      */
     clientTrackByMap?: Record<string, string>;
     headMeta?: JayHtmlHeadMeta;
+    scripts?: JayHtmlScript[];
 }
 
 declare function parseTemplateParts(value: string): TemplatePart[];
@@ -601,4 +608,4 @@ declare function resolveHeadlessInstances(preRenderedJayHtml: string, instanceDa
  */
 declare function hasSlowPhaseProperties(contract: Contract | undefined): boolean;
 
-export { type ActionDefinition, type AssignCoordinatesOptions, type AssignCoordinatesResult, type Contract, type ContractImportInfo, type ContractParam, type ContractParamKind, type ContractProp, type ContractResolver, type ContractTag, ContractTagType, type DiscoveredHeadlessInstance, type EnumToImport, type ForEachHeadlessInstance, type HeadlessContractInfo, type HeadlessInstanceDiscoveryResult, type HeadlessInstanceResolvedData, JAY_IMPORT_RESOLVER, type JayContractImportLink, type JayHtmlSourceFile, type JayImportResolver, type PhaseViewStates, type RenderingPhase, type ServerElementOptions, type SlowRenderInput, type SlowRenderOutput, assignCoordinates, assignCoordinatesToJayHtml, buildInstanceCoordinateKey, compileAction, compileContract, contractToAllPhaseViewStates, contractToImportsViewStateAndRefs, contractToPhaseViewState, createPhaseContract, defaultContractResolver, discoverHeadlessInstances, filterTagsByPhase, generateElementBridgeFile, generateElementDefinitionFile, generateElementFile, generateElementFileReactTarget, generateElementHydrateFile, generateSandboxRootFile, generateServerElementFile, generateTypes, getEffectivePhase, getJayHtmlImports, getLinkedContractDir, hasSlowPhaseProperties, htmlElementTagNameMap, injectHeadfullFSTemplates, isTagInPhase, loadLinkedContract, parseAction, parseContract, parseEnumValues, parseIsEnum, parseJayFile, parseTemplateParts, renderRefsType, resolveHeadlessInstances, slowRenderTransform, validateContractPhases };
+export { type ActionDefinition, type AssignCoordinatesOptions, type AssignCoordinatesResult, type Contract, type ContractImportInfo, type ContractParam, type ContractParamKind, type ContractProp, type ContractResolver, type ContractTag, ContractTagType, type DiscoveredHeadlessInstance, type EnumToImport, type ForEachHeadlessInstance, type HeadlessContractInfo, type HeadlessInstanceDiscoveryResult, type HeadlessInstanceResolvedData, JAY_IMPORT_RESOLVER, type JayContractImportLink, type JayHtmlScript, type JayHtmlSourceFile, type JayImportResolver, type PhaseViewStates, type RenderingPhase, type ServerElementOptions, type SlowRenderInput, type SlowRenderOutput, assignCoordinates, assignCoordinatesToJayHtml, buildInstanceCoordinateKey, compileAction, compileContract, contractToAllPhaseViewStates, contractToImportsViewStateAndRefs, contractToPhaseViewState, createPhaseContract, defaultContractResolver, discoverHeadlessInstances, filterTagsByPhase, generateElementBridgeFile, generateElementDefinitionFile, generateElementFile, generateElementFileReactTarget, generateElementHydrateFile, generateSandboxRootFile, generateServerElementFile, generateTypes, getEffectivePhase, getJayHtmlImports, getLinkedContractDir, hasSlowPhaseProperties, htmlElementTagNameMap, injectHeadfullFSTemplates, isTagInPhase, loadLinkedContract, parseAction, parseContract, parseEnumValues, parseIsEnum, parseJayFile, parseTemplateParts, renderRefsType, resolveHeadlessInstances, slowRenderTransform, validateContractPhases };

package/dist/index.js

@@ -14657,16 +14657,52 @@ function mergeContractStubRefs(templateRefs, contractRefs) {
       );
     }
   }
-  if (stubRefs.length === 0)
+  const mergedChildren = { ...templateRefs.children };
+  for (const [childName, contractChild] of Object.entries(contractRefs.children)) {
+    if (mergedChildren[childName]) {
+      mergedChildren[childName] = mergeContractStubRefs(
+        mergedChildren[childName],
+        contractChild
+      );
+    } else {
+      mergedChildren[childName] = markAllRefsAsStubs(contractChild);
+    }
+  }
+  const childrenChanged = Object.keys(mergedChildren).length !== Object.keys(templateRefs.children).length || Object.keys(mergedChildren).some((k) => mergedChildren[k] !== templateRefs.children[k]);
+  if (stubRefs.length === 0 && !childrenChanged)
     return templateRefs;
   return mkRefsTree(
     [...templateRefs.refs, ...stubRefs],
-    templateRefs.children,
+    mergedChildren,
     templateRefs.repeated,
     templateRefs.imported?.refsTypeName,
     templateRefs.imported?.repeatedRefsTypeName
   );
 }
+function markAllRefsAsStubs(tree) {
+  const stubbedRefs = tree.refs.map(
+    (ref) => mkRef(
+      ref.originalName,
+      ref.originalName,
+      camelCase(`ref ${ref.originalName}`),
+      ref.repeated,
+      true,
+      ref.viewStateType,
+      ref.elementType
+    )
+  );
+  const stubbedChildren = {};
+  for (const [name, child] of Object.entries(tree.children)) {
+    stubbedChildren[name] = markAllRefsAsStubs(child);
+  }
+  return mkRefsTree(
+    stubbedRefs,
+    stubbedChildren,
+    tree.repeated,
+    tree.imported?.refsTypeName,
+    tree.imported?.repeatedRefsTypeName
+  );
+}
 const COORD_ATTR = "jay-coordinate-base";
 function expandContractType(renderedElement, baseName) {
   const contractPattern = new RegExp(
@@ -18264,7 +18300,11 @@ function parseHeadfullImports(elements, validations, filePath, options, importRe
       const exportedTypes = importResolver.analyzeExportedTypes(importedFile, options);
       for (const name of names) {
         const exportedType = exportedTypes.find((_) => _.name === name.name);
-        if (exportedType && exportedType !== JayUnknown)
+        if (exportedType instanceof JayComponentType && exportedType.fullStack) {
+          validations.push(
+            `${name.name} from ${module} is a full-stack component (makeJayStackComponent). Create a .jay-contract file for the component and add a contract attribute to the import`
+          );
+        } else if (exportedType && exportedType !== JayUnknown)
           name.type = new JayImportedType(name.as ? name.as : name.name, exportedType);
         else if (exportedType === JayUnknown)
           validations.push(
@@ -18746,6 +18786,49 @@ async function parseHeadfullFSImports(elements, validations, filePath, importRes
 function normalizeFilename(filename) {
   return filename.replace(".jay-html", "");
 }
+function isLocalSrc(src) {
+  return src.startsWith("./") || src.startsWith("../") || !src.includes("://") && !src.startsWith("//");
+}
+function validateAndCollectScripts(root, validations) {
+  const scripts = [];
+  const allScripts = root.querySelectorAll("script");
+  for (const script of allScripts) {
+    const type2 = script.getAttribute("type");
+    if (type2?.startsWith("application/jay-"))
+      continue;
+    const jayScript = script.getAttribute("jay-script");
+    const src = script.getAttribute("src");
+    const inline = script.textContent?.trim();
+    const isInHead = !!script.closest("head");
+    if (src && isLocalSrc(src)) {
+      validations.push(
+        `Local script imports are not supported in jay-html. Move the script logic into page.ts with makeJayStackComponent. See designer/script-tags.md.`
+      );
+      continue;
+    }
+    if (jayScript === "allow") {
+      const attributes2 = { ...script.attributes };
+      delete attributes2["jay-script"];
+      delete attributes2["src"];
+      if (src) {
+        scripts.push({ src, attributes: attributes2, position: isInHead ? "head" : "body" });
+      } else if (inline) {
+        scripts.push({ inline, attributes: attributes2, position: isInHead ? "head" : "body" });
+      }
+      continue;
+    }
+    if (src) {
+      validations.push(
+        `External scripts should be explicitly marked. If this script is required (e.g., analytics or tag manager), add jay-script="allow". Prefer page.ts for page behavior. See designer/script-tags.md.`
+      );
+    } else if (inline) {
+      validations.push(
+        `Inline scripts are not supported in jay-html. Use page.ts with makeJayStackComponent for page behavior. If this is a third-party script that must be included as-is, add jay-script="allow". See designer/script-tags.md.`
+      );
+    }
+  }
+  return scripts;
+}
 function parseHeadLinks(root, excludeCssLinks = false) {
   const allLinks = root.querySelectorAll("head link");
   return allLinks.filter((link) => {
@@ -18945,6 +19028,7 @@ async function parseJayFile(html2, filename, filePath, options, linkedContractRe
   const excludeCssLinks = !!filePath;
   const headLinks = parseHeadLinks(root, excludeCssLinks);
   const headMeta = parseHeadMeta(root);
+  const scripts = validateAndCollectScripts(root, validations);
   validations.push(...cssResult.validations);
   if (validations.length > 0)
     return new WithValidations(void 0, validations);
@@ -18980,7 +19064,8 @@ async function parseJayFile(html2, filename, filePath, options, linkedContractRe
       hasInlineData: jayYaml.hasInlineData,
       serverTrackByMap: Object.keys(serverTrackByMap).length > 0 ? serverTrackByMap : void 0,
       clientTrackByMap: Object.keys(clientTrackByMap).length > 0 ? clientTrackByMap : void 0,
-      headMeta
+      headMeta,
+      scripts: scripts.length > 0 ? scripts : void 0
     },
     validations
   );
@@ -19872,6 +19957,11 @@ ${context.indent.firstLine}    ${createBody})`,
       childContent.refs
     );
   }
+  if (isConditional(element) && isForEach(element)) {
+    return new RenderFragment("", Imports.none(), [
+      `"if" and "forEach" cannot be on the same element. Wrap the forEach in a separate element: <div if="..."><div forEach="...">...</div></div>`
+    ]);
+  }
   if (isConditional(element) && context.interactivePaths.size > 0) {
     const condition = element.getAttribute("if");
     const viewStateVars = new Variables(
@@ -20412,7 +20502,21 @@ function renderHydrateElementContent(element, context, renderContext, coordinate
             childRefs.push(frag.refs);
         }
       } else {
-        const frag = renderHydrateNode(child, context);
+        const htmlChild2 = child;
+        const isComponent = getComponentName(
+          htmlChild2.rawTagName,
+          context.importedSymbols,
+          context.headlessContractNames
+        ) !== null;
+        const isNonInteractiveConditional = isConditional(htmlChild2) && !conditionIsInteractive(htmlChild2.getAttribute("if"), context.interactivePaths);
+        const needsWrap = !isComponent && !isNonInteractiveConditional;
+        const frag = needsWrap ? renderHydrateElementContent(
+          htmlChild2,
+          context,
+          buildRenderContext(context),
+          null,
+          true
+        ) : renderHydrateNode(child, context);
         if (frag.rendered.trim()) {
           childParts.push(frag.rendered);
           childImports = childImports.plus(frag.imports);
@@ -21296,6 +21400,10 @@ const ${componentSymbol} = makeHeadlessInstanceComponent(
             mkRefsTree([], {})
           );
         }
+      } else if (isConditional(htmlElement) && isForEach(htmlElement)) {
+        return new RenderFragment("", Imports.none(), [
+          `"if" and "forEach" cannot be on the same element. Wrap the forEach in a separate element: <div if="..."><div forEach="...">...</div></div>`
+        ]);
       } else if (isConditional(htmlElement)) {
         let condition = htmlElement.getAttribute("if");
         let childElement = renderHtmlElement(htmlElement, {
@@ -22401,6 +22509,11 @@ function renderServerElement(element, context) {
   if (componentMatch !== null && componentMatch.kind === "headless-instance") {
     return renderServerHeadlessInstance(element, context, componentMatch.name);
   }
+  if (isConditional(element) && isForEach(element)) {
+    return new RenderFragment("", Imports.none(), [
+      `"if" and "forEach" cannot be on the same element. Wrap the forEach in a separate element: <div if="..."><div forEach="...">...</div></div>`
+    ]);
+  }
   if (isConditional(element)) {
     const condition = element.getAttribute("if");
     const renderedCondition = parseServerCondition(condition, variables);
@@ -22888,7 +23001,7 @@ function renderServerElementContent(element, context, options) {
     }
   }
   const refName = element.attributes.ref ? camelCase(element.attributes.ref) : null;
-  const needsCoordinate = options?.isRoot === true || isConditional(element) || dynamicTextFragment !== null || refName !== null || hasDynamicAttributeBindings(element, variables) || hasInteractiveChildElements(childNodes) || hasMixedContentDynamicTextInteractive(childNodes, context.interactivePaths);
+  const needsCoordinate = options?.isRoot === true || isConditional(element) || dynamicTextFragment !== null || refName !== null || hasDynamicAttributeBindings(element, variables) || hasInteractiveChildElements(childNodes) || hasMixedContentDynamicTextInteractive(childNodes, context.interactivePaths) || context.parentHasInteractiveChildren;
   const coordTemplate = needsCoordinate ? element.getAttribute(COORD_ATTR) : null;
   const isVoid = voidElements.has(element.rawTagName.toLowerCase());
   const closeTag = isVoid ? " />" : ">";
@@ -22926,7 +23039,8 @@ function renderServerElementContent(element, context, options) {
   } else {
     const childContext = {
       ...context,
-      indent: new Indent(indent.curr + "    ")
+      indent: new Indent(indent.curr + "    "),
+      parentHasInteractiveChildren: hasInteractiveChildElements(childNodes)
     };
     const asyncGroups = collectAsyncGroups(childNodes);
     const processedAsyncProps = /* @__PURE__ */ new Set();
@@ -23077,7 +23191,8 @@ function generateServerElementFile(jayFile, _options) {
     headlessInstanceCounter: { count: 0 },
     varMappings: {},
     insideForEach: false,
-    interactivePaths: buildInteractivePaths(jayFile.contract)
+    interactivePaths: buildInteractivePaths(jayFile.contract),
+    parentHasInteractiveChildren: false
   };
   const rendered = renderServerElementContent(rootElement.val, context, {
     isRoot: true

package/package.json

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