@elliemae/ds-popperjs 2.1.0 → 2.2.0-alpha.3

package/cjs/styled.js

@@ -1,37 +1,71 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var _taggedTemplateLiteral = require('@babel/runtime/helpers/taggedTemplateLiteral');
-var styled = require('styled-components');
-var dsSystem = require('@elliemae/ds-system');
-
-function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var styled_exports = {};
+__export(styled_exports, {
+  StyledAnimatedPopper: () => StyledAnimatedPopper,
+  StyledPopoverContentWrapper: () => StyledPopoverContentWrapper
+});
+var React = __toESM(require("react"));
+var import_styled_components = __toESM(require("styled-components"));
+var import_ds_system = __toESM(require("@elliemae/ds-system"));
+const showAnimation = import_ds_system.kfrm`
+    from {
+      opacity: 0;
+      transform: scale(0.8);
+    }
 
-var _taggedTemplateLiteral__default = /*#__PURE__*/_interopDefaultLegacy(_taggedTemplateLiteral);
-var styled__default = /*#__PURE__*/_interopDefaultLegacy(styled);
+    to {
+      opacity: 1;
+      transform: scale(1);
+      visibility: visible;
+    }
+`;
+const hideAnimation = import_ds_system.kfrm`
+    from {
+      opacity: 1;
+      transform: scale(1);
+    }
 
-var _templateObject, _templateObject2, _templateObject3;
-const showAnimation = dsSystem.kfrm(_templateObject || (_templateObject = _taggedTemplateLiteral__default["default"](["\n    from {\n      opacity: 0;\n      transform: scale(0.8);\n    }\n\n    to {\n      opacity: 1;\n      transform: scale(1);\n      visibility: visible;\n    }\n"])));
-const hideAnimation = dsSystem.kfrm(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral__default["default"](["\n    from {\n      opacity: 1;\n      transform: scale(1);\n    }\n\n    to {\n      opacity: 0;\n      transform: scale(0.8);\n      visibility: hidden;\n    }\n"])));
-const StyledPopoverContentWrapper = /*#__PURE__*/styled__default["default"].div.withConfig({
-  componentId: "sc-1giz5kx-0"
-})(["z-index:", ";"], _ref => {
-  let {
-    zIndex
-  } = _ref;
-  return zIndex;
-});
-const StyledAnimatedPopper = /*#__PURE__*/styled__default["default"].div.withConfig({
-  componentId: "sc-1giz5kx-1"
-})(["box-shadow:0 0 0 1px rgba(16,22,26,0.1),0 2px 4px rgba(16,22,26,0.2),0 8px 24px rgba(16,22,26,0.2);", ""], _ref2 => {
-  let {
-    showPopover,
-    animationDuration,
-    withoutAnimation
-  } = _ref2;
-  return !withoutAnimation && dsSystem.css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteral__default["default"](["\n      animation: ", " ", "ms ease-in;\n    "])), showPopover ? showAnimation : hideAnimation, animationDuration);
-});
+    to {
+      opacity: 0;
+      transform: scale(0.8);
+      visibility: hidden;
+    }
+`;
+const StyledPopoverContentWrapper = import_styled_components.default.div`
+  z-index: ${({ zIndex }) => zIndex};
+`;
+const StyledAnimatedPopper = import_styled_components.default.div`
+  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 2px 4px rgba(16, 22, 26, 0.2), 0 8px 24px rgba(16, 22, 26, 0.2);
 
-exports.StyledAnimatedPopper = StyledAnimatedPopper;
-exports.StyledPopoverContentWrapper = StyledPopoverContentWrapper;
+  ${({ showPopover, animationDuration, withoutAnimation }) => !withoutAnimation && import_ds_system.css`
+      animation: ${showPopover ? showAnimation : hideAnimation} ${animationDuration}ms ease-in;
+    `}
+`;
+module.exports = __toCommonJS(styled_exports);
+//# sourceMappingURL=styled.js.map

package/cjs/styled.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/styled.tsx", "../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import styled from 'styled-components';\nimport { kfrm, css } from '@elliemae/ds-system';\n\ninterface StyledContentWrapperPropsT {\n  zIndex: number;\n}\n\ninterface StyledAnimatedPopperPropsT {\n  showPopover: boolean;\n  animationDuration: number;\n  withoutAnimation: boolean;\n}\n\nconst showAnimation = kfrm`\n    from {\n      opacity: 0;\n      transform: scale(0.8);\n    }\n\n    to {\n      opacity: 1;\n      transform: scale(1);\n      visibility: visible;\n    }\n`;\n\nconst hideAnimation = kfrm`\n    from {\n      opacity: 1;\n      transform: scale(1);\n    }\n\n    to {\n      opacity: 0;\n      transform: scale(0.8);\n      visibility: hidden;\n    }\n`;\n\nexport const StyledPopoverContentWrapper = styled.div<StyledContentWrapperPropsT>`\n  z-index: ${({ zIndex }) => zIndex};\n`;\n\nexport const StyledAnimatedPopper = styled.div<StyledAnimatedPopperPropsT>`\n  box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 2px 4px rgba(16, 22, 26, 0.2), 0 8px 24px rgba(16, 22, 26, 0.2);\n\n  ${({ showPopover, animationDuration, withoutAnimation }) =>\n    !withoutAnimation &&\n    css`\n      animation: ${showPopover ? showAnimation : hideAnimation} ${animationDuration}ms ease-in;\n    `}\n`;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,+BAAmB;AACnB,uBAA0B;AAY1B,MAAM,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAatB,MAAM,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAaf,MAAM,8BAA8B,iCAAO;AAAA,aACrC,CAAC,EAAE,aAAa;AAAA;AAGtB,MAAM,uBAAuB,iCAAO;AAAA;AAAA;AAAA,IAGvC,CAAC,EAAE,aAAa,mBAAmB,uBACnC,CAAC,oBACD;AAAA,mBACe,cAAc,gBAAgB,iBAAiB;AAAA;AAAA;",
+  "names": []
+}

package/cjs/utils/hooks/useOnClickOutside.js

@@ -1,29 +1,51 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var react = require('react');
-
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, copyDefault, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && (copyDefault || key !== "default"))
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toESM = (module2, isNodeMode) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", !isNodeMode && module2 && module2.__esModule ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+var __toCommonJS = /* @__PURE__ */ ((cache) => {
+  return (module2, temp) => {
+    return cache && cache.get(module2) || (temp = __reExport(__markAsModule({}), module2, 1), cache && cache.set(module2, temp), temp);
+  };
+})(typeof WeakMap !== "undefined" ? /* @__PURE__ */ new WeakMap() : 0);
+var useOnClickOutside_exports = {};
+__export(useOnClickOutside_exports, {
+  useOnClickOutside: () => useOnClickOutside
+});
+var React = __toESM(require("react"));
+var import_react = __toESM(require("react"));
 function useOnClickOutside(ref, cb) {
-  react.useEffect(() => {
-    const listener = event => {
-      var _ref$contains;
-
-      // Do nothing if clicking ref's element or descendent elements
-      if (!ref || ref !== null && ref !== void 0 && (_ref$contains = ref.contains) !== null && _ref$contains !== void 0 && _ref$contains.call(ref, event.target)) {
+  (0, import_react.useEffect)(() => {
+    const listener = (event) => {
+      if (!ref || ref?.contains?.(event.target)) {
         return;
       }
-
       cb(event);
     };
-
-    document.addEventListener('mousedown', listener);
-    document.addEventListener('touchstart', listener);
+    document.addEventListener("mousedown", listener);
+    document.addEventListener("touchstart", listener);
     return () => {
-      document.removeEventListener('mousedown', listener);
-      document.removeEventListener('touchstart', listener);
+      document.removeEventListener("mousedown", listener);
+      document.removeEventListener("touchstart", listener);
     };
   }, [ref, cb]);
 }
-
-exports.useOnClickOutside = useOnClickOutside;
+module.exports = __toCommonJS(useOnClickOutside_exports);
+//# sourceMappingURL=useOnClickOutside.js.map

package/cjs/utils/hooks/useOnClickOutside.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../src/utils/hooks/useOnClickOutside.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
+  "sourcesContent": ["import React, { useEffect } from 'react';\n\ntype defaultCbt = (e: React.MouseEvent) => void;\nexport function useOnClickOutside<T extends Node, cbT extends defaultCbt>(ref: T, cb: cbT): void {\n  useEffect(() => {\n    const listener = (event) => {\n      // Do nothing if clicking ref's element or descendent elements\n      if (!ref || ref?.contains?.(event.target)) {\n        return;\n      }\n      cb(event);\n    };\n    document.addEventListener('mousedown', listener);\n    document.addEventListener('touchstart', listener);\n    return () => {\n      document.removeEventListener('mousedown', listener);\n      document.removeEventListener('touchstart', listener);\n    };\n  }, [ref, cb]);\n}\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAiC;AAG1B,2BAAmE,KAAQ,IAAe;AAC/F,8BAAU,MAAM;AACd,UAAM,WAAW,CAAC,UAAU;AAE1B,UAAI,CAAC,OAAO,KAAK,WAAW,MAAM,SAAS;AACzC;AAAA;AAEF,SAAG;AAAA;AAEL,aAAS,iBAAiB,aAAa;AACvC,aAAS,iBAAiB,cAAc;AACxC,WAAO,MAAM;AACX,eAAS,oBAAoB,aAAa;AAC1C,eAAS,oBAAoB,cAAc;AAAA;AAAA,KAE5C,CAAC,KAAK;AAAA;",
+  "names": []
+}

package/esm/PopoverArrow.js

@@ -1,45 +1,62 @@
-import _jsx from '@babel/runtime/helpers/esm/jsx';
-import 'react';
-import styled from 'styled-components';
-import { jsx } from 'react/jsx-runtime';
-
-var _svg;
+import * as React from "react";
+import React2 from "react";
+import styled from "styled-components";
 const arrowWidth = 18;
 const arrowHeight = 18;
-const StyledArrow = /*#__PURE__*/styled.div.withConfig({
-  componentId: "sc-olcdf1-0"
-})(["position:absolute;width:", "px;height:", "px;pointer-events:none;background-color:transparent;& .stroke{fill:", ";fill-opacity:0.4;}& .fill{fill:", ";}&[data-placement^='top']{svg{transform:rotateZ(180deg);}bottom:-", "px;}&[data-placement^='right']{svg{transform:rotateZ(-90deg);}left:-", "px;}&[data-placement^='bottom']{top:-", "px;}&[data-placement^='left']{svg{transform:rotateZ(90deg);}right:-", "px;}margin-left:", ";margin-top:", ";"], arrowWidth, arrowHeight, _ref => {
-  let {
-    theme
-  } = _ref;
-  return theme.colors.neutral['500'];
-}, _ref2 => {
-  let {
-    theme
-  } = _ref2;
-  return theme.colors.neutral['000'];
-}, arrowHeight, arrowWidth, arrowHeight, arrowWidth, props => props['data-placement'].startsWith('top') || props['data-placement'].startsWith('bottom') ? "-".concat(arrowWidth / 2, "px;") : '0;', props => props['data-placement'].startsWith('left') || props['data-placement'].startsWith('right') ? "-".concat(arrowHeight / 2, "px;") : '0;');
-const PopoverArrow = _ref3 => {
-  let {
-    placement,
-    style,
-    arrowElementRef
-  } = _ref3;
-  return /*#__PURE__*/jsx(StyledArrow, {
-    "data-placement": placement,
-    style: style,
-    ref: arrowElementRef,
-    "data-testid": "ds-tooltip-arrow",
-    children: _svg || (_svg = /*#__PURE__*/_jsx("svg", {
-      viewBox: "0 0 30 30"
-    }, void 0, /*#__PURE__*/_jsx("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("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");
-};
+const StyledArrow = styled.div`
+  position: absolute;
+  width: ${arrowWidth}px;
+  height: ${arrowHeight}px;
+  pointer-events: none;
+  background-color: transparent;
+  & .stroke {
+    fill: ${({ theme }) => theme.colors.neutral["500"]};
+    fill-opacity: 0.4;
+  }
+  & .fill {
+    fill: ${({ theme }) => theme.colors.neutral["000"]};
+  }
 
-export { PopoverArrow };
+  &[data-placement^='top'] {
+    svg {
+      transform: rotateZ(180deg);
+    }
+    bottom: -${arrowHeight}px;
+  }
+  &[data-placement^='right'] {
+    svg {
+      transform: rotateZ(-90deg);
+    }
+    left: -${arrowWidth}px;
+  }
+  &[data-placement^='bottom'] {
+    top: -${arrowHeight}px;
+  }
+  &[data-placement^='left'] {
+    svg {
+      transform: rotateZ(90deg);
+    }
+    right: -${arrowWidth}px;
+  }
+  margin-left: ${(props) => props["data-placement"].startsWith("top") || props["data-placement"].startsWith("bottom") ? `-${arrowWidth / 2}px;` : "0;"};
+  margin-top: ${(props) => props["data-placement"].startsWith("left") || props["data-placement"].startsWith("right") ? `-${arrowHeight / 2}px;` : "0;"};
+`;
+const PopoverArrow = ({ placement, style, arrowElementRef }) => /* @__PURE__ */ React2.createElement(StyledArrow, {
+  key: "popper-arrow",
+  "data-placement": placement,
+  style,
+  ref: arrowElementRef,
+  "data-testid": "ds-tooltip-arrow"
+}, /* @__PURE__ */ React2.createElement("svg", {
+  viewBox: "0 0 30 30"
+}, /* @__PURE__ */ React2.createElement("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\n        C26.7,29,24.6,28.1,23.7,27.1z"
+}), /* @__PURE__ */ React2.createElement("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"
+})));
+export {
+  PopoverArrow
+};
+//# sourceMappingURL=PopoverArrow.js.map

package/esm/PopoverArrow.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/PopoverArrow.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React from 'react';\nimport styled from 'styled-components';\ninterface PopoverArrowT {\n  placement: string;\n  style: React.CSSProperties;\n  arrowElementRef: React.Dispatch<React.SetStateAction<HTMLDivElement>>;\n}\nconst arrowWidth = 18;\nconst arrowHeight = 18;\n\nconst StyledArrow = styled.div`\n  position: absolute;\n  width: ${arrowWidth}px;\n  height: ${arrowHeight}px;\n  pointer-events: none;\n  background-color: transparent;\n  & .stroke {\n    fill: ${({ theme }) => theme.colors.neutral['500']};\n    fill-opacity: 0.4;\n  }\n  & .fill {\n    fill: ${({ theme }) => theme.colors.neutral['000']};\n  }\n\n  &[data-placement^='top'] {\n    svg {\n      transform: rotateZ(180deg);\n    }\n    bottom: -${arrowHeight}px;\n  }\n  &[data-placement^='right'] {\n    svg {\n      transform: rotateZ(-90deg);\n    }\n    left: -${arrowWidth}px;\n  }\n  &[data-placement^='bottom'] {\n    top: -${arrowHeight}px;\n  }\n  &[data-placement^='left'] {\n    svg {\n      transform: rotateZ(90deg);\n    }\n    right: -${arrowWidth}px;\n  }\n  margin-left: ${(props) =>\n    props['data-placement'].startsWith('top') || props['data-placement'].startsWith('bottom')\n      ? `-${arrowWidth / 2}px;`\n      : '0;'};\n  margin-top: ${(props) =>\n    props['data-placement'].startsWith('left') || props['data-placement'].startsWith('right')\n      ? `-${arrowHeight / 2}px;`\n      : '0;'};\n`;\n\nexport const PopoverArrow = ({ placement, style, arrowElementRef }: PopoverArrowT): React.ReactElement => (\n  <StyledArrow\n    key=\"popper-arrow\"\n    data-placement={placement}\n    style={style}\n    ref={arrowElementRef}\n    data-testid=\"ds-tooltip-arrow\"\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  </StyledArrow>\n);\n"],
+  "mappings": "AAAA;ACAA;AACA;AAMA,MAAM,aAAa;AACnB,MAAM,cAAc;AAEpB,MAAM,cAAc,OAAO;AAAA;AAAA,WAEhB;AAAA,YACC;AAAA;AAAA;AAAA;AAAA,YAIA,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA,YAIpC,CAAC,EAAE,YAAY,MAAM,OAAO,QAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAOjC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAMF;AAAA;AAAA;AAAA,YAGD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAME;AAAA;AAAA,iBAEG,CAAC,UACd,MAAM,kBAAkB,WAAW,UAAU,MAAM,kBAAkB,WAAW,YAC5E,IAAI,aAAa,SACjB;AAAA,gBACQ,CAAC,UACb,MAAM,kBAAkB,WAAW,WAAW,MAAM,kBAAkB,WAAW,WAC7E,IAAI,cAAc,SAClB;AAAA;AAGD,MAAM,eAAe,CAAC,EAAE,WAAW,OAAO,sBAC/C,qCAAC,aAAD;AAAA,EACE,KAAI;AAAA,EACJ,kBAAgB;AAAA,EAChB;AAAA,EACA,KAAK;AAAA,EACL,eAAY;AAAA,GAEZ,qCAAC,OAAD;AAAA,EAAK,SAAQ;AAAA,GACX,qCAAC,QAAD;AAAA,EACE,WAAU;AAAA,EACV,GAAE;AAAA,IAGJ,qCAAC,QAAD;AAAA,EACE,WAAU;AAAA,EACV,GAAE;AAAA;",
+  "names": []
+}

package/esm/PopoverContent.js

@@ -1,62 +1,47 @@
-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';
-import _jsx from '@babel/runtime/helpers/esm/jsx';
-import { useCallback, useMemo } from 'react';
-import { PopoverArrow } from './PopoverArrow.js';
-import { StyledPopoverContentWrapper, StyledAnimatedPopper } from './styled.js';
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-
-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; }
-
-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; }
-const PopoverContent = _ref => {
-  let {
-    setPopperElement,
-    popperStyles,
-    popperAttributes,
-    children,
-    showPopover,
-    setArrowElement,
-    setIsAnimating,
-    arrowStyle,
-    withoutArrow,
-    withoutAnimation,
-    animationDuration,
-    zIndex
-  } = _ref;
+import * as React from "react";
+import React2, { useCallback, useMemo } from "react";
+import { PopoverArrow } from "./PopoverArrow";
+import { StyledPopoverContentWrapper, StyledAnimatedPopper } from "./styled";
+const PopoverContent = ({
+  setPopperElement,
+  popperStyles,
+  popperAttributes,
+  children,
+  showPopover,
+  setArrowElement,
+  setIsAnimating,
+  arrowStyle,
+  withoutArrow,
+  withoutAnimation,
+  animationDuration,
+  zIndex
+}) => {
   const checkAnimationStatus = useCallback(() => {
     if (!showPopover && !withoutAnimation) {
       setIsAnimating(false);
     }
   }, [showPopover, withoutAnimation, setIsAnimating]);
-  const popperContent = useMemo(() => /*#__PURE__*/jsxs(Fragment, {
-    children: [children, withoutArrow === false ? /*#__PURE__*/jsxs(Fragment, {
-      children: [/*#__PURE__*/_jsx(PopoverArrow, {
-        arrowElementRef: setArrowElement,
-        style: arrowStyle,
-        placement: popperAttributes ? popperAttributes['data-popper-placement'] : 'bottom'
-      }), /*#__PURE__*/jsx("div", {
-        ref: setArrowElement,
-        style: arrowStyle
-      })]
-    }) : null]
-  }), [children, withoutArrow, arrowStyle, popperAttributes, setArrowElement]);
-  return /*#__PURE__*/jsx(StyledPopoverContentWrapper, _objectSpread(_objectSpread({
-    zIndex: zIndex,
+  const popperContent = useMemo(() => /* @__PURE__ */ React2.createElement(React2.Fragment, null, children, withoutArrow === false ? /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(PopoverArrow, {
+    arrowElementRef: setArrowElement,
+    style: arrowStyle,
+    placement: popperAttributes ? popperAttributes["data-popper-placement"] : "bottom"
+  }), /* @__PURE__ */ React2.createElement("div", {
+    ref: setArrowElement,
+    style: arrowStyle
+  })) : null), [children, withoutArrow, arrowStyle, popperAttributes, setArrowElement]);
+  return /* @__PURE__ */ React2.createElement(StyledPopoverContentWrapper, {
+    zIndex,
     ref: setPopperElement,
-    style: popperStyles
-  }, popperAttributes), {}, {
-    children: /*#__PURE__*/_jsx(StyledAnimatedPopper, {
-      showPopover: showPopover,
-      animationDuration: animationDuration,
-      withoutAnimation: withoutAnimation,
-      onAnimationEnd: checkAnimationStatus
-    }, void 0, popperContent)
-  }));
+    style: popperStyles,
+    ...popperAttributes
+  }, /* @__PURE__ */ React2.createElement(StyledAnimatedPopper, {
+    showPopover,
+    animationDuration,
+    withoutAnimation,
+    onAnimationEnd: checkAnimationStatus
+  }, popperContent));
+};
+export {
+  PopoverContent
 };
-
-export { PopoverContent };
+//# sourceMappingURL=PopoverContent.js.map

package/esm/PopoverContent.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/PopoverContent.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback, useMemo } from 'react';\nimport { PopoverArrow } from './PopoverArrow';\nimport type { PopoverContentPropsT } from './index.d';\nimport { StyledPopoverContentWrapper, StyledAnimatedPopper } from './styled';\n\nexport const PopoverContent = ({\n  setPopperElement,\n  popperStyles,\n  popperAttributes,\n  children,\n  showPopover,\n  setArrowElement,\n  setIsAnimating,\n  arrowStyle,\n  withoutArrow,\n  withoutAnimation,\n  animationDuration,\n  zIndex,\n}: PopoverContentPropsT): JSX.Element => {\n  const checkAnimationStatus = useCallback(() => {\n    if (!showPopover && !withoutAnimation) {\n      setIsAnimating(false);\n    }\n  }, [showPopover, withoutAnimation, setIsAnimating]);\n\n  const popperContent = useMemo(\n    () => (\n      <>\n        {children}\n        {withoutArrow === false ? (\n          <>\n            <PopoverArrow\n              arrowElementRef={setArrowElement}\n              style={arrowStyle}\n              placement={popperAttributes ? popperAttributes['data-popper-placement'] : 'bottom'}\n            />\n            <div ref={setArrowElement} style={arrowStyle} />\n          </>\n        ) : null}\n      </>\n    ),\n    [children, withoutArrow, arrowStyle, popperAttributes, setArrowElement],\n  );\n  return (\n    <StyledPopoverContentWrapper zIndex={zIndex} ref={setPopperElement} style={popperStyles} {...popperAttributes}>\n      <StyledAnimatedPopper\n        showPopover={showPopover}\n        animationDuration={animationDuration}\n        withoutAnimation={withoutAnimation}\n        onAnimationEnd={checkAnimationStatus}\n      >\n        {popperContent}\n      </StyledAnimatedPopper>\n    </StyledPopoverContentWrapper>\n  );\n};\n"],
+  "mappings": "AAAA;ACAA;AACA;AAEA;AAEO,MAAM,iBAAiB,CAAC;AAAA,EAC7B;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,MACuC;AACvC,QAAM,uBAAuB,YAAY,MAAM;AAC7C,QAAI,CAAC,eAAe,CAAC,kBAAkB;AACrC,qBAAe;AAAA;AAAA,KAEhB,CAAC,aAAa,kBAAkB;AAEnC,QAAM,gBAAgB,QACpB,MACE,4DACG,UACA,iBAAiB,QAChB,4DACE,qCAAC,cAAD;AAAA,IACE,iBAAiB;AAAA,IACjB,OAAO;AAAA,IACP,WAAW,mBAAmB,iBAAiB,2BAA2B;AAAA,MAE5E,qCAAC,OAAD;AAAA,IAAK,KAAK;AAAA,IAAiB,OAAO;AAAA,QAElC,OAGR,CAAC,UAAU,cAAc,YAAY,kBAAkB;AAEzD,SACE,qCAAC,6BAAD;AAAA,IAA6B;AAAA,IAAgB,KAAK;AAAA,IAAkB,OAAO;AAAA,OAAkB;AAAA,KAC3F,qCAAC,sBAAD;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,KAEf;AAAA;",
+  "names": []
+}

package/esm/config/useConfigDSPopperjs.js

@@ -1,42 +1,24 @@
-import 'core-js/modules/web.dom-collections.iterator.js';
-import { useState, useMemo, useEffect } from 'react';
-import { usePopper } from 'react-popper';
-import { useConfiguredMergedProps } from './useConfiguredMergedProps.js';
-import { useOnClickOutside } from '../utils/hooks/useOnClickOutside.js';
-
-const useConfigDSPopperjs = appProps => {
+import * as React from "react";
+import { useMemo, useState, useEffect } from "react";
+import { usePopper } from "react-popper";
+import { useConfiguredMergedProps } from "./useConfiguredMergedProps";
+import { useOnClickOutside } from "../utils/hooks/useOnClickOutside";
+const useConfigDSPopperjs = (appProps) => {
   const [popperElement, setPopperElement] = useState(null);
   const [arrowElement, setArrowElement] = useState(null);
   const [isAnimating, setIsAnimating] = useState(false);
-  const props = useConfiguredMergedProps({
-    props: appProps,
-    arrowElement
-  });
-  const {
-    referenceElement,
-    closeContextMenu,
-    onClickOutside,
-    modifiers,
-    startPlacementPreference
-  } = props;
-  const popperExtraOpts = useMemo(() => ({
-    placement: startPlacementPreference,
-    modifiers
-  }), [modifiers, startPlacementPreference]);
+  const props = useConfiguredMergedProps({ props: appProps, arrowElement });
+  const { referenceElement, closeContextMenu, onClickOutside, modifiers, startPlacementPreference } = props;
+  const popperExtraOpts = useMemo(() => ({ placement: startPlacementPreference, modifiers }), [modifiers, startPlacementPreference]);
   const popoverHelper = usePopper(referenceElement, popperElement, popperExtraOpts);
-  const {
-    showPopover,
-    withoutAnimation
-  } = props;
+  const { showPopover, withoutAnimation } = props;
   useEffect(() => {
     if (showPopover && !withoutAnimation) {
       setIsAnimating(true);
     }
   }, [showPopover, withoutAnimation]);
-  useOnClickOutside(popperElement, e => {
-    var _referenceElement$con;
-
-    if (!(referenceElement !== null && referenceElement !== void 0 && (_referenceElement$con = referenceElement.contains) !== null && _referenceElement$con !== void 0 && _referenceElement$con.call(referenceElement, e === null || e === void 0 ? void 0 : e.target))) {
+  useOnClickOutside(popperElement, (e) => {
+    if (!referenceElement?.contains?.(e?.target)) {
       onClickOutside(e);
       closeContextMenu();
     }
@@ -52,5 +34,7 @@ const useConfigDSPopperjs = appProps => {
     setIsAnimating
   }), [arrowElement, popoverHelper, popperElement, isAnimating, props]);
 };
-
-export { useConfigDSPopperjs };
+export {
+  useConfigDSPopperjs
+};
+//# sourceMappingURL=useConfigDSPopperjs.js.map

package/esm/config/useConfigDSPopperjs.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useConfigDSPopperjs.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo, useState, useEffect } from 'react';\nimport { usePopper } from 'react-popper';\nimport { useConfiguredMergedProps } from './useConfiguredMergedProps';\nimport type { useDSPopperjsPropsArgT, useDSPopperjsRT } from '../index.d';\n\nimport { useOnClickOutside } from '../utils/hooks/useOnClickOutside';\n\nexport const useConfigDSPopperjs = (appProps: useDSPopperjsPropsArgT): useDSPopperjsRT => {\n  const [popperElement, setPopperElement] = useState(null);\n  const [arrowElement, setArrowElement] = useState(null);\n  const [isAnimating, setIsAnimating] = useState<boolean>(false);\n\n  const props = useConfiguredMergedProps({ props: appProps, arrowElement });\n  const { referenceElement, closeContextMenu, onClickOutside, modifiers, startPlacementPreference } = props;\n  const popperExtraOpts = useMemo(\n    () => ({ placement: startPlacementPreference, modifiers }),\n    [modifiers, startPlacementPreference],\n  );\n\n  const popoverHelper = usePopper(referenceElement, popperElement, popperExtraOpts);\n\n  const { showPopover, withoutAnimation } = props;\n\n  useEffect(() => {\n    if (showPopover && !withoutAnimation) {\n      setIsAnimating(true);\n    }\n  }, [showPopover, withoutAnimation]);\n\n  useOnClickOutside(popperElement, (e) => {\n    if (!referenceElement?.contains?.(e?.target)) {\n      onClickOutside(e);\n      closeContextMenu();\n    }\n  });\n\n  return useMemo(\n    () => ({\n      props,\n      popperElement,\n      setPopperElement,\n      arrowElement,\n      setArrowElement,\n      popoverHelper,\n      isAnimating,\n      setIsAnimating,\n    }),\n    [arrowElement, popoverHelper, popperElement, isAnimating, props],\n  );\n};\n"],
+  "mappings": "AAAA;ACAA;AACA;AACA;AAGA;AAEO,MAAM,sBAAsB,CAAC,aAAsD;AACxF,QAAM,CAAC,eAAe,oBAAoB,SAAS;AACnD,QAAM,CAAC,cAAc,mBAAmB,SAAS;AACjD,QAAM,CAAC,aAAa,kBAAkB,SAAkB;AAExD,QAAM,QAAQ,yBAAyB,EAAE,OAAO,UAAU;AAC1D,QAAM,EAAE,kBAAkB,kBAAkB,gBAAgB,WAAW,6BAA6B;AACpG,QAAM,kBAAkB,QACtB,MAAO,GAAE,WAAW,0BAA0B,cAC9C,CAAC,WAAW;AAGd,QAAM,gBAAgB,UAAU,kBAAkB,eAAe;AAEjE,QAAM,EAAE,aAAa,qBAAqB;AAE1C,YAAU,MAAM;AACd,QAAI,eAAe,CAAC,kBAAkB;AACpC,qBAAe;AAAA;AAAA,KAEhB,CAAC,aAAa;AAEjB,oBAAkB,eAAe,CAAC,MAAM;AACtC,QAAI,CAAC,kBAAkB,WAAW,GAAG,SAAS;AAC5C,qBAAe;AACf;AAAA;AAAA;AAIJ,SAAO,QACL,MAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,MAEF,CAAC,cAAc,eAAe,eAAe,aAAa;AAAA;",
+  "names": []
+}

package/esm/config/useConfiguredDefaultModifiers.js

@@ -1,66 +1,60 @@
-import { useMemo } from 'react';
-
-const useConfiguredDefaultModifiers = _ref => {
-  let {
-    props,
-    arrowElement
-  } = _ref;
-  // we destructure explicit app definitions before merge
+import * as React from "react";
+import { useMemo } from "react";
+const useConfiguredDefaultModifiers = ({ props, arrowElement }) => {
   const {
     boundaryElement: explicitAppBoundaryElement,
     withoutArrow: explicitAppWithoutArrow = false,
-    placementOrderPreference: explicitPlacementOrderPreference = ['top', 'bottom', 'left', 'right'],
-    customOffset: explictAppOffset = undefined
-  } = props; // to build default modifiers on top of it
-
+    placementOrderPreference: explicitPlacementOrderPreference = ["top", "bottom", "left", "right"],
+    customOffset: explictAppOffset = void 0
+  } = props;
   const defaultModifiers = useMemo(() => {
     const mod = [];
+    mod.push({ name: "hide", enabled: true });
     mod.push({
-      name: 'hide',
-      enabled: true
-    });
-    mod.push({
-      name: 'flip',
+      name: "flip",
       options: {
         fallbackPlacements: explicitPlacementOrderPreference
       }
-    }); // we apply an offset if the app defines one or if the app wants the arrow
-
+    });
     if (!explicitAppWithoutArrow || explictAppOffset) {
       const defaultOffset = explictAppOffset || [0, 14];
       mod.push({
-        name: 'offset',
+        name: "offset",
         enabled: true,
         options: {
           offset: defaultOffset
         }
       });
-    } // the app can opt for a "no arrow" implementation (we do so in datatable/calendar etc...)
-
-
-    if (!explicitAppWithoutArrow) mod.push({
-      name: 'arrow',
-      options: {
-        element: arrowElement,
-        padding: 18
-      }
-    }); // the app can define an explicit element to act as a boundary instead of popperjs default one
-
-    if (explicitAppBoundaryElement) mod.push({
-      name: 'preventOverflow',
-      options: {
-        boundary: explicitAppBoundaryElement
-      }
-    });
+    }
+    if (!explicitAppWithoutArrow)
+      mod.push({
+        name: "arrow",
+        options: {
+          element: arrowElement,
+          padding: 18
+        }
+      });
+    if (explicitAppBoundaryElement)
+      mod.push({
+        name: "preventOverflow",
+        options: {
+          boundary: explicitAppBoundaryElement
+        }
+      });
     return mod;
-  }, [arrowElement, explicitAppBoundaryElement, explicitAppWithoutArrow, explicitPlacementOrderPreference, explictAppOffset]); // if the app pass custom modifier, we don't use "default modifiers"
-
-  const {
-    modifiers: explicitAppModifiers = defaultModifiers
-  } = props;
+  }, [
+    arrowElement,
+    explicitAppBoundaryElement,
+    explicitAppWithoutArrow,
+    explicitPlacementOrderPreference,
+    explictAppOffset
+  ]);
+  const { modifiers: explicitAppModifiers = defaultModifiers } = props;
   return useMemo(() => ({
     modifiers: explicitAppModifiers
   }), [explicitAppModifiers]);
 };
-
-export { useConfiguredDefaultModifiers };
+export {
+  useConfiguredDefaultModifiers
+};
+//# sourceMappingURL=useConfiguredDefaultModifiers.js.map

package/esm/config/useConfiguredDefaultModifiers.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useConfiguredDefaultModifiers.tsx"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo } from 'react';\n\nexport const useConfiguredDefaultModifiers = ({ props, arrowElement }) => {\n  // we destructure explicit app definitions before merge\n  const {\n    boundaryElement: explicitAppBoundaryElement,\n    withoutArrow: explicitAppWithoutArrow = false,\n    placementOrderPreference: explicitPlacementOrderPreference = ['top', 'bottom', 'left', 'right'],\n    customOffset: explictAppOffset = undefined,\n  } = props;\n  // to build default modifiers on top of it\n  const defaultModifiers = useMemo(() => {\n    const mod = [];\n    mod.push({ name: 'hide', enabled: true });\n    mod.push({\n      name: 'flip',\n      options: {\n        fallbackPlacements: explicitPlacementOrderPreference,\n      },\n    });\n    // we apply an offset if the app defines one or if the app wants the arrow\n    if (!explicitAppWithoutArrow || explictAppOffset) {\n      const defaultOffset = explictAppOffset || [0, 14];\n      mod.push({\n        name: 'offset',\n        enabled: true,\n        options: {\n          offset: defaultOffset,\n        },\n      });\n    }\n    // the app can opt for a \"no arrow\" implementation (we do so in datatable/calendar etc...)\n    if (!explicitAppWithoutArrow)\n      mod.push({\n        name: 'arrow',\n        options: {\n          element: arrowElement,\n          padding: 18,\n        },\n      });\n\n    // the app can define an explicit element to act as a boundary instead of popperjs default one\n    if (explicitAppBoundaryElement)\n      mod.push({\n        name: 'preventOverflow',\n        options: {\n          boundary: explicitAppBoundaryElement,\n        },\n      });\n    return mod;\n  }, [\n    arrowElement,\n    explicitAppBoundaryElement,\n    explicitAppWithoutArrow,\n    explicitPlacementOrderPreference,\n    explictAppOffset,\n  ]);\n  // if the app pass custom modifier, we don't use \"default modifiers\"\n  const { modifiers: explicitAppModifiers = defaultModifiers } = props;\n\n  return useMemo(\n    () => ({\n      modifiers: explicitAppModifiers,\n    }),\n    [explicitAppModifiers],\n  );\n};\n"],
+  "mappings": "AAAA;ACAA;AAEO,MAAM,gCAAgC,CAAC,EAAE,OAAO,mBAAmB;AAExE,QAAM;AAAA,IACJ,iBAAiB;AAAA,IACjB,cAAc,0BAA0B;AAAA,IACxC,0BAA0B,mCAAmC,CAAC,OAAO,UAAU,QAAQ;AAAA,IACvF,cAAc,mBAAmB;AAAA,MAC/B;AAEJ,QAAM,mBAAmB,QAAQ,MAAM;AACrC,UAAM,MAAM;AACZ,QAAI,KAAK,EAAE,MAAM,QAAQ,SAAS;AAClC,QAAI,KAAK;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,QACP,oBAAoB;AAAA;AAAA;AAIxB,QAAI,CAAC,2BAA2B,kBAAkB;AAChD,YAAM,gBAAgB,oBAAoB,CAAC,GAAG;AAC9C,UAAI,KAAK;AAAA,QACP,MAAM;AAAA,QACN,SAAS;AAAA,QACT,SAAS;AAAA,UACP,QAAQ;AAAA;AAAA;AAAA;AAKd,QAAI,CAAC;AACH,UAAI,KAAK;AAAA,QACP,MAAM;AAAA,QACN,SAAS;AAAA,UACP,SAAS;AAAA,UACT,SAAS;AAAA;AAAA;AAKf,QAAI;AACF,UAAI,KAAK;AAAA,QACP,MAAM;AAAA,QACN,SAAS;AAAA,UACP,UAAU;AAAA;AAAA;AAGhB,WAAO;AAAA,KACN;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAGF,QAAM,EAAE,WAAW,uBAAuB,qBAAqB;AAE/D,SAAO,QACL,MAAO;AAAA,IACL,WAAW;AAAA,MAEb,CAAC;AAAA;",
+  "names": []
+}