@via-profit/ui-kit 0.1.0-rc.91 → 0.1.0-rc.93

package/Modal/BaseModal/ModalInner.js

@@ -21,6 +21,7 @@ const StyledModalInner = styled_1.default.div `
   opacity: 0;
   z-index: ${({ theme }) => theme.zIndex.modal};
   outline: none;
+  pointer-events: all;
   position: relative;
   background-color: ${({ theme }) => theme.color.surface.toString()};
   border-radius: ${({ theme }) => theme.shape.radiusFactor * 2}em;

package/Modal/BaseModal/ModalInnerContainer.js

@@ -28,6 +28,7 @@ const StyledModalInnerContainer = styled_1.default.div `
   align-items: center;
   justify-content: center;
   flex-direction: column;
+  pointer-events: none;
 
   ${({ $isOpen }) => $isOpen &&
     (0, react_2.css) `

package/Modal/BaseModal/RenderModal.js

@@ -1,4 +1,15 @@
 "use strict";
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -9,7 +20,7 @@ const ModalOverlay_1 = __importDefault(require("./ModalOverlay"));
 const ModalInner_1 = __importDefault(require("./ModalInner"));
 const ModalInnerContainer_1 = __importDefault(require("./ModalInnerContainer"));
 const RenderModal = props => {
-    const { children, overrides } = props;
+    const { children, overrides } = props, restProps = __rest(props, ["children", "overrides"]);
     const { state } = (0, context_1.useContext)();
     const { isOpen, closeOnOverlayClick, onRequestClose } = state;
     const overridesMap = react_1.default.useMemo(() => ({
@@ -18,7 +29,7 @@ const RenderModal = props => {
         InnerContainer: (overrides === null || overrides === void 0 ? void 0 : overrides.InnerContainer) || ModalInnerContainer_1.default,
     }), [overrides]);
     return (react_1.default.createElement(react_1.default.Fragment, null,
-        react_1.default.useMemo(() => (react_1.default.createElement(overridesMap.Overlay, { isOpen: isOpen, onRequestClose: onRequestClose, closeOnOverlayClick: closeOnOverlayClick })), [overridesMap, isOpen, closeOnOverlayClick, onRequestClose]),
+        react_1.default.useMemo(() => (react_1.default.createElement(overridesMap.Overlay, Object.assign({}, restProps, { isOpen: isOpen, closeOnOverlayClick: closeOnOverlayClick, onRequestClose: onRequestClose }))), [overridesMap, isOpen, closeOnOverlayClick, onRequestClose, restProps]),
         react_1.default.useMemo(() => (react_1.default.createElement(overridesMap.InnerContainer, { isOpen: isOpen, onRequestClose: onRequestClose },
             react_1.default.createElement(overridesMap.Inner, { isOpen: isOpen, onRequestClose: onRequestClose }, children))), [children, isOpen, overridesMap, onRequestClose])));
 };

package/Modal/Drawer/DrawerInner.js

@@ -17,8 +17,10 @@ Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const styled_1 = __importDefault(require("@emotion/styled"));
 const react_2 = require("@emotion/react");
-const StyledDrawerBottomInner = styled_1.default.div `
+const ModalInner_1 = __importDefault(require("../BaseModal/ModalInner"));
+const StyledDrawerBottomInner = (0, styled_1.default)(ModalInner_1.default) `
   position: fixed;
+  margin: 0;
   left: 0;
   right: 0;
   bottom: -100%;
@@ -33,7 +35,7 @@ const StyledDrawerBottomInner = styled_1.default.div `
   transition:
     opacity 120ms ease-out,
     bottom 600ms ease-out;
-  ${({ $isOpen }) => $isOpen &&
+  ${({ isOpen }) => isOpen &&
     (0, react_2.css) `
       opacity: 1;
       bottom: 0;
@@ -42,8 +44,9 @@ const StyledDrawerBottomInner = styled_1.default.div `
         bottom 240ms ease-out;
     `}
 `;
-const StyledDrawerTopInner = styled_1.default.div `
+const StyledDrawerTopInner = (0, styled_1.default)(ModalInner_1.default) `
   position: fixed;
+  margin: 0;
   left: 0;
   right: 0;
   top: -100%;
@@ -58,7 +61,7 @@ const StyledDrawerTopInner = styled_1.default.div `
   transition:
     top 600ms ease-out,
     opacity 120ms ease-out;
-  ${({ $isOpen }) => $isOpen &&
+  ${({ isOpen }) => isOpen &&
     (0, react_2.css) `
       opacity: 1;
       top: 0;
@@ -67,8 +70,9 @@ const StyledDrawerTopInner = styled_1.default.div `
         opacity 100ms ease-out;
     `}
 `;
-const StyledDrawerRightInner = styled_1.default.div `
+const StyledDrawerRightInner = (0, styled_1.default)(ModalInner_1.default) `
   position: fixed;
+  margin: 0;
   right: -100%;
   top: 0;
   bottom: 0;
@@ -83,7 +87,7 @@ const StyledDrawerRightInner = styled_1.default.div `
   transition:
     right 600ms ease-out,
     opacity 120ms ease-out;
-  ${({ $isOpen }) => $isOpen &&
+  ${({ isOpen }) => isOpen &&
     (0, react_2.css) `
       opacity: 1;
       right: 0;
@@ -92,8 +96,9 @@ const StyledDrawerRightInner = styled_1.default.div `
         opacity 100ms ease-out;
     `}
 `;
-const StyledDrawerLeftInner = styled_1.default.div `
+const StyledDrawerLeftInner = (0, styled_1.default)(ModalInner_1.default) `
   position: fixed;
+  margin: 0;
   left: -100%;
   top: 0;
   bottom: 0;
@@ -108,7 +113,7 @@ const StyledDrawerLeftInner = styled_1.default.div `
   transition:
     left 600ms ease-out,
     opacity 120ms ease-out;
-  ${({ $isOpen }) => $isOpen &&
+  ${({ isOpen }) => isOpen &&
     (0, react_2.css) `
       opacity: 1;
       left: 0;
@@ -132,6 +137,6 @@ const DrawerInner = (props, ref) => {
                 return StyledDrawerBottomInner;
         }
     }, [anchor]);
-    return (react_1.default.createElement(Element, Object.assign({ "$isOpen": isOpen, id: `${dialogID}-description` }, nativeProps, { ref: ref }), children));
+    return (react_1.default.createElement(Element, Object.assign({ isOpen: isOpen, id: `${dialogID}-description`, onRequestClose: onRequestClose }, nativeProps, { ref: ref }), children));
 };
 exports.default = react_1.default.forwardRef(DrawerInner);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@via-profit/ui-kit",
-  "version": "0.1.0-rc.91",
+  "version": "0.1.0-rc.93",
   "description": "UI Kit",
   "repository": {
     "type": "git",