stream-chat-react-native-core 5.4.3-beta.1 → 5.4.4-beta.1

package/lib/commonjs/utils/Streami18n.md

@@ -1,390 +0,0 @@
-Wrapper around [i18next](https://www.i18next.com/) class for Stream related translations.
-
-### API
-
-- **constructor**(options)
-
-  Constructor accepts following options:
-
-  - **language** (String) default: 'en'
-
-    Language code e.g., en, tr
-
-  - **disableDateTimeTranslations** (boolean) default: false
-
-    Disable translations for datetimes
-
-  - **debug** (boolean) default: false
-
-    Enable debug mode in internal i18n class
-
-  - **logger** (function) default: () => {}
-
-    Logger function to log warnings/errors from this class
-
-  - **dayjsLocaleConfigForLanguage** (object) default: 'enConfig'
-
-    [Config object](https://github.com/iamkun/dayjs/tree/dev/src/locale) for internal dayjs object, corresponding to language (param)
-
-  - **DateTimeParser** (function)
-
-    Moment or Dayjs instance/function.
-
-- **geti18Instance**
-
-  Returns an instance of [i18next](https://www.i18next.com/) used internally.
-
-- **getAvailableLanguages**
-
-  Returns all the languages (code) registered with Streami18n
-
-- **getTranslations**
-
-  Returns all the translations registered with Streami18n
-
-- **getTranslators**
-
-  Returns an object containing t (i18next translator) and momentjs instance (configured with set language)
-
-  ```js static
-  const streami18n = new Streami18n({ language: 'nl' });
-  const { t, tDateTimeParser } = await streami18n.getTranslators();
-  ```
-
-- **registerTranslation**
-
-  _params_
-
-  - language | string
-  - translator | object
-  - customDayjsLocale | object (optional)
-
-  ```js static
-    streami18n.registerTranslation(
-      'mr',
-      {
-        'Nothing yet...': 'काहीही नाही  ...',
-        '{{ firstUser }} and {{ secondUser }} are typing...':
-            '{{ firstUser }} आणि {{ secondUser }} टीपी करत आहेत ',
-      },
-      {
-        months: [...],
-        monthsShort: [...],
-        calendar: {
-            sameDay: '...'
-        }
-      }
-    );
-  ```
-
-- **setLanguage**
-
-  Set a different language
-
-  ```js static
-  streami18n.setLanguage('tr');
-  ```
-
-Instance of this class should be provided to Chat component to handle translations.
-Stream provides following list of in-built translations:
-
-1. English (en)
-2. Dutch (nl)
-3. Russian (ru)
-4. Turkish (tr)
-5. French (fr)
-6. Italian (it)
-7. Hindi (hi)
-
-### Docs
-
-- **Text translations**
-
-  Simplest way to start using chat components in one of the in-built languages would be following:
-
-  ```js static
-  const i18n = new Streami18n({ language: 'nl' });
-  <Chat client={chatClient} i18nInstance={i18n}>
-    ...
-  </Chat>;
-  ```
-
-  If you would like to override certain keys in in-built translation.
-  UI will be automatically updated in this case.
-
-  ```js static
-  const i18n = new Streami18n({
-    language: 'nl',
-    translationsForLanguage: {
-      'Nothing yet...': 'Nog Niet ...',
-      '{{ firstUser }} and {{ secondUser }} are typing...':
-        '{{ firstUser }} en {{ secondUser }} zijn aan het typen...',
-    },
-  });
-  ```
-
-  If you would like to register additional languages, use registerTranslation. You can add as many languages as you want:
-
-  ```js static
-  i18n.registerTranslation('zh', {
-    'Nothing yet...': 'Nog Niet ...',
-    '{{ firstUser }} and {{ secondUser }} are typing...':
-      '{{ firstUser }} en {{ secondUser }} zijn aan het typen...',
-  });
-
-  <Chat client={chatClient} i18nInstance={i18n}>
-    ...
-  </Chat>;
-  ```
-
-  You can use the same function to add whole new language as well.
-
-  ```js static
-  const i18n = new Streami18n();
-
-  i18n.registerTranslation('mr', {
-    'Nothing yet...': 'काहीही नाही  ...',
-    '{{ firstUser }} and {{ secondUser }} are typing...':
-      '{{ firstUser }} आणि {{ secondUser }} टीपी करत आहेत ',
-  });
-
-  // Make sure to call setLanguage to reflect new language in UI.
-  i18n.setLanguage('it');
-
-  <Chat client={chatClient} i18nInstance={i18n}>
-    ...
-  </Chat>;
-  ```
-
-  We have exported all the in-built translations in our library. You can import them in your project as following:
-
-  ```js static
-  import {
-    enTranslations,
-    nlTranslations,
-    ruTranslations,
-    trTranslations,
-    frTranslations,
-    hiTranslations,
-    itTranslations,
-    esTranslations,
-  } from 'stream-chat-react-native'; // or 'stream-chat-expo'
-  ```
-
-  If you would like to maintain your own translation files:
-
-  1. Create a json file in your project with whatever name you prefer. Best practice would be to name it after
-     the language-translations it contains e.g, If you are creating a translation file for Korean language then `ko.json`
-  2. Copy the content of file https://github.com/GetStream/stream-chat-react/blob/master/src/i18n/en.json
-  3. Change the values of the keys as translation of key.
-  4. Use it in chat client:
-
-  ```js static
-  import koTranslation from 'path/to/ko.json';
-  import deTranslation from 'path/to/de.json';
-  const i18n = new Streami18n();
-  i18n.registerTranslation('ko', koTranslation);
-  i18n.registerTranslation('de', deTranslation);
-  // You can switch language at any point in lifetime of component, it will automatically reflect in UI.
-  i18n.setLanguage('ko');
-  <Chat client={chatClient} i18nInstance={i18n}>
-    ...
-  </Chat>;
-  ```
-
-## Datetime translations
-
-Stream react chat components uses [dayjs](https://day.js.org/en/) internally by default to format datetime stamp.
-e.g., in ChannelPreview, MessageContent components.
-Dayjs has locale support as well - https://day.js.org/docs/en/i18n/i18n
-Dayjs is a lightweight alternative to Momentjs with the same modern API.
-
-Dayjs provides locale config for plenty of languages, you can check the whole list of locale configs at following url
-https://github.com/iamkun/dayjs/tree/dev/src/locale
-
-You can either provide the dayjs locale config while registering
-language with Streami18n (either via constructor or registerTranslation()) OR you can provide your own Dayjs or Moment instance
-to Streami18n constructor, which will be then used internally (using the language locale) in components.
-
-### Via language registration
-
-e.g.,
-
-```js static
-const i18n = new Streami18n({
- language: 'nl',
- dayjsLocaleConfigForLanguage: {
-   months: [...],
-   monthsShort: [...],
-   calendar: {
-     sameDay: ...'
-   }
- }
-});
-```
-
-Similarly, you can add locale config for dayjs while registering translation via `registerTranslation` function.
-
-e.g.,
-
-```js static
-const i18n = new Streami18n();
-
-i18n.registerTranslation(
- 'mr',
- {
-   'Nothing yet...': 'काहीही नाही  ...',
-   '{{ firstUser }} and {{ secondUser }} are typing...': '{{ firstUser }} आणि {{ secondUser }} टीपी करत आहेत ',
- },
- {
-   months: [...],
-   monthsShort: [...],
-   calendar: {
-     sameDay: ...'
-   }
- }
-);
-```
-
-### Provide your own Moment object
-
-```js static
-import 'moment/locale/nl';
-import 'moment/locale/it';
-// or if you want to include all locales
-import 'moment/min/locales';
-
-import Moment from moment
-
-const i18n = new Streami18n({
- language: 'nl',
- DateTimeParser: Moment
-})
-```
-
-### Provide your own Dayjs object
-
-```js static
-import Dayjs from 'dayjs';
-
-import 'dayjs/locale/nl';
-import 'dayjs/locale/it';
-
-const i18n = new Streami18n({
-  language: 'nl',
-  DateTimeParser: Dayjs,
-});
-```
-
-If you would like to stick with english language for datetimes in Stream components, you can set `disableDateTimeTranslations` to true.
-
-**NOTE** Please note here that locales in `dayjs/locale/it` (and all other language locale files), does not load calendar related
-config like 'today at', 'tomorrow at' etc. You will need to manually configure calendar locale using [updateLocale](https://day.js.org/docs/en/plugin/update-locale).
-
-**TIPS**
-
-1. If you would like to stick with english language for datetimes in Stream components,
-   you can set `disableDateTimeTranslations` to true.
-
-```js static
-const i18n = new Streami18n({
-  language: 'nl',
-  disableDateTimeTranslations: false,
-});
-```
-
-2. If you want to disable all the warnings, you can override logger option:
-
-```js static
-const i18n = new Streami18n({
-  language: 'nl',
-  logger: () => null,
-});
-```
-
-The default `en` locale config from dayjs is as follow:
-
-```json static
-{
-  "months": [
-    "January",
-    "February",
-    "March",
-    "April",
-    "May",
-    "June",
-    "July",
-    "August",
-    "September",
-    "October",
-    "November",
-    "December"
-  ],
-  "monthsShort": [
-    "Jan",
-    "Feb",
-    "Mar",
-    "Apr",
-    "May",
-    "Jun",
-    "Jul",
-    "Aug",
-    "Sep",
-    "Oct",
-    "Nov",
-    "Dec"
-  ],
-  "week": {
-    "dow": 0,
-    "doy": 6
-  },
-  "weekdays": [
-    "Sunday",
-    "Monday",
-    "Tuesday",
-    "Wednesday",
-    "Thursday",
-    "Friday",
-    "Saturday"
-  ],
-  "weekdaysMin": ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"],
-  "weekdaysShort": ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"],
-  "calendar": {
-    "sameDay": "[Today at] LT",
-    "nextDay": "[Tomorrow at] LT",
-    "nextWeek": "dddd [at] LT",
-    "lastDay": "[Yesterday at] LT",
-    "lastWeek": "[Last] dddd [at] LT",
-    "sameElse": "L"
-  },
-  "formats": {
-    "LTS": "h:mm:ss A",
-    "LT": "h:mm A",
-    "L": "MM/DD/YYYY",
-    "LL": "MMMM D, YYYY",
-    "LLL": "MMMM D, YYYY h:mm A",
-    "LLLL": "dddd, MMMM D, YYYY h:mm A"
-  },
-  "invalidDate": "Invalid date",
-  "ordinal": "%d.",
-  "dayOfMonthOrdinalParse": /\\d{1,2}(th|st|nd|rd)/,
-  "relativeTime": {
-    "future": "in %s",
-    "past": "%s ago",
-    "s": "a few seconds",
-    "ss": "%d seconds",
-    "m": "a minute",
-    "mm": "%d minutes",
-    "h": "an hour",
-    "hh": "%d hours",
-    "d": "a day",
-    "dd": "%d days",
-    "M": "a month",
-    "MM": "%d months",
-    "y": "a year",
-    "yy": "%d years"
-  },
-  "meridiemParse": /[ap]\\.?m?\\.?/i,
-  "abbr": "en"
-}
-```

package/lib/module/components/Channel/Channel.md

@@ -1,39 +0,0 @@
-**Note:** The Channel component provides access to the values stored in [ChannelContext](#channelcontext), [MessagesContext](#messagescontext), and [ThreadContext](#threadcontext) and exposes their hooks or the [withChannelContext](#withchannelcontext), [withMessagesContext](#withmessagescontext), and [withThreadContext](#withthreadcontext) higher order components.
-
-The example below shows how to write a component that consumes a context and uses hooks.
-
-```jsx static
-import React from 'react';
-import { Text, View } from 'react-native';
-
-import { Chat, Channel, MessageInput, MessageList, useChannelContext } from 'stream-chat-react-native';
-
-const CustomChannelHeader = () => {
-  const { channel, loading } = useChannelContext();
-
-  return loading ? (
-    <View>
-      <Text>Channel is loading...</Text>
-    </View>
-  ) : (
-    <View>
-      <Text>Channel ID: {channel.cid}</Text>
-      <Text>
-        There are currently {channel.state.watcher_count} people online
-      </Text>
-    </View>
-  );
-};
-
-<OverlayProvider>
-  <View>
-    <Chat client={chat}>
-      <Channel channel={dataChannel}>
-        <CustomChannelHeader />
-        <MessageList />
-        <MessageInput />
-      </Channel>
-    </Chat>
-  </View>
-</OverlayProvider>
-```

package/lib/module/components/ChannelList/ChannelList.md

@@ -1,18 +0,0 @@
-```jsx static
-import { View }  from 'react-native';
-import { Chat, ChannelList } from 'stream-chat-react-native';
-
-<OverlayProvider>
-    <View>
-        <Chat client={client}>
-            <ChannelList
-                filters={{
-                    members: {
-                        $in: ['vishal', 'neil']
-                    }
-                }}
-            />
-        </Chat>
-    </View>
-</OverlayProvider>
-```

package/lib/module/components/ChannelList/ChannelListMessenger.md

@@ -1,19 +0,0 @@
-```jsx static
-import { View }  from 'react-native';
-import { Chat, ChannelList, ChannelListMessenger } from 'stream-chat-react-native';
-
-<OverlayProvider>
-    <View>
-        <Chat client={client}>
-            <ChannelList
-                List={ChannelListMessenger}
-                filters={{
-                    members: {
-                        $in: ['vishal', 'neil']
-                    }
-                }}
-            />
-        </Chat>
-    </View>
-</OverlayProvider>
-```

package/lib/module/components/Message/Message.md

@@ -1,22 +0,0 @@
-The Message component is the high level component that deals with all the message logic.
-It doesn't implement any rendering, but delegates that to the Message prop.
-
-The Message component provides the following functions to the rendered component:
-
-- **isMyMessage** returns true if message belongs to current user, else false
-
-  **Params**
-
-  - `message`
-
-- **isAdmin** returns true if current user has admin role.
-- **canEditMessage** returns true if current user has permission to edit message.
-- **canDeleteMessage** returns true if current user has permission to edit message.
-- **handleFlag** Handler to flag a message
-- **handleMute** Handler to mute a user of message
-- **handleEdit** Handler to edit a message This message simply sets current message as value of `editing` property of channel context. `editing` prop is then used by MessageInput component to switch to edit mode.
-- **handleDelete** Handler to delete a message
-- **handleReaction** Handler to add/remove reaction on message
-- **handleAction** Handler for actions. Actions in combination with attachments can be used to build [commands](https://getstream.io/chat/docs/#channel_commands).
-- **handleRetry** Handler to resend the message, in case of failure.
-- **openThread** Handler to open the thread on current message.

package/lib/module/components/Message/MessageSimple/MessageText.md

@@ -1,4 +0,0 @@
-It accepts all the props accepted by MessageTextContainer component.
-In addition it also accepts following props:
-
-- renderText { function } Defaults to [renderText](#rendertext)

package/lib/module/components/Message/MessageSimple/utils/renderText.md

@@ -1,11 +0,0 @@
-[src/components/Message/MessageSimple/utils/renderText.ts](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/Message/MessageSimple/utils/renderText.ts)
-
-Function that handles markdown and parsing for the text of message.
-
-Internally it uses [react-native-simple-markdown](https://github.com/GetStream/react-native-simple-markdown#styles-1) to handle markdown.
-
-It accepts following params:
-
-- markdownRules { object } - <https://github.com/GetStream/react-native-simple-markdown#rules>
-- markdownStyles { object } - <https://github.com/GetStream/react-native-simple-markdown#styles-1>
-- message { object } Message object

package/lib/module/components/docs/AttachmentProps.md

@@ -1 +0,0 @@
-All the props mentioned in [Attachment](#attachment) are available for this component.

package/lib/module/components/docs/ListProps.md

@@ -1,14 +0,0 @@
-All props available in the [ChannelList](#channellist) component are passed along to the List component. Additionally, the following props are provided to the List component:
-
-- `error` {boolean | Error} Error in channels query, if any
-- `channels` {array} List of channel objects
-- `forceUpdate` {number} Incremental number change to force update the FlatList
-- `hasNextPage` {boolean} Whether or not the FlatList has another page to render
-- `loadingChannels` {boolean} Initial channels query loading state, triggers the LoadingIndicator
-- `loadingNextPage` {boolean} Whether or not additional channels are being loaded, triggers the FooterLoadingIndicator
-- `loadNextPage` {function} Loads the next page of `channels`
-- `refreshing` {boolean} List of channels is being refreshed or re-queried (in case of reconnection)
-- `refreshList` {function} Refresh the channel list without reloading existing channels
-- `reloadList` {function} Removes all the existing channels from UI and loads fresh channels
-- `setActiveChannel` {function} Sets the currently active channel
-- `setFlatListRef` {function} Gains access to the inner FlatList ref

package/lib/module/components/docs/MessageProps.md

@@ -1 +0,0 @@
-All the props mentioned in [MessageSimple](#messagesimple) are available for this component.

package/lib/module/components/docs/PreviewProps.md

@@ -1,7 +0,0 @@
-All props available to the [ChannelPreview](#channelpreview) component are also passed to the ChannelPreviewMessenger UI component. Additionally, the following channel specific properties are available:
-
-- `formatLatestMessageDate` {function} Formatter function for date of the latest message
-- `lastMessage` {object} Latest received message on the channel
-- `latestMessageLength` {number} Length at which latest message should be truncated
-- `latestMessagePreview` {object} Formatted message object with preview display information
-- `unread` {number} Number of unread messages on the channel

package/lib/module/contexts/channelContext/ChannelContext.md

@@ -1,37 +0,0 @@
-Please check the `ChannelContextValue` in [ChannelContext](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/contexts/channelContext/ChannelContext.md), for consumable values.
-Provider for this context exists in `Channel` component. And so, any child component of Channel
-can get access to context as following:
-
-- Functional component
-
-```tsx static
-import { useChannelContext } from 'stream-chat-react-native';
-
-const SomeChildComponent = () => {
-  const { loading, reloadChannel } = useChannelContext();
-
-  return (
-    <View />
-  )
-}
-```
-
-- Class component
-
-```tsx static
-import React from 'react';
-import { withChannelContext } from 'stream-chat-react-native';
-
-class SomeChildComponent extends React.Component {
-  constructor(props) {
-    super(props);
-
-    console.log(props.loading);
-    console.log(props.reloadChannel);
-  }
-
-  // UI Logic
-}
-
-export withChannelContext(SomeChildComponent);
-```

package/lib/module/contexts/channelsContext/ChannelsContext.md

@@ -1,38 +0,0 @@
-Please check the `ChannelsContextValue` in [ChannelsContext](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/contexts/channelsContext/ChannelsContext.md), for consumable values.
-Provider for this context exists in `ChannelList` component. And so, any child component of ChannelList
-can get access to context as following:
-
-- Functional component
-
-```tsx static
-import { useChannelsContext } from 'stream-chat-react-native';
-
-const SomeChildComponent = () => {
-  const { error, loadingChannels, refreshing } = useChannelsContext();
-
-  return (
-    <View />
-  )
-}
-```
-
-- Class component
-
-```tsx static
-import React from 'react';
-import { withChannelsContext } from 'stream-chat-react-native';
-
-class SomeChildComponent extends React.Component {
-  constructor(props) {
-    super(props);
-
-    console.log(props.error);
-    console.log(props.loadingChannels);
-    console.log(props.refreshing);
-  }
-
-  // UI Logic
-}
-
-export withChannelsContext(SomeChildComponent);
-```

package/lib/module/contexts/chatContext/ChatContext.md

@@ -1,37 +0,0 @@
-Please check the `ChatContextValue` in [ChatContext](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/contexts/chatContext/ChatContext.tsx), for consumable values.
-Provider for this context exists in `Chat` component. And so, any child component of Chat
-can get access to context as following:
-
-- Functional component
-
-```tsx static
-import { useChatContext } from 'stream-chat-react-native';
-
-const SomeChildComponent = () => {
-  const { client, isOnline } = useChatContext();
-
-  return (
-    <View />
-  )
-}
-```
-
-- Class component
-
-```tsx static
-import React from 'react';
-import { withChatContext } from 'stream-chat-react-native';
-
-class SomeChildComponent extends React.Component {
-  constructor(props) {
-    super(props);
-
-    console.log(props.client);
-    console.log(props.isOnline);
-  }
-
-  // UI Logic
-}
-
-export withChatContext(SomeChildComponent);
-```

package/lib/module/contexts/imageGalleryContext/ImageGalleryContext.md

@@ -1,38 +0,0 @@
-Please check the `ImageGalleryContextValue` in [ImageGalleryContext](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/contexts/imageGalleryContext/ImageGalleryContext.tsx), for consumable values.
-Provider for this context exists in `OverlayProvider` component. And so, any child component of OverlayProvider
-can get access to context as following:
-
-- Functional component
-
-```tsx static
-import { useChannelsContext } from 'stream-chat-react-native';
-
-const SomeChildComponent = () => {
-  const { selectedMessage, setSelectedMessage, setMessages } = useImageGalleryContext();
-
-  return (
-    <View />
-  )
-}
-```
-
-- Class component
-
-```tsx static
-import React from 'react';
-import { withChannelsContext } from 'stream-chat-react-native';
-
-class SomeChildComponent extends React.Component {
-  constructor(props) {
-    super(props);
-
-    console.log(props.image);
-    console.log(props.setImage);
-    console.log(props.setImages);
-  }
-
-  // UI Logic
-}
-
-export withImageGalleryContext(SomeChildComponent);
-```