UNPKG

7.49 kBTypeScriptView Raw
1import PropTypes from 'prop-types';
2import React from 'react';
3import { StyleProp, ViewStyle, TextStyle } from 'react-native';
4import QuickReplies from './QuickReplies';
5import MessageText from './MessageText';
6import MessageImage from './MessageImage';
7import Time from './Time';
8import { User, IMessage, LeftRightStyle, Reply, Omit, MessageVideoProps, MessageAudioProps } from './Models';
9export declare type RenderMessageImageProps<TMessage extends IMessage> = Omit<BubbleProps<TMessage>, 'containerStyle' | 'wrapperStyle'> & MessageImage['props'];
10export declare type RenderMessageVideoProps<TMessage extends IMessage> = Omit<BubbleProps<TMessage>, 'containerStyle' | 'wrapperStyle'> & MessageVideoProps<TMessage>;
11export declare type RenderMessageAudioProps<TMessage extends IMessage> = Omit<BubbleProps<TMessage>, 'containerStyle' | 'wrapperStyle'> & MessageAudioProps<TMessage>;
12export declare type RenderMessageTextProps<TMessage extends IMessage> = Omit<BubbleProps<TMessage>, 'containerStyle' | 'wrapperStyle'> & MessageText['props'];
13export interface BubbleProps<TMessage extends IMessage> {
14 user?: User;
15 touchableProps?: object;
16 renderUsernameOnMessage?: boolean;
17 isCustomViewBottom?: boolean;
18 inverted?: boolean;
19 position: 'left' | 'right';
20 currentMessage?: TMessage;
21 nextMessage?: TMessage;
22 previousMessage?: TMessage;
23 optionTitles?: string[];
24 containerStyle?: LeftRightStyle<ViewStyle>;
25 wrapperStyle?: LeftRightStyle<ViewStyle>;
26 textStyle?: LeftRightStyle<TextStyle>;
27 bottomContainerStyle?: LeftRightStyle<ViewStyle>;
28 tickStyle?: StyleProp<TextStyle>;
29 containerToNextStyle?: LeftRightStyle<ViewStyle>;
30 containerToPreviousStyle?: LeftRightStyle<ViewStyle>;
31 usernameStyle?: TextStyle;
32 quickReplyStyle?: StyleProp<ViewStyle>;
33 onLongPress?(context?: any, message?: any): void;
34 onQuickReply?(replies: Reply[]): void;
35 renderMessageImage?(props: RenderMessageImageProps<TMessage>): React.ReactNode;
36 renderMessageVideo?(props: RenderMessageVideoProps<TMessage>): React.ReactNode;
37 renderMessageAudio?(props: RenderMessageAudioProps<TMessage>): React.ReactNode;
38 renderMessageText?(props: RenderMessageTextProps<TMessage>): React.ReactNode;
39 renderCustomView?(bubbleProps: BubbleProps<TMessage>): React.ReactNode;
40 renderTime?(timeProps: Time['props']): React.ReactNode;
41 renderTicks?(currentMessage: TMessage): React.ReactNode;
42 renderUsername?(): React.ReactNode;
43 renderQuickReplySend?(): React.ReactNode;
44 renderQuickReplies?(quickReplies: QuickReplies['props']): React.ReactNode;
45}
46export default class Bubble<TMessage extends IMessage = IMessage> extends React.Component<BubbleProps<TMessage>> {
47 static contextTypes: {
48 actionSheet: PropTypes.Requireable<(...args: any[]) => any>;
49 };
50 static defaultProps: {
51 touchableProps: {};
52 onLongPress: null;
53 renderMessageImage: null;
54 renderMessageVideo: null;
55 renderMessageAudio: null;
56 renderMessageText: null;
57 renderCustomView: null;
58 renderUsername: null;
59 renderTicks: null;
60 renderTime: null;
61 renderQuickReplies: null;
62 onQuickReply: null;
63 position: string;
64 optionTitles: string[];
65 currentMessage: {
66 text: null;
67 createdAt: null;
68 image: null;
69 };
70 nextMessage: {};
71 previousMessage: {};
72 containerStyle: {};
73 wrapperStyle: {};
74 bottomContainerStyle: {};
75 tickStyle: {};
76 usernameStyle: {};
77 containerToNextStyle: {};
78 containerToPreviousStyle: {};
79 };
80 static propTypes: {
81 user: PropTypes.Validator<object>;
82 touchableProps: PropTypes.Requireable<object>;
83 onLongPress: PropTypes.Requireable<(...args: any[]) => any>;
84 renderMessageImage: PropTypes.Requireable<(...args: any[]) => any>;
85 renderMessageVideo: PropTypes.Requireable<(...args: any[]) => any>;
86 renderMessageAudio: PropTypes.Requireable<(...args: any[]) => any>;
87 renderMessageText: PropTypes.Requireable<(...args: any[]) => any>;
88 renderCustomView: PropTypes.Requireable<(...args: any[]) => any>;
89 isCustomViewBottom: PropTypes.Requireable<boolean>;
90 renderUsernameOnMessage: PropTypes.Requireable<boolean>;
91 renderUsername: PropTypes.Requireable<(...args: any[]) => any>;
92 renderTime: PropTypes.Requireable<(...args: any[]) => any>;
93 renderTicks: PropTypes.Requireable<(...args: any[]) => any>;
94 renderQuickReplies: PropTypes.Requireable<(...args: any[]) => any>;
95 onQuickReply: PropTypes.Requireable<(...args: any[]) => any>;
96 position: PropTypes.Requireable<string>;
97 optionTitles: PropTypes.Requireable<(string | null | undefined)[]>;
98 currentMessage: PropTypes.Requireable<object>;
99 nextMessage: PropTypes.Requireable<object>;
100 previousMessage: PropTypes.Requireable<object>;
101 containerStyle: PropTypes.Requireable<PropTypes.InferProps<{
102 left: PropTypes.Requireable<number | boolean | object>;
103 right: PropTypes.Requireable<number | boolean | object>;
104 }>>;
105 wrapperStyle: PropTypes.Requireable<PropTypes.InferProps<{
106 left: PropTypes.Requireable<number | boolean | object>;
107 right: PropTypes.Requireable<number | boolean | object>;
108 }>>;
109 bottomContainerStyle: PropTypes.Requireable<PropTypes.InferProps<{
110 left: PropTypes.Requireable<number | boolean | object>;
111 right: PropTypes.Requireable<number | boolean | object>;
112 }>>;
113 tickStyle: PropTypes.Requireable<number | boolean | object>;
114 usernameStyle: PropTypes.Requireable<number | boolean | object>;
115 containerToNextStyle: PropTypes.Requireable<PropTypes.InferProps<{
116 left: PropTypes.Requireable<number | boolean | object>;
117 right: PropTypes.Requireable<number | boolean | object>;
118 }>>;
119 containerToPreviousStyle: PropTypes.Requireable<PropTypes.InferProps<{
120 left: PropTypes.Requireable<number | boolean | object>;
121 right: PropTypes.Requireable<number | boolean | object>;
122 }>>;
123 };
124 onLongPress: () => void;
125 styledBubbleToNext(): (false | ViewStyle | import("react-native").RegisteredStyle<ViewStyle> | import("react-native").RecursiveArray<false | ViewStyle | import("react-native").RegisteredStyle<ViewStyle> | null | undefined> | {
126 borderBottomLeftRadius: number;
127 } | {
128 borderBottomRightRadius: number;
129 } | null | undefined)[] | null;
130 styledBubbleToPrevious(): (false | ViewStyle | import("react-native").RegisteredStyle<ViewStyle> | import("react-native").RecursiveArray<false | ViewStyle | import("react-native").RegisteredStyle<ViewStyle> | null | undefined> | {
131 borderTopLeftRadius: number;
132 } | {
133 borderTopRightRadius: number;
134 } | null | undefined)[] | null;
135 renderQuickReplies(): {} | null | undefined;
136 renderMessageText(): {} | null | undefined;
137 renderMessageImage(): {} | null | undefined;
138 renderMessageVideo(): {} | null | undefined;
139 renderMessageAudio(): {} | null | undefined;
140 renderTicks(): {} | null | undefined;
141 renderTime(): {} | null | undefined;
142 renderUsername(): JSX.Element | null;
143 renderCustomView(): {} | null | undefined;
144 renderBubbleContent(): JSX.Element;
145 render(): JSX.Element;
146}