@kesha-antonov/react-native-chat 4.2.0 → 4.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +252 -47
- package/lib/Actions.d.ts +5 -5
- package/lib/Actions.d.ts.map +1 -1
- package/lib/Actions.js +28 -39
- package/lib/Actions.js.map +1 -1
- package/lib/Avatar.d.ts.map +1 -1
- package/lib/Avatar.js +22 -27
- package/lib/Avatar.js.map +1 -1
- package/lib/Bubble/index.d.ts.map +1 -1
- package/lib/Bubble/index.js +86 -25
- package/lib/Bubble/index.js.map +1 -1
- package/lib/Bubble/styles.d.ts +28 -11
- package/lib/Bubble/styles.d.ts.map +1 -1
- package/lib/Bubble/styles.js +108 -80
- package/lib/Bubble/styles.js.map +1 -1
- package/lib/Bubble/types.d.ts +12 -7
- package/lib/Bubble/types.d.ts.map +1 -1
- package/lib/Chat/ChatKeyboardAvoidingView.d.ts +8 -3
- package/lib/Chat/ChatKeyboardAvoidingView.d.ts.map +1 -1
- package/lib/Chat/ChatKeyboardAvoidingView.js +3 -5
- package/lib/Chat/ChatKeyboardAvoidingView.js.map +1 -1
- package/lib/Chat/index.d.ts.map +1 -1
- package/lib/Chat/index.js +65 -25
- package/lib/Chat/index.js.map +1 -1
- package/lib/Chat/types.d.ts +35 -25
- package/lib/Chat/types.d.ts.map +1 -1
- package/lib/ChatAvatar.d.ts.map +1 -1
- package/lib/ChatAvatar.js +11 -17
- package/lib/ChatAvatar.js.map +1 -1
- package/lib/ChatContext.d.ts +29 -1
- package/lib/ChatContext.d.ts.map +1 -1
- package/lib/ChatContext.js +3 -0
- package/lib/ChatContext.js.map +1 -1
- package/lib/Color.d.ts.map +1 -1
- package/lib/Color.js +6 -2
- package/lib/Color.js.map +1 -1
- package/lib/Composer.d.ts +14 -1
- package/lib/Composer.d.ts.map +1 -1
- package/lib/Composer.js +63 -50
- package/lib/Composer.js.map +1 -1
- package/lib/Day/index.d.ts.map +1 -1
- package/lib/Day/index.js +7 -3
- package/lib/Day/index.js.map +1 -1
- package/lib/Day/styles.d.ts +6 -7
- package/lib/Day/styles.d.ts.map +1 -1
- package/lib/Day/styles.js +11 -13
- package/lib/Day/styles.js.map +1 -1
- package/lib/Icons.d.ts +24 -0
- package/lib/Icons.d.ts.map +1 -0
- package/lib/Icons.js +2 -0
- package/lib/Icons.js.map +1 -0
- package/lib/InputToolbar.d.ts +18 -5
- package/lib/InputToolbar.d.ts.map +1 -1
- package/lib/InputToolbar.js +223 -19
- package/lib/InputToolbar.js.map +1 -1
- package/lib/LoadEarlierMessages.d.ts.map +1 -1
- package/lib/LoadEarlierMessages.js +12 -7
- package/lib/LoadEarlierMessages.js.map +1 -1
- package/lib/Message/index.d.ts.map +1 -1
- package/lib/Message/index.js +10 -9
- package/lib/Message/index.js.map +1 -1
- package/lib/Message/styles.js +2 -2
- package/lib/Message/styles.js.map +1 -1
- package/lib/MessageAudio.d.ts +2 -1
- package/lib/MessageAudio.d.ts.map +1 -1
- package/lib/MessageAudio.js +121 -19
- package/lib/MessageAudio.js.map +1 -1
- package/lib/MessageLocation.d.ts +9 -0
- package/lib/MessageLocation.d.ts.map +1 -0
- package/lib/MessageLocation.js +85 -0
- package/lib/MessageLocation.js.map +1 -0
- package/lib/MessageText.d.ts +12 -1
- package/lib/MessageText.d.ts.map +1 -1
- package/lib/MessageText.js +38 -11
- package/lib/MessageText.js.map +1 -1
- package/lib/MessageVideo.d.ts +2 -1
- package/lib/MessageVideo.d.ts.map +1 -1
- package/lib/MessageVideo.js +156 -18
- package/lib/MessageVideo.js.map +1 -1
- package/lib/MessagesContainer/components/Item/index.d.ts +2 -1
- package/lib/MessagesContainer/components/Item/index.d.ts.map +1 -1
- package/lib/MessagesContainer/components/Item/index.js +23 -1
- package/lib/MessagesContainer/components/Item/index.js.map +1 -1
- package/lib/MessagesContainer/index.d.ts.map +1 -1
- package/lib/MessagesContainer/index.js +24 -11
- package/lib/MessagesContainer/index.js.map +1 -1
- package/lib/MessagesContainer/styles.d.ts +23 -3
- package/lib/MessagesContainer/styles.d.ts.map +1 -1
- package/lib/MessagesContainer/styles.js +25 -5
- package/lib/MessagesContainer/styles.js.map +1 -1
- package/lib/Models.d.ts +72 -0
- package/lib/Models.d.ts.map +1 -1
- package/lib/QuickReplies.d.ts +1 -1
- package/lib/QuickReplies.d.ts.map +1 -1
- package/lib/QuickReplies.js +13 -7
- package/lib/QuickReplies.js.map +1 -1
- package/lib/Reactions/MessageReactions.d.ts.map +1 -1
- package/lib/Reactions/MessageReactions.js +11 -10
- package/lib/Reactions/MessageReactions.js.map +1 -1
- package/lib/Reactions/ReactionPicker.d.ts.map +1 -1
- package/lib/Reactions/ReactionPicker.js +5 -3
- package/lib/Reactions/ReactionPicker.js.map +1 -1
- package/lib/Send.d.ts +2 -2
- package/lib/Send.d.ts.map +1 -1
- package/lib/Send.js +37 -37
- package/lib/Send.js.map +1 -1
- package/lib/SystemMessage.d.ts.map +1 -1
- package/lib/SystemMessage.js +8 -5
- package/lib/SystemMessage.js.map +1 -1
- package/lib/Theme.d.ts +148 -0
- package/lib/Theme.d.ts.map +1 -0
- package/lib/Theme.js +142 -0
- package/lib/Theme.js.map +1 -0
- package/lib/Time.d.ts.map +1 -1
- package/lib/Time.js +7 -5
- package/lib/Time.js.map +1 -1
- package/lib/TypingIndicator/index.d.ts.map +1 -1
- package/lib/TypingIndicator/index.js +4 -1
- package/lib/TypingIndicator/index.js.map +1 -1
- package/lib/TypingIndicator/styles.d.ts +2 -2
- package/lib/TypingIndicator/styles.d.ts.map +1 -1
- package/lib/TypingIndicator/styles.js +4 -5
- package/lib/TypingIndicator/styles.js.map +1 -1
- package/lib/components/AttachmentSheet.d.ts +28 -0
- package/lib/components/AttachmentSheet.d.ts.map +1 -0
- package/lib/components/AttachmentSheet.js +177 -0
- package/lib/components/AttachmentSheet.js.map +1 -0
- package/lib/components/BasicMarkdown.d.ts +12 -0
- package/lib/components/BasicMarkdown.d.ts.map +1 -0
- package/lib/components/BasicMarkdown.js +220 -0
- package/lib/components/BasicMarkdown.js.map +1 -0
- package/lib/components/ContextMenu.d.ts +25 -0
- package/lib/components/ContextMenu.d.ts.map +1 -0
- package/lib/components/ContextMenu.js +122 -0
- package/lib/components/ContextMenu.js.map +1 -0
- package/lib/components/Icon.d.ts +17 -0
- package/lib/components/Icon.d.ts.map +1 -0
- package/lib/components/Icon.js +19 -0
- package/lib/components/Icon.js.map +1 -0
- package/lib/components/LucideIcon.d.ts +10 -0
- package/lib/components/LucideIcon.d.ts.map +1 -0
- package/lib/components/LucideIcon.js +118 -0
- package/lib/components/LucideIcon.js.map +1 -0
- package/lib/components/MarkdownMessageText.d.ts +19 -0
- package/lib/components/MarkdownMessageText.d.ts.map +1 -0
- package/lib/components/MarkdownMessageText.js +35 -0
- package/lib/components/MarkdownMessageText.js.map +1 -0
- package/lib/components/MediaCard.d.ts +19 -0
- package/lib/components/MediaCard.d.ts.map +1 -0
- package/lib/components/MediaCard.js +102 -0
- package/lib/components/MediaCard.js.map +1 -0
- package/lib/components/MediaControls.d.ts +41 -0
- package/lib/components/MediaControls.d.ts.map +1 -0
- package/lib/components/MediaControls.js +523 -0
- package/lib/components/MediaControls.js.map +1 -0
- package/lib/components/MessageReply.d.ts.map +1 -1
- package/lib/components/MessageReply.js +11 -9
- package/lib/components/MessageReply.js.map +1 -1
- package/lib/components/ReplyPreview.d.ts +3 -1
- package/lib/components/ReplyPreview.d.ts.map +1 -1
- package/lib/components/ReplyPreview.js +36 -36
- package/lib/components/ReplyPreview.js.map +1 -1
- package/lib/components/SendIcon.d.ts +13 -0
- package/lib/components/SendIcon.d.ts.map +1 -0
- package/lib/components/SendIcon.js +37 -0
- package/lib/components/SendIcon.js.map +1 -0
- package/lib/components/Ticks.d.ts +25 -0
- package/lib/components/Ticks.d.ts.map +1 -0
- package/lib/components/Ticks.js +102 -0
- package/lib/components/Ticks.js.map +1 -0
- package/lib/components/VideoNoteOverlay.d.ts +25 -0
- package/lib/components/VideoNoteOverlay.d.ts.map +1 -0
- package/lib/components/VideoNoteOverlay.js +151 -0
- package/lib/components/VideoNoteOverlay.js.map +1 -0
- package/lib/components/VideoNoteRecorder.d.ts +19 -0
- package/lib/components/VideoNoteRecorder.d.ts.map +1 -0
- package/lib/components/VideoNoteRecorder.js +634 -0
- package/lib/components/VideoNoteRecorder.js.map +1 -0
- package/lib/components/VideoRecordButton.d.ts +29 -0
- package/lib/components/VideoRecordButton.d.ts.map +1 -0
- package/lib/components/VideoRecordButton.js +117 -0
- package/lib/components/VideoRecordButton.js.map +1 -0
- package/lib/components/VoiceMessageInput.d.ts +33 -0
- package/lib/components/VoiceMessageInput.d.ts.map +1 -0
- package/lib/components/VoiceMessageInput.js +396 -0
- package/lib/components/VoiceMessageInput.js.map +1 -0
- package/lib/components/WaveformPlayer.d.ts +19 -0
- package/lib/components/WaveformPlayer.d.ts.map +1 -0
- package/lib/components/WaveformPlayer.js +367 -0
- package/lib/components/WaveformPlayer.js.map +1 -0
- package/lib/components/mediaPalette.d.ts +23 -0
- package/lib/components/mediaPalette.d.ts.map +1 -0
- package/lib/components/mediaPalette.js +16 -0
- package/lib/components/mediaPalette.js.map +1 -0
- package/lib/components/mediaPlayback.d.ts +22 -0
- package/lib/components/mediaPlayback.d.ts.map +1 -0
- package/lib/components/mediaPlayback.js +34 -0
- package/lib/components/mediaPlayback.js.map +1 -0
- package/lib/hooks/useColorScheme.d.ts +9 -2
- package/lib/hooks/useColorScheme.d.ts.map +1 -1
- package/lib/hooks/useColorScheme.js +9 -3
- package/lib/hooks/useColorScheme.js.map +1 -1
- package/lib/hooks/useIcons.d.ts +4 -0
- package/lib/hooks/useIcons.d.ts.map +1 -0
- package/lib/hooks/useIcons.js +8 -0
- package/lib/hooks/useIcons.js.map +1 -0
- package/lib/hooks/useKeyboardVerticalOffset.d.ts +17 -8
- package/lib/hooks/useKeyboardVerticalOffset.d.ts.map +1 -1
- package/lib/hooks/useKeyboardVerticalOffset.js +29 -8
- package/lib/hooks/useKeyboardVerticalOffset.js.map +1 -1
- package/lib/hooks/useLabels.d.ts +4 -0
- package/lib/hooks/useLabels.d.ts.map +1 -0
- package/lib/hooks/useLabels.js +8 -0
- package/lib/hooks/useLabels.js.map +1 -0
- package/lib/hooks/useTheme.d.ts +21 -0
- package/lib/hooks/useTheme.d.ts.map +1 -0
- package/lib/hooks/useTheme.js +32 -0
- package/lib/hooks/useTheme.js.map +1 -0
- package/lib/i18n.d.ts +59 -0
- package/lib/i18n.d.ts.map +1 -0
- package/lib/i18n.js +122 -0
- package/lib/i18n.js.map +1 -0
- package/lib/index.d.ts +17 -0
- package/lib/index.d.ts.map +1 -1
- package/lib/index.js +17 -0
- package/lib/index.js.map +1 -1
- package/lib/types.d.ts +2 -1
- package/lib/types.d.ts.map +1 -1
- package/package.json +99 -44
- package/lib/MessageReply.d.ts +0 -15
- package/lib/MessageReply.d.ts.map +0 -1
- package/lib/MessageReply.js +0 -102
- package/lib/MessageReply.js.map +0 -1
- package/lib/ReplyPreview.d.ts +0 -14
- package/lib/ReplyPreview.d.ts.map +0 -1
- package/lib/ReplyPreview.js +0 -94
- package/lib/ReplyPreview.js.map +0 -1
package/lib/Chat/types.d.ts
CHANGED
|
@@ -1,21 +1,25 @@
|
|
|
1
1
|
import React, { RefObject } from 'react';
|
|
2
2
|
import { TextInput, StyleProp, TextStyle, ViewStyle } from 'react-native';
|
|
3
|
-
import { ActionSheetOptions } from '@expo/react-native-action-sheet';
|
|
4
3
|
import { KeyboardProvider, KeyboardAvoidingViewProps } from 'react-native-keyboard-controller';
|
|
5
4
|
import { ActionsProps } from '../Actions';
|
|
6
5
|
import { AvatarProps } from '../Avatar';
|
|
7
6
|
import { BubbleProps } from '../Bubble';
|
|
7
|
+
import { ActionSheetOptions } from '../ChatContext';
|
|
8
|
+
import { AttachmentAction } from '../components/AttachmentSheet';
|
|
8
9
|
import { ComposerProps } from '../Composer';
|
|
10
|
+
import { ChatLabels } from '../i18n';
|
|
11
|
+
import { ChatIcons } from '../Icons';
|
|
9
12
|
import { InputToolbarProps } from '../InputToolbar';
|
|
10
13
|
import { MessageImageProps } from '../MessageImage';
|
|
11
14
|
import { AnimatedList, MessagesContainerProps } from '../MessagesContainer';
|
|
12
15
|
import { MessageTextProps } from '../MessageText';
|
|
13
|
-
import { IMessage, LeftRightStyle, MessageAudioProps, MessageVideoProps, User } from '../Models';
|
|
16
|
+
import { AudioRecordingProps, IMessage, LeftRightStyle, MessageAudioProps, MessageLocationProps, MessageMenuItem, MessageVideoProps, User, VideoRecordingProps } from '../Models';
|
|
14
17
|
import { QuickRepliesProps } from '../QuickReplies';
|
|
15
18
|
import { ReactionsProps } from '../Reactions';
|
|
16
19
|
import { ReplyProps } from '../Reply';
|
|
17
20
|
import { SendProps } from '../Send';
|
|
18
21
|
import { SystemMessageProps } from '../SystemMessage';
|
|
22
|
+
import { PartialChatTheme } from '../Theme';
|
|
19
23
|
import { TimeProps } from '../Time';
|
|
20
24
|
export interface ChatProps<TMessage extends IMessage> extends Partial<Omit<MessagesContainerProps<TMessage>, 'messageReplyContainerStyle'>> {
|
|
21
25
|
messagesContainerRef?: RefObject<AnimatedList<TMessage>>;
|
|
@@ -27,6 +31,10 @@ export interface ChatProps<TMessage extends IMessage> extends Partial<Omit<Messa
|
|
|
27
31
|
user?: User;
|
|
28
32
|
locale?: string;
|
|
29
33
|
colorScheme?: 'light' | 'dark';
|
|
34
|
+
theme?: PartialChatTheme;
|
|
35
|
+
darkTheme?: PartialChatTheme;
|
|
36
|
+
icons?: ChatIcons;
|
|
37
|
+
labels?: Partial<ChatLabels>;
|
|
30
38
|
timeFormat?: string;
|
|
31
39
|
dateFormat?: string;
|
|
32
40
|
dateFormatCalendar?: object;
|
|
@@ -40,10 +48,7 @@ export interface ChatProps<TMessage extends IMessage> extends Partial<Omit<Messa
|
|
|
40
48
|
imageStyle?: StyleProp<ViewStyle>;
|
|
41
49
|
minComposerHeight?: number;
|
|
42
50
|
maxComposerHeight?: number;
|
|
43
|
-
actions?:
|
|
44
|
-
title: string;
|
|
45
|
-
action: () => void;
|
|
46
|
-
}>;
|
|
51
|
+
actions?: AttachmentAction[];
|
|
47
52
|
actionSheetOptionTintColor?: string;
|
|
48
53
|
quickReplyStyle?: StyleProp<ViewStyle>;
|
|
49
54
|
quickReplyTextStyle?: StyleProp<TextStyle>;
|
|
@@ -68,6 +73,7 @@ export interface ChatProps<TMessage extends IMessage> extends Partial<Omit<Messa
|
|
|
68
73
|
renderMessageImage?: (props: MessageImageProps<TMessage>) => React.ReactNode;
|
|
69
74
|
renderMessageVideo?: (props: MessageVideoProps<TMessage>) => React.ReactNode;
|
|
70
75
|
renderMessageAudio?: (props: MessageAudioProps<TMessage>) => React.ReactNode;
|
|
76
|
+
renderMessageLocation?: (props: MessageLocationProps<TMessage>) => React.ReactNode;
|
|
71
77
|
renderCustomView?: (props: BubbleProps<TMessage>) => React.ReactNode;
|
|
72
78
|
renderTime?: (props: TimeProps<TMessage>) => React.ReactNode;
|
|
73
79
|
renderChatFooter?: () => React.ReactNode;
|
|
@@ -80,27 +86,17 @@ export interface ChatProps<TMessage extends IMessage> extends Partial<Omit<Messa
|
|
|
80
86
|
messageTextProps?: Partial<MessageTextProps<TMessage>>;
|
|
81
87
|
renderQuickReplies?: (quickReplies: QuickRepliesProps<TMessage>) => React.ReactNode;
|
|
82
88
|
renderQuickReplySend?: () => React.ReactNode;
|
|
83
|
-
/**
|
|
84
|
-
* Props for the built-in `KeyboardProvider`. Ignored when your app already mounts
|
|
85
|
-
* its own - configure the provider where you mount it instead.
|
|
86
|
-
*/
|
|
87
89
|
keyboardProviderProps?: React.ComponentProps<typeof KeyboardProvider>;
|
|
88
90
|
/**
|
|
89
91
|
* Skip rendering the built-in `KeyboardProvider` wrapper.
|
|
90
|
-
*
|
|
91
|
-
*
|
|
92
|
+
* Enable this when your app already mounts its own `KeyboardProvider`
|
|
93
|
+
* (e.g. once at the root), or when the default `statusBarTranslucent` /
|
|
92
94
|
* `navigationBarTranslucent` edge-to-edge behavior causes layout shift,
|
|
93
95
|
* flicker on mount, or a header/content jump on Android/Expo.
|
|
94
96
|
* Default is `false`.
|
|
95
97
|
*/
|
|
96
98
|
disableKeyboardProvider?: boolean;
|
|
97
|
-
/**
|
|
98
|
-
* Props for the `KeyboardAvoidingView` that keeps the input toolbar above the keyboard.
|
|
99
|
-
*
|
|
100
|
-
* `keyboardVerticalOffset` no longer needs to be set - Chat measures how far down the
|
|
101
|
-
* window it sits, navigation header included. Pass it only to override that measurement:
|
|
102
|
-
* too small leaves the toolbar behind the keyboard, too large leaves a gap above it.
|
|
103
|
-
*/
|
|
99
|
+
/** Props for KeyboardAvoidingView. Use `keyboardVerticalOffset` to account for headers or iOS predictive text bar (~44pt). */
|
|
104
100
|
keyboardAvoidingViewProps?: KeyboardAvoidingViewProps;
|
|
105
101
|
/** Enable animated day label that appears on scroll; default is true */
|
|
106
102
|
isDayAnimationEnabled?: boolean;
|
|
@@ -108,15 +104,29 @@ export interface ChatProps<TMessage extends IMessage> extends Partial<Omit<Messa
|
|
|
108
104
|
reply?: ReplyProps<TMessage>;
|
|
109
105
|
/** Emoji reactions configuration */
|
|
110
106
|
reactions?: ReactionsProps<TMessage>;
|
|
107
|
+
/** Telegram-style long-press context menu actions (array or per-message function) */
|
|
108
|
+
messageActions?: MessageMenuItem[] | ((message: TMessage) => MessageMenuItem[]);
|
|
111
109
|
/**
|
|
112
|
-
* Controls whether
|
|
113
|
-
*
|
|
114
|
-
* `false`) for messages
|
|
115
|
-
* player with its own controls, a map, a WebView - whose touches
|
|
116
|
-
* compete with the bubble.
|
|
117
|
-
*
|
|
110
|
+
* Controls whether message bubbles attach the tap / long-press gestures that
|
|
111
|
+
* `reactions` and `messageActions` rely on. Pass `false` (or a predicate
|
|
112
|
+
* returning `false`) for messages rendering natively interactive content -
|
|
113
|
+
* a video player with its own controls, a map, a WebView - whose touches
|
|
114
|
+
* must not compete with the bubble.
|
|
115
|
+
* Note: with gestures off, those messages can no longer open the reaction
|
|
116
|
+
* picker or the context menu.
|
|
118
117
|
* @default true
|
|
119
118
|
*/
|
|
120
119
|
isMessageGestureEnabled?: boolean | ((message: TMessage) => boolean);
|
|
120
|
+
/** Show an emoji button inset on the left of the composer field; called on press */
|
|
121
|
+
onPressEmoji?: () => void;
|
|
122
|
+
/**
|
|
123
|
+
* Whether the composer accepts multiple lines. `true` (default) keeps the
|
|
124
|
+
* return key inserting a newline; `false` turns it into Send.
|
|
125
|
+
*/
|
|
126
|
+
isMultiline?: boolean;
|
|
127
|
+
/** Telegram-style hold-to-record voice messages (needs optional expo-audio) */
|
|
128
|
+
audioRecording?: AudioRecordingProps;
|
|
129
|
+
/** Record-and-send video messages from the camera (needs optional expo-image-picker) */
|
|
130
|
+
videoRecording?: VideoRecordingProps;
|
|
121
131
|
}
|
|
122
132
|
//# sourceMappingURL=types.d.ts.map
|
package/lib/Chat/types.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/Chat/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACxC,OAAO,EACL,SAAS,EACT,SAAS,EACT,SAAS,EACT,SAAS,EACV,MAAM,cAAc,CAAA;AACrB,OAAO,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/Chat/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACxC,OAAO,EACL,SAAS,EACT,SAAS,EACT,SAAS,EACT,SAAS,EACV,MAAM,cAAc,CAAA;AACrB,OAAO,EAAE,gBAAgB,EAAE,yBAAyB,EAAE,MAAM,kCAAkC,CAAA;AAE9F,OAAO,EAAE,YAAY,EAAE,MAAM,YAAY,CAAA;AACzC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAA;AACvC,OAAO,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAA;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAA;AAChE,OAAO,EAAE,aAAa,EAAE,MAAM,aAAa,CAAA;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,SAAS,CAAA;AACpC,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AACpC,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AACnD,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AACnD,OAAO,EAAE,YAAY,EAAE,sBAAsB,EAAE,MAAM,sBAAsB,CAAA;AAC3E,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAA;AACjD,OAAO,EACL,mBAAmB,EACnB,QAAQ,EACR,cAAc,EACd,iBAAiB,EACjB,oBAAoB,EACpB,eAAe,EACf,iBAAiB,EACjB,IAAI,EACJ,mBAAmB,EACpB,MAAM,WAAW,CAAA;AAClB,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAA;AACnD,OAAO,EAAE,cAAc,EAAE,MAAM,cAAc,CAAA;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AACrC,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AACnC,OAAO,EAAE,kBAAkB,EAAE,MAAM,kBAAkB,CAAA;AACrD,OAAO,EAAE,gBAAgB,EAAE,MAAM,UAAU,CAAA;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAEnC,MAAM,WAAW,SAAS,CAAC,QAAQ,SAAS,QAAQ,CAAE,SAAQ,OAAO,CAAC,IAAI,CAAC,sBAAsB,CAAC,QAAQ,CAAC,EAAE,4BAA4B,CAAC,CAAC;IAEzI,oBAAoB,CAAC,EAAE,SAAS,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,CAAA;IAExD,YAAY,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IAEnC,iBAAiB,CAAC,EAAE,OAAO,CAAA;IAE3B,sBAAsB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IAE7C,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;IAEpB,IAAI,CAAC,EAAE,IAAI,CAAA;IAEX,MAAM,CAAC,EAAE,MAAM,CAAA;IAEf,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IAE9B,KAAK,CAAC,EAAE,gBAAgB,CAAA;IAExB,SAAS,CAAC,EAAE,gBAAgB,CAAA;IAE5B,KAAK,CAAC,EAAE,SAAS,CAAA;IAEjB,MAAM,CAAC,EAAE,OAAO,CAAC,UAAU,CAAC,CAAA;IAE5B,UAAU,CAAC,EAAE,MAAM,CAAA;IAEnB,UAAU,CAAC,EAAE,MAAM,CAAA;IAEnB,kBAAkB,CAAC,EAAE,MAAM,CAAA;IAE3B,mBAAmB,CAAC,EAAE,OAAO,CAAA;IAE7B,8BAA8B,CAAC,EAAE,OAAO,CAAA;IAExC,aAAa,CAAC,EAAE,OAAO,CAAA;IAEvB,UAAU,CAAC,EAAE,iBAAiB,CAAC,QAAQ,CAAC,CAAA;IAExC,qBAAqB,CAAC,EAAE,MAAM,CAAA;IAE9B,cAAc,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,SAAS,CAAC,CAAC,CAAA;IAEhE,yBAAyB,CAAC,EAAE,OAAO,CAAA;IAEnC,UAAU,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IAEjC,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAE1B,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,OAAO,CAAC,EAAE,gBAAgB,EAAE,CAAA;IAC5B,0BAA0B,CAAC,EAAE,MAAM,CAAA;IACnC,eAAe,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IACtC,mBAAmB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IAC1C,wBAAwB,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IAE/C,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,aAAa,CAAC,EAAE,cAAc,CAAC,SAAS,CAAC,CAAA;IAEzC,WAAW,CAAC,EAAE,MAAM;QAClB,0BAA0B,EAAE,CAC1B,OAAO,EAAE,kBAAkB,EAC3B,QAAQ,EAAE,CAAC,WAAW,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,KACpD,IAAI,CAAA;KACV,CAAA;IAED,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAA;IAEpC,iBAAiB,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,IAAI,CAAA;IAExC,kBAAkB,CAAC,EAAE,CAAC,OAAO,CAAC,EAAE,QAAQ,KAAK,MAAM,CAAA;IAEnD,MAAM,CAAC,EAAE,CAAC,QAAQ,EAAE,QAAQ,EAAE,KAAK,IAAI,CAAA;IAEvC,aAAa,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAA;IAErC,YAAY,CAAC,EAAE,IAAI,GAAG,CAAC,CAAC,KAAK,EAAE,WAAW,CAAC,QAAQ,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,CAAA;IAEzE,YAAY,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,QAAQ,CAAC,KAAK,KAAK,CAAC,SAAS,CAAA;IAEhE,mBAAmB,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,CAAC,QAAQ,CAAC,KAAK,KAAK,CAAC,SAAS,CAAA;IAE9E,cAAc,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,KAAK,IAAI,CAAA;IAE9D,kBAAkB,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,OAAO,EAAE,QAAQ,KAAK,IAAI,CAAA;IAElE,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,IAAI,KAAK,KAAK,CAAC,SAAS,CAAA;IAGhD,iBAAiB,CAAC,EAAE,CAAC,WAAW,EAAE,gBAAgB,CAAC,QAAQ,CAAC,KAAK,KAAK,CAAC,SAAS,CAAA;IAEhF,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,CAAC,QAAQ,CAAC,KAAK,KAAK,CAAC,SAAS,CAAA;IAE5E,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,CAAC,QAAQ,CAAC,KAAK,KAAK,CAAC,SAAS,CAAA;IAE5E,kBAAkB,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,CAAC,QAAQ,CAAC,KAAK,KAAK,CAAC,SAAS,CAAA;IAE5E,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,oBAAoB,CAAC,QAAQ,CAAC,KAAK,KAAK,CAAC,SAAS,CAAA;IAElF,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,QAAQ,CAAC,KAAK,KAAK,CAAC,SAAS,CAAA;IAEpE,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,CAAC,QAAQ,CAAC,KAAK,KAAK,CAAC,SAAS,CAAA;IAE5D,gBAAgB,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAA;IAExC,kBAAkB,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC,iBAAiB,CAAC,QAAQ,CAAC,CAAC,GAAG,KAAK,CAAC,YAAY,GAAG,CAAC,CAAC,KAAK,EAAE,iBAAiB,CAAC,QAAQ,CAAC,KAAK,KAAK,CAAC,SAAS,CAAC,GAAG,IAAI,CAAA;IAE7J,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,KAAK,KAAK,CAAC,SAAS,CAAA;IAE1D,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,YAAY,KAAK,KAAK,CAAC,SAAS,CAAA;IAExD,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,CAAC,QAAQ,CAAC,KAAK,KAAK,CAAC,SAAS,CAAA;IAE5D,eAAe,CAAC,EAAE,CAAC,KAAK,EAAE,iBAAiB,CAAC,QAAQ,CAAC,KAAK,KAAK,CAAC,SAAS,CAAA;IAEzE,mBAAmB,CAAC,EAAE,MAAM,IAAI,CAAA;IAEhC,gBAAgB,CAAC,EAAE,OAAO,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAA;IACtD,kBAAkB,CAAC,EAAE,CACnB,YAAY,EAAE,iBAAiB,CAAC,QAAQ,CAAC,KACtC,KAAK,CAAC,SAAS,CAAA;IACpB,oBAAoB,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAA;IAC5C,qBAAqB,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,OAAO,gBAAgB,CAAC,CAAA;IACrE;;;;;;;OAOG;IACH,uBAAuB,CAAC,EAAE,OAAO,CAAA;IACjC,8HAA8H;IAC9H,yBAAyB,CAAC,EAAE,yBAAyB,CAAA;IACrD,wEAAwE;IACxE,qBAAqB,CAAC,EAAE,OAAO,CAAA;IAE/B,wCAAwC;IACxC,KAAK,CAAC,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAA;IAC5B,oCAAoC;IACpC,SAAS,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAA;IACpC,qFAAqF;IACrF,cAAc,CAAC,EAAE,eAAe,EAAE,GAAG,CAAC,CAAC,OAAO,EAAE,QAAQ,KAAK,eAAe,EAAE,CAAC,CAAA;IAC/E;;;;;;;;;OASG;IACH,uBAAuB,CAAC,EAAE,OAAO,GAAG,CAAC,CAAC,OAAO,EAAE,QAAQ,KAAK,OAAO,CAAC,CAAA;IACpE,oFAAoF;IACpF,YAAY,CAAC,EAAE,MAAM,IAAI,CAAA;IACzB;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,+EAA+E;IAC/E,cAAc,CAAC,EAAE,mBAAmB,CAAA;IACpC,wFAAwF;IACxF,cAAc,CAAC,EAAE,mBAAmB,CAAA;CACrC"}
|
package/lib/ChatAvatar.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatAvatar.d.ts","sourceRoot":"","sources":["../src/ChatAvatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAA;AACnD,OAAO,EAIL,SAAS,EACT,UAAU,EACV,SAAS,EACH,MAAM,cAAc,CAAA;
|
|
1
|
+
{"version":3,"file":"ChatAvatar.d.ts","sourceRoot":"","sources":["../src/ChatAvatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAA;AACnD,OAAO,EAIL,SAAS,EACT,UAAU,EACV,SAAS,EACH,MAAM,cAAc,CAAA;AAI5B,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAA;AAqB/B,MAAM,WAAW,eAAe;IAC9B,IAAI,CAAC,EAAE,IAAI,CAAA;IACX,WAAW,CAAC,EAAE,SAAS,CAAC,UAAU,CAAC,CAAA;IACnC,SAAS,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IAChC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAA;IAC1C,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,eAAe,KAAK,IAAI,CAAA;CAC/C;AAED,wBAAgB,UAAU,CACxB,KAAK,EAAE,eAAe,qBAkIvB"}
|
package/lib/ChatAvatar.js
CHANGED
|
@@ -2,9 +2,9 @@ import React, { useCallback, useMemo } from 'react';
|
|
|
2
2
|
import { Image, View, StyleSheet, Text } from 'react-native';
|
|
3
3
|
import { Color } from './Color';
|
|
4
4
|
import { TouchableOpacity } from './components/TouchableOpacity';
|
|
5
|
+
import { useTheme, useThemedStyles } from './hooks/useTheme';
|
|
5
6
|
import stylesCommon from './styles';
|
|
6
|
-
const
|
|
7
|
-
const styles = StyleSheet.create({
|
|
7
|
+
const createStyles = (theme) => StyleSheet.create({
|
|
8
8
|
avatarStyle: {
|
|
9
9
|
width: 40,
|
|
10
10
|
height: 40,
|
|
@@ -14,7 +14,7 @@ const styles = StyleSheet.create({
|
|
|
14
14
|
backgroundColor: Color.backgroundTransparent,
|
|
15
15
|
},
|
|
16
16
|
textStyle: {
|
|
17
|
-
color:
|
|
17
|
+
color: theme.avatar.textColor,
|
|
18
18
|
fontSize: 16,
|
|
19
19
|
backgroundColor: Color.backgroundTransparent,
|
|
20
20
|
fontWeight: '100',
|
|
@@ -22,6 +22,8 @@ const styles = StyleSheet.create({
|
|
|
22
22
|
});
|
|
23
23
|
export function ChatAvatar(props) {
|
|
24
24
|
const { user, avatarStyle, textStyle, onPress, } = props;
|
|
25
|
+
const theme = useTheme();
|
|
26
|
+
const styles = useThemedStyles(createStyles);
|
|
25
27
|
const avatarName = useMemo(() => {
|
|
26
28
|
const userName = user?.name || '';
|
|
27
29
|
const name = userName.toUpperCase().split(' ');
|
|
@@ -38,18 +40,10 @@ export function ChatAvatar(props) {
|
|
|
38
40
|
for (let i = 0; i < user.name.length; i += 1)
|
|
39
41
|
sumChars += user.name.charCodeAt(i);
|
|
40
42
|
// inspired by https://github.com/wbinnssmith/react-user-avatar
|
|
41
|
-
//
|
|
42
|
-
const colors =
|
|
43
|
-
carrot,
|
|
44
|
-
emerald,
|
|
45
|
-
peterRiver,
|
|
46
|
-
wisteria,
|
|
47
|
-
alizarin,
|
|
48
|
-
turquoise,
|
|
49
|
-
midnightBlue,
|
|
50
|
-
];
|
|
43
|
+
// palette is themeable via theme.avatar.palette
|
|
44
|
+
const colors = theme.avatar.palette;
|
|
51
45
|
return colors[sumChars % colors.length];
|
|
52
|
-
}, [user?.name]);
|
|
46
|
+
}, [user?.name, theme]);
|
|
53
47
|
const renderAvatar = useCallback(() => {
|
|
54
48
|
switch (typeof user?.avatar) {
|
|
55
49
|
case 'function':
|
|
@@ -61,12 +55,12 @@ export function ChatAvatar(props) {
|
|
|
61
55
|
default:
|
|
62
56
|
return null;
|
|
63
57
|
}
|
|
64
|
-
}, [user, avatarStyle]);
|
|
58
|
+
}, [user, avatarStyle, styles]);
|
|
65
59
|
const renderInitials = useCallback(() => {
|
|
66
60
|
return (<Text style={[styles.textStyle, textStyle]}>
|
|
67
61
|
{avatarName}
|
|
68
62
|
</Text>);
|
|
69
|
-
}, [textStyle, avatarName]);
|
|
63
|
+
}, [textStyle, avatarName, styles]);
|
|
70
64
|
const handleOnPress = useCallback(() => {
|
|
71
65
|
const { onPress, ...rest } = props;
|
|
72
66
|
onPress?.(rest);
|
|
@@ -81,7 +75,7 @@ export function ChatAvatar(props) {
|
|
|
81
75
|
styles.avatarStyle,
|
|
82
76
|
styles.avatarTransparent,
|
|
83
77
|
avatarStyle,
|
|
84
|
-
]} accessibilityRole='image'/>), [avatarStyle]);
|
|
78
|
+
]} accessibilityRole='image'/>), [avatarStyle, styles]);
|
|
85
79
|
if (!user || (!user.name && !user.avatar))
|
|
86
80
|
return placeholderView;
|
|
87
81
|
if (user.avatar)
|
package/lib/ChatAvatar.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatAvatar.js","sourceRoot":"","sources":["../src/ChatAvatar.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACnD,OAAO,EACL,KAAK,EACL,IAAI,EACJ,UAAU,EAIV,IAAI,EAAE,MAAM,cAAc,CAAA;AAC5B,OAAO,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAC/B,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAA;
|
|
1
|
+
{"version":3,"file":"ChatAvatar.js","sourceRoot":"","sources":["../src/ChatAvatar.tsx"],"names":[],"mappings":"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"}
|
package/lib/ChatContext.d.ts
CHANGED
|
@@ -1,11 +1,39 @@
|
|
|
1
1
|
import { ColorSchemeName } from 'react-native';
|
|
2
|
-
import {
|
|
2
|
+
import { ChatLabels } from './i18n';
|
|
3
|
+
import { ChatIcons } from './Icons';
|
|
4
|
+
import { ChatTheme } from './Theme';
|
|
5
|
+
/**
|
|
6
|
+
* Minimal, library-agnostic action-sheet options. The built-in UI no longer
|
|
7
|
+
* depends on @expo/react-native-action-sheet; this type lets consumers still
|
|
8
|
+
* plug their own action-sheet implementation in via the `actionSheet` prop
|
|
9
|
+
* (its options are a superset of these fields, so it stays compatible).
|
|
10
|
+
*/
|
|
11
|
+
export interface ActionSheetOptions {
|
|
12
|
+
options: string[];
|
|
13
|
+
cancelButtonIndex?: number;
|
|
14
|
+
destructiveButtonIndex?: number | number[];
|
|
15
|
+
title?: string;
|
|
16
|
+
message?: string;
|
|
17
|
+
tintColor?: string;
|
|
18
|
+
[key: string]: unknown;
|
|
19
|
+
}
|
|
3
20
|
export interface IChatContext {
|
|
4
21
|
actionSheet(): {
|
|
5
22
|
showActionSheetWithOptions: (options: ActionSheetOptions, callback: (buttonIndex?: number) => void | Promise<void>) => void;
|
|
6
23
|
};
|
|
7
24
|
getLocale(): string;
|
|
8
25
|
getColorScheme(): ColorSchemeName | null | undefined;
|
|
26
|
+
/**
|
|
27
|
+
* The fully-resolved theme for the current color scheme (defaults merged with
|
|
28
|
+
* any `theme` / `darkTheme` overrides). Returns undefined when a component is
|
|
29
|
+
* rendered outside of `Chat`, in which case `useTheme` falls back to the
|
|
30
|
+
* built-in defaults for the system color scheme.
|
|
31
|
+
*/
|
|
32
|
+
getTheme?(): ChatTheme | undefined;
|
|
33
|
+
/** Icon override registry (drawn icons are used for any name not provided). */
|
|
34
|
+
getIcons?(): ChatIcons | undefined;
|
|
35
|
+
/** Resolved UI labels for the current locale (English defaults outside Chat). */
|
|
36
|
+
getLabels?(): ChatLabels | undefined;
|
|
9
37
|
}
|
|
10
38
|
export declare const ChatContext: import("react").Context<IChatContext>;
|
|
11
39
|
export declare const useChatContext: () => IChatContext;
|
package/lib/ChatContext.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatContext.d.ts","sourceRoot":"","sources":["../src/ChatContext.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAC9C,OAAO,
|
|
1
|
+
{"version":3,"file":"ChatContext.d.ts","sourceRoot":"","sources":["../src/ChatContext.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAC9C,OAAO,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAA;AACnC,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AACnC,OAAO,EAAE,SAAS,EAAE,MAAM,SAAS,CAAA;AAEnC;;;;;GAKG;AACH,MAAM,WAAW,kBAAkB;IACjC,OAAO,EAAE,MAAM,EAAE,CAAA;IACjB,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,sBAAsB,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAA;IAC1C,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;CACvB;AAED,MAAM,WAAW,YAAY;IAC3B,WAAW,IAAI;QACb,0BAA0B,EAAE,CAC1B,OAAO,EAAE,kBAAkB,EAC3B,QAAQ,EAAE,CAAC,WAAW,CAAC,EAAE,MAAM,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,KACrD,IAAI,CAAA;KACV,CAAA;IACD,SAAS,IAAI,MAAM,CAAA;IACnB,cAAc,IAAI,eAAe,GAAG,IAAI,GAAG,SAAS,CAAA;IACpD;;;;;OAKG;IACH,QAAQ,CAAC,IAAI,SAAS,GAAG,SAAS,CAAA;IAClC,+EAA+E;IAC/E,QAAQ,CAAC,IAAI,SAAS,GAAG,SAAS,CAAA;IAClC,iFAAiF;IACjF,SAAS,CAAC,IAAI,UAAU,GAAG,SAAS,CAAA;CACrC;AAED,eAAO,MAAM,WAAW,uCAStB,CAAA;AAEF,eAAO,MAAM,cAAc,oBAAgC,CAAA"}
|
package/lib/ChatContext.js
CHANGED
|
@@ -5,6 +5,9 @@ export const ChatContext = createContext({
|
|
|
5
5
|
showActionSheetWithOptions: () => { },
|
|
6
6
|
}),
|
|
7
7
|
getColorScheme: () => null,
|
|
8
|
+
getTheme: () => undefined,
|
|
9
|
+
getIcons: () => undefined,
|
|
10
|
+
getLabels: () => undefined,
|
|
8
11
|
});
|
|
9
12
|
export const useChatContext = () => useContext(ChatContext);
|
|
10
13
|
//# sourceMappingURL=ChatContext.js.map
|
package/lib/ChatContext.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChatContext.js","sourceRoot":"","sources":["../src/ChatContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"ChatContext.js","sourceRoot":"","sources":["../src/ChatContext.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AA4CjD,MAAM,CAAC,MAAM,WAAW,GAAG,aAAa,CAAe;IACrD,SAAS,EAAE,GAAG,EAAE,CAAC,IAAI;IACrB,WAAW,EAAE,GAAG,EAAE,CAAC,CAAC;QAClB,0BAA0B,EAAE,GAAG,EAAE,GAAE,CAAC;KACrC,CAAC;IACF,cAAc,EAAE,GAAG,EAAE,CAAC,IAAI;IAC1B,QAAQ,EAAE,GAAG,EAAE,CAAC,SAAS;IACzB,QAAQ,EAAE,GAAG,EAAE,CAAC,SAAS;IACzB,SAAS,EAAE,GAAG,EAAE,CAAC,SAAS;CAC3B,CAAC,CAAA;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC,WAAW,CAAC,CAAA"}
|
package/lib/Color.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Color.d.ts","sourceRoot":"","sources":["../src/Color.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"Color.d.ts","sourceRoot":"","sources":["../src/Color.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;CAoBjB,CAAA"}
|
package/lib/Color.js
CHANGED
|
@@ -1,8 +1,12 @@
|
|
|
1
1
|
export const Color = {
|
|
2
2
|
defaultColor: '#b2b2b2',
|
|
3
3
|
backgroundTransparent: 'transparent',
|
|
4
|
-
|
|
5
|
-
|
|
4
|
+
// Modern azure accent (Telegram-style), replacing the old Messenger blue.
|
|
5
|
+
// Also exposed as `theme.colors.accent`; kept here for components that read
|
|
6
|
+
// Color directly (reply preview, swipe-to-reply icon) so the accent stays
|
|
7
|
+
// consistent across the whole UI.
|
|
8
|
+
defaultBlue: '#3390EC',
|
|
9
|
+
leftBubbleBackground: '#FFFFFF',
|
|
6
10
|
black: '#000',
|
|
7
11
|
white: '#fff',
|
|
8
12
|
carrot: '#e67e22',
|
package/lib/Color.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Color.js","sourceRoot":"","sources":["../src/Color.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,KAAK,GAAG;IACnB,YAAY,EAAE,SAAS;IACvB,qBAAqB,EAAE,aAAa;IACpC,WAAW,EAAE,SAAS;IACtB,oBAAoB,EAAE,SAAS;IAC/B,KAAK,EAAE,MAAM;IACb,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,SAAS;IACjB,OAAO,EAAE,SAAS;IAClB,UAAU,EAAE,SAAS;IACrB,QAAQ,EAAE,SAAS;IACnB,QAAQ,EAAE,SAAS;IACnB,SAAS,EAAE,SAAS;IACpB,YAAY,EAAE,SAAS;IACvB,eAAe,EAAE,SAAS;IAC1B,aAAa,EAAE,MAAM;CACtB,CAAA"}
|
|
1
|
+
{"version":3,"file":"Color.js","sourceRoot":"","sources":["../src/Color.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,KAAK,GAAG;IACnB,YAAY,EAAE,SAAS;IACvB,qBAAqB,EAAE,aAAa;IACpC,0EAA0E;IAC1E,4EAA4E;IAC5E,0EAA0E;IAC1E,kCAAkC;IAClC,WAAW,EAAE,SAAS;IACtB,oBAAoB,EAAE,SAAS;IAC/B,KAAK,EAAE,MAAM;IACb,KAAK,EAAE,MAAM;IACb,MAAM,EAAE,SAAS;IACjB,OAAO,EAAE,SAAS;IAClB,UAAU,EAAE,SAAS;IACrB,QAAQ,EAAE,SAAS;IACnB,QAAQ,EAAE,SAAS;IACnB,SAAS,EAAE,SAAS;IACpB,YAAY,EAAE,SAAS;IACvB,eAAe,EAAE,SAAS;IAC1B,aAAa,EAAE,MAAM;CACtB,CAAA"}
|
package/lib/Composer.d.ts
CHANGED
|
@@ -1,9 +1,22 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { TextInputProps } from 'react-native';
|
|
3
|
+
import { IMessage } from './Models';
|
|
3
4
|
export interface ComposerProps {
|
|
4
5
|
composerHeight?: number;
|
|
5
6
|
text?: string;
|
|
6
7
|
textInputProps?: Partial<TextInputProps>;
|
|
8
|
+
/**
|
|
9
|
+
* Whether the field accepts multiple lines.
|
|
10
|
+
*
|
|
11
|
+
* `true` (default) keeps the return key inserting a newline - send with the
|
|
12
|
+
* send button. `false` turns the return key into Send, which is what a
|
|
13
|
+
* single-line composer should do. Previously the field was always multiline
|
|
14
|
+
* with no submit handler, so the return key could never send at all.
|
|
15
|
+
*/
|
|
16
|
+
isMultiline?: boolean;
|
|
17
|
+
/** Allow sending an empty message (media-only sends). */
|
|
18
|
+
isTextOptional?: boolean;
|
|
19
|
+
onSend?(messages: Partial<IMessage> | Partial<IMessage>[], shouldResetInputToolbar: boolean): void;
|
|
7
20
|
}
|
|
8
|
-
export declare function Composer({ text, textInputProps, }: ComposerProps): React.ReactElement;
|
|
21
|
+
export declare function Composer({ text, textInputProps, isMultiline, isTextOptional, onSend, }: ComposerProps): React.ReactElement;
|
|
9
22
|
//# sourceMappingURL=Composer.d.ts.map
|
package/lib/Composer.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Composer.d.ts","sourceRoot":"","sources":["../src/Composer.tsx"],"names":[],"mappings":"AAAA,OAAO,
|
|
1
|
+
{"version":3,"file":"Composer.d.ts","sourceRoot":"","sources":["../src/Composer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAsB,MAAM,OAAO,CAAA;AAC1C,OAAO,EAEL,cAAc,EAEf,MAAM,cAAc,CAAA;AAKrB,OAAO,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAA;AAGnC,MAAM,WAAW,aAAa;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAA;IACvB,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,cAAc,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAA;IACxC;;;;;;;OAOG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,yDAAyD;IACzD,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,MAAM,CAAC,CACL,QAAQ,EAAE,OAAO,CAAC,QAAQ,CAAC,GAAG,OAAO,CAAC,QAAQ,CAAC,EAAE,EACjD,uBAAuB,EAAE,OAAO,GAC/B,IAAI,CAAA;CACR;AAWD,wBAAgB,QAAQ,CAAE,EACxB,IAAS,EACT,cAAc,EACd,WAAkB,EAClB,cAAsB,EACtB,MAAM,GACP,EAAE,aAAa,GAAG,KAAK,CAAC,YAAY,CAqDpC"}
|
package/lib/Composer.js
CHANGED
|
@@ -1,59 +1,72 @@
|
|
|
1
|
-
import React, { useCallback
|
|
2
|
-
import {
|
|
1
|
+
import React, { useCallback } from 'react';
|
|
2
|
+
import { StyleSheet, View, } from 'react-native';
|
|
3
3
|
import { TextInput } from 'react-native-gesture-handler';
|
|
4
|
-
import { Color } from './Color';
|
|
5
4
|
import { useColorScheme } from './hooks/useColorScheme';
|
|
6
|
-
import
|
|
7
|
-
|
|
5
|
+
import { useLabels } from './hooks/useLabels';
|
|
6
|
+
import { useTheme, useThemedStyles } from './hooks/useTheme';
|
|
7
|
+
// Static text-input metrics. lineHeight matches typography.message.lineHeight
|
|
8
|
+
// (21) so composed text and sent bubbles share identical metrics. The vertical
|
|
9
|
+
// padding is derived from the bar height (see createStyles) so a single line of
|
|
10
|
+
// text is vertically centered in the field.
|
|
11
|
+
const TEXT_INPUT_METRICS = {
|
|
12
|
+
fontSize: 16,
|
|
13
|
+
lineHeight: 21,
|
|
14
|
+
};
|
|
15
|
+
export function Composer({ text = '', textInputProps, isMultiline = true, isTextOptional = false, onSend, }) {
|
|
8
16
|
const colorScheme = useColorScheme();
|
|
17
|
+
const theme = useTheme();
|
|
18
|
+
const labels = useLabels();
|
|
19
|
+
const styles = useThemedStyles(createStyles);
|
|
9
20
|
const isDark = colorScheme === 'dark';
|
|
10
|
-
const
|
|
11
|
-
const
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
// @ts-expect-error - web-specific code
|
|
36
|
-
event.nativeEvent.target.style.height = '0px';
|
|
37
|
-
// @ts-expect-error - web-specific code
|
|
38
|
-
event.nativeEvent.target.style.height = `${event.nativeEvent.target.scrollHeight}px`;
|
|
39
|
-
});
|
|
40
|
-
}, []);
|
|
41
|
-
return (<View style={stylesCommon.fill}>
|
|
42
|
-
<TextInput testID={placeholder} accessible accessibilityLabel={placeholder} placeholderTextColor={textInputProps?.placeholderTextColor ?? (isDark ? '#888' : Color.defaultColor)} value={text} enablesReturnKeyAutomatically underlineColorAndroid='transparent' keyboardAppearance={isDark ? 'dark' : 'default'} multiline placeholder={placeholder} onContentSizeChange={handleContentSizeChange} onChange={handleChange} {...textInputProps} style={[getColorSchemeStyle(styles, 'textInput', colorScheme), stylesWeb.textInput, { height }, textInputProps?.style]}/>
|
|
21
|
+
const maxHeight = theme.composer.maxHeight;
|
|
22
|
+
const placeholder = textInputProps?.placeholder ?? labels.placeholder;
|
|
23
|
+
// A single line fills the bar height so its text sits centered (symmetric
|
|
24
|
+
// padding); it grows from there up to maxHeight.
|
|
25
|
+
const ONE_LINE = theme.composer.minHeight;
|
|
26
|
+
// Single-line mode: the return key sends, mirroring the send button exactly.
|
|
27
|
+
const handleSubmitEditing = useCallback(() => {
|
|
28
|
+
const trimmedText = text.trim();
|
|
29
|
+
if (onSend && (trimmedText.length || isTextOptional))
|
|
30
|
+
onSend({ text: trimmedText }, true);
|
|
31
|
+
}, [text, onSend, isTextOptional]);
|
|
32
|
+
return (<View style={styles.field}>
|
|
33
|
+
<TextInput testID={placeholder} accessible accessibilityLabel={placeholder} placeholderTextColor={textInputProps?.placeholderTextColor ?? theme.colors.placeholder} value={text} enablesReturnKeyAutomatically underlineColorAndroid='transparent' keyboardAppearance={isDark ? 'dark' : 'default'} multiline={isMultiline} placeholder={placeholder} {...(isMultiline
|
|
34
|
+
? null
|
|
35
|
+
: {
|
|
36
|
+
returnKeyType: 'send',
|
|
37
|
+
onSubmitEditing: handleSubmitEditing,
|
|
38
|
+
// Keep the keyboard up after sending, the way a chat should behave.
|
|
39
|
+
submitBehavior: 'submit',
|
|
40
|
+
})} {...textInputProps} style={[
|
|
41
|
+
styles.textInput,
|
|
42
|
+
stylesWeb.textInput,
|
|
43
|
+
{ minHeight: ONE_LINE, maxHeight },
|
|
44
|
+
textInputProps?.style,
|
|
45
|
+
]}/>
|
|
43
46
|
</View>);
|
|
44
47
|
}
|
|
45
|
-
const
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
}
|
|
48
|
+
const createStyles = (theme) => {
|
|
49
|
+
// Center a single line vertically: split the leftover space (bar height minus
|
|
50
|
+
// one line of text) into equal top/bottom padding.
|
|
51
|
+
const paddingVertical = Math.max(4, (theme.composer.minHeight - TEXT_INPUT_METRICS.lineHeight) / 2);
|
|
52
|
+
return StyleSheet.create({
|
|
53
|
+
// Transparent slot: the rounded pill is provided by the InputToolbar field
|
|
54
|
+
// group so the inset emoji/attachment buttons share the pill surface.
|
|
55
|
+
field: {
|
|
56
|
+
flex: 1,
|
|
57
|
+
justifyContent: 'center',
|
|
58
|
+
minHeight: theme.composer.minHeight,
|
|
59
|
+
},
|
|
60
|
+
textInput: {
|
|
61
|
+
fontSize: TEXT_INPUT_METRICS.fontSize,
|
|
62
|
+
lineHeight: TEXT_INPUT_METRICS.lineHeight,
|
|
63
|
+
paddingTop: paddingVertical,
|
|
64
|
+
paddingBottom: paddingVertical,
|
|
65
|
+
paddingHorizontal: 0,
|
|
66
|
+
color: theme.colors.inputText,
|
|
67
|
+
},
|
|
68
|
+
});
|
|
69
|
+
};
|
|
57
70
|
const stylesWeb = StyleSheet.create({
|
|
58
71
|
textInput: {
|
|
59
72
|
/* @ts-expect-error - web-specific styles */
|
package/lib/Composer.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Composer.js","sourceRoot":"","sources":["../src/Composer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,
|
|
1
|
+
{"version":3,"file":"Composer.js","sourceRoot":"","sources":["../src/Composer.tsx"],"names":[],"mappings":"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"}
|
package/lib/Day/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Day/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Day/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkB,MAAM,OAAO,CAAA;AAatC,OAAO,EAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;AAElC,cAAc,SAAS,CAAA;AAKvB,wBAAgB,GAAG,CAAE,EACnB,UAAwB,EACxB,kBAAkB,EAClB,SAAS,EACT,cAAc,EACd,YAAY,EACZ,SAAS,GACV,EAAE,QAAQ,4BAoCV"}
|
package/lib/Day/index.js
CHANGED
|
@@ -5,13 +5,17 @@ import calendar from 'dayjs/plugin/calendar';
|
|
|
5
5
|
import relativeTime from 'dayjs/plugin/relativeTime';
|
|
6
6
|
import { useChatContext } from '../ChatContext';
|
|
7
7
|
import { DATE_FORMAT } from '../Constant';
|
|
8
|
+
import { useLabels } from '../hooks/useLabels';
|
|
9
|
+
import { useThemedStyles } from '../hooks/useTheme';
|
|
8
10
|
import stylesCommon from '../styles';
|
|
9
|
-
import
|
|
11
|
+
import { createDayStyles } from './styles';
|
|
10
12
|
export * from './types';
|
|
11
13
|
dayjs.extend(relativeTime);
|
|
12
14
|
dayjs.extend(calendar);
|
|
13
15
|
export function Day({ dateFormat = DATE_FORMAT, dateFormatCalendar, createdAt, containerStyle, wrapperStyle, textProps, }) {
|
|
14
16
|
const { getLocale } = useChatContext();
|
|
17
|
+
const labels = useLabels();
|
|
18
|
+
const styles = useThemedStyles(createDayStyles);
|
|
15
19
|
const dateStr = useMemo(() => {
|
|
16
20
|
if (createdAt == null)
|
|
17
21
|
return null;
|
|
@@ -21,11 +25,11 @@ export function Day({ dateFormat = DATE_FORMAT, dateFormatCalendar, createdAt, c
|
|
|
21
25
|
return date.format('D MMMM YYYY');
|
|
22
26
|
if (now.diff(date, 'days') < 1)
|
|
23
27
|
return date.calendar(now, {
|
|
24
|
-
sameDay:
|
|
28
|
+
sameDay: `[${labels.today}]`,
|
|
25
29
|
...dateFormatCalendar,
|
|
26
30
|
});
|
|
27
31
|
return date.format(dateFormat);
|
|
28
|
-
}, [createdAt, dateFormat, getLocale, dateFormatCalendar]);
|
|
32
|
+
}, [createdAt, dateFormat, getLocale, dateFormatCalendar, labels.today]);
|
|
29
33
|
if (!dateStr)
|
|
30
34
|
return null;
|
|
31
35
|
return (<View style={[stylesCommon.centerItems, styles.container, containerStyle]}>
|
package/lib/Day/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Day/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,EACL,IAAI,EACJ,IAAI,EAAE,MAAM,cAAc,CAAA;AAC5B,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,QAAQ,MAAM,uBAAuB,CAAA;AAC5C,OAAO,YAAY,MAAM,2BAA2B,CAAA;AACpD,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAC/C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AACzC,OAAO,YAAY,MAAM,WAAW,CAAA;AACpC,OAAO,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/Day/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,EACL,IAAI,EACJ,IAAI,EAAE,MAAM,cAAc,CAAA;AAC5B,OAAO,KAAK,MAAM,OAAO,CAAA;AACzB,OAAO,QAAQ,MAAM,uBAAuB,CAAA;AAC5C,OAAO,YAAY,MAAM,2BAA2B,CAAA;AACpD,OAAO,EAAE,cAAc,EAAE,MAAM,gBAAgB,CAAA;AAC/C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AACzC,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAA;AAC9C,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAA;AACnD,OAAO,YAAY,MAAM,WAAW,CAAA;AACpC,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAG1C,cAAc,SAAS,CAAA;AAEvB,KAAK,CAAC,MAAM,CAAC,YAAY,CAAC,CAAA;AAC1B,KAAK,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAA;AAEtB,MAAM,UAAU,GAAG,CAAE,EACnB,UAAU,GAAG,WAAW,EACxB,kBAAkB,EAClB,SAAS,EACT,cAAc,EACd,YAAY,EACZ,SAAS,GACA;IACT,MAAM,EAAE,SAAS,EAAE,GAAG,cAAc,EAAE,CAAA;IACtC,MAAM,MAAM,GAAG,SAAS,EAAE,CAAA;IAC1B,MAAM,MAAM,GAAG,eAAe,CAAC,eAAe,CAAC,CAAA;IAE/C,MAAM,OAAO,GAAG,OAAO,CAAC,GAAG,EAAE;QAC3B,IAAI,SAAS,IAAI,IAAI;YACnB,OAAO,IAAI,CAAA;QAEb,MAAM,GAAG,GAAG,KAAK,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,CAAA;QAClC,MAAM,IAAI,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,MAAM,CAAC,SAAS,EAAE,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,CAAA;QAEhE,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,IAAI,EAAE,MAAM,CAAC;YAC3B,OAAO,IAAI,CAAC,MAAM,CAAC,aAAa,CAAC,CAAA;QAEnC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,EAAE,MAAM,CAAC,GAAG,CAAC;YAC5B,OAAO,IAAI,CAAC,QAAQ,CAAC,GAAG,EAAE;gBACxB,OAAO,EAAE,IAAI,MAAM,CAAC,KAAK,GAAG;gBAC5B,GAAG,kBAAkB;aACtB,CAAC,CAAA;QAEJ,OAAO,IAAI,CAAC,MAAM,CAAC,UAAU,CAAC,CAAA;IAChC,CAAC,EAAE,CAAC,SAAS,EAAE,UAAU,EAAE,SAAS,EAAE,kBAAkB,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,CAAA;IAExE,IAAI,CAAC,OAAO;QACV,OAAO,IAAI,CAAA;IAEb,OAAO,CACL,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,WAAW,EAAE,MAAM,CAAC,SAAS,EAAE,cAAc,CAAC,CAAC,CACxE;MAAA,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,EAAE,YAAY,CAAC,CAAC,CAC1C;QAAA,CAAC,IAAI,CAAC,IAAI,SAAS,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC,CAC1D;UAAA,CAAC,OAAO,CACV;QAAA,EAAE,IAAI,CACR;MAAA,EAAE,IAAI,CACR;IAAA,EAAE,IAAI,CAAC,CACR,CAAA;AACH,CAAC"}
|
package/lib/Day/styles.d.ts
CHANGED
|
@@ -1,21 +1,20 @@
|
|
|
1
|
-
|
|
1
|
+
import { ChatTheme } from '../Theme';
|
|
2
|
+
export declare const createDayStyles: (theme: ChatTheme) => {
|
|
2
3
|
container: {
|
|
3
4
|
marginTop: number;
|
|
4
5
|
marginBottom: number;
|
|
5
6
|
};
|
|
6
7
|
wrapper: {
|
|
7
8
|
backgroundColor: string;
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
paddingLeft: number;
|
|
11
|
-
paddingRight: number;
|
|
9
|
+
paddingVertical: number;
|
|
10
|
+
paddingHorizontal: number;
|
|
12
11
|
borderRadius: number;
|
|
13
12
|
};
|
|
14
13
|
text: {
|
|
15
14
|
color: string;
|
|
16
15
|
fontSize: number;
|
|
17
|
-
fontWeight: "600";
|
|
16
|
+
fontWeight: "normal" | "bold" | "100" | "200" | "300" | "400" | "500" | "600" | "700" | "800" | "900" | undefined;
|
|
17
|
+
letterSpacing: number;
|
|
18
18
|
};
|
|
19
19
|
};
|
|
20
|
-
export default _default;
|
|
21
20
|
//# sourceMappingURL=styles.d.ts.map
|
package/lib/Day/styles.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/Day/styles.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/Day/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAE,MAAM,UAAU,CAAA;AAEpC,eAAO,MAAM,eAAe,GAAI,OAAO,SAAS;;;;;;;;;;;;;;;;;CAkB5C,CAAA"}
|