@vue-jsx-vapor/compiler 0.0.2 → 0.1.0

package/dist/index.js

@@ -45,7 +45,9 @@ import {
   createSimpleExpression,
   isLiteralWhitelisted
 } from "@vue/compiler-dom";
-import { parseExpression } from "@babel/parser";
+import {
+  isLiteral
+} from "@babel/types";
 var __BROWSER__ = false;
 function isConstantExpression(exp) {
   return isLiteralWhitelisted(exp.content) || isGloballyAllowed(exp.content) || getLiteralExpressionValue(exp) !== null;
@@ -62,29 +64,66 @@ function getLiteralExpressionValue(exp) {
   }
   return exp.isStatic ? exp.content : null;
 }
-function resolveExpression(node, context) {
+var isConstant = (node) => {
+  if (!node) return false;
+  if (node.type === "Identifier") {
+    return node.name === "undefined";
+  }
+  if (node.type === "ArrayExpression") {
+    const { elements } = node;
+    return elements.every((element) => element && isConstant(element));
+  }
+  if (node.type === "ObjectExpression") {
+    return node.properties.every(
+      (property) => isConstant(property.value)
+    );
+  }
+  if (node.type === "TemplateLiteral" ? !node.expressions.length : isLiteral(node)) {
+    return true;
+  }
+  return false;
+};
+function isLiteralExpressionContainer(node) {
+  return node?.type === "JSXExpressionContainer" && node.expression.type !== "JSXEmptyExpression" && isConstant(node.expression);
+}
+var EMPTY_TEXT_REGEX = /^\s*[\n\r]\s*$/;
+var START_EMPTY_TEXT_REGEX = /^\s*[\n\r]/;
+var END_EMPTY_TEXT_REGEX = /[\n\r]\s*$/;
+function resolveJSXText(node) {
+  if (EMPTY_TEXT_REGEX.test(`${node.extra?.raw}`)) {
+    return "";
+  }
+  let value = node.value;
+  if (START_EMPTY_TEXT_REGEX.test(value)) {
+    value = value.trimStart();
+  }
+  if (END_EMPTY_TEXT_REGEX.test(value)) {
+    value = value.trimEnd();
+  }
+  return value;
+}
+function isEmptyText(node) {
+  return node.type === "JSXText" && EMPTY_TEXT_REGEX.test(`${node.extra?.raw}`) || node.type === "JSXExpressionContainer" && node.expression.type === "JSXEmptyExpression";
+}
+function resolveExpression(node, context, effect = false) {
   const isStatic = !!node && (node.type === "StringLiteral" || node.type === "JSXText" || node.type === "JSXIdentifier");
-  const source = !node ? "" : node.type === "JSXIdentifier" ? node.name : isStatic ? node.value : node.type === "JSXExpressionContainer" ? node.expression.type === "Identifier" ? node.expression.name : context.ir.source.slice(
+  let source = !node ? "" : node.type === "JSXIdentifier" ? node.name : node.type === "StringLiteral" ? node.value : node.type === "JSXText" ? resolveJSXText(node) : node.type === "JSXExpressionContainer" ? node.expression.type === "JSXEmptyExpression" ? "" : node.expression.type === "Identifier" ? node.expression.name : context.ir.source.slice(
     node.expression.start,
     node.expression.end
   ) : context.ir.source.slice(node.start, node.end);
   const location = node ? node.loc : null;
-  let ast = false;
-  if (!isStatic && context.options.prefixIdentifiers) {
-    ast = parseExpression(` ${source}`, {
-      sourceType: "module",
-      plugins: context.options.expressionPlugins
-    });
+  if (source && !isStatic && effect && !isLiteralExpressionContainer(node)) {
+    source = `() => (${source})`;
   }
-  return resolveSimpleExpression(source, isStatic, location, ast);
+  return resolveSimpleExpression(source, isStatic, location);
 }
-function resolveSimpleExpression(source, isStatic, location, ast) {
+function resolveSimpleExpression(source, isStatic, location) {
   const result = createSimpleExpression(
     source,
     isStatic,
     resolveLocation(location, source)
   );
-  result.ast = ast ?? null;
+  result.ast = null;
   return result;
 }
 function resolveLocation(location, context) {
@@ -184,9 +223,6 @@ function isJSXComponent(node) {
     return openingElement.name.type === "JSXMemberExpression";
   }
 }
-function isMapCallExpression(node) {
-  return !!node && node.type === "CallExpression" && node.callee.type === "MemberExpression" && node.callee.property.type === "Identifier" && node.callee.property.name === "map";
-}
 function findProp(expression, key) {
   if (expression?.type === "JSXElement") {
     for (const attr of expression.openingElement.attributes) {
@@ -196,18 +232,6 @@ function findProp(expression, key) {
     }
   }
 }
-function getReturnExpression(node) {
-  if (node.type === "FunctionExpression" || node.type === "ArrowFunctionExpression") {
-    if (node.body.type !== "BlockStatement") {
-      return node.body;
-    } else {
-      for (const statement of node.body.body) {
-        if (statement.type === "ReturnStatement" && statement.argument)
-          return statement.argument;
-      }
-    }
-  }
-}
 function isJSXElement(node) {
   return !!node && (node.type === "JSXElement" || node.type === "JSXFragment");
 }
@@ -477,14 +501,7 @@ function extractIdentifiers(ids, node) {
 }
 
 // src/transforms/transformElement.ts
-import {
-  camelize,
-  capitalize,
-  extend as extend2,
-  isBuiltInDirective,
-  isVoidTag,
-  makeMap as makeMap2
-} from "@vue/shared";
+import { extend as extend2, isBuiltInDirective, isVoidTag, makeMap as makeMap2 } from "@vue/shared";
 
 // src/html-nesting.ts
 function isValidHTMLNesting(parent, child) {
@@ -687,14 +704,14 @@ var transformElement = (node, context) => {
 function transformComponentElement(tag, propsResult, singleRoot, context) {
   let asset = true;
   if (!__BROWSER__2) {
-    const fromSetup = resolveSetupReference(tag, context);
+    const fromSetup = tag;
     if (fromSetup) {
       tag = fromSetup;
       asset = false;
     }
     const dotIndex = tag.indexOf(".");
     if (dotIndex > 0) {
-      const ns = resolveSetupReference(tag.slice(0, dotIndex), context);
+      const ns = tag.slice(0, dotIndex);
       if (ns) {
         tag = ns + tag.slice(dotIndex);
         asset = false;
@@ -717,16 +734,6 @@ function transformComponentElement(tag, propsResult, singleRoot, context) {
   });
   context.slots = [];
 }
-function resolveSetupReference(name, context) {
-  const bindings = context.options.bindingMetadata;
-  if (!context.options.prefixIdentifiers) return name;
-  if (!bindings || bindings.__isScriptSetup === false) {
-    return;
-  }
-  const camelName = camelize(name);
-  const PascalName = capitalize(camelName);
-  return bindings[name] ? name : bindings[camelName] ? camelName : bindings[PascalName] ? PascalName : void 0;
-}
 function transformNativeElement(tag, propsResult, singleRoot, context) {
   const { scopeId } = context.options;
   let template = "";
@@ -841,7 +848,7 @@ function transformProp(prop, node, context) {
     return directiveTransform(prop, node, context);
   }
   if (!isBuiltInDirective(name)) {
-    const fromSetup = !__BROWSER__2 && resolveSetupReference(`v-${name}`, context);
+    const fromSetup = !__BROWSER__2 && `v-${name}`;
     if (fromSetup) {
       name = fromSetup;
     } else {
@@ -886,16 +893,6 @@ function mergePropValues(existing, incoming) {
 var transformChildren = (node, context) => {
   const isFragment = node.type === 0 /* ROOT */ || node.type === "JSXFragment" || isJSXComponent(node);
   if (node.type !== "JSXElement" && !isFragment) return;
-  Array.from(node.children).forEach((child, index) => {
-    if (child.type === "JSXText" && !child.value.trim()) {
-      child.value = " ";
-      if (!index) {
-        node.children.splice(0, 1);
-      } else if (index === node.children.length) {
-        node.children.splice(-1, 1);
-      }
-    }
-  });
   for (const [i, child] of node.children.entries()) {
     const childContext = context.create(child, i);
     transformNode(childContext);
@@ -1039,46 +1036,6 @@ function processLogicalExpression(node, context) {
   ];
 }
 
-// src/transforms/vFor.ts
-function processMapCallExpression(node, context) {
-  const {
-    callee,
-    arguments: [argument]
-  } = node;
-  if (!(argument.type === "FunctionExpression" || argument.type === "ArrowFunctionExpression") || callee?.type !== "MemberExpression")
-    return;
-  context.dynamic.flags |= 2 /* NON_TEMPLATE */ | 4 /* INSERT */;
-  const id = context.reference();
-  const [render, exitBlock] = createBranch(argument, context, true);
-  const source = resolveExpression(callee.object, context);
-  const value = argument.params[0] && resolveExpression(argument.params[0], context);
-  const key = argument.params[1] && resolveExpression(argument.params[1], context);
-  const index = argument.params[2] && resolveExpression(argument.params[2], context);
-  const returnExpression = getReturnExpression(argument);
-  const keyProp = findProp(returnExpression, "key");
-  const keyProperty = keyProp && resolveExpression(keyProp.value, context);
-  return () => {
-    exitBlock();
-    const { parent } = context;
-    let container;
-    if (parent && parent.block.node !== parent.node && parent.node.children.length === 1) {
-      container = parent.reference();
-    }
-    context.registerOperation({
-      type: 19 /* FOR */,
-      id,
-      source,
-      value,
-      key,
-      index,
-      keyProp: keyProperty,
-      render,
-      once: context.inVOnce,
-      container
-    });
-  };
-}
-
 // src/transforms/transformText.ts
 var seen = /* @__PURE__ */ new WeakMap();
 var transformText = (node, context) => {
@@ -1097,77 +1054,65 @@ var transformText = (node, context) => {
       return processConditionalExpression(node.expression, context);
     } else if (node.expression.type === "LogicalExpression") {
       return processLogicalExpression(node.expression, context);
-    } else if (node.expression.type === "CallExpression") {
-      if (isMapCallExpression(node.expression)) {
-        return processMapCallExpression(node.expression, context);
-      } else {
-        processCallExpression(node.expression, context);
-      }
     } else {
       processTextLike(context);
     }
   } else if (node.type === "JSXText") {
-    context.template += node.value;
+    const value = resolveJSXText(node);
+    if (value) {
+      context.template += value;
+    } else {
+      context.dynamic.flags |= 2 /* NON_TEMPLATE */;
+    }
   }
 };
 function processTextLike(context) {
   const nexts = context.parent.node.children?.slice(context.index);
   const idx = nexts.findIndex((n) => !isTextLike(n));
   const nodes = idx > -1 ? nexts.slice(0, idx) : nexts;
-  const id = context.reference();
-  const values = nodes.map((node) => createTextLikeExpression(node, context));
+  const values = createTextLikeExpressions(nodes, context);
+  if (!values.length) return;
   context.dynamic.flags |= 4 /* INSERT */ | 2 /* NON_TEMPLATE */;
   context.registerOperation({
     type: 13 /* CREATE_TEXT_NODE */,
-    id,
+    id: context.reference(),
     values,
-    effect: !values.every(isConstantExpression) && !context.inVOnce
+    effect: false
   });
 }
 function processTextLikeContainer(children, context) {
-  const values = children.map(
-    (child) => createTextLikeExpression(child, context)
-  );
+  const values = createTextLikeExpressions(children, context);
+  if (!values.length) return;
   const literals = values.map(getLiteralExpressionValue);
   if (literals.every((l) => l != null)) {
     context.childrenTemplate = literals.map((l) => String(l));
   } else {
-    context.registerEffect(values, {
+    context.registerOperation({
       type: 4 /* SET_TEXT */,
       element: context.reference(),
       values
     });
   }
 }
-function createTextLikeExpression(node, context) {
-  seen.get(context.root).add(node);
-  return resolveExpression(node, context);
+function createTextLikeExpressions(nodes, context) {
+  const values = [];
+  for (const node of nodes) {
+    if (isEmptyText(node)) continue;
+    seen.get(context.root).add(node);
+    values.push(resolveExpression(node, context, true));
+  }
+  return values;
 }
 function isAllTextLike(children) {
   return !!children.length && children.every(isTextLike) && // at least one an interpolation
   children.some((n) => n.type === "JSXExpressionContainer");
 }
 function isTextLike(node) {
-  return node.type === "JSXExpressionContainer" && !(node.expression.type === "ConditionalExpression" || node.expression.type === "LogicalExpression") && node.expression.type !== "CallExpression" || node.type === "JSXText";
-}
-function processCallExpression(node, context) {
-  context.dynamic.flags |= 2 /* NON_TEMPLATE */ | 4 /* INSERT */;
-  const root = context.root === context.parent && context.parent.node.children.length === 1;
-  const tag = `() => ${context.ir.source.slice(node.start, node.end)}`;
-  context.registerOperation({
-    type: 14 /* CREATE_COMPONENT_NODE */,
-    id: context.reference(),
-    tag,
-    props: [],
-    asset: false,
-    root,
-    slots: context.slots,
-    once: context.inVOnce
-  });
+  return node.type === "JSXExpressionContainer" && !(node.expression.type === "ConditionalExpression" || node.expression.type === "LogicalExpression") || node.type === "JSXText";
 }
 
 // src/transforms/vBind.ts
-import { camelize as camelize2, extend as extend3 } from "@vue/shared";
+import { camelize, extend as extend3 } from "@vue/shared";
 var transformVBind = (dir, node, context) => {
   const { name, value, loc } = dir;
   if (!loc || name.type === "JSXNamespacedName") return;
@@ -1178,7 +1123,7 @@ var transformVBind = (dir, node, context) => {
   let camel = false;
   if (modifiers.includes("camel")) {
     if (arg.isStatic) {
-      arg = extend3({}, arg, { content: camelize2(arg.content) });
+      arg = extend3({}, arg, { content: camelize(arg.content) });
     } else {
       camel = true;
     }
@@ -1366,19 +1311,14 @@ function compile(source, options = {}) {
   const onError = options.onError || defaultOnError2;
   const isModuleMode = options.mode === "module";
   const __BROWSER__3 = false;
-  if (__BROWSER__3) {
-    if (options.prefixIdentifiers === true) {
-      onError(createCompilerError2(ErrorCodes2.X_PREFIX_ID_NOT_SUPPORTED));
-    } else if (isModuleMode) {
-      onError(createCompilerError2(ErrorCodes2.X_MODULE_MODE_NOT_SUPPORTED));
-    }
+  if (__BROWSER__3 && isModuleMode) {
+    onError(createCompilerError2(ErrorCodes2.X_MODULE_MODE_NOT_SUPPORTED));
   }
-  const prefixIdentifiers = !__BROWSER__3 && options.prefixIdentifiers === true;
   if (options.scopeId && !isModuleMode) {
     onError(createCompilerError2(ErrorCodes2.X_SCOPE_ID_NOT_SUPPORTED));
   }
   const resolvedOptions = extend5({}, options, {
-    prefixIdentifiers,
+    prefixIdentifiers: false,
     expressionPlugins: options.expressionPlugins || ["jsx"]
   });
   if (!__BROWSER__3 && options.isTS) {
@@ -1410,7 +1350,7 @@ function compile(source, options = {}) {
     helpers: /* @__PURE__ */ new Set(),
     temps: 0
   };
-  const [nodeTransforms, directiveTransforms] = getBaseTransformPreset(prefixIdentifiers);
+  const [nodeTransforms, directiveTransforms] = getBaseTransformPreset();
   const ir = transform(
     ast,
     extend5({}, resolvedOptions, {
@@ -1429,7 +1369,7 @@ function compile(source, options = {}) {
   );
   return generate(ir, resolvedOptions);
 }
-function getBaseTransformPreset(prefixIdentifiers) {
+function getBaseTransformPreset() {
   return [
     [
       transformTemplateRef,

package/package.json

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