beem-component 1.7.6 → 1.7.7

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 (6) hide show
  1. package/dist/components/ChatComponents/ChatBody/chatBody.js +7 -7
  2. package/dist/components/ChatComponents/ChatBody/chatBody.stories.js +3 -0
  3. package/package.json +94 -94
  4. package/src/App.js +25 -16
  5. package/src/lib/components/ChatComponents/ChatBody/chatBody.js +11 -10
  6. package/src/lib/components/ChatComponents/ChatBody/chatBody.stories.js +1 -0
package/dist/components/ChatComponents/ChatBody/chatBody.js CHANGED
@@ -264,12 +264,7 @@ BmChat.Details = function (_ref15) {
264
264
  feedPostComments = _ref15.feedPostComments,
265
265
  rest = _objectWithoutProperties(_ref15, _excluded3);
266
266
 
267
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, sessionTimeline && /*#__PURE__*/_react.default.createElement(_sessionTimeline.SessionTimeline, _extends({
268
- message: sessionTimeline.message
269
- }, rest)), sessionDetails && /*#__PURE__*/_react.default.createElement(_sessionDetails.SessionDetails, _extends({
270
- time: sessionDetails.time,
271
- message: sessionDetails.message
272
- }, rest)), /*#__PURE__*/_react.default.createElement(Details, _extends({
267
+ return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(Details, _extends({
273
268
  state: state
274
269
  }, rest), /*#__PURE__*/_react.default.createElement(MessageState, null, state === 'inbound' && session && handleState({
275
270
  state: state,
@@ -302,7 +297,12 @@ BmChat.Details = function (_ref15) {
302
297
  }))), /*#__PURE__*/_react.default.createElement(MessageState, null, state === 'outbound' && session && handleState({
303
298
  state: state,
304
299
  session: session
305
- }))));
300
+ }))), sessionTimeline && /*#__PURE__*/_react.default.createElement(_sessionTimeline.SessionTimeline, _extends({
301
+ message: sessionTimeline.message
302
+ }, rest)), sessionDetails && /*#__PURE__*/_react.default.createElement(_sessionDetails.SessionDetails, _extends({
303
+ time: sessionDetails.time,
304
+ message: sessionDetails.message
305
+ }, rest)));
306
306
  };
307
307
 
308
308
  BmChat.Footer = _styledComponents.default.div(_templateObject11 || (_templateObject11 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n padding: 0.5rem 0.5rem;\n > *:not(:last-child) {\n margin-bottom: 0.5rem;\n }\n"])));
package/dist/components/ChatComponents/ChatBody/chatBody.stories.js CHANGED
@@ -58,6 +58,9 @@ var ChatBody = function ChatBody() {
58
58
  session: "sms",
59
59
  displayTime: /*#__PURE__*/_react.default.createElement("p", null, "12:00pm"),
60
60
  status: "sent",
61
+ sessionTimeline: {
62
+ message: /*#__PURE__*/_react.default.createElement("p", null, "12:00pm")
63
+ },
61
64
  sessionDetails: {
62
65
  message: /*#__PURE__*/_react.default.createElement("h3", null, "Session Message"),
63
66
  time: /*#__PURE__*/_react.default.createElement("p", null, "12:00pm")
package/package.json CHANGED
@@ -1,95 +1,95 @@
1
1
  {
2
- "name": "beem-component",
3
- "version": "1.7.6",
4
- "private": false,
5
- "main": "dist/components/index.js",
6
- "scripts": {
7
- "build": "react-scripts build",
8
- "build-storybook": "build-storybook",
9
- "clean": "rimraf dist",
10
- "compile": "npm run clean && cross-env NODE_ENV=production babel src/lib --out-dir dist --copy-files --ignore __tests__,spec.js,test.js,stories.js,__snapshots__",
11
- "eject": "react-scripts eject",
12
- "start": "PORT=3002 react-scripts start",
13
- "storybook": "start-storybook -p 6006",
14
- "test": "react-scripts test"
15
- },
16
- "browserslist": {
17
- "production": [
18
- ">0.2%",
19
- "not dead",
20
- "not op_mini all"
21
- ],
22
- "development": [
23
- "last 1 chrome version",
24
- "last 1 firefox version",
25
- "last 1 safari version"
26
- ]
27
- },
28
- "eslintConfig": {
29
- "extends": [
30
- "react-app",
31
- "react-app/jest"
32
- ]
33
- },
34
- "dependencies": {
35
- "@emotion/react": "^11.7.1",
36
- "@emotion/styled": "^11.6.0",
37
- "@material-ui/core": "^4.11.4",
38
- "@material-ui/icons": "^4.11.2",
39
- "@mui/icons-material": "^5.2.1",
40
- "@mui/material": "^5.2.3",
41
- "js-file-download": "^0.4.12",
42
- "node-sass": "^6.0.1",
43
- "polished": "^4.1.3",
44
- "prop-types": "^15.8.1",
45
- "react": "^17.0.2",
46
- "react-dom": "^17.0.2",
47
- "react-router-dom": "^5.3.0",
48
- "react-scripts": "^5.0.1",
49
- "save": "^2.4.0",
50
- "styled-components": "^5.3.0",
51
- "web-vitals": "^1.1.2"
52
- },
53
- "devDependencies": {
54
- "@babel/cli": "^7.16.0",
55
- "@babel/core": "^7.17.8",
56
- "@babel/eslint-parser": "^7.18.2",
57
- "@babel/preset-env": "^7.14.8",
58
- "@babel/preset-react": "^7.18.6",
59
- "@commitlint/cli": "^14.1.0",
60
- "@commitlint/config-conventional": "^14.1.0",
61
- "@commitlint/travis-cli": "^14.1.0",
62
- "@storybook/addon-actions": "^6.3.2",
63
- "@storybook/addon-controls": "^6.3.12",
64
- "@storybook/addon-docs": "^6.3.12",
65
- "@storybook/addon-essentials": "^6.3.12",
66
- "@storybook/addon-knobs": "^6.3.1",
67
- "@storybook/addon-links": "^6.3.2",
68
- "@storybook/addons": "^6.4.9",
69
- "@storybook/node-logger": "^6.3.2",
70
- "@storybook/preset-create-react-app": "^3.2.0",
71
- "@storybook/react": "^6.3.2",
72
- "@storybook/theming": "^6.4.9",
73
- "babel-eslint": "^10.1.0",
74
- "babel-loader": "^8.2.3",
75
- "babel-plugin-react-intl": "^5.1.18",
76
- "babel-plugin-styled-components": "^1.13.3",
77
- "babel-preset-react-app": "^10.0.0",
78
- "commitizen": "^4.2.4",
79
- "cross-env": "^7.0.3",
80
- "cz-conventional-changelog": "^3.3.0",
81
- "eslint-config-airbnb": "^18.2.1",
82
- "eslint-config-prettier": "^8.3.0",
83
- "eslint-plugin-import": "^2.25.2",
84
- "eslint-plugin-jest": "^25.2.4",
85
- "eslint-plugin-jsdoc": "^32.2.0",
86
- "eslint-plugin-jsx-a11y": "^6.4.1",
87
- "eslint-plugin-prettier": "^4.2.1",
88
- "eslint-plugin-react": "^7.29.4",
89
- "generate-changelog": "^1.8.0",
90
- "husky": "^7.0.4",
91
- "lint-staged": "^11.2.6",
92
- "prettier": "^2.7.1",
93
- "storybook-addon-jsx": "^7.3.14"
94
- }
95
- }
2
+ "name": "beem-component",
3
+ "version": "1.7.7",
4
+ "private": false,
5
+ "main": "dist/components/index.js",
6
+ "scripts": {
7
+ "build": "react-scripts build",
8
+ "build-storybook": "build-storybook",
9
+ "clean": "rimraf dist",
10
+ "compile": "npm run clean && cross-env NODE_ENV=production babel src/lib --out-dir dist --copy-files --ignore __tests__,spec.js,test.js,stories.js,__snapshots__",
11
+ "eject": "react-scripts eject",
12
+ "start": "PORT=3002 react-scripts start",
13
+ "storybook": "start-storybook -p 6006",
14
+ "test": "react-scripts test"
15
+ },
16
+ "browserslist": {
17
+ "production": [
18
+ ">0.2%",
19
+ "not dead",
20
+ "not op_mini all"
21
+ ],
22
+ "development": [
23
+ "last 1 chrome version",
24
+ "last 1 firefox version",
25
+ "last 1 safari version"
26
+ ]
27
+ },
28
+ "eslintConfig": {
29
+ "extends": [
30
+ "react-app",
31
+ "react-app/jest"
32
+ ]
33
+ },
34
+ "dependencies": {
35
+ "@emotion/react": "^11.7.1",
36
+ "@emotion/styled": "^11.6.0",
37
+ "@material-ui/core": "^4.11.4",
38
+ "@material-ui/icons": "^4.11.2",
39
+ "@mui/icons-material": "^5.2.1",
40
+ "@mui/material": "^5.2.3",
41
+ "js-file-download": "^0.4.12",
42
+ "node-sass": "^6.0.1",
43
+ "polished": "^4.1.3",
44
+ "prop-types": "^15.8.1",
45
+ "react": "^17.0.2",
46
+ "react-dom": "^17.0.2",
47
+ "react-router-dom": "^5.3.0",
48
+ "react-scripts": "^5.0.1",
49
+ "save": "^2.4.0",
50
+ "styled-components": "^5.3.0",
51
+ "web-vitals": "^1.1.2"
52
+ },
53
+ "devDependencies": {
54
+ "@babel/cli": "^7.16.0",
55
+ "@babel/core": "^7.17.8",
56
+ "@babel/eslint-parser": "^7.18.2",
57
+ "@babel/preset-env": "^7.14.8",
58
+ "@babel/preset-react": "^7.18.6",
59
+ "@commitlint/cli": "^14.1.0",
60
+ "@commitlint/config-conventional": "^14.1.0",
61
+ "@commitlint/travis-cli": "^14.1.0",
62
+ "@storybook/addon-actions": "^6.3.2",
63
+ "@storybook/addon-controls": "^6.3.12",
64
+ "@storybook/addon-docs": "^6.3.12",
65
+ "@storybook/addon-essentials": "^6.3.12",
66
+ "@storybook/addon-knobs": "^6.3.1",
67
+ "@storybook/addon-links": "^6.3.2",
68
+ "@storybook/addons": "^6.4.9",
69
+ "@storybook/node-logger": "^6.3.2",
70
+ "@storybook/preset-create-react-app": "^3.2.0",
71
+ "@storybook/react": "^6.3.2",
72
+ "@storybook/theming": "^6.4.9",
73
+ "babel-eslint": "^10.1.0",
74
+ "babel-loader": "^8.2.3",
75
+ "babel-plugin-react-intl": "^5.1.18",
76
+ "babel-plugin-styled-components": "^1.13.3",
77
+ "babel-preset-react-app": "^10.0.0",
78
+ "commitizen": "^4.2.4",
79
+ "cross-env": "^7.0.3",
80
+ "cz-conventional-changelog": "^3.3.0",
81
+ "eslint-config-airbnb": "^18.2.1",
82
+ "eslint-config-prettier": "^8.3.0",
83
+ "eslint-plugin-import": "^2.25.2",
84
+ "eslint-plugin-jest": "^25.2.4",
85
+ "eslint-plugin-jsdoc": "^32.2.0",
86
+ "eslint-plugin-jsx-a11y": "^6.4.1",
87
+ "eslint-plugin-prettier": "^4.2.1",
88
+ "eslint-plugin-react": "^7.29.4",
89
+ "generate-changelog": "^1.8.0",
90
+ "husky": "^7.0.4",
91
+ "lint-staged": "^11.2.6",
92
+ "prettier": "^2.7.1",
93
+ "storybook-addon-jsx": "^7.3.14"
94
+ }
95
+ }
package/src/App.js CHANGED
@@ -1,21 +1,21 @@
1
- import React, { useState } from 'react';
1
+ import React from 'react';
2
2
 
3
3
  import AttachFileIcon from '@mui/icons-material/AttachFile';
4
4
  import EmojiEmotionsIcon from '@mui/icons-material/EmojiEmotions';
5
5
  import SendIcon from '@mui/icons-material/Send';
6
6
  import QuickreplyIcon from '@mui/icons-material/Quickreply';
7
- import { BmCheckboxToggle } from './lib/components';
8
7
  import {
9
8
  BmChat,
10
9
  BmInput,
11
10
  BmIcons,
12
11
  GlobalStyle,
13
12
  BmProfileIcon,
13
+ // BmCheckboxToggle,
14
14
  } from './lib/components';
15
15
 
16
16
  const Chat = () => {
17
- const [test, setTest] = useState(false);
18
- const [test1, setTest1] = useState(false);
17
+ // const [test, setTest] = useState(false);
18
+ // const [test1, setTest1] = useState(false);
19
19
 
20
20
  const image =
21
21
  'https://scontent.fnbo1-1.fna.fbcdn.net/v/t39.30808-6/298879098_10161724947807542_5252175668064009159_n.jpg?stp=dst-jpg_p720x720&_nc_cat=100&ccb=1-7&_nc_sid=9e2e56&_nc_ohc=9uDHII_ETpUAX_KNS3Y&_nc_ht=scontent.fnbo1-1.fna&edm=APCh5TUEAAAA&oh=00_AT8sOJmRGYwgXF48_GPOCWx1soil0yK8V3AiEPkce9WJIw&oe=6304120B';
@@ -26,14 +26,15 @@ const Chat = () => {
26
26
  <BmChat>
27
27
  <BmChat.Body>
28
28
  <BmChat.Details
29
- state="outbound"
29
+ state="inbound"
30
30
  session="sms"
31
31
  displayTime={<p>12:00pm</p>}
32
32
  status="sent"
33
- sessionDetails={{
34
- message: <h3>Session Message</h3>,
35
- time: <p>12:00pm</p>,
36
- }}
33
+ sessionTimeline={{ message: <p>12:00pm</p> }}
34
+ // sessionDetails={{
35
+ // message: <h3>Session Message</h3>,
36
+ // time: <p>12:00pm</p>,
37
+ // }}
37
38
  feedPostComments={{
38
39
  header: <p>Comment Reply</p>,
39
40
  body: {
@@ -41,15 +42,16 @@ const Chat = () => {
41
42
  image,
42
43
  },
43
44
  footer: <p>This is a Footer</p>,
44
- state: 'outbound',
45
+ state: 'inbound',
45
46
  status: 'comment',
46
47
  }}
47
48
  />
48
- <BmChat.Details
49
+ {/* <BmChat.Details
49
50
  state="inbound"
50
51
  session="sms"
51
52
  displayTime={<p>12:00pm</p>}
52
53
  status="sent"
54
+ sessionTimeline={{ message: <p>12:00pm</p> }}
53
55
  sessionDetails={{
54
56
  message: <h3>Session Message</h3>,
55
57
  time: <p>12:00pm</p>,
@@ -70,6 +72,7 @@ const Chat = () => {
70
72
  session="sms"
71
73
  displayTime={<p>12:00pm</p>}
72
74
  status="sent"
75
+ sessionTimeline={{ message: <p>12:00pm</p> }}
73
76
  sessionDetails={{
74
77
  message: <h3>Session Message</h3>,
75
78
  time: <p>12:00pm</p>,
@@ -90,6 +93,7 @@ const Chat = () => {
90
93
  session="sms"
91
94
  displayTime={<p>12:00pm</p>}
92
95
  status="sent"
96
+ sessionTimeline={{ message: <p>12:00pm</p> }}
93
97
  sessionDetails={{
94
98
  message: <h3>Session Message</h3>,
95
99
  time: <p>12:00pm</p>,
@@ -110,6 +114,7 @@ const Chat = () => {
110
114
  session="live"
111
115
  displayTime={<p>12:00pm</p>}
112
116
  status="sent"
117
+ sessionTimeline={{ message: <p>12:00pm</p> }}
113
118
  fileName={<p>chat.png</p>}
114
119
  src={image}
115
120
  sessionDetails={{
@@ -121,6 +126,7 @@ const Chat = () => {
121
126
  state="inbound"
122
127
  session="live"
123
128
  displayTime={<p>10:00am</p>}
129
+ sessionTimeline={{ message: <p>12:00pm</p> }}
124
130
  status="failed"
125
131
  fileName={<p>file.csv</p>}
126
132
  file={image}
@@ -128,6 +134,7 @@ const Chat = () => {
128
134
  <BmChat.Details
129
135
  state="outbound"
130
136
  session="bot"
137
+ sessionTimeline={{ message: <p>12:00pm</p> }}
131
138
  displayTime={<p>12:00pm</p>}
132
139
  status="sent"
133
140
  >
@@ -136,6 +143,7 @@ const Chat = () => {
136
143
  <BmChat.Details
137
144
  state="outbound"
138
145
  session="live"
146
+ sessionTimeline={{ message: <p>12:00pm</p> }}
139
147
  displayTime={<p>12:00pm</p>}
140
148
  status="sent"
141
149
  fileName={<p>chat.png</p>}
@@ -147,12 +155,13 @@ const Chat = () => {
147
155
  displayTime={<p>10:00am</p>}
148
156
  status="failed"
149
157
  fileName={<p>file.csv</p>}
158
+ sessionTimeline={{ message: <p>12:00pm</p> }}
150
159
  file={image}
151
160
  link={image}
152
161
  onDownload={() => {
153
162
  alert('hello');
154
163
  }}
155
- />
164
+ /> */}
156
165
  </BmChat.Body>
157
166
  <BmChat.Footer>
158
167
  <div className="chat-footer">
@@ -165,12 +174,12 @@ const Chat = () => {
165
174
  </BmChat.Footer>
166
175
  </BmChat>
167
176
 
168
- <BmCheckboxToggle
177
+ {/* <BmCheckboxToggle
169
178
  key="test"
170
179
  checked={test}
171
180
  onChange={(check) => {
172
181
  console.log(check);
173
- setTest(check)
182
+ setTest(check);
174
183
  }}
175
184
  />
176
185
 
@@ -179,9 +188,9 @@ const Chat = () => {
179
188
  checked={test1}
180
189
  onChange={(check) => {
181
190
  console.log(check);
182
- setTest(check)
191
+ setTest(check);
183
192
  }}
184
- />
193
+ /> */}
185
194
  </>
186
195
  );
187
196
  };
package/src/lib/components/ChatComponents/ChatBody/chatBody.js CHANGED
@@ -265,16 +265,6 @@ BmChat.Details = ({
265
265
  }) => {
266
266
  return (
267
267
  <>
268
- {sessionTimeline && (
269
- <SessionTimeline message={sessionTimeline.message} {...rest} />
270
- )}
271
- {sessionDetails && (
272
- <SessionDetails
273
- time={sessionDetails.time}
274
- message={sessionDetails.message}
275
- {...rest}
276
- />
277
- )}
278
268
  <Details state={state} {...rest}>
279
269
  {/* Adding for mobile */}
280
270
  <MessageState>
@@ -330,6 +320,17 @@ BmChat.Details = ({
330
320
  {state === 'outbound' && session && handleState({ state, session })}
331
321
  </MessageState>
332
322
  </Details>
323
+
324
+ {sessionTimeline && (
325
+ <SessionTimeline message={sessionTimeline.message} {...rest} />
326
+ )}
327
+ {sessionDetails && (
328
+ <SessionDetails
329
+ time={sessionDetails.time}
330
+ message={sessionDetails.message}
331
+ {...rest}
332
+ />
333
+ )}
333
334
  </>
334
335
  );
335
336
  };
package/src/lib/components/ChatComponents/ChatBody/chatBody.stories.js CHANGED
@@ -43,6 +43,7 @@ export const ChatBody = () => {
43
43
  session="sms"
44
44
  displayTime={<p>12:00pm</p>}
45
45
  status="sent"
46
+ sessionTimeline={{ message: <p>12:00pm</p> }}
46
47
  sessionDetails={{
47
48
  message: <h3>Session Message</h3>,
48
49
  time: <p>12:00pm</p>,