react-native-gifted-chat 3.3.2 → 3.4.0

package/src/linkParser.tsx

@@ -1,255 +0,0 @@
-import React from 'react'
-import { Text, TextStyle, StyleProp, Linking } from 'react-native'
-
-export type LinkType = 'url' | 'email' | 'phone' | 'mention' | 'hashtag'
-
-export interface ParsedLink {
-  type: LinkType
-  text: string
-  url: string
-  index: number
-  length: number
-}
-
-export interface LinkMatcher {
-  type: LinkType
-  pattern: RegExp
-  getLinkUrl?: (text: string) => string
-  getLinkText?: (text: string) => string
-  baseUrl?: string
-  style?: StyleProp<TextStyle>
-  renderLink?: (text: string, url: string, index: number, type: LinkType) => React.ReactNode
-  onPress?: (url: string, type: LinkType) => void
-}
-
-interface LinkParserProps {
-  text: string
-  matchers?: LinkMatcher[]
-  email?: boolean
-  phone?: boolean
-  url?: boolean
-  hashtag?: boolean
-  mention?: boolean
-  hashtagUrl?: string
-  mentionUrl?: string
-  linkStyle?: StyleProp<TextStyle>
-  onPress?: (url: string, type: LinkType) => void
-  stripPrefix?: boolean
-  textStyle?: StyleProp<TextStyle>
-  TextComponent?: React.ComponentType<any>
-}
-
-const DEFAULT_MATCHERS: LinkMatcher[] = [
-  {
-    type: 'url',
-    pattern: /(?:https?:\/\/(?:www\.)?|www\.)[^\s]+|(?<![A-Za-z0-9_.@])(?![A-Za-z0-9._%+-]*@)[a-zA-Z0-9][a-zA-Z0-9-]*\.(?!@)[a-zA-Z]{2,}(?![A-Za-z0-9._%+-]*@)(?:\/[^\s]*)?/gi,
-    getLinkUrl: (text: string) => {
-      if (!/^https?:\/\//i.test(text))
-        return `http://${text}`
-
-      return text
-    },
-  },
-  {
-    type: 'email',
-    pattern: /(?<![A-Za-z0-9])([a-zA-Z0-9][a-zA-Z0-9._%+-]*@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,})/gi,
-    getLinkUrl: (text: string) => `mailto:${text}`,
-  },
-  {
-    type: 'phone',
-    pattern: /(?<![A-Za-z0-9_])(?:\+?\d{1,3}[\s.\-]?)?\(?\d{1,4}\)?[\s.\-]?\d{1,4}[\s.\-]?\d{1,9}(?![A-Za-z0-9_]|\.[a-z]{2,4})/gi,
-    getLinkUrl: (text: string) => {
-      const cleaned = text.replace(/[\s.()\-]/g, '')
-      return `tel:${cleaned}`
-    },
-  },
-  {
-    type: 'hashtag',
-    pattern: /#[\w]+/g,
-    getLinkUrl: (text: string) => text,
-    baseUrl: undefined,
-  },
-  {
-    type: 'mention',
-    pattern: /(?<![a-zA-Z0-9._%+-])@[\w-]+/g,
-    getLinkUrl: (text: string) => text,
-    baseUrl: undefined,
-  },
-]
-
-function parseLinks(text: string, matchers: LinkMatcher[]): ParsedLink[] {
-  const links: ParsedLink[] = []
-
-  matchers.forEach(matcher => {
-    const matches = text.matchAll(matcher.pattern)
-    for (const match of matches)
-      if (match.index !== undefined) {
-        const matchText = match[0]
-        const url = matcher.getLinkUrl
-          ? matcher.getLinkUrl(matchText)
-          : matchText
-        const linkText = matcher.getLinkText
-          ? matcher.getLinkText(matchText)
-          : matchText
-
-        links.push({
-          type: matcher.type,
-          text: linkText,
-          url,
-          index: match.index,
-          length: matchText.length,
-        })
-      }
-
-  })
-
-  // Sort by index to maintain order
-  return links.sort((a, b) => a.index - b.index)
-}
-
-function removeOverlaps(links: ParsedLink[]): ParsedLink[] {
-  const filtered: ParsedLink[] = []
-
-  for (const link of links) {
-    const hasOverlap = filtered.some(existing => {
-      const existingEnd = existing.index + existing.length
-      const linkEnd = link.index + link.length
-
-      return (
-        (link.index >= existing.index && link.index < existingEnd) ||
-        (linkEnd > existing.index && linkEnd <= existingEnd) ||
-        (link.index <= existing.index && linkEnd >= existingEnd)
-      )
-    })
-
-    if (!hasOverlap)
-      filtered.push(link)
-
-  }
-
-  return filtered
-}
-
-export function LinkParser({
-  text,
-  matchers: customMatchers,
-  email = true,
-  phone = true,
-  url = true,
-  hashtag = false,
-  mention = false,
-  hashtagUrl,
-  mentionUrl,
-  linkStyle,
-  onPress,
-  stripPrefix = true,
-  textStyle,
-  TextComponent = Text,
-}: LinkParserProps): React.ReactElement {
-  const activeMatchers: LinkMatcher[] = []
-
-  // Add custom matchers first (they take precedence)
-  if (customMatchers)
-    activeMatchers.push(...customMatchers)
-
-
-  // Add default matchers based on flags
-  if (url && !customMatchers?.some(m => m.type === 'url'))
-    activeMatchers.push(DEFAULT_MATCHERS.find(m => m.type === 'url')!)
-
-  if (email && !customMatchers?.some(m => m.type === 'email'))
-    activeMatchers.push(DEFAULT_MATCHERS.find(m => m.type === 'email')!)
-
-  if (phone && !customMatchers?.some(m => m.type === 'phone'))
-    activeMatchers.push(DEFAULT_MATCHERS.find(m => m.type === 'phone')!)
-
-  if (hashtag && !customMatchers?.some(m => m.type === 'hashtag')) {
-    const hashtagMatcher = { ...DEFAULT_MATCHERS.find(m => m.type === 'hashtag')! }
-    if (hashtagUrl) {
-      hashtagMatcher.baseUrl = hashtagUrl
-      const baseUrl = hashtagUrl.endsWith('/') ? hashtagUrl : `${hashtagUrl}/`
-      hashtagMatcher.getLinkUrl = (text: string) => `${baseUrl}${text.substring(1)}`
-    }
-    activeMatchers.push(hashtagMatcher)
-  }
-
-  if (mention && !customMatchers?.some(m => m.type === 'mention')) {
-    const mentionMatcher = { ...DEFAULT_MATCHERS.find(m => m.type === 'mention')! }
-    if (mentionUrl) {
-      mentionMatcher.baseUrl = mentionUrl
-      const baseUrl = mentionUrl.endsWith('/') ? mentionUrl : `${mentionUrl}/`
-      mentionMatcher.getLinkUrl = (text: string) => `${baseUrl}${text.substring(1)}`
-    }
-    activeMatchers.push(mentionMatcher)
-  }
-
-
-  const links = removeOverlaps(parseLinks(text, activeMatchers))
-
-  if (links.length === 0)
-    return <TextComponent style={textStyle}>{text}</TextComponent>
-
-
-  const elements: React.ReactNode[] = []
-  let lastIndex = 0
-
-  links.forEach((link, index) => {
-    // Add text before link
-    if (link.index > lastIndex)
-      elements.push(
-        <TextComponent key={`text-${index}`} style={textStyle}>
-          {text.substring(lastIndex, link.index)}
-        </TextComponent>
-      )
-
-
-    // Find the matcher for this link
-    const matcher = activeMatchers.find(m => m.type === link.type)
-
-    // Handle link rendering
-    if (matcher?.renderLink) {
-      elements.push(matcher.renderLink(link.text, link.url, index, link.type))
-    } else {
-      const handlePress = () => {
-        if (matcher?.onPress)
-          matcher.onPress(link.url, link.type)
-        else if (onPress)
-          onPress(link.url, link.type)
-        else
-          // Default behavior
-          Linking.openURL(link.url).catch(err => {
-            console.warn('Failed to open URL:', err)
-          })
-
-      }
-
-      let displayText = link.text
-      if (stripPrefix && link.type === 'url')
-        displayText = displayText.replace(/^https?:\/\//i, '')
-
-
-      elements.push(
-        <TextComponent
-          key={`link-${index}`}
-          style={[linkStyle, matcher?.style]}
-          onPress={handlePress}
-        >
-          {displayText}
-        </TextComponent>
-      )
-    }
-
-    lastIndex = link.index + link.length
-  })
-
-  // Add remaining text
-  if (lastIndex < text.length)
-    elements.push(
-      <TextComponent key='text-end' style={textStyle}>
-        {text.substring(lastIndex)}
-      </TextComponent>
-    )
-
-
-  return <TextComponent style={textStyle}>{elements}</TextComponent>
-}

package/src/logging.ts

@@ -1,8 +0,0 @@
-const styleString = (color: string) => `color: ${color}; font-weight: bold`
-const headerLog = '%c[react-native-gifted-chat]'
-
-export const warning = (...args: unknown[]) =>
-  console.log(headerLog, styleString('orange'), ...args)
-
-export const error = (...args: unknown[]) =>
-  console.log(headerLog, styleString('red'), ...args)

package/src/styles.ts

@@ -1,25 +0,0 @@
-import { StyleProp, StyleSheet, TextStyle, ViewStyle } from 'react-native'
-
-export default StyleSheet.create({
-  fill: {
-    flex: 1,
-  },
-  centerItems: {
-    justifyContent: 'center',
-    alignItems: 'center',
-  },
-})
-
-export function getColorSchemeStyle<T>(styles: T, baseName: string, colorScheme?: string | null) {
-  const key = `${baseName}_${colorScheme}` as keyof T
-  return [styles[baseName as keyof T], styles[key]]
-}
-
-export function getStyleWithPosition<T>(styles: T, baseName: string, position?: 'left' | 'right' | null) {
-  const stylesArray = [styles[baseName as keyof T]]
-  if (position) {
-    const key = `${baseName}_${position}` as keyof T
-    stylesArray.push(styles[key])
-  }
-  return StyleSheet.flatten(stylesArray) as StyleProp<ViewStyle> | StyleProp<TextStyle>
-}

package/src/types.ts

@@ -1,25 +0,0 @@
-export * from './Models'
-
-export type { ActionsProps } from './Actions'
-export type { AvatarProps } from './Avatar'
-export type {
-  BubbleProps,
-  RenderMessageImageProps,
-  RenderMessageVideoProps,
-  RenderMessageAudioProps,
-  RenderMessageTextProps
-} from './Bubble'
-export type { ComposerProps } from './Composer'
-export type { DayProps } from './Day'
-export type { GiftedAvatarProps } from './GiftedAvatar'
-export type { InputToolbarProps, ReplyPreviewProps } from './InputToolbar'
-export type { LoadEarlierMessagesProps } from './LoadEarlierMessages'
-export type { MessageProps } from './Message'
-export type { MessagesContainerProps } from './MessagesContainer'
-export type { MessageImageProps } from './MessageImage'
-export type { MessageTextProps } from './MessageText'
-export type { MessageReplyProps } from './components/MessageReply'
-export type { QuickRepliesProps } from './QuickReplies'
-export type { SendProps } from './Send'
-export type { SystemMessageProps } from './SystemMessage'
-export type { TimeProps } from './Time'

package/src/utils.ts

@@ -1,139 +0,0 @@
-import React, { useCallback, useEffect, useRef } from 'react'
-import dayjs from 'dayjs'
-import { IMessage } from './Models'
-
-export function renderComponentOrElement<TProps extends Record<string, any>>(
-  component: React.ComponentType<TProps> | React.ReactElement | ((props: TProps) => React.ReactNode) | null | undefined,
-  props: TProps
-): React.ReactNode {
-  if (!component)
-    return null
-
-  if (React.isValidElement(component))
-    // If it's already a React element, clone it with props
-    return React.cloneElement(component, props as any)
-
-  if (typeof component === 'function') {
-    // Check if it's a class component (has prototype.isReactComponent)
-    // Class components must use React.createElement
-    const isClassComponent = component.prototype && component.prototype.isReactComponent
-
-    if (isClassComponent)
-      return React.createElement(component as React.ComponentType<TProps>, props as any)
-
-    // For function components and render functions, call directly
-    // Using createElement with inline arrow functions causes unmount/remount
-    // when function reference changes, this matches v2.x behavior
-    return (component as (props: TProps) => React.ReactNode)(props)
-  }
-
-  // Check for React.memo or React.forwardRef wrapped components
-  // These have $$typeof property and should be rendered with createElement
-  if (typeof component === 'object' && component !== null && '$$typeof' in component)
-    return React.createElement(component as React.ComponentType<TProps>, props as any)
-
-  // If it's neither, return it as-is
-  return component
-}
-
-export function isSameDay (
-  currentMessage: IMessage,
-  diffMessage: IMessage | null | undefined
-) {
-  if (!diffMessage || !diffMessage.createdAt)
-    return false
-
-  const currentCreatedAt = dayjs(currentMessage.createdAt)
-  const diffCreatedAt = dayjs(diffMessage.createdAt)
-
-  if (!currentCreatedAt.isValid() || !diffCreatedAt.isValid())
-    return false
-
-  return currentCreatedAt.isSame(diffCreatedAt, 'day')
-}
-
-export function isSameUser (
-  currentMessage: IMessage,
-  diffMessage: IMessage | null | undefined
-) {
-  return !!(
-    diffMessage &&
-    diffMessage.user &&
-    currentMessage.user &&
-    diffMessage.user._id === currentMessage.user._id
-  )
-}
-
-function processCallbackArguments (args: unknown[]): unknown[] {
-  const [e, ...rest] = args
-  const { nativeEvent } = (e as { nativeEvent?: unknown }) || {}
-  let params: unknown[] = []
-  if (e) {
-    if (nativeEvent)
-      params.push({ nativeEvent })
-    else
-      params.push(e)
-    if (rest)
-      params = params.concat(rest)
-  }
-
-  return params
-}
-
-export function useCallbackDebounced<T extends (...args: any[]) => any>(callbackFunc: T, deps: React.DependencyList = [], time: number): (...args: Parameters<T>) => void {
-  const timeoutId = useRef<ReturnType<typeof setTimeout>>(undefined)
-
-  const savedFunc = useCallback((...args: Parameters<T>) => {
-    const params = processCallbackArguments(args)
-    if (timeoutId.current)
-      clearTimeout(timeoutId.current)
-    timeoutId.current = setTimeout(() => {
-      callbackFunc(...params as Parameters<T>)
-    }, time)
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [callbackFunc, time, ...deps])
-
-  useEffect(() => {
-    return () => {
-      if (timeoutId.current)
-        clearTimeout(timeoutId.current)
-    }
-  }, [])
-
-  return savedFunc
-}
-
-export function useCallbackThrottled<T extends (...args: any[]) => any>(callbackFunc: T, deps: React.DependencyList = [], time: number): (...args: Parameters<T>) => void {
-  const lastExecution = useRef<number>(0)
-  const timeoutId = useRef<ReturnType<typeof setTimeout>>(undefined)
-
-  // we use function instead of arrow to access arguments object
-  const savedFunc = useCallback((...args: Parameters<T>) => {
-    const params = processCallbackArguments(args)
-
-    const now = Date.now()
-    const timeSinceLastExecution = now - lastExecution.current
-
-    if (timeSinceLastExecution >= time) {
-      // Execute immediately if enough time has passed
-      lastExecution.current = now
-      callbackFunc(...params as Parameters<T>)
-    } else {
-      // Schedule execution for the remaining time
-      clearTimeout(timeoutId.current)
-      timeoutId.current = setTimeout(() => {
-        lastExecution.current = Date.now()
-        callbackFunc(...params as Parameters<T>)
-      }, time - timeSinceLastExecution)
-    }
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [callbackFunc, time, ...deps])
-
-  useEffect(() => {
-    return () => {
-      clearTimeout(timeoutId.current)
-    }
-  }, [])
-
-  return savedFunc
-}