style: prettier format

README.md

@@ -81,7 +81,7 @@ npx @svgr/cli --icon --replace-attr-values "#063855=currentColor" icon.svg
 ```js
 import * as React from 'react'
 
-const SvgComponent = props => (
+const SvgComponent = (props) => (
   <svg width="1em" height="1em" viewBox="0 0 48 1" {...props}>
     <path d="M0 0h48v1H0z" fill="currentColor" fillRule="evenodd" />
   </svg>

api/svgr.js

@@ -11,10 +11,10 @@ module.exports = (req, res) => {
     return
   }
   svgr(req.body.code, { ...req.body.options, plugins: [svgo, jsx, prettier] })
-    .then(output => {
+    .then((output) => {
       res.status(200).json({ output })
     })
-    .catch(error => {
+    .catch((error) => {
       res.status(400).json({ error: error.message })
     })
 }

packages/babel-plugin-add-jsx-attribute/src/index.js

@@ -52,15 +52,15 @@ const addJSXAttribute = ({ types: t, template }, opts) => {
             const newAttribute = getAttribute({ spread, name, value, literal })
             const attributes = path.get('attributes')
 
-            const isEqualAttribute = attribute => {
+            const isEqualAttribute = (attribute) => {
               if (spread) {
                 return attribute.get('argument').isIdentifier({ name })
               }
 
               return attribute.get('name').isJSXIdentifier({ name })
             }
 
-            const replaced = attributes.some(attribute => {
+            const replaced = attributes.some((attribute) => {
               if (!isEqualAttribute(attribute)) return false
               attribute.replaceWith(newAttribute)
               return true

packages/babel-plugin-remove-jsx-attribute/src/index.js

@@ -3,7 +3,7 @@ const removeJSXAttribute = (api, opts) => ({
     JSXOpeningElement(path) {
       if (!opts.elements.includes(path.node.name.name)) return
 
-      path.get('attributes').forEach(attribute => {
+      path.get('attributes').forEach((attribute) => {
         const nodeName = attribute.node.name
         if (nodeName && opts.attributes.includes(nodeName.name)) {
           attribute.remove()

packages/babel-plugin-svg-dynamic-title/src/index.js

@@ -4,7 +4,7 @@ const plugin = ({ types: t }) => ({
   visitor: {
     JSXElement(path) {
       if (
-        !elements.some(element =>
+        !elements.some((element) =>
           path.get('openingElement.name').isJSXIdentifier({ name: element }),
         )
       ) {
@@ -28,7 +28,7 @@ const plugin = ({ types: t }) => ({
 
       function enhanceAttributes(attributes) {
         const existingId = attributes.find(
-          attribute => attribute.name.name === 'id',
+          (attribute) => attribute.name.name === 'id',
         )
         if (!existingId) {
           return [...attributes, createTitleIdAttribute()]
@@ -89,7 +89,7 @@ const plugin = ({ types: t }) => ({
       // store the title element
       let titleElement
 
-      const hasTitle = path.get('children').some(childPath => {
+      const hasTitle = path.get('children').some((childPath) => {
         if (!childPath.isJSXElement()) return false
         if (childPath.node === titleElement) return false
         if (childPath.node.openingElement.name.name !== 'title') return false

packages/babel-plugin-svg-em-dimensions/src/index.js

@@ -5,7 +5,7 @@ const plugin = ({ types: t }) => ({
     JSXOpeningElement: {
       enter(path) {
         if (
-          !elements.some(element =>
+          !elements.some((element) =>
             path.get('name').isJSXIdentifier({ name: element }),
           )
         )
@@ -14,7 +14,7 @@ const plugin = ({ types: t }) => ({
         const requiredAttributes = ['width', 'height']
         const attributeValue = '1em'
 
-        path.get('attributes').forEach(attributePath => {
+        path.get('attributes').forEach((attributePath) => {
           if (!attributePath.isJSXAttribute()) return
           const index = requiredAttributes.indexOf(attributePath.node.name.name)
 
@@ -25,7 +25,7 @@ const plugin = ({ types: t }) => ({
           requiredAttributes.splice(index, 1)
         })
 
-        requiredAttributes.forEach(attribute => {
+        requiredAttributes.forEach((attribute) => {
           path.pushContainer(
             'attributes',
             t.jsxAttribute(

packages/babel-plugin-transform-react-native-svg/src/index.js

@@ -76,11 +76,11 @@ const plugin = ({ types: t }, { expo }) => {
   const importDeclarationVisitor = {
     ImportDeclaration(path, state) {
       if (path.get('source').isStringLiteral({ value: 'react-native-svg' })) {
-        state.replacedComponents.forEach(component => {
+        state.replacedComponents.forEach((component) => {
           if (
             path
               .get('specifiers')
-              .some(specifier =>
+              .some((specifier) =>
                 specifier.get('local').isIdentifier({ name: component }),
               )
           ) {

packages/babel-plugin-transform-svg-component/src/index.test.js

@@ -1,7 +1,7 @@
 import { transform } from '@babel/core'
 import plugin from '.'
 
-const testPlugin = language => (code, options) => {
+const testPlugin = (language) => (code, options) => {
   const result = transform(code, {
     plugins: [
       '@babel/plugin-syntax-jsx',
@@ -14,7 +14,7 @@ const testPlugin = language => (code, options) => {
 }
 
 describe('plugin', () => {
-  describe.each(['javascript', 'typescript'])('%s', language => {
+  describe.each(['javascript', 'typescript'])('%s', (language) => {
     it('transforms whole program', () => {
       const { code } = testPlugin(language)('<svg><g /></svg>', {
         state: { componentName: 'SvgComponent' },

packages/babel-preset/src/index.js

@@ -14,14 +14,14 @@ function getAttributeValue(value) {
 }
 
 function propsToAttributes(props) {
-  return Object.keys(props).map(name => {
+  return Object.keys(props).map((name) => {
     const { literal, value } = getAttributeValue(props[name])
     return { name, literal, value }
   })
 }
 
 function replaceMapToValues(replaceMap) {
-  return Object.keys(replaceMap).map(value => {
+  return Object.keys(replaceMap).map((value) => {
     const { literal, value: newValue } = getAttributeValue(replaceMap[value])
     return { value, newValue, literal }
   })

packages/cli/src/index.test.js

@@ -11,7 +11,7 @@ const svgr = path.join(__dirname, 'index.js')
 const babelNode = path.join(__dirname, '../../../node_modules/.bin/babel-node')
 
 describe('cli', () => {
-  const cli = async args => {
+  const cli = async (args) => {
     const { stdout } = await exec(`${babelNode} -- ${svgr} ${args}`)
     return stdout
   }
@@ -60,7 +60,7 @@ describe('cli', () => {
     const sorted = result
       .split(/\n/)
       .sort()
-      .map(x => x.toLowerCase())
+      .map((x) => x.toLowerCase())
       .join('\n')
     expect(sorted).toMatchSnapshot()
   }, 10000)
@@ -72,7 +72,7 @@ describe('cli', () => {
     const sorted = result
       .split(/\n/)
       .sort()
-      .map(x => x.toLowerCase())
+      .map((x) => x.toLowerCase())
       .join('\n')
     expect(sorted).toMatchSnapshot()
   }, 10000)
@@ -81,10 +81,7 @@ describe('cli', () => {
     const result = await cli(
       '--silent --out-dir __fixtures_build__/whole __fixtures__',
     )
-    const sorted = result
-      .split(/\n/)
-      .sort()
-      .join('\n')
+    const sorted = result.split(/\n/).sort().join('\n')
     expect(sorted).toMatchSnapshot()
   }, 10000)
 
@@ -136,7 +133,7 @@ describe('cli', () => {
     ['--typescript --ref --title-prop'],
   ])(
     'should support various args',
-    async args => {
+    async (args) => {
       const result = await cli(`${args} __fixtures__/simple/file.svg`)
       expect(result).toMatchSnapshot(args)
     },

packages/core/README.md

@@ -23,9 +23,11 @@ const svgCode = `
 </svg>
 `
 
-svgr(svgCode, { icon: true }, { componentName: 'MyComponent' }).then(jsCode => {
-  console.log(jsCode)
-})
+svgr(svgCode, { icon: true }, { componentName: 'MyComponent' }).then(
+  (jsCode) => {
+    console.log(jsCode)
+  },
+)
 ```
 
 Use `svgr.sync(code, config, state)` if you would like to use sync version.
@@ -37,7 +39,7 @@ By default `@svgr/core` doesn't include `svgo` and `prettier` plugins, if you wa
 ```js
 svgr(svgCode, {
   plugins: ['@svgr/plugin-svgo', '@svgr/plugin-jsx', '@svgr/plugin-prettier'],
-}).then(jsCode => {
+}).then((jsCode) => {
   console.log(jsCode)
 })
 ```

packages/core/src/config.js

@@ -55,7 +55,7 @@ export async function resolveConfigFile(filePath) {
   return result ? result.filepath : null
 }
 
-resolveConfigFile.sync = filePath => {
+resolveConfigFile.sync = (filePath) => {
   const result = explorerSync.search(filePath)
   return result ? result.filepath : null
 }

packages/core/src/config.test.js

@@ -4,17 +4,18 @@ import { resolveConfig, resolveConfigFile, loadConfig } from './config'
 const getMethod = (method, mode) => (mode === 'sync' ? method.sync : method)
 
 describe('svgo', () => {
-  describe.each([['sync'], ['async']])('%s', mode => {
+  describe.each([['sync'], ['async']])('%s', (mode) => {
     describe(`#resolveConfig [${mode}]`, () => {
       it('should return null if no config found', async () => {
         const config = await getMethod(resolveConfig, mode)('/tmp')
         expect(config).toBe(null)
       })
 
       it('should return config if found', async () => {
-        const config = await getMethod(resolveConfig, mode)(
-          path.join(__dirname, '__fixtures__/svgr'),
-        )
+        const config = await getMethod(
+          resolveConfig,
+          mode,
+        )(path.join(__dirname, '__fixtures__/svgr'))
         expect(config).toEqual({
           icon: true,
           noSemi: true,
@@ -30,9 +31,10 @@ describe('svgo', () => {
       })
 
       it('should return config path if found', async () => {
-        const config = await getMethod(resolveConfigFile, mode)(
-          path.join(__dirname, '__fixtures__/svgr'),
-        )
+        const config = await getMethod(
+          resolveConfigFile,
+          mode,
+        )(path.join(__dirname, '__fixtures__/svgr'))
         expect(config).toMatch(/__fixtures__(\/|\\)svgr(\/|\\)\.svgrrc$/)
       })
     })

packages/core/src/convert.test.js

@@ -311,7 +311,7 @@ describe('convert', () => {
       { memo: true },
     ]
 
-    test.each(configs)('should support options %#', async config => {
+    test.each(configs)('should support options %#', async (config) => {
       const result = await convertWithAllPlugins(svgBaseCode, config)
       expect(result).toMatchSnapshot()
     })

packages/hast-util-to-babel-ast/README.md

@@ -15,7 +15,7 @@ npm install --save-dev @svgr/hast-util-to-babel-ast
 ## Usage
 
 ```js
-import { parse } from 'svg-parser';
+import { parse } from 'svg-parser'
 import toBabelAST from '@svgr/hast-util-to-babel-ast'
 
 const hastTree = parse(`<svg></svg>`)

packages/hast-util-to-babel-ast/src/all.js

@@ -12,7 +12,7 @@ function all(h, parent) {
     values.push(result)
   }
 
-  return values.filter(node => node)
+  return values.filter((node) => node)
 }
 
 export default all

packages/hast-util-to-babel-ast/src/getAttributes.js

@@ -49,7 +49,7 @@ function getValue(key, value) {
   return t.stringLiteral(replaceSpaces(value))
 }
 
-const getAttributes = node => {
+const getAttributes = (node) => {
   const keys = Object.keys(node.properties)
   const attributes = []
   let index = -1

packages/hast-util-to-babel-ast/src/util.js

@@ -35,7 +35,7 @@ export function trimEnd(haystack, needle) {
 const KEBAB_REGEX = /[A-Z\u00C0-\u00D6\u00D8-\u00DE]/g
 
 export function kebabCase(str) {
-  return str.replace(KEBAB_REGEX, match => `-${match.toLowerCase()}`)
+  return str.replace(KEBAB_REGEX, (match) => `-${match.toLowerCase()}`)
 }
 
 const SPACES_REGEXP = /[\t\r\n\u0085\u2028\u2029]+/g

packages/parcel-plugin-svgr/src/index.test.js

@@ -2,10 +2,10 @@ import Bundler from 'parcel'
 import path from 'path'
 import plugin from '.'
 
-const getCode = bundle =>
+const getCode = (bundle) =>
   Array.from(bundle.assets)
-    .filter(asset => asset.id === 'icon.svg')
-    .map(asset => asset.generated)
+    .filter((asset) => asset.id === 'icon.svg')
+    .map((asset) => asset.generated)
 
 describe('parcel plugin', () => {
   it('should convert file', async () => {

packages/plugin-svgo/src/index.js

@@ -13,7 +13,7 @@ const explorer = cosmiconfigSync('svgo', {
     'svgo.config.js',
     '.svgo.yml',
   ],
-  transform: result => result && result.config,
+  transform: (result) => result && result.config,
   cache: true,
 })
 
@@ -58,7 +58,7 @@ function optimizeSync(svgstr, info) {
 
   let result
 
-  const optimizeOnceCallback = svgjs => {
+  const optimizeOnceCallback = (svgjs) => {
     if (svgjs.error) {
       throw svgjs.error
     }

packages/rollup/src/index.test.js

@@ -9,7 +9,7 @@ const compile = (plugins = [svgr()]) =>
     plugins,
   })
 
-const getCode = bundler =>
+const getCode = (bundler) =>
   bundler.cache.modules.find(
     ({ id }) =>
       id.includes('__fixtures__/simple/file.svg') ||

packages/webpack/src/index.js

@@ -40,7 +40,7 @@ function svgrLoader(source) {
     return exportMatches ? `export default ${exportMatches[1]}` : null
   })()
 
-  const tranformSvg = svg =>
+  const tranformSvg = (svg) =>
     convert(svg, options, {
       caller: {
         name: '@svgr/webpack',
@@ -49,12 +49,12 @@ function svgrLoader(source) {
       },
       filePath: this.resourcePath,
     })
-      .then(jsCode => {
+      .then((jsCode) => {
         if (!babel) return jsCode
         return transformAsync(jsCode, babelOptions).then(({ code }) => code)
       })
-      .then(result => callback(null, result))
-      .catch(err => callback(err))
+      .then((result) => callback(null, result))
+      .catch((err) => callback(err))
 
   if (previousExport) {
     readSvg().then(tranformSvg)

website/src/components/playground/Loading.js

@@ -22,15 +22,15 @@ const fadeIn = keyframes`
 const Loader = styled.div`
   flex: 1;
   animation: ${fadeIn} 1000ms ease-in infinite alternate;
-  background: url(${p => p.backgroundImage}) center no-repeat;
+  background: url(${(p) => p.backgroundImage}) center no-repeat;
   background-size: 30%;
 `
 
 export function Loading() {
   return (
     <StaticQuery
       query={QUERY}
-      render={data => (
+      render={(data) => (
         <Loader backgroundImage={data.logo.childImageSharp.fluid.src} />
       )}
     />