@ethora/chat-component 24.10.20 → 24.10.22
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 +19 -36
- package/dist/assets/icons.d.ts +4 -0
- package/dist/components/ExampleComponents/CustomMessage.d.ts +12 -11
- package/dist/components/MainComponents/ChatWrapper.d.ts +4 -4
- package/dist/components/MainComponents/LoginWrapper.d.ts +4 -6
- package/dist/components/MainComponents/ReduxWrapper.d.ts +4 -4
- package/dist/components/Message.d.ts +3 -7
- package/dist/components/styled/Button.d.ts +1 -0
- package/dist/main.js +3177 -3056
- package/dist/main.js.map +1 -1
- package/dist/style.css +1 -1
- package/dist/types/types.d.ts +14 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -76,9 +76,18 @@ with:
|
|
|
76
76
|
```
|
|
77
77
|
<Chat
|
|
78
78
|
config={{
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
79
|
+
disableHeader: true,
|
|
80
|
+
disableMedia: true,
|
|
81
|
+
colors: { primary: "#4287f5", secondary: "#42f5e9" },
|
|
82
|
+
defaultLogin=true
|
|
83
|
+
googleLogin: {
|
|
84
|
+
firebaseConfig: config, //Ethora app config
|
|
85
|
+
enabled: true,
|
|
86
|
+
},
|
|
87
|
+
googleLogin: {
|
|
88
|
+
firebaseConfig: config, //Ethora app config
|
|
89
|
+
enabled: true,
|
|
90
|
+
},
|
|
82
91
|
}}
|
|
83
92
|
MainComponentStyles={{
|
|
84
93
|
width: "100%",
|
|
@@ -86,44 +95,18 @@ with:
|
|
|
86
95
|
borderRadius: "16px",
|
|
87
96
|
border: "1px solid #42f5e9",
|
|
88
97
|
}}
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
name: '',
|
|
92
|
-
unreadMessages: 0,
|
|
93
|
-
composing: '',
|
|
94
|
-
toUpdate: false,
|
|
95
|
-
description: '',
|
|
96
|
-
group: 'groups',
|
|
97
|
-
id: '',
|
|
98
|
-
title: '',
|
|
99
|
-
usersCnt: 1,
|
|
100
|
-
}}
|
|
101
|
-
user={{
|
|
102
|
-
_id: '',
|
|
103
|
-
firstName: '',
|
|
104
|
-
lastName: '',
|
|
105
|
-
xmppPassword: '',
|
|
106
|
-
walletAddress: '',
|
|
107
|
-
profileImage: '',
|
|
108
|
-
isProfileOpen: true,
|
|
109
|
-
isAssetsOpen: true,
|
|
110
|
-
referrerId: '',
|
|
111
|
-
isAllowedNewAppCreate: true,
|
|
112
|
-
isAgreeWithTerms: false,
|
|
113
|
-
company: [],
|
|
114
|
-
appId: '',
|
|
115
|
-
homeScreen: '',
|
|
116
|
-
defaultWallet: {
|
|
117
|
-
walletAddress: '',
|
|
118
|
-
},
|
|
119
|
-
email: '',
|
|
120
|
-
username: '',
|
|
121
|
-
}}
|
|
98
|
+
roomJID=""
|
|
99
|
+
user={{ email: "", password: "" }}
|
|
122
100
|
/>
|
|
123
101
|
```
|
|
124
102
|
|
|
125
103
|
ℹ️ Note: Add room and user which are registered at Ethora. After these changes - the pre-written user & room will be changed to yours.
|
|
126
104
|
|
|
105
|
+
ℹ️ Note:
|
|
106
|
+
There is also a prop CustomMessageComponent: React.ComponentType<MessageProps>
|
|
107
|
+
This prop is used to fully change styles of messageBubble.
|
|
108
|
+
You can find an example here: https://github.com/dappros/ethora-chat-component/blob/main/src/components/ExampleComponents/CustomMessage.tsx
|
|
109
|
+
|
|
127
110
|
For styling you can alter **App.css**:
|
|
128
111
|
|
|
129
112
|
```
|
package/dist/assets/icons.d.ts
CHANGED
|
@@ -1,3 +1,7 @@
|
|
|
1
|
+
export declare const AddNewIcon: ({ color, ...props }: {
|
|
2
|
+
[x: string]: any;
|
|
3
|
+
color?: string;
|
|
4
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
1
5
|
export declare const AttachIcon: (props: any) => import("react/jsx-runtime").JSX.Element;
|
|
2
6
|
export declare const CloseIcon: (props: any) => import("react/jsx-runtime").JSX.Element;
|
|
3
7
|
export declare const DownloadIcon: (props: any) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,20 +1,21 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
|
+
import { MessageProps } from '../../types/types';
|
|
2
3
|
|
|
3
|
-
export declare const
|
|
4
|
+
export declare const MessageContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
4
5
|
isUser: boolean;
|
|
5
6
|
}>> & string;
|
|
6
|
-
export declare const
|
|
7
|
+
export declare const MessageBubble: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
7
8
|
isUser: boolean;
|
|
8
9
|
}>> & string;
|
|
9
|
-
export declare const
|
|
10
|
-
export declare const
|
|
10
|
+
export declare const MessageText: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
|
|
11
|
+
export declare const UserName: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
|
|
11
12
|
isUser: boolean;
|
|
12
13
|
color?: string;
|
|
13
14
|
}>> & string;
|
|
14
|
-
export declare const
|
|
15
|
-
export declare const
|
|
16
|
-
export declare const
|
|
17
|
-
export declare const
|
|
18
|
-
export declare const
|
|
19
|
-
declare const
|
|
20
|
-
export default
|
|
15
|
+
export declare const MessageTimestamp: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
|
|
16
|
+
export declare const MessagePhoto: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, never>> & string;
|
|
17
|
+
export declare const MessagePhotoContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
18
|
+
export declare const SystemMessage: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
19
|
+
export declare const SystemMessageText: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
|
|
20
|
+
declare const CustomMessageExample: React.ForwardRefExoticComponent<MessageProps & React.RefAttributes<HTMLDivElement>>;
|
|
21
|
+
export default CustomMessageExample;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { FC } from 'react';
|
|
2
|
-
import { IConfig, IRoom } from '../../types/types';
|
|
1
|
+
import { default as React, FC } from 'react';
|
|
2
|
+
import { IConfig, IRoom, MessageProps } from '../../types/types';
|
|
3
3
|
|
|
4
4
|
interface ChatWrapperProps {
|
|
5
5
|
token?: string;
|
|
@@ -8,8 +8,8 @@ interface ChatWrapperProps {
|
|
|
8
8
|
email: string;
|
|
9
9
|
password: string;
|
|
10
10
|
};
|
|
11
|
-
MainComponentStyles?:
|
|
12
|
-
CustomMessageComponent?:
|
|
11
|
+
MainComponentStyles?: React.CSSProperties;
|
|
12
|
+
CustomMessageComponent?: React.ComponentType<MessageProps>;
|
|
13
13
|
config?: IConfig;
|
|
14
14
|
roomJID?: string;
|
|
15
15
|
}
|
|
@@ -1,15 +1,13 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
|
-
import { IConfig,
|
|
2
|
+
import { IConfig, MessageProps } from '../../types/types';
|
|
3
3
|
|
|
4
4
|
interface LoginWrapperProps {
|
|
5
|
-
|
|
6
|
-
room?: IRoom;
|
|
7
|
-
loginData?: {
|
|
5
|
+
user?: {
|
|
8
6
|
email: string;
|
|
9
7
|
password: string;
|
|
10
8
|
};
|
|
11
|
-
MainComponentStyles?:
|
|
12
|
-
CustomMessageComponent?:
|
|
9
|
+
MainComponentStyles?: React.CSSProperties;
|
|
10
|
+
CustomMessageComponent?: React.ComponentType<MessageProps>;
|
|
13
11
|
config?: IConfig;
|
|
14
12
|
roomJID?: string;
|
|
15
13
|
}
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
|
-
import { IConfig,
|
|
2
|
+
import { ConfigUser, IConfig, MessageProps } from '../../types/types';
|
|
3
3
|
|
|
4
4
|
interface ChatWrapperProps {
|
|
5
5
|
token?: string;
|
|
6
6
|
roomJID?: string;
|
|
7
|
-
user?:
|
|
7
|
+
user?: ConfigUser;
|
|
8
8
|
loginData?: {
|
|
9
9
|
email: string;
|
|
10
10
|
password: string;
|
|
11
11
|
};
|
|
12
|
-
MainComponentStyles?:
|
|
13
|
-
CustomMessageComponent?:
|
|
12
|
+
MainComponentStyles?: React.CSSProperties;
|
|
13
|
+
CustomMessageComponent?: React.ComponentType<MessageProps>;
|
|
14
14
|
config?: IConfig;
|
|
15
15
|
}
|
|
16
16
|
export declare const ReduxWrapper: React.FC<ChatWrapperProps>;
|
|
@@ -1,9 +1,5 @@
|
|
|
1
1
|
import { default as React } from 'react';
|
|
2
|
-
import {
|
|
2
|
+
import { MessageProps } from '../types/types';
|
|
3
3
|
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
isUser: boolean;
|
|
7
|
-
}
|
|
8
|
-
declare const CustomMessage: React.FC<CustomMessageProps>;
|
|
9
|
-
export default CustomMessage;
|
|
4
|
+
declare const Message: React.FC<MessageProps>;
|
|
5
|
+
export { Message };
|