feat: add delete and download icons and SVGs (#465)

Co-authored-by: Sarah Li <sali@twilio.com>

packages/paste-icons/src/DeleteIcon.tsx

@@ -0,0 +1,37 @@
+/**
+ * This file was automatically generated with @twilio-labs/svg-to-react
+ */
+import * as React from 'react';
+import {UID} from 'react-uid';
+import {IconWrapper, IconWrapperProps} from './helpers/IconWrapper';
+
+export interface DeleteIconProps extends IconWrapperProps {
+  title?: string;
+  decorative: boolean;
+}
+
+const DeleteIcon: React.FC<DeleteIconProps> = ({as, size, iconColor, title, decorative}) => {
+  if (!decorative && title == null) {
+    throw new Error('[DeleteIcon]: Missing a title for non-decorative icon.');
+  }
+
+  return (
+    <IconWrapper as={as} size={size} iconColor={iconColor}>
+      <UID>
+        {uid => (
+          <svg role="img" aria-hidden={decorative} aria-labelledby={uid} width="100%" height="100%" viewBox="0 0 24 24">
+            {title ? <title id={uid}>{title}</title> : null}
+            <path
+              fill="currentColor"
+              fillRule="evenodd"
+              d="M14.25 4c.966 0 1.75.784 1.75 1.75L15.999 7H19.5a.5.5 0 01.09.992L19.5 8h-1.501L18 18.25a1.75 1.75 0 01-1.606 1.744L16.25 20H7.74C6.774 20 6 19.217 6 18.25L5.999 8H4.5a.5.5 0 01-.09-.992L4.5 7h3.499L8 5.75a1.75 1.75 0 011.606-1.744L9.75 4zm2.749 4h-10L7 18.25c0 .383.276.694.64.743l.1.007h8.51a.75.75 0 00.75-.75L16.999 8zM10.5 11a.5.5 0 01.492.41l.008.09v4a.5.5 0 01-.992.09L10 15.5v-4a.5.5 0 01.5-.5zm3 0a.5.5 0 01.492.41l.008.09v4a.5.5 0 01-.992.09L13 15.5v-4a.5.5 0 01.5-.5zm.75-6h-4.5a.75.75 0 00-.75.75L8.999 7h6L15 5.75a.75.75 0 00-.648-.743L14.25 5z"
+            />
+          </svg>
+        )}
+      </UID>
+    </IconWrapper>
+  );
+};
+
+DeleteIcon.displayName = 'DeleteIcon';
+export {DeleteIcon};

packages/paste-icons/src/DownloadIcon.tsx

@@ -0,0 +1,37 @@
+/**
+ * This file was automatically generated with @twilio-labs/svg-to-react
+ */
+import * as React from 'react';
+import {UID} from 'react-uid';
+import {IconWrapper, IconWrapperProps} from './helpers/IconWrapper';
+
+export interface DownloadIconProps extends IconWrapperProps {
+  title?: string;
+  decorative: boolean;
+}
+
+const DownloadIcon: React.FC<DownloadIconProps> = ({as, size, iconColor, title, decorative}) => {
+  if (!decorative && title == null) {
+    throw new Error('[DownloadIcon]: Missing a title for non-decorative icon.');
+  }
+
+  return (
+    <IconWrapper as={as} size={size} iconColor={iconColor}>
+      <UID>
+        {uid => (
+          <svg role="img" aria-hidden={decorative} aria-labelledby={uid} width="100%" height="100%" viewBox="0 0 24 24">
+            {title ? <title id={uid}>{title}</title> : null}
+            <path
+              fill="currentColor"
+              fillRule="evenodd"
+              d="M18.5 19a.5.5 0 01.09.992L18.5 20h-13a.5.5 0 01-.09-.992L5.5 19h13zM12 6a.5.5 0 01.492.41l.008.09v8.842l2.296-2.296a.5.5 0 01.638-.057l.07.057a.5.5 0 01.057.638l-.057.07-3.125 3.125a.5.5 0 01-.638.057l-.07-.057-3.125-3.125a.5.5 0 01.638-.765l.07.057 2.246 2.246V6.5A.5.5 0 0112 6z"
+            />
+          </svg>
+        )}
+      </UID>
+    </IconWrapper>
+  );
+};
+
+DownloadIcon.displayName = 'DownloadIcon';
+export {DownloadIcon};

packages/paste-icons/stories/__IconList.tsx

@@ -8,6 +8,8 @@ import {ChevronDownIcon} from '../src/ChevronDownIcon';
 import {ChevronUpIcon} from '../src/ChevronUpIcon';
 import {CloseIcon} from '../src/CloseIcon';
 import {CopyIcon} from '../src/CopyIcon';
+import {DeleteIcon} from '../src/DeleteIcon';
+import {DownloadIcon} from '../src/DownloadIcon';
 import {ErrorIcon} from '../src/ErrorIcon';
 import {InformationIcon} from '../src/InformationIcon';
 import {LinkExternalIcon} from '../src/LinkExternalIcon';
@@ -33,6 +35,8 @@ const IconList: React.FC<IconProps> = props => (
 <StoryIcon><ChevronUpIcon {...props} /><Text as="p" textColor="currentColor">ChevronUpIcon</Text></StoryIcon>
 <StoryIcon><CloseIcon {...props} /><Text as="p" textColor="currentColor">CloseIcon</Text></StoryIcon>
 <StoryIcon><CopyIcon {...props} /><Text as="p" textColor="currentColor">CopyIcon</Text></StoryIcon>
+<StoryIcon><DeleteIcon {...props} /><Text as="p" textColor="currentColor">DeleteIcon</Text></StoryIcon>
+<StoryIcon><DownloadIcon {...props} /><Text as="p" textColor="currentColor">DownloadIcon</Text></StoryIcon>
 <StoryIcon><ErrorIcon {...props} /><Text as="p" textColor="currentColor">ErrorIcon</Text></StoryIcon>
 <StoryIcon><InformationIcon {...props} /><Text as="p" textColor="currentColor">InformationIcon</Text></StoryIcon>
 <StoryIcon><LinkExternalIcon {...props} /><Text as="p" textColor="currentColor">LinkExternalIcon</Text></StoryIcon>