beem-component 1.2.4 → 1.2.5

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 (4) hide show
  1. package/dist/components/Modals/modal.js +27 -26
  2. package/package.json +1 -1
  3. package/src/App.js +6 -1
  4. package/src/lib/components/Modals/modal.js +12 -8
package/dist/components/Modals/modal.js CHANGED
@@ -54,7 +54,7 @@ var _React$createContext = /*#__PURE__*/_react.default.createContext(),
54
54
  Provider = _React$createContext.Provider,
55
55
  Consumer = _React$createContext.Consumer;
56
56
 
57
- var Overlay = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n \tposition: fixed;\n top: 0;\n left: 0;\n z-index: 9999;\n width: 100%;\n height: 100%;\n background-color: ", ";\n}\n"])), _colors.BmBgGrey45);
57
+ var Overlay = _styledComponents.default.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n \tposition: fixed;\n top: 0;\n left: 0;\n z-index: 9999;\n width: 100vw;\n height: 100vh;\n background-color: ", ";\n}\n"])), _colors.BmBgGrey45);
58
58
 
59
59
  exports.Overlay = Overlay;
60
60
 
@@ -86,25 +86,26 @@ var ModalContent = _styledComponents.default.div(_templateObject2 || (_templateO
86
86
 
87
87
  exports.ModalContent = ModalContent;
88
88
 
89
- var ModalWrapper = _styledComponents.default.div(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral(["\n z-index: 9999;\n overflow-x: auto;\n overflow-y: auto;\n outline: 0;\n position: fixed;\n height: auto;\n top: ", ";\n left: 50%;\n transform: translate(-50%, -50%);\n"])), function (_ref3) {
90
- var centered = _ref3.centered;
91
-
92
- if (centered) {
93
- return "50%";
94
- }
95
-
96
- return "15%";
97
- });
89
+ 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 ", "\n"])), ''
90
+ /* top: ${({ centered }) => {
91
+ if (centered) {
92
+ return "50%";
93
+ }
94
+ return "15%";
95
+ }};
96
+ left: 50%;
97
+ transform: translate(-50%, -50%); */
98
+ );
98
99
 
99
100
  exports.ModalWrapper = ModalWrapper;
100
101
 
101
- var BmModal = function BmModal(_ref4) {
102
- var children = _ref4.children,
103
- show = _ref4.show,
104
- size = _ref4.size,
105
- onHide = _ref4.onHide,
106
- centered = _ref4.centered,
107
- rest = _objectWithoutProperties(_ref4, _excluded);
102
+ var BmModal = function BmModal(_ref3) {
103
+ var children = _ref3.children,
104
+ show = _ref3.show,
105
+ size = _ref3.size,
106
+ onHide = _ref3.onHide,
107
+ centered = _ref3.centered,
108
+ rest = _objectWithoutProperties(_ref3, _excluded);
108
109
 
109
110
  var _useState = (0, _react.useState)(show),
110
111
  _useState2 = _slicedToArray(_useState, 2),
@@ -146,13 +147,13 @@ exports.BmModal = BmModal;
146
147
 
147
148
  var ModalHeader = _styledComponents.default.div(_templateObject4 || (_templateObject4 = _taggedTemplateLiteral(["\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n"])));
148
149
 
149
- BmModal.Header = function (_ref5) {
150
- var children = _ref5.children,
151
- size = _ref5.size,
152
- onHide = _ref5.onHide,
153
- closeButton = _ref5.closeButton,
154
- show = _ref5.show,
155
- rest = _objectWithoutProperties(_ref5, _excluded2);
150
+ BmModal.Header = function (_ref4) {
151
+ var children = _ref4.children,
152
+ size = _ref4.size,
153
+ onHide = _ref4.onHide,
154
+ closeButton = _ref4.closeButton,
155
+ show = _ref4.show,
156
+ rest = _objectWithoutProperties(_ref4, _excluded2);
156
157
 
157
158
  return /*#__PURE__*/_react.default.createElement(Consumer, null, function (value) {
158
159
  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(ModalHeader, rest, children, closeButton && /*#__PURE__*/_react.default.createElement(_iconStyles.BmIcons, _extends({
@@ -165,8 +166,8 @@ BmModal.Header = function (_ref5) {
165
166
  });
166
167
  };
167
168
 
168
- 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 max-height: ", ";\n overflow: auto;\n"])), function (_ref6) {
169
- var size = _ref6.size;
169
+ 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 max-height: ", ";\n overflow: auto;\n"])), function (_ref5) {
170
+ var size = _ref5.size;
170
171
 
171
172
  if (size) {
172
173
  if (size === "small") return "21.429rem";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "beem-component",
3
- "version": "1.2.4",
3
+ "version": "1.2.5",
4
4
  "private": false,
5
5
  "main": "dist/components/index.js",
6
6
  "scripts": {
package/src/App.js CHANGED
@@ -1,6 +1,7 @@
1
1
  import React, { useState } from "react";
2
2
  import "../src/main.scss";
3
3
  import { BmButton, MainWrapper, BmModal } from "./lib/components";
4
+ import AsyncSelect from 'react-select/async';
4
5
  import { GlobalStyle } from "./lib/components/globalStyles";
5
6
  import "./lib/assets/css/sidebar.scss";
6
7
  import SideBar from "./SideBar";
@@ -25,7 +26,11 @@ export const App = () => {
25
26
  <h2>Header</h2>
26
27
  </BmModal.Header>
27
28
  <BmModal.Body>
28
- <p>This is a bodymdlkdmvlfdmvlkmvlkvmflkvmd;lkvmv;lkdmv;lmv;lfvm;lmre;mv;lkremvc;lkremvclfdmvlkfdmv;lkfdmv;lkfdmv;lfdmv;lfdmv;lfdmv;lfdmvlfd;mvlfd;vmfd;lvfdmlv</p>
29
+ <AsyncSelect
30
+ cacheOptions
31
+ defaultOptions
32
+ placeholder="Search for an agent"
33
+ />{" "}
29
34
  </BmModal.Body>
30
35
  <BmModal.Footer>
31
36
  <p>This is a footer</p>
package/src/lib/components/Modals/modal.js CHANGED
@@ -12,8 +12,8 @@ export const Overlay = styled.div`
12
12
  top: 0;
13
13
  left: 0;
14
14
  z-index: 9999;
15
- width: 100%;
16
- height: 100%;
15
+ width: 100vw;
16
+ height: 100vh;
17
17
  background-color: ${BmBgGrey45};
18
18
  }
19
19
  `;
@@ -50,20 +50,24 @@ export const ModalContent = styled.div`
50
50
  `;
51
51
 
52
52
  export const ModalWrapper = styled.div`
53
+ position: fixed;
54
+ top: 0;
55
+ left: 0;
53
56
  z-index: 9999;
54
- overflow-x: auto;
55
- overflow-y: auto;
57
+ display: block;
58
+ width: 100%;
59
+ height: 100%;
60
+ overflow: hidden;
56
61
  outline: 0;
57
- position: fixed;
58
- height: auto;
59
- top: ${({ centered }) => {
62
+ margin: 2rem auto;
63
+ ${'' /* top: ${({ centered }) => {
60
64
  if (centered) {
61
65
  return "50%";
62
66
  }
63
67
  return "15%";
64
68
  }};
65
69
  left: 50%;
66
- transform: translate(-50%, -50%);
70
+ transform: translate(-50%, -50%); */}
67
71
  `;
68
72
 
69
73
  export const BmModal = ({