@cypress-design/react-modal 1.0.1 → 2.0.0-next.0
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.
- package/.turbo/turbo-build.log +4 -2
- package/CHANGELOG.md +17 -0
- package/Modal.tsx +1 -1
- package/dist/index.es.mjs +39 -2
- package/dist/index.es.mjs.map +1 -1
- package/dist/index.umd.js +50 -13
- package/dist/index.umd.js.map +1 -1
- package/package.json +4 -4
- package/rollup.config.mjs +1 -1
package/.turbo/turbo-build.log
CHANGED
|
@@ -1,8 +1,10 @@
|
|
|
1
|
+
yarn run v1.22.22
|
|
1
2
|
$ yarn build:module && yarn build:types
|
|
2
3
|
$ rollup -c ./rollup.config.mjs
|
|
3
|
-
(node:
|
|
4
|
+
(node:4747) ExperimentalWarning: Importing JSON modules is an experimental feature and might change at any time
|
|
4
5
|
(Use `node --trace-warnings ...` to show where the warning was created)
|
|
5
6
|
[36m
|
|
6
7
|
[1m./index.ts[22m → [1m./dist/index.umd.js, ./dist/index.es.mjs[22m...[39m
|
|
7
|
-
[32mcreated [1m./dist/index.umd.js, ./dist/index.es.mjs[22m in [
|
|
8
|
+
[32mcreated [1m./dist/index.umd.js, ./dist/index.es.mjs[22m in [1m12.6s[22m[39m
|
|
8
9
|
$ tsc --project ./tsconfig.build.json
|
|
10
|
+
Done in 25.32s.
|
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,22 @@
|
|
|
1
1
|
# @cypress-design/react-modal
|
|
2
2
|
|
|
3
|
+
## 2.0.0-next.0
|
|
4
|
+
|
|
5
|
+
### Major Changes
|
|
6
|
+
|
|
7
|
+
- [#468](https://github.com/cypress-io/cypress-design/pull/468) [`3236662`](https://github.com/cypress-io/cypress-design/commit/3236662fdecd5abbceadce750098a75301d48f88) Thanks [@elevatebart](https://github.com/elevatebart)! - refactor: use tailwind components to manage specificity of styles
|
|
8
|
+
|
|
9
|
+
### Patch Changes
|
|
10
|
+
|
|
11
|
+
- Updated dependencies [[`3236662`](https://github.com/cypress-io/cypress-design/commit/3236662fdecd5abbceadce750098a75301d48f88)]:
|
|
12
|
+
- @cypress-design/react-icon@2.0.0-next.0
|
|
13
|
+
|
|
14
|
+
## 1.0.2
|
|
15
|
+
|
|
16
|
+
### Patch Changes
|
|
17
|
+
|
|
18
|
+
- [#454](https://github.com/cypress-io/cypress-design/pull/454) [`48a3f6c`](https://github.com/cypress-io/cypress-design/commit/48a3f6cc5957844de2a5164137a8cedc31abe673) Thanks [@elevatebart](https://github.com/elevatebart)! - make sure the constant packages roll up in the react components for tailwind class detection
|
|
19
|
+
|
|
3
20
|
## 1.0.1
|
|
4
21
|
|
|
5
22
|
### Patch Changes
|
package/Modal.tsx
CHANGED
package/dist/index.es.mjs
CHANGED
|
@@ -2,7 +2,44 @@ import * as React from 'react';
|
|
|
2
2
|
import { createPortal } from 'react-dom';
|
|
3
3
|
import clsx from 'clsx';
|
|
4
4
|
import { IconActionQuestionMarkCircle, IconActionDelete } from '@cypress-design/react-icon';
|
|
5
|
-
|
|
5
|
+
|
|
6
|
+
const ATTR_DATA_MODAL_SCROLL_TOP = "data-modal-scroll-top";
|
|
7
|
+
const CY_MODAL_CLASS = "cy-modal-overflow-hidden";
|
|
8
|
+
|
|
9
|
+
function disableBodyScroll() {
|
|
10
|
+
document.body.setAttribute(ATTR_DATA_MODAL_SCROLL_TOP, `${window.scrollY}`);
|
|
11
|
+
|
|
12
|
+
if (document.documentElement.clientWidth > window.innerWidth) {
|
|
13
|
+
document.documentElement.classList.add("cy-modal-overflow-scroll-x");
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
if (document.documentElement.clientHeight > window.innerHeight) {
|
|
17
|
+
document.documentElement.classList.add("cy-modal-overflow-scroll-y");
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
document.body.classList.add(CY_MODAL_CLASS);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
function freeBodyScroll() {
|
|
24
|
+
const scrollY = parseInt(document.body.getAttribute(ATTR_DATA_MODAL_SCROLL_TOP) || "0");
|
|
25
|
+
document.body.classList.remove(CY_MODAL_CLASS);
|
|
26
|
+
document.documentElement.classList.remove("cy-modal-overflow-scroll-x");
|
|
27
|
+
document.documentElement.classList.remove("cy-modal-overflow-scroll-y");
|
|
28
|
+
|
|
29
|
+
window.scrollTo({
|
|
30
|
+
top: scrollY
|
|
31
|
+
});
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
const ClassModal = "cyds-modal-modal";
|
|
35
|
+
const ClassModalStandardDimensions = "cyds-modal-modalstandarddimensions";
|
|
36
|
+
const ClassModalFullscreenDimensions = "cyds-modal-modalfullscreendimensions";
|
|
37
|
+
const ClassTitleBox = "cyds-modal-titlebox";
|
|
38
|
+
const ClassTitle = "cyds-modal-title";
|
|
39
|
+
const ClassHelpLinkDash = "cyds-modal-helplinkdash";
|
|
40
|
+
const ClassHelpLink = "cyds-modal-helplink";
|
|
41
|
+
const ClassCloseButton = "cyds-modal-closebutton";
|
|
42
|
+
const ClassContent = "cyds-modal-content";
|
|
6
43
|
|
|
7
44
|
var Modal = function (_a) {
|
|
8
45
|
var _b = _a.show, show = _b === void 0 ? false : _b, title = _a.title, helpLink = _a.helpLink, onClose = _a.onClose, children = _a.children, _c = _a.fullscreen, fullscreen = _c === void 0 ? false : _c;
|
|
@@ -45,7 +82,7 @@ var Modal = function (_a) {
|
|
|
45
82
|
"Need help",
|
|
46
83
|
React.createElement(IconActionQuestionMarkCircle, { className: "ml-[4px]", "stroke-color": "indigo-500", "fill-color": "indigo-100" }))) : null,
|
|
47
84
|
React.createElement("div", { className: "grow" }),
|
|
48
|
-
React.createElement("button", { "aria-label": "Close", className: ClassCloseButton, onClick: function () { return onClose === null || onClose === void 0 ? void 0 : onClose(); } },
|
|
85
|
+
React.createElement("button", { "aria-label": "Close", className: "".concat(ClassCloseButton, " group"), onClick: function () { return onClose === null || onClose === void 0 ? void 0 : onClose(); } },
|
|
49
86
|
React.createElement(IconActionDelete, { className: "children:transition-all", "stroke-color": "gray-400", "hover-stroke-color": "gray-700", interactiveColorsOnGroup: true }))),
|
|
50
87
|
React.createElement("div", { className: ClassContent }, children)), document.body));
|
|
51
88
|
};
|
package/dist/index.es.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.es.mjs","sources":["../Modal.tsx"],"sourcesContent":[null],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.es.mjs","sources":["../../constants/dist/index.es.mjs","../Modal.tsx"],"sourcesContent":["const ATTR_DATA_MODAL_SCROLL_TOP = \"data-modal-scroll-top\";\nconst CY_MODAL_CLASS = \"cy-modal-overflow-hidden\";\n\nfunction disableBodyScroll() {\n document.body.setAttribute(ATTR_DATA_MODAL_SCROLL_TOP, `${window.scrollY}`);\n\n if (document.documentElement.clientWidth > window.innerWidth) {\n document.documentElement.classList.add(\"cy-modal-overflow-scroll-x\");\n }\n\n if (document.documentElement.clientHeight > window.innerHeight) {\n document.documentElement.classList.add(\"cy-modal-overflow-scroll-y\");\n }\n\n document.body.classList.add(CY_MODAL_CLASS);\n}\n\nfunction freeBodyScroll() {\n const scrollY = parseInt(document.body.getAttribute(ATTR_DATA_MODAL_SCROLL_TOP) || \"0\");\n document.body.classList.remove(CY_MODAL_CLASS);\n document.documentElement.classList.remove(\"cy-modal-overflow-scroll-x\");\n document.documentElement.classList.remove(\"cy-modal-overflow-scroll-y\");\n\n window.scrollTo({\n top: scrollY\n });\n}\n\nconst ClassModal = \"cyds-modal-modal\";\nconst ClassModalStandardDimensions = \"cyds-modal-modalstandarddimensions\";\nconst ClassModalFullscreenDimensions = \"cyds-modal-modalfullscreendimensions\";\nconst ClassTitleBox = \"cyds-modal-titlebox\";\nconst ClassTitle = \"cyds-modal-title\";\nconst ClassHelpLinkDash = \"cyds-modal-helplinkdash\";\nconst ClassHelpLink = \"cyds-modal-helplink\";\nconst ClassCloseButton = \"cyds-modal-closebutton\";\nconst ClassContent = \"cyds-modal-content\";\n\nexport { ClassCloseButton, ClassContent, ClassHelpLink, ClassHelpLinkDash, ClassModal, ClassModalFullscreenDimensions, ClassModalStandardDimensions, ClassTitle, ClassTitleBox, disableBodyScroll, freeBodyScroll };\n//# sourceMappingURL=index.es.mjs.map\n",null],"names":[],"mappings":"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"}
|
package/dist/index.umd.js
CHANGED
|
@@ -4,7 +4,6 @@ var React = require('react');
|
|
|
4
4
|
var reactDom = require('react-dom');
|
|
5
5
|
var clsx = require('clsx');
|
|
6
6
|
var reactIcon = require('@cypress-design/react-icon');
|
|
7
|
-
var constantsModal = require('@cypress-design/constants-modal');
|
|
8
7
|
|
|
9
8
|
function _interopNamespaceDefault(e) {
|
|
10
9
|
var n = Object.create(null);
|
|
@@ -25,22 +24,60 @@ function _interopNamespaceDefault(e) {
|
|
|
25
24
|
|
|
26
25
|
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
27
26
|
|
|
27
|
+
const ATTR_DATA_MODAL_SCROLL_TOP = "data-modal-scroll-top";
|
|
28
|
+
const CY_MODAL_CLASS = "cy-modal-overflow-hidden";
|
|
29
|
+
|
|
30
|
+
function disableBodyScroll() {
|
|
31
|
+
document.body.setAttribute(ATTR_DATA_MODAL_SCROLL_TOP, `${window.scrollY}`);
|
|
32
|
+
|
|
33
|
+
if (document.documentElement.clientWidth > window.innerWidth) {
|
|
34
|
+
document.documentElement.classList.add("cy-modal-overflow-scroll-x");
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
if (document.documentElement.clientHeight > window.innerHeight) {
|
|
38
|
+
document.documentElement.classList.add("cy-modal-overflow-scroll-y");
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
document.body.classList.add(CY_MODAL_CLASS);
|
|
42
|
+
}
|
|
43
|
+
|
|
44
|
+
function freeBodyScroll() {
|
|
45
|
+
const scrollY = parseInt(document.body.getAttribute(ATTR_DATA_MODAL_SCROLL_TOP) || "0");
|
|
46
|
+
document.body.classList.remove(CY_MODAL_CLASS);
|
|
47
|
+
document.documentElement.classList.remove("cy-modal-overflow-scroll-x");
|
|
48
|
+
document.documentElement.classList.remove("cy-modal-overflow-scroll-y");
|
|
49
|
+
|
|
50
|
+
window.scrollTo({
|
|
51
|
+
top: scrollY
|
|
52
|
+
});
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
const ClassModal = "cyds-modal-modal";
|
|
56
|
+
const ClassModalStandardDimensions = "cyds-modal-modalstandarddimensions";
|
|
57
|
+
const ClassModalFullscreenDimensions = "cyds-modal-modalfullscreendimensions";
|
|
58
|
+
const ClassTitleBox = "cyds-modal-titlebox";
|
|
59
|
+
const ClassTitle = "cyds-modal-title";
|
|
60
|
+
const ClassHelpLinkDash = "cyds-modal-helplinkdash";
|
|
61
|
+
const ClassHelpLink = "cyds-modal-helplink";
|
|
62
|
+
const ClassCloseButton = "cyds-modal-closebutton";
|
|
63
|
+
const ClassContent = "cyds-modal-content";
|
|
64
|
+
|
|
28
65
|
var Modal = function (_a) {
|
|
29
66
|
var _b = _a.show, show = _b === void 0 ? false : _b, title = _a.title, helpLink = _a.helpLink, onClose = _a.onClose, children = _a.children, _c = _a.fullscreen, fullscreen = _c === void 0 ? false : _c;
|
|
30
67
|
var dialogRef = React__namespace.useRef(null);
|
|
31
68
|
React__namespace.useEffect(function () {
|
|
32
69
|
var _a, _b;
|
|
33
70
|
if (show) {
|
|
34
|
-
|
|
71
|
+
disableBodyScroll();
|
|
35
72
|
(_a = dialogRef.current) === null || _a === void 0 ? void 0 : _a.showModal();
|
|
36
73
|
}
|
|
37
74
|
else {
|
|
38
75
|
(_b = dialogRef.current) === null || _b === void 0 ? void 0 : _b.close();
|
|
39
|
-
|
|
76
|
+
freeBodyScroll();
|
|
40
77
|
}
|
|
41
78
|
}, [show, onClose]);
|
|
42
79
|
React__namespace.useEffect(function () { return function () {
|
|
43
|
-
|
|
80
|
+
freeBodyScroll();
|
|
44
81
|
}; }, []);
|
|
45
82
|
var closeOnClickBackdrop = React__namespace.useCallback(function (event) {
|
|
46
83
|
var _a;
|
|
@@ -56,19 +93,19 @@ var Modal = function (_a) {
|
|
|
56
93
|
}
|
|
57
94
|
}, [onClose]);
|
|
58
95
|
return (show &&
|
|
59
|
-
reactDom.createPortal(React__namespace.createElement("dialog", { ref: dialogRef, className: clsx(show ?
|
|
60
|
-
?
|
|
61
|
-
:
|
|
62
|
-
React__namespace.createElement("div", { className:
|
|
63
|
-
React__namespace.createElement("div", { id: "cy_modal_label", className:
|
|
64
|
-
helpLink ? React__namespace.createElement("div", { className:
|
|
65
|
-
helpLink ? (React__namespace.createElement("a", { href: helpLink, className:
|
|
96
|
+
reactDom.createPortal(React__namespace.createElement("dialog", { ref: dialogRef, className: clsx(show ? ClassModal : null, fullscreen
|
|
97
|
+
? ClassModalFullscreenDimensions
|
|
98
|
+
: ClassModalStandardDimensions), onClick: closeOnClickBackdrop },
|
|
99
|
+
React__namespace.createElement("div", { className: ClassTitleBox },
|
|
100
|
+
React__namespace.createElement("div", { id: "cy_modal_label", className: ClassTitle }, title),
|
|
101
|
+
helpLink ? React__namespace.createElement("div", { className: ClassHelpLinkDash }) : null,
|
|
102
|
+
helpLink ? (React__namespace.createElement("a", { href: helpLink, className: ClassHelpLink },
|
|
66
103
|
"Need help",
|
|
67
104
|
React__namespace.createElement(reactIcon.IconActionQuestionMarkCircle, { className: "ml-[4px]", "stroke-color": "indigo-500", "fill-color": "indigo-100" }))) : null,
|
|
68
105
|
React__namespace.createElement("div", { className: "grow" }),
|
|
69
|
-
React__namespace.createElement("button", { "aria-label": "Close", className:
|
|
106
|
+
React__namespace.createElement("button", { "aria-label": "Close", className: "".concat(ClassCloseButton, " group"), onClick: function () { return onClose === null || onClose === void 0 ? void 0 : onClose(); } },
|
|
70
107
|
React__namespace.createElement(reactIcon.IconActionDelete, { className: "children:transition-all", "stroke-color": "gray-400", "hover-stroke-color": "gray-700", interactiveColorsOnGroup: true }))),
|
|
71
|
-
React__namespace.createElement("div", { className:
|
|
108
|
+
React__namespace.createElement("div", { className: ClassContent }, children)), document.body));
|
|
72
109
|
};
|
|
73
110
|
|
|
74
111
|
module.exports = Modal;
|
package/dist/index.umd.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.umd.js","sources":["../Modal.tsx"],"sourcesContent":[
|
|
1
|
+
{"version":3,"file":"index.umd.js","sources":["../../constants/dist/index.es.mjs","../Modal.tsx"],"sourcesContent":["const ATTR_DATA_MODAL_SCROLL_TOP = \"data-modal-scroll-top\";\nconst CY_MODAL_CLASS = \"cy-modal-overflow-hidden\";\n\nfunction disableBodyScroll() {\n document.body.setAttribute(ATTR_DATA_MODAL_SCROLL_TOP, `${window.scrollY}`);\n\n if (document.documentElement.clientWidth > window.innerWidth) {\n document.documentElement.classList.add(\"cy-modal-overflow-scroll-x\");\n }\n\n if (document.documentElement.clientHeight > window.innerHeight) {\n document.documentElement.classList.add(\"cy-modal-overflow-scroll-y\");\n }\n\n document.body.classList.add(CY_MODAL_CLASS);\n}\n\nfunction freeBodyScroll() {\n const scrollY = parseInt(document.body.getAttribute(ATTR_DATA_MODAL_SCROLL_TOP) || \"0\");\n document.body.classList.remove(CY_MODAL_CLASS);\n document.documentElement.classList.remove(\"cy-modal-overflow-scroll-x\");\n document.documentElement.classList.remove(\"cy-modal-overflow-scroll-y\");\n\n window.scrollTo({\n top: scrollY\n });\n}\n\nconst ClassModal = \"cyds-modal-modal\";\nconst ClassModalStandardDimensions = \"cyds-modal-modalstandarddimensions\";\nconst ClassModalFullscreenDimensions = \"cyds-modal-modalfullscreendimensions\";\nconst ClassTitleBox = \"cyds-modal-titlebox\";\nconst ClassTitle = \"cyds-modal-title\";\nconst ClassHelpLinkDash = \"cyds-modal-helplinkdash\";\nconst ClassHelpLink = \"cyds-modal-helplink\";\nconst ClassCloseButton = \"cyds-modal-closebutton\";\nconst ClassContent = \"cyds-modal-content\";\n\nexport { ClassCloseButton, ClassContent, ClassHelpLink, ClassHelpLinkDash, ClassModal, ClassModalFullscreenDimensions, ClassModalStandardDimensions, ClassTitle, ClassTitleBox, disableBodyScroll, freeBodyScroll };\n//# sourceMappingURL=index.es.mjs.map\n",null],"names":["React","createPortal","IconActionQuestionMarkCircle","IconActionDelete"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@cypress-design/react-modal",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "2.0.0-next.0",
|
|
4
4
|
"files": [
|
|
5
5
|
"*"
|
|
6
6
|
],
|
|
@@ -19,12 +19,12 @@
|
|
|
19
19
|
"build:types": "tsc --project ./tsconfig.build.json"
|
|
20
20
|
},
|
|
21
21
|
"dependencies": {
|
|
22
|
-
"@cypress-design/
|
|
23
|
-
"@cypress-design/react-icon": "^1.1.0",
|
|
22
|
+
"@cypress-design/react-icon": "^2.0.0-next.0",
|
|
24
23
|
"clsx": "^2.1.1"
|
|
25
24
|
},
|
|
26
25
|
"devDependencies": {
|
|
27
|
-
"@cypress-design/
|
|
26
|
+
"@cypress-design/constants-modal": "2.0.0-next.0",
|
|
27
|
+
"@cypress-design/css": "2.0.0-next.0"
|
|
28
28
|
},
|
|
29
29
|
"license": "MIT"
|
|
30
30
|
}
|
package/rollup.config.mjs
CHANGED