@bookshop/vite-plugin-astro-bookshop - npm Package Compare versions

Comparing version 3.9.0 to 3.10.0

.nyc_output/processinfo/index.json

@@ -1,1 +0,1 @@
-{"processes":{"3b3a2b44-f914-4f73-a64b-fa07d8543493":{"parent":null,"children":["f4fa5691-4f62-4852-a014-044a24c52caa"]},"f4fa5691-4f62-4852-a014-044a24c52caa":{"parent":"3b3a2b44-f914-4f73-a64b-fa07d8543493","children":[]}},"files":{},"externalIds":{}}
+{"processes":{"57b71922-7a44-489e-9dd7-6a9a7d819166":{"parent":null,"children":["bbe021ce-0776-4864-be7a-2d379a69a2f0"]},"bbe021ce-0776-4864-be7a-2d379a69a2f0":{"parent":"57b71922-7a44-489e-9dd7-6a9a7d819166","children":[]}},"files":{},"externalIds":{}}

main.js

@@ -11,3 +11,3 @@ import { cwd, env } from "process";
 
-const process = (src, id) => {
+const process = (src, id, includeErrorBoundaries, removeClientDirectives) => {
   id = id.replace(cwd().replace(/\\/g, "/"), "");
@@ -18,5 +18,7 @@
 
+  let componentName = componentMatch?.groups?.component;
+
   if (id.endsWith(".astro")) {
     try {
-      src = processAstro(src);
+      src = processAstro(src, componentName, includeErrorBoundaries, removeClientDirectives);
     } catch (err) {
@@ -41,3 +43,2 @@ err.processor = "astro";
 
-  let { component: componentName } = componentMatch.groups;
   let parts = componentName.replace(/\\/g, "/").split("/");
@@ -55,3 +56,3 @@ if (
       return {
-        code: processReactJSX(src, componentName),
+        code: processReactJSX(src, componentName, includeErrorBoundaries),
       };
@@ -72,3 +73,6 @@ } catch (err) {
 
-export default () => {
+export default (options) => {
+  const includeErrorBoundaries = options?.__includeErrorBoundaries ?? false
+  const removeClientDirectives = options?.__removeClientDirectives ?? false
+
   return {
@@ -80,3 +84,3 @@ name: "vite-plugin-astro-bookshop",
       try {
-        return process(src, id);
+        return process(src, id, includeErrorBoundaries, removeClientDirectives);
       } catch (err) {
@@ -83,0 +87,0 @@ let prefix = "[vite-plugin-astro-bookshop]";

package.json

 {
   "name": "@bookshop/vite-plugin-astro-bookshop",
   "packageManager": "yarn@3.0.0",
-  "version": "3.9.0",
+  "version": "3.10.0",
   "type": "module",
@@ -6,0 +6,0 @@ "description": "Astro plugin for consuming Bookshop components",

processors/astro.js

@@ -16,3 +16,10 @@ import { parse } from "@babel/parser";
 
-export default (src) => {
+const findComponentsDefs = createFinder(
+  (node) =>
+    node?.type === "CallExpression" &&
+    node.callee?.name === "$$createComponent",
+  true
+);
+
+export default (src, componentName, includeErrorBoundaries, removeClientDirectives) => {
   src = src.replace(
@@ -42,7 +49,31 @@ /const Astro2.*$/m,
 
+    let clientRendered = false;
+    if(removeClientDirectives){
+      clientRendered = node.arguments[3].properties.find((prop) => prop.key?.value.startsWith('client:'));
+    }
+
     node.arguments[3].properties = node.arguments[3].properties.filter(
       (prop) =>
         prop.key?.value !== "bookshop:live" &&
-        prop.key?.value !== "bookshop:binding"
+        prop.key?.value !== "bookshop:binding" &&
+        (!prop.key?.value.startsWith('client:') || !removeClientDirectives)
     );
+
+    if (clientRendered) {
+      node.arguments[3].properties.unshift({
+        type: "ObjectProperty",
+        method: false,
+        key: {
+          type: "Identifier",
+          name: "__client_rendered",
+        },
+        computed: false,
+        shorthand: false,
+        value: {
+          type: "BooleanLiteral",
+          value: true,
+        },
+      });
+    }
+
     const component = node.arguments[2].name;
@@ -187,2 +218,20 @@ const propsString = node.arguments[3].properties
 
+  if(includeErrorBoundaries){
+    findComponentsDefs(tree).forEach((node) => {
+      const handler = parse(`() => {
+        try{
+  
+        } catch (__err){
+          console.error(__err);
+          return $$render\`<div style="border: 3px solid red; border-radius: 2px; background-color: #FF9999; padding: 4px;">
+          <p style="font-size: 18px; font-weight: 600;">Error rendering ${componentName ?? 'Unknown'}!</p>
+          <p style="font-size: 16px; font-weight: normal;">\${__err.message}</p>
+          </div>\`;
+        }
+      };`).program.body[0].expression.body.body;
+      handler[0].block.body = node.arguments[0].body.body
+      node.arguments[0].body.body = handler;
+    });
+  }
+
   src = (generate.default ?? generate)(tree).code;
@@ -189,0 +238,0 @@

processors/react-jsx.js

@@ -131,7 +131,7 @@ import generate from "@babel/generator";
 
-export default (src, componentName) => {
+export default (src, componentName, includeErrorBoundaries) => {
   const tree = parse(src, {
     sourceType: "module",
     ecmaVersion: "latest",
-    plugins: ["jsx"],
+    plugins: ["jsx", "typescript"],
   }).program;
@@ -161,3 +161,3 @@
     } else {
-      name = componentName.split('/').pop();;
+      name = componentName.split("/").pop();
       defaultExport.type = "VariableDeclaration";
@@ -365,3 +365,5 @@ defaultExport.declarations = [
           }
-          return `{key:"${prop.name?.name ?? prop.key?.name}", values: [${identifiers
+          return `{key:"${
+            prop.name?.name ?? prop.key?.name
+          }", values: [${identifiers
             .join(",")
@@ -470,2 +472,23 @@ .replace(".[", "[")}],  identifiers: [\`${identifiers
 
+  if (includeErrorBoundaries) {
+    functionStatements.forEach((node) => {
+      const handler = parse(`() => {
+      try{
+
+      } catch (__err){
+        console.error(__err);
+        return __React.createElement("div", {style: {border: '3px solid red', borderRadius: '2px', backgroundColor: "#F99", padding: "4px"}}, [
+          __React.createElement("p", {key: 0, style: {fontSize: "18px", "fontWeight": "600"}}, ["Error rendering ${
+            componentName ?? "Unknown"
+          }!"]),
+          __React.createElement("p", {key: 1, style: {fontSize: "16px", "fontWeight": "normal"}}, [__err.message])
+        ]);
+        
+      }
+    };`).program.body[0].expression.body.body;
+      handler[0].block.body = node.body.body;
+      node.body.body = handler;
+    });
+  }
+
   src = (generate.default ?? generate)(tree).code;
@@ -472,0 +495,0 @@

No alert changes

Improved metrics

Total package byte prevSize

32034

increased by9.27%

Lines of code

956

increased by7.3%

No dependency changes