@elliemae/ds-popover 2.3.0-alpha.6 → 2.3.0-next.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (57) hide show
  1. package/cjs/Arrow.js +63 -0
  2. package/cjs/DSPopover.js +167 -0
  3. package/cjs/Popover.js +66 -0
  4. package/cjs/PopoverTrigger.js +68 -0
  5. package/cjs/index.js +23 -0
  6. package/cjs/usePopover.js +41 -0
  7. package/cjs/usePopoverProviderState.js +75 -0
  8. package/cjs/usePopper.js +123 -0
  9. package/esm/Arrow.js +55 -0
  10. package/esm/DSPopover.js +148 -0
  11. package/esm/Popover.js +57 -0
  12. package/esm/PopoverTrigger.js +58 -0
  13. package/esm/index.js +4 -0
  14. package/esm/usePopover.js +34 -0
  15. package/esm/usePopoverProviderState.js +69 -0
  16. package/esm/usePopper.js +116 -0
  17. package/package.json +35 -37
  18. package/types/Arrow.d.ts +3 -0
  19. package/types/DSPopover.d.ts +150 -0
  20. package/types/Popover.d.ts +13 -0
  21. package/types/PopoverTrigger.d.ts +10 -0
  22. package/types/index.d.ts +2 -0
  23. package/types/usePopover.d.ts +21 -0
  24. package/types/usePopoverProviderState.d.ts +19 -0
  25. package/types/usePopper.d.ts +28 -0
  26. package/dist/cjs/Arrow.js +0 -62
  27. package/dist/cjs/Arrow.js.map +0 -7
  28. package/dist/cjs/DSPopover.js +0 -155
  29. package/dist/cjs/DSPopover.js.map +0 -7
  30. package/dist/cjs/Popover.js +0 -73
  31. package/dist/cjs/Popover.js.map +0 -7
  32. package/dist/cjs/PopoverTrigger.js +0 -72
  33. package/dist/cjs/PopoverTrigger.js.map +0 -7
  34. package/dist/cjs/index.js +0 -36
  35. package/dist/cjs/index.js.map +0 -7
  36. package/dist/cjs/usePopover.js +0 -45
  37. package/dist/cjs/usePopover.js.map +0 -7
  38. package/dist/cjs/usePopoverProviderState.js +0 -85
  39. package/dist/cjs/usePopoverProviderState.js.map +0 -7
  40. package/dist/cjs/usePopper.js +0 -135
  41. package/dist/cjs/usePopper.js.map +0 -7
  42. package/dist/esm/Arrow.js +0 -33
  43. package/dist/esm/Arrow.js.map +0 -7
  44. package/dist/esm/DSPopover.js +0 -126
  45. package/dist/esm/DSPopover.js.map +0 -7
  46. package/dist/esm/Popover.js +0 -44
  47. package/dist/esm/Popover.js.map +0 -7
  48. package/dist/esm/PopoverTrigger.js +0 -43
  49. package/dist/esm/PopoverTrigger.js.map +0 -7
  50. package/dist/esm/index.js +0 -7
  51. package/dist/esm/index.js.map +0 -7
  52. package/dist/esm/usePopover.js +0 -16
  53. package/dist/esm/usePopover.js.map +0 -7
  54. package/dist/esm/usePopoverProviderState.js +0 -56
  55. package/dist/esm/usePopoverProviderState.js.map +0 -7
  56. package/dist/esm/usePopper.js +0 -106
  57. package/dist/esm/usePopper.js.map +0 -7
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/PopoverTrigger.tsx", "../../../../scripts/build/transpile/react-shim.js"],
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": ";;;;;;;;;;;;;;;;;;;;;;;;;;;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,OACd,SAAS;AAAA,IACZ,iBAAiB;AAAA;AAAA;AAIrB,wBAAwB,EAAE,IAAI,cAAc,SAAS;AACnD,QAAM,qBAAqB,iBAAiB;AAE5C,SAAO,mDAAC,WAAD;AAAA,OAAe;AAAA;AAAA;AAGxB,IAAO,yBAAQ;",
6
- "names": []
7
- }
package/dist/cjs/index.js DELETED
@@ -1,36 +0,0 @@
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_DSPopover.default
31
- });
32
- var React = __toESM(require("react"));
33
- __reExport(src_exports, require("./DSPopover"));
34
- var import_DSPopover = __toESM(require("./DSPopover"));
35
- module.exports = __toCommonJS(src_exports);
36
- //# sourceMappingURL=index.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
4
- "sourcesContent": ["export * from './DSPopover';\nexport { default } from './DSPopover';\n", "import * as React from 'react';\nexport { React };\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,wBAAc;AACd,uBAAwB;",
6
- "names": []
7
- }
@@ -1,45 +0,0 @@
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 usePopover_exports = {};
29
- __export(usePopover_exports, {
30
- default: () => usePopover_default
31
- });
32
- var React = __toESM(require("react"));
33
- var import_usePopper = __toESM(require("./usePopper"));
34
- function usePopover({ ...otherProps }) {
35
- const { reference, popper, arrow, ...popperProps } = (0, import_usePopper.default)(otherProps);
36
- return {
37
- triggerProps: { ...reference },
38
- popoverProps: { ...popper },
39
- arrowProps: { ...arrow },
40
- ...popperProps
41
- };
42
- }
43
- var usePopover_default = usePopover;
44
- module.exports = __toCommonJS(usePopover_exports);
45
- //# sourceMappingURL=usePopover.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/usePopover.tsx", "../../../../scripts/build/transpile/react-shim.js"],
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": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAsB;AAEtB,oBAAoB,KAAK,cAAc;AACrC,QAAM,EAAE,WAAW,QAAQ,UAAU,gBAAgB,8BAAU;AAE/D,SAAO;AAAA,IACL,cAAc,KAAK;AAAA,IACnB,cAAc,KAAK;AAAA,IACnB,YAAY,KAAK;AAAA,OACd;AAAA;AAAA;AAIP,IAAO,qBAAQ;",
6
- "names": []
7
- }
@@ -1,85 +0,0 @@
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 usePopoverProviderState_exports = {};
29
- __export(usePopoverProviderState_exports, {
30
- default: () => usePopoverProviderState_default
31
- });
32
- var React = __toESM(require("react"));
33
- var import_react = require("react");
34
- var import_lodash = require("lodash");
35
- var import_ds_utilities = require("@elliemae/ds-utilities");
36
- function usePopoverProviderState({
37
- initialState = {
38
- reference: null,
39
- visible: false,
40
- value: "",
41
- options: {}
42
- },
43
- delay
44
- }) {
45
- const triggerRef = (0, import_react.useRef)();
46
- const [tooltipState, setTooltipState] = (0, import_react.useState)(initialState);
47
- const show = (state) => {
48
- setTooltipState((prevState) => ({
49
- ...prevState,
50
- ...state,
51
- visible: true
52
- }));
53
- };
54
- const hide = (state) => {
55
- setTooltipState((prevState) => ({
56
- ...prevState,
57
- ...state,
58
- visible: false
59
- }));
60
- };
61
- const [showTooltip, hideTooltip] = (0, import_ds_utilities.useExecutionTimer)(show, hide, delay);
62
- const handleShowTooltip = (state, e) => {
63
- triggerRef.current = e.target;
64
- showTooltip({ ...state, reference: e.target });
65
- };
66
- const handleHideTooltip = (state) => {
67
- hideTooltip(state);
68
- };
69
- (0, import_react.useEffect)(() => {
70
- window.addEventListener("scroll", (0, import_lodash.throttle)(handleHideTooltip, 300), true);
71
- window.addEventListener("click", handleHideTooltip, true);
72
- return () => {
73
- window.removeEventListener("scroll", (0, import_lodash.throttle)(handleHideTooltip, 300), true);
74
- window.addEventListener("click", handleHideTooltip, true);
75
- };
76
- }, [tooltipState.reference]);
77
- return {
78
- show: handleShowTooltip,
79
- hide: handleHideTooltip,
80
- state: tooltipState
81
- };
82
- }
83
- var usePopoverProviderState_default = usePopoverProviderState;
84
- module.exports = __toCommonJS(usePopoverProviderState_exports);
85
- //# sourceMappingURL=usePopoverProviderState.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/usePopoverProviderState.tsx", "../../../../scripts/build/transpile/react-shim.js"],
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": ";;;;;;;;;;;;;;;;;;;;;;;;;;;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;AAAA,SAC3B;AAAA,SACA;AAAA,MACH,SAAS;AAAA;AAAA;AAGb,QAAM,OAAO,CAAC,UAAU;AACtB,oBAAgB,CAAC,cAAe;AAAA,SAC3B;AAAA,SACA;AAAA,MACH,SAAS;AAAA;AAAA;AAIb,QAAM,CAAC,aAAa,eAAe,2CAAkB,MAAM,MAAM;AAEjE,QAAM,oBAAoB,CAAC,OAAO,MAAM;AACtC,eAAW,UAAU,EAAE;AACvB,gBAAY,KAAK,OAAO,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
- "names": []
7
- }
@@ -1,135 +0,0 @@
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 usePopper_exports = {};
29
- __export(usePopper_exports, {
30
- default: () => usePopper
31
- });
32
- var React = __toESM(require("react"));
33
- var import_popper = __toESM(require("popper.js"));
34
- var import_react = require("react");
35
- function calculateOffset({ offset, showArrow }) {
36
- const arrowSize = 10;
37
- const defaultPadding = 3;
38
- return {
39
- enabled: showArrow || offset,
40
- offset: Array.isArray(offset) ? `${offset[0]}, ${(offset[1] || offset[0]) + arrowSize + defaultPadding}` : `0, ${arrowSize + defaultPadding}`
41
- };
42
- }
43
- function usePopper({
44
- offset,
45
- showArrow,
46
- placement,
47
- isOpen,
48
- modifiers,
49
- eventsEnabled = true,
50
- positionFixed,
51
- boundaries = "scrollParent",
52
- referenceEl: refEl
53
- }) {
54
- const [popperData, setPopperData] = (0, import_react.useState)({});
55
- const [dynamicPopperNode, setPopperNode] = (0, import_react.useState)(null);
56
- const referenceRef = (0, import_react.useRef)();
57
- const popperRef = (0, import_react.useRef)();
58
- const arrowRef = (0, import_react.useRef)();
59
- const popper = (0, import_react.useRef)();
60
- (0, import_react.useEffect)(() => {
61
- const referenceEl = refEl || referenceRef.current;
62
- const popperEl = dynamicPopperNode || popperRef.current;
63
- const arrowEl = arrowRef.current;
64
- popper.current = referenceEl && popperEl && new import_popper.default(referenceEl, popperEl, {
65
- placement,
66
- isOpen,
67
- eventsEnabled,
68
- positionFixed,
69
- modifiers: {
70
- preventOverflow: {
71
- padding: 0,
72
- boundariesElement: boundaries,
73
- ...modifiers.preventOverflow
74
- },
75
- offset: calculateOffset({
76
- offset,
77
- showArrow
78
- }),
79
- ...modifiers,
80
- arrow: {
81
- enabled: !!arrowEl,
82
- element: arrowEl
83
- },
84
- applyStyle: { enabled: false },
85
- updateStateModifier: {
86
- order: 900,
87
- enabled: true,
88
- fn: (data) => {
89
- setPopperData(data);
90
- return data;
91
- }
92
- }
93
- }
94
- });
95
- return () => {
96
- if (popper.current)
97
- popper.current.destroy();
98
- };
99
- }, [
100
- refEl,
101
- dynamicPopperNode,
102
- placement,
103
- showArrow,
104
- offset,
105
- popperRef,
106
- eventsEnabled
107
- ]);
108
- (0, import_react.useEffect)(() => {
109
- if (!popper.current)
110
- return;
111
- popper.current.update();
112
- }, [popper.current]);
113
- const arrow = {
114
- ref: arrowRef,
115
- style: popperData.arrowStyles
116
- };
117
- const popperProps = {
118
- style: popperData.styles,
119
- ref: setPopperNode,
120
- placement: popperData.placement,
121
- "data-testid": "popover-container"
122
- };
123
- const reference = {
124
- ref: referenceRef
125
- };
126
- return {
127
- popperInstance: popper.current,
128
- popper: popperProps,
129
- arrow,
130
- reference,
131
- popperData
132
- };
133
- }
134
- module.exports = __toCommonJS(usePopper_exports);
135
- //# sourceMappingURL=usePopper.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/usePopper.tsx", "../../../../scripts/build/transpile/react-shim.js"],
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": ";;;;;;;;;;;;;;;;;;;;;;;;;;;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,aAChB,UAAU;AAAA;AAAA,QAEf,QAAQ,gBAAgB;AAAA,UACtB;AAAA,UACA;AAAA;AAAA,WAEC;AAAA,QACH,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
- "names": []
7
- }
package/dist/esm/Arrow.js DELETED
@@ -1,33 +0,0 @@
1
- import * as React from "react";
2
- import React2, { forwardRef } from "react";
3
- import { aggregatedClasses } from "@elliemae/ds-classnames";
4
- import { getArrowStylesBySize } from "@elliemae/ds-popper";
5
- const ArrowWrapper = aggregatedClasses("span")("popover", "arrow");
6
- function Arrow({ style, className, innerRef, blockName = "popover", placement, ...otherProps }) {
7
- return /* @__PURE__ */ React2.createElement(ArrowWrapper, {
8
- className,
9
- "data-placement": placement,
10
- ...otherProps,
11
- innerRef,
12
- style: {
13
- ...style,
14
- ...getArrowStylesBySize(placement, 25)
15
- }
16
- }, /* @__PURE__ */ React2.createElement("svg", {
17
- viewBox: "0 0 30 30"
18
- }, /* @__PURE__ */ React2.createElement("path", {
19
- className: "stroke",
20
- 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"
21
- }), /* @__PURE__ */ React2.createElement("path", {
22
- className: "fill",
23
- 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"
24
- })));
25
- }
26
- var Arrow_default = forwardRef((props, ref) => /* @__PURE__ */ React2.createElement(Arrow, {
27
- ...props,
28
- innerRef: ref || props.innerRef
29
- }));
30
- export {
31
- Arrow_default as default
32
- };
33
- //# sourceMappingURL=Arrow.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/Arrow.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
5
- "mappings": "AAAA;ACAA;AACA;AACA;AAEA,MAAM,eAAe,kBAAkB,QAAQ,WAAW;AAC1D,eAAe,EAAE,OAAO,WAAW,UAAU,YAAY,WAAW,cAAc,cAAc;AAC9F,SACE,qCAAC,cAAD;AAAA,IACE;AAAA,IACA,kBAAgB;AAAA,OACZ;AAAA,IACJ;AAAA,IACA,OAAO;AAAA,SACF;AAAA,SACA,qBAAqB,WAAW;AAAA;AAAA,KAGrC,qCAAC,OAAD;AAAA,IAAK,SAAQ;AAAA,KACX,qCAAC,QAAD;AAAA,IACE,WAAU;AAAA,IACV,GAAE;AAAA,MAGJ,qCAAC,QAAD;AAAA,IACE,WAAU;AAAA,IACV,GAAE;AAAA;AAAA;AAOZ,IAAO,gBAAQ,WAAW,CAAC,OAAO,QAAQ,qCAAC,OAAD;AAAA,KAAW;AAAA,EAAO,UAAU,OAAO,MAAM;AAAA;",
6
- "names": []
7
- }
@@ -1,126 +0,0 @@
1
- import * as React from "react";
2
- import React2 from "react";
3
- import { PropTypes, describe } from "react-desc";
4
- import { useHoverHandlersDelay } from "@elliemae/ds-utilities";
5
- import { useHiddenController } from "@elliemae/ds-hidden";
6
- import Popover from "./Popover";
7
- import usePopper from "./usePopper";
8
- import Arrow from "./Arrow";
9
- import usePopoverProviderState from "./usePopoverProviderState";
10
- export * from "@elliemae/ds-popper";
11
- const Interaction = {
12
- CLICK: "click",
13
- HOVER: "hover"
14
- };
15
- const DSPopover = ({
16
- containerProps,
17
- content,
18
- renderer,
19
- visible: visibleProp,
20
- offset,
21
- showArrow,
22
- placement,
23
- boundaries,
24
- modifiers,
25
- referenceEl,
26
- renderTrigger,
27
- onClickOutside,
28
- destroyOnHidden,
29
- interactionType,
30
- isOpen,
31
- style
32
- }) => {
33
- const { visible, onShow, onHide, onToggle } = useHiddenController(visibleProp);
34
- const { reference, popper, arrow, popperData } = usePopper({
35
- placement,
36
- showArrow,
37
- boundaries,
38
- modifiers,
39
- offset,
40
- referenceEl,
41
- eventsEnabled: visible,
42
- isOpen
43
- });
44
- const hoverHandlers = useHoverHandlersDelay({
45
- onMouseOver: onShow,
46
- onMouseLeave: onHide
47
- });
48
- const isPopoverVisible = visible || isOpen;
49
- return /* @__PURE__ */ React2.createElement(React2.Fragment, null, renderTrigger({
50
- ...reference,
51
- handlers: interactionType === "click" ? { onClick: onToggle } : hoverHandlers,
52
- onShow,
53
- onToggle,
54
- onHide,
55
- "aria-haspopup": true,
56
- "aria-expanded": visible
57
- }), isPopoverVisible && reference.ref && /* @__PURE__ */ React2.createElement(Popover, {
58
- containerProps,
59
- destroyOnHidden,
60
- interactionType,
61
- isOpen,
62
- onClickOutside: (...args) => {
63
- onClickOutside(...args);
64
- if (interactionType === "click")
65
- onHide();
66
- },
67
- popperProps: popper,
68
- renderer: renderer && ((props) => renderer({
69
- ...props,
70
- onShow,
71
- onToggle,
72
- onHide
73
- })),
74
- style,
75
- visible: isPopoverVisible
76
- }, showArrow && /* @__PURE__ */ React2.createElement(Arrow, {
77
- ...arrow,
78
- placement: popperData.placement
79
- }), isPopoverVisible && content));
80
- };
81
- DSPopover.defaultProps = {
82
- containerProps: {},
83
- renderer: void 0,
84
- visible: void 0,
85
- offset: void 0,
86
- showArrow: false,
87
- placement: "top",
88
- modifiers: {},
89
- renderTrigger: () => null,
90
- onClickOutside: () => null,
91
- destroyOnHidden: true,
92
- isOpen: void 0
93
- };
94
- const popoverProps = {
95
- containerProps: PropTypes.shape({}).description("Set of Properties attached to the main container"),
96
- destroyOnHidden: PropTypes.bool.description("destroy popover on hidden or not").defaultValue(true),
97
- renderer: PropTypes.func.description("custom renderer"),
98
- popperProps: PropTypes.object.description("Popper props attached to container"),
99
- visible: PropTypes.bool.description("is visible or not").defaultValue(false),
100
- content: PropTypes.oneOfType([PropTypes.element, PropTypes.string]).description("popover content"),
101
- onClickOutside: PropTypes.func.description("function called on click outside"),
102
- interaction: PropTypes.string.description("interaction type: hover, click"),
103
- offset: PropTypes.object.description("offset"),
104
- showArrow: PropTypes.bool.description("show tooltip arrow or not"),
105
- placement: PropTypes.string.description("popover placement: top, bottom, right, left"),
106
- boundaries: PropTypes.string.description("popover boundaries"),
107
- modifiers: PropTypes.object.description("modifiers"),
108
- style: PropTypes.object.description("css style object"),
109
- referenceEl: PropTypes.element.description("reference element"),
110
- renderTrigger: PropTypes.func.description("render trigger element"),
111
- interactionType: PropTypes.string.description("interaction type"),
112
- isOpen: PropTypes.bool.description("open or not").defaultValue(false)
113
- };
114
- DSPopover.propTypes = popoverProps;
115
- const PopoverWithSchema = describe(DSPopover);
116
- PopoverWithSchema.propTypes = popoverProps;
117
- var DSPopover_default = DSPopover;
118
- export {
119
- DSPopover,
120
- Interaction,
121
- PopoverWithSchema,
122
- DSPopover_default as default,
123
- usePopoverProviderState,
124
- usePopper
125
- };
126
- //# sourceMappingURL=DSPopover.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/DSPopover.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "/* 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"],
5
- "mappings": "AAAA;ACCA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAEA;AACO,MAAM,cAAc;AAAA,EACzB,OAAO;AAAA,EACP,OAAO;AAAA;AAIT,MAAM,YAAY,CAAC;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA,SAAS;AAAA,EACT;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACI;AACJ,QAAM,EAAE,SAAS,QAAQ,QAAQ,aAAa,oBAAoB;AAElE,QAAM,EAAE,WAAW,QAAQ,OAAO,eAAe,UAAU;AAAA,IACzD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf;AAAA;AAGF,QAAM,gBAAgB,sBAAsB;AAAA,IAC1C,aAAa;AAAA,IACb,cAAc;AAAA;AAEhB,QAAM,mBAAmB,WAAW;AACpC,SACE,4DACG,cAAc;AAAA,OACV;AAAA,IACH,UAAU,oBAAoB,UAAU,EAAE,SAAS,aAAa;AAAA,IAChE;AAAA,IACA;AAAA,IACA;AAAA,IACA,iBAAiB;AAAA,IACjB,iBAAiB;AAAA,MAElB,oBAAoB,UAAU,OAC7B,qCAAC,SAAD;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB,IAAI,SAAS;AAC3B,qBAAe,GAAG;AAClB,UAAI,oBAAoB;AAAS;AAAA;AAAA,IAEnC,aAAa;AAAA,IACb,UACE,YACC,EAAC,UACA,SAAS;AAAA,SACJ;AAAA,MACH;AAAA,MACA;AAAA,MACA;AAAA;AAAA,IAGN;AAAA,IACA,SAAS;AAAA,KAER,aAAa,qCAAC,OAAD;AAAA,OAAW;AAAA,IAAO,WAAW,WAAW;AAAA,MACrD,oBAAoB;AAAA;AAO/B,UAAU,eAAe;AAAA,EACvB,gBAAgB;AAAA,EAChB,UAAU;AAAA,EACV,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,WAAW;AAAA,EACX,WAAW;AAAA,EACX,eAAe,MAAM;AAAA,EACrB,gBAAgB,MAAM;AAAA,EACtB,iBAAiB;AAAA,EACjB,QAAQ;AAAA;AAGV,MAAM,eAAe;AAAA,EACnB,gBAAgB,UAAU,MAAM,IAAI,YAAY;AAAA,EAChD,iBAAiB,UAAU,KAAK,YAAY,oCAAoC,aAAa;AAAA,EAC7F,UAAU,UAAU,KAAK,YAAY;AAAA,EACrC,aAAa,UAAU,OAAO,YAAY;AAAA,EAC1C,SAAS,UAAU,KAAK,YAAY,qBAAqB,aAAa;AAAA,EACtE,SAAS,UAAU,UAAU,CAAC,UAAU,SAAS,UAAU,SAAS,YAAY;AAAA,EAChF,gBAAgB,UAAU,KAAK,YAAY;AAAA,EAC3C,aAAa,UAAU,OAAO,YAAY;AAAA,EAC1C,QAAQ,UAAU,OAAO,YAAY;AAAA,EACrC,WAAW,UAAU,KAAK,YAAY;AAAA,EACtC,WAAW,UAAU,OAAO,YAAY;AAAA,EACxC,YAAY,UAAU,OAAO,YAAY;AAAA,EACzC,WAAW,UAAU,OAAO,YAAY;AAAA,EACxC,OAAO,UAAU,OAAO,YAAY;AAAA,EACpC,aAAa,UAAU,QAAQ,YAAY;AAAA,EAC3C,eAAe,UAAU,KAAK,YAAY;AAAA,EAC1C,iBAAiB,UAAU,OAAO,YAAY;AAAA,EAC9C,QAAQ,UAAU,KAAK,YAAY,eAAe,aAAa;AAAA;AAGjE,UAAU,YAAY;AAEtB,MAAM,oBAAoB,SAAS;AACnC,kBAAkB,YAAY;AAI9B,IAAO,oBAAQ;",
6
- "names": []
7
- }
@@ -1,44 +0,0 @@
1
- import * as React from "react";
2
- import React2, { useRef } from "react";
3
- import { omit } from "lodash";
4
- import { aggregatedClasses } from "@elliemae/ds-classnames";
5
- import { isFunction, removeUndefinedProperties, useOnClickOutside } from "@elliemae/ds-utilities";
6
- import { useHiddenTransition } from "@elliemae/ds-hidden";
7
- import DSPortal from "@elliemae/ds-portal";
8
- const blockName = "popover";
9
- const PopoverComponent = aggregatedClasses("div")(blockName);
10
- function Popover({
11
- containerProps,
12
- destroyOnHidden = true,
13
- renderer = void 0,
14
- popperProps = {},
15
- visible = false,
16
- content = void 0,
17
- onClickOutside = () => null,
18
- style,
19
- ...otherProps
20
- }) {
21
- const popoverRef = useRef();
22
- const hiddenTransitionProps = useHiddenTransition({ visible });
23
- const popoverProps = removeUndefinedProperties({
24
- containerprops: containerProps,
25
- content,
26
- ref: popoverRef,
27
- ...otherProps,
28
- ...hiddenTransitionProps
29
- });
30
- useOnClickOutside(popoverRef, onClickOutside);
31
- const wrapStyle = omit(style, "zIndex") || {};
32
- return destroyOnHidden && !hiddenTransitionProps.destroyed && /* @__PURE__ */ React2.createElement(DSPortal, null, /* @__PURE__ */ React2.createElement("div", {
33
- ...popperProps,
34
- style: { ...style, ...popperProps.style }
35
- }, isFunction(renderer) ? renderer(popoverProps) : /* @__PURE__ */ React2.createElement(PopoverComponent, {
36
- ...popoverProps,
37
- style: wrapStyle
38
- })));
39
- }
40
- var Popover_default = Popover;
41
- export {
42
- Popover_default as default
43
- };
44
- //# sourceMappingURL=Popover.js.map
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/Popover.tsx"],
4
- "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
5
- "mappings": "AAAA;ACAA;AACA;AACA;AACA;AACA;AACA;AAEA,MAAM,YAAY;AAClB,MAAM,mBAAmB,kBAAkB,OAAO;AAElD,iBAAiB;AAAA,EACf;AAAA,EACA,kBAAkB;AAAA,EAClB,WAAW;AAAA,EACX,cAAc;AAAA,EACd,UAAU;AAAA,EACV,UAAU;AAAA,EACV,iBAAiB,MAAM;AAAA,EACvB;AAAA,KACG;AAAA,GACF;AACD,QAAM,aAAa;AACnB,QAAM,wBAAwB,oBAAoB,EAAE;AACpD,QAAM,eAAe,0BAA0B;AAAA,IAC7C,gBAAgB;AAAA,IAChB;AAAA,IACA,KAAK;AAAA,OACF;AAAA,OACA;AAAA;AAGL,oBAAkB,YAAY;AAE9B,QAAM,YAAY,KAAK,OAAO,aAAa;AAC3C,SACE,mBACA,CAAC,sBAAsB,aACrB,qCAAC,UAAD,MACE,qCAAC,OAAD;AAAA,OAAS;AAAA,IAAa,OAAO,KAAK,UAAU,YAAY;AAAA,KACrD,WAAW,YAAY,SAAS,gBAAgB,qCAAC,kBAAD;AAAA,OAAsB;AAAA,IAAc,OAAO;AAAA;AAAA;AAOtG,IAAO,kBAAQ;",
6
- "names": []
7
- }
@@ -1,43 +0,0 @@
1
- import * as React from "react";
2
- import React2 from "react";
3
- const Interaction = {
4
- CLICK: "click",
5
- HOVER: "hover"
6
- };
7
- const noop = () => {
8
- };
9
- function useHiddenTrigger({
10
- hiddenId,
11
- visible = false,
12
- interaction = "click",
13
- onToggle = noop,
14
- onShow = noop,
15
- onHide = noop
16
- }) {
17
- const handlers = {
18
- [Interaction.CLICK]: {
19
- onClick: onToggle
20
- },
21
- [Interaction.HOVER]: {
22
- onMouseEnter: onShow,
23
- onMouseLeave: onHide
24
- }
25
- };
26
- return {
27
- "aria-expanded": visible,
28
- ...handlers[interaction],
29
- "aria-controls": hiddenId
30
- };
31
- }
32
- function PopoverTrigger({ as: Component, ...props }) {
33
- const hiddenTriggerProps = useHiddenTrigger(props);
34
- return /* @__PURE__ */ React2.createElement(Component, {
35
- ...hiddenTriggerProps
36
- });
37
- }
38
- var PopoverTrigger_default = PopoverTrigger;
39
- export {
40
- Interaction,
41
- PopoverTrigger_default as default
42
- };
43
- //# sourceMappingURL=PopoverTrigger.js.map