@vue-jsx-vapor/compiler 2.1.0 → 2.1.1

package/dist/index.cjs

@@ -268,17 +268,25 @@ function resolveNode(node, context) {
   const props = node.openingElement.attributes.reduce(
     (result, attr) => {
       if (attr.type === "JSXAttribute") {
-        if (tagType === _compilerdom.ElementTypes.COMPONENT) {
-          result.push(resolveDirectiveNode(attr, context));
-        } else {
-          result.push({
+        result.push(
+          _optionalChain([attr, 'access', _9 => _9.value, 'optionalAccess', _10 => _10.type]) === "StringLiteral" ? {
             type: _compilerdom.NodeTypes.ATTRIBUTE,
             name: String(attr.name.name),
             nameLoc: resolveLocation(attr.name.loc, context),
             value: resolveValue(attr.value, context),
             loc: resolveLocation(attr.loc, context)
-          });
-        }
+          } : resolveDirectiveNode(attr, context)
+        );
+      } else if (attr.type === "JSXSpreadAttribute") {
+        result.push({
+          type: _compilerdom.NodeTypes.DIRECTIVE,
+          name: "bind",
+          rawName: getText(attr, context),
+          exp: resolveExpression(attr.argument, context),
+          arg: void 0,
+          loc: resolveLocation(node.loc, context),
+          modifiers: []
+        });
       }
       return result;
     },
@@ -300,34 +308,35 @@ var namespaceRE = /^(?:\$([\w-]+)\$)?([\w-]+)?/;
 function resolveDirectiveNode(node, context, withFn = false) {
   const { value, name } = node;
   let nameString = name.type === "JSXNamespacedName" ? name.namespace.name : name.type === "JSXIdentifier" ? name.name : "";
-  let argString = name.type === "JSXNamespacedName" ? name.name.name : "";
-  if (name.type !== "JSXNamespacedName" && !argString) {
-    const [newName, modifiers2] = nameString.split("_");
-    nameString = newName;
-    argString = `_${modifiers2}`;
-  }
+  const isDirective = nameString.startsWith("v-");
   let modifiers = [];
   let isStatic = true;
-  const result = argString.match(namespaceRE);
-  if (result) {
-    let modifierString = "";
-    [, argString, modifierString] = result;
-    if (argString) {
-      argString = argString.replaceAll("_", ".");
-      isStatic = false;
-      if (modifierString && modifierString.startsWith("_"))
-        modifiers = modifierString.slice(1).split("_");
-    } else if (modifierString) {
-      ;
-      [argString, ...modifiers] = modifierString.split("_");
+  let argString = name.type === "JSXNamespacedName" ? name.name.name : "";
+  if (name.type !== "JSXNamespacedName" && !argString) {
+    ;
+    [nameString, ...modifiers] = nameString.split("_");
+  } else {
+    const result = argString.match(namespaceRE);
+    if (result) {
+      let modifierString = "";
+      [, argString, modifierString] = result;
+      if (argString) {
+        argString = argString.replaceAll("_", ".");
+        isStatic = false;
+        if (modifierString && modifierString.startsWith("_"))
+          modifiers = modifierString.slice(1).split("_");
+      } else if (modifierString) {
+        ;
+        [argString, ...modifiers] = modifierString.split("_");
+      }
     }
   }
-  const arg = argString && name.type === "JSXNamespacedName" ? resolveSimpleExpression(argString, isStatic, name.name.loc) : void 0;
+  const arg = isDirective ? argString && name.type === "JSXNamespacedName" ? resolveSimpleExpression(argString, isStatic, name.name.loc) : void 0 : resolveSimpleExpression(nameString, true, name.loc);
   const exp = value ? withFn && value.type === "JSXExpressionContainer" ? resolveExpressionWithFn(value.expression, context) : resolveExpression(value, context) : void 0;
   return {
     type: _compilerdom.NodeTypes.DIRECTIVE,
-    name: nameString.slice(2),
-    rawName: `${nameString}:${argString}`,
+    name: isDirective ? nameString.slice(2) : "bind",
+    rawName: getText(name, context),
     exp,
     arg,
     loc: resolveLocation(node.loc, context),
@@ -356,7 +365,7 @@ function isJSXComponent(node) {
   }
 }
 function findProp(expression, key) {
-  if (_optionalChain([expression, 'optionalAccess', _9 => _9.type]) === "JSXElement") {
+  if (_optionalChain([expression, 'optionalAccess', _11 => _11.type]) === "JSXElement") {
     for (const attr of expression.openingElement.attributes) {
       const name = attr.type === "JSXAttribute" && (attr.name.type === "JSXIdentifier" ? attr.name.name : attr.name.type === "JSXNamespacedName" ? attr.name.namespace.name : "").split("_")[0];
       if (name && (_shared.isString.call(void 0, key) ? name === key : key.test(name))) {
@@ -636,6 +645,7 @@ function processDynamicChildren(context) {
           const anchor = prevDynamics[0].anchor = context.increaseId();
           registerInsertion(prevDynamics, context, anchor);
         } else {
+          prevDynamics[0].flags -= 2 /* NON_TEMPLATE */;
           registerInsertion(
             prevDynamics,
             context,
@@ -649,15 +659,12 @@ function processDynamicChildren(context) {
     }
   }
   if (prevDynamics.length) {
-    context.registerOperation({
-      type: 9 /* INSERT_NODE */,
-      elements: prevDynamics.map((child) => child.id),
-      parent: context.reference()
-    });
+    registerInsertion(prevDynamics, context);
   }
 }
 function registerInsertion(dynamics, context, anchor) {
   for (const child of dynamics) {
+    console.log(child);
     if (child.template != null) {
       context.registerOperation({
         type: 9 /* INSERT_NODE */,
@@ -665,13 +672,9 @@ function registerInsertion(dynamics, context, anchor) {
         parent: context.reference(),
         anchor
       });
-    } else {
-      for (const op of context.block.operation) {
-        if (isBlockOperation(op) && op.id === child.id) {
-          op.parent = context.reference();
-          op.anchor = anchor;
-        }
-      }
+    } else if (child.operation && isBlockOperation(child.operation)) {
+      child.operation.parent = context.reference();
+      child.operation.anchor = anchor;
     }
   }
 }
@@ -842,7 +845,7 @@ function transformProp(prop, node, context) {
   if (prop.type === "JSXSpreadAttribute") return;
   let name = prop.name.type === "JSXIdentifier" ? prop.name.name : prop.name.type === "JSXNamespacedName" ? prop.name.namespace.name : "";
   name = name.split("_")[0];
-  if (!isDirectiveRegex.test(name) && (!prop.value || prop.value.type === "StringLiteral")) {
+  if (!isDirectiveRegex.test(name) && !isEventRegex.test(name) && (!prop.value || prop.value.type === "StringLiteral")) {
     if (isReservedProp(name)) return;
     return {
       key: resolveSimpleExpression(name, true, prop.name.loc),
@@ -900,7 +903,7 @@ function mergePropValues(existing, incoming) {
 var transformTemplateRef = (node, context) => {
   if (node.type !== "JSXElement") return;
   const dir = findProp(node, "ref");
-  if (!_optionalChain([dir, 'optionalAccess', _10 => _10.value])) return;
+  if (!_optionalChain([dir, 'optionalAccess', _12 => _12.value])) return;
   context.ir.hasTemplateRef = true;
   const value = resolveExpression(dir.value, context);
   return () => {
@@ -1046,7 +1049,6 @@ function processInterpolation(context) {
   }
   const id = context.reference();
   if (isFragmentNode(parent)) {
-    context.dynamic.flags |= 4 /* INSERT */ | 2 /* NON_TEMPLATE */;
     context.registerOperation({
       type: 18 /* CREATE_NODES */,
       id,
@@ -1597,7 +1599,7 @@ var transformVSlots = (node, context) => {
     (attr) => attr.type === "JSXAttribute" && attr.name.name.toString() === "v-slots"
   );
   const vSlotsDir = attributes[vSlotsIndex];
-  if (vSlotsDir && _optionalChain([vSlotsDir, 'access', _11 => _11.value, 'optionalAccess', _12 => _12.type]) === "JSXExpressionContainer") {
+  if (vSlotsDir && _optionalChain([vSlotsDir, 'access', _13 => _13.value, 'optionalAccess', _14 => _14.type]) === "JSXExpressionContainer") {
     attributes.splice(vSlotsIndex, 1);
     context.slots = [
       {

package/dist/index.js

@@ -268,17 +268,25 @@ function resolveNode(node, context) {
   const props = node.openingElement.attributes.reduce(
     (result, attr) => {
       if (attr.type === "JSXAttribute") {
-        if (tagType === ElementTypes.COMPONENT) {
-          result.push(resolveDirectiveNode(attr, context));
-        } else {
-          result.push({
+        result.push(
+          attr.value?.type === "StringLiteral" ? {
             type: NodeTypes.ATTRIBUTE,
             name: String(attr.name.name),
             nameLoc: resolveLocation(attr.name.loc, context),
             value: resolveValue(attr.value, context),
             loc: resolveLocation(attr.loc, context)
-          });
-        }
+          } : resolveDirectiveNode(attr, context)
+        );
+      } else if (attr.type === "JSXSpreadAttribute") {
+        result.push({
+          type: NodeTypes.DIRECTIVE,
+          name: "bind",
+          rawName: getText(attr, context),
+          exp: resolveExpression(attr.argument, context),
+          arg: void 0,
+          loc: resolveLocation(node.loc, context),
+          modifiers: []
+        });
       }
       return result;
     },
@@ -300,34 +308,35 @@ var namespaceRE = /^(?:\$([\w-]+)\$)?([\w-]+)?/;
 function resolveDirectiveNode(node, context, withFn = false) {
   const { value, name } = node;
   let nameString = name.type === "JSXNamespacedName" ? name.namespace.name : name.type === "JSXIdentifier" ? name.name : "";
-  let argString = name.type === "JSXNamespacedName" ? name.name.name : "";
-  if (name.type !== "JSXNamespacedName" && !argString) {
-    const [newName, modifiers2] = nameString.split("_");
-    nameString = newName;
-    argString = `_${modifiers2}`;
-  }
+  const isDirective = nameString.startsWith("v-");
   let modifiers = [];
   let isStatic = true;
-  const result = argString.match(namespaceRE);
-  if (result) {
-    let modifierString = "";
-    [, argString, modifierString] = result;
-    if (argString) {
-      argString = argString.replaceAll("_", ".");
-      isStatic = false;
-      if (modifierString && modifierString.startsWith("_"))
-        modifiers = modifierString.slice(1).split("_");
-    } else if (modifierString) {
-      ;
-      [argString, ...modifiers] = modifierString.split("_");
+  let argString = name.type === "JSXNamespacedName" ? name.name.name : "";
+  if (name.type !== "JSXNamespacedName" && !argString) {
+    ;
+    [nameString, ...modifiers] = nameString.split("_");
+  } else {
+    const result = argString.match(namespaceRE);
+    if (result) {
+      let modifierString = "";
+      [, argString, modifierString] = result;
+      if (argString) {
+        argString = argString.replaceAll("_", ".");
+        isStatic = false;
+        if (modifierString && modifierString.startsWith("_"))
+          modifiers = modifierString.slice(1).split("_");
+      } else if (modifierString) {
+        ;
+        [argString, ...modifiers] = modifierString.split("_");
+      }
     }
   }
-  const arg = argString && name.type === "JSXNamespacedName" ? resolveSimpleExpression(argString, isStatic, name.name.loc) : void 0;
+  const arg = isDirective ? argString && name.type === "JSXNamespacedName" ? resolveSimpleExpression(argString, isStatic, name.name.loc) : void 0 : resolveSimpleExpression(nameString, true, name.loc);
   const exp = value ? withFn && value.type === "JSXExpressionContainer" ? resolveExpressionWithFn(value.expression, context) : resolveExpression(value, context) : void 0;
   return {
     type: NodeTypes.DIRECTIVE,
-    name: nameString.slice(2),
-    rawName: `${nameString}:${argString}`,
+    name: isDirective ? nameString.slice(2) : "bind",
+    rawName: getText(name, context),
     exp,
     arg,
     loc: resolveLocation(node.loc, context),
@@ -636,6 +645,7 @@ function processDynamicChildren(context) {
           const anchor = prevDynamics[0].anchor = context.increaseId();
           registerInsertion(prevDynamics, context, anchor);
         } else {
+          prevDynamics[0].flags -= 2 /* NON_TEMPLATE */;
           registerInsertion(
             prevDynamics,
             context,
@@ -649,15 +659,12 @@ function processDynamicChildren(context) {
     }
   }
   if (prevDynamics.length) {
-    context.registerOperation({
-      type: 9 /* INSERT_NODE */,
-      elements: prevDynamics.map((child) => child.id),
-      parent: context.reference()
-    });
+    registerInsertion(prevDynamics, context);
   }
 }
 function registerInsertion(dynamics, context, anchor) {
   for (const child of dynamics) {
+    console.log(child);
     if (child.template != null) {
       context.registerOperation({
         type: 9 /* INSERT_NODE */,
@@ -665,13 +672,9 @@ function registerInsertion(dynamics, context, anchor) {
         parent: context.reference(),
         anchor
       });
-    } else {
-      for (const op of context.block.operation) {
-        if (isBlockOperation(op) && op.id === child.id) {
-          op.parent = context.reference();
-          op.anchor = anchor;
-        }
-      }
+    } else if (child.operation && isBlockOperation(child.operation)) {
+      child.operation.parent = context.reference();
+      child.operation.anchor = anchor;
     }
   }
 }
@@ -842,7 +845,7 @@ function transformProp(prop, node, context) {
   if (prop.type === "JSXSpreadAttribute") return;
   let name = prop.name.type === "JSXIdentifier" ? prop.name.name : prop.name.type === "JSXNamespacedName" ? prop.name.namespace.name : "";
   name = name.split("_")[0];
-  if (!isDirectiveRegex.test(name) && (!prop.value || prop.value.type === "StringLiteral")) {
+  if (!isDirectiveRegex.test(name) && !isEventRegex.test(name) && (!prop.value || prop.value.type === "StringLiteral")) {
     if (isReservedProp(name)) return;
     return {
       key: resolveSimpleExpression(name, true, prop.name.loc),
@@ -1046,7 +1049,6 @@ function processInterpolation(context) {
   }
   const id = context.reference();
   if (isFragmentNode(parent)) {
-    context.dynamic.flags |= 4 /* INSERT */ | 2 /* NON_TEMPLATE */;
     context.registerOperation({
       type: 18 /* CREATE_NODES */,
       id,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue-jsx-vapor/compiler",
-  "version": "2.1.0",
+  "version": "2.1.1",
   "description": "Vue JSX Vapor Compiler",
   "type": "module",
   "keywords": [