@elliemae/ds-overlay 3.26.1-rc.1 → 3.27.0-next.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.
- package/dist/cjs/index.js +3 -3
- package/dist/cjs/index.js.map +2 -2
- package/dist/esm/index.js +2 -2
- package/dist/esm/index.js.map +1 -1
- package/dist/types/index.d.ts +2 -2
- package/package.json +8 -15
- package/dist/cjs/DSOverlay.js +0 -143
- package/dist/cjs/DSOverlay.js.map +0 -7
- package/dist/esm/DSOverlay.js +0 -113
- package/dist/esm/DSOverlay.js.map +0 -7
- package/dist/types/DSOverlay.d.ts +0 -21
package/dist/cjs/index.js
CHANGED
|
@@ -29,10 +29,10 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
29
29
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
30
30
|
var src_exports = {};
|
|
31
31
|
__export(src_exports, {
|
|
32
|
-
default: () =>
|
|
32
|
+
default: () => import_ds_legacy_overlay.default
|
|
33
33
|
});
|
|
34
34
|
module.exports = __toCommonJS(src_exports);
|
|
35
35
|
var React = __toESM(require("react"));
|
|
36
|
-
__reExport(src_exports, require("
|
|
37
|
-
var
|
|
36
|
+
__reExport(src_exports, require("@elliemae/ds-legacy-overlay"), module.exports);
|
|
37
|
+
var import_ds_legacy_overlay = __toESM(require("@elliemae/ds-legacy-overlay"));
|
|
38
38
|
//# sourceMappingURL=index.js.map
|
package/dist/cjs/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["export * from '
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,wBAAc,
|
|
4
|
+
"sourcesContent": ["export * from '@elliemae/ds-legacy-overlay';\nexport { default } from '@elliemae/ds-legacy-overlay';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,wBAAc,wCAAd;AACA,+BAAwB;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as React from "react";
|
|
2
|
-
export * from "
|
|
3
|
-
import { default as default2 } from "
|
|
2
|
+
export * from "@elliemae/ds-legacy-overlay";
|
|
3
|
+
import { default as default2 } from "@elliemae/ds-legacy-overlay";
|
|
4
4
|
export {
|
|
5
5
|
default2 as default
|
|
6
6
|
};
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from '
|
|
4
|
+
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from '@elliemae/ds-legacy-overlay';\nexport { default } from '@elliemae/ds-legacy-overlay';\n"],
|
|
5
5
|
"mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;AACd,SAAS,WAAAA,gBAAe;",
|
|
6
6
|
"names": ["default"]
|
|
7
7
|
}
|
package/dist/types/index.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export * from '
|
|
2
|
-
export { default } from '
|
|
1
|
+
export * from '@elliemae/ds-legacy-overlay';
|
|
2
|
+
export { default } from '@elliemae/ds-legacy-overlay';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-overlay",
|
|
3
|
-
"version": "3.
|
|
3
|
+
"version": "3.27.0-next.2",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Overlay",
|
|
6
6
|
"files": [
|
|
@@ -13,10 +13,6 @@
|
|
|
13
13
|
".": {
|
|
14
14
|
"import": "./dist/esm/index.js",
|
|
15
15
|
"require": "./dist/cjs/index.js"
|
|
16
|
-
},
|
|
17
|
-
"./DSOverlay": {
|
|
18
|
-
"import": "./dist/esm/DSOverlay.js",
|
|
19
|
-
"require": "./dist/cjs/DSOverlay.js"
|
|
20
16
|
}
|
|
21
17
|
},
|
|
22
18
|
"sideEffects": [
|
|
@@ -39,15 +35,12 @@
|
|
|
39
35
|
"indent": 4
|
|
40
36
|
},
|
|
41
37
|
"dependencies": {
|
|
42
|
-
"@elliemae/ds-
|
|
43
|
-
"@elliemae/ds-classnames": "3.26.1-rc.1",
|
|
44
|
-
"@elliemae/ds-portal": "3.26.1-rc.1",
|
|
45
|
-
"@elliemae/ds-props-helpers": "3.26.1-rc.1"
|
|
38
|
+
"@elliemae/ds-legacy-overlay": "1.0.1"
|
|
46
39
|
},
|
|
47
40
|
"devDependencies": {
|
|
48
41
|
"@elliemae/pui-cli": "~9.0.0-next.31",
|
|
49
42
|
"styled-components": "~5.3.9",
|
|
50
|
-
"@elliemae/ds-monorepo-devops": "3.
|
|
43
|
+
"@elliemae/ds-monorepo-devops": "3.27.0-next.2"
|
|
51
44
|
},
|
|
52
45
|
"peerDependencies": {
|
|
53
46
|
"react": "^17.0.2",
|
|
@@ -59,13 +52,13 @@
|
|
|
59
52
|
},
|
|
60
53
|
"scripts": {
|
|
61
54
|
"dev": "cross-env NODE_ENV=development node ../../../scripts/build/build.mjs --watch",
|
|
62
|
-
"test": "
|
|
63
|
-
"lint": "
|
|
64
|
-
"eslint:fix": "
|
|
65
|
-
"dts": "
|
|
55
|
+
"test": "exit 0 | echo",
|
|
56
|
+
"lint": "exit 0 | echo",
|
|
57
|
+
"eslint:fix": "exit 0 | echo",
|
|
58
|
+
"dts": "exit 0 | echo",
|
|
66
59
|
"build": "cross-env NODE_ENV=production node ../../../scripts/build/build.mjs",
|
|
67
60
|
"dev:build": "pnpm --filter {.}... build",
|
|
68
61
|
"dev:install": "pnpm --filter {.}... i --no-lockfile && pnpm run dev:build",
|
|
69
|
-
"checkDeps": "
|
|
62
|
+
"checkDeps": "exit 0 | echo"
|
|
70
63
|
}
|
|
71
64
|
}
|
package/dist/cjs/DSOverlay.js
DELETED
|
@@ -1,143 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __create = Object.create;
|
|
3
|
-
var __defProp = Object.defineProperty;
|
|
4
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
-
var __export = (target, all) => {
|
|
9
|
-
for (var name in all)
|
|
10
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
-
};
|
|
12
|
-
var __copyProps = (to, from, except, desc) => {
|
|
13
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
-
for (let key of __getOwnPropNames(from))
|
|
15
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
-
}
|
|
18
|
-
return to;
|
|
19
|
-
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
-
mod
|
|
27
|
-
));
|
|
28
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
-
var DSOverlay_exports = {};
|
|
30
|
-
__export(DSOverlay_exports, {
|
|
31
|
-
DSOverlay: () => DSOverlay,
|
|
32
|
-
default: () => DSOverlay_default
|
|
33
|
-
});
|
|
34
|
-
module.exports = __toCommonJS(DSOverlay_exports);
|
|
35
|
-
var React = __toESM(require("react"));
|
|
36
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
37
|
-
var import_react = __toESM(require("react"));
|
|
38
|
-
var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
|
|
39
|
-
var import_ds_classnames = require("@elliemae/ds-classnames");
|
|
40
|
-
var import_ds_backdrop = __toESM(require("@elliemae/ds-backdrop"));
|
|
41
|
-
var import_ds_portal = __toESM(require("@elliemae/ds-portal"));
|
|
42
|
-
const blockName = "overlay";
|
|
43
|
-
const events = ["mousedown", "touchstart"];
|
|
44
|
-
const OverlayContainer = (0, import_ds_classnames.aggregatedClasses)("div")(blockName, null, ({ usePortal, isOpen }) => ({
|
|
45
|
-
inline: !usePortal,
|
|
46
|
-
opened: isOpen
|
|
47
|
-
}));
|
|
48
|
-
const _DSOverlay = class extends import_react.Component {
|
|
49
|
-
constructor(props) {
|
|
50
|
-
super(props);
|
|
51
|
-
this.overlayRef = import_react.default.createRef();
|
|
52
|
-
this.handleDocumentClick = this.handleDocumentClick.bind(this);
|
|
53
|
-
}
|
|
54
|
-
componentDidUpdate(prevProps) {
|
|
55
|
-
const { isOpen } = this.props;
|
|
56
|
-
if (isOpen !== prevProps.isOpen) {
|
|
57
|
-
if (isOpen) {
|
|
58
|
-
this.openOverlay();
|
|
59
|
-
} else {
|
|
60
|
-
this.closeOverlay();
|
|
61
|
-
}
|
|
62
|
-
}
|
|
63
|
-
}
|
|
64
|
-
addClickOutsideListeners() {
|
|
65
|
-
events.forEach((event) => {
|
|
66
|
-
document.addEventListener(event, this.handleDocumentClick);
|
|
67
|
-
});
|
|
68
|
-
}
|
|
69
|
-
removeClickOutsideListeners() {
|
|
70
|
-
events.forEach((event) => {
|
|
71
|
-
document.removeEventListener(event, this.handleDocumentClick);
|
|
72
|
-
});
|
|
73
|
-
}
|
|
74
|
-
handleDocumentClick(e) {
|
|
75
|
-
const { onClickOutside, isOpen } = this.props;
|
|
76
|
-
const { overlayStack } = _DSOverlay;
|
|
77
|
-
const overlayIndex = overlayStack.indexOf(this);
|
|
78
|
-
const hasClickedOverlay = overlayStack.slice(overlayIndex).some(({ overlayRef }) => {
|
|
79
|
-
const elem = overlayRef.current;
|
|
80
|
-
return elem && elem.contains(e.target) && !elem.isSameNode(e.target);
|
|
81
|
-
});
|
|
82
|
-
if (isOpen && !hasClickedOverlay) {
|
|
83
|
-
onClickOutside(e);
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
openOverlay() {
|
|
87
|
-
this.addClickOutsideListeners();
|
|
88
|
-
_DSOverlay.overlayStack.push(this);
|
|
89
|
-
}
|
|
90
|
-
closeOverlay() {
|
|
91
|
-
const { overlayStack } = _DSOverlay;
|
|
92
|
-
const overlayIndex = overlayStack.indexOf(this);
|
|
93
|
-
this.removeClickOutsideListeners();
|
|
94
|
-
overlayStack.splice(overlayIndex, 1);
|
|
95
|
-
}
|
|
96
|
-
render() {
|
|
97
|
-
const { usePortal, isOpen, hasBackdrop, children, backDropZIndex, style = {} } = this.props;
|
|
98
|
-
if (!isOpen)
|
|
99
|
-
return null;
|
|
100
|
-
const overlay = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
101
|
-
OverlayContainer,
|
|
102
|
-
{
|
|
103
|
-
style: {
|
|
104
|
-
zIndex: 3e3,
|
|
105
|
-
...style
|
|
106
|
-
},
|
|
107
|
-
classProps: { usePortal, isOpen },
|
|
108
|
-
innerRef: this.overlayRef,
|
|
109
|
-
children: [
|
|
110
|
-
hasBackdrop && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_backdrop.default, { zIndex: backDropZIndex }),
|
|
111
|
-
children
|
|
112
|
-
]
|
|
113
|
-
}
|
|
114
|
-
);
|
|
115
|
-
if (usePortal) {
|
|
116
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_ds_portal.default, { children: overlay });
|
|
117
|
-
}
|
|
118
|
-
return overlay;
|
|
119
|
-
}
|
|
120
|
-
};
|
|
121
|
-
let DSOverlay = _DSOverlay;
|
|
122
|
-
DSOverlay.overlayStack = [];
|
|
123
|
-
DSOverlay.defaultProps = {
|
|
124
|
-
isOpen: false,
|
|
125
|
-
usePortal: true,
|
|
126
|
-
hasBackdrop: false,
|
|
127
|
-
backDropZIndex: 2,
|
|
128
|
-
// https://jira.elliemae.io/browse/PUI-1712
|
|
129
|
-
onClickOutside: () => null
|
|
130
|
-
};
|
|
131
|
-
const DSOverlayPropTypes = {
|
|
132
|
-
backDropZIndex: import_ds_props_helpers.PropTypes.number.description("backDropZIndex"),
|
|
133
|
-
children: import_ds_props_helpers.PropTypes.element.description("children"),
|
|
134
|
-
hasBackdrop: import_ds_props_helpers.PropTypes.bool.description("hasBackdrop"),
|
|
135
|
-
isOpen: import_ds_props_helpers.PropTypes.bool.description("isOpen"),
|
|
136
|
-
onClickOutside: import_ds_props_helpers.PropTypes.func.description("onClickOutside"),
|
|
137
|
-
usePortal: import_ds_props_helpers.PropTypes.bool.description("usePortal")
|
|
138
|
-
};
|
|
139
|
-
DSOverlay.propTypes = DSOverlayPropTypes;
|
|
140
|
-
const DSOverlayWithSchema = (0, import_ds_props_helpers.describe)(DSOverlay);
|
|
141
|
-
DSOverlayWithSchema.propTypes = DSOverlayPropTypes;
|
|
142
|
-
var DSOverlay_default = DSOverlay;
|
|
143
|
-
//# sourceMappingURL=DSOverlay.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/DSOverlay.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"sourcesContent": ["/* eslint-disable max-lines */\nimport React, { Component } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport DSBackdrop from '@elliemae/ds-backdrop';\nimport DSPortal from '@elliemae/ds-portal';\n\nconst blockName = 'overlay';\n\nconst events = ['mousedown', 'touchstart'];\n\nconst OverlayContainer = aggregatedClasses('div')(blockName, null, ({ usePortal, isOpen }) => ({\n inline: !usePortal,\n opened: isOpen,\n}));\n\nclass DSOverlay extends Component {\n static overlayStack = [];\n\n static defaultProps = {\n isOpen: false,\n usePortal: true,\n hasBackdrop: false,\n backDropZIndex: 2, // https://jira.elliemae.io/browse/PUI-1712\n onClickOutside: () => null,\n };\n\n constructor(props) {\n super(props);\n this.overlayRef = React.createRef();\n\n this.handleDocumentClick = this.handleDocumentClick.bind(this);\n }\n\n componentDidUpdate(prevProps) {\n const { isOpen } = this.props;\n if (isOpen !== prevProps.isOpen) {\n if (isOpen) {\n this.openOverlay();\n } else {\n this.closeOverlay();\n }\n }\n }\n\n addClickOutsideListeners() {\n events.forEach((event) => {\n document.addEventListener(event, this.handleDocumentClick);\n });\n }\n\n removeClickOutsideListeners() {\n events.forEach((event) => {\n document.removeEventListener(event, this.handleDocumentClick);\n });\n }\n\n handleDocumentClick(e) {\n const { onClickOutside, isOpen } = this.props;\n const { overlayStack } = DSOverlay;\n const overlayIndex = overlayStack.indexOf(this);\n const hasClickedOverlay = overlayStack.slice(overlayIndex).some(({ overlayRef }) => {\n const elem = overlayRef.current;\n return elem && elem.contains(e.target) && !elem.isSameNode(e.target);\n });\n\n if (isOpen && !hasClickedOverlay) {\n onClickOutside(e); // giving opportunity for callers to operate on the event.\n }\n }\n\n openOverlay() {\n this.addClickOutsideListeners();\n DSOverlay.overlayStack.push(this);\n }\n\n closeOverlay() {\n const { overlayStack } = DSOverlay;\n const overlayIndex = overlayStack.indexOf(this);\n this.removeClickOutsideListeners();\n overlayStack.splice(overlayIndex, 1);\n }\n\n render() {\n const { usePortal, isOpen, hasBackdrop, children, backDropZIndex, style = {} } = this.props;\n\n if (!isOpen) return null;\n\n const overlay = (\n <OverlayContainer\n style={{\n zIndex: 3000,\n ...style,\n }}\n classProps={{ usePortal, isOpen }}\n innerRef={this.overlayRef}\n >\n {hasBackdrop && <DSBackdrop zIndex={backDropZIndex} />}\n {children}\n </OverlayContainer>\n );\n\n if (usePortal) {\n return <DSPortal>{overlay}</DSPortal>;\n }\n\n return overlay;\n }\n}\n\nconst DSOverlayPropTypes = {\n backDropZIndex: PropTypes.number.description('backDropZIndex'),\n children: PropTypes.element.description('children'),\n hasBackdrop: PropTypes.bool.description('hasBackdrop'),\n isOpen: PropTypes.bool.description('isOpen'),\n onClickOutside: PropTypes.func.description('onClickOutside'),\n usePortal: PropTypes.bool.description('usePortal'),\n};\n\nDSOverlay.propTypes = DSOverlayPropTypes;\n\nconst DSOverlayWithSchema = describe(DSOverlay);\nDSOverlayWithSchema.propTypes = DSOverlayPropTypes;\n\nexport { DSOverlay };\nexport default DSOverlay;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "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",
|
|
6
|
-
"names": ["React", "DSBackdrop", "DSPortal"]
|
|
7
|
-
}
|
package/dist/esm/DSOverlay.js
DELETED
|
@@ -1,113 +0,0 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
-
import React2, { Component } from "react";
|
|
4
|
-
import { PropTypes, describe } from "@elliemae/ds-props-helpers";
|
|
5
|
-
import { aggregatedClasses } from "@elliemae/ds-classnames";
|
|
6
|
-
import DSBackdrop from "@elliemae/ds-backdrop";
|
|
7
|
-
import DSPortal from "@elliemae/ds-portal";
|
|
8
|
-
const blockName = "overlay";
|
|
9
|
-
const events = ["mousedown", "touchstart"];
|
|
10
|
-
const OverlayContainer = aggregatedClasses("div")(blockName, null, ({ usePortal, isOpen }) => ({
|
|
11
|
-
inline: !usePortal,
|
|
12
|
-
opened: isOpen
|
|
13
|
-
}));
|
|
14
|
-
const _DSOverlay = class extends Component {
|
|
15
|
-
constructor(props) {
|
|
16
|
-
super(props);
|
|
17
|
-
this.overlayRef = React2.createRef();
|
|
18
|
-
this.handleDocumentClick = this.handleDocumentClick.bind(this);
|
|
19
|
-
}
|
|
20
|
-
componentDidUpdate(prevProps) {
|
|
21
|
-
const { isOpen } = this.props;
|
|
22
|
-
if (isOpen !== prevProps.isOpen) {
|
|
23
|
-
if (isOpen) {
|
|
24
|
-
this.openOverlay();
|
|
25
|
-
} else {
|
|
26
|
-
this.closeOverlay();
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
addClickOutsideListeners() {
|
|
31
|
-
events.forEach((event) => {
|
|
32
|
-
document.addEventListener(event, this.handleDocumentClick);
|
|
33
|
-
});
|
|
34
|
-
}
|
|
35
|
-
removeClickOutsideListeners() {
|
|
36
|
-
events.forEach((event) => {
|
|
37
|
-
document.removeEventListener(event, this.handleDocumentClick);
|
|
38
|
-
});
|
|
39
|
-
}
|
|
40
|
-
handleDocumentClick(e) {
|
|
41
|
-
const { onClickOutside, isOpen } = this.props;
|
|
42
|
-
const { overlayStack } = _DSOverlay;
|
|
43
|
-
const overlayIndex = overlayStack.indexOf(this);
|
|
44
|
-
const hasClickedOverlay = overlayStack.slice(overlayIndex).some(({ overlayRef }) => {
|
|
45
|
-
const elem = overlayRef.current;
|
|
46
|
-
return elem && elem.contains(e.target) && !elem.isSameNode(e.target);
|
|
47
|
-
});
|
|
48
|
-
if (isOpen && !hasClickedOverlay) {
|
|
49
|
-
onClickOutside(e);
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
openOverlay() {
|
|
53
|
-
this.addClickOutsideListeners();
|
|
54
|
-
_DSOverlay.overlayStack.push(this);
|
|
55
|
-
}
|
|
56
|
-
closeOverlay() {
|
|
57
|
-
const { overlayStack } = _DSOverlay;
|
|
58
|
-
const overlayIndex = overlayStack.indexOf(this);
|
|
59
|
-
this.removeClickOutsideListeners();
|
|
60
|
-
overlayStack.splice(overlayIndex, 1);
|
|
61
|
-
}
|
|
62
|
-
render() {
|
|
63
|
-
const { usePortal, isOpen, hasBackdrop, children, backDropZIndex, style = {} } = this.props;
|
|
64
|
-
if (!isOpen)
|
|
65
|
-
return null;
|
|
66
|
-
const overlay = /* @__PURE__ */ jsxs(
|
|
67
|
-
OverlayContainer,
|
|
68
|
-
{
|
|
69
|
-
style: {
|
|
70
|
-
zIndex: 3e3,
|
|
71
|
-
...style
|
|
72
|
-
},
|
|
73
|
-
classProps: { usePortal, isOpen },
|
|
74
|
-
innerRef: this.overlayRef,
|
|
75
|
-
children: [
|
|
76
|
-
hasBackdrop && /* @__PURE__ */ jsx(DSBackdrop, { zIndex: backDropZIndex }),
|
|
77
|
-
children
|
|
78
|
-
]
|
|
79
|
-
}
|
|
80
|
-
);
|
|
81
|
-
if (usePortal) {
|
|
82
|
-
return /* @__PURE__ */ jsx(DSPortal, { children: overlay });
|
|
83
|
-
}
|
|
84
|
-
return overlay;
|
|
85
|
-
}
|
|
86
|
-
};
|
|
87
|
-
let DSOverlay = _DSOverlay;
|
|
88
|
-
DSOverlay.overlayStack = [];
|
|
89
|
-
DSOverlay.defaultProps = {
|
|
90
|
-
isOpen: false,
|
|
91
|
-
usePortal: true,
|
|
92
|
-
hasBackdrop: false,
|
|
93
|
-
backDropZIndex: 2,
|
|
94
|
-
// https://jira.elliemae.io/browse/PUI-1712
|
|
95
|
-
onClickOutside: () => null
|
|
96
|
-
};
|
|
97
|
-
const DSOverlayPropTypes = {
|
|
98
|
-
backDropZIndex: PropTypes.number.description("backDropZIndex"),
|
|
99
|
-
children: PropTypes.element.description("children"),
|
|
100
|
-
hasBackdrop: PropTypes.bool.description("hasBackdrop"),
|
|
101
|
-
isOpen: PropTypes.bool.description("isOpen"),
|
|
102
|
-
onClickOutside: PropTypes.func.description("onClickOutside"),
|
|
103
|
-
usePortal: PropTypes.bool.description("usePortal")
|
|
104
|
-
};
|
|
105
|
-
DSOverlay.propTypes = DSOverlayPropTypes;
|
|
106
|
-
const DSOverlayWithSchema = describe(DSOverlay);
|
|
107
|
-
DSOverlayWithSchema.propTypes = DSOverlayPropTypes;
|
|
108
|
-
var DSOverlay_default = DSOverlay;
|
|
109
|
-
export {
|
|
110
|
-
DSOverlay,
|
|
111
|
-
DSOverlay_default as default
|
|
112
|
-
};
|
|
113
|
-
//# sourceMappingURL=DSOverlay.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/DSOverlay.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* eslint-disable max-lines */\nimport React, { Component } from 'react';\nimport { PropTypes, describe } from '@elliemae/ds-props-helpers';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport DSBackdrop from '@elliemae/ds-backdrop';\nimport DSPortal from '@elliemae/ds-portal';\n\nconst blockName = 'overlay';\n\nconst events = ['mousedown', 'touchstart'];\n\nconst OverlayContainer = aggregatedClasses('div')(blockName, null, ({ usePortal, isOpen }) => ({\n inline: !usePortal,\n opened: isOpen,\n}));\n\nclass DSOverlay extends Component {\n static overlayStack = [];\n\n static defaultProps = {\n isOpen: false,\n usePortal: true,\n hasBackdrop: false,\n backDropZIndex: 2, // https://jira.elliemae.io/browse/PUI-1712\n onClickOutside: () => null,\n };\n\n constructor(props) {\n super(props);\n this.overlayRef = React.createRef();\n\n this.handleDocumentClick = this.handleDocumentClick.bind(this);\n }\n\n componentDidUpdate(prevProps) {\n const { isOpen } = this.props;\n if (isOpen !== prevProps.isOpen) {\n if (isOpen) {\n this.openOverlay();\n } else {\n this.closeOverlay();\n }\n }\n }\n\n addClickOutsideListeners() {\n events.forEach((event) => {\n document.addEventListener(event, this.handleDocumentClick);\n });\n }\n\n removeClickOutsideListeners() {\n events.forEach((event) => {\n document.removeEventListener(event, this.handleDocumentClick);\n });\n }\n\n handleDocumentClick(e) {\n const { onClickOutside, isOpen } = this.props;\n const { overlayStack } = DSOverlay;\n const overlayIndex = overlayStack.indexOf(this);\n const hasClickedOverlay = overlayStack.slice(overlayIndex).some(({ overlayRef }) => {\n const elem = overlayRef.current;\n return elem && elem.contains(e.target) && !elem.isSameNode(e.target);\n });\n\n if (isOpen && !hasClickedOverlay) {\n onClickOutside(e); // giving opportunity for callers to operate on the event.\n }\n }\n\n openOverlay() {\n this.addClickOutsideListeners();\n DSOverlay.overlayStack.push(this);\n }\n\n closeOverlay() {\n const { overlayStack } = DSOverlay;\n const overlayIndex = overlayStack.indexOf(this);\n this.removeClickOutsideListeners();\n overlayStack.splice(overlayIndex, 1);\n }\n\n render() {\n const { usePortal, isOpen, hasBackdrop, children, backDropZIndex, style = {} } = this.props;\n\n if (!isOpen) return null;\n\n const overlay = (\n <OverlayContainer\n style={{\n zIndex: 3000,\n ...style,\n }}\n classProps={{ usePortal, isOpen }}\n innerRef={this.overlayRef}\n >\n {hasBackdrop && <DSBackdrop zIndex={backDropZIndex} />}\n {children}\n </OverlayContainer>\n );\n\n if (usePortal) {\n return <DSPortal>{overlay}</DSPortal>;\n }\n\n return overlay;\n }\n}\n\nconst DSOverlayPropTypes = {\n backDropZIndex: PropTypes.number.description('backDropZIndex'),\n children: PropTypes.element.description('children'),\n hasBackdrop: PropTypes.bool.description('hasBackdrop'),\n isOpen: PropTypes.bool.description('isOpen'),\n onClickOutside: PropTypes.func.description('onClickOutside'),\n usePortal: PropTypes.bool.description('usePortal'),\n};\n\nDSOverlay.propTypes = DSOverlayPropTypes;\n\nconst DSOverlayWithSchema = describe(DSOverlay);\nDSOverlayWithSchema.propTypes = DSOverlayPropTypes;\n\nexport { DSOverlay };\nexport default DSOverlay;\n"],
|
|
5
|
-
"mappings": "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",
|
|
6
|
-
"names": ["React"]
|
|
7
|
-
}
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
import { Component } from 'react';
|
|
2
|
-
declare class DSOverlay extends Component {
|
|
3
|
-
static overlayStack: never[];
|
|
4
|
-
static defaultProps: {
|
|
5
|
-
isOpen: boolean;
|
|
6
|
-
usePortal: boolean;
|
|
7
|
-
hasBackdrop: boolean;
|
|
8
|
-
backDropZIndex: number;
|
|
9
|
-
onClickOutside: () => null;
|
|
10
|
-
};
|
|
11
|
-
constructor(props: any);
|
|
12
|
-
componentDidUpdate(prevProps: any): void;
|
|
13
|
-
addClickOutsideListeners(): void;
|
|
14
|
-
removeClickOutsideListeners(): void;
|
|
15
|
-
handleDocumentClick(e: any): void;
|
|
16
|
-
openOverlay(): void;
|
|
17
|
-
closeOverlay(): void;
|
|
18
|
-
render(): import("react/jsx-runtime").JSX.Element | null;
|
|
19
|
-
}
|
|
20
|
-
export { DSOverlay };
|
|
21
|
-
export default DSOverlay;
|