Skip to content
Permalink
Browse files

Add flow typedefs (#1414)

* Add flow copy typedefs

* Add flow dependency and tests folder

tests dir is only for playground purpose
maybe will include actual tests

* Add some basic types

* Add type exports

* Fix extended generic

* Add leftRightStyle

* Add Time typs

* Add Day types

* Add Actions types

* Fix indent

* Fix Actions types

* Add SystemMessage

* Add send typings

* Add GiftedAvatar typings

* Add Avatar typings

* Add Composer types

* Add MessageVideo types

* Add MessageImage types

* Remove class methods

i don't think we need this

* Add MessageText types

* Add QuickReplies types

* Add InputToolbar types

* Update MessageVideo props

moved props into component containing file

* Add Bubble types

* Add Message types

* Add LoadEarlier types

* Add MessageContainer types

* Add GiftedChat types

* Fix liseViewProps types

* Add index export

* Add utils types

* Remove tests dir

* Add style types to LeftRightStyle

* Add strong style types

* Fix listViewProps required
  • Loading branch information...
amiralies authored and xcarpentier committed Sep 24, 2019
1 parent b90e2bc commit 49651f7c0de1a228dd7fa2cb2df75f89e08842f4
@@ -0,0 +1,11 @@
[ignore]

[include]

[libs]

[lints]

[options]

[strict]
@@ -0,0 +1,21 @@
// @flow
import { Component } from 'react'
import type {
ViewStyleProp,
ImageStyleProp,
TextStyleProp,
} from 'react-native/Libraries/StyleSheet/StyleSheet'

export interface ActionsProps {
options?: {
[key: string]: any,
};
optionTintColor?: string;
icon?: () => React$Element<any>;
wrapperStyle?: ViewStyleProp;
iconTextStyle?: TextStyleProp;
containerStyle?: ViewStyleProp;
onPressActionButton?: () => void;
}

export default class Actions extends Component<ActionsProps> {}
@@ -0,0 +1,29 @@
// @flow
import { Component } from 'react'
import type { IMessage, User, LeftRightStyle } from './types'
import type {
ImageStyleProp,
ViewStyleProp,
} from 'react-native/Libraries/StyleSheet/StyleSheet'

type Props = { name: string, age: number => string }

export interface AvatarProps<TMessage: IMessage> {
currentMessage?: TMessage;
previousMessage?: TMessage;
nextMessage?: TMessage;
position: 'left' | 'right';
renderAvatarOnTop?: boolean;
showAvatarForEveryMessage?: boolean;
imageStyle?: LeftRightStyle<ImageStyleProp>;
containerStyle?: LeftRightStyle<ViewStyleProp>;
renderAvatar?: (
$Diff<AvatarProps<TMessage>, {| renderAvatar: * |}>,
) => React$Element<any>;
onPressAvatar?: User => void;
onLongPressAvatar?: User => void;
}

export default class Avatar<TMessage: IMessage> extends Component<
AvatarProps<TMessage>,
> {}
@@ -0,0 +1,71 @@
// @flow
import { Component } from 'react'
import type { QuickRepliesProps } from './QuickReplies'
import type { MessageImageProps } from './MessageImage'
import type { MessageVideoProps } from './MessageVideo'
import type { MessageTextProps } from './MessageText'
import type { TimeProps } from './Time'
import type { User, IMessage, LeftRightStyle, Reply } from './types'
import type {
TextStyleProp,
ViewStyleProp,
} from 'react-native/Libraries/StyleSheet/StyleSheet'

export type RenderMessageImageProps<TMessage: IMessage> = $Diff<
BubbleProps<TMessage>,
{| containerStyle: *, wrapperStyle: * |},
> &
MessageImageProps<TMessage>

export type RenderMessageVideoProps<TMessage: IMessage> = $Diff<
BubbleProps<TMessage>,
{| containerStyle: *, wrapperStyle: * |},
> &
MessageVideoProps<TMessage>

export type RenderMessageTextProps<TMessage: IMessage> = $Diff<
BubbleProps<TMessage>,
{| containerStyle: *, wrapperStyle: * |},
> &
MessageTextProps<TMessage>

export interface BubbleProps<TMessage: IMessage> {
user?: User;
touchableProps?: Object;
renderUsernameOnMessage?: boolean;
isCustomViewBottom?: boolean;
inverted?: boolean;
position: 'left' | 'right';
currentMessage?: TMessage;
nextMessage?: TMessage;
previousMessage?: TMessage;
optionTitles?: string;
containerStyle?: LeftRightStyle<ViewStyleProp>;
wrapperStyle?: LeftRightStyle<ViewStyleProp>;
textStyle?: LeftRightStyle<TextStyleProp>;
bottomContainerStyle?: LeftRightStyle<ViewStyleProp>;
tickStyle?: TextStyleProp;
containerToNextStyle?: LeftRightStyle<ViewStyleProp>;
containerToPreviousStyle?: LeftRightStyle<ViewStyleProp>;
usernameStyle?: LeftRightStyle<TextStyleProp>;
quickReplyStyle?: ViewStyleProp;
onLongPress?: (context?: any, message?: any) => void;
onQuickReply?: (Array<Reply>) => void;
renderMessageImage?: (
RenderMessageImageProps<TMessage>,
) => React$Element<any>;
renderMessageVideo?: (
RenderMessageVideoProps<TMessage>,
) => React$Element<any>;
renderMessageText?: (RenderMessageTextProps<TMessage>) => React$Element<any>;
renderCustomView?: (BubbleProps<TMessage>) => React$Element<any>;
renderTime?: (TimeProps: TMessage) => React$Element<any>;
renderTicks?: TMessage => React$Element<any>;
renderUsername?: () => React$Element<any>;
renderQuickReplySend?: () => React$Element<any>;
renderQuickReplies?: QuickRepliesProps => React$Element<any>;
}

export default class Bubble<TMessage: IMessage> extends Component<
BubbleProps<TMessage>,
> {}
@@ -0,0 +1,24 @@
// @flow
import { TextInput } from 'react-native'
import * as React from 'react'

type TextInputProps = $Shape<React.ElementProps<typeof TextInput>>

export interface ComposerProps {
composerHeight?: number;
text?: string;
placeholder?: string;
placeholderTextColor?: string;
textInputProps?: TextInputProps;
textInputStyle?: $PropertyType<TextInputProps, 'style'>;
textInputAutoFocus?: boolean;
keyboardAppearance?: $PropertyType<TextInputProps, 'keyboardAppearance'>;
multiline?: boolean;
onTextChanged?: string => void;
onInputSizeChanged?: ({|
width: number,
height: number,
|}) => void;
}

export default class Composer extends React.Component<ComposerProps> {}
@@ -0,0 +1,23 @@
// @flow
import { PureComponent } from 'react'
import type { IMessage } from './types'
import type {
ViewStyleProp,
ImageStyleProp,
TextStyleProp,
} from 'react-native/Libraries/StyleSheet/StyleSheet'

export interface DayProps<TMessage: IMessage> {
currentMessage?: TMessage;
nextMessage?: TMessage;
previousMessage?: TMessage;
containerStyle?: ViewStyleProp;
wrapperStyle?: ViewStyleProp;
textStyle?: TextStyleProp;
dateFormat?: string;
inverted?: boolean;
}

export default class Day<TMessage: IMessage> extends PureComponent<
DayProps<TMessage>,
> {}
@@ -0,0 +1,17 @@
// @flow
import { Component } from 'react'
import type { User } from './types'
import type {
ImageStyleProp,
TextStyleProp,
} from 'react-native/Libraries/StyleSheet/StyleSheet'

export interface GiftedAvatarProps {
user?: User;
avatarStyle?: ImageStyleProp;
textStyle?: TextStyleProp;
onPress: any => void;
onLongPress: any => void;
}

export default class GiftedAvatar extends Component<GiftedAvatarProps> {}
@@ -0,0 +1,137 @@
// @flow
import * as React from 'react'
import Actions, { ActionsProps } from './Actions'
import Avatar, { AvatarProps } from './Avatar'
import Bubble, { BubbleProps } from './Bubble'
import SystemMessage, { SystemMessageProps } from './SystemMessage'
import MessageImage, { MessageImageProps } from './MessageImage'
import MessageText, { MessageTextProps } from './MessageText'
import Composer, { ComposerProps } from './Composer'
import Day, { DayProps } from './Day'
import InputToolbar, { InputToolbarProps } from './InputToolbar'
import LoadEarlier, { LoadEarlierProps } from './LoadEarlier'
import Message, { MessageProps } from './Message'
import Send, { SendProps } from './Send'
import Time, { TimeProps } from './Time'
import QuickReplies, { QuickRepliesProps } from './QuickReplies'
import MessageContainer from './MessageContainer.js.flow'
import GiftedAvatar from './GiftedAvatar.js.flow'
import { IMessage, User, Reply, LeftRightStyle } from './types'
import type AnimatedValue from 'react-native/Libraries/Animated/src/nodes/AnimatedValue'
import type {
TextStyleProp,
ImageStyleProp,
ViewStyleProp,
} from 'react-native/Libraries/StyleSheet/StyleSheet'
import { FlatList } from 'react-native'
import * as utils from './utils'

export interface GiftedChatProps<TMessage: IMessage> {
messages?: Array<TMessage>;
text?: string;
alignTop?: boolean;
scrollToBottom?: boolean;
initialText?: string;
placeholder?: string;
user?: User;
locale?: string;
timeFormat?: string;
dateFormat?: string;
isAnimated?: boolean;
loadEarlier?: boolean;
isLoadingEarlier?: boolean;
showUserAvatar?: boolean;
showAvatarForEveryMessage?: boolean;
renderAvatarOnTop?: boolean;
inverted?: boolean;
imageProps?: MessageProps<TMessage>;
lightboxProps?: any;
bottomOffset?: number;
minInputToolbarHeight?: number;
listViewProps?: $Shape<React.ElementProps<typeof FlatList>>;
textInputProps?: any;
keyboardShouldPersistTaps?: any;
maxInputLength?: number;
forceGetKeyboardHeight?: boolean;
alwaysShowSend?: boolean;
imageStyle?: ImageStyleProp;
extraData?: any;
minComposerHeight?: number;
maxComposerHeight?: number;
options?: {
[key: string]: any,
};
optionTintColor?: string;
quickReplyStyle?: ViewStyleProp;
isCustomViewBottom?: boolean;
timeTextStyle?: LeftRightStyle<TextStyleProp>;
onPressAvatar?: User => void;
onLongPressAvatar?: User => void;
messageIdGenerator?: (message?: TMessage) => string;
onSend?: (messages: Array<TMessage>) => void;
onLoadEarlier?: () => void;
renderLoading?: () => React$Element<any>;
renderLoadEarlier?: LoadEarlierProps => React$Element<any>;
renderAvatar?: (AvatarProps<TMessage>) => React$Element<any>;
renderBubble?: (BubbleProps<TMessage>) => React$Element<any>;
renderSystemMessage?: (SystemMessageProps<TMessage>) => React$Element<any>;
onLongPress?: (context: any, message: any) => void;
renderMessage?: (MessageProps<TMessage>) => React$Element<any>;
renderMessageText?: (MessageTextProps<TMessage>) => React$Element<any>;
renderMessageImage?: (MessageImageProps<TMessage>) => React$Element<any>;
renderCustomView?: (BubbleProps<TMessage>) => React$Element<any>;
renderDay?: (DayProps<TMessage>) => React$Element<any>;
renderTime?: (TimeProps<TMessage>) => React$Element<any>;
renderFooter?: () => React$Element<any>;
renderChatFooter?: () => React$Element<any>;
renderInputToolbar?: InputToolbarProps => React$Element<any>;
renderComposer?: ComposerProps => React$Element<any>;
renderActions?: ActionsProps => React$Element<any>;
renderSend?: SendProps => React$Element<any>;
renderAccessory?: InputToolbarProps => React$Element<any>;
onPressActionButton?: () => void;
onInputTextChanged?: (text: string) => void;
parsePatterns?: () => React$Element<any>;
onQuickReply?: (Array<Reply>) => void;
renderQuickReplies?: QuickRepliesProps => React$Element<any>;
renderQuickReplySend?: () => React$Element<any>;
shouldUpdateMessage?: (
props: MessageProps<TMessage>,
nextProps: MessageProps<TMessage>,
) => boolean;
}

export interface GiftedChatState<TMessage: IMessage> {
isInitialized: boolean;
composerHeight?: number;
messagesContainerHeight?: number | AnimatedValue;
typingDisabled: boolean;
text?: string;
messages?: Array<TMessage>;
}

class GiftedChat<TMessage: IMessage> extends React.Component<
GiftedChatProps<TMessage>,
GiftedChatState<TMessage>,
> {}

export * from './types'
export {
GiftedChat,
Actions,
Avatar,
Bubble,
SystemMessage,
MessageImage,
MessageText,
Composer,
Day,
InputToolbar,
LoadEarlier,
Message,
MessageContainer,
Send,
Time,
GiftedAvatar,
utils,
}
@@ -0,0 +1,31 @@
// @flow
import { Component } from 'react'
import type { ComposerProps } from './Composer'
import type { SendProps } from './Send'
import type { ActionsProps } from './Actions'
import type {
TextStyleProp,
ViewStyleProp,
} from 'react-native/Libraries/StyleSheet/StyleSheet'

export interface InputToolbarProps {
options?: {
[key: string]: any,
};
optionTintColor?: string;
containerStyle?: ViewStyleProp;
primaryStyle?: ViewStyleProp;
accessoryStyle?: ViewStyleProp;
renderAccessory?: InputToolbarProps => React$Element<any>;
renderActions?: ActionsProps => React$Element<any>;
renderSend?: SendProps => React$Element<any>;
renderComposer?: ComposerProps => React$Element<any>;
onPressActionButton: () => void;
}

export default class InputToolbar extends Component<
InputToolbarProps,
{
position: string,
},
> {}
@@ -0,0 +1,20 @@
// @flow
import { Component } from 'react'
import type {
TextStyleProp,
ViewStyleProp,
} from 'react-native/Libraries/StyleSheet/StyleSheet'

export interface LoadEarlierProps {
isLoadingEarlier?: boolean;
label?: string;
containerStyle?: ViewStyleProp;
wrapperStyle?: ViewStyleProp;
textStyle?: TextStyleProp;
activityIndicatorStyle?: ViewStyleProp;
activityIndicatorColor?: string;
activityIndicatorSize?: number | 'small' | 'large';
onLoadEarlier?: () => void;
}

export default class LoadEarlier extends Component<LoadEarlierProps> {}

0 comments on commit 49651f7

Please sign in to comment.
You can’t perform that action at this time.