v1.0.1

chore: add test fixture

feat: Add helper method for defaul export

feat: add test fixtures

wip: first pass

added prettier integration

fix: reverted prettier formating

fix: Indentation

changed package json

removed export template functions

fix: remove use of filename-> Component name

chore: cleanup opts names

reverted package name that i used to build a local version

add original npmrc

.npmrc

@@ -1 +1 @@
-package-lock=false
+package-lock=false

package.json

@@ -1,6 +1,6 @@
 {
   "name": "babel-plugin-inline-react-svg",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "description": "A babel plugin that optimizes and inlines SVGs for your react components.",
   "main": "lib/index.js",
   "scripts": {
@@ -14,7 +14,7 @@
   },
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/kesne/babel-plugin-inline-react-svg.git"
+    "url": "git@git.intern.folksam.se:frontend-modules/babel-plugin-inline-react-svg.git"
   },
   "keywords": [
     "babel",

src/index.js

@@ -1,4 +1,4 @@
-import { extname, dirname } from 'path';
+import { extname, dirname, parse as parseFilename } from 'path';
 import { readFileSync } from 'fs';
 import { parse } from '@babel/parser';
 import { declare } from '@babel/helper-plugin-utils';
@@ -19,16 +19,51 @@ export default declare(({
 }) => {
   assertVersion(7);
 
-  const buildSvg = template(`
-  var SVG_NAME = function SVG_NAME(props) { return SVG_CODE; };
-`);
-
-  const buildSvgWithDefaults = template(`
-  var SVG_NAME = function SVG_NAME(props) { return SVG_CODE; };
-  SVG_NAME.defaultProps = SVG_DEFAULT_PROPS_CODE;
-`);
+  const buildSvg = ({
+    IS_EXPORT, EXPORT_FILENAME, SVG_NAME, SVG_CODE,
+  }) => {
+    if (IS_EXPORT) {
+      if (SVG_NAME === 'default') {
+        return template(`
+        var Component = function(props) { return SVG_CODE; };
+        Component.displayName = 'EXPORT_FILENAME';
+        export default Component;
+      `)({ SVG_CODE, EXPORT_FILENAME });
+      }
+      return template(`
+          var SVG_NAME = function SVG_NAME(props) { return SVG_CODE; };
+          export { SVG_NAME };
+        `)({ SVG_NAME, SVG_CODE });
+    }
+    return template(`
+      var SVG_NAME = function SVG_NAME(props) { return SVG_CODE; };
+      `)({ SVG_NAME, SVG_CODE });
+  };
 
-  function applyPlugin(importIdentifier, importPath, path, state) {
+  const buildSvgWithDefaults = ({
+    IS_EXPORT, EXPORT_FILENAME, SVG_NAME, SVG_CODE, SVG_DEFAULT_PROPS_CODE,
+  }) => {
+    if (IS_EXPORT) {
+      if (SVG_NAME === 'default') {
+        return template(`
+        var Component = function(props) { return SVG_CODE; };
+        Component.defaultProps = SVG_DEFAULT_PROPS_CODE;
+        Component.displayName = 'EXPORT_FILENAME';
+        export default Component;
+      `)({ SVG_CODE, SVG_DEFAULT_PROPS_CODE, EXPORT_FILENAME });
+      }
+      return template(`
+      var SVG_NAME = function SVG_NAME(props) { return SVG_CODE; };
+      SVG_NAME.defaultProps = SVG_DEFAULT_PROPS_CODE;
+      export { SVG_NAME };
+    `)({ SVG_NAME, SVG_CODE, SVG_DEFAULT_PROPS_CODE });
+    }
+    return template(`
+    var SVG_NAME = function SVG_NAME(props) { return SVG_CODE; };
+    SVG_NAME.defaultProps = SVG_DEFAULT_PROPS_CODE;
+  `)({ SVG_NAME, SVG_CODE, SVG_DEFAULT_PROPS_CODE });
+  };
+  function applyPlugin(importIdentifier, importPath, path, state, isExport, exportFilename) {
     if (typeof importPath !== 'string') {
       throw new TypeError('`applyPlugin` `importPath` must be a string');
     }
@@ -71,6 +106,8 @@ export default declare(({
       const opts = {
         SVG_NAME: importIdentifier,
         SVG_CODE: svgCode,
+        IS_EXPORT: isExport,
+        EXPORT_FILENAME: exportFilename,
       };
 
       // Move props off of element and into defaultProps
@@ -137,6 +174,14 @@ export default declare(({
           applyPlugin(node.specifiers[0].local, node.source.value, path, state);
         }
       },
+      ExportNamedDeclaration(path, state) {
+        const { node } = path;
+        if (node.specifiers.length > 0 && node.specifiers[0].local.name === 'default') {
+          const exportName = node.specifiers[0].exported.name;
+          const filename = parseFilename(node.source.value).name;
+          applyPlugin(exportName, node.source.value, path, state, true, filename);
+        }
+      },
     },
   };
 });

test/fixtures/test-export-default-as.jsx

@@ -0,0 +1 @@
+export { default as IconClose } from "./close.svg";

test/fixtures/test-export-default.jsx

@@ -0,0 +1 @@
+export { default } from "./close-a.svg";

test/sanity.js

@@ -133,3 +133,23 @@ transform(fs.readFileSync(filename), {
   if (err) throw err;
   console.log('test/fixtures/test-import-read-file.jsx', result.code);
 });
+
+transformFile('test/fixtures/test-export-default.jsx', {
+  presets: ['airbnb'],
+  plugins: [
+    inlineReactSvgPlugin,
+  ],
+}, (err, result) => {
+  if (err) throw err;
+  console.log('test/fixtures/test-export-default.jsx', result.code);
+});
+
+transformFile('test/fixtures/test-export-default-as.jsx', {
+  presets: ['airbnb'],
+  plugins: [
+    inlineReactSvgPlugin,
+  ],
+}, (err, result) => {
+  if (err) throw err;
+  console.log('test/fixtures/test-export-default-as.jsx', result.code);
+});