From 0038070b7e57e37d5436dd9152e80581aef02259 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Vieira?= <joao@guuru.com>
Date: Fri, 30 Aug 2024 13:32:17 +0100
Subject: [PATCH 1/2] Remove defaultProps which are deprecated in React

Drop defaultProps from the generated component as they are now
deprecated and will be removed in React 19.

They were added in #8 due to concerns about the overhead of `_extends`
although no benchmarks were provided and it is likely that difference
would be marginal where it matters.

Fixes: #126
---
 src/index.js   | 33 +++------------------------------
 test/sanity.js | 10 ----------
 2 files changed, 3 insertions(+), 40 deletions(-)

diff --git a/src/index.js b/src/index.js
index 2934b6c..b5e0599 100644
--- a/src/index.js
+++ b/src/index.js
@@ -24,24 +24,21 @@ export default declare(({
     EXPORT_FILENAME,
     SVG_NAME,
     SVG_CODE,
-    SVG_DEFAULT_PROPS_CODE,
   }) => {
     const namedTemplate = `
       var SVG_NAME = function SVG_NAME(props) { return SVG_CODE; };
-      ${SVG_DEFAULT_PROPS_CODE ? 'SVG_NAME.defaultProps = SVG_DEFAULT_PROPS_CODE;' : ''}
       ${IS_EXPORT ? 'export { SVG_NAME };' : ''}
     `;
     const anonymousTemplate = `
       var Component = function (props) { return SVG_CODE; };
-      ${SVG_DEFAULT_PROPS_CODE ? 'Component.defaultProps = SVG_DEFAULT_PROPS_CODE;' : ''}
       Component.displayName = 'EXPORT_FILENAME';
       export default Component;
     `;
 
     if (SVG_NAME !== 'default') {
-      return template(namedTemplate)({ SVG_NAME, SVG_CODE, SVG_DEFAULT_PROPS_CODE });
+      return template(namedTemplate)({ SVG_NAME, SVG_CODE });
     }
-    return template(anonymousTemplate)({ SVG_CODE, SVG_DEFAULT_PROPS_CODE, EXPORT_FILENAME });
+    return template(anonymousTemplate)({ SVG_CODE, EXPORT_FILENAME });
   };
 
   function applyPlugin(importIdentifier, importPath, path, state, isExport, exportFilename) {
@@ -95,32 +92,8 @@ export default declare(({
         EXPORT_FILENAME: exportFilename,
       };
 
-      // Move props off of element and into defaultProps
-      if (svgCode.openingElement.attributes.length > 1) {
-        const keepProps = [];
-        const defaultProps = [];
-
-        svgCode.openingElement.attributes.forEach((prop) => {
-          if (prop.type === 'JSXSpreadAttribute') {
-            keepProps.push(prop);
-          } else if (prop.value.type === 'JSXExpressionContainer') {
-            const objectExpression = t.objectExpression(prop.value.expression.properties);
-            defaultProps.push(t.objectProperty(t.identifier(prop.name.name), objectExpression));
-          } else {
-            defaultProps.push(t.objectProperty(t.identifier(prop.name.name), prop.value));
-          }
-        });
-
-        svgCode.openingElement.attributes = keepProps;
-        opts.SVG_DEFAULT_PROPS_CODE = t.objectExpression(defaultProps);
-      }
-
       const svgReplacement = buildSvg(opts);
-      if (opts.SVG_DEFAULT_PROPS_CODE) {
-        [newPath] = path.replaceWithMultiple(svgReplacement);
-      } else {
-        newPath = path.replaceWith(svgReplacement);
-      }
+      [newPath] = path.replaceWithMultiple(svgReplacement);
 
       file.get('ensureReact')();
       file.set('ensureReact', () => {});
diff --git a/test/sanity.js b/test/sanity.js
index c397fba..3ed82f1 100644
--- a/test/sanity.js
+++ b/test/sanity.js
@@ -14,12 +14,6 @@ function assertReactImport(result) {
   }
 }
 
-function validateDefaultProps(result) {
-  if (!(/'data-name':/g).test(result.code)) {
-    throw new Error('data-* props need to be quoted');
-  }
-}
-
 transformFile('test/fixtures/test-import.jsx', {
   babelrc: false,
   presets: ['@babel/preset-react'],
@@ -29,7 +23,6 @@ transformFile('test/fixtures/test-import.jsx', {
 }, (err, result) => {
   if (err) throw err;
   assertReactImport(result);
-  validateDefaultProps(result);
   console.log('test/fixtures/test-import.jsx', result.code);
 });
 
@@ -42,7 +35,6 @@ transformFile('test/fixtures/test-multiple-svg.jsx', {
 }, (err, result) => {
   if (err) throw err;
   assertReactImport(result);
-  validateDefaultProps(result);
   console.log('test/fixtures/test-multiple-svg.jsx', result.code);
 });
 
@@ -56,7 +48,6 @@ transformFile('test/fixtures/test-no-react.jsx', {
   if (err) throw err;
   console.log('test/fixtures/test-no-react.jsx', result.code);
   assertReactImport(result);
-  validateDefaultProps(result);
 });
 
 transformFile('test/fixtures/test-no-duplicate-react.jsx', {
@@ -80,7 +71,6 @@ transformFile('test/fixtures/test-no-duplicate-react.jsx', {
   if (err) throw err;
   console.log('test/fixtures/test-no-duplicate-react.jsx', result.code);
   assertReactImport(result);
-  validateDefaultProps(result);
 });
 
 if (fs.existsSync(path.resolve('./PACKAGE.JSON'))) {

From 66bd14aed5b5cc3eeced55b2b35a4f6fe050c678 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=C3=A3o=20Vieira?= <vieira@yubo.be>
Date: Fri, 13 Sep 2024 22:51:45 +0000
Subject: [PATCH 2/2] Fix 'data-*' attributes should not be wrapped in quotes

---
 src/transformSvg.js | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/transformSvg.js b/src/transformSvg.js
index bccb0a7..ebc9a37 100644
--- a/src/transformSvg.js
+++ b/src/transformSvg.js
@@ -45,9 +45,7 @@ export default (t) => ({
       // to
       // <svg strokeWidth="5">
       // don't convert any custom data-* or aria-* attributes just wrap in quotes
-      if (/^data-|^aria-/.test(originalName.name)) {
-        originalName.name = `'${originalName.name}'`;
-      } else {
+      if (!/^data-|^aria-/.test(originalName.name)) {
         originalName.name = hyphenToCamel(originalName.name);
       }
     }