beem-component 1.5.1 → 1.5.2

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 (8) hide show
  1. package/dist/components/ChatComponents/ChatBody/chatBody.stories.js +5 -1
  2. package/dist/components/ChatComponents/ChatBody/sessionDetails.js +1 -1
  3. package/dist/components/Modals/modal.js +5 -6
  4. package/package.json +2 -2
  5. package/src/App.js +2 -7
  6. package/src/lib/components/ChatComponents/ChatBody/chatBody.stories.js +1 -0
  7. package/src/lib/components/ChatComponents/ChatBody/sessionDetails.js +1 -1
  8. package/src/lib/components/Modals/modal.js +4 -4
package/dist/components/ChatComponents/ChatBody/chatBody.stories.js CHANGED
@@ -49,7 +49,11 @@ var ChatBody = function ChatBody() {
49
49
  displayTime: /*#__PURE__*/_react.default.createElement("p", null, "12:00pm"),
50
50
  status: "sent",
51
51
  fileName: /*#__PURE__*/_react.default.createElement("p", null, "chat.png"),
52
- src: _chartImg.default
52
+ src: _chartImg.default,
53
+ sessionDetails: {
54
+ message: /*#__PURE__*/_react.default.createElement("h3", null, "Session Message"),
55
+ time: /*#__PURE__*/_react.default.createElement("p", null, "12:00pm")
56
+ }
53
57
  }), /*#__PURE__*/_react.default.createElement(_chatBody.default.Details, {
54
58
  state: "inbound",
55
59
  session: "live",
package/dist/components/ChatComponents/ChatBody/sessionDetails.js CHANGED
@@ -25,7 +25,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
25
25
 
26
26
  function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
27
27
 
28
- var SessionDetailsWrapper = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n text-align: center;\n border-bottom: 0.071rem solid ", ";\n margin: 0.5rem;\n"])), _colors.BmGrey200);
28
+ var SessionDetailsWrapper = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n align-items: center;\n text-align: center;\n border-bottom: 0.071rem solid ", ";\n margin: 1rem 0.5rem;\n"])), _colors.BmGrey200);
29
29
 
30
30
  var SessionDetails = function SessionDetails(_ref) {
31
31
  var message = _ref.message,
package/dist/components/Modals/modal.js CHANGED
@@ -58,11 +58,11 @@ var Overlay = _styledComponents.default.div(_templateObject || (_templateObject
58
58
 
59
59
  exports.Overlay = Overlay;
60
60
 
61
- var ModalContent = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n border-radius: 0.25rem;\n padding: 1rem;\n margin: auto;\n background: ", ";\n width: auto;\n max-width: 100%;\n\n > *:not(:last-child) {\n margin-bottom: 1rem;\n }\n @media (min-width: 576px) {\n max-width: 500px;\n width: 500px;\n }\n"])), _colors.BmPrimaryWhite);
61
+ var ModalContent = _styledComponents.default.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n border-radius: 0.25rem;\n padding: 1rem;\n margin: 2rem auto;\n background: ", ";\n width: auto;\n max-width: 100%;\n\n > *:not(:last-child) {\n margin-bottom: 1rem;\n }\n @media (min-width: 576px) {\n max-width: 500px;\n width: 500px;\n }\n"])), _colors.BmPrimaryWhite);
62
62
 
63
63
  exports.ModalContent = ModalContent;
64
64
 
65
- var ModalWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n position: fixed;\n top: 0;\n left: 0;\n z-index: 9999;\n display: block;\n width: 100%;\n height: 100%;\n overflow: hidden;\n outline: 0;\n margin: 2rem auto;\n overflow-x: hidden;\n overflow-y: auto;\n"])));
65
+ var ModalWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n position: fixed;\n top: 0;\n left: 0;\n z-index: 9999;\n display: block;\n width: 100%;\n height: 100%;\n overflow: hidden;\n outline: 0;\n margin: auto;\n overflow-x: hidden;\n overflow-y: auto;\n"])));
66
66
 
67
67
  exports.ModalWrapper = ModalWrapper;
68
68
 
@@ -133,7 +133,7 @@ BmModal.Header = function (_ref2) {
133
133
  });
134
134
  };
135
135
 
136
- BmModal.Body = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n > *:not(:last-child) {\n margin-bottom: 0.5rem;\n }\n ", "\n ", "\n"])), ''
136
+ BmModal.Body = _styledComponents.default.div(_templateObject5 || (_templateObject5 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: column;\n justify-content: space-between;\n > *:not(:last-child) {\n margin-bottom: 0.5rem;\n }\n ", "\n"])), ''
137
137
  /* max-height: ${({ size }) => {
138
138
  if (size) {
139
139
  if (size === "small") return "21.429rem";
@@ -143,9 +143,8 @@ if (size === "xlarge") return "81.429rem";
143
143
  return size;
144
144
  }
145
145
  return "35.714rem";
146
- }}; */
147
- , ''
148
- /* overflow: auto; */
146
+ }};
147
+ overflow: auto; */
149
148
  );
150
149
  BmModal.Footer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = _taggedTemplateLiteral(["\n display: flex;\n justify-content: space-between;\n"])));
151
150
  BmModal.propTypes = {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "beem-component",
3
- "version": "1.5.1",
3
+ "version": "1.5.2",
4
4
  "private": false,
5
5
  "main": "dist/components/index.js",
6
6
  "scripts": {
@@ -32,7 +32,7 @@
32
32
  "react": "^17.0.2",
33
33
  "react-dom": "^17.0.2",
34
34
  "react-router-dom": "^5.3.0",
35
- "react-scripts": "^5.0.1",
35
+ "react-scripts": "4.0.3",
36
36
  "save": "^2.4.0",
37
37
  "styled-components": "^5.3.0",
38
38
  "web-vitals": "^1.1.2"
package/src/App.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import React, { useState } from "react";
2
2
  import map from "lodash/map";
3
3
  import { GlobalStyle, BmModal, BmButton } from "./lib/components";
4
- import Select from 'react-select';
4
+ import Select from "react-select";
5
5
 
6
6
  const App = () => {
7
7
  const [showModal, setShowModal] = useState(false);
@@ -33,14 +33,9 @@ const App = () => {
33
33
  </BmModal.Header>
34
34
  <BmModal.Body>
35
35
  <Select
36
- // value={{
37
- // label: VENDOR_ACCOUNT_STATUSES[values.active],
38
- // value: values.active,
39
- // }}
40
36
  options={VENDOR_ACCOUNT_STATUS_OPTIONS}
41
37
  placeholder="Select"
42
- // onChange={(option) => setFieldValue("active", option.value)}
43
- />{" "}
38
+ />
44
39
  </BmModal.Body>
45
40
  <BmModal.Footer>
46
41
  <BmButton size="small">Send</BmButton>
package/src/lib/components/ChatComponents/ChatBody/chatBody.stories.js CHANGED
@@ -34,6 +34,7 @@ export const ChatBody = () => {
34
34
  status='sent'
35
35
  fileName={<p>chat.png</p>}
36
36
  src={image}
37
+ sessionDetails={{ message: <h3>Session Message</h3>, time: <p>12:00pm</p> }}
37
38
  />
38
39
  <BmChat.Details
39
40
  state='inbound'
package/src/lib/components/ChatComponents/ChatBody/sessionDetails.js CHANGED
@@ -9,7 +9,7 @@ const SessionDetailsWrapper = styled.div`
9
9
  align-items: center;
10
10
  text-align: center;
11
11
  border-bottom: 0.071rem solid ${BmGrey200};
12
- margin: 0.5rem;
12
+ margin: 1rem 0.5rem;
13
13
  `;
14
14
 
15
15
  export const SessionDetails = ({ message, time, ...rest }) => {
package/src/lib/components/Modals/modal.js CHANGED
@@ -22,7 +22,7 @@ export const ModalContent = styled.div`
22
22
  flex-direction: column;
23
23
  border-radius: 0.25rem;
24
24
  padding: 1rem;
25
- margin: auto;
25
+ margin: 2rem auto;
26
26
  background: ${BmPrimaryWhite};
27
27
  width: auto;
28
28
  max-width: 100%;
@@ -46,7 +46,7 @@ export const ModalWrapper = styled.div`
46
46
  height: 100%;
47
47
  overflow: hidden;
48
48
  outline: 0;
49
- margin: 2rem auto;
49
+ margin: auto;
50
50
  overflow-x: hidden;
51
51
  overflow-y: auto;
52
52
  `;
@@ -143,8 +143,8 @@ BmModal.Body = styled.div`
143
143
  return size;
144
144
  }
145
145
  return "35.714rem";
146
- }}; */}
147
- ${'' /* overflow: auto; */}
146
+ }};
147
+ overflow: auto; */}
148
148
  `;
149
149
 
150
150
  BmModal.Footer = styled.div`