feat: create addIcon method to allow consumers to include their own…

… SVGs at runtime

.eslintrc

@@ -76,7 +76,7 @@
     "no-unused-vars": "off", // Handled via @typescript-eslint/no-unused-vars
     "no-useless-catch": "off",
     "no-useless-escape": "off",
-    "prettier/prettier": "error",
+    "prettier/prettier": "off",
     "react/display-name": "off",
     "react/jsx-curly-brace-presence": "error",
     "react/no-string-refs": "off",

.gitignore

@@ -1,5 +1,4 @@
 node_modules
-coverage
 .DS_STORE
 .idea
 .eslintcache
@@ -8,4 +7,4 @@ coverage
 docs-build/
 dist/
 coverage/
-.eslintcache
+stats.html

src/components/Icon/Icon.stories.tsx

@@ -21,7 +21,7 @@ export const Overview: Story = {
 };
 
 export const ColorsAndComposition: Story = {
-  render: (args) => (
+  render: () => (
     <div>
       <Icon size={64} name="facebook" style={{ color: '#4267B2' }} />
       <div

src/icons/index.ts

@@ -1,6 +1,6 @@
 // Iconify icon bundle configuration for all icons we support
 // Ref: https://docs.iconify.design/icon-components/bundles/
-import { addCollection, addIcon } from '@iconify/react/dist/offline';
+import { addCollection, addIcon as iconifyAddIcon } from '@iconify/react/dist/offline';
 
 import * as data from './data';
 import * as misc from './misc';
@@ -40,9 +40,19 @@ export function loadAllIcons() {
   // addIcon() is faster under the hood - less validation steps
 
   Object.keys(all).forEach((name) => {
-    addIcon(name, all[name].default);
+    iconifyAddIcon(name, all[name].default);
   });
 
   addCollection(ruiIcons);
   addCollection(ruiIllustrations);
 }
+
+export type IconDefinition = {
+  body: string;
+  width: number;
+  height: number;
+}
+
+export function addIcon(name: string, icon: IconDefinition) {
+  iconifyAddIcon(name, icon);
+}