stream-chat-react-native-core 3.10.2 → 4.0.0-beta.4

package/src/styleguideComponents/PropsRenderer.tsx

@@ -1,15 +1,18 @@
 import React from 'react';
-import Arguments from './ArgumentsRenderer';
+
 import Argument from 'react-styleguidist/lib/client/rsg-components/Argument';
-import JsDoc from './JsDoc';
+
 import Markdown from 'react-styleguidist/lib/client/rsg-components/Markdown';
 import Name from 'react-styleguidist/lib/client/rsg-components/Name';
 import Para from 'react-styleguidist/lib/client/rsg-components/Para';
-import renderTypeColumn from 'react-styleguidist/lib/client/rsg-components/Props/renderType';
-import renderExtra from 'react-styleguidist/lib/client/rsg-components/Props/renderExtra';
 import renderDefault from 'react-styleguidist/lib/client/rsg-components/Props/renderDefault';
+import renderExtra from 'react-styleguidist/lib/client/rsg-components/Props/renderExtra';
+import renderTypeColumn from 'react-styleguidist/lib/client/rsg-components/Props/renderType';
 import { PropDescriptor } from 'react-styleguidist/lib/client/rsg-components/Props/util';
 
+import Arguments from './ArgumentsRenderer';
+import JsDoc from './JsDoc';
+
 function renderDescription(prop: PropDescriptor) {
   const { description, tags = {} } = prop;
   const extra = renderExtra(prop);

package/src/styleguideComponents/Wrapper.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+
 import { ThemeProvider } from '../contexts/themeContext/ThemeContext';
 
 const Wrapper: React.FC = ({ children }) => <ThemeProvider>{children}</ThemeProvider>;

package/src/utils/Streami18n.ts

@@ -6,6 +6,9 @@ import relativeTime from 'dayjs/plugin/relativeTime';
 import updateLocale from 'dayjs/plugin/updateLocale';
 import i18n, { FallbackLng, TFunction } from 'i18next';
 
+import type moment from 'moment';
+
+import type { TDateTimeParser } from '../contexts/translationContext/TranslationContext';
 import enTranslations from '../i18n/en.json';
 import frTranslations from '../i18n/fr.json';
 import hiTranslations from '../i18n/hi.json';
@@ -35,9 +38,6 @@ import 'dayjs/locale/tr';
  */
 import 'dayjs/locale/en';
 
-import type moment from 'moment';
-
-import type { TDateTimeParser } from '../contexts/translationContext/TranslationContext';
 import type { UnknownType } from '../types/types';
 
 Dayjs.extend(updateLocale);

package/src/utils/__tests__/Streami18n.test.js

@@ -2,10 +2,9 @@ import { default as Dayjs } from 'dayjs';
 import 'dayjs/locale/nl';
 import localeData from 'dayjs/plugin/localeData';
 
-import { Streami18n } from '../Streami18n';
-
 import frTranslations from '../../i18n/fr.json';
 import nlTranslations from '../../i18n/nl.json';
+import { Streami18n } from '../Streami18n';
 
 Dayjs.extend(localeData);
 

package/src/utils/date.ts

@@ -0,0 +1,4 @@
+export const ONE_SECOND_IN_MS = 1000;
+
+export const secondsUntil = (date: Date) =>
+  Math.trunc((date.getTime() - Date.now()) / ONE_SECOND_IN_MS);

package/src/utils/getResizedImageUrl.ts

@@ -0,0 +1,43 @@
+import { PixelRatio } from 'react-native';
+
+type GetResizedImageUrlParams = {
+  url: string;
+  height?: string | number;
+  width?: string | number;
+};
+
+/**
+ * Any file or image upload done through stream's chat SDK or components get uploaded
+ * to CloudFront CDN. Following function returns a url of resized image (to given width and height).
+ * It can be used to avoid rendering heavy images on UI, for the sake of performance.
+ *
+ * This function accepts an object with following properties:
+ * - height: height of the resized image.
+ * - url: url of the image.
+ * - width: width of the resized image.
+ *
+ * @returns {string} Url of the image with given height and width.
+ */
+export function getResizedImageUrl({ height, url, width }: GetResizedImageUrlParams) {
+  const isResizableUrl = url.includes('&h=*') && url.includes('&w=*') && url.includes('&resize=*');
+
+  if (!isResizableUrl || (!height && !width)) return url;
+
+  let resizedUrl = url;
+
+  if (height) {
+    resizedUrl = resizedUrl.replace(
+      'h=*',
+      `h=${PixelRatio.getPixelSizeForLayoutSize(Number(height))}`,
+    );
+  }
+
+  if (width) {
+    resizedUrl = resizedUrl.replace(
+      'w=*',
+      `w=${PixelRatio.getPixelSizeForLayoutSize(Number(width))}`,
+    );
+  }
+
+  return resizedUrl.replace('resize=*', `resize=clip`);
+}

package/src/utils/getUrlOfImageAttachment.ts

@@ -0,0 +1,10 @@
+import type { Attachment } from 'stream-chat';
+
+/**
+ * Extract url of image from image attachment.
+ * @param image Image attachment
+ * @returns {string}
+ */
+export function getUrlOfImageAttachment(image: Attachment) {
+  return image.image_url || image.thumb_url;
+}

package/src/utils/utils.ts

@@ -1,26 +1,24 @@
-import debounce from 'lodash/debounce';
+import type React from 'react';
 import { Dimensions } from 'react-native';
 
-import { compiledEmojis, Emoji } from '../emoji-data/compiled';
-
-import type React from 'react';
 import type { DebouncedFunc } from 'lodash';
+import debounce from 'lodash/debounce';
 import type {
   Channel,
   ChannelMemberAPIResponse,
   ChannelMemberResponse,
+  CommandResponse,
   StreamChat,
   UserResponse,
 } from 'stream-chat';
 
-import type { CommandsItemProps } from '../components/AutoCompleteInput/CommandsItem';
-import type { EmojisItemProps } from '../components/AutoCompleteInput/EmojisItem';
-import type { MentionsItemProps } from '../components/AutoCompleteInput/MentionsItem';
 import type { MentionAllAppUsersQuery } from '../contexts/messageInputContext/MessageInputContext';
 import type {
   SuggestionCommand,
+  SuggestionComponentType,
   SuggestionUser,
 } from '../contexts/suggestionsContext/SuggestionsContext';
+import { compiledEmojis, Emoji } from '../emoji-data/compiled';
 import type { IconProps } from '../icons/utils/base';
 import type {
   DefaultAttachmentType,
@@ -57,6 +55,12 @@ export const ProgressIndicatorTypes: {
   RETRY: 'retry',
 });
 
+export const MessageStatusTypes = {
+  FAILED: 'failed',
+  RECEIVED: 'received',
+  SENDING: 'sending',
+};
+
 const defaultAutoCompleteSuggestionsLimit = 10;
 const defaultMentionAllAppUsersQuery = {
   filters: {},
@@ -245,23 +249,22 @@ export type TriggerSettings<
   Us extends UnknownType = DefaultUserType,
 > = {
   '/'?: {
-    component: string | React.ComponentType<Partial<CommandsItemProps<Co>>>;
     dataProvider: (
-      query: SuggestionCommand<Co>['name'],
+      query: CommandResponse<Co>['name'],
       text: string,
-      onReady?: (data: SuggestionCommand<Co>[], q: SuggestionCommand<Co>['name']) => void,
+      onReady?: (data: CommandResponse<Co>[], q: CommandResponse<Co>['name']) => void,
       options?: {
         limit?: number;
       },
     ) => SuggestionCommand<Co>[];
-    output: (entity: SuggestionCommand<Co>) => {
+    output: (entity: CommandResponse<Co>) => {
       caretPosition: string;
       key: string;
       text: string;
     };
+    type: SuggestionComponentType;
   };
   ':'?: {
-    component: string | React.ComponentType<Partial<EmojisItemProps>>;
     dataProvider: (
       query: Emoji['name'],
       _: string,
@@ -272,10 +275,10 @@ export type TriggerSettings<
       key: string;
       text: string;
     };
+    type: SuggestionComponentType;
   };
   '@'?: {
     callback: (item: SuggestionUser<Us>) => void;
-    component: string | React.ComponentType<Partial<MentionsItemProps<Us>>>;
     dataProvider: (
       query: SuggestionUser<Us>['name'],
       _: string,
@@ -291,6 +294,7 @@ export type TriggerSettings<
       key: string;
       text: string;
     };
+    type: SuggestionComponentType;
   };
 };
 
@@ -368,7 +372,6 @@ export const ACITriggerSettings = <
   onMentionSelectItem,
 }: ACITriggerSettingsParams<At, Ch, Co, Ev, Me, Re, Us>): TriggerSettings<Co, Us> => ({
   '/': {
-    component: 'CommandsItem',
     dataProvider: (query, text, onReady, options = {}) => {
       if (text.indexOf('/') !== 0) return [];
 
@@ -406,9 +409,9 @@ export const ACITriggerSettings = <
       key: `${entity.name}`,
       text: `/${entity.name}`,
     }),
+    type: 'command',
   },
   ':': {
-    component: 'EmojisItem',
     dataProvider: (query, _, onReady) => {
       if (!query) return [];
 
@@ -450,12 +453,12 @@ export const ACITriggerSettings = <
       key: entity.name,
       text: entity.unicode,
     }),
+    type: 'emoji',
   },
   '@': {
     callback: (item) => {
       onMentionSelectItem(item);
     },
-    component: 'MentionsItem',
     dataProvider: (
       query,
       _,
@@ -533,6 +536,7 @@ export const ACITriggerSettings = <
       key: entity.id,
       text: `@${entity.name || entity.id}`,
     }),
+    type: 'mention',
   },
 });
 
@@ -570,3 +574,6 @@ export const generateRandomId = (a = ''): string =>
 // [#\*0-9]\uFE0F\u20E3 was replaced with [#*0-9]\uFE0F\u20E3 due to a lint warning
 export const emojiRegex =
   /^(\uD83C\uDFF4\uDB40\uDC67\uDB40\uDC62(?:\uDB40\uDC77\uDB40\uDC6C\uDB40\uDC73|\uDB40\uDC73\uDB40\uDC63\uDB40\uDC74|\uDB40\uDC65\uDB40\uDC6E\uDB40\uDC67)\uDB40\uDC7F|\uD83D\uDC69\u200D\uD83D\uDC69\u200D(?:\uD83D\uDC66\u200D\uD83D\uDC66|\uD83D\uDC67\u200D(?:\uD83D[\uDC66\uDC67]))|\uD83D\uDC68(?:\uD83C\uDFFF\u200D(?:\uD83E\uDD1D\u200D\uD83D\uDC68(?:\uD83C[\uDFFB-\uDFFE])|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E[\uDDAF-\uDDB3\uDDBC\uDDBD])|\uD83C\uDFFE\u200D(?:\uD83E\uDD1D\u200D\uD83D\uDC68(?:\uD83C[\uDFFB-\uDFFD\uDFFF])|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E[\uDDAF-\uDDB3\uDDBC\uDDBD])|\uD83C\uDFFD\u200D(?:\uD83E\uDD1D\u200D\uD83D\uDC68(?:\uD83C[\uDFFB\uDFFC\uDFFE\uDFFF])|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E[\uDDAF-\uDDB3\uDDBC\uDDBD])|\uD83C\uDFFC\u200D(?:\uD83E\uDD1D\u200D\uD83D\uDC68(?:\uD83C[\uDFFB\uDFFD-\uDFFF])|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E[\uDDAF-\uDDB3\uDDBC\uDDBD])|\uD83C\uDFFB\u200D(?:\uD83E\uDD1D\u200D\uD83D\uDC68(?:\uD83C[\uDFFC-\uDFFF])|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E[\uDDAF-\uDDB3\uDDBC\uDDBD])|\u200D(?:\u2764\uFE0F\u200D(?:\uD83D\uDC8B\u200D)?\uD83D\uDC68|(?:\uD83D[\uDC68\uDC69])\u200D(?:\uD83D\uDC66\u200D\uD83D\uDC66|\uD83D\uDC67\u200D(?:\uD83D[\uDC66\uDC67]))|\uD83D\uDC66\u200D\uD83D\uDC66|\uD83D\uDC67\u200D(?:\uD83D[\uDC66\uDC67])|(?:\uD83D[\uDC68\uDC69])\u200D(?:\uD83D[\uDC66\uDC67])|[\u2695\u2696\u2708]\uFE0F|\uD83D[\uDC66\uDC67]|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E[\uDDAF-\uDDB3\uDDBC\uDDBD])|(?:\uD83C\uDFFF\u200D[\u2695\u2696\u2708]|\uD83C\uDFFE\u200D[\u2695\u2696\u2708]|\uD83C\uDFFD\u200D[\u2695\u2696\u2708]|\uD83C\uDFFC\u200D[\u2695\u2696\u2708]|\uD83C\uDFFB\u200D[\u2695\u2696\u2708])\uFE0F|\uD83C\uDFFF|\uD83C\uDFFE|\uD83C\uDFFD|\uD83C\uDFFC|\uD83C\uDFFB)?|\uD83E\uDDD1(?:(?:\uD83C[\uDFFB-\uDFFF])\u200D(?:\uD83E\uDD1D\u200D\uD83E\uDDD1(?:\uD83C[\uDFFB-\uDFFF])|\uD83C[\uDF3E\uDF73\uDF7C\uDF84\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E[\uDDAF-\uDDB3\uDDBC\uDDBD])|\u200D(?:\uD83E\uDD1D\u200D\uD83E\uDDD1|\uD83C[\uDF3E\uDF73\uDF7C\uDF84\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E[\uDDAF-\uDDB3\uDDBC\uDDBD]))|\uD83D\uDC69(?:\u200D(?:\u2764\uFE0F\u200D(?:\uD83D\uDC8B\u200D(?:\uD83D[\uDC68\uDC69])|\uD83D[\uDC68\uDC69])|\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E[\uDDAF-\uDDB3\uDDBC\uDDBD])|\uD83C\uDFFF\u200D(?:\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E[\uDDAF-\uDDB3\uDDBC\uDDBD])|\uD83C\uDFFE\u200D(?:\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E[\uDDAF-\uDDB3\uDDBC\uDDBD])|\uD83C\uDFFD\u200D(?:\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E[\uDDAF-\uDDB3\uDDBC\uDDBD])|\uD83C\uDFFC\u200D(?:\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E[\uDDAF-\uDDB3\uDDBC\uDDBD])|\uD83C\uDFFB\u200D(?:\uD83C[\uDF3E\uDF73\uDF7C\uDF93\uDFA4\uDFA8\uDFEB\uDFED]|\uD83D[\uDCBB\uDCBC\uDD27\uDD2C\uDE80\uDE92]|\uD83E[\uDDAF-\uDDB3\uDDBC\uDDBD]))|\uD83D\uDC69\uD83C\uDFFF\u200D\uD83E\uDD1D\u200D(?:\uD83D[\uDC68\uDC69])(?:\uD83C[\uDFFB-\uDFFE])|\uD83D\uDC69\uD83C\uDFFE\u200D\uD83E\uDD1D\u200D(?:\uD83D[\uDC68\uDC69])(?:\uD83C[\uDFFB-\uDFFD\uDFFF])|\uD83D\uDC69\uD83C\uDFFD\u200D\uD83E\uDD1D\u200D(?:\uD83D[\uDC68\uDC69])(?:\uD83C[\uDFFB\uDFFC\uDFFE\uDFFF])|\uD83D\uDC69\uD83C\uDFFC\u200D\uD83E\uDD1D\u200D(?:\uD83D[\uDC68\uDC69])(?:\uD83C[\uDFFB\uDFFD-\uDFFF])|\uD83D\uDC69\uD83C\uDFFB\u200D\uD83E\uDD1D\u200D(?:\uD83D[\uDC68\uDC69])(?:\uD83C[\uDFFC-\uDFFF])|\uD83D\uDC69\u200D\uD83D\uDC66\u200D\uD83D\uDC66|\uD83D\uDC69\u200D\uD83D\uDC69\u200D(?:\uD83D[\uDC66\uDC67])|(?:\uD83D\uDC41\uFE0F\u200D\uD83D\uDDE8|\uD83D\uDC69(?:\uD83C\uDFFF\u200D[\u2695\u2696\u2708]|\uD83C\uDFFE\u200D[\u2695\u2696\u2708]|\uD83C\uDFFD\u200D[\u2695\u2696\u2708]|\uD83C\uDFFC\u200D[\u2695\u2696\u2708]|\uD83C\uDFFB\u200D[\u2695\u2696\u2708]|\u200D[\u2695\u2696\u2708])|\uD83C\uDFF3\uFE0F\u200D\u26A7|\uD83E\uDDD1(?:(?:\uD83C[\uDFFB-\uDFFF])\u200D[\u2695\u2696\u2708]|\u200D[\u2695\u2696\u2708])|\uD83D\uDC3B\u200D\u2744|(?:(?:\uD83C[\uDFC3\uDFC4\uDFCA]|\uD83D[\uDC6E\uDC70\uDC71\uDC73\uDC77\uDC81\uDC82\uDC86\uDC87\uDE45-\uDE47\uDE4B\uDE4D\uDE4E\uDEA3\uDEB4-\uDEB6]|\uD83E[\uDD26\uDD35\uDD37-\uDD39\uDD3D\uDD3E\uDDB8\uDDB9\uDDCD-\uDDCF\uDDD6-\uDDDD])(?:\uD83C[\uDFFB-\uDFFF])|\uD83D\uDC6F|\uD83E[\uDD3C\uDDDE\uDDDF])\u200D[\u2640\u2642]|(?:\u26F9|\uD83C[\uDFCB\uDFCC]|\uD83D\uDD75)(?:\uFE0F|\uD83C[\uDFFB-\uDFFF])\u200D[\u2640\u2642]|\uD83C\uDFF4\u200D\u2620|(?:\uD83C[\uDFC3\uDFC4\uDFCA]|\uD83D[\uDC6E\uDC70\uDC71\uDC73\uDC77\uDC81\uDC82\uDC86\uDC87\uDE45-\uDE47\uDE4B\uDE4D\uDE4E\uDEA3\uDEB4-\uDEB6]|\uD83E[\uDD26\uDD35\uDD37-\uDD39\uDD3D\uDD3E\uDDB8\uDDB9\uDDCD-\uDDCF\uDDD6-\uDDDD])\u200D[\u2640\u2642]|[\xA9\xAE\u203C\u2049\u2122\u2139\u2194-\u2199\u21A9\u21AA\u2328\u23CF\u23ED-\u23EF\u23F1\u23F2\u23F8-\u23FA\u24C2\u25AA\u25AB\u25B6\u25C0\u25FB\u25FC\u2600-\u2604\u260E\u2611\u2618\u2620\u2622\u2623\u2626\u262A\u262E\u262F\u2638-\u263A\u2640\u2642\u265F\u2660\u2663\u2665\u2666\u2668\u267B\u267E\u2692\u2694-\u2697\u2699\u269B\u269C\u26A0\u26A7\u26B0\u26B1\u26C8\u26CF\u26D1\u26D3\u26E9\u26F0\u26F1\u26F4\u26F7\u26F8\u2702\u2708\u2709\u270F\u2712\u2714\u2716\u271D\u2721\u2733\u2734\u2744\u2747\u2763\u2764\u27A1\u2934\u2935\u2B05-\u2B07\u3030\u303D\u3297\u3299]|\uD83C[\uDD70\uDD71\uDD7E\uDD7F\uDE02\uDE37\uDF21\uDF24-\uDF2C\uDF36\uDF7D\uDF96\uDF97\uDF99-\uDF9B\uDF9E\uDF9F\uDFCD\uDFCE\uDFD4-\uDFDF\uDFF5\uDFF7]|\uD83D[\uDC3F\uDCFD\uDD49\uDD4A\uDD6F\uDD70\uDD73\uDD76-\uDD79\uDD87\uDD8A-\uDD8D\uDDA5\uDDA8\uDDB1\uDDB2\uDDBC\uDDC2-\uDDC4\uDDD1-\uDDD3\uDDDC-\uDDDE\uDDE1\uDDE3\uDDE8\uDDEF\uDDF3\uDDFA\uDECB\uDECD-\uDECF\uDEE0-\uDEE5\uDEE9\uDEF0\uDEF3])\uFE0F|\uD83D\uDC69\u200D\uD83D\uDC67\u200D(?:\uD83D[\uDC66\uDC67])|\uD83C\uDFF3\uFE0F\u200D\uD83C\uDF08|\uD83D\uDC69\u200D\uD83D\uDC67|\uD83D\uDC69\u200D\uD83D\uDC66|\uD83D\uDC15\u200D\uD83E\uDDBA|\uD83D\uDC69(?:\uD83C\uDFFF|\uD83C\uDFFE|\uD83C\uDFFD|\uD83C\uDFFC|\uD83C\uDFFB)?|\uD83C\uDDFD\uD83C\uDDF0|\uD83C\uDDF6\uD83C\uDDE6|\uD83C\uDDF4\uD83C\uDDF2|\uD83D\uDC08\u200D\u2B1B|\uD83D\uDC41\uFE0F|\uD83C\uDFF3\uFE0F|\uD83E\uDDD1(?:\uD83C[\uDFFB-\uDFFF])?|\uD83C\uDDFF(?:\uD83C[\uDDE6\uDDF2\uDDFC])|\uD83C\uDDFE(?:\uD83C[\uDDEA\uDDF9])|\uD83C\uDDFC(?:\uD83C[\uDDEB\uDDF8])|\uD83C\uDDFB(?:\uD83C[\uDDE6\uDDE8\uDDEA\uDDEC\uDDEE\uDDF3\uDDFA])|\uD83C\uDDFA(?:\uD83C[\uDDE6\uDDEC\uDDF2\uDDF3\uDDF8\uDDFE\uDDFF])|\uD83C\uDDF9(?:\uD83C[\uDDE6\uDDE8\uDDE9\uDDEB-\uDDED\uDDEF-\uDDF4\uDDF7\uDDF9\uDDFB\uDDFC\uDDFF])|\uD83C\uDDF8(?:\uD83C[\uDDE6-\uDDEA\uDDEC-\uDDF4\uDDF7-\uDDF9\uDDFB\uDDFD-\uDDFF])|\uD83C\uDDF7(?:\uD83C[\uDDEA\uDDF4\uDDF8\uDDFA\uDDFC])|\uD83C\uDDF5(?:\uD83C[\uDDE6\uDDEA-\uDDED\uDDF0-\uDDF3\uDDF7-\uDDF9\uDDFC\uDDFE])|\uD83C\uDDF3(?:\uD83C[\uDDE6\uDDE8\uDDEA-\uDDEC\uDDEE\uDDF1\uDDF4\uDDF5\uDDF7\uDDFA\uDDFF])|\uD83C\uDDF2(?:\uD83C[\uDDE6\uDDE8-\uDDED\uDDF0-\uDDFF])|\uD83C\uDDF1(?:\uD83C[\uDDE6-\uDDE8\uDDEE\uDDF0\uDDF7-\uDDFB\uDDFE])|\uD83C\uDDF0(?:\uD83C[\uDDEA\uDDEC-\uDDEE\uDDF2\uDDF3\uDDF5\uDDF7\uDDFC\uDDFE\uDDFF])|\uD83C\uDDEF(?:\uD83C[\uDDEA\uDDF2\uDDF4\uDDF5])|\uD83C\uDDEE(?:\uD83C[\uDDE8-\uDDEA\uDDF1-\uDDF4\uDDF6-\uDDF9])|\uD83C\uDDED(?:\uD83C[\uDDF0\uDDF2\uDDF3\uDDF7\uDDF9\uDDFA])|\uD83C\uDDEC(?:\uD83C[\uDDE6\uDDE7\uDDE9-\uDDEE\uDDF1-\uDDF3\uDDF5-\uDDFA\uDDFC\uDDFE])|\uD83C\uDDEB(?:\uD83C[\uDDEE-\uDDF0\uDDF2\uDDF4\uDDF7])|\uD83C\uDDEA(?:\uD83C[\uDDE6\uDDE8\uDDEA\uDDEC\uDDED\uDDF7-\uDDFA])|\uD83C\uDDE9(?:\uD83C[\uDDEA\uDDEC\uDDEF\uDDF0\uDDF2\uDDF4\uDDFF])|\uD83C\uDDE8(?:\uD83C[\uDDE6\uDDE8\uDDE9\uDDEB-\uDDEE\uDDF0-\uDDF5\uDDF7\uDDFA-\uDDFF])|\uD83C\uDDE7(?:\uD83C[\uDDE6\uDDE7\uDDE9-\uDDEF\uDDF1-\uDDF4\uDDF6-\uDDF9\uDDFB\uDDFC\uDDFE\uDDFF])|\uD83C\uDDE6(?:\uD83C[\uDDE8-\uDDEC\uDDEE\uDDF1\uDDF2\uDDF4\uDDF6-\uDDFA\uDDFC\uDDFD\uDDFF])|[#*0-9]\uFE0F\u20E3|(?:\uD83C[\uDFC3\uDFC4\uDFCA]|\uD83D[\uDC6E\uDC70\uDC71\uDC73\uDC77\uDC81\uDC82\uDC86\uDC87\uDE45-\uDE47\uDE4B\uDE4D\uDE4E\uDEA3\uDEB4-\uDEB6]|\uD83E[\uDD26\uDD35\uDD37-\uDD39\uDD3D\uDD3E\uDDB8\uDDB9\uDDCD-\uDDCF\uDDD6-\uDDDD])(?:\uD83C[\uDFFB-\uDFFF])|(?:\u26F9|\uD83C[\uDFCB\uDFCC]|\uD83D\uDD75)(?:\uFE0F|\uD83C[\uDFFB-\uDFFF])|\uD83C\uDFF4|(?:[\u270A\u270B]|\uD83C[\uDF85\uDFC2\uDFC7]|\uD83D[\uDC42\uDC43\uDC46-\uDC50\uDC66\uDC67\uDC6B-\uDC6D\uDC72\uDC74-\uDC76\uDC78\uDC7C\uDC83\uDC85\uDCAA\uDD7A\uDD95\uDD96\uDE4C\uDE4F\uDEC0\uDECC]|\uD83E[\uDD0C\uDD0F\uDD18-\uDD1C\uDD1E\uDD1F\uDD30-\uDD34\uDD36\uDD77\uDDB5\uDDB6\uDDBB\uDDD2-\uDDD5])(?:\uD83C[\uDFFB-\uDFFF])|(?:[\u261D\u270C\u270D]|\uD83D[\uDD74\uDD90])(?:\uFE0F|\uD83C[\uDFFB-\uDFFF])|[\u270A\u270B]|\uD83C[\uDF85\uDFC2\uDFC7]|\uD83D[\uDC08\uDC15\uDC3B\uDC42\uDC43\uDC46-\uDC50\uDC66\uDC67\uDC6B-\uDC6D\uDC72\uDC74-\uDC76\uDC78\uDC7C\uDC83\uDC85\uDCAA\uDD7A\uDD95\uDD96\uDE4C\uDE4F\uDEC0\uDECC]|\uD83E[\uDD0C\uDD0F\uDD18-\uDD1C\uDD1E\uDD1F\uDD30-\uDD34\uDD36\uDD77\uDDB5\uDDB6\uDDBB\uDDD2-\uDDD5]|\uD83C[\uDFC3\uDFC4\uDFCA]|\uD83D[\uDC6E\uDC70\uDC71\uDC73\uDC77\uDC81\uDC82\uDC86\uDC87\uDE45-\uDE47\uDE4B\uDE4D\uDE4E\uDEA3\uDEB4-\uDEB6]|\uD83E[\uDD26\uDD35\uDD37-\uDD39\uDD3D\uDD3E\uDDB8\uDDB9\uDDCD-\uDDCF\uDDD6-\uDDDD]|\uD83D\uDC6F|\uD83E[\uDD3C\uDDDE\uDDDF]|[\u231A\u231B\u23E9-\u23EC\u23F0\u23F3\u25FD\u25FE\u2614\u2615\u2648-\u2653\u267F\u2693\u26A1\u26AA\u26AB\u26BD\u26BE\u26C4\u26C5\u26CE\u26D4\u26EA\u26F2\u26F3\u26F5\u26FA\u26FD\u2705\u2728\u274C\u274E\u2753-\u2755\u2757\u2795-\u2797\u27B0\u27BF\u2B1B\u2B1C\u2B50\u2B55]|\uD83C[\uDC04\uDCCF\uDD8E\uDD91-\uDD9A\uDE01\uDE1A\uDE2F\uDE32-\uDE36\uDE38-\uDE3A\uDE50\uDE51\uDF00-\uDF20\uDF2D-\uDF35\uDF37-\uDF7C\uDF7E-\uDF84\uDF86-\uDF93\uDFA0-\uDFC1\uDFC5\uDFC6\uDFC8\uDFC9\uDFCF-\uDFD3\uDFE0-\uDFF0\uDFF8-\uDFFF]|\uD83D[\uDC00-\uDC07\uDC09-\uDC14\uDC16-\uDC3A\uDC3C-\uDC3E\uDC40\uDC44\uDC45\uDC51-\uDC65\uDC6A\uDC79-\uDC7B\uDC7D-\uDC80\uDC84\uDC88-\uDCA9\uDCAB-\uDCFC\uDCFF-\uDD3D\uDD4B-\uDD4E\uDD50-\uDD67\uDDA4\uDDFB-\uDE44\uDE48-\uDE4A\uDE80-\uDEA2\uDEA4-\uDEB3\uDEB7-\uDEBF\uDEC1-\uDEC5\uDED0-\uDED2\uDED5-\uDED7\uDEEB\uDEEC\uDEF4-\uDEFC\uDFE0-\uDFEB]|\uD83E[\uDD0D\uDD0E\uDD10-\uDD17\uDD1D\uDD20-\uDD25\uDD27-\uDD2F\uDD3A\uDD3F-\uDD45\uDD47-\uDD76\uDD78\uDD7A-\uDDB4\uDDB7\uDDBA\uDDBC-\uDDCB\uDDD0\uDDE0-\uDDFF\uDE70-\uDE74\uDE78-\uDE7A\uDE80-\uDE86\uDE90-\uDEA8\uDEB0-\uDEB6\uDEC0-\uDEC2\uDED0-\uDED6])+$/;
+
+export const urlRegex =
+  /(?:\s|^)((?:https?:\/\/)?(?:[a-z0-9-]+(?:\.[a-z0-9-]+)+)(?::[0-9]+)?(?:\/(?:[^\s]+)?)?)/g;

package/src/version.json

@@ -1,3 +1,3 @@
 {
-  "version": "3.10.2"
+  "version": "4.0.0-beta.4"
 }

package/lib/commonjs/components/AutoCompleteInput/CommandsHeader.js

@@ -1,78 +0,0 @@
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.CommandsHeader = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _reactNative = require("react-native");
-
-var _ThemeContext = require("../../contexts/themeContext/ThemeContext");
-
-var _TranslationContext = require("../../contexts/translationContext/TranslationContext");
-
-var _Lightning = require("../../icons/Lightning");
-
-var _this = this,
-    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/AutoCompleteInput/CommandsHeader.tsx";
-
-var styles = _reactNative.StyleSheet.create({
-  container: {
-    alignItems: 'center',
-    flexDirection: 'row',
-    padding: 8
-  },
-  title: {
-    fontSize: 14,
-    paddingLeft: 8
-  }
-});
-
-var CommandsHeader = function CommandsHeader() {
-  var _useTheme = (0, _ThemeContext.useTheme)(),
-      _useTheme$theme = _useTheme.theme,
-      _useTheme$theme$color = _useTheme$theme.colors,
-      accent_blue = _useTheme$theme$color.accent_blue,
-      grey = _useTheme$theme$color.grey,
-      _useTheme$theme$messa = _useTheme$theme.messageInput.suggestions.commandsHeader,
-      container = _useTheme$theme$messa.container,
-      title = _useTheme$theme$messa.title;
-
-  var _useTranslationContex = (0, _TranslationContext.useTranslationContext)(),
-      t = _useTranslationContex.t;
-
-  return _react["default"].createElement(_reactNative.View, {
-    style: [styles.container, container],
-    __self: _this,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 34,
-      columnNumber: 5
-    }
-  }, _react["default"].createElement(_Lightning.Lightning, {
-    pathFill: accent_blue,
-    __self: _this,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 35,
-      columnNumber: 7
-    }
-  }), _react["default"].createElement(_reactNative.Text, {
-    style: [styles.title, {
-      color: grey
-    }, title],
-    testID: "commands-header-title",
-    __self: _this,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 36,
-      columnNumber: 7
-    }
-  }, t('Instant Commands')));
-};
-
-exports.CommandsHeader = CommandsHeader;
-CommandsHeader.displayName = 'CommandsHeader{messageInput{suggestions{commandsHeader}}}';
-//# sourceMappingURL=CommandsHeader.js.map

package/lib/commonjs/components/AutoCompleteInput/CommandsHeader.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["CommandsHeader.tsx"],"names":["styles","StyleSheet","create","container","alignItems","flexDirection","padding","title","fontSize","paddingLeft","CommandsHeader","theme","colors","accent_blue","grey","messageInput","suggestions","commandsHeader","t","color","displayName"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;AAEA,IAAMA,MAAM,GAAGC,wBAAWC,MAAX,CAAkB;AAC/BC,EAAAA,SAAS,EAAE;AACTC,IAAAA,UAAU,EAAE,QADH;AAETC,IAAAA,aAAa,EAAE,KAFN;AAGTC,IAAAA,OAAO,EAAE;AAHA,GADoB;AAM/BC,EAAAA,KAAK,EAAE;AACLC,IAAAA,QAAQ,EAAE,EADL;AAELC,IAAAA,WAAW,EAAE;AAFR;AANwB,CAAlB,CAAf;;AAYO,IAAMC,cAAwB,GAAG,SAA3BA,cAA2B,GAAM;AAC5C,kBASI,6BATJ;AAAA,kCACEC,KADF;AAAA,8CAEIC,MAFJ;AAAA,MAEcC,WAFd,yBAEcA,WAFd;AAAA,MAE2BC,IAF3B,yBAE2BA,IAF3B;AAAA,8CAGIC,YAHJ,CAIMC,WAJN,CAKQC,cALR;AAAA,MAK0Bd,SAL1B,yBAK0BA,SAL1B;AAAA,MAKqCI,KALrC,yBAKqCA,KALrC;;AAUA,8BAAc,gDAAd;AAAA,MAAQW,CAAR,yBAAQA,CAAR;;AAEA,SACE,gCAAC,iBAAD;AAAM,IAAA,KAAK,EAAE,CAAClB,MAAM,CAACG,SAAR,EAAmBA,SAAnB,CAAb;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KACE,gCAAC,oBAAD;AAAW,IAAA,QAAQ,EAAEU,WAArB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IADF,EAEE,gCAAC,iBAAD;AAAM,IAAA,KAAK,EAAE,CAACb,MAAM,CAACO,KAAR,EAAe;AAAEY,MAAAA,KAAK,EAAEL;AAAT,KAAf,EAAgCP,KAAhC,CAAb;AAAqD,IAAA,MAAM,EAAC,uBAA5D;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KACGW,CAAC,CAAC,kBAAD,CADJ,CAFF,CADF;AAQD,CArBM;;;AAuBPR,cAAc,CAACU,WAAf,GAA6B,2DAA7B","sourcesContent":["import React from 'react';\nimport { StyleSheet, Text, View } from 'react-native';\n\nimport { useTheme } from '../../contexts/themeContext/ThemeContext';\nimport { useTranslationContext } from '../../contexts/translationContext/TranslationContext';\nimport { Lightning } from '../../icons/Lightning';\n\nconst styles = StyleSheet.create({\n  container: {\n    alignItems: 'center',\n    flexDirection: 'row',\n    padding: 8,\n  },\n  title: {\n    fontSize: 14,\n    paddingLeft: 8,\n  },\n});\n\nexport const CommandsHeader: React.FC = () => {\n  const {\n    theme: {\n      colors: { accent_blue, grey },\n      messageInput: {\n        suggestions: {\n          commandsHeader: { container, title },\n        },\n      },\n    },\n  } = useTheme();\n  const { t } = useTranslationContext();\n\n  return (\n    <View style={[styles.container, container]}>\n      <Lightning pathFill={accent_blue} />\n      <Text style={[styles.title, { color: grey }, title]} testID='commands-header-title'>\n        {t('Instant Commands')}\n      </Text>\n    </View>\n  );\n};\n\nCommandsHeader.displayName = 'CommandsHeader{messageInput{suggestions{commandsHeader}}}';\n"]}

package/lib/commonjs/components/AutoCompleteInput/CommandsItem.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["CommandsItem.tsx"],"names":["styles","StyleSheet","create","args","fontSize","container","alignItems","flexDirection","paddingHorizontal","paddingVertical","iconContainer","borderRadius","height","justifyContent","marginRight","width","title","fontWeight","paddingRight","Icon","name","theme","colors","accent_blue","white","messageInput","suggestions","command","backgroundColor","CommandsItem","item","black","grey","argsStyle","color","replace","char","toUpperCase","displayName"],"mappings":"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","sourcesContent":["import React from 'react';\nimport { StyleSheet, Text, View } from 'react-native';\n\nimport { useTheme } from '../../contexts/themeContext/ThemeContext';\nimport { Flag, GiphyIcon, Imgur, Lightning, Mute, Sound, UserAdd, UserDelete } from '../../icons';\n\nimport type { SuggestionCommand } from '../../contexts/suggestionsContext/SuggestionsContext';\nimport type { DefaultCommandType } from '../../types/types';\n\nconst styles = StyleSheet.create({\n  args: {\n    fontSize: 14,\n  },\n  container: {\n    alignItems: 'center',\n    flexDirection: 'row',\n    paddingHorizontal: 16,\n    paddingVertical: 8,\n  },\n  iconContainer: {\n    alignItems: 'center',\n    borderRadius: 12,\n    height: 24,\n    justifyContent: 'center',\n    marginRight: 8,\n    width: 24,\n  },\n  title: {\n    fontSize: 14,\n    fontWeight: 'bold',\n    paddingRight: 8,\n  },\n});\n\nconst Icon = <Co extends string = DefaultCommandType>({\n  name,\n}: {\n  name: SuggestionCommand<Co>['name'];\n}) => {\n  const {\n    theme: {\n      colors: { accent_blue, white },\n      messageInput: {\n        suggestions: {\n          command: { iconContainer },\n        },\n      },\n    },\n  } = useTheme();\n  switch (name) {\n    case 'ban':\n      return (\n        <View style={[styles.iconContainer, { backgroundColor: accent_blue }, iconContainer]}>\n          <UserDelete height={16} pathFill={white} width={16} />\n        </View>\n      );\n    case 'flag':\n      return (\n        <View style={[styles.iconContainer, { backgroundColor: accent_blue }, iconContainer]}>\n          <Flag pathFill={white} />\n        </View>\n      );\n    case 'giphy':\n      return (\n        <View style={[styles.iconContainer, { backgroundColor: accent_blue }, iconContainer]}>\n          <GiphyIcon />\n        </View>\n      );\n    case 'imgur':\n      return (\n        <View style={[styles.iconContainer, { backgroundColor: accent_blue }, iconContainer]}>\n          <Imgur />\n        </View>\n      );\n    case 'mute':\n      return (\n        <View style={[styles.iconContainer, { backgroundColor: accent_blue }, iconContainer]}>\n          <Mute height={16} pathFill={white} width={16} />\n        </View>\n      );\n    case 'unban':\n      return (\n        <View style={[styles.iconContainer, { backgroundColor: accent_blue }, iconContainer]}>\n          <UserAdd height={16} pathFill={white} width={16} />\n        </View>\n      );\n    case 'unmute':\n      return (\n        <View style={[styles.iconContainer, { backgroundColor: accent_blue }, iconContainer]}>\n          <Sound pathFill={white} />\n        </View>\n      );\n    default:\n      return (\n        <View style={[styles.iconContainer, { backgroundColor: accent_blue }, iconContainer]}>\n          <Lightning height={16} pathFill={white} width={16} />\n        </View>\n      );\n  }\n};\n\nexport type CommandsItemProps<Co extends string = DefaultCommandType> = {\n  /**\n   * A CommandResponse of suggested CommandTypes with these properties\n   *\n   * - args: Arguments which can be passed to the command\n   * - name: Name of the command\n   */\n  item: SuggestionCommand<Co>;\n};\n\nexport const CommandsItem = <Co extends string = DefaultCommandType>({\n  item: { args, name },\n}: CommandsItemProps<Co>) => {\n  const {\n    theme: {\n      colors: { black, grey },\n      messageInput: {\n        suggestions: {\n          command: { args: argsStyle, container, title },\n        },\n      },\n    },\n  } = useTheme();\n\n  return (\n    <View style={[styles.container, container]}>\n      <Icon name={name} />\n      <Text style={[styles.title, { color: black }, title]} testID='commands-item-title'>\n        {(name || '').replace(/^\\w/, (char) => char.toUpperCase())}\n      </Text>\n      <Text style={[styles.args, { color: grey }, argsStyle]} testID='commands-item-args'>\n        {`/${name} ${args}`}\n      </Text>\n    </View>\n  );\n};\n\nCommandsItem.displayName = 'CommandsItem{messageInput{suggestions{command}}}';\n"]}

package/lib/commonjs/components/AutoCompleteInput/EmojisHeader.js

@@ -1,81 +0,0 @@
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.EmojisHeader = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _reactNative = require("react-native");
-
-var _ThemeContext = require("../../contexts/themeContext/ThemeContext");
-
-var _TranslationContext = require("../../contexts/translationContext/TranslationContext");
-
-var _Smile = require("../../icons/Smile");
-
-var _this = this,
-    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/AutoCompleteInput/EmojisHeader.tsx";
-
-var styles = _reactNative.StyleSheet.create({
-  container: {
-    alignItems: 'center',
-    flexDirection: 'row',
-    padding: 8
-  },
-  title: {
-    fontSize: 14,
-    paddingLeft: 8
-  }
-});
-
-var EmojisHeader = function EmojisHeader(_ref) {
-  var _ref$title = _ref.title,
-      title = _ref$title === void 0 ? '' : _ref$title;
-
-  var _useTheme = (0, _ThemeContext.useTheme)(),
-      _useTheme$theme = _useTheme.theme,
-      _useTheme$theme$color = _useTheme$theme.colors,
-      accent_blue = _useTheme$theme$color.accent_blue,
-      grey = _useTheme$theme$color.grey,
-      _useTheme$theme$messa = _useTheme$theme.messageInput.suggestions.emojisHeader,
-      container = _useTheme$theme$messa.container,
-      titleStyle = _useTheme$theme$messa.title;
-
-  var _useTranslationContex = (0, _TranslationContext.useTranslationContext)(),
-      t = _useTranslationContex.t;
-
-  return _react["default"].createElement(_reactNative.View, {
-    style: [styles.container, container],
-    __self: _this,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 36,
-      columnNumber: 5
-    }
-  }, _react["default"].createElement(_Smile.Smile, {
-    pathFill: accent_blue,
-    __self: _this,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 37,
-      columnNumber: 7
-    }
-  }), _react["default"].createElement(_reactNative.Text, {
-    style: [styles.title, {
-      color: grey
-    }, titleStyle],
-    testID: "emojis-header-title",
-    __self: _this,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 38,
-      columnNumber: 7
-    }
-  }, t('Emoji matching') + (" \"" + title + "\"")));
-};
-
-exports.EmojisHeader = EmojisHeader;
-EmojisHeader.displayName = 'EmojisHeader{messageInput{suggestions{emojisHeader}}}';
-//# sourceMappingURL=EmojisHeader.js.map

package/lib/commonjs/components/AutoCompleteInput/EmojisHeader.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["EmojisHeader.tsx"],"names":["styles","StyleSheet","create","container","alignItems","flexDirection","padding","title","fontSize","paddingLeft","EmojisHeader","theme","colors","accent_blue","grey","messageInput","suggestions","emojisHeader","titleStyle","t","color","displayName"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;AACA;;AACA;;;;;AAEA,IAAMA,MAAM,GAAGC,wBAAWC,MAAX,CAAkB;AAC/BC,EAAAA,SAAS,EAAE;AACTC,IAAAA,UAAU,EAAE,QADH;AAETC,IAAAA,aAAa,EAAE,KAFN;AAGTC,IAAAA,OAAO,EAAE;AAHA,GADoB;AAM/BC,EAAAA,KAAK,EAAE;AACLC,IAAAA,QAAQ,EAAE,EADL;AAELC,IAAAA,WAAW,EAAE;AAFR;AANwB,CAAlB,CAAf;;AAcO,IAAMC,YAAyC,GAAG,SAA5CA,YAA4C,OAAoB;AAAA,wBAAjBH,KAAiB;AAAA,MAAjBA,KAAiB,2BAAT,EAAS;;AAC3E,kBASI,6BATJ;AAAA,kCACEI,KADF;AAAA,8CAEIC,MAFJ;AAAA,MAEcC,WAFd,yBAEcA,WAFd;AAAA,MAE2BC,IAF3B,yBAE2BA,IAF3B;AAAA,8CAGIC,YAHJ,CAIMC,WAJN,CAKQC,YALR;AAAA,MAKwBd,SALxB,yBAKwBA,SALxB;AAAA,MAK0Ce,UAL1C,yBAKmCX,KALnC;;AAUA,8BAAc,gDAAd;AAAA,MAAQY,CAAR,yBAAQA,CAAR;;AAEA,SACE,gCAAC,iBAAD;AAAM,IAAA,KAAK,EAAE,CAACnB,MAAM,CAACG,SAAR,EAAmBA,SAAnB,CAAb;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KACE,gCAAC,YAAD;AAAO,IAAA,QAAQ,EAAEU,WAAjB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IADF,EAEE,gCAAC,iBAAD;AAAM,IAAA,KAAK,EAAE,CAACb,MAAM,CAACO,KAAR,EAAe;AAAEa,MAAAA,KAAK,EAAEN;AAAT,KAAf,EAAgCI,UAAhC,CAAb;AAA0D,IAAA,MAAM,EAAC,qBAAjE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KACGC,CAAC,CAAC,gBAAD,CAAD,YAA2BZ,KAA3B,QADH,CAFF,CADF;AAQD,CArBM;;;AAuBPG,YAAY,CAACW,WAAb,GAA2B,uDAA3B","sourcesContent":["import React from 'react';\nimport { StyleSheet, Text, View } from 'react-native';\n\nimport { useTheme } from '../../contexts/themeContext/ThemeContext';\nimport { useTranslationContext } from '../../contexts/translationContext/TranslationContext';\nimport { Smile } from '../../icons/Smile';\n\nconst styles = StyleSheet.create({\n  container: {\n    alignItems: 'center',\n    flexDirection: 'row',\n    padding: 8,\n  },\n  title: {\n    fontSize: 14,\n    paddingLeft: 8,\n  },\n});\n\nexport type EmojisHeaderProps = { title: string };\n\nexport const EmojisHeader: React.FC<EmojisHeaderProps> = ({ title = '' }) => {\n  const {\n    theme: {\n      colors: { accent_blue, grey },\n      messageInput: {\n        suggestions: {\n          emojisHeader: { container, title: titleStyle },\n        },\n      },\n    },\n  } = useTheme();\n  const { t } = useTranslationContext();\n\n  return (\n    <View style={[styles.container, container]}>\n      <Smile pathFill={accent_blue} />\n      <Text style={[styles.title, { color: grey }, titleStyle]} testID='emojis-header-title'>\n        {t('Emoji matching') + ` \"${title}\"`}\n      </Text>\n    </View>\n  );\n};\n\nEmojisHeader.displayName = 'EmojisHeader{messageInput{suggestions{emojisHeader}}}';\n"]}

package/lib/commonjs/components/AutoCompleteInput/EmojisItem.js

@@ -1,75 +0,0 @@
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.EmojisItem = void 0;
-
-var _react = _interopRequireDefault(require("react"));
-
-var _reactNative = require("react-native");
-
-var _ThemeContext = require("../../contexts/themeContext/ThemeContext");
-
-var _this = this,
-    _jsxFileName = "/home/runner/work/stream-chat-react-native/stream-chat-react-native/package/src/components/AutoCompleteInput/EmojisItem.tsx";
-
-var styles = _reactNative.StyleSheet.create({
-  container: {
-    alignItems: 'center',
-    flexDirection: 'row',
-    paddingHorizontal: 10
-  },
-  text: {
-    fontSize: 14
-  }
-});
-
-var EmojisItem = function EmojisItem(_ref) {
-  var _ref$item = _ref.item,
-      name = _ref$item.name,
-      unicode = _ref$item.unicode;
-
-  var _useTheme = (0, _ThemeContext.useTheme)(),
-      _useTheme$theme = _useTheme.theme,
-      black = _useTheme$theme.colors.black,
-      _useTheme$theme$messa = _useTheme$theme.messageInput.suggestions.emoji,
-      container = _useTheme$theme$messa.container,
-      text = _useTheme$theme$messa.text;
-
-  return _react["default"].createElement(_reactNative.View, {
-    style: [styles.container, container],
-    __self: _this,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 41,
-      columnNumber: 5
-    }
-  }, _react["default"].createElement(_reactNative.Text, {
-    style: [styles.text, {
-      color: black
-    }, text],
-    testID: "emojis-item-unicode",
-    __self: _this,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 42,
-      columnNumber: 7
-    }
-  }, unicode), _react["default"].createElement(_reactNative.Text, {
-    style: [styles.text, {
-      color: black
-    }, text],
-    testID: "emojis-item-name",
-    __self: _this,
-    __source: {
-      fileName: _jsxFileName,
-      lineNumber: 45,
-      columnNumber: 7
-    }
-  }, " " + name));
-};
-
-exports.EmojisItem = EmojisItem;
-EmojisItem.displayName = 'EmojisItem{messageInput{suggestions{emoji}}}';
-//# sourceMappingURL=EmojisItem.js.map

package/lib/commonjs/components/AutoCompleteInput/EmojisItem.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["EmojisItem.tsx"],"names":["styles","StyleSheet","create","container","alignItems","flexDirection","paddingHorizontal","text","fontSize","EmojisItem","item","name","unicode","theme","black","colors","messageInput","suggestions","emoji","color","displayName"],"mappings":";;;;;;;AAAA;;AACA;;AAEA;;;;;AAGA,IAAMA,MAAM,GAAGC,wBAAWC,MAAX,CAAkB;AAC/BC,EAAAA,SAAS,EAAE;AACTC,IAAAA,UAAU,EAAE,QADH;AAETC,IAAAA,aAAa,EAAE,KAFN;AAGTC,IAAAA,iBAAiB,EAAE;AAHV,GADoB;AAM/BC,EAAAA,IAAI,EAAE;AACJC,IAAAA,QAAQ,EAAE;AADN;AANyB,CAAlB,CAAf;;AAqBO,IAAMC,UAAqC,GAAG,SAAxCA,UAAwC,OAAiC;AAAA,uBAA9BC,IAA8B;AAAA,MAAtBC,IAAsB,aAAtBA,IAAsB;AAAA,MAAhBC,OAAgB,aAAhBA,OAAgB;;AACpF,kBASI,6BATJ;AAAA,kCACEC,KADF;AAAA,MAEcC,KAFd,mBAEIC,MAFJ,CAEcD,KAFd;AAAA,8CAGIE,YAHJ,CAIMC,WAJN,CAKQC,KALR;AAAA,MAKiBf,SALjB,yBAKiBA,SALjB;AAAA,MAK4BI,IAL5B,yBAK4BA,IAL5B;;AAWA,SACE,gCAAC,iBAAD;AAAM,IAAA,KAAK,EAAE,CAACP,MAAM,CAACG,SAAR,EAAmBA,SAAnB,CAAb;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KACE,gCAAC,iBAAD;AAAM,IAAA,KAAK,EAAE,CAACH,MAAM,CAACO,IAAR,EAAc;AAAEY,MAAAA,KAAK,EAAEL;AAAT,KAAd,EAAgCP,IAAhC,CAAb;AAAoD,IAAA,MAAM,EAAC,qBAA3D;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KACGK,OADH,CADF,EAIE,gCAAC,iBAAD;AAAM,IAAA,KAAK,EAAE,CAACZ,MAAM,CAACO,IAAR,EAAc;AAAEY,MAAAA,KAAK,EAAEL;AAAT,KAAd,EAAgCP,IAAhC,CAAb;AAAoD,IAAA,MAAM,EAAC,kBAA3D;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,WACOI,IADP,CAJF,CADF;AAUD,CAtBM;;;AAwBPF,UAAU,CAACW,WAAX,GAAyB,8CAAzB","sourcesContent":["import React from 'react';\nimport { StyleSheet, Text, View } from 'react-native';\n\nimport { useTheme } from '../../contexts/themeContext/ThemeContext';\nimport type { Emoji } from '../../emoji-data/compiled';\n\nconst styles = StyleSheet.create({\n  container: {\n    alignItems: 'center',\n    flexDirection: 'row',\n    paddingHorizontal: 10,\n  },\n  text: {\n    fontSize: 14,\n  },\n});\n\nexport type EmojisItemProps = {\n  /**\n   * A EmojiResponse of suggested EmojiTypes with these properties\n   *\n   * - name: Name of emoji\n   * - unicode: Emoji unicode value\n   */\n  item: Emoji;\n};\n\nexport const EmojisItem: React.FC<EmojisItemProps> = ({ item: { name, unicode } }) => {\n  const {\n    theme: {\n      colors: { black },\n      messageInput: {\n        suggestions: {\n          emoji: { container, text },\n        },\n      },\n    },\n  } = useTheme();\n\n  return (\n    <View style={[styles.container, container]}>\n      <Text style={[styles.text, { color: black }, text]} testID='emojis-item-unicode'>\n        {unicode}\n      </Text>\n      <Text style={[styles.text, { color: black }, text]} testID='emojis-item-name'>\n        {` ${name}`}\n      </Text>\n    </View>\n  );\n};\n\nEmojisItem.displayName = 'EmojisItem{messageInput{suggestions{emoji}}}';\n"]}