@toptal/picasso-popper 1.1.1-alpha-MP-1619-form-warning-state-and-error-as-react-node-ea5bb78b6.7 → 1.1.1-alpha-HG-917-fix-overlapping-sidebar-3957b1ee3.11

package/dist-package/src/Popper/Popper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Popper.d.ts","sourceRoot":"","sources":["../../../src/Popper/Popper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAiC,MAAM,OAAO,CAAA;AAKrD,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,WAAW,CAAA;AAC/D,OAAO,KAAK,QAAQ,MAAM,WAAW,CAAA;AACrC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAQvD,oBAAY,mBAAmB,GAC3B,YAAY,GACZ,cAAc,GACd,QAAQ,GACR,UAAU,GACV,YAAY,GACZ,MAAM,GACN,WAAW,GACX,aAAa,GACb,OAAO,GACP,SAAS,GACT,WAAW,GACX,KAAK,CAAA;AAET,MAAM,WAAW,KAAM,SAAQ,SAAS;IACtC,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,qCAAqC;IACrC,IAAI,EAAE,OAAO,CAAA;IACb,sFAAsF;IACtF,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,uBAAuB;IACvB,SAAS,CAAC,EAAE,mBAAmB,CAAA;IAC/B,iDAAiD;IACjD,aAAa,CAAC,EAAE,aAAa,CAAA;IAC7B,+CAA+C;IAC/C,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB;;;;OAIG;IACH,SAAS,CAAC,EAAE,WAAW,GAAG,CAAC,MAAM,WAAW,CAAC,CAAA;IAC7C;;;OAGG;IACH,QAAQ,EAAE,IAAI,GAAG,eAAe,GAAG,CAAC,MAAM,eAAe,CAAC,CAAA;IAC1D,0DAA0D;IAC1D,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,mBAAmB;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yDAAyD;IACzD,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B;AAsBD,eAAO,MAAM,gBAAgB,kBACZ,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiB5B,CAAA;AAqBF,eAAO,MAAM,MAAM,wEA8DjB,CAAA;AAYF,eAAe,MAAM,CAAA"}
+{"version":3,"file":"Popper.d.ts","sourceRoot":"","sources":["../../../src/Popper/Popper.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACtC,OAAO,KAAiC,MAAM,OAAO,CAAA;AAErD,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,WAAW,CAAA;AAC/D,OAAO,KAAK,QAAQ,MAAM,WAAW,CAAA;AACrC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,wBAAwB,CAAA;AAOvD,oBAAY,mBAAmB,GAC3B,YAAY,GACZ,cAAc,GACd,QAAQ,GACR,UAAU,GACV,YAAY,GACZ,MAAM,GACN,WAAW,GACX,aAAa,GACb,OAAO,GACP,SAAS,GACT,WAAW,GACX,KAAK,CAAA;AAET,MAAM,WAAW,KAAM,SAAQ,SAAS;IACtC,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,qCAAqC;IACrC,IAAI,EAAE,OAAO,CAAA;IACb,sFAAsF;IACtF,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,uBAAuB;IACvB,SAAS,CAAC,EAAE,mBAAmB,CAAA;IAC/B,iDAAiD;IACjD,aAAa,CAAC,EAAE,aAAa,CAAA;IAC7B,+CAA+C;IAC/C,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB;;;;OAIG;IACH,SAAS,CAAC,EAAE,WAAW,GAAG,CAAC,MAAM,WAAW,CAAC,CAAA;IAC7C;;;OAGG;IACH,QAAQ,EAAE,IAAI,GAAG,eAAe,GAAG,CAAC,MAAM,eAAe,CAAC,CAAA;IAC1D,0DAA0D;IAC1D,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,mBAAmB;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,yDAAyD;IACzD,iBAAiB,CAAC,EAAE,OAAO,CAAA;CAC5B;AAoBD,eAAO,MAAM,gBAAgB,kBACZ,aAAa;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiB5B,CAAA;AAqBF,eAAO,MAAM,MAAM,wEAkEjB,CAAA;AAYF,eAAe,MAAM,CAAA"}

package/dist-package/src/Popper/Popper.js

@@ -10,15 +10,12 @@ var __rest = (this && this.__rest) || function (s, e) {
     return t;
 };
 import React, { forwardRef, useContext } from 'react';
-import cx from 'classnames';
 import { Popper as MUIPopper } from '@material-ui/core';
-import { makeStyles } from '@material-ui/core/styles';
 import { useIsomorphicLayoutEffect } from '@toptal/picasso-shared';
 import { usePicassoRoot, useBreakpoint } from '@toptal/picasso-provider';
 import { useWidthOf } from '@toptal/picasso-utils';
 import ModalContext from '@toptal/picasso-modal-context';
-import styles from './styles';
-const useStyles = makeStyles(styles, { name: 'PicassoPopper' });
+import { twMerge } from '@toptal/picasso-tailwind-merge';
 const getAnchorEl = (anchorEl) => (typeof anchorEl === 'function' ? anchorEl() : anchorEl);
 const getPreventOverflowOptions = (isInsideModal) => {
     if (isInsideModal) {
@@ -51,7 +48,6 @@ export const Popper = forwardRef(function Popper(props, ref) {
     const { children, open, anchorEl, className, container, popperOptions = {}, keepMounted, autoWidth, width, enableCompactMode, disablePortal, style } = props, rest = __rest(props, ["children", "open", "anchorEl", "className", "container", "popperOptions", "keepMounted", "autoWidth", "width", "enableCompactMode", "disablePortal", "style"]);
     const picassoRootContainer = usePicassoRoot();
     const isInsideModal = useContext(ModalContext);
-    const classes = useStyles();
     const isCompactLayoutResolution = useBreakpoint(['xs', 'sm', 'md']);
     const isCompactLayout = enableCompactMode && isCompactLayoutResolution;
     const widthStyle = useWidthStyle({ autoWidth, width, anchorEl });
@@ -66,7 +62,7 @@ export const Popper = forwardRef(function Popper(props, ref) {
         }
     }, [isCompactLayout, open]);
     const memoizedPopperOptions = React.useMemo(() => getPopperOptions(popperOptions, isInsideModal), [popperOptions, isInsideModal]);
-    return (React.createElement(MUIPopper, Object.assign({ open: open, container: container || picassoRootContainer, anchorEl: anchorEl, className: cx(classes.root, className), popperRef: ref, popperOptions: memoizedPopperOptions, disablePortal: disablePortal, keepMounted: keepMounted, style: Object.assign(Object.assign({}, style), anchorElWidthStyle) }, rest), children));
+    return (React.createElement(MUIPopper, Object.assign({ open: open, container: container || picassoRootContainer, anchorEl: anchorEl, className: twMerge('z-modal', 'xs:max-md:w-screen xs:max-md:max-w-screen xs:max-md:p-0 xs:max-md:m-0', '[&[x-out-of-boundaries]]:hidden', className), popperRef: ref, popperOptions: memoizedPopperOptions, disablePortal: disablePortal, keepMounted: keepMounted, style: Object.assign(Object.assign({}, style), anchorElWidthStyle) }, rest), children));
 });
 Popper.defaultProps = {
     open: false,

package/dist-package/src/Popper/Popper.js.map

@@ -1 +1 @@
-{"version":3,"file":"Popper.js","sourceRoot":"","sources":["../../../src/Popper/Popper.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Popper.js","sourceRoot":"","sources":["../../../src/Popper/Popper.tsx"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@toptal/picasso-popper",
-  "version": "1.1.1-alpha-MP-1619-form-warning-state-and-error-as-react-node-ea5bb78b6.7+ea5bb78b6",
+  "version": "1.1.1-alpha-HG-917-fix-overlapping-sidebar-3957b1ee3.11+3957b1ee3",
   "description": "Toptal UI components library - Popper",
   "publishConfig": {
     "access": "public"
@@ -22,22 +22,19 @@
   },
   "homepage": "https://github.com/toptal/picasso/tree/master/packages/picasso#readme",
   "dependencies": {
-    "@toptal/picasso-modal-context": "1.0.2-alpha-MP-1619-form-warning-state-and-error-as-react-node-ea5bb78b6.455+ea5bb78b6",
-    "@toptal/picasso-shared": "15.0.1-alpha-MP-1619-form-warning-state-and-error-as-react-node-ea5bb78b6.353+ea5bb78b6",
-    "@toptal/picasso-utils": "3.1.1-alpha-MP-1619-form-warning-state-and-error-as-react-node-ea5bb78b6.7+ea5bb78b6",
-    "classnames": "^2.5.1"
-  },
-  "sideEffects": [
-    "**/styles.ts",
-    "**/styles.js"
-  ],
+    "@toptal/picasso-modal-context": "1.0.2-alpha-HG-917-fix-overlapping-sidebar-3957b1ee3.459+3957b1ee3",
+    "@toptal/picasso-shared": "15.0.1-alpha-HG-917-fix-overlapping-sidebar-3957b1ee3.357+3957b1ee3",
+    "@toptal/picasso-utils": "3.1.1-alpha-HG-917-fix-overlapping-sidebar-3957b1ee3.11+3957b1ee3"
+  },
   "peerDependencies": {
     "@material-ui/core": "4.12.4",
     "@toptal/picasso-provider": "*",
+    "@toptal/picasso-tailwind": ">=2.5.0",
+    "@toptal/picasso-tailwind-merge": "^2.0.0",
     "react": ">=16.12.0 < 19.0.0"
   },
   "devDependencies": {
-    "@toptal/picasso-provider": "5.0.1-alpha-MP-1619-form-warning-state-and-error-as-react-node-ea5bb78b6.274+ea5bb78b6",
+    "@toptal/picasso-provider": "5.0.1-alpha-HG-917-fix-overlapping-sidebar-3957b1ee3.278+3957b1ee3",
     "popper.js": "^1.16.1"
   },
   "exports": {
@@ -48,5 +45,5 @@
     "!dist-package/tsconfig.tsbuildinfo",
     "src"
   ],
-  "gitHead": "ea5bb78b60ca6fa7493f53bb596f8f200559db94"
+  "gitHead": "3957b1ee38417e2370b7cfd8546a9b66b395befe"
 }

package/src/Popper/Popper.tsx

@@ -1,9 +1,6 @@
 import type { ReactNode } from 'react'
 import React, { forwardRef, useContext } from 'react'
-import cx from 'classnames'
 import { Popper as MUIPopper } from '@material-ui/core'
-import type { Theme } from '@material-ui/core/styles'
-import { makeStyles } from '@material-ui/core/styles'
 import type { ReferenceObject, PopperOptions } from 'popper.js'
 import type PopperJs from 'popper.js'
 import type { BaseProps } from '@toptal/picasso-shared'
@@ -11,8 +8,7 @@ import { useIsomorphicLayoutEffect } from '@toptal/picasso-shared'
 import { usePicassoRoot, useBreakpoint } from '@toptal/picasso-provider'
 import { useWidthOf } from '@toptal/picasso-utils'
 import ModalContext from '@toptal/picasso-modal-context'
-
-import styles from './styles'
+import { twMerge } from '@toptal/picasso-tailwind-merge'
 
 export type PopperPlacementType =
   | 'bottom-end'
@@ -59,8 +55,6 @@ export interface Props extends BaseProps {
   enableCompactMode?: boolean
 }
 
-const useStyles = makeStyles<Theme>(styles, { name: 'PicassoPopper' })
-
 const getAnchorEl = (
   anchorEl: null | ReferenceObject | (() => ReferenceObject)
 ) => (typeof anchorEl === 'function' ? anchorEl() : anchorEl)
@@ -138,7 +132,6 @@ export const Popper = forwardRef<PopperJs, Props>(function Popper(props, ref) {
   const picassoRootContainer = usePicassoRoot()
   const isInsideModal = useContext(ModalContext)
 
-  const classes = useStyles()
   const isCompactLayoutResolution = useBreakpoint(['xs', 'sm', 'md'])
   const isCompactLayout = enableCompactMode && isCompactLayoutResolution
   const widthStyle = useWidthStyle({ autoWidth, width, anchorEl })
@@ -166,7 +159,12 @@ export const Popper = forwardRef<PopperJs, Props>(function Popper(props, ref) {
       open={open}
       container={container || picassoRootContainer}
       anchorEl={anchorEl}
-      className={cx(classes.root, className)}
+      className={twMerge(
+        'z-modal',
+        'xs:max-md:w-screen xs:max-md:max-w-screen xs:max-md:p-0 xs:max-md:m-0',
+        '[&[x-out-of-boundaries]]:hidden',
+        className
+      )}
       popperRef={ref}
       popperOptions={memoizedPopperOptions}
       disablePortal={disablePortal}

package/src/Popper/test.tsx

@@ -11,9 +11,6 @@ jest.mock('@toptal/picasso-provider', () => ({
   useBreakpoint: () => true,
   usePicassoRoot: jest.fn(),
 }))
-jest.mock('@material-ui/core/styles', () => ({
-  makeStyles: jest.fn(() => () => ({ root: 'TEST_CLASS_NAME+1' })),
-}))
 jest.mock('@toptal/picasso-utils', () => ({
   __esModule: true,
   useWidthOf: () => '300px',
@@ -30,7 +27,8 @@ rootDiv.setAttribute('id', 'root')
 
 const anchorEl = document.body
 const children = 'some children'
-const className = 'TEST_CLASS_NAME+1'
+const className =
+  'z-modal xs:max-sm:w-screen xs:max-sm:max-w-screen xs:max-sm:p-0 xs:max-sm:m-0 [&[x-out-of-boundaries]]:hidden'
 const disablePortal = false
 const open = true
 const placement = 'top'

package/dist-package/src/Popper/styles.d.ts

@@ -1,4 +0,0 @@
-import type { Theme } from '@material-ui/core/styles';
-declare const _default: ({ zIndex, screens }: Theme) => import("@material-ui/styles").StyleRules<{}, "root">;
-export default _default;
-//# sourceMappingURL=styles.d.ts.map

package/dist-package/src/Popper/styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/Popper/styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAA;8CAGhB,KAAK;AAA1C,wBAcI"}

package/dist-package/src/Popper/styles.js

@@ -1,16 +0,0 @@
-import { createStyles } from '@material-ui/core/styles';
-export default ({ zIndex, screens }) => createStyles({
-    root: {
-        zIndex: zIndex.modal,
-        [screens('xs', 'sm')]: {
-            width: '100vw',
-            maxWidth: '100vw',
-            padding: 0,
-            margin: 0,
-        },
-        '&[x-out-of-boundaries]': {
-            display: 'none',
-        },
-    },
-});
-//# sourceMappingURL=styles.js.map

package/dist-package/src/Popper/styles.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/Popper/styles.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAEvD,eAAe,CAAC,EAAE,MAAM,EAAE,OAAO,EAAS,EAAE,EAAE,CAC5C,YAAY,CAAC;IACX,IAAI,EAAE;QACJ,MAAM,EAAE,MAAM,CAAC,KAAK;QACpB,CAAC,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,EAAE;YACrB,KAAK,EAAE,OAAO;YACd,QAAQ,EAAE,OAAO;YACjB,OAAO,EAAE,CAAC;YACV,MAAM,EAAE,CAAC;SACV;QACD,wBAAwB,EAAE;YACxB,OAAO,EAAE,MAAM;SAChB;KACF;CACF,CAAC,CAAA"}

package/src/Popper/styles.ts

@@ -1,18 +0,0 @@
-import type { Theme } from '@material-ui/core/styles'
-import { createStyles } from '@material-ui/core/styles'
-
-export default ({ zIndex, screens }: Theme) =>
-  createStyles({
-    root: {
-      zIndex: zIndex.modal,
-      [screens('xs', 'sm')]: {
-        width: '100vw',
-        maxWidth: '100vw',
-        padding: 0,
-        margin: 0,
-      },
-      '&[x-out-of-boundaries]': {
-        display: 'none',
-      },
-    },
-  })