fix(IconLibrary): Export missing interface

TS compiler throws an error downstream. The interface is required when wrapping an icon as a styled-component: `styled(IconName)`.

packages/icon-library/.svgrrc.js

@@ -6,17 +6,15 @@ module.exports = {
   ) {
     const typeScriptTpl = template.smart({ plugins: ['jsx', 'typescript'] })
     return typeScriptTpl.ast`
-    import React, { SVGProps } from 'react';
-    import { SVGUniqueID } from 'react-svg-unique-id';
-    
-    interface SVGIconProps extends SVGProps<SVGSVGElement> {
-      size?: number
-      className?: string
-    }
-    const ${componentName} = ({ size = 16, ...props }: SVGIconProps) => (
-      <SVGUniqueID>{${jsx}}</SVGUniqueID>
-    );
-    export default ${componentName};
+      import React from 'react'
+      import { SVGUniqueID } from 'react-svg-unique-id';
+      import { SVGIconProps } from '../types'
+
+      const ${componentName} = ({ size = 16, ...props }: SVGIconProps) => (
+        <SVGUniqueID>{${jsx}}</SVGUniqueID>
+      );
+
+      export default ${componentName};
   `
   },
   svgoConfig: {

packages/icon-library/generate-exports.sh

@@ -6,14 +6,16 @@ IFS=$'\n\t'
 
 :> src/index.ts
 
+echo "export type { SVGIconProps } from './types'" >> src/index.ts
+
 for file in src/icons/*; do
   filename=$(basename -- "$file")
   filename_no_ext=${filename%%.*}
-  echo "export {default as Icon${filename_no_ext}} from './icons/${filename_no_ext}'" >> src/index.ts
+  echo "export {default as Icon${filename_no_ext} } from './icons/${filename_no_ext}'" >> src/index.ts
 done
 
 for file in src/silhouettes/*; do
   filename=$(basename -- "$file")
   filename_no_ext=${filename%%.*}
-  echo "export {default as Silhouette${filename_no_ext}} from './silhouettes/${filename_no_ext}'" >> src/index.ts
+  echo "export {default as Silhouette${filename_no_ext} } from './silhouettes/${filename_no_ext}'" >> src/index.ts
 done

packages/icon-library/src/types.ts

@@ -0,0 +1,6 @@
+import { SVGProps } from 'react'
+
+export interface SVGIconProps extends SVGProps<SVGSVGElement> {
+  size?: number
+  className?: string
+}