@marko/runtime-tags 6.0.101 → 6.0.102

package/dist/common/meta.d.ts

@@ -1,2 +1,3 @@
 export declare const DEFAULT_RUNTIME_ID = "M";
 export declare const DEFAULT_RENDER_ID = "_";
+export declare const DYNAMIC_TAG_SCRIPT_REGISTER_ID: string;

package/dist/debug/dom.js

@@ -79,6 +79,7 @@ __export(dom_exports, {
   _on: () => _on,
   _or: () => _or,
   _resume: () => _resume,
+  _resume_dynamic_tag: () => _resume_dynamic_tag,
   _return: () => _return,
   _return_change: () => _return_change,
   _script: () => _script,
@@ -237,6 +238,11 @@ function normalizeDynamicRenderer(value) {
   }
 }
 
+// src/common/meta.ts
+var DEFAULT_RUNTIME_ID = "M";
+var DEFAULT_RENDER_ID = "_";
+var DYNAMIC_TAG_SCRIPT_REGISTER_ID = true ? "_dynamicTagScript" : "d";
+
 // src/dom/event.ts
 var defaultDelegator = createDelegator();
 function _on(element, type, handler) {
@@ -305,10 +311,6 @@ function stripSpacesAndPunctuation(str) {
   return str.replace(/[^\p{L}\p{N}]/gu, "");
 }
 
-// src/common/meta.ts
-var DEFAULT_RUNTIME_ID = "M";
-var DEFAULT_RENDER_ID = "_";
-
 // src/dom/scope.ts
 var nextScopeId = 1e6;
 function createScope($global, closestBranch) {
@@ -1925,6 +1927,9 @@ var _dynamic_tag = function dynamicTag(nodeAccessor, getContent, getTagVar, inpu
           true ? `#${normalizedRenderer}/0` : 0,
           (inputIsArgs ? args[0] : args) || {}
         );
+        if (childScope["EventAttributes:" /* EventAttributes */ + (true ? `#${normalizedRenderer}/0` : 0)] || childScope["ControlledHandler:" /* ControlledHandler */ + (true ? `#${normalizedRenderer}/0` : 0)]) {
+          queueEffect(childScope, dynamicTagScript);
+        }
       } else {
         for (const accessor in normalizedRenderer.___localClosures) {
           normalizedRenderer.___localClosures[accessor](
@@ -1950,6 +1955,12 @@ var _dynamic_tag = function dynamicTag(nodeAccessor, getContent, getTagVar, inpu
     }
   };
 };
+function _resume_dynamic_tag() {
+  _resume(DYNAMIC_TAG_SCRIPT_REGISTER_ID, dynamicTagScript);
+}
+function dynamicTagScript(branch) {
+  _attrs_script(branch, true ? `#${branch.___renderer}/0` : 0);
+}
 function setConditionalRenderer(scope, nodeAccessor, newRenderer, createBranch2) {
   const referenceNode = scope[nodeAccessor];
   const prevBranch = scope["ConditionalScope:" /* ConditionalScope */ + nodeAccessor];

package/dist/debug/dom.mjs

@@ -134,6 +134,11 @@ function normalizeDynamicRenderer(value) {
   }
 }
 
+// src/common/meta.ts
+var DEFAULT_RUNTIME_ID = "M";
+var DEFAULT_RENDER_ID = "_";
+var DYNAMIC_TAG_SCRIPT_REGISTER_ID = true ? "_dynamicTagScript" : "d";
+
 // src/dom/event.ts
 var defaultDelegator = createDelegator();
 function _on(element, type, handler) {
@@ -202,10 +207,6 @@ function stripSpacesAndPunctuation(str) {
   return str.replace(/[^\p{L}\p{N}]/gu, "");
 }
 
-// src/common/meta.ts
-var DEFAULT_RUNTIME_ID = "M";
-var DEFAULT_RENDER_ID = "_";
-
 // src/dom/scope.ts
 var nextScopeId = 1e6;
 function createScope($global, closestBranch) {
@@ -1822,6 +1823,9 @@ var _dynamic_tag = function dynamicTag(nodeAccessor, getContent, getTagVar, inpu
           true ? `#${normalizedRenderer}/0` : 0,
           (inputIsArgs ? args[0] : args) || {}
         );
+        if (childScope["EventAttributes:" /* EventAttributes */ + (true ? `#${normalizedRenderer}/0` : 0)] || childScope["ControlledHandler:" /* ControlledHandler */ + (true ? `#${normalizedRenderer}/0` : 0)]) {
+          queueEffect(childScope, dynamicTagScript);
+        }
       } else {
         for (const accessor in normalizedRenderer.___localClosures) {
           normalizedRenderer.___localClosures[accessor](
@@ -1847,6 +1851,12 @@ var _dynamic_tag = function dynamicTag(nodeAccessor, getContent, getTagVar, inpu
     }
   };
 };
+function _resume_dynamic_tag() {
+  _resume(DYNAMIC_TAG_SCRIPT_REGISTER_ID, dynamicTagScript);
+}
+function dynamicTagScript(branch) {
+  _attrs_script(branch, true ? `#${branch.___renderer}/0` : 0);
+}
 function setConditionalRenderer(scope, nodeAccessor, newRenderer, createBranch2) {
   const referenceNode = scope[nodeAccessor];
   const prevBranch = scope["ConditionalScope:" /* ConditionalScope */ + nodeAccessor];
@@ -2393,6 +2403,7 @@ export {
   _on,
   _or,
   _resume,
+  _resume_dynamic_tag,
   _return,
   _return_change,
   _script,

package/dist/debug/html.js

@@ -3003,6 +3003,7 @@ var RENDER_BODY_ID = prefix + (true ? "renderBody" : "b");
 // src/common/meta.ts
 var DEFAULT_RUNTIME_ID = "M";
 var DEFAULT_RENDER_ID = "_";
+var DYNAMIC_TAG_SCRIPT_REGISTER_ID = true ? "_dynamicTagScript" : "d";
 
 // src/html/dynamic-tag.ts
 var voidElementsReg = /^(?:area|b(?:ase|r)|col|embed|hr|i(?:mg|nput)|link|meta|param|source|track|wbr)$/;
@@ -3073,6 +3074,11 @@ var _dynamic_tag = (scopeId, accessor, tag, inputOrArgs, content, inputIsArgs, s
         `Body content is not supported for the \`<${renderer}>\` tag.`
       );
     }
+    const childScope = getScopeById(branchId);
+    if (childScope && (childScope["EventAttributes:" /* EventAttributes */ + (true ? `#${renderer}/0` : 0)] || childScope["ControlledHandler:" /* ControlledHandler */ + (true ? `#${renderer}/0` : 0)])) {
+      childScope.___renderer = renderer;
+      _script(branchId, DYNAMIC_TAG_SCRIPT_REGISTER_ID);
+    }
     if (shouldResume) {
       _html(
         state.mark(

package/dist/debug/html.mjs

@@ -2911,6 +2911,7 @@ var RENDER_BODY_ID = prefix + (true ? "renderBody" : "b");
 // src/common/meta.ts
 var DEFAULT_RUNTIME_ID = "M";
 var DEFAULT_RENDER_ID = "_";
+var DYNAMIC_TAG_SCRIPT_REGISTER_ID = true ? "_dynamicTagScript" : "d";
 
 // src/html/dynamic-tag.ts
 var voidElementsReg = /^(?:area|b(?:ase|r)|col|embed|hr|i(?:mg|nput)|link|meta|param|source|track|wbr)$/;
@@ -2981,6 +2982,11 @@ var _dynamic_tag = (scopeId, accessor, tag, inputOrArgs, content, inputIsArgs, s
         `Body content is not supported for the \`<${renderer}>\` tag.`
       );
     }
+    const childScope = getScopeById(branchId);
+    if (childScope && (childScope["EventAttributes:" /* EventAttributes */ + (true ? `#${renderer}/0` : 0)] || childScope["ControlledHandler:" /* ControlledHandler */ + (true ? `#${renderer}/0` : 0)])) {
+      childScope.___renderer = renderer;
+      _script(branchId, DYNAMIC_TAG_SCRIPT_REGISTER_ID);
+    }
     if (shouldResume) {
       _html(
         state.mark(

package/dist/dom/control-flow.d.ts

@@ -10,6 +10,7 @@ export declare function renderCatch(scope: Scope, error: unknown): void;
 export declare function _if(nodeAccessor: Accessor, ...branches: Renderer[]): (scope: Scope, newBranch: number) => void;
 export declare function patchDynamicTag(fn: <T extends typeof _dynamic_tag>(cond: T) => T): void;
 export declare let _dynamic_tag: (nodeAccessor: Accessor, getContent?: ((scope: Scope) => Renderer) | 0, getTagVar?: (() => Signal<unknown>) | 0, inputIsArgs?: 1) => Signal<Renderer | string | undefined>;
+export declare function _resume_dynamic_tag(): void;
 export declare function setConditionalRenderer<T>(scope: Scope, nodeAccessor: Accessor, newRenderer: T, createBranch: ($global: Scope["$global"], renderer: NonNullable<T>, parentScope: Scope, parentNode: ParentNode) => BranchScope): void;
 export declare function _for_of(nodeAccessor: Accessor, renderer: Renderer): (scope: Scope, value: [all: unknown[], by?: ((item: unknown, index: number) => unknown) | undefined]) => void;
 export declare function _for_in(nodeAccessor: Accessor, renderer: Renderer): (scope: Scope, value: [obj: {}, by?: ((key: string, v: unknown) => unknown) | undefined]) => void;

package/dist/dom.d.ts

@@ -4,7 +4,7 @@ export { forIn, forOf, forTo, forUntil } from "./common/for";
 export { _call } from "./common/helpers";
 export { $signal, $signalReset } from "./dom/abort-signal";
 export { compat } from "./dom/compat";
-export { _await, _dynamic_tag, _for_in, _for_of, _for_to, _for_until, _if, _try, } from "./dom/control-flow";
+export { _await, _dynamic_tag, _for_in, _for_of, _for_to, _for_until, _if, _resume_dynamic_tag, _try, } from "./dom/control-flow";
 export { _attr_details_or_dialog_open as _attr_details_open, _attr_details_or_dialog_open_script as _attr_details_open_script, _attr_details_or_dialog_open as _attr_dialog_open, _attr_details_or_dialog_open_script as _attr_dialog_open_script, _attr_input_checked, _attr_input_checked_script, _attr_input_checkedValue, _attr_input_checkedValue_script, _attr_input_value, _attr_input_value_script, _attr_select_value, _attr_select_value_script, _attr_textarea_value, _attr_textarea_value_script, } from "./dom/controllable";
 export { _attr, _attr_class, _attr_class_item, _attr_class_items, _attr_content, _attr_style, _attr_style_item, _attr_style_items, _attrs, _attrs_content, _attrs_partial, _attrs_partial_content, _attrs_script, _html, _lifecycle, _text, _text_content, } from "./dom/dom";
 export { _on } from "./dom/event";

package/dist/dom.js

@@ -76,6 +76,7 @@ __export(dom_exports, {
   _on: () => _on,
   _or: () => _or,
   _resume: () => _resume,
+  _resume_dynamic_tag: () => _resume_dynamic_tag,
   _return: () => _return,
   _return_change: () => _return_change,
   _script: () => _script,
@@ -1238,7 +1239,7 @@ var _dynamic_tag = function(nodeAccessor, getContent, getTagVar, inputIsArgs) {
           childScope,
           0,
           (inputIsArgs ? args[0] : args) || {}
-        );
+        ), (childScope["i" /* EventAttributes */ + 0] || childScope["e" /* ControlledHandler */ + 0]) && queueEffect(childScope, dynamicTagScript);
       else {
         for (let accessor in normalizedRenderer.F)
           normalizedRenderer.F[accessor](
@@ -1262,6 +1263,12 @@ var _dynamic_tag = function(nodeAccessor, getContent, getTagVar, inputIsArgs) {
     }
   };
 };
+function _resume_dynamic_tag() {
+  _resume("d", dynamicTagScript);
+}
+function dynamicTagScript(branch) {
+  _attrs_script(branch, 0);
+}
 function setConditionalRenderer(scope, nodeAccessor, newRenderer, createBranch2) {
   let referenceNode = scope[nodeAccessor], prevBranch = scope["d" /* ConditionalScope */ + nodeAccessor], parentNode = referenceNode.nodeType > 1 /* Element */ ? (prevBranch?.h || referenceNode).parentNode : referenceNode, newBranch = scope["d" /* ConditionalScope */ + nodeAccessor] = newRenderer && createBranch2(scope.$global, newRenderer, scope, parentNode);
   referenceNode === parentNode ? (prevBranch && (destroyBranch(prevBranch), referenceNode.textContent = ""), newBranch && insertBranchBefore(newBranch, parentNode, null)) : prevBranch ? (newBranch ? insertBranchBefore(newBranch, parentNode, prevBranch.h) : parentNode.insertBefore(referenceNode, prevBranch.h), removeAndDestroyBranch(prevBranch)) : newBranch && (insertBranchBefore(newBranch, parentNode, referenceNode), referenceNode.remove());

package/dist/dom.mjs

@@ -1138,7 +1138,7 @@ var _dynamic_tag = function(nodeAccessor, getContent, getTagVar, inputIsArgs) {
           childScope,
           0,
           (inputIsArgs ? args[0] : args) || {}
-        );
+        ), (childScope["i" /* EventAttributes */ + 0] || childScope["e" /* ControlledHandler */ + 0]) && queueEffect(childScope, dynamicTagScript);
       else {
         for (let accessor in normalizedRenderer.F)
           normalizedRenderer.F[accessor](
@@ -1162,6 +1162,12 @@ var _dynamic_tag = function(nodeAccessor, getContent, getTagVar, inputIsArgs) {
     }
   };
 };
+function _resume_dynamic_tag() {
+  _resume("d", dynamicTagScript);
+}
+function dynamicTagScript(branch) {
+  _attrs_script(branch, 0);
+}
 function setConditionalRenderer(scope, nodeAccessor, newRenderer, createBranch2) {
   let referenceNode = scope[nodeAccessor], prevBranch = scope["d" /* ConditionalScope */ + nodeAccessor], parentNode = referenceNode.nodeType > 1 /* Element */ ? (prevBranch?.h || referenceNode).parentNode : referenceNode, newBranch = scope["d" /* ConditionalScope */ + nodeAccessor] = newRenderer && createBranch2(scope.$global, newRenderer, scope, parentNode);
   referenceNode === parentNode ? (prevBranch && (destroyBranch(prevBranch), referenceNode.textContent = ""), newBranch && insertBranchBefore(newBranch, parentNode, null)) : prevBranch ? (newBranch ? insertBranchBefore(newBranch, parentNode, prevBranch.h) : parentNode.insertBefore(referenceNode, prevBranch.h), removeAndDestroyBranch(prevBranch)) : newBranch && (insertBranchBefore(newBranch, parentNode, referenceNode), referenceNode.remove());
@@ -1523,6 +1529,7 @@ export {
   _on,
   _or,
   _resume,
+  _resume_dynamic_tag,
   _return,
   _return_change,
   _script,

package/dist/html.js

@@ -1981,7 +1981,8 @@ var voidElementsReg = /^(?:area|b(?:ase|r)|col|embed|hr|i(?:mg|nput)|link|meta|p
       }
       _html(`</${renderer}>`);
     }
-    shouldResume && _html(
+    let childScope = getScopeById(branchId);
+    childScope && (childScope["i" /* EventAttributes */ + 0] || childScope["e" /* ControlledHandler */ + 0]) && (childScope.i = renderer, _script(branchId, "d")), shouldResume && _html(
       state.mark(
         "'" /* BranchEndNativeTag */,
         scopeId + " " + accessor + " " + branchId

package/dist/html.mjs

@@ -1892,7 +1892,8 @@ var voidElementsReg = /^(?:area|b(?:ase|r)|col|embed|hr|i(?:mg|nput)|link|meta|p
       }
       _html(`</${renderer}>`);
     }
-    shouldResume && _html(
+    let childScope = getScopeById(branchId);
+    childScope && (childScope["i" /* EventAttributes */ + 0] || childScope["e" /* ControlledHandler */ + 0]) && (childScope.i = renderer, _script(branchId, "d")), shouldResume && _html(
       state.mark(
         "'" /* BranchEndNativeTag */,
         scopeId + " " + accessor + " " + branchId

package/dist/translator/index.js

@@ -1514,38 +1514,37 @@ function createSectionState(key, init) {
 var import_compiler6 = require("@marko/compiler");
 var import_babel_utils9 = require("@marko/compiler/babel-utils");
 var MARKO_FILE_REG = /^<.*>$|\.marko$/;
-function analyzeTagNameType(tag) {
+function analyzeTagNameType(tag, allowDynamic) {
   const extra = tag.node.extra ??= {};
   if (extra.tagNameType === void 0) {
     const name2 = tag.get("name");
     if (name2.isStringLiteral()) {
       extra.tagNameType = name2.node.value[0] === "@" ? 3 /* AttributeTag */ : (0, import_babel_utils9.isNativeTag)(tag) ? 0 /* NativeTag */ : 1 /* CustomTag */;
-      extra.tagNameNullable = extra.tagNameNullable = false;
-    } else if (name2.isIdentifier()) {
-      analyzeExpressionTagName(name2, extra);
-      if (extra.tagNameType === 0 /* NativeTag */) {
-        extra.tagNameType = 2 /* DynamicTag */;
-      }
+      extra.tagNameNullable = extra.tagNameDynamic = false;
     } else if (name2.isTemplateLiteral() && !name2.node.expressions.length) {
       extra.tagNameType = 0 /* NativeTag */;
+      extra.tagNameNullable = extra.tagNameDynamic = false;
+    } else if (name2.isIdentifier()) {
+      analyzeExpressionTagName(name2, extra);
+      extra.tagNameDynamic = !extra.tagNameImported;
     } else {
-      extra.tagNameType = 2 /* DynamicTag */;
-    }
-    if (extra.tagNameType === void 0) {
-      extra.tagNameType = 2 /* DynamicTag */;
+      analyzeExpressionTagName(name2, extra);
+      extra.tagNameDynamic = true;
     }
-    if (extra.tagNameType === 1 /* CustomTag */ && !isCoreTag(tag)) {
+    if (!extra.tagNameDynamic && extra.tagNameType === 1 /* CustomTag */ && !isCoreTag(tag)) {
       const childFile = (0, import_babel_utils9.loadFileForTag)(tag);
       if (!childFile) {
         extra.tagNameType = 2 /* DynamicTag */;
+        extra.tagNameDynamic = true;
       } else if (childFile.ast.program.extra.featureType === "class") {
         extra.tagNameType = 2 /* DynamicTag */;
+        extra.tagNameDynamic = true;
         extra.featureType = "class";
         ((0, import_babel_utils9.getProgram)().node.extra ??= {}).needsCompat = true;
       }
     }
   }
-  return extra.tagNameType;
+  return !allowDynamic && extra.tagNameDynamic ? 2 /* DynamicTag */ : extra.tagNameType;
 }
 function analyzeExpressionTagName(name2, extra) {
   const pending = [name2];
@@ -1569,9 +1568,9 @@ function analyzeExpressionTagName(name2, extra) {
     } else if (path5.isAssignmentExpression()) {
       pending.push(path5.get("right"));
     } else if (path5.isBinaryExpression()) {
-      type = path5.node.operator !== "+" || type !== void 0 ? 2 /* DynamicTag */ : 0 /* NativeTag */;
+      type = path5.node.operator !== "+" || type === void 0 || type === 0 /* NativeTag */ ? 0 /* NativeTag */ : 2 /* DynamicTag */;
     } else if (path5.isStringLiteral() || path5.isTemplateLiteral()) {
-      type = type !== void 0 ? 2 /* DynamicTag */ : 0 /* NativeTag */;
+      type = type === void 0 || type === 0 /* NativeTag */ ? 0 /* NativeTag */ : 2 /* DynamicTag */;
     } else if (path5.isNullLiteral()) {
       nullable = true;
     } else if (path5.isIdentifier()) {
@@ -1588,12 +1587,14 @@ function analyzeExpressionTagName(name2, extra) {
         const decl = binding.path.parent;
         if (MARKO_FILE_REG.test(decl.source.value) && decl.specifiers.some((it) => import_compiler6.types.isImportDefaultSpecifier(it))) {
           const resolvedImport = (0, import_babel_utils9.resolveTagImport)(name2, decl.source.value) || decl.source.value;
-          if (type === 0 /* NativeTag */ || tagNameImported && tagNameImported !== resolvedImport) {
-            type = 2 /* DynamicTag */;
-            tagNameImported = void 0;
-          } else {
+          if (type === void 0) {
             type = 1 /* CustomTag */;
             tagNameImported = resolvedImport;
+          } else if (type === 0 /* NativeTag */) {
+            type = 2 /* DynamicTag */;
+            tagNameImported = void 0;
+          } else if (tagNameImported !== resolvedImport) {
+            tagNameImported = void 0;
           }
         } else {
           type = 2 /* DynamicTag */;
@@ -1620,9 +1621,8 @@ function analyzeExpressionTagName(name2, extra) {
       type = 2 /* DynamicTag */;
     }
   }
-  extra.tagNameType = type;
+  extra.tagNameType = type ?? 2 /* DynamicTag */;
   extra.tagNameNullable = nullable;
-  extra.tagNameDynamic = true;
   if (type === 1 /* CustomTag */ && tagNameImported) {
     extra.tagNameImported = tagNameImported;
   }
@@ -5267,10 +5267,10 @@ function translateVar(tag, initialValue, kind = "const") {
   }
   forEachIdentifierPath(tag.get("var"), (id) => {
     const binding = id.node.extra?.binding;
-    if (!binding || !binding.upstreamAlias || !binding.assignmentSections || id.node === tagVar) {
+    if (!binding || !binding.upstreamAlias || !binding.assignmentSections || binding.property === void 0 || id.node === tagVar) {
       return;
     }
-    const changeName = binding.name + "Change";
+    const changeName = binding.property + "Change";
     const changeBinding = binding.upstreamAlias.propertyAliases.get(changeName);
     if (changeBinding && changeName !== changeBinding.name) {
       getDestructurePattern(id)?.pushContainer(
@@ -10694,7 +10694,7 @@ function assertValidCondition(tag) {
 function assertHasPrecedingCondition(tag) {
   let prev = tag.getPrevSibling();
   while (prev.node && prev.isMarkoComment()) prev = prev.getPrevSibling();
-  if (!isConditionTag(prev) || getTagName(prev) !== "else" && !prev.node.attributes.length) {
+  if (!isConditionTag(prev) || getTagName(prev) === "else" && !prev.node.attributes.length) {
     throw tag.buildCodeFrameError(
       `The [\`<${getTagName(tag)}>\` tag](https://markojs.com/docs/reference/core-tag#if--else) must have a preceding \`<if=cond>\` or \`<else if=cond>\`.`
     );
@@ -10734,7 +10734,7 @@ function assertOptionalIfAttribute(tag) {
   const { node } = tag;
   const [ifAttr] = node.attributes;
   if (node.attributes.length > 1 || ifAttr && ifAttr.name !== "if") {
-    const start = node.attributes[1].loc?.start;
+    const start = node.attributes[0].loc?.start;
     const end = node.attributes[node.attributes.length - 1].loc?.end;
     const msg = `The [\`${getTagName(tag)}\` tag](https://markojs.com/docs/reference/core-tag#if--else) only supports an \`if=\` attribute.`;
     if (start == null || end == null) {
@@ -12188,6 +12188,7 @@ var import_compiler63 = require("@marko/compiler");
 var import_babel_utils51 = require("@marko/compiler/babel-utils");
 var kDOMBinding3 = Symbol("dynamic tag dom binding");
 var kChildOffsetScopeBinding2 = Symbol("custom tag scope offset");
+var importedDynamicTagResume = /* @__PURE__ */ new WeakSet();
 var dynamic_tag_default = {
   analyze: {
     enter(tag) {
@@ -12478,12 +12479,27 @@ var dynamic_tag_default = {
             ];
           }
         }
+        enableDynamicTagResume(tag);
         addValue(section, tagExtra.referencedBindings, signal, tagExpression);
         tag.remove();
       }
     }
   }
 };
+function enableDynamicTagResume(tag) {
+  const program = (0, import_babel_utils51.getProgram)().node;
+  if (!importedDynamicTagResume.has(program) && analyzeTagNameType(tag, true) !== 1 /* CustomTag */) {
+    for (const attr of tag.node.attributes) {
+      if (attr.type === "MarkoSpreadAttribute" || attr.type === "MarkoAttribute" && isEventOrChangeHandler(attr.name)) {
+        importedDynamicTagResume.add(program);
+        program.body.push(
+          import_compiler63.types.expressionStatement(callRuntime("_resume_dynamic_tag"))
+        );
+        return;
+      }
+    }
+  }
+}
 
 // src/translator/visitors/tag/index.ts
 var tag_default = {
@@ -12549,7 +12565,8 @@ var tag_default = {
           }
         }
       }
-      if (extra.tagNameDynamic && extra.tagNameNullable && !tag.get("name").isIdentifier() && isOutputHTML()) {
+      const type = analyzeTagNameType(tag);
+      if (extra.tagNameDynamic && extra.tagNameNullable && type === 0 /* NativeTag */ && !tag.get("name").isIdentifier() && isOutputHTML()) {
         const tagNameId = generateUidIdentifier("tagName");
         const [tagNameVarPath] = tag.insertBefore(
           import_compiler64.types.variableDeclaration("const", [
@@ -12559,7 +12576,7 @@ var tag_default = {
         tagNameVarPath.skip();
         tag.set("name", tagNameId);
       }
-      switch (extra.tagNameType) {
+      switch (type) {
         case 0 /* NativeTag */:
           native_tag_default.translate.enter(tag);
           break;
@@ -12580,7 +12597,7 @@ var tag_default = {
         exit(translator.hook, tag);
         return;
       }
-      switch (tag.node.extra.tagNameType) {
+      switch (analyzeTagNameType(tag)) {
         case 0 /* NativeTag */:
           native_tag_default.translate.exit(tag);
           break;

package/dist/translator/util/tag-name-type.d.ts

@@ -13,4 +13,4 @@ export declare enum TagNameType {
     DynamicTag = 2,
     AttributeTag = 3
 }
-export default function analyzeTagNameType(tag: t.NodePath<t.MarkoTag>): TagNameType;
+export default function analyzeTagNameType(tag: t.NodePath<t.MarkoTag>, allowDynamic?: boolean): TagNameType;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marko/runtime-tags",
-  "version": "6.0.101",
+  "version": "6.0.102",
   "description": "Optimized runtime for Marko templates.",
   "keywords": [
     "api",