labellife-design-tool 1.3.7 → 1.3.9

package/dist/lib/lib/index.js

@@ -2716,6 +2716,33 @@ var RightSidebar = ({
 var RightSidebar_default = RightSidebar;
 
 // src/CanvasEditor.tsx
+var renderComponentSafely = (Component, props, fallbackMessage = "Component render failed") => {
+  if (typeof React17 === "undefined") {
+    console.error("labellife-design-tool: React not available");
+    return React17.createElement("div", {
+      className: "text-red-400 text-center p-4",
+      children: "React not available"
+    });
+  }
+  const reactVersion = React17.version;
+  if (reactVersion && !reactVersion.startsWith("18.")) {
+    console.warn("labellife-design-tool: React 18.x recommended, found:", reactVersion);
+  }
+  try {
+    return React17.createElement(Component, props);
+  } catch (jsxError) {
+    console.warn("labellife-design-tool: JSX rendering failed, trying React.createElement:", jsxError);
+    try {
+      return React17.createElement(Component, props);
+    } catch (createElementError) {
+      console.error("labellife-design-tool: Both JSX and React.createElement failed:", createElementError);
+      return React17.createElement("div", {
+        className: "text-red-400 text-center p-4",
+        children: fallbackMessage
+      });
+    }
+  }
+};
 var CanvasEditor = forwardRef(({ name, config, store }, ref) => {
   if (!store) {
     console.error("CanvasEditor: store prop is required but was not provided");
@@ -2943,10 +2970,16 @@ var CanvasEditor = forwardRef(({ name, config, store }, ref) => {
       }, "Invalid panel component");
     }
     console.log("DynamicPanelRenderer: Rendering panel:", activePanel.id);
-    return /* @__PURE__ */ React17.createElement(PanelComponent, {
+    console.log("About to render with component:", {
+      component: PanelComponent,
+      componentType: typeof PanelComponent,
+      isFunction: typeof PanelComponent === "function",
+      componentName: PanelComponent.name || "anonymous"
+    });
+    return renderComponentSafely(PanelComponent, {
       key: activePanel.id,
       ...activePanel.props
-    });
+    }, `Failed to render panel: ${activePanel.id}`);
   }, [panelConfigs, store.activePanelId]);
   const handleImageUpload = useCallback4((e) => {
     const file = e.target.files?.[0];

package/dist/lib/wordpress.js

@@ -2716,6 +2716,33 @@ var RightSidebar = ({
 var RightSidebar_default = RightSidebar;
 
 // src/CanvasEditor.tsx
+var renderComponentSafely = (Component, props, fallbackMessage = "Component render failed") => {
+  if (typeof React17 === "undefined") {
+    console.error("labellife-design-tool: React not available");
+    return React17.createElement("div", {
+      className: "text-red-400 text-center p-4",
+      children: "React not available"
+    });
+  }
+  const reactVersion = React17.version;
+  if (reactVersion && !reactVersion.startsWith("18.")) {
+    console.warn("labellife-design-tool: React 18.x recommended, found:", reactVersion);
+  }
+  try {
+    return React17.createElement(Component, props);
+  } catch (jsxError) {
+    console.warn("labellife-design-tool: JSX rendering failed, trying React.createElement:", jsxError);
+    try {
+      return React17.createElement(Component, props);
+    } catch (createElementError) {
+      console.error("labellife-design-tool: Both JSX and React.createElement failed:", createElementError);
+      return React17.createElement("div", {
+        className: "text-red-400 text-center p-4",
+        children: fallbackMessage
+      });
+    }
+  }
+};
 var CanvasEditor = forwardRef(({ name, config, store }, ref) => {
   if (!store) {
     console.error("CanvasEditor: store prop is required but was not provided");
@@ -2943,10 +2970,16 @@ var CanvasEditor = forwardRef(({ name, config, store }, ref) => {
       }, "Invalid panel component");
     }
     console.log("DynamicPanelRenderer: Rendering panel:", activePanel.id);
-    return /* @__PURE__ */ React17.createElement(PanelComponent, {
+    console.log("About to render with component:", {
+      component: PanelComponent,
+      componentType: typeof PanelComponent,
+      isFunction: typeof PanelComponent === "function",
+      componentName: PanelComponent.name || "anonymous"
+    });
+    return renderComponentSafely(PanelComponent, {
       key: activePanel.id,
       ...activePanel.props
-    });
+    }, `Failed to render panel: ${activePanel.id}`);
   }, [panelConfigs, store.activePanelId]);
   const handleImageUpload = useCallback4((e) => {
     const file = e.target.files?.[0];

package/dist/types/CanvasEditor.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CanvasEditor.d.ts","sourceRoot":"","sources":["../../src/CanvasEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmF,MAAM,OAAO,CAAC;AA4ExG,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AACxC,OAAO,EAAqB,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAC3E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAEnD,QAAA,MAAM,YAAY;UAAuC,MAAM;aAAW,MAAM;WAAS,iBAAiB;yCA8iBxG,CAAC;AAIH,eAAe,YAAY,CAAC"}
+{"version":3,"file":"CanvasEditor.d.ts","sourceRoot":"","sources":["../../src/CanvasEditor.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAmF,MAAM,OAAO,CAAC;AAmHxG,OAAO,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAC;AACxC,OAAO,EAAqB,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAC3E,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAEnD,QAAA,MAAM,YAAY;UAAuC,MAAM;aAAW,MAAM;WAAS,iBAAiB;yCA2jBxG,CAAC;AAIH,eAAe,YAAY,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "labellife-design-tool",
-  "version": "1.3.7",
+  "version": "1.3.9",
   "description": "Professional canvas editor built with React, TypeScript, and Konva",
   "main": "./dist/lib/lib/index.js",
   "module": "./dist/lib/lib/index.js",