@elliemae/ds-popperjs 3.36.0-next.0 → 3.36.0-next.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/PopoverArrow.js.map +1 -1
- package/dist/cjs/index.js +2 -5
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/styled.js.map +1 -1
- package/dist/esm/PopoverArrow.js.map +1 -1
- package/dist/esm/index.js +2 -5
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/styled.js.map +1 -1
- package/package.json +6 -6
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/PopoverArrow.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"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 innerRef={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"],
|
|
5
|
-
"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,
|
|
5
|
+
"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,UAAU;AAAA,YACT,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAeR,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAMb,UAAU;AAAA;AAAA;AAAA,YAGX,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAMT,UAAU;AAAA;AAAA,iBAEP,CAAC,UACd,MAAM,gBAAgB,EAAE,WAAW,KAAK,KAAK,MAAM,gBAAgB,EAAE,WAAW,QAAQ,IACpF,IAAI,aAAa,CAAC,QAClB,IAAI;AAAA,gBACI,CAAC,UACb,MAAM,gBAAgB,EAAE,WAAW,MAAM,KAAK,MAAM,gBAAgB,EAAE,WAAW,OAAO,IACpF,IAAI,cAAc,CAAC,QACnB,IAAI;AAAA;AAGL,MAAM,eAAe,CAAC,EAAE,WAAW,OAAO,gBAAgB,MAC/D;AAAA,EAAC;AAAA;AAAA,IAEC,kBAAgB;AAAA,IAChB;AAAA,IACA,UAAU;AAAA,IACV,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;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/index.js
CHANGED
|
@@ -102,14 +102,11 @@ const DSPopperJS = (props) => {
|
|
|
102
102
|
]
|
|
103
103
|
);
|
|
104
104
|
if (showPopover || isAnimating) {
|
|
105
|
-
if (withoutPortal === true)
|
|
106
|
-
|
|
107
|
-
if (portalDOMContainer && withoutPortal === false)
|
|
108
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: (0, import_react_dom.createPortal)(contentJSX, portalDOMContainer) });
|
|
105
|
+
if (withoutPortal === true) return contentJSX;
|
|
106
|
+
if (portalDOMContainer && withoutPortal === false) return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_jsx_runtime.Fragment, { children: (0, import_react_dom.createPortal)(contentJSX, portalDOMContainer) });
|
|
109
107
|
}
|
|
110
108
|
return null;
|
|
111
109
|
};
|
|
112
|
-
DSPopperJS.propTypes = import_react_desc_prop_types.dspopperjsPropTypes;
|
|
113
110
|
DSPopperJS.displayName = "DSPopperJS";
|
|
114
111
|
const DSPopperJSWithSchema = (0, import_ds_props_helpers.describe)(DSPopperJS).description("A dimsum custom styling wrapper on top of popperjs");
|
|
115
112
|
DSPopperJSWithSchema.propTypes = import_react_desc_prop_types.dspopperjsPropTypes;
|
package/dist/cjs/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/index.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
|
-
"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 { DSPopperJST } from './react-desc-prop-types.js';\nimport { dspopperjsPropTypes } from './react-desc-prop-types.js';\n\nconst DSPopperJS: React.ComponentType<DSPopperJST.Props> = (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 (portalDOMContainer && withoutPortal === false) return <>{createPortal(contentJSX, portalDOMContainer)}</>;\n }\n return null;\n};\n\nDSPopperJS.
|
|
5
|
-
"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,aAAqD,CAAC,UAAU;AACpE,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
|
|
4
|
+
"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 { DSPopperJST } from './react-desc-prop-types.js';\nimport { dspopperjsPropTypes } from './react-desc-prop-types.js';\n\nconst DSPopperJS: React.ComponentType<DSPopperJST.Props> = (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 (portalDOMContainer && withoutPortal === false) return <>{createPortal(contentJSX, portalDOMContainer)}</>;\n }\n return null;\n};\n\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\nexport type { DSPopperJST } from './react-desc-prop-types.js';\n", "import * as React from 'react';\nexport { React };\n"],
|
|
5
|
+
"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,aAAqD,CAAC,UAAU;AACpE,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,KAAM,QAAO;AACnC,QAAI,sBAAsB,kBAAkB,MAAO,QAAO,2EAAG,6CAAa,YAAY,kBAAkB,GAAE;AAAA,EAC5G;AACA,SAAO;AACT;AAEA,WAAW,cAAc;AACzB,MAAM,2BAAuB,kCAAS,UAAU,EAAE,YAAY,oDAAoD;AAClH,qBAAqB,YAAY;AAGjC,IAAO,cAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/styled.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/styled.tsx", "../../../../../scripts/build/transpile/react-shim.js"],
|
|
4
4
|
"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:\n 0 0 0 1px rgba(16, 22, 26, 0.1),\n 0 2px 4px rgba(16, 22, 26, 0.2),\n 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"],
|
|
5
|
-
"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,
|
|
5
|
+
"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,MAAM;AAAA,IAC7D,mCAAkB;AAAA;AAGf,MAAM,uBAAuB,wBAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMvC,CAAC,EAAE,aAAa,mBAAmB,iBAAiB,MACpD,CAAC,oBACD;AAAA,mBACe,cAAc,gBAAgB,aAAa,IAAI,iBAAiB;AAAA,KAC9E;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/PopoverArrow.tsx"],
|
|
4
4
|
"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 innerRef={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"],
|
|
5
|
-
"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,
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACgEnB,SACE,KADF;AA/DJ,SAAS,cAAc;AAMvB,MAAM,aAAa;AACnB,MAAM,cAAc;AAEpB,MAAM,cAAc,OAAO;AAAA;AAAA,WAEhB,UAAU;AAAA,YACT,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,eAeR,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,aAMb,UAAU;AAAA;AAAA;AAAA,YAGX,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,cAMT,UAAU;AAAA;AAAA,iBAEP,CAAC,UACd,MAAM,gBAAgB,EAAE,WAAW,KAAK,KAAK,MAAM,gBAAgB,EAAE,WAAW,QAAQ,IACpF,IAAI,aAAa,CAAC,QAClB,IAAI;AAAA,gBACI,CAAC,UACb,MAAM,gBAAgB,EAAE,WAAW,MAAM,KAAK,MAAM,gBAAgB,EAAE,WAAW,OAAO,IACpF,IAAI,cAAc,CAAC,QACnB,IAAI;AAAA;AAGL,MAAM,eAAe,CAAC,EAAE,WAAW,OAAO,gBAAgB,MAC/D;AAAA,EAAC;AAAA;AAAA,IAEC,kBAAgB;AAAA,IAChB;AAAA,IACA,UAAU;AAAA,IACV,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;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/index.js
CHANGED
|
@@ -67,14 +67,11 @@ const DSPopperJS = (props) => {
|
|
|
67
67
|
]
|
|
68
68
|
);
|
|
69
69
|
if (showPopover || isAnimating) {
|
|
70
|
-
if (withoutPortal === true)
|
|
71
|
-
|
|
72
|
-
if (portalDOMContainer && withoutPortal === false)
|
|
73
|
-
return /* @__PURE__ */ jsx(Fragment, { children: createPortal(contentJSX, portalDOMContainer) });
|
|
70
|
+
if (withoutPortal === true) return contentJSX;
|
|
71
|
+
if (portalDOMContainer && withoutPortal === false) return /* @__PURE__ */ jsx(Fragment, { children: createPortal(contentJSX, portalDOMContainer) });
|
|
74
72
|
}
|
|
75
73
|
return null;
|
|
76
74
|
};
|
|
77
|
-
DSPopperJS.propTypes = dspopperjsPropTypes;
|
|
78
75
|
DSPopperJS.displayName = "DSPopperJS";
|
|
79
76
|
const DSPopperJSWithSchema = describe(DSPopperJS).description("A dimsum custom styling wrapper on top of popperjs");
|
|
80
77
|
DSPopperJSWithSchema.propTypes = dspopperjsPropTypes;
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/index.tsx"],
|
|
4
|
-
"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 { DSPopperJST } from './react-desc-prop-types.js';\nimport { dspopperjsPropTypes } from './react-desc-prop-types.js';\n\nconst DSPopperJS: React.ComponentType<DSPopperJST.Props> = (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 (portalDOMContainer && withoutPortal === false) return <>{createPortal(contentJSX, portalDOMContainer)}</>;\n }\n return null;\n};\n\nDSPopperJS.
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACgCjB,SAsCwD,UAtCxD;AAhCN,SAAgB,eAAe;AAC/B,SAAS,oBAAoB;AAC7B,SAAS,gBAAgB;AACzB,SAAS,sBAAsB;AAC/B,SAAS,2BAA2B;AAEpC,SAAS,2BAA2B;AAEpC,MAAM,aAAqD,CAAC,UAAU;AACpE,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
|
|
4
|
+
"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 { DSPopperJST } from './react-desc-prop-types.js';\nimport { dspopperjsPropTypes } from './react-desc-prop-types.js';\n\nconst DSPopperJS: React.ComponentType<DSPopperJST.Props> = (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 (portalDOMContainer && withoutPortal === false) return <>{createPortal(contentJSX, portalDOMContainer)}</>;\n }\n return null;\n};\n\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\nexport type { DSPopperJST } from './react-desc-prop-types.js';\n"],
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACgCjB,SAsCwD,UAtCxD;AAhCN,SAAgB,eAAe;AAC/B,SAAS,oBAAoB;AAC7B,SAAS,gBAAgB;AACzB,SAAS,sBAAsB;AAC/B,SAAS,2BAA2B;AAEpC,SAAS,2BAA2B;AAEpC,MAAM,aAAqD,CAAC,UAAU;AACpE,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,KAAM,QAAO;AACnC,QAAI,sBAAsB,kBAAkB,MAAO,QAAO,gCAAG,uBAAa,YAAY,kBAAkB,GAAE;AAAA,EAC5G;AACA,SAAO;AACT;AAEA,WAAW,cAAc;AACzB,MAAM,uBAAuB,SAAS,UAAU,EAAE,YAAY,oDAAoD;AAClH,qBAAqB,YAAY;AAGjC,IAAO,cAAQ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/styled.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../../scripts/build/transpile/react-shim.js", "../../src/styled.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as React from 'react';\nexport { React };\n", "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:\n 0 0 0 1px rgba(16, 22, 26, 0.1),\n 0 2px 4px rgba(16, 22, 26, 0.2),\n 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"],
|
|
5
|
-
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,QAAQ,MAAM,KAAK,0BAA0B;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,8BAA8B,OAAO,KAAK;AAAA,aAG1C,CAAC,EAAE,OAAO,OAAO,MAAM,UAAU,MAAM,OAAO;AAAA,
|
|
5
|
+
"mappings": "AAAA,YAAY,WAAW;ACAvB,SAAS,QAAQ,MAAM,KAAK,0BAA0B;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,8BAA8B,OAAO,KAAK;AAAA,aAG1C,CAAC,EAAE,OAAO,OAAO,MAAM,UAAU,MAAM,OAAO,MAAM;AAAA,IAC7D,kBAAkB;AAAA;AAGf,MAAM,uBAAuB,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMvC,CAAC,EAAE,aAAa,mBAAmB,iBAAiB,MACpD,CAAC,oBACD;AAAA,mBACe,cAAc,gBAAgB,aAAa,IAAI,iBAAiB;AAAA,KAC9E;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@elliemae/ds-popperjs",
|
|
3
|
-
"version": "3.36.0-next.
|
|
3
|
+
"version": "3.36.0-next.2",
|
|
4
4
|
"license": "MIT",
|
|
5
5
|
"description": "ICE MT - Dimsum - Popper JS Wrapper",
|
|
6
6
|
"files": [
|
|
@@ -75,15 +75,15 @@
|
|
|
75
75
|
"@popperjs/core": "~2.11.7",
|
|
76
76
|
"@xstyled/system": "~3.7.3",
|
|
77
77
|
"react-popper": "~2.3.0",
|
|
78
|
-
"@elliemae/ds-props-helpers": "3.36.0-next.
|
|
79
|
-
"@elliemae/ds-system": "3.36.0-next.
|
|
80
|
-
"@elliemae/ds-
|
|
81
|
-
"@elliemae/ds-
|
|
78
|
+
"@elliemae/ds-props-helpers": "3.36.0-next.2",
|
|
79
|
+
"@elliemae/ds-system": "3.36.0-next.2",
|
|
80
|
+
"@elliemae/ds-typescript-helpers": "3.36.0-next.2",
|
|
81
|
+
"@elliemae/ds-utilities": "3.36.0-next.2"
|
|
82
82
|
},
|
|
83
83
|
"devDependencies": {
|
|
84
84
|
"@elliemae/pui-cli": "~9.0.0-next.31",
|
|
85
85
|
"styled-components": "~5.3.9",
|
|
86
|
-
"@elliemae/ds-monorepo-devops": "3.36.0-next.
|
|
86
|
+
"@elliemae/ds-monorepo-devops": "3.36.0-next.2"
|
|
87
87
|
},
|
|
88
88
|
"peerDependencies": {
|
|
89
89
|
"react": "^17.0.2",
|