@ethora/chat-component 24.10.19 → 24.10.21

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 CHANGED
@@ -76,9 +76,18 @@ with:
76
76
  ```
77
77
  <Chat
78
78
  config={{
79
- disableHeader: true,
80
- disableMedia: true,
81
- colors: { primary: "#4287f5", secondary: "#42f5e9" },
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
- room={{
90
- jid: 'string@conference.xmpp.ethoradev.com',
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
  ```
@@ -1,20 +1,21 @@
1
1
  import { default as React } from 'react';
2
+ import { MessageProps } from '../../types/types';
2
3
 
3
- export declare const CustomMessageContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
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 CustomMessageBubble: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
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 CustomMessageText: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
10
- export declare const CustomUserName: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
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 CustomMessageTimestamp: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
15
- export declare const CustomMessagePhoto: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, never>> & string;
16
- export declare const CustomMessagePhotoContainer: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
17
- export declare const CustomSystemMessage: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
18
- export declare const CustomSystemMessageText: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components').FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
19
- declare const CustomMessage: () => import("react/jsx-runtime").JSX.Element;
20
- export default CustomMessage;
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?: any;
12
- CustomMessageComponent?: any;
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, IRoom } from '../../types/types';
2
+ import { IConfig, MessageProps } from '../../types/types';
3
3
 
4
4
  interface LoginWrapperProps {
5
- token?: string;
6
- room?: IRoom;
7
- loginData?: {
5
+ user?: {
8
6
  email: string;
9
7
  password: string;
10
8
  };
11
- MainComponentStyles?: any;
12
- CustomMessageComponent?: any;
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, User } from '../../types/types';
2
+ import { ConfigUser, IConfig, MessageProps } from '../../types/types';
3
3
 
4
4
  interface ChatWrapperProps {
5
5
  token?: string;
6
6
  roomJID?: string;
7
- user?: User;
7
+ user?: ConfigUser;
8
8
  loginData?: {
9
9
  email: string;
10
10
  password: string;
11
11
  };
12
- MainComponentStyles?: any;
13
- CustomMessageComponent?: any;
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 { IMessage } from '../types/types';
2
+ import { MessageProps } from '../types/types';
3
3
 
4
- interface CustomMessageProps {
5
- message: IMessage;
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 };
@@ -4,6 +4,7 @@ interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
4
4
  text?: string | ReactElement;
5
5
  EndIcon?: ReactElement;
6
6
  loading?: boolean;
7
+ unstyled?: boolean;
7
8
  }
8
9
  declare const Button: React.FC<ButtonProps>;
9
10
  export default Button;