beem-component 1.5.5 → 1.5.6

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.
Files changed (10) hide show
  1. package/dist/components/ChatComponents/ChatBody/chatBody.js +1 -1
  2. package/dist/components/ScrollBar/scrollBar.js +44 -0
  3. package/dist/components/globalStyles.js +1 -1
  4. package/package.json +1 -1
  5. package/src/App.js +177 -18
  6. package/src/App1.js +75 -0
  7. package/src/lib/components/ChatComponents/ChatBody/chatBody.js +1 -1
  8. package/src/lib/components/ScrollBar/scrollBar.js +26 -0
  9. package/src/lib/components/globalStyles.js +3 -0
  10. package/src/Chat.js +0 -182
package/dist/components/ChatComponents/ChatBody/chatBody.js CHANGED
@@ -63,7 +63,7 @@ var Details = _styledComponents.default.div(_templateObject3 || (_templateObject
63
63
 
64
64
  var MessageDetails = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n max-width: 70%;\n > * {\n margin-top: 0.5rem;\n margin-bottom: 0.5rem;\n }\n"])));
65
65
 
66
- var Messages = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 0.5rem;\n background: ", ";\n color: ", ";\n border-radius: ", ";\n border: 0.071rem solid ", ";\n word-break: break-all;\n margin: 0rem;\n"])), function (_ref2) {
66
+ var Messages = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: row;\n align-items: center;\n padding: 0.5rem;\n background: ", ";\n color: ", ";\n border-radius: ", ";\n border: 0.071rem solid ", ";\n word-break: keep-all;\n margin: 0rem;\n"])), function (_ref2) {
67
67
  var state = _ref2.state;
68
68
 
69
69
  if (state) {
package/dist/components/ScrollBar/scrollBar.js ADDED
@@ -0,0 +1,44 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = exports.ScrollbarWrapper = exports.Scrollbar = exports.Content = void 0;
7
+
8
+ var _styledComponents = _interopRequireDefault(require("styled-components"));
9
+
10
+ var _templateObject;
11
+
12
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
13
+
14
+ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
15
+
16
+ var ScrollbarWrapper = _styledComponents.default.div(function () {
17
+ return {
18
+ "::-webkit-scrollbar-thumb": {
19
+ background: "blue",
20
+ maxHeight: "10px",
21
+ display: "block",
22
+ width: "10em",
23
+ overflow: "auto",
24
+ height: "2em"
25
+ }
26
+ };
27
+ });
28
+
29
+ exports.ScrollbarWrapper = ScrollbarWrapper;
30
+
31
+ var Scrollbar = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n::-webkit-scrollbar {\n width: 0.714rem !important;\n}\n::-webkit-scrollbar-thumb {\n background-color: #E2E2E2;\n}"])));
32
+
33
+ exports.Scrollbar = Scrollbar;
34
+
35
+ var Content = _styledComponents.default.div(function () {
36
+ return {
37
+ direction: "ltr" // if you want to show the scroll bar on the left
38
+
39
+ };
40
+ });
41
+
42
+ exports.Content = Content;
43
+ var _default = ScrollbarWrapper;
44
+ exports.default = _default;
package/dist/components/globalStyles.js CHANGED
@@ -13,5 +13,5 @@ var _templateObject;
13
13
 
14
14
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
15
15
 
16
- var GlobalStyle = (0, _styledComponents.createGlobalStyle)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n* { font-size: 14px; cursor: pointer}\n h1 { ", " }\n h2 { ", " }\n h3 { ", " }\n h4 { ", " }\n p { ", " }\n input {", "}\n a {", "}\n"])), _text.h1, _text.h2, _text.h3, _text.h4, _text.p, _text.input, _text.a);
16
+ var GlobalStyle = (0, _styledComponents.createGlobalStyle)(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n* { font-size: 14px; cursor: pointer}\n h1 { ", " }\n h2 { ", " }\n h3 { ", " }\n h4 { ", " }\n p { ", " }\n input {", "}\n a {", "}\n ::-webkit-scrollbar-thumb: {\n background:red;\n maxHeight: '10px'}\n"])), _text.h1, _text.h2, _text.h3, _text.h4, _text.p, _text.input, _text.a);
17
17
  exports.GlobalStyle = GlobalStyle;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "beem-component",
3
- "version": "1.5.5",
3
+ "version": "1.5.6",
4
4
  "private": false,
5
5
  "main": "dist/components/index.js",
6
6
  "scripts": {
package/src/App.js CHANGED
@@ -1,23 +1,182 @@
1
- import React, { useState } from "react";
2
- import { GlobalStyle, BmRowLabel, BmListBox, BmButton } from "./lib/components";
3
- import "./list.scss";
1
+ import React from "react";
2
+ import { AttachFile } from "@material-ui/icons";
3
+ import EmojiEmotionsIcon from "@material-ui/icons/EmojiEmotions";
4
+ import QuickreplyIcon from "@mui/icons-material/Quickreply";
5
+ import SendIcon from "@mui/icons-material/Send";
6
+ import { BmChat, BmIcons, BmInput } from "./lib/components";
7
+ import "../src/lib/assets/css/sidebar.scss";
8
+ import image from "../src/lib/assets/chart-img.png";
9
+ import azam from "../src/lib/images/azam1.png";
4
10
 
5
- const App = () => {
6
- const [showList, setShowList] = useState(false);
11
+ const Chat = () => {
7
12
  return (
8
- <>
9
- <GlobalStyle />
10
- <BmListBox className="listbox" setShowList={setShowList}>
11
- <BmRowLabel size="large">
12
- <h4>Row Label</h4>
13
- </BmRowLabel>
14
- <BmRowLabel size="large">
15
- <h4>Row Label</h4>
16
- </BmRowLabel>
17
- </BmListBox>
18
- <BmButton onClick={() => setShowList(!showList)}>Click Me!</BmButton>
19
- </>
13
+ <BmChat>
14
+ <BmChat.Body>
15
+ <BmChat.Details
16
+ state="inbound"
17
+ session="bot"
18
+ displayTime={<p>12:00pm</p>}
19
+ status="sent"
20
+ src={image}
21
+ fileName={<p>attachment.jpg</p>}
22
+ />
23
+ <BmChat.Details
24
+ state="outbound"
25
+ session="bot"
26
+ displayTime={<p>12:00pm</p>}
27
+ status="sent"
28
+ // src={image}
29
+ // fileName={<p>attachment.jpg</p>}
30
+ >
31
+ <p>Technical No Signal - Ili kupata chaneli au chaneli zifunguke kwa wakati ukilipia kifurushi, hakikisha kwanza kama unapata signal vizuri kutoka kwenye dish kwa kutumia remote control.
32
+ Bonyeza MENU, Bonyeza OK kwenye SEARCH, Bonyeza OK kwenye TP LIST.
33
+ Angalia asilimia ya QUALITY pale chini.
34
+ Angalia Transponder zote, 001, 002, 003 na 004 zinatakiwa ziwe na QUALITY si pungufu ya asilimia 60%.
35
+ Au kama una aina nyingine ya kisimbuzi;
36
+ Bonyeza MENU, Bonyeza OK kwenye SETTINGS, Bonyeza OK kwenye INSTALLATION, Bonyeza OK kwenye AUTOMATIC SEARCH.
37
+ Shuka kwenye frequency na uangalie frequency zote kuanzia 11044, 10981, 11106 na 10971.
38
+ Au
39
+ Bonyeza MENU, Bonyeza OK kwenye SETTINGS, Bonyeza OK kwenye INSTALLATION, kwenye EUTELSAT 7C bonyeza kitufe cha KIJANI.
40
+ Angalia QUALITY kwenye frequency zote kuanzia 11044, 10981, 11106 na 10971.
41
+ Angalia asilimia ya QUALITY pale chini.
42
+ QUALITY inatakiwa isiwe pungufu ya asilimia 60%.
43
+ Je, kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na aliyekufungia dish arekebishe.</p>
44
+ </BmChat.Details>
45
+ <BmChat.Details
46
+ state="inbound"
47
+ session="bot"
48
+ displayTime={<p>12:00pm</p>}
49
+ status="sent"
50
+ // src={image}
51
+ // fileName={<p>attachment.jpg</p>}
52
+ >
53
+ <p>Technical No Signal - Ili kupata chaneli au chaneli zifunguke kwa wakati ukilipia kifurushi, hakikisha kwanza kama unapata signal vizuri kutoka kwenye dish kwa kutumia remote control.
54
+ Bonyeza MENU, Bonyeza OK kwenye SEARCH, Bonyeza OK kwenye TP LIST.
55
+ Angalia asilimia ya QUALITY pale chini.
56
+ Angalia Transponder zote, 001, 002, 003 na 004 zinatakiwa ziwe na QUALITY si pungufu ya asilimia 60%.
57
+ Au kama una aina nyingine ya kisimbuzi;
58
+ Bonyeza MENU, Bonyeza OK kwenye SETTINGS, Bonyeza OK kwenye INSTALLATION, Bonyeza OK kwenye AUTOMATIC SEARCH.
59
+ Shuka kwenye frequency na uangalie frequency zote kuanzia 11044, 10981, 11106 na 10971.
60
+ Au
61
+ Bonyeza MENU, Bonyeza OK kwenye SETTINGS, Bonyeza OK kwenye INSTALLATION, kwenye EUTELSAT 7C bonyeza kitufe cha KIJANI.
62
+ Angalia QUALITY kwenye frequency zote kuanzia 11044, 10981, 11106 na 10971.
63
+ Angalia asilimia ya QUALITY pale chini.
64
+ QUALITY inatakiwa isiwe pungufu ya asilimia 60%.
65
+ Je, kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na aliyekufungia dish arekebishe.</p>
66
+ </BmChat.Details>
67
+ <BmChat.Details
68
+ state="outbound"
69
+ session="live"
70
+ displayTime={<p>10:00am</p>}
71
+ status="failed"
72
+ src={azam}
73
+ file={<p>fildjfdlkfjlkfdjfldjfldsjfldsje.jpg</p>}
74
+ >
75
+ <p>Hekkoi</p>
76
+ </BmChat.Details>
77
+ <BmChat.Details
78
+ state="outbound"
79
+ session="live"
80
+ displayTime={<p>10:00am</p>}
81
+ status="failed"
82
+ >
83
+ <p>Outbound</p>
84
+ </BmChat.Details>
85
+ <BmChat.Details
86
+ state="outbound"
87
+ session="live"
88
+ displayTime={<p>10:00am</p>}
89
+ status="failed"
90
+ >
91
+ <p>Outbound</p>
92
+ </BmChat.Details>
93
+ <BmChat.Details
94
+ state="outbound"
95
+ session="live"
96
+ displayTime={<p>10:00am</p>}
97
+ status="failed"
98
+ >
99
+ <p>Outbound</p>
100
+ </BmChat.Details>{" "}
101
+ <BmChat.Details
102
+ state="outbound"
103
+ session="live"
104
+ displayTime={<p>10:00am</p>}
105
+ status="failed"
106
+ >
107
+ <p>
108
+ Habari! Mimi ni msaidizi wako binafsi Azam TV. Ningependa
109
+ nikusaidie, lakini tafadhali anza kwa kuchagua kati ya haya
110
+ nikuhudumie (Mfano chagua namba 2 kubadili kifurushi au 5 kwa msaada
111
+ zaidi). 1. Angalia Salio 2. Badilisha Kifurishi 3. Tuma Ujumbe
112
+ Kuwasha Kisimbuzi 4. Huduma za mteja mpya 5. Nahitaji msaada (Huduma
113
+ kwa mteja) 6. Change language 0. Au ungependa kutuuliza swali
114
+ lingine?
115
+ </p>
116
+ </BmChat.Details>{" "}
117
+ <BmChat.Details
118
+ state="outbound"
119
+ session="live"
120
+ displayTime={<p>10:00am</p>}
121
+ status="failed"
122
+ >
123
+ <p>Outbound</p>
124
+ </BmChat.Details>{" "}
125
+ <BmChat.Details
126
+ state="outbound"
127
+ session="live"
128
+ displayTime={<p>10:00am</p>}
129
+ status="failed"
130
+ >
131
+ <p>Outbound</p>
132
+ </BmChat.Details>{" "}
133
+ <BmChat.Details
134
+ state="outbound"
135
+ session="live"
136
+ displayTime={<p>10:00am</p>}
137
+ status="failed"
138
+ >
139
+ <p>Outbound</p>
140
+ </BmChat.Details>{" "}
141
+ <BmChat.Details
142
+ state="outbound"
143
+ session="live"
144
+ displayTime={<p>10:00am</p>}
145
+ status="failed"
146
+ >
147
+ <p>Outbound</p>
148
+ </BmChat.Details>{" "}
149
+ <BmChat.Details
150
+ state="outbound"
151
+ session="live"
152
+ displayTime={<p>10:00am</p>}
153
+ status="failed"
154
+ >
155
+ <p>Outbound</p>
156
+ </BmChat.Details>{" "}
157
+ <BmChat.Details
158
+ state="outbound"
159
+ session="live"
160
+ displayTime={<p>10:00am</p>}
161
+ status="failed"
162
+ >
163
+ <p>Outbound</p>
164
+ </BmChat.Details>
165
+ </BmChat.Body>
166
+ <BmChat.Footer style={{ justifyContent: "flex-start" }}>
167
+ <div class="chat-footer">
168
+ <BmIcons icon={<EmojiEmotionsIcon />} size="xlarge" />
169
+ </div>
170
+ <div class="chat-footer">
171
+ <BmIcons icon={<EmojiEmotionsIcon />} size="xlarge" />
172
+ <BmIcons icon={<AttachFile />} size="xlarge" />
173
+ <BmIcons icon={<QuickreplyIcon />} size="xlarge" />
174
+ <BmInput placeholder="Enter Message" style={{ flex: 1 }} />
175
+ <BmIcons icon={<SendIcon />} size="xlarge" />
176
+ </div>
177
+ </BmChat.Footer>
178
+ </BmChat>
20
179
  );
21
180
  };
22
181
 
23
- export default App;
182
+ export default Chat;
package/src/App1.js ADDED
@@ -0,0 +1,75 @@
1
+ import React, { useState } from "react";
2
+ import { GlobalStyle, BmChat } from "./lib/components";
3
+ import "./list.scss";
4
+ import { ScrollbarWrapper } from "./lib/components/ScrollBar/scrollBar";
5
+
6
+ const App = () => {
7
+ return (
8
+ <>
9
+ <GlobalStyle />
10
+ <ScrollbarWrapper>
11
+ <BmChat>
12
+ <BmChat.Body>
13
+ <BmChat.Details
14
+ state="inbound"
15
+ session="bot"
16
+ displayTime={<p>12:00pm</p>}
17
+ status="sent"
18
+ sessionDetails={{
19
+ message: <h3>Session Message</h3>,
20
+ time: <p>12:00pm</p>,
21
+ }}
22
+ >
23
+ <p>Inbound Text Message</p>
24
+ </BmChat.Details>
25
+ <BmChat.Details
26
+ state="inbound"
27
+ session="live"
28
+ displayTime={<p>12:00pm</p>}
29
+ status="sent"
30
+ fileName={<p>chat.png</p>}
31
+ sessionDetails={{
32
+ message: <h3>Session Message</h3>,
33
+ time: <p>12:00pm</p>,
34
+ }}
35
+ />
36
+ <BmChat.Details
37
+ state="inbound"
38
+ session="live"
39
+ displayTime={<p>10:00am</p>}
40
+ status="failed"
41
+ fileName={<p>file.csv</p>}
42
+ />
43
+ <BmChat.Details
44
+ state="outbound"
45
+ session="bot"
46
+ displayTime={<p>12:00pm</p>}
47
+ status="sent"
48
+ >
49
+ <p>Outbound Text Message</p>
50
+ </BmChat.Details>
51
+ <BmChat.Details
52
+ state="outbound"
53
+ session="live"
54
+ displayTime={<p>12:00pm</p>}
55
+ status="sent"
56
+ fileName={<p>chat.png</p>}
57
+ />
58
+ <BmChat.Details
59
+ state="outbound"
60
+ session="live"
61
+ displayTime={<p>10:00am</p>}
62
+ status="failed"
63
+ fileName={<p>file.csv</p>}
64
+ onDownload={() => {
65
+ alert("hello");
66
+ }}
67
+ />
68
+ </BmChat.Body>
69
+ </BmChat>
70
+ </ScrollbarWrapper>
71
+ </>
72
+ );
73
+ };
74
+
75
+ export default App;
package/src/lib/components/ChatComponents/ChatBody/chatBody.js CHANGED
@@ -89,7 +89,7 @@ const Messages = styled.div`
89
89
  return `${BmPrimaryWhite}`;
90
90
  }};
91
91
  border: 0.071rem solid ${BmGrey200};
92
- word-break: break-all;
92
+ word-break: keep-all;
93
93
  margin: 0rem;
94
94
  `;
95
95
 
package/src/lib/components/ScrollBar/scrollBar.js ADDED
@@ -0,0 +1,26 @@
1
+ import styled from "styled-components";
2
+
3
+ export const ScrollbarWrapper = styled.div(() => ({
4
+ "::-webkit-scrollbar-thumb": {
5
+ background: "blue",
6
+ maxHeight: "10px",
7
+ display: "block",
8
+ width: "10em",
9
+ overflow: "auto",
10
+ height: "2em",
11
+ },
12
+ }));
13
+
14
+ export const Scrollbar = styled.div`
15
+ ::-webkit-scrollbar {
16
+ width: 0.714rem !important;
17
+ }
18
+ ::-webkit-scrollbar-thumb {
19
+ background-color: #E2E2E2;
20
+ }`;
21
+
22
+ export const Content = styled.div(() => ({
23
+ direction: "ltr", // if you want to show the scroll bar on the left
24
+ }));
25
+
26
+ export default ScrollbarWrapper;
package/src/lib/components/globalStyles.js CHANGED
@@ -10,4 +10,7 @@ export const GlobalStyle = createGlobalStyle`
10
10
  p { ${p} }
11
11
  input {${input}}
12
12
  a {${a}}
13
+ ::-webkit-scrollbar-thumb: {
14
+ background:red;
15
+ maxHeight: '10px'}
13
16
  `;
package/src/Chat.js DELETED
@@ -1,182 +0,0 @@
1
- import React from "react";
2
- import { AttachFile } from "@material-ui/icons";
3
- import EmojiEmotionsIcon from "@material-ui/icons/EmojiEmotions";
4
- import QuickreplyIcon from "@mui/icons-material/Quickreply";
5
- import SendIcon from "@mui/icons-material/Send";
6
- import { BmChat, BmIcons, BmInput } from "./lib/components";
7
- import "../src/lib/assets/css/sidebar.scss";
8
- import image from "../src/lib/assets/chart-img.png";
9
- import azam from "../src/lib/images/azam1.png";
10
-
11
- const Chat = () => {
12
- return (
13
- <BmChat>
14
- <BmChat.Body>
15
- <BmChat.Details
16
- state="inbound"
17
- session="bot"
18
- displayTime={<p>12:00pm</p>}
19
- status="sent"
20
- src={image}
21
- fileName={<p>attachment.jpg</p>}
22
- />
23
- <BmChat.Details
24
- state="outbound"
25
- session="bot"
26
- displayTime={<p>12:00pm</p>}
27
- status="sent"
28
- // src={image}
29
- // fileName={<p>attachment.jpg</p>}
30
- >
31
- <p>Technical No Signal - Ili kupata chaneli au chaneli zifunguke kwa wakati ukilipia kifurushi, hakikisha kwanza kama unapata signal vizuri kutoka kwenye dish kwa kutumia remote control.
32
- Bonyeza MENU, Bonyeza OK kwenye SEARCH, Bonyeza OK kwenye TP LIST.
33
- Angalia asilimia ya QUALITY pale chini.
34
- Angalia Transponder zote, 001, 002, 003 na 004 zinatakiwa ziwe na QUALITY si pungufu ya asilimia 60%.
35
- Au kama una aina nyingine ya kisimbuzi;
36
- Bonyeza MENU, Bonyeza OK kwenye SETTINGS, Bonyeza OK kwenye INSTALLATION, Bonyeza OK kwenye AUTOMATIC SEARCH.
37
- Shuka kwenye frequency na uangalie frequency zote kuanzia 11044, 10981, 11106 na 10971.
38
- Au
39
- Bonyeza MENU, Bonyeza OK kwenye SETTINGS, Bonyeza OK kwenye INSTALLATION, kwenye EUTELSAT 7C bonyeza kitufe cha KIJANI.
40
- Angalia QUALITY kwenye frequency zote kuanzia 11044, 10981, 11106 na 10971.
41
- Angalia asilimia ya QUALITY pale chini.
42
- QUALITY inatakiwa isiwe pungufu ya asilimia 60%.
43
- Je, kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na aliyekufungia dish arekebishe.</p>
44
- </BmChat.Details>
45
- <BmChat.Details
46
- state="inbound"
47
- session="bot"
48
- displayTime={<p>12:00pm</p>}
49
- status="sent"
50
- // src={image}
51
- // fileName={<p>attachment.jpg</p>}
52
- >
53
- <p>Technical No Signal - Ili kupata chaneli au chaneli zifunguke kwa wakati ukilipia kifurushi, hakikisha kwanza kama unapata signal vizuri kutoka kwenye dish kwa kutumia remote control.
54
- Bonyeza MENU, Bonyeza OK kwenye SEARCH, Bonyeza OK kwenye TP LIST.
55
- Angalia asilimia ya QUALITY pale chini.
56
- Angalia Transponder zote, 001, 002, 003 na 004 zinatakiwa ziwe na QUALITY si pungufu ya asilimia 60%.
57
- Au kama una aina nyingine ya kisimbuzi;
58
- Bonyeza MENU, Bonyeza OK kwenye SETTINGS, Bonyeza OK kwenye INSTALLATION, Bonyeza OK kwenye AUTOMATIC SEARCH.
59
- Shuka kwenye frequency na uangalie frequency zote kuanzia 11044, 10981, 11106 na 10971.
60
- Au
61
- Bonyeza MENU, Bonyeza OK kwenye SETTINGS, Bonyeza OK kwenye INSTALLATION, kwenye EUTELSAT 7C bonyeza kitufe cha KIJANI.
62
- Angalia QUALITY kwenye frequency zote kuanzia 11044, 10981, 11106 na 10971.
63
- Angalia asilimia ya QUALITY pale chini.
64
- QUALITY inatakiwa isiwe pungufu ya asilimia 60%.
65
- Je, kwako inasoma ngapi? Kama ipo chini ya 60%, wasiliana na aliyekufungia dish arekebishe.</p>
66
- </BmChat.Details>
67
- <BmChat.Details
68
- state="outbound"
69
- session="live"
70
- displayTime={<p>10:00am</p>}
71
- status="failed"
72
- src={azam}
73
- file={<p>fildjfdlkfjlkfdjfldjfldsjfldsje.jpg</p>}
74
- >
75
- <p>Hekkoi</p>
76
- </BmChat.Details>
77
- <BmChat.Details
78
- state="outbound"
79
- session="live"
80
- displayTime={<p>10:00am</p>}
81
- status="failed"
82
- >
83
- <p>Outbound</p>
84
- </BmChat.Details>
85
- <BmChat.Details
86
- state="outbound"
87
- session="live"
88
- displayTime={<p>10:00am</p>}
89
- status="failed"
90
- >
91
- <p>Outbound</p>
92
- </BmChat.Details>
93
- <BmChat.Details
94
- state="outbound"
95
- session="live"
96
- displayTime={<p>10:00am</p>}
97
- status="failed"
98
- >
99
- <p>Outbound</p>
100
- </BmChat.Details>{" "}
101
- <BmChat.Details
102
- state="outbound"
103
- session="live"
104
- displayTime={<p>10:00am</p>}
105
- status="failed"
106
- >
107
- <p>
108
- Habari! Mimi ni msaidizi wako binafsi Azam TV. Ningependa
109
- nikusaidie, lakini tafadhali anza kwa kuchagua kati ya haya
110
- nikuhudumie (Mfano chagua namba 2 kubadili kifurushi au 5 kwa msaada
111
- zaidi). 1. Angalia Salio 2. Badilisha Kifurishi 3. Tuma Ujumbe
112
- Kuwasha Kisimbuzi 4. Huduma za mteja mpya 5. Nahitaji msaada (Huduma
113
- kwa mteja) 6. Change language 0. Au ungependa kutuuliza swali
114
- lingine?
115
- </p>
116
- </BmChat.Details>{" "}
117
- <BmChat.Details
118
- state="outbound"
119
- session="live"
120
- displayTime={<p>10:00am</p>}
121
- status="failed"
122
- >
123
- <p>Outbound</p>
124
- </BmChat.Details>{" "}
125
- <BmChat.Details
126
- state="outbound"
127
- session="live"
128
- displayTime={<p>10:00am</p>}
129
- status="failed"
130
- >
131
- <p>Outbound</p>
132
- </BmChat.Details>{" "}
133
- <BmChat.Details
134
- state="outbound"
135
- session="live"
136
- displayTime={<p>10:00am</p>}
137
- status="failed"
138
- >
139
- <p>Outbound</p>
140
- </BmChat.Details>{" "}
141
- <BmChat.Details
142
- state="outbound"
143
- session="live"
144
- displayTime={<p>10:00am</p>}
145
- status="failed"
146
- >
147
- <p>Outbound</p>
148
- </BmChat.Details>{" "}
149
- <BmChat.Details
150
- state="outbound"
151
- session="live"
152
- displayTime={<p>10:00am</p>}
153
- status="failed"
154
- >
155
- <p>Outbound</p>
156
- </BmChat.Details>{" "}
157
- <BmChat.Details
158
- state="outbound"
159
- session="live"
160
- displayTime={<p>10:00am</p>}
161
- status="failed"
162
- >
163
- <p>Outbound</p>
164
- </BmChat.Details>
165
- </BmChat.Body>
166
- <BmChat.Footer style={{ justifyContent: "flex-start" }}>
167
- <div class="chat-footer">
168
- <BmIcons icon={<EmojiEmotionsIcon />} size="xlarge" />
169
- </div>
170
- <div class="chat-footer">
171
- <BmIcons icon={<EmojiEmotionsIcon />} size="xlarge" />
172
- <BmIcons icon={<AttachFile />} size="xlarge" />
173
- <BmIcons icon={<QuickreplyIcon />} size="xlarge" />
174
- <BmInput placeholder="Enter Message" style={{ flex: 1 }} />
175
- <BmIcons icon={<SendIcon />} size="xlarge" />
176
- </div>
177
- </BmChat.Footer>
178
- </BmChat>
179
- );
180
- };
181
-
182
- export default Chat;