UNPKG

@mantine/core

Version:

React components library focused on usability, accessibility and developer experience

1 lines 4.26 kB
{"version":3,"file":"FloatingWindow.cjs","names":["getDefaultZIndex","factory","useProps","useStyles","OptionalPortal","Paper","classes"],"sources":["../../../src/components/FloatingWindow/FloatingWindow.tsx"],"sourcesContent":["import { useImperativeHandle } from 'react';\nimport {\n SetFloatingWindowPosition,\n useFloatingWindow,\n UseFloatingWindowOptions,\n useMergedRef,\n} from '@mantine/hooks';\nimport {\n BoxProps,\n ElementProps,\n factory,\n Factory,\n getDefaultZIndex,\n StylesApiProps,\n useProps,\n useStyles,\n} from '../../core';\nimport { Paper, PaperBaseProps } from '../Paper';\nimport { OptionalPortal, PortalProps } from '../Portal';\nimport classes from './FloatingWindow.module.css';\n\nexport type FloatingWindowStylesNames = 'root';\n\nexport interface FloatingWindowProps\n extends\n UseFloatingWindowOptions,\n PaperBaseProps,\n BoxProps,\n StylesApiProps<FloatingWindowFactory>,\n ElementProps<'div', keyof UseFloatingWindowOptions> {\n /** Assigns ref to set position programmatically */\n setPositionRef?: React.RefObject<SetFloatingWindowPosition | null>;\n\n /** Determines whether the window should be rendered inside `Portal` @default true */\n withinPortal?: boolean;\n\n /** Props passed down to `Portal` component */\n portalProps?: Omit<PortalProps, 'children'>;\n\n /** `z-index` of the root element @default 400 */\n zIndex?: React.CSSProperties['zIndex'];\n}\n\nexport type FloatingWindowFactory = Factory<{\n props: FloatingWindowProps;\n ref: HTMLDivElement;\n stylesNames: FloatingWindowStylesNames;\n}>;\n\nconst defaultProps = {\n constrainToViewport: true,\n zIndex: getDefaultZIndex('overlay'),\n} satisfies Partial<FloatingWindowProps>;\n\nexport const FloatingWindow = factory<FloatingWindowFactory>((_props) => {\n const props = useProps('FloatingWindow', defaultProps, _props);\n const {\n classNames,\n className,\n style,\n styles,\n unstyled,\n vars,\n mod,\n enabled,\n constrainToViewport,\n constrainOffset,\n dragHandleSelector,\n excludeDragHandleSelector,\n axis,\n initialPosition,\n onPositionChange,\n onDragStart,\n onDragEnd,\n setPositionRef,\n withinPortal,\n portalProps,\n zIndex,\n ref,\n ...others\n } = props;\n\n const getStyles = useStyles<FloatingWindowFactory>({\n name: 'FloatingWindow',\n classes,\n props,\n className,\n style,\n classNames,\n styles,\n unstyled,\n vars,\n });\n\n const floatingWindow = useFloatingWindow({\n enabled,\n constrainToViewport,\n constrainOffset,\n dragHandleSelector,\n excludeDragHandleSelector,\n axis,\n initialPosition,\n onPositionChange,\n onDragStart,\n onDragEnd,\n });\n\n useImperativeHandle(setPositionRef, () => floatingWindow.setPosition, [\n floatingWindow.setPosition,\n ]);\n\n return (\n <OptionalPortal withinPortal={withinPortal} {...portalProps}>\n <Paper\n ref={useMergedRef(ref, floatingWindow.ref)}\n mod={[{ dragging: floatingWindow.isDragging }, mod]}\n {...getStyles('root')}\n {...others}\n __vars={{ '--floating-window-z-index': zIndex.toString() }}\n />\n </OptionalPortal>\n );\n});\n\nFloatingWindow.displayName = '@mantine/core/FloatingWindow';\nFloatingWindow.classes = classes;\n"],"mappings":";;;;;;;;;;;;;AAiDA,MAAM,eAAe;CACnB,qBAAqB;CACrB,QAAQA,4BAAAA,iBAAiB,UAAU;CACpC;AAED,MAAa,iBAAiBC,gBAAAA,SAAgC,WAAW;CACvE,MAAM,QAAQC,kBAAAA,SAAS,kBAAkB,cAAc,OAAO;CAC9D,MAAM,EACJ,YACA,WACA,OACA,QACA,UACA,MACA,KACA,SACA,qBACA,iBACA,oBACA,2BACA,MACA,iBACA,kBACA,aACA,WACA,gBACA,cACA,aACA,QACA,KACA,GAAG,WACD;CAEJ,MAAM,YAAYC,mBAAAA,UAAiC;EACjD,MAAM;EACN,SAAA,8BAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;CAEF,MAAM,kBAAA,GAAA,eAAA,mBAAmC;EACvC;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,EAAA,GAAA,MAAA,qBAAoB,sBAAsB,eAAe,aAAa,CACpE,eAAe,YAChB,CAAC;AAEF,QACE,iBAAA,GAAA,kBAAA,KAACC,uBAAAA,gBAAD;EAA8B;EAAc,GAAI;YAC9C,iBAAA,GAAA,kBAAA,KAACC,cAAAA,OAAD;GACE,MAAA,GAAA,eAAA,cAAkB,KAAK,eAAe,IAAI;GAC1C,KAAK,CAAC,EAAE,UAAU,eAAe,YAAY,EAAE,IAAI;GACnD,GAAI,UAAU,OAAO;GACrB,GAAI;GACJ,QAAQ,EAAE,6BAA6B,OAAO,UAAU,EAAE;GAC1D,CAAA;EACa,CAAA;EAEnB;AAEF,eAAe,cAAc;AAC7B,eAAe,UAAUC,8BAAAA"}