@elliemae/ds-popover 3.0.0-alpha.0 → 3.0.0-alpha.1
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/Arrow.js +38 -12
- package/dist/cjs/Arrow.js.map +1 -1
- package/dist/cjs/DSPopover.js +23 -9
- package/dist/cjs/DSPopover.js.map +1 -1
- package/dist/cjs/Popover.js +56 -22
- package/dist/cjs/Popover.js.map +1 -1
- package/dist/cjs/PopoverTrigger.js +36 -8
- package/dist/cjs/PopoverTrigger.js.map +1 -1
- package/dist/cjs/usePopover.js +34 -8
- package/dist/cjs/usePopover.js.map +1 -1
- package/dist/cjs/usePopoverProviderState.js +20 -7
- package/dist/cjs/usePopoverProviderState.js.map +1 -1
- package/dist/cjs/usePopper.js +24 -8
- package/dist/cjs/usePopper.js.map +1 -1
- package/dist/esm/Arrow.js +40 -12
- package/dist/esm/Arrow.js.map +1 -1
- package/dist/esm/DSPopover.js +25 -9
- package/dist/esm/DSPopover.js.map +1 -1
- package/dist/esm/Popover.js +58 -22
- package/dist/esm/Popover.js.map +1 -1
- package/dist/esm/PopoverTrigger.js +38 -8
- package/dist/esm/PopoverTrigger.js.map +1 -1
- package/dist/esm/usePopover.js +36 -8
- package/dist/esm/usePopover.js.map +1 -1
- package/dist/esm/usePopoverProviderState.js +22 -7
- package/dist/esm/usePopoverProviderState.js.map +1 -1
- package/dist/esm/usePopper.js +26 -8
- package/dist/esm/usePopper.js.map +1 -1
- package/package.json +7 -6
- package/dist/types/Arrow.d.ts +0 -3
- package/dist/types/DSPopover.d.ts +0 -150
- package/dist/types/Popover.d.ts +0 -13
- package/dist/types/PopoverTrigger.d.ts +0 -10
- package/dist/types/index.d.ts +0 -2
- package/dist/types/usePopover.d.ts +0 -21
- package/dist/types/usePopoverProviderState.d.ts +0 -19
- package/dist/types/usePopper.d.ts +0 -28
package/dist/cjs/Arrow.js
CHANGED
|
@@ -1,10 +1,39 @@
|
|
|
1
1
|
var __create = Object.create;
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
8
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
9
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
12
|
+
var __spreadValues = (a, b) => {
|
|
13
|
+
for (var prop in b || (b = {}))
|
|
14
|
+
if (__hasOwnProp.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
if (__getOwnPropSymbols)
|
|
17
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
18
|
+
if (__propIsEnum.call(b, prop))
|
|
19
|
+
__defNormalProp(a, prop, b[prop]);
|
|
20
|
+
}
|
|
21
|
+
return a;
|
|
22
|
+
};
|
|
23
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
7
24
|
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
25
|
+
var __objRest = (source, exclude) => {
|
|
26
|
+
var target = {};
|
|
27
|
+
for (var prop in source)
|
|
28
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
29
|
+
target[prop] = source[prop];
|
|
30
|
+
if (source != null && __getOwnPropSymbols)
|
|
31
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
32
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
33
|
+
target[prop] = source[prop];
|
|
34
|
+
}
|
|
35
|
+
return target;
|
|
36
|
+
};
|
|
8
37
|
var __export = (target, all) => {
|
|
9
38
|
for (var name in all)
|
|
10
39
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -34,17 +63,15 @@ var import_react = __toESM(require("react"));
|
|
|
34
63
|
var import_ds_classnames = require("@elliemae/ds-classnames");
|
|
35
64
|
var import_ds_popper = require("@elliemae/ds-popper");
|
|
36
65
|
const ArrowWrapper = (0, import_ds_classnames.aggregatedClasses)("span")("popover", "arrow");
|
|
37
|
-
function Arrow(
|
|
38
|
-
|
|
66
|
+
function Arrow(_a) {
|
|
67
|
+
var _b = _a, { style, className, innerRef, blockName = "popover", placement } = _b, otherProps = __objRest(_b, ["style", "className", "innerRef", "blockName", "placement"]);
|
|
68
|
+
return /* @__PURE__ */ import_react.default.createElement(ArrowWrapper, __spreadProps(__spreadValues({
|
|
39
69
|
className,
|
|
40
|
-
"data-placement": placement
|
|
41
|
-
|
|
70
|
+
"data-placement": placement
|
|
71
|
+
}, otherProps), {
|
|
42
72
|
innerRef,
|
|
43
|
-
style: {
|
|
44
|
-
|
|
45
|
-
...(0, import_ds_popper.getArrowStylesBySize)(placement, 25)
|
|
46
|
-
}
|
|
47
|
-
}, /* @__PURE__ */ import_react.default.createElement("svg", {
|
|
73
|
+
style: __spreadValues(__spreadValues({}, style), (0, import_ds_popper.getArrowStylesBySize)(placement, 25))
|
|
74
|
+
}), /* @__PURE__ */ import_react.default.createElement("svg", {
|
|
48
75
|
viewBox: "0 0 30 30"
|
|
49
76
|
}, /* @__PURE__ */ import_react.default.createElement("path", {
|
|
50
77
|
className: "stroke",
|
|
@@ -54,9 +81,8 @@ function Arrow({ style, className, innerRef, blockName = "popover", placement, .
|
|
|
54
81
|
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
82
|
})));
|
|
56
83
|
}
|
|
57
|
-
var Arrow_default = (0, import_react.forwardRef)((props, ref) => /* @__PURE__ */ import_react.default.createElement(Arrow, {
|
|
58
|
-
...props,
|
|
84
|
+
var Arrow_default = (0, import_react.forwardRef)((props, ref) => /* @__PURE__ */ import_react.default.createElement(Arrow, __spreadProps(__spreadValues({}, props), {
|
|
59
85
|
innerRef: ref || props.innerRef
|
|
60
|
-
}));
|
|
86
|
+
})));
|
|
61
87
|
module.exports = __toCommonJS(Arrow_exports);
|
|
62
88
|
//# sourceMappingURL=Arrow.js.map
|
package/dist/cjs/Arrow.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Arrow.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { forwardRef } from 'react';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { getArrowStylesBySize } from '@elliemae/ds-popper';\n\nconst ArrowWrapper = aggregatedClasses('span')('popover', 'arrow');\nfunction Arrow({ style, className, innerRef, blockName = 'popover', placement, ...otherProps }) {\n return (\n <ArrowWrapper\n className={className}\n data-placement={placement}\n {...otherProps}\n innerRef={innerRef}\n style={{\n ...style,\n ...getArrowStylesBySize(placement, 25),\n }}\n >\n <svg viewBox=\"0 0 30 30\">\n <path\n className=\"stroke\"\n 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\n C26.7,29,24.6,28.1,23.7,27.1z\"\n />\n <path\n className=\"fill\"\n 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\"\n />\n </svg>\n </ArrowWrapper>\n );\n}\n\nexport default forwardRef((props, ref) => <Arrow {...props} innerRef={ref || props.innerRef} />);\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkC;AAClC,2BAAkC;AAClC,uBAAqC;AAErC,MAAM,eAAe,4CAAkB,QAAQ,WAAW;AAC1D,eAAe,IAAiF;AAAjF,eAAE,SAAO,WAAW,UAAU,YAAY,WAAW,cAArD,IAAmE,uBAAnE,IAAmE,CAAjE,SAAO,aAAW,YAAU,aAAuB;AAClE,SACE,mDAAC,cAAD;AAAA,IACE;AAAA,IACA,kBAAgB;AAAA,KACZ,aAHN;AAAA,IAIE;AAAA,IACA,OAAO,kCACF,QACA,2CAAqB,WAAW;AAAA,MAGrC,mDAAC,OAAD;AAAA,IAAK,SAAQ;AAAA,KACX,mDAAC,QAAD;AAAA,IACE,WAAU;AAAA,IACV,GAAE;AAAA,MAGJ,mDAAC,QAAD;AAAA,IACE,WAAU;AAAA,IACV,GAAE;AAAA;AAAA;AAOZ,IAAO,gBAAQ,6BAAW,CAAC,OAAO,QAAQ,mDAAC,OAAD,iCAAW,QAAX;AAAA,EAAkB,UAAU,OAAO,MAAM;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/DSPopover.js
CHANGED
|
@@ -1,9 +1,26 @@
|
|
|
1
1
|
var __create = Object.create;
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
8
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
9
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
12
|
+
var __spreadValues = (a, b) => {
|
|
13
|
+
for (var prop in b || (b = {}))
|
|
14
|
+
if (__hasOwnProp.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
if (__getOwnPropSymbols)
|
|
17
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
18
|
+
if (__propIsEnum.call(b, prop))
|
|
19
|
+
__defNormalProp(a, prop, b[prop]);
|
|
20
|
+
}
|
|
21
|
+
return a;
|
|
22
|
+
};
|
|
23
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
7
24
|
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
25
|
var __export = (target, all) => {
|
|
9
26
|
for (var name in all)
|
|
@@ -82,15 +99,14 @@ const DSPopover = ({
|
|
|
82
99
|
onMouseLeave: onHide
|
|
83
100
|
});
|
|
84
101
|
const isPopoverVisible = visible || isOpen;
|
|
85
|
-
return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, renderTrigger({
|
|
86
|
-
...reference,
|
|
102
|
+
return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, renderTrigger(__spreadProps(__spreadValues({}, reference), {
|
|
87
103
|
handlers: interactionType === "click" ? { onClick: onToggle } : hoverHandlers,
|
|
88
104
|
onShow,
|
|
89
105
|
onToggle,
|
|
90
106
|
onHide,
|
|
91
107
|
"aria-haspopup": true,
|
|
92
108
|
"aria-expanded": visible
|
|
93
|
-
}), isPopoverVisible && reference.ref && /* @__PURE__ */ import_react.default.createElement(import_Popover.default, {
|
|
109
|
+
})), isPopoverVisible && reference.ref && /* @__PURE__ */ import_react.default.createElement(import_Popover.default, {
|
|
94
110
|
containerProps,
|
|
95
111
|
destroyOnHidden,
|
|
96
112
|
interactionType,
|
|
@@ -101,18 +117,16 @@ const DSPopover = ({
|
|
|
101
117
|
onHide();
|
|
102
118
|
},
|
|
103
119
|
popperProps: popper,
|
|
104
|
-
renderer: renderer && ((props) => renderer({
|
|
105
|
-
...props,
|
|
120
|
+
renderer: renderer && ((props) => renderer(__spreadProps(__spreadValues({}, props), {
|
|
106
121
|
onShow,
|
|
107
122
|
onToggle,
|
|
108
123
|
onHide
|
|
109
|
-
})),
|
|
124
|
+
}))),
|
|
110
125
|
style,
|
|
111
126
|
visible: isPopoverVisible
|
|
112
|
-
}, showArrow && /* @__PURE__ */ import_react.default.createElement(import_Arrow.default, {
|
|
113
|
-
...arrow,
|
|
127
|
+
}, showArrow && /* @__PURE__ */ import_react.default.createElement(import_Arrow.default, __spreadProps(__spreadValues({}, arrow), {
|
|
114
128
|
placement: popperData.placement
|
|
115
|
-
}), isPopoverVisible && content));
|
|
129
|
+
})), isPopoverVisible && content));
|
|
116
130
|
};
|
|
117
131
|
DSPopover.defaultProps = {
|
|
118
132
|
containerProps: {},
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/DSPopover.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["/* eslint-disable max-lines */\nimport React from 'react';\nimport { PropTypes, describe } from 'react-desc';\nimport { useHoverHandlersDelay } from '@elliemae/ds-utilities';\nimport { useHiddenController } from '@elliemae/ds-hidden';\nimport Popover from './Popover';\nimport usePopper from './usePopper';\nimport Arrow from './Arrow';\nimport usePopoverProviderState from './usePopoverProviderState';\n\nexport * from '@elliemae/ds-popper';\nexport const Interaction = {\n CLICK: 'click',\n HOVER: 'hover',\n};\n\n/* Unstable Popover, not yet fully working */\nconst DSPopover = ({\n containerProps,\n content, // react component inside the popover to render its content\n renderer, // function to render the popover component, ex: (popoverProps) => (<div {...popoverProps}></div>)\n visible: visibleProp,\n offset,\n showArrow,\n // popper props options\n placement,\n boundaries, // scrollParent | window | viewport\n modifiers,\n referenceEl,\n renderTrigger,\n onClickOutside,\n destroyOnHidden,\n interactionType,\n isOpen,\n style,\n}) => {\n const { visible, onShow, onHide, onToggle } = useHiddenController(visibleProp);\n\n const { reference, popper, arrow, popperData } = usePopper({\n placement,\n showArrow,\n boundaries,\n modifiers,\n offset,\n referenceEl,\n eventsEnabled: visible,\n isOpen,\n });\n\n const hoverHandlers = useHoverHandlersDelay({\n onMouseOver: onShow,\n onMouseLeave: onHide,\n });\n const isPopoverVisible = visible || isOpen;\n return (\n <>\n {renderTrigger({\n ...reference,\n handlers: interactionType === 'click' ? { onClick: onToggle } : hoverHandlers,\n onShow,\n onToggle,\n onHide,\n 'aria-haspopup': true,\n 'aria-expanded': visible,\n })}\n {isPopoverVisible && reference.ref && (\n <Popover\n containerProps={containerProps}\n destroyOnHidden={destroyOnHidden}\n interactionType={interactionType}\n isOpen={isOpen}\n onClickOutside={(...args) => {\n onClickOutside(...args);\n if (interactionType === 'click') onHide();\n }}\n popperProps={popper}\n renderer={\n renderer &&\n ((props) =>\n renderer({\n ...props,\n onShow,\n onToggle,\n onHide,\n }))\n }\n style={style}\n visible={isPopoverVisible}\n >\n {showArrow && <Arrow {...arrow} placement={popperData.placement} />}\n {isPopoverVisible && content}\n </Popover>\n )}\n </>\n );\n};\n\nDSPopover.defaultProps = {\n containerProps: {},\n renderer: undefined,\n visible: undefined,\n offset: undefined,\n showArrow: false,\n placement: 'top',\n modifiers: {},\n renderTrigger: () => null,\n onClickOutside: () => null,\n destroyOnHidden: true,\n isOpen: undefined,\n};\n\nconst popoverProps = {\n containerProps: PropTypes.shape({}).description('Set of Properties attached to the main container'),\n destroyOnHidden: PropTypes.bool.description('destroy popover on hidden or not').defaultValue(true),\n renderer: PropTypes.func.description('custom renderer'),\n popperProps: PropTypes.object.description('Popper props attached to container'),\n visible: PropTypes.bool.description('is visible or not').defaultValue(false),\n content: PropTypes.oneOfType([PropTypes.element, PropTypes.string]).description('popover content'),\n onClickOutside: PropTypes.func.description('function called on click outside'),\n interaction: PropTypes.string.description('interaction type: hover, click'),\n offset: PropTypes.object.description('offset'),\n showArrow: PropTypes.bool.description('show tooltip arrow or not'),\n placement: PropTypes.string.description('popover placement: top, bottom, right, left'),\n boundaries: PropTypes.string.description('popover boundaries'),\n modifiers: PropTypes.object.description('modifiers'),\n style: PropTypes.object.description('css style object'),\n referenceEl: PropTypes.element.description('reference element'),\n renderTrigger: PropTypes.func.description('render trigger element'),\n interactionType: PropTypes.string.description('interaction type'),\n isOpen: PropTypes.bool.description('open or not').defaultValue(false),\n};\n\nDSPopover.propTypes = popoverProps;\n\nconst PopoverWithSchema = describe(DSPopover);\nPopoverWithSchema.propTypes = popoverProps;\n\nexport { DSPopover, usePopper, usePopoverProviderState, PopoverWithSchema };\n\nexport default DSPopover;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/Popover.js
CHANGED
|
@@ -1,10 +1,39 @@
|
|
|
1
1
|
var __create = Object.create;
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
8
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
9
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
12
|
+
var __spreadValues = (a, b) => {
|
|
13
|
+
for (var prop in b || (b = {}))
|
|
14
|
+
if (__hasOwnProp.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
if (__getOwnPropSymbols)
|
|
17
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
18
|
+
if (__propIsEnum.call(b, prop))
|
|
19
|
+
__defNormalProp(a, prop, b[prop]);
|
|
20
|
+
}
|
|
21
|
+
return a;
|
|
22
|
+
};
|
|
23
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
7
24
|
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
25
|
+
var __objRest = (source, exclude) => {
|
|
26
|
+
var target = {};
|
|
27
|
+
for (var prop in source)
|
|
28
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
29
|
+
target[prop] = source[prop];
|
|
30
|
+
if (source != null && __getOwnPropSymbols)
|
|
31
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
32
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
33
|
+
target[prop] = source[prop];
|
|
34
|
+
}
|
|
35
|
+
return target;
|
|
36
|
+
};
|
|
8
37
|
var __export = (target, all) => {
|
|
9
38
|
for (var name in all)
|
|
10
39
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -38,35 +67,40 @@ var import_ds_hidden = require("@elliemae/ds-hidden");
|
|
|
38
67
|
var import_ds_portal = __toESM(require("@elliemae/ds-portal"));
|
|
39
68
|
const blockName = "popover";
|
|
40
69
|
const PopoverComponent = (0, import_ds_classnames.aggregatedClasses)("div")(blockName);
|
|
41
|
-
function Popover({
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
}
|
|
70
|
+
function Popover(_a) {
|
|
71
|
+
var _b = _a, {
|
|
72
|
+
containerProps,
|
|
73
|
+
destroyOnHidden = true,
|
|
74
|
+
renderer = void 0,
|
|
75
|
+
popperProps = {},
|
|
76
|
+
visible = false,
|
|
77
|
+
content = void 0,
|
|
78
|
+
onClickOutside = () => null,
|
|
79
|
+
style
|
|
80
|
+
} = _b, otherProps = __objRest(_b, [
|
|
81
|
+
"containerProps",
|
|
82
|
+
"destroyOnHidden",
|
|
83
|
+
"renderer",
|
|
84
|
+
"popperProps",
|
|
85
|
+
"visible",
|
|
86
|
+
"content",
|
|
87
|
+
"onClickOutside",
|
|
88
|
+
"style"
|
|
89
|
+
]);
|
|
52
90
|
const popoverRef = (0, import_react.useRef)();
|
|
53
91
|
const hiddenTransitionProps = (0, import_ds_hidden.useHiddenTransition)({ visible });
|
|
54
|
-
const popoverProps = (0, import_ds_utilities.removeUndefinedProperties)({
|
|
92
|
+
const popoverProps = (0, import_ds_utilities.removeUndefinedProperties)(__spreadValues(__spreadValues({
|
|
55
93
|
containerprops: containerProps,
|
|
56
94
|
content,
|
|
57
|
-
ref: popoverRef
|
|
58
|
-
|
|
59
|
-
...hiddenTransitionProps
|
|
60
|
-
});
|
|
95
|
+
ref: popoverRef
|
|
96
|
+
}, otherProps), hiddenTransitionProps));
|
|
61
97
|
(0, import_ds_utilities.useOnClickOutside)(popoverRef, onClickOutside);
|
|
62
98
|
const wrapStyle = (0, import_lodash.omit)(style, "zIndex") || {};
|
|
63
|
-
return destroyOnHidden && !hiddenTransitionProps.destroyed && /* @__PURE__ */ import_react.default.createElement(import_ds_portal.default, null, /* @__PURE__ */ import_react.default.createElement("div", {
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
}, (0, import_ds_utilities.isFunction)(renderer) ? renderer(popoverProps) : /* @__PURE__ */ import_react.default.createElement(PopoverComponent, {
|
|
67
|
-
...popoverProps,
|
|
99
|
+
return destroyOnHidden && !hiddenTransitionProps.destroyed && /* @__PURE__ */ import_react.default.createElement(import_ds_portal.default, null, /* @__PURE__ */ import_react.default.createElement("div", __spreadProps(__spreadValues({}, popperProps), {
|
|
100
|
+
style: __spreadValues(__spreadValues({}, style), popperProps.style)
|
|
101
|
+
}), (0, import_ds_utilities.isFunction)(renderer) ? renderer(popoverProps) : /* @__PURE__ */ import_react.default.createElement(PopoverComponent, __spreadProps(__spreadValues({}, popoverProps), {
|
|
68
102
|
style: wrapStyle
|
|
69
|
-
})));
|
|
103
|
+
}))));
|
|
70
104
|
}
|
|
71
105
|
var Popover_default = Popover;
|
|
72
106
|
module.exports = __toCommonJS(Popover_exports);
|
package/dist/cjs/Popover.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Popover.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React, { useRef } from 'react';\nimport { omit } from 'lodash';\nimport { aggregatedClasses } from '@elliemae/ds-classnames';\nimport { isFunction, removeUndefinedProperties, useOnClickOutside } from '@elliemae/ds-utilities';\nimport { useHiddenTransition } from '@elliemae/ds-hidden';\nimport DSPortal from '@elliemae/ds-portal';\n\nconst blockName = 'popover';\nconst PopoverComponent = aggregatedClasses('div')(blockName);\n\nfunction Popover({\n containerProps,\n destroyOnHidden = true,\n renderer = undefined,\n popperProps = {},\n visible = false,\n content = undefined,\n onClickOutside = () => null,\n style,\n ...otherProps\n}) {\n const popoverRef = useRef();\n const hiddenTransitionProps = useHiddenTransition({ visible });\n const popoverProps = removeUndefinedProperties({\n containerprops: containerProps,\n content,\n ref: popoverRef,\n ...otherProps,\n ...hiddenTransitionProps,\n });\n\n useOnClickOutside(popoverRef, onClickOutside);\n\n const wrapStyle = omit(style, 'zIndex') || {};\n return (\n destroyOnHidden &&\n !hiddenTransitionProps.destroyed && (\n <DSPortal>\n <div {...popperProps} style={{ ...style, ...popperProps.style }}>\n {isFunction(renderer) ? renderer(popoverProps) : <PopoverComponent {...popoverProps} style={wrapStyle} />}\n </div>\n </DSPortal>\n )\n );\n}\n\nexport default Popover;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA8B;AAC9B,oBAAqB;AACrB,2BAAkC;AAClC,0BAAyE;AACzE,uBAAoC;AACpC,uBAAqB;AAErB,MAAM,YAAY;AAClB,MAAM,mBAAmB,4CAAkB,OAAO;AAElD,iBAAiB,IAUd;AAVc,eACf;AAAA;AAAA,IACA,kBAAkB;AAAA,IAClB,WAAW;AAAA,IACX,cAAc;AAAA,IACd,UAAU;AAAA,IACV,UAAU;AAAA,IACV,iBAAiB,MAAM;AAAA,IACvB;AAAA,MARe,IASZ,uBATY,IASZ;AAAA,IARH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGA,QAAM,aAAa;AACnB,QAAM,wBAAwB,0CAAoB,EAAE;AACpD,QAAM,eAAe,mDAA0B;AAAA,IAC7C,gBAAgB;AAAA,IAChB;AAAA,IACA,KAAK;AAAA,KACF,aACA;AAGL,6CAAkB,YAAY;AAE9B,QAAM,YAAY,wBAAK,OAAO,aAAa;AAC3C,SACE,mBACA,CAAC,sBAAsB,aACrB,mDAAC,0BAAD,MACE,mDAAC,OAAD,iCAAS,cAAT;AAAA,IAAsB,OAAO,kCAAK,QAAU,YAAY;AAAA,MACrD,oCAAW,YAAY,SAAS,gBAAgB,mDAAC,kBAAD,iCAAsB,eAAtB;AAAA,IAAoC,OAAO;AAAA;AAAA;AAOtG,IAAO,kBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,10 +1,39 @@
|
|
|
1
1
|
var __create = Object.create;
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
8
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
9
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
12
|
+
var __spreadValues = (a, b) => {
|
|
13
|
+
for (var prop in b || (b = {}))
|
|
14
|
+
if (__hasOwnProp.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
if (__getOwnPropSymbols)
|
|
17
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
18
|
+
if (__propIsEnum.call(b, prop))
|
|
19
|
+
__defNormalProp(a, prop, b[prop]);
|
|
20
|
+
}
|
|
21
|
+
return a;
|
|
22
|
+
};
|
|
23
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
7
24
|
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
25
|
+
var __objRest = (source, exclude) => {
|
|
26
|
+
var target = {};
|
|
27
|
+
for (var prop in source)
|
|
28
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
29
|
+
target[prop] = source[prop];
|
|
30
|
+
if (source != null && __getOwnPropSymbols)
|
|
31
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
32
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
33
|
+
target[prop] = source[prop];
|
|
34
|
+
}
|
|
35
|
+
return target;
|
|
36
|
+
};
|
|
8
37
|
var __export = (target, all) => {
|
|
9
38
|
for (var name in all)
|
|
10
39
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -55,17 +84,16 @@ function useHiddenTrigger({
|
|
|
55
84
|
onMouseLeave: onHide
|
|
56
85
|
}
|
|
57
86
|
};
|
|
58
|
-
return {
|
|
59
|
-
"aria-expanded": visible
|
|
60
|
-
|
|
87
|
+
return __spreadProps(__spreadValues({
|
|
88
|
+
"aria-expanded": visible
|
|
89
|
+
}, handlers[interaction]), {
|
|
61
90
|
"aria-controls": hiddenId
|
|
62
|
-
};
|
|
91
|
+
});
|
|
63
92
|
}
|
|
64
|
-
function PopoverTrigger(
|
|
93
|
+
function PopoverTrigger(_a) {
|
|
94
|
+
var _b = _a, { as: Component } = _b, props = __objRest(_b, ["as"]);
|
|
65
95
|
const hiddenTriggerProps = useHiddenTrigger(props);
|
|
66
|
-
return /* @__PURE__ */ import_react.default.createElement(Component, {
|
|
67
|
-
...hiddenTriggerProps
|
|
68
|
-
});
|
|
96
|
+
return /* @__PURE__ */ import_react.default.createElement(Component, __spreadValues({}, hiddenTriggerProps));
|
|
69
97
|
}
|
|
70
98
|
var PopoverTrigger_default = PopoverTrigger;
|
|
71
99
|
module.exports = __toCommonJS(PopoverTrigger_exports);
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/PopoverTrigger.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import React from 'react';\n\nexport const Interaction = {\n CLICK: 'click',\n HOVER: 'hover',\n};\n\nconst noop = () => {};\n\nfunction useHiddenTrigger({\n hiddenId,\n visible = false,\n interaction = 'click',\n onToggle = noop,\n onShow = noop,\n onHide = noop,\n}) {\n const handlers = {\n [Interaction.CLICK]: {\n onClick: onToggle,\n },\n [Interaction.HOVER]: {\n onMouseEnter: onShow,\n onMouseLeave: onHide,\n },\n };\n return {\n 'aria-expanded': visible,\n ...handlers[interaction],\n 'aria-controls': hiddenId,\n };\n}\n\nfunction PopoverTrigger({ as: Component, ...props }) {\n const hiddenTriggerProps = useHiddenTrigger(props);\n\n return <Component {...hiddenTriggerProps} />;\n}\n\nexport default PopoverTrigger;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAkB;AAEX,MAAM,cAAc;AAAA,EACzB,OAAO;AAAA,EACP,OAAO;AAAA;AAGT,MAAM,OAAO,MAAM;AAAA;AAEnB,0BAA0B;AAAA,EACxB;AAAA,EACA,UAAU;AAAA,EACV,cAAc;AAAA,EACd,WAAW;AAAA,EACX,SAAS;AAAA,EACT,SAAS;AAAA,GACR;AACD,QAAM,WAAW;AAAA,KACd,YAAY,QAAQ;AAAA,MACnB,SAAS;AAAA;AAAA,KAEV,YAAY,QAAQ;AAAA,MACnB,cAAc;AAAA,MACd,cAAc;AAAA;AAAA;AAGlB,SAAO;AAAA,IACL,iBAAiB;AAAA,KACd,SAAS,eAFP;AAAA,IAGL,iBAAiB;AAAA;AAAA;AAIrB,wBAAwB,IAA6B;AAA7B,eAAE,MAAI,cAAN,IAAoB,kBAApB,IAAoB,CAAlB;AACxB,QAAM,qBAAqB,iBAAiB;AAE5C,SAAO,mDAAC,WAAD,mBAAe;AAAA;AAGxB,IAAO,yBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/usePopover.js
CHANGED
|
@@ -2,9 +2,35 @@ var __create = Object.create;
|
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
4
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
6
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
7
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
9
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
10
|
+
var __spreadValues = (a, b) => {
|
|
11
|
+
for (var prop in b || (b = {}))
|
|
12
|
+
if (__hasOwnProp.call(b, prop))
|
|
13
|
+
__defNormalProp(a, prop, b[prop]);
|
|
14
|
+
if (__getOwnPropSymbols)
|
|
15
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
16
|
+
if (__propIsEnum.call(b, prop))
|
|
17
|
+
__defNormalProp(a, prop, b[prop]);
|
|
18
|
+
}
|
|
19
|
+
return a;
|
|
20
|
+
};
|
|
7
21
|
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
22
|
+
var __objRest = (source, exclude) => {
|
|
23
|
+
var target = {};
|
|
24
|
+
for (var prop in source)
|
|
25
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
26
|
+
target[prop] = source[prop];
|
|
27
|
+
if (source != null && __getOwnPropSymbols)
|
|
28
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
29
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
30
|
+
target[prop] = source[prop];
|
|
31
|
+
}
|
|
32
|
+
return target;
|
|
33
|
+
};
|
|
8
34
|
var __export = (target, all) => {
|
|
9
35
|
for (var name in all)
|
|
10
36
|
__defProp(target, name, { get: all[name], enumerable: true });
|
|
@@ -31,14 +57,14 @@ __export(usePopover_exports, {
|
|
|
31
57
|
});
|
|
32
58
|
var React = __toESM(require("react"));
|
|
33
59
|
var import_usePopper = __toESM(require("./usePopper"));
|
|
34
|
-
function usePopover(
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
};
|
|
60
|
+
function usePopover(_a) {
|
|
61
|
+
var otherProps = __objRest(_a, []);
|
|
62
|
+
const _a2 = (0, import_usePopper.default)(otherProps), { reference, popper, arrow } = _a2, popperProps = __objRest(_a2, ["reference", "popper", "arrow"]);
|
|
63
|
+
return __spreadValues({
|
|
64
|
+
triggerProps: __spreadValues({}, reference),
|
|
65
|
+
popoverProps: __spreadValues({}, popper),
|
|
66
|
+
arrowProps: __spreadValues({}, arrow)
|
|
67
|
+
}, popperProps);
|
|
42
68
|
}
|
|
43
69
|
var usePopover_default = usePopover;
|
|
44
70
|
module.exports = __toCommonJS(usePopover_exports);
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/usePopover.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import usePopper from './usePopper';\n\nfunction usePopover({ ...otherProps }) {\n const { reference, popper, arrow, ...popperProps } = usePopper(otherProps);\n\n return {\n triggerProps: { ...reference },\n popoverProps: { ...popper },\n arrowProps: { ...arrow },\n ...popperProps,\n };\n}\n\nexport default usePopover;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAsB;AAEtB,oBAAoB,IAAmB;AAAnB,MAAK,uBAAL,IAAK;AACvB,QAAqD,oCAAU,aAAvD,aAAW,QAAQ,UAA0B,KAAhB,wBAAgB,KAAhB,CAA7B,aAAW,UAAQ;AAE3B,SAAO;AAAA,IACL,cAAc,mBAAK;AAAA,IACnB,cAAc,mBAAK;AAAA,IACnB,YAAY,mBAAK;AAAA,KACd;AAAA;AAIP,IAAO,qBAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,9 +1,26 @@
|
|
|
1
1
|
var __create = Object.create;
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
8
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
9
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
12
|
+
var __spreadValues = (a, b) => {
|
|
13
|
+
for (var prop in b || (b = {}))
|
|
14
|
+
if (__hasOwnProp.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
if (__getOwnPropSymbols)
|
|
17
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
18
|
+
if (__propIsEnum.call(b, prop))
|
|
19
|
+
__defNormalProp(a, prop, b[prop]);
|
|
20
|
+
}
|
|
21
|
+
return a;
|
|
22
|
+
};
|
|
23
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
7
24
|
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
25
|
var __export = (target, all) => {
|
|
9
26
|
for (var name in all)
|
|
@@ -45,23 +62,19 @@ function usePopoverProviderState({
|
|
|
45
62
|
const triggerRef = (0, import_react.useRef)();
|
|
46
63
|
const [tooltipState, setTooltipState] = (0, import_react.useState)(initialState);
|
|
47
64
|
const show = (state) => {
|
|
48
|
-
setTooltipState((prevState) => ({
|
|
49
|
-
...prevState,
|
|
50
|
-
...state,
|
|
65
|
+
setTooltipState((prevState) => __spreadProps(__spreadValues(__spreadValues({}, prevState), state), {
|
|
51
66
|
visible: true
|
|
52
67
|
}));
|
|
53
68
|
};
|
|
54
69
|
const hide = (state) => {
|
|
55
|
-
setTooltipState((prevState) => ({
|
|
56
|
-
...prevState,
|
|
57
|
-
...state,
|
|
70
|
+
setTooltipState((prevState) => __spreadProps(__spreadValues(__spreadValues({}, prevState), state), {
|
|
58
71
|
visible: false
|
|
59
72
|
}));
|
|
60
73
|
};
|
|
61
74
|
const [showTooltip, hideTooltip] = (0, import_ds_utilities.useExecutionTimer)(show, hide, delay);
|
|
62
75
|
const handleShowTooltip = (state, e) => {
|
|
63
76
|
triggerRef.current = e.target;
|
|
64
|
-
showTooltip({
|
|
77
|
+
showTooltip(__spreadProps(__spreadValues({}, state), { reference: e.target }));
|
|
65
78
|
};
|
|
66
79
|
const handleHideTooltip = (state) => {
|
|
67
80
|
hideTooltip(state);
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/usePopoverProviderState.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import { useState, useEffect, useRef } from 'react';\nimport { throttle } from 'lodash';\nimport { useExecutionTimer } from '@elliemae/ds-utilities';\n\nfunction usePopoverProviderState({\n initialState = {\n reference: null,\n visible: false,\n value: '',\n options: {},\n },\n delay,\n}) {\n const triggerRef = useRef();\n const [tooltipState, setTooltipState] = useState(initialState);\n\n const show = (state) => {\n setTooltipState((prevState) => ({\n ...prevState,\n ...state,\n visible: true,\n }));\n };\n const hide = (state) => {\n setTooltipState((prevState) => ({\n ...prevState,\n ...state,\n visible: false,\n }));\n };\n\n const [showTooltip, hideTooltip] = useExecutionTimer(show, hide, delay);\n\n const handleShowTooltip = (state, e) => {\n triggerRef.current = e.target;\n showTooltip({ ...state, reference: e.target });\n };\n\n const handleHideTooltip = (state) => {\n hideTooltip(state);\n };\n\n useEffect(() => {\n window.addEventListener('scroll', throttle(handleHideTooltip, 300), true);\n window.addEventListener('click', handleHideTooltip, true);\n return () => {\n window.removeEventListener('scroll', throttle(handleHideTooltip, 300), true);\n window.addEventListener('click', handleHideTooltip, true);\n };\n }, [tooltipState.reference]);\n\n return {\n show: handleShowTooltip,\n hide: handleHideTooltip,\n state: tooltipState,\n };\n}\n\nexport default usePopoverProviderState;\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA4C;AAC5C,oBAAyB;AACzB,0BAAkC;AAElC,iCAAiC;AAAA,EAC/B,eAAe;AAAA,IACb,WAAW;AAAA,IACX,SAAS;AAAA,IACT,OAAO;AAAA,IACP,SAAS;AAAA;AAAA,EAEX;AAAA,GACC;AACD,QAAM,aAAa;AACnB,QAAM,CAAC,cAAc,mBAAmB,2BAAS;AAEjD,QAAM,OAAO,CAAC,UAAU;AACtB,oBAAgB,CAAC,cAAe,gDAC3B,YACA,QAF2B;AAAA,MAG9B,SAAS;AAAA;AAAA;AAGb,QAAM,OAAO,CAAC,UAAU;AACtB,oBAAgB,CAAC,cAAe,gDAC3B,YACA,QAF2B;AAAA,MAG9B,SAAS;AAAA;AAAA;AAIb,QAAM,CAAC,aAAa,eAAe,2CAAkB,MAAM,MAAM;AAEjE,QAAM,oBAAoB,CAAC,OAAO,MAAM;AACtC,eAAW,UAAU,EAAE;AACvB,gBAAY,iCAAK,QAAL,EAAY,WAAW,EAAE;AAAA;AAGvC,QAAM,oBAAoB,CAAC,UAAU;AACnC,gBAAY;AAAA;AAGd,8BAAU,MAAM;AACd,WAAO,iBAAiB,UAAU,4BAAS,mBAAmB,MAAM;AACpE,WAAO,iBAAiB,SAAS,mBAAmB;AACpD,WAAO,MAAM;AACX,aAAO,oBAAoB,UAAU,4BAAS,mBAAmB,MAAM;AACvE,aAAO,iBAAiB,SAAS,mBAAmB;AAAA;AAAA,KAErD,CAAC,aAAa;AAEjB,SAAO;AAAA,IACL,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA;AAAA;AAIX,IAAO,kCAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/usePopper.js
CHANGED
|
@@ -1,9 +1,26 @@
|
|
|
1
1
|
var __create = Object.create;
|
|
2
2
|
var __defProp = Object.defineProperty;
|
|
3
|
+
var __defProps = Object.defineProperties;
|
|
3
4
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
6
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
7
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
8
|
var __getProtoOf = Object.getPrototypeOf;
|
|
6
9
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
10
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
11
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
12
|
+
var __spreadValues = (a, b) => {
|
|
13
|
+
for (var prop in b || (b = {}))
|
|
14
|
+
if (__hasOwnProp.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
if (__getOwnPropSymbols)
|
|
17
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
18
|
+
if (__propIsEnum.call(b, prop))
|
|
19
|
+
__defNormalProp(a, prop, b[prop]);
|
|
20
|
+
}
|
|
21
|
+
return a;
|
|
22
|
+
};
|
|
23
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
7
24
|
var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
|
|
8
25
|
var __export = (target, all) => {
|
|
9
26
|
for (var name in all)
|
|
@@ -66,17 +83,16 @@ function usePopper({
|
|
|
66
83
|
isOpen,
|
|
67
84
|
eventsEnabled,
|
|
68
85
|
positionFixed,
|
|
69
|
-
modifiers: {
|
|
70
|
-
preventOverflow: {
|
|
86
|
+
modifiers: __spreadProps(__spreadValues({
|
|
87
|
+
preventOverflow: __spreadValues({
|
|
71
88
|
padding: 0,
|
|
72
|
-
boundariesElement: boundaries
|
|
73
|
-
|
|
74
|
-
},
|
|
89
|
+
boundariesElement: boundaries
|
|
90
|
+
}, modifiers.preventOverflow),
|
|
75
91
|
offset: calculateOffset({
|
|
76
92
|
offset,
|
|
77
93
|
showArrow
|
|
78
|
-
})
|
|
79
|
-
|
|
94
|
+
})
|
|
95
|
+
}, modifiers), {
|
|
80
96
|
arrow: {
|
|
81
97
|
enabled: !!arrowEl,
|
|
82
98
|
element: arrowEl
|
|
@@ -90,7 +106,7 @@ function usePopper({
|
|
|
90
106
|
return data;
|
|
91
107
|
}
|
|
92
108
|
}
|
|
93
|
-
}
|
|
109
|
+
})
|
|
94
110
|
});
|
|
95
111
|
return () => {
|
|
96
112
|
if (popper.current)
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/usePopper.tsx", "../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"sourcesContent": ["import Popper from 'popper.js';\nimport { useEffect, useRef, useState } from 'react';\n\nfunction calculateOffset({ offset, showArrow }) {\n const arrowSize = 10;\n const defaultPadding = 3;\n return {\n enabled: showArrow || offset,\n offset: Array.isArray(offset)\n ? `${offset[0]}, ${(offset[1] || offset[0]) + arrowSize + defaultPadding}`\n : `0, ${arrowSize + defaultPadding}`,\n };\n}\n\nexport default function usePopper({\n offset,\n showArrow,\n placement,\n isOpen,\n modifiers,\n eventsEnabled = true,\n positionFixed,\n boundaries = 'scrollParent',\n referenceEl: refEl,\n}) {\n const [popperData, setPopperData] = useState({});\n // this is util for deferred rendering like with portals\n const [dynamicPopperNode, setPopperNode] = useState(null);\n const referenceRef = useRef();\n const popperRef = useRef();\n const arrowRef = useRef();\n const popper = useRef();\n\n // initialize popper with refs and options\n useEffect(() => {\n const referenceEl = refEl || referenceRef.current;\n const popperEl = dynamicPopperNode || popperRef.current;\n const arrowEl = arrowRef.current;\n\n popper.current =\n referenceEl &&\n popperEl &&\n new Popper(referenceEl, popperEl, {\n placement,\n isOpen,\n eventsEnabled,\n positionFixed,\n modifiers: {\n preventOverflow: {\n padding: 0,\n boundariesElement: boundaries,\n ...modifiers.preventOverflow,\n },\n offset: calculateOffset({\n offset,\n showArrow,\n }),\n ...modifiers,\n arrow: {\n enabled: !!arrowEl,\n element: arrowEl,\n },\n applyStyle: { enabled: false },\n updateStateModifier: {\n order: 900,\n enabled: true,\n fn: (data) => {\n setPopperData(data);\n return data;\n },\n },\n },\n });\n\n return () => {\n if (popper.current) popper.current.destroy();\n };\n }, [\n refEl,\n dynamicPopperNode,\n placement,\n showArrow,\n offset,\n popperRef,\n eventsEnabled,\n ]);\n\n // update popper instance after initialization\n useEffect(() => {\n if (!popper.current) return;\n popper.current.update();\n }, [popper.current]);\n\n const arrow = {\n ref: arrowRef,\n style: popperData.arrowStyles,\n };\n const popperProps = {\n style: popperData.styles,\n ref: setPopperNode,\n placement: popperData.placement,\n 'data-testid': 'popover-container',\n };\n const reference = {\n ref: referenceRef,\n };\n return {\n popperInstance: popper.current,\n popper: popperProps,\n arrow,\n reference,\n // setPopperNode,\n popperData,\n };\n}\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
-
"mappings": "
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,oBAAmB;AACnB,mBAA4C;AAE5C,yBAAyB,EAAE,QAAQ,aAAa;AAC9C,QAAM,YAAY;AAClB,QAAM,iBAAiB;AACvB,SAAO;AAAA,IACL,SAAS,aAAa;AAAA,IACtB,QAAQ,MAAM,QAAQ,UAClB,GAAG,OAAO,OAAQ,QAAO,MAAM,OAAO,MAAM,YAAY,mBACxD,MAAM,YAAY;AAAA;AAAA;AAIX,mBAAmB;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB;AAAA,EACA,aAAa;AAAA,EACb,aAAa;AAAA,GACZ;AACD,QAAM,CAAC,YAAY,iBAAiB,2BAAS;AAE7C,QAAM,CAAC,mBAAmB,iBAAiB,2BAAS;AACpD,QAAM,eAAe;AACrB,QAAM,YAAY;AAClB,QAAM,WAAW;AACjB,QAAM,SAAS;AAGf,8BAAU,MAAM;AACd,UAAM,cAAc,SAAS,aAAa;AAC1C,UAAM,WAAW,qBAAqB,UAAU;AAChD,UAAM,UAAU,SAAS;AAEzB,WAAO,UACL,eACA,YACA,IAAI,sBAAO,aAAa,UAAU;AAAA,MAChC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW;AAAA,QACT,iBAAiB;AAAA,UACf,SAAS;AAAA,UACT,mBAAmB;AAAA,WAChB,UAAU;AAAA,QAEf,QAAQ,gBAAgB;AAAA,UACtB;AAAA,UACA;AAAA;AAAA,SAEC,YAVM;AAAA,QAWT,OAAO;AAAA,UACL,SAAS,CAAC,CAAC;AAAA,UACX,SAAS;AAAA;AAAA,QAEX,YAAY,EAAE,SAAS;AAAA,QACvB,qBAAqB;AAAA,UACnB,OAAO;AAAA,UACP,SAAS;AAAA,UACT,IAAI,CAAC,SAAS;AACZ,0BAAc;AACd,mBAAO;AAAA;AAAA;AAAA;AAAA;AAMjB,WAAO,MAAM;AACX,UAAI,OAAO;AAAS,eAAO,QAAQ;AAAA;AAAA,KAEpC;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAIF,8BAAU,MAAM;AACd,QAAI,CAAC,OAAO;AAAS;AACrB,WAAO,QAAQ;AAAA,KACd,CAAC,OAAO;AAEX,QAAM,QAAQ;AAAA,IACZ,KAAK;AAAA,IACL,OAAO,WAAW;AAAA;AAEpB,QAAM,cAAc;AAAA,IAClB,OAAO,WAAW;AAAA,IAClB,KAAK;AAAA,IACL,WAAW,WAAW;AAAA,IACtB,eAAe;AAAA;AAEjB,QAAM,YAAY;AAAA,IAChB,KAAK;AAAA;AAEP,SAAO;AAAA,IACL,gBAAgB,OAAO;AAAA,IACvB,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IAEA;AAAA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|