@marko/translator-default 5.31.13 → 5.31.15

package/dist/index.js

@@ -472,10 +472,9 @@ function getRuntimeEntryFiles(output, optimize) {
   `${base}runtime/helpers/assign.js`,
   `${base}runtime/helpers/class-value.js`,
   `${base}runtime/helpers/dynamic-tag.js`,
-  `${base}runtime/helpers/load-nested-tag.js`,
+  `${base}runtime/helpers/attr-tag.js`,
   `${base}runtime/helpers/merge.js`,
   `${base}runtime/helpers/repeatable.js`,
-  `${base}runtime/helpers/self-iterator.js`,
   `${base}runtime/helpers/render-tag.js`,
   `${base}runtime/helpers/style-value.js`,
   `${base}runtime/helpers/to-string.js`,
@@ -505,9 +504,7 @@ function getRuntimeEntryFiles(output, optimize) {
   `${base}runtime/vdom/index.js`,
   `${base}runtime/vdom/hot-reload.js`,
   `${base}runtime/vdom/helpers/attrs.js`,
-  `${base}runtime/vdom/helpers/const.js`,
-  `${base}runtime/vdom/helpers/v-element.js`,
-  `${base}runtime/vdom/helpers/v-text.js`,
+  `${base}runtime/vdom/helpers/const-element.js`,
   `${base}runtime/vdom/preserve-attrs.js`])];
 
 

package/dist/tag/attribute-tag.js

@@ -1,4 +1,5 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.default = _default;var _babelUtils = require("@marko/babel-utils");
+"use strict";exports.__esModule = true;exports.analyzeAttributeTags = analyzeAttributeTags;exports.default = translateAttributeTag;var _babelUtils = require("@marko/babel-utils");
+
 
 
 
@@ -7,182 +8,179 @@
 
 
 var _compiler = require("@marko/compiler");
-var _withPreviousLocation = _interopRequireDefault(require("../util/with-previous-location"));
 var _util = require("./util");
 
-const EMPTY_OBJECT = {};
-const parentIdentifierLookup = new WeakMap();
-
-// TODO: optimize inline repeated @tags.
-
-function _default(tag) {
-  const { node } = tag;
-  const namePath = tag.get("name");
-  const tagName = namePath.node.value;
-  const parentPath = (0, _babelUtils.findParentTag)(tag);
-
-  (0, _babelUtils.assertNoArgs)(tag);
-
-  if (!parentPath) {
-    throw namePath.buildCodeFrameError(
-      "@tags must be nested within another element."
-    );
-  }
+const contentTypeCache = new WeakMap();
+const ContentType = {
+  attribute: 0,
+  render: 1,
+  mixed: 2
+};
+
+function analyzeAttributeTags(rootTag) {
+  const visit = [rootTag];
+  const parentTags = [rootTag];
+  let i = 0;
+  let attributeTags;
+
+  while (i < visit.length) {
+    const tag = visit[i++];
+    for (const child of tag.get("body").get("body")) {
+      if ((0, _babelUtils.isAttributeTag)(child)) {
+        (0, _babelUtils.assertNoArgs)(child);
+        const tagDef = (0, _babelUtils.getTagDef)(child) || {};
+        const name = (0, _babelUtils.getFullyResolvedTagName)(child);
+        let {
+          targetProperty = child.node.name.value.slice(1),
+          isRepeated = false
+        } = tagDef;
+
+        const preserveName =
+        tagDef.preserveName === true || tagDef.removeDashes === false;
+
+        if (!preserveName) {
+          targetProperty = removeDashes(targetProperty);
+        }
 
-  const parentAttributes = parentPath.get("attributes");
-  const tagDef = (0, _babelUtils.getTagDef)(tag);
-  const { isRepeated, targetProperty = tagName.slice(1) } =
-  tagDef || EMPTY_OBJECT;
-  const isDynamic = isRepeated || parentPath !== tag.parentPath.parentPath;
-  parentPath.node.exampleAttributeTag = node;
-
-  if (isDynamic) {
-    if (!parentPath.node.hasDynamicAttrTags) {
-      const body = parentPath.get("body").get("body");
-      parentPath.node.hasDynamicAttrTags = true;
-
-      for (let i = body.length; i--;) {
-        const child = body[i];
-        if (isAttributeTagChild(child)) {
-          child.insertAfter(_compiler.types.stringLiteral("END_ATTRIBUTE_TAGS"));
-          break;
+        const attrTagMeta = (attributeTags ||= {})[name] ||= {
+          targetProperty,
+          isRepeated
+        };
+
+        (child.node.extra ||= {}).attributeTag = attrTagMeta;
+
+        const parentTag = (0, _babelUtils.findParentTag)(child);
+        const parentTagExtra = parentTag.node.extra ||= {};
+        parentTagExtra.hasAttributeTags = true;
+        parentTags.push(child);
+        visit.push(child);
+      } else if ((0, _babelUtils.isTransparentTag)(child)) {
+        switch (getContentType(child)) {
+          case ContentType.mixed:
+            throw child.buildCodeFrameError(
+              "Cannot mix @tags with other content when under a control flow."
+            );
+          case ContentType.attribute:
+            visit.push(child);
+            break;
+          case ContentType.render:
+            break;
         }
       }
     }
-  } else {
-    const previousAttr = parentAttributes.find(
-      (attr) => attr.get("name").node === targetProperty
-    );
-
-    if (previousAttr) {
-      const previousValue = previousAttr.get("value").node;
-      if (_compiler.types.isObjectExpression(previousValue)) {
-        previousAttr.set(
-          "value",
-          _compiler.types.arrayExpression([previousValue, getAttrTagObject(tag)])
-        );
-      } else if (_compiler.types.isArrayExpression(previousAttr)) {
-        previousAttr.elements.push(getAttrTagObject(tag));
-      } else {
-        previousAttr.set(
-          "value",
-          _compiler.types.callExpression(
-            (0, _babelUtils.importDefault)(
-              tag.hub.file,
-              "marko/src/runtime/helpers/repeatable.js",
-              "marko_repeatable"
-            ),
-            [previousValue, getAttrTagObject(tag)]
-          )
-        );
-      }
-    } else {
-      parentPath.pushContainer(
-        "attributes",
-        _compiler.types.markoAttribute(targetProperty, getAttrTagObject(tag))
-      );
-    }
-
-    tag.remove();
-    return;
   }
 
-  let identifiers = parentIdentifierLookup.get(parentPath);
+  if (attributeTags) {
+    (rootTag.node.extra ??= {}).attributeTags = attributeTags;
+
+    for (const parentTag of parentTags) {
+      if (getContentType(parentTag) === ContentType.mixed) {
+        // move all non scriptlet / attribute tag children to the end of the renderbody
+        const renderBody = [
+        _compiler.types.expressionStatement(_compiler.types.stringLiteral("END_ATTRIBUTE_TAGS"))];
+
+        const body = parentTag.get("body");
+        for (const child of body.get("body")) {
+          if (
+          child.isMarkoScriptlet() ||
+          (0, _babelUtils.isAttributeTag)(child) ||
+          (0, _babelUtils.isTransparentTag)(child) &&
+          getContentType(child) === ContentType.attribute)
+          {
+            continue;
+          }
+
+          renderBody.push(child.node);
+          child.remove();
+        }
 
-  if (!identifiers) {
-    parentIdentifierLookup.set(parentPath, identifiers = {});
+        body.node.body = body.node.body.concat(renderBody);
+      }
+    }
   }
+}
 
-  let identifier = identifiers[targetProperty];
-
-  if (!identifier) {
-    identifier = identifiers[targetProperty] =
-    tag.scope.generateUidIdentifier(targetProperty);
-    parentPath.
-    get("body").
-    unshiftContainer(
-      "body",
-      _compiler.types.variableDeclaration(isRepeated ? "const" : "let", [
-      _compiler.types.variableDeclarator(
-        identifier,
-        isRepeated ? _compiler.types.arrayExpression([]) : _compiler.types.nullLiteral()
-      )]
-      )
-    );
-    parentPath.pushContainer(
-      "attributes",
-      _compiler.types.markoAttribute(targetProperty, identifier)
-    );
+function translateAttributeTag(tag) {
+  const { node } = tag;
+  const meta = node.extra?.attributeTag;
+  if (!meta) {
+    throw tag.
+    get("name").
+    buildCodeFrameError("@tags must be nested within another element.");
   }
 
-  if (isRepeated) {
-    tag.replaceWith(
-      (0, _withPreviousLocation.default)(
-        _compiler.types.expressionStatement(
-          _compiler.types.callExpression(
-            _compiler.types.memberExpression(identifier, _compiler.types.identifier("push")),
-            [getAttrTagObject(tag)]
-          )
-        ),
-        node
-      )
-    );
-  } else {
-    tag.replaceWith(
-      (0, _withPreviousLocation.default)(
-        _compiler.types.expressionStatement(
-          _compiler.types.assignmentExpression(
-            "=",
-            identifier,
-            _compiler.types.callExpression(
-              (0, _babelUtils.importDefault)(
-                tag.hub.file,
-                "marko/src/runtime/helpers/repeatable.js",
-                "marko_repeatable"
-              ),
-              [identifier, getAttrTagObject(tag)]
-            )
-          )
+  (0, _babelUtils.assertNoArgs)(tag);
+
+  tag.replaceWith(
+    _compiler.types.expressionStatement(
+      _compiler.types.callExpression(
+        (0, _babelUtils.importNamed)(
+          tag.hub.file,
+          "marko/src/runtime/helpers/attr-tag.js",
+          meta.isRepeated ? "r" : "a",
+          meta.isRepeated ?
+          "marko_repeated_attr_tag" :
+          "marko_repeatable_attr_tag"
         ),
-        node
+        [_compiler.types.stringLiteral(meta.targetProperty), getAttrTagObject(tag)]
       )
-    );
-  }
+    )
+  );
 }
 
 function getAttrTagObject(tag) {
   const attrs = (0, _util.getAttrs)(tag);
-  const iteratorProp = _compiler.types.objectProperty(
-    _compiler.types.memberExpression(_compiler.types.identifier("Symbol"), _compiler.types.identifier("iterator")),
-    (0, _babelUtils.importDefault)(
-      tag.hub.file,
-      "marko/src/runtime/helpers/self-iterator.js",
-      "marko_self_iterator"
-    ),
-    true
-  );
 
   if (_compiler.types.isNullLiteral(attrs)) {
-    return _compiler.types.objectExpression([iteratorProp]);
-  }
-
-  if (_compiler.types.isObjectExpression(attrs)) {
-    attrs.properties.push(iteratorProp);
-    return attrs;
+    return _compiler.types.objectExpression([]);
   }
 
-  return _compiler.types.objectExpression([iteratorProp, _compiler.types.spreadElement(attrs)]);
+  return attrs;
 }
 
-function isAttributeTagChild(tag) {
-  if ((0, _babelUtils.isAttributeTag)(tag)) {
-    return true;
-  }
+function getContentType(tag) {
+  const { node } = tag;
+  const cached = contentTypeCache.get(node);
+  if (cached !== undefined) return cached;
+
+  const body = tag.get("body").get("body");
+  let hasAttributeTag = false;
+  let hasRenderBody = false;
+
+  for (const child of body) {
+    if ((0, _babelUtils.isAttributeTag)(child)) {
+      hasAttributeTag = true;
+    } else if ((0, _babelUtils.isTransparentTag)(child)) {
+      switch (getContentType(child)) {
+        case ContentType.mixed:
+          contentTypeCache.set(node, ContentType.mixed);
+          return ContentType.mixed;
+        case ContentType.attribute:
+          hasAttributeTag = true;
+          break;
+        case ContentType.render:
+          hasRenderBody = true;
+          break;
+      }
+    } else if (!child.isMarkoScriptlet()) {
+      hasRenderBody = true;
+    }
 
-  if ((0, _babelUtils.isTransparentTag)(tag)) {
-    const body = tag.get("body").get("body");
-    return isAttributeTagChild(body[body.length - 1]);
+    if (hasAttributeTag && hasRenderBody) {
+      contentTypeCache.set(node, ContentType.mixed);
+      return ContentType.mixed;
+    }
   }
 
-  return false;
+  const result = hasAttributeTag ? ContentType.attribute : ContentType.render;
+  contentTypeCache.set(node, result);
+  return result;
+}
+
+function removeDashes(str) {
+  return str.replace(/-([a-z])/g, matchToUpperCase);
+}
+
+function matchToUpperCase(_match, lower) {
+  return lower.toUpperCase();
 }

package/dist/tag/index.js

@@ -13,11 +13,11 @@ var _keyManager = require("../util/key-manager");
 var _optimizeVdomCreate = require("../util/optimize-vdom-create");
 var _pluginHooks = require("../util/plugin-hooks");
 var _attribute = _interopRequireDefault(require("./attribute"));
-var _attributeTag = _interopRequireDefault(require("./attribute-tag"));
+var _attributeTag = _interopRequireWildcard(require("./attribute-tag"));
 var _customTag = _interopRequireDefault(require("./custom-tag"));
 var _dynamicTag = _interopRequireDefault(require("./dynamic-tag"));
 var _macroTag = _interopRequireDefault(require("./macro-tag"));
-var _nativeTag = _interopRequireDefault(require("./native-tag"));var _default = exports.default =
+var _nativeTag = _interopRequireDefault(require("./native-tag"));function _getRequireWildcardCache(e) {if ("function" != typeof WeakMap) return null;var r = new WeakMap(),t = new WeakMap();return (_getRequireWildcardCache = function (e) {return e ? t : r;})(e);}function _interopRequireWildcard(e, r) {if (!r && e && e.__esModule) return e;if (null === e || "object" != typeof e && "function" != typeof e) return { default: e };var t = _getRequireWildcardCache(r);if (t && t.has(e)) return t.get(e);var n = { __proto__: null },a = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) {var i = a ? Object.getOwnPropertyDescriptor(e, u) : null;i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u];}return n.default = e, t && t.set(e, n), n;}var _default = exports.default =
 
 {
   enter(path) {
@@ -54,6 +54,10 @@ var _nativeTag = _interopRequireDefault(require("./native-tag"));var _default =
     }
 
     if (!(0, _babelUtils.isAttributeTag)(path)) {
+      if ((0, _babelUtils.isDynamicTag)(path) || !((0, _babelUtils.isMacroTag)(path) || (0, _babelUtils.isNativeTag)(path))) {
+        (0, _attributeTag.analyzeAttributeTags)(path);
+      }
+
       (0, _keyManager.getKeyManager)(path).resolveKey(path);
     }
 

package/dist/tag/native-tag[vdom]/index.js

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.default = _default;exports.tagArguments = tagArguments;var _babelUtils = require("@marko/babel-utils");
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.default = _default;var _babelUtils = require("@marko/babel-utils");
 var _compiler = require("@marko/compiler");
 var FLAGS = _interopRequireWildcard(require("../../util/runtime-flags"));
 var _vdomOutWrite = _interopRequireDefault(require("../../util/vdom-out-write"));
@@ -7,7 +7,85 @@ var _attributes = _interopRequireDefault(require("./attributes"));function _getR
 
 const SIMPLE_ATTRS = ["id", "class", "style"];
 
-function tagArguments(path, isStatic) {
+/**
+ * Translates the html streaming version of a standard html element.
+ */
+function _default(path, isNullable) {
+  const { node } = path;
+  const {
+    name,
+    key,
+    body: { body }
+  } = node;
+
+  const isEmpty = !body.length;
+  const writeArgs = tagArguments(path, false);
+  let writeStartNode = (0, _withPreviousLocation.default)(
+    (0, _vdomOutWrite.default)(isEmpty ? "e" : "be", ...writeArgs),
+    node.name
+  );
+
+  if (isNullable) {
+    writeStartNode = _compiler.types.ifStatement(
+      name,
+      writeStartNode,
+      _compiler.types.expressionStatement(
+        _compiler.types.callExpression(
+          _compiler.types.memberExpression(_compiler.types.identifier("out"), _compiler.types.identifier("bf")),
+          [
+          (0, _babelUtils.normalizeTemplateString)`f_${key}`,
+          path.hub.file._componentInstanceIdentifier]
+
+        )
+      )
+    );
+  }
+
+  if (isEmpty) {
+    path.replaceWith(writeStartNode);
+    return;
+  }
+
+  let writeEndNode = (0, _vdomOutWrite.default)("ee");
+  if (isNullable) {
+    writeEndNode = _compiler.types.ifStatement(
+      name,
+      writeEndNode,
+      _compiler.types.expressionStatement(
+        _compiler.types.callExpression(
+          _compiler.types.memberExpression(_compiler.types.identifier("out"), _compiler.types.identifier("ef")),
+          []
+        )
+      )
+    );
+  }
+
+  let needsBlock;
+  for (const childNode of body) {
+    if (_compiler.types.isVariableDeclaration(childNode)) {
+      if (childNode.kind === "const" || childNode.kind === "let") {
+        needsBlock = true;
+        break;
+      }
+    }
+  }
+
+  path.replaceWithMultiple(
+    [writeStartNode].
+    concat(needsBlock ? _compiler.types.blockStatement(body) : body).
+    concat(writeEndNode)
+  );
+}
+
+function isPropertyName({ key }, names) {
+  if (_compiler.types.isStringLiteral(key)) {
+    return names.includes(key.value);
+  } else if (_compiler.types.isIdentifier(key)) {
+    return names.includes(key.name);
+  }
+}
+
+function tagArguments(path) {
   const {
     hub: { file },
     node
@@ -29,13 +107,9 @@ function tagArguments(path, isStatic) {
   const writeArgs = [
   name,
   attrsObj,
-  !key && isStatic ? _compiler.types.nullLiteral() : key,
-  isStatic ? _compiler.types.nullLiteral() : file._componentInstanceIdentifier,
-  isStatic ?
-  _compiler.types.numericLiteral(body.length) :
-  body.length ?
-  _compiler.types.nullLiteral() :
-  _compiler.types.numericLiteral(0)];
+  key,
+  file._componentInstanceIdentifier,
+  body.length ? _compiler.types.nullLiteral() : _compiler.types.numericLiteral(0)];
 
 
   if (node.preserveAttrs) {
@@ -101,82 +175,4 @@ function tagArguments(path, isStatic) {
     writeArgs.push(_compiler.types.objectExpression(tagProperties));
   }
   return writeArgs;
-}
-
-/**
- * Translates the html streaming version of a standard html element.
- */
-function _default(path, isNullable) {
-  const { node } = path;
-  const {
-    name,
-    key,
-    body: { body }
-  } = node;
-
-  const isEmpty = !body.length;
-  const writeArgs = tagArguments(path, false);
-  let writeStartNode = (0, _withPreviousLocation.default)(
-    (0, _vdomOutWrite.default)(isEmpty ? "e" : "be", ...writeArgs),
-    node.name
-  );
-
-  if (isNullable) {
-    writeStartNode = _compiler.types.ifStatement(
-      name,
-      writeStartNode,
-      _compiler.types.expressionStatement(
-        _compiler.types.callExpression(
-          _compiler.types.memberExpression(_compiler.types.identifier("out"), _compiler.types.identifier("bf")),
-          [
-          (0, _babelUtils.normalizeTemplateString)`f_${key}`,
-          path.hub.file._componentInstanceIdentifier]
-
-        )
-      )
-    );
-  }
-
-  if (isEmpty) {
-    path.replaceWith(writeStartNode);
-    return;
-  }
-
-  let writeEndNode = (0, _vdomOutWrite.default)("ee");
-  if (isNullable) {
-    writeEndNode = _compiler.types.ifStatement(
-      name,
-      writeEndNode,
-      _compiler.types.expressionStatement(
-        _compiler.types.callExpression(
-          _compiler.types.memberExpression(_compiler.types.identifier("out"), _compiler.types.identifier("ef")),
-          []
-        )
-      )
-    );
-  }
-
-  let needsBlock;
-  for (const childNode of body) {
-    if (_compiler.types.isVariableDeclaration(childNode)) {
-      if (childNode.kind === "const" || childNode.kind === "let") {
-        needsBlock = true;
-        break;
-      }
-    }
-  }
-
-  path.replaceWithMultiple(
-    [writeStartNode].
-    concat(needsBlock ? _compiler.types.blockStatement(body) : body).
-    concat(writeEndNode)
-  );
-}
-
-function isPropertyName({ key }, names) {
-  if (_compiler.types.isStringLiteral(key)) {
-    return names.includes(key.value);
-  } else if (_compiler.types.isIdentifier(key)) {
-    return names.includes(key.name);
-  }
 }

package/dist/tag/util.js

@@ -3,12 +3,12 @@ var _compiler = require("@marko/compiler");
 var _classValue = _interopRequireDefault(require("marko/src/runtime/helpers/class-value"));
 var _styleValue = _interopRequireDefault(require("marko/src/runtime/helpers/style-value"));
 
-function getAttrs(path, preserveNames, skipRenderBody) {
+function getAttrs(path, preserveNames) {
   const { node } = path;
   const {
+    extra,
     attributes,
-    body: { body, params },
-    hasDynamicAttrTags
+    body: { body, params }
   } = node;
   const attrsLen = attributes.length;
   const childLen = body.length;
@@ -16,6 +16,7 @@ function getAttrs(path, preserveNames, skipRenderBody) {
   const targetObjects = {};
   const tagDef = (0, _babelUtils.getTagDef)(path);
   const foundProperties = {};
+  const hasAttributeTags = extra?.hasAttributeTags;
 
   for (let i = 0; i < attrsLen; i++) {
     const { name, value } = attributes[i];
@@ -69,34 +70,16 @@ function getAttrs(path, preserveNames, skipRenderBody) {
     }
   }
 
-  if (!skipRenderBody && childLen) {
-    let endDynamicAttrTagsIndex = -1;
-
-    if (hasDynamicAttrTags) {
-      endDynamicAttrTagsIndex = findLastIndex(
-        body,
-        ({ value }) => value === "END_ATTRIBUTE_TAGS"
-      );
-      path.
-      insertBefore(body.slice(0, endDynamicAttrTagsIndex)).
-      map((child) => child.skip());
-    }
-
-    if (!hasDynamicAttrTags || endDynamicAttrTagsIndex !== childLen - 1) {
-      properties.push(
-        _compiler.types.objectProperty(
-          _compiler.types.stringLiteral("renderBody"),
-          _compiler.types.arrowFunctionExpression(
-            [_compiler.types.identifier("out"), ...params],
-            _compiler.types.blockStatement(
-              hasDynamicAttrTags ?
-              body.slice(endDynamicAttrTagsIndex + 1) :
-              body
-            )
-          )
+  if (childLen && !hasAttributeTags) {
+    properties.push(
+      _compiler.types.objectProperty(
+        _compiler.types.stringLiteral("renderBody"),
+        _compiler.types.arrowFunctionExpression(
+          [_compiler.types.identifier("out"), ...params],
+          _compiler.types.blockStatement(body)
         )
-      );
-    }
+      )
+    );
   }
 
   // Default parameters
@@ -121,15 +104,55 @@ function getAttrs(path, preserveNames, skipRenderBody) {
     }
   });
 
-  if (properties.length === 0) {
-    return _compiler.types.nullLiteral();
-  }
+  let attrsObject =
+  properties.length === 0 ?
+  _compiler.types.nullLiteral() :
+  !hasAttributeTags &&
+  properties.length === 1 &&
+  _compiler.types.isSpreadElement(properties[0]) ?
+  properties[0].argument :
+  _compiler.types.objectExpression(properties);
+
+  if (hasAttributeTags) {
+    const endAttributeTagsIndex = findLastIndex(
+      body,
+      (node) =>
+      _compiler.types.isExpressionStatement(node) &&
+      _compiler.types.isStringLiteral(node.expression) &&
+      node.expression.value === "END_ATTRIBUTE_TAGS"
+    );
+
+    let attrTagBody = body;
+
+    if (endAttributeTagsIndex !== -1) {
+      attrTagBody = body.slice(0, endAttributeTagsIndex);
+      attrTagBody.push(
+        _compiler.types.returnStatement(
+          _compiler.types.arrowFunctionExpression(
+            [_compiler.types.identifier("out"), ...params],
+            _compiler.types.blockStatement(body.slice(endAttributeTagsIndex + 1))
+          )
+        )
+      );
+    }
 
-  if (properties.length === 1 && _compiler.types.isSpreadElement(properties[0])) {
-    return properties[0].argument;
+    const attrTagFn = _compiler.types.arrowFunctionExpression(
+      [],
+      _compiler.types.blockStatement(attrTagBody)
+    );
+
+    attrsObject = _compiler.types.callExpression(
+      (0, _babelUtils.importNamed)(
+        path.hub.file,
+        "marko/src/runtime/helpers/attr-tag.js",
+        "i",
+        "marko_render_input"
+      ),
+      properties.length === 0 ? [attrTagFn] : [attrTagFn, attrsObject]
+    );
   }
 
-  return _compiler.types.objectExpression(properties);
+  return attrsObject;
 }
 
 function buildEventHandlerArray(path) {
@@ -207,6 +230,8 @@ function findLastIndex(arr, check) {
       return i;
     }
   }
+
+  return -1;
 }
 
 function mergeSpread(properties, value) {

package/dist/util/optimize-vdom-create.js

@@ -7,7 +7,7 @@
 
 var _compiler = require("@marko/compiler");
 var _he = require("he");
-var _nativeTagVdom = require("../tag/native-tag[vdom]");
+var _attributes = _interopRequireDefault(require("../tag/native-tag[vdom]/attributes"));
 var _keyManager = require("./key-manager");
 var _vdomOutWrite = _interopRequireDefault(require("./vdom-out-write"));
 
@@ -40,10 +40,9 @@ const mergeStaticCreateVisitor = {
   },
   MarkoTag(path, state) {
     (0, _keyManager.getKeyManager)(path).resolveKey(path);
-    const writeArgs = (0, _nativeTagVdom.tagArguments)(path, true);
     state.currentRoot = _compiler.types.callExpression(
       _compiler.types.memberExpression(state.currentRoot, _compiler.types.identifier("e")),
-      writeArgs
+      getConstElementArgs(path)
     );
   }
 };
@@ -70,7 +69,8 @@ const analyzeStaticVisitor = {
       let isStatic =
       (0, _babelUtils.isNativeTag)(path) &&
       !path.node.body.params.length &&
-      !path.node.arguments;
+      !path.node.arguments &&
+      !(0, _keyManager.hasUserKey)(path);
 
       const tagDef = (0, _babelUtils.getTagDef)(path);
       isStatic = isStatic && !tagDef.translator;
@@ -118,15 +118,14 @@ function optimizeStaticVDOM(path) {
   }
 
   const identifier = path.scope.generateUidIdentifier("marko_node");
-  const writeArgs = (0, _nativeTagVdom.tagArguments)(path, true);
   const state = {
     currentRoot: _compiler.types.callExpression(
       (0, _babelUtils.importDefault)(
         file,
-        "marko/src/runtime/vdom/helpers/v-element.js",
-        "marko_createElement"
+        "marko/src/runtime/vdom/helpers/const-element.js",
+        "marko_constElement"
       ),
-      writeArgs
+      getConstElementArgs(path)
     )
   };
 
@@ -148,4 +147,13 @@ function analyzeStaticVDOM(path) {
 
 function shouldRun(markoOpts) {
   return markoOpts.optimize && markoOpts.output !== "html";
+}
+
+function getConstElementArgs(path) {
+  const { node } = path;
+  return [
+  node.name,
+  (0, _attributes.default)(path, path.get("attributes")),
+  _compiler.types.numericLiteral(node.body.body.length)];
+
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marko/translator-default",
-  "version": "5.31.13",
+  "version": "5.31.15",
   "description": "Translates Marko templates to the default Marko runtime.",
   "keywords": [
     "babel",
@@ -34,8 +34,8 @@
     "self-closing-tags": "^1.0.1"
   },
   "devDependencies": {
-    "@marko/compiler": "^5.34.6",
-    "marko": "^5.32.7"
+    "@marko/compiler": "^5.34.7",
+    "marko": "^5.32.10"
   },
   "peerDependencies": {
     "@marko/compiler": "^5.16.1",