react-modal-sheet 1.7.0 → 1.8.1
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/README.md +25 -23
- package/dist/react-modal-sheet.cjs.development.js +38 -25
- package/dist/react-modal-sheet.cjs.development.js.map +1 -1
- package/dist/react-modal-sheet.cjs.production.min.js +1 -1
- package/dist/react-modal-sheet.cjs.production.min.js.map +1 -1
- package/dist/react-modal-sheet.esm.js +39 -26
- package/dist/react-modal-sheet.esm.js.map +1 -1
- package/dist/sheet.d.ts +1 -0
- package/dist/types.d.ts +5 -3
- package/package.json +1 -1
- package/src/SheetContainer.tsx +6 -8
- package/src/SheetContent.tsx +3 -2
- package/src/SheetHeader.tsx +3 -2
- package/src/sheet.tsx +15 -7
- package/src/types.tsx +5 -2
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-modal-sheet.cjs.production.min.js","sources":["../src/constants.ts","../src/utils.ts","../src/hooks.tsx","../src/context.tsx","../src/styles.ts","../src/sheet.tsx","../src/SheetContainer.tsx","../src/SheetContent.tsx","../src/SheetHeader.tsx","../src/SheetBackdrop.tsx","../src/index.tsx"],"sourcesContent":["export const MAX_HEIGHT = 'calc(100% - env(safe-area-inset-top) - 34px)';\n\nexport const IS_SSR = typeof window === 'undefined';\n\nexport const DEFAULT_SPRING_CONFIG = {\n stiffness: 300,\n damping: 30,\n mass: 0.2,\n};\n\nexport const DRAG_CLOSE_THRESHOLD = 0.6;\n\nexport const DRAG_VELOCITY_THRESHOLD = 500;\n","export function getClosest(nums: number[], goal: number) {\n return nums.reduce((prev, curr) => {\n return Math.abs(curr - goal) < Math.abs(prev - goal) ? curr : prev;\n });\n}\n\nconst highlightId = 'react-modal-sheet-highlight';\n\nexport function applyRootStyles(rootId: string) {\n const body = document.querySelector('body') as HTMLBodyElement;\n const root = document.querySelector(`#${rootId}`) as HTMLDivElement;\n\n if (root) {\n const p = 24;\n const h = window.innerHeight;\n const s = (h - p) / h;\n body.style.backgroundColor = '#000';\n root.style.overflow = 'hidden';\n root.style.willChange = 'transform';\n root.style.transition = 'transform 200ms linear';\n root.style.transform = `translateY(calc(env(safe-area-inset-top) + ${p / 2}px)) scale(${s})`; // prettier-ignore\n root.style.borderTopRightRadius = '10px';\n root.style.borderTopLeftRadius = '10px';\n\n // Add highlighed overlay to emphasize the modality effect\n const highlight = document.createElement('div');\n highlight.setAttribute('aria-hidden', 'true');\n highlight.id = highlightId;\n highlight.style.position = 'absolute';\n highlight.style.top = '0px';\n highlight.style.left = '0px';\n highlight.style.bottom = '0px';\n highlight.style.right = '0px';\n highlight.style.opacity = '0';\n highlight.style.transition = 'opacity 200ms linear';\n highlight.style.backgroundColor = 'rgba(150, 150, 150, 0.1)';\n\n root.appendChild(highlight);\n requestAnimationFrame(() => (highlight.style.opacity = '1'));\n }\n}\n\nexport function cleanupRootStyles(rootId: string) {\n const body = document.querySelector('body') as HTMLBodyElement;\n const root = document.getElementById(rootId) as HTMLDivElement;\n const highlight = document.getElementById(highlightId) as HTMLDivElement;\n\n function onTransitionEnd() {\n root.style.removeProperty('overflow');\n root.style.removeProperty('will-change');\n root.style.removeProperty('transition');\n body.style.removeProperty('background-color');\n root.removeEventListener('transitionend', onTransitionEnd);\n highlight.parentNode?.removeChild(highlight);\n }\n\n if (root && highlight) {\n // Start animating back\n root.style.removeProperty('border-top-right-radius');\n root.style.removeProperty('border-top-left-radius');\n root.style.removeProperty('transform');\n highlight.style.opacity = '0';\n\n // Remove temp properties after animation is finished\n root.addEventListener('transitionend', onTransitionEnd);\n }\n}\n\nexport function inDescendingOrder(arr: number[]) {\n for (let i = 0; i < arr.length; i++) {\n if (arr[i + 1] > arr[i]) return false;\n }\n\n return true;\n}\n\nexport function validateSnapTo({\n snapTo,\n sheetHeight,\n}: {\n snapTo: number;\n sheetHeight: number;\n}) {\n if (snapTo < 0) {\n console.warn(\n `Snap point is out of bounds. Sheet height is ${sheetHeight} but snap point is ${sheetHeight +\n Math.abs(snapTo)}.`\n );\n }\n\n return Math.max(Math.round(snapTo), 0);\n}\n","import * as React from 'react';\n\nimport { IS_SSR } from './constants';\nimport { SheetEvents } from './types';\nimport { applyRootStyles, cleanupRootStyles } from './utils';\n\nexport const useIsomorphicLayoutEffect = IS_SSR\n ? React.useEffect\n : React.useLayoutEffect;\n\nexport const useModalEffect = (isOpen: boolean, rootId?: string) => {\n const prevOpen = usePrevious(isOpen);\n\n // Automatically apply the iOS modal effect to the body when sheet opens/closes\n React.useEffect(() => {\n if (rootId && !prevOpen && isOpen) {\n applyRootStyles(rootId);\n } else if (rootId && !isOpen && prevOpen) {\n cleanupRootStyles(rootId);\n }\n }, [isOpen, prevOpen]); // eslint-disable-line\n\n // Make sure to cleanup modal styles on unmount\n React.useEffect(() => {\n return () => {\n if (rootId && isOpen) cleanupRootStyles(rootId);\n };\n }, [isOpen]); // eslint-disable-line\n};\n\nexport const useEventCallbacks = (\n isOpen: boolean,\n callbacks: React.MutableRefObject<SheetEvents>\n) => {\n const prevOpen = usePrevious(isOpen);\n const didOpen = React.useRef(false);\n\n // Because of AnimatePrecence we don't have access to latest isOpen value\n // so we need to read and write to a ref to determine if we are\n // opening or closing the sheet\n const handleAnimationComplete = React.useCallback(() => {\n if (!didOpen.current) {\n callbacks.current.onOpenEnd?.();\n didOpen.current = true;\n } else {\n callbacks.current.onCloseEnd?.();\n didOpen.current = false;\n }\n }, [isOpen, prevOpen]); // eslint-disable-line\n\n React.useEffect(() => {\n if (!prevOpen && isOpen) {\n callbacks.current.onOpenStart?.();\n } else if (!isOpen && prevOpen) {\n callbacks.current.onCloseStart?.();\n }\n }, [isOpen, prevOpen]); // eslint-disable-line\n\n return { handleAnimationComplete };\n};\n\nexport function useWindowHeight() {\n const [windowHeight, setWindowHeight] = React.useState(0);\n\n useIsomorphicLayoutEffect(() => {\n const updateHeight = () => setWindowHeight(window.innerHeight);\n window.addEventListener('resize', updateHeight);\n updateHeight();\n return () => window.removeEventListener('resize', updateHeight);\n }, []);\n\n return windowHeight;\n}\n\nexport function usePrevious<T>(state: T): T | undefined {\n const ref = React.useRef<T>();\n\n React.useEffect(() => {\n ref.current = state;\n });\n\n return ref.current;\n}\n\n// Userland version of the `useEvent` React hook:\n// RFC: https://github.com/reactjs/rfcs/blob/useevent/text/0000-useevent.md\nexport function useEvent<T extends (...args: any[]) => any>(handler: T) {\n const handlerRef = React.useRef<T>();\n\n useIsomorphicLayoutEffect(() => {\n handlerRef.current = handler;\n });\n\n return React.useCallback((...args: any[]) => {\n const fn = handlerRef.current;\n return fn?.(...args);\n }, []) as T;\n}\n","import * as React from 'react';\nimport { SheetContextType } from './types';\n\nexport const SheetContext = React.createContext<SheetContextType | undefined>(\n undefined\n);\n\nexport const useSheetContext = () => {\n const context = React.useContext(SheetContext);\n if (!context) throw Error('Sheet context error');\n return context;\n};\n","import * as CSS from 'csstype';\n\nconst styles: { [key: string]: CSS.Properties } = {\n wrapper: {\n position: 'fixed',\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n zIndex: 9999999,\n overflow: 'hidden',\n pointerEvents: 'none',\n },\n backdrop: {\n zIndex: 1,\n position: 'fixed',\n top: 0,\n left: 0,\n width: '100%',\n height: '100%',\n backgroundColor: 'rgba(51, 51, 51, 0.5)',\n touchAction: 'none', // Disable iOS body scrolling\n },\n container: {\n zIndex: 2,\n position: 'absolute',\n left: 0,\n bottom: 0,\n width: '100%',\n backgroundColor: '#fff',\n borderTopRightRadius: '8px',\n borderTopLeftRadius: '8px',\n boxShadow: '0px -2px 16px rgba(0, 0, 0, 0.3)',\n display: 'flex',\n flexDirection: 'column',\n pointerEvents: 'auto',\n },\n headerWrapper: {\n width: '100%',\n },\n header: {\n height: '40px',\n width: '100%',\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n },\n indicator: {\n width: '18px',\n height: '4px',\n borderRadius: '99px',\n backgroundColor: '#ddd',\n },\n content: {\n flex: 1,\n overflow: 'auto',\n position: 'relative',\n },\n};\n\nexport default styles;\n","import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { usePreventScroll } from '@react-aria/overlays';\n\nimport {\n animate,\n AnimatePresence,\n PanInfo,\n useMotionValue,\n} from 'framer-motion';\n\nimport {\n useModalEffect,\n useWindowHeight,\n useIsomorphicLayoutEffect,\n useEvent,\n} from './hooks';\n\nimport {\n DEFAULT_SPRING_CONFIG,\n DRAG_CLOSE_THRESHOLD,\n DRAG_VELOCITY_THRESHOLD,\n IS_SSR,\n} from './constants';\n\nimport { SheetContextType, SheetProps } from './types';\nimport { SheetContext } from './context';\nimport { getClosest, inDescendingOrder, validateSnapTo } from './utils';\nimport styles from './styles';\n\nconst Sheet = React.forwardRef<any, SheetProps>(\n (\n {\n onOpenStart,\n onOpenEnd,\n onClose,\n onCloseStart,\n onCloseEnd,\n onSnap,\n children,\n isOpen,\n snapPoints,\n detent,\n initialSnap = 0,\n rootId,\n mountPoint,\n springConfig = DEFAULT_SPRING_CONFIG,\n disableDrag = false,\n style,\n ...rest\n },\n ref\n ) => {\n const sheetRef = React.useRef<any>(null);\n const indicatorRotation = useMotionValue(0);\n const windowHeight = useWindowHeight();\n\n // NOTE: the inital value for `y` doesn't matter since it is overwritten by\n // the value driven by the `AnimatePresence` component when the sheet is opened\n // and after that it is driven by the gestures and/or snapping\n const y = useMotionValue(0);\n\n // Keep the callback fns up-to-date so that they can be accessed inside\n // the effect without including them to the dependencies array\n const callbacks = React.useRef({\n onOpenStart,\n onOpenEnd,\n onCloseStart,\n onCloseEnd,\n });\n\n useIsomorphicLayoutEffect(() => {\n callbacks.current = {\n onOpenStart,\n onOpenEnd,\n onCloseStart,\n onCloseEnd,\n };\n });\n\n if (snapPoints) {\n // Convert negative / percentage snap points to absolute values\n snapPoints = snapPoints.map(point => {\n // Percentage values e.g. between 0.0 and 1.0\n if (point > 0 && point <= 1) return Math.round(point * windowHeight);\n return point < 0 ? windowHeight + point : point; // negative values\n });\n\n console.assert(\n inDescendingOrder(snapPoints) || windowHeight === 0,\n `Snap points need to be in descending order got: [${snapPoints}]`\n );\n }\n\n const onDrag = useEvent((_, { delta }: PanInfo) => {\n // Update drag indicator rotation based on drag velocity\n const velocity = y.getVelocity();\n\n if (velocity > 0) indicatorRotation.set(10);\n if (velocity < 0) indicatorRotation.set(-10);\n\n // Make sure user cannot drag beyond the top of the sheet\n y.set(Math.max(y.get() + delta.y, 0));\n });\n\n const onDragEnd = useEvent((_, { velocity }: PanInfo) => {\n if (velocity.y > DRAG_VELOCITY_THRESHOLD) {\n // User flicked the sheet down\n onClose();\n } else {\n const sheetEl = sheetRef.current as HTMLDivElement;\n const sheetHeight = sheetEl.getBoundingClientRect().height;\n const currentY = y.get();\n\n let snapTo = 0;\n\n if (snapPoints) {\n const snapToValues = snapPoints\n .map(p => sheetHeight - p)\n .filter(p => p >= 0); // negative values can occur with `content-height` detent\n\n // Allow snapping to the top of the sheet if detent is set to `content-height`\n if (detent === 'content-height' && !snapToValues.includes(0)) {\n snapToValues.unshift(0);\n }\n\n // Get the closest snap point\n snapTo = getClosest(snapToValues, currentY);\n } else if (currentY / sheetHeight > DRAG_CLOSE_THRESHOLD) {\n // Close if dragged over enough far\n snapTo = sheetHeight;\n }\n\n snapTo = validateSnapTo({ snapTo, sheetHeight });\n\n // Update the spring value so that the sheet is animated to the snap point\n animate(y, snapTo, { type: 'spring', ...springConfig });\n\n if (snapPoints && onSnap) {\n const snapValue = Math.abs(Math.round(snapPoints[0] - snapTo));\n const snapIndex = snapPoints.indexOf(getClosest(snapPoints, snapValue)); // prettier-ignore\n onSnap(snapIndex);\n }\n\n if (snapTo >= sheetHeight) onClose();\n }\n\n // Reset indicator rotation after dragging\n indicatorRotation.set(0);\n });\n\n // Trigger onSnap callback when sheet is opened or closed\n React.useEffect(() => {\n if (!snapPoints || !onSnap) return;\n const snapIndex = isOpen ? initialSnap : snapPoints.length - 1;\n onSnap(snapIndex);\n }, [isOpen]); // eslint-disable-line\n\n React.useImperativeHandle(ref, () => ({\n y,\n snapTo: (snapIndex: number) => {\n const sheetEl = sheetRef.current as HTMLDivElement | null;\n\n if (\n snapPoints &&\n snapPoints[snapIndex] !== undefined &&\n sheetEl !== null\n ) {\n const sheetHeight = sheetEl.getBoundingClientRect().height;\n const snapPoint = snapPoints[snapIndex];\n const snapTo = validateSnapTo({\n snapTo: sheetHeight - snapPoint,\n sheetHeight,\n });\n\n animate(y, snapTo, { type: 'spring', ...springConfig });\n\n if (onSnap) onSnap(snapIndex);\n if (snapTo >= sheetHeight) onClose();\n }\n },\n }));\n\n useModalEffect(isOpen, rootId);\n\n // Framer Motion should handle body scroll locking but it's not working\n // properly on iOS. Scroll locking from React Aria seems to work much better.\n usePreventScroll({ isDisabled: !isOpen });\n\n const dragProps = React.useMemo(() => {\n const dragProps: SheetContextType['dragProps'] = {\n drag: 'y',\n dragElastic: 0,\n dragConstraints: { top: 0, bottom: 0 },\n dragMomentum: false,\n onDrag,\n onDragEnd,\n };\n\n return disableDrag ? undefined : dragProps;\n }, [disableDrag]); // eslint-disable-line\n\n const context: SheetContextType = {\n y,\n sheetRef,\n isOpen,\n initialSnap,\n snapPoints,\n detent,\n indicatorRotation,\n callbacks,\n dragProps,\n windowHeight,\n springConfig,\n };\n\n const sheet = (\n <SheetContext.Provider value={context}>\n <div {...rest} ref={ref} style={{ ...styles.wrapper, ...style }}>\n <AnimatePresence>\n {/* NOTE: AnimatePresence requires us to set keys to children */}\n {isOpen\n ? React.Children.map(children, (child: any, i) =>\n React.cloneElement(child, { key: `sheet-child-${i}` })\n )\n : null}\n </AnimatePresence>\n </div>\n </SheetContext.Provider>\n );\n\n if (IS_SSR) return sheet;\n\n return ReactDOM.createPortal(sheet, mountPoint ?? document.body);\n }\n);\n\nexport default Sheet;\n","import * as React from 'react';\nimport { motion } from 'framer-motion';\nimport mergeRefs from 'react-merge-refs';\n\nimport { SheetContainerProps } from './types';\nimport { useSheetContext } from './context';\nimport { useEventCallbacks } from './hooks';\nimport { MAX_HEIGHT } from './constants';\nimport styles from './styles';\n\nconst SheetContainer = React.forwardRef<any, SheetContainerProps>(\n ({ children, style = {}, ...rest }, ref) => {\n const {\n y,\n isOpen,\n callbacks,\n snapPoints,\n initialSnap = 0,\n sheetRef,\n windowHeight,\n springConfig,\n detent = 'full-height',\n } = useSheetContext();\n\n const { handleAnimationComplete } = useEventCallbacks(isOpen, callbacks);\n const initialY = snapPoints ? snapPoints[0] - snapPoints[initialSnap] : 0;\n const maxSnapHeight = snapPoints ? snapPoints[0] : null;\n\n const height =\n maxSnapHeight !== null\n ? `min(${maxSnapHeight}px, ${MAX_HEIGHT})`\n : MAX_HEIGHT;\n\n return (\n <motion.div\n {...rest}\n ref={mergeRefs([sheetRef, ref])}\n className=\"react-modal-sheet-container\"\n style={{\n ...styles.container,\n ...style,\n ...(detent === 'full-height' && { height }),\n ...(detent === 'content-height' && { maxHeight: height }),\n y,\n }}\n initial={{ y: windowHeight }}\n animate={{\n y: initialY,\n transition: { type: 'spring', ...springConfig },\n }}\n exit={{ y: windowHeight }}\n onAnimationComplete={handleAnimationComplete}\n >\n {children}\n </motion.div>\n );\n }\n);\n\nexport default SheetContainer;\n","import * as React from 'react';\nimport { motion } from 'framer-motion';\n\nimport { SheetDraggableProps } from './types';\nimport { useSheetContext } from './context';\nimport styles from './styles';\n\nconst SheetContent = React.forwardRef<any, SheetDraggableProps>(\n ({ children, style, ...rest }, ref) => {\n const { dragProps } = useSheetContext();\n\n return (\n <motion.div\n {...rest}\n ref={ref}\n className=\"react-modal-sheet-content\"\n style={{ ...styles.content, ...style }}\n {...dragProps}\n >\n {children}\n </motion.div>\n );\n }\n);\n\nexport default SheetContent;\n","import * as React from 'react';\nimport { motion, useTransform } from 'framer-motion';\n\nimport { SheetDraggableProps } from './types';\nimport { useSheetContext } from './context';\nimport styles from './styles';\n\nconst SheetHeader = React.forwardRef<any, SheetDraggableProps>(\n ({ children, style, ...rest }, ref) => {\n const { indicatorRotation, dragProps } = useSheetContext();\n\n const indicator1Transform = useTransform(\n indicatorRotation,\n r => `translateX(2px) rotate(${r}deg)`\n );\n\n const indicator2Transform = useTransform(\n indicatorRotation,\n r => `translateX(-2px) rotate(${-1 * r}deg)`\n );\n\n return (\n <motion.div\n {...rest}\n ref={ref}\n style={{ ...styles.headerWrapper, ...style }}\n {...dragProps}\n >\n {children || (\n <div className=\"react-modal-sheet-header\" style={styles.header}>\n <motion.span\n className=\"react-modal-sheet-drag-indicator\"\n style={{ ...styles.indicator, transform: indicator1Transform }}\n />\n <motion.span\n className=\"react-modal-sheet-drag-indicator\"\n style={{ ...styles.indicator, transform: indicator2Transform }}\n />\n </div>\n )}\n </motion.div>\n );\n }\n);\n\nexport default SheetHeader;\n","import * as React from 'react';\nimport { motion } from 'framer-motion';\n\nimport { SheetBackdropProps } from './types';\nimport styles from './styles';\n\nconst isClickable = (props: any) => !!props.onClick || !!props.onTap;\n\nconst SheetBackdrop = React.forwardRef<any, SheetBackdropProps>(\n ({ style = {}, ...rest }, ref) => {\n const Comp = isClickable(rest) ? motion.button : motion.div;\n const pointerEvents = isClickable(rest) ? 'auto' : 'none';\n\n return (\n <Comp\n {...rest}\n ref={ref}\n className=\"react-modal-sheet-backdrop\"\n style={{ ...styles.backdrop, ...style, pointerEvents }}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n />\n );\n }\n);\n\nexport default SheetBackdrop;\n","import { MotionValue } from 'framer-motion';\n\nimport Sheet from './sheet';\nimport SheetContainer from './SheetContainer';\nimport SheetContent from './SheetContent';\nimport SheetHeader from './SheetHeader';\nimport SheetBackdrop from './SheetBackdrop';\nimport { SheetCompound } from './types';\n\nexport type SheetRef = {\n y: MotionValue<number>;\n snapTo: (index: number) => void;\n};\n\n// HACK: this is needed to get the typing to work properly...\nconst _SheetCompound: any = Sheet;\n_SheetCompound.Container = SheetContainer;\n_SheetCompound.Header = SheetHeader;\n_SheetCompound.Content = SheetContent;\n_SheetCompound.Backdrop = SheetBackdrop;\n\nexport default _SheetCompound as SheetCompound;\n"],"names":["MAX_HEIGHT","IS_SSR","window","DEFAULT_SPRING_CONFIG","stiffness","damping","mass","getClosest","nums","goal","reduce","prev","curr","Math","abs","cleanupRootStyles","rootId","body","document","querySelector","root","getElementById","highlight","style","removeProperty","opacity","addEventListener","onTransitionEnd","removeEventListener","parentNode","removeChild","validateSnapTo","snapTo","sheetHeight","console","warn","max","round","useIsomorphicLayoutEffect","React","usePrevious","state","ref","current","useEvent","handler","handlerRef","fn","args","SheetContext","undefined","useSheetContext","context","Error","styles","wrapper","position","top","bottom","left","right","zIndex","overflow","pointerEvents","backdrop","width","height","backgroundColor","touchAction","container","borderTopRightRadius","borderTopLeftRadius","boxShadow","display","flexDirection","headerWrapper","header","alignItems","justifyContent","indicator","borderRadius","content","flex","Sheet","onOpenStart","onOpenEnd","onClose","onCloseStart","onCloseEnd","onSnap","children","isOpen","snapPoints","detent","initialSnap","mountPoint","springConfig","disableDrag","rest","sheetRef","indicatorRotation","useMotionValue","windowHeight","setWindowHeight","updateHeight","innerHeight","useWindowHeight","y","callbacks","map","point","assert","arr","i","length","inDescendingOrder","onDrag","_","delta","velocity","getVelocity","set","get","onDragEnd","getBoundingClientRect","currentY","snapToValues","p","filter","includes","unshift","animate","type","snapValue","snapIndex","indexOf","sheetEl","prevOpen","h","s","willChange","transition","transform","createElement","setAttribute","id","appendChild","requestAnimationFrame","applyRootStyles","useModalEffect","usePreventScroll","isDisabled","dragProps","drag","dragElastic","dragConstraints","dragMomentum","sheet","Provider","value","AnimatePresence","child","key","ReactDOM","SheetContainer","handleAnimationComplete","didOpen","useEventCallbacks","initialY","maxSnapHeight","motion","div","mergeRefs","className","maxHeight","initial","exit","onAnimationComplete","SheetContent","SheetHeader","indicator1Transform","useTransform","r","indicator2Transform","span","isClickable","props","onClick","onTap","SheetBackdrop","Comp","button","_SheetCompound","Container","Header","Content","Backdrop"],"mappings":"qlBAAO,IAAMA,EAAa,+CAEbC,EAA2B,oBAAXC,OAEhBC,EAAwB,CACnCC,UAAW,IACXC,QAAS,GACTC,KAAM,aCPQC,EAAWC,EAAgBC,UAClCD,EAAKE,QAAO,SAACC,EAAMC,UACjBC,KAAKC,IAAIF,EAAOH,GAAQI,KAAKC,IAAIH,EAAOF,GAAQG,EAAOD,cAwClDI,EAAkBC,OAC1BC,EAAOC,SAASC,cAAc,QAC9BC,EAAOF,SAASG,eAAeL,GAC/BM,EAAYJ,SAASG,eAvCT,+BAkDdD,GAAQE,IAEVF,EAAKG,MAAMC,eAAe,2BAC1BJ,EAAKG,MAAMC,eAAe,0BAC1BJ,EAAKG,MAAMC,eAAe,aAC1BF,EAAUC,MAAME,QAAU,IAG1BL,EAAKM,iBAAiB,0BAjBfC,UACPP,EAAKG,MAAMC,eAAe,YAC1BJ,EAAKG,MAAMC,eAAe,eAC1BJ,EAAKG,MAAMC,eAAe,cAC1BP,EAAKM,MAAMC,eAAe,oBAC1BJ,EAAKQ,oBAAoB,gBAAiBD,YAC1CL,EAAUO,eAAYC,YAAYR,gBAuBtBS,SACdC,IAAAA,OACAC,IAAAA,mBAKID,EAAS,GACXE,QAAQC,qDAC0CF,yBAAiCA,EAC/EpB,KAAKC,IAAIkB,SAIRnB,KAAKuB,IAAIvB,KAAKwB,MAAML,GAAS,OCpFzBM,EAA4BrC,EACrCsC,YACAA,2BAkEYC,EAAeC,OACvBC,EAAMH,kBAEZA,aAAgB,WACdG,EAAIC,QAAUF,KAGTC,EAAIC,iBAKGC,EAA4CC,OACpDC,EAAaP,kBAEnBD,GAA0B,WACxBQ,EAAWH,QAAUE,KAGhBN,eAAkB,mBACjBQ,EAAKD,EAAWH,2BADKK,2BAAAA,+BAEpBD,SAAAA,eAAQC,KACd,IC7FE,IAAMC,EAAeV,qBAC1BW,GAGWC,EAAkB,eACvBC,EAAUb,aAAiBU,OAC5BG,EAAS,MAAMC,MAAM,8BACnBD,GCRHE,EAA4C,CAChDC,QAAS,CACPC,SAAU,QACVC,IAAK,EACLC,OAAQ,EACRC,KAAM,EACNC,MAAO,EACPC,OAAQ,QACRC,SAAU,SACVC,cAAe,QAEjBC,SAAU,CACRH,OAAQ,EACRL,SAAU,QACVC,IAAK,EACLE,KAAM,EACNM,MAAO,OACPC,OAAQ,OACRC,gBAAiB,wBACjBC,YAAa,QAEfC,UAAW,CACTR,OAAQ,EACRL,SAAU,WACVG,KAAM,EACND,OAAQ,EACRO,MAAO,OACPE,gBAAiB,OACjBG,qBAAsB,MACtBC,oBAAqB,MACrBC,UAAW,mCACXC,QAAS,OACTC,cAAe,SACfX,cAAe,QAEjBY,cAAe,CACbV,MAAO,QAETW,OAAQ,CACNV,OAAQ,OACRD,MAAO,OACPT,SAAU,WACViB,QAAS,OACTI,WAAY,SACZC,eAAgB,UAElBC,UAAW,CACTd,MAAO,OACPC,OAAQ,MACRc,aAAc,OACdb,gBAAiB,QAEnBc,QAAS,CACPC,KAAM,EACNpB,SAAU,OACVN,SAAU,aC3BR2B,EAAQ5C,cACZ,WAoBEG,OAlBE0C,IAAAA,YACAC,IAAAA,UACAC,IAAAA,QACAC,IAAAA,aACAC,IAAAA,WACAC,IAAAA,OACAC,IAAAA,SACAC,IAAAA,OACAC,IAAAA,WACAC,IAAAA,WACAC,YAAAA,aAAc,IACd9E,IAAAA,OACA+E,IAAAA,eACAC,aAAAA,aAAe7F,QACf8F,YAAAA,gBACA1E,IAAAA,MACG2E,qMAICC,EAAW5D,SAAkB,MAC7B6D,EAAoBC,iBAAe,GACnCC,EHMV,iBAC0C/D,WAAe,GAAhD+D,OAAcC,cAErBjE,GAA0B,eAClBkE,EAAe,kBAAMD,EAAgBrG,OAAOuG,qBAClDvG,OAAOwB,iBAAiB,SAAU8E,GAClCA,IACO,kBAAMtG,OAAO0B,oBAAoB,SAAU4E,MACjD,IAEIF,EGhBgBI,GAKfC,EAAIN,iBAAe,GAInBO,EAAYrE,SAAa,CAC7B6C,YAAAA,EACAC,UAAAA,EACAE,aAAAA,EACAC,WAAAA,IAGFlD,GAA0B,WACxBsE,EAAUjE,QAAU,CAClByC,YAAAA,EACAC,UAAAA,EACAE,aAAAA,EACAC,WAAAA,MAIAI,IAEFA,EAAaA,EAAWiB,KAAI,SAAAC,UAEtBA,EAAQ,GAAKA,GAAS,EAAUjG,KAAKwB,MAAMyE,EAAQR,GAChDQ,EAAQ,EAAIR,EAAeQ,EAAQA,KAG5C5E,QAAQ6E,gBJpBoBC,OAC3B,IAAIC,EAAI,EAAGA,EAAID,EAAIE,OAAQD,OAC1BD,EAAIC,EAAI,GAAKD,EAAIC,GAAI,OAAO,SAG3B,EIgBDE,CAAkBvB,IAAgC,IAAjBU,sDACmBV,YAIlDwB,EAASxE,GAAS,SAACyE,SAAKC,IAAAA,MAEtBC,EAAWZ,EAAEa,cAEfD,EAAW,GAAGnB,EAAkBqB,IAAI,IACpCF,EAAW,GAAGnB,EAAkBqB,KAAK,IAGzCd,EAAEc,IAAI5G,KAAKuB,IAAIuE,EAAEe,MAAQJ,EAAMX,EAAG,OAG9BgB,EAAY/E,GAAS,SAACyE,UAAKE,SAClBZ,EL9FoB,IKgG/BrB,QACK,KAECrD,EADUkE,EAASxD,QACGiF,wBAAwB1D,OAC9C2D,EAAWlB,EAAEe,MAEf1F,EAAS,KAET4D,EAAY,KACRkC,EAAelC,EAClBiB,KAAI,SAAAkB,UAAK9F,EAAc8F,KACvBC,QAAO,SAAAD,UAAKA,GAAK,KAGL,mBAAXlC,GAAgCiC,EAAaG,SAAS,IACxDH,EAAaI,QAAQ,GAIvBlG,EAASzB,EAAWuH,EAAcD,QACzBA,EAAW5F,ELtHM,KKwH1BD,EAASC,MAGXD,EAASD,EAAe,CAAEC,OAAAA,EAAQC,YAAAA,IAGlCkG,UAAQxB,EAAG3E,KAAUoG,KAAM,UAAapC,IAEpCJ,GAAcH,EAAQ,KAClB4C,EAAYxH,KAAKC,IAAID,KAAKwB,MAAMuD,EAAW,GAAK5D,IAChDsG,EAAY1C,EAAW2C,QAAQhI,EAAWqF,EAAYyC,IAC5D5C,EAAO6C,GAGLtG,GAAUC,GAAaqD,IAI7Bc,EAAkBqB,IAAI,MAIxBlF,aAAgB,WACTqD,GAAeH,GAEpBA,EADkBE,EAASG,EAAcF,EAAWsB,OAAS,KAE5D,CAACvB,IAEJpD,sBAA0BG,GAAK,iBAAO,CACpCiE,EAAAA,EACA3E,OAAQ,SAACsG,OACDE,EAAUrC,EAASxD,WAGvBiD,QAC0B1C,IAA1B0C,EAAW0C,IACC,OAAZE,EACA,KACMvG,EAAcuG,EAAQZ,wBAAwB1D,OAE9ClC,EAASD,EAAe,CAC5BC,OAAQC,EAFQ2D,EAAW0C,GAG3BrG,YAAAA,IAGFkG,UAAQxB,EAAG3E,KAAUoG,KAAM,UAAapC,IAEpCP,GAAQA,EAAO6C,GACftG,GAAUC,GAAaqD,UHxKP,SAACK,EAAiB3E,OACxCyH,EAAWjG,EAAYmD,GAG7BpD,aAAgB,WACVvB,IAAWyH,GAAY9C,WDPC3E,OACxBC,EAAOC,SAASC,cAAc,QAC9BC,EAAOF,SAASC,kBAAkBH,MAEpCI,EAAM,KAEFsH,EAAIxI,OAAOuG,YACXkC,GAAKD,EAFD,IAEUA,EACpBzH,EAAKM,MAAM4C,gBAAkB,OAC7B/C,EAAKG,MAAMuC,SAAW,SACtB1C,EAAKG,MAAMqH,WAAa,YACxBxH,EAAKG,MAAMsH,WAAa,yBACxBzH,EAAKG,MAAMuH,qEAA6EH,MACxFvH,EAAKG,MAAM+C,qBAAuB,OAClClD,EAAKG,MAAMgD,oBAAsB,WAG3BjD,EAAYJ,SAAS6H,cAAc,OACzCzH,EAAU0H,aAAa,cAAe,QACtC1H,EAAU2H,GArBM,8BAsBhB3H,EAAUC,MAAMiC,SAAW,WAC3BlC,EAAUC,MAAMkC,IAAM,MACtBnC,EAAUC,MAAMoC,KAAO,MACvBrC,EAAUC,MAAMmC,OAAS,MACzBpC,EAAUC,MAAMqC,MAAQ,MACxBtC,EAAUC,MAAME,QAAU,IAC1BH,EAAUC,MAAMsH,WAAa,uBAC7BvH,EAAUC,MAAM4C,gBAAkB,2BAElC/C,EAAK8H,YAAY5H,GACjB6H,uBAAsB,kBAAO7H,EAAUC,MAAME,QAAU,QCtBrD2H,CAAgBpI,GACPA,IAAW2E,GAAU8C,GAC9B1H,EAAkBC,KAEnB,CAAC2E,EAAQ8C,IAGZlG,aAAgB,kBACP,WACDvB,GAAU2E,GAAQ5E,EAAkBC,MAEzC,CAAC2E,IG4JF0D,CAAe1D,EAAQ3E,GAIvBsI,mBAAiB,CAAEC,YAAa5D,QAE1B6D,EAAYjH,WAAc,kBAUvB0D,OAAc/C,EAT4B,CAC/CuG,KAAM,IACNC,YAAa,EACbC,gBAAiB,CAAElG,IAAK,EAAGC,OAAQ,GACnCkG,cAAc,EACdxC,OAAAA,EACAO,UAAAA,KAID,CAAC1B,IAgBE4D,EACJtH,gBAACU,EAAa6G,UAASC,MAfS,CAChCpD,EAAAA,EACAR,SAAAA,EACAR,OAAAA,EACAG,YAAAA,EACAF,WAAAA,EACAC,OAAAA,EACAO,kBAAAA,EACAQ,UAAAA,EACA4C,UAAAA,EACAlD,aAAAA,EACAN,aAAAA,IAKEzD,uCAAS2D,GAAMxD,IAAKA,EAAKnB,WAAY+B,EAAOC,QAAYhC,KACtDgB,gBAACyH,uBAEErE,EACGpD,WAAesE,IAAInB,GAAU,SAACuE,EAAYhD,UACxC1E,eAAmB0H,EAAO,CAAEC,mBAAoBjD,OAElD,eAMRhH,EAAe4J,EAEZM,eAAsBN,QAAO9D,EAAAA,EAAc7E,SAASD,SC/NzDmJ,EAAiB7H,cACrB,WAAoCG,OAAjCgD,IAAAA,aAAUnE,MAAAA,aAAQ,KAAO2E,8BAWtB/C,IATFwD,IAAAA,EAGAf,IAAAA,eACAE,YAAAA,aAAc,IACdK,IAAAA,SACAG,IAAAA,aACAN,IAAAA,iBACAH,OAAAA,aAAS,gBAGHwE,EJMqB,SAC/B1E,EACAiB,OAEM6B,EAAWjG,EAAYmD,GACvB2E,EAAU/H,UAAa,GAKvB8H,EAA0B9H,eAAkB,WAC3C+H,EAAQ3H,eAIXiE,EAAUjE,QAAQ6C,YAAlBoB,EAAUjE,QAAQ6C,aAClB8E,EAAQ3H,SAAU,UAJlBiE,EAAUjE,QAAQ0C,WAAlBuB,EAAUjE,QAAQ0C,YAClBiF,EAAQ3H,SAAU,KAKnB,CAACgD,EAAQ8C,WAEZlG,aAAgB,YACTkG,GAAY9C,QACfiB,EAAUjE,QAAQyC,aAAlBwB,EAAUjE,QAAQyC,eACRO,GAAU8C,UACpB7B,EAAUjE,QAAQ4C,cAAlBqB,EAAUjE,QAAQ4C,kBAEnB,CAACI,EAAQ8C,IAEL,CAAE4B,wBAAAA,GIlC6BE,GAVlC5E,SACAiB,WASMyD,wBACFG,EAAW5E,EAAaA,EAAW,GAAKA,EAAWE,GAAe,EAClE2E,EAAgB7E,EAAaA,EAAW,GAAK,KAE7C1B,EACc,OAAlBuG,SACWA,SAAoBzK,MAC3BA,SAGJuC,gBAACmI,SAAOC,qBACFzE,GACJxD,IAAKkI,EAAU,CAACzE,EAAUzD,IAC1BmI,UAAU,8BACVtJ,WACK+B,EAAOe,UACP9C,EACY,gBAAXsE,GAA4B,CAAE3B,OAAAA,GACnB,mBAAX2B,GAA+B,CAAEiF,UAAW5G,IAChDyC,EAAAA,IAEFoE,QAAS,CAAEpE,EAAGL,GACd6B,QAAS,CACPxB,EAAG6D,EACH3B,cAAcT,KAAM,UAAapC,IAEnCgF,KAAM,CAAErE,EAAGL,GACX2E,oBAAqBZ,IAEpB3E,MC9CHwF,EAAe3I,cACnB,WAA+BG,OAA5BgD,IAAAA,SAAUnE,IAAAA,MAAU2E,4BACbsD,EAAcrG,IAAdqG,iBAGNjH,gBAACmI,SAAOC,qBACFzE,GACJxD,IAAKA,EACLmI,UAAU,4BACVtJ,WAAY+B,EAAO2B,QAAY1D,IAC3BiI,GAEH9D,MCZHyF,EAAc5I,cAClB,WAA+BG,OAA5BgD,IAAAA,SAAUnE,IAAAA,MAAU2E,8BACoB/C,IAAjCiD,IAAAA,kBAAmBoD,IAAAA,UAErB4B,EAAsBC,eAC1BjF,GACA,SAAAkF,mCAA+BA,YAG3BC,EAAsBF,eAC1BjF,GACA,SAAAkF,qCAAiC,EAAIA,mBAIrC/I,gBAACmI,SAAOC,qBACFzE,GACJxD,IAAKA,EACLnB,WAAY+B,EAAOqB,cAAkBpD,IACjCiI,GAEH9D,GACCnD,uBAAKsI,UAAU,2BAA2BtJ,MAAO+B,EAAOsB,QACtDrC,gBAACmI,SAAOc,MACNX,UAAU,mCACVtJ,WAAY+B,EAAOyB,WAAW+D,UAAWsC,MAE3C7I,gBAACmI,SAAOc,MACNX,UAAU,mCACVtJ,WAAY+B,EAAOyB,WAAW+D,UAAWyC,WC9BjDE,EAAc,SAACC,WAAiBA,EAAMC,WAAaD,EAAME,OAEzDC,EAAgBtJ,cACpB,WAA0BG,WAAvBnB,MAAAA,aAAQ,KAAO2E,iBACV4F,EAAOL,EAAYvF,GAAQwE,SAAOqB,OAASrB,SAAOC,IAClD5G,EAAgB0H,EAAYvF,GAAQ,OAAS,cAGjD3D,gBAACuJ,mBACK5F,GACJxD,IAAKA,EACLmI,UAAU,6BACVtJ,WAAY+B,EAAOU,SAAazC,GAAOwC,cAAAA,IACvCgH,QAAS,CAAEtJ,QAAS,GACpB0G,QAAS,CAAE1G,QAAS,GACpBuJ,KAAM,CAAEvJ,QAAS,SCNnBuK,EAAsB7G,EAC5B6G,EAAeC,UAAY7B,EAC3B4B,EAAeE,OAASf,EACxBa,EAAeG,QAAUjB,EACzBc,EAAeI,SAAWP"}
|
|
1
|
+
{"version":3,"file":"react-modal-sheet.cjs.production.min.js","sources":["../src/constants.ts","../src/utils.ts","../src/hooks.tsx","../src/context.tsx","../src/styles.ts","../src/sheet.tsx","../src/SheetContainer.tsx","../src/SheetContent.tsx","../src/SheetHeader.tsx","../src/SheetBackdrop.tsx","../src/index.tsx"],"sourcesContent":["export const MAX_HEIGHT = 'calc(100% - env(safe-area-inset-top) - 34px)';\n\nexport const IS_SSR = typeof window === 'undefined';\n\nexport const DEFAULT_SPRING_CONFIG = {\n stiffness: 300,\n damping: 30,\n mass: 0.2,\n};\n\nexport const DRAG_CLOSE_THRESHOLD = 0.6;\n\nexport const DRAG_VELOCITY_THRESHOLD = 500;\n","export function getClosest(nums: number[], goal: number) {\n return nums.reduce((prev, curr) => {\n return Math.abs(curr - goal) < Math.abs(prev - goal) ? curr : prev;\n });\n}\n\nconst highlightId = 'react-modal-sheet-highlight';\n\nexport function applyRootStyles(rootId: string) {\n const body = document.querySelector('body') as HTMLBodyElement;\n const root = document.querySelector(`#${rootId}`) as HTMLDivElement;\n\n if (root) {\n const p = 24;\n const h = window.innerHeight;\n const s = (h - p) / h;\n body.style.backgroundColor = '#000';\n root.style.overflow = 'hidden';\n root.style.willChange = 'transform';\n root.style.transition = 'transform 200ms linear';\n root.style.transform = `translateY(calc(env(safe-area-inset-top) + ${p / 2}px)) scale(${s})`; // prettier-ignore\n root.style.borderTopRightRadius = '10px';\n root.style.borderTopLeftRadius = '10px';\n\n // Add highlighed overlay to emphasize the modality effect\n const highlight = document.createElement('div');\n highlight.setAttribute('aria-hidden', 'true');\n highlight.id = highlightId;\n highlight.style.position = 'absolute';\n highlight.style.top = '0px';\n highlight.style.left = '0px';\n highlight.style.bottom = '0px';\n highlight.style.right = '0px';\n highlight.style.opacity = '0';\n highlight.style.transition = 'opacity 200ms linear';\n highlight.style.backgroundColor = 'rgba(150, 150, 150, 0.1)';\n\n root.appendChild(highlight);\n requestAnimationFrame(() => (highlight.style.opacity = '1'));\n }\n}\n\nexport function cleanupRootStyles(rootId: string) {\n const body = document.querySelector('body') as HTMLBodyElement;\n const root = document.getElementById(rootId) as HTMLDivElement;\n const highlight = document.getElementById(highlightId) as HTMLDivElement;\n\n function onTransitionEnd() {\n root.style.removeProperty('overflow');\n root.style.removeProperty('will-change');\n root.style.removeProperty('transition');\n body.style.removeProperty('background-color');\n root.removeEventListener('transitionend', onTransitionEnd);\n highlight.parentNode?.removeChild(highlight);\n }\n\n if (root && highlight) {\n // Start animating back\n root.style.removeProperty('border-top-right-radius');\n root.style.removeProperty('border-top-left-radius');\n root.style.removeProperty('transform');\n highlight.style.opacity = '0';\n\n // Remove temp properties after animation is finished\n root.addEventListener('transitionend', onTransitionEnd);\n }\n}\n\nexport function inDescendingOrder(arr: number[]) {\n for (let i = 0; i < arr.length; i++) {\n if (arr[i + 1] > arr[i]) return false;\n }\n\n return true;\n}\n\nexport function validateSnapTo({\n snapTo,\n sheetHeight,\n}: {\n snapTo: number;\n sheetHeight: number;\n}) {\n if (snapTo < 0) {\n console.warn(\n `Snap point is out of bounds. Sheet height is ${sheetHeight} but snap point is ${sheetHeight +\n Math.abs(snapTo)}.`\n );\n }\n\n return Math.max(Math.round(snapTo), 0);\n}\n","import * as React from 'react';\n\nimport { IS_SSR } from './constants';\nimport { SheetEvents } from './types';\nimport { applyRootStyles, cleanupRootStyles } from './utils';\n\nexport const useIsomorphicLayoutEffect = IS_SSR\n ? React.useEffect\n : React.useLayoutEffect;\n\nexport const useModalEffect = (isOpen: boolean, rootId?: string) => {\n const prevOpen = usePrevious(isOpen);\n\n // Automatically apply the iOS modal effect to the body when sheet opens/closes\n React.useEffect(() => {\n if (rootId && !prevOpen && isOpen) {\n applyRootStyles(rootId);\n } else if (rootId && !isOpen && prevOpen) {\n cleanupRootStyles(rootId);\n }\n }, [isOpen, prevOpen]); // eslint-disable-line\n\n // Make sure to cleanup modal styles on unmount\n React.useEffect(() => {\n return () => {\n if (rootId && isOpen) cleanupRootStyles(rootId);\n };\n }, [isOpen]); // eslint-disable-line\n};\n\nexport const useEventCallbacks = (\n isOpen: boolean,\n callbacks: React.MutableRefObject<SheetEvents>\n) => {\n const prevOpen = usePrevious(isOpen);\n const didOpen = React.useRef(false);\n\n // Because of AnimatePrecence we don't have access to latest isOpen value\n // so we need to read and write to a ref to determine if we are\n // opening or closing the sheet\n const handleAnimationComplete = React.useCallback(() => {\n if (!didOpen.current) {\n callbacks.current.onOpenEnd?.();\n didOpen.current = true;\n } else {\n callbacks.current.onCloseEnd?.();\n didOpen.current = false;\n }\n }, [isOpen, prevOpen]); // eslint-disable-line\n\n React.useEffect(() => {\n if (!prevOpen && isOpen) {\n callbacks.current.onOpenStart?.();\n } else if (!isOpen && prevOpen) {\n callbacks.current.onCloseStart?.();\n }\n }, [isOpen, prevOpen]); // eslint-disable-line\n\n return { handleAnimationComplete };\n};\n\nexport function useWindowHeight() {\n const [windowHeight, setWindowHeight] = React.useState(0);\n\n useIsomorphicLayoutEffect(() => {\n const updateHeight = () => setWindowHeight(window.innerHeight);\n window.addEventListener('resize', updateHeight);\n updateHeight();\n return () => window.removeEventListener('resize', updateHeight);\n }, []);\n\n return windowHeight;\n}\n\nexport function usePrevious<T>(state: T): T | undefined {\n const ref = React.useRef<T>();\n\n React.useEffect(() => {\n ref.current = state;\n });\n\n return ref.current;\n}\n\n// Userland version of the `useEvent` React hook:\n// RFC: https://github.com/reactjs/rfcs/blob/useevent/text/0000-useevent.md\nexport function useEvent<T extends (...args: any[]) => any>(handler: T) {\n const handlerRef = React.useRef<T>();\n\n useIsomorphicLayoutEffect(() => {\n handlerRef.current = handler;\n });\n\n return React.useCallback((...args: any[]) => {\n const fn = handlerRef.current;\n return fn?.(...args);\n }, []) as T;\n}\n","import * as React from 'react';\nimport { SheetContextType } from './types';\n\nexport const SheetContext = React.createContext<SheetContextType | undefined>(\n undefined\n);\n\nexport const useSheetContext = () => {\n const context = React.useContext(SheetContext);\n if (!context) throw Error('Sheet context error');\n return context;\n};\n","import * as CSS from 'csstype';\n\nconst styles: { [key: string]: CSS.Properties } = {\n wrapper: {\n position: 'fixed',\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n zIndex: 9999999,\n overflow: 'hidden',\n pointerEvents: 'none',\n },\n backdrop: {\n zIndex: 1,\n position: 'fixed',\n top: 0,\n left: 0,\n width: '100%',\n height: '100%',\n backgroundColor: 'rgba(51, 51, 51, 0.5)',\n touchAction: 'none', // Disable iOS body scrolling\n },\n container: {\n zIndex: 2,\n position: 'absolute',\n left: 0,\n bottom: 0,\n width: '100%',\n backgroundColor: '#fff',\n borderTopRightRadius: '8px',\n borderTopLeftRadius: '8px',\n boxShadow: '0px -2px 16px rgba(0, 0, 0, 0.3)',\n display: 'flex',\n flexDirection: 'column',\n pointerEvents: 'auto',\n },\n headerWrapper: {\n width: '100%',\n },\n header: {\n height: '40px',\n width: '100%',\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n },\n indicator: {\n width: '18px',\n height: '4px',\n borderRadius: '99px',\n backgroundColor: '#ddd',\n },\n content: {\n flex: 1,\n overflow: 'auto',\n position: 'relative',\n },\n};\n\nexport default styles;\n","import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { usePreventScroll } from '@react-aria/overlays';\n\nimport {\n animate,\n AnimatePresence,\n AnimationOptions,\n PanInfo,\n useMotionValue,\n useReducedMotion,\n} from 'framer-motion';\n\nimport {\n useModalEffect,\n useWindowHeight,\n useIsomorphicLayoutEffect,\n useEvent,\n} from './hooks';\n\nimport {\n DEFAULT_SPRING_CONFIG,\n DRAG_CLOSE_THRESHOLD,\n DRAG_VELOCITY_THRESHOLD,\n IS_SSR,\n} from './constants';\n\nimport { SheetContextType, SheetProps } from './types';\nimport { SheetContext } from './context';\nimport { getClosest, inDescendingOrder, validateSnapTo } from './utils';\nimport styles from './styles';\n\nconst Sheet = React.forwardRef<any, SheetProps>(\n (\n {\n onOpenStart,\n onOpenEnd,\n onClose,\n onCloseStart,\n onCloseEnd,\n onSnap,\n children,\n isOpen,\n snapPoints,\n rootId,\n mountPoint,\n style,\n detent = 'full-height',\n initialSnap = 0,\n springConfig = DEFAULT_SPRING_CONFIG,\n disableDrag = false,\n prefersReducedMotion = false,\n ...rest\n },\n ref\n ) => {\n const sheetRef = React.useRef<any>(null);\n const indicatorRotation = useMotionValue(0);\n const windowHeight = useWindowHeight();\n const shouldReduceMotion = useReducedMotion();\n const reduceMotion = Boolean(prefersReducedMotion || shouldReduceMotion);\n const animationOptions: AnimationOptions<number> = reduceMotion\n ? { type: 'tween', duration: 0.01 }\n : { type: 'spring', ...springConfig };\n\n // NOTE: the inital value for `y` doesn't matter since it is overwritten by\n // the value driven by the `AnimatePresence` component when the sheet is opened\n // and after that it is driven by the gestures and/or snapping\n const y = useMotionValue(0);\n\n // Keep the callback fns up-to-date so that they can be accessed inside\n // the effect without including them to the dependencies array\n const callbacks = React.useRef({\n onOpenStart,\n onOpenEnd,\n onCloseStart,\n onCloseEnd,\n });\n\n useIsomorphicLayoutEffect(() => {\n callbacks.current = {\n onOpenStart,\n onOpenEnd,\n onCloseStart,\n onCloseEnd,\n };\n });\n\n if (snapPoints) {\n // Convert negative / percentage snap points to absolute values\n snapPoints = snapPoints.map(point => {\n // Percentage values e.g. between 0.0 and 1.0\n if (point > 0 && point <= 1) return Math.round(point * windowHeight);\n return point < 0 ? windowHeight + point : point; // negative values\n });\n\n console.assert(\n inDescendingOrder(snapPoints) || windowHeight === 0,\n `Snap points need to be in descending order got: [${snapPoints}]`\n );\n }\n\n const onDrag = useEvent((_, { delta }: PanInfo) => {\n // Update drag indicator rotation based on drag velocity\n const velocity = y.getVelocity();\n\n if (velocity > 0) indicatorRotation.set(10);\n if (velocity < 0) indicatorRotation.set(-10);\n\n // Make sure user cannot drag beyond the top of the sheet\n y.set(Math.max(y.get() + delta.y, 0));\n });\n\n const onDragEnd = useEvent((_, { velocity }: PanInfo) => {\n if (velocity.y > DRAG_VELOCITY_THRESHOLD) {\n // User flicked the sheet down\n onClose();\n } else {\n const sheetEl = sheetRef.current as HTMLDivElement;\n const sheetHeight = sheetEl.getBoundingClientRect().height;\n const currentY = y.get();\n\n let snapTo = 0;\n\n if (snapPoints) {\n const snapToValues = snapPoints\n .map(p => sheetHeight - p)\n .filter(p => p >= 0); // negative values can occur with `content-height` detent\n\n // Allow snapping to the top of the sheet if detent is set to `content-height`\n if (detent === 'content-height' && !snapToValues.includes(0)) {\n snapToValues.unshift(0);\n }\n\n // Get the closest snap point\n snapTo = getClosest(snapToValues, currentY);\n } else if (currentY / sheetHeight > DRAG_CLOSE_THRESHOLD) {\n // Close if dragged over enough far\n snapTo = sheetHeight;\n }\n\n snapTo = validateSnapTo({ snapTo, sheetHeight });\n\n // Update the spring value so that the sheet is animated to the snap point\n animate(y, snapTo, animationOptions);\n\n if (snapPoints && onSnap) {\n const snapValue = Math.abs(Math.round(snapPoints[0] - snapTo));\n const snapIndex = snapPoints.indexOf(getClosest(snapPoints, snapValue)); // prettier-ignore\n onSnap(snapIndex);\n }\n\n if (snapTo >= sheetHeight) onClose();\n }\n\n // Reset indicator rotation after dragging\n indicatorRotation.set(0);\n });\n\n // Trigger onSnap callback when sheet is opened or closed\n React.useEffect(() => {\n if (!snapPoints || !onSnap) return;\n const snapIndex = isOpen ? initialSnap : snapPoints.length - 1;\n onSnap(snapIndex);\n }, [isOpen]); // eslint-disable-line\n\n React.useImperativeHandle(ref, () => ({\n y,\n snapTo: (snapIndex: number) => {\n const sheetEl = sheetRef.current as HTMLDivElement | null;\n\n if (\n snapPoints &&\n snapPoints[snapIndex] !== undefined &&\n sheetEl !== null\n ) {\n const sheetHeight = sheetEl.getBoundingClientRect().height;\n const snapPoint = snapPoints[snapIndex];\n const snapTo = validateSnapTo({\n snapTo: sheetHeight - snapPoint,\n sheetHeight,\n });\n\n animate(y, snapTo, animationOptions);\n if (onSnap) onSnap(snapIndex);\n if (snapTo >= sheetHeight) onClose();\n }\n },\n }));\n\n useModalEffect(isOpen, rootId);\n\n // Framer Motion should handle body scroll locking but it's not working\n // properly on iOS. Scroll locking from React Aria seems to work much better.\n usePreventScroll({ isDisabled: !isOpen });\n\n const dragProps = React.useMemo(() => {\n const dragProps: SheetContextType['dragProps'] = {\n drag: 'y',\n dragElastic: 0,\n dragConstraints: { top: 0, bottom: 0 },\n dragMomentum: false,\n onDrag,\n onDragEnd,\n };\n\n return disableDrag ? undefined : dragProps;\n }, [disableDrag]); // eslint-disable-line\n\n const context: SheetContextType = {\n y,\n sheetRef,\n isOpen,\n initialSnap,\n snapPoints,\n detent,\n indicatorRotation,\n callbacks,\n dragProps,\n windowHeight,\n animationOptions,\n reduceMotion,\n };\n\n const sheet = (\n <SheetContext.Provider value={context}>\n <div {...rest} ref={ref} style={{ ...styles.wrapper, ...style }}>\n <AnimatePresence>\n {/* NOTE: AnimatePresence requires us to set keys to children */}\n {isOpen\n ? React.Children.map(children, (child: any, i) =>\n React.cloneElement(child, { key: `sheet-child-${i}` })\n )\n : null}\n </AnimatePresence>\n </div>\n </SheetContext.Provider>\n );\n\n if (IS_SSR) return sheet;\n\n return ReactDOM.createPortal(sheet, mountPoint ?? document.body);\n }\n);\n\nexport default Sheet;\n","import * as React from 'react';\nimport { motion } from 'framer-motion';\nimport mergeRefs from 'react-merge-refs';\n\nimport { SheetContainerProps } from './types';\nimport { useSheetContext } from './context';\nimport { useEventCallbacks } from './hooks';\nimport { MAX_HEIGHT } from './constants';\nimport styles from './styles';\n\nconst SheetContainer = React.forwardRef<any, SheetContainerProps>(\n ({ children, style = {}, ...rest }, ref) => {\n const {\n y,\n isOpen,\n callbacks,\n snapPoints,\n initialSnap = 0,\n sheetRef,\n windowHeight,\n detent,\n animationOptions,\n reduceMotion,\n } = useSheetContext();\n\n const { handleAnimationComplete } = useEventCallbacks(isOpen, callbacks);\n const initialY = snapPoints ? snapPoints[0] - snapPoints[initialSnap] : 0;\n const maxSnapHeight = snapPoints ? snapPoints[0] : null;\n\n const height =\n maxSnapHeight !== null\n ? `min(${maxSnapHeight}px, ${MAX_HEIGHT})`\n : MAX_HEIGHT;\n\n return (\n <motion.div\n {...rest}\n ref={mergeRefs([sheetRef, ref])}\n className=\"react-modal-sheet-container\"\n style={{\n ...styles.container,\n ...style,\n ...(detent === 'full-height' && { height }),\n ...(detent === 'content-height' && { maxHeight: height }),\n y,\n }}\n initial={reduceMotion ? false : { y: windowHeight }}\n animate={{ y: initialY, transition: animationOptions }}\n exit={{ y: windowHeight, transition: animationOptions }}\n onAnimationComplete={handleAnimationComplete}\n >\n {children}\n </motion.div>\n );\n }\n);\n\nexport default SheetContainer;\n","import * as React from 'react';\nimport { motion } from 'framer-motion';\n\nimport { SheetDraggableProps } from './types';\nimport { useSheetContext } from './context';\nimport styles from './styles';\n\nconst SheetContent = React.forwardRef<any, SheetDraggableProps>(\n ({ children, style, disableDrag, ...rest }, ref) => {\n const { dragProps } = useSheetContext();\n const _dragProps = disableDrag ? undefined : dragProps;\n\n return (\n <motion.div\n {...rest}\n ref={ref}\n className=\"react-modal-sheet-content\"\n style={{ ...styles.content, ...style }}\n {..._dragProps}\n >\n {children}\n </motion.div>\n );\n }\n);\n\nexport default SheetContent;\n","import * as React from 'react';\nimport { motion, useTransform } from 'framer-motion';\n\nimport { SheetDraggableProps } from './types';\nimport { useSheetContext } from './context';\nimport styles from './styles';\n\nconst SheetHeader = React.forwardRef<any, SheetDraggableProps>(\n ({ children, style, disableDrag, ...rest }, ref) => {\n const { indicatorRotation, dragProps } = useSheetContext();\n const _dragProps = disableDrag ? undefined : dragProps;\n\n const indicator1Transform = useTransform(\n indicatorRotation,\n r => `translateX(2px) rotate(${r}deg)`\n );\n\n const indicator2Transform = useTransform(\n indicatorRotation,\n r => `translateX(-2px) rotate(${-1 * r}deg)`\n );\n\n return (\n <motion.div\n {...rest}\n ref={ref}\n style={{ ...styles.headerWrapper, ...style }}\n {..._dragProps}\n >\n {children || (\n <div className=\"react-modal-sheet-header\" style={styles.header}>\n <motion.span\n className=\"react-modal-sheet-drag-indicator\"\n style={{ ...styles.indicator, transform: indicator1Transform }}\n />\n <motion.span\n className=\"react-modal-sheet-drag-indicator\"\n style={{ ...styles.indicator, transform: indicator2Transform }}\n />\n </div>\n )}\n </motion.div>\n );\n }\n);\n\nexport default SheetHeader;\n","import * as React from 'react';\nimport { motion } from 'framer-motion';\n\nimport { SheetBackdropProps } from './types';\nimport styles from './styles';\n\nconst isClickable = (props: any) => !!props.onClick || !!props.onTap;\n\nconst SheetBackdrop = React.forwardRef<any, SheetBackdropProps>(\n ({ style = {}, ...rest }, ref) => {\n const Comp = isClickable(rest) ? motion.button : motion.div;\n const pointerEvents = isClickable(rest) ? 'auto' : 'none';\n\n return (\n <Comp\n {...rest}\n ref={ref}\n className=\"react-modal-sheet-backdrop\"\n style={{ ...styles.backdrop, ...style, pointerEvents }}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n />\n );\n }\n);\n\nexport default SheetBackdrop;\n","import { MotionValue } from 'framer-motion';\n\nimport Sheet from './sheet';\nimport SheetContainer from './SheetContainer';\nimport SheetContent from './SheetContent';\nimport SheetHeader from './SheetHeader';\nimport SheetBackdrop from './SheetBackdrop';\nimport { SheetCompound } from './types';\n\nexport type SheetRef = {\n y: MotionValue<number>;\n snapTo: (index: number) => void;\n};\n\n// HACK: this is needed to get the typing to work properly...\nconst _SheetCompound: any = Sheet;\n_SheetCompound.Container = SheetContainer;\n_SheetCompound.Header = SheetHeader;\n_SheetCompound.Content = SheetContent;\n_SheetCompound.Backdrop = SheetBackdrop;\n\nexport default _SheetCompound as SheetCompound;\n"],"names":["MAX_HEIGHT","IS_SSR","window","DEFAULT_SPRING_CONFIG","stiffness","damping","mass","getClosest","nums","goal","reduce","prev","curr","Math","abs","cleanupRootStyles","rootId","body","document","querySelector","root","getElementById","highlight","style","removeProperty","opacity","addEventListener","onTransitionEnd","removeEventListener","parentNode","removeChild","validateSnapTo","snapTo","sheetHeight","console","warn","max","round","useIsomorphicLayoutEffect","React","usePrevious","state","ref","current","useEvent","handler","handlerRef","fn","args","SheetContext","undefined","useSheetContext","context","Error","styles","wrapper","position","top","bottom","left","right","zIndex","overflow","pointerEvents","backdrop","width","height","backgroundColor","touchAction","container","borderTopRightRadius","borderTopLeftRadius","boxShadow","display","flexDirection","headerWrapper","header","alignItems","justifyContent","indicator","borderRadius","content","flex","Sheet","onOpenStart","onOpenEnd","onClose","onCloseStart","onCloseEnd","onSnap","children","isOpen","snapPoints","mountPoint","detent","initialSnap","springConfig","disableDrag","prefersReducedMotion","rest","sheetRef","indicatorRotation","useMotionValue","windowHeight","setWindowHeight","updateHeight","innerHeight","useWindowHeight","shouldReduceMotion","useReducedMotion","reduceMotion","Boolean","animationOptions","type","duration","y","callbacks","map","point","assert","arr","i","length","inDescendingOrder","onDrag","_","delta","velocity","getVelocity","set","get","onDragEnd","getBoundingClientRect","currentY","snapToValues","p","filter","includes","unshift","animate","snapValue","snapIndex","indexOf","sheetEl","prevOpen","h","s","willChange","transition","transform","createElement","setAttribute","id","appendChild","requestAnimationFrame","applyRootStyles","useModalEffect","usePreventScroll","isDisabled","dragProps","drag","dragElastic","dragConstraints","dragMomentum","sheet","Provider","value","AnimatePresence","child","key","ReactDOM","SheetContainer","handleAnimationComplete","didOpen","useEventCallbacks","initialY","maxSnapHeight","motion","div","mergeRefs","className","maxHeight","initial","exit","onAnimationComplete","SheetContent","_dragProps","SheetHeader","indicator1Transform","useTransform","r","indicator2Transform","span","isClickable","props","onClick","onTap","SheetBackdrop","Comp","button","_SheetCompound","Container","Header","Content","Backdrop"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { useCallback, useEffect, useLayoutEffect, useRef, useState, createContext, useContext, forwardRef, useImperativeHandle, useMemo, createElement, Children, cloneElement } from 'react';
|
|
2
2
|
import { createPortal } from 'react-dom';
|
|
3
3
|
import { usePreventScroll } from '@react-aria/overlays';
|
|
4
|
-
import { useMotionValue, animate, AnimatePresence, motion, useTransform } from 'framer-motion';
|
|
4
|
+
import { useMotionValue, useReducedMotion, animate, AnimatePresence, motion, useTransform } from 'framer-motion';
|
|
5
5
|
import mergeRefs from 'react-merge-refs';
|
|
6
6
|
|
|
7
7
|
function _extends() {
|
|
@@ -297,21 +297,32 @@ var Sheet = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
297
297
|
children = _ref.children,
|
|
298
298
|
isOpen = _ref.isOpen,
|
|
299
299
|
snapPoints = _ref.snapPoints,
|
|
300
|
-
detent = _ref.detent,
|
|
301
|
-
_ref$initialSnap = _ref.initialSnap,
|
|
302
|
-
initialSnap = _ref$initialSnap === void 0 ? 0 : _ref$initialSnap,
|
|
303
300
|
rootId = _ref.rootId,
|
|
304
301
|
mountPoint = _ref.mountPoint,
|
|
302
|
+
style = _ref.style,
|
|
303
|
+
_ref$detent = _ref.detent,
|
|
304
|
+
detent = _ref$detent === void 0 ? 'full-height' : _ref$detent,
|
|
305
|
+
_ref$initialSnap = _ref.initialSnap,
|
|
306
|
+
initialSnap = _ref$initialSnap === void 0 ? 0 : _ref$initialSnap,
|
|
305
307
|
_ref$springConfig = _ref.springConfig,
|
|
306
308
|
springConfig = _ref$springConfig === void 0 ? DEFAULT_SPRING_CONFIG : _ref$springConfig,
|
|
307
309
|
_ref$disableDrag = _ref.disableDrag,
|
|
308
310
|
disableDrag = _ref$disableDrag === void 0 ? false : _ref$disableDrag,
|
|
309
|
-
|
|
310
|
-
|
|
311
|
+
_ref$prefersReducedMo = _ref.prefersReducedMotion,
|
|
312
|
+
prefersReducedMotion = _ref$prefersReducedMo === void 0 ? false : _ref$prefersReducedMo,
|
|
313
|
+
rest = _objectWithoutPropertiesLoose(_ref, ["onOpenStart", "onOpenEnd", "onClose", "onCloseStart", "onCloseEnd", "onSnap", "children", "isOpen", "snapPoints", "rootId", "mountPoint", "style", "detent", "initialSnap", "springConfig", "disableDrag", "prefersReducedMotion"]);
|
|
311
314
|
|
|
312
315
|
var sheetRef = useRef(null);
|
|
313
316
|
var indicatorRotation = useMotionValue(0);
|
|
314
|
-
var windowHeight = useWindowHeight();
|
|
317
|
+
var windowHeight = useWindowHeight();
|
|
318
|
+
var shouldReduceMotion = useReducedMotion();
|
|
319
|
+
var reduceMotion = Boolean(prefersReducedMotion || shouldReduceMotion);
|
|
320
|
+
var animationOptions = reduceMotion ? {
|
|
321
|
+
type: 'tween',
|
|
322
|
+
duration: 0.01
|
|
323
|
+
} : _extends({
|
|
324
|
+
type: 'spring'
|
|
325
|
+
}, springConfig); // NOTE: the inital value for `y` doesn't matter since it is overwritten by
|
|
315
326
|
// the value driven by the `AnimatePresence` component when the sheet is opened
|
|
316
327
|
// and after that it is driven by the gestures and/or snapping
|
|
317
328
|
|
|
@@ -388,9 +399,7 @@ var Sheet = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
388
399
|
sheetHeight: sheetHeight
|
|
389
400
|
}); // Update the spring value so that the sheet is animated to the snap point
|
|
390
401
|
|
|
391
|
-
animate(y, snapTo,
|
|
392
|
-
type: 'spring'
|
|
393
|
-
}, springConfig));
|
|
402
|
+
animate(y, snapTo, animationOptions);
|
|
394
403
|
|
|
395
404
|
if (snapPoints && onSnap) {
|
|
396
405
|
var snapValue = Math.abs(Math.round(snapPoints[0] - snapTo));
|
|
@@ -425,9 +434,7 @@ var Sheet = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
425
434
|
snapTo: sheetHeight - snapPoint,
|
|
426
435
|
sheetHeight: sheetHeight
|
|
427
436
|
});
|
|
428
|
-
animate(y, snapTo,
|
|
429
|
-
type: 'spring'
|
|
430
|
-
}, springConfig));
|
|
437
|
+
animate(y, snapTo, animationOptions);
|
|
431
438
|
if (onSnap) onSnap(snapIndex);
|
|
432
439
|
if (snapTo >= sheetHeight) onClose();
|
|
433
440
|
}
|
|
@@ -466,7 +473,8 @@ var Sheet = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
466
473
|
callbacks: callbacks,
|
|
467
474
|
dragProps: dragProps,
|
|
468
475
|
windowHeight: windowHeight,
|
|
469
|
-
|
|
476
|
+
animationOptions: animationOptions,
|
|
477
|
+
reduceMotion: reduceMotion
|
|
470
478
|
};
|
|
471
479
|
var sheet = createElement(SheetContext.Provider, {
|
|
472
480
|
value: context
|
|
@@ -497,9 +505,9 @@ var SheetContainer = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
497
505
|
initialSnap = _useSheetContext$init === void 0 ? 0 : _useSheetContext$init,
|
|
498
506
|
sheetRef = _useSheetContext.sheetRef,
|
|
499
507
|
windowHeight = _useSheetContext.windowHeight,
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
508
|
+
detent = _useSheetContext.detent,
|
|
509
|
+
animationOptions = _useSheetContext.animationOptions,
|
|
510
|
+
reduceMotion = _useSheetContext.reduceMotion;
|
|
503
511
|
|
|
504
512
|
var _useEventCallbacks = useEventCallbacks(isOpen, callbacks),
|
|
505
513
|
handleAnimationComplete = _useEventCallbacks.handleAnimationComplete;
|
|
@@ -517,17 +525,16 @@ var SheetContainer = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
517
525
|
}, {
|
|
518
526
|
y: y
|
|
519
527
|
}),
|
|
520
|
-
initial: {
|
|
528
|
+
initial: reduceMotion ? false : {
|
|
521
529
|
y: windowHeight
|
|
522
530
|
},
|
|
523
531
|
animate: {
|
|
524
532
|
y: initialY,
|
|
525
|
-
transition:
|
|
526
|
-
type: 'spring'
|
|
527
|
-
}, springConfig)
|
|
533
|
+
transition: animationOptions
|
|
528
534
|
},
|
|
529
535
|
exit: {
|
|
530
|
-
y: windowHeight
|
|
536
|
+
y: windowHeight,
|
|
537
|
+
transition: animationOptions
|
|
531
538
|
},
|
|
532
539
|
onAnimationComplete: handleAnimationComplete
|
|
533
540
|
}), children);
|
|
@@ -536,27 +543,33 @@ var SheetContainer = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
536
543
|
var SheetContent = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
537
544
|
var children = _ref.children,
|
|
538
545
|
style = _ref.style,
|
|
539
|
-
|
|
546
|
+
disableDrag = _ref.disableDrag,
|
|
547
|
+
rest = _objectWithoutPropertiesLoose(_ref, ["children", "style", "disableDrag"]);
|
|
540
548
|
|
|
541
549
|
var _useSheetContext = useSheetContext(),
|
|
542
550
|
dragProps = _useSheetContext.dragProps;
|
|
543
551
|
|
|
552
|
+
var _dragProps = disableDrag ? undefined : dragProps;
|
|
553
|
+
|
|
544
554
|
return createElement(motion.div, Object.assign({}, rest, {
|
|
545
555
|
ref: ref,
|
|
546
556
|
className: "react-modal-sheet-content",
|
|
547
557
|
style: _extends({}, styles.content, style)
|
|
548
|
-
},
|
|
558
|
+
}, _dragProps), children);
|
|
549
559
|
});
|
|
550
560
|
|
|
551
561
|
var SheetHeader = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
552
562
|
var children = _ref.children,
|
|
553
563
|
style = _ref.style,
|
|
554
|
-
|
|
564
|
+
disableDrag = _ref.disableDrag,
|
|
565
|
+
rest = _objectWithoutPropertiesLoose(_ref, ["children", "style", "disableDrag"]);
|
|
555
566
|
|
|
556
567
|
var _useSheetContext = useSheetContext(),
|
|
557
568
|
indicatorRotation = _useSheetContext.indicatorRotation,
|
|
558
569
|
dragProps = _useSheetContext.dragProps;
|
|
559
570
|
|
|
571
|
+
var _dragProps = disableDrag ? undefined : dragProps;
|
|
572
|
+
|
|
560
573
|
var indicator1Transform = useTransform(indicatorRotation, function (r) {
|
|
561
574
|
return "translateX(2px) rotate(" + r + "deg)";
|
|
562
575
|
});
|
|
@@ -566,7 +579,7 @@ var SheetHeader = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
566
579
|
return createElement(motion.div, Object.assign({}, rest, {
|
|
567
580
|
ref: ref,
|
|
568
581
|
style: _extends({}, styles.headerWrapper, style)
|
|
569
|
-
},
|
|
582
|
+
}, _dragProps), children || createElement("div", {
|
|
570
583
|
className: "react-modal-sheet-header",
|
|
571
584
|
style: styles.header
|
|
572
585
|
}, createElement(motion.span, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"react-modal-sheet.esm.js","sources":["../src/constants.ts","../src/utils.ts","../src/hooks.tsx","../src/context.tsx","../src/styles.ts","../src/sheet.tsx","../src/SheetContainer.tsx","../src/SheetContent.tsx","../src/SheetHeader.tsx","../src/SheetBackdrop.tsx","../src/index.tsx"],"sourcesContent":["export const MAX_HEIGHT = 'calc(100% - env(safe-area-inset-top) - 34px)';\n\nexport const IS_SSR = typeof window === 'undefined';\n\nexport const DEFAULT_SPRING_CONFIG = {\n stiffness: 300,\n damping: 30,\n mass: 0.2,\n};\n\nexport const DRAG_CLOSE_THRESHOLD = 0.6;\n\nexport const DRAG_VELOCITY_THRESHOLD = 500;\n","export function getClosest(nums: number[], goal: number) {\n return nums.reduce((prev, curr) => {\n return Math.abs(curr - goal) < Math.abs(prev - goal) ? curr : prev;\n });\n}\n\nconst highlightId = 'react-modal-sheet-highlight';\n\nexport function applyRootStyles(rootId: string) {\n const body = document.querySelector('body') as HTMLBodyElement;\n const root = document.querySelector(`#${rootId}`) as HTMLDivElement;\n\n if (root) {\n const p = 24;\n const h = window.innerHeight;\n const s = (h - p) / h;\n body.style.backgroundColor = '#000';\n root.style.overflow = 'hidden';\n root.style.willChange = 'transform';\n root.style.transition = 'transform 200ms linear';\n root.style.transform = `translateY(calc(env(safe-area-inset-top) + ${p / 2}px)) scale(${s})`; // prettier-ignore\n root.style.borderTopRightRadius = '10px';\n root.style.borderTopLeftRadius = '10px';\n\n // Add highlighed overlay to emphasize the modality effect\n const highlight = document.createElement('div');\n highlight.setAttribute('aria-hidden', 'true');\n highlight.id = highlightId;\n highlight.style.position = 'absolute';\n highlight.style.top = '0px';\n highlight.style.left = '0px';\n highlight.style.bottom = '0px';\n highlight.style.right = '0px';\n highlight.style.opacity = '0';\n highlight.style.transition = 'opacity 200ms linear';\n highlight.style.backgroundColor = 'rgba(150, 150, 150, 0.1)';\n\n root.appendChild(highlight);\n requestAnimationFrame(() => (highlight.style.opacity = '1'));\n }\n}\n\nexport function cleanupRootStyles(rootId: string) {\n const body = document.querySelector('body') as HTMLBodyElement;\n const root = document.getElementById(rootId) as HTMLDivElement;\n const highlight = document.getElementById(highlightId) as HTMLDivElement;\n\n function onTransitionEnd() {\n root.style.removeProperty('overflow');\n root.style.removeProperty('will-change');\n root.style.removeProperty('transition');\n body.style.removeProperty('background-color');\n root.removeEventListener('transitionend', onTransitionEnd);\n highlight.parentNode?.removeChild(highlight);\n }\n\n if (root && highlight) {\n // Start animating back\n root.style.removeProperty('border-top-right-radius');\n root.style.removeProperty('border-top-left-radius');\n root.style.removeProperty('transform');\n highlight.style.opacity = '0';\n\n // Remove temp properties after animation is finished\n root.addEventListener('transitionend', onTransitionEnd);\n }\n}\n\nexport function inDescendingOrder(arr: number[]) {\n for (let i = 0; i < arr.length; i++) {\n if (arr[i + 1] > arr[i]) return false;\n }\n\n return true;\n}\n\nexport function validateSnapTo({\n snapTo,\n sheetHeight,\n}: {\n snapTo: number;\n sheetHeight: number;\n}) {\n if (snapTo < 0) {\n console.warn(\n `Snap point is out of bounds. Sheet height is ${sheetHeight} but snap point is ${sheetHeight +\n Math.abs(snapTo)}.`\n );\n }\n\n return Math.max(Math.round(snapTo), 0);\n}\n","import * as React from 'react';\n\nimport { IS_SSR } from './constants';\nimport { SheetEvents } from './types';\nimport { applyRootStyles, cleanupRootStyles } from './utils';\n\nexport const useIsomorphicLayoutEffect = IS_SSR\n ? React.useEffect\n : React.useLayoutEffect;\n\nexport const useModalEffect = (isOpen: boolean, rootId?: string) => {\n const prevOpen = usePrevious(isOpen);\n\n // Automatically apply the iOS modal effect to the body when sheet opens/closes\n React.useEffect(() => {\n if (rootId && !prevOpen && isOpen) {\n applyRootStyles(rootId);\n } else if (rootId && !isOpen && prevOpen) {\n cleanupRootStyles(rootId);\n }\n }, [isOpen, prevOpen]); // eslint-disable-line\n\n // Make sure to cleanup modal styles on unmount\n React.useEffect(() => {\n return () => {\n if (rootId && isOpen) cleanupRootStyles(rootId);\n };\n }, [isOpen]); // eslint-disable-line\n};\n\nexport const useEventCallbacks = (\n isOpen: boolean,\n callbacks: React.MutableRefObject<SheetEvents>\n) => {\n const prevOpen = usePrevious(isOpen);\n const didOpen = React.useRef(false);\n\n // Because of AnimatePrecence we don't have access to latest isOpen value\n // so we need to read and write to a ref to determine if we are\n // opening or closing the sheet\n const handleAnimationComplete = React.useCallback(() => {\n if (!didOpen.current) {\n callbacks.current.onOpenEnd?.();\n didOpen.current = true;\n } else {\n callbacks.current.onCloseEnd?.();\n didOpen.current = false;\n }\n }, [isOpen, prevOpen]); // eslint-disable-line\n\n React.useEffect(() => {\n if (!prevOpen && isOpen) {\n callbacks.current.onOpenStart?.();\n } else if (!isOpen && prevOpen) {\n callbacks.current.onCloseStart?.();\n }\n }, [isOpen, prevOpen]); // eslint-disable-line\n\n return { handleAnimationComplete };\n};\n\nexport function useWindowHeight() {\n const [windowHeight, setWindowHeight] = React.useState(0);\n\n useIsomorphicLayoutEffect(() => {\n const updateHeight = () => setWindowHeight(window.innerHeight);\n window.addEventListener('resize', updateHeight);\n updateHeight();\n return () => window.removeEventListener('resize', updateHeight);\n }, []);\n\n return windowHeight;\n}\n\nexport function usePrevious<T>(state: T): T | undefined {\n const ref = React.useRef<T>();\n\n React.useEffect(() => {\n ref.current = state;\n });\n\n return ref.current;\n}\n\n// Userland version of the `useEvent` React hook:\n// RFC: https://github.com/reactjs/rfcs/blob/useevent/text/0000-useevent.md\nexport function useEvent<T extends (...args: any[]) => any>(handler: T) {\n const handlerRef = React.useRef<T>();\n\n useIsomorphicLayoutEffect(() => {\n handlerRef.current = handler;\n });\n\n return React.useCallback((...args: any[]) => {\n const fn = handlerRef.current;\n return fn?.(...args);\n }, []) as T;\n}\n","import * as React from 'react';\nimport { SheetContextType } from './types';\n\nexport const SheetContext = React.createContext<SheetContextType | undefined>(\n undefined\n);\n\nexport const useSheetContext = () => {\n const context = React.useContext(SheetContext);\n if (!context) throw Error('Sheet context error');\n return context;\n};\n","import * as CSS from 'csstype';\n\nconst styles: { [key: string]: CSS.Properties } = {\n wrapper: {\n position: 'fixed',\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n zIndex: 9999999,\n overflow: 'hidden',\n pointerEvents: 'none',\n },\n backdrop: {\n zIndex: 1,\n position: 'fixed',\n top: 0,\n left: 0,\n width: '100%',\n height: '100%',\n backgroundColor: 'rgba(51, 51, 51, 0.5)',\n touchAction: 'none', // Disable iOS body scrolling\n },\n container: {\n zIndex: 2,\n position: 'absolute',\n left: 0,\n bottom: 0,\n width: '100%',\n backgroundColor: '#fff',\n borderTopRightRadius: '8px',\n borderTopLeftRadius: '8px',\n boxShadow: '0px -2px 16px rgba(0, 0, 0, 0.3)',\n display: 'flex',\n flexDirection: 'column',\n pointerEvents: 'auto',\n },\n headerWrapper: {\n width: '100%',\n },\n header: {\n height: '40px',\n width: '100%',\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n },\n indicator: {\n width: '18px',\n height: '4px',\n borderRadius: '99px',\n backgroundColor: '#ddd',\n },\n content: {\n flex: 1,\n overflow: 'auto',\n position: 'relative',\n },\n};\n\nexport default styles;\n","import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { usePreventScroll } from '@react-aria/overlays';\n\nimport {\n animate,\n AnimatePresence,\n PanInfo,\n useMotionValue,\n} from 'framer-motion';\n\nimport {\n useModalEffect,\n useWindowHeight,\n useIsomorphicLayoutEffect,\n useEvent,\n} from './hooks';\n\nimport {\n DEFAULT_SPRING_CONFIG,\n DRAG_CLOSE_THRESHOLD,\n DRAG_VELOCITY_THRESHOLD,\n IS_SSR,\n} from './constants';\n\nimport { SheetContextType, SheetProps } from './types';\nimport { SheetContext } from './context';\nimport { getClosest, inDescendingOrder, validateSnapTo } from './utils';\nimport styles from './styles';\n\nconst Sheet = React.forwardRef<any, SheetProps>(\n (\n {\n onOpenStart,\n onOpenEnd,\n onClose,\n onCloseStart,\n onCloseEnd,\n onSnap,\n children,\n isOpen,\n snapPoints,\n detent,\n initialSnap = 0,\n rootId,\n mountPoint,\n springConfig = DEFAULT_SPRING_CONFIG,\n disableDrag = false,\n style,\n ...rest\n },\n ref\n ) => {\n const sheetRef = React.useRef<any>(null);\n const indicatorRotation = useMotionValue(0);\n const windowHeight = useWindowHeight();\n\n // NOTE: the inital value for `y` doesn't matter since it is overwritten by\n // the value driven by the `AnimatePresence` component when the sheet is opened\n // and after that it is driven by the gestures and/or snapping\n const y = useMotionValue(0);\n\n // Keep the callback fns up-to-date so that they can be accessed inside\n // the effect without including them to the dependencies array\n const callbacks = React.useRef({\n onOpenStart,\n onOpenEnd,\n onCloseStart,\n onCloseEnd,\n });\n\n useIsomorphicLayoutEffect(() => {\n callbacks.current = {\n onOpenStart,\n onOpenEnd,\n onCloseStart,\n onCloseEnd,\n };\n });\n\n if (snapPoints) {\n // Convert negative / percentage snap points to absolute values\n snapPoints = snapPoints.map(point => {\n // Percentage values e.g. between 0.0 and 1.0\n if (point > 0 && point <= 1) return Math.round(point * windowHeight);\n return point < 0 ? windowHeight + point : point; // negative values\n });\n\n console.assert(\n inDescendingOrder(snapPoints) || windowHeight === 0,\n `Snap points need to be in descending order got: [${snapPoints}]`\n );\n }\n\n const onDrag = useEvent((_, { delta }: PanInfo) => {\n // Update drag indicator rotation based on drag velocity\n const velocity = y.getVelocity();\n\n if (velocity > 0) indicatorRotation.set(10);\n if (velocity < 0) indicatorRotation.set(-10);\n\n // Make sure user cannot drag beyond the top of the sheet\n y.set(Math.max(y.get() + delta.y, 0));\n });\n\n const onDragEnd = useEvent((_, { velocity }: PanInfo) => {\n if (velocity.y > DRAG_VELOCITY_THRESHOLD) {\n // User flicked the sheet down\n onClose();\n } else {\n const sheetEl = sheetRef.current as HTMLDivElement;\n const sheetHeight = sheetEl.getBoundingClientRect().height;\n const currentY = y.get();\n\n let snapTo = 0;\n\n if (snapPoints) {\n const snapToValues = snapPoints\n .map(p => sheetHeight - p)\n .filter(p => p >= 0); // negative values can occur with `content-height` detent\n\n // Allow snapping to the top of the sheet if detent is set to `content-height`\n if (detent === 'content-height' && !snapToValues.includes(0)) {\n snapToValues.unshift(0);\n }\n\n // Get the closest snap point\n snapTo = getClosest(snapToValues, currentY);\n } else if (currentY / sheetHeight > DRAG_CLOSE_THRESHOLD) {\n // Close if dragged over enough far\n snapTo = sheetHeight;\n }\n\n snapTo = validateSnapTo({ snapTo, sheetHeight });\n\n // Update the spring value so that the sheet is animated to the snap point\n animate(y, snapTo, { type: 'spring', ...springConfig });\n\n if (snapPoints && onSnap) {\n const snapValue = Math.abs(Math.round(snapPoints[0] - snapTo));\n const snapIndex = snapPoints.indexOf(getClosest(snapPoints, snapValue)); // prettier-ignore\n onSnap(snapIndex);\n }\n\n if (snapTo >= sheetHeight) onClose();\n }\n\n // Reset indicator rotation after dragging\n indicatorRotation.set(0);\n });\n\n // Trigger onSnap callback when sheet is opened or closed\n React.useEffect(() => {\n if (!snapPoints || !onSnap) return;\n const snapIndex = isOpen ? initialSnap : snapPoints.length - 1;\n onSnap(snapIndex);\n }, [isOpen]); // eslint-disable-line\n\n React.useImperativeHandle(ref, () => ({\n y,\n snapTo: (snapIndex: number) => {\n const sheetEl = sheetRef.current as HTMLDivElement | null;\n\n if (\n snapPoints &&\n snapPoints[snapIndex] !== undefined &&\n sheetEl !== null\n ) {\n const sheetHeight = sheetEl.getBoundingClientRect().height;\n const snapPoint = snapPoints[snapIndex];\n const snapTo = validateSnapTo({\n snapTo: sheetHeight - snapPoint,\n sheetHeight,\n });\n\n animate(y, snapTo, { type: 'spring', ...springConfig });\n\n if (onSnap) onSnap(snapIndex);\n if (snapTo >= sheetHeight) onClose();\n }\n },\n }));\n\n useModalEffect(isOpen, rootId);\n\n // Framer Motion should handle body scroll locking but it's not working\n // properly on iOS. Scroll locking from React Aria seems to work much better.\n usePreventScroll({ isDisabled: !isOpen });\n\n const dragProps = React.useMemo(() => {\n const dragProps: SheetContextType['dragProps'] = {\n drag: 'y',\n dragElastic: 0,\n dragConstraints: { top: 0, bottom: 0 },\n dragMomentum: false,\n onDrag,\n onDragEnd,\n };\n\n return disableDrag ? undefined : dragProps;\n }, [disableDrag]); // eslint-disable-line\n\n const context: SheetContextType = {\n y,\n sheetRef,\n isOpen,\n initialSnap,\n snapPoints,\n detent,\n indicatorRotation,\n callbacks,\n dragProps,\n windowHeight,\n springConfig,\n };\n\n const sheet = (\n <SheetContext.Provider value={context}>\n <div {...rest} ref={ref} style={{ ...styles.wrapper, ...style }}>\n <AnimatePresence>\n {/* NOTE: AnimatePresence requires us to set keys to children */}\n {isOpen\n ? React.Children.map(children, (child: any, i) =>\n React.cloneElement(child, { key: `sheet-child-${i}` })\n )\n : null}\n </AnimatePresence>\n </div>\n </SheetContext.Provider>\n );\n\n if (IS_SSR) return sheet;\n\n return ReactDOM.createPortal(sheet, mountPoint ?? document.body);\n }\n);\n\nexport default Sheet;\n","import * as React from 'react';\nimport { motion } from 'framer-motion';\nimport mergeRefs from 'react-merge-refs';\n\nimport { SheetContainerProps } from './types';\nimport { useSheetContext } from './context';\nimport { useEventCallbacks } from './hooks';\nimport { MAX_HEIGHT } from './constants';\nimport styles from './styles';\n\nconst SheetContainer = React.forwardRef<any, SheetContainerProps>(\n ({ children, style = {}, ...rest }, ref) => {\n const {\n y,\n isOpen,\n callbacks,\n snapPoints,\n initialSnap = 0,\n sheetRef,\n windowHeight,\n springConfig,\n detent = 'full-height',\n } = useSheetContext();\n\n const { handleAnimationComplete } = useEventCallbacks(isOpen, callbacks);\n const initialY = snapPoints ? snapPoints[0] - snapPoints[initialSnap] : 0;\n const maxSnapHeight = snapPoints ? snapPoints[0] : null;\n\n const height =\n maxSnapHeight !== null\n ? `min(${maxSnapHeight}px, ${MAX_HEIGHT})`\n : MAX_HEIGHT;\n\n return (\n <motion.div\n {...rest}\n ref={mergeRefs([sheetRef, ref])}\n className=\"react-modal-sheet-container\"\n style={{\n ...styles.container,\n ...style,\n ...(detent === 'full-height' && { height }),\n ...(detent === 'content-height' && { maxHeight: height }),\n y,\n }}\n initial={{ y: windowHeight }}\n animate={{\n y: initialY,\n transition: { type: 'spring', ...springConfig },\n }}\n exit={{ y: windowHeight }}\n onAnimationComplete={handleAnimationComplete}\n >\n {children}\n </motion.div>\n );\n }\n);\n\nexport default SheetContainer;\n","import * as React from 'react';\nimport { motion } from 'framer-motion';\n\nimport { SheetDraggableProps } from './types';\nimport { useSheetContext } from './context';\nimport styles from './styles';\n\nconst SheetContent = React.forwardRef<any, SheetDraggableProps>(\n ({ children, style, ...rest }, ref) => {\n const { dragProps } = useSheetContext();\n\n return (\n <motion.div\n {...rest}\n ref={ref}\n className=\"react-modal-sheet-content\"\n style={{ ...styles.content, ...style }}\n {...dragProps}\n >\n {children}\n </motion.div>\n );\n }\n);\n\nexport default SheetContent;\n","import * as React from 'react';\nimport { motion, useTransform } from 'framer-motion';\n\nimport { SheetDraggableProps } from './types';\nimport { useSheetContext } from './context';\nimport styles from './styles';\n\nconst SheetHeader = React.forwardRef<any, SheetDraggableProps>(\n ({ children, style, ...rest }, ref) => {\n const { indicatorRotation, dragProps } = useSheetContext();\n\n const indicator1Transform = useTransform(\n indicatorRotation,\n r => `translateX(2px) rotate(${r}deg)`\n );\n\n const indicator2Transform = useTransform(\n indicatorRotation,\n r => `translateX(-2px) rotate(${-1 * r}deg)`\n );\n\n return (\n <motion.div\n {...rest}\n ref={ref}\n style={{ ...styles.headerWrapper, ...style }}\n {...dragProps}\n >\n {children || (\n <div className=\"react-modal-sheet-header\" style={styles.header}>\n <motion.span\n className=\"react-modal-sheet-drag-indicator\"\n style={{ ...styles.indicator, transform: indicator1Transform }}\n />\n <motion.span\n className=\"react-modal-sheet-drag-indicator\"\n style={{ ...styles.indicator, transform: indicator2Transform }}\n />\n </div>\n )}\n </motion.div>\n );\n }\n);\n\nexport default SheetHeader;\n","import * as React from 'react';\nimport { motion } from 'framer-motion';\n\nimport { SheetBackdropProps } from './types';\nimport styles from './styles';\n\nconst isClickable = (props: any) => !!props.onClick || !!props.onTap;\n\nconst SheetBackdrop = React.forwardRef<any, SheetBackdropProps>(\n ({ style = {}, ...rest }, ref) => {\n const Comp = isClickable(rest) ? motion.button : motion.div;\n const pointerEvents = isClickable(rest) ? 'auto' : 'none';\n\n return (\n <Comp\n {...rest}\n ref={ref}\n className=\"react-modal-sheet-backdrop\"\n style={{ ...styles.backdrop, ...style, pointerEvents }}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n />\n );\n }\n);\n\nexport default SheetBackdrop;\n","import { MotionValue } from 'framer-motion';\n\nimport Sheet from './sheet';\nimport SheetContainer from './SheetContainer';\nimport SheetContent from './SheetContent';\nimport SheetHeader from './SheetHeader';\nimport SheetBackdrop from './SheetBackdrop';\nimport { SheetCompound } from './types';\n\nexport type SheetRef = {\n y: MotionValue<number>;\n snapTo: (index: number) => void;\n};\n\n// HACK: this is needed to get the typing to work properly...\nconst _SheetCompound: any = Sheet;\n_SheetCompound.Container = SheetContainer;\n_SheetCompound.Header = SheetHeader;\n_SheetCompound.Content = SheetContent;\n_SheetCompound.Backdrop = SheetBackdrop;\n\nexport default _SheetCompound as SheetCompound;\n"],"names":["MAX_HEIGHT","IS_SSR","window","DEFAULT_SPRING_CONFIG","stiffness","damping","mass","DRAG_CLOSE_THRESHOLD","DRAG_VELOCITY_THRESHOLD","getClosest","nums","goal","reduce","prev","curr","Math","abs","highlightId","applyRootStyles","rootId","body","document","querySelector","root","p","h","innerHeight","s","style","backgroundColor","overflow","willChange","transition","transform","borderTopRightRadius","borderTopLeftRadius","highlight","createElement","setAttribute","id","position","top","left","bottom","right","opacity","appendChild","requestAnimationFrame","cleanupRootStyles","getElementById","onTransitionEnd","removeProperty","removeEventListener","parentNode","removeChild","addEventListener","inDescendingOrder","arr","i","length","validateSnapTo","snapTo","sheetHeight","console","warn","max","round","useIsomorphicLayoutEffect","React","useModalEffect","isOpen","prevOpen","usePrevious","useEventCallbacks","callbacks","didOpen","handleAnimationComplete","current","onOpenEnd","onCloseEnd","onOpenStart","onCloseStart","useWindowHeight","windowHeight","setWindowHeight","updateHeight","state","ref","useEvent","handler","handlerRef","fn","args","SheetContext","undefined","useSheetContext","context","Error","styles","wrapper","zIndex","pointerEvents","backdrop","width","height","touchAction","container","boxShadow","display","flexDirection","headerWrapper","header","alignItems","justifyContent","indicator","borderRadius","content","flex","Sheet","onClose","onSnap","children","snapPoints","detent","initialSnap","mountPoint","springConfig","disableDrag","rest","sheetRef","indicatorRotation","useMotionValue","y","map","point","assert","onDrag","_","delta","velocity","getVelocity","set","get","onDragEnd","sheetEl","getBoundingClientRect","currentY","snapToValues","filter","includes","unshift","animate","type","snapValue","snapIndex","indexOf","snapPoint","usePreventScroll","isDisabled","dragProps","drag","dragElastic","dragConstraints","dragMomentum","sheet","Provider","value","AnimatePresence","child","key","ReactDOM","SheetContainer","initialY","maxSnapHeight","motion","div","mergeRefs","className","maxHeight","initial","exit","onAnimationComplete","SheetContent","SheetHeader","indicator1Transform","useTransform","r","indicator2Transform","span","isClickable","props","onClick","onTap","SheetBackdrop","Comp","button","_SheetCompound","Container","Header","Content","Backdrop"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"react-modal-sheet.esm.js","sources":["../src/constants.ts","../src/utils.ts","../src/hooks.tsx","../src/context.tsx","../src/styles.ts","../src/sheet.tsx","../src/SheetContainer.tsx","../src/SheetContent.tsx","../src/SheetHeader.tsx","../src/SheetBackdrop.tsx","../src/index.tsx"],"sourcesContent":["export const MAX_HEIGHT = 'calc(100% - env(safe-area-inset-top) - 34px)';\n\nexport const IS_SSR = typeof window === 'undefined';\n\nexport const DEFAULT_SPRING_CONFIG = {\n stiffness: 300,\n damping: 30,\n mass: 0.2,\n};\n\nexport const DRAG_CLOSE_THRESHOLD = 0.6;\n\nexport const DRAG_VELOCITY_THRESHOLD = 500;\n","export function getClosest(nums: number[], goal: number) {\n return nums.reduce((prev, curr) => {\n return Math.abs(curr - goal) < Math.abs(prev - goal) ? curr : prev;\n });\n}\n\nconst highlightId = 'react-modal-sheet-highlight';\n\nexport function applyRootStyles(rootId: string) {\n const body = document.querySelector('body') as HTMLBodyElement;\n const root = document.querySelector(`#${rootId}`) as HTMLDivElement;\n\n if (root) {\n const p = 24;\n const h = window.innerHeight;\n const s = (h - p) / h;\n body.style.backgroundColor = '#000';\n root.style.overflow = 'hidden';\n root.style.willChange = 'transform';\n root.style.transition = 'transform 200ms linear';\n root.style.transform = `translateY(calc(env(safe-area-inset-top) + ${p / 2}px)) scale(${s})`; // prettier-ignore\n root.style.borderTopRightRadius = '10px';\n root.style.borderTopLeftRadius = '10px';\n\n // Add highlighed overlay to emphasize the modality effect\n const highlight = document.createElement('div');\n highlight.setAttribute('aria-hidden', 'true');\n highlight.id = highlightId;\n highlight.style.position = 'absolute';\n highlight.style.top = '0px';\n highlight.style.left = '0px';\n highlight.style.bottom = '0px';\n highlight.style.right = '0px';\n highlight.style.opacity = '0';\n highlight.style.transition = 'opacity 200ms linear';\n highlight.style.backgroundColor = 'rgba(150, 150, 150, 0.1)';\n\n root.appendChild(highlight);\n requestAnimationFrame(() => (highlight.style.opacity = '1'));\n }\n}\n\nexport function cleanupRootStyles(rootId: string) {\n const body = document.querySelector('body') as HTMLBodyElement;\n const root = document.getElementById(rootId) as HTMLDivElement;\n const highlight = document.getElementById(highlightId) as HTMLDivElement;\n\n function onTransitionEnd() {\n root.style.removeProperty('overflow');\n root.style.removeProperty('will-change');\n root.style.removeProperty('transition');\n body.style.removeProperty('background-color');\n root.removeEventListener('transitionend', onTransitionEnd);\n highlight.parentNode?.removeChild(highlight);\n }\n\n if (root && highlight) {\n // Start animating back\n root.style.removeProperty('border-top-right-radius');\n root.style.removeProperty('border-top-left-radius');\n root.style.removeProperty('transform');\n highlight.style.opacity = '0';\n\n // Remove temp properties after animation is finished\n root.addEventListener('transitionend', onTransitionEnd);\n }\n}\n\nexport function inDescendingOrder(arr: number[]) {\n for (let i = 0; i < arr.length; i++) {\n if (arr[i + 1] > arr[i]) return false;\n }\n\n return true;\n}\n\nexport function validateSnapTo({\n snapTo,\n sheetHeight,\n}: {\n snapTo: number;\n sheetHeight: number;\n}) {\n if (snapTo < 0) {\n console.warn(\n `Snap point is out of bounds. Sheet height is ${sheetHeight} but snap point is ${sheetHeight +\n Math.abs(snapTo)}.`\n );\n }\n\n return Math.max(Math.round(snapTo), 0);\n}\n","import * as React from 'react';\n\nimport { IS_SSR } from './constants';\nimport { SheetEvents } from './types';\nimport { applyRootStyles, cleanupRootStyles } from './utils';\n\nexport const useIsomorphicLayoutEffect = IS_SSR\n ? React.useEffect\n : React.useLayoutEffect;\n\nexport const useModalEffect = (isOpen: boolean, rootId?: string) => {\n const prevOpen = usePrevious(isOpen);\n\n // Automatically apply the iOS modal effect to the body when sheet opens/closes\n React.useEffect(() => {\n if (rootId && !prevOpen && isOpen) {\n applyRootStyles(rootId);\n } else if (rootId && !isOpen && prevOpen) {\n cleanupRootStyles(rootId);\n }\n }, [isOpen, prevOpen]); // eslint-disable-line\n\n // Make sure to cleanup modal styles on unmount\n React.useEffect(() => {\n return () => {\n if (rootId && isOpen) cleanupRootStyles(rootId);\n };\n }, [isOpen]); // eslint-disable-line\n};\n\nexport const useEventCallbacks = (\n isOpen: boolean,\n callbacks: React.MutableRefObject<SheetEvents>\n) => {\n const prevOpen = usePrevious(isOpen);\n const didOpen = React.useRef(false);\n\n // Because of AnimatePrecence we don't have access to latest isOpen value\n // so we need to read and write to a ref to determine if we are\n // opening or closing the sheet\n const handleAnimationComplete = React.useCallback(() => {\n if (!didOpen.current) {\n callbacks.current.onOpenEnd?.();\n didOpen.current = true;\n } else {\n callbacks.current.onCloseEnd?.();\n didOpen.current = false;\n }\n }, [isOpen, prevOpen]); // eslint-disable-line\n\n React.useEffect(() => {\n if (!prevOpen && isOpen) {\n callbacks.current.onOpenStart?.();\n } else if (!isOpen && prevOpen) {\n callbacks.current.onCloseStart?.();\n }\n }, [isOpen, prevOpen]); // eslint-disable-line\n\n return { handleAnimationComplete };\n};\n\nexport function useWindowHeight() {\n const [windowHeight, setWindowHeight] = React.useState(0);\n\n useIsomorphicLayoutEffect(() => {\n const updateHeight = () => setWindowHeight(window.innerHeight);\n window.addEventListener('resize', updateHeight);\n updateHeight();\n return () => window.removeEventListener('resize', updateHeight);\n }, []);\n\n return windowHeight;\n}\n\nexport function usePrevious<T>(state: T): T | undefined {\n const ref = React.useRef<T>();\n\n React.useEffect(() => {\n ref.current = state;\n });\n\n return ref.current;\n}\n\n// Userland version of the `useEvent` React hook:\n// RFC: https://github.com/reactjs/rfcs/blob/useevent/text/0000-useevent.md\nexport function useEvent<T extends (...args: any[]) => any>(handler: T) {\n const handlerRef = React.useRef<T>();\n\n useIsomorphicLayoutEffect(() => {\n handlerRef.current = handler;\n });\n\n return React.useCallback((...args: any[]) => {\n const fn = handlerRef.current;\n return fn?.(...args);\n }, []) as T;\n}\n","import * as React from 'react';\nimport { SheetContextType } from './types';\n\nexport const SheetContext = React.createContext<SheetContextType | undefined>(\n undefined\n);\n\nexport const useSheetContext = () => {\n const context = React.useContext(SheetContext);\n if (!context) throw Error('Sheet context error');\n return context;\n};\n","import * as CSS from 'csstype';\n\nconst styles: { [key: string]: CSS.Properties } = {\n wrapper: {\n position: 'fixed',\n top: 0,\n bottom: 0,\n left: 0,\n right: 0,\n zIndex: 9999999,\n overflow: 'hidden',\n pointerEvents: 'none',\n },\n backdrop: {\n zIndex: 1,\n position: 'fixed',\n top: 0,\n left: 0,\n width: '100%',\n height: '100%',\n backgroundColor: 'rgba(51, 51, 51, 0.5)',\n touchAction: 'none', // Disable iOS body scrolling\n },\n container: {\n zIndex: 2,\n position: 'absolute',\n left: 0,\n bottom: 0,\n width: '100%',\n backgroundColor: '#fff',\n borderTopRightRadius: '8px',\n borderTopLeftRadius: '8px',\n boxShadow: '0px -2px 16px rgba(0, 0, 0, 0.3)',\n display: 'flex',\n flexDirection: 'column',\n pointerEvents: 'auto',\n },\n headerWrapper: {\n width: '100%',\n },\n header: {\n height: '40px',\n width: '100%',\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n },\n indicator: {\n width: '18px',\n height: '4px',\n borderRadius: '99px',\n backgroundColor: '#ddd',\n },\n content: {\n flex: 1,\n overflow: 'auto',\n position: 'relative',\n },\n};\n\nexport default styles;\n","import * as React from 'react';\nimport * as ReactDOM from 'react-dom';\nimport { usePreventScroll } from '@react-aria/overlays';\n\nimport {\n animate,\n AnimatePresence,\n AnimationOptions,\n PanInfo,\n useMotionValue,\n useReducedMotion,\n} from 'framer-motion';\n\nimport {\n useModalEffect,\n useWindowHeight,\n useIsomorphicLayoutEffect,\n useEvent,\n} from './hooks';\n\nimport {\n DEFAULT_SPRING_CONFIG,\n DRAG_CLOSE_THRESHOLD,\n DRAG_VELOCITY_THRESHOLD,\n IS_SSR,\n} from './constants';\n\nimport { SheetContextType, SheetProps } from './types';\nimport { SheetContext } from './context';\nimport { getClosest, inDescendingOrder, validateSnapTo } from './utils';\nimport styles from './styles';\n\nconst Sheet = React.forwardRef<any, SheetProps>(\n (\n {\n onOpenStart,\n onOpenEnd,\n onClose,\n onCloseStart,\n onCloseEnd,\n onSnap,\n children,\n isOpen,\n snapPoints,\n rootId,\n mountPoint,\n style,\n detent = 'full-height',\n initialSnap = 0,\n springConfig = DEFAULT_SPRING_CONFIG,\n disableDrag = false,\n prefersReducedMotion = false,\n ...rest\n },\n ref\n ) => {\n const sheetRef = React.useRef<any>(null);\n const indicatorRotation = useMotionValue(0);\n const windowHeight = useWindowHeight();\n const shouldReduceMotion = useReducedMotion();\n const reduceMotion = Boolean(prefersReducedMotion || shouldReduceMotion);\n const animationOptions: AnimationOptions<number> = reduceMotion\n ? { type: 'tween', duration: 0.01 }\n : { type: 'spring', ...springConfig };\n\n // NOTE: the inital value for `y` doesn't matter since it is overwritten by\n // the value driven by the `AnimatePresence` component when the sheet is opened\n // and after that it is driven by the gestures and/or snapping\n const y = useMotionValue(0);\n\n // Keep the callback fns up-to-date so that they can be accessed inside\n // the effect without including them to the dependencies array\n const callbacks = React.useRef({\n onOpenStart,\n onOpenEnd,\n onCloseStart,\n onCloseEnd,\n });\n\n useIsomorphicLayoutEffect(() => {\n callbacks.current = {\n onOpenStart,\n onOpenEnd,\n onCloseStart,\n onCloseEnd,\n };\n });\n\n if (snapPoints) {\n // Convert negative / percentage snap points to absolute values\n snapPoints = snapPoints.map(point => {\n // Percentage values e.g. between 0.0 and 1.0\n if (point > 0 && point <= 1) return Math.round(point * windowHeight);\n return point < 0 ? windowHeight + point : point; // negative values\n });\n\n console.assert(\n inDescendingOrder(snapPoints) || windowHeight === 0,\n `Snap points need to be in descending order got: [${snapPoints}]`\n );\n }\n\n const onDrag = useEvent((_, { delta }: PanInfo) => {\n // Update drag indicator rotation based on drag velocity\n const velocity = y.getVelocity();\n\n if (velocity > 0) indicatorRotation.set(10);\n if (velocity < 0) indicatorRotation.set(-10);\n\n // Make sure user cannot drag beyond the top of the sheet\n y.set(Math.max(y.get() + delta.y, 0));\n });\n\n const onDragEnd = useEvent((_, { velocity }: PanInfo) => {\n if (velocity.y > DRAG_VELOCITY_THRESHOLD) {\n // User flicked the sheet down\n onClose();\n } else {\n const sheetEl = sheetRef.current as HTMLDivElement;\n const sheetHeight = sheetEl.getBoundingClientRect().height;\n const currentY = y.get();\n\n let snapTo = 0;\n\n if (snapPoints) {\n const snapToValues = snapPoints\n .map(p => sheetHeight - p)\n .filter(p => p >= 0); // negative values can occur with `content-height` detent\n\n // Allow snapping to the top of the sheet if detent is set to `content-height`\n if (detent === 'content-height' && !snapToValues.includes(0)) {\n snapToValues.unshift(0);\n }\n\n // Get the closest snap point\n snapTo = getClosest(snapToValues, currentY);\n } else if (currentY / sheetHeight > DRAG_CLOSE_THRESHOLD) {\n // Close if dragged over enough far\n snapTo = sheetHeight;\n }\n\n snapTo = validateSnapTo({ snapTo, sheetHeight });\n\n // Update the spring value so that the sheet is animated to the snap point\n animate(y, snapTo, animationOptions);\n\n if (snapPoints && onSnap) {\n const snapValue = Math.abs(Math.round(snapPoints[0] - snapTo));\n const snapIndex = snapPoints.indexOf(getClosest(snapPoints, snapValue)); // prettier-ignore\n onSnap(snapIndex);\n }\n\n if (snapTo >= sheetHeight) onClose();\n }\n\n // Reset indicator rotation after dragging\n indicatorRotation.set(0);\n });\n\n // Trigger onSnap callback when sheet is opened or closed\n React.useEffect(() => {\n if (!snapPoints || !onSnap) return;\n const snapIndex = isOpen ? initialSnap : snapPoints.length - 1;\n onSnap(snapIndex);\n }, [isOpen]); // eslint-disable-line\n\n React.useImperativeHandle(ref, () => ({\n y,\n snapTo: (snapIndex: number) => {\n const sheetEl = sheetRef.current as HTMLDivElement | null;\n\n if (\n snapPoints &&\n snapPoints[snapIndex] !== undefined &&\n sheetEl !== null\n ) {\n const sheetHeight = sheetEl.getBoundingClientRect().height;\n const snapPoint = snapPoints[snapIndex];\n const snapTo = validateSnapTo({\n snapTo: sheetHeight - snapPoint,\n sheetHeight,\n });\n\n animate(y, snapTo, animationOptions);\n if (onSnap) onSnap(snapIndex);\n if (snapTo >= sheetHeight) onClose();\n }\n },\n }));\n\n useModalEffect(isOpen, rootId);\n\n // Framer Motion should handle body scroll locking but it's not working\n // properly on iOS. Scroll locking from React Aria seems to work much better.\n usePreventScroll({ isDisabled: !isOpen });\n\n const dragProps = React.useMemo(() => {\n const dragProps: SheetContextType['dragProps'] = {\n drag: 'y',\n dragElastic: 0,\n dragConstraints: { top: 0, bottom: 0 },\n dragMomentum: false,\n onDrag,\n onDragEnd,\n };\n\n return disableDrag ? undefined : dragProps;\n }, [disableDrag]); // eslint-disable-line\n\n const context: SheetContextType = {\n y,\n sheetRef,\n isOpen,\n initialSnap,\n snapPoints,\n detent,\n indicatorRotation,\n callbacks,\n dragProps,\n windowHeight,\n animationOptions,\n reduceMotion,\n };\n\n const sheet = (\n <SheetContext.Provider value={context}>\n <div {...rest} ref={ref} style={{ ...styles.wrapper, ...style }}>\n <AnimatePresence>\n {/* NOTE: AnimatePresence requires us to set keys to children */}\n {isOpen\n ? React.Children.map(children, (child: any, i) =>\n React.cloneElement(child, { key: `sheet-child-${i}` })\n )\n : null}\n </AnimatePresence>\n </div>\n </SheetContext.Provider>\n );\n\n if (IS_SSR) return sheet;\n\n return ReactDOM.createPortal(sheet, mountPoint ?? document.body);\n }\n);\n\nexport default Sheet;\n","import * as React from 'react';\nimport { motion } from 'framer-motion';\nimport mergeRefs from 'react-merge-refs';\n\nimport { SheetContainerProps } from './types';\nimport { useSheetContext } from './context';\nimport { useEventCallbacks } from './hooks';\nimport { MAX_HEIGHT } from './constants';\nimport styles from './styles';\n\nconst SheetContainer = React.forwardRef<any, SheetContainerProps>(\n ({ children, style = {}, ...rest }, ref) => {\n const {\n y,\n isOpen,\n callbacks,\n snapPoints,\n initialSnap = 0,\n sheetRef,\n windowHeight,\n detent,\n animationOptions,\n reduceMotion,\n } = useSheetContext();\n\n const { handleAnimationComplete } = useEventCallbacks(isOpen, callbacks);\n const initialY = snapPoints ? snapPoints[0] - snapPoints[initialSnap] : 0;\n const maxSnapHeight = snapPoints ? snapPoints[0] : null;\n\n const height =\n maxSnapHeight !== null\n ? `min(${maxSnapHeight}px, ${MAX_HEIGHT})`\n : MAX_HEIGHT;\n\n return (\n <motion.div\n {...rest}\n ref={mergeRefs([sheetRef, ref])}\n className=\"react-modal-sheet-container\"\n style={{\n ...styles.container,\n ...style,\n ...(detent === 'full-height' && { height }),\n ...(detent === 'content-height' && { maxHeight: height }),\n y,\n }}\n initial={reduceMotion ? false : { y: windowHeight }}\n animate={{ y: initialY, transition: animationOptions }}\n exit={{ y: windowHeight, transition: animationOptions }}\n onAnimationComplete={handleAnimationComplete}\n >\n {children}\n </motion.div>\n );\n }\n);\n\nexport default SheetContainer;\n","import * as React from 'react';\nimport { motion } from 'framer-motion';\n\nimport { SheetDraggableProps } from './types';\nimport { useSheetContext } from './context';\nimport styles from './styles';\n\nconst SheetContent = React.forwardRef<any, SheetDraggableProps>(\n ({ children, style, disableDrag, ...rest }, ref) => {\n const { dragProps } = useSheetContext();\n const _dragProps = disableDrag ? undefined : dragProps;\n\n return (\n <motion.div\n {...rest}\n ref={ref}\n className=\"react-modal-sheet-content\"\n style={{ ...styles.content, ...style }}\n {..._dragProps}\n >\n {children}\n </motion.div>\n );\n }\n);\n\nexport default SheetContent;\n","import * as React from 'react';\nimport { motion, useTransform } from 'framer-motion';\n\nimport { SheetDraggableProps } from './types';\nimport { useSheetContext } from './context';\nimport styles from './styles';\n\nconst SheetHeader = React.forwardRef<any, SheetDraggableProps>(\n ({ children, style, disableDrag, ...rest }, ref) => {\n const { indicatorRotation, dragProps } = useSheetContext();\n const _dragProps = disableDrag ? undefined : dragProps;\n\n const indicator1Transform = useTransform(\n indicatorRotation,\n r => `translateX(2px) rotate(${r}deg)`\n );\n\n const indicator2Transform = useTransform(\n indicatorRotation,\n r => `translateX(-2px) rotate(${-1 * r}deg)`\n );\n\n return (\n <motion.div\n {...rest}\n ref={ref}\n style={{ ...styles.headerWrapper, ...style }}\n {..._dragProps}\n >\n {children || (\n <div className=\"react-modal-sheet-header\" style={styles.header}>\n <motion.span\n className=\"react-modal-sheet-drag-indicator\"\n style={{ ...styles.indicator, transform: indicator1Transform }}\n />\n <motion.span\n className=\"react-modal-sheet-drag-indicator\"\n style={{ ...styles.indicator, transform: indicator2Transform }}\n />\n </div>\n )}\n </motion.div>\n );\n }\n);\n\nexport default SheetHeader;\n","import * as React from 'react';\nimport { motion } from 'framer-motion';\n\nimport { SheetBackdropProps } from './types';\nimport styles from './styles';\n\nconst isClickable = (props: any) => !!props.onClick || !!props.onTap;\n\nconst SheetBackdrop = React.forwardRef<any, SheetBackdropProps>(\n ({ style = {}, ...rest }, ref) => {\n const Comp = isClickable(rest) ? motion.button : motion.div;\n const pointerEvents = isClickable(rest) ? 'auto' : 'none';\n\n return (\n <Comp\n {...rest}\n ref={ref}\n className=\"react-modal-sheet-backdrop\"\n style={{ ...styles.backdrop, ...style, pointerEvents }}\n initial={{ opacity: 0 }}\n animate={{ opacity: 1 }}\n exit={{ opacity: 0 }}\n />\n );\n }\n);\n\nexport default SheetBackdrop;\n","import { MotionValue } from 'framer-motion';\n\nimport Sheet from './sheet';\nimport SheetContainer from './SheetContainer';\nimport SheetContent from './SheetContent';\nimport SheetHeader from './SheetHeader';\nimport SheetBackdrop from './SheetBackdrop';\nimport { SheetCompound } from './types';\n\nexport type SheetRef = {\n y: MotionValue<number>;\n snapTo: (index: number) => void;\n};\n\n// HACK: this is needed to get the typing to work properly...\nconst _SheetCompound: any = Sheet;\n_SheetCompound.Container = SheetContainer;\n_SheetCompound.Header = SheetHeader;\n_SheetCompound.Content = SheetContent;\n_SheetCompound.Backdrop = SheetBackdrop;\n\nexport default _SheetCompound as SheetCompound;\n"],"names":["MAX_HEIGHT","IS_SSR","window","DEFAULT_SPRING_CONFIG","stiffness","damping","mass","DRAG_CLOSE_THRESHOLD","DRAG_VELOCITY_THRESHOLD","getClosest","nums","goal","reduce","prev","curr","Math","abs","highlightId","applyRootStyles","rootId","body","document","querySelector","root","p","h","innerHeight","s","style","backgroundColor","overflow","willChange","transition","transform","borderTopRightRadius","borderTopLeftRadius","highlight","createElement","setAttribute","id","position","top","left","bottom","right","opacity","appendChild","requestAnimationFrame","cleanupRootStyles","getElementById","onTransitionEnd","removeProperty","removeEventListener","parentNode","removeChild","addEventListener","inDescendingOrder","arr","i","length","validateSnapTo","snapTo","sheetHeight","console","warn","max","round","useIsomorphicLayoutEffect","React","useModalEffect","isOpen","prevOpen","usePrevious","useEventCallbacks","callbacks","didOpen","handleAnimationComplete","current","onOpenEnd","onCloseEnd","onOpenStart","onCloseStart","useWindowHeight","windowHeight","setWindowHeight","updateHeight","state","ref","useEvent","handler","handlerRef","fn","args","SheetContext","undefined","useSheetContext","context","Error","styles","wrapper","zIndex","pointerEvents","backdrop","width","height","touchAction","container","boxShadow","display","flexDirection","headerWrapper","header","alignItems","justifyContent","indicator","borderRadius","content","flex","Sheet","onClose","onSnap","children","snapPoints","mountPoint","detent","initialSnap","springConfig","disableDrag","prefersReducedMotion","rest","sheetRef","indicatorRotation","useMotionValue","shouldReduceMotion","useReducedMotion","reduceMotion","Boolean","animationOptions","type","duration","y","map","point","assert","onDrag","_","delta","velocity","getVelocity","set","get","onDragEnd","sheetEl","getBoundingClientRect","currentY","snapToValues","filter","includes","unshift","animate","snapValue","snapIndex","indexOf","snapPoint","usePreventScroll","isDisabled","dragProps","drag","dragElastic","dragConstraints","dragMomentum","sheet","Provider","value","AnimatePresence","child","key","ReactDOM","SheetContainer","initialY","maxSnapHeight","motion","div","mergeRefs","className","maxHeight","initial","exit","onAnimationComplete","SheetContent","_dragProps","SheetHeader","indicator1Transform","useTransform","r","indicator2Transform","span","isClickable","props","onClick","onTap","SheetBackdrop","Comp","button","_SheetCompound","Container","Header","Content","Backdrop"],"mappings":"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"}
|
package/dist/sheet.d.ts
CHANGED
|
@@ -10,5 +10,6 @@ declare const Sheet: React.ForwardRefExoticComponent<{
|
|
|
10
10
|
initialSnap?: number | undefined;
|
|
11
11
|
springConfig?: import("popmotion").SpringOptions | undefined;
|
|
12
12
|
disableDrag?: boolean | undefined;
|
|
13
|
+
prefersReducedMotion?: boolean | undefined;
|
|
13
14
|
} & import("./types").SheetEvents & React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<any>>;
|
|
14
15
|
export default Sheet;
|
package/dist/types.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
|
-
import { DragHandlers, MotionValue, useSpring, MotionProps } from 'framer-motion';
|
|
2
|
+
import { DragHandlers, MotionValue, useSpring, MotionProps, AnimationOptions } from 'framer-motion';
|
|
3
3
|
export declare type SheetEvents = {
|
|
4
4
|
onOpenStart?: () => void;
|
|
5
5
|
onOpenEnd?: () => void;
|
|
@@ -19,6 +19,7 @@ export declare type SheetProps = {
|
|
|
19
19
|
initialSnap?: number;
|
|
20
20
|
springConfig?: Parameters<typeof useSpring>[1];
|
|
21
21
|
disableDrag?: boolean;
|
|
22
|
+
prefersReducedMotion?: boolean;
|
|
22
23
|
} & SheetEvents & React.HTMLAttributes<HTMLDivElement>;
|
|
23
24
|
export declare type SheetContainerProps = Omit<MotionProps, 'initial' | 'animate' | 'exit' | 'onAnimationComplete'> & {
|
|
24
25
|
children: React.ReactNode;
|
|
@@ -41,13 +42,14 @@ export declare type SheetContextType = {
|
|
|
41
42
|
sheetRef: React.MutableRefObject<any>;
|
|
42
43
|
isOpen: boolean;
|
|
43
44
|
snapPoints: SheetProps['snapPoints'];
|
|
44
|
-
detent
|
|
45
|
+
detent: SheetDetent;
|
|
45
46
|
initialSnap: SheetProps['initialSnap'];
|
|
46
47
|
indicatorRotation: MotionValue<number>;
|
|
47
48
|
callbacks: React.MutableRefObject<SheetEvents>;
|
|
48
49
|
dragProps?: SheetDragProps;
|
|
49
50
|
windowHeight: number;
|
|
50
|
-
|
|
51
|
+
animationOptions: AnimationOptions<number>;
|
|
52
|
+
reduceMotion: boolean;
|
|
51
53
|
};
|
|
52
54
|
declare type ContainerComponent = React.ForwardRefExoticComponent<SheetContainerProps & React.RefAttributes<any>>;
|
|
53
55
|
declare type DraggableComponent = React.ForwardRefExoticComponent<SheetDraggableProps & React.RefAttributes<any>>;
|
package/package.json
CHANGED
package/src/SheetContainer.tsx
CHANGED
|
@@ -18,8 +18,9 @@ const SheetContainer = React.forwardRef<any, SheetContainerProps>(
|
|
|
18
18
|
initialSnap = 0,
|
|
19
19
|
sheetRef,
|
|
20
20
|
windowHeight,
|
|
21
|
-
|
|
22
|
-
|
|
21
|
+
detent,
|
|
22
|
+
animationOptions,
|
|
23
|
+
reduceMotion,
|
|
23
24
|
} = useSheetContext();
|
|
24
25
|
|
|
25
26
|
const { handleAnimationComplete } = useEventCallbacks(isOpen, callbacks);
|
|
@@ -43,12 +44,9 @@ const SheetContainer = React.forwardRef<any, SheetContainerProps>(
|
|
|
43
44
|
...(detent === 'content-height' && { maxHeight: height }),
|
|
44
45
|
y,
|
|
45
46
|
}}
|
|
46
|
-
initial={{ y: windowHeight }}
|
|
47
|
-
animate={{
|
|
48
|
-
|
|
49
|
-
transition: { type: 'spring', ...springConfig },
|
|
50
|
-
}}
|
|
51
|
-
exit={{ y: windowHeight }}
|
|
47
|
+
initial={reduceMotion ? false : { y: windowHeight }}
|
|
48
|
+
animate={{ y: initialY, transition: animationOptions }}
|
|
49
|
+
exit={{ y: windowHeight, transition: animationOptions }}
|
|
52
50
|
onAnimationComplete={handleAnimationComplete}
|
|
53
51
|
>
|
|
54
52
|
{children}
|