@transferwise/icons 3.5.1 → 3.7.0

package/build/components/search.tsx

@@ -0,0 +1,48 @@
+// This is an automatically generated file, please don't edit it
+import { IconSize } from '../types';
+
+export interface SearchIconProps {
+  size?: IconSize;
+  filled?: boolean;
+  className?: string;
+  title?: string;
+  ['data-testid']?: string;
+}
+
+export const Search: React.FunctionComponent<SearchIconProps> = ({
+  size = 16,
+  className = undefined,
+  title = undefined,
+  filled = undefined,
+  ...restProps
+}) => {
+  if (filled) {
+    console.warn(
+      '<Search filled /> is now deprecated, please use <SearchFill /> or refer to https://transferwise.github.io/icons/ for more info.',
+    );
+  }
+
+  return (
+    <span
+      className={`tw-icon tw-icon-search ${className ? className : ''}`}
+      aria-hidden={!title ? 'true' : undefined}
+      role={!title ? 'presentation' : undefined}
+      data-testid={restProps['data-testid'] || 'search-icon'}
+    >
+      <svg
+        width={String(size)}
+        height={String(size)}
+        fill="currentColor"
+        focusable="false"
+        viewBox="0 0 24 24"
+      >
+        {(Number(size) === 16 || Number(size) === 24 || Number(size) === 32) && (
+          <>
+            <path d="m20.786 19.543-4.029-4.029c1.072-1.328 1.672-3 1.672-4.8C18.429 6.471 14.957 3 10.714 3S3 6.471 3 10.714s3.471 7.715 7.714 7.715c1.8 0 3.472-.643 4.8-1.672l4.029 4.029 1.243-1.243Zm-10.029-2.829c-3.3 0-6-2.7-6-6s2.7-6 6-6 6 2.7 6 6-2.7 6-6 6Z" />
+          </>
+        )}
+      </svg>
+      {title && <span className="sr-only">{title}</span>}
+    </span>
+  );
+};

package/build/components/send.tsx

@@ -0,0 +1,48 @@
+// This is an automatically generated file, please don't edit it
+import { IconSize } from '../types';
+
+export interface SendIconProps {
+  size?: IconSize;
+  filled?: boolean;
+  className?: string;
+  title?: string;
+  ['data-testid']?: string;
+}
+
+export const Send: React.FunctionComponent<SendIconProps> = ({
+  size = 16,
+  className = undefined,
+  title = undefined,
+  filled = undefined,
+  ...restProps
+}) => {
+  if (filled) {
+    console.warn(
+      '<Send filled /> is now deprecated, please use <SendFill /> or refer to https://transferwise.github.io/icons/ for more info.',
+    );
+  }
+
+  return (
+    <span
+      className={`tw-icon tw-icon-send ${className ? className : ''}`}
+      aria-hidden={!title ? 'true' : undefined}
+      role={!title ? 'presentation' : undefined}
+      data-testid={restProps['data-testid'] || 'send-icon'}
+    >
+      <svg
+        width={String(size)}
+        height={String(size)}
+        fill="currentColor"
+        focusable="false"
+        viewBox="0 0 24 24"
+      >
+        {(Number(size) === 16 || Number(size) === 24 || Number(size) === 32) && (
+          <>
+            <path d="M21.343 10.543 12.77 1.972a.829.829 0 0 0-1.2 0L3 10.543l1.2 1.2 7.114-7.114v17.657h1.715V4.63l7.114 7.114 1.2-1.2Z" />
+          </>
+        )}
+      </svg>
+      {title && <span className="sr-only">{title}</span>}
+    </span>
+  );
+};

package/build/components/settings.tsx

@@ -0,0 +1,52 @@
+// This is an automatically generated file, please don't edit it
+import { IconSize } from '../types';
+
+export interface SettingsIconProps {
+  size?: IconSize;
+  filled?: boolean;
+  className?: string;
+  title?: string;
+  ['data-testid']?: string;
+}
+
+export const Settings: React.FunctionComponent<SettingsIconProps> = ({
+  size = 16,
+  className = undefined,
+  title = undefined,
+  filled = undefined,
+  ...restProps
+}) => {
+  if (filled) {
+    console.warn(
+      '<Settings filled /> is now deprecated, please use <SettingsFill /> or refer to https://transferwise.github.io/icons/ for more info.',
+    );
+  }
+
+  return (
+    <span
+      className={`tw-icon tw-icon-settings ${className ? className : ''}`}
+      aria-hidden={!title ? 'true' : undefined}
+      role={!title ? 'presentation' : undefined}
+      data-testid={restProps['data-testid'] || 'settings-icon'}
+    >
+      <svg
+        width={String(size)}
+        height={String(size)}
+        fill="currentColor"
+        focusable="false"
+        viewBox="0 0 24 24"
+      >
+        {(Number(size) === 16 || Number(size) === 24 || Number(size) === 32) && (
+          <>
+            <path
+              fillRule="evenodd"
+              d="m20.34 13.456 1.371.814c.215.129.343.3.343.6.043.214.043.429-.085.643l-1.972 3.386c-.128.171-.3.342-.514.385-.215.043-.429.043-.643-.085l-1.372-.815c-.728.643-1.585 1.115-2.528 1.457v1.586a.86.86 0 0 1-.857.857H10.14a.86.86 0 0 1-.857-.857v-1.671a8.816 8.816 0 0 1-2.529-1.457l-1.371.814c-.172.128-.429.128-.643.086-.214-.043-.386-.172-.514-.386l-1.972-3.386c-.086-.171-.128-.428-.086-.643.043-.214.172-.385.386-.514l1.372-.814a8.369 8.369 0 0 1-.129-1.457c0-.472.043-.943.129-1.458l-1.372-.814c-.171-.128-.343-.3-.386-.514-.042-.214-.042-.429.086-.643l2.057-3.471c.129-.172.3-.343.515-.386.214-.043.428-.043.642.086l1.372.814c.728-.643 1.586-1.114 2.528-1.457V2.57a.86.86 0 0 1 .858-.857h3.942a.86.86 0 0 1 .858.857v1.629a8.82 8.82 0 0 1 2.528 1.457l1.372-.815c.171-.128.428-.128.643-.085.214.043.385.171.514.385L22.01 8.57c.129.171.129.429.086.643-.043.214-.171.386-.386.514l-1.371.814c.086.472.128.986.128 1.458 0 .471-.042.942-.128 1.457Zm-1.586-1.457c0-.558-.085-1.115-.214-1.672-.086-.386.043-.771.471-.986l1.2-.685-1.114-1.929-1.2.686a.838.838 0 0 1-1.028-.129c-.815-.771-1.8-1.371-2.915-1.671a.826.826 0 0 1-.643-.814V3.427h-2.228v1.414a.826.826 0 0 1-.643.815 6.43 6.43 0 0 0-2.914 1.671.838.838 0 0 1-1.029.129l-1.2-.686-1.114 1.929 1.2.685c.3.172.471.557.385.943A7.446 7.446 0 0 0 5.554 12c0 .557.086 1.114.214 1.671.129.343-.042.729-.385.943l-1.2.686 1.114 1.928 1.114-.643a.838.838 0 0 1 1.029.129c.814.771 1.8 1.371 2.914 1.671a.826.826 0 0 1 .643.815v1.371h2.229v-1.414c0-.386.257-.729.642-.814a6.43 6.43 0 0 0 2.915-1.672.838.838 0 0 1 1.028-.129l1.2.686 1.115-1.928-1.2-.686c-.3-.171-.472-.557-.386-.943a7.444 7.444 0 0 0 .214-1.671Zm-10.886 0a4.298 4.298 0 0 1 4.286-4.286 4.298 4.298 0 0 1 4.286 4.286 4.298 4.298 0 0 1-4.286 4.285A4.298 4.298 0 0 1 7.868 12Zm1.715 0a2.579 2.579 0 0 0 2.571 2.571 2.579 2.579 0 0 0 2.572-2.571 2.579 2.579 0 0 0-2.572-2.572A2.579 2.579 0 0 0 9.583 12Z"
+              clipRule="evenodd"
+            />
+          </>
+        )}
+      </svg>
+      {title && <span className="sr-only">{title}</span>}
+    </span>
+  );
+};

package/build/components/share-android.tsx

@@ -0,0 +1,48 @@
+// This is an automatically generated file, please don't edit it
+import { IconSize } from '../types';
+
+export interface ShareAndroidIconProps {
+  size?: IconSize;
+  filled?: boolean;
+  className?: string;
+  title?: string;
+  ['data-testid']?: string;
+}
+
+export const ShareAndroid: React.FunctionComponent<ShareAndroidIconProps> = ({
+  size = 16,
+  className = undefined,
+  title = undefined,
+  filled = undefined,
+  ...restProps
+}) => {
+  if (filled) {
+    console.warn(
+      '<ShareAndroid filled /> is now deprecated, please use <ShareAndroidFill /> or refer to https://transferwise.github.io/icons/ for more info.',
+    );
+  }
+
+  return (
+    <span
+      className={`tw-icon tw-icon-share-android ${className ? className : ''}`}
+      aria-hidden={!title ? 'true' : undefined}
+      role={!title ? 'presentation' : undefined}
+      data-testid={restProps['data-testid'] || 'share-android-icon'}
+    >
+      <svg
+        width={String(size)}
+        height={String(size)}
+        fill="currentColor"
+        focusable="false"
+        viewBox="0 0 24 24"
+      >
+        {(Number(size) === 16 || Number(size) === 24 || Number(size) === 32) && (
+          <>
+            <path d="M18.429 15.43c-.986 0-1.886.428-2.529 1.113l-6.986-3.771c.043-.257.086-.471.086-.729 0-.257-.043-.514-.086-.728L15.9 7.543c.643.6 1.543 1.029 2.529 1.029a3.439 3.439 0 0 0 3.428-3.429 3.439 3.439 0 0 0-3.428-3.428A3.439 3.439 0 0 0 15 5.143c0 .3.043.558.086.815L8.143 9.729A3.375 3.375 0 0 0 5.57 8.572a3.439 3.439 0 0 0-3.428 3.429 3.439 3.439 0 0 0 3.428 3.428c1.029 0 1.929-.471 2.572-1.157l6.986 3.771a2.493 2.493 0 0 0-.129.815 3.439 3.439 0 0 0 3.429 3.428 3.439 3.439 0 0 0 3.428-3.428 3.439 3.439 0 0 0-3.428-3.429Zm0-12a1.72 1.72 0 0 1 1.714 1.713 1.72 1.72 0 0 1-1.714 1.715 1.72 1.72 0 0 1-1.715-1.715A1.72 1.72 0 0 1 18.43 3.43ZM5.57 13.714A1.72 1.72 0 0 1 3.857 12a1.72 1.72 0 0 1 1.714-1.715 1.72 1.72 0 0 1 1.715 1.715 1.72 1.72 0 0 1-1.715 1.714Zm12.858 6.857a1.72 1.72 0 0 1-1.715-1.714 1.72 1.72 0 0 1 1.715-1.715 1.72 1.72 0 0 1 1.714 1.715 1.72 1.72 0 0 1-1.714 1.714Z" />
+          </>
+        )}
+      </svg>
+      {title && <span className="sr-only">{title}</span>}
+    </span>
+  );
+};

package/build/components/share-ios.tsx

@@ -0,0 +1,52 @@
+// This is an automatically generated file, please don't edit it
+import { IconSize } from '../types';
+
+export interface ShareIosIconProps {
+  size?: IconSize;
+  filled?: boolean;
+  className?: string;
+  title?: string;
+  ['data-testid']?: string;
+}
+
+export const ShareIos: React.FunctionComponent<ShareIosIconProps> = ({
+  size = 16,
+  className = undefined,
+  title = undefined,
+  filled = undefined,
+  ...restProps
+}) => {
+  if (filled) {
+    console.warn(
+      '<ShareIos filled /> is now deprecated, please use <ShareIosFill /> or refer to https://transferwise.github.io/icons/ for more info.',
+    );
+  }
+
+  return (
+    <span
+      className={`tw-icon tw-icon-share-ios ${className ? className : ''}`}
+      aria-hidden={!title ? 'true' : undefined}
+      role={!title ? 'presentation' : undefined}
+      data-testid={restProps['data-testid'] || 'share-ios-icon'}
+    >
+      <svg
+        width={String(size)}
+        height={String(size)}
+        fill="currentColor"
+        focusable="false"
+        viewBox="0 0 24 24"
+      >
+        {(Number(size) === 16 || Number(size) === 24 || Number(size) === 32) && (
+          <>
+            <path
+              fillRule="evenodd"
+              d="M11.143 17.573V4.2L6.514 8.787l-1.2-1.2L11.4 1.544a.829.829 0 0 1 1.2 0l6.043 6.043-1.2 1.2-4.586-4.586v13.372h-1.714Zm9.428 3.424v-8.571h1.715v9.428a.86.86 0 0 1-.857.858H2.572a.86.86 0 0 1-.858-.858v-9.428H3.43v8.571H20.57Z"
+              clipRule="evenodd"
+            />
+          </>
+        )}
+      </svg>
+      {title && <span className="sr-only">{title}</span>}
+    </span>
+  );
+};

package/build/components/shield.tsx

@@ -0,0 +1,48 @@
+// This is an automatically generated file, please don't edit it
+import { IconSize } from '../types';
+
+export interface ShieldIconProps {
+  size?: IconSize;
+  filled?: boolean;
+  className?: string;
+  title?: string;
+  ['data-testid']?: string;
+}
+
+export const Shield: React.FunctionComponent<ShieldIconProps> = ({
+  size = 16,
+  className = undefined,
+  title = undefined,
+  filled = undefined,
+  ...restProps
+}) => {
+  if (filled) {
+    console.warn(
+      '<Shield filled /> is now deprecated, please use <ShieldFill /> or refer to https://transferwise.github.io/icons/ for more info.',
+    );
+  }
+
+  return (
+    <span
+      className={`tw-icon tw-icon-shield ${className ? className : ''}`}
+      aria-hidden={!title ? 'true' : undefined}
+      role={!title ? 'presentation' : undefined}
+      data-testid={restProps['data-testid'] || 'shield-icon'}
+    >
+      <svg
+        width={String(size)}
+        height={String(size)}
+        fill="currentColor"
+        focusable="false"
+        viewBox="0 0 24 24"
+      >
+        {(Number(size) === 16 || Number(size) === 24 || Number(size) === 32) && (
+          <>
+            <path d="M21.521 5.015c-.042-.429-.428-.729-.857-.729-5.443 0-7.971-2.314-7.971-2.314a.829.829 0 0 0-1.2 0S9.05 4.286 3.52 4.286c-.428 0-.814.3-.857.729 0 .128-1.671 13.586 9.172 17.228.085.043.171.043.257.043s.171 0 .257-.043c10.843-3.6 9.171-17.057 9.171-17.228Zm-2.142 6.857c-1.029 4.414-3.515 7.329-7.286 8.657-3.814-1.371-6.257-4.286-7.286-8.657-.6-2.443-.557-4.757-.471-5.871 4.2-.172 6.728-1.543 7.8-2.315 1.071.772 3.6 2.143 7.8 2.315 0 1.114.043 3.385-.557 5.871Z" />
+          </>
+        )}
+      </svg>
+      {title && <span className="sr-only">{title}</span>}
+    </span>
+  );
+};

package/build/components/shopping-bag.tsx

@@ -0,0 +1,52 @@
+// This is an automatically generated file, please don't edit it
+import { IconSize } from '../types';
+
+export interface ShoppingBagIconProps {
+  size?: IconSize;
+  filled?: boolean;
+  className?: string;
+  title?: string;
+  ['data-testid']?: string;
+}
+
+export const ShoppingBag: React.FunctionComponent<ShoppingBagIconProps> = ({
+  size = 16,
+  className = undefined,
+  title = undefined,
+  filled = undefined,
+  ...restProps
+}) => {
+  if (filled) {
+    console.warn(
+      '<ShoppingBag filled /> is now deprecated, please use <ShoppingBagFill /> or refer to https://transferwise.github.io/icons/ for more info.',
+    );
+  }
+
+  return (
+    <span
+      className={`tw-icon tw-icon-shopping-bag ${className ? className : ''}`}
+      aria-hidden={!title ? 'true' : undefined}
+      role={!title ? 'presentation' : undefined}
+      data-testid={restProps['data-testid'] || 'shopping-bag-icon'}
+    >
+      <svg
+        width={String(size)}
+        height={String(size)}
+        fill="currentColor"
+        focusable="false"
+        viewBox="0 0 24 24"
+      >
+        {(Number(size) === 16 || Number(size) === 24 || Number(size) === 32) && (
+          <>
+            <path
+              fillRule="evenodd"
+              d="M12 1.713a4.286 4.286 0 0 0-4.286 4.286v.857H4.29a.861.861 0 0 0-.861.861v11.996A2.571 2.571 0 0 0 6 22.284h12a2.571 2.571 0 0 0 2.571-2.571V7.717a.861.861 0 0 0-.861-.861h-3.424v-.857A4.286 4.286 0 0 0 12 1.713Zm2.571 5.143v-.857a2.571 2.571 0 0 0-5.142 0v.857h5.142ZM7.714 8.57H5.143v11.143c0 .473.384.857.857.857h12a.857.857 0 0 0 .857-.857V8.57H7.714Z"
+              clipRule="evenodd"
+            />
+          </>
+        )}
+      </svg>
+      {title && <span className="sr-only">{title}</span>}
+    </span>
+  );
+};

package/build/components/slider.tsx

@@ -0,0 +1,52 @@
+// This is an automatically generated file, please don't edit it
+import { IconSize } from '../types';
+
+export interface SliderIconProps {
+  size?: IconSize;
+  filled?: boolean;
+  className?: string;
+  title?: string;
+  ['data-testid']?: string;
+}
+
+export const Slider: React.FunctionComponent<SliderIconProps> = ({
+  size = 16,
+  className = undefined,
+  title = undefined,
+  filled = undefined,
+  ...restProps
+}) => {
+  if (filled) {
+    console.warn(
+      '<Slider filled /> is now deprecated, please use <SliderFill /> or refer to https://transferwise.github.io/icons/ for more info.',
+    );
+  }
+
+  return (
+    <span
+      className={`tw-icon tw-icon-slider ${className ? className : ''}`}
+      aria-hidden={!title ? 'true' : undefined}
+      role={!title ? 'presentation' : undefined}
+      data-testid={restProps['data-testid'] || 'slider-icon'}
+    >
+      <svg
+        width={String(size)}
+        height={String(size)}
+        fill="currentColor"
+        focusable="false"
+        viewBox="0 0 24 24"
+      >
+        {(Number(size) === 16 || Number(size) === 24 || Number(size) === 32) && (
+          <>
+            <path
+              fillRule="evenodd"
+              d="M6 6.856a.857.857 0 0 0 .857-.837v-.04A.857.857 0 1 0 6 6.856Zm0 1.715c1.12 0 2.072-.716 2.425-1.714H21V5.143H8.425a2.572 2.572 0 0 0-4.85 0H3v1.714h.575A2.573 2.573 0 0 0 6 8.57Zm8.717 2.572a2.573 2.573 0 0 1 4.851 0H21v1.714h-1.432a2.572 2.572 0 0 1-4.85 0H3v-1.714h11.717ZM6.576 17.14a2.573 2.573 0 0 1 4.849 0H21v1.714h-9.574a2.572 2.572 0 0 1-4.851 0H3V17.14h3.576ZM18 11.999a.857.857 0 1 1-1.714 0A.857.857 0 0 1 18 12Zm-8.143 6a.857.857 0 1 1-1.714 0 .857.857 0 0 1 1.714 0Z"
+              clipRule="evenodd"
+            />
+          </>
+        )}
+      </svg>
+      {title && <span className="sr-only">{title}</span>}
+    </span>
+  );
+};

package/build/components/sofort.tsx

@@ -0,0 +1,52 @@
+// This is an automatically generated file, please don't edit it
+import { IconSize } from '../types';
+
+export interface SofortIconProps {
+  size?: IconSize;
+  filled?: boolean;
+  className?: string;
+  title?: string;
+  ['data-testid']?: string;
+}
+
+export const Sofort: React.FunctionComponent<SofortIconProps> = ({
+  size = 16,
+  className = undefined,
+  title = undefined,
+  filled = undefined,
+  ...restProps
+}) => {
+  if (filled) {
+    console.warn(
+      '<Sofort filled /> is now deprecated, please use <SofortFill /> or refer to https://transferwise.github.io/icons/ for more info.',
+    );
+  }
+
+  return (
+    <span
+      className={`tw-icon tw-icon-sofort ${className ? className : ''}`}
+      aria-hidden={!title ? 'true' : undefined}
+      role={!title ? 'presentation' : undefined}
+      data-testid={restProps['data-testid'] || 'sofort-icon'}
+    >
+      <svg
+        width={String(size)}
+        height={String(size)}
+        fill="currentColor"
+        focusable="false"
+        viewBox="0 0 24 24"
+      >
+        {(Number(size) === 16 || Number(size) === 24 || Number(size) === 32) && (
+          <>
+            <path
+              fillRule="evenodd"
+              d="M1.286 16.279h19.841l1.587-8.73H2.794l-1.508 8.73Zm4.103-4.624c-.303-.157-.369-.196-.369-.281 0-.105.122-.157.285-.157.191 0 .48.024.765.3.07-.224.187-.424.336-.6-.4-.233-.774-.352-1.115-.352-.677 0-1.069.37-1.069.818 0 .386.285.586.62.762.304.157.379.21.379.304 0 .105-.126.162-.294.162-.29 0-.625-.186-.826-.376l-.117.719c.206.152.504.31.957.31.7 0 1.078-.363 1.078-.824 0-.38-.243-.585-.63-.785Zm2.478-1.09c-.891 0-1.568.67-1.568 1.47 0 .724.555 1.228 1.312 1.228.891 0 1.563-.69 1.563-1.49.005-.728-.55-1.208-1.307-1.208Zm-.2 2.018c-.341 0-.58-.229-.58-.581 0-.39.295-.761.72-.761.34 0 .578.237.578.59.005.395-.294.752-.718.752Zm5.563-2.018c-.892 0-1.564.67-1.564 1.47 0 .724.556 1.228 1.312 1.228.891 0 1.563-.69 1.563-1.49.005-.728-.55-1.208-1.311-1.208Zm-.196 2.018c-.34 0-.579-.229-.579-.581 0-.39.294-.761.719-.761.34 0 .579.237.579.59 0 .395-.294.752-.72.752Zm3.09-1.961c.672 0 1.04.31 1.04.795 0 .404-.257.732-.69.885l.583.904h-.91l-.42-.814h-.038l-.13.814h-.794l.416-2.584h.943Zm-.346 1.223h.117c.27 0 .457-.105.457-.3 0-.166-.13-.243-.378-.243h-.107l-.089.543Zm-5.442-.09h.934c-.01.066-.014.128-.019.2l-.07.442h-.943l-.13.814h-.794l.317-1.994c.052-.343.36-.595.724-.595h1.633c-.247.176-.448.41-.578.68h-1l-.074.453Zm6.847-1.133a.96.96 0 0 1 .373.68h.663l-.303 1.904h.793l.303-1.904h.738l.107-.68h-2.674Z"
+              clipRule="evenodd"
+            />
+          </>
+        )}
+      </svg>
+      {title && <span className="sr-only">{title}</span>}
+    </span>
+  );
+};

package/build/components/software-and-hosting.tsx

@@ -0,0 +1,52 @@
+// This is an automatically generated file, please don't edit it
+import { IconSize } from '../types';
+
+export interface SoftwareAndHostingIconProps {
+  size?: IconSize;
+  filled?: boolean;
+  className?: string;
+  title?: string;
+  ['data-testid']?: string;
+}
+
+export const SoftwareAndHosting: React.FunctionComponent<SoftwareAndHostingIconProps> = ({
+  size = 16,
+  className = undefined,
+  title = undefined,
+  filled = undefined,
+  ...restProps
+}) => {
+  if (filled) {
+    console.warn(
+      '<SoftwareAndHosting filled /> is now deprecated, please use <SoftwareAndHostingFill /> or refer to https://transferwise.github.io/icons/ for more info.',
+    );
+  }
+
+  return (
+    <span
+      className={`tw-icon tw-icon-software-and-hosting ${className ? className : ''}`}
+      aria-hidden={!title ? 'true' : undefined}
+      role={!title ? 'presentation' : undefined}
+      data-testid={restProps['data-testid'] || 'software-and-hosting-icon'}
+    >
+      <svg
+        width={String(size)}
+        height={String(size)}
+        fill="currentColor"
+        focusable="false"
+        viewBox="0 0 24 24"
+      >
+        {(Number(size) === 16 || Number(size) === 24 || Number(size) === 32) && (
+          <>
+            <path
+              fillRule="evenodd"
+              d="M14.143 1.713c1.671 0 3.343.9 4.157 2.228 2.229.258 3.986 2.143 3.986 4.458a4.5 4.5 0 0 1-4.5 4.5h-.643v8.571a.86.86 0 0 1-.857.857H2.57a.86.86 0 0 1-.857-.857V6.041a.86.86 0 0 1 .857-.857h4.8C8.058 4.5 8.958 4.07 9.987 3.941c.814-1.328 2.486-2.228 4.157-2.228Zm-10.714 18.9h12v-7.714H10.5a4.5 4.5 0 0 1-4.243-6H3.43v13.714Zm7.071-9.429h7.286A2.78 2.78 0 0 0 20.57 8.4a2.78 2.78 0 0 0-2.785-2.786h-.557l-.215-.514c-.428-.943-1.671-1.672-2.871-1.672S11.7 4.156 11.27 5.1l-.214.514H10.5a2.78 2.78 0 0 0-2.786 2.786 2.78 2.78 0 0 0 2.786 2.785Zm-2.786 6.428a1.286 1.286 0 1 1-2.571 0 1.286 1.286 0 0 1 2.571 0Z"
+              clipRule="evenodd"
+            />
+          </>
+        )}
+      </svg>
+      {title && <span className="sr-only">{title}</span>}
+    </span>
+  );
+};

package/build/components/software-and-web-hosting.tsx

@@ -0,0 +1,52 @@
+// This is an automatically generated file, please don't edit it
+import { IconSize } from '../types';
+
+export interface SoftwareAndWebHostingIconProps {
+  size?: IconSize;
+  filled?: boolean;
+  className?: string;
+  title?: string;
+  ['data-testid']?: string;
+}
+
+export const SoftwareAndWebHosting: React.FunctionComponent<SoftwareAndWebHostingIconProps> = ({
+  size = 16,
+  className = undefined,
+  title = undefined,
+  filled = undefined,
+  ...restProps
+}) => {
+  if (filled) {
+    console.warn(
+      '<SoftwareAndWebHosting filled /> is now deprecated, please use <SoftwareAndWebHostingFill /> or refer to https://transferwise.github.io/icons/ for more info.',
+    );
+  }
+
+  return (
+    <span
+      className={`tw-icon tw-icon-software-and-web-hosting ${className ? className : ''}`}
+      aria-hidden={!title ? 'true' : undefined}
+      role={!title ? 'presentation' : undefined}
+      data-testid={restProps['data-testid'] || 'software-and-web-hosting-icon'}
+    >
+      <svg
+        width={String(size)}
+        height={String(size)}
+        fill="currentColor"
+        focusable="false"
+        viewBox="0 0 24 24"
+      >
+        {(Number(size) === 16 || Number(size) === 24 || Number(size) === 32) && (
+          <>
+            <path
+              fillRule="evenodd"
+              d="M14.143 1.713c1.671 0 3.343.9 4.157 2.228 2.229.258 3.986 2.143 3.986 4.458a4.5 4.5 0 0 1-4.5 4.5h-.643v8.571a.86.86 0 0 1-.857.857H2.57a.86.86 0 0 1-.857-.857V6.041a.86.86 0 0 1 .857-.857h4.8C8.058 4.5 8.958 4.07 9.987 3.941c.814-1.328 2.486-2.228 4.157-2.228Zm-10.714 18.9h12v-7.714H10.5a4.5 4.5 0 0 1-4.243-6H3.43v13.714Zm7.071-9.429h7.286A2.78 2.78 0 0 0 20.57 8.4a2.78 2.78 0 0 0-2.785-2.786h-.557l-.215-.514c-.428-.943-1.671-1.672-2.871-1.672S11.7 4.156 11.27 5.1l-.214.514H10.5a2.78 2.78 0 0 0-2.786 2.786 2.78 2.78 0 0 0 2.786 2.785Zm-2.786 6.428a1.286 1.286 0 1 1-2.571 0 1.286 1.286 0 0 1 2.571 0Z"
+              clipRule="evenodd"
+            />
+          </>
+        )}
+      </svg>
+      {title && <span className="sr-only">{title}</span>}
+    </span>
+  );
+};

package/build/components/speech-bubble-message.tsx

@@ -0,0 +1,52 @@
+// This is an automatically generated file, please don't edit it
+import { IconSize } from '../types';
+
+export interface SpeechBubbleMessageIconProps {
+  size?: IconSize;
+  filled?: boolean;
+  className?: string;
+  title?: string;
+  ['data-testid']?: string;
+}
+
+export const SpeechBubbleMessage: React.FunctionComponent<SpeechBubbleMessageIconProps> = ({
+  size = 16,
+  className = undefined,
+  title = undefined,
+  filled = undefined,
+  ...restProps
+}) => {
+  if (filled) {
+    console.warn(
+      '<SpeechBubbleMessage filled /> is now deprecated, please use <SpeechBubbleMessageFill /> or refer to https://transferwise.github.io/icons/ for more info.',
+    );
+  }
+
+  return (
+    <span
+      className={`tw-icon tw-icon-speech-bubble-message ${className ? className : ''}`}
+      aria-hidden={!title ? 'true' : undefined}
+      role={!title ? 'presentation' : undefined}
+      data-testid={restProps['data-testid'] || 'speech-bubble-message-icon'}
+    >
+      <svg
+        width={String(size)}
+        height={String(size)}
+        fill="currentColor"
+        focusable="false"
+        viewBox="0 0 24 24"
+      >
+        {(Number(size) === 16 || Number(size) === 24 || Number(size) === 32) && (
+          <>
+            <path
+              fillRule="evenodd"
+              d="M21.429 3H2.572a.86.86 0 0 0-.858.857v12.857a.86.86 0 0 0 .857.857h4.286v2.572c0 .3.172.6.472.771.128.086.257.086.385.086a.864.864 0 0 0 .472-.129l4.928-3.3h8.315a.86.86 0 0 0 .857-.857V3.857A.86.86 0 0 0 21.429 3Zm-.857 12.857h-7.715a.864.864 0 0 0-.471.129l-3.814 2.571v-1.843a.86.86 0 0 0-.858-.857H3.43V4.714H20.57v11.143Zm-1.715-8.574H5.143v1.714h13.714V7.283Zm-13.714 4.29h13.714v1.714H5.143v-1.715Z"
+              clipRule="evenodd"
+            />
+          </>
+        )}
+      </svg>
+      {title && <span className="sr-only">{title}</span>}
+    </span>
+  );
+};

package/build/components/speech-bubble-pending.tsx

@@ -0,0 +1,52 @@
+// This is an automatically generated file, please don't edit it
+import { IconSize } from '../types';
+
+export interface SpeechBubblePendingIconProps {
+  size?: IconSize;
+  filled?: boolean;
+  className?: string;
+  title?: string;
+  ['data-testid']?: string;
+}
+
+export const SpeechBubblePending: React.FunctionComponent<SpeechBubblePendingIconProps> = ({
+  size = 16,
+  className = undefined,
+  title = undefined,
+  filled = undefined,
+  ...restProps
+}) => {
+  if (filled) {
+    console.warn(
+      '<SpeechBubblePending filled /> is now deprecated, please use <SpeechBubblePendingFill /> or refer to https://transferwise.github.io/icons/ for more info.',
+    );
+  }
+
+  return (
+    <span
+      className={`tw-icon tw-icon-speech-bubble-pending ${className ? className : ''}`}
+      aria-hidden={!title ? 'true' : undefined}
+      role={!title ? 'presentation' : undefined}
+      data-testid={restProps['data-testid'] || 'speech-bubble-pending-icon'}
+    >
+      <svg
+        width={String(size)}
+        height={String(size)}
+        fill="currentColor"
+        focusable="false"
+        viewBox="0 0 24 24"
+      >
+        {(Number(size) === 16 || Number(size) === 24 || Number(size) === 32) && (
+          <>
+            <path
+              fillRule="evenodd"
+              d="M2.571 3H21.43a.86.86 0 0 1 .857.857v12.857a.86.86 0 0 1-.857.857h-8.315l-4.928 3.3a.864.864 0 0 1-.472.129c-.128 0-.257 0-.385-.086a.903.903 0 0 1-.472-.771V17.57H2.572a.86.86 0 0 1-.858-.857V3.857A.86.86 0 0 1 2.571 3Zm10.286 12.857h7.715V4.714H3.428v11.143h4.285a.86.86 0 0 1 .857.857v1.843l3.815-2.571a.864.864 0 0 1 .471-.129Zm.429-5.571a1.286 1.286 0 1 1-2.572 0 1.286 1.286 0 0 1 2.572 0Zm3.857 1.285a1.286 1.286 0 1 0 0-2.57 1.286 1.286 0 0 0 0 2.57Zm-9-1.285a1.286 1.286 0 1 1-2.571 0 1.286 1.286 0 0 1 2.571 0Z"
+              clipRule="evenodd"
+            />
+          </>
+        )}
+      </svg>
+      {title && <span className="sr-only">{title}</span>}
+    </span>
+  );
+};