@elliemae/ds-popperjs 3.16.0 → 3.16.1

package/dist/cjs/PopoverArrow.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));

package/dist/cjs/PopoverArrow.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/PopoverArrow.tsx", "../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import React from 'react';\nimport { styled } from '@elliemae/ds-system';\ninterface PopoverArrowT {\n  placement: string;\n  style: React.CSSProperties;\n  arrowElementRef: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;\n}\nconst arrowWidth = 18;\nconst arrowHeight = 18;\n\nconst StyledArrow = styled.div<{ 'data-placement': string }>`\n  position: absolute;\n  width: ${arrowWidth}px;\n  height: ${arrowHeight}px;\n  pointer-events: none;\n  background-color: transparent;\n  & .stroke {\n    fill: neutral-500;\n    fill-opacity: 0.4;\n  }\n  & .fill {\n    fill: 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    aria-hidden=\"true\"\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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgEnB;AA/DJ,uBAAuB;AAMvB,MAAM,aAAa;AACnB,MAAM,cAAc;AAEpB,MAAM,cAAc,wBAAO;AAAA;AAAA,WAEhB;AAAA,YACC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAeG;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,KAAK,KAAK,MAAM,kBAAkB,WAAW,QAAQ,IACpF,IAAI,aAAa,SACjB;AAAA,gBACQ,CAAC,UACb,MAAM,kBAAkB,WAAW,MAAM,KAAK,MAAM,kBAAkB,WAAW,OAAO,IACpF,IAAI,cAAc,SAClB;AAAA;AAGD,MAAM,eAAe,CAAC,EAAE,WAAW,OAAO,gBAAgB,MAC/D;AAAA,EAAC;AAAA;AAAA,IAEC,kBAAgB;AAAA,IAChB;AAAA,IACA,KAAK;AAAA,IACL,eAAY;AAAA,IACZ,eAAY;AAAA,IAEZ,uDAAC,SAAI,SAAQ,aACX;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,GAAE;AAAA;AAAA,MAEJ;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,GAAE;AAAA;AAAA,MACJ;AAAA,OACF;AAAA;AAAA,EAjBI;AAkBN;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgEnB;AA/DJ,uBAAuB;AAMvB,MAAM,aAAa;AACnB,MAAM,cAAc;AAEpB,MAAM,cAAc,wBAAO;AAAA;AAAA,WAEhB;AAAA,YACC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAeG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAMF;AAAA;AAAA;AAAA,YAGD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAME;AAAA;AAAA,iBAEG,CAAC,UACd,MAAM,gBAAgB,EAAE,WAAW,KAAK,KAAK,MAAM,gBAAgB,EAAE,WAAW,QAAQ,IACpF,IAAI,aAAa,SACjB;AAAA,gBACQ,CAAC,UACb,MAAM,gBAAgB,EAAE,WAAW,MAAM,KAAK,MAAM,gBAAgB,EAAE,WAAW,OAAO,IACpF,IAAI,cAAc,SAClB;AAAA;AAGD,MAAM,eAAe,CAAC,EAAE,WAAW,OAAO,gBAAgB,MAC/D;AAAA,EAAC;AAAA;AAAA,IAEC,kBAAgB;AAAA,IAChB;AAAA,IACA,KAAK;AAAA,IACL,eAAY;AAAA,IACZ,eAAY;AAAA,IAEZ,uDAAC,SAAI,SAAQ,aACX;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,GAAE;AAAA;AAAA,MAEJ;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,GAAE;AAAA;AAAA,MACJ;AAAA,OACF;AAAA;AAAA,EAjBI;AAkBN;",
   "names": []
 }

package/dist/cjs/PopoverContent.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -30,8 +34,8 @@ module.exports = __toCommonJS(PopoverContent_exports);
 var React = __toESM(require("react"));
 var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
-var import_PopoverArrow = require("./PopoverArrow");
-var import_styled = require("./styled");
+var import_PopoverArrow = require("./PopoverArrow.js");
+var import_styled = require("./styled.js");
 const PopoverContent = ({
   setPopperElement,
   popperStyles,

package/dist/cjs/PopoverContent.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/PopoverContent.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useCallback, useMemo } from 'react';\nimport type {} from '@elliemae/ds-utilities';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport { PopoverArrow } from './PopoverArrow';\nimport { StyledPopoverContentWrapper, StyledAnimatedPopper } from './styled';\n\nexport interface PopoverContentPropsT {\n  setPopperElement: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;\n  popperStyles: React.CSSProperties;\n  arrowStyle: React.CSSProperties;\n  popperAttributes: Record<string, string> | undefined;\n  children: JSX.Element | JSX.Element[];\n  setArrowElement: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;\n  withoutArrow: boolean;\n  withoutAnimation: boolean;\n  animationDuration: number;\n  zIndex: number;\n  showPopover: boolean;\n  setIsAnimating: React.Dispatch<React.SetStateAction<boolean>>;\n  globalAttrs: GlobalAttributesT;\n  xStyledAttrs: XstyledProps;\n}\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  globalAttrs,\n  xStyledAttrs,\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\n      ref={setPopperElement}\n      style={popperStyles}\n      {...popperAttributes}\n      {...globalAttrs}\n      {...xStyledAttrs}\n      zIndex={zIndex}\n    >\n      <StyledAnimatedPopper\n        showPopover={showPopover}\n        animationDuration={animationDuration}\n        withoutAnimation={withoutAnimation}\n        onAnimationEnd={checkAnimationStatus}\n      >\n        {popperContent}\n      </StyledAnimatedPopper>\n    </StyledPopoverContentWrapper>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkDb;AAlDV,mBAA4C;AAG5C,0BAA6B;AAC7B,oBAAkE;AAmB3D,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,EACA;AAAA,EACA;AACF,MAAyC;AACvC,QAAM,2BAAuB,0BAAY,MAAM;AAC7C,QAAI,CAAC,eAAe,CAAC,kBAAkB;AACrC,qBAAe,KAAK;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,aAAa,kBAAkB,cAAc,CAAC;AAElD,QAAM,oBAAgB;AAAA,IACpB,MACE,4EACG;AAAA;AAAA,MACA,iBAAiB,QAChB,4EACE;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,iBAAiB;AAAA,YACjB,OAAO;AAAA,YACP,WAAW,mBAAmB,iBAAiB,2BAA2B;AAAA;AAAA,QAC5E;AAAA,QACA,4CAAC,SAAI,KAAK,iBAAiB,OAAO,YAAY;AAAA,SAChD,IACE;AAAA,OACN;AAAA,IAEF,CAAC,UAAU,cAAc,YAAY,kBAAkB,eAAe;AAAA,EACxE;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,OAAO;AAAA,MACN,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACJ;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,UACA,gBAAgB;AAAA,UAEf;AAAA;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;",
+  "sourcesContent": ["import React, { useCallback, useMemo } from 'react';\nimport type {} from '@elliemae/ds-utilities';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport { PopoverArrow } from './PopoverArrow.js';\nimport { StyledPopoverContentWrapper, StyledAnimatedPopper } from './styled.js';\n\nexport interface PopoverContentPropsT {\n  setPopperElement: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;\n  popperStyles: React.CSSProperties;\n  arrowStyle: React.CSSProperties;\n  popperAttributes: Record<string, string> | undefined;\n  children: JSX.Element | JSX.Element[];\n  setArrowElement: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;\n  withoutArrow: boolean;\n  withoutAnimation: boolean;\n  animationDuration: number;\n  zIndex: number;\n  showPopover: boolean;\n  setIsAnimating: React.Dispatch<React.SetStateAction<boolean>>;\n  globalAttrs: GlobalAttributesT;\n  xStyledAttrs: XstyledProps;\n}\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  globalAttrs,\n  xStyledAttrs,\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\n      ref={setPopperElement}\n      style={popperStyles}\n      {...popperAttributes}\n      {...globalAttrs}\n      {...xStyledAttrs}\n      zIndex={zIndex}\n    >\n      <StyledAnimatedPopper\n        showPopover={showPopover}\n        animationDuration={animationDuration}\n        withoutAnimation={withoutAnimation}\n        onAnimationEnd={checkAnimationStatus}\n      >\n        {popperContent}\n      </StyledAnimatedPopper>\n    </StyledPopoverContentWrapper>\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADkDb;AAlDV,mBAA4C;AAG5C,0BAA6B;AAC7B,oBAAkE;AAmB3D,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,EACA;AAAA,EACA;AACF,MAAyC;AACvC,QAAM,2BAAuB,0BAAY,MAAM;AAC7C,QAAI,CAAC,eAAe,CAAC,kBAAkB;AACrC,qBAAe,KAAK;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,aAAa,kBAAkB,cAAc,CAAC;AAElD,QAAM,oBAAgB;AAAA,IACpB,MACE,4EACG;AAAA;AAAA,MACA,iBAAiB,QAChB,4EACE;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,iBAAiB;AAAA,YACjB,OAAO;AAAA,YACP,WAAW,mBAAmB,iBAAiB,uBAAuB,IAAI;AAAA;AAAA,QAC5E;AAAA,QACA,4CAAC,SAAI,KAAK,iBAAiB,OAAO,YAAY;AAAA,SAChD,IACE;AAAA,OACN;AAAA,IAEF,CAAC,UAAU,cAAc,YAAY,kBAAkB,eAAe;AAAA,EACxE;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,OAAO;AAAA,MACN,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACJ;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,UACA,gBAAgB;AAAA,UAEf;AAAA;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;",
   "names": []
 }

package/dist/cjs/config/useConfigDSPopperjs.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -31,8 +35,8 @@ var React = __toESM(require("react"));
 var import_react = require("react");
 var import_react_popper = require("react-popper");
 var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
-var import_useConfiguredMergedProps = require("./useConfiguredMergedProps");
-var import_useOnClickOutside = require("../utils/hooks/useOnClickOutside");
+var import_useConfiguredMergedProps = require("./useConfiguredMergedProps.js");
+var import_useOnClickOutside = require("../utils/hooks/useOnClickOutside.js");
 const useConfigDSPopperjs = (appProps) => {
   const [popperElement, setPopperElement] = (0, import_react.useState)(null);
   const [arrowElement, setArrowElement] = (0, import_react.useState)(null);

package/dist/cjs/config/useConfigDSPopperjs.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/config/useConfigDSPopperjs.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { useMemo, useState, useEffect } from 'react';\nimport { usePopper } from 'react-popper';\nimport { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { useConfiguredMergedProps } from './useConfiguredMergedProps';\nimport type { UseDSPopperjsPropsArgT, UseDSPopperjsRT } from '../react-desc-prop-types';\nimport { useOnClickOutside } from '../utils/hooks/useOnClickOutside';\n\nexport const useConfigDSPopperjs = (appProps: UseDSPopperjsPropsArgT): UseDSPopperjsRT => {\n  const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n  const [arrowElement, setArrowElement] = useState<HTMLDivElement | null>(null);\n  const [isAnimating, setIsAnimating] = useState(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 as Node, (e) => {\n    if (!referenceElement?.contains?.(e?.target as Node)) {\n      onClickOutside(e);\n      closeContextMenu();\n    }\n  });\n\n  const globalAttrs = useGetGlobalAttributes(props);\n  const xStyledAttrs = useGetXstyledProps(props);\n\n  return useMemo(\n    () => ({\n      props,\n      popperElement,\n      setPopperElement,\n      arrowElement,\n      setArrowElement,\n      popoverHelper,\n      isAnimating,\n      setIsAnimating,\n      globalAttrs,\n      xStyledAttrs,\n    }),\n    [props, popperElement, arrowElement, popoverHelper, isAnimating, globalAttrs, xStyledAttrs],\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA6C;AAC7C,0BAA0B;AAC1B,8BAA2D;AAC3D,sCAAyC;AAEzC,+BAAkC;AAE3B,MAAM,sBAAsB,CAAC,aAAsD;AACxF,QAAM,CAAC,eAAe,gBAAgB,QAAI,uBAAgC,IAAI;AAC9E,QAAM,CAAC,cAAc,eAAe,QAAI,uBAAgC,IAAI;AAC5E,QAAM,CAAC,aAAa,cAAc,QAAI,uBAAS,KAAK;AAEpD,QAAM,YAAQ,0DAAyB,EAAE,OAAO,UAAU,aAAa,CAAC;AACxE,QAAM,EAAE,kBAAkB,kBAAkB,gBAAgB,WAAW,yBAAyB,IAAI;AACpG,QAAM,sBAAkB;AAAA,IACtB,OAAO,EAAE,WAAW,0BAA0B,UAAU;AAAA,IACxD,CAAC,WAAW,wBAAwB;AAAA,EACtC;AAEA,QAAM,oBAAgB,+BAAU,kBAAkB,eAAe,eAAe;AAEhF,QAAM,EAAE,aAAa,iBAAiB,IAAI;AAE1C,8BAAU,MAAM;AACd,QAAI,eAAe,CAAC,kBAAkB;AACpC,qBAAe,IAAI;AAAA,IACrB;AAAA,EACF,GAAG,CAAC,aAAa,gBAAgB,CAAC;AAElC,kDAAkB,eAAuB,CAAC,MAAM;AAC9C,QAAI,CAAC,kBAAkB,WAAW,GAAG,MAAc,GAAG;AACpD,qBAAe,CAAC;AAChB,uBAAiB;AAAA,IACnB;AAAA,EACF,CAAC;AAED,QAAM,kBAAc,gDAAuB,KAAK;AAChD,QAAM,mBAAe,4CAAmB,KAAK;AAE7C,aAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,OAAO,eAAe,cAAc,eAAe,aAAa,aAAa,YAAY;AAAA,EAC5F;AACF;",
+  "sourcesContent": ["import { useMemo, useState, useEffect } from 'react';\nimport { usePopper } from 'react-popper';\nimport { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { useConfiguredMergedProps } from './useConfiguredMergedProps.js';\nimport type { UseDSPopperjsPropsArgT, UseDSPopperjsRT } from '../react-desc-prop-types.js';\nimport { useOnClickOutside } from '../utils/hooks/useOnClickOutside.js';\n\nexport const useConfigDSPopperjs = (appProps: UseDSPopperjsPropsArgT): UseDSPopperjsRT => {\n  const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n  const [arrowElement, setArrowElement] = useState<HTMLDivElement | null>(null);\n  const [isAnimating, setIsAnimating] = useState(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 as Node, (e) => {\n    if (!referenceElement?.contains?.(e?.target as Node)) {\n      onClickOutside(e);\n      closeContextMenu();\n    }\n  });\n\n  const globalAttrs = useGetGlobalAttributes(props);\n  const xStyledAttrs = useGetXstyledProps(props);\n\n  return useMemo(\n    () => ({\n      props,\n      popperElement,\n      setPopperElement,\n      arrowElement,\n      setArrowElement,\n      popoverHelper,\n      isAnimating,\n      setIsAnimating,\n      globalAttrs,\n      xStyledAttrs,\n    }),\n    [props, popperElement, arrowElement, popoverHelper, isAnimating, globalAttrs, xStyledAttrs],\n  );\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA6C;AAC7C,0BAA0B;AAC1B,8BAA2D;AAC3D,sCAAyC;AAEzC,+BAAkC;AAE3B,MAAM,sBAAsB,CAAC,aAAsD;AACxF,QAAM,CAAC,eAAe,gBAAgB,QAAI,uBAAgC,IAAI;AAC9E,QAAM,CAAC,cAAc,eAAe,QAAI,uBAAgC,IAAI;AAC5E,QAAM,CAAC,aAAa,cAAc,QAAI,uBAAS,KAAK;AAEpD,QAAM,YAAQ,0DAAyB,EAAE,OAAO,UAAU,aAAa,CAAC;AACxE,QAAM,EAAE,kBAAkB,kBAAkB,gBAAgB,WAAW,yBAAyB,IAAI;AACpG,QAAM,sBAAkB;AAAA,IACtB,OAAO,EAAE,WAAW,0BAA0B,UAAU;AAAA,IACxD,CAAC,WAAW,wBAAwB;AAAA,EACtC;AAEA,QAAM,oBAAgB,+BAAU,kBAAkB,eAAe,eAAe;AAEhF,QAAM,EAAE,aAAa,iBAAiB,IAAI;AAE1C,8BAAU,MAAM;AACd,QAAI,eAAe,CAAC,kBAAkB;AACpC,qBAAe,IAAI;AAAA,IACrB;AAAA,EACF,GAAG,CAAC,aAAa,gBAAgB,CAAC;AAElC,kDAAkB,eAAuB,CAAC,MAAM;AAC9C,QAAI,CAAC,kBAAkB,WAAW,GAAG,MAAc,GAAG;AACpD,qBAAe,CAAC;AAChB,uBAAiB;AAAA,IACnB;AAAA,EACF,CAAC;AAED,QAAM,kBAAc,gDAAuB,KAAK;AAChD,QAAM,mBAAe,4CAAmB,KAAK;AAE7C,aAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,OAAO,eAAe,cAAc,eAAe,aAAa,aAAa,YAAY;AAAA,EAC5F;AACF;",
   "names": []
 }

package/dist/cjs/config/useConfiguredDefaultModifiers.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));

package/dist/cjs/config/useConfiguredDefaultModifiers.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/config/useConfiguredDefaultModifiers.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { useMemo } from 'react';\nimport type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types';\n\ninterface UseConfiguredDefaultModifiersT {\n  props: UseDSPopperjsPropsArgT;\n  arrowElement: HTMLDivElement | null;\n}\n\nexport const useConfiguredDefaultModifiers = ({ props, arrowElement }: UseConfiguredDefaultModifiersT) => {\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", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AAQjB,MAAM,gCAAgC,CAAC,EAAE,OAAO,aAAa,MAAsC;AAExG,QAAM;AAAA,IACJ,iBAAiB;AAAA,IACjB,cAAc,0BAA0B;AAAA,IACxC,0BAA0B,mCAAmC,CAAC,OAAO,UAAU,QAAQ,OAAO;AAAA,IAC9F,cAAc,mBAAmB;AAAA,EACnC,IAAI;AAEJ,QAAM,uBAAmB,sBAAQ,MAAM;AACrC,UAAM,MAAM,CAAC;AACb,QAAI,KAAK,EAAE,MAAM,QAAQ,SAAS,KAAK,CAAC;AACxC,QAAI,KAAK;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,QACP,oBAAoB;AAAA,MACtB;AAAA,IACF,CAAC;AAED,QAAI,CAAC,2BAA2B,kBAAkB;AAChD,YAAM,gBAAgB,oBAAoB,CAAC,GAAG,EAAE;AAChD,UAAI,KAAK;AAAA,QACP,MAAM;AAAA,QACN,SAAS;AAAA,QACT,SAAS;AAAA,UACP,QAAQ;AAAA,QACV;AAAA,MACF,CAAC;AAAA,IACH;AAEA,QAAI,CAAC;AACH,UAAI,KAAK;AAAA,QACP,MAAM;AAAA,QACN,SAAS;AAAA,UACP,SAAS;AAAA,UACT,SAAS;AAAA,QACX;AAAA,MACF,CAAC;AAGH,QAAI;AACF,UAAI,KAAK;AAAA,QACP,MAAM;AAAA,QACN,SAAS;AAAA,UACP,UAAU;AAAA,QACZ;AAAA,MACF,CAAC;AACH,WAAO;AAAA,EACT,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,EAAE,WAAW,uBAAuB,iBAAiB,IAAI;AAE/D,aAAO;AAAA,IACL,OAAO;AAAA,MACL,WAAW;AAAA,IACb;AAAA,IACA,CAAC,oBAAoB;AAAA,EACvB;AACF;",
+  "sourcesContent": ["import { useMemo } from 'react';\nimport type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types.js';\n\ninterface UseConfiguredDefaultModifiersT {\n  props: UseDSPopperjsPropsArgT;\n  arrowElement: HTMLDivElement | null;\n}\n\nexport const useConfiguredDefaultModifiers = ({ props, arrowElement }: UseConfiguredDefaultModifiersT) => {\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", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AAQjB,MAAM,gCAAgC,CAAC,EAAE,OAAO,aAAa,MAAsC;AAExG,QAAM;AAAA,IACJ,iBAAiB;AAAA,IACjB,cAAc,0BAA0B;AAAA,IACxC,0BAA0B,mCAAmC,CAAC,OAAO,UAAU,QAAQ,OAAO;AAAA,IAC9F,cAAc,mBAAmB;AAAA,EACnC,IAAI;AAEJ,QAAM,uBAAmB,sBAAQ,MAAM;AACrC,UAAM,MAAM,CAAC;AACb,QAAI,KAAK,EAAE,MAAM,QAAQ,SAAS,KAAK,CAAC;AACxC,QAAI,KAAK;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,QACP,oBAAoB;AAAA,MACtB;AAAA,IACF,CAAC;AAED,QAAI,CAAC,2BAA2B,kBAAkB;AAChD,YAAM,gBAAgB,oBAAoB,CAAC,GAAG,EAAE;AAChD,UAAI,KAAK;AAAA,QACP,MAAM;AAAA,QACN,SAAS;AAAA,QACT,SAAS;AAAA,UACP,QAAQ;AAAA,QACV;AAAA,MACF,CAAC;AAAA,IACH;AAEA,QAAI,CAAC;AACH,UAAI,KAAK;AAAA,QACP,MAAM;AAAA,QACN,SAAS;AAAA,UACP,SAAS;AAAA,UACT,SAAS;AAAA,QACX;AAAA,MACF,CAAC;AAGH,QAAI;AACF,UAAI,KAAK;AAAA,QACP,MAAM;AAAA,QACN,SAAS;AAAA,UACP,UAAU;AAAA,QACZ;AAAA,MACF,CAAC;AACH,WAAO;AAAA,EACT,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,EAAE,WAAW,uBAAuB,iBAAiB,IAAI;AAE/D,aAAO;AAAA,IACL,OAAO;AAAA,MACL,WAAW;AAAA,IACb;AAAA,IACA,CAAC,oBAAoB;AAAA,EACvB;AACF;",
   "names": []
 }

package/dist/cjs/config/useConfiguredDefaultProps.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -29,7 +33,7 @@ __export(useConfiguredDefaultProps_exports, {
 module.exports = __toCommonJS(useConfiguredDefaultProps_exports);
 var React = __toESM(require("react"));
 var import_react = require("react");
-var import_useConfiguredDefaultModifiers = require("./useConfiguredDefaultModifiers");
+var import_useConfiguredDefaultModifiers = require("./useConfiguredDefaultModifiers.js");
 const noop = () => {
 };
 const emptyObj = {};

package/dist/cjs/config/useConfiguredDefaultProps.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/config/useConfiguredDefaultProps.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { useMemo } from 'react';\nimport { useConfiguredDefaultModifiers } from './useConfiguredDefaultModifiers';\nimport type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types';\n\nconst noop = () => {};\n\nconst emptyObj = {};\n\ninterface UseConfiguredDefaultPropsT {\n  props: UseDSPopperjsPropsArgT;\n  arrowElement: HTMLDivElement | null;\n}\n\nexport const useConfiguredDefaultProps = ({ props, arrowElement }: Required<UseConfiguredDefaultPropsT>) => {\n  // don't move this out of the hook or `document.body` will explode\n  const staticDefaultProps: UseDSPopperjsPropsArgT = useMemo(\n    () => ({\n      referenceElement: null,\n      showPopover: false,\n      closeContextMenu: noop,\n      onClickOutside: noop,\n      withoutPortal: false,\n      withoutArrow: false,\n      withoutAnimation: false,\n      animationDuration: 100,\n      portalDOMContainer: document.body,\n      startPlacementPreference: 'top',\n      placementOrderPreference: ['top', 'bottom', 'left', 'right'],\n      extraPopperStyles: emptyObj,\n    }),\n    [],\n  );\n  const { modifiers: configuredModifiers } = useConfiguredDefaultModifiers({\n    props,\n    arrowElement,\n  });\n\n  const defaultProps = useMemo(\n    () => ({ ...staticDefaultProps, modifiers: configuredModifiers }),\n    [configuredModifiers, staticDefaultProps],\n  );\n\n  return defaultProps;\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AACxB,2CAA8C;AAG9C,MAAM,OAAO,MAAM;AAAC;AAEpB,MAAM,WAAW,CAAC;AAOX,MAAM,4BAA4B,CAAC,EAAE,OAAO,aAAa,MAA4C;AAE1G,QAAM,yBAA6C;AAAA,IACjD,OAAO;AAAA,MACL,kBAAkB;AAAA,MAClB,aAAa;AAAA,MACb,kBAAkB;AAAA,MAClB,gBAAgB;AAAA,MAChB,eAAe;AAAA,MACf,cAAc;AAAA,MACd,kBAAkB;AAAA,MAClB,mBAAmB;AAAA,MACnB,oBAAoB,SAAS;AAAA,MAC7B,0BAA0B;AAAA,MAC1B,0BAA0B,CAAC,OAAO,UAAU,QAAQ,OAAO;AAAA,MAC3D,mBAAmB;AAAA,IACrB;AAAA,IACA,CAAC;AAAA,EACH;AACA,QAAM,EAAE,WAAW,oBAAoB,QAAI,oEAA8B;AAAA,IACvE;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,mBAAe;AAAA,IACnB,OAAO,EAAE,GAAG,oBAAoB,WAAW,oBAAoB;AAAA,IAC/D,CAAC,qBAAqB,kBAAkB;AAAA,EAC1C;AAEA,SAAO;AACT;",
+  "sourcesContent": ["import { useMemo } from 'react';\nimport { useConfiguredDefaultModifiers } from './useConfiguredDefaultModifiers.js';\nimport type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types.js';\n\nconst noop = () => {};\n\nconst emptyObj = {};\n\ninterface UseConfiguredDefaultPropsT {\n  props: UseDSPopperjsPropsArgT;\n  arrowElement: HTMLDivElement | null;\n}\n\nexport const useConfiguredDefaultProps = ({ props, arrowElement }: Required<UseConfiguredDefaultPropsT>) => {\n  // don't move this out of the hook or `document.body` will explode\n  const staticDefaultProps: UseDSPopperjsPropsArgT = useMemo(\n    () => ({\n      referenceElement: null,\n      showPopover: false,\n      closeContextMenu: noop,\n      onClickOutside: noop,\n      withoutPortal: false,\n      withoutArrow: false,\n      withoutAnimation: false,\n      animationDuration: 100,\n      portalDOMContainer: document.body,\n      startPlacementPreference: 'top',\n      placementOrderPreference: ['top', 'bottom', 'left', 'right'],\n      extraPopperStyles: emptyObj,\n    }),\n    [],\n  );\n  const { modifiers: configuredModifiers } = useConfiguredDefaultModifiers({\n    props,\n    arrowElement,\n  });\n\n  const defaultProps = useMemo(\n    () => ({ ...staticDefaultProps, modifiers: configuredModifiers }),\n    [configuredModifiers, staticDefaultProps],\n  );\n\n  return defaultProps;\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAAwB;AACxB,2CAA8C;AAG9C,MAAM,OAAO,MAAM;AAAC;AAEpB,MAAM,WAAW,CAAC;AAOX,MAAM,4BAA4B,CAAC,EAAE,OAAO,aAAa,MAA4C;AAE1G,QAAM,yBAA6C;AAAA,IACjD,OAAO;AAAA,MACL,kBAAkB;AAAA,MAClB,aAAa;AAAA,MACb,kBAAkB;AAAA,MAClB,gBAAgB;AAAA,MAChB,eAAe;AAAA,MACf,cAAc;AAAA,MACd,kBAAkB;AAAA,MAClB,mBAAmB;AAAA,MACnB,oBAAoB,SAAS;AAAA,MAC7B,0BAA0B;AAAA,MAC1B,0BAA0B,CAAC,OAAO,UAAU,QAAQ,OAAO;AAAA,MAC3D,mBAAmB;AAAA,IACrB;AAAA,IACA,CAAC;AAAA,EACH;AACA,QAAM,EAAE,WAAW,oBAAoB,QAAI,oEAA8B;AAAA,IACvE;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,mBAAe;AAAA,IACnB,OAAO,EAAE,GAAG,oBAAoB,WAAW,oBAAoB;AAAA,IAC/D,CAAC,qBAAqB,kBAAkB;AAAA,EAC1C;AAEA,SAAO;AACT;",
   "names": []
 }

package/dist/cjs/config/useConfiguredMergedProps.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -29,7 +33,7 @@ __export(useConfiguredMergedProps_exports, {
 module.exports = __toCommonJS(useConfiguredMergedProps_exports);
 var React = __toESM(require("react"));
 var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
-var import_useConfiguredDefaultProps = require("./useConfiguredDefaultProps");
+var import_useConfiguredDefaultProps = require("./useConfiguredDefaultProps.js");
 const useConfiguredMergedProps = ({ props, arrowElement }) => {
   const defaultProps = (0, import_useConfiguredDefaultProps.useConfiguredDefaultProps)({ props, arrowElement });
   return (0, import_ds_props_helpers.useMemoMergePropsWithDefault)(props, defaultProps);

package/dist/cjs/config/useConfiguredMergedProps.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/config/useConfiguredMergedProps.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import { useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { useConfiguredDefaultProps } from './useConfiguredDefaultProps';\nimport type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types';\n\ninterface UseConfiguredMergedPropsT {\n  props: UseDSPopperjsPropsArgT;\n  arrowElement: HTMLDivElement | null;\n}\n\nexport const useConfiguredMergedProps = ({ props, arrowElement }: UseConfiguredMergedPropsT) => {\n  const defaultProps = useConfiguredDefaultProps({ props, arrowElement });\n\n  return useMemoMergePropsWithDefault<Required<UseDSPopperjsPropsArgT>>(props, defaultProps);\n};\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAA6C;AAC7C,uCAA0C;AAQnC,MAAM,2BAA2B,CAAC,EAAE,OAAO,aAAa,MAAiC;AAC9F,QAAM,mBAAe,4DAA0B,EAAE,OAAO,aAAa,CAAC;AAEtE,aAAO,sDAA+D,OAAO,YAAY;AAC3F;",
+  "sourcesContent": ["import { useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { useConfiguredDefaultProps } from './useConfiguredDefaultProps.js';\nimport type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types.js';\n\ninterface UseConfiguredMergedPropsT {\n  props: UseDSPopperjsPropsArgT;\n  arrowElement: HTMLDivElement | null;\n}\n\nexport const useConfiguredMergedProps = ({ props, arrowElement }: UseConfiguredMergedPropsT) => {\n  const defaultProps = useConfiguredDefaultProps({ props, arrowElement });\n\n  return useMemoMergePropsWithDefault<Required<UseDSPopperjsPropsArgT>>(props, defaultProps);\n};\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,8BAA6C;AAC7C,uCAA0C;AAQnC,MAAM,2BAA2B,CAAC,EAAE,OAAO,aAAa,MAAiC;AAC9F,QAAM,mBAAe,4DAA0B,EAAE,OAAO,aAAa,CAAC;AAEtE,aAAO,sDAA+D,OAAO,YAAY;AAC3F;",
   "names": []
 }

package/dist/cjs/index.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -34,9 +38,9 @@ var import_jsx_runtime = require("react/jsx-runtime");
 var import_react = require("react");
 var import_react_dom = require("react-dom");
 var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
-var import_PopoverContent = require("./PopoverContent");
-var import_useConfigDSPopperjs = require("./config/useConfigDSPopperjs");
-var import_react_desc_prop_types = require("./react-desc-prop-types");
+var import_PopoverContent = require("./PopoverContent.js");
+var import_useConfigDSPopperjs = require("./config/useConfigDSPopperjs.js");
+var import_react_desc_prop_types = require("./react-desc-prop-types.js");
 const DSPopperJS = (props) => {
   const {
     props: {

package/dist/cjs/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/index.tsx", "../../../../scripts/build/transpile/react-shim.js"],
-  "sourcesContent": ["import React, { useMemo } from 'react';\nimport { createPortal } from 'react-dom';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { PopoverContent } from './PopoverContent';\nimport { useConfigDSPopperjs } from './config/useConfigDSPopperjs';\nimport type { DSDSPopperjsPropsT } from './react-desc-prop-types';\nimport { dspopperjsPropTypes } from './react-desc-prop-types';\n\nconst DSPopperJS: React.ComponentType<DSDSPopperjsPropsT> = (props) => {\n  const {\n    props: {\n      showPopover,\n      withoutAnimation,\n      animationDuration,\n      withoutPortal,\n      withoutArrow,\n      portalDOMContainer,\n      zIndex,\n      extraPopperStyles,\n    },\n    globalAttrs,\n    xStyledAttrs,\n    setPopperElement,\n    setArrowElement,\n    setIsAnimating,\n    popoverHelper,\n    isAnimating,\n  } = useConfigDSPopperjs(props);\n  const { children } = props;\n  const { styles, attributes } = popoverHelper;\n  const contentJSX = useMemo(\n    () => (\n      <PopoverContent\n        setPopperElement={setPopperElement}\n        popperStyles={{ ...styles.popper, ...extraPopperStyles }}\n        popperAttributes={attributes.popper}\n        setArrowElement={setArrowElement}\n        arrowStyle={styles.arrow}\n        withoutArrow={withoutArrow}\n        withoutAnimation={withoutAnimation}\n        animationDuration={animationDuration}\n        zIndex={zIndex}\n        showPopover={showPopover}\n        setIsAnimating={setIsAnimating}\n        globalAttrs={globalAttrs}\n        xStyledAttrs={xStyledAttrs}\n      >\n        {children}\n      </PopoverContent>\n    ),\n    [\n      attributes.popper,\n      children,\n      setIsAnimating,\n      showPopover,\n      extraPopperStyles,\n      setArrowElement,\n      setPopperElement,\n      styles.arrow,\n      styles.popper,\n      withoutArrow,\n      withoutAnimation,\n      animationDuration,\n      zIndex,\n      globalAttrs,\n      xStyledAttrs,\n    ],\n  );\n  if (showPopover || isAnimating) {\n    if (withoutPortal === true) return contentJSX;\n    if (withoutPortal === false) return <>{createPortal(contentJSX, portalDOMContainer)}</>;\n  }\n  return null;\n};\n\nDSPopperJS.propTypes = dspopperjsPropTypes;\nDSPopperJS.displayName = 'DSPopperJS';\nconst DSPopperJSWithSchema = describe(DSPopperJS).description('A dimsum custom styling wrapper on top of popperjs');\nDSPopperJSWithSchema.propTypes = dspopperjsPropTypes;\n\nexport { DSPopperJS, DSPopperJSWithSchema };\nexport default DSPopperJS;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgCjB;AAhCN,mBAA+B;AAC/B,uBAA6B;AAC7B,8BAAyB;AACzB,4BAA+B;AAC/B,iCAAoC;AAEpC,mCAAoC;AAEpC,MAAM,aAAsD,CAAC,UAAU;AACrE,QAAM;AAAA,IACJ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,gDAAoB,KAAK;AAC7B,QAAM,EAAE,SAAS,IAAI;AACrB,QAAM,EAAE,QAAQ,WAAW,IAAI;AAC/B,QAAM,iBAAa;AAAA,IACjB,MACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,cAAc,EAAE,GAAG,OAAO,QAAQ,GAAG,kBAAkB;AAAA,QACvD,kBAAkB,WAAW;AAAA,QAC7B;AAAA,QACA,YAAY,OAAO;AAAA,QACnB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,IAEF;AAAA,MACE,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACA,MAAI,eAAe,aAAa;AAC9B,QAAI,kBAAkB;AAAM,aAAO;AACnC,QAAI,kBAAkB;AAAO,aAAO,2EAAG,6CAAa,YAAY,kBAAkB,GAAE;AAAA,EACtF;AACA,SAAO;AACT;AAEA,WAAW,YAAY;AACvB,WAAW,cAAc;AACzB,MAAM,2BAAuB,kCAAS,UAAU,EAAE,YAAY,oDAAoD;AAClH,qBAAqB,YAAY;AAGjC,IAAO,cAAQ;",
+  "sourcesContent": ["import React, { useMemo } from 'react';\nimport { createPortal } from 'react-dom';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { PopoverContent } from './PopoverContent.js';\nimport { useConfigDSPopperjs } from './config/useConfigDSPopperjs.js';\nimport type { DSDSPopperjsPropsT } from './react-desc-prop-types.js';\nimport { dspopperjsPropTypes } from './react-desc-prop-types.js';\n\nconst DSPopperJS: React.ComponentType<DSDSPopperjsPropsT> = (props) => {\n  const {\n    props: {\n      showPopover,\n      withoutAnimation,\n      animationDuration,\n      withoutPortal,\n      withoutArrow,\n      portalDOMContainer,\n      zIndex,\n      extraPopperStyles,\n    },\n    globalAttrs,\n    xStyledAttrs,\n    setPopperElement,\n    setArrowElement,\n    setIsAnimating,\n    popoverHelper,\n    isAnimating,\n  } = useConfigDSPopperjs(props);\n  const { children } = props;\n  const { styles, attributes } = popoverHelper;\n  const contentJSX = useMemo(\n    () => (\n      <PopoverContent\n        setPopperElement={setPopperElement}\n        popperStyles={{ ...styles.popper, ...extraPopperStyles }}\n        popperAttributes={attributes.popper}\n        setArrowElement={setArrowElement}\n        arrowStyle={styles.arrow}\n        withoutArrow={withoutArrow}\n        withoutAnimation={withoutAnimation}\n        animationDuration={animationDuration}\n        zIndex={zIndex}\n        showPopover={showPopover}\n        setIsAnimating={setIsAnimating}\n        globalAttrs={globalAttrs}\n        xStyledAttrs={xStyledAttrs}\n      >\n        {children}\n      </PopoverContent>\n    ),\n    [\n      attributes.popper,\n      children,\n      setIsAnimating,\n      showPopover,\n      extraPopperStyles,\n      setArrowElement,\n      setPopperElement,\n      styles.arrow,\n      styles.popper,\n      withoutArrow,\n      withoutAnimation,\n      animationDuration,\n      zIndex,\n      globalAttrs,\n      xStyledAttrs,\n    ],\n  );\n  if (showPopover || isAnimating) {\n    if (withoutPortal === true) return contentJSX;\n    if (withoutPortal === false) return <>{createPortal(contentJSX, portalDOMContainer)}</>;\n  }\n  return null;\n};\n\nDSPopperJS.propTypes = dspopperjsPropTypes;\nDSPopperJS.displayName = 'DSPopperJS';\nconst DSPopperJSWithSchema = describe(DSPopperJS).description('A dimsum custom styling wrapper on top of popperjs');\nDSPopperJSWithSchema.propTypes = dspopperjsPropTypes;\n\nexport { DSPopperJS, DSPopperJSWithSchema };\nexport default DSPopperJS;\n", "import * as React from 'react';\nexport { React };\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADgCjB;AAhCN,mBAA+B;AAC/B,uBAA6B;AAC7B,8BAAyB;AACzB,4BAA+B;AAC/B,iCAAoC;AAEpC,mCAAoC;AAEpC,MAAM,aAAsD,CAAC,UAAU;AACrE,QAAM;AAAA,IACJ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,QAAI,gDAAoB,KAAK;AAC7B,QAAM,EAAE,SAAS,IAAI;AACrB,QAAM,EAAE,QAAQ,WAAW,IAAI;AAC/B,QAAM,iBAAa;AAAA,IACjB,MACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,cAAc,EAAE,GAAG,OAAO,QAAQ,GAAG,kBAAkB;AAAA,QACvD,kBAAkB,WAAW;AAAA,QAC7B;AAAA,QACA,YAAY,OAAO;AAAA,QACnB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,IAEF;AAAA,MACE,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACA,MAAI,eAAe,aAAa;AAC9B,QAAI,kBAAkB;AAAM,aAAO;AACnC,QAAI,kBAAkB;AAAO,aAAO,2EAAG,6CAAa,YAAY,kBAAkB,GAAE;AAAA,EACtF;AACA,SAAO;AACT;AAEA,WAAW,YAAY;AACvB,WAAW,cAAc;AACzB,MAAM,2BAAuB,kCAAS,UAAU,EAAE,YAAY,oDAAoD;AAClH,qBAAqB,YAAY;AAGjC,IAAO,cAAQ;",
   "names": []
 }

package/dist/cjs/package.json

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

package/dist/cjs/react-desc-prop-types.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));
@@ -32,21 +36,53 @@ var import_ds_props_helpers = require("@elliemae/ds-props-helpers");
 const dspopperjsPropTypes = {
   ...import_ds_props_helpers.globalAttributesPropTypes,
   ...import_ds_props_helpers.xstyledPropTypes,
+  /**
+   * React ref to popperjs referenceElement
+   */
   referenceElement: import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.instanceOf(Element), import_ds_props_helpers.PropTypes.oneOf([null])]).description(
     "popperjs DOM referenceElement"
   ).isRequired,
+  /**
+   * Wheter or not to show the popper content
+   */
   showPopover: import_ds_props_helpers.PropTypes.bool.description("whether or not to show the popper content").isRequired,
+  /**
+   * Callback to close the context menu, used for "on click outside",
+   *  if not provided click outside will not trigger anything
+   */
   closeContextMenu: import_ds_props_helpers.PropTypes.func.description(
     'Callback to close the context menu, used for "on click outside", if not provided click outside will not trigger anything'
   ).defaultValue("() => {}"),
+  /**
+   *  Wheter or not the popper content should appear in a DOM portal or not
+   */
   withoutPortal: import_ds_props_helpers.PropTypes.bool.description("Whether or not the popper content should appear in a DOM portal or not").defaultValue(true),
+  /**
+   *  Wheter or not the popper context menu should print the arrow
+   */
   withoutArrow: import_ds_props_helpers.PropTypes.bool.description("Whether or not the popper context menu should print the arrow").defaultValue(false),
+  /**
+   *  Whether or not the popper context menu should be animated
+   */
   withoutAnimation: import_ds_props_helpers.PropTypes.bool.description("Whether or not the popper context menu should be animated").defaultValue(false),
+  /**
+   *  Popper context menus Animation duration in ms
+   */
   animationDuration: import_ds_props_helpers.PropTypes.number.description("Popper context menus Animation duration in ms").defaultValue(100),
+  /**
+   *  Bounding element to calculate upon, defaults to it is "clippingParents",
+   *   which are the scrolling containers that may cause the element to be partially or fully cut off.
+   */
   boundaryElement: import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.instanceOf(Element), import_ds_props_helpers.PropTypes.oneOf([null])]).description(
     'Bounding element to calculate upon, defaults to "clippingParents",which are the scrolling containers that may cause element to be partially or fully cut off'
   ).defaultValue(void 0),
+  /**
+   *  When using portal, the container in which to append the DOM content, defaults to document body
+   */
   portalDOMContainer: import_ds_props_helpers.PropTypes.oneOfType([import_ds_props_helpers.PropTypes.instanceOf(Element), import_ds_props_helpers.PropTypes.oneOf([null])]).description("When using portal, the container in which to append the DOM content, defaults to document body").defaultValue(void 0),
+  /**
+   *  start placement preferences, as per popperjs placement option
+   */
   startPlacementPreference: import_ds_props_helpers.PropTypes.oneOf([
     "top-start",
     "top",
@@ -61,6 +97,9 @@ const dspopperjsPropTypes = {
     "left",
     "left-start"
   ]).description("start placement preferences, as per popperjs placement option").defaultValue("'top'"),
+  /**
+   *  Array of placement preferences, as per popperjs "flip" placement option
+   */
   placementOrderPreference: import_ds_props_helpers.PropTypes.arrayOf(
     import_ds_props_helpers.PropTypes.oneOf([
       "top-start",
@@ -77,8 +116,18 @@ const dspopperjsPropTypes = {
       "left-start"
     ])
   ).description('Array of placement preferences, as per popperjs "flip" placement option').defaultValue("['top', 'bottom', 'left', 'right']"),
+  /**
+   *  popperjs content z-index
+   */
   zIndex: import_ds_props_helpers.PropTypes.number.description("popperjs content z-index").defaultValue(1),
+  /**
+   *  placement offset array
+   */
   customOffset: import_ds_props_helpers.PropTypes.arrayOf(import_ds_props_helpers.PropTypes.number).description("placement offset array").defaultValue(1),
+  /**
+   *  modifiers array for full-custom popper-js override
+   *  https://popper.js.org/docs/v2/modifiers/
+   */
   modifiers: import_ds_props_helpers.PropTypes.array.description("modifiers array for full-custom popper-js override, https://popper.js.org/docs/v2/modifiers/").defaultValue(1),
   extraPopperStyles: import_ds_props_helpers.PropTypes.object.description("Extra object styles to attach to the popper element").defaultValue({}),
   onClickOutside: import_ds_props_helpers.PropTypes.func.description("Callback triggered when clicking outside the popper").defaultValue(() => null),

package/dist/cjs/react-desc-prop-types.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/react-desc-prop-types.ts", "../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import type React from 'react';\nimport type { WeakValidationMap } from 'react';\nimport { globalAttributesPropTypes, PropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\nimport type {} from '@elliemae/ds-utilities';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport type { usePopper } from 'react-popper';\n\nexport type PopperPlacementsT =\n  | 'top-start'\n  | 'top'\n  | 'top-end'\n  | 'right-start'\n  | 'right'\n  | 'right-end'\n  | 'bottom-end'\n  | 'bottom'\n  | 'bottom-start'\n  | 'left-end'\n  | 'left'\n  | 'left-start';\nexport interface UseDSPopperjsPropsArgT {\n  referenceElement: HTMLElement | null;\n  showPopover: boolean;\n  closeContextMenu?: () => void;\n  onClickOutside?: (e: MouseEvent | TouchEvent) => void;\n  withoutPortal?: boolean;\n  withoutArrow?: boolean;\n  withoutAnimation?: boolean;\n  animationDuration?: number;\n  boundaryElement?: HTMLElement;\n  portalDOMContainer?: HTMLElement;\n  placementOrderPreference?: PopperPlacementsT[];\n  startPlacementPreference?: PopperPlacementsT;\n  modifiers?: Record<string, unknown>[];\n  customOffset?: [number, number];\n  zIndex?: number;\n  extraPopperStyles?: Record<string, unknown>;\n}\nexport interface UseDSPopperjsRT {\n  props: Required<UseDSPopperjsPropsArgT>;\n  popperElement: HTMLDivElement | null;\n  setIsAnimating: React.Dispatch<React.SetStateAction<boolean>>;\n  isAnimating: boolean;\n  setPopperElement: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;\n  arrowElement: HTMLDivElement | null;\n  setArrowElement: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;\n  popoverHelper: ReturnType<typeof usePopper>;\n  globalAttrs: GlobalAttributesT<Element>;\n  xStyledAttrs: XstyledProps;\n}\nexport interface DSDSPopperjsPropsT extends UseDSPopperjsPropsArgT {\n  children: JSX.Element | JSX.Element[];\n}\n\nexport const dspopperjsPropTypes = {\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\n  /**\n   * React ref to popperjs referenceElement\n   */\n  referenceElement: PropTypes.oneOfType([PropTypes.instanceOf(Element), PropTypes.oneOf([null])]).description(\n    'popperjs DOM referenceElement',\n  ).isRequired,\n  /**\n   * Wheter or not to show the popper content\n   */\n  showPopover: PropTypes.bool.description('whether or not to show the popper content').isRequired,\n  /**\n   * Callback to close the context menu, used for \"on click outside\",\n   *  if not provided click outside will not trigger anything\n   */\n  closeContextMenu: PropTypes.func\n    .description(\n      'Callback to close the context menu, used for \"on click outside\",' +\n        ' if not provided click outside will not trigger anything',\n    )\n    .defaultValue('() => {}'),\n  /**\n   *  Wheter or not the popper content should appear in a DOM portal or not\n   */\n  withoutPortal: PropTypes.bool\n    .description('Whether or not the popper content should appear in a DOM portal or not')\n    .defaultValue(true),\n  /**\n   *  Wheter or not the popper context menu should print the arrow\n   */\n  withoutArrow: PropTypes.bool\n    .description('Whether or not the popper context menu should print the arrow')\n    .defaultValue(false),\n  /**\n   *  Whether or not the popper context menu should be animated\n   */\n  withoutAnimation: PropTypes.bool\n    .description('Whether or not the popper context menu should be animated')\n    .defaultValue(false),\n  /**\n   *  Popper context menus Animation duration in ms\n   */\n  animationDuration: PropTypes.number.description('Popper context menus Animation duration in ms').defaultValue(100),\n  /**\n   *  Bounding element to calculate upon, defaults to it is \"clippingParents\",\n   *   which are the scrolling containers that may cause the element to be partially or fully cut off.\n   */\n  boundaryElement: PropTypes.oneOfType([PropTypes.instanceOf(Element), PropTypes.oneOf([null])])\n    .description(\n      'Bounding element to calculate upon, defaults to \"clippingParents\",' +\n        'which are the scrolling containers that may cause element to be partially or fully cut off',\n    )\n    .defaultValue(undefined),\n  /**\n   *  When using portal, the container in which to append the DOM content, defaults to document body\n   */\n  portalDOMContainer: PropTypes.oneOfType([PropTypes.instanceOf(Element), PropTypes.oneOf([null])])\n    .description('When using portal, the container in which to append the DOM content, defaults to document body')\n    .defaultValue(undefined),\n  /**\n   *  start placement preferences, as per popperjs placement option\n   */\n  startPlacementPreference: PropTypes.oneOf([\n    'top-start',\n    'top',\n    'top-end',\n    'right-start',\n    'right',\n    'right-end',\n    'bottom-end',\n    'bottom',\n    'bottom-start',\n    'left-end',\n    'left',\n    'left-start',\n  ])\n    .description('start placement preferences, as per popperjs placement option')\n    .defaultValue(\"'top'\"),\n  /**\n   *  Array of placement preferences, as per popperjs \"flip\" placement option\n   */\n  placementOrderPreference: PropTypes.arrayOf(\n    PropTypes.oneOf([\n      'top-start',\n      'top',\n      'top-end',\n      'right-start',\n      'right',\n      'right-end',\n      'bottom-end',\n      'bottom',\n      'bottom-start',\n      'left-end',\n      'left',\n      'left-start',\n    ]),\n  )\n    .description('Array of placement preferences, as per popperjs \"flip\" placement option')\n    .defaultValue(\"['top', 'bottom', 'left', 'right']\"),\n  /**\n   *  popperjs content z-index\n   */\n  zIndex: PropTypes.number.description('popperjs content z-index').defaultValue(1),\n  /**\n   *  placement offset array\n   */\n  customOffset: PropTypes.arrayOf(PropTypes.number).description('placement offset array').defaultValue(1),\n  /**\n   *  modifiers array for full-custom popper-js override\n   *  https://popper.js.org/docs/v2/modifiers/\n   */\n  modifiers: PropTypes.array\n    .description('modifiers array for full-custom popper-js override, https://popper.js.org/docs/v2/modifiers/')\n    .defaultValue(1),\n  extraPopperStyles: PropTypes.object\n    .description('Extra object styles to attach to the popper element')\n    .defaultValue({}),\n  onClickOutside: PropTypes.func\n    .description('Callback triggered when clicking outside the popper')\n    .defaultValue(() => null),\n  children: PropTypes.node.description('The content of the popper').defaultValue(undefined),\n} as WeakValidationMap<unknown>;\n", "import * as React from 'react';\nexport { React };\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAAuE;AAoDhE,MAAM,sBAAsB;AAAA,EACjC,GAAG;AAAA,EACH,GAAG;AAAA,EAIH,kBAAkB,kCAAU,UAAU,CAAC,kCAAU,WAAW,OAAO,GAAG,kCAAU,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE;AAAA,IAC9F;AAAA,EACF,EAAE;AAAA,EAIF,aAAa,kCAAU,KAAK,YAAY,2CAA2C,EAAE;AAAA,EAKrF,kBAAkB,kCAAU,KACzB;AAAA,IACC;AAAA,EAEF,EACC,aAAa,UAAU;AAAA,EAI1B,eAAe,kCAAU,KACtB,YAAY,wEAAwE,EACpF,aAAa,IAAI;AAAA,EAIpB,cAAc,kCAAU,KACrB,YAAY,+DAA+D,EAC3E,aAAa,KAAK;AAAA,EAIrB,kBAAkB,kCAAU,KACzB,YAAY,2DAA2D,EACvE,aAAa,KAAK;AAAA,EAIrB,mBAAmB,kCAAU,OAAO,YAAY,+CAA+C,EAAE,aAAa,GAAG;AAAA,EAKjH,iBAAiB,kCAAU,UAAU,CAAC,kCAAU,WAAW,OAAO,GAAG,kCAAU,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAC1F;AAAA,IACC;AAAA,EAEF,EACC,aAAa,MAAS;AAAA,EAIzB,oBAAoB,kCAAU,UAAU,CAAC,kCAAU,WAAW,OAAO,GAAG,kCAAU,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAC7F,YAAY,gGAAgG,EAC5G,aAAa,MAAS;AAAA,EAIzB,0BAA0B,kCAAU,MAAM;AAAA,IACxC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC,EACE,YAAY,+DAA+D,EAC3E,aAAa,OAAO;AAAA,EAIvB,0BAA0B,kCAAU;AAAA,IAClC,kCAAU,MAAM;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,EACH,EACG,YAAY,yEAAyE,EACrF,aAAa,oCAAoC;AAAA,EAIpD,QAAQ,kCAAU,OAAO,YAAY,0BAA0B,EAAE,aAAa,CAAC;AAAA,EAI/E,cAAc,kCAAU,QAAQ,kCAAU,MAAM,EAAE,YAAY,wBAAwB,EAAE,aAAa,CAAC;AAAA,EAKtG,WAAW,kCAAU,MAClB,YAAY,8FAA8F,EAC1G,aAAa,CAAC;AAAA,EACjB,mBAAmB,kCAAU,OAC1B,YAAY,qDAAqD,EACjE,aAAa,CAAC,CAAC;AAAA,EAClB,gBAAgB,kCAAU,KACvB,YAAY,qDAAqD,EACjE,aAAa,MAAM,IAAI;AAAA,EAC1B,UAAU,kCAAU,KAAK,YAAY,2BAA2B,EAAE,aAAa,MAAS;AAC1F;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADEvB,8BAAuE;AAoDhE,MAAM,sBAAsB;AAAA,EACjC,GAAG;AAAA,EACH,GAAG;AAAA;AAAA;AAAA;AAAA,EAIH,kBAAkB,kCAAU,UAAU,CAAC,kCAAU,WAAW,OAAO,GAAG,kCAAU,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE;AAAA,IAC9F;AAAA,EACF,EAAE;AAAA;AAAA;AAAA;AAAA,EAIF,aAAa,kCAAU,KAAK,YAAY,2CAA2C,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,EAKrF,kBAAkB,kCAAU,KACzB;AAAA,IACC;AAAA,EAEF,EACC,aAAa,UAAU;AAAA;AAAA;AAAA;AAAA,EAI1B,eAAe,kCAAU,KACtB,YAAY,wEAAwE,EACpF,aAAa,IAAI;AAAA;AAAA;AAAA;AAAA,EAIpB,cAAc,kCAAU,KACrB,YAAY,+DAA+D,EAC3E,aAAa,KAAK;AAAA;AAAA;AAAA;AAAA,EAIrB,kBAAkB,kCAAU,KACzB,YAAY,2DAA2D,EACvE,aAAa,KAAK;AAAA;AAAA;AAAA;AAAA,EAIrB,mBAAmB,kCAAU,OAAO,YAAY,+CAA+C,EAAE,aAAa,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,EAKjH,iBAAiB,kCAAU,UAAU,CAAC,kCAAU,WAAW,OAAO,GAAG,kCAAU,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAC1F;AAAA,IACC;AAAA,EAEF,EACC,aAAa,MAAS;AAAA;AAAA;AAAA;AAAA,EAIzB,oBAAoB,kCAAU,UAAU,CAAC,kCAAU,WAAW,OAAO,GAAG,kCAAU,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAC7F,YAAY,gGAAgG,EAC5G,aAAa,MAAS;AAAA;AAAA;AAAA;AAAA,EAIzB,0BAA0B,kCAAU,MAAM;AAAA,IACxC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC,EACE,YAAY,+DAA+D,EAC3E,aAAa,OAAO;AAAA;AAAA;AAAA;AAAA,EAIvB,0BAA0B,kCAAU;AAAA,IAClC,kCAAU,MAAM;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,EACH,EACG,YAAY,yEAAyE,EACrF,aAAa,oCAAoC;AAAA;AAAA;AAAA;AAAA,EAIpD,QAAQ,kCAAU,OAAO,YAAY,0BAA0B,EAAE,aAAa,CAAC;AAAA;AAAA;AAAA;AAAA,EAI/E,cAAc,kCAAU,QAAQ,kCAAU,MAAM,EAAE,YAAY,wBAAwB,EAAE,aAAa,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,EAKtG,WAAW,kCAAU,MAClB,YAAY,8FAA8F,EAC1G,aAAa,CAAC;AAAA,EACjB,mBAAmB,kCAAU,OAC1B,YAAY,qDAAqD,EACjE,aAAa,CAAC,CAAC;AAAA,EAClB,gBAAgB,kCAAU,KACvB,YAAY,qDAAqD,EACjE,aAAa,MAAM,IAAI;AAAA,EAC1B,UAAU,kCAAU,KAAK,YAAY,2BAA2B,EAAE,aAAa,MAAS;AAC1F;",
   "names": []
 }

package/dist/cjs/styled.js

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));

package/dist/cjs/styled.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../src/styled.tsx", "../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import { styled, kfrm, css, xStyledCommonProps } from '@elliemae/ds-system';\nimport type { SpaceProps, SizingProps, LayoutProps } from '@elliemae/ds-system';\nimport {} from '@xstyled/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')<\n  StyledContentWrapperPropsT & Omit<LayoutProps, 'zIndex'> & SpaceProps & SizingProps\n>`\n  z-index: ${({ theme, zIndex }) => zIndex ?? theme.zIndex.popper};\n  ${xStyledCommonProps}\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;AAAA;ACAA,YAAuB;ADAvB,uBAAsD;AActD,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,kCAA8B,yBAAO,KAAK;AAAA,aAG1C,CAAC,EAAE,OAAO,OAAO,MAAM,UAAU,MAAM,OAAO;AAAA,IACvD;AAAA;AAGG,MAAM,uBAAuB,wBAAO;AAAA;AAAA;AAAA,IAGvC,CAAC,EAAE,aAAa,mBAAmB,iBAAiB,MACpD,CAAC,oBACD;AAAA,mBACe,cAAc,gBAAgB,iBAAiB;AAAA;AAAA;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,uBAAsD;AActD,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,kCAA8B,yBAAO,KAAK;AAAA,aAG1C,CAAC,EAAE,OAAO,OAAO,MAAM,UAAU,MAAM,OAAO;AAAA,IACvD;AAAA;AAGG,MAAM,uBAAuB,wBAAO;AAAA;AAAA;AAAA,IAGvC,CAAC,EAAE,aAAa,mBAAmB,iBAAiB,MACpD,CAAC,oBACD;AAAA,mBACe,cAAc,gBAAgB,iBAAiB;AAAA;AAAA;",
   "names": []
 }

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

@@ -18,6 +18,10 @@ var __copyProps = (to, from, except, desc) => {
   return to;
 };
 var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
   isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
   mod
 ));

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

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../src/utils/hooks/useOnClickOutside.tsx", "../../../../../../scripts/build/transpile/react-shim.js"],
   "sourcesContent": ["import { useEffect } from 'react';\n\ntype DefaultCbt = (e: MouseEvent | TouchEvent) => void;\nexport function useOnClickOutside<T extends Node, CbT extends DefaultCbt>(ref: T, cb: CbT): void {\n  useEffect(() => {\n    const listener = (event: MouseEvent | TouchEvent) => {\n      // Do nothing if clicking ref's element or descendent elements\n      if (!ref || ref?.contains?.(event.target as Node)) {\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;AAAA;ACAA,YAAuB;ADAvB,mBAA0B;AAGnB,SAAS,kBAA0D,KAAQ,IAAe;AAC/F,8BAAU,MAAM;AACd,UAAM,WAAW,CAAC,UAAmC;AAEnD,UAAI,CAAC,OAAO,KAAK,WAAW,MAAM,MAAc,GAAG;AACjD;AAAA,MACF;AACA,SAAG,KAAK;AAAA,IACV;AACA,aAAS,iBAAiB,aAAa,QAAQ;AAC/C,aAAS,iBAAiB,cAAc,QAAQ;AAChD,WAAO,MAAM;AACX,eAAS,oBAAoB,aAAa,QAAQ;AAClD,eAAS,oBAAoB,cAAc,QAAQ;AAAA,IACrD;AAAA,EACF,GAAG,CAAC,KAAK,EAAE,CAAC;AACd;",
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;ACAA,YAAuB;ADAvB,mBAA0B;AAGnB,SAAS,kBAA0D,KAAQ,IAAe;AAC/F,8BAAU,MAAM;AACd,UAAM,WAAW,CAAC,UAAmC;AAEnD,UAAI,CAAC,OAAO,KAAK,WAAW,MAAM,MAAc,GAAG;AACjD;AAAA,MACF;AACA,SAAG,KAAK;AAAA,IACV;AACA,aAAS,iBAAiB,aAAa,QAAQ;AAC/C,aAAS,iBAAiB,cAAc,QAAQ;AAChD,WAAO,MAAM;AACX,eAAS,oBAAoB,aAAa,QAAQ;AAClD,eAAS,oBAAoB,cAAc,QAAQ;AAAA,IACrD;AAAA,EACF,GAAG,CAAC,KAAK,EAAE,CAAC;AACd;",
   "names": []
 }

package/dist/esm/PopoverArrow.js.map

@@ -2,6 +2,6 @@
   "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 '@elliemae/ds-system';\ninterface PopoverArrowT {\n  placement: string;\n  style: React.CSSProperties;\n  arrowElementRef: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;\n}\nconst arrowWidth = 18;\nconst arrowHeight = 18;\n\nconst StyledArrow = styled.div<{ 'data-placement': string }>`\n  position: absolute;\n  width: ${arrowWidth}px;\n  height: ${arrowHeight}px;\n  pointer-events: none;\n  background-color: transparent;\n  & .stroke {\n    fill: neutral-500;\n    fill-opacity: 0.4;\n  }\n  & .fill {\n    fill: 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    aria-hidden=\"true\"\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,YAAY,WAAW;ACgEnB,SACE,KADF;AA/DJ,SAAS,cAAc;AAMvB,MAAM,aAAa;AACnB,MAAM,cAAc;AAEpB,MAAM,cAAc,OAAO;AAAA;AAAA,WAEhB;AAAA,YACC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAeG;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,KAAK,KAAK,MAAM,kBAAkB,WAAW,QAAQ,IACpF,IAAI,aAAa,SACjB;AAAA,gBACQ,CAAC,UACb,MAAM,kBAAkB,WAAW,MAAM,KAAK,MAAM,kBAAkB,WAAW,OAAO,IACpF,IAAI,cAAc,SAClB;AAAA;AAGD,MAAM,eAAe,CAAC,EAAE,WAAW,OAAO,gBAAgB,MAC/D;AAAA,EAAC;AAAA;AAAA,IAEC,kBAAgB;AAAA,IAChB;AAAA,IACA,KAAK;AAAA,IACL,eAAY;AAAA,IACZ,eAAY;AAAA,IAEZ,+BAAC,SAAI,SAAQ,aACX;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,GAAE;AAAA;AAAA,MAEJ;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,GAAE;AAAA;AAAA,MACJ;AAAA,OACF;AAAA;AAAA,EAjBI;AAkBN;",
+  "mappings": "AAAA,YAAY,WAAW;ACgEnB,SACE,KADF;AA/DJ,SAAS,cAAc;AAMvB,MAAM,aAAa;AACnB,MAAM,cAAc;AAEpB,MAAM,cAAc,OAAO;AAAA;AAAA,WAEhB;AAAA,YACC;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAeG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAMF;AAAA;AAAA;AAAA,YAGD;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAME;AAAA;AAAA,iBAEG,CAAC,UACd,MAAM,gBAAgB,EAAE,WAAW,KAAK,KAAK,MAAM,gBAAgB,EAAE,WAAW,QAAQ,IACpF,IAAI,aAAa,SACjB;AAAA,gBACQ,CAAC,UACb,MAAM,gBAAgB,EAAE,WAAW,MAAM,KAAK,MAAM,gBAAgB,EAAE,WAAW,OAAO,IACpF,IAAI,cAAc,SAClB;AAAA;AAGD,MAAM,eAAe,CAAC,EAAE,WAAW,OAAO,gBAAgB,MAC/D;AAAA,EAAC;AAAA;AAAA,IAEC,kBAAgB;AAAA,IAChB;AAAA,IACA,KAAK;AAAA,IACL,eAAY;AAAA,IACZ,eAAY;AAAA,IAEZ,+BAAC,SAAI,SAAQ,aACX;AAAA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,GAAE;AAAA;AAAA,MAEJ;AAAA,MACA;AAAA,QAAC;AAAA;AAAA,UACC,WAAU;AAAA,UACV,GAAE;AAAA;AAAA,MACJ;AAAA,OACF;AAAA;AAAA,EAjBI;AAkBN;",
   "names": []
 }

package/dist/esm/PopoverContent.js

@@ -1,8 +1,8 @@
 import * as React from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { useCallback, useMemo } from "react";
-import { PopoverArrow } from "./PopoverArrow";
-import { StyledPopoverContentWrapper, StyledAnimatedPopper } from "./styled";
+import { PopoverArrow } from "./PopoverArrow.js";
+import { StyledPopoverContentWrapper, StyledAnimatedPopper } from "./styled.js";
 const PopoverContent = ({
   setPopperElement,
   popperStyles,

package/dist/esm/PopoverContent.js.map

@@ -1,7 +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 type {} from '@elliemae/ds-utilities';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport { PopoverArrow } from './PopoverArrow';\nimport { StyledPopoverContentWrapper, StyledAnimatedPopper } from './styled';\n\nexport interface PopoverContentPropsT {\n  setPopperElement: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;\n  popperStyles: React.CSSProperties;\n  arrowStyle: React.CSSProperties;\n  popperAttributes: Record<string, string> | undefined;\n  children: JSX.Element | JSX.Element[];\n  setArrowElement: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;\n  withoutArrow: boolean;\n  withoutAnimation: boolean;\n  animationDuration: number;\n  zIndex: number;\n  showPopover: boolean;\n  setIsAnimating: React.Dispatch<React.SetStateAction<boolean>>;\n  globalAttrs: GlobalAttributesT;\n  xStyledAttrs: XstyledProps;\n}\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  globalAttrs,\n  xStyledAttrs,\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\n      ref={setPopperElement}\n      style={popperStyles}\n      {...popperAttributes}\n      {...globalAttrs}\n      {...xStyledAttrs}\n      zIndex={zIndex}\n    >\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,YAAY,WAAW;ACkDb,mBACE,KADF;AAlDV,SAAgB,aAAa,eAAe;AAG5C,SAAS,oBAAoB;AAC7B,SAAS,6BAA6B,4BAA4B;AAmB3D,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,EACA;AAAA,EACA;AACF,MAAyC;AACvC,QAAM,uBAAuB,YAAY,MAAM;AAC7C,QAAI,CAAC,eAAe,CAAC,kBAAkB;AACrC,qBAAe,KAAK;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,aAAa,kBAAkB,cAAc,CAAC;AAElD,QAAM,gBAAgB;AAAA,IACpB,MACE,iCACG;AAAA;AAAA,MACA,iBAAiB,QAChB,iCACE;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,iBAAiB;AAAA,YACjB,OAAO;AAAA,YACP,WAAW,mBAAmB,iBAAiB,2BAA2B;AAAA;AAAA,QAC5E;AAAA,QACA,oBAAC,SAAI,KAAK,iBAAiB,OAAO,YAAY;AAAA,SAChD,IACE;AAAA,OACN;AAAA,IAEF,CAAC,UAAU,cAAc,YAAY,kBAAkB,eAAe;AAAA,EACxE;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,OAAO;AAAA,MACN,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACJ;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,UACA,gBAAgB;AAAA,UAEf;AAAA;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;",
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useCallback, useMemo } from 'react';\nimport type {} from '@elliemae/ds-utilities';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport { PopoverArrow } from './PopoverArrow.js';\nimport { StyledPopoverContentWrapper, StyledAnimatedPopper } from './styled.js';\n\nexport interface PopoverContentPropsT {\n  setPopperElement: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;\n  popperStyles: React.CSSProperties;\n  arrowStyle: React.CSSProperties;\n  popperAttributes: Record<string, string> | undefined;\n  children: JSX.Element | JSX.Element[];\n  setArrowElement: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;\n  withoutArrow: boolean;\n  withoutAnimation: boolean;\n  animationDuration: number;\n  zIndex: number;\n  showPopover: boolean;\n  setIsAnimating: React.Dispatch<React.SetStateAction<boolean>>;\n  globalAttrs: GlobalAttributesT;\n  xStyledAttrs: XstyledProps;\n}\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  globalAttrs,\n  xStyledAttrs,\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\n      ref={setPopperElement}\n      style={popperStyles}\n      {...popperAttributes}\n      {...globalAttrs}\n      {...xStyledAttrs}\n      zIndex={zIndex}\n    >\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,YAAY,WAAW;ACkDb,mBACE,KADF;AAlDV,SAAgB,aAAa,eAAe;AAG5C,SAAS,oBAAoB;AAC7B,SAAS,6BAA6B,4BAA4B;AAmB3D,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,EACA;AAAA,EACA;AACF,MAAyC;AACvC,QAAM,uBAAuB,YAAY,MAAM;AAC7C,QAAI,CAAC,eAAe,CAAC,kBAAkB;AACrC,qBAAe,KAAK;AAAA,IACtB;AAAA,EACF,GAAG,CAAC,aAAa,kBAAkB,cAAc,CAAC;AAElD,QAAM,gBAAgB;AAAA,IACpB,MACE,iCACG;AAAA;AAAA,MACA,iBAAiB,QAChB,iCACE;AAAA;AAAA,UAAC;AAAA;AAAA,YACC,iBAAiB;AAAA,YACjB,OAAO;AAAA,YACP,WAAW,mBAAmB,iBAAiB,uBAAuB,IAAI;AAAA;AAAA,QAC5E;AAAA,QACA,oBAAC,SAAI,KAAK,iBAAiB,OAAO,YAAY;AAAA,SAChD,IACE;AAAA,OACN;AAAA,IAEF,CAAC,UAAU,cAAc,YAAY,kBAAkB,eAAe;AAAA,EACxE;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,KAAK;AAAA,MACL,OAAO;AAAA,MACN,GAAG;AAAA,MACH,GAAG;AAAA,MACH,GAAG;AAAA,MACJ;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA;AAAA,UACA;AAAA,UACA,gBAAgB;AAAA,UAEf;AAAA;AAAA,MACH;AAAA;AAAA,EACF;AAEJ;",
   "names": []
 }

package/dist/esm/config/useConfigDSPopperjs.js

@@ -2,8 +2,8 @@ import * as React from "react";
 import { useMemo, useState, useEffect } from "react";
 import { usePopper } from "react-popper";
 import { useGetGlobalAttributes, useGetXstyledProps } from "@elliemae/ds-props-helpers";
-import { useConfiguredMergedProps } from "./useConfiguredMergedProps";
-import { useOnClickOutside } from "../utils/hooks/useOnClickOutside";
+import { useConfiguredMergedProps } from "./useConfiguredMergedProps.js";
+import { useOnClickOutside } from "../utils/hooks/useOnClickOutside.js";
 const useConfigDSPopperjs = (appProps) => {
   const [popperElement, setPopperElement] = useState(null);
   const [arrowElement, setArrowElement] = useState(null);

package/dist/esm/config/useConfigDSPopperjs.js.map

@@ -1,7 +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 { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { useConfiguredMergedProps } from './useConfiguredMergedProps';\nimport type { UseDSPopperjsPropsArgT, UseDSPopperjsRT } from '../react-desc-prop-types';\nimport { useOnClickOutside } from '../utils/hooks/useOnClickOutside';\n\nexport const useConfigDSPopperjs = (appProps: UseDSPopperjsPropsArgT): UseDSPopperjsRT => {\n  const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n  const [arrowElement, setArrowElement] = useState<HTMLDivElement | null>(null);\n  const [isAnimating, setIsAnimating] = useState(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 as Node, (e) => {\n    if (!referenceElement?.contains?.(e?.target as Node)) {\n      onClickOutside(e);\n      closeContextMenu();\n    }\n  });\n\n  const globalAttrs = useGetGlobalAttributes(props);\n  const xStyledAttrs = useGetXstyledProps(props);\n\n  return useMemo(\n    () => ({\n      props,\n      popperElement,\n      setPopperElement,\n      arrowElement,\n      setArrowElement,\n      popoverHelper,\n      isAnimating,\n      setIsAnimating,\n      globalAttrs,\n      xStyledAttrs,\n    }),\n    [props, popperElement, arrowElement, popoverHelper, isAnimating, globalAttrs, xStyledAttrs],\n  );\n};\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo, useState, useEffect } from 'react';\nimport { usePopper } from 'react-popper';\nimport { useGetGlobalAttributes, useGetXstyledProps } from '@elliemae/ds-props-helpers';\nimport { useConfiguredMergedProps } from './useConfiguredMergedProps.js';\nimport type { UseDSPopperjsPropsArgT, UseDSPopperjsRT } from '../react-desc-prop-types.js';\nimport { useOnClickOutside } from '../utils/hooks/useOnClickOutside.js';\n\nexport const useConfigDSPopperjs = (appProps: UseDSPopperjsPropsArgT): UseDSPopperjsRT => {\n  const [popperElement, setPopperElement] = useState<HTMLDivElement | null>(null);\n  const [arrowElement, setArrowElement] = useState<HTMLDivElement | null>(null);\n  const [isAnimating, setIsAnimating] = useState(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 as Node, (e) => {\n    if (!referenceElement?.contains?.(e?.target as Node)) {\n      onClickOutside(e);\n      closeContextMenu();\n    }\n  });\n\n  const globalAttrs = useGetGlobalAttributes(props);\n  const xStyledAttrs = useGetXstyledProps(props);\n\n  return useMemo(\n    () => ({\n      props,\n      popperElement,\n      setPopperElement,\n      arrowElement,\n      setArrowElement,\n      popoverHelper,\n      isAnimating,\n      setIsAnimating,\n      globalAttrs,\n      xStyledAttrs,\n    }),\n    [props, popperElement, arrowElement, popoverHelper, isAnimating, globalAttrs, xStyledAttrs],\n  );\n};\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,SAAS,UAAU,iBAAiB;AAC7C,SAAS,iBAAiB;AAC1B,SAAS,wBAAwB,0BAA0B;AAC3D,SAAS,gCAAgC;AAEzC,SAAS,yBAAyB;AAE3B,MAAM,sBAAsB,CAAC,aAAsD;AACxF,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAgC,IAAI;AAC9E,QAAM,CAAC,cAAc,eAAe,IAAI,SAAgC,IAAI;AAC5E,QAAM,CAAC,aAAa,cAAc,IAAI,SAAS,KAAK;AAEpD,QAAM,QAAQ,yBAAyB,EAAE,OAAO,UAAU,aAAa,CAAC;AACxE,QAAM,EAAE,kBAAkB,kBAAkB,gBAAgB,WAAW,yBAAyB,IAAI;AACpG,QAAM,kBAAkB;AAAA,IACtB,OAAO,EAAE,WAAW,0BAA0B,UAAU;AAAA,IACxD,CAAC,WAAW,wBAAwB;AAAA,EACtC;AAEA,QAAM,gBAAgB,UAAU,kBAAkB,eAAe,eAAe;AAEhF,QAAM,EAAE,aAAa,iBAAiB,IAAI;AAE1C,YAAU,MAAM;AACd,QAAI,eAAe,CAAC,kBAAkB;AACpC,qBAAe,IAAI;AAAA,IACrB;AAAA,EACF,GAAG,CAAC,aAAa,gBAAgB,CAAC;AAElC,oBAAkB,eAAuB,CAAC,MAAM;AAC9C,QAAI,CAAC,kBAAkB,WAAW,GAAG,MAAc,GAAG;AACpD,qBAAe,CAAC;AAChB,uBAAiB;AAAA,IACnB;AAAA,EACF,CAAC;AAED,QAAM,cAAc,uBAAuB,KAAK;AAChD,QAAM,eAAe,mBAAmB,KAAK;AAE7C,SAAO;AAAA,IACL,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,OAAO,eAAe,cAAc,eAAe,aAAa,aAAa,YAAY;AAAA,EAC5F;AACF;",
   "names": []
 }

package/dist/esm/config/useConfiguredDefaultModifiers.js.map

@@ -1,7 +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';\nimport type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types';\n\ninterface UseConfiguredDefaultModifiersT {\n  props: UseDSPopperjsPropsArgT;\n  arrowElement: HTMLDivElement | null;\n}\n\nexport const useConfiguredDefaultModifiers = ({ props, arrowElement }: UseConfiguredDefaultModifiersT) => {\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"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo } from 'react';\nimport type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types.js';\n\ninterface UseConfiguredDefaultModifiersT {\n  props: UseDSPopperjsPropsArgT;\n  arrowElement: HTMLDivElement | null;\n}\n\nexport const useConfiguredDefaultModifiers = ({ props, arrowElement }: UseConfiguredDefaultModifiersT) => {\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,YAAY,WAAW;ACAvB,SAAS,eAAe;AAQjB,MAAM,gCAAgC,CAAC,EAAE,OAAO,aAAa,MAAsC;AAExG,QAAM;AAAA,IACJ,iBAAiB;AAAA,IACjB,cAAc,0BAA0B;AAAA,IACxC,0BAA0B,mCAAmC,CAAC,OAAO,UAAU,QAAQ,OAAO;AAAA,IAC9F,cAAc,mBAAmB;AAAA,EACnC,IAAI;AAEJ,QAAM,mBAAmB,QAAQ,MAAM;AACrC,UAAM,MAAM,CAAC;AACb,QAAI,KAAK,EAAE,MAAM,QAAQ,SAAS,KAAK,CAAC;AACxC,QAAI,KAAK;AAAA,MACP,MAAM;AAAA,MACN,SAAS;AAAA,QACP,oBAAoB;AAAA,MACtB;AAAA,IACF,CAAC;AAED,QAAI,CAAC,2BAA2B,kBAAkB;AAChD,YAAM,gBAAgB,oBAAoB,CAAC,GAAG,EAAE;AAChD,UAAI,KAAK;AAAA,QACP,MAAM;AAAA,QACN,SAAS;AAAA,QACT,SAAS;AAAA,UACP,QAAQ;AAAA,QACV;AAAA,MACF,CAAC;AAAA,IACH;AAEA,QAAI,CAAC;AACH,UAAI,KAAK;AAAA,QACP,MAAM;AAAA,QACN,SAAS;AAAA,UACP,SAAS;AAAA,UACT,SAAS;AAAA,QACX;AAAA,MACF,CAAC;AAGH,QAAI;AACF,UAAI,KAAK;AAAA,QACP,MAAM;AAAA,QACN,SAAS;AAAA,UACP,UAAU;AAAA,QACZ;AAAA,MACF,CAAC;AACH,WAAO;AAAA,EACT,GAAG;AAAA,IACD;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,EAAE,WAAW,uBAAuB,iBAAiB,IAAI;AAE/D,SAAO;AAAA,IACL,OAAO;AAAA,MACL,WAAW;AAAA,IACb;AAAA,IACA,CAAC,oBAAoB;AAAA,EACvB;AACF;",
   "names": []
 }

package/dist/esm/config/useConfiguredDefaultProps.js

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { useMemo } from "react";
-import { useConfiguredDefaultModifiers } from "./useConfiguredDefaultModifiers";
+import { useConfiguredDefaultModifiers } from "./useConfiguredDefaultModifiers.js";
 const noop = () => {
 };
 const emptyObj = {};

package/dist/esm/config/useConfiguredDefaultProps.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useConfiguredDefaultProps.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo } from 'react';\nimport { useConfiguredDefaultModifiers } from './useConfiguredDefaultModifiers';\nimport type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types';\n\nconst noop = () => {};\n\nconst emptyObj = {};\n\ninterface UseConfiguredDefaultPropsT {\n  props: UseDSPopperjsPropsArgT;\n  arrowElement: HTMLDivElement | null;\n}\n\nexport const useConfiguredDefaultProps = ({ props, arrowElement }: Required<UseConfiguredDefaultPropsT>) => {\n  // don't move this out of the hook or `document.body` will explode\n  const staticDefaultProps: UseDSPopperjsPropsArgT = useMemo(\n    () => ({\n      referenceElement: null,\n      showPopover: false,\n      closeContextMenu: noop,\n      onClickOutside: noop,\n      withoutPortal: false,\n      withoutArrow: false,\n      withoutAnimation: false,\n      animationDuration: 100,\n      portalDOMContainer: document.body,\n      startPlacementPreference: 'top',\n      placementOrderPreference: ['top', 'bottom', 'left', 'right'],\n      extraPopperStyles: emptyObj,\n    }),\n    [],\n  );\n  const { modifiers: configuredModifiers } = useConfiguredDefaultModifiers({\n    props,\n    arrowElement,\n  });\n\n  const defaultProps = useMemo(\n    () => ({ ...staticDefaultProps, modifiers: configuredModifiers }),\n    [configuredModifiers, staticDefaultProps],\n  );\n\n  return defaultProps;\n};\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemo } from 'react';\nimport { useConfiguredDefaultModifiers } from './useConfiguredDefaultModifiers.js';\nimport type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types.js';\n\nconst noop = () => {};\n\nconst emptyObj = {};\n\ninterface UseConfiguredDefaultPropsT {\n  props: UseDSPopperjsPropsArgT;\n  arrowElement: HTMLDivElement | null;\n}\n\nexport const useConfiguredDefaultProps = ({ props, arrowElement }: Required<UseConfiguredDefaultPropsT>) => {\n  // don't move this out of the hook or `document.body` will explode\n  const staticDefaultProps: UseDSPopperjsPropsArgT = useMemo(\n    () => ({\n      referenceElement: null,\n      showPopover: false,\n      closeContextMenu: noop,\n      onClickOutside: noop,\n      withoutPortal: false,\n      withoutArrow: false,\n      withoutAnimation: false,\n      animationDuration: 100,\n      portalDOMContainer: document.body,\n      startPlacementPreference: 'top',\n      placementOrderPreference: ['top', 'bottom', 'left', 'right'],\n      extraPopperStyles: emptyObj,\n    }),\n    [],\n  );\n  const { modifiers: configuredModifiers } = useConfiguredDefaultModifiers({\n    props,\n    arrowElement,\n  });\n\n  const defaultProps = useMemo(\n    () => ({ ...staticDefaultProps, modifiers: configuredModifiers }),\n    [configuredModifiers, staticDefaultProps],\n  );\n\n  return defaultProps;\n};\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,eAAe;AACxB,SAAS,qCAAqC;AAG9C,MAAM,OAAO,MAAM;AAAC;AAEpB,MAAM,WAAW,CAAC;AAOX,MAAM,4BAA4B,CAAC,EAAE,OAAO,aAAa,MAA4C;AAE1G,QAAM,qBAA6C;AAAA,IACjD,OAAO;AAAA,MACL,kBAAkB;AAAA,MAClB,aAAa;AAAA,MACb,kBAAkB;AAAA,MAClB,gBAAgB;AAAA,MAChB,eAAe;AAAA,MACf,cAAc;AAAA,MACd,kBAAkB;AAAA,MAClB,mBAAmB;AAAA,MACnB,oBAAoB,SAAS;AAAA,MAC7B,0BAA0B;AAAA,MAC1B,0BAA0B,CAAC,OAAO,UAAU,QAAQ,OAAO;AAAA,MAC3D,mBAAmB;AAAA,IACrB;AAAA,IACA,CAAC;AAAA,EACH;AACA,QAAM,EAAE,WAAW,oBAAoB,IAAI,8BAA8B;AAAA,IACvE;AAAA,IACA;AAAA,EACF,CAAC;AAED,QAAM,eAAe;AAAA,IACnB,OAAO,EAAE,GAAG,oBAAoB,WAAW,oBAAoB;AAAA,IAC/D,CAAC,qBAAqB,kBAAkB;AAAA,EAC1C;AAEA,SAAO;AACT;",
   "names": []
 }

package/dist/esm/config/useConfiguredMergedProps.js

@@ -1,6 +1,6 @@
 import * as React from "react";
 import { useMemoMergePropsWithDefault } from "@elliemae/ds-props-helpers";
-import { useConfiguredDefaultProps } from "./useConfiguredDefaultProps";
+import { useConfiguredDefaultProps } from "./useConfiguredDefaultProps.js";
 const useConfiguredMergedProps = ({ props, arrowElement }) => {
   const defaultProps = useConfiguredDefaultProps({ props, arrowElement });
   return useMemoMergePropsWithDefault(props, defaultProps);

package/dist/esm/config/useConfiguredMergedProps.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../../src/config/useConfiguredMergedProps.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { useConfiguredDefaultProps } from './useConfiguredDefaultProps';\nimport type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types';\n\ninterface UseConfiguredMergedPropsT {\n  props: UseDSPopperjsPropsArgT;\n  arrowElement: HTMLDivElement | null;\n}\n\nexport const useConfiguredMergedProps = ({ props, arrowElement }: UseConfiguredMergedPropsT) => {\n  const defaultProps = useConfiguredDefaultProps({ props, arrowElement });\n\n  return useMemoMergePropsWithDefault<Required<UseDSPopperjsPropsArgT>>(props, defaultProps);\n};\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import { useMemoMergePropsWithDefault } from '@elliemae/ds-props-helpers';\nimport { useConfiguredDefaultProps } from './useConfiguredDefaultProps.js';\nimport type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types.js';\n\ninterface UseConfiguredMergedPropsT {\n  props: UseDSPopperjsPropsArgT;\n  arrowElement: HTMLDivElement | null;\n}\n\nexport const useConfiguredMergedProps = ({ props, arrowElement }: UseConfiguredMergedPropsT) => {\n  const defaultProps = useConfiguredDefaultProps({ props, arrowElement });\n\n  return useMemoMergePropsWithDefault<Required<UseDSPopperjsPropsArgT>>(props, defaultProps);\n};\n"],
   "mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,oCAAoC;AAC7C,SAAS,iCAAiC;AAQnC,MAAM,2BAA2B,CAAC,EAAE,OAAO,aAAa,MAAiC;AAC9F,QAAM,eAAe,0BAA0B,EAAE,OAAO,aAAa,CAAC;AAEtE,SAAO,6BAA+D,OAAO,YAAY;AAC3F;",
   "names": []
 }

package/dist/esm/index.js

@@ -3,9 +3,9 @@ import { Fragment, jsx } from "react/jsx-runtime";
 import { useMemo } from "react";
 import { createPortal } from "react-dom";
 import { describe } from "@elliemae/ds-props-helpers";
-import { PopoverContent } from "./PopoverContent";
-import { useConfigDSPopperjs } from "./config/useConfigDSPopperjs";
-import { dspopperjsPropTypes } from "./react-desc-prop-types";
+import { PopoverContent } from "./PopoverContent.js";
+import { useConfigDSPopperjs } from "./config/useConfigDSPopperjs.js";
+import { dspopperjsPropTypes } from "./react-desc-prop-types.js";
 const DSPopperJS = (props) => {
   const {
     props: {

package/dist/esm/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
-  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useMemo } from 'react';\nimport { createPortal } from 'react-dom';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { PopoverContent } from './PopoverContent';\nimport { useConfigDSPopperjs } from './config/useConfigDSPopperjs';\nimport type { DSDSPopperjsPropsT } from './react-desc-prop-types';\nimport { dspopperjsPropTypes } from './react-desc-prop-types';\n\nconst DSPopperJS: React.ComponentType<DSDSPopperjsPropsT> = (props) => {\n  const {\n    props: {\n      showPopover,\n      withoutAnimation,\n      animationDuration,\n      withoutPortal,\n      withoutArrow,\n      portalDOMContainer,\n      zIndex,\n      extraPopperStyles,\n    },\n    globalAttrs,\n    xStyledAttrs,\n    setPopperElement,\n    setArrowElement,\n    setIsAnimating,\n    popoverHelper,\n    isAnimating,\n  } = useConfigDSPopperjs(props);\n  const { children } = props;\n  const { styles, attributes } = popoverHelper;\n  const contentJSX = useMemo(\n    () => (\n      <PopoverContent\n        setPopperElement={setPopperElement}\n        popperStyles={{ ...styles.popper, ...extraPopperStyles }}\n        popperAttributes={attributes.popper}\n        setArrowElement={setArrowElement}\n        arrowStyle={styles.arrow}\n        withoutArrow={withoutArrow}\n        withoutAnimation={withoutAnimation}\n        animationDuration={animationDuration}\n        zIndex={zIndex}\n        showPopover={showPopover}\n        setIsAnimating={setIsAnimating}\n        globalAttrs={globalAttrs}\n        xStyledAttrs={xStyledAttrs}\n      >\n        {children}\n      </PopoverContent>\n    ),\n    [\n      attributes.popper,\n      children,\n      setIsAnimating,\n      showPopover,\n      extraPopperStyles,\n      setArrowElement,\n      setPopperElement,\n      styles.arrow,\n      styles.popper,\n      withoutArrow,\n      withoutAnimation,\n      animationDuration,\n      zIndex,\n      globalAttrs,\n      xStyledAttrs,\n    ],\n  );\n  if (showPopover || isAnimating) {\n    if (withoutPortal === true) return contentJSX;\n    if (withoutPortal === false) return <>{createPortal(contentJSX, portalDOMContainer)}</>;\n  }\n  return null;\n};\n\nDSPopperJS.propTypes = dspopperjsPropTypes;\nDSPopperJS.displayName = 'DSPopperJS';\nconst DSPopperJSWithSchema = describe(DSPopperJS).description('A dimsum custom styling wrapper on top of popperjs');\nDSPopperJSWithSchema.propTypes = dspopperjsPropTypes;\n\nexport { DSPopperJS, DSPopperJSWithSchema };\nexport default DSPopperJS;\n"],
+  "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import React, { useMemo } from 'react';\nimport { createPortal } from 'react-dom';\nimport { describe } from '@elliemae/ds-props-helpers';\nimport { PopoverContent } from './PopoverContent.js';\nimport { useConfigDSPopperjs } from './config/useConfigDSPopperjs.js';\nimport type { DSDSPopperjsPropsT } from './react-desc-prop-types.js';\nimport { dspopperjsPropTypes } from './react-desc-prop-types.js';\n\nconst DSPopperJS: React.ComponentType<DSDSPopperjsPropsT> = (props) => {\n  const {\n    props: {\n      showPopover,\n      withoutAnimation,\n      animationDuration,\n      withoutPortal,\n      withoutArrow,\n      portalDOMContainer,\n      zIndex,\n      extraPopperStyles,\n    },\n    globalAttrs,\n    xStyledAttrs,\n    setPopperElement,\n    setArrowElement,\n    setIsAnimating,\n    popoverHelper,\n    isAnimating,\n  } = useConfigDSPopperjs(props);\n  const { children } = props;\n  const { styles, attributes } = popoverHelper;\n  const contentJSX = useMemo(\n    () => (\n      <PopoverContent\n        setPopperElement={setPopperElement}\n        popperStyles={{ ...styles.popper, ...extraPopperStyles }}\n        popperAttributes={attributes.popper}\n        setArrowElement={setArrowElement}\n        arrowStyle={styles.arrow}\n        withoutArrow={withoutArrow}\n        withoutAnimation={withoutAnimation}\n        animationDuration={animationDuration}\n        zIndex={zIndex}\n        showPopover={showPopover}\n        setIsAnimating={setIsAnimating}\n        globalAttrs={globalAttrs}\n        xStyledAttrs={xStyledAttrs}\n      >\n        {children}\n      </PopoverContent>\n    ),\n    [\n      attributes.popper,\n      children,\n      setIsAnimating,\n      showPopover,\n      extraPopperStyles,\n      setArrowElement,\n      setPopperElement,\n      styles.arrow,\n      styles.popper,\n      withoutArrow,\n      withoutAnimation,\n      animationDuration,\n      zIndex,\n      globalAttrs,\n      xStyledAttrs,\n    ],\n  );\n  if (showPopover || isAnimating) {\n    if (withoutPortal === true) return contentJSX;\n    if (withoutPortal === false) return <>{createPortal(contentJSX, portalDOMContainer)}</>;\n  }\n  return null;\n};\n\nDSPopperJS.propTypes = dspopperjsPropTypes;\nDSPopperJS.displayName = 'DSPopperJS';\nconst DSPopperJSWithSchema = describe(DSPopperJS).description('A dimsum custom styling wrapper on top of popperjs');\nDSPopperJSWithSchema.propTypes = dspopperjsPropTypes;\n\nexport { DSPopperJS, DSPopperJSWithSchema };\nexport default DSPopperJS;\n"],
   "mappings": "AAAA,YAAY,WAAW;ACgCjB,SAsCkC,UAtClC;AAhCN,SAAgB,eAAe;AAC/B,SAAS,oBAAoB;AAC7B,SAAS,gBAAgB;AACzB,SAAS,sBAAsB;AAC/B,SAAS,2BAA2B;AAEpC,SAAS,2BAA2B;AAEpC,MAAM,aAAsD,CAAC,UAAU;AACrE,QAAM;AAAA,IACJ,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,IAAI,oBAAoB,KAAK;AAC7B,QAAM,EAAE,SAAS,IAAI;AACrB,QAAM,EAAE,QAAQ,WAAW,IAAI;AAC/B,QAAM,aAAa;AAAA,IACjB,MACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,cAAc,EAAE,GAAG,OAAO,QAAQ,GAAG,kBAAkB;AAAA,QACvD,kBAAkB,WAAW;AAAA,QAC7B;AAAA,QACA,YAAY,OAAO;AAAA,QACnB;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QAEC;AAAA;AAAA,IACH;AAAA,IAEF;AAAA,MACE,WAAW;AAAA,MACX;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,OAAO;AAAA,MACP,OAAO;AAAA,MACP;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,EACF;AACA,MAAI,eAAe,aAAa;AAC9B,QAAI,kBAAkB;AAAM,aAAO;AACnC,QAAI,kBAAkB;AAAO,aAAO,gCAAG,uBAAa,YAAY,kBAAkB,GAAE;AAAA,EACtF;AACA,SAAO;AACT;AAEA,WAAW,YAAY;AACvB,WAAW,cAAc;AACzB,MAAM,uBAAuB,SAAS,UAAU,EAAE,YAAY,oDAAoD;AAClH,qBAAqB,YAAY;AAGjC,IAAO,cAAQ;",
   "names": []
 }

package/dist/esm/package.json

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

package/dist/esm/react-desc-prop-types.js

@@ -3,21 +3,53 @@ import { globalAttributesPropTypes, PropTypes, xstyledPropTypes } from "@elliema
 const dspopperjsPropTypes = {
   ...globalAttributesPropTypes,
   ...xstyledPropTypes,
+  /**
+   * React ref to popperjs referenceElement
+   */
   referenceElement: PropTypes.oneOfType([PropTypes.instanceOf(Element), PropTypes.oneOf([null])]).description(
     "popperjs DOM referenceElement"
   ).isRequired,
+  /**
+   * Wheter or not to show the popper content
+   */
   showPopover: PropTypes.bool.description("whether or not to show the popper content").isRequired,
+  /**
+   * Callback to close the context menu, used for "on click outside",
+   *  if not provided click outside will not trigger anything
+   */
   closeContextMenu: PropTypes.func.description(
     'Callback to close the context menu, used for "on click outside", if not provided click outside will not trigger anything'
   ).defaultValue("() => {}"),
+  /**
+   *  Wheter or not the popper content should appear in a DOM portal or not
+   */
   withoutPortal: PropTypes.bool.description("Whether or not the popper content should appear in a DOM portal or not").defaultValue(true),
+  /**
+   *  Wheter or not the popper context menu should print the arrow
+   */
   withoutArrow: PropTypes.bool.description("Whether or not the popper context menu should print the arrow").defaultValue(false),
+  /**
+   *  Whether or not the popper context menu should be animated
+   */
   withoutAnimation: PropTypes.bool.description("Whether or not the popper context menu should be animated").defaultValue(false),
+  /**
+   *  Popper context menus Animation duration in ms
+   */
   animationDuration: PropTypes.number.description("Popper context menus Animation duration in ms").defaultValue(100),
+  /**
+   *  Bounding element to calculate upon, defaults to it is "clippingParents",
+   *   which are the scrolling containers that may cause the element to be partially or fully cut off.
+   */
   boundaryElement: PropTypes.oneOfType([PropTypes.instanceOf(Element), PropTypes.oneOf([null])]).description(
     'Bounding element to calculate upon, defaults to "clippingParents",which are the scrolling containers that may cause element to be partially or fully cut off'
   ).defaultValue(void 0),
+  /**
+   *  When using portal, the container in which to append the DOM content, defaults to document body
+   */
   portalDOMContainer: PropTypes.oneOfType([PropTypes.instanceOf(Element), PropTypes.oneOf([null])]).description("When using portal, the container in which to append the DOM content, defaults to document body").defaultValue(void 0),
+  /**
+   *  start placement preferences, as per popperjs placement option
+   */
   startPlacementPreference: PropTypes.oneOf([
     "top-start",
     "top",
@@ -32,6 +64,9 @@ const dspopperjsPropTypes = {
     "left",
     "left-start"
   ]).description("start placement preferences, as per popperjs placement option").defaultValue("'top'"),
+  /**
+   *  Array of placement preferences, as per popperjs "flip" placement option
+   */
   placementOrderPreference: PropTypes.arrayOf(
     PropTypes.oneOf([
       "top-start",
@@ -48,8 +83,18 @@ const dspopperjsPropTypes = {
       "left-start"
     ])
   ).description('Array of placement preferences, as per popperjs "flip" placement option').defaultValue("['top', 'bottom', 'left', 'right']"),
+  /**
+   *  popperjs content z-index
+   */
   zIndex: PropTypes.number.description("popperjs content z-index").defaultValue(1),
+  /**
+   *  placement offset array
+   */
   customOffset: PropTypes.arrayOf(PropTypes.number).description("placement offset array").defaultValue(1),
+  /**
+   *  modifiers array for full-custom popper-js override
+   *  https://popper.js.org/docs/v2/modifiers/
+   */
   modifiers: PropTypes.array.description("modifiers array for full-custom popper-js override, https://popper.js.org/docs/v2/modifiers/").defaultValue(1),
   extraPopperStyles: PropTypes.object.description("Extra object styles to attach to the popper element").defaultValue({}),
   onClickOutside: PropTypes.func.description("Callback triggered when clicking outside the popper").defaultValue(() => null),

package/dist/esm/react-desc-prop-types.js.map

@@ -2,6 +2,6 @@
   "version": 3,
   "sources": ["../../../../scripts/build/transpile/react-shim.js", "../../src/react-desc-prop-types.ts"],
   "sourcesContent": ["import * as React from 'react';\nexport { React };\n", "import type React from 'react';\nimport type { WeakValidationMap } from 'react';\nimport { globalAttributesPropTypes, PropTypes, xstyledPropTypes } from '@elliemae/ds-props-helpers';\nimport type {} from '@elliemae/ds-utilities';\nimport type { GlobalAttributesT, XstyledProps } from '@elliemae/ds-props-helpers';\nimport type { usePopper } from 'react-popper';\n\nexport type PopperPlacementsT =\n  | 'top-start'\n  | 'top'\n  | 'top-end'\n  | 'right-start'\n  | 'right'\n  | 'right-end'\n  | 'bottom-end'\n  | 'bottom'\n  | 'bottom-start'\n  | 'left-end'\n  | 'left'\n  | 'left-start';\nexport interface UseDSPopperjsPropsArgT {\n  referenceElement: HTMLElement | null;\n  showPopover: boolean;\n  closeContextMenu?: () => void;\n  onClickOutside?: (e: MouseEvent | TouchEvent) => void;\n  withoutPortal?: boolean;\n  withoutArrow?: boolean;\n  withoutAnimation?: boolean;\n  animationDuration?: number;\n  boundaryElement?: HTMLElement;\n  portalDOMContainer?: HTMLElement;\n  placementOrderPreference?: PopperPlacementsT[];\n  startPlacementPreference?: PopperPlacementsT;\n  modifiers?: Record<string, unknown>[];\n  customOffset?: [number, number];\n  zIndex?: number;\n  extraPopperStyles?: Record<string, unknown>;\n}\nexport interface UseDSPopperjsRT {\n  props: Required<UseDSPopperjsPropsArgT>;\n  popperElement: HTMLDivElement | null;\n  setIsAnimating: React.Dispatch<React.SetStateAction<boolean>>;\n  isAnimating: boolean;\n  setPopperElement: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;\n  arrowElement: HTMLDivElement | null;\n  setArrowElement: React.Dispatch<React.SetStateAction<HTMLDivElement | null>>;\n  popoverHelper: ReturnType<typeof usePopper>;\n  globalAttrs: GlobalAttributesT<Element>;\n  xStyledAttrs: XstyledProps;\n}\nexport interface DSDSPopperjsPropsT extends UseDSPopperjsPropsArgT {\n  children: JSX.Element | JSX.Element[];\n}\n\nexport const dspopperjsPropTypes = {\n  ...globalAttributesPropTypes,\n  ...xstyledPropTypes,\n  /**\n   * React ref to popperjs referenceElement\n   */\n  referenceElement: PropTypes.oneOfType([PropTypes.instanceOf(Element), PropTypes.oneOf([null])]).description(\n    'popperjs DOM referenceElement',\n  ).isRequired,\n  /**\n   * Wheter or not to show the popper content\n   */\n  showPopover: PropTypes.bool.description('whether or not to show the popper content').isRequired,\n  /**\n   * Callback to close the context menu, used for \"on click outside\",\n   *  if not provided click outside will not trigger anything\n   */\n  closeContextMenu: PropTypes.func\n    .description(\n      'Callback to close the context menu, used for \"on click outside\",' +\n        ' if not provided click outside will not trigger anything',\n    )\n    .defaultValue('() => {}'),\n  /**\n   *  Wheter or not the popper content should appear in a DOM portal or not\n   */\n  withoutPortal: PropTypes.bool\n    .description('Whether or not the popper content should appear in a DOM portal or not')\n    .defaultValue(true),\n  /**\n   *  Wheter or not the popper context menu should print the arrow\n   */\n  withoutArrow: PropTypes.bool\n    .description('Whether or not the popper context menu should print the arrow')\n    .defaultValue(false),\n  /**\n   *  Whether or not the popper context menu should be animated\n   */\n  withoutAnimation: PropTypes.bool\n    .description('Whether or not the popper context menu should be animated')\n    .defaultValue(false),\n  /**\n   *  Popper context menus Animation duration in ms\n   */\n  animationDuration: PropTypes.number.description('Popper context menus Animation duration in ms').defaultValue(100),\n  /**\n   *  Bounding element to calculate upon, defaults to it is \"clippingParents\",\n   *   which are the scrolling containers that may cause the element to be partially or fully cut off.\n   */\n  boundaryElement: PropTypes.oneOfType([PropTypes.instanceOf(Element), PropTypes.oneOf([null])])\n    .description(\n      'Bounding element to calculate upon, defaults to \"clippingParents\",' +\n        'which are the scrolling containers that may cause element to be partially or fully cut off',\n    )\n    .defaultValue(undefined),\n  /**\n   *  When using portal, the container in which to append the DOM content, defaults to document body\n   */\n  portalDOMContainer: PropTypes.oneOfType([PropTypes.instanceOf(Element), PropTypes.oneOf([null])])\n    .description('When using portal, the container in which to append the DOM content, defaults to document body')\n    .defaultValue(undefined),\n  /**\n   *  start placement preferences, as per popperjs placement option\n   */\n  startPlacementPreference: PropTypes.oneOf([\n    'top-start',\n    'top',\n    'top-end',\n    'right-start',\n    'right',\n    'right-end',\n    'bottom-end',\n    'bottom',\n    'bottom-start',\n    'left-end',\n    'left',\n    'left-start',\n  ])\n    .description('start placement preferences, as per popperjs placement option')\n    .defaultValue(\"'top'\"),\n  /**\n   *  Array of placement preferences, as per popperjs \"flip\" placement option\n   */\n  placementOrderPreference: PropTypes.arrayOf(\n    PropTypes.oneOf([\n      'top-start',\n      'top',\n      'top-end',\n      'right-start',\n      'right',\n      'right-end',\n      'bottom-end',\n      'bottom',\n      'bottom-start',\n      'left-end',\n      'left',\n      'left-start',\n    ]),\n  )\n    .description('Array of placement preferences, as per popperjs \"flip\" placement option')\n    .defaultValue(\"['top', 'bottom', 'left', 'right']\"),\n  /**\n   *  popperjs content z-index\n   */\n  zIndex: PropTypes.number.description('popperjs content z-index').defaultValue(1),\n  /**\n   *  placement offset array\n   */\n  customOffset: PropTypes.arrayOf(PropTypes.number).description('placement offset array').defaultValue(1),\n  /**\n   *  modifiers array for full-custom popper-js override\n   *  https://popper.js.org/docs/v2/modifiers/\n   */\n  modifiers: PropTypes.array\n    .description('modifiers array for full-custom popper-js override, https://popper.js.org/docs/v2/modifiers/')\n    .defaultValue(1),\n  extraPopperStyles: PropTypes.object\n    .description('Extra object styles to attach to the popper element')\n    .defaultValue({}),\n  onClickOutside: PropTypes.func\n    .description('Callback triggered when clicking outside the popper')\n    .defaultValue(() => null),\n  children: PropTypes.node.description('The content of the popper').defaultValue(undefined),\n} as WeakValidationMap<unknown>;\n"],
-  "mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,2BAA2B,WAAW,wBAAwB;AAoDhE,MAAM,sBAAsB;AAAA,EACjC,GAAG;AAAA,EACH,GAAG;AAAA,EAIH,kBAAkB,UAAU,UAAU,CAAC,UAAU,WAAW,OAAO,GAAG,UAAU,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE;AAAA,IAC9F;AAAA,EACF,EAAE;AAAA,EAIF,aAAa,UAAU,KAAK,YAAY,2CAA2C,EAAE;AAAA,EAKrF,kBAAkB,UAAU,KACzB;AAAA,IACC;AAAA,EAEF,EACC,aAAa,UAAU;AAAA,EAI1B,eAAe,UAAU,KACtB,YAAY,wEAAwE,EACpF,aAAa,IAAI;AAAA,EAIpB,cAAc,UAAU,KACrB,YAAY,+DAA+D,EAC3E,aAAa,KAAK;AAAA,EAIrB,kBAAkB,UAAU,KACzB,YAAY,2DAA2D,EACvE,aAAa,KAAK;AAAA,EAIrB,mBAAmB,UAAU,OAAO,YAAY,+CAA+C,EAAE,aAAa,GAAG;AAAA,EAKjH,iBAAiB,UAAU,UAAU,CAAC,UAAU,WAAW,OAAO,GAAG,UAAU,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAC1F;AAAA,IACC;AAAA,EAEF,EACC,aAAa,MAAS;AAAA,EAIzB,oBAAoB,UAAU,UAAU,CAAC,UAAU,WAAW,OAAO,GAAG,UAAU,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAC7F,YAAY,gGAAgG,EAC5G,aAAa,MAAS;AAAA,EAIzB,0BAA0B,UAAU,MAAM;AAAA,IACxC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC,EACE,YAAY,+DAA+D,EAC3E,aAAa,OAAO;AAAA,EAIvB,0BAA0B,UAAU;AAAA,IAClC,UAAU,MAAM;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,EACH,EACG,YAAY,yEAAyE,EACrF,aAAa,oCAAoC;AAAA,EAIpD,QAAQ,UAAU,OAAO,YAAY,0BAA0B,EAAE,aAAa,CAAC;AAAA,EAI/E,cAAc,UAAU,QAAQ,UAAU,MAAM,EAAE,YAAY,wBAAwB,EAAE,aAAa,CAAC;AAAA,EAKtG,WAAW,UAAU,MAClB,YAAY,8FAA8F,EAC1G,aAAa,CAAC;AAAA,EACjB,mBAAmB,UAAU,OAC1B,YAAY,qDAAqD,EACjE,aAAa,CAAC,CAAC;AAAA,EAClB,gBAAgB,UAAU,KACvB,YAAY,qDAAqD,EACjE,aAAa,MAAM,IAAI;AAAA,EAC1B,UAAU,UAAU,KAAK,YAAY,2BAA2B,EAAE,aAAa,MAAS;AAC1F;",
+  "mappings": "AAAA,YAAY,WAAW;ACEvB,SAAS,2BAA2B,WAAW,wBAAwB;AAoDhE,MAAM,sBAAsB;AAAA,EACjC,GAAG;AAAA,EACH,GAAG;AAAA;AAAA;AAAA;AAAA,EAIH,kBAAkB,UAAU,UAAU,CAAC,UAAU,WAAW,OAAO,GAAG,UAAU,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE;AAAA,IAC9F;AAAA,EACF,EAAE;AAAA;AAAA;AAAA;AAAA,EAIF,aAAa,UAAU,KAAK,YAAY,2CAA2C,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA,EAKrF,kBAAkB,UAAU,KACzB;AAAA,IACC;AAAA,EAEF,EACC,aAAa,UAAU;AAAA;AAAA;AAAA;AAAA,EAI1B,eAAe,UAAU,KACtB,YAAY,wEAAwE,EACpF,aAAa,IAAI;AAAA;AAAA;AAAA;AAAA,EAIpB,cAAc,UAAU,KACrB,YAAY,+DAA+D,EAC3E,aAAa,KAAK;AAAA;AAAA;AAAA;AAAA,EAIrB,kBAAkB,UAAU,KACzB,YAAY,2DAA2D,EACvE,aAAa,KAAK;AAAA;AAAA;AAAA;AAAA,EAIrB,mBAAmB,UAAU,OAAO,YAAY,+CAA+C,EAAE,aAAa,GAAG;AAAA;AAAA;AAAA;AAAA;AAAA,EAKjH,iBAAiB,UAAU,UAAU,CAAC,UAAU,WAAW,OAAO,GAAG,UAAU,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAC1F;AAAA,IACC;AAAA,EAEF,EACC,aAAa,MAAS;AAAA;AAAA;AAAA;AAAA,EAIzB,oBAAoB,UAAU,UAAU,CAAC,UAAU,WAAW,OAAO,GAAG,UAAU,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAC7F,YAAY,gGAAgG,EAC5G,aAAa,MAAS;AAAA;AAAA;AAAA;AAAA,EAIzB,0BAA0B,UAAU,MAAM;AAAA,IACxC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,CAAC,EACE,YAAY,+DAA+D,EAC3E,aAAa,OAAO;AAAA;AAAA;AAAA;AAAA,EAIvB,0BAA0B,UAAU;AAAA,IAClC,UAAU,MAAM;AAAA,MACd;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF,CAAC;AAAA,EACH,EACG,YAAY,yEAAyE,EACrF,aAAa,oCAAoC;AAAA;AAAA;AAAA;AAAA,EAIpD,QAAQ,UAAU,OAAO,YAAY,0BAA0B,EAAE,aAAa,CAAC;AAAA;AAAA;AAAA;AAAA,EAI/E,cAAc,UAAU,QAAQ,UAAU,MAAM,EAAE,YAAY,wBAAwB,EAAE,aAAa,CAAC;AAAA;AAAA;AAAA;AAAA;AAAA,EAKtG,WAAW,UAAU,MAClB,YAAY,8FAA8F,EAC1G,aAAa,CAAC;AAAA,EACjB,mBAAmB,UAAU,OAC1B,YAAY,qDAAqD,EACjE,aAAa,CAAC,CAAC;AAAA,EAClB,gBAAgB,UAAU,KACvB,YAAY,qDAAqD,EACjE,aAAa,MAAM,IAAI;AAAA,EAC1B,UAAU,UAAU,KAAK,YAAY,2BAA2B,EAAE,aAAa,MAAS;AAC1F;",
   "names": []
 }

package/dist/types/config/useConfigDSPopperjs.d.ts

@@ -1,2 +1,2 @@
-import type { UseDSPopperjsPropsArgT, UseDSPopperjsRT } from '../react-desc-prop-types';
+import type { UseDSPopperjsPropsArgT, UseDSPopperjsRT } from '../react-desc-prop-types.js';
 export declare const useConfigDSPopperjs: (appProps: UseDSPopperjsPropsArgT) => UseDSPopperjsRT;

package/dist/types/config/useConfiguredDefaultModifiers.d.ts

@@ -1,4 +1,4 @@
-import type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types';
+import type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types.js';
 interface UseConfiguredDefaultModifiersT {
     props: UseDSPopperjsPropsArgT;
     arrowElement: HTMLDivElement | null;

package/dist/types/config/useConfiguredDefaultProps.d.ts

@@ -1,4 +1,4 @@
-import type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types';
+import type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types.js';
 interface UseConfiguredDefaultPropsT {
     props: UseDSPopperjsPropsArgT;
     arrowElement: HTMLDivElement | null;
@@ -15,8 +15,8 @@ export declare const useConfiguredDefaultProps: ({ props, arrowElement }: Requir
     animationDuration?: number | undefined;
     boundaryElement?: HTMLElement | undefined;
     portalDOMContainer?: HTMLElement | undefined;
-    placementOrderPreference?: import("../react-desc-prop-types").PopperPlacementsT[] | undefined;
-    startPlacementPreference?: import("../react-desc-prop-types").PopperPlacementsT | undefined;
+    placementOrderPreference?: import("../react-desc-prop-types.js").PopperPlacementsT[] | undefined;
+    startPlacementPreference?: import("../react-desc-prop-types.js").PopperPlacementsT | undefined;
     customOffset?: [number, number] | undefined;
     zIndex?: number | undefined;
     extraPopperStyles?: Record<string, unknown> | undefined;

package/dist/types/config/useConfiguredMergedProps.d.ts

@@ -1,4 +1,4 @@
-import type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types';
+import type { UseDSPopperjsPropsArgT } from '../react-desc-prop-types.js';
 interface UseConfiguredMergedPropsT {
     props: UseDSPopperjsPropsArgT;
     arrowElement: HTMLDivElement | null;

package/dist/types/index.d.ts

@@ -1,6 +1,6 @@
 import React from 'react';
-import type { DSDSPopperjsPropsT } from './react-desc-prop-types';
+import type { DSDSPopperjsPropsT } from './react-desc-prop-types.js';
 declare const DSPopperJS: React.ComponentType<DSDSPopperjsPropsT>;
-declare const DSPopperJSWithSchema: import("@elliemae/ds-props-helpers/dist/types/propTypes/types").DocumentedReactComponent<DSDSPopperjsPropsT>;
+declare const DSPopperJSWithSchema: import("@elliemae/ds-props-helpers/dist/types/propTypes/types.js").DocumentedReactComponent<DSDSPopperjsPropsT>;
 export { DSPopperJS, DSPopperJSWithSchema };
 export default DSPopperJS;

package/dist/types/styled.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { SpaceProps, SizingProps, LayoutProps } from '@elliemae/ds-system';
 interface StyledContentWrapperPropsT {
     zIndex: number;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@elliemae/ds-popperjs",
-  "version": "3.16.0",
+  "version": "3.16.1",
   "license": "MIT",
   "description": "ICE MT - Dimsum - Popper JS Wrapper",
   "files": [
@@ -72,12 +72,12 @@
   },
   "dependencies": {
     "react-popper": "~2.3.0",
-    "@elliemae/ds-props-helpers": "3.16.0",
-    "@elliemae/ds-system": "3.16.0",
-    "@elliemae/ds-utilities": "3.16.0"
+    "@elliemae/ds-props-helpers": "3.16.1",
+    "@elliemae/ds-system": "3.16.1",
+    "@elliemae/ds-utilities": "3.16.1"
   },
   "devDependencies": {
-    "styled-components": "~5.3.6"
+    "styled-components": "~5.3.9"
   },
   "peerDependencies": {
     "react": "^17.0.2",