feat(Icon): Add Trash Icon (#226)

* feat(Icon): Add Trash Icon

* Fix line length

Author: sophia-ma

src/docs/pages/components/DocsIcons.tsx

@@ -45,6 +45,7 @@ import {
   IconThumbsUp,
   IconTimes,
   IconTimesCircle,
+  IconTrash,
 } from '../../../icons';
 import { H1 } from '../../../text';
 import { Size } from '../../../utils/sizes';
@@ -96,13 +97,15 @@ const DocsIcons = ({}: DocsPageProps) => {
           <GridItem><IconChevronDown /><GridItemText>IconChevronDown</GridItemText></GridItem>
           <GridItem><IconChevronLeft /><GridItemText>IconChevronLeft</GridItemText></GridItem>
           <GridItem><IconChevronRight /><GridItemText>IconChevronRight</GridItemText></GridItem>
-          <GridItem><IconClose /><GridItemText>IconClose</GridItemText></GridItem>
           <GridItem><IconChevronUp /><GridItemText>IconChevronUp</GridItemText></GridItem>
+          <GridItem><IconClose /><GridItemText>IconClose</GridItemText></GridItem>
+          <GridItem><IconCode /><GridItemText>IconCode</GridItemText></GridItem>
           <GridItem><IconCog /><GridItemText>IconCog</GridItemText></GridItem>
           <GridItem><IconCuratr /><GridItemText>IconCuratr</GridItemText></GridItem>
           <GridItem><IconEdit /><GridItemText>IconEdit</GridItemText></GridItem>
           <GridItem><IconEllipsisV /><GridItemText>IconEllipsisV</GridItemText></GridItem>
           <GridItem><IconExternalLink /><GridItemText>IconExternalLink</GridItemText></GridItem>
+          <GridItem><IconEye /><GridItemText>IconEye</GridItemText></GridItem>
           <GridItem><IconFilter /><GridItemText>IconFilter</GridItemText></GridItem>
           <GridItem><IconFlagCheckered /><GridItemText>IconFlagCheckered</GridItemText></GridItem>
           <GridItem><IconGithub /><GridItemText>IconGithub</GridItemText></GridItem>
@@ -113,6 +116,7 @@ const DocsIcons = ({}: DocsPageProps) => {
           <GridItem><IconPen /><GridItemText>IconPen</GridItemText></GridItem>
           <GridItem><IconPlus /><GridItemText>IconPlus</GridItemText></GridItem>
           <GridItem><IconPlusCircle /><GridItemText>IconPlusCircle</GridItemText></GridItem>
+          <GridItem><IconProject /><GridItemText>IconProject</GridItemText></GridItem>
           <GridItem><IconSearch /><GridItemText>IconSearch</GridItemText></GridItem>
           <GridItem><IconStarHalf /><GridItemText>IconStarHalf</GridItemText></GridItem>
           <GridItem><IconStarRegular /><GridItemText>IconStarRegular</GridItemText></GridItem>
@@ -122,9 +126,7 @@ const DocsIcons = ({}: DocsPageProps) => {
           <GridItem><IconThumbsUp /><GridItemText>IconThumbsUp</GridItemText></GridItem>
           <GridItem><IconTimes /><GridItemText>IconTimes</GridItemText></GridItem>
           <GridItem><IconTimesCircle /><GridItemText>IconTimesCircle</GridItemText></GridItem>
-          <GridItem><IconCode /><GridItemText>IconCode</GridItemText></GridItem>
-          <GridItem><IconProject /><GridItemText>IconProject</GridItemText></GridItem>
-          <GridItem><IconEye /><GridItemText>IconEye</GridItemText></GridItem>
+          <GridItem><IconTrash /><GridItemText>IconTrash</GridItemText></GridItem>
         </Grid>
       </DocsPlayground>
     </>

src/icons/IconTrash.tsx

@@ -0,0 +1,14 @@
+import * as React from 'react';
+import createSVGIcon from '../utils/createSVGIcon';
+
+export default createSVGIcon(() => {
+  return (
+    <path d="M0 84V56c0-13.3 10.7-24 24-24h112l9.4-18.7c4-8.2 12.3-13.3 21.4-13.3h114.3c9.1
+    0 17.4 5.1 21.5 13.3L312 32h112c13.3 0 24 10.7 24 24v28c0 6.6-5.4 12-12 12H12C5.4 96 0
+    90.6 0 84zm416 56v324c0 26.5-21.5 48-48 48H80c-26.5 0-48-21.5-48-48V140c0-6.6 5.4-12
+    12-12h360c6.6 0 12 5.4 12 12zm-272 68c0-8.8-7.2-16-16-16s-16 7.2-16 16v224c0 8.8 7.2
+    16 16 16s16-7.2 16-16V208zm96 0c0-8.8-7.2-16-16-16s-16 7.2-16 16v224c0 8.8 7.2 16 16
+    16s16-7.2 16-16V208zm96 0c0-8.8-7.2-16-16-16s-16 7.2-16 16v224c0 8.8 7.2 16 16 16s16-7.2
+    16-16V208z"/>
+  );
+}, '0 0 448 512');

src/icons/index.ts

@@ -40,6 +40,7 @@ import IconThumbsDown from './IconThumbsDown';
 import IconThumbsUp from './IconThumbsUp';
 import IconTimes from './IconTimes';
 import IconTimesCircle from './IconTimesCircle';
+import IconTrash from './IconTrash';
 
 export {
   IconArrowDown,
@@ -84,4 +85,5 @@ export {
   IconThumbsUp,
   IconTimes,
   IconTimesCircle,
+  IconTrash,
 };