marko 6.0.101 → 6.0.103

package/dist/translator/index.js

@@ -135,14 +135,29 @@ var AccessorPrefix = /* @__PURE__ */ ((AccessorPrefix4) => {
   return AccessorPrefix4;
 })(AccessorPrefix || {});
 var AccessorProp = /* @__PURE__ */ ((AccessorProp4) => {
+  AccessorProp4["Global"] = "$global";
   AccessorProp4["Owner"] = "_";
+  AccessorProp4["AbortControllers"] = "#AbortControllers";
+  AccessorProp4["AbortScopes"] = "#AbortScopes";
+  AccessorProp4["Args"] = "#Args";
   AccessorProp4["BranchAccessor"] = "#BranchAccessor";
+  AccessorProp4["BranchScopes"] = "#BranchScopes";
   AccessorProp4["CatchContent"] = "#CatchContent";
+  AccessorProp4["ClosestBranch"] = "#ClosestBranch";
+  AccessorProp4["ClosestBranchId"] = "#ClosestBranchId";
+  AccessorProp4["Creating"] = "#Creating";
+  AccessorProp4["Destroyed"] = "#Destroyed";
+  AccessorProp4["Effects"] = "#Effects";
+  AccessorProp4["EndNode"] = "#EndNode";
+  AccessorProp4["Id"] = "#Id";
+  AccessorProp4["ParentBranch"] = "#ParentBranch";
+  AccessorProp4["PendingAsyncCount"] = "#PendingAsyncCount";
   AccessorProp4["PlaceholderBranch"] = "#PlaceholderBranch";
   AccessorProp4["PlaceholderContent"] = "#PlaceholderContent";
+  AccessorProp4["Renderer"] = "#Renderer";
+  AccessorProp4["StartNode"] = "#StartNode";
   AccessorProp4["TagVariable"] = "#TagVariable";
   AccessorProp4["TagVariableChange"] = "#TagVariableChange";
-  AccessorProp4["ClosestBranchId"] = "#ClosestBranchId";
   return AccessorProp4;
 })(AccessorProp || {});
 
@@ -238,6 +253,57 @@ function isNullableExpr(expr) {
 var import_compiler35 = require("@marko/compiler");
 var import_babel_utils25 = require("@marko/compiler/babel-utils");
 
+// src/common/helpers.ts
+function classValue(classValue2) {
+  return toDelimitedString(classValue2, " ", stringifyClassObject);
+}
+function stringifyClassObject(name2, value) {
+  return value ? name2 : "";
+}
+function styleValue(styleValue2) {
+  return toDelimitedString(styleValue2, ";", stringifyStyleObject);
+}
+function stringifyStyleObject(name2, value) {
+  return value || value === 0 ? name2 + ":" + value : "";
+}
+function toDelimitedString(val, delimiter, stringify) {
+  let str = "";
+  let sep = "";
+  let part;
+  if (val) {
+    if (typeof val !== "object") {
+      str += val;
+    } else if (Array.isArray(val)) {
+      for (const v of val) {
+        part = toDelimitedString(v, delimiter, stringify);
+        if (part) {
+          str += sep + part;
+          sep = delimiter;
+        }
+      }
+    } else {
+      for (const name2 in val) {
+        part = stringify(name2, val[name2]);
+        if (part) {
+          str += sep + part;
+          sep = delimiter;
+        }
+      }
+    }
+  }
+  return str;
+}
+function isEventHandler(name2) {
+  return /^on[A-Z-]/.test(name2);
+}
+function getEventHandlerName(name2) {
+  return name2[2] === "-" ? name2.slice(3) : name2.slice(2).toLowerCase();
+}
+function isVoid(value) {
+  return value == null || value === false;
+}
+var decodeAccessor = (num) => (num + (num < 26 ? 10 : num < 962 ? 334 : 11998)).toString(36);
+
 // src/html/serializer.ts
 var kTouchedIterator = Symbol();
 var { hasOwnProperty } = {};
@@ -1202,32 +1268,47 @@ var import_compiler5 = require("@marko/compiler");
 
 // src/common/accessor.ts
 var AccessorPrefix2 = /* @__PURE__ */ ((AccessorPrefix4) => {
-  AccessorPrefix4["ClosureScopes"] = "a";
-  AccessorPrefix4["ClosureSignalIndex"] = "b";
-  AccessorPrefix4["ConditionalRenderer"] = "c";
-  AccessorPrefix4["ConditionalScope"] = "d";
-  AccessorPrefix4["ControlledHandler"] = "e";
-  AccessorPrefix4["ControlledType"] = "f";
-  AccessorPrefix4["ControlledValue"] = "g";
-  AccessorPrefix4["DynamicPlaceholderLastChild"] = "h";
-  AccessorPrefix4["EventAttributes"] = "i";
-  AccessorPrefix4["Getter"] = "j";
-  AccessorPrefix4["LifecycleAbortController"] = "k";
-  AccessorPrefix4["LoopScopeArray"] = "l";
-  AccessorPrefix4["LoopScopeMap"] = "m";
-  AccessorPrefix4["Promise"] = "n";
-  AccessorPrefix4["TagVariableChange"] = "o";
+  AccessorPrefix4["ClosureScopes"] = "A";
+  AccessorPrefix4["ClosureSignalIndex"] = "B";
+  AccessorPrefix4["ConditionalRenderer"] = "C";
+  AccessorPrefix4["ConditionalScope"] = "D";
+  AccessorPrefix4["ControlledHandler"] = "E";
+  AccessorPrefix4["ControlledType"] = "F";
+  AccessorPrefix4["ControlledValue"] = "G";
+  AccessorPrefix4["DynamicPlaceholderLastChild"] = "H";
+  AccessorPrefix4["EventAttributes"] = "I";
+  AccessorPrefix4["Getter"] = "J";
+  AccessorPrefix4["LifecycleAbortController"] = "K";
+  AccessorPrefix4["LoopScopeArray"] = "L";
+  AccessorPrefix4["LoopScopeMap"] = "M";
+  AccessorPrefix4["Promise"] = "N";
+  AccessorPrefix4["TagVariableChange"] = "O";
   return AccessorPrefix4;
 })(AccessorPrefix2 || {});
 var AccessorProp2 = /* @__PURE__ */ ((AccessorProp4) => {
+  AccessorProp4["Global"] = "$";
   AccessorProp4["Owner"] = "_";
-  AccessorProp4["BranchAccessor"] = "a";
-  AccessorProp4["CatchContent"] = "b";
-  AccessorProp4["PlaceholderBranch"] = "c";
-  AccessorProp4["PlaceholderContent"] = "d";
-  AccessorProp4["TagVariable"] = "e";
-  AccessorProp4["TagVariableChange"] = "f";
-  AccessorProp4["ClosestBranchId"] = "g";
+  AccessorProp4["AbortControllers"] = "A";
+  AccessorProp4["AbortScopes"] = "B";
+  AccessorProp4["Args"] = "C";
+  AccessorProp4["BranchAccessor"] = "D";
+  AccessorProp4["BranchScopes"] = "E";
+  AccessorProp4["CatchContent"] = "F";
+  AccessorProp4["ClosestBranch"] = "G";
+  AccessorProp4["ClosestBranchId"] = "H";
+  AccessorProp4["Creating"] = "I";
+  AccessorProp4["Destroyed"] = "J";
+  AccessorProp4["Effects"] = "K";
+  AccessorProp4["EndNode"] = "L";
+  AccessorProp4["Id"] = "M";
+  AccessorProp4["ParentBranch"] = "N";
+  AccessorProp4["PendingAsyncCount"] = "O";
+  AccessorProp4["PlaceholderBranch"] = "P";
+  AccessorProp4["PlaceholderContent"] = "Q";
+  AccessorProp4["Renderer"] = "R";
+  AccessorProp4["StartNode"] = "S";
+  AccessorProp4["TagVariable"] = "T";
+  AccessorProp4["TagVariableChange"] = "U";
   return AccessorProp4;
 })(AccessorProp2 || {});
 
@@ -1514,38 +1595,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 +1649,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 +1668,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 +1702,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;
   }
@@ -2254,54 +2335,48 @@ var import_babel_utils13 = require("@marko/compiler/babel-utils");
 // src/common/attr-tag.ts
 var rest = false ? Symbol("Attribute Tag") : Symbol();
 
-// src/common/helpers.ts
-function classValue(classValue2) {
-  return toDelimitedString(classValue2, " ", stringifyClassObject);
-}
-function stringifyClassObject(name2, value) {
-  return value ? name2 : "";
-}
-function styleValue(styleValue2) {
-  return toDelimitedString(styleValue2, ";", stringifyStyleObject);
-}
-function stringifyStyleObject(name2, value) {
-  return value || value === 0 ? name2 + ":" + value : "";
-}
-function toDelimitedString(val, delimiter, stringify) {
-  let str = "";
-  let sep = "";
-  let part;
-  if (val) {
-    if (typeof val !== "object") {
-      str += val;
-    } else if (Array.isArray(val)) {
-      for (const v of val) {
-        part = toDelimitedString(v, delimiter, stringify);
-        if (part) {
-          str += sep + part;
-          sep = delimiter;
-        }
+// src/common/errors.ts
+function assertExclusiveAttrs(attrs, onError = throwErr) {
+  if (attrs) {
+    let exclusiveAttrs;
+    if (attrs.checkedChange) {
+      (exclusiveAttrs ||= []).push("checkedChange");
+    }
+    if (attrs.checkedValue) {
+      (exclusiveAttrs ||= []).push("checkedValue");
+      if (attrs.checked) {
+        exclusiveAttrs.push("checked");
       }
-    } else {
-      for (const name2 in val) {
-        part = stringify(name2, val[name2]);
-        if (part) {
-          str += sep + part;
-          sep = delimiter;
-        }
+    } else if (attrs.checkedValueChange) {
+      (exclusiveAttrs ||= []).push("checkedValueChange");
+      if (attrs.checked) {
+        exclusiveAttrs.push("checked");
       }
     }
+    if (attrs.valueChange) {
+      (exclusiveAttrs ||= []).push("valueChange");
+    }
+    if (exclusiveAttrs && exclusiveAttrs.length > 1) {
+      onError(
+        `The attributes ${joinWithAnd(exclusiveAttrs)} are mutually exclusive.`
+      );
+    }
   }
-  return str;
 }
-function isEventHandler(name2) {
-  return /^on[A-Z-]/.test(name2);
-}
-function getEventHandlerName(name2) {
-  return name2[2] === "-" ? name2.slice(3) : name2.slice(2).toLowerCase();
+function throwErr(msg) {
+  throw new Error(msg);
 }
-function isVoid(value) {
-  return value == null || value === false;
+function joinWithAnd(a) {
+  switch (a.length) {
+    case 0:
+      return "";
+    case 1:
+      return a[0];
+    case 2:
+      return `${a[0]} and ${a[1]}`;
+    default:
+      return `${a.slice(0, -1).join(", ")}, and ${a[a.length - 1]}`;
+  }
 }
 
 // src/html/content.ts
@@ -3170,10 +3245,10 @@ function getScopeExpression(section, targetSection) {
   }
   return scope;
 }
-function createScopeReadExpression(section, reference) {
+function createScopeReadExpression(reference, section) {
   const propName = toPropertyName(getScopeAccessor(reference));
   return import_compiler19.types.memberExpression(
-    reference.type === 4 /* local */ ? scopeIdentifier : getScopeExpression(section, reference.section),
+    section && reference.type !== 4 /* local */ ? getScopeExpression(section, reference.section) : scopeIdentifier,
     propName,
     propName.type !== "Identifier"
   );
@@ -3320,7 +3395,7 @@ function getSignal(section, referencedBindings, name2 = generateSignalName(refer
           import_compiler22.types.numericLiteral(id),
           getSignalFn(signal),
           scopeOffset || referencedBindings.length > 2 ? import_compiler22.types.numericLiteral(referencedBindings.length - 1) : void 0,
-          scopeOffset && getScopeAccessorLiteral(scopeOffset)
+          scopeOffset && getScopeAccessorLiteral(scopeOffset, true)
         );
       };
     } else if (referencedBindings.section !== section && bindingUtil.find(section.referencedClosures, referencedBindings)) {
@@ -3330,7 +3405,7 @@ function getSignal(section, referencedBindings, name2 = generateSignalName(refer
         const closureSignalBuilder = getClosureSignalBuilder(section);
         return !closureSignalBuilder || isDynamicClosure(section, canonicalClosure) ? callRuntime(
           "_closure_get",
-          getScopeAccessorLiteral(canonicalClosure),
+          getScopeAccessorLiteral(canonicalClosure, true),
           render,
           isImmediateOwner(section, canonicalClosure) ? void 0 : import_compiler22.types.arrowFunctionExpression(
             [scopeIdentifier],
@@ -3353,11 +3428,10 @@ function initValue(binding, isLet = false) {
     }
     return callRuntime(
       isLet ? "_let" : "_const",
-      getScopeAccessorLiteral(binding, isLet),
+      getScopeAccessorLiteral(binding, true, isLet),
       fn
     );
   };
-  signal.valueAccessor = getScopeAccessorLiteral(binding);
   for (const alias of binding.aliases) {
     initValue(alias);
   }
@@ -3418,7 +3492,7 @@ function getSignalFn(signal) {
                     ...getTranslatedExtraArgs(aliasSignal)
                   ])
                 ),
-                [createScopeReadExpression(binding.section, binding)]
+                [createScopeReadExpression(binding)]
               )
             )
           );
@@ -3427,7 +3501,7 @@ function getSignalFn(signal) {
             import_compiler22.types.expressionStatement(
               import_compiler22.types.callExpression(aliasSignal.identifier, [
                 scopeIdentifier,
-                createScopeReadExpression(binding.section, binding),
+                createScopeReadExpression(binding),
                 ...getTranslatedExtraArgs(aliasSignal)
               ])
             )
@@ -3442,7 +3516,7 @@ function getSignalFn(signal) {
           import_compiler22.types.callExpression(aliasSignal.identifier, [
             scopeIdentifier,
             toMemberExpression(
-              createScopeReadExpression(binding.section, binding),
+              createScopeReadExpression(binding),
               key,
               binding.nullable
             ),
@@ -3454,10 +3528,7 @@ function getSignalFn(signal) {
     if (assertsHoists) {
       signal.render.push(
         import_compiler22.types.expressionStatement(
-          callRuntime(
-            "_assert_hoist",
-            createScopeReadExpression(binding.section, binding)
-          )
+          callRuntime("_assert_hoist", createScopeReadExpression(binding))
         )
       );
     }
@@ -3799,9 +3870,7 @@ function writeDomGetters(section) {
           callRuntime(
             "_el",
             import_compiler22.types.stringLiteral(registerId),
-            import_compiler22.types.stringLiteral(
-              getAccessorPrefix().Getter + getScopeAccessorLiteral(binding).value
-            )
+            getScopeAccessorLiteral(binding, true)
           )
         )
       ])
@@ -3814,7 +3883,7 @@ function writeHoists(section) {
       const accessors = [
         binding.type === 0 /* dom */ ? import_compiler22.types.stringLiteral(
           getAccessorPrefix().Getter + getScopeAccessor(binding)
-        ) : getScopeAccessorLiteral(binding)
+        ) : getScopeAccessorLiteral(binding, true)
       ];
       let currentSection = section;
       while (currentSection && currentSection !== hoistedBinding.section) {
@@ -4105,7 +4174,7 @@ function replaceBindingReadNode(node) {
       const { extra } = node.callee;
       const binding = extra?.read?.binding;
       if (binding?.type === 0 /* dom */) {
-        const replacement = createScopeReadExpression(extra.section, binding);
+        const replacement = createScopeReadExpression(binding, extra.section);
         return isOptimize() ? replacement : callRuntime("_el_read", replacement);
       }
       break;
@@ -4132,7 +4201,7 @@ function replaceAssignedNode(node) {
           extra.section,
           import_compiler22.types.binaryExpression(
             node.operator === "++" ? "+" : "-",
-            createScopeReadExpression(extra.section, extra.assignment),
+            createScopeReadExpression(extra.assignment, extra.section),
             import_compiler22.types.numericLiteral(1)
           )
         );
@@ -4163,8 +4232,8 @@ function replaceAssignedNode(node) {
                   -1
                 ),
                 createScopeReadExpression(
-                  extra.section,
-                  extra.assignment
+                  extra.assignment,
+                  extra.section
                 ),
                 node.right
               )
@@ -4228,7 +4297,7 @@ function getBuildAssignment(extra) {
     return (section, value) => {
       const replacement = callRuntime(
         "_call",
-        createScopeReadExpression(section, assignmentTo),
+        createScopeReadExpression(assignmentTo, section),
         value
       );
       updateExpressions.add(replacement);
@@ -4359,7 +4428,7 @@ var dom_default = {
               const objProps = [];
               forEach(childSection.referencedLocalClosures, (closure) => {
                 const closureSignal = getSignal(childSection, closure);
-                const key = toPropertyName(getScopeAccessor(closure));
+                const key = toPropertyName(getScopeAccessor(closure, true));
                 if (signalHasStatements(closureSignal)) {
                   const expr = getSignalFn(closureSignal);
                   if (import_compiler23.types.isFunction(expr) && import_compiler23.types.isBlockStatement(expr.body)) {
@@ -5267,10 +5336,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(
@@ -5371,7 +5440,9 @@ var native_tag_default = {
           attrExprExtras = push(attrExprExtras, valueExtra);
         }
       }
-      assertExclusiveControllableGroups(tag, seen);
+      assertExclusiveAttrs(seen, (msg) => {
+        throw tag.get("name").buildCodeFrameError(msg);
+      });
       if (node.var || hasEventHandlers || hasDynamicAttributes || getRelatedControllable(tagName, seen)?.special) {
         const tagExtra = node.extra ??= {};
         const tagSection = getOrCreateSection(tag);
@@ -5682,7 +5753,7 @@ var native_tag_default = {
         const write = writeTo(tag);
         const tagSection = getSection(tag);
         const visitAccessor = nodeBinding && getScopeAccessorLiteral(nodeBinding);
-        if (visitAccessor) {
+        if (nodeBinding) {
           visit(tag, 32 /* Get */);
         }
         write`<${tag.node.name}`;
@@ -5726,11 +5797,7 @@ var native_tag_default = {
               if (confident) {
                 write`${getHTMLRuntime()[helper](computed)}`;
               } else {
-                const nodeExpr = import_compiler30.types.memberExpression(
-                  scopeIdentifier,
-                  visitAccessor,
-                  true
-                );
+                const nodeExpr = createScopeReadExpression(nodeBinding);
                 const meta = {
                   staticItems: void 0,
                   dynamicItems: void 0,
@@ -5794,7 +5861,7 @@ var native_tag_default = {
                   import_compiler30.types.expressionStatement(
                     callRuntime(
                       "_on",
-                      import_compiler30.types.memberExpression(scopeIdentifier, visitAccessor, true),
+                      createScopeReadExpression(nodeBinding),
                       import_compiler30.types.stringLiteral(getEventHandlerName(name2)),
                       value
                     )
@@ -5808,7 +5875,7 @@ var native_tag_default = {
                   import_compiler30.types.expressionStatement(
                     callRuntime(
                       "_attr",
-                      import_compiler30.types.memberExpression(scopeIdentifier, visitAccessor, true),
+                      createScopeReadExpression(nodeBinding),
                       import_compiler30.types.stringLiteral(name2),
                       value
                     )
@@ -5903,19 +5970,6 @@ var native_tag_default = {
     }
   })
 };
-function assertExclusiveControllableGroups(tag, attrs) {
-  const exclusiveGroups = [
-    attrs.open || attrs.openChange,
-    attrs.checked || attrs.checkedChange,
-    attrs.checkedValue || attrs.checkedValueChange,
-    attrs.valueChange
-  ].filter(Boolean);
-  if (exclusiveGroups.length > 1) {
-    throw tag.get("name").buildCodeFrameError(
-      `The attributes ${exclusiveGroups.map((attr) => `"${attr.name}"`).join(", ")} are mutually exclusive.`
-    );
-  }
-}
 function getRelatedControllable(tagName, attrs) {
   switch (tagName) {
     case "input":
@@ -6343,7 +6397,7 @@ var for_default = {
         setClosureSignalBuilder(tag, (_closure, render) => {
           return callRuntime(
             "_for_closure",
-            getScopeAccessorLiteral(nodeRef),
+            getScopeAccessorLiteral(nodeRef, true),
             render
           );
         });
@@ -6352,7 +6406,7 @@ var for_default = {
         signal.build = () => {
           return callRuntime(
             forTypeToDOMRuntime(forType),
-            getScopeAccessorLiteral(nodeRef),
+            getScopeAccessorLiteral(nodeRef, true),
             import_compiler32.types.identifier(bodySection.name)
           );
         };
@@ -6873,7 +6927,7 @@ function buildContent(body) {
           scopeIdentifier,
           import_compiler33.types.objectExpression(
             toArray(bodySection.referencedLocalClosures, (ref) => {
-              const accessor = getScopeAccessor(ref);
+              const accessor = getScopeAccessor(ref, true);
               const isShorthand = accessor === ref.name;
               return import_compiler33.types.objectProperty(
                 toPropertyName(accessor),
@@ -7097,7 +7151,7 @@ function knownTagTranslateDOM(tag, propTree, getBindingIdentifier, callSetup) {
     source.register = true;
     source.buildAssignment = (valueSection, value) => {
       const changeArgs = [
-        createScopeReadExpression(valueSection, childScopeBinding),
+        createScopeReadExpression(childScopeBinding, valueSection),
         value
       ];
       if (!isOptimize()) {
@@ -7113,7 +7167,7 @@ function knownTagTranslateDOM(tag, propTree, getBindingIdentifier, callSetup) {
         callRuntime(
           "_var",
           scopeIdentifier,
-          getScopeAccessorLiteral(childScopeBinding),
+          getScopeAccessorLiteral(childScopeBinding, true),
           source.identifier
         )
       )
@@ -7366,7 +7420,7 @@ function writeParamsToSignals(tag, propTree, importAlias, info) {
       );
     }
     let renderArgs = [
-      createScopeReadExpression(info.tagSection, info.childScopeBinding)
+      createScopeReadExpression(info.childScopeBinding, info.tagSection)
     ];
     if (tag.node.arguments) {
       renderArgs = [...renderArgs, ...tag.node.arguments];
@@ -7401,8 +7455,8 @@ function writeParamsToSignals(tag, propTree, importAlias, info) {
           import_compiler34.types.expressionStatement(
             import_compiler34.types.callExpression(argExportIdentifier, [
               createScopeReadExpression(
-                info.tagSection,
-                info.childScopeBinding
+                info.childScopeBinding,
+                info.tagSection
               ),
               arg
             ])
@@ -7474,7 +7528,7 @@ function writeAttrsToSignals(tag, propTree, importAlias, info) {
       referencedBindings,
       import_compiler34.types.expressionStatement(
         import_compiler34.types.callExpression(tagInputIdentifier, [
-          createScopeReadExpression(info.tagSection, info.childScopeBinding),
+          createScopeReadExpression(info.childScopeBinding, info.tagSection),
           translatedProps
         ])
       )
@@ -7558,8 +7612,8 @@ function writeAttrsToSignals(tag, propTree, importAlias, info) {
           import_compiler34.types.expressionStatement(
             import_compiler34.types.callExpression(attrExportIdentifier, [
               createScopeReadExpression(
-                info.tagSection,
-                info.childScopeBinding
+                info.childScopeBinding,
+                info.tagSection
               ),
               getAttrTagIdentifier(attrTagMeta)
             ])
@@ -7583,7 +7637,7 @@ function writeAttrsToSignals(tag, propTree, importAlias, info) {
         // TODO: pretty sure content needs to have the reference group of it's param defaults.
         import_compiler34.types.expressionStatement(
           import_compiler34.types.callExpression(contentExportIdentifier, [
-            createScopeReadExpression(info.tagSection, info.childScopeBinding),
+            createScopeReadExpression(info.childScopeBinding, info.tagSection),
             import_compiler34.types.callExpression(import_compiler34.types.identifier(bodySection.name), [scopeIdentifier])
           ])
         )
@@ -7622,7 +7676,7 @@ function writeAttrsToSignals(tag, propTree, importAlias, info) {
       attr.value.extra?.referencedBindings,
       import_compiler34.types.expressionStatement(
         import_compiler34.types.callExpression(attrExportIdentifier, [
-          createScopeReadExpression(info.tagSection, info.childScopeBinding),
+          createScopeReadExpression(info.childScopeBinding, info.tagSection),
           attr.value
         ])
       )
@@ -7655,7 +7709,7 @@ function writeAttrsToSignals(tag, propTree, importAlias, info) {
         referencedBindings,
         import_compiler34.types.expressionStatement(
           import_compiler34.types.callExpression(attrExportIdentifier, [
-            createScopeReadExpression(info.tagSection, info.childScopeBinding),
+            createScopeReadExpression(info.childScopeBinding, info.tagSection),
             getMissingPropValue(name2)
           ])
         )
@@ -7757,9 +7811,13 @@ function trackDomVarReferences(tag, binding) {
   const babelBinding = tag.scope.getBinding(tagVar.name);
   const section = getOrCreateSection(tag);
   if (babelBinding.constantViolations.length) {
-    throw babelBinding.constantViolations[0].buildCodeFrameError(
-      "Tag variables on native elements cannot be assigned to."
-    );
+    for (const ref of babelBinding.constantViolations) {
+      throw ref.type === "MarkoTag" ? ref.get("var").buildCodeFrameError(
+        `Duplicate declaration ${JSON.stringify(binding.name)}`
+      ) : ref.buildCodeFrameError(
+        "Tag variables on native elements cannot be assigned to."
+      );
+    }
   }
   let registerId;
   for (const ref of babelBinding.referencePaths) {
@@ -7931,6 +7989,11 @@ function trackReferencesForBinding(babelBinding, binding) {
     }
   }
   for (const ref of constantViolations) {
+    if (ref.type === "MarkoTag") {
+      throw ref.get("var").buildCodeFrameError(
+        `Duplicate declaration ${JSON.stringify(binding.name)}`
+      );
+    }
     if (isReferenceHoisted(babelBinding.path, ref)) {
       throw ref.buildCodeFrameError("Cannot assign to hoisted tag variable.");
     }
@@ -8678,21 +8741,23 @@ function getAllTagReferenceNodes(tag, referenceNodes = []) {
   }
   return referenceNodes;
 }
-function getScopeAccessorLiteral(binding, includeId) {
+function getScopeAccessorLiteral(binding, encoded, includeId) {
   const canonicalBinding = getCanonicalBinding(binding);
   if (isOptimize()) {
-    return import_compiler35.types.numericLiteral(canonicalBinding.id);
+    return encoded ? import_compiler35.types.numericLiteral(canonicalBinding.id) : import_compiler35.types.stringLiteral(decodeAccessor(canonicalBinding.id));
+  } else if (includeId || canonicalBinding.type === 0 /* dom */) {
+    return import_compiler35.types.stringLiteral(`${canonicalBinding.name}/${canonicalBinding.id}`);
   }
-  return import_compiler35.types.stringLiteral(
-    canonicalBinding.name + (includeId || canonicalBinding.type === 0 /* dom */ ? `/${canonicalBinding.id}` : "")
-  );
+  return import_compiler35.types.stringLiteral(canonicalBinding.name);
 }
-function getScopeAccessor(binding, includeId) {
+function getScopeAccessor(binding, encoded, includeId) {
   const canonicalBinding = getCanonicalBinding(binding);
   if (isOptimize()) {
-    return canonicalBinding.id + "";
+    return encoded ? canonicalBinding.id + "" : decodeAccessor(canonicalBinding.id);
+  } else if (includeId || canonicalBinding.type === 0 /* dom */) {
+    return `${canonicalBinding.name}/${canonicalBinding.id}`;
   }
-  return canonicalBinding.name + (includeId || canonicalBinding.type === 0 /* dom */ ? `/${canonicalBinding.id}` : "");
+  return canonicalBinding.name;
 }
 function getDebugScopeAccess(binding) {
   let root = binding;
@@ -8755,7 +8820,7 @@ function getReadReplacement(node) {
             [getScopeExpression(extra.section, readBinding.section)]
           );
         } else {
-          replacement = createScopeReadExpression(extra.section, readBinding);
+          replacement = createScopeReadExpression(readBinding, extra.section);
         }
       } else {
         if (node.type !== "Identifier") {
@@ -8769,7 +8834,7 @@ function getReadReplacement(node) {
       let curNode = node;
       let curBinding = read.binding;
       let replaceMember;
-      replacement = isOutputDOM() ? createScopeReadExpression(extra.section, read.binding) : import_compiler35.types.identifier(read.binding.name);
+      replacement = isOutputDOM() ? createScopeReadExpression(read.binding, extra.section) : import_compiler35.types.identifier(read.binding.name);
       while (props.length && (curNode.type === "MemberExpression" || curNode.type === "OptionalMemberExpression")) {
         const prop = props.pop();
         const memberProp = getMemberExpressionPropString(curNode);
@@ -9148,7 +9213,7 @@ var await_default = {
         signal.build = () => {
           return callRuntime(
             "_await",
-            getScopeAccessorLiteral(nodeRef),
+            getScopeAccessorLiteral(nodeRef, true),
             import_compiler36.types.identifier(bodySection.name)
           );
         };
@@ -9236,11 +9301,17 @@ var const_default = {
     const binding = trackVarReferences(tag, 5 /* derived */, upstreamAlias);
     if (binding) {
       if (node.var.type === "Identifier") {
-        const assignment = tag.scope.getBinding(node.var.name)?.constantViolations?.[0];
-        if (assignment) {
-          throw assignment.buildCodeFrameError(
-            `${node.var.name} is readonly and cannot be mutated.`
-          );
+        const constantViolations = tag.scope.getBinding(
+          node.var.name
+        )?.constantViolations;
+        if (constantViolations?.length) {
+          for (const assignment of constantViolations) {
+            if (assignment.type !== "MarkoTag") {
+              throw assignment.buildCodeFrameError(
+                `${node.var.name} is readonly and cannot be mutated.`
+              );
+            }
+          }
         }
       }
       if (!valueExtra.nullable) binding.nullable = false;
@@ -9612,11 +9683,7 @@ var html_comment_default = {
             import_compiler43.types.expressionStatement(
               callRuntime(
                 "_text",
-                import_compiler43.types.memberExpression(
-                  scopeIdentifier,
-                  getScopeAccessorLiteral(nodeBinding),
-                  true
-                ),
+                createScopeReadExpression(nodeBinding),
                 textLiteral
               )
             )
@@ -9751,8 +9818,7 @@ var html_script_default = {
       if (isHTML) {
         translateDomVar(tag, nodeBinding);
       }
-      const visitAccessor = nodeBinding && getScopeAccessorLiteral(nodeBinding);
-      if (visitAccessor) {
+      if (nodeBinding) {
         visit(tag, 32 /* Get */);
       }
       write`<script`;
@@ -9778,7 +9844,7 @@ var html_script_default = {
                 import_compiler44.types.expressionStatement(
                   callRuntime(
                     helper,
-                    import_compiler44.types.memberExpression(scopeIdentifier, visitAccessor, true),
+                    createScopeReadExpression(nodeBinding),
                     value
                   )
                 )
@@ -9803,7 +9869,7 @@ var html_script_default = {
                 import_compiler44.types.expressionStatement(
                   callRuntime(
                     "_on",
-                    import_compiler44.types.memberExpression(scopeIdentifier, visitAccessor, true),
+                    createScopeReadExpression(nodeBinding),
                     import_compiler44.types.stringLiteral(getEventHandlerName(name2)),
                     value
                   )
@@ -9817,7 +9883,7 @@ var html_script_default = {
                 import_compiler44.types.expressionStatement(
                   callRuntime(
                     "_attr",
-                    import_compiler44.types.memberExpression(scopeIdentifier, visitAccessor, true),
+                    createScopeReadExpression(nodeBinding),
                     import_compiler44.types.stringLiteral(name2),
                     value
                   )
@@ -9828,6 +9894,7 @@ var html_script_default = {
         }
       }
       if (spreadExpression) {
+        const visitAccessor = getScopeAccessorLiteral(nodeBinding);
         if (isHTML) {
           addHTMLEffectCall(tagSection, tagExtra.referencedBindings);
           if (skipExpression) {
@@ -9905,11 +9972,7 @@ var html_script_default = {
             import_compiler44.types.expressionStatement(
               callRuntime(
                 "_text_content",
-                import_compiler44.types.memberExpression(
-                  scopeIdentifier,
-                  getScopeAccessorLiteral(nodeBinding),
-                  true
-                ),
+                createScopeReadExpression(nodeBinding),
                 textLiteral
               )
             )
@@ -10096,8 +10159,7 @@ var html_style_default = {
       if (isHTML) {
         translateDomVar(tag, nodeBinding);
       }
-      const visitAccessor = nodeBinding && getScopeAccessorLiteral(nodeBinding);
-      if (visitAccessor) {
+      if (nodeBinding) {
         visit(tag, 32 /* Get */);
       }
       write`<style`;
@@ -10123,7 +10185,7 @@ var html_style_default = {
                 import_compiler45.types.expressionStatement(
                   callRuntime(
                     helper,
-                    import_compiler45.types.memberExpression(scopeIdentifier, visitAccessor, true),
+                    createScopeReadExpression(nodeBinding),
                     value
                   )
                 )
@@ -10148,7 +10210,7 @@ var html_style_default = {
                 import_compiler45.types.expressionStatement(
                   callRuntime(
                     "_on",
-                    import_compiler45.types.memberExpression(scopeIdentifier, visitAccessor, true),
+                    createScopeReadExpression(nodeBinding),
                     import_compiler45.types.stringLiteral(getEventHandlerName(name2)),
                     value
                   )
@@ -10162,7 +10224,7 @@ var html_style_default = {
                 import_compiler45.types.expressionStatement(
                   callRuntime(
                     "_attr",
-                    import_compiler45.types.memberExpression(scopeIdentifier, visitAccessor, true),
+                    createScopeReadExpression(nodeBinding),
                     import_compiler45.types.stringLiteral(name2),
                     value
                   )
@@ -10173,6 +10235,7 @@ var html_style_default = {
         }
       }
       if (spreadExpression) {
+        const visitAccessor = nodeBinding && getScopeAccessorLiteral(nodeBinding);
         if (isHTML) {
           addHTMLEffectCall(tagSection, tagExtra.referencedBindings);
           if (skipExpression) {
@@ -10250,11 +10313,7 @@ var html_style_default = {
             import_compiler45.types.expressionStatement(
               callRuntime(
                 "_text_content",
-                import_compiler45.types.memberExpression(
-                  scopeIdentifier,
-                  getScopeAccessorLiteral(nodeBinding),
-                  true
-                ),
+                createScopeReadExpression(nodeBinding),
                 textLiteral
               )
             )
@@ -10621,7 +10680,7 @@ var IfTag = {
               setClosureSignalBuilder(branchTag, (_closure, render) => {
                 return callRuntime(
                   "_if_closure",
-                  getScopeAccessorLiteral(nodeRef),
+                  getScopeAccessorLiteral(nodeRef, true),
                   import_compiler48.types.numericLiteral(i),
                   render
                 );
@@ -10634,7 +10693,7 @@ var IfTag = {
           signal.build = () => {
             return callRuntime(
               "_if",
-              getScopeAccessorLiteral(nodeRef),
+              getScopeAccessorLiteral(nodeRef, true),
               ...rendererIdentifiers.reverse()
             );
           };
@@ -10694,7 +10753,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 +10793,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) {
@@ -10973,7 +11032,7 @@ var lifecycle_default = {
             callRuntime(
               "_lifecycle",
               scopeIdentifier,
-              getScopeAccessorLiteral(lifecycleAttrsRef),
+              getScopeAccessorLiteral(lifecycleAttrsRef, true),
               propsToExpression(translatedAttrs.properties)
             )
           )
@@ -11506,7 +11565,7 @@ var try_default = {
         signal.build = () => {
           return callRuntime(
             "_try",
-            getScopeAccessorLiteral(nodeRef),
+            getScopeAccessorLiteral(nodeRef, true),
             import_compiler57.types.identifier(bodySection.name)
           );
         };
@@ -11742,11 +11801,7 @@ var placeholder_default = {
             import_compiler59.types.expressionStatement(
               method === "_text" ? callRuntime(
                 "_text",
-                import_compiler59.types.memberExpression(
-                  scopeIdentifier,
-                  getScopeAccessorLiteral(nodeBinding),
-                  true
-                ),
+                createScopeReadExpression(nodeBinding),
                 value
               ) : callRuntime(
                 "_html",
@@ -12102,7 +12157,7 @@ function translateDOM(tag) {
           void 0,
           import_compiler62.types.expressionStatement(
             import_compiler62.types.callExpression(import_compiler62.types.identifier(childExports.setup), [
-              createScopeReadExpression(section, childBinding)
+              createScopeReadExpression(childBinding, section)
             ])
           )
         );
@@ -12133,7 +12188,7 @@ function translateDOM(tag) {
                 childExports.setup,
                 tagName
               ),
-              [createScopeReadExpression(section, childBinding)]
+              [createScopeReadExpression(childBinding, section)]
             )
           )
         );
@@ -12188,6 +12243,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) {
@@ -12277,7 +12333,7 @@ var dynamic_tag_default = {
                     import_compiler63.types.callExpression(
                       import_compiler63.types.memberExpression(signal.identifier, import_compiler63.types.identifier("_")),
                       [
-                        createScopeReadExpression(section, childBinding),
+                        createScopeReadExpression(childBinding, section),
                         getScopeExpression(section, definedBodySection.parent)
                       ]
                     )
@@ -12459,7 +12515,7 @@ var dynamic_tag_default = {
         signal.build = () => {
           return callRuntime(
             "_dynamic_tag",
-            getScopeAccessorLiteral(nodeBinding),
+            getScopeAccessorLiteral(nodeBinding, true),
             bodySection && import_compiler63.types.identifier(bodySection.name),
             tagVarSignal ? import_compiler63.types.arrowFunctionExpression([], tagVarSignal.identifier) : void 0,
             hasTagArgs && import_compiler63.types.numericLiteral(1)
@@ -12478,12 +12534,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 +12620,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 +12631,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 +12652,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;