@elliemae/ds-popover 2.2.0-next.4 → 2.3.0-alpha.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/esm/Popover.js CHANGED
@@ -1,57 +1,44 @@
1
- import 'core-js/modules/esnext.async-iterator.filter.js';
2
- import 'core-js/modules/esnext.iterator.constructor.js';
3
- import 'core-js/modules/esnext.iterator.filter.js';
4
- import 'core-js/modules/esnext.async-iterator.for-each.js';
5
- import 'core-js/modules/esnext.iterator.for-each.js';
6
- import _jsx from '@babel/runtime/helpers/esm/jsx';
7
- import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
8
- import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
9
- import { useRef } from 'react';
10
- import { omit } from 'lodash';
11
- import { aggregatedClasses } from '@elliemae/ds-classnames';
12
- import { removeUndefinedProperties, useOnClickOutside, isFunction } from '@elliemae/ds-utilities';
13
- import { useHiddenTransition } from '@elliemae/ds-hidden';
14
- import DSPortal from '@elliemae/ds-portal';
15
- import { jsx } from 'react/jsx-runtime';
16
-
17
- const _excluded = ["containerProps", "destroyOnHidden", "renderer", "popperProps", "visible", "content", "onClickOutside", "style"];
18
-
19
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
20
-
21
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
22
- const blockName = 'popover';
23
- const PopoverComponent = aggregatedClasses('div')(blockName);
24
-
25
- function Popover(_ref) {
26
- let {
27
- containerProps,
28
- destroyOnHidden = true,
29
- renderer = undefined,
30
- popperProps = {},
31
- visible = false,
32
- content = undefined,
33
- onClickOutside = () => null,
34
- style
35
- } = _ref,
36
- otherProps = _objectWithoutProperties(_ref, _excluded);
37
-
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
+ }) {
38
21
  const popoverRef = useRef();
39
- const hiddenTransitionProps = useHiddenTransition({
40
- visible
41
- });
42
- const popoverProps = removeUndefinedProperties(_objectSpread(_objectSpread({
22
+ const hiddenTransitionProps = useHiddenTransition({ visible });
23
+ const popoverProps = removeUndefinedProperties({
43
24
  containerprops: containerProps,
44
25
  content,
45
- ref: popoverRef
46
- }, otherProps), hiddenTransitionProps));
26
+ ref: popoverRef,
27
+ ...otherProps,
28
+ ...hiddenTransitionProps
29
+ });
47
30
  useOnClickOutside(popoverRef, onClickOutside);
48
- const wrapStyle = omit(style, 'zIndex') || {};
49
- return destroyOnHidden && !hiddenTransitionProps.destroyed && /*#__PURE__*/_jsx(DSPortal, {}, void 0, /*#__PURE__*/jsx("div", _objectSpread(_objectSpread({}, popperProps), {}, {
50
- style: _objectSpread(_objectSpread({}, style), popperProps.style),
51
- children: isFunction(renderer) ? renderer(popoverProps) : /*#__PURE__*/jsx(PopoverComponent, _objectSpread(_objectSpread({}, popoverProps), {}, {
52
- style: wrapStyle
53
- }))
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
54
38
  })));
55
39
  }
56
-
57
- export { Popover as default };
40
+ var Popover_default = Popover;
41
+ export {
42
+ Popover_default as default
43
+ };
44
+ //# 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 } 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,34 +1,19 @@
1
- import 'core-js/modules/esnext.async-iterator.filter.js';
2
- import 'core-js/modules/esnext.iterator.constructor.js';
3
- import 'core-js/modules/esnext.iterator.filter.js';
4
- import 'core-js/modules/esnext.async-iterator.for-each.js';
5
- import 'core-js/modules/esnext.iterator.for-each.js';
6
- import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
7
- import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
8
- import 'react';
9
- import { jsx } from 'react/jsx-runtime';
10
-
11
- const _excluded = ["as"];
12
-
13
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
14
-
15
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
1
+ import * as React from "react";
2
+ import React2 from "react";
16
3
  const Interaction = {
17
- CLICK: 'click',
18
- HOVER: 'hover'
4
+ CLICK: "click",
5
+ HOVER: "hover"
19
6
  };
20
-
21
- const noop = () => {};
22
-
23
- function useHiddenTrigger(_ref) {
24
- let {
25
- hiddenId,
26
- visible = false,
27
- interaction = 'click',
28
- onToggle = noop,
29
- onShow = noop,
30
- onHide = noop
31
- } = _ref;
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
+ }) {
32
17
  const handlers = {
33
18
  [Interaction.CLICK]: {
34
19
  onClick: onToggle
@@ -38,21 +23,21 @@ function useHiddenTrigger(_ref) {
38
23
  onMouseLeave: onHide
39
24
  }
40
25
  };
41
- return _objectSpread(_objectSpread({
42
- 'aria-expanded': visible
43
- }, handlers[interaction]), {}, {
44
- 'aria-controls': hiddenId
45
- });
26
+ return {
27
+ "aria-expanded": visible,
28
+ ...handlers[interaction],
29
+ "aria-controls": hiddenId
30
+ };
46
31
  }
47
-
48
- function PopoverTrigger(_ref2) {
49
- let {
50
- as: Component
51
- } = _ref2,
52
- props = _objectWithoutProperties(_ref2, _excluded);
53
-
32
+ function PopoverTrigger({ as: Component, ...props }) {
54
33
  const hiddenTriggerProps = useHiddenTrigger(props);
55
- return /*#__PURE__*/jsx(Component, _objectSpread({}, hiddenTriggerProps));
34
+ return /* @__PURE__ */ React2.createElement(Component, {
35
+ ...hiddenTriggerProps
36
+ });
56
37
  }
57
-
58
- export { Interaction, PopoverTrigger as default };
38
+ var PopoverTrigger_default = PopoverTrigger;
39
+ export {
40
+ Interaction,
41
+ PopoverTrigger_default as default
42
+ };
43
+ //# 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\nfunction PopoverTrigger({ as: Component, ...props }) {\n const hiddenTriggerProps = useHiddenTrigger(props);\n\n return <Component {...hiddenTriggerProps} />;\n}\n\nexport default PopoverTrigger;\n"],
5
+ "mappings": "AAAA;ACAA;AAEO,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,qCAAC,WAAD;AAAA,OAAe;AAAA;AAAA;AAGxB,IAAO,yBAAQ;",
6
+ "names": []
7
+ }
package/esm/index.js CHANGED
@@ -1,4 +1,7 @@
1
- export { DSPopover, Interaction, PopoverWithSchema, DSPopover as default } from './DSPopover.js';
2
- export * from '@elliemae/ds-popper';
3
- export { default as usePopper } from './usePopper.js';
4
- export { default as usePopoverProviderState } from './usePopoverProviderState.js';
1
+ import * as React from "react";
2
+ export * from "./DSPopover";
3
+ import { default as default2 } from "./DSPopover";
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';\nexport { default } from './DSPopover';\n"],
5
+ "mappings": "AAAA;ACAA;AACA;",
6
+ "names": []
7
+ }
package/esm/usePopover.js CHANGED
@@ -1,34 +1,16 @@
1
- import 'core-js/modules/esnext.async-iterator.filter.js';
2
- import 'core-js/modules/esnext.iterator.constructor.js';
3
- import 'core-js/modules/esnext.iterator.filter.js';
4
- import 'core-js/modules/esnext.async-iterator.for-each.js';
5
- import 'core-js/modules/esnext.iterator.for-each.js';
6
- import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
7
- import _objectWithoutProperties from '@babel/runtime/helpers/esm/objectWithoutProperties';
8
- import usePopper from './usePopper.js';
9
-
10
- const _excluded = ["reference", "popper", "arrow"];
11
-
12
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
13
-
14
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
15
-
16
- function usePopover(_ref) {
17
- let otherProps = Object.assign({}, _ref);
18
-
19
- const _usePopper = usePopper(otherProps),
20
- {
21
- reference,
22
- popper,
23
- arrow
24
- } = _usePopper,
25
- popperProps = _objectWithoutProperties(_usePopper, _excluded);
26
-
27
- return _objectSpread({
28
- triggerProps: _objectSpread({}, reference),
29
- popoverProps: _objectSpread({}, popper),
30
- arrowProps: _objectSpread({}, arrow)
31
- }, popperProps);
1
+ import * as React from "react";
2
+ import usePopper from "./usePopper";
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
+ };
32
11
  }
33
-
34
- export { usePopover as default };
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';\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;ACAA;AAEA,oBAAoB,KAAK,cAAc;AACrC,QAAM,EAAE,WAAW,QAAQ,UAAU,gBAAgB,UAAU;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,62 +1,46 @@
1
- import 'core-js/modules/esnext.async-iterator.filter.js';
2
- import 'core-js/modules/esnext.iterator.constructor.js';
3
- import 'core-js/modules/esnext.iterator.filter.js';
4
- import 'core-js/modules/esnext.async-iterator.for-each.js';
5
- import 'core-js/modules/esnext.iterator.for-each.js';
6
- import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
7
- import 'core-js/modules/web.dom-collections.iterator.js';
8
- import { useRef, useState, useEffect } from 'react';
9
- import { throttle } from 'lodash';
10
- import { useExecutionTimer } from '@elliemae/ds-utilities';
11
-
12
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
13
-
14
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
15
-
16
- function usePopoverProviderState(_ref) {
17
- let {
18
- initialState = {
19
- reference: null,
20
- visible: false,
21
- value: '',
22
- options: {}
23
- },
24
- delay
25
- } = _ref;
1
+ import * as React from "react";
2
+ import { useState, useEffect, useRef } from "react";
3
+ import { throttle } from "lodash";
4
+ import { useExecutionTimer } from "@elliemae/ds-utilities";
5
+ function usePopoverProviderState({
6
+ initialState = {
7
+ reference: null,
8
+ visible: false,
9
+ value: "",
10
+ options: {}
11
+ },
12
+ delay
13
+ }) {
26
14
  const triggerRef = useRef();
27
15
  const [tooltipState, setTooltipState] = useState(initialState);
28
-
29
- const show = state => {
30
- setTooltipState(prevState => _objectSpread(_objectSpread(_objectSpread({}, prevState), state), {}, {
16
+ const show = (state) => {
17
+ setTooltipState((prevState) => ({
18
+ ...prevState,
19
+ ...state,
31
20
  visible: true
32
21
  }));
33
22
  };
34
-
35
- const hide = state => {
36
- setTooltipState(prevState => _objectSpread(_objectSpread(_objectSpread({}, prevState), state), {}, {
23
+ const hide = (state) => {
24
+ setTooltipState((prevState) => ({
25
+ ...prevState,
26
+ ...state,
37
27
  visible: false
38
28
  }));
39
29
  };
40
-
41
30
  const [showTooltip, hideTooltip] = useExecutionTimer(show, hide, delay);
42
-
43
31
  const handleShowTooltip = (state, e) => {
44
32
  triggerRef.current = e.target;
45
- showTooltip(_objectSpread(_objectSpread({}, state), {}, {
46
- reference: e.target
47
- }));
33
+ showTooltip({ ...state, reference: e.target });
48
34
  };
49
-
50
- const handleHideTooltip = state => {
35
+ const handleHideTooltip = (state) => {
51
36
  hideTooltip(state);
52
37
  };
53
-
54
38
  useEffect(() => {
55
- window.addEventListener('scroll', throttle(handleHideTooltip, 300), true);
56
- window.addEventListener('click', handleHideTooltip, true);
39
+ window.addEventListener("scroll", throttle(handleHideTooltip, 300), true);
40
+ window.addEventListener("click", handleHideTooltip, true);
57
41
  return () => {
58
- window.removeEventListener('scroll', throttle(handleHideTooltip, 300), true);
59
- window.addEventListener('click', handleHideTooltip, true);
42
+ window.removeEventListener("scroll", throttle(handleHideTooltip, 300), true);
43
+ window.addEventListener("click", handleHideTooltip, true);
60
44
  };
61
45
  }, [tooltipState.reference]);
62
46
  return {
@@ -65,5 +49,8 @@ function usePopoverProviderState(_ref) {
65
49
  state: tooltipState
66
50
  };
67
51
  }
68
-
69
- export { usePopoverProviderState as default };
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-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;ACAA;AACA;AACA;AAEA,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,SAAS;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,kBAAkB,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,YAAU,MAAM;AACd,WAAO,iBAAiB,UAAU,SAAS,mBAAmB,MAAM;AACpE,WAAO,iBAAiB,SAAS,mBAAmB;AACpD,WAAO,MAAM;AACX,aAAO,oBAAoB,UAAU,SAAS,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
+ }
package/esm/usePopper.js CHANGED
@@ -1,50 +1,31 @@
1
- import 'core-js/modules/esnext.async-iterator.filter.js';
2
- import 'core-js/modules/esnext.iterator.constructor.js';
3
- import 'core-js/modules/esnext.iterator.filter.js';
4
- import 'core-js/modules/esnext.async-iterator.for-each.js';
5
- import 'core-js/modules/esnext.iterator.for-each.js';
6
- import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
7
- import 'core-js/modules/web.dom-collections.iterator.js';
8
- import Popper from 'popper.js';
9
- import { useState, useRef, useEffect } from 'react';
10
-
11
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
12
-
13
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
14
-
15
- function calculateOffset(_ref) {
16
- let {
17
- offset,
18
- showArrow
19
- } = _ref;
1
+ import * as React from "react";
2
+ import Popper from "popper.js";
3
+ import { useEffect, useRef, useState } from "react";
4
+ function calculateOffset({ offset, showArrow }) {
20
5
  const arrowSize = 10;
21
6
  const defaultPadding = 3;
22
7
  return {
23
8
  enabled: showArrow || offset,
24
- offset: Array.isArray(offset) ? "".concat(offset[0], ", ").concat((offset[1] || offset[0]) + arrowSize + defaultPadding) : "0, ".concat(arrowSize + defaultPadding)
9
+ offset: Array.isArray(offset) ? `${offset[0]}, ${(offset[1] || offset[0]) + arrowSize + defaultPadding}` : `0, ${arrowSize + defaultPadding}`
25
10
  };
26
11
  }
27
-
28
- function usePopper(_ref2) {
29
- let {
30
- offset,
31
- showArrow,
32
- placement,
33
- isOpen,
34
- modifiers,
35
- eventsEnabled = true,
36
- positionFixed,
37
- boundaries = 'scrollParent',
38
- referenceEl: refEl
39
- } = _ref2;
40
- const [popperData, setPopperData] = useState({}); // this is util for deferred rendering like with portals
41
-
12
+ function usePopper({
13
+ offset,
14
+ showArrow,
15
+ placement,
16
+ isOpen,
17
+ modifiers,
18
+ eventsEnabled = true,
19
+ positionFixed,
20
+ boundaries = "scrollParent",
21
+ referenceEl: refEl
22
+ }) {
23
+ const [popperData, setPopperData] = useState({});
42
24
  const [dynamicPopperNode, setPopperNode] = useState(null);
43
25
  const referenceRef = useRef();
44
26
  const popperRef = useRef();
45
27
  const arrowRef = useRef();
46
- const popper = useRef(); // initialize popper with refs and options
47
-
28
+ const popper = useRef();
48
29
  useEffect(() => {
49
30
  const referenceEl = refEl || referenceRef.current;
50
31
  const popperEl = dynamicPopperNode || popperRef.current;
@@ -54,40 +35,48 @@ function usePopper(_ref2) {
54
35
  isOpen,
55
36
  eventsEnabled,
56
37
  positionFixed,
57
- modifiers: _objectSpread(_objectSpread({
58
- preventOverflow: _objectSpread({
38
+ modifiers: {
39
+ preventOverflow: {
59
40
  padding: 0,
60
- boundariesElement: boundaries
61
- }, modifiers.preventOverflow),
41
+ boundariesElement: boundaries,
42
+ ...modifiers.preventOverflow
43
+ },
62
44
  offset: calculateOffset({
63
45
  offset,
64
46
  showArrow
65
- })
66
- }, modifiers), {}, {
47
+ }),
48
+ ...modifiers,
67
49
  arrow: {
68
50
  enabled: !!arrowEl,
69
51
  element: arrowEl
70
52
  },
71
- applyStyle: {
72
- enabled: false
73
- },
53
+ applyStyle: { enabled: false },
74
54
  updateStateModifier: {
75
55
  order: 900,
76
56
  enabled: true,
77
- fn: data => {
57
+ fn: (data) => {
78
58
  setPopperData(data);
79
59
  return data;
80
60
  }
81
61
  }
82
- })
62
+ }
83
63
  });
84
64
  return () => {
85
- if (popper.current) popper.current.destroy();
65
+ if (popper.current)
66
+ popper.current.destroy();
86
67
  };
87
- }, [refEl, dynamicPopperNode, placement, showArrow, offset, popperRef, eventsEnabled]); // update popper instance after initialization
88
-
68
+ }, [
69
+ refEl,
70
+ dynamicPopperNode,
71
+ placement,
72
+ showArrow,
73
+ offset,
74
+ popperRef,
75
+ eventsEnabled
76
+ ]);
89
77
  useEffect(() => {
90
- if (!popper.current) return;
78
+ if (!popper.current)
79
+ return;
91
80
  popper.current.update();
92
81
  }, [popper.current]);
93
82
  const arrow = {
@@ -98,7 +87,7 @@ function usePopper(_ref2) {
98
87
  style: popperData.styles,
99
88
  ref: setPopperNode,
100
89
  placement: popperData.placement,
101
- 'data-testid': 'popover-container'
90
+ "data-testid": "popover-container"
102
91
  };
103
92
  const reference = {
104
93
  ref: referenceRef
@@ -108,9 +97,10 @@ function usePopper(_ref2) {
108
97
  popper: popperProps,
109
98
  arrow,
110
99
  reference,
111
- // setPopperNode,
112
100
  popperData
113
101
  };
114
102
  }
115
-
116
- export { usePopper as default };
103
+ export {
104
+ usePopper as default
105
+ };
106
+ //# sourceMappingURL=usePopper.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/usePopper.tsx"],
4
+ "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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"],
5
+ "mappings": "AAAA;ACAA;AACA;AAEA,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,SAAS;AAE7C,QAAM,CAAC,mBAAmB,iBAAiB,SAAS;AACpD,QAAM,eAAe;AACrB,QAAM,YAAY;AAClB,QAAM,WAAW;AACjB,QAAM,SAAS;AAGf,YAAU,MAAM;AACd,UAAM,cAAc,SAAS,aAAa;AAC1C,UAAM,WAAW,qBAAqB,UAAU;AAChD,UAAM,UAAU,SAAS;AAEzB,WAAO,UACL,eACA,YACA,IAAI,OAAO,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,YAAU,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/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-popover",
3
- "version": "2.2.0-next.4",
3
+ "version": "2.3.0-alpha.2",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Popover",
6
6
  "module": "./esm/index.js",
@@ -60,11 +60,11 @@
60
60
  "build": "node ../../scripts/build/build.js"
61
61
  },
62
62
  "dependencies": {
63
- "@elliemae/ds-classnames": "2.2.0-next.4",
64
- "@elliemae/ds-hidden": "2.2.0-next.4",
65
- "@elliemae/ds-popper": "2.2.0-next.4",
66
- "@elliemae/ds-portal": "2.2.0-next.4",
67
- "@elliemae/ds-utilities": "2.2.0-next.4",
63
+ "@elliemae/ds-classnames": "2.3.0-alpha.2",
64
+ "@elliemae/ds-hidden": "2.3.0-alpha.2",
65
+ "@elliemae/ds-popper": "2.3.0-alpha.2",
66
+ "@elliemae/ds-portal": "2.3.0-alpha.2",
67
+ "@elliemae/ds-utilities": "2.3.0-alpha.2",
68
68
  "popper.js": "~1.16.1",
69
69
  "react-desc": "~4.1.3"
70
70
  },
@@ -142,24 +142,7 @@ declare const DSPopover: {
142
142
  };
143
143
  };
144
144
  declare const PopoverWithSchema: {
145
- (props?: {
146
- containerProps: any;
147
- content: any;
148
- renderer: any;
149
- visible: any;
150
- offset: any;
151
- showArrow: any;
152
- placement: any;
153
- boundaries: any;
154
- modifiers: any;
155
- referenceEl: any;
156
- renderTrigger: any;
157
- onClickOutside: any;
158
- destroyOnHidden: any;
159
- interactionType: any;
160
- isOpen: any;
161
- style: any;
162
- } | undefined): JSX.Element;
145
+ (props?: unknown): JSX.Element;
163
146
  propTypes: unknown;
164
147
  toTypescript: () => import("react-desc").TypescriptSchema;
165
148
  };