{"version":3,"file":"use-transition.cjs","sources":["../../../src/components/Transition/use-transition.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\nimport ReactDOM from 'react-dom';\nimport { useDidUpdate, useReducedMotion } from '@raikou/hooks';\nimport { useRaikouTheme } from '../../core';\n\nexport type TransitionStatus =\n  | 'entered'\n  | 'exited'\n  | 'entering'\n  | 'exiting'\n  | 'pre-exiting'\n  | 'pre-entering';\n\ninterface UseTransition {\n  duration: number;\n  exitDuration: number;\n  timingFunction: string;\n  mounted: boolean;\n  onEnter?: () => void;\n  onExit?: () => void;\n  onEntered?: () => void;\n  onExited?: () => void;\n  enterDelay?: number;\n  exitDelay?: number;\n}\n\nexport function useTransition({\n  duration,\n  exitDuration,\n  timingFunction,\n  mounted,\n  onEnter,\n  onExit,\n  onEntered,\n  onExited,\n  enterDelay,\n  exitDelay,\n}: UseTransition) {\n  const theme = useRaikouTheme();\n  const shouldReduceMotion = useReducedMotion();\n  const reduceMotion = theme.respectReducedMotion ? shouldReduceMotion : false;\n  const [transitionDuration, setTransitionDuration] = useState(reduceMotion ? 0 : duration);\n  const [transitionStatus, setStatus] = useState<TransitionStatus>(mounted ? 'entered' : 'exited');\n  const transitionTimeoutRef = useRef<number>(-1);\n  const delayTimeoutRef = useRef<number>(-1);\n  const rafRef = useRef(-1);\n\n  const handleStateChange = (shouldMount: boolean) => {\n    const preHandler = shouldMount ? onEnter : onExit;\n    const handler = shouldMount ? onEntered : onExited;\n\n    window.clearTimeout(transitionTimeoutRef.current);\n\n    const newTransitionDuration = reduceMotion ? 0 : shouldMount ? duration : exitDuration;\n    setTransitionDuration(newTransitionDuration);\n\n    if (newTransitionDuration === 0) {\n      typeof preHandler === 'function' && preHandler();\n      typeof handler === 'function' && handler();\n      setStatus(shouldMount ? 'entered' : 'exited');\n    } else {\n      // Make sure new status won't be set within the same frame as this would disrupt animation #3126\n      rafRef.current = requestAnimationFrame(() => {\n        ReactDOM.flushSync(() => {\n          setStatus(shouldMount ? 'pre-entering' : 'pre-exiting');\n        });\n\n        rafRef.current = requestAnimationFrame(() => {\n          typeof preHandler === 'function' && preHandler();\n          setStatus(shouldMount ? 'entering' : 'exiting');\n\n          transitionTimeoutRef.current = window.setTimeout(() => {\n            typeof handler === 'function' && handler();\n            setStatus(shouldMount ? 'entered' : 'exited');\n          }, newTransitionDuration);\n        });\n      });\n    }\n  };\n\n  const handleTransitionWithDelay = (shouldMount: boolean) => {\n    window.clearTimeout(delayTimeoutRef.current);\n    const delay = shouldMount ? enterDelay : exitDelay;\n\n    if (typeof delay !== 'number') {\n      handleStateChange(shouldMount);\n      return;\n    }\n\n    delayTimeoutRef.current = window.setTimeout(\n      () => {\n        handleStateChange(shouldMount);\n      },\n      shouldMount ? enterDelay : exitDelay\n    );\n  };\n\n  useDidUpdate(() => {\n    handleTransitionWithDelay(mounted);\n  }, [mounted]);\n\n  useEffect(\n    () => () => {\n      window.clearTimeout(transitionTimeoutRef.current);\n      cancelAnimationFrame(rafRef.current);\n    },\n    []\n  );\n\n  return {\n    transitionDuration,\n    transitionStatus,\n    transitionTimingFunction: timingFunction || 'ease',\n  };\n}\n"],"names":["useRaikouTheme","useReducedMotion","useState","useRef","ReactDOM","useDidUpdate","useEffect"],"mappings":"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"}