@elliemae/ds-popper 2.0.0-alpha.1 → 2.0.0-alpha.13

package/cjs/DSPopper.js

@@ -14,71 +14,74 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 
-const DSPopper = ({
-  containerProps,
-  arrowGap,
-  arrowSize,
-  blockName,
-  contentOffset,
-  contentStyle,
-  contentComponent,
-  delayClose,
-  delayOpen,
-  interactionType,
-  isOpen,
-  // if this is set DSPopper would be a controlled component if not, an uncontrolled one
-  onOpen,
-  onClose,
-  onPlacementChange,
-  placement,
-  preventOverflow,
-  showArrow,
-  closeAnimationConfig,
-  openAnimationConfig,
-  usePortal,
-  triggerComponent,
-  wrapExtraComponent,
-  getTargetFromChildren,
-  getContentFromChildren,
-  modifiers,
-  triggerRef,
-  children: customPopper,
-  renderReference,
-  referenceNode,
-  zIndex,
-  hideIfNotVisible
-}) => /*#__PURE__*/_jsx__default['default'](PopperImpl['default'], {
-  arrowGap: arrowGap,
-  arrowSize: arrowSize,
-  blockName: blockName,
-  closeAnimationConfig: closeAnimationConfig,
-  containerProps: containerProps,
-  contentComponent: contentComponent,
-  contentOffset: contentOffset,
-  contentStyle: contentStyle,
-  delayClose: delayClose,
-  delayOpen: delayOpen,
-  getContentFromChildren: getContentFromChildren,
-  getTargetFromChildren: getTargetFromChildren,
-  interactionType: interactionType,
-  isOpen: isOpen,
-  modifiers: modifiers,
-  onOpen: onOpen,
-  onClose: onClose,
-  onPlacementChange: onPlacementChange,
-  openAnimationConfig: openAnimationConfig,
-  placement: placement,
-  preventOverflow: preventOverflow,
-  referenceNode: referenceNode,
-  renderReference: renderReference,
-  showArrow: showArrow,
-  triggerComponent: triggerComponent,
-  triggerRef: triggerRef,
-  usePortal: usePortal,
-  wrapExtraComponent: wrapExtraComponent,
-  zIndex: zIndex,
-  hideIfNotVisible: hideIfNotVisible
-}, void 0, customPopper); // @deprecated: There's the NEW (not finished) popover that uses its own popper implementation.
+const DSPopper = _ref => {
+  let {
+    containerProps,
+    arrowGap,
+    arrowSize,
+    blockName,
+    contentOffset,
+    contentStyle,
+    contentComponent,
+    delayClose,
+    delayOpen,
+    interactionType,
+    isOpen,
+    // if this is set DSPopper would be a controlled component if not, an uncontrolled one
+    onOpen,
+    onClose,
+    onPlacementChange,
+    placement,
+    preventOverflow,
+    showArrow,
+    closeAnimationConfig,
+    openAnimationConfig,
+    usePortal,
+    triggerComponent,
+    wrapExtraComponent,
+    getTargetFromChildren,
+    getContentFromChildren,
+    modifiers,
+    triggerRef,
+    children: customPopper,
+    renderReference,
+    referenceNode,
+    zIndex,
+    hideIfNotVisible
+  } = _ref;
+  return /*#__PURE__*/_jsx__default["default"](PopperImpl["default"], {
+    arrowGap: arrowGap,
+    arrowSize: arrowSize,
+    blockName: blockName,
+    closeAnimationConfig: closeAnimationConfig,
+    containerProps: containerProps,
+    contentComponent: contentComponent,
+    contentOffset: contentOffset,
+    contentStyle: contentStyle,
+    delayClose: delayClose,
+    delayOpen: delayOpen,
+    getContentFromChildren: getContentFromChildren,
+    getTargetFromChildren: getTargetFromChildren,
+    interactionType: interactionType,
+    isOpen: isOpen,
+    modifiers: modifiers,
+    onOpen: onOpen,
+    onClose: onClose,
+    onPlacementChange: onPlacementChange,
+    openAnimationConfig: openAnimationConfig,
+    placement: placement,
+    preventOverflow: preventOverflow,
+    referenceNode: referenceNode,
+    renderReference: renderReference,
+    showArrow: showArrow,
+    triggerComponent: triggerComponent,
+    triggerRef: triggerRef,
+    usePortal: usePortal,
+    wrapExtraComponent: wrapExtraComponent,
+    zIndex: zIndex,
+    hideIfNotVisible: hideIfNotVisible
+  }, void 0, customPopper);
+}; // @deprecated: There's the NEW (not finished) popover that uses its own popper implementation.
 
 
 DSPopper.defaultProps = props.defaultProps;
@@ -86,7 +89,9 @@ const DSPopperWithSchema = reactDesc.describe(DSPopper);
 DSPopperWithSchema.propTypes = props.popperProps;
 
 exports.PopperPositions = positions.Position;
+exports.positions = positions.positions;
 exports.PopperInteractions = interaction.Interaction;
+exports.interactions = interaction.interactions;
 exports.DSPopper = DSPopper;
 exports.DSPopperWithSchema = DSPopperWithSchema;
-exports['default'] = DSPopper;
+exports["default"] = DSPopper;

package/cjs/PopperContent.js

@@ -1,5 +1,10 @@
 'use strict';
 
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var _jsx = require('@babel/runtime/helpers/jsx');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var react = require('react');
@@ -21,7 +26,7 @@ var _svg;
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 const Content = renderprops.Keyframes.Spring({});
 class PopperContent extends react.PureComponent {
   // eslint-disable-next-line react/static-property-placement
@@ -44,10 +49,11 @@ class PopperContent extends react.PureComponent {
     }
   }
 
-  renderArrow({
-    ref,
-    style
-  }, placement) {
+  renderArrow(_ref, placement) {
+    let {
+      ref,
+      style
+    } = _ref;
     const {
       blockName,
       showArrow
@@ -55,29 +61,30 @@ class PopperContent extends react.PureComponent {
     if (!showArrow) return null;
     return /*#__PURE__*/jsxRuntime.jsx("div", {
       ref: ref,
-      className: `${blockName || 'popper'}__arrow`,
+      className: "".concat(blockName || 'popper', "__arrow"),
       "data-placement": placement,
       style: _objectSpread(_objectSpread({}, style), getArrowStylesBySize.getArrowStylesBySize(placement, 25)),
-      children: _svg || (_svg = /*#__PURE__*/_jsx__default['default']("svg", {
+      children: _svg || (_svg = /*#__PURE__*/_jsx__default["default"]("svg", {
         viewBox: "0 0 30 30"
-      }, void 0, /*#__PURE__*/_jsx__default['default']("path", {
+      }, void 0, /*#__PURE__*/_jsx__default["default"]("path", {
         className: "stroke",
         d: "M23.7,27.1L17,19.9C16.5,19.3,15.8,19,15,19s-1.6,0.3-2.1,0.9l-6.6,7.2C5.3,28.1,3.4,29,2,29h26 C26.7,29,24.6,28.1,23.7,27.1z"
-      }), /*#__PURE__*/_jsx__default['default']("path", {
+      }), /*#__PURE__*/_jsx__default["default"]("path", {
         className: "fill",
         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"
       })))
     }, "popper-arrow");
   }
 
-  renderContent({
-    ref,
-    style,
-    placement,
-    arrowProps,
-    scheduleUpdate,
-    outOfBoundaries
-  }) {
+  renderContent(_ref2) {
+    let {
+      ref,
+      style,
+      placement,
+      arrowProps,
+      scheduleUpdate,
+      outOfBoundaries
+    } = _ref2;
     const {
       contentComponent,
       contentStyle,
@@ -101,7 +108,7 @@ class PopperContent extends react.PureComponent {
       onMouseLeave: onMouseLeave,
       style: computedStyle,
       "data-testid": "popper-container",
-      children: /*#__PURE__*/_jsx__default['default'](Content, {
+      children: /*#__PURE__*/_jsx__default["default"](Content, {
         native: true,
         onRest: this.handleRestAnimation,
         state: isOpen && (!outOfBoundaries || !hideIfNotVisible) ? 'open' : 'close',
@@ -114,7 +121,7 @@ class PopperContent extends react.PureComponent {
       }, void 0, animationStyle => /*#__PURE__*/jsxRuntime.jsx(renderprops.animated.div, {
         ref: ref,
         style: animationStyle,
-        children: getComponentFromProps__default['default'](contentComponent, {
+        children: getComponentFromProps__default["default"](contentComponent, {
           scheduleUpdate
         }, [this.renderArrow(arrowProps, placement)])
       }))
@@ -130,11 +137,11 @@ class PopperContent extends react.PureComponent {
       referenceNode,
       usePortal = true
     } = this.props;
-    return /*#__PURE__*/_jsx__default['default'](DSOverlay__default['default'], {
+    return /*#__PURE__*/_jsx__default["default"](DSOverlay__default["default"], {
       isOpen: !destroyed,
       onClickOutside: onClickOutside,
       usePortal: usePortal
-    }, void 0, /*#__PURE__*/_jsx__default['default'](reactPopper.Popper, {
+    }, void 0, /*#__PURE__*/_jsx__default["default"](reactPopper.Popper, {
       modifiers: modifiers,
       placement: placement,
       referenceElement: referenceNode
@@ -142,9 +149,8 @@ class PopperContent extends react.PureComponent {
   }
 
 }
-
-_defineProperty__default['default'](PopperContent, "defaultProps", {
+PopperContent.defaultProps = {
   onContentDestroyed: () => null
-});
+};
 
 module.exports = PopperContent;

package/cjs/PopperImpl.js

@@ -2,13 +2,15 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var _jsx = require('@babel/runtime/helpers/jsx');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 var react = require('react');
-var getComponentFromProps = require('@elliemae/ds-utilities/getComponentFromProps');
-var reactTypesUtility = require('@elliemae/ds-utilities/reactTypesUtility');
-var utils = require('@elliemae/ds-utilities/utils');
-var system = require('@elliemae/ds-utilities/system');
+var dsUtilities = require('@elliemae/ds-utilities');
 var reactPopper = require('react-popper');
 var memoizeOne = require('memoize-one');
 var PopperContent = require('./PopperContent.js');
@@ -19,26 +21,22 @@ function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'defau
 
 var _jsx__default = /*#__PURE__*/_interopDefaultLegacy(_jsx);
 var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_defineProperty);
-var getComponentFromProps__default = /*#__PURE__*/_interopDefaultLegacy(getComponentFromProps);
 var memoizeOne__default = /*#__PURE__*/_interopDefaultLegacy(memoizeOne);
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 class PopperImpl extends react.Component {
   // we use safeIsMounted because isMounted is not allowed by React.
   constructor(props) {
     super(props);
-
-    _defineProperty__default['default'](this, "safeIsMounted", false);
-
-    _defineProperty__default['default'](this, "handlePopperPlacementChange", memoizeOne__default['default'](placement => {
+    this.safeIsMounted = false;
+    this.handlePopperPlacementChange = memoizeOne__default["default"](placement => {
       const {
         onPlacementChange
       } = this.props;
       onPlacementChange(placement);
-    }));
-
+    });
     this.state = {
       isOpen: false,
       destroyed: true
@@ -96,7 +94,8 @@ class PopperImpl extends react.Component {
     return null;
   }
 
-  getInteractionObject(interaction$1, referenceProps = {}) {
+  getInteractionObject(interaction$1) {
+    let referenceProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
     const {
       isOpen
     } = this.props;
@@ -169,9 +168,9 @@ class PopperImpl extends react.Component {
     } = this.props;
     const {
       onClick
-    } = utils.get(triggerComponent, 'props') || {};
+    } = dsUtilities.get(triggerComponent, 'props') || {};
     this.open();
-    if (utils.isFunction(onClick)) onClick(e);
+    if (dsUtilities.isFunction(onClick)) onClick(e);
   }
 
   handleContentMouseEnter() {
@@ -216,9 +215,10 @@ class PopperImpl extends react.Component {
     });
   }
 
-  renderTarget({
-    ref
-  }) {
+  renderTarget(_ref) {
+    let {
+      ref
+    } = _ref;
     const {
       isOpen
     } = this.state;
@@ -227,11 +227,11 @@ class PopperImpl extends react.Component {
       interactionType,
       renderReference
     } = this.props;
-    const componentInnerRef = utils.get(triggerComponent, ['props', 'innerRef'], () => null);
-    const compRef = reactTypesUtility.isDOMTypeElement(triggerComponent) ? {
+    const componentInnerRef = dsUtilities.get(triggerComponent, ['props', 'innerRef'], () => null);
+    const compRef = dsUtilities.isDOMTypeElement(triggerComponent) ? {
       ref
     } : {
-      innerRef: system.mergeRefs(ref, componentInnerRef)
+      innerRef: dsUtilities.mergeRefs(ref, componentInnerRef)
     };
     const triggerHandler = this.getInteractionObject(interactionType, triggerComponent.props).handlers;
 
@@ -246,7 +246,7 @@ class PopperImpl extends react.Component {
       }, targetProps));
     }
 
-    return getComponentFromProps__default['default'](triggerComponent, targetProps);
+    return dsUtilities.getComponentFromProps(triggerComponent, targetProps);
   }
 
   render() {
@@ -277,7 +277,7 @@ class PopperImpl extends react.Component {
     const allModifiers = _objectSpread({
       offset: {
         enabled: showArrow,
-        offset: `0, ${arrowSize + arrowGap}`
+        offset: "0, ".concat(arrowSize + arrowGap)
       },
       preventOverflow: {
         enabled: true,
@@ -315,23 +315,21 @@ class PopperImpl extends react.Component {
     };
 
     if (customPopper && typeof customPopper === 'function') {
-      return /*#__PURE__*/_jsx__default['default'](reactPopper.Manager, {}, void 0, customPopper({
+      return /*#__PURE__*/_jsx__default["default"](reactPopper.Manager, {}, void 0, customPopper({
         Reference: reactPopper.Reference,
         triggerHandler,
         content: /*#__PURE__*/jsxRuntime.jsx(PopperContent, _objectSpread({}, popperContentProps))
       }));
     }
 
-    return /*#__PURE__*/_jsx__default['default'](reactPopper.Manager, {}, void 0, /*#__PURE__*/_jsx__default['default'](reactPopper.Reference, {}, void 0, this.renderTarget), /*#__PURE__*/jsxRuntime.jsx(PopperContent, _objectSpread({}, popperContentProps)));
+    return /*#__PURE__*/_jsx__default["default"](reactPopper.Manager, {}, void 0, /*#__PURE__*/_jsx__default["default"](reactPopper.Reference, {}, void 0, this.renderTarget), /*#__PURE__*/jsxRuntime.jsx(PopperContent, _objectSpread({}, popperContentProps)));
   }
 
 }
 
 Object.defineProperty(exports, 'Reference', {
   enumerable: true,
-  get: function () {
-    return reactPopper.Reference;
-  }
+  get: function () { return reactPopper.Reference; }
 });
 exports.PopperContent = PopperContent;
-exports['default'] = PopperImpl;
+exports["default"] = PopperImpl;

package/cjs/getArrowStylesBySize.js

@@ -2,6 +2,11 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
+require('core-js/modules/esnext.async-iterator.filter.js');
+require('core-js/modules/esnext.iterator.constructor.js');
+require('core-js/modules/esnext.iterator.filter.js');
+require('core-js/modules/esnext.async-iterator.for-each.js');
+require('core-js/modules/esnext.iterator.for-each.js');
 var _defineProperty = require('@babel/runtime/helpers/defineProperty');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -10,31 +15,32 @@ var _defineProperty__default = /*#__PURE__*/_interopDefaultLegacy(_definePropert
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default['default'](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty__default["default"](target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-const getArrowStylesBySize = (position, size = 30) => {
+const getArrowStylesBySize = function (position) {
+  let size = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 30;
   const basePosition = position && position.split('-')[0];
   return _objectSpread({
     borderWidth: size
   }, {
     top: {
       top: '100% !important',
-      transform: `rotateZ(${180}deg)`
+      transform: "rotateZ(".concat(180, "deg)")
     },
     right: {
       right: '100%',
-      transform: `rotateZ(${-90}deg)`
+      transform: "rotateZ(".concat(-90, "deg)")
     },
     bottom: {
       bottom: '100%',
-      transform: `rotateZ(${0}deg)`
+      transform: "rotateZ(".concat(0, "deg)")
     },
     left: {
       left: '100%',
-      transform: `rotateZ(${90}deg)`
+      transform: "rotateZ(".concat(90, "deg)")
     }
   }[basePosition]);
 };
 
-exports['default'] = getArrowStylesBySize;
+exports["default"] = getArrowStylesBySize;
 exports.getArrowStylesBySize = getArrowStylesBySize;

package/cjs/index.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var DSPopper = require('./DSPopper.js');
+var getArrowStylesBySize = require('./getArrowStylesBySize.js');
 var interaction = require('./interaction.js');
 var positions = require('./positions.js');
 
@@ -10,6 +11,9 @@ var positions = require('./positions.js');
 
 exports.DSPopper = DSPopper.DSPopper;
 exports.DSPopperWithSchema = DSPopper.DSPopperWithSchema;
-exports.default = DSPopper.DSPopper;
+exports["default"] = DSPopper.DSPopper;
+exports.getArrowStylesBySize = getArrowStylesBySize.getArrowStylesBySize;
 exports.PopperInteractions = interaction.Interaction;
+exports.interactions = interaction.interactions;
 exports.PopperPositions = positions.Position;
+exports.positions = positions.positions;

package/cjs/props.js

@@ -36,9 +36,7 @@ const popperProps = {
 
   /** Bem blockname for the popper */
   blockName: reactDesc.PropTypes.oneOfType([reactDesc.PropTypes.string, reactDesc.PropTypes.object]).description('Bem blockname for the popper'),
-  triggerComponent: reactDesc.PropTypes.element.description(`The component that will open/close the tooltip. 
-    Cannot be used with disabled elements. 
-    https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled`).isRequired
+  triggerComponent: reactDesc.PropTypes.element.description("The component that will open/close the tooltip. \n    Cannot be used with disabled elements. \n    https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled").isRequired
 };
 const defaultProps = {
   containerProps: {},

package/esm/DSPopper.js

@@ -2,75 +2,78 @@ import _jsx from '@babel/runtime/helpers/esm/jsx';
 import 'react';
 import { describe } from 'react-desc';
 import PopperImpl from './PopperImpl.js';
-export { Position as PopperPositions } from './positions.js';
-export { Interaction as PopperInteractions } from './interaction.js';
+export { Position as PopperPositions, positions } from './positions.js';
+export { Interaction as PopperInteractions, interactions } from './interaction.js';
 import { popperProps, defaultProps } from './props.js';
 
-const DSPopper = ({
-  containerProps,
-  arrowGap,
-  arrowSize,
-  blockName,
-  contentOffset,
-  contentStyle,
-  contentComponent,
-  delayClose,
-  delayOpen,
-  interactionType,
-  isOpen,
-  // if this is set DSPopper would be a controlled component if not, an uncontrolled one
-  onOpen,
-  onClose,
-  onPlacementChange,
-  placement,
-  preventOverflow,
-  showArrow,
-  closeAnimationConfig,
-  openAnimationConfig,
-  usePortal,
-  triggerComponent,
-  wrapExtraComponent,
-  getTargetFromChildren,
-  getContentFromChildren,
-  modifiers,
-  triggerRef,
-  children: customPopper,
-  renderReference,
-  referenceNode,
-  zIndex,
-  hideIfNotVisible
-}) => /*#__PURE__*/_jsx(PopperImpl, {
-  arrowGap: arrowGap,
-  arrowSize: arrowSize,
-  blockName: blockName,
-  closeAnimationConfig: closeAnimationConfig,
-  containerProps: containerProps,
-  contentComponent: contentComponent,
-  contentOffset: contentOffset,
-  contentStyle: contentStyle,
-  delayClose: delayClose,
-  delayOpen: delayOpen,
-  getContentFromChildren: getContentFromChildren,
-  getTargetFromChildren: getTargetFromChildren,
-  interactionType: interactionType,
-  isOpen: isOpen,
-  modifiers: modifiers,
-  onOpen: onOpen,
-  onClose: onClose,
-  onPlacementChange: onPlacementChange,
-  openAnimationConfig: openAnimationConfig,
-  placement: placement,
-  preventOverflow: preventOverflow,
-  referenceNode: referenceNode,
-  renderReference: renderReference,
-  showArrow: showArrow,
-  triggerComponent: triggerComponent,
-  triggerRef: triggerRef,
-  usePortal: usePortal,
-  wrapExtraComponent: wrapExtraComponent,
-  zIndex: zIndex,
-  hideIfNotVisible: hideIfNotVisible
-}, void 0, customPopper); // @deprecated: There's the NEW (not finished) popover that uses its own popper implementation.
+const DSPopper = _ref => {
+  let {
+    containerProps,
+    arrowGap,
+    arrowSize,
+    blockName,
+    contentOffset,
+    contentStyle,
+    contentComponent,
+    delayClose,
+    delayOpen,
+    interactionType,
+    isOpen,
+    // if this is set DSPopper would be a controlled component if not, an uncontrolled one
+    onOpen,
+    onClose,
+    onPlacementChange,
+    placement,
+    preventOverflow,
+    showArrow,
+    closeAnimationConfig,
+    openAnimationConfig,
+    usePortal,
+    triggerComponent,
+    wrapExtraComponent,
+    getTargetFromChildren,
+    getContentFromChildren,
+    modifiers,
+    triggerRef,
+    children: customPopper,
+    renderReference,
+    referenceNode,
+    zIndex,
+    hideIfNotVisible
+  } = _ref;
+  return /*#__PURE__*/_jsx(PopperImpl, {
+    arrowGap: arrowGap,
+    arrowSize: arrowSize,
+    blockName: blockName,
+    closeAnimationConfig: closeAnimationConfig,
+    containerProps: containerProps,
+    contentComponent: contentComponent,
+    contentOffset: contentOffset,
+    contentStyle: contentStyle,
+    delayClose: delayClose,
+    delayOpen: delayOpen,
+    getContentFromChildren: getContentFromChildren,
+    getTargetFromChildren: getTargetFromChildren,
+    interactionType: interactionType,
+    isOpen: isOpen,
+    modifiers: modifiers,
+    onOpen: onOpen,
+    onClose: onClose,
+    onPlacementChange: onPlacementChange,
+    openAnimationConfig: openAnimationConfig,
+    placement: placement,
+    preventOverflow: preventOverflow,
+    referenceNode: referenceNode,
+    renderReference: renderReference,
+    showArrow: showArrow,
+    triggerComponent: triggerComponent,
+    triggerRef: triggerRef,
+    usePortal: usePortal,
+    wrapExtraComponent: wrapExtraComponent,
+    zIndex: zIndex,
+    hideIfNotVisible: hideIfNotVisible
+  }, void 0, customPopper);
+}; // @deprecated: There's the NEW (not finished) popover that uses its own popper implementation.
 
 
 DSPopper.defaultProps = defaultProps;

package/esm/PopperContent.js

@@ -1,3 +1,8 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import { PureComponent } from 'react';
@@ -35,10 +40,11 @@ class PopperContent extends PureComponent {
     }
   }
 
-  renderArrow({
-    ref,
-    style
-  }, placement) {
+  renderArrow(_ref, placement) {
+    let {
+      ref,
+      style
+    } = _ref;
     const {
       blockName,
       showArrow
@@ -46,7 +52,7 @@ class PopperContent extends PureComponent {
     if (!showArrow) return null;
     return /*#__PURE__*/jsx("div", {
       ref: ref,
-      className: `${blockName || 'popper'}__arrow`,
+      className: "".concat(blockName || 'popper', "__arrow"),
       "data-placement": placement,
       style: _objectSpread(_objectSpread({}, style), getArrowStylesBySize(placement, 25)),
       children: _svg || (_svg = /*#__PURE__*/_jsx("svg", {
@@ -61,14 +67,15 @@ class PopperContent extends PureComponent {
     }, "popper-arrow");
   }
 
-  renderContent({
-    ref,
-    style,
-    placement,
-    arrowProps,
-    scheduleUpdate,
-    outOfBoundaries
-  }) {
+  renderContent(_ref2) {
+    let {
+      ref,
+      style,
+      placement,
+      arrowProps,
+      scheduleUpdate,
+      outOfBoundaries
+    } = _ref2;
     const {
       contentComponent,
       contentStyle,
@@ -133,9 +140,8 @@ class PopperContent extends PureComponent {
   }
 
 }
-
-_defineProperty(PopperContent, "defaultProps", {
+PopperContent.defaultProps = {
   onContentDestroyed: () => null
-});
+};
 
 export { PopperContent as default };

package/esm/PopperImpl.js

@@ -1,10 +1,12 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import _jsx from '@babel/runtime/helpers/esm/jsx';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 import { Component } from 'react';
-import getComponentFromProps from '@elliemae/ds-utilities/getComponentFromProps';
-import { isDOMTypeElement } from '@elliemae/ds-utilities/reactTypesUtility';
-import { get, isFunction } from '@elliemae/ds-utilities/utils';
-import { mergeRefs } from '@elliemae/ds-utilities/system';
+import { get, isFunction, isDOMTypeElement, mergeRefs, getComponentFromProps } from '@elliemae/ds-utilities';
 import { Manager, Reference } from 'react-popper';
 export { Reference } from 'react-popper';
 import memoizeOne from 'memoize-one';
@@ -20,16 +22,13 @@ class PopperImpl extends Component {
   // we use safeIsMounted because isMounted is not allowed by React.
   constructor(props) {
     super(props);
-
-    _defineProperty(this, "safeIsMounted", false);
-
-    _defineProperty(this, "handlePopperPlacementChange", memoizeOne(placement => {
+    this.safeIsMounted = false;
+    this.handlePopperPlacementChange = memoizeOne(placement => {
       const {
         onPlacementChange
       } = this.props;
       onPlacementChange(placement);
-    }));
-
+    });
     this.state = {
       isOpen: false,
       destroyed: true
@@ -87,7 +86,8 @@ class PopperImpl extends Component {
     return null;
   }
 
-  getInteractionObject(interaction, referenceProps = {}) {
+  getInteractionObject(interaction) {
+    let referenceProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
     const {
       isOpen
     } = this.props;
@@ -207,9 +207,10 @@ class PopperImpl extends Component {
     });
   }
 
-  renderTarget({
-    ref
-  }) {
+  renderTarget(_ref) {
+    let {
+      ref
+    } = _ref;
     const {
       isOpen
     } = this.state;
@@ -268,7 +269,7 @@ class PopperImpl extends Component {
     const allModifiers = _objectSpread({
       offset: {
         enabled: showArrow,
-        offset: `0, ${arrowSize + arrowGap}`
+        offset: "0, ".concat(arrowSize + arrowGap)
       },
       preventOverflow: {
         enabled: true,

package/esm/getArrowStylesBySize.js

@@ -1,29 +1,35 @@
+import 'core-js/modules/esnext.async-iterator.filter.js';
+import 'core-js/modules/esnext.iterator.constructor.js';
+import 'core-js/modules/esnext.iterator.filter.js';
+import 'core-js/modules/esnext.async-iterator.for-each.js';
+import 'core-js/modules/esnext.iterator.for-each.js';
 import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-const getArrowStylesBySize = (position, size = 30) => {
+const getArrowStylesBySize = function (position) {
+  let size = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 30;
   const basePosition = position && position.split('-')[0];
   return _objectSpread({
     borderWidth: size
   }, {
     top: {
       top: '100% !important',
-      transform: `rotateZ(${180}deg)`
+      transform: "rotateZ(".concat(180, "deg)")
     },
     right: {
       right: '100%',
-      transform: `rotateZ(${-90}deg)`
+      transform: "rotateZ(".concat(-90, "deg)")
     },
     bottom: {
       bottom: '100%',
-      transform: `rotateZ(${0}deg)`
+      transform: "rotateZ(".concat(0, "deg)")
     },
     left: {
       left: '100%',
-      transform: `rotateZ(${90}deg)`
+      transform: "rotateZ(".concat(90, "deg)")
     }
   }[basePosition]);
 };

package/esm/index.js

@@ -1,3 +1,4 @@
 export { DSPopper, DSPopperWithSchema, DSPopper as default } from './DSPopper.js';
-export { Interaction as PopperInteractions } from './interaction.js';
-export { Position as PopperPositions } from './positions.js';
+export { getArrowStylesBySize } from './getArrowStylesBySize.js';
+export { Interaction as PopperInteractions, interactions } from './interaction.js';
+export { Position as PopperPositions, positions } from './positions.js';

package/esm/props.js

@@ -32,9 +32,7 @@ const popperProps = {
 
   /** Bem blockname for the popper */
   blockName: PropTypes.oneOfType([PropTypes.string, PropTypes.object]).description('Bem blockname for the popper'),
-  triggerComponent: PropTypes.element.description(`The component that will open/close the tooltip. 
-    Cannot be used with disabled elements. 
-    https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled`).isRequired
+  triggerComponent: PropTypes.element.description("The component that will open/close the tooltip. \n    Cannot be used with disabled elements. \n    https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/disabled").isRequired
 };
 const defaultProps = {
   containerProps: {},

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-popper",
-  "version": "2.0.0-alpha.1",
+  "version": "2.0.0-alpha.13",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Popper",
   "module": "./esm/index.js",
@@ -60,10 +60,11 @@
     "build": "node ../../scripts/build/build.js"
   },
   "dependencies": {
-    "@elliemae/ds-overlay": "2.0.0-alpha.1",
-    "@elliemae/ds-utilities": "2.0.0-alpha.1",
+    "@elliemae/ds-overlay": "2.0.0-alpha.13",
+    "@elliemae/ds-utilities": "2.0.0-alpha.13",
     "memoize-one": "~5.1.1",
     "prop-types": "~15.7.2",
+    "react-desc": "~4.1.3",
     "react-popper": "~1.3.11",
     "react-spring": "~8.0.27"
   },

package/types/DSPopper.d.ts

@@ -1,3 +1,4 @@
+/// <reference path="../../../../shared/typings/react-desc.d.ts" />
 /// <reference types="react" />
 import { Position } from './positions';
 import { Interaction } from './interaction';
@@ -36,17 +37,67 @@ declare const DSPopper: {
         hideIfNotVisible: any;
     }): JSX.Element;
     propTypes: {
-        hideIfNotVisible: any;
-        containerProps: any;
-        arrowGap: any;
-        onOpen: any;
-        onClose: any;
-        delayClose: any;
-        delayOpen: any;
-        onPlacementChange: any;
-        arrowSize: any;
-        blockName: any;
-        triggerComponent: any;
+        hideIfNotVisible: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
+        containerProps: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
+        arrowGap: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
+        onOpen: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
+        onClose: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
+        delayClose: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
+        delayOpen: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
+        onPlacementChange: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
+        arrowSize: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
+        blockName: {
+            defaultValue<T = unknown>(arg: T): {
+                deprecated: import("react-desc").PropTypesDescValidator;
+            };
+            isRequired: import("react-desc").PropTypesDescValidator;
+        };
+        triggerComponent: import("react-desc").PropTypesDescValidator;
     };
     defaultProps: {
         containerProps: {};
@@ -94,6 +145,44 @@ declare const DSPopper: {
         hideIfNotVisible: boolean;
     };
 };
-declare const DSPopperWithSchema: any;
-export { Interaction as PopperInteractions, Position as PopperPositions, DSPopperWithSchema, DSPopper, };
+declare const DSPopperWithSchema: {
+    (props?: {
+        containerProps: any;
+        arrowGap: any;
+        arrowSize: any;
+        blockName: any;
+        contentOffset: any;
+        contentStyle: any;
+        contentComponent: any;
+        delayClose: any;
+        delayOpen: any;
+        interactionType: any;
+        isOpen: any;
+        onOpen: any;
+        onClose: any;
+        onPlacementChange: any;
+        placement: any;
+        preventOverflow: any;
+        showArrow: any;
+        closeAnimationConfig: any;
+        openAnimationConfig: any;
+        usePortal: any;
+        triggerComponent: any;
+        wrapExtraComponent: any;
+        getTargetFromChildren: any;
+        getContentFromChildren: any;
+        modifiers: any;
+        triggerRef: any;
+        children: any;
+        renderReference: any;
+        referenceNode: any;
+        zIndex: any;
+        hideIfNotVisible: any;
+    } | undefined): JSX.Element;
+    propTypes: unknown;
+    toTypescript: () => import("react-desc").TypescriptSchema;
+};
+export { Interaction as PopperInteractions, Position as PopperPositions, DSPopperWithSchema, DSPopper };
+export { interactions } from './interaction';
+export { positions } from './positions';
 export default DSPopper;

package/types/index.d.ts

@@ -1,2 +1,3 @@
 export * from './DSPopper';
+export * from './getArrowStylesBySize';
 export { default } from './DSPopper';

package/types/props.d.ts

@@ -1,25 +1,76 @@
+/// <reference path="../../../../shared/typings/react-desc.d.ts" />
 export declare const popperProps: {
     /** Hide menu component if trigger component is not visible/scrolled away */
-    hideIfNotVisible: any;
+    hideIfNotVisible: {
+        defaultValue<T = unknown>(arg: T): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValidator;
+    };
     /** props to inject to popper wrapper */
-    containerProps: any;
+    containerProps: {
+        defaultValue<T = unknown>(arg: T): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValidator;
+    };
     /** Space between the arrow and the popup */
-    arrowGap: any;
+    arrowGap: {
+        defaultValue<T = unknown>(arg: T): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValidator;
+    };
     /** callback for when menu changes from close to open */
-    onOpen: any;
+    onOpen: {
+        defaultValue<T = unknown>(arg: T): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValidator;
+    };
     /** callback for when menu changes from open to close */
-    onClose: any;
+    onClose: {
+        defaultValue<T = unknown>(arg: T): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValidator;
+    };
     /** Time in ms to delay close of menu */
-    delayClose: any;
+    delayClose: {
+        defaultValue<T = unknown>(arg: T): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValidator;
+    };
     /** Time in ms to delay open of menu */
-    delayOpen: any;
+    delayOpen: {
+        defaultValue<T = unknown>(arg: T): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValidator;
+    };
     /** callback for when menu changes placement */
-    onPlacementChange: any;
+    onPlacementChange: {
+        defaultValue<T = unknown>(arg: T): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValidator;
+    };
     /** Arrow size */
-    arrowSize: any;
+    arrowSize: {
+        defaultValue<T = unknown>(arg: T): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValidator;
+    };
     /** Bem blockname for the popper */
-    blockName: any;
-    triggerComponent: any;
+    blockName: {
+        defaultValue<T = unknown>(arg: T): {
+            deprecated: import("react-desc").PropTypesDescValidator;
+        };
+        isRequired: import("react-desc").PropTypesDescValidator;
+    };
+    triggerComponent: import("react-desc").PropTypesDescValidator;
 };
 export declare const defaultProps: {
     containerProps: {};

package/cjs/package.json

@@ -1,7 +0,0 @@
-{
-  "type": "commonjs",
-  "sideEffects": [
-    "*.css",
-    "*.scss"
-  ]
-}

package/esm/package.json

@@ -1,7 +0,0 @@
-{
-  "type": "module",
-  "sideEffects": [
-    "*.css",
-    "*.scss"
-  ]
-}