Merge pull request #124 from break-stuff/react-wrappers-error-with-no…

…-excluded-props fix issue with unused props
break-stuff · May 16, 2024 · 710b3de · 710b3de
2 parents 9147e9e + d3cfc8e
commit 710b3de
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 10 deletions.
diff --git a/packages/react-wrappers/CHANGELOG.md b/packages/react-wrappers/CHANGELOG.md
@@ -1,5 +1,10 @@
 # CHANGELOG
 
+## 1.5.1
+
+- Fixed issue when there are no unused props
+- Fixed issue when there are no added types
+
 ## 1.5.0
 
 - Added ability to extend react types

diff --git a/packages/react-wrappers/package.json b/packages/react-wrappers/package.json
@@ -1,6 +1,6 @@
 {
   "name": "custom-element-react-wrappers",
-  "version": "1.5.0",
+  "version": "1.5.1",
   "description": "A tool for generating react-compatible wrappers for custom elements",
   "main": "index.js",
   "module": "index.js",

diff --git a/packages/react-wrappers/src/wrapper-generator.ts b/packages/react-wrappers/src/wrapper-generator.ts
@@ -313,7 +313,7 @@ function getReactComponentTemplate(
   const useEffect = has(eventTemplates) || has(propTemplates) || config.ssrSafe;
 
   return `
-    ${config.ssrSafe ? '"use client"' : ''}
+    ${config.ssrSafe ? '"use client"' : ""}
     import React, { forwardRef, useImperativeHandle ${
       useEffect ? ", useRef, useEffect" : ""
     } ${config.scopedTags ? ", useContext" : ""} } from "react";
@@ -334,7 +334,7 @@ function getReactComponentTemplate(
 
     export const ${component.name} = forwardRef((props, forwardedRef) => {
       ${useEffect ? `const ref = useRef(null);` : ""}
-      const { ${unusedProps.join(", ")}, ...filteredProps } = props;
+      ${has(unusedProps) ? `const { ${unusedProps.join(", ")}, ...filteredProps } = props;` : ''}
       ${config.scopedTags ? "const scope = useContext(ScopeContext);" : ""}
 
       ${
@@ -427,16 +427,14 @@ function getTypeDefinitionTemplate(
 }
 
 function getExtendedProps() {
-  return typeof config.reactProps === "object"
-    ? `extends Pick<React.AllHTMLAttributes<HTMLElement>, ${[
+  return config.reactProps === true
+    ? "extends React.AllHTMLAttributes<HTMLElement>"
+    : `extends Pick<React.AllHTMLAttributes<HTMLElement>, ${[
         ...BASE_PROPS,
-        ...config.reactProps,
+        ...(config.reactProps || []),
       ]
         .map((x) => `'${x}'`)
-        .join(" | ")}>`
-    : config.reactProps === true
-    ? "extends React.AllHTMLAttributes<HTMLElement>"
-    : "";
+        .join(" | ")}>`;
 }
 
 function getMethodParameters(parameters?: Parameter[]) {