chore(icons): added new media icons and segment product icon (#2059)

* chore(icons): added new media icons and segment product icon * build(icons): try to fix empty icon build file Co-authored-by: Loreina Chew <lchew@twilio.com>
twilio-labs · Nov 23, 2021 · 10446cb · 10446cb
1 parent e7c2da3
commit 10446cb
Show file tree

Hide file tree

Showing 21 changed files with 559 additions and 2 deletions.
diff --git a/.changeset/breezy-kiwis-relate.md b/.changeset/breezy-kiwis-relate.md
@@ -0,0 +1,5 @@
+---
+'@twilio-paste/icons': minor
+---
+
+[paste-icons] Added ProductSegment, ScreenShare, StopScreenShare, LowerHand, RaiseHand, VideoOff, VideoOn, MicrophoneOff, MicrophoneOn
diff --git a/packages/paste-icons/build.icon-list.js b/packages/paste-icons/build.icon-list.js
diff --git a/packages/paste-icons/json/icons.json b/packages/paste-icons/json/icons.json
diff --git a/packages/paste-icons/src/LowerHandIcon.tsx b/packages/paste-icons/src/LowerHandIcon.tsx
@@ -0,0 +1,65 @@
+/**
+ * This file was automatically generated with @twilio-labs/svg-to-react
+ */
+import * as React from 'react';
+import {useUID} from '@twilio-paste/uid-library';
+import {IconWrapper} from './helpers/IconWrapper';
+import type {IconWrapperProps} from './helpers/IconWrapper';
+
+export interface LowerHandIconProps extends IconWrapperProps {
+  title?: string;
+  decorative: boolean;
+}
+
+const LowerHandIcon: React.FC<LowerHandIconProps> = ({
+  as,
+  display,
+  element = 'ICON',
+  size,
+  color,
+  title,
+  decorative,
+}) => {
+  const titleId = `LowerHandIcon-${useUID()}`;
+
+  if (!decorative && title == null) {
+    throw new Error('[LowerHandIcon]: Missing a title for non-decorative icon.');
+  }
+
+  return (
+    <IconWrapper as={as} display={display} element={element} size={size} color={color}>
+      <svg
+        role="img"
+        aria-hidden={decorative}
+        width="100%"
+        height="100%"
+        fill="none"
+        viewBox="0 0 20 20"
+        aria-labelledby={titleId}
+      >
+        {title ? <title id={titleId}>{title}</title> : null}
+        <path
+          fill="currentColor"
+          fillRule="evenodd"
+          d="M15.5 5h1v9h-1V5zm-1.425 11.975c.874-.656 1.425-1.632 1.425-2.975h1c0 1.657-.7 2.93-1.825 3.775-1.11.832-2.6 1.225-4.175 1.225v-.5.5h-.044l-.118-.002a17.489 17.489 0 01-1.775-.127 9.93 9.93 0 01-1.582-.314c-.491-.147-.995-.364-1.335-.703-.813-.814-1.127-1.348-1.365-1.755a6.653 6.653 0 00-.197-.322l.832-.554c.092.138.169.268.246.4.233.395.476.808 1.192 1.523.16.161.469.32.915.453.431.13.933.22 1.418.28a16.546 16.546 0 001.67.12h.108l.027.001h.007m3.576-1.025c-.89.668-2.15 1.025-3.575 1.025zM5.954 2.513A1.75 1.75 0 017.192 2v.5l.003-.5a1.75 1.75 0 011.738 1.75v4.375a.5.5 0 11-1 0V3.75A.75.75 0 007.19 3a.75.75 0 00-.748.75v8.125a.5.5 0 01-.813.39l-2.033-1.624-.001-.002a.784.784 0 00-1.145 1.042v.001l1.199 1.79a.5.5 0 01-.831.556l-1.202-1.794a1.783 1.783 0 010-1.968m0 0a1.785 1.785 0 012.605-.406l1.22.975V3.75c0-.464.185-.91.513-1.237"
+          clipRule="evenodd"
+        />
+        <path
+          fill="currentColor"
+          fillRule="evenodd"
+          d="M9.022.88a1.75 1.75 0 012.411 1.62v1.25a.5.5 0 11-1 0V2.5a.75.75 0 10-1.5 0v1.25a.5.5 0 11-1 0V2.5A1.75 1.75 0 019.022.88z"
+          clipRule="evenodd"
+        />
+        <path
+          fill="currentColor"
+          fillRule="evenodd"
+          d="M10.954 2.513A1.75 1.75 0 0112.192 2v.5l.003-.5a1.75 1.75 0 011.738 1.75.5.5 0 11-1 0A.75.75 0 0012.19 3a.75.75 0 00-.748.75v1.875a.5.5 0 01-1 0V3.75c0-.464.184-.91.512-1.237zm7.848-.36a.5.5 0 01-.014.707L1.913 19.11a.5.5 0 01-.693-.72L18.095 2.14a.5.5 0 01.707.013z"
+          clipRule="evenodd"
+        />
+      </svg>
+    </IconWrapper>
+  );
+};
+
+LowerHandIcon.displayName = 'LowerHandIcon';
+export {LowerHandIcon};
diff --git a/packages/paste-icons/src/MicrophoneOffIcon.tsx b/packages/paste-icons/src/MicrophoneOffIcon.tsx
@@ -0,0 +1,71 @@
+/**
+ * This file was automatically generated with @twilio-labs/svg-to-react
+ */
+import * as React from 'react';
+import {useUID} from '@twilio-paste/uid-library';
+import {IconWrapper} from './helpers/IconWrapper';
+import type {IconWrapperProps} from './helpers/IconWrapper';
+
+export interface MicrophoneOffIconProps extends IconWrapperProps {
+  title?: string;
+  decorative: boolean;
+}
+
+const MicrophoneOffIcon: React.FC<MicrophoneOffIconProps> = ({
+  as,
+  display,
+  element = 'ICON',
+  size,
+  color,
+  title,
+  decorative,
+}) => {
+  const titleId = `MicrophoneOffIcon-${useUID()}`;
+
+  if (!decorative && title == null) {
+    throw new Error('[MicrophoneOffIcon]: Missing a title for non-decorative icon.');
+  }
+
+  return (
+    <IconWrapper as={as} display={display} element={element} size={size} color={color}>
+      <svg
+        role="img"
+        aria-hidden={decorative}
+        width="100%"
+        height="100%"
+        fill="none"
+        viewBox="0 0 20 20"
+        aria-labelledby={titleId}
+      >
+        {title ? <title id={titleId}>{title}</title> : null}
+        <path
+          fill="currentColor"
+          fillRule="evenodd"
+          d="M17.78 2.246a.5.5 0 010 .708L2.924 17.81a.5.5 0 01-.707-.707L17.073 2.246a.5.5 0 01.708 0z"
+          clipRule="evenodd"
+        />
+        <path
+          fill="currentColor"
+          fillRule="evenodd"
+          d="M9.998 3.1a2.357 2.357 0 00-2.357 2.357v4.001a2.346 2.346 0 00.942 1.884.5.5 0 01-.598.801 3.345 3.345 0 01-1.344-2.686v-4a3.357 3.357 0 016.715 0v1.714a.5.5 0 11-1 0V5.457A2.357 2.357 0 009.999 3.1zm2.802 7.091a.5.5 0 01.247.663 3.357 3.357 0 01-1.705 1.678.5.5 0 11-.401-.916c.53-.232.956-.652 1.197-1.178a.5.5 0 01.663-.247z"
+          clipRule="evenodd"
+        />
+        <path
+          fill="currentColor"
+          fillRule="evenodd"
+          d="M15.712 9.529a.5.5 0 01.5.498 5.631 5.631 0 01-5.643 5.644H9.44h.119-.132.013a6.503 6.503 0 01-.68 0 .5.5 0 11.054-.999 5.52 5.52 0 00.613 0h1.144a4.63 4.63 0 004.642-4.642.5.5 0 01.499-.501zm-11.437 0a.5.5 0 00-.5.498 5.632 5.632 0 001.649 3.995.5.5 0 10.707-.707 4.631 4.631 0 01-1.357-3.285.5.5 0 00-.499-.501z"
+          clipRule="evenodd"
+        />
+        <path
+          fill="currentColor"
+          fillRule="evenodd"
+          d="M9.999 14.671a.5.5 0 01.5.5v2.286a.5.5 0 11-1 0v-2.286a.5.5 0 01.5-.5z"
+          clipRule="evenodd"
+        />
+      </svg>
+    </IconWrapper>
+  );
+};
+
+MicrophoneOffIcon.displayName = 'MicrophoneOffIcon';
+export {MicrophoneOffIcon};
diff --git a/packages/paste-icons/src/MicrophoneOnIcon.tsx b/packages/paste-icons/src/MicrophoneOnIcon.tsx
@@ -0,0 +1,57 @@
+/**
+ * This file was automatically generated with @twilio-labs/svg-to-react
+ */
+import * as React from 'react';
+import {useUID} from '@twilio-paste/uid-library';
+import {IconWrapper} from './helpers/IconWrapper';
+import type {IconWrapperProps} from './helpers/IconWrapper';
+
+export interface MicrophoneOnIconProps extends IconWrapperProps {
+  title?: string;
+  decorative: boolean;
+}
+
+const MicrophoneOnIcon: React.FC<MicrophoneOnIconProps> = ({
+  as,
+  display,
+  element = 'ICON',
+  size,
+  color,
+  title,
+  decorative,
+}) => {
+  const titleId = `MicrophoneOnIcon-${useUID()}`;
+
+  if (!decorative && title == null) {
+    throw new Error('[MicrophoneOnIcon]: Missing a title for non-decorative icon.');
+  }
+
+  return (
+    <IconWrapper as={as} display={display} element={element} size={size} color={color}>
+      <svg
+        role="img"
+        aria-hidden={decorative}
+        width="100%"
+        height="100%"
+        fill="none"
+        viewBox="0 0 20 20"
+        aria-labelledby={titleId}
+      >
+        {title ? <title id={titleId}>{title}</title> : null}
+        <path
+          fill="currentColor"
+          fillRule="evenodd"
+          d="M10 3.071A2.357 2.357 0 007.643 5.43v4a2.357 2.357 0 104.714 0v-4A2.357 2.357 0 0010 3.07zm-2.374-.016a3.357 3.357 0 015.731 2.374v4a3.357 3.357 0 01-6.714 0v-4c0-.89.354-1.745.983-2.374z"
+          clipRule="evenodd"
+        />
+        <path
+          fill="currentColor"
+          d="M12.732 15.217a5.63 5.63 0 01-1.947.422v.004H10.5v1.785a.5.5 0 11-1 0v-1.785h-.071v-.004A5.63 5.63 0 014 10a.5.5 0 011 0 4.631 4.631 0 004.62 4.642h.974A4.632 4.632 0 0015.214 10a.5.5 0 111-.002 5.632 5.632 0 01-3.482 5.218z"
+        />
+      </svg>
+    </IconWrapper>
+  );
+};
+
+MicrophoneOnIcon.displayName = 'MicrophoneOnIcon';
+export {MicrophoneOnIcon};
diff --git a/packages/paste-icons/src/ProductSegmentIcon.tsx b/packages/paste-icons/src/ProductSegmentIcon.tsx
@@ -0,0 +1,53 @@
+/**
+ * This file was automatically generated with @twilio-labs/svg-to-react
+ */
+import * as React from 'react';
+import {useUID} from '@twilio-paste/uid-library';
+import {IconWrapper} from './helpers/IconWrapper';
+import type {IconWrapperProps} from './helpers/IconWrapper';
+
+export interface ProductSegmentIconProps extends IconWrapperProps {
+  title?: string;
+  decorative: boolean;
+}
+
+const ProductSegmentIcon: React.FC<ProductSegmentIconProps> = ({
+  as,
+  display,
+  element = 'ICON',
+  size,
+  color,
+  title,
+  decorative,
+}) => {
+  const titleId = `ProductSegmentIcon-${useUID()}`;
+
+  if (!decorative && title == null) {
+    throw new Error('[ProductSegmentIcon]: Missing a title for non-decorative icon.');
+  }
+
+  return (
+    <IconWrapper as={as} display={display} element={element} size={size} color={color}>
+      <svg
+        role="img"
+        aria-hidden={decorative}
+        width="100%"
+        height="100%"
+        fill="none"
+        viewBox="0 0 20 20"
+        aria-labelledby={titleId}
+      >
+        {title ? <title id={titleId}>{title}</title> : null}
+        <path
+          fill="currentColor"
+          fillRule="evenodd"
+          d="M3.559 8.273a.304.304 0 00.367-.207 6.38 6.38 0 017.456-4.294.3.3 0 00.35-.218l.264-.984a.303.303 0 00-.23-.374 8.003 8.003 0 00-9.404 5.438.3.3 0 00.212.375l.985.264zm4.964-1.11h8.745c.167 0 .302.135.302.301v1.019a.302.302 0 01-.302.301H8.523a.302.302 0 01-.302-.301V7.464c0-.166.135-.301.302-.301zm-5.785 4.053h8.746c.166 0 .301.135.301.301v1.019a.302.302 0 01-.301.301H2.738a.302.302 0 01-.302-.301v-1.019c0-.166.135-.301.302-.301zm13.488.54a.304.304 0 01.225-.029l.985.264a.299.299 0 01.212.375 8.002 8.002 0 01-9.405 5.438.306.306 0 01-.236-.252.303.303 0 01.007-.122l.264-.984a.3.3 0 01.35-.218 6.38 6.38 0 007.456-4.294.304.304 0 01.142-.177zm-1.6-6.374a.89.89 0 100-1.778.89.89 0 000 1.778zM6.273 15.507a.89.89 0 11-1.779 0 .89.89 0 011.779 0z"
+          clipRule="evenodd"
+        />
+      </svg>
+    </IconWrapper>
+  );
+};
+
+ProductSegmentIcon.displayName = 'ProductSegmentIcon';
+export {ProductSegmentIcon};