@elliemae/ds-legacy-popover 1.0.0-rc.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.
Files changed (43) hide show
  1. package/dist/cjs/Arrow.js +70 -0
  2. package/dist/cjs/Arrow.js.map +7 -0
  3. package/dist/cjs/DSPopover.js +169 -0
  4. package/dist/cjs/DSPopover.js.map +7 -0
  5. package/dist/cjs/Popover.js +71 -0
  6. package/dist/cjs/Popover.js.map +7 -0
  7. package/dist/cjs/PopoverTrigger.js +71 -0
  8. package/dist/cjs/PopoverTrigger.js.map +7 -0
  9. package/dist/cjs/index.js +38 -0
  10. package/dist/cjs/index.js.map +7 -0
  11. package/dist/cjs/package.json +7 -0
  12. package/dist/cjs/usePopover.js +46 -0
  13. package/dist/cjs/usePopover.js.map +7 -0
  14. package/dist/cjs/usePopoverProviderState.js +86 -0
  15. package/dist/cjs/usePopoverProviderState.js.map +7 -0
  16. package/dist/cjs/usePopper.js +129 -0
  17. package/dist/cjs/usePopper.js.map +7 -0
  18. package/dist/esm/Arrow.js +40 -0
  19. package/dist/esm/Arrow.js.map +7 -0
  20. package/dist/esm/DSPopover.js +138 -0
  21. package/dist/esm/DSPopover.js.map +7 -0
  22. package/dist/esm/Popover.js +41 -0
  23. package/dist/esm/Popover.js.map +7 -0
  24. package/dist/esm/PopoverTrigger.js +41 -0
  25. package/dist/esm/PopoverTrigger.js.map +7 -0
  26. package/dist/esm/index.js +7 -0
  27. package/dist/esm/index.js.map +7 -0
  28. package/dist/esm/package.json +7 -0
  29. package/dist/esm/usePopover.js +16 -0
  30. package/dist/esm/usePopover.js.map +7 -0
  31. package/dist/esm/usePopoverProviderState.js +56 -0
  32. package/dist/esm/usePopoverProviderState.js.map +7 -0
  33. package/dist/esm/usePopper.js +99 -0
  34. package/dist/esm/usePopper.js.map +7 -0
  35. package/dist/types/Arrow.d.ts +3 -0
  36. package/dist/types/DSPopover.d.ts +81 -0
  37. package/dist/types/Popover.d.ts +12 -0
  38. package/dist/types/PopoverTrigger.d.ts +9 -0
  39. package/dist/types/index.d.ts +2 -0
  40. package/dist/types/usePopover.d.ts +21 -0
  41. package/dist/types/usePopoverProviderState.d.ts +19 -0
  42. package/dist/types/usePopper.d.ts +28 -0
  43. package/package.json +101 -0
@@ -0,0 +1,129 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+ var usePopper_exports = {};
30
+ __export(usePopper_exports, {
31
+ default: () => usePopper
32
+ });
33
+ module.exports = __toCommonJS(usePopper_exports);
34
+ var React = __toESM(require("react"));
35
+ var import_popper = __toESM(require("popper.js"));
36
+ var import_react = require("react");
37
+ function calculateOffset({ offset, showArrow }) {
38
+ const arrowSize = 10;
39
+ const defaultPadding = 3;
40
+ return {
41
+ enabled: showArrow || offset,
42
+ offset: Array.isArray(offset) ? `${offset[0]}, ${(offset[1] || offset[0]) + arrowSize + defaultPadding}` : `0, ${arrowSize + defaultPadding}`
43
+ };
44
+ }
45
+ function usePopper({
46
+ offset,
47
+ showArrow,
48
+ placement,
49
+ isOpen,
50
+ modifiers,
51
+ eventsEnabled = true,
52
+ positionFixed,
53
+ boundaries = "scrollParent",
54
+ referenceEl: refEl
55
+ }) {
56
+ const [popperData, setPopperData] = (0, import_react.useState)({});
57
+ const [dynamicPopperNode, setPopperNode] = (0, import_react.useState)(null);
58
+ const referenceRef = (0, import_react.useRef)();
59
+ const popperRef = (0, import_react.useRef)();
60
+ const arrowRef = (0, import_react.useRef)();
61
+ const popper = (0, import_react.useRef)();
62
+ (0, import_react.useEffect)(() => {
63
+ const referenceEl = refEl || referenceRef.current;
64
+ const popperEl = dynamicPopperNode || popperRef.current;
65
+ const arrowEl = arrowRef.current;
66
+ popper.current = referenceEl && popperEl && new import_popper.default(referenceEl, popperEl, {
67
+ placement,
68
+ isOpen,
69
+ eventsEnabled,
70
+ positionFixed,
71
+ modifiers: {
72
+ preventOverflow: {
73
+ padding: 0,
74
+ boundariesElement: boundaries,
75
+ ...modifiers.preventOverflow
76
+ },
77
+ offset: calculateOffset({
78
+ offset,
79
+ showArrow
80
+ }),
81
+ ...modifiers,
82
+ arrow: {
83
+ enabled: !!arrowEl,
84
+ element: arrowEl
85
+ },
86
+ applyStyle: { enabled: false },
87
+ updateStateModifier: {
88
+ order: 900,
89
+ enabled: true,
90
+ fn: (data) => {
91
+ setPopperData(data);
92
+ return data;
93
+ }
94
+ }
95
+ }
96
+ });
97
+ return () => {
98
+ if (popper.current)
99
+ popper.current.destroy();
100
+ };
101
+ }, [refEl, dynamicPopperNode, placement, showArrow, offset, popperRef, eventsEnabled]);
102
+ (0, import_react.useEffect)(() => {
103
+ if (!popper.current)
104
+ return;
105
+ popper.current.update();
106
+ }, [popper.current]);
107
+ const arrow = {
108
+ ref: arrowRef,
109
+ style: popperData.arrowStyles
110
+ };
111
+ const popperProps = {
112
+ style: popperData.styles,
113
+ ref: setPopperNode,
114
+ placement: popperData.placement,
115
+ "data-testid": "popover-container"
116
+ };
117
+ const reference = {
118
+ ref: referenceRef
119
+ };
120
+ return {
121
+ popperInstance: popper.current,
122
+ popper: popperProps,
123
+ arrow,
124
+ reference,
125
+ // setPopperNode,
126
+ popperData
127
+ };
128
+ }
129
+ //# sourceMappingURL=usePopper.js.map
@@ -0,0 +1,7 @@
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 }, [refEl, dynamicPopperNode, placement, showArrow, offset, popperRef, eventsEnabled]);\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;AAAA;ACAA,YAAuB;ADAvB,oBAAmB;AACnB,mBAA4C;AAE5C,SAAS,gBAAgB,EAAE,QAAQ,UAAU,GAAG;AAC9C,QAAM,YAAY;AAClB,QAAM,iBAAiB;AACvB,SAAO;AAAA,IACL,SAAS,aAAa;AAAA,IACtB,QAAQ,MAAM,QAAQ,MAAM,IACxB,GAAG,OAAO,CAAC,OAAO,OAAO,CAAC,KAAK,OAAO,CAAC,KAAK,YAAY,mBACxD,MAAM,YAAY;AAAA,EACxB;AACF;AAEe,SAAR,UAA2B;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB;AAAA,EACA,aAAa;AAAA,EACb,aAAa;AACf,GAAG;AACD,QAAM,CAAC,YAAY,aAAa,QAAI,uBAAS,CAAC,CAAC;AAE/C,QAAM,CAAC,mBAAmB,aAAa,QAAI,uBAAS,IAAI;AACxD,QAAM,mBAAe,qBAAO;AAC5B,QAAM,gBAAY,qBAAO;AACzB,QAAM,eAAW,qBAAO;AACxB,QAAM,aAAS,qBAAO;AAGtB,8BAAU,MAAM;AACd,UAAM,cAAc,SAAS,aAAa;AAC1C,UAAM,WAAW,qBAAqB,UAAU;AAChD,UAAM,UAAU,SAAS;AAEzB,WAAO,UACL,eACA,YACA,IAAI,cAAAA,QAAO,aAAa,UAAU;AAAA,MAChC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,WAAW;AAAA,QACT,iBAAiB;AAAA,UACf,SAAS;AAAA,UACT,mBAAmB;AAAA,UACnB,GAAG,UAAU;AAAA,QACf;AAAA,QACA,QAAQ,gBAAgB;AAAA,UACtB;AAAA,UACA;AAAA,QACF,CAAC;AAAA,QACD,GAAG;AAAA,QACH,OAAO;AAAA,UACL,SAAS,CAAC,CAAC;AAAA,UACX,SAAS;AAAA,QACX;AAAA,QACA,YAAY,EAAE,SAAS,MAAM;AAAA,QAC7B,qBAAqB;AAAA,UACnB,OAAO;AAAA,UACP,SAAS;AAAA,UACT,IAAI,CAAC,SAAS;AACZ,0BAAc,IAAI;AAClB,mBAAO;AAAA,UACT;AAAA,QACF;AAAA,MACF;AAAA,IACF,CAAC;AAEH,WAAO,MAAM;AACX,UAAI,OAAO;AAAS,eAAO,QAAQ,QAAQ;AAAA,IAC7C;AAAA,EACF,GAAG,CAAC,OAAO,mBAAmB,WAAW,WAAW,QAAQ,WAAW,aAAa,CAAC;AAGrF,8BAAU,MAAM;AACd,QAAI,CAAC,OAAO;AAAS;AACrB,WAAO,QAAQ,OAAO;AAAA,EACxB,GAAG,CAAC,OAAO,OAAO,CAAC;AAEnB,QAAM,QAAQ;AAAA,IACZ,KAAK;AAAA,IACL,OAAO,WAAW;AAAA,EACpB;AACA,QAAM,cAAc;AAAA,IAClB,OAAO,WAAW;AAAA,IAClB,KAAK;AAAA,IACL,WAAW,WAAW;AAAA,IACtB,eAAe;AAAA,EACjB;AACA,QAAM,YAAY;AAAA,IAChB,KAAK;AAAA,EACP;AACA,SAAO;AAAA,IACL,gBAAgB,OAAO;AAAA,IACvB,QAAQ;AAAA,IACR;AAAA,IACA;AAAA;AAAA,IAEA;AAAA,EACF;AACF;",
6
+ "names": ["Popper"]
7
+ }
@@ -0,0 +1,40 @@
1
+ import * as React from "react";
2
+ import { jsx, jsxs } from "react/jsx-runtime";
3
+ import { forwardRef } from "react";
4
+ import { aggregatedClasses } from "@elliemae/ds-legacy-classnames";
5
+ import { getArrowStylesBySize } from "@elliemae/ds-legacy-popper";
6
+ const ArrowWrapper = aggregatedClasses("span")("popover", "arrow");
7
+ const Arrow = ({ style, className, innerRef, blockName = "popover", placement, ...otherProps }) => /* @__PURE__ */ jsx(
8
+ ArrowWrapper,
9
+ {
10
+ className,
11
+ "data-placement": placement,
12
+ ...otherProps,
13
+ innerRef,
14
+ style: {
15
+ ...style,
16
+ ...getArrowStylesBySize(placement, 25)
17
+ },
18
+ children: /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 30 30", children: [
19
+ /* @__PURE__ */ jsx(
20
+ "path",
21
+ {
22
+ className: "stroke",
23
+ 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"
24
+ }
25
+ ),
26
+ /* @__PURE__ */ jsx(
27
+ "path",
28
+ {
29
+ className: "fill",
30
+ 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"
31
+ }
32
+ )
33
+ ] })
34
+ }
35
+ );
36
+ var Arrow_default = forwardRef((props, ref) => /* @__PURE__ */ jsx(Arrow, { ...props, innerRef: ref || props.innerRef }));
37
+ export {
38
+ Arrow_default as default
39
+ };
40
+ //# sourceMappingURL=Arrow.js.map
@@ -0,0 +1,7 @@
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-legacy-classnames';\nimport { getArrowStylesBySize } from '@elliemae/ds-legacy-popper';\n\nconst ArrowWrapper = aggregatedClasses('span')('popover', 'arrow');\nconst Arrow = ({ style, className, innerRef, blockName = 'popover', placement, ...otherProps }) => (\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\nexport default forwardRef((props, ref) => <Arrow {...props} innerRef={ref || props.innerRef} />);\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACgBnB,SACE,KADF;AAhBJ,SAAgB,kBAAkB;AAClC,SAAS,yBAAyB;AAClC,SAAS,4BAA4B;AAErC,MAAM,eAAe,kBAAkB,MAAM,EAAE,WAAW,OAAO;AACjE,MAAM,QAAQ,CAAC,EAAE,OAAO,WAAW,UAAU,YAAY,WAAW,WAAW,GAAG,WAAW,MAC3F;AAAA,EAAC;AAAA;AAAA,IACC;AAAA,IACA,kBAAgB;AAAA,IACf,GAAG;AAAA,IACJ;AAAA,IACA,OAAO;AAAA,MACL,GAAG;AAAA,MACH,GAAG,qBAAqB,WAAW,EAAE;AAAA,IACvC;AAAA,IAEA,+BAAC,SAAI,SAAQ,aACX;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,GAAE;AAAA;AAAA,MAEJ;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,GAAE;AAAA;AAAA,MACJ;AAAA,OACF;AAAA;AACF;AAGF,IAAO,gBAAQ,WAAW,CAAC,OAAO,QAAQ,oBAAC,SAAO,GAAG,OAAO,UAAU,OAAO,MAAM,UAAU,CAAE;",
6
+ "names": []
7
+ }
@@ -0,0 +1,138 @@
1
+ import * as React from "react";
2
+ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
3
+ import { useHoverHandlersDelay } from "@elliemae/ds-legacy-utilities";
4
+ import { PropTypes, describe } from "@elliemae/ds-legacy-props-helpers";
5
+ import { useHiddenController } from "@elliemae/ds-legacy-hidden";
6
+ import Popover from "./Popover.js";
7
+ import usePopper from "./usePopper.js";
8
+ import Arrow from "./Arrow.js";
9
+ import usePopoverProviderState from "./usePopoverProviderState.js";
10
+ export * from "@elliemae/ds-legacy-popper";
11
+ const Interaction = {
12
+ CLICK: "click",
13
+ HOVER: "hover"
14
+ };
15
+ const DSPopover = ({
16
+ containerProps,
17
+ content,
18
+ // react component inside the popover to render its content
19
+ renderer,
20
+ // function to render the popover component, ex: (popoverProps) => (<div {...popoverProps}></div>)
21
+ visible: visibleProp,
22
+ offset,
23
+ showArrow,
24
+ // popper props options
25
+ placement,
26
+ boundaries,
27
+ // scrollParent | window | viewport
28
+ modifiers,
29
+ referenceEl,
30
+ renderTrigger,
31
+ onClickOutside,
32
+ destroyOnHidden,
33
+ interactionType,
34
+ isOpen,
35
+ style
36
+ }) => {
37
+ const { visible, onShow, onHide, onToggle } = useHiddenController(visibleProp);
38
+ const { reference, popper, arrow, popperData } = usePopper({
39
+ placement,
40
+ showArrow,
41
+ boundaries,
42
+ modifiers,
43
+ offset,
44
+ referenceEl,
45
+ eventsEnabled: visible,
46
+ isOpen
47
+ });
48
+ const hoverHandlers = useHoverHandlersDelay({
49
+ onMouseOver: onShow,
50
+ onMouseLeave: onHide
51
+ });
52
+ const isPopoverVisible = visible || isOpen;
53
+ return /* @__PURE__ */ jsxs(Fragment, { children: [
54
+ renderTrigger({
55
+ ...reference,
56
+ handlers: interactionType === "click" ? { onClick: onToggle } : hoverHandlers,
57
+ onShow,
58
+ onToggle,
59
+ onHide,
60
+ "aria-haspopup": true,
61
+ "aria-expanded": visible
62
+ }),
63
+ isPopoverVisible && reference.ref && /* @__PURE__ */ jsxs(
64
+ Popover,
65
+ {
66
+ containerProps,
67
+ destroyOnHidden,
68
+ interactionType,
69
+ isOpen,
70
+ onClickOutside: (...args) => {
71
+ onClickOutside(...args);
72
+ if (interactionType === "click")
73
+ onHide();
74
+ },
75
+ popperProps: popper,
76
+ renderer: renderer && ((props) => renderer({
77
+ ...props,
78
+ onShow,
79
+ onToggle,
80
+ onHide
81
+ })),
82
+ style,
83
+ visible: isPopoverVisible,
84
+ children: [
85
+ showArrow && /* @__PURE__ */ jsx(Arrow, { ...arrow, placement: popperData.placement }),
86
+ isPopoverVisible && content
87
+ ]
88
+ }
89
+ )
90
+ ] });
91
+ };
92
+ DSPopover.defaultProps = {
93
+ containerProps: {},
94
+ renderer: void 0,
95
+ visible: void 0,
96
+ offset: void 0,
97
+ showArrow: false,
98
+ placement: "top",
99
+ modifiers: {},
100
+ renderTrigger: () => null,
101
+ onClickOutside: () => null,
102
+ destroyOnHidden: true,
103
+ isOpen: void 0
104
+ };
105
+ const popoverProps = {
106
+ containerProps: PropTypes.shape({}).description("Set of Properties attached to the main container"),
107
+ destroyOnHidden: PropTypes.bool.description("destroy popover on hidden or not").defaultValue(true),
108
+ renderer: PropTypes.func.description("custom renderer"),
109
+ popperProps: PropTypes.object.description("Popper props attached to container"),
110
+ visible: PropTypes.bool.description("is visible or not").defaultValue(false),
111
+ content: PropTypes.oneOfType([PropTypes.element, PropTypes.string]).description("popover content"),
112
+ onClickOutside: PropTypes.func.description("function called on click outside"),
113
+ interaction: PropTypes.string.description("interaction type: hover, click"),
114
+ offset: PropTypes.object.description("offset"),
115
+ showArrow: PropTypes.bool.description("show tooltip arrow or not"),
116
+ placement: PropTypes.string.description("popover placement: top, bottom, right, left"),
117
+ boundaries: PropTypes.string.description("popover boundaries"),
118
+ modifiers: PropTypes.object.description("modifiers"),
119
+ style: PropTypes.object.description("css style object"),
120
+ referenceEl: PropTypes.element.description("reference element"),
121
+ renderTrigger: PropTypes.func.description("render trigger element"),
122
+ interactionType: PropTypes.string.description("interaction type"),
123
+ isOpen: PropTypes.bool.description("open or not").defaultValue(false)
124
+ };
125
+ DSPopover.propTypes = popoverProps;
126
+ DSPopover.displayName = "DSPopover";
127
+ const PopoverWithSchema = describe(DSPopover);
128
+ PopoverWithSchema.propTypes = popoverProps;
129
+ var DSPopover_default = DSPopover;
130
+ export {
131
+ DSPopover,
132
+ Interaction,
133
+ PopoverWithSchema,
134
+ DSPopover_default as default,
135
+ usePopoverProviderState,
136
+ usePopper
137
+ };
138
+ //# sourceMappingURL=DSPopover.js.map
@@ -0,0 +1,7 @@
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 { useHoverHandlersDelay } from '@elliemae/ds-legacy-utilities';\nimport { PropTypes, describe } from '@elliemae/ds-legacy-props-helpers';\nimport { useHiddenController } from '@elliemae/ds-legacy-hidden';\nimport Popover from './Popover.js';\nimport usePopper from './usePopper.js';\nimport Arrow from './Arrow.js';\nimport usePopoverProviderState from './usePopoverProviderState.js';\n\nexport * from '@elliemae/ds-legacy-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;\nDSPopover.displayName = 'DSPopover';\nconst PopoverWithSchema = describe(DSPopover);\nPopoverWithSchema.propTypes = popoverProps;\n\nexport { DSPopover, usePopper, usePopoverProviderState, PopoverWithSchema };\n\nexport default DSPopover;\n"],
5
+ "mappings": "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",
6
+ "names": []
7
+ }
@@ -0,0 +1,41 @@
1
+ import * as React from "react";
2
+ import { jsx } from "react/jsx-runtime";
3
+ import { useRef, useContext } from "react";
4
+ import { omit } from "lodash";
5
+ import { aggregatedClasses } from "@elliemae/ds-legacy-classnames";
6
+ import { isFunction, removeUndefinedProperties, useOnClickOutside } from "@elliemae/ds-legacy-utilities";
7
+ import { useHiddenTransition } from "@elliemae/ds-legacy-hidden";
8
+ import DSPortal from "@elliemae/ds-legacy-portal";
9
+ import { ThemeContext } from "@elliemae/ds-legacy-system";
10
+ const blockName = "popover";
11
+ const PopoverComponent = aggregatedClasses("div")(blockName);
12
+ const Popover = ({
13
+ containerProps,
14
+ destroyOnHidden = true,
15
+ renderer = void 0,
16
+ popperProps = {},
17
+ visible = false,
18
+ content = void 0,
19
+ onClickOutside = () => null,
20
+ style,
21
+ ...otherProps
22
+ }) => {
23
+ const popoverRef = useRef();
24
+ const hiddenTransitionProps = useHiddenTransition({ visible });
25
+ const popoverProps = removeUndefinedProperties({
26
+ containerprops: containerProps,
27
+ content,
28
+ ref: popoverRef,
29
+ ...otherProps,
30
+ ...hiddenTransitionProps
31
+ });
32
+ useOnClickOutside(popoverRef, onClickOutside);
33
+ const theme = useContext(ThemeContext);
34
+ const wrapStyle = omit(style, "zIndex") || {};
35
+ return destroyOnHidden && !hiddenTransitionProps.destroyed && /* @__PURE__ */ jsx(DSPortal, { children: /* @__PURE__ */ jsx("div", { role: "region", "aria-label": "popover menu", ...popperProps, style: { zIndex: theme.zIndex.popper, ...style, ...popperProps.style }, children: isFunction(renderer) ? renderer(popoverProps) : /* @__PURE__ */ jsx(PopoverComponent, { ...popoverProps, style: wrapStyle }) }) });
36
+ };
37
+ var Popover_default = Popover;
38
+ export {
39
+ Popover_default as default
40
+ };
41
+ //# sourceMappingURL=Popover.js.map
@@ -0,0 +1,7 @@
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, useContext } from 'react';\nimport { omit } from 'lodash';\nimport { aggregatedClasses } from '@elliemae/ds-legacy-classnames';\nimport { isFunction, removeUndefinedProperties, useOnClickOutside } from '@elliemae/ds-legacy-utilities';\nimport { useHiddenTransition } from '@elliemae/ds-legacy-hidden';\nimport DSPortal from '@elliemae/ds-legacy-portal';\nimport { ThemeContext } from '@elliemae/ds-legacy-system';\n\nconst blockName = 'popover';\nconst PopoverComponent = aggregatedClasses('div')(blockName);\n\nconst 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 theme = useContext(ThemeContext);\n\n const wrapStyle = omit(style, 'zIndex') || {};\n return (\n destroyOnHidden &&\n !hiddenTransitionProps.destroyed && (\n <DSPortal>\n <div role=\"region\" aria-label=\"popover menu\" {...popperProps} style={{ zIndex: theme.zIndex.popper, ...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,YAAY,WAAW;AC0CoC;AA1C3D,SAAgB,QAAQ,kBAAkB;AAC1C,SAAS,YAAY;AACrB,SAAS,yBAAyB;AAClC,SAAS,YAAY,2BAA2B,yBAAyB;AACzE,SAAS,2BAA2B;AACpC,OAAO,cAAc;AACrB,SAAS,oBAAoB;AAE7B,MAAM,YAAY;AAClB,MAAM,mBAAmB,kBAAkB,KAAK,EAAE,SAAS;AAE3D,MAAM,UAAU,CAAC;AAAA,EACf;AAAA,EACA,kBAAkB;AAAA,EAClB,WAAW;AAAA,EACX,cAAc,CAAC;AAAA,EACf,UAAU;AAAA,EACV,UAAU;AAAA,EACV,iBAAiB,MAAM;AAAA,EACvB;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,aAAa,OAAO;AAC1B,QAAM,wBAAwB,oBAAoB,EAAE,QAAQ,CAAC;AAC7D,QAAM,eAAe,0BAA0B;AAAA,IAC7C,gBAAgB;AAAA,IAChB;AAAA,IACA,KAAK;AAAA,IACL,GAAG;AAAA,IACH,GAAG;AAAA,EACL,CAAC;AAED,oBAAkB,YAAY,cAAc;AAE5C,QAAM,QAAQ,WAAW,YAAY;AAErC,QAAM,YAAY,KAAK,OAAO,QAAQ,KAAK,CAAC;AAC5C,SACE,mBACA,CAAC,sBAAsB,aACrB,oBAAC,YACC,8BAAC,SAAI,MAAK,UAAS,cAAW,gBAAgB,GAAG,aAAa,OAAO,EAAE,QAAQ,MAAM,OAAO,QAAQ,GAAG,OAAO,GAAG,YAAY,MAAM,GAChI,qBAAW,QAAQ,IAAI,SAAS,YAAY,IAAI,oBAAC,oBAAkB,GAAG,cAAc,OAAO,WAAW,GACzG,GACF;AAGN;AAEA,IAAO,kBAAQ;",
6
+ "names": []
7
+ }
@@ -0,0 +1,41 @@
1
+ import * as React from "react";
2
+ import { jsx } from "react/jsx-runtime";
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
+ const PopoverTrigger = ({ as: Component, ...props }) => {
33
+ const hiddenTriggerProps = useHiddenTrigger(props);
34
+ return /* @__PURE__ */ jsx(Component, { ...hiddenTriggerProps });
35
+ };
36
+ var PopoverTrigger_default = PopoverTrigger;
37
+ export {
38
+ Interaction,
39
+ PopoverTrigger_default as default
40
+ };
41
+ //# sourceMappingURL=PopoverTrigger.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/PopoverTrigger.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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\nconst PopoverTrigger = ({ as: Component, ...props }) => {\n const hiddenTriggerProps = useHiddenTrigger(props);\n\n return <Component {...hiddenTriggerProps} />;\n};\n\nexport default PopoverTrigger;\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACoCd;AAlCF,MAAM,cAAc;AAAA,EACzB,OAAO;AAAA,EACP,OAAO;AACT;AAEA,MAAM,OAAO,MAAM;AAAC;AAEpB,SAAS,iBAAiB;AAAA,EACxB;AAAA,EACA,UAAU;AAAA,EACV,cAAc;AAAA,EACd,WAAW;AAAA,EACX,SAAS;AAAA,EACT,SAAS;AACX,GAAG;AACD,QAAM,WAAW;AAAA,IACf,CAAC,YAAY,KAAK,GAAG;AAAA,MACnB,SAAS;AAAA,IACX;AAAA,IACA,CAAC,YAAY,KAAK,GAAG;AAAA,MACnB,cAAc;AAAA,MACd,cAAc;AAAA,IAChB;AAAA,EACF;AACA,SAAO;AAAA,IACL,iBAAiB;AAAA,IACjB,GAAG,SAAS,WAAW;AAAA,IACvB,iBAAiB;AAAA,EACnB;AACF;AAEA,MAAM,iBAAiB,CAAC,EAAE,IAAI,WAAW,GAAG,MAAM,MAAM;AACtD,QAAM,qBAAqB,iBAAiB,KAAK;AAEjD,SAAO,oBAAC,aAAW,GAAG,oBAAoB;AAC5C;AAEA,IAAO,yBAAQ;",
6
+ "names": []
7
+ }
@@ -0,0 +1,7 @@
1
+ import * as React from "react";
2
+ export * from "./DSPopover.js";
3
+ import { default as default2 } from "./DSPopover.js";
4
+ export {
5
+ default2 as default
6
+ };
7
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "export * from './DSPopover.js';\nexport { default } from './DSPopover.js';\n"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACAvB,cAAc;AACd,SAAS,WAAAA,gBAAe;",
6
+ "names": ["default"]
7
+ }
@@ -0,0 +1,7 @@
1
+ {
2
+ "type": "module",
3
+ "sideEffects": [
4
+ "*.css",
5
+ "*.scss"
6
+ ]
7
+ }
@@ -0,0 +1,16 @@
1
+ import * as React from "react";
2
+ import usePopper from "./usePopper.js";
3
+ function usePopover({ ...otherProps }) {
4
+ const { reference, popper, arrow, ...popperProps } = usePopper(otherProps);
5
+ return {
6
+ triggerProps: { ...reference },
7
+ popoverProps: { ...popper },
8
+ arrowProps: { ...arrow },
9
+ ...popperProps
10
+ };
11
+ }
12
+ var usePopover_default = usePopover;
13
+ export {
14
+ usePopover_default as default
15
+ };
16
+ //# sourceMappingURL=usePopover.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/usePopover.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import usePopper from './usePopper.js';\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"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACAvB,OAAO,eAAe;AAEtB,SAAS,WAAW,EAAE,GAAG,WAAW,GAAG;AACrC,QAAM,EAAE,WAAW,QAAQ,OAAO,GAAG,YAAY,IAAI,UAAU,UAAU;AAEzE,SAAO;AAAA,IACL,cAAc,EAAE,GAAG,UAAU;AAAA,IAC7B,cAAc,EAAE,GAAG,OAAO;AAAA,IAC1B,YAAY,EAAE,GAAG,MAAM;AAAA,IACvB,GAAG;AAAA,EACL;AACF;AAEA,IAAO,qBAAQ;",
6
+ "names": []
7
+ }
@@ -0,0 +1,56 @@
1
+ import * as React from "react";
2
+ import { useState, useEffect, useRef } from "react";
3
+ import { throttle } from "lodash";
4
+ import { useExecutionTimer } from "@elliemae/ds-legacy-utilities";
5
+ function usePopoverProviderState({
6
+ initialState = {
7
+ reference: null,
8
+ visible: false,
9
+ value: "",
10
+ options: {}
11
+ },
12
+ delay
13
+ }) {
14
+ const triggerRef = useRef();
15
+ const [tooltipState, setTooltipState] = useState(initialState);
16
+ const show = (state) => {
17
+ setTooltipState((prevState) => ({
18
+ ...prevState,
19
+ ...state,
20
+ visible: true
21
+ }));
22
+ };
23
+ const hide = (state) => {
24
+ setTooltipState((prevState) => ({
25
+ ...prevState,
26
+ ...state,
27
+ visible: false
28
+ }));
29
+ };
30
+ const [showTooltip, hideTooltip] = useExecutionTimer(show, hide, delay);
31
+ const handleShowTooltip = (state, e) => {
32
+ triggerRef.current = e.target;
33
+ showTooltip({ ...state, reference: e.target });
34
+ };
35
+ const handleHideTooltip = (state) => {
36
+ hideTooltip(state);
37
+ };
38
+ useEffect(() => {
39
+ window.addEventListener("scroll", throttle(handleHideTooltip, 300), true);
40
+ window.addEventListener("click", handleHideTooltip, true);
41
+ return () => {
42
+ window.removeEventListener("scroll", throttle(handleHideTooltip, 300), true);
43
+ window.addEventListener("click", handleHideTooltip, true);
44
+ };
45
+ }, [tooltipState.reference]);
46
+ return {
47
+ show: handleShowTooltip,
48
+ hide: handleHideTooltip,
49
+ state: tooltipState
50
+ };
51
+ }
52
+ var usePopoverProviderState_default = usePopoverProviderState;
53
+ export {
54
+ usePopoverProviderState_default as default
55
+ };
56
+ //# sourceMappingURL=usePopoverProviderState.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/usePopoverProviderState.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useState, useEffect, useRef } from 'react';\nimport { throttle } from 'lodash';\nimport { useExecutionTimer } from '@elliemae/ds-legacy-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"],
5
+ "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,UAAU,WAAW,cAAc;AAC5C,SAAS,gBAAgB;AACzB,SAAS,yBAAyB;AAElC,SAAS,wBAAwB;AAAA,EAC/B,eAAe;AAAA,IACb,WAAW;AAAA,IACX,SAAS;AAAA,IACT,OAAO;AAAA,IACP,SAAS,CAAC;AAAA,EACZ;AAAA,EACA;AACF,GAAG;AACD,QAAM,aAAa,OAAO;AAC1B,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,YAAY;AAE7D,QAAM,OAAO,CAAC,UAAU;AACtB,oBAAgB,CAAC,eAAe;AAAA,MAC9B,GAAG;AAAA,MACH,GAAG;AAAA,MACH,SAAS;AAAA,IACX,EAAE;AAAA,EACJ;AACA,QAAM,OAAO,CAAC,UAAU;AACtB,oBAAgB,CAAC,eAAe;AAAA,MAC9B,GAAG;AAAA,MACH,GAAG;AAAA,MACH,SAAS;AAAA,IACX,EAAE;AAAA,EACJ;AAEA,QAAM,CAAC,aAAa,WAAW,IAAI,kBAAkB,MAAM,MAAM,KAAK;AAEtE,QAAM,oBAAoB,CAAC,OAAO,MAAM;AACtC,eAAW,UAAU,EAAE;AACvB,gBAAY,EAAE,GAAG,OAAO,WAAW,EAAE,OAAO,CAAC;AAAA,EAC/C;AAEA,QAAM,oBAAoB,CAAC,UAAU;AACnC,gBAAY,KAAK;AAAA,EACnB;AAEA,YAAU,MAAM;AACd,WAAO,iBAAiB,UAAU,SAAS,mBAAmB,GAAG,GAAG,IAAI;AACxE,WAAO,iBAAiB,SAAS,mBAAmB,IAAI;AACxD,WAAO,MAAM;AACX,aAAO,oBAAoB,UAAU,SAAS,mBAAmB,GAAG,GAAG,IAAI;AAC3E,aAAO,iBAAiB,SAAS,mBAAmB,IAAI;AAAA,IAC1D;AAAA,EACF,GAAG,CAAC,aAAa,SAAS,CAAC;AAE3B,SAAO;AAAA,IACL,MAAM;AAAA,IACN,MAAM;AAAA,IACN,OAAO;AAAA,EACT;AACF;AAEA,IAAO,kCAAQ;",
6
+ "names": []
7
+ }