Merge pull request #96 from Orfium/feature/new-icon-refresh

Feature/new icon refresh
Orfium · Oct 5, 2020 · c504abd · c504abd
2 parents 7a6461b + 1558939
commit c504abd
Show file tree

Hide file tree

Showing 5 changed files with 52 additions and 2 deletions.
diff --git a/src/components/Icon/Icon.stories.mdx b/src/components/Icon/Icon.stories.mdx
@@ -29,7 +29,7 @@ All the icons available for use.
 <Preview>
   <Story name="Icons Gallery">
     <Stack>
-      {Object.keys(iconSelector).map((iconName) => (
+      {Object.keys(iconSelector).sort((a, b) => a.localeCompare(b)).map((iconName) => (
         <PresentComponent name={iconName} width={150}>
           <Icon name={iconName} color={'lightGray700'} />
         </PresentComponent>

diff --git a/src/components/Icon/__snapshots__/Icon.stories.storyshot b/src/components/Icon/__snapshots__/Icon.stories.storyshot
@@ -3258,6 +3258,43 @@ exports[`Storyshots Design System/Icon Icons Gallery 1`] = `
         </p>
       </div>
     </div>
+    <div
+      style={
+        Object {
+          "margin": 5,
+        }
+      }
+    >
+      <div
+        style={
+          Object {
+            "alignItems": "center",
+            "display": "flex",
+            "flexDirection": "column",
+            "justifyContent": "center",
+            "padding": "1rem",
+            "width": 150,
+          }
+        }
+      >
+        <span
+          className="css-1gnbc76-Icon"
+        >
+          <SvgrURL
+            className="css-hk02jy-Icon"
+          />
+        </span>
+        <p
+          style={
+            Object {
+              "paddingTop": "8px",
+            }
+          }
+        >
+          refresh
+        </p>
+      </div>
+    </div>
     <div
       style={
         Object {

diff --git a/src/components/Icon/assets/iconSelector.ts b/src/components/Icon/assets/iconSelector.ts
@@ -41,6 +41,7 @@ import DotsVerticalIcon from './dots-vertical.svg';
 import DownloadIcon from './download.svg';
 import ErrorIcon from './error.svg';
 import ExpensesIcon from './expenses.svg';
+import RefreshIcon from './refresh.svg';
 /**
  * In the current design system the collection of "FatArrowIcon"
  * has been renamed into "ArrowIcon" collection. For backwards
@@ -195,6 +196,7 @@ const iconSelector: { [key in AcceptedIconNames]: string } = {
   userAvatar: UserAvatarIcon, // "user" copy (smaller)
   writer: WriterIcon,
   youtube: YoutubeIcon,
+  refresh: RefreshIcon,
 };
 
 export default iconSelector;
diff --git a/src/components/Icon/assets/refresh.svg b/src/components/Icon/assets/refresh.svg
diff --git a/src/components/Icon/types.ts b/src/components/Icon/types.ts
@@ -91,4 +91,5 @@ export type AcceptedIconNames =
   | 'user'
   | 'userAvatar'
   | 'writer'
-  | 'youtube';
+  | 'youtube'
+  | 'refresh';