@elliemae/ds-popover 2.2.0-alpha.4 → 3.0.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/cjs/Arrow.js +59 -58
- package/cjs/DSPopover.js +138 -126
- package/cjs/Popover.js +62 -69
- package/cjs/PopoverTrigger.js +54 -58
- package/cjs/index.js +22 -35
- package/cjs/usePopover.js +40 -44
- package/cjs/usePopoverProviderState.js +55 -65
- package/cjs/usePopper.js +70 -82
- package/esm/Arrow.js +51 -29
- package/esm/DSPopover.js +117 -95
- package/esm/Popover.js +51 -38
- package/esm/PopoverTrigger.js +44 -29
- package/esm/index.js +4 -7
- package/esm/usePopover.js +33 -15
- package/esm/usePopoverProviderState.js +45 -32
- package/esm/usePopper.js +56 -46
- package/package.json +6 -6
- package/cjs/Arrow.js.map +0 -7
- package/cjs/DSPopover.js.map +0 -7
- package/cjs/Popover.js.map +0 -7
- package/cjs/PopoverTrigger.js.map +0 -7
- package/cjs/index.js.map +0 -7
- package/cjs/usePopover.js.map +0 -7
- package/cjs/usePopoverProviderState.js.map +0 -7
- package/cjs/usePopper.js.map +0 -7
- package/esm/Arrow.js.map +0 -7
- package/esm/DSPopover.js.map +0 -7
- package/esm/Popover.js.map +0 -7
- package/esm/PopoverTrigger.js.map +0 -7
- package/esm/index.js.map +0 -7
- package/esm/usePopover.js.map +0 -7
- package/esm/usePopoverProviderState.js.map +0 -7
- package/esm/usePopper.js.map +0 -7
package/cjs/Arrow.js
CHANGED
|
@@ -1,62 +1,63 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
var
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
var
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
var import_ds_classnames = require("@elliemae/ds-classnames");
|
|
35
|
-
var import_ds_popper = require("@elliemae/ds-popper");
|
|
36
|
-
const ArrowWrapper = (0, import_ds_classnames.aggregatedClasses)("span")("popover", "arrow");
|
|
37
|
-
function Arrow({ style, className, innerRef, blockName = "popover", placement, ...otherProps }) {
|
|
38
|
-
return /* @__PURE__ */ import_react.default.createElement(ArrowWrapper, {
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
4
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
5
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
8
|
+
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
9
|
+
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
10
|
+
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
11
|
+
var react = require('react');
|
|
12
|
+
var dsClassnames = require('@elliemae/ds-classnames');
|
|
13
|
+
var dsPopper = require('@elliemae/ds-popper');
|
|
14
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
15
|
+
|
|
16
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
17
|
+
|
|
18
|
+
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
19
|
+
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
20
|
+
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
|
|
21
|
+
|
|
22
|
+
var _svg;
|
|
23
|
+
|
|
24
|
+
const _excluded = ["style", "className", "innerRef", "blockName", "placement"];
|
|
25
|
+
|
|
26
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
27
|
+
|
|
28
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
29
|
+
const ArrowWrapper = dsClassnames.aggregatedClasses('span')('popover', 'arrow');
|
|
30
|
+
|
|
31
|
+
function Arrow(_ref) {
|
|
32
|
+
let {
|
|
33
|
+
style,
|
|
39
34
|
className,
|
|
40
|
-
"data-placement": placement,
|
|
41
|
-
...otherProps,
|
|
42
35
|
innerRef,
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
36
|
+
blockName = 'popover',
|
|
37
|
+
placement
|
|
38
|
+
} = _ref,
|
|
39
|
+
otherProps = _objectWithoutProperties__default["default"](_ref, _excluded);
|
|
40
|
+
|
|
41
|
+
return /*#__PURE__*/jsxRuntime.jsx(ArrowWrapper, _objectSpread(_objectSpread({
|
|
42
|
+
className: className,
|
|
43
|
+
"data-placement": placement
|
|
44
|
+
}, otherProps), {}, {
|
|
45
|
+
innerRef: innerRef,
|
|
46
|
+
style: _objectSpread(_objectSpread({}, style), dsPopper.getArrowStylesBySize(placement, 25)),
|
|
47
|
+
children: _svg || (_svg = /*#__PURE__*/_jsx__default["default"]("svg", {
|
|
48
|
+
viewBox: "0 0 30 30"
|
|
49
|
+
}, void 0, /*#__PURE__*/_jsx__default["default"]("path", {
|
|
50
|
+
className: "stroke",
|
|
51
|
+
d: "M23.7,27.1L17,19.9C16.5,19.3,15.8,19,15,19s-1.6,0.3-2.1,0.9l-6.6,7.2C5.3,28.1,3.4,29,2,29h26 C26.7,29,24.6,28.1,23.7,27.1z"
|
|
52
|
+
}), /*#__PURE__*/_jsx__default["default"]("path", {
|
|
53
|
+
className: "fill",
|
|
54
|
+
d: "M23,27.8c1.1,1.2,3.4,2.2,5,2.2h2H0h2c1.7,0,3.9-1,5-2.2l6.6-7.2c0.7-0.8,2-0.8,2.7,0L23,27.8L23,27.8z"
|
|
55
|
+
})))
|
|
56
|
+
}));
|
|
56
57
|
}
|
|
57
|
-
|
|
58
|
-
|
|
58
|
+
|
|
59
|
+
var Arrow$1 = /*#__PURE__*/react.forwardRef((props, ref) => /*#__PURE__*/jsxRuntime.jsx(Arrow, _objectSpread(_objectSpread({}, props), {}, {
|
|
59
60
|
innerRef: ref || props.innerRef
|
|
60
|
-
}));
|
|
61
|
-
|
|
62
|
-
|
|
61
|
+
})));
|
|
62
|
+
|
|
63
|
+
module.exports = Arrow$1;
|
package/cjs/DSPopover.js
CHANGED
|
@@ -1,73 +1,75 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
var
|
|
6
|
-
var
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
var
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
PopoverWithSchema: () => PopoverWithSchema,
|
|
33
|
-
default: () => DSPopover_default,
|
|
34
|
-
usePopoverProviderState: () => import_usePopoverProviderState.default,
|
|
35
|
-
usePopper: () => import_usePopper.default
|
|
36
|
-
});
|
|
37
|
-
var React = __toESM(require("react"));
|
|
38
|
-
var import_react = __toESM(require("react"));
|
|
39
|
-
var import_react_desc = require("react-desc");
|
|
40
|
-
var import_ds_utilities = require("@elliemae/ds-utilities");
|
|
41
|
-
var import_ds_hidden = require("@elliemae/ds-hidden");
|
|
42
|
-
var import_Popover = __toESM(require("./Popover"));
|
|
43
|
-
var import_usePopper = __toESM(require("./usePopper"));
|
|
44
|
-
var import_Arrow = __toESM(require("./Arrow"));
|
|
45
|
-
var import_usePopoverProviderState = __toESM(require("./usePopoverProviderState"));
|
|
46
|
-
__reExport(DSPopover_exports, require("@elliemae/ds-popper"));
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
6
|
+
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
7
|
+
require('core-js/modules/web.dom-collections.iterator.js');
|
|
8
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
9
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
10
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
11
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
12
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
13
|
+
require('react');
|
|
14
|
+
var reactDesc = require('react-desc');
|
|
15
|
+
var dsUtilities = require('@elliemae/ds-utilities');
|
|
16
|
+
var dsHidden = require('@elliemae/ds-hidden');
|
|
17
|
+
var Popover = require('./Popover.js');
|
|
18
|
+
var usePopper = require('./usePopper.js');
|
|
19
|
+
var Arrow = require('./Arrow.js');
|
|
20
|
+
var usePopoverProviderState = require('./usePopoverProviderState.js');
|
|
21
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
22
|
+
var dsPopper = require('@elliemae/ds-popper');
|
|
23
|
+
|
|
24
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
25
|
+
|
|
26
|
+
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
27
|
+
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
28
|
+
|
|
29
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
30
|
+
|
|
31
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
47
32
|
const Interaction = {
|
|
48
|
-
CLICK:
|
|
49
|
-
HOVER:
|
|
33
|
+
CLICK: 'click',
|
|
34
|
+
HOVER: 'hover'
|
|
50
35
|
};
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
36
|
+
/* Unstable Popover, not yet fully working */
|
|
37
|
+
|
|
38
|
+
const DSPopover = _ref => {
|
|
39
|
+
let {
|
|
40
|
+
containerProps,
|
|
41
|
+
content,
|
|
42
|
+
// react component inside the popover to render its content
|
|
43
|
+
renderer,
|
|
44
|
+
// function to render the popover component, ex: (popoverProps) => (<div {...popoverProps}></div>)
|
|
45
|
+
visible: visibleProp,
|
|
46
|
+
offset,
|
|
47
|
+
showArrow,
|
|
48
|
+
// popper props options
|
|
49
|
+
placement,
|
|
50
|
+
boundaries,
|
|
51
|
+
// scrollParent | window | viewport
|
|
52
|
+
modifiers,
|
|
53
|
+
referenceEl,
|
|
54
|
+
renderTrigger,
|
|
55
|
+
onClickOutside,
|
|
56
|
+
destroyOnHidden,
|
|
57
|
+
interactionType,
|
|
58
|
+
isOpen,
|
|
59
|
+
style
|
|
60
|
+
} = _ref;
|
|
61
|
+
const {
|
|
62
|
+
visible,
|
|
63
|
+
onShow,
|
|
64
|
+
onHide,
|
|
65
|
+
onToggle
|
|
66
|
+
} = dsHidden.useHiddenController(visibleProp);
|
|
67
|
+
const {
|
|
68
|
+
reference,
|
|
69
|
+
popper,
|
|
70
|
+
arrow,
|
|
71
|
+
popperData
|
|
72
|
+
} = usePopper({
|
|
71
73
|
placement,
|
|
72
74
|
showArrow,
|
|
73
75
|
boundaries,
|
|
@@ -77,79 +79,89 @@ const DSPopover = ({
|
|
|
77
79
|
eventsEnabled: visible,
|
|
78
80
|
isOpen
|
|
79
81
|
});
|
|
80
|
-
const hoverHandlers =
|
|
82
|
+
const hoverHandlers = dsUtilities.useHoverHandlersDelay({
|
|
81
83
|
onMouseOver: onShow,
|
|
82
84
|
onMouseLeave: onHide
|
|
83
85
|
});
|
|
84
86
|
const isPopoverVisible = visible || isOpen;
|
|
85
|
-
return
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
onHide,
|
|
91
|
-
"aria-haspopup": true,
|
|
92
|
-
"aria-expanded": visible
|
|
93
|
-
}), isPopoverVisible && reference.ref && /* @__PURE__ */ import_react.default.createElement(import_Popover.default, {
|
|
94
|
-
containerProps,
|
|
95
|
-
destroyOnHidden,
|
|
96
|
-
interactionType,
|
|
97
|
-
isOpen,
|
|
98
|
-
onClickOutside: (...args) => {
|
|
99
|
-
onClickOutside(...args);
|
|
100
|
-
if (interactionType === "click")
|
|
101
|
-
onHide();
|
|
102
|
-
},
|
|
103
|
-
popperProps: popper,
|
|
104
|
-
renderer: renderer && ((props) => renderer({
|
|
105
|
-
...props,
|
|
87
|
+
return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
88
|
+
children: [renderTrigger(_objectSpread(_objectSpread({}, reference), {}, {
|
|
89
|
+
handlers: interactionType === 'click' ? {
|
|
90
|
+
onClick: onToggle
|
|
91
|
+
} : hoverHandlers,
|
|
106
92
|
onShow,
|
|
107
93
|
onToggle,
|
|
108
|
-
onHide
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
94
|
+
onHide,
|
|
95
|
+
'aria-haspopup': true,
|
|
96
|
+
'aria-expanded': visible
|
|
97
|
+
})), isPopoverVisible && reference.ref && /*#__PURE__*/_jsx__default["default"](Popover, {
|
|
98
|
+
containerProps: containerProps,
|
|
99
|
+
destroyOnHidden: destroyOnHidden,
|
|
100
|
+
interactionType: interactionType,
|
|
101
|
+
isOpen: isOpen,
|
|
102
|
+
onClickOutside: function () {
|
|
103
|
+
onClickOutside(...arguments);
|
|
104
|
+
if (interactionType === 'click') onHide();
|
|
105
|
+
},
|
|
106
|
+
popperProps: popper,
|
|
107
|
+
renderer: renderer && (props => renderer(_objectSpread(_objectSpread({}, props), {}, {
|
|
108
|
+
onShow,
|
|
109
|
+
onToggle,
|
|
110
|
+
onHide
|
|
111
|
+
}))),
|
|
112
|
+
style: style,
|
|
113
|
+
visible: isPopoverVisible
|
|
114
|
+
}, void 0, showArrow && /*#__PURE__*/jsxRuntime.jsx(Arrow, _objectSpread(_objectSpread({}, arrow), {}, {
|
|
115
|
+
placement: popperData.placement
|
|
116
|
+
})), isPopoverVisible && content)]
|
|
117
|
+
});
|
|
116
118
|
};
|
|
119
|
+
|
|
117
120
|
DSPopover.defaultProps = {
|
|
118
121
|
containerProps: {},
|
|
119
|
-
renderer:
|
|
120
|
-
visible:
|
|
121
|
-
offset:
|
|
122
|
+
renderer: undefined,
|
|
123
|
+
visible: undefined,
|
|
124
|
+
offset: undefined,
|
|
122
125
|
showArrow: false,
|
|
123
|
-
placement:
|
|
126
|
+
placement: 'top',
|
|
124
127
|
modifiers: {},
|
|
125
128
|
renderTrigger: () => null,
|
|
126
129
|
onClickOutside: () => null,
|
|
127
130
|
destroyOnHidden: true,
|
|
128
|
-
isOpen:
|
|
131
|
+
isOpen: undefined
|
|
129
132
|
};
|
|
130
133
|
const popoverProps = {
|
|
131
|
-
containerProps:
|
|
132
|
-
destroyOnHidden:
|
|
133
|
-
renderer:
|
|
134
|
-
popperProps:
|
|
135
|
-
visible:
|
|
136
|
-
content:
|
|
137
|
-
onClickOutside:
|
|
138
|
-
interaction:
|
|
139
|
-
offset:
|
|
140
|
-
showArrow:
|
|
141
|
-
placement:
|
|
142
|
-
boundaries:
|
|
143
|
-
modifiers:
|
|
144
|
-
style:
|
|
145
|
-
referenceEl:
|
|
146
|
-
renderTrigger:
|
|
147
|
-
interactionType:
|
|
148
|
-
isOpen:
|
|
134
|
+
containerProps: reactDesc.PropTypes.shape({}).description('Set of Properties attached to the main container'),
|
|
135
|
+
destroyOnHidden: reactDesc.PropTypes.bool.description('destroy popover on hidden or not').defaultValue(true),
|
|
136
|
+
renderer: reactDesc.PropTypes.func.description('custom renderer'),
|
|
137
|
+
popperProps: reactDesc.PropTypes.object.description('Popper props attached to container'),
|
|
138
|
+
visible: reactDesc.PropTypes.bool.description('is visible or not').defaultValue(false),
|
|
139
|
+
content: reactDesc.PropTypes.oneOfType([reactDesc.PropTypes.element, reactDesc.PropTypes.string]).description('popover content'),
|
|
140
|
+
onClickOutside: reactDesc.PropTypes.func.description('function called on click outside'),
|
|
141
|
+
interaction: reactDesc.PropTypes.string.description('interaction type: hover, click'),
|
|
142
|
+
offset: reactDesc.PropTypes.object.description('offset'),
|
|
143
|
+
showArrow: reactDesc.PropTypes.bool.description('show tooltip arrow or not'),
|
|
144
|
+
placement: reactDesc.PropTypes.string.description('popover placement: top, bottom, right, left'),
|
|
145
|
+
boundaries: reactDesc.PropTypes.string.description('popover boundaries'),
|
|
146
|
+
modifiers: reactDesc.PropTypes.object.description('modifiers'),
|
|
147
|
+
style: reactDesc.PropTypes.object.description('css style object'),
|
|
148
|
+
referenceEl: reactDesc.PropTypes.element.description('reference element'),
|
|
149
|
+
renderTrigger: reactDesc.PropTypes.func.description('render trigger element'),
|
|
150
|
+
interactionType: reactDesc.PropTypes.string.description('interaction type'),
|
|
151
|
+
isOpen: reactDesc.PropTypes.bool.description('open or not').defaultValue(false)
|
|
149
152
|
};
|
|
150
|
-
|
|
151
|
-
const PopoverWithSchema = (0, import_react_desc.describe)(DSPopover);
|
|
153
|
+
const PopoverWithSchema = reactDesc.describe(DSPopover);
|
|
152
154
|
PopoverWithSchema.propTypes = popoverProps;
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
155
|
+
|
|
156
|
+
exports.usePopper = usePopper;
|
|
157
|
+
exports.usePopoverProviderState = usePopoverProviderState;
|
|
158
|
+
exports.DSPopover = DSPopover;
|
|
159
|
+
exports.Interaction = Interaction;
|
|
160
|
+
exports.PopoverWithSchema = PopoverWithSchema;
|
|
161
|
+
exports["default"] = DSPopover;
|
|
162
|
+
Object.keys(dsPopper).forEach(function (k) {
|
|
163
|
+
if (k !== 'default' && !exports.hasOwnProperty(k)) Object.defineProperty(exports, k, {
|
|
164
|
+
enumerable: true,
|
|
165
|
+
get: function () { return dsPopper[k]; }
|
|
166
|
+
});
|
|
167
|
+
});
|
package/cjs/Popover.js
CHANGED
|
@@ -1,73 +1,66 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
var
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
var
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
};
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
var
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
var
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
const popoverRef = (0, import_react.useRef)();
|
|
53
|
-
const hiddenTransitionProps = (0, import_ds_hidden.useHiddenTransition)({ visible });
|
|
54
|
-
const popoverProps = (0, import_ds_utilities.removeUndefinedProperties)({
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
require('core-js/modules/esnext.async-iterator.filter.js');
|
|
4
|
+
require('core-js/modules/esnext.iterator.constructor.js');
|
|
5
|
+
require('core-js/modules/esnext.iterator.filter.js');
|
|
6
|
+
require('core-js/modules/esnext.async-iterator.for-each.js');
|
|
7
|
+
require('core-js/modules/esnext.iterator.for-each.js');
|
|
8
|
+
var _jsx = require('@babel/runtime/helpers/jsx');
|
|
9
|
+
var _defineProperty = require('@babel/runtime/helpers/defineProperty');
|
|
10
|
+
var _objectWithoutProperties = require('@babel/runtime/helpers/objectWithoutProperties');
|
|
11
|
+
var react = require('react');
|
|
12
|
+
var lodash = require('lodash');
|
|
13
|
+
var dsClassnames = require('@elliemae/ds-classnames');
|
|
14
|
+
var dsUtilities = require('@elliemae/ds-utilities');
|
|
15
|
+
var dsHidden = require('@elliemae/ds-hidden');
|
|
16
|
+
var DSPortal = require('@elliemae/ds-portal');
|
|
17
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
18
|
+
|
|
19
|
+
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
|
|
20
|
+
|
|
21
|
+
var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
|
|
22
|
+
var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
|
|
23
|
+
var _objectWithoutProperties__default = /*#__PURE__*/_interopDefaultLegacy(_objectWithoutProperties);
|
|
24
|
+
var DSPortal__default = /*#__PURE__*/_interopDefaultLegacy(DSPortal);
|
|
25
|
+
|
|
26
|
+
const _excluded = ["containerProps", "destroyOnHidden", "renderer", "popperProps", "visible", "content", "onClickOutside", "style"];
|
|
27
|
+
|
|
28
|
+
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
29
|
+
|
|
30
|
+
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
31
|
+
const blockName = 'popover';
|
|
32
|
+
const PopoverComponent = dsClassnames.aggregatedClasses('div')(blockName);
|
|
33
|
+
|
|
34
|
+
function Popover(_ref) {
|
|
35
|
+
let {
|
|
36
|
+
containerProps,
|
|
37
|
+
destroyOnHidden = true,
|
|
38
|
+
renderer = undefined,
|
|
39
|
+
popperProps = {},
|
|
40
|
+
visible = false,
|
|
41
|
+
content = undefined,
|
|
42
|
+
onClickOutside = () => null,
|
|
43
|
+
style
|
|
44
|
+
} = _ref,
|
|
45
|
+
otherProps = _objectWithoutProperties__default["default"](_ref, _excluded);
|
|
46
|
+
|
|
47
|
+
const popoverRef = react.useRef();
|
|
48
|
+
const hiddenTransitionProps = dsHidden.useHiddenTransition({
|
|
49
|
+
visible
|
|
50
|
+
});
|
|
51
|
+
const popoverProps = dsUtilities.removeUndefinedProperties(_objectSpread(_objectSpread({
|
|
55
52
|
containerprops: containerProps,
|
|
56
53
|
content,
|
|
57
|
-
ref: popoverRef
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
}
|
|
61
|
-
(0,
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
}, (0, import_ds_utilities.isFunction)(renderer) ? renderer(popoverProps) : /* @__PURE__ */ import_react.default.createElement(PopoverComponent, {
|
|
67
|
-
...popoverProps,
|
|
68
|
-
style: wrapStyle
|
|
54
|
+
ref: popoverRef
|
|
55
|
+
}, otherProps), hiddenTransitionProps));
|
|
56
|
+
dsUtilities.useOnClickOutside(popoverRef, onClickOutside);
|
|
57
|
+
const wrapStyle = lodash.omit(style, 'zIndex') || {};
|
|
58
|
+
return destroyOnHidden && !hiddenTransitionProps.destroyed && /*#__PURE__*/_jsx__default["default"](DSPortal__default["default"], {}, void 0, /*#__PURE__*/jsxRuntime.jsx("div", _objectSpread(_objectSpread({}, popperProps), {}, {
|
|
59
|
+
style: _objectSpread(_objectSpread({}, style), popperProps.style),
|
|
60
|
+
children: dsUtilities.isFunction(renderer) ? renderer(popoverProps) : /*#__PURE__*/jsxRuntime.jsx(PopoverComponent, _objectSpread(_objectSpread({}, popoverProps), {}, {
|
|
61
|
+
style: wrapStyle
|
|
62
|
+
}))
|
|
69
63
|
})));
|
|
70
64
|
}
|
|
71
|
-
|
|
72
|
-
module.exports =
|
|
73
|
-
//# sourceMappingURL=Popover.js.map
|
|
65
|
+
|
|
66
|
+
module.exports = Popover;
|