@arconnect/components - npm Package Compare versions

Comparing version 0.1.26 to 0.1.27

dist/commonjs/Modal/index.js

@@ -51,4 +51,4 @@ "use strict";
     exit: "closed"
-})(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: fixed;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 11000;\n  background-color: rgba(0, 0, 0, .7);\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n"], ["\n  position: fixed;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 11000;\n  background-color: rgba(0, 0, 0, .7);\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n"])));
-var ModalCard = (0, styled_components_1.default)(Card_1.Card)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  padding: 0;\n  background-color: rgb(", ");\n  max-width: 47%;\n  min-width: 30%;\n  overflow: hidden;\n\n  @media screen and (max-width: 720px) {\n    max-width: 94vw;\n  }\n"], ["\n  padding: 0;\n  background-color: rgb(", ");\n  max-width: 47%;\n  min-width: 30%;\n  overflow: hidden;\n\n  @media screen and (max-width: 720px) {\n    max-width: 94vw;\n  }\n"])), function (props) { return props.theme.background; });
+})(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: fixed;\n  display: flex;\n  align-items: flex-start;\n  justify-content: center;\n  z-index: 11000;\n  background-color: rgba(0, 0, 0, .7);\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  max-height: 100%;\n  overflow-y: auto;\n  padding: 2rem 0;\n"], ["\n  position: fixed;\n  display: flex;\n  align-items: flex-start;\n  justify-content: center;\n  z-index: 11000;\n  background-color: rgba(0, 0, 0, .7);\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  max-height: 100%;\n  overflow-y: auto;\n  padding: 2rem 0;\n"])));
+var ModalCard = (0, styled_components_1.default)(Card_1.Card)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  padding: 0;\n  background-color: rgb(", ");\n  max-width: 47%;\n  min-width: 30%;\n  overflow: hidden;\n  margin: auto;\n\n  @media screen and (max-width: 720px) {\n    max-width: 94vw;\n  }\n"], ["\n  padding: 0;\n  background-color: rgb(", ");\n  max-width: 47%;\n  min-width: 30%;\n  overflow: hidden;\n  margin: auto;\n\n  @media screen and (max-width: 720px) {\n    max-width: 94vw;\n  }\n"])), function (props) { return props.theme.background; });
 var ModalContent = styled_components_1.default.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  padding: 1rem;\n"], ["\n  padding: 1rem;\n"])));
@@ -55,0 +55,0 @@ var ModalActions = styled_components_1.default.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: stretch;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: stretch;\n"])));

dist/commonjs/Modal/Modal.stories.js

@@ -16,2 +16,3 @@ "use strict";
 var jsx_runtime_1 = require("react/jsx-runtime");
+var Spacer_1 = require("../Spacer");
 var Button_1 = require("../Button");
@@ -24,3 +25,3 @@ var hooks_1 = require("../hooks");
 };
-var Basic = function (args) { return ((0, jsx_runtime_1.jsx)(index_1.Modal, __assign({}, args, { open: true, setOpen: function () { }, actions: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(index_1.ModalButton, { children: "Ok" }), (0, jsx_runtime_1.jsx)(index_1.ModalButton, { children: "Cancel" })] }) }, { children: (0, jsx_runtime_1.jsx)("p", { children: "This is a test" }) }))); };
+var Basic = function (args) { return ((0, jsx_runtime_1.jsxs)(index_1.Modal, __assign({}, args, { open: true, setOpen: function () { }, actions: (0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(index_1.ModalButton, { children: "Ok" }), (0, jsx_runtime_1.jsx)(index_1.ModalButton, { children: "Cancel" })] }) }, { children: [(0, jsx_runtime_1.jsx)("p", { children: "This is a test" }), (0, jsx_runtime_1.jsx)(Spacer_1.Spacer, { y: 200 })] }))); };
 exports.Basic = Basic;
@@ -27,0 +28,0 @@ var Demo = function () {

dist/module/Modal/index.js

@@ -44,4 +44,4 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
     exit: "closed"
-})(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: fixed;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 11000;\n  background-color: rgba(0, 0, 0, .7);\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n"], ["\n  position: fixed;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 11000;\n  background-color: rgba(0, 0, 0, .7);\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n"])));
-var ModalCard = styled(Card)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  padding: 0;\n  background-color: rgb(", ");\n  max-width: 47%;\n  min-width: 30%;\n  overflow: hidden;\n\n  @media screen and (max-width: 720px) {\n    max-width: 94vw;\n  }\n"], ["\n  padding: 0;\n  background-color: rgb(", ");\n  max-width: 47%;\n  min-width: 30%;\n  overflow: hidden;\n\n  @media screen and (max-width: 720px) {\n    max-width: 94vw;\n  }\n"])), function (props) { return props.theme.background; });
+})(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: fixed;\n  display: flex;\n  align-items: flex-start;\n  justify-content: center;\n  z-index: 11000;\n  background-color: rgba(0, 0, 0, .7);\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  max-height: 100%;\n  overflow-y: auto;\n  padding: 2rem 0;\n"], ["\n  position: fixed;\n  display: flex;\n  align-items: flex-start;\n  justify-content: center;\n  z-index: 11000;\n  background-color: rgba(0, 0, 0, .7);\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  max-height: 100%;\n  overflow-y: auto;\n  padding: 2rem 0;\n"])));
+var ModalCard = styled(Card)(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n  padding: 0;\n  background-color: rgb(", ");\n  max-width: 47%;\n  min-width: 30%;\n  overflow: hidden;\n  margin: auto;\n\n  @media screen and (max-width: 720px) {\n    max-width: 94vw;\n  }\n"], ["\n  padding: 0;\n  background-color: rgb(", ");\n  max-width: 47%;\n  min-width: 30%;\n  overflow: hidden;\n  margin: auto;\n\n  @media screen and (max-width: 720px) {\n    max-width: 94vw;\n  }\n"])), function (props) { return props.theme.background; });
 var ModalContent = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  padding: 1rem;\n"], ["\n  padding: 1rem;\n"])));
@@ -48,0 +48,0 @@ var ModalActions = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: stretch;\n"], ["\n  display: flex;\n  align-items: center;\n  justify-content: stretch;\n"])));

dist/module/Modal/Modal.stories.js

@@ -13,2 +13,3 @@ var __assign = (this && this.__assign) || function () {
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Spacer } from "../Spacer";
 import { Button } from "../Button";
@@ -21,3 +22,3 @@ import { useModal } from "../hooks";
 };
-export var Basic = function (args) { return (_jsx(Modal, __assign({}, args, { open: true, setOpen: function () { }, actions: _jsxs(_Fragment, { children: [_jsx(ModalButton, { children: "Ok" }), _jsx(ModalButton, { children: "Cancel" })] }) }, { children: _jsx("p", { children: "This is a test" }) }))); };
+export var Basic = function (args) { return (_jsxs(Modal, __assign({}, args, { open: true, setOpen: function () { }, actions: _jsxs(_Fragment, { children: [_jsx(ModalButton, { children: "Ok" }), _jsx(ModalButton, { children: "Cancel" })] }) }, { children: [_jsx("p", { children: "This is a test" }), _jsx(Spacer, { y: 200 })] }))); };
 export var Demo = function () {
@@ -24,0 +25,0 @@ var modal = useModal();

package.json

 {
   "name": "@arconnect/components",
-  "version": "0.1.26",
+  "version": "0.1.27",
   "private": false,
@@ -5,0 +5,0 @@ "publishConfig": {

No alert changes

Improved metrics

Total package byte prevSize

1080811

increased by0.05%

Lines of code

11816

increased by0.03%

No dependency changes