@elliemae/ds-overlay 2.2.0-next.4 → 2.3.0-alpha.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/cjs/DSOverlay.js CHANGED
@@ -1,48 +1,55 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var _jsx = require('@babel/runtime/helpers/jsx');
6
- require('core-js/modules/esnext.async-iterator.some.js');
7
- require('core-js/modules/esnext.iterator.constructor.js');
8
- require('core-js/modules/esnext.iterator.some.js');
9
- var React = require('react');
10
- var dsClassnames = require('@elliemae/ds-classnames');
11
- var DSBackdrop = require('@elliemae/ds-backdrop');
12
- var DSPortal = require('@elliemae/ds-portal');
13
-
14
- function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
15
-
16
- var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
17
- var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
18
- var DSBackdrop__default = /*#__PURE__*/_interopDefaultLegacy(DSBackdrop);
19
- var DSPortal__default = /*#__PURE__*/_interopDefaultLegacy(DSPortal);
20
-
21
- const blockName = 'overlay';
22
- const events = ['mousedown', 'touchstart'];
23
- const OverlayContainer = dsClassnames.aggregatedClasses('div')(blockName, null, _ref => {
24
- let {
25
- usePortal,
26
- isOpen
27
- } = _ref;
28
- return {
29
- inline: !usePortal,
30
- opened: isOpen
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __reExport = (target, module2, copyDefault, desc) => {
13
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
+ for (let key of __getOwnPropNames(module2))
15
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
+ }
18
+ return target;
19
+ };
20
+ var __toESM = (module2, isNodeMode) => {
21
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
+ };
23
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
+ return (module2, temp) => {
25
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
31
26
  };
27
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
+ var DSOverlay_exports = {};
29
+ __export(DSOverlay_exports, {
30
+ DSOverlay: () => DSOverlay,
31
+ default: () => DSOverlay_default
32
32
  });
33
-
34
- class DSOverlay extends React.Component {
33
+ var React = __toESM(require("react"));
34
+ var import_react = __toESM(require("react"));
35
+ var import_prop_types = __toESM(require("prop-types"));
36
+ var import_ds_classnames = require("@elliemae/ds-classnames");
37
+ var import_ds_backdrop = __toESM(require("@elliemae/ds-backdrop"));
38
+ var import_ds_portal = __toESM(require("@elliemae/ds-portal"));
39
+ const blockName = "overlay";
40
+ const events = ["mousedown", "touchstart"];
41
+ const OverlayContainer = (0, import_ds_classnames.aggregatedClasses)("div")(blockName, null, ({ usePortal, isOpen }) => ({
42
+ inline: !usePortal,
43
+ opened: isOpen
44
+ }));
45
+ const _DSOverlay = class extends import_react.Component {
35
46
  constructor(props) {
36
47
  super(props);
37
- this.overlayRef = /*#__PURE__*/React__default["default"].createRef();
48
+ this.overlayRef = import_react.default.createRef();
38
49
  this.handleDocumentClick = this.handleDocumentClick.bind(this);
39
50
  }
40
-
41
51
  componentDidUpdate(prevProps) {
42
- const {
43
- isOpen
44
- } = this.props;
45
-
52
+ const { isOpen } = this.props;
46
53
  if (isOpen !== prevProps.isOpen) {
47
54
  if (isOpen) {
48
55
  this.openOverlay();
@@ -51,55 +58,38 @@ class DSOverlay extends React.Component {
51
58
  }
52
59
  }
53
60
  }
54
-
55
61
  addClickOutsideListeners() {
56
- events.forEach(event => {
62
+ events.forEach((event) => {
57
63
  document.addEventListener(event, this.handleDocumentClick);
58
64
  });
59
65
  }
60
-
61
66
  removeClickOutsideListeners() {
62
- events.forEach(event => {
67
+ events.forEach((event) => {
63
68
  document.removeEventListener(event, this.handleDocumentClick);
64
69
  });
65
70
  }
66
-
67
71
  handleDocumentClick(e) {
68
- const {
69
- onClickOutside,
70
- isOpen
71
- } = this.props;
72
- const {
73
- overlayStack
74
- } = DSOverlay;
72
+ const { onClickOutside, isOpen } = this.props;
73
+ const { overlayStack } = _DSOverlay;
75
74
  const overlayIndex = overlayStack.indexOf(this);
76
- const hasClickedOverlay = overlayStack.slice(overlayIndex).some(_ref2 => {
77
- let {
78
- overlayRef
79
- } = _ref2;
75
+ const hasClickedOverlay = overlayStack.slice(overlayIndex).some(({ overlayRef }) => {
80
76
  const elem = overlayRef.current;
81
77
  return elem && elem.contains(e.target) && !elem.isSameNode(e.target);
82
78
  });
83
-
84
79
  if (isOpen && !hasClickedOverlay) {
85
- onClickOutside(e); // giving opportunity for callers to operate on the event.
80
+ onClickOutside(e);
86
81
  }
87
82
  }
88
-
89
83
  openOverlay() {
90
84
  this.addClickOutsideListeners();
91
- DSOverlay.overlayStack.push(this);
85
+ _DSOverlay.overlayStack.push(this);
92
86
  }
93
-
94
87
  closeOverlay() {
95
- const {
96
- overlayStack
97
- } = DSOverlay;
88
+ const { overlayStack } = _DSOverlay;
98
89
  const overlayIndex = overlayStack.indexOf(this);
99
90
  this.removeClickOutsideListeners();
100
91
  overlayStack.splice(overlayIndex, 1);
101
92
  }
102
-
103
93
  render() {
104
94
  const {
105
95
  usePortal,
@@ -108,36 +98,37 @@ class DSOverlay extends React.Component {
108
98
  children,
109
99
  backDropZIndex
110
100
  } = this.props;
111
- if (!isOpen) return null;
112
-
113
- const overlay = /*#__PURE__*/_jsx__default["default"](OverlayContainer, {
114
- classProps: {
115
- usePortal,
116
- isOpen
117
- },
101
+ if (!isOpen)
102
+ return null;
103
+ const overlay = /* @__PURE__ */ import_react.default.createElement(OverlayContainer, {
104
+ classProps: { usePortal, isOpen },
118
105
  innerRef: this.overlayRef
119
- }, void 0, hasBackdrop && /*#__PURE__*/_jsx__default["default"](DSBackdrop__default["default"], {
106
+ }, hasBackdrop && /* @__PURE__ */ import_react.default.createElement(import_ds_backdrop.default, {
120
107
  zIndex: backDropZIndex
121
108
  }), children);
122
-
123
109
  if (usePortal) {
124
- return /*#__PURE__*/_jsx__default["default"](DSPortal__default["default"], {}, void 0, overlay);
110
+ return /* @__PURE__ */ import_react.default.createElement(import_ds_portal.default, null, overlay);
125
111
  }
126
-
127
112
  return overlay;
128
113
  }
129
-
130
- }
131
-
114
+ };
115
+ let DSOverlay = _DSOverlay;
132
116
  DSOverlay.overlayStack = [];
133
117
  DSOverlay.defaultProps = {
134
118
  isOpen: false,
135
119
  usePortal: true,
136
120
  hasBackdrop: false,
137
121
  backDropZIndex: 2,
138
- // https://jira.elliemae.io/browse/PUI-1712
139
122
  onClickOutside: () => null
140
123
  };
141
-
142
- exports.DSOverlay = DSOverlay;
143
- exports["default"] = DSOverlay;
124
+ DSOverlay.propTypes = {
125
+ backDropZIndex: import_prop_types.default.number,
126
+ children: import_prop_types.default.element,
127
+ hasBackdrop: import_prop_types.default.bool,
128
+ isOpen: import_prop_types.default.bool,
129
+ onClickOutside: import_prop_types.default.func,
130
+ usePortal: import_prop_types.default.bool
131
+ };
132
+ var DSOverlay_default = DSOverlay;
133
+ module.exports = __toCommonJS(DSOverlay_exports);
134
+ //# sourceMappingURL=DSOverlay.js.map
@@ -0,0 +1,7 @@
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 from 'prop-types';\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')(\n blockName,\n null,\n ({ usePortal, isOpen }) => ({\n inline: !usePortal,\n opened: isOpen,\n }),\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 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\n .slice(overlayIndex)\n .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 {\n usePortal,\n isOpen,\n hasBackdrop,\n children,\n backDropZIndex,\n } = this.props;\n\n if (!isOpen) return null;\n\n const overlay = (\n <OverlayContainer\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\nDSOverlay.propTypes = {\n backDropZIndex: PropTypes.number,\n children: PropTypes.element,\n hasBackdrop: PropTypes.bool,\n isOpen: PropTypes.bool,\n onClickOutside: PropTypes.func,\n usePortal: PropTypes.bool,\n};\n\nexport { DSOverlay };\nexport default DSOverlay;\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADCvB,mBAAiC;AACjC,wBAAsB;AACtB,2BAAkC;AAClC,yBAAuB;AACvB,uBAAqB;AAErB,MAAM,YAAY;AAElB,MAAM,SAAS,CAAC,aAAa;AAE7B,MAAM,mBAAmB,4CAAkB,OACzC,WACA,MACA,CAAC,EAAE,WAAW,aAAc;AAAA,EAC1B,QAAQ,CAAC;AAAA,EACT,QAAQ;AAAA;AAIZ,iCAAwB,uBAAU;AAAA,EAUhC,YAAY,OAAO;AACjB,UAAM;AACN,SAAK,aAAa,qBAAM;AAExB,SAAK,sBAAsB,KAAK,oBAAoB,KAAK;AAAA;AAAA,EAG3D,mBAAmB,WAAW;AAC5B,UAAM,EAAE,WAAW,KAAK;AACxB,QAAI,WAAW,UAAU,QAAQ;AAC/B,UAAI,QAAQ;AACV,aAAK;AAAA,aACA;AACL,aAAK;AAAA;AAAA;AAAA;AAAA,EAKX,2BAA2B;AACzB,WAAO,QAAQ,CAAC,UAAU;AACxB,eAAS,iBAAiB,OAAO,KAAK;AAAA;AAAA;AAAA,EAI1C,8BAA8B;AAC5B,WAAO,QAAQ,CAAC,UAAU;AACxB,eAAS,oBAAoB,OAAO,KAAK;AAAA;AAAA;AAAA,EAI7C,oBAAoB,GAAG;AACrB,UAAM,EAAE,gBAAgB,WAAW,KAAK;AACxC,UAAM,EAAE,iBAAiB;AACzB,UAAM,eAAe,aAAa,QAAQ;AAC1C,UAAM,oBAAoB,aACvB,MAAM,cACN,KAAK,CAAC,EAAE,iBAAiB;AACxB,YAAM,OAAO,WAAW;AACxB,aAAO,QAAQ,KAAK,SAAS,EAAE,WAAW,CAAC,KAAK,WAAW,EAAE;AAAA;AAGjE,QAAI,UAAU,CAAC,mBAAmB;AAChC,qBAAe;AAAA;AAAA;AAAA,EAInB,cAAc;AACZ,SAAK;AACL,eAAU,aAAa,KAAK;AAAA;AAAA,EAG9B,eAAe;AACb,UAAM,EAAE,iBAAiB;AACzB,UAAM,eAAe,aAAa,QAAQ;AAC1C,SAAK;AACL,iBAAa,OAAO,cAAc;AAAA;AAAA,EAGpC,SAAS;AACP,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,QACE,KAAK;AAET,QAAI,CAAC;AAAQ,aAAO;AAEpB,UAAM,UACJ,mDAAC,kBAAD;AAAA,MACE,YAAY,EAAE,WAAW;AAAA,MACzB,UAAU,KAAK;AAAA,OAEd,eAAe,mDAAC,4BAAD;AAAA,MAAY,QAAQ;AAAA,QACnC;AAIL,QAAI,WAAW;AACb,aAAO,mDAAC,0BAAD,MAAW;AAAA;AAGpB,WAAO;AAAA;AAAA;AA7FX;AACS,AADT,UACS,eAAe;AAEf,AAHT,UAGS,eAAe;AAAA,EACpB,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,gBAAgB,MAAM;AAAA;AAyF1B,UAAU,YAAY;AAAA,EACpB,gBAAgB,0BAAU;AAAA,EAC1B,UAAU,0BAAU;AAAA,EACpB,aAAa,0BAAU;AAAA,EACvB,QAAQ,0BAAU;AAAA,EAClB,gBAAgB,0BAAU;AAAA,EAC1B,WAAW,0BAAU;AAAA;AAIvB,IAAO,oBAAQ;",
6
+ "names": []
7
+ }
package/cjs/index.js CHANGED
@@ -1,10 +1,36 @@
1
- 'use strict';
2
-
3
- Object.defineProperty(exports, '__esModule', { value: true });
4
-
5
- var DSOverlay = require('./DSOverlay.js');
6
-
7
-
8
-
9
- exports.DSOverlay = DSOverlay.DSOverlay;
10
- exports["default"] = DSOverlay.DSOverlay;
1
+ var __create = Object.create;
2
+ var __defProp = Object.defineProperty;
3
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
+ var __getOwnPropNames = Object.getOwnPropertyNames;
5
+ var __getProtoOf = Object.getPrototypeOf;
6
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
7
+ var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __reExport = (target, module2, copyDefault, desc) => {
13
+ if (module2 && typeof module2 === "object" || typeof module2 === "function") {
14
+ for (let key of __getOwnPropNames(module2))
15
+ if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
16
+ __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
17
+ }
18
+ return target;
19
+ };
20
+ var __toESM = (module2, isNodeMode) => {
21
+ return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
22
+ };
23
+ var __toCommonJS = /* @__PURE__ */ ((cache) => {
24
+ return (module2, temp) => {
25
+ return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
26
+ };
27
+ })(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
28
+ var src_exports = {};
29
+ __export(src_exports, {
30
+ default: () => import_DSOverlay.default
31
+ });
32
+ var React = __toESM(require("react"));
33
+ __reExport(src_exports, require("./DSOverlay"));
34
+ var import_DSOverlay = __toESM(require("./DSOverlay"));
35
+ module.exports = __toCommonJS(src_exports);
36
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
+ "sourcesContent": ["export * from './DSOverlay';\nexport { default } from './DSOverlay';\n", "import * as React from 'react';\nexport { React };\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,wBAAc;AACd,uBAAwB;",
6
+ "names": []
7
+ }
package/esm/DSOverlay.js CHANGED
@@ -1,37 +1,23 @@
1
- import _jsx from '@babel/runtime/helpers/esm/jsx';
2
- import 'core-js/modules/esnext.async-iterator.some.js';
3
- import 'core-js/modules/esnext.iterator.constructor.js';
4
- import 'core-js/modules/esnext.iterator.some.js';
5
- import React, { Component } from 'react';
6
- import { aggregatedClasses } from '@elliemae/ds-classnames';
7
- import DSBackdrop from '@elliemae/ds-backdrop';
8
- import DSPortal from '@elliemae/ds-portal';
9
-
10
- const blockName = 'overlay';
11
- const events = ['mousedown', 'touchstart'];
12
- const OverlayContainer = aggregatedClasses('div')(blockName, null, _ref => {
13
- let {
14
- usePortal,
15
- isOpen
16
- } = _ref;
17
- return {
18
- inline: !usePortal,
19
- opened: isOpen
20
- };
21
- });
22
-
23
- class DSOverlay extends Component {
1
+ import * as React from "react";
2
+ import React2, { Component } from "react";
3
+ import PropTypes from "prop-types";
4
+ import { aggregatedClasses } from "@elliemae/ds-classnames";
5
+ import DSBackdrop from "@elliemae/ds-backdrop";
6
+ import DSPortal from "@elliemae/ds-portal";
7
+ const blockName = "overlay";
8
+ const events = ["mousedown", "touchstart"];
9
+ const OverlayContainer = aggregatedClasses("div")(blockName, null, ({ usePortal, isOpen }) => ({
10
+ inline: !usePortal,
11
+ opened: isOpen
12
+ }));
13
+ const _DSOverlay = class extends Component {
24
14
  constructor(props) {
25
15
  super(props);
26
- this.overlayRef = /*#__PURE__*/React.createRef();
16
+ this.overlayRef = React2.createRef();
27
17
  this.handleDocumentClick = this.handleDocumentClick.bind(this);
28
18
  }
29
-
30
19
  componentDidUpdate(prevProps) {
31
- const {
32
- isOpen
33
- } = this.props;
34
-
20
+ const { isOpen } = this.props;
35
21
  if (isOpen !== prevProps.isOpen) {
36
22
  if (isOpen) {
37
23
  this.openOverlay();
@@ -40,55 +26,38 @@ class DSOverlay extends Component {
40
26
  }
41
27
  }
42
28
  }
43
-
44
29
  addClickOutsideListeners() {
45
- events.forEach(event => {
30
+ events.forEach((event) => {
46
31
  document.addEventListener(event, this.handleDocumentClick);
47
32
  });
48
33
  }
49
-
50
34
  removeClickOutsideListeners() {
51
- events.forEach(event => {
35
+ events.forEach((event) => {
52
36
  document.removeEventListener(event, this.handleDocumentClick);
53
37
  });
54
38
  }
55
-
56
39
  handleDocumentClick(e) {
57
- const {
58
- onClickOutside,
59
- isOpen
60
- } = this.props;
61
- const {
62
- overlayStack
63
- } = DSOverlay;
40
+ const { onClickOutside, isOpen } = this.props;
41
+ const { overlayStack } = _DSOverlay;
64
42
  const overlayIndex = overlayStack.indexOf(this);
65
- const hasClickedOverlay = overlayStack.slice(overlayIndex).some(_ref2 => {
66
- let {
67
- overlayRef
68
- } = _ref2;
43
+ const hasClickedOverlay = overlayStack.slice(overlayIndex).some(({ overlayRef }) => {
69
44
  const elem = overlayRef.current;
70
45
  return elem && elem.contains(e.target) && !elem.isSameNode(e.target);
71
46
  });
72
-
73
47
  if (isOpen && !hasClickedOverlay) {
74
- onClickOutside(e); // giving opportunity for callers to operate on the event.
48
+ onClickOutside(e);
75
49
  }
76
50
  }
77
-
78
51
  openOverlay() {
79
52
  this.addClickOutsideListeners();
80
- DSOverlay.overlayStack.push(this);
53
+ _DSOverlay.overlayStack.push(this);
81
54
  }
82
-
83
55
  closeOverlay() {
84
- const {
85
- overlayStack
86
- } = DSOverlay;
56
+ const { overlayStack } = _DSOverlay;
87
57
  const overlayIndex = overlayStack.indexOf(this);
88
58
  this.removeClickOutsideListeners();
89
59
  overlayStack.splice(overlayIndex, 1);
90
60
  }
91
-
92
61
  render() {
93
62
  const {
94
63
  usePortal,
@@ -97,35 +66,40 @@ class DSOverlay extends Component {
97
66
  children,
98
67
  backDropZIndex
99
68
  } = this.props;
100
- if (!isOpen) return null;
101
-
102
- const overlay = /*#__PURE__*/_jsx(OverlayContainer, {
103
- classProps: {
104
- usePortal,
105
- isOpen
106
- },
69
+ if (!isOpen)
70
+ return null;
71
+ const overlay = /* @__PURE__ */ React2.createElement(OverlayContainer, {
72
+ classProps: { usePortal, isOpen },
107
73
  innerRef: this.overlayRef
108
- }, void 0, hasBackdrop && /*#__PURE__*/_jsx(DSBackdrop, {
74
+ }, hasBackdrop && /* @__PURE__ */ React2.createElement(DSBackdrop, {
109
75
  zIndex: backDropZIndex
110
76
  }), children);
111
-
112
77
  if (usePortal) {
113
- return /*#__PURE__*/_jsx(DSPortal, {}, void 0, overlay);
78
+ return /* @__PURE__ */ React2.createElement(DSPortal, null, overlay);
114
79
  }
115
-
116
80
  return overlay;
117
81
  }
118
-
119
- }
120
-
82
+ };
83
+ let DSOverlay = _DSOverlay;
121
84
  DSOverlay.overlayStack = [];
122
85
  DSOverlay.defaultProps = {
123
86
  isOpen: false,
124
87
  usePortal: true,
125
88
  hasBackdrop: false,
126
89
  backDropZIndex: 2,
127
- // https://jira.elliemae.io/browse/PUI-1712
128
90
  onClickOutside: () => null
129
91
  };
130
-
131
- export { DSOverlay, DSOverlay as default };
92
+ DSOverlay.propTypes = {
93
+ backDropZIndex: PropTypes.number,
94
+ children: PropTypes.element,
95
+ hasBackdrop: PropTypes.bool,
96
+ isOpen: PropTypes.bool,
97
+ onClickOutside: PropTypes.func,
98
+ usePortal: PropTypes.bool
99
+ };
100
+ var DSOverlay_default = DSOverlay;
101
+ export {
102
+ DSOverlay,
103
+ DSOverlay_default as default
104
+ };
105
+ //# sourceMappingURL=DSOverlay.js.map
@@ -0,0 +1,7 @@
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 from 'prop-types';\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')(\n blockName,\n null,\n ({ usePortal, isOpen }) => ({\n inline: !usePortal,\n opened: isOpen,\n }),\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 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\n .slice(overlayIndex)\n .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 {\n usePortal,\n isOpen,\n hasBackdrop,\n children,\n backDropZIndex,\n } = this.props;\n\n if (!isOpen) return null;\n\n const overlay = (\n <OverlayContainer\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\nDSOverlay.propTypes = {\n backDropZIndex: PropTypes.number,\n children: PropTypes.element,\n hasBackdrop: PropTypes.bool,\n isOpen: PropTypes.bool,\n onClickOutside: PropTypes.func,\n usePortal: PropTypes.bool,\n};\n\nexport { DSOverlay };\nexport default DSOverlay;\n"],
5
+ "mappings": "AAAA;ACCA;AACA;AACA;AACA;AACA;AAEA,MAAM,YAAY;AAElB,MAAM,SAAS,CAAC,aAAa;AAE7B,MAAM,mBAAmB,kBAAkB,OACzC,WACA,MACA,CAAC,EAAE,WAAW,aAAc;AAAA,EAC1B,QAAQ,CAAC;AAAA,EACT,QAAQ;AAAA;AAIZ,iCAAwB,UAAU;AAAA,EAUhC,YAAY,OAAO;AACjB,UAAM;AACN,SAAK,aAAa,OAAM;AAExB,SAAK,sBAAsB,KAAK,oBAAoB,KAAK;AAAA;AAAA,EAG3D,mBAAmB,WAAW;AAC5B,UAAM,EAAE,WAAW,KAAK;AACxB,QAAI,WAAW,UAAU,QAAQ;AAC/B,UAAI,QAAQ;AACV,aAAK;AAAA,aACA;AACL,aAAK;AAAA;AAAA;AAAA;AAAA,EAKX,2BAA2B;AACzB,WAAO,QAAQ,CAAC,UAAU;AACxB,eAAS,iBAAiB,OAAO,KAAK;AAAA;AAAA;AAAA,EAI1C,8BAA8B;AAC5B,WAAO,QAAQ,CAAC,UAAU;AACxB,eAAS,oBAAoB,OAAO,KAAK;AAAA;AAAA;AAAA,EAI7C,oBAAoB,GAAG;AACrB,UAAM,EAAE,gBAAgB,WAAW,KAAK;AACxC,UAAM,EAAE,iBAAiB;AACzB,UAAM,eAAe,aAAa,QAAQ;AAC1C,UAAM,oBAAoB,aACvB,MAAM,cACN,KAAK,CAAC,EAAE,iBAAiB;AACxB,YAAM,OAAO,WAAW;AACxB,aAAO,QAAQ,KAAK,SAAS,EAAE,WAAW,CAAC,KAAK,WAAW,EAAE;AAAA;AAGjE,QAAI,UAAU,CAAC,mBAAmB;AAChC,qBAAe;AAAA;AAAA;AAAA,EAInB,cAAc;AACZ,SAAK;AACL,eAAU,aAAa,KAAK;AAAA;AAAA,EAG9B,eAAe;AACb,UAAM,EAAE,iBAAiB;AACzB,UAAM,eAAe,aAAa,QAAQ;AAC1C,SAAK;AACL,iBAAa,OAAO,cAAc;AAAA;AAAA,EAGpC,SAAS;AACP,UAAM;AAAA,MACJ;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,QACE,KAAK;AAET,QAAI,CAAC;AAAQ,aAAO;AAEpB,UAAM,UACJ,qCAAC,kBAAD;AAAA,MACE,YAAY,EAAE,WAAW;AAAA,MACzB,UAAU,KAAK;AAAA,OAEd,eAAe,qCAAC,YAAD;AAAA,MAAY,QAAQ;AAAA,QACnC;AAIL,QAAI,WAAW;AACb,aAAO,qCAAC,UAAD,MAAW;AAAA;AAGpB,WAAO;AAAA;AAAA;AA7FX;AACS,AADT,UACS,eAAe;AAEf,AAHT,UAGS,eAAe;AAAA,EACpB,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,aAAa;AAAA,EACb,gBAAgB;AAAA,EAChB,gBAAgB,MAAM;AAAA;AAyF1B,UAAU,YAAY;AAAA,EACpB,gBAAgB,UAAU;AAAA,EAC1B,UAAU,UAAU;AAAA,EACpB,aAAa,UAAU;AAAA,EACvB,QAAQ,UAAU;AAAA,EAClB,gBAAgB,UAAU;AAAA,EAC1B,WAAW,UAAU;AAAA;AAIvB,IAAO,oBAAQ;",
6
+ "names": []
7
+ }
package/esm/index.js CHANGED
@@ -1 +1,7 @@
1
- export { DSOverlay, DSOverlay as default } from './DSOverlay.js';
1
+ import * as React from "react";
2
+ export * from "./DSOverlay";
3
+ import { default as default2 } from "./DSOverlay";
4
+ export {
5
+ default2 as default
6
+ };
7
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './DSOverlay';\nexport { default } from './DSOverlay';\n"],
5
+ "mappings": "AAAA;ACAA;AACA;",
6
+ "names": []
7
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-overlay",
3
- "version": "2.2.0-next.4",
3
+ "version": "2.3.0-alpha.2",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Overlay",
6
6
  "module": "./esm/index.js",
@@ -36,9 +36,9 @@
36
36
  "build": "node ../../scripts/build/build.js"
37
37
  },
38
38
  "dependencies": {
39
- "@elliemae/ds-backdrop": "2.2.0-next.4",
40
- "@elliemae/ds-classnames": "2.2.0-next.4",
41
- "@elliemae/ds-portal": "2.2.0-next.4",
39
+ "@elliemae/ds-backdrop": "2.3.0-alpha.2",
40
+ "@elliemae/ds-classnames": "2.3.0-alpha.2",
41
+ "@elliemae/ds-portal": "2.3.0-alpha.2",
42
42
  "prop-types": "~15.7.2"
43
43
  },
44
44
  "peerDependencies": {