stream-chat-react-native-core 9.0.0-beta.3 → 9.0.0-beta.30

package/src/icons/pin.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+
+import { Path, Svg } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const Pin = ({ fill, height, pathFill, size, stroke, width, ...rest }: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg
+      fill={'none'}
+      height={height ?? size}
+      viewBox={'0 0 20 20'}
+      width={width ?? size}
+      {...rest}
+    >
+      <Path
+        d='M7.52271 12.4773L3.75006 16.25M17.9422 7.68279C18.0594 7.56559 18.1252 7.40668 18.1252 7.24099C18.1252 7.0753 18.0594 6.9164 17.9422 6.7992L13.2032 2.05779C13.086 1.94067 12.9271 1.87488 12.7614 1.87488C12.5957 1.87488 12.4368 1.94067 12.3196 2.05779L7.84303 6.54685C7.84303 6.54685 5.67506 5.46326 3.35943 7.33201C3.29077 7.38697 3.23447 7.45581 3.19424 7.53402C3.154 7.61224 3.13072 7.69806 3.12593 7.78589C3.12114 7.87371 3.13493 7.96156 3.16642 8.04369C3.19791 8.12581 3.24637 8.20037 3.30865 8.26248L11.7383 16.6914C11.8015 16.7541 11.8773 16.8025 11.9606 16.8336C12.044 16.8646 12.133 16.8775 12.2218 16.8713C12.3105 16.8652 12.3969 16.8402 12.4752 16.798C12.5535 16.7558 12.6219 16.6973 12.6758 16.6265C13.3313 15.7547 14.361 13.9633 13.4657 12.1734L17.9422 7.68279Z'
+        stroke={color}
+        strokeLinecap='round'
+        strokeLinejoin='round'
+        strokeWidth={1.5}
+      />
+    </Svg>
+  );
+};

package/src/icons/play-fill.tsx

@@ -0,0 +1,14 @@
+import React from 'react';
+
+import { Path, Svg } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const Play = ({ height, size, width, ...rest }: IconProps) => (
+  <Svg fill={'none'} height={height ?? size} viewBox={'0 0 20 20'} width={width ?? size} {...rest}>
+    <Path
+      d='M18.75 10C18.7505 10.2122 18.6961 10.4209 18.5921 10.6059C18.488 10.7908 18.3379 10.9457 18.1562 11.0555L6.9 17.9414C6.71022 18.0576 6.49287 18.1211 6.27037 18.1252C6.04788 18.1293 5.82832 18.0739 5.63438 17.9648C5.44227 17.8574 5.28225 17.7008 5.17075 17.511C5.05926 17.3213 5.00032 17.1052 5 16.8852V3.11484C5.00032 2.89475 5.05926 2.67872 5.17075 2.48896C5.28225 2.2992 5.44227 2.14257 5.63438 2.03516C5.82832 1.92605 6.04788 1.87071 6.27037 1.87483C6.49287 1.87895 6.71022 1.94239 6.9 2.05859L18.1562 8.94453C18.3379 9.05428 18.488 9.20916 18.5921 9.39411C18.6961 9.57906 18.7505 9.78779 18.75 10Z'
+      {...rest}
+    />
+  </Svg>
+);

package/src/icons/plus.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+
+import Svg, { Path } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const Plus = ({ height, size, width, ...rest }: IconProps) => (
+  <Svg fill='none' height={height ?? size} viewBox={'0 0 20 20'} width={width ?? size} {...rest}>
+    <Path
+      d='M3.125 10H16.875M10 3.125V16.875'
+      strokeWidth={1.5}
+      strokeLinecap='round'
+      strokeLinejoin='round'
+      {...rest}
+    />
+  </Svg>
+);

package/src/icons/poll.tsx

@@ -0,0 +1,31 @@
+import React from 'react';
+
+import Svg, { Path } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const PollThumbnail = ({
+  fill,
+  height,
+  pathFill,
+  size,
+  stroke,
+  width,
+  ...rest
+}: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg viewBox='0 0 20 20' fill='none' height={height ?? size} width={width ?? size} {...rest}>
+      <Path
+        d='M3.75 16.25V10.625H7.5M17.5 16.25H2.5M7.5 16.25V6.875H11.875M11.875 16.25V3.125H16.25V16.25'
+        stroke={color}
+        strokeWidth={1.5}
+        strokeLinecap='round'
+        strokeLinejoin='round'
+      />
+    </Svg>
+  );
+};
+
+export const PollIcon = (props: IconProps) => <PollThumbnail {...props} />;

package/src/icons/refresh.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+
+import { Path, Svg } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const Reload = ({ fill, height, pathFill, size, stroke, width, ...rest }: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg
+      fill={'none'}
+      height={height ?? size}
+      viewBox={'0 0 20 20'}
+      width={width ?? size}
+      {...rest}
+    >
+      <Path
+        d='M13.125 7.49978H16.875M16.875 7.49978V3.74978M16.875 7.49978L14.6656 5.29041C13.3861 4.01095 11.6538 3.2875 9.84437 3.27697C8.03494 3.26644 6.29431 3.96968 5 5.23416M6.875 12.4998H3.125M3.125 12.4998V16.2498M3.125 12.4998L5.33437 14.7092C6.61388 15.9886 8.34621 16.7121 10.1556 16.7226C11.9651 16.7331 13.7057 16.0299 15 14.7654'
+        stroke={color}
+        strokeLinecap='round'
+        strokeLinejoin='round'
+        strokeWidth={1.5}
+      />
+    </Svg>
+  );
+};

package/src/icons/reorder.tsx

@@ -0,0 +1,18 @@
+import React from 'react';
+
+import { Path, Svg } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const DotGrid = ({ fill, height, pathFill, size, stroke, width }: IconProps) => {
+  const color = pathFill ?? fill ?? stroke ?? 'black';
+
+  return (
+    <Svg fill='none' height={height ?? size} viewBox='0 0 20 20' width={width ?? size}>
+      <Path
+        d='M8.875 15.3125C8.875 16.2445 8.11948 17 7.1875 17C6.25552 17 5.5 16.2445 5.5 15.3125C5.5 14.3805 6.25552 13.625 7.1875 13.625C8.11948 13.625 8.875 14.3805 8.875 15.3125ZM14.5 15.3125C14.5 16.2445 13.7445 17 12.8125 17C11.8805 17 11.125 16.2445 11.125 15.3125C11.125 14.3805 11.8805 13.625 12.8125 13.625C13.7445 13.625 14.5 14.3805 14.5 15.3125ZM8.875 10C8.875 10.932 8.11948 11.6875 7.1875 11.6875C6.25552 11.6875 5.5 10.932 5.5 10C5.5 9.06802 6.25552 8.3125 7.1875 8.3125C8.11948 8.3125 8.875 9.06802 8.875 10ZM14.5 10C14.5 10.932 13.7445 11.6875 12.8125 11.6875C11.8805 11.6875 11.125 10.932 11.125 10C11.125 9.06802 11.8805 8.3125 12.8125 8.3125C13.7445 8.3125 14.5 9.06802 14.5 10ZM8.875 4.6875C8.875 5.61948 8.11948 6.375 7.1875 6.375C6.25552 6.375 5.5 5.61948 5.5 4.6875C5.5 3.75552 6.25552 3 7.1875 3C8.11948 3 8.875 3.75552 8.875 4.6875ZM14.5 4.6875C14.5 5.61948 13.7445 6.375 12.8125 6.375C11.8805 6.375 11.125 5.61948 11.125 4.6875C11.125 3.75552 11.8805 3 12.8125 3C13.7445 3 14.5 3.75552 14.5 4.6875Z'
+        fill={color}
+      />
+    </Svg>
+  );
+};

package/src/icons/reply.tsx

@@ -0,0 +1,19 @@
+import React from 'react';
+
+import Svg, { Path } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const CurveLineLeftUp = (props: IconProps) => (
+  <Svg viewBox='0 0 20 20' fill='none' {...props}>
+    <Path
+      d='M17.5812 15.525C16.2953 14.1555 12.9195 11.25 8.12265 11.25V15L1.87265 8.75L8.12265 2.5V6.25C12.2476 6.25 17.5359 10.1914 18.1226 15.2766C18.1308 15.3424 18.1177 15.4091 18.0854 15.4671C18.0531 15.525 18.0031 15.5712 17.9428 15.5988C17.8825 15.6265 17.815 15.6343 17.75 15.621C17.685 15.6077 17.6259 15.5741 17.5812 15.525Z'
+      strokeWidth={1.5}
+      strokeLinecap='round'
+      strokeLinejoin='round'
+      {...props}
+    />
+  </Svg>
+);
+
+export const ArrowShareLeft = (props: IconProps) => <CurveLineLeftUp {...props} />;

package/src/icons/save.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+
+import { Path, Svg } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const Bookmark = ({ fill, height, pathFill, size, stroke, width, ...rest }: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg
+      fill={'none'}
+      height={height ?? size}
+      viewBox={'0 0 20 20'}
+      width={width ?? size}
+      {...rest}
+    >
+      <Path
+        d='M15 17.5L10 14.375L5 17.5V3.75C5 3.58424 5.06585 3.42527 5.18306 3.30806C5.30027 3.19085 5.45924 3.125 5.625 3.125H14.375C14.5408 3.125 14.6997 3.19085 14.8169 3.30806C14.9342 3.42527 15 3.58424 15 3.75V17.5Z'
+        stroke={color}
+        strokeLinecap='round'
+        strokeLinejoin='round'
+        strokeWidth={1.5}
+      />
+    </Svg>
+  );
+};

package/src/icons/search.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+
+import Svg, { Path } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const Search = ({ fill, height, pathFill, size, stroke, width, ...rest }: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg
+      fill='none'
+      height={height ?? size}
+      viewBox='0 0 20 20'
+      width={width ?? size}
+      {...rest}
+      testID={'search-icon'}
+    >
+      <Path
+        d='M13.1695 13.1695L17.5 17.5M15 8.75C15 12.2018 12.2018 15 8.75 15C5.29822 15 2.5 12.2018 2.5 8.75C2.5 5.29822 5.29822 2.5 8.75 2.5C12.2018 2.5 15 5.29822 15 8.75Z'
+        fill='none'
+        stroke={color}
+        strokeLinecap='round'
+        strokeLinejoin='round'
+        strokeWidth={1.5}
+      />
+    </Svg>
+  );
+};

package/src/icons/send.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+
+import Svg, { Path } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const SendRight = ({ fill, height, pathFill, size, stroke, width, ...rest }: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg
+      fill={'none'}
+      height={height ?? size}
+      viewBox={'0 0 20 20'}
+      width={width ?? size}
+      {...rest}
+      testID='send-right'
+    >
+      <Path
+        d='M11.2498 10H6.24982M6.24982 10L3.7881 2.71328C3.74537 2.59349 3.7402 2.4635 3.7733 2.34069C3.80639 2.21788 3.87616 2.10808 3.9733 2.02597C4.07044 1.94386 4.19032 1.89335 4.31693 1.88117C4.44353 1.86899 4.57084 1.89573 4.68185 1.95781L17.8069 9.4461C17.9045 9.50015 17.986 9.57937 18.0427 9.67555C18.0994 9.77172 18.1293 9.88133 18.1293 9.99297C18.1293 10.1046 18.0994 10.2142 18.0427 10.3104C17.986 10.4066 17.9045 10.4858 17.8069 10.5398L4.68185 18.0469C4.57051 18.1096 4.4426 18.1367 4.31537 18.1245C4.18815 18.1123 4.06772 18.0614 3.97032 17.9787C3.87292 17.8959 3.80323 17.7853 3.77065 17.6617C3.73807 17.5381 3.74416 17.4075 3.7881 17.2875L6.24982 10Z'
+        fill='none'
+        stroke={color}
+        strokeLinecap='round'
+        strokeLinejoin='round'
+        strokeWidth={1.5}
+      />
+    </Svg>
+  );
+};

package/src/icons/share.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+
+import Svg, { Path } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const Share = ({ height, width, ...rest }: IconProps) => (
+  <Svg fill={'none'} height={height} viewBox={'0 0 20 20'} width={width} {...rest}>
+    <Path
+      d='M11.6477 5.72656L7.10234 8.64844M7.10234 11.3516L11.6477 14.2734M7.5 10C7.5 11.3807 6.38071 12.5 5 12.5C3.61929 12.5 2.5 11.3807 2.5 10C2.5 8.61929 3.61929 7.5 5 7.5C6.38071 7.5 7.5 8.61929 7.5 10ZM16.25 15.625C16.25 17.0057 15.1307 18.125 13.75 18.125C12.3693 18.125 11.25 17.0057 11.25 15.625C11.25 14.2443 12.3693 13.125 13.75 13.125C15.1307 13.125 16.25 14.2443 16.25 15.625ZM16.25 4.375C16.25 5.75571 15.1307 6.875 13.75 6.875C12.3693 6.875 11.25 5.75571 11.25 4.375C11.25 2.99429 12.3693 1.875 13.75 1.875C15.1307 1.875 16.25 2.99429 16.25 4.375Z'
+      strokeWidth={1.5}
+      strokeLinecap='round'
+      strokeLinejoin='round'
+      {...rest}
+    />
+  </Svg>
+);

package/src/icons/stop-fill.tsx

@@ -0,0 +1,24 @@
+import React from 'react';
+
+import { Path, Svg } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const Stop = ({ fill, height, pathFill, size, stroke, width, ...rest }: IconProps) => {
+  const color = fill ?? pathFill ?? stroke ?? 'black';
+
+  return (
+    <Svg
+      fill={'none'}
+      height={height ?? size}
+      viewBox={'0 0 20 20'}
+      width={width ?? size}
+      {...rest}
+    >
+      <Path
+        d='M16.875 4.375V15.625C16.875 15.9565 16.7433 16.2745 16.5089 16.5089C16.2745 16.7433 15.9565 16.875 15.625 16.875H4.375C4.04348 16.875 3.72554 16.7433 3.49112 16.5089C3.2567 16.2745 3.125 15.9565 3.125 15.625V4.375C3.125 4.04348 3.2567 3.72554 3.49112 3.49112C3.72554 3.2567 4.04348 3.125 4.375 3.125H15.625C15.9565 3.125 16.2745 3.2567 16.5089 3.49112C16.7433 3.72554 16.875 4.04348 16.875 4.375Z'
+        fill={color}
+      />
+    </Svg>
+  );
+};

package/src/icons/thread.tsx

@@ -0,0 +1,29 @@
+import React from 'react';
+
+import Svg, { Path } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const ThreadReply = ({
+  fill,
+  height,
+  pathFill,
+  size,
+  stroke,
+  width,
+  ...rest
+}: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg viewBox='0 0 20 20' fill='none' height={height ?? size} width={width ?? size} {...rest}>
+      <Path
+        d='M7.5 8.75H12.8125M7.5 11.25H12.8125M10.3125 16.875H3.75C3.58424 16.875 3.42527 16.8092 3.30806 16.6919C3.19085 16.5747 3.125 16.4158 3.125 16.25V9.6875C3.125 7.78126 3.88225 5.95309 5.23017 4.60517C6.57809 3.25725 8.40626 2.5 10.3125 2.5C11.2564 2.5 12.191 2.68591 13.063 3.04712C13.9351 3.40832 14.7274 3.93775 15.3948 4.60517C16.0623 5.27259 16.5917 6.06493 16.9529 6.93696C17.3141 7.80899 17.5 8.74362 17.5 9.6875C17.5 10.6314 17.3141 11.566 16.9529 12.438C16.5917 13.3101 16.0623 14.1024 15.3948 14.7698C14.7274 15.4373 13.9351 15.9667 13.063 16.3279C12.191 16.6891 11.2564 16.875 10.3125 16.875Z'
+        stroke={color}
+        strokeWidth={1.5}
+        strokeLinecap='round'
+        strokeLinejoin='round'
+      />
+    </Svg>
+  );
+};

package/src/icons/unlock.tsx

@@ -0,0 +1,32 @@
+import React from 'react';
+
+import { Path, Svg } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const Unlock = ({ fill, height, pathFill, size, stroke, width, ...rest }: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg
+      fill={'none'}
+      height={height ?? size}
+      viewBox={'0 0 20 20'}
+      width={width ?? size}
+      {...rest}
+    >
+      <Path
+        d='M3.875 16.125H16.125V7.625H3.875V16.125ZM17.625 16.25C17.625 17.0094 17.0094 17.625 16.25 17.625H3.75C2.99061 17.625 2.375 17.0094 2.375 16.25V7.5C2.375 6.74061 2.99061 6.125 3.75 6.125H16.25C17.0094 6.125 17.625 6.74061 17.625 7.5V16.25Z'
+        fill={color}
+      />
+      <Path
+        d='M10 12.8125C10.5178 12.8125 10.9375 12.3928 10.9375 11.875C10.9375 11.3572 10.5178 10.9375 10 10.9375C9.48223 10.9375 9.0625 11.3572 9.0625 11.875C9.0625 12.3928 9.48223 12.8125 10 12.8125Z'
+        fill={color}
+      />
+      <Path
+        d='M6.125 6.875V4.375C6.125 3.34729 6.53306 2.36147 7.25977 1.63477C7.98647 0.908062 8.97229 0.5 10 0.5C11.8574 0.5 13.4973 1.81391 13.8604 3.60059C13.9428 4.0065 13.6803 4.40287 13.2744 4.48535C12.8685 4.56782 12.4721 4.30533 12.3896 3.89941C12.173 2.83297 11.166 2 10 2C9.37011 2 8.76571 2.24991 8.32031 2.69531C7.87491 3.14071 7.625 3.74511 7.625 4.375V6.875C7.625 7.28921 7.28921 7.625 6.875 7.625C6.46079 7.625 6.125 7.28921 6.125 6.875Z'
+        fill={color}
+      />
+    </Svg>
+  );
+};

package/src/icons/unpin.tsx

@@ -0,0 +1,21 @@
+import React from 'react';
+
+import { Path, Svg } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const Unpin = ({ fill, height, pathFill, size, stroke, width, ...rest }: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg fill='none' height={height ?? size} viewBox='0 0 20 20' width={width ?? size} {...rest}>
+      <Path
+        d='M7.52271 12.4773L3.75006 16.25M3.75006 3.12498L16.2501 16.875M14.4532 11.1828L17.9415 7.68279C18.0586 7.56559 18.1244 7.40668 18.1244 7.24099C18.1244 7.0753 18.0586 6.9164 17.9415 6.7992L13.2032 2.05779C13.086 1.94067 12.9271 1.87488 12.7614 1.87488C12.5957 1.87488 12.4368 1.94067 12.3196 2.05779L9.09615 5.28904M6.58756 6.24998C5.74537 6.18435 4.57271 6.3531 3.35943 7.33201C3.29077 7.38697 3.23447 7.45581 3.19424 7.53402C3.154 7.61224 3.13072 7.69806 3.12593 7.78589C3.12114 7.87371 3.13493 7.96156 3.16642 8.04369C3.19791 8.12581 3.24637 8.20037 3.30865 8.26248L11.7383 16.6914C11.8015 16.7541 11.8773 16.8025 11.9606 16.8336C12.044 16.8646 12.133 16.8775 12.2218 16.8713C12.3105 16.8652 12.3969 16.8402 12.4752 16.798C12.5535 16.7558 12.6219 16.6973 12.6758 16.6265C13.0829 16.0851 13.6344 15.1898 13.779 14.1594'
+        stroke={color}
+        strokeLinecap='round'
+        strokeLinejoin='round'
+        strokeWidth={1.5}
+      />
+    </Svg>
+  );
+};

package/src/icons/user-add.tsx

@@ -0,0 +1,21 @@
+import React from 'react';
+
+import Svg, { Path } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const UserAdd = ({ fill, height, pathFill, size, stroke, width, ...rest }: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg viewBox='0 0 20 20' fill='none' height={height ?? size} width={width ?? size} {...rest}>
+      <Path
+        d='M15.625 10.625H19.375M17.5 8.75V12.5M8.4375 12.5C11.0263 12.5 13.125 10.4013 13.125 7.8125C13.125 5.22367 11.0263 3.125 8.4375 3.125C5.84867 3.125 3.75 5.22367 3.75 7.8125C3.75 10.4013 5.84867 12.5 8.4375 12.5ZM8.4375 12.5C5.74688 12.5 3.48047 13.7148 1.875 15.625M8.4375 12.5C11.1281 12.5 13.3945 13.7148 15 15.625'
+        stroke={color}
+        strokeWidth={1.5}
+        strokeLinecap='round'
+        strokeLinejoin='round'
+      />
+    </Svg>
+  );
+};

package/src/icons/user-remove.tsx

@@ -0,0 +1,21 @@
+import React from 'react';
+
+import Svg, { Path } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const UserDelete = ({ fill, height, pathFill, size, stroke, width, ...rest }: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg viewBox='0 0 20 20' fill='none' height={height ?? size} width={width ?? size} {...rest}>
+      <Path
+        d='M15.625 10.625H19.375M8.4375 12.5C11.0263 12.5 13.125 10.4013 13.125 7.8125C13.125 5.22367 11.0263 3.125 8.4375 3.125C5.84867 3.125 3.75 5.22367 3.75 7.8125C3.75 10.4013 5.84867 12.5 8.4375 12.5ZM8.4375 12.5C5.74688 12.5 3.48047 13.7148 1.875 15.625M8.4375 12.5C11.1281 12.5 13.3945 13.7148 15 15.625'
+        stroke={color}
+        strokeWidth={1.5}
+        strokeLinecap='round'
+        strokeLinejoin='round'
+      />
+    </Svg>
+  );
+};

package/src/icons/users.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+
+import { Path, Svg } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const PeopleIcon = ({ fill, height, pathFill, size, stroke, width, ...rest }: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg
+      fill={'none'}
+      height={height ?? size}
+      viewBox={`0 0 20 20`}
+      width={width ?? size}
+      {...rest}
+    >
+      <Path
+        d='M0.799316 15.625C1.42361 14.6651 2.27775 13.8764 3.28421 13.3304C4.29067 12.7844 5.41757 12.4984 6.5626 12.4984C7.70763 12.4984 8.83452 12.7844 9.84098 13.3304C10.8474 13.8764 11.7016 14.6651 12.3259 15.625M19.2009 15.625C18.5768 14.6651 17.7226 13.8764 16.7161 13.3306C15.7096 12.7849 14.5826 12.4993 13.4376 12.5C14.0359 12.4995 14.6267 12.3668 15.1677 12.1115C15.7088 11.8562 16.1868 11.4845 16.5676 11.023C16.9483 10.5615 17.2225 10.0216 17.3704 9.44192C17.5183 8.86221 17.5364 8.25698 17.4233 7.66948C17.3102 7.08199 17.0687 6.52672 16.7161 6.04337C16.3635 5.56002 15.9085 5.16051 15.3836 4.87339C14.8587 4.58627 14.2769 4.41862 13.6797 4.38244C13.0825 4.34625 12.4847 4.44242 11.929 4.66406M10.6251 8.4375C10.6251 10.6812 8.80626 12.5 6.5626 12.5C4.31894 12.5 2.5001 10.6812 2.5001 8.4375C2.5001 6.19384 4.31894 4.375 6.5626 4.375C8.80626 4.375 10.6251 6.19384 10.6251 8.4375Z'
+        stroke={color}
+        strokeWidth={1.5}
+        strokeLinecap='round'
+        strokeLinejoin='round'
+      />
+    </Svg>
+  );
+};

package/src/icons/utils/base.tsx

@@ -9,13 +9,13 @@ export type IconProps = Partial<SvgProps> &
   };
 
 export const RootSvg = (props: IconProps) => {
-  const { children, height = 24, viewBox = '0 0 24 24', width = 24 } = props;
+  const { children, height, size, viewBox = '0 0 24 24', width } = props;
   return (
     <Svg
       {...{
-        height,
+        height: height ?? size ?? 24,
         viewBox,
-        width,
+        width: width ?? size ?? 24,
       }}
       {...props}
     >

package/src/icons/video-fill.tsx

@@ -0,0 +1,25 @@
+import React from 'react';
+
+import Svg, { ClipPath, Defs, G, Path, Rect } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const Recorder = ({ fill, height, pathFill, size, stroke, width, ...props }: IconProps) => {
+  const color = pathFill ?? fill ?? stroke ?? 'black';
+
+  return (
+    <Svg viewBox='0 0 20 20' fill='none' height={height ?? size} width={width ?? size} {...props}>
+      <G clipPath='url(#clip0_recorder)'>
+        <Path
+          d='M15 5.625V14.375C15 14.7065 14.8683 15.0245 14.6339 15.2589C14.3995 15.4933 14.0815 15.625 13.75 15.625H2.5C2.16848 15.625 1.85054 15.4933 1.61612 15.2589C1.3817 15.0245 1.25 14.7065 1.25 14.375V5.625C1.25 5.29348 1.3817 4.97554 1.61612 4.74112C1.85054 4.5067 2.16848 4.375 2.5 4.375H13.75C14.0815 4.375 14.3995 4.5067 14.6339 4.74112C14.8683 4.97554 15 5.29348 15 5.625ZM19.5312 5.64453C19.4431 5.62295 19.3513 5.62029 19.2621 5.63672C19.1728 5.65315 19.088 5.68829 19.0133 5.73984L16.3891 7.48906C16.3463 7.51762 16.3112 7.55631 16.2869 7.6017C16.2626 7.64708 16.25 7.69776 16.25 7.74922V12.2508C16.25 12.3022 16.2626 12.3529 16.2869 12.3983C16.3112 12.4437 16.3463 12.4824 16.3891 12.5109L19.0281 14.2703C19.1269 14.3362 19.2424 14.3726 19.3611 14.3752C19.4798 14.3779 19.5968 14.3466 19.6984 14.2852C19.7924 14.2254 19.8695 14.1425 19.9223 14.0444C19.9751 13.9464 20.0019 13.8364 20 13.725V6.25C20.0001 6.11139 19.9541 5.97668 19.8692 5.86708C19.7843 5.75747 19.6655 5.67918 19.5312 5.64453Z'
+          fill={color}
+        />
+      </G>
+      <Defs>
+        <ClipPath id='clip0_recorder'>
+          <Rect x='1' y='4' width='19' height='12' fill='white' />
+        </ClipPath>
+      </Defs>
+    </Svg>
+  );
+};

package/src/icons/video.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+
+import { Path, Svg } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const VideoIcon = ({ fill, height, pathFill, size, stroke, width, ...rest }: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg
+      fill={'none'}
+      height={height ?? size}
+      viewBox={`0 0 20 20`}
+      width={width ?? size}
+      {...rest}
+    >
+      <Path
+        d='M15.625 8.75L19.375 6.25V13.75L15.625 11.25M2.5 5H15C15.3452 5 15.625 5.27982 15.625 5.625V14.375C15.625 14.7202 15.3452 15 15 15H2.5C2.15482 15 1.875 14.7202 1.875 14.375V5.625C1.875 5.27982 2.15482 5 2.5 5Z'
+        stroke={color}
+        strokeWidth={1.5}
+        strokeLinecap='round'
+        strokeLinejoin='round'
+      />
+    </Svg>
+  );
+};

package/src/icons/voice.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+
+import { Path, Svg } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const Mic = ({ fill, height, pathFill, size, stroke, width, ...rest }: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg
+      fill={'none'}
+      height={height ?? size}
+      viewBox={'0 0 20 20'}
+      width={width ?? size}
+      {...rest}
+    >
+      <Path
+        d='M10 15.625V18.75M10 15.625C11.4918 15.625 12.9226 15.0324 13.9775 13.9775C15.0324 12.9226 15.625 11.4918 15.625 10M10 15.625C8.50816 15.625 7.07742 15.0324 6.02252 13.9775C4.96763 12.9226 4.375 11.4918 4.375 10M10 1.875C11.7259 1.875 13.125 3.27411 13.125 5V10C13.125 11.7259 11.7259 13.125 10 13.125C8.27411 13.125 6.875 11.7259 6.875 10V5C6.875 3.27411 8.27411 1.875 10 1.875Z'
+        stroke={color}
+        strokeLinecap='round'
+        strokeLinejoin='round'
+        strokeWidth={1.5}
+      />
+    </Svg>
+  );
+};

package/src/icons/xmark-1.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+
+import { Path, Svg } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const Cross = ({ fill, height, pathFill, size, stroke, width, ...rest }: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg
+      fill={'none'}
+      height={height ?? size}
+      viewBox={'0 0 20 20'}
+      width={width ?? size}
+      {...rest}
+    >
+      <Path
+        d='M15.625 4.375L4.375 15.625M15.625 15.625L4.375 4.375'
+        stroke={color}
+        strokeLinecap='round'
+        strokeLinejoin='round'
+        strokeWidth={1.5}
+      />
+    </Svg>
+  );
+};

package/src/icons/xmark.tsx

@@ -0,0 +1,21 @@
+import React from 'react';
+
+import Svg, { Path } from 'react-native-svg';
+
+import { IconProps } from './utils/base';
+
+export const NewClose = ({ fill, height, pathFill, size, stroke, width, ...rest }: IconProps) => {
+  const color = stroke ?? pathFill ?? fill ?? 'black';
+
+  return (
+    <Svg height={height ?? size} viewBox={'0 0 20 20'} width={width ?? size} fill='none' {...rest}>
+      <Path
+        d='M13.5 6.5L6.5 13.5M13.5 13.5L6.5 6.5'
+        stroke={color}
+        strokeLinecap='round'
+        strokeLinejoin='round'
+        strokeWidth={1.5}
+      />
+    </Svg>
+  );
+};

package/src/index.ts

@@ -16,6 +16,7 @@ export * from './types/types';
 export * from './utils/patchMessageTextCommand';
 export * from './utils/i18n/Streami18n';
 export * from './utils/setupCommandUIMiddlewares';
+export * from './utils/createGenerateVideoThumbnails';
 export * from './utils/utils';
 
 export { default as enTranslations } from './i18n/en.json';