@siberiacancode/reactuse 0.2.12 → 0.2.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/helpers/createContext/createContext.cjs.map +1 -1
- package/dist/cjs/helpers/createReactiveContext/createReactiveContext.cjs.map +1 -1
- package/dist/cjs/helpers/createStore/createStore.cjs.map +1 -1
- package/dist/cjs/hooks/useActiveElement/useActiveElement.cjs +1 -1
- package/dist/cjs/hooks/useActiveElement/useActiveElement.cjs.map +1 -1
- package/dist/cjs/hooks/useAsync/useAsync.cjs.map +1 -1
- package/dist/cjs/hooks/useBattery/useBattery.cjs +1 -1
- package/dist/cjs/hooks/useBattery/useBattery.cjs.map +1 -1
- package/dist/cjs/hooks/useBluetooth/useBluetooth.cjs +1 -1
- package/dist/cjs/hooks/useBluetooth/useBluetooth.cjs.map +1 -1
- package/dist/cjs/hooks/useBoolean/useBoolean.cjs.map +1 -1
- package/dist/cjs/hooks/useBreakpoints/useBreakpoints.cjs.map +1 -1
- package/dist/cjs/hooks/useBrowserLanguage/useBrowserLanguage.cjs.map +1 -1
- package/dist/cjs/hooks/useClickOutside/useClickOutside.cjs.map +1 -1
- package/dist/cjs/hooks/useClipboard/useClipboard.cjs +1 -1
- package/dist/cjs/hooks/useClipboard/useClipboard.cjs.map +1 -1
- package/dist/cjs/hooks/useCookie/useCookie.cjs +1 -1
- package/dist/cjs/hooks/useCookie/useCookie.cjs.map +1 -1
- package/dist/cjs/hooks/useCookies/useCookies.cjs +1 -1
- package/dist/cjs/hooks/useCookies/useCookies.cjs.map +1 -1
- package/dist/cjs/hooks/useCopy/useCopy.cjs.map +1 -1
- package/dist/cjs/hooks/useCounter/useCounter.cjs +1 -1
- package/dist/cjs/hooks/useCounter/useCounter.cjs.map +1 -1
- package/dist/cjs/hooks/useCssVar/useCssVar.cjs +1 -1
- package/dist/cjs/hooks/useCssVar/useCssVar.cjs.map +1 -1
- package/dist/cjs/hooks/useDebounceCallback/useDebounceCallback.cjs +1 -1
- package/dist/cjs/hooks/useDebounceCallback/useDebounceCallback.cjs.map +1 -1
- package/dist/cjs/hooks/useDebounceValue/useDebounceValue.cjs.map +1 -1
- package/dist/cjs/hooks/useDeviceMotion/useDeviceMotion.cjs +1 -1
- package/dist/cjs/hooks/useDeviceMotion/useDeviceMotion.cjs.map +1 -1
- package/dist/cjs/hooks/useDeviceOrientation/useDeviceOrientation.cjs.map +1 -1
- package/dist/cjs/hooks/useDevicePixelRatio/useDevicePixelRatio.cjs.map +1 -1
- package/dist/cjs/hooks/useDidUpdate/useDidUpdate.cjs.map +1 -1
- package/dist/cjs/hooks/useDisclosure/useDisclosure.cjs +1 -1
- package/dist/cjs/hooks/useDisclosure/useDisclosure.cjs.map +1 -1
- package/dist/cjs/hooks/useDisplayMedia/useDisplayMedia.cjs +1 -1
- package/dist/cjs/hooks/useDisplayMedia/useDisplayMedia.cjs.map +1 -1
- package/dist/cjs/hooks/useDocumentEvent/useDocumentEvent.cjs.map +1 -1
- package/dist/cjs/hooks/useDocumentTitle/useDocumentTitle.cjs +1 -1
- package/dist/cjs/hooks/useDocumentTitle/useDocumentTitle.cjs.map +1 -1
- package/dist/cjs/hooks/useDocumentVisibility/useDocumentVisibility.cjs.map +1 -1
- package/dist/cjs/hooks/useDoubleClick/useDoubleClick.cjs +1 -1
- package/dist/cjs/hooks/useDoubleClick/useDoubleClick.cjs.map +1 -1
- package/dist/cjs/hooks/useDropZone/useDropZone.cjs +1 -1
- package/dist/cjs/hooks/useDropZone/useDropZone.cjs.map +1 -1
- package/dist/cjs/hooks/useElementSize/useElementSize.cjs.map +1 -1
- package/dist/cjs/hooks/useEvent/useEvent.cjs.map +1 -1
- package/dist/cjs/hooks/useEventListener/useEventListener.cjs.map +1 -1
- package/dist/cjs/hooks/useEventSource/useEventSource.cjs +1 -1
- package/dist/cjs/hooks/useEventSource/useEventSource.cjs.map +1 -1
- package/dist/cjs/hooks/useEyeDropper/useEyeDropper.cjs.map +1 -1
- package/dist/cjs/hooks/useFavicon/useFavicon.cjs +1 -1
- package/dist/cjs/hooks/useFavicon/useFavicon.cjs.map +1 -1
- package/dist/cjs/hooks/useField/useField.cjs +1 -1
- package/dist/cjs/hooks/useField/useField.cjs.map +1 -1
- package/dist/cjs/hooks/useFileDialog/useFileDialog.cjs +1 -1
- package/dist/cjs/hooks/useFileDialog/useFileDialog.cjs.map +1 -1
- package/dist/cjs/hooks/useFocus/useFocus.cjs +1 -1
- package/dist/cjs/hooks/useFocus/useFocus.cjs.map +1 -1
- package/dist/cjs/hooks/useFps/useFps.cjs.map +1 -1
- package/dist/cjs/hooks/useFul/useFul.cjs.map +1 -1
- package/dist/cjs/hooks/useFullscreen/useFullscreen.cjs +1 -1
- package/dist/cjs/hooks/useFullscreen/useFullscreen.cjs.map +1 -1
- package/dist/cjs/hooks/useGamepad/useGamepad.cjs.map +1 -1
- package/dist/cjs/hooks/useGeolocation/useGeolocation.cjs +1 -1
- package/dist/cjs/hooks/useGeolocation/useGeolocation.cjs.map +1 -1
- package/dist/cjs/hooks/useHash/useHash.cjs.map +1 -1
- package/dist/cjs/hooks/useHotkeys/useHotkeys.cjs +1 -1
- package/dist/cjs/hooks/useHotkeys/useHotkeys.cjs.map +1 -1
- package/dist/cjs/hooks/useHover/useHover.cjs +1 -1
- package/dist/cjs/hooks/useHover/useHover.cjs.map +1 -1
- package/dist/cjs/hooks/useIdle/useIdle.cjs.map +1 -1
- package/dist/cjs/hooks/useImage/useImage.cjs.map +1 -1
- package/dist/cjs/hooks/useInfiniteScroll/useInfiniteScroll.cjs +1 -1
- package/dist/cjs/hooks/useInfiniteScroll/useInfiniteScroll.cjs.map +1 -1
- package/dist/cjs/hooks/useIntersectionObserver/useIntersectionObserver.cjs +1 -1
- package/dist/cjs/hooks/useIntersectionObserver/useIntersectionObserver.cjs.map +1 -1
- package/dist/cjs/hooks/useInterval/useInterval.cjs +1 -1
- package/dist/cjs/hooks/useInterval/useInterval.cjs.map +1 -1
- package/dist/cjs/hooks/useIsFirstRender/useIsFirstRender.cjs.map +1 -1
- package/dist/cjs/hooks/useKeyPress/useKeyPress.cjs +1 -1
- package/dist/cjs/hooks/useKeyPress/useKeyPress.cjs.map +1 -1
- package/dist/cjs/hooks/useKeyPressEvent/useKeyPressEvent.cjs +1 -1
- package/dist/cjs/hooks/useKeyPressEvent/useKeyPressEvent.cjs.map +1 -1
- package/dist/cjs/hooks/useKeyboard/useKeyboard.cjs +1 -1
- package/dist/cjs/hooks/useKeyboard/useKeyboard.cjs.map +1 -1
- package/dist/cjs/hooks/useKeysPressed/useKeysPressed.cjs +1 -1
- package/dist/cjs/hooks/useKeysPressed/useKeysPressed.cjs.map +1 -1
- package/dist/cjs/hooks/useLastChanged/useLastChanged.cjs +1 -1
- package/dist/cjs/hooks/useLastChanged/useLastChanged.cjs.map +1 -1
- package/dist/cjs/hooks/useLatest/useLatest.cjs +1 -1
- package/dist/cjs/hooks/useLatest/useLatest.cjs.map +1 -1
- package/dist/cjs/hooks/useLess/useLess.cjs.map +1 -1
- package/dist/cjs/hooks/useList/useList.cjs.map +1 -1
- package/dist/cjs/hooks/useLockCallback/useLockCallback.cjs.map +1 -1
- package/dist/cjs/hooks/useLogger/useLogger.cjs.map +1 -1
- package/dist/cjs/hooks/useLongPress/useLongPress.cjs +1 -1
- package/dist/cjs/hooks/useLongPress/useLongPress.cjs.map +1 -1
- package/dist/cjs/hooks/useMap/useMap.cjs.map +1 -1
- package/dist/cjs/hooks/useMeasure/useMeasure.cjs.map +1 -1
- package/dist/cjs/hooks/useMediaQuery/useMediaQuery.cjs.map +1 -1
- package/dist/cjs/hooks/useMemory/useMemory.cjs +1 -1
- package/dist/cjs/hooks/useMemory/useMemory.cjs.map +1 -1
- package/dist/cjs/hooks/useMount/useMount.cjs.map +1 -1
- package/dist/cjs/hooks/useMouse/useMouse.cjs.map +1 -1
- package/dist/cjs/hooks/useMutation/useMutation.cjs +1 -1
- package/dist/cjs/hooks/useMutation/useMutation.cjs.map +1 -1
- package/dist/cjs/hooks/useMutationObserver/useMutationObserver.cjs +1 -1
- package/dist/cjs/hooks/useMutationObserver/useMutationObserver.cjs.map +1 -1
- package/dist/cjs/hooks/useNetwork/useNetwork.cjs +1 -1
- package/dist/cjs/hooks/useNetwork/useNetwork.cjs.map +1 -1
- package/dist/cjs/hooks/useOffsetPagination/useOffsetPagination.cjs.map +1 -1
- package/dist/cjs/hooks/useOnce/useOnce.cjs.map +1 -1
- package/dist/cjs/hooks/useOnline/useOnline.cjs.map +1 -1
- package/dist/cjs/hooks/useOperatingSystem/useOperatingSystem.cjs.map +1 -1
- package/dist/cjs/hooks/useOptimistic/useOptimistic.cjs.map +1 -1
- package/dist/cjs/hooks/useOrientation/useOrientation.cjs.map +1 -1
- package/dist/cjs/hooks/useOtpCredential/useOtpCredential.cjs +1 -1
- package/dist/cjs/hooks/useOtpCredential/useOtpCredential.cjs.map +1 -1
- package/dist/cjs/hooks/usePageLeave/usePageLeave.cjs +1 -1
- package/dist/cjs/hooks/usePageLeave/usePageLeave.cjs.map +1 -1
- package/dist/cjs/hooks/usePaint/usePaint.cjs +1 -1
- package/dist/cjs/hooks/usePaint/usePaint.cjs.map +1 -1
- package/dist/cjs/hooks/useParallax/useParallax.cjs.map +1 -1
- package/dist/cjs/hooks/usePerformanceObserver/usePerformanceObserver.cjs +1 -1
- package/dist/cjs/hooks/usePerformanceObserver/usePerformanceObserver.cjs.map +1 -1
- package/dist/cjs/hooks/usePermission/usePermission.cjs +1 -1
- package/dist/cjs/hooks/usePermission/usePermission.cjs.map +1 -1
- package/dist/cjs/hooks/usePointerLock/usePointerLock.cjs.map +1 -1
- package/dist/cjs/hooks/usePostMessage/usePostMessage.cjs.map +1 -1
- package/dist/cjs/hooks/usePreferredColorScheme/usePreferredColorScheme.cjs.map +1 -1
- package/dist/cjs/hooks/usePreferredContrast/usePreferredContrast.cjs.map +1 -1
- package/dist/cjs/hooks/usePreferredLanguages/usePreferredLanguages.cjs.map +1 -1
- package/dist/cjs/hooks/usePreferredReducedMotion/usePreferredReducedMotion.cjs.map +1 -1
- package/dist/cjs/hooks/usePrevious/usePrevious.cjs +1 -1
- package/dist/cjs/hooks/usePrevious/usePrevious.cjs.map +1 -1
- package/dist/cjs/hooks/useQuery/useQuery.cjs +1 -1
- package/dist/cjs/hooks/useQuery/useQuery.cjs.map +1 -1
- package/dist/cjs/hooks/useQueue/useQueue.cjs.map +1 -1
- package/dist/cjs/hooks/useRaf/useRaf.cjs +1 -1
- package/dist/cjs/hooks/useRaf/useRaf.cjs.map +1 -1
- package/dist/cjs/hooks/useRafValue/useRafValue.cjs.map +1 -1
- package/dist/cjs/hooks/useRefState/useRefState.cjs.map +1 -1
- package/dist/cjs/hooks/useRenderCount/useRenderCount.cjs.map +1 -1
- package/dist/cjs/hooks/useRenderInfo/useRenderInfo.cjs.map +1 -1
- package/dist/cjs/hooks/useRerender/useRerender.cjs.map +1 -1
- package/dist/cjs/hooks/useResizeObserver/useResizeObserver.cjs +1 -1
- package/dist/cjs/hooks/useResizeObserver/useResizeObserver.cjs.map +1 -1
- package/dist/cjs/hooks/useScreenOrientation/useScreenOrientation.cjs +1 -1
- package/dist/cjs/hooks/useScreenOrientation/useScreenOrientation.cjs.map +1 -1
- package/dist/cjs/hooks/useScript/useScript.cjs +1 -1
- package/dist/cjs/hooks/useScript/useScript.cjs.map +1 -1
- package/dist/cjs/hooks/useScroll/useScroll.cjs +1 -1
- package/dist/cjs/hooks/useScroll/useScroll.cjs.map +1 -1
- package/dist/cjs/hooks/useScrollIntoView/useScrollIntoView.cjs.map +1 -1
- package/dist/cjs/hooks/useScrollTo/useScrollTo.cjs.map +1 -1
- package/dist/cjs/hooks/useSet/useSet.cjs.map +1 -1
- package/dist/cjs/hooks/useShare/useShare.cjs.map +1 -1
- package/dist/cjs/hooks/useSpeechRecognition/useSpeechRecognition.cjs +1 -1
- package/dist/cjs/hooks/useSpeechRecognition/useSpeechRecognition.cjs.map +1 -1
- package/dist/cjs/hooks/useSpeechSynthesis/useSpeechSynthesis.cjs +1 -1
- package/dist/cjs/hooks/useSpeechSynthesis/useSpeechSynthesis.cjs.map +1 -1
- package/dist/cjs/hooks/useStateHistory/useStateHistory.cjs.map +1 -1
- package/dist/cjs/hooks/useStep/useStep.cjs.map +1 -1
- package/dist/cjs/hooks/useSticky/useSticky.cjs +1 -1
- package/dist/cjs/hooks/useSticky/useSticky.cjs.map +1 -1
- package/dist/cjs/hooks/useStopwatch/useStopwatch.cjs +1 -1
- package/dist/cjs/hooks/useStopwatch/useStopwatch.cjs.map +1 -1
- package/dist/cjs/hooks/useStorage/useStorage.cjs +1 -1
- package/dist/cjs/hooks/useStorage/useStorage.cjs.map +1 -1
- package/dist/cjs/hooks/useTextDirection/useTextDirection.cjs +1 -1
- package/dist/cjs/hooks/useTextDirection/useTextDirection.cjs.map +1 -1
- package/dist/cjs/hooks/useTextSelection/useTextSelection.cjs +1 -1
- package/dist/cjs/hooks/useTextSelection/useTextSelection.cjs.map +1 -1
- package/dist/cjs/hooks/useThrottleCallback/useThrottleCallback.cjs.map +1 -1
- package/dist/cjs/hooks/useThrottleValue/useThrottleValue.cjs.map +1 -1
- package/dist/cjs/hooks/useTime/useTime.cjs.map +1 -1
- package/dist/cjs/hooks/useTimeout/useTimeout.cjs.map +1 -1
- package/dist/cjs/hooks/useTimer/useTimer.cjs +1 -1
- package/dist/cjs/hooks/useTimer/useTimer.cjs.map +1 -1
- package/dist/cjs/hooks/useToggle/useToggle.cjs.map +1 -1
- package/dist/cjs/hooks/useUnmount/useUnmount.cjs.map +1 -1
- package/dist/cjs/hooks/useUrlSearchParam/useUrlSearchParam.cjs +1 -1
- package/dist/cjs/hooks/useUrlSearchParam/useUrlSearchParam.cjs.map +1 -1
- package/dist/cjs/hooks/useUrlSearchParams/useUrlSearchParams.cjs +1 -1
- package/dist/cjs/hooks/useUrlSearchParams/useUrlSearchParams.cjs.map +1 -1
- package/dist/cjs/hooks/useVibrate/useVibrate.cjs.map +1 -1
- package/dist/cjs/hooks/useWakeLock/useWakeLock.cjs +1 -1
- package/dist/cjs/hooks/useWakeLock/useWakeLock.cjs.map +1 -1
- package/dist/cjs/hooks/useWebSocket/useWebSocket.cjs +1 -1
- package/dist/cjs/hooks/useWebSocket/useWebSocket.cjs.map +1 -1
- package/dist/cjs/hooks/useWindowEvent/useWindowEvent.cjs.map +1 -1
- package/dist/cjs/hooks/useWindowFocus/useWindowFocus.cjs.map +1 -1
- package/dist/cjs/hooks/useWindowScroll/useWindowScroll.cjs.map +1 -1
- package/dist/cjs/hooks/useWindowSize/useWindowSize.cjs +1 -1
- package/dist/cjs/hooks/useWindowSize/useWindowSize.cjs.map +1 -1
- package/dist/cjs/hooks/useWizard/useWizard.cjs +1 -1
- package/dist/cjs/hooks/useWizard/useWizard.cjs.map +1 -1
- package/dist/cjs/utils/helpers/copy.cjs.map +1 -1
- package/dist/cjs/utils/helpers/debounce.cjs +1 -1
- package/dist/cjs/utils/helpers/debounce.cjs.map +1 -1
- package/dist/cjs/utils/helpers/getDate.cjs.map +1 -1
- package/dist/cjs/utils/helpers/getElement.cjs.map +1 -1
- package/dist/cjs/utils/helpers/getRetry.cjs.map +1 -1
- package/dist/cjs/utils/helpers/isTarget.cjs.map +1 -1
- package/dist/cjs/utils/helpers/throttle.cjs.map +1 -1
- package/dist/esm/helpers/createContext/createContext.mjs.map +1 -1
- package/dist/esm/helpers/createReactiveContext/createReactiveContext.mjs.map +1 -1
- package/dist/esm/helpers/createStore/createStore.mjs.map +1 -1
- package/dist/esm/hooks/useActiveElement/useActiveElement.mjs +1 -1
- package/dist/esm/hooks/useActiveElement/useActiveElement.mjs.map +1 -1
- package/dist/esm/hooks/useAsync/useAsync.mjs.map +1 -1
- package/dist/esm/hooks/useBattery/useBattery.mjs +10 -10
- package/dist/esm/hooks/useBattery/useBattery.mjs.map +1 -1
- package/dist/esm/hooks/useBluetooth/useBluetooth.mjs +14 -15
- package/dist/esm/hooks/useBluetooth/useBluetooth.mjs.map +1 -1
- package/dist/esm/hooks/useBoolean/useBoolean.mjs.map +1 -1
- package/dist/esm/hooks/useBreakpoints/useBreakpoints.mjs.map +1 -1
- package/dist/esm/hooks/useBrowserLanguage/useBrowserLanguage.mjs.map +1 -1
- package/dist/esm/hooks/useClickOutside/useClickOutside.mjs.map +1 -1
- package/dist/esm/hooks/useClipboard/useClipboard.mjs +13 -14
- package/dist/esm/hooks/useClipboard/useClipboard.mjs.map +1 -1
- package/dist/esm/hooks/useConst/useConst.mjs.map +1 -1
- package/dist/esm/hooks/useCookie/useCookie.mjs +27 -27
- package/dist/esm/hooks/useCookie/useCookie.mjs.map +1 -1
- package/dist/esm/hooks/useCookies/useCookies.mjs +19 -19
- package/dist/esm/hooks/useCookies/useCookies.mjs.map +1 -1
- package/dist/esm/hooks/useCopy/useCopy.mjs.map +1 -1
- package/dist/esm/hooks/useCounter/useCounter.mjs +5 -6
- package/dist/esm/hooks/useCounter/useCounter.mjs.map +1 -1
- package/dist/esm/hooks/useCssVar/useCssVar.mjs +13 -14
- package/dist/esm/hooks/useCssVar/useCssVar.mjs.map +1 -1
- package/dist/esm/hooks/useDebounceCallback/useDebounceCallback.mjs +14 -7
- package/dist/esm/hooks/useDebounceCallback/useDebounceCallback.mjs.map +1 -1
- package/dist/esm/hooks/useDebounceValue/useDebounceValue.mjs.map +1 -1
- package/dist/esm/hooks/useDefault/useDefault.mjs.map +1 -1
- package/dist/esm/hooks/useDeviceMotion/useDeviceMotion.mjs +18 -19
- package/dist/esm/hooks/useDeviceMotion/useDeviceMotion.mjs.map +1 -1
- package/dist/esm/hooks/useDeviceOrientation/useDeviceOrientation.mjs.map +1 -1
- package/dist/esm/hooks/useDevicePixelRatio/useDevicePixelRatio.mjs.map +1 -1
- package/dist/esm/hooks/useDidUpdate/useDidUpdate.mjs.map +1 -1
- package/dist/esm/hooks/useDisclosure/useDisclosure.mjs +5 -11
- package/dist/esm/hooks/useDisclosure/useDisclosure.mjs.map +1 -1
- package/dist/esm/hooks/useDisplayMedia/useDisplayMedia.mjs +28 -28
- package/dist/esm/hooks/useDisplayMedia/useDisplayMedia.mjs.map +1 -1
- package/dist/esm/hooks/useDocumentEvent/useDocumentEvent.mjs.map +1 -1
- package/dist/esm/hooks/useDocumentTitle/useDocumentTitle.mjs +15 -15
- package/dist/esm/hooks/useDocumentTitle/useDocumentTitle.mjs.map +1 -1
- package/dist/esm/hooks/useDocumentVisibility/useDocumentVisibility.mjs.map +1 -1
- package/dist/esm/hooks/useDoubleClick/useDoubleClick.mjs +11 -13
- package/dist/esm/hooks/useDoubleClick/useDoubleClick.mjs.map +1 -1
- package/dist/esm/hooks/useDropZone/useDropZone.mjs +27 -28
- package/dist/esm/hooks/useDropZone/useDropZone.mjs.map +1 -1
- package/dist/esm/hooks/useElementSize/useElementSize.mjs.map +1 -1
- package/dist/esm/hooks/useEvent/useEvent.mjs.map +1 -1
- package/dist/esm/hooks/useEventListener/useEventListener.mjs.map +1 -1
- package/dist/esm/hooks/useEventSource/useEventSource.mjs +37 -40
- package/dist/esm/hooks/useEventSource/useEventSource.mjs.map +1 -1
- package/dist/esm/hooks/useEyeDropper/useEyeDropper.mjs.map +1 -1
- package/dist/esm/hooks/useFavicon/useFavicon.mjs +11 -12
- package/dist/esm/hooks/useFavicon/useFavicon.mjs.map +1 -1
- package/dist/esm/hooks/useField/useField.mjs +45 -49
- package/dist/esm/hooks/useField/useField.mjs.map +1 -1
- package/dist/esm/hooks/useFileDialog/useFileDialog.mjs +22 -25
- package/dist/esm/hooks/useFileDialog/useFileDialog.mjs.map +1 -1
- package/dist/esm/hooks/useFocus/useFocus.mjs +24 -32
- package/dist/esm/hooks/useFocus/useFocus.mjs.map +1 -1
- package/dist/esm/hooks/useFps/useFps.mjs.map +1 -1
- package/dist/esm/hooks/useFul/useFul.mjs.map +1 -1
- package/dist/esm/hooks/useFullscreen/useFullscreen.mjs +23 -24
- package/dist/esm/hooks/useFullscreen/useFullscreen.mjs.map +1 -1
- package/dist/esm/hooks/useGamepad/useGamepad.mjs.map +1 -1
- package/dist/esm/hooks/useGeolocation/useGeolocation.mjs +24 -24
- package/dist/esm/hooks/useGeolocation/useGeolocation.mjs.map +1 -1
- package/dist/esm/hooks/useHash/useHash.mjs.map +1 -1
- package/dist/esm/hooks/useHotkeys/useHotkeys.mjs +24 -25
- package/dist/esm/hooks/useHotkeys/useHotkeys.mjs.map +1 -1
- package/dist/esm/hooks/useHover/useHover.mjs +20 -22
- package/dist/esm/hooks/useHover/useHover.mjs.map +1 -1
- package/dist/esm/hooks/useIdle/useIdle.mjs.map +1 -1
- package/dist/esm/hooks/useImage/useImage.mjs.map +1 -1
- package/dist/esm/hooks/useInfiniteScroll/useInfiniteScroll.mjs +14 -14
- package/dist/esm/hooks/useInfiniteScroll/useInfiniteScroll.mjs.map +1 -1
- package/dist/esm/hooks/useIntersectionObserver/useIntersectionObserver.mjs +19 -20
- package/dist/esm/hooks/useIntersectionObserver/useIntersectionObserver.mjs.map +1 -1
- package/dist/esm/hooks/useInterval/useInterval.mjs +8 -8
- package/dist/esm/hooks/useInterval/useInterval.mjs.map +1 -1
- package/dist/esm/hooks/useIsFirstRender/useIsFirstRender.mjs.map +1 -1
- package/dist/esm/hooks/useKeyPress/useKeyPress.mjs +22 -24
- package/dist/esm/hooks/useKeyPress/useKeyPress.mjs.map +1 -1
- package/dist/esm/hooks/useKeyPressEvent/useKeyPressEvent.mjs +23 -23
- package/dist/esm/hooks/useKeyPressEvent/useKeyPressEvent.mjs.map +1 -1
- package/dist/esm/hooks/useKeyboard/useKeyboard.mjs +16 -22
- package/dist/esm/hooks/useKeyboard/useKeyboard.mjs.map +1 -1
- package/dist/esm/hooks/useKeysPressed/useKeysPressed.mjs +20 -20
- package/dist/esm/hooks/useKeysPressed/useKeysPressed.mjs.map +1 -1
- package/dist/esm/hooks/useLastChanged/useLastChanged.mjs +6 -6
- package/dist/esm/hooks/useLastChanged/useLastChanged.mjs.map +1 -1
- package/dist/esm/hooks/useLatest/useLatest.mjs +12 -4
- package/dist/esm/hooks/useLatest/useLatest.mjs.map +1 -1
- package/dist/esm/hooks/useLess/useLess.mjs.map +1 -1
- package/dist/esm/hooks/useList/useList.mjs.map +1 -1
- package/dist/esm/hooks/useLockCallback/useLockCallback.mjs.map +1 -1
- package/dist/esm/hooks/useLogger/useLogger.mjs.map +1 -1
- package/dist/esm/hooks/useLongPress/useLongPress.mjs +23 -27
- package/dist/esm/hooks/useLongPress/useLongPress.mjs.map +1 -1
- package/dist/esm/hooks/useMap/useMap.mjs.map +1 -1
- package/dist/esm/hooks/useMeasure/useMeasure.mjs.map +1 -1
- package/dist/esm/hooks/useMediaQuery/useMediaQuery.mjs.map +1 -1
- package/dist/esm/hooks/useMemory/useMemory.mjs +1 -1
- package/dist/esm/hooks/useMemory/useMemory.mjs.map +1 -1
- package/dist/esm/hooks/useMount/useMount.mjs.map +1 -1
- package/dist/esm/hooks/useMouse/useMouse.mjs.map +1 -1
- package/dist/esm/hooks/useMutation/useMutation.mjs +38 -42
- package/dist/esm/hooks/useMutation/useMutation.mjs.map +1 -1
- package/dist/esm/hooks/useMutationObserver/useMutationObserver.mjs +12 -12
- package/dist/esm/hooks/useMutationObserver/useMutationObserver.mjs.map +1 -1
- package/dist/esm/hooks/useNetwork/useNetwork.mjs +28 -28
- package/dist/esm/hooks/useNetwork/useNetwork.mjs.map +1 -1
- package/dist/esm/hooks/useOffsetPagination/useOffsetPagination.mjs.map +1 -1
- package/dist/esm/hooks/useOnce/useOnce.mjs.map +1 -1
- package/dist/esm/hooks/useOnline/useOnline.mjs.map +1 -1
- package/dist/esm/hooks/useOperatingSystem/useOperatingSystem.mjs.map +1 -1
- package/dist/esm/hooks/useOptimistic/useOptimistic.mjs.map +1 -1
- package/dist/esm/hooks/useOrientation/useOrientation.mjs.map +1 -1
- package/dist/esm/hooks/useOtpCredential/useOtpCredential.mjs +12 -13
- package/dist/esm/hooks/useOtpCredential/useOtpCredential.mjs.map +1 -1
- package/dist/esm/hooks/usePageLeave/usePageLeave.mjs +6 -6
- package/dist/esm/hooks/usePageLeave/usePageLeave.mjs.map +1 -1
- package/dist/esm/hooks/usePaint/usePaint.mjs +87 -93
- package/dist/esm/hooks/usePaint/usePaint.mjs.map +1 -1
- package/dist/esm/hooks/useParallax/useParallax.mjs.map +1 -1
- package/dist/esm/hooks/usePerformanceObserver/usePerformanceObserver.mjs +17 -19
- package/dist/esm/hooks/usePerformanceObserver/usePerformanceObserver.mjs.map +1 -1
- package/dist/esm/hooks/usePermission/usePermission.mjs +13 -13
- package/dist/esm/hooks/usePermission/usePermission.mjs.map +1 -1
- package/dist/esm/hooks/usePointerLock/usePointerLock.mjs.map +1 -1
- package/dist/esm/hooks/usePostMessage/usePostMessage.mjs.map +1 -1
- package/dist/esm/hooks/usePreferredColorScheme/usePreferredColorScheme.mjs.map +1 -1
- package/dist/esm/hooks/usePreferredContrast/usePreferredContrast.mjs.map +1 -1
- package/dist/esm/hooks/usePreferredDark/usePreferredDark.mjs.map +1 -1
- package/dist/esm/hooks/usePreferredLanguages/usePreferredLanguages.mjs.map +1 -1
- package/dist/esm/hooks/usePrevious/usePrevious.mjs +4 -4
- package/dist/esm/hooks/usePrevious/usePrevious.mjs.map +1 -1
- package/dist/esm/hooks/useQuery/useQuery.mjs +39 -41
- package/dist/esm/hooks/useQuery/useQuery.mjs.map +1 -1
- package/dist/esm/hooks/useQueue/useQueue.mjs.map +1 -1
- package/dist/esm/hooks/useRaf/useRaf.mjs +21 -21
- package/dist/esm/hooks/useRaf/useRaf.mjs.map +1 -1
- package/dist/esm/hooks/useRafValue/useRafValue.mjs.map +1 -1
- package/dist/esm/hooks/useRefState/useRefState.mjs.map +1 -1
- package/dist/esm/hooks/useRenderCount/useRenderCount.mjs.map +1 -1
- package/dist/esm/hooks/useRenderInfo/useRenderInfo.mjs.map +1 -1
- package/dist/esm/hooks/useRerender/useRerender.mjs.map +1 -1
- package/dist/esm/hooks/useResizeObserver/useResizeObserver.mjs +16 -17
- package/dist/esm/hooks/useResizeObserver/useResizeObserver.mjs.map +1 -1
- package/dist/esm/hooks/useScreenOrientation/useScreenOrientation.mjs +11 -11
- package/dist/esm/hooks/useScreenOrientation/useScreenOrientation.mjs.map +1 -1
- package/dist/esm/hooks/useScript/useScript.mjs +16 -16
- package/dist/esm/hooks/useScript/useScript.mjs.map +1 -1
- package/dist/esm/hooks/useScroll/useScroll.mjs +37 -39
- package/dist/esm/hooks/useScroll/useScroll.mjs.map +1 -1
- package/dist/esm/hooks/useScrollIntoView/useScrollIntoView.mjs.map +1 -1
- package/dist/esm/hooks/useScrollTo/useScrollTo.mjs.map +1 -1
- package/dist/esm/hooks/useSet/useSet.mjs.map +1 -1
- package/dist/esm/hooks/useShare/useShare.mjs.map +1 -1
- package/dist/esm/hooks/useSpeechRecognition/useSpeechRecognition.mjs +35 -35
- package/dist/esm/hooks/useSpeechRecognition/useSpeechRecognition.mjs.map +1 -1
- package/dist/esm/hooks/useSpeechSynthesis/useSpeechSynthesis.mjs +36 -42
- package/dist/esm/hooks/useSpeechSynthesis/useSpeechSynthesis.mjs.map +1 -1
- package/dist/esm/hooks/useStateHistory/useStateHistory.mjs.map +1 -1
- package/dist/esm/hooks/useStep/useStep.mjs.map +1 -1
- package/dist/esm/hooks/useSticky/useSticky.mjs +12 -12
- package/dist/esm/hooks/useSticky/useSticky.mjs.map +1 -1
- package/dist/esm/hooks/useStopwatch/useStopwatch.mjs +10 -11
- package/dist/esm/hooks/useStopwatch/useStopwatch.mjs.map +1 -1
- package/dist/esm/hooks/useStorage/useStorage.mjs +27 -27
- package/dist/esm/hooks/useStorage/useStorage.mjs.map +1 -1
- package/dist/esm/hooks/useTextDirection/useTextDirection.mjs +21 -24
- package/dist/esm/hooks/useTextDirection/useTextDirection.mjs.map +1 -1
- package/dist/esm/hooks/useTextSelection/useTextSelection.mjs +7 -7
- package/dist/esm/hooks/useTextSelection/useTextSelection.mjs.map +1 -1
- package/dist/esm/hooks/useThrottleCallback/useThrottleCallback.mjs.map +1 -1
- package/dist/esm/hooks/useThrottleValue/useThrottleValue.mjs.map +1 -1
- package/dist/esm/hooks/useTime/useTime.mjs.map +1 -1
- package/dist/esm/hooks/useTimeout/useTimeout.mjs.map +1 -1
- package/dist/esm/hooks/useTimer/useTimer.mjs +51 -54
- package/dist/esm/hooks/useTimer/useTimer.mjs.map +1 -1
- package/dist/esm/hooks/useToggle/useToggle.mjs.map +1 -1
- package/dist/esm/hooks/useUnmount/useUnmount.mjs.map +1 -1
- package/dist/esm/hooks/useUrlSearchParam/useUrlSearchParam.mjs +38 -38
- package/dist/esm/hooks/useUrlSearchParam/useUrlSearchParam.mjs.map +1 -1
- package/dist/esm/hooks/useUrlSearchParams/useUrlSearchParams.mjs +29 -29
- package/dist/esm/hooks/useUrlSearchParams/useUrlSearchParams.mjs.map +1 -1
- package/dist/esm/hooks/useVibrate/useVibrate.mjs.map +1 -1
- package/dist/esm/hooks/useWakeLock/useWakeLock.mjs +16 -16
- package/dist/esm/hooks/useWakeLock/useWakeLock.mjs.map +1 -1
- package/dist/esm/hooks/useWebSocket/useWebSocket.mjs +28 -38
- package/dist/esm/hooks/useWebSocket/useWebSocket.mjs.map +1 -1
- package/dist/esm/hooks/useWindowEvent/useWindowEvent.mjs.map +1 -1
- package/dist/esm/hooks/useWindowFocus/useWindowFocus.mjs.map +1 -1
- package/dist/esm/hooks/useWindowScroll/useWindowScroll.mjs.map +1 -1
- package/dist/esm/hooks/useWindowSize/useWindowSize.mjs +9 -9
- package/dist/esm/hooks/useWindowSize/useWindowSize.mjs.map +1 -1
- package/dist/esm/hooks/useWizard/useWizard.mjs +9 -11
- package/dist/esm/hooks/useWizard/useWizard.mjs.map +1 -1
- package/dist/esm/utils/helpers/copy.mjs.map +1 -1
- package/dist/esm/utils/helpers/debounce.mjs +6 -5
- package/dist/esm/utils/helpers/debounce.mjs.map +1 -1
- package/dist/esm/utils/helpers/getDate.mjs.map +1 -1
- package/dist/esm/utils/helpers/getElement.mjs.map +1 -1
- package/dist/esm/utils/helpers/getRetry.mjs.map +1 -1
- package/dist/esm/utils/helpers/isTarget.mjs.map +1 -1
- package/dist/esm/utils/helpers/throttle.mjs.map +1 -1
- package/dist/types/hooks/useDebounceCallback/useDebounceCallback.d.ts +4 -1
- package/dist/types/hooks/useLatest/useLatest.d.ts +8 -3
- package/dist/types/utils/helpers/debounce.d.ts +5 -1
- package/package.json +6 -6
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePaint.mjs","sources":["../../../../src/hooks/usePaint/usePaint.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { getElement, isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useEvent } from '../useEvent/useEvent';\nimport { useRefState } from '../useRefState/useRefState';\n\nconst DEFAULT_BRUSH_RADIUS = 10;\n\nexport interface Point {\n x: number;\n y: number;\n}\n\nexport class Pointer implements Point {\n x: number;\n\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n\n update(point: Point) {\n this.x = point.x;\n this.y = point.y;\n }\n\n getDifferenceTo(point: Point) {\n return new Pointer(this.x - point.x, this.y - point.y);\n }\n\n getDistanceTo(point: Point) {\n const diff = this.getDifferenceTo(point);\n return Math.sqrt(diff.x ** 2 + diff.y ** 2);\n }\n\n getAngleTo(point: Point) {\n const diff = this.getDifferenceTo(point);\n return Math.atan2(diff.y, diff.x);\n }\n\n equalsTo(point: Point) {\n return this.x === point.x && this.y === point.y;\n }\n\n moveByAngle(\n // The angle in radians\n angle: number,\n // How much the point should be moved\n distance: number\n ) {\n // Rotate the angle based on the browser coordinate system ([0,0] in the top left)\n const angleRotated = angle + Math.PI / 2;\n\n this.x += Math.sin(angleRotated) * distance;\n this.y -= Math.cos(angleRotated) * distance;\n\n return this;\n }\n}\n\nexport class Paint {\n pointer: Pointer;\n\n brush: Pointer;\n\n radius: number;\n\n smooth: boolean = false;\n\n points: Point[] = [];\n\n lines: { points: Point[]; color: string; radius: number; opacity: number }[] = [];\n\n constructor({ x, y, radius, smooth }: { x: number; y: number; radius: number; smooth: boolean }) {\n this.smooth = smooth;\n this.pointer = new Pointer(x, y);\n this.brush = new Pointer(x, y);\n this.radius = radius;\n this.points = [];\n this.lines = [];\n }\n\n getBrushCoordinates() {\n return {\n x: this.brush.x,\n y: this.brush.y\n };\n }\n\n getPointerCoordinates() {\n return {\n x: this.pointer.x,\n y: this.pointer.y\n };\n }\n\n update(point: Point) {\n if (this.pointer.equalsTo(point)) return false;\n this.pointer.update(point);\n\n if (!this.smooth) {\n this.brush.update(point);\n this.points.push(this.getBrushCoordinates());\n return true;\n }\n\n const distance = this.pointer.getDistanceTo(this.brush);\n const angle = this.pointer.getAngleTo(this.brush);\n const isOutside = Math.round((distance - this.radius) * 10) / 10 > 0;\n\n if (isOutside) {\n const angleRotated = angle + Math.PI / 2;\n this.brush.update({\n x: this.brush.x + Math.sin(angleRotated) * (distance - this.radius),\n y: this.brush.y - Math.cos(angleRotated) * (distance - this.radius)\n });\n this.points.push(this.getBrushCoordinates());\n return true;\n }\n\n return false;\n }\n}\n\nexport interface UsePaintOptions {\n /** Brush color */\n color?: string;\n /** Initial lines */\n initialLines?: Paint['lines'];\n /** Brush opacity */\n opacity?: number;\n /** Brush radius */\n radius?: number;\n /** Smooth brush movement */\n smooth?: boolean;\n /** Callback when the mouse is down */\n onMouseDown?: (event: MouseEvent, paint: Paint) => void;\n /** Callback when the mouse is moved */\n onMouseMove?: (event: MouseEvent, paint: Paint) => void;\n /** Callback when the mouse is up */\n onMouseUp?: (event: MouseEvent, paint: Paint) => void;\n}\n\nexport interface UsePaintReturn {\n drawing: boolean;\n lines: Paint['lines'];\n clear: () => void;\n draw: (points: Point[], color: string, opacity: number, radius: number) => void;\n undo: () => void;\n}\n\nexport interface UsePaint {\n (target: HookTarget, options?: UsePaintOptions): UsePaintReturn;\n\n <Target extends HTMLCanvasElement>(\n options?: UsePaintOptions,\n target?: never\n ): UsePaintReturn & { ref: StateRef<Target> };\n}\n\n/**\n * @name usePaint\n * @description - Hook that allows you to draw in a specific area\n * @category Browser\n *\n * @overload\n * @param {HookTarget} target The target element to be painted\n * @param {UsePaintOptions} [options] The options to be used\n * @returns {UsePaintReturn} An object containing the current pencil options and functions to interact with the paint\n *\n * @example\n * const drawing = usePaint(canvasRef);\n *\n * @overload\n * @param {UsePaintOptions} [options] The options to be used\n * @returns {UsePaintReturn & { ref: StateRef<HTMLCanvasElement> }} An object containing the current pencil options and functions to interact with the paint\n *\n * @example\n * const { ref, drawing } = usePaint();\n */\nexport const usePaint = ((...params: any[]) => {\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const options = ((target ? params[1] : params[0]) as UsePaintOptions) ?? {};\n\n const color = options?.color ?? 'black';\n const opacity = options?.opacity ?? 1;\n const radius = options?.radius ?? DEFAULT_BRUSH_RADIUS;\n\n const paintRef = useRef<Paint>(\n new Paint({\n x: 0,\n y: 0,\n radius: options?.radius ?? DEFAULT_BRUSH_RADIUS,\n smooth: options?.smooth ?? false\n })\n );\n const [drawing, setIsDrawing] = useState(false);\n const internalRef = useRefState<HTMLCanvasElement>();\n const contextRef = useRef<CanvasRenderingContext2D | null>(null);\n\n const draw = (points: Point[], color: string, opacity: number, radius: number) => {\n if (!contextRef.current) return;\n\n contextRef.current.globalAlpha = opacity;\n contextRef.current.strokeStyle = color;\n contextRef.current.lineWidth = radius * 2;\n contextRef.current.lineCap = 'round';\n contextRef.current.lineJoin = 'round';\n\n let p1 = points[0];\n let p2 = points[1];\n\n contextRef.current.beginPath();\n\n for (let i = 1; i < points.length; i += 1) {\n const midPoint = {\n x: p1.x + (p2.x - p1.x) / 2,\n y: p1.y + (p2.y - p1.y) / 2\n };\n contextRef.current.quadraticCurveTo(p1.x, p1.y, midPoint.x, midPoint.y);\n p1 = points[i];\n p2 = points[i + 1];\n }\n contextRef.current.lineTo(p1.x, p1.y);\n contextRef.current.stroke();\n };\n\n const clearCanvas = () => {\n if (!contextRef.current) return;\n contextRef.current.clearRect(\n 0,\n 0,\n contextRef.current.canvas.width,\n contextRef.current.canvas.height\n );\n };\n\n const onMouseMove = useEvent((event: MouseEvent) => {\n if (!drawing) return;\n options?.onMouseMove?.(event, paintRef.current);\n\n const point = { x: event.offsetX, y: event.offsetY };\n\n const isUpdated = paintRef.current.update(point);\n\n if (!isUpdated) return;\n if (!contextRef.current) return;\n clearCanvas();\n contextRef.current.clearRect(\n 0,\n 0,\n contextRef.current.canvas.width,\n contextRef.current.canvas.height\n );\n\n // const brush = paintRef.current.getBrushCoordinates();\n // // Draw brush point\n // contextRef.current.beginPath();\n // contextRef.current.fillStyle = 'red';\n // contextRef.current.arc(brush.x, brush.y, radius, 0, Math.PI * 2, true);\n // contextRef.current.fill();\n\n // // Draw the lazy radius.\n // contextRef.current.beginPath();\n // contextRef.current.strokeStyle = '#ccc';\n // contextRef.current.arc(brush.x, brush.y, radius * 2, 0, Math.PI * 2, true);\n // contextRef.current.stroke();\n\n paintRef.current.lines.forEach(({ points, color, opacity, radius }) =>\n draw(points, color, opacity, radius)\n );\n draw(paintRef.current.points, color, opacity, radius);\n });\n\n const onMouseDown = useEvent((event: MouseEvent) => {\n if (!contextRef.current) return;\n\n const point = { x: event.offsetX, y: event.offsetY };\n paintRef.current.brush.update(point);\n paintRef.current.points.push(point);\n draw(paintRef.current.points, color, opacity, radius);\n\n options?.onMouseDown?.(event, paintRef.current);\n setIsDrawing(true);\n });\n\n const onMouseUp = useEvent((event: MouseEvent) => {\n if (!contextRef.current) return;\n\n if (paintRef.current.points.length) {\n paintRef.current.lines.push({ points: paintRef.current.points, color, opacity, radius });\n paintRef.current.points = [];\n }\n\n options?.onMouseUp?.(event, paintRef.current);\n setIsDrawing(false);\n });\n\n const clear = () => {\n if (!contextRef.current) return;\n clearCanvas();\n paintRef.current.lines = [];\n paintRef.current.points = [];\n };\n\n const undo = () => {\n if (!contextRef.current) return;\n clearCanvas();\n\n paintRef.current.lines.pop();\n paintRef.current.lines.forEach(({ points, color, opacity, radius }) =>\n draw(points, color, opacity, radius)\n );\n };\n\n useEffect(() => {\n if (!target && !internalRef.state) return;\n\n const element = (target ? getElement(target) : internalRef.current) as HTMLCanvasElement;\n if (!element) return;\n contextRef.current = element.getContext('2d');\n\n if (options?.initialLines) {\n paintRef.current.lines = options.initialLines;\n options.initialLines.forEach(({ points, color, opacity, radius }) =>\n draw(points, color, opacity, radius)\n );\n }\n\n element.addEventListener('mousedown', onMouseDown);\n element.addEventListener('mousemove', onMouseMove);\n element.addEventListener('mouseup', onMouseUp);\n\n return () => {\n if (!element) return;\n element.removeEventListener('mousedown', onMouseDown);\n element.removeEventListener('mousemove', onMouseMove);\n element.removeEventListener('mouseup', onMouseUp);\n };\n }, [target, internalRef.state]);\n\n if (target) return { drawing, clear, undo, draw, lines: paintRef.current.lines };\n return { ref: internalRef, drawing, clear, undo, draw, lines: paintRef.current.lines };\n}) as UsePaint;\n"],"names":["DEFAULT_BRUSH_RADIUS","Pointer","x","y","__publicField","point","diff","angle","distance","angleRotated","Paint","radius","smooth","usePaint","params","target","isTarget","options","color","opacity","paintRef","useRef","drawing","setIsDrawing","useState","internalRef","useRefState","contextRef","draw","points","p1","p2","i","midPoint","clearCanvas","onMouseMove","useEvent","event","_a","onMouseDown","onMouseUp","clear","undo","useEffect","element","getElement"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"usePaint.mjs","sources":["../../../../src/hooks/usePaint/usePaint.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { getElement, isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useEvent } from '../useEvent/useEvent';\nimport { useRefState } from '../useRefState/useRefState';\n\nconst DEFAULT_BRUSH_RADIUS = 10;\n\nexport interface Point {\n x: number;\n y: number;\n}\n\nexport class Pointer implements Point {\n x: number;\n\n y: number;\n\n constructor(x: number, y: number) {\n this.x = x;\n this.y = y;\n }\n\n update(point: Point) {\n this.x = point.x;\n this.y = point.y;\n }\n\n getDifferenceTo(point: Point) {\n return new Pointer(this.x - point.x, this.y - point.y);\n }\n\n getDistanceTo(point: Point) {\n const diff = this.getDifferenceTo(point);\n return Math.sqrt(diff.x ** 2 + diff.y ** 2);\n }\n\n getAngleTo(point: Point) {\n const diff = this.getDifferenceTo(point);\n return Math.atan2(diff.y, diff.x);\n }\n\n equalsTo(point: Point) {\n return this.x === point.x && this.y === point.y;\n }\n\n moveByAngle(\n // The angle in radians\n angle: number,\n // How much the point should be moved\n distance: number\n ) {\n // Rotate the angle based on the browser coordinate system ([0,0] in the top left)\n const angleRotated = angle + Math.PI / 2;\n\n this.x += Math.sin(angleRotated) * distance;\n this.y -= Math.cos(angleRotated) * distance;\n\n return this;\n }\n}\n\nexport class Paint {\n pointer: Pointer;\n\n brush: Pointer;\n\n radius: number;\n\n smooth: boolean = false;\n\n points: Point[] = [];\n\n lines: { points: Point[]; color: string; radius: number; opacity: number }[] = [];\n\n constructor({ x, y, radius, smooth }: { x: number; y: number; radius: number; smooth: boolean }) {\n this.smooth = smooth;\n this.pointer = new Pointer(x, y);\n this.brush = new Pointer(x, y);\n this.radius = radius;\n this.points = [];\n this.lines = [];\n }\n\n getBrushCoordinates() {\n return {\n x: this.brush.x,\n y: this.brush.y\n };\n }\n\n getPointerCoordinates() {\n return {\n x: this.pointer.x,\n y: this.pointer.y\n };\n }\n\n update(point: Point) {\n if (this.pointer.equalsTo(point)) return false;\n this.pointer.update(point);\n\n if (!this.smooth) {\n this.brush.update(point);\n this.points.push(this.getBrushCoordinates());\n return true;\n }\n\n const distance = this.pointer.getDistanceTo(this.brush);\n const angle = this.pointer.getAngleTo(this.brush);\n const isOutside = Math.round((distance - this.radius) * 10) / 10 > 0;\n\n if (isOutside) {\n const angleRotated = angle + Math.PI / 2;\n this.brush.update({\n x: this.brush.x + Math.sin(angleRotated) * (distance - this.radius),\n y: this.brush.y - Math.cos(angleRotated) * (distance - this.radius)\n });\n this.points.push(this.getBrushCoordinates());\n return true;\n }\n\n return false;\n }\n}\n\nexport interface UsePaintOptions {\n /** Brush color */\n color?: string;\n /** Initial lines */\n initialLines?: Paint['lines'];\n /** Brush opacity */\n opacity?: number;\n /** Brush radius */\n radius?: number;\n /** Smooth brush movement */\n smooth?: boolean;\n /** Callback when the mouse is down */\n onMouseDown?: (event: MouseEvent, paint: Paint) => void;\n /** Callback when the mouse is moved */\n onMouseMove?: (event: MouseEvent, paint: Paint) => void;\n /** Callback when the mouse is up */\n onMouseUp?: (event: MouseEvent, paint: Paint) => void;\n}\n\nexport interface UsePaintReturn {\n drawing: boolean;\n lines: Paint['lines'];\n clear: () => void;\n draw: (points: Point[], color: string, opacity: number, radius: number) => void;\n undo: () => void;\n}\n\nexport interface UsePaint {\n (target: HookTarget, options?: UsePaintOptions): UsePaintReturn;\n\n <Target extends HTMLCanvasElement>(\n options?: UsePaintOptions,\n target?: never\n ): UsePaintReturn & { ref: StateRef<Target> };\n}\n\n/**\n * @name usePaint\n * @description - Hook that allows you to draw in a specific area\n * @category Browser\n *\n * @overload\n * @param {HookTarget} target The target element to be painted\n * @param {UsePaintOptions} [options] The options to be used\n * @returns {UsePaintReturn} An object containing the current pencil options and functions to interact with the paint\n *\n * @example\n * const drawing = usePaint(canvasRef);\n *\n * @overload\n * @param {UsePaintOptions} [options] The options to be used\n * @returns {UsePaintReturn & { ref: StateRef<HTMLCanvasElement> }} An object containing the current pencil options and functions to interact with the paint\n *\n * @example\n * const { ref, drawing } = usePaint();\n */\nexport const usePaint = ((...params: any[]) => {\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const options = ((target ? params[1] : params[0]) as UsePaintOptions) ?? {};\n\n const color = options?.color ?? 'black';\n const opacity = options?.opacity ?? 1;\n const radius = options?.radius ?? DEFAULT_BRUSH_RADIUS;\n\n const paintRef = useRef<Paint>(\n new Paint({\n x: 0,\n y: 0,\n radius: options?.radius ?? DEFAULT_BRUSH_RADIUS,\n smooth: options?.smooth ?? false\n })\n );\n const [drawing, setIsDrawing] = useState(false);\n const internalRef = useRefState<HTMLCanvasElement>();\n const contextRef = useRef<CanvasRenderingContext2D | null>(null);\n\n const draw = (points: Point[], color: string, opacity: number, radius: number) => {\n if (!contextRef.current) return;\n\n contextRef.current.globalAlpha = opacity;\n contextRef.current.strokeStyle = color;\n contextRef.current.lineWidth = radius * 2;\n contextRef.current.lineCap = 'round';\n contextRef.current.lineJoin = 'round';\n\n let p1 = points[0];\n let p2 = points[1];\n\n contextRef.current.beginPath();\n\n for (let i = 1; i < points.length; i += 1) {\n const midPoint = {\n x: p1.x + (p2.x - p1.x) / 2,\n y: p1.y + (p2.y - p1.y) / 2\n };\n contextRef.current.quadraticCurveTo(p1.x, p1.y, midPoint.x, midPoint.y);\n p1 = points[i];\n p2 = points[i + 1];\n }\n contextRef.current.lineTo(p1.x, p1.y);\n contextRef.current.stroke();\n };\n\n const clearCanvas = () => {\n if (!contextRef.current) return;\n contextRef.current.clearRect(\n 0,\n 0,\n contextRef.current.canvas.width,\n contextRef.current.canvas.height\n );\n };\n\n const onMouseMove = useEvent((event: MouseEvent) => {\n if (!drawing) return;\n options?.onMouseMove?.(event, paintRef.current);\n\n const point = { x: event.offsetX, y: event.offsetY };\n\n const isUpdated = paintRef.current.update(point);\n\n if (!isUpdated) return;\n if (!contextRef.current) return;\n clearCanvas();\n contextRef.current.clearRect(\n 0,\n 0,\n contextRef.current.canvas.width,\n contextRef.current.canvas.height\n );\n\n // const brush = paintRef.current.getBrushCoordinates();\n // // Draw brush point\n // contextRef.current.beginPath();\n // contextRef.current.fillStyle = 'red';\n // contextRef.current.arc(brush.x, brush.y, radius, 0, Math.PI * 2, true);\n // contextRef.current.fill();\n\n // // Draw the lazy radius.\n // contextRef.current.beginPath();\n // contextRef.current.strokeStyle = '#ccc';\n // contextRef.current.arc(brush.x, brush.y, radius * 2, 0, Math.PI * 2, true);\n // contextRef.current.stroke();\n\n paintRef.current.lines.forEach(({ points, color, opacity, radius }) =>\n draw(points, color, opacity, radius)\n );\n draw(paintRef.current.points, color, opacity, radius);\n });\n\n const onMouseDown = useEvent((event: MouseEvent) => {\n if (!contextRef.current) return;\n\n const point = { x: event.offsetX, y: event.offsetY };\n paintRef.current.brush.update(point);\n paintRef.current.points.push(point);\n draw(paintRef.current.points, color, opacity, radius);\n\n options?.onMouseDown?.(event, paintRef.current);\n setIsDrawing(true);\n });\n\n const onMouseUp = useEvent((event: MouseEvent) => {\n if (!contextRef.current) return;\n\n if (paintRef.current.points.length) {\n paintRef.current.lines.push({ points: paintRef.current.points, color, opacity, radius });\n paintRef.current.points = [];\n }\n\n options?.onMouseUp?.(event, paintRef.current);\n setIsDrawing(false);\n });\n\n const clear = () => {\n if (!contextRef.current) return;\n clearCanvas();\n paintRef.current.lines = [];\n paintRef.current.points = [];\n };\n\n const undo = () => {\n if (!contextRef.current) return;\n clearCanvas();\n\n paintRef.current.lines.pop();\n paintRef.current.lines.forEach(({ points, color, opacity, radius }) =>\n draw(points, color, opacity, radius)\n );\n };\n\n useEffect(() => {\n if (!target && !internalRef.state) return;\n\n const element = (target ? getElement(target) : internalRef.current) as HTMLCanvasElement;\n if (!element) return;\n contextRef.current = element.getContext('2d');\n\n if (options?.initialLines) {\n paintRef.current.lines = options.initialLines;\n options.initialLines.forEach(({ points, color, opacity, radius }) =>\n draw(points, color, opacity, radius)\n );\n }\n\n element.addEventListener('mousedown', onMouseDown);\n element.addEventListener('mousemove', onMouseMove);\n element.addEventListener('mouseup', onMouseUp);\n\n return () => {\n if (!element) return;\n element.removeEventListener('mousedown', onMouseDown);\n element.removeEventListener('mousemove', onMouseMove);\n element.removeEventListener('mouseup', onMouseUp);\n };\n }, [target, internalRef.state]);\n\n if (target) return { drawing, clear, undo, draw, lines: paintRef.current.lines };\n return { ref: internalRef, drawing, clear, undo, draw, lines: paintRef.current.lines };\n}) as UsePaint;\n"],"names":["DEFAULT_BRUSH_RADIUS","Pointer","x","y","point","diff","angle","distance","angleRotated","Paint","radius","smooth","usePaint","params","target","isTarget","options","color","opacity","paintRef","useRef","drawing","setIsDrawing","useState","internalRef","useRefState","contextRef","draw","points","p1","p2","i","midPoint","clearCanvas","onMouseMove","useEvent","event","onMouseDown","onMouseUp","clear","undo","useEffect","element","getElement"],"mappings":";;;;;AAWA,MAAMA,IAAuB;AAOtB,MAAMC,EAAyB;AAAA,EACpC;AAAA,EAEA;AAAA,EAEA,YAAYC,GAAWC,GAAW;AAChC,SAAK,IAAID,GACT,KAAK,IAAIC;AAAA,EAAA;AAAA,EAGX,OAAOC,GAAc;AACnB,SAAK,IAAIA,EAAM,GACf,KAAK,IAAIA,EAAM;AAAA,EAAA;AAAA,EAGjB,gBAAgBA,GAAc;AAC5B,WAAO,IAAIH,EAAQ,KAAK,IAAIG,EAAM,GAAG,KAAK,IAAIA,EAAM,CAAC;AAAA,EAAA;AAAA,EAGvD,cAAcA,GAAc;AAC1B,UAAMC,IAAO,KAAK,gBAAgBD,CAAK;AACvC,WAAO,KAAK,KAAKC,EAAK,KAAK,IAAIA,EAAK,KAAK,CAAC;AAAA,EAAA;AAAA,EAG5C,WAAWD,GAAc;AACvB,UAAMC,IAAO,KAAK,gBAAgBD,CAAK;AACvC,WAAO,KAAK,MAAMC,EAAK,GAAGA,EAAK,CAAC;AAAA,EAAA;AAAA,EAGlC,SAASD,GAAc;AACrB,WAAO,KAAK,MAAMA,EAAM,KAAK,KAAK,MAAMA,EAAM;AAAA,EAAA;AAAA,EAGhD,YAEEE,GAEAC,GACA;AAEA,UAAMC,IAAeF,IAAQ,KAAK,KAAK;AAEvC,gBAAK,KAAK,KAAK,IAAIE,CAAY,IAAID,GACnC,KAAK,KAAK,KAAK,IAAIC,CAAY,IAAID,GAE5B;AAAA,EAAA;AAEX;AAEO,MAAME,EAAM;AAAA,EACjB;AAAA,EAEA;AAAA,EAEA;AAAA,EAEA,SAAkB;AAAA,EAElB,SAAkB,CAAA;AAAA,EAElB,QAA+E,CAAA;AAAA,EAE/E,YAAY,EAAE,GAAAP,GAAG,GAAAC,GAAG,QAAAO,GAAQ,QAAAC,KAAqE;AAC/F,SAAK,SAASA,GACd,KAAK,UAAU,IAAIV,EAAQC,GAAGC,CAAC,GAC/B,KAAK,QAAQ,IAAIF,EAAQC,GAAGC,CAAC,GAC7B,KAAK,SAASO,GACd,KAAK,SAAS,CAAA,GACd,KAAK,QAAQ,CAAA;AAAA,EAAC;AAAA,EAGhB,sBAAsB;AACpB,WAAO;AAAA,MACL,GAAG,KAAK,MAAM;AAAA,MACd,GAAG,KAAK,MAAM;AAAA,IAAA;AAAA,EAChB;AAAA,EAGF,wBAAwB;AACtB,WAAO;AAAA,MACL,GAAG,KAAK,QAAQ;AAAA,MAChB,GAAG,KAAK,QAAQ;AAAA,IAAA;AAAA,EAClB;AAAA,EAGF,OAAON,GAAc;AACnB,QAAI,KAAK,QAAQ,SAASA,CAAK,EAAG,QAAO;AAGzC,QAFA,KAAK,QAAQ,OAAOA,CAAK,GAErB,CAAC,KAAK;AACR,kBAAK,MAAM,OAAOA,CAAK,GACvB,KAAK,OAAO,KAAK,KAAK,oBAAA,CAAqB,GACpC;AAGT,UAAMG,IAAW,KAAK,QAAQ,cAAc,KAAK,KAAK,GAChDD,IAAQ,KAAK,QAAQ,WAAW,KAAK,KAAK;AAGhD,QAFkB,KAAK,OAAOC,IAAW,KAAK,UAAU,EAAE,IAAI,KAAK,GAEpD;AACb,YAAMC,IAAeF,IAAQ,KAAK,KAAK;AACvC,kBAAK,MAAM,OAAO;AAAA,QAChB,GAAG,KAAK,MAAM,IAAI,KAAK,IAAIE,CAAY,KAAKD,IAAW,KAAK;AAAA,QAC5D,GAAG,KAAK,MAAM,IAAI,KAAK,IAAIC,CAAY,KAAKD,IAAW,KAAK;AAAA,MAAA,CAC7D,GACD,KAAK,OAAO,KAAK,KAAK,oBAAA,CAAqB,GACpC;AAAA,IAAA;AAGT,WAAO;AAAA,EAAA;AAEX;AA0DO,MAAMK,IAAY,IAAIC,MAAkB;AAC7C,QAAMC,IAAUC,EAASF,EAAO,CAAC,CAAC,IAAIA,EAAO,CAAC,IAAI,QAC5CG,KAAYF,IAASD,EAAO,CAAC,IAAIA,EAAO,CAAC,MAA0B,CAAA,GAEnEI,IAAQD,GAAS,SAAS,SAC1BE,IAAUF,GAAS,WAAW,GAC9BN,IAASM,GAAS,UAAUhB,GAE5BmB,IAAWC;AAAA,IACf,IAAIX,EAAM;AAAA,MACR,GAAG;AAAA,MACH,GAAG;AAAA,MACH,QAAQO,GAAS,UAAUhB;AAAA,MAC3B,QAAQgB,GAAS,UAAU;AAAA,IAAA,CAC5B;AAAA,EAAA,GAEG,CAACK,GAASC,CAAY,IAAIC,EAAS,EAAK,GACxCC,IAAcC,EAAA,GACdC,IAAaN,EAAwC,IAAI,GAEzDO,IAAO,CAACC,GAAiBX,GAAeC,GAAiBR,MAAmB;AAChF,QAAI,CAACgB,EAAW,QAAS;AAEzB,IAAAA,EAAW,QAAQ,cAAcR,GACjCQ,EAAW,QAAQ,cAAcT,GACjCS,EAAW,QAAQ,YAAYhB,IAAS,GACxCgB,EAAW,QAAQ,UAAU,SAC7BA,EAAW,QAAQ,WAAW;AAE9B,QAAIG,IAAKD,EAAO,CAAC,GACbE,IAAKF,EAAO,CAAC;AAEjB,IAAAF,EAAW,QAAQ,UAAA;AAEnB,aAASK,IAAI,GAAGA,IAAIH,EAAO,QAAQG,KAAK,GAAG;AACzC,YAAMC,IAAW;AAAA,QACf,GAAGH,EAAG,KAAKC,EAAG,IAAID,EAAG,KAAK;AAAA,QAC1B,GAAGA,EAAG,KAAKC,EAAG,IAAID,EAAG,KAAK;AAAA,MAAA;AAE5B,MAAAH,EAAW,QAAQ,iBAAiBG,EAAG,GAAGA,EAAG,GAAGG,EAAS,GAAGA,EAAS,CAAC,GACtEH,IAAKD,EAAOG,CAAC,GACbD,IAAKF,EAAOG,IAAI,CAAC;AAAA,IAAA;AAEnB,IAAAL,EAAW,QAAQ,OAAOG,EAAG,GAAGA,EAAG,CAAC,GACpCH,EAAW,QAAQ,OAAA;AAAA,EAAO,GAGtBO,IAAc,MAAM;AACxB,IAAKP,EAAW,WAChBA,EAAW,QAAQ;AAAA,MACjB;AAAA,MACA;AAAA,MACAA,EAAW,QAAQ,OAAO;AAAA,MAC1BA,EAAW,QAAQ,OAAO;AAAA,IAAA;AAAA,EAC5B,GAGIQ,IAAcC,EAAS,CAACC,MAAsB;AAClD,QAAI,CAACf,EAAS;AACd,IAAAL,GAAS,cAAcoB,GAAOjB,EAAS,OAAO;AAE9C,UAAMf,IAAQ,EAAE,GAAGgC,EAAM,SAAS,GAAGA,EAAM,QAAA;AAI3C,IAFkBjB,EAAS,QAAQ,OAAOf,CAAK,KAG1CsB,EAAW,YAChBO,EAAA,GACAP,EAAW,QAAQ;AAAA,MACjB;AAAA,MACA;AAAA,MACAA,EAAW,QAAQ,OAAO;AAAA,MAC1BA,EAAW,QAAQ,OAAO;AAAA,IAAA,GAgB5BP,EAAS,QAAQ,MAAM;AAAA,MAAQ,CAAC,EAAE,QAAAS,GAAQ,OAAAX,GAAO,SAAAC,GAAS,QAAAR,EAAAA,MACxDiB,EAAKC,GAAQX,GAAOC,GAASR,CAAM;AAAA,IAAA,GAErCiB,EAAKR,EAAS,QAAQ,QAAQF,GAAOC,GAASR,CAAM;AAAA,EAAA,CACrD,GAEK2B,IAAcF,EAAS,CAACC,MAAsB;AAClD,QAAI,CAACV,EAAW,QAAS;AAEzB,UAAMtB,IAAQ,EAAE,GAAGgC,EAAM,SAAS,GAAGA,EAAM,QAAA;AAC3C,IAAAjB,EAAS,QAAQ,MAAM,OAAOf,CAAK,GACnCe,EAAS,QAAQ,OAAO,KAAKf,CAAK,GAClCuB,EAAKR,EAAS,QAAQ,QAAQF,GAAOC,GAASR,CAAM,GAEpDM,GAAS,cAAcoB,GAAOjB,EAAS,OAAO,GAC9CG,EAAa,EAAI;AAAA,EAAA,CAClB,GAEKgB,IAAYH,EAAS,CAACC,MAAsB;AAChD,IAAKV,EAAW,YAEZP,EAAS,QAAQ,OAAO,WAC1BA,EAAS,QAAQ,MAAM,KAAK,EAAE,QAAQA,EAAS,QAAQ,QAAQ,OAAAF,GAAO,SAAAC,GAAS,QAAAR,EAAA,CAAQ,GACvFS,EAAS,QAAQ,SAAS,CAAA,IAG5BH,GAAS,YAAYoB,GAAOjB,EAAS,OAAO,GAC5CG,EAAa,EAAK;AAAA,EAAA,CACnB,GAEKiB,IAAQ,MAAM;AAClB,IAAKb,EAAW,YAChBO,EAAA,GACAd,EAAS,QAAQ,QAAQ,CAAA,GACzBA,EAAS,QAAQ,SAAS,CAAA;AAAA,EAAC,GAGvBqB,IAAO,MAAM;AACjB,IAAKd,EAAW,YAChBO,EAAA,GAEAd,EAAS,QAAQ,MAAM,IAAA,GACvBA,EAAS,QAAQ,MAAM;AAAA,MAAQ,CAAC,EAAE,QAAAS,GAAQ,OAAAX,GAAO,SAAAC,GAAS,QAAAR,EAAAA,MACxDiB,EAAKC,GAAQX,GAAOC,GAASR,CAAM;AAAA,IAAA;AAAA,EACrC;AA6BF,SA1BA+B,EAAU,MAAM;AACd,QAAI,CAAC3B,KAAU,CAACU,EAAY,MAAO;AAEnC,UAAMkB,IAAW5B,IAAS6B,EAAW7B,CAAM,IAAIU,EAAY;AAC3D,QAAKkB;AACL,aAAAhB,EAAW,UAAUgB,EAAQ,WAAW,IAAI,GAExC1B,GAAS,iBACXG,EAAS,QAAQ,QAAQH,EAAQ,cACjCA,EAAQ,aAAa;AAAA,QAAQ,CAAC,EAAE,QAAAY,GAAQ,OAAAX,GAAO,SAAAC,GAAS,QAAAR,EAAAA,MACtDiB,EAAKC,GAAQX,GAAOC,GAASR,CAAM;AAAA,MAAA,IAIvCgC,EAAQ,iBAAiB,aAAaL,CAAW,GACjDK,EAAQ,iBAAiB,aAAaR,CAAW,GACjDQ,EAAQ,iBAAiB,WAAWJ,CAAS,GAEtC,MAAM;AACX,QAAKI,MACLA,EAAQ,oBAAoB,aAAaL,CAAW,GACpDK,EAAQ,oBAAoB,aAAaR,CAAW,GACpDQ,EAAQ,oBAAoB,WAAWJ,CAAS;AAAA,MAAA;AAAA,EAClD,GACC,CAACxB,GAAQU,EAAY,KAAK,CAAC,GAE1BV,IAAe,EAAE,SAAAO,GAAS,OAAAkB,GAAO,MAAAC,GAAM,MAAAb,GAAM,OAAOR,EAAS,QAAQ,MAAA,IAClE,EAAE,KAAKK,GAAa,SAAAH,GAAS,OAAAkB,GAAO,MAAAC,GAAM,MAAAb,GAAM,OAAOR,EAAS,QAAQ,MAAA;AACjF;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useParallax.mjs","sources":["../../../../src/hooks/useParallax/useParallax.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { getElement, isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useDeviceOrientation } from '../useDeviceOrientation/useDeviceOrientation';\nimport { useRefState } from '../useRefState/useRefState';\nimport { useScreenOrientation } from '../useScreenOrientation/useScreenOrientation';\n\n/** The use parallax value type */\nexport interface UseParallaxValue {\n /** Roll value. Scaled to `-0.5 ~ 0.5` */\n roll: number;\n /** Sensor source, can be `mouse` or `deviceOrientation` */\n source: 'deviceOrientation' | 'mouse';\n /** Tilt value. Scaled to `-0.5 ~ 0.5` */\n tilt: number;\n}\n\n/** The use parallax options type */\nexport interface UseParallaxOptions {\n /** Device orientation roll adjust function */\n deviceOrientationRollAdjust?: (value: number) => number;\n /** Device orientation tilt adjust function */\n deviceOrientationTiltAdjust?: (value: number) => number;\n /** Mouse roll adjust function */\n mouseRollAdjust?: (value: number) => number;\n /** Mouse tilt adjust function */\n mouseTiltAdjust?: (value: number) => number;\n}\n\ninterface UseParallaxReturn {\n value: UseParallaxValue;\n}\n\nexport interface UseParallax {\n (target: HookTarget, options?: UseParallaxOptions): UseParallaxReturn;\n\n <Target extends Element>(\n options?: UseParallaxOptions,\n target?: never\n ): UseParallaxReturn & {\n ref: StateRef<Target>;\n };\n}\n\n/**\n * @name useParallax\n * @description - Hook to help create parallax effect\n * @category Sensors\n *\n * @overload\n * @param {HookTarget} target The target element for the parallax effect\n * @param {UseParallaxOptions} options The options for the parallax effect\n * @returns {UseParallaxReturn} An object of parallax values\n *\n * @example\n * const { value } = useParallax(ref);\n *\n * @overload\n * @template Target The target element for the parallax effect\n * @param {UseParallaxOptions} options The options for the parallax effect\n * @returns {UseParallaxReturn & { ref: StateRef<Target> }} An object of parallax values\n *\n * @example\n * const { ref, value } = useParallax();\n */\nexport const useParallax = ((...params: any[]) => {\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const options = (params[1] ? params[1] : params[0]) as UseParallaxOptions | undefined;\n\n const internalRef = useRefState<Element>();\n\n const screenOrientation = useScreenOrientation();\n const deviceOrientation = useDeviceOrientation();\n\n const {\n deviceOrientationRollAdjust = (value) => value,\n deviceOrientationTiltAdjust = (value) => value,\n mouseRollAdjust = (value) => value,\n mouseTiltAdjust = (value) => value\n } = (options ?? {}) as UseParallaxOptions;\n\n const [value, setValue] = useState({\n roll: 0,\n tilt: 0,\n source: 'mouse'\n });\n\n useEffect(() => {\n if (!target && !internalRef.state) return;\n\n const element = (target ? getElement(target) : internalRef.current) as Element;\n if (!element) return;\n\n const onMouseMove = (event: MouseEvent) => {\n const { left, top } = element.getBoundingClientRect();\n const elementPositionX = left + window.scrollX;\n const elementPositionY = top + window.scrollY;\n\n const getSource = () => {\n const isDeviceOrientation =\n deviceOrientation.supported &&\n (deviceOrientation.value.alpha || deviceOrientation.value.gamma);\n\n if (isDeviceOrientation) return 'deviceOrientation';\n return 'mouse';\n };\n\n const getRoll = () => {\n const source = getSource();\n if (source === 'deviceOrientation') {\n let value: number;\n switch (screenOrientation.value.orientationType) {\n case 'landscape-primary':\n value = deviceOrientation.value.gamma! / 90;\n break;\n case 'landscape-secondary':\n value = -deviceOrientation.value.gamma! / 90;\n break;\n case 'portrait-primary':\n value = -deviceOrientation.value.beta! / 90;\n break;\n case 'portrait-secondary':\n value = deviceOrientation.value.beta! / 90;\n break;\n default:\n value = -deviceOrientation.value.beta! / 90;\n }\n return deviceOrientationRollAdjust(value);\n } else {\n const y = event.pageY - elementPositionY;\n const height = element.getBoundingClientRect().height;\n const value = -(y - height / 2) / height;\n return mouseRollAdjust(value);\n }\n };\n\n const getTilt = () => {\n const source = getSource();\n if (source === 'deviceOrientation') {\n let value: number;\n switch (screenOrientation.value.orientationType) {\n case 'landscape-primary':\n value = deviceOrientation.value.beta! / 90;\n break;\n case 'landscape-secondary':\n value = -deviceOrientation.value.beta! / 90;\n break;\n case 'portrait-primary':\n value = deviceOrientation.value.gamma! / 90;\n break;\n case 'portrait-secondary':\n value = -deviceOrientation.value.gamma! / 90;\n break;\n default:\n value = deviceOrientation.value.gamma! / 90;\n }\n return deviceOrientationTiltAdjust(value);\n } else {\n const x = event.pageX - elementPositionX;\n const width = element.getBoundingClientRect().width;\n const value = (x - width / 2) / width;\n return mouseTiltAdjust(value);\n }\n };\n\n const source = getSource();\n const roll = getRoll();\n const tilt = getTilt();\n\n setValue({\n roll,\n source,\n tilt\n });\n };\n\n document.addEventListener('mousemove', onMouseMove);\n return () => {\n document.removeEventListener('mousemove', onMouseMove);\n };\n }, [\n target,\n internalRef.state,\n screenOrientation.value.angle,\n screenOrientation.value.orientationType,\n deviceOrientation.value.gamma,\n deviceOrientation.value.beta,\n deviceOrientation.value.alpha,\n deviceOrientation.value.absolute\n ]);\n\n if (target) return { value };\n\n return {\n ref: internalRef,\n value\n };\n}) as UseParallax;\n"],"names":["useParallax","params","target","isTarget","options","internalRef","useRefState","screenOrientation","useScreenOrientation","deviceOrientation","useDeviceOrientation","deviceOrientationRollAdjust","value","deviceOrientationTiltAdjust","mouseRollAdjust","mouseTiltAdjust","setValue","useState","useEffect","element","getElement","onMouseMove","event","left","top","elementPositionX","elementPositionY","getSource","getRoll","y","height","getTilt","x","width","source","roll","tilt"],"mappings":";;;;;;
|
|
1
|
+
{"version":3,"file":"useParallax.mjs","sources":["../../../../src/hooks/useParallax/useParallax.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport type { HookTarget } from '@/utils/helpers';\n\nimport { getElement, isTarget } from '@/utils/helpers';\n\nimport type { StateRef } from '../useRefState/useRefState';\n\nimport { useDeviceOrientation } from '../useDeviceOrientation/useDeviceOrientation';\nimport { useRefState } from '../useRefState/useRefState';\nimport { useScreenOrientation } from '../useScreenOrientation/useScreenOrientation';\n\n/** The use parallax value type */\nexport interface UseParallaxValue {\n /** Roll value. Scaled to `-0.5 ~ 0.5` */\n roll: number;\n /** Sensor source, can be `mouse` or `deviceOrientation` */\n source: 'deviceOrientation' | 'mouse';\n /** Tilt value. Scaled to `-0.5 ~ 0.5` */\n tilt: number;\n}\n\n/** The use parallax options type */\nexport interface UseParallaxOptions {\n /** Device orientation roll adjust function */\n deviceOrientationRollAdjust?: (value: number) => number;\n /** Device orientation tilt adjust function */\n deviceOrientationTiltAdjust?: (value: number) => number;\n /** Mouse roll adjust function */\n mouseRollAdjust?: (value: number) => number;\n /** Mouse tilt adjust function */\n mouseTiltAdjust?: (value: number) => number;\n}\n\ninterface UseParallaxReturn {\n value: UseParallaxValue;\n}\n\nexport interface UseParallax {\n (target: HookTarget, options?: UseParallaxOptions): UseParallaxReturn;\n\n <Target extends Element>(\n options?: UseParallaxOptions,\n target?: never\n ): UseParallaxReturn & {\n ref: StateRef<Target>;\n };\n}\n\n/**\n * @name useParallax\n * @description - Hook to help create parallax effect\n * @category Sensors\n *\n * @overload\n * @param {HookTarget} target The target element for the parallax effect\n * @param {UseParallaxOptions} options The options for the parallax effect\n * @returns {UseParallaxReturn} An object of parallax values\n *\n * @example\n * const { value } = useParallax(ref);\n *\n * @overload\n * @template Target The target element for the parallax effect\n * @param {UseParallaxOptions} options The options for the parallax effect\n * @returns {UseParallaxReturn & { ref: StateRef<Target> }} An object of parallax values\n *\n * @example\n * const { ref, value } = useParallax();\n */\nexport const useParallax = ((...params: any[]) => {\n const target = (isTarget(params[0]) ? params[0] : undefined) as HookTarget | undefined;\n const options = (params[1] ? params[1] : params[0]) as UseParallaxOptions | undefined;\n\n const internalRef = useRefState<Element>();\n\n const screenOrientation = useScreenOrientation();\n const deviceOrientation = useDeviceOrientation();\n\n const {\n deviceOrientationRollAdjust = (value) => value,\n deviceOrientationTiltAdjust = (value) => value,\n mouseRollAdjust = (value) => value,\n mouseTiltAdjust = (value) => value\n } = (options ?? {}) as UseParallaxOptions;\n\n const [value, setValue] = useState({\n roll: 0,\n tilt: 0,\n source: 'mouse'\n });\n\n useEffect(() => {\n if (!target && !internalRef.state) return;\n\n const element = (target ? getElement(target) : internalRef.current) as Element;\n if (!element) return;\n\n const onMouseMove = (event: MouseEvent) => {\n const { left, top } = element.getBoundingClientRect();\n const elementPositionX = left + window.scrollX;\n const elementPositionY = top + window.scrollY;\n\n const getSource = () => {\n const isDeviceOrientation =\n deviceOrientation.supported &&\n (deviceOrientation.value.alpha || deviceOrientation.value.gamma);\n\n if (isDeviceOrientation) return 'deviceOrientation';\n return 'mouse';\n };\n\n const getRoll = () => {\n const source = getSource();\n if (source === 'deviceOrientation') {\n let value: number;\n switch (screenOrientation.value.orientationType) {\n case 'landscape-primary':\n value = deviceOrientation.value.gamma! / 90;\n break;\n case 'landscape-secondary':\n value = -deviceOrientation.value.gamma! / 90;\n break;\n case 'portrait-primary':\n value = -deviceOrientation.value.beta! / 90;\n break;\n case 'portrait-secondary':\n value = deviceOrientation.value.beta! / 90;\n break;\n default:\n value = -deviceOrientation.value.beta! / 90;\n }\n return deviceOrientationRollAdjust(value);\n } else {\n const y = event.pageY - elementPositionY;\n const height = element.getBoundingClientRect().height;\n const value = -(y - height / 2) / height;\n return mouseRollAdjust(value);\n }\n };\n\n const getTilt = () => {\n const source = getSource();\n if (source === 'deviceOrientation') {\n let value: number;\n switch (screenOrientation.value.orientationType) {\n case 'landscape-primary':\n value = deviceOrientation.value.beta! / 90;\n break;\n case 'landscape-secondary':\n value = -deviceOrientation.value.beta! / 90;\n break;\n case 'portrait-primary':\n value = deviceOrientation.value.gamma! / 90;\n break;\n case 'portrait-secondary':\n value = -deviceOrientation.value.gamma! / 90;\n break;\n default:\n value = deviceOrientation.value.gamma! / 90;\n }\n return deviceOrientationTiltAdjust(value);\n } else {\n const x = event.pageX - elementPositionX;\n const width = element.getBoundingClientRect().width;\n const value = (x - width / 2) / width;\n return mouseTiltAdjust(value);\n }\n };\n\n const source = getSource();\n const roll = getRoll();\n const tilt = getTilt();\n\n setValue({\n roll,\n source,\n tilt\n });\n };\n\n document.addEventListener('mousemove', onMouseMove);\n return () => {\n document.removeEventListener('mousemove', onMouseMove);\n };\n }, [\n target,\n internalRef.state,\n screenOrientation.value.angle,\n screenOrientation.value.orientationType,\n deviceOrientation.value.gamma,\n deviceOrientation.value.beta,\n deviceOrientation.value.alpha,\n deviceOrientation.value.absolute\n ]);\n\n if (target) return { value };\n\n return {\n ref: internalRef,\n value\n };\n}) as UseParallax;\n"],"names":["useParallax","params","target","isTarget","options","internalRef","useRefState","screenOrientation","useScreenOrientation","deviceOrientation","useDeviceOrientation","deviceOrientationRollAdjust","value","deviceOrientationTiltAdjust","mouseRollAdjust","mouseTiltAdjust","setValue","useState","useEffect","element","getElement","onMouseMove","event","left","top","elementPositionX","elementPositionY","getSource","getRoll","y","height","getTilt","x","width","source","roll","tilt"],"mappings":"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"}
|
|
@@ -1,26 +1,24 @@
|
|
|
1
|
-
import { useState as b, useRef as
|
|
2
|
-
const
|
|
3
|
-
const
|
|
4
|
-
|
|
5
|
-
const
|
|
6
|
-
if (!
|
|
7
|
-
const
|
|
8
|
-
|
|
9
|
-
p(f.getEntries()), (i = t.current) == null || i.call(t, f, v);
|
|
1
|
+
import { useState as b, useRef as i, useEffect as p } from "react";
|
|
2
|
+
const l = (n, t) => {
|
|
3
|
+
const e = typeof window < "u" && typeof PerformanceObserver < "u", [d, a] = b([]), r = i(null), s = i(t);
|
|
4
|
+
s.current = t;
|
|
5
|
+
const o = () => {
|
|
6
|
+
if (!e) return;
|
|
7
|
+
const c = new PerformanceObserver((f, m) => {
|
|
8
|
+
a(f.getEntries()), s.current?.(f, m);
|
|
10
9
|
});
|
|
11
|
-
|
|
12
|
-
},
|
|
13
|
-
|
|
14
|
-
r && ((e = n.current) == null || e.disconnect(), n.current = null);
|
|
10
|
+
c.observe(n), r.current = c;
|
|
11
|
+
}, u = () => {
|
|
12
|
+
e && (r.current?.disconnect(), r.current = null);
|
|
15
13
|
};
|
|
16
|
-
return
|
|
17
|
-
if (
|
|
18
|
-
return
|
|
19
|
-
|
|
14
|
+
return p(() => {
|
|
15
|
+
if (e)
|
|
16
|
+
return n.immediate && o(), () => {
|
|
17
|
+
u();
|
|
20
18
|
};
|
|
21
|
-
}, []), { supported:
|
|
19
|
+
}, []), { supported: e, entries: d, start: o, stop: u };
|
|
22
20
|
};
|
|
23
21
|
export {
|
|
24
|
-
|
|
22
|
+
l as usePerformanceObserver
|
|
25
23
|
};
|
|
26
24
|
//# sourceMappingURL=usePerformanceObserver.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePerformanceObserver.mjs","sources":["../../../../src/hooks/usePerformanceObserver/usePerformanceObserver.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\n/** The use performance observer options type */\nexport type UsePerformanceObserverOptions = PerformanceObserverInit & {\n /** Whether to start the observer immediately */\n immediate?: boolean;\n};\n\n/**\n * @name usePerformanceObserver\n * @description - Hook that allows you to observe performance entries\n * @category Sensors\n *\n * @browserapi PerformanceObserver https://developer.mozilla.org/en-US/docs/Web/API/PerformanceObserver\n *\n * @param {UsePerformanceObserverOptions} options The options for the performance observer\n * @param {PerformanceObserverCallback} callback The function to handle performance entries\n * @returns {object} An object containing the observer's support status and methods to start and stop the observer\n *\n * @example\n * const { supported, entries, start, stop } = usePerformanceObserver();\n */\nexport const usePerformanceObserver = (\n options: UsePerformanceObserverOptions,\n callback?: PerformanceObserverCallback\n) => {\n const supported = typeof window !== 'undefined' && typeof PerformanceObserver !== 'undefined';\n const [entries, setEntries] = useState<PerformanceEntry[]>([]);\n\n const observerRef = useRef<PerformanceObserver | null>(null);\n const internalCallback = useRef<PerformanceObserverCallback | null>(callback);\n internalCallback.current = callback;\n\n const start = () => {\n if (!supported) return;\n const observer = new PerformanceObserver((entryList, observer) => {\n setEntries(entryList.getEntries());\n internalCallback.current?.(entryList, observer);\n });\n observer.observe(options);\n observerRef.current = observer;\n };\n\n const stop = () => {\n if (!supported) return;\n observerRef.current?.disconnect();\n observerRef.current = null;\n };\n\n useEffect(() => {\n if (!supported) return;\n if (options.immediate) start();\n\n return () => {\n stop();\n };\n }, []);\n\n return { supported, entries, start, stop };\n};\n"],"names":["usePerformanceObserver","options","callback","supported","entries","setEntries","useState","observerRef","useRef","internalCallback","start","observer","entryList","
|
|
1
|
+
{"version":3,"file":"usePerformanceObserver.mjs","sources":["../../../../src/hooks/usePerformanceObserver/usePerformanceObserver.ts"],"sourcesContent":["import { useEffect, useRef, useState } from 'react';\n\n/** The use performance observer options type */\nexport type UsePerformanceObserverOptions = PerformanceObserverInit & {\n /** Whether to start the observer immediately */\n immediate?: boolean;\n};\n\n/**\n * @name usePerformanceObserver\n * @description - Hook that allows you to observe performance entries\n * @category Sensors\n *\n * @browserapi PerformanceObserver https://developer.mozilla.org/en-US/docs/Web/API/PerformanceObserver\n *\n * @param {UsePerformanceObserverOptions} options The options for the performance observer\n * @param {PerformanceObserverCallback} callback The function to handle performance entries\n * @returns {object} An object containing the observer's support status and methods to start and stop the observer\n *\n * @example\n * const { supported, entries, start, stop } = usePerformanceObserver();\n */\nexport const usePerformanceObserver = (\n options: UsePerformanceObserverOptions,\n callback?: PerformanceObserverCallback\n) => {\n const supported = typeof window !== 'undefined' && typeof PerformanceObserver !== 'undefined';\n const [entries, setEntries] = useState<PerformanceEntry[]>([]);\n\n const observerRef = useRef<PerformanceObserver | null>(null);\n const internalCallback = useRef<PerformanceObserverCallback | null>(callback);\n internalCallback.current = callback;\n\n const start = () => {\n if (!supported) return;\n const observer = new PerformanceObserver((entryList, observer) => {\n setEntries(entryList.getEntries());\n internalCallback.current?.(entryList, observer);\n });\n observer.observe(options);\n observerRef.current = observer;\n };\n\n const stop = () => {\n if (!supported) return;\n observerRef.current?.disconnect();\n observerRef.current = null;\n };\n\n useEffect(() => {\n if (!supported) return;\n if (options.immediate) start();\n\n return () => {\n stop();\n };\n }, []);\n\n return { supported, entries, start, stop };\n};\n"],"names":["usePerformanceObserver","options","callback","supported","entries","setEntries","useState","observerRef","useRef","internalCallback","start","observer","entryList","stop","useEffect"],"mappings":";AAsBO,MAAMA,IAAyB,CACpCC,GACAC,MACG;AACH,QAAMC,IAAY,OAAO,SAAW,OAAe,OAAO,sBAAwB,KAC5E,CAACC,GAASC,CAAU,IAAIC,EAA6B,CAAA,CAAE,GAEvDC,IAAcC,EAAmC,IAAI,GACrDC,IAAmBD,EAA2CN,CAAQ;AAC5E,EAAAO,EAAiB,UAAUP;AAE3B,QAAMQ,IAAQ,MAAM;AAClB,QAAI,CAACP,EAAW;AAChB,UAAMQ,IAAW,IAAI,oBAAoB,CAACC,GAAWD,MAAa;AAChE,MAAAN,EAAWO,EAAU,YAAY,GACjCH,EAAiB,UAAUG,GAAWD,CAAQ;AAAA,IAAA,CAC/C;AACD,IAAAA,EAAS,QAAQV,CAAO,GACxBM,EAAY,UAAUI;AAAA,EAAA,GAGlBE,IAAO,MAAM;AACjB,IAAKV,MACLI,EAAY,SAAS,WAAA,GACrBA,EAAY,UAAU;AAAA,EAAA;AAGxB,SAAAO,EAAU,MAAM;AACd,QAAKX;AACL,aAAIF,EAAQ,aAAWS,EAAA,GAEhB,MAAM;AACX,QAAAG,EAAA;AAAA,MAAK;AAAA,EACP,GACC,EAAE,GAEE,EAAE,WAAAV,GAAW,SAAAC,GAAS,OAAAM,GAAO,MAAAG,EAAA;AACtC;"}
|
|
@@ -1,25 +1,25 @@
|
|
|
1
|
-
import { useState as
|
|
2
|
-
import { useEvent as
|
|
3
|
-
const v = (
|
|
4
|
-
const n = typeof navigator < "u" && "permissions" in navigator, [i,
|
|
1
|
+
import { useState as u, useEffect as c } from "react";
|
|
2
|
+
import { useEvent as m } from "../useEvent/useEvent.mjs";
|
|
3
|
+
const v = (e, a) => {
|
|
4
|
+
const n = typeof navigator < "u" && "permissions" in navigator, [i, r] = u("prompt"), s = a?.enabled ?? !0, p = { name: e }, t = m(async () => {
|
|
5
5
|
try {
|
|
6
6
|
const o = await navigator.permissions.query(
|
|
7
|
-
|
|
7
|
+
p
|
|
8
8
|
);
|
|
9
|
-
return
|
|
9
|
+
return r(o.state), o.state;
|
|
10
10
|
} catch {
|
|
11
|
-
return
|
|
11
|
+
return r("prompt"), "prompt";
|
|
12
12
|
}
|
|
13
13
|
});
|
|
14
|
-
return
|
|
15
|
-
if (!(!n || !
|
|
16
|
-
return
|
|
17
|
-
window.removeEventListener("change",
|
|
14
|
+
return c(() => {
|
|
15
|
+
if (!(!n || !s))
|
|
16
|
+
return t(), window.addEventListener("change", t), () => {
|
|
17
|
+
window.removeEventListener("change", t);
|
|
18
18
|
};
|
|
19
|
-
}, [
|
|
19
|
+
}, [e, s]), {
|
|
20
20
|
state: i,
|
|
21
21
|
supported: n,
|
|
22
|
-
query:
|
|
22
|
+
query: t
|
|
23
23
|
};
|
|
24
24
|
};
|
|
25
25
|
export {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePermission.mjs","sources":["../../../../src/hooks/usePermission/usePermission.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport { useEvent } from '../useEvent/useEvent';\n\n/** The permission name */\nexport type UsePermissionName =\n | 'accelerometer'\n | 'accessibility-events'\n | 'ambient-light-sensor'\n | 'background-sync'\n | 'camera'\n | 'clipboard-read'\n | 'clipboard-write'\n | 'gyroscope'\n | 'magnetometer'\n | 'microphone'\n | 'notifications'\n | 'payment-handler'\n | 'persistent-storage'\n | 'push'\n | 'speaker'\n | PermissionName;\n\n/** The use permission options type */\nexport interface UsePermissionOptions {\n /** Whether the permission is enabled */\n enabled: boolean;\n}\n\n/** The use permission return type */\nexport interface UsePermissionReturn {\n /** The permission state */\n state: PermissionState;\n /** The permission supported status */\n supported: boolean;\n /** The permission query function */\n query: () => Promise<PermissionState>;\n}\n\n/**\n * @name usePermission\n * @description - Hook that gives you the state of permission\n * @category Browser\n *\n * @browserapi navigator.permissions https://developer.mozilla.org/en-US/docs/Web/API/Navigator/permissions\n *\n * @param {UsePermissionName} permissionDescriptorName - The permission name\n * @param {boolean} [options.enabled=true] - Whether the permission is enabled\n * @returns {UsePermissionReturn} An object containing the state and the supported status\n *\n * @example\n * const { state, supported, query } = usePermission('microphone');\n */\nexport const usePermission = (\n permissionDescriptorName: UsePermissionName,\n options?: UsePermissionOptions\n) => {\n const supported = typeof navigator !== 'undefined' && 'permissions' in navigator;\n const [state, setState] = useState<PermissionState>('prompt');\n const enabled = options?.enabled ?? true;\n\n const permissionDescriptor = { name: permissionDescriptorName };\n\n const query = useEvent(async () => {\n try {\n const permissionStatus = await navigator.permissions.query(\n permissionDescriptor as PermissionDescriptor\n );\n setState(permissionStatus.state);\n return permissionStatus.state;\n } catch {\n setState('prompt');\n return 'prompt';\n }\n });\n\n useEffect(() => {\n if (!supported || !enabled) return;\n query();\n window.addEventListener('change', query);\n return () => {\n window.removeEventListener('change', query);\n };\n }, [permissionDescriptorName, enabled]);\n\n return {\n state,\n supported,\n query\n };\n};\n"],"names":["usePermission","permissionDescriptorName","options","supported","state","setState","useState","enabled","permissionDescriptor","query","useEvent","permissionStatus","useEffect"],"mappings":";;
|
|
1
|
+
{"version":3,"file":"usePermission.mjs","sources":["../../../../src/hooks/usePermission/usePermission.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport { useEvent } from '../useEvent/useEvent';\n\n/** The permission name */\nexport type UsePermissionName =\n | 'accelerometer'\n | 'accessibility-events'\n | 'ambient-light-sensor'\n | 'background-sync'\n | 'camera'\n | 'clipboard-read'\n | 'clipboard-write'\n | 'gyroscope'\n | 'magnetometer'\n | 'microphone'\n | 'notifications'\n | 'payment-handler'\n | 'persistent-storage'\n | 'push'\n | 'speaker'\n | PermissionName;\n\n/** The use permission options type */\nexport interface UsePermissionOptions {\n /** Whether the permission is enabled */\n enabled: boolean;\n}\n\n/** The use permission return type */\nexport interface UsePermissionReturn {\n /** The permission state */\n state: PermissionState;\n /** The permission supported status */\n supported: boolean;\n /** The permission query function */\n query: () => Promise<PermissionState>;\n}\n\n/**\n * @name usePermission\n * @description - Hook that gives you the state of permission\n * @category Browser\n *\n * @browserapi navigator.permissions https://developer.mozilla.org/en-US/docs/Web/API/Navigator/permissions\n *\n * @param {UsePermissionName} permissionDescriptorName - The permission name\n * @param {boolean} [options.enabled=true] - Whether the permission is enabled\n * @returns {UsePermissionReturn} An object containing the state and the supported status\n *\n * @example\n * const { state, supported, query } = usePermission('microphone');\n */\nexport const usePermission = (\n permissionDescriptorName: UsePermissionName,\n options?: UsePermissionOptions\n) => {\n const supported = typeof navigator !== 'undefined' && 'permissions' in navigator;\n const [state, setState] = useState<PermissionState>('prompt');\n const enabled = options?.enabled ?? true;\n\n const permissionDescriptor = { name: permissionDescriptorName };\n\n const query = useEvent(async () => {\n try {\n const permissionStatus = await navigator.permissions.query(\n permissionDescriptor as PermissionDescriptor\n );\n setState(permissionStatus.state);\n return permissionStatus.state;\n } catch {\n setState('prompt');\n return 'prompt';\n }\n });\n\n useEffect(() => {\n if (!supported || !enabled) return;\n query();\n window.addEventListener('change', query);\n return () => {\n window.removeEventListener('change', query);\n };\n }, [permissionDescriptorName, enabled]);\n\n return {\n state,\n supported,\n query\n };\n};\n"],"names":["usePermission","permissionDescriptorName","options","supported","state","setState","useState","enabled","permissionDescriptor","query","useEvent","permissionStatus","useEffect"],"mappings":";;AAqDO,MAAMA,IAAgB,CAC3BC,GACAC,MACG;AACH,QAAMC,IAAY,OAAO,YAAc,OAAe,iBAAiB,WACjE,CAACC,GAAOC,CAAQ,IAAIC,EAA0B,QAAQ,GACtDC,IAAUL,GAAS,WAAW,IAE9BM,IAAuB,EAAE,MAAMP,EAAA,GAE/BQ,IAAQC,EAAS,YAAY;AACjC,QAAI;AACF,YAAMC,IAAmB,MAAM,UAAU,YAAY;AAAA,QACnDH;AAAA,MAAA;AAEF,aAAAH,EAASM,EAAiB,KAAK,GACxBA,EAAiB;AAAA,IAAA,QAClB;AACN,aAAAN,EAAS,QAAQ,GACV;AAAA,IAAA;AAAA,EACT,CACD;AAED,SAAAO,EAAU,MAAM;AACd,QAAI,GAACT,KAAa,CAACI;AACnB,aAAAE,EAAA,GACA,OAAO,iBAAiB,UAAUA,CAAK,GAChC,MAAM;AACX,eAAO,oBAAoB,UAAUA,CAAK;AAAA,MAAA;AAAA,EAC5C,GACC,CAACR,GAA0BM,CAAO,CAAC,GAE/B;AAAA,IACL,OAAAH;AAAA,IACA,WAAAD;AAAA,IACA,OAAAM;AAAA,EAAA;AAEJ;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePointerLock.mjs","sources":["../../../../src/hooks/usePointerLock/usePointerLock.ts"],"sourcesContent":["import type { MouseEvent } from 'react';\n\nimport { useEffect, useState } from 'react';\n\n/** The use pointer lock return type */\ninterface UsePointerLockReturn {\n /** The pointer lock element */\n element?: Element;\n /** Whether the pointer lock is supported */\n supported: boolean;\n /** Lock the pointer lock */\n lock: (event: MouseEvent) => void;\n /** Unlock the pointer lock */\n unlock: () => boolean;\n}\n\n/**\n * @name usePointerLock\n * @description - Hook that provides reactive pointer lock\n * @category Sensors\n *\n * @browserapi pointerLockElement https://developer.mozilla.org/en-US/docs/Web/API/Document/pointerLockElement\n *\n * @returns {UsePointerLockReturn} An object containing the pointer lock element and functions to interact with the pointer lock\n *\n * @example\n * const { supported, lock, unlock, element } = usePointerLock();\n */\nexport const usePointerLock = (): UsePointerLockReturn => {\n const supported = typeof document !== 'undefined' && 'pointerLockElement' in document;\n const [element, setElement] = useState<Element>();\n\n useEffect(() => {\n if (!supported) return;\n\n const handlePointerLockChange = () => {\n if (!supported) return;\n\n const currentElement = document.pointerLockElement ?? element;\n\n if (currentElement && currentElement === element) {\n setElement(document.pointerLockElement as Element);\n }\n };\n const handlePointerLockError = () => {\n if (!supported) return;\n\n const currentElement = document.pointerLockElement ?? element;\n\n if (currentElement && currentElement === element) {\n const action = document.pointerLockElement ? 'release' : 'acquire';\n\n throw new Error(`Failed to ${action} pointer lock.`);\n }\n };\n\n document.addEventListener('pointerlockchange', handlePointerLockChange);\n document.addEventListener('pointerlockerror', handlePointerLockError);\n\n return () => {\n document.removeEventListener('pointerlockchange', handlePointerLockChange);\n document.removeEventListener('pointerlockerror', handlePointerLockError);\n };\n }, []);\n\n const lock = (event: MouseEvent) => {\n if (!supported) return false;\n\n if (event instanceof Event) return false;\n\n event.currentTarget.requestPointerLock();\n\n setElement(event.currentTarget);\n return true;\n };\n\n const unlock = () => {\n if (!supported) return false;\n\n if (!element) return false;\n\n document.exitPointerLock();\n setElement(undefined);\n\n return true;\n };\n\n return {\n supported,\n element,\n lock,\n unlock\n };\n};\n"],"names":["usePointerLock","supported","element","setElement","useState","useEffect","handlePointerLockChange","currentElement","handlePointerLockError","action","event"],"mappings":";AA4BO,MAAMA,IAAiB,MAA4B;AACxD,QAAMC,IAAY,OAAO,WAAa,OAAe,wBAAwB,UACvE,CAACC,GAASC,CAAU,IAAIC,
|
|
1
|
+
{"version":3,"file":"usePointerLock.mjs","sources":["../../../../src/hooks/usePointerLock/usePointerLock.ts"],"sourcesContent":["import type { MouseEvent } from 'react';\n\nimport { useEffect, useState } from 'react';\n\n/** The use pointer lock return type */\ninterface UsePointerLockReturn {\n /** The pointer lock element */\n element?: Element;\n /** Whether the pointer lock is supported */\n supported: boolean;\n /** Lock the pointer lock */\n lock: (event: MouseEvent) => void;\n /** Unlock the pointer lock */\n unlock: () => boolean;\n}\n\n/**\n * @name usePointerLock\n * @description - Hook that provides reactive pointer lock\n * @category Sensors\n *\n * @browserapi pointerLockElement https://developer.mozilla.org/en-US/docs/Web/API/Document/pointerLockElement\n *\n * @returns {UsePointerLockReturn} An object containing the pointer lock element and functions to interact with the pointer lock\n *\n * @example\n * const { supported, lock, unlock, element } = usePointerLock();\n */\nexport const usePointerLock = (): UsePointerLockReturn => {\n const supported = typeof document !== 'undefined' && 'pointerLockElement' in document;\n const [element, setElement] = useState<Element>();\n\n useEffect(() => {\n if (!supported) return;\n\n const handlePointerLockChange = () => {\n if (!supported) return;\n\n const currentElement = document.pointerLockElement ?? element;\n\n if (currentElement && currentElement === element) {\n setElement(document.pointerLockElement as Element);\n }\n };\n const handlePointerLockError = () => {\n if (!supported) return;\n\n const currentElement = document.pointerLockElement ?? element;\n\n if (currentElement && currentElement === element) {\n const action = document.pointerLockElement ? 'release' : 'acquire';\n\n throw new Error(`Failed to ${action} pointer lock.`);\n }\n };\n\n document.addEventListener('pointerlockchange', handlePointerLockChange);\n document.addEventListener('pointerlockerror', handlePointerLockError);\n\n return () => {\n document.removeEventListener('pointerlockchange', handlePointerLockChange);\n document.removeEventListener('pointerlockerror', handlePointerLockError);\n };\n }, []);\n\n const lock = (event: MouseEvent) => {\n if (!supported) return false;\n\n if (event instanceof Event) return false;\n\n event.currentTarget.requestPointerLock();\n\n setElement(event.currentTarget);\n return true;\n };\n\n const unlock = () => {\n if (!supported) return false;\n\n if (!element) return false;\n\n document.exitPointerLock();\n setElement(undefined);\n\n return true;\n };\n\n return {\n supported,\n element,\n lock,\n unlock\n };\n};\n"],"names":["usePointerLock","supported","element","setElement","useState","useEffect","handlePointerLockChange","currentElement","handlePointerLockError","action","event"],"mappings":";AA4BO,MAAMA,IAAiB,MAA4B;AACxD,QAAMC,IAAY,OAAO,WAAa,OAAe,wBAAwB,UACvE,CAACC,GAASC,CAAU,IAAIC,EAAA;AAE9B,SAAAC,EAAU,MAAM;AACd,QAAI,CAACJ,EAAW;AAEhB,UAAMK,IAA0B,MAAM;AACpC,UAAI,CAACL,EAAW;AAEhB,YAAMM,IAAiB,SAAS,sBAAsBL;AAEtD,MAAIK,KAAkBA,MAAmBL,KACvCC,EAAW,SAAS,kBAA6B;AAAA,IACnD,GAEIK,IAAyB,MAAM;AACnC,UAAI,CAACP,EAAW;AAEhB,YAAMM,IAAiB,SAAS,sBAAsBL;AAEtD,UAAIK,KAAkBA,MAAmBL,GAAS;AAChD,cAAMO,IAAS,SAAS,qBAAqB,YAAY;AAEzD,cAAM,IAAI,MAAM,aAAaA,CAAM,gBAAgB;AAAA,MAAA;AAAA,IACrD;AAGF,oBAAS,iBAAiB,qBAAqBH,CAAuB,GACtE,SAAS,iBAAiB,oBAAoBE,CAAsB,GAE7D,MAAM;AACX,eAAS,oBAAoB,qBAAqBF,CAAuB,GACzE,SAAS,oBAAoB,oBAAoBE,CAAsB;AAAA,IAAA;AAAA,EACzE,GACC,EAAE,GAwBE;AAAA,IACL,WAAAP;AAAA,IACA,SAAAC;AAAA,IACA,MAzBW,CAACQ,MACR,CAACT,KAEDS,aAAiB,QAAc,MAEnCA,EAAM,cAAc,mBAAA,GAEpBP,EAAWO,EAAM,aAAa,GACvB;AAAA,IAkBP,QAfa,MACT,CAACT,KAED,CAACC,IAAgB,MAErB,SAAS,gBAAA,GACTC,EAAW,MAAS,GAEb;AAAA,EAOP;AAEJ;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePostMessage.mjs","sources":["../../../../src/hooks/usePostMessage/usePostMessage.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\nexport type UsePostMessageReturn<Message> = (message: Message) => void;\n\n/**\n * @name usePostMessage\n * @description - Hook that allows you to receive messages from other origins\n * @category Browser\n *\n * @overload\n * @template Message The message data type\n * @param {string | string[]} origin The origin of the message\n * @param {(message: Message) => Message} callback callback to get received message\n * @returns {(message: Message) => void} An object containing the current message\n *\n * @example\n * const postMessage = usePostMessage();\n */\nexport const usePostMessage = <Message>(\n origin: string | '*' | string[],\n callback: (message: Message, event: MessageEvent<Message>) => void\n): UsePostMessageReturn<Message> => {\n const internalCallbackRef = useRef(callback);\n internalCallbackRef.current = callback;\n\n useEffect(() => {\n const onMessage = (event: MessageEvent<Message>) => {\n if (\n (Array.isArray(origin) && (!origin.includes(event.origin) || !origin.includes('*'))) ||\n (event.origin !== origin && origin !== '*')\n )\n return;\n\n internalCallbackRef.current(event.data as Message, event);\n };\n\n window.addEventListener('message', onMessage);\n return () => window.removeEventListener('message', onMessage);\n }, []);\n\n const postMessage = (message: Message) => {\n if (Array.isArray(origin)) {\n origin.forEach((origin) => window.postMessage(message, origin));\n return;\n }\n\n window.postMessage(message, origin);\n };\n\n return postMessage;\n};\n"],"names":["usePostMessage","origin","callback","internalCallbackRef","useRef","useEffect","onMessage","event","message"],"mappings":";
|
|
1
|
+
{"version":3,"file":"usePostMessage.mjs","sources":["../../../../src/hooks/usePostMessage/usePostMessage.ts"],"sourcesContent":["import { useEffect, useRef } from 'react';\n\nexport type UsePostMessageReturn<Message> = (message: Message) => void;\n\n/**\n * @name usePostMessage\n * @description - Hook that allows you to receive messages from other origins\n * @category Browser\n *\n * @overload\n * @template Message The message data type\n * @param {string | string[]} origin The origin of the message\n * @param {(message: Message) => Message} callback callback to get received message\n * @returns {(message: Message) => void} An object containing the current message\n *\n * @example\n * const postMessage = usePostMessage();\n */\nexport const usePostMessage = <Message>(\n origin: string | '*' | string[],\n callback: (message: Message, event: MessageEvent<Message>) => void\n): UsePostMessageReturn<Message> => {\n const internalCallbackRef = useRef(callback);\n internalCallbackRef.current = callback;\n\n useEffect(() => {\n const onMessage = (event: MessageEvent<Message>) => {\n if (\n (Array.isArray(origin) && (!origin.includes(event.origin) || !origin.includes('*'))) ||\n (event.origin !== origin && origin !== '*')\n )\n return;\n\n internalCallbackRef.current(event.data as Message, event);\n };\n\n window.addEventListener('message', onMessage);\n return () => window.removeEventListener('message', onMessage);\n }, []);\n\n const postMessage = (message: Message) => {\n if (Array.isArray(origin)) {\n origin.forEach((origin) => window.postMessage(message, origin));\n return;\n }\n\n window.postMessage(message, origin);\n };\n\n return postMessage;\n};\n"],"names":["usePostMessage","origin","callback","internalCallbackRef","useRef","useEffect","onMessage","event","message"],"mappings":";AAkBO,MAAMA,IAAiB,CAC5BC,GACAC,MACkC;AAClC,QAAMC,IAAsBC,EAAOF,CAAQ;AAC3C,SAAAC,EAAoB,UAAUD,GAE9BG,EAAU,MAAM;AACd,UAAMC,IAAY,CAACC,MAAiC;AAClD,MACG,MAAM,QAAQN,CAAM,MAAM,CAACA,EAAO,SAASM,EAAM,MAAM,KAAK,CAACN,EAAO,SAAS,GAAG,MAChFM,EAAM,WAAWN,KAAUA,MAAW,OAIzCE,EAAoB,QAAQI,EAAM,MAAiBA,CAAK;AAAA,IAAA;AAG1D,kBAAO,iBAAiB,WAAWD,CAAS,GACrC,MAAM,OAAO,oBAAoB,WAAWA,CAAS;AAAA,EAAA,GAC3D,EAAE,GAEe,CAACE,MAAqB;AACxC,QAAI,MAAM,QAAQP,CAAM,GAAG;AACzB,MAAAA,EAAO,QAAQ,CAACA,MAAW,OAAO,YAAYO,GAASP,CAAM,CAAC;AAC9D;AAAA,IAAA;AAGF,WAAO,YAAYO,GAASP,CAAM;AAAA,EAAA;AAItC;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePreferredColorScheme.mjs","sources":["../../../../src/hooks/usePreferredColorScheme/usePreferredColorScheme.ts"],"sourcesContent":["import { useMediaQuery } from '../useMediaQuery/useMediaQuery';\n\n/** The use preferred color scheme return type */\nexport type UsePreferredColorSchemeReturn = 'dark' | 'light' | 'no-preference';\n\n/**\n * @name usePreferredColorScheme\n * @description - Hook that returns user preferred color scheme\n * @category Browser\n *\n * @returns {UsePreferredColorSchemeReturn} String of preferred color scheme\n *\n * @example\n * const colorScheme = usePreferredColorScheme();\n */\nexport const usePreferredColorScheme = (): UsePreferredColorSchemeReturn => {\n const isLight = useMediaQuery('(prefers-color-scheme: light)');\n const isDark = useMediaQuery('(prefers-color-scheme: dark)');\n\n if (isLight) return 'light';\n if (isDark) return 'dark';\n return 'no-preference';\n};\n"],"names":["usePreferredColorScheme","isLight","useMediaQuery","isDark"],"mappings":";AAeO,MAAMA,IAA0B,MAAqC;
|
|
1
|
+
{"version":3,"file":"usePreferredColorScheme.mjs","sources":["../../../../src/hooks/usePreferredColorScheme/usePreferredColorScheme.ts"],"sourcesContent":["import { useMediaQuery } from '../useMediaQuery/useMediaQuery';\n\n/** The use preferred color scheme return type */\nexport type UsePreferredColorSchemeReturn = 'dark' | 'light' | 'no-preference';\n\n/**\n * @name usePreferredColorScheme\n * @description - Hook that returns user preferred color scheme\n * @category Browser\n *\n * @returns {UsePreferredColorSchemeReturn} String of preferred color scheme\n *\n * @example\n * const colorScheme = usePreferredColorScheme();\n */\nexport const usePreferredColorScheme = (): UsePreferredColorSchemeReturn => {\n const isLight = useMediaQuery('(prefers-color-scheme: light)');\n const isDark = useMediaQuery('(prefers-color-scheme: dark)');\n\n if (isLight) return 'light';\n if (isDark) return 'dark';\n return 'no-preference';\n};\n"],"names":["usePreferredColorScheme","isLight","useMediaQuery","isDark"],"mappings":";AAeO,MAAMA,IAA0B,MAAqC;AAC1E,QAAMC,IAAUC,EAAc,+BAA+B,GACvDC,IAASD,EAAc,8BAA8B;AAE3D,SAAID,IAAgB,UAChBE,IAAe,SACZ;AACT;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePreferredContrast.mjs","sources":["../../../../src/hooks/usePreferredContrast/usePreferredContrast.ts"],"sourcesContent":["import { useMediaQuery } from '../useMediaQuery/useMediaQuery';\n\n/** The use preferred contrast return type */\nexport type UsePreferredContrastReturn = 'custom' | 'less' | 'more' | 'no-preference';\n\n/**\n * @name usePreferredContrast\n * @description - Hook that returns the contrast preference\n * @category Browser\n *\n * @returns {UsePreferredContrastReturn} The contrast preference\n *\n * @example\n * const contrast = usePreferredContrast();\n */\nexport const usePreferredContrast = (): UsePreferredContrastReturn => {\n const more = useMediaQuery('(prefers-contrast: more)');\n const less = useMediaQuery('(prefers-contrast: less)');\n const custom = useMediaQuery('(prefers-contrast: custom)');\n return more ? 'more' : less ? 'less' : custom ? 'custom' : 'no-preference';\n};\n"],"names":["usePreferredContrast","more","useMediaQuery","less","custom"],"mappings":";AAeO,MAAMA,IAAuB,MAAkC;
|
|
1
|
+
{"version":3,"file":"usePreferredContrast.mjs","sources":["../../../../src/hooks/usePreferredContrast/usePreferredContrast.ts"],"sourcesContent":["import { useMediaQuery } from '../useMediaQuery/useMediaQuery';\n\n/** The use preferred contrast return type */\nexport type UsePreferredContrastReturn = 'custom' | 'less' | 'more' | 'no-preference';\n\n/**\n * @name usePreferredContrast\n * @description - Hook that returns the contrast preference\n * @category Browser\n *\n * @returns {UsePreferredContrastReturn} The contrast preference\n *\n * @example\n * const contrast = usePreferredContrast();\n */\nexport const usePreferredContrast = (): UsePreferredContrastReturn => {\n const more = useMediaQuery('(prefers-contrast: more)');\n const less = useMediaQuery('(prefers-contrast: less)');\n const custom = useMediaQuery('(prefers-contrast: custom)');\n return more ? 'more' : less ? 'less' : custom ? 'custom' : 'no-preference';\n};\n"],"names":["usePreferredContrast","more","useMediaQuery","less","custom"],"mappings":";AAeO,MAAMA,IAAuB,MAAkC;AACpE,QAAMC,IAAOC,EAAc,0BAA0B,GAC/CC,IAAOD,EAAc,0BAA0B,GAC/CE,IAASF,EAAc,4BAA4B;AACzD,SAAOD,IAAO,SAASE,IAAO,SAASC,IAAS,WAAW;AAC7D;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePreferredDark.mjs","sources":["../../../../src/hooks/usePreferredDark/usePreferredDark.ts"],"sourcesContent":["import { useMediaQuery } from '../useMediaQuery/useMediaQuery';\n\n/**\n * @name usePreferredDark\n * @description - Hook that returns if the user prefers dark mode\n * @category Browser\n *\n * @example\n * const isDark = usePreferredDark();\n */\nexport const usePreferredDark = () => useMediaQuery('(prefers-color-scheme: dark)');\n"],"names":["usePreferredDark","useMediaQuery"],"mappings":";
|
|
1
|
+
{"version":3,"file":"usePreferredDark.mjs","sources":["../../../../src/hooks/usePreferredDark/usePreferredDark.ts"],"sourcesContent":["import { useMediaQuery } from '../useMediaQuery/useMediaQuery';\n\n/**\n * @name usePreferredDark\n * @description - Hook that returns if the user prefers dark mode\n * @category Browser\n *\n * @example\n * const isDark = usePreferredDark();\n */\nexport const usePreferredDark = () => useMediaQuery('(prefers-color-scheme: dark)');\n"],"names":["usePreferredDark","useMediaQuery"],"mappings":";AAUO,MAAMA,IAAmB,MAAMC,EAAc,8BAA8B;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePreferredLanguages.mjs","sources":["../../../../src/hooks/usePreferredLanguages/usePreferredLanguages.ts"],"sourcesContent":["import { useSyncExternalStore } from 'react';\n\nconst getSnapshot = () => window.navigator.languages;\nconst getServerSnapshot = () => [] as const;\nconst subscribe = (callback: () => void) => {\n window.addEventListener('languagechange', callback);\n return () => {\n window.removeEventListener('languagechange', callback);\n };\n};\n\n/**\n * @name usePreferredLanguages\n * @description Hook that returns a browser preferred languages from navigator\n * @category Browser\n *\n * @browserapi navigator.languages https://developer.mozilla.org/en-US/docs/Web/API/Navigator/languages\n *\n * @returns {readonly string[]} An array of strings representing the user's preferred languages\n *\n * @example\n * const languages = usePreferredLanguages();\n */\nexport const usePreferredLanguages = () =>\n useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);\n"],"names":["getSnapshot","getServerSnapshot","subscribe","callback","usePreferredLanguages","useSyncExternalStore"],"mappings":";AAEA,MAAMA,IAAc,MAAM,OAAO,UAAU,WACrCC,IAAoB,MAAM,
|
|
1
|
+
{"version":3,"file":"usePreferredLanguages.mjs","sources":["../../../../src/hooks/usePreferredLanguages/usePreferredLanguages.ts"],"sourcesContent":["import { useSyncExternalStore } from 'react';\n\nconst getSnapshot = () => window.navigator.languages;\nconst getServerSnapshot = () => [] as const;\nconst subscribe = (callback: () => void) => {\n window.addEventListener('languagechange', callback);\n return () => {\n window.removeEventListener('languagechange', callback);\n };\n};\n\n/**\n * @name usePreferredLanguages\n * @description Hook that returns a browser preferred languages from navigator\n * @category Browser\n *\n * @browserapi navigator.languages https://developer.mozilla.org/en-US/docs/Web/API/Navigator/languages\n *\n * @returns {readonly string[]} An array of strings representing the user's preferred languages\n *\n * @example\n * const languages = usePreferredLanguages();\n */\nexport const usePreferredLanguages = () =>\n useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot);\n"],"names":["getSnapshot","getServerSnapshot","subscribe","callback","usePreferredLanguages","useSyncExternalStore"],"mappings":";AAEA,MAAMA,IAAc,MAAM,OAAO,UAAU,WACrCC,IAAoB,MAAM,CAAA,GAC1BC,IAAY,CAACC,OACjB,OAAO,iBAAiB,kBAAkBA,CAAQ,GAC3C,MAAM;AACX,SAAO,oBAAoB,kBAAkBA,CAAQ;AAAA,IAgB5CC,IAAwB,MACnCC,EAAqBH,GAAWF,GAAaC,CAAiB;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { useRef as
|
|
2
|
-
const i = (r,
|
|
3
|
-
const
|
|
4
|
-
return (
|
|
1
|
+
import { useRef as u } from "react";
|
|
2
|
+
const i = (r, c) => {
|
|
3
|
+
const e = u(r), t = u(void 0);
|
|
4
|
+
return (c?.equality ?? Object.is)(r, e.current) || (t.current = e.current, e.current = r), t.current;
|
|
5
5
|
};
|
|
6
6
|
export {
|
|
7
7
|
i as usePrevious
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePrevious.mjs","sources":["../../../../src/hooks/usePrevious/usePrevious.ts"],"sourcesContent":["import { useRef } from 'react';\n\nexport interface UsePreviousOptions<Value> {\n equality: (a: Value, b: Value) => boolean;\n}\n\n/**\n * @name usePrevious\n * @description - Hook that returns the previous value\n * @category Utilities\n *\n * @template Value The type of the value\n * @param {Value} value The value to get the previous value\n * @param {(a: Value, b: Value) => boolean} [options.equality] The custom equality function to determine if the value has changed\n * @returns {Value | undefined} The previous value\n *\n * @example\n * const prevValue = usePrevious(value);\n */\nexport const usePrevious = <Value>(value: Value, options?: UsePreviousOptions<Value>) => {\n const currentRef = useRef<Value>(value);\n const previousRef = useRef<Value>(undefined);\n\n const equality = options?.equality ?? Object.is;\n\n if (!equality(value, currentRef.current)) {\n previousRef.current = currentRef.current;\n currentRef.current = value;\n }\n\n return previousRef.current;\n};\n"],"names":["usePrevious","value","options","currentRef","useRef","previousRef"],"mappings":";
|
|
1
|
+
{"version":3,"file":"usePrevious.mjs","sources":["../../../../src/hooks/usePrevious/usePrevious.ts"],"sourcesContent":["import { useRef } from 'react';\n\nexport interface UsePreviousOptions<Value> {\n equality: (a: Value, b: Value) => boolean;\n}\n\n/**\n * @name usePrevious\n * @description - Hook that returns the previous value\n * @category Utilities\n *\n * @template Value The type of the value\n * @param {Value} value The value to get the previous value\n * @param {(a: Value, b: Value) => boolean} [options.equality] The custom equality function to determine if the value has changed\n * @returns {Value | undefined} The previous value\n *\n * @example\n * const prevValue = usePrevious(value);\n */\nexport const usePrevious = <Value>(value: Value, options?: UsePreviousOptions<Value>) => {\n const currentRef = useRef<Value>(value);\n const previousRef = useRef<Value>(undefined);\n\n const equality = options?.equality ?? Object.is;\n\n if (!equality(value, currentRef.current)) {\n previousRef.current = currentRef.current;\n currentRef.current = value;\n }\n\n return previousRef.current;\n};\n"],"names":["usePrevious","value","options","currentRef","useRef","previousRef"],"mappings":";AAmBO,MAAMA,IAAc,CAAQC,GAAcC,MAAwC;AACvF,QAAMC,IAAaC,EAAcH,CAAK,GAChCI,IAAcD,EAAc,MAAS;AAI3C,UAFiBF,GAAS,YAAY,OAAO,IAE/BD,GAAOE,EAAW,OAAO,MACrCE,EAAY,UAAUF,EAAW,SACjCA,EAAW,UAAUF,IAGhBI,EAAY;AACrB;"}
|
|
@@ -1,55 +1,53 @@
|
|
|
1
|
-
import { useRef as
|
|
2
|
-
import { useDidUpdate as
|
|
3
|
-
import { useMount as
|
|
4
|
-
import { getRetry as
|
|
5
|
-
const
|
|
6
|
-
const
|
|
7
|
-
|
|
8
|
-
},
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
(u = e == null ? void 0 : e.onSuccess) == null || u.call(e, l), C(l), b(!0), E(void 0), R(!1), d(!1), c === "init" && v(!1), c === "refetch" && I(!1);
|
|
1
|
+
import { useRef as l, useState as c, useEffect as L } from "react";
|
|
2
|
+
import { useDidUpdate as x } from "../useDidUpdate/useDidUpdate.mjs";
|
|
3
|
+
import { useMount as M } from "../useMount/useMount.mjs";
|
|
4
|
+
import { getRetry as b } from "../../utils/helpers/getRetry.mjs";
|
|
5
|
+
const B = (E, e) => {
|
|
6
|
+
const a = e?.enabled ?? !0, n = l(e?.retry ? b(e.retry) : 0), o = l(!1), [C, u] = c(!1), [S, i] = c(!1), [k, v] = c(!1), [q, y] = c(!1), [w, I] = c(!!e?.placeholderData), [A, g] = c(void 0), [F, m] = c(e?.placeholderData), h = l(new AbortController()), D = l(void 0), d = e?.keys ?? [], R = () => {
|
|
7
|
+
h.current.abort(), h.current = new AbortController();
|
|
8
|
+
}, s = (t) => {
|
|
9
|
+
R(), u(!0), t === "init" && (o.current = !0, i(!0)), t === "refetch" && y(!0), E({ signal: h.current.signal, keys: d }).then((r) => {
|
|
10
|
+
const f = e?.select ? e?.select(r) : r;
|
|
11
|
+
e?.onSuccess?.(f), m(f), I(!0), g(void 0), v(!1), u(!1), t === "init" && i(!1), t === "refetch" && y(!1);
|
|
13
12
|
}).catch((r) => {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
setTimeout(() => a(c), u);
|
|
13
|
+
if (n.current > 0) {
|
|
14
|
+
n.current -= 1;
|
|
15
|
+
const f = typeof e?.retryDelay == "function" ? e?.retryDelay(n.current, r) : e?.retryDelay;
|
|
16
|
+
if (f) {
|
|
17
|
+
setTimeout(() => s(t), f);
|
|
20
18
|
return;
|
|
21
19
|
}
|
|
22
|
-
return
|
|
20
|
+
return s(t);
|
|
23
21
|
}
|
|
24
|
-
|
|
22
|
+
e?.onError?.(r), m(void 0), I(!1), g(r), v(!0), u(!1), t === "init" && i(!1), t === "refetch" && y(!1), n.current = e?.retry ? b(e.retry) : 0;
|
|
25
23
|
}).finally(() => {
|
|
26
|
-
if (e
|
|
24
|
+
if (e?.refetchInterval) {
|
|
27
25
|
const r = setInterval(() => {
|
|
28
|
-
clearInterval(r),
|
|
29
|
-
}, e
|
|
30
|
-
|
|
26
|
+
clearInterval(r), s("refetch");
|
|
27
|
+
}, e?.refetchInterval);
|
|
28
|
+
D.current = r;
|
|
31
29
|
}
|
|
32
30
|
});
|
|
33
31
|
};
|
|
34
|
-
return
|
|
35
|
-
|
|
36
|
-
}),
|
|
37
|
-
|
|
38
|
-
}, [
|
|
39
|
-
clearInterval(
|
|
40
|
-
}, [
|
|
41
|
-
abort:
|
|
42
|
-
data:
|
|
43
|
-
error:
|
|
44
|
-
refetch: () =>
|
|
45
|
-
isFetching:
|
|
46
|
-
isLoading:
|
|
47
|
-
isError:
|
|
48
|
-
isSuccess:
|
|
49
|
-
isRefetching:
|
|
32
|
+
return M(() => {
|
|
33
|
+
a && s("init");
|
|
34
|
+
}), x(() => {
|
|
35
|
+
a && s(o.current ? "refetch" : "init");
|
|
36
|
+
}, [a, ...d]), L(() => () => {
|
|
37
|
+
clearInterval(D.current);
|
|
38
|
+
}, [a, e?.refetchInterval, e?.retry, ...d]), {
|
|
39
|
+
abort: R,
|
|
40
|
+
data: F,
|
|
41
|
+
error: A,
|
|
42
|
+
refetch: () => s("refetch"),
|
|
43
|
+
isFetching: C,
|
|
44
|
+
isLoading: S,
|
|
45
|
+
isError: k,
|
|
46
|
+
isSuccess: w,
|
|
47
|
+
isRefetching: q
|
|
50
48
|
};
|
|
51
49
|
};
|
|
52
50
|
export {
|
|
53
|
-
|
|
51
|
+
B as useQuery
|
|
54
52
|
};
|
|
55
53
|
//# sourceMappingURL=useQuery.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useQuery.mjs","sources":["../../../../src/hooks/useQuery/useQuery.ts"],"sourcesContent":["import type { DependencyList } from 'react';\n\nimport { useEffect, useRef, useState } from 'react';\n\nimport { getRetry } from '@/utils/helpers';\n\nimport { useDidUpdate } from '../useDidUpdate/useDidUpdate';\nimport { useMount } from '../useMount/useMount';\n\n/* The use query return type */\nexport interface UseQueryOptions<QueryData, Data> {\n /* The enabled state of the query */\n enabled?: boolean;\n /* The depends for the hook */\n keys?: DependencyList;\n /* The placeholder data for the hook */\n placeholderData?: (() => Data) | Data;\n /* The refetch interval */\n refetchInterval?: number;\n /* The retry count of requests */\n retry?: boolean | number;\n /* The retry delay of requests */\n retryDelay?: ((retry: number, error: Error) => number) | number;\n /* The callback function to be invoked on error */\n onError?: (error: Error) => void;\n /* The callback function to be invoked on success */\n onSuccess?: (data: Data) => void;\n /* The select function to be invoked */\n select?: (data: QueryData) => Data;\n}\n\ninterface UseQueryCallbackParams {\n /* The depends for the hook */\n keys: DependencyList;\n /* The abort signal */\n signal: AbortSignal;\n}\n\n/* The use query return type */\nexport interface UseQueryReturn<Data> {\n /* The abort function */\n abort: AbortController['abort'];\n /* The state of the query */\n data?: Data;\n /* The success state of the query */\n error?: Error;\n /* The error state of the query */\n isError: boolean;\n /* The fetching state of the query */\n isFetching: boolean;\n /* The loading state of the query */\n isLoading: boolean;\n /* The refetching state of the query */\n isRefetching: boolean;\n /* The success state of the query */\n isSuccess: boolean;\n /* The refetch function */\n refetch: () => void;\n}\n\n/**\n * @name useQuery\n * @description - Hook that defines the logic when query data\n * @category Utilities\n *\n * @template Data The type of the data\n * @param {() => Promise<Data>} callback The callback function to be invoked\n * @param {DependencyList} [options.keys] The dependencies for the hook\n * @param {(data: Data) => void} [options.onSuccess] The callback function to be invoked on success\n * @param {(error: Error) => void} [options.onError] The callback function to be invoked on error\n * @param {UseQueryOptionsSelect<Data>} [options.select] The select function to be invoked\n * @param {Data | (() => Data)} [options.initialData] The initial data for the hook\n * @param {Data | (() => Data)} [options.placeholderData] The placeholder data for the hook\n * @param {number} [options.refetchInterval] The refetch interval\n * @param {boolean | number} [options.retry] The retry count of requests\n * @returns {UseQueryReturn<Data>} An object with the state of the query\n *\n * @example\n * const { data, isFetching, isLoading, isError, isSuccess, error, refetch, isRefetching, abort, aborted } = useQuery(() => fetch('url'));\n */\nexport const useQuery = <QueryData, Data = QueryData>(\n callback: (params: UseQueryCallbackParams) => Promise<QueryData>,\n options?: UseQueryOptions<QueryData, Data>\n): UseQueryReturn<Data> => {\n const enabled = options?.enabled ?? true;\n const retryCountRef = useRef(options?.retry ? getRetry(options.retry) : 0);\n const alreadyRequested = useRef(false);\n\n const [isFetching, setIsFetching] = useState(false);\n const [isLoading, setIsLoading] = useState(false);\n const [isError, setIsError] = useState(false);\n const [isRefetching, setIsRefetching] = useState(false);\n const [isSuccess, setIsSuccess] = useState(!!options?.placeholderData);\n\n const [error, setError] = useState<Error | undefined>(undefined);\n const [data, setData] = useState<Data | undefined>(options?.placeholderData);\n\n const abortControllerRef = useRef<AbortController>(new AbortController());\n const intervalIdRef = useRef<ReturnType<typeof setInterval>>(undefined);\n\n const keys = options?.keys ?? [];\n\n const abort = () => {\n abortControllerRef.current.abort();\n abortControllerRef.current = new AbortController();\n };\n\n const request = (action: 'init' | 'refetch') => {\n abort();\n\n setIsFetching(true);\n if (action === 'init') {\n alreadyRequested.current = true;\n setIsLoading(true);\n }\n if (action === 'refetch') setIsRefetching(true);\n callback({ signal: abortControllerRef.current.signal, keys })\n .then((response) => {\n const data = options?.select ? options?.select(response) : response;\n options?.onSuccess?.(data as Data);\n setData(data as Data);\n setIsSuccess(true);\n setError(undefined);\n setIsError(false);\n setIsFetching(false);\n if (action === 'init') setIsLoading(false);\n if (action === 'refetch') setIsRefetching(false);\n })\n .catch((error: Error) => {\n if (retryCountRef.current > 0) {\n retryCountRef.current -= 1;\n const retryDelay =\n typeof options?.retryDelay === 'function'\n ? options?.retryDelay(retryCountRef.current, error)\n : options?.retryDelay;\n\n if (retryDelay) {\n setTimeout(() => request(action), retryDelay);\n return;\n }\n\n return request(action);\n }\n options?.onError?.(error);\n setData(undefined);\n setIsSuccess(false);\n setError(error);\n setIsError(true);\n setIsFetching(false);\n if (action === 'init') setIsLoading(false);\n if (action === 'refetch') setIsRefetching(false);\n retryCountRef.current = options?.retry ? getRetry(options.retry) : 0;\n })\n .finally(() => {\n if (options?.refetchInterval) {\n const interval = setInterval(() => {\n clearInterval(interval);\n request('refetch');\n }, options?.refetchInterval);\n intervalIdRef.current = interval;\n }\n });\n };\n\n useMount(() => {\n if (!enabled) return;\n request('init');\n });\n\n useDidUpdate(() => {\n if (!enabled) return;\n request(alreadyRequested.current ? 'refetch' : 'init');\n }, [enabled, ...keys]);\n\n useEffect(() => {\n return () => {\n clearInterval(intervalIdRef.current);\n };\n }, [enabled, options?.refetchInterval, options?.retry, ...keys]);\n\n const refetch = () => request('refetch');\n\n return {\n abort,\n data,\n error,\n refetch,\n isFetching,\n isLoading,\n isError,\n isSuccess,\n isRefetching\n };\n};\n"],"names":["useQuery","callback","options","enabled","retryCountRef","useRef","getRetry","alreadyRequested","isFetching","setIsFetching","useState","isLoading","setIsLoading","isError","setIsError","isRefetching","setIsRefetching","isSuccess","setIsSuccess","error","setError","data","setData","abortControllerRef","intervalIdRef","keys","abort","request","action","response","
|
|
1
|
+
{"version":3,"file":"useQuery.mjs","sources":["../../../../src/hooks/useQuery/useQuery.ts"],"sourcesContent":["import type { DependencyList } from 'react';\n\nimport { useEffect, useRef, useState } from 'react';\n\nimport { getRetry } from '@/utils/helpers';\n\nimport { useDidUpdate } from '../useDidUpdate/useDidUpdate';\nimport { useMount } from '../useMount/useMount';\n\n/* The use query return type */\nexport interface UseQueryOptions<QueryData, Data> {\n /* The enabled state of the query */\n enabled?: boolean;\n /* The depends for the hook */\n keys?: DependencyList;\n /* The placeholder data for the hook */\n placeholderData?: (() => Data) | Data;\n /* The refetch interval */\n refetchInterval?: number;\n /* The retry count of requests */\n retry?: boolean | number;\n /* The retry delay of requests */\n retryDelay?: ((retry: number, error: Error) => number) | number;\n /* The callback function to be invoked on error */\n onError?: (error: Error) => void;\n /* The callback function to be invoked on success */\n onSuccess?: (data: Data) => void;\n /* The select function to be invoked */\n select?: (data: QueryData) => Data;\n}\n\ninterface UseQueryCallbackParams {\n /* The depends for the hook */\n keys: DependencyList;\n /* The abort signal */\n signal: AbortSignal;\n}\n\n/* The use query return type */\nexport interface UseQueryReturn<Data> {\n /* The abort function */\n abort: AbortController['abort'];\n /* The state of the query */\n data?: Data;\n /* The success state of the query */\n error?: Error;\n /* The error state of the query */\n isError: boolean;\n /* The fetching state of the query */\n isFetching: boolean;\n /* The loading state of the query */\n isLoading: boolean;\n /* The refetching state of the query */\n isRefetching: boolean;\n /* The success state of the query */\n isSuccess: boolean;\n /* The refetch function */\n refetch: () => void;\n}\n\n/**\n * @name useQuery\n * @description - Hook that defines the logic when query data\n * @category Utilities\n *\n * @template Data The type of the data\n * @param {() => Promise<Data>} callback The callback function to be invoked\n * @param {DependencyList} [options.keys] The dependencies for the hook\n * @param {(data: Data) => void} [options.onSuccess] The callback function to be invoked on success\n * @param {(error: Error) => void} [options.onError] The callback function to be invoked on error\n * @param {UseQueryOptionsSelect<Data>} [options.select] The select function to be invoked\n * @param {Data | (() => Data)} [options.initialData] The initial data for the hook\n * @param {Data | (() => Data)} [options.placeholderData] The placeholder data for the hook\n * @param {number} [options.refetchInterval] The refetch interval\n * @param {boolean | number} [options.retry] The retry count of requests\n * @returns {UseQueryReturn<Data>} An object with the state of the query\n *\n * @example\n * const { data, isFetching, isLoading, isError, isSuccess, error, refetch, isRefetching, abort, aborted } = useQuery(() => fetch('url'));\n */\nexport const useQuery = <QueryData, Data = QueryData>(\n callback: (params: UseQueryCallbackParams) => Promise<QueryData>,\n options?: UseQueryOptions<QueryData, Data>\n): UseQueryReturn<Data> => {\n const enabled = options?.enabled ?? true;\n const retryCountRef = useRef(options?.retry ? getRetry(options.retry) : 0);\n const alreadyRequested = useRef(false);\n\n const [isFetching, setIsFetching] = useState(false);\n const [isLoading, setIsLoading] = useState(false);\n const [isError, setIsError] = useState(false);\n const [isRefetching, setIsRefetching] = useState(false);\n const [isSuccess, setIsSuccess] = useState(!!options?.placeholderData);\n\n const [error, setError] = useState<Error | undefined>(undefined);\n const [data, setData] = useState<Data | undefined>(options?.placeholderData);\n\n const abortControllerRef = useRef<AbortController>(new AbortController());\n const intervalIdRef = useRef<ReturnType<typeof setInterval>>(undefined);\n\n const keys = options?.keys ?? [];\n\n const abort = () => {\n abortControllerRef.current.abort();\n abortControllerRef.current = new AbortController();\n };\n\n const request = (action: 'init' | 'refetch') => {\n abort();\n\n setIsFetching(true);\n if (action === 'init') {\n alreadyRequested.current = true;\n setIsLoading(true);\n }\n if (action === 'refetch') setIsRefetching(true);\n callback({ signal: abortControllerRef.current.signal, keys })\n .then((response) => {\n const data = options?.select ? options?.select(response) : response;\n options?.onSuccess?.(data as Data);\n setData(data as Data);\n setIsSuccess(true);\n setError(undefined);\n setIsError(false);\n setIsFetching(false);\n if (action === 'init') setIsLoading(false);\n if (action === 'refetch') setIsRefetching(false);\n })\n .catch((error: Error) => {\n if (retryCountRef.current > 0) {\n retryCountRef.current -= 1;\n const retryDelay =\n typeof options?.retryDelay === 'function'\n ? options?.retryDelay(retryCountRef.current, error)\n : options?.retryDelay;\n\n if (retryDelay) {\n setTimeout(() => request(action), retryDelay);\n return;\n }\n\n return request(action);\n }\n options?.onError?.(error);\n setData(undefined);\n setIsSuccess(false);\n setError(error);\n setIsError(true);\n setIsFetching(false);\n if (action === 'init') setIsLoading(false);\n if (action === 'refetch') setIsRefetching(false);\n retryCountRef.current = options?.retry ? getRetry(options.retry) : 0;\n })\n .finally(() => {\n if (options?.refetchInterval) {\n const interval = setInterval(() => {\n clearInterval(interval);\n request('refetch');\n }, options?.refetchInterval);\n intervalIdRef.current = interval;\n }\n });\n };\n\n useMount(() => {\n if (!enabled) return;\n request('init');\n });\n\n useDidUpdate(() => {\n if (!enabled) return;\n request(alreadyRequested.current ? 'refetch' : 'init');\n }, [enabled, ...keys]);\n\n useEffect(() => {\n return () => {\n clearInterval(intervalIdRef.current);\n };\n }, [enabled, options?.refetchInterval, options?.retry, ...keys]);\n\n const refetch = () => request('refetch');\n\n return {\n abort,\n data,\n error,\n refetch,\n isFetching,\n isLoading,\n isError,\n isSuccess,\n isRefetching\n };\n};\n"],"names":["useQuery","callback","options","enabled","retryCountRef","useRef","getRetry","alreadyRequested","isFetching","setIsFetching","useState","isLoading","setIsLoading","isError","setIsError","isRefetching","setIsRefetching","isSuccess","setIsSuccess","error","setError","data","setData","abortControllerRef","intervalIdRef","keys","abort","request","action","response","retryDelay","interval","useMount","useDidUpdate","useEffect"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useQueue.mjs","sources":["../../../../src/hooks/useQueue/useQueue.ts"],"sourcesContent":["import { useState } from 'react';\nimport { flushSync } from 'react-dom';\n\n/** The use queue return type */\nexport interface UseQueueReturn<Value> {\n /** Get the first element of the queue */\n first: Value;\n /** Get the last element of the queue */\n last: Value;\n /** The current queue */\n queue: Value[];\n /** Get the size of the queue */\n size: number;\n /** Add an element to the queue */\n add: (element: Value) => void;\n /** Clear the queue */\n clear: () => void;\n /** Remove an element from the queue */\n remove: () => Value;\n}\n\n/**\n * @name useQueue\n * @description - Hook that manages a queue\n * @category Utilities\n *\n * @template Value The type of the value\n * @param {Value[]} [initialValue=[]] The initial value of the queue\n * @returns {UseQueueReturn} An object containing the current queue and functions to interact with the queue\n *\n * @example\n * const { queue, add, remove, clear, first, last, size } = useQueue([1, 2, 3]);\n */\nexport const useQueue = <Value>(initialValue: Value[] = []): UseQueueReturn<Value> => {\n const [queue, setQueue] = useState(initialValue);\n\n const add = (element: Value) => setQueue((queue) => [...queue, element]);\n const clear = () => setQueue([]);\n const remove = () => {\n let removed;\n flushSync(() => {\n setQueue(([first, ...rest]) => {\n removed = first;\n return rest;\n });\n });\n\n return removed as Value;\n };\n\n return {\n add,\n remove,\n clear,\n first: queue[0],\n last: queue[queue.length - 1],\n size: queue.length,\n queue\n };\n};\n"],"names":["useQueue","initialValue","queue","setQueue","useState","element","removed","flushSync","first","rest"],"mappings":";;AAiCO,MAAMA,IAAW,CAAQC,IAAwB,OAA8B;AACpF,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAASH,CAAY;
|
|
1
|
+
{"version":3,"file":"useQueue.mjs","sources":["../../../../src/hooks/useQueue/useQueue.ts"],"sourcesContent":["import { useState } from 'react';\nimport { flushSync } from 'react-dom';\n\n/** The use queue return type */\nexport interface UseQueueReturn<Value> {\n /** Get the first element of the queue */\n first: Value;\n /** Get the last element of the queue */\n last: Value;\n /** The current queue */\n queue: Value[];\n /** Get the size of the queue */\n size: number;\n /** Add an element to the queue */\n add: (element: Value) => void;\n /** Clear the queue */\n clear: () => void;\n /** Remove an element from the queue */\n remove: () => Value;\n}\n\n/**\n * @name useQueue\n * @description - Hook that manages a queue\n * @category Utilities\n *\n * @template Value The type of the value\n * @param {Value[]} [initialValue=[]] The initial value of the queue\n * @returns {UseQueueReturn} An object containing the current queue and functions to interact with the queue\n *\n * @example\n * const { queue, add, remove, clear, first, last, size } = useQueue([1, 2, 3]);\n */\nexport const useQueue = <Value>(initialValue: Value[] = []): UseQueueReturn<Value> => {\n const [queue, setQueue] = useState(initialValue);\n\n const add = (element: Value) => setQueue((queue) => [...queue, element]);\n const clear = () => setQueue([]);\n const remove = () => {\n let removed;\n flushSync(() => {\n setQueue(([first, ...rest]) => {\n removed = first;\n return rest;\n });\n });\n\n return removed as Value;\n };\n\n return {\n add,\n remove,\n clear,\n first: queue[0],\n last: queue[queue.length - 1],\n size: queue.length,\n queue\n };\n};\n"],"names":["useQueue","initialValue","queue","setQueue","useState","element","removed","flushSync","first","rest"],"mappings":";;AAiCO,MAAMA,IAAW,CAAQC,IAAwB,OAA8B;AACpF,QAAM,CAACC,GAAOC,CAAQ,IAAIC,EAASH,CAAY;AAgB/C,SAAO;AAAA,IACL,KAfU,CAACI,MAAmBF,EAAS,CAACD,MAAU,CAAC,GAAGA,GAAOG,CAAO,CAAC;AAAA,IAgBrE,QAda,MAAM;AACnB,UAAIC;AACJ,aAAAC,EAAU,MAAM;AACd,QAAAJ,EAAS,CAAC,CAACK,GAAU,GAAAC,CAAI,OACvBH,IAAUE,GACHC,EACR;AAAA,MAAA,CACF,GAEMH;AAAA,IAAA;AAAA,IAMP,OAhBY,MAAMH,EAAS,EAAE;AAAA,IAiB7B,OAAOD,EAAM,CAAC;AAAA,IACd,MAAMA,EAAMA,EAAM,SAAS,CAAC;AAAA,IAC5B,MAAMA,EAAM;AAAA,IACZ,OAAAA;AAAA,EAAA;AAEJ;"}
|
|
@@ -1,30 +1,30 @@
|
|
|
1
|
-
import { useRef as
|
|
2
|
-
const
|
|
3
|
-
const
|
|
4
|
-
|
|
5
|
-
const
|
|
6
|
-
const
|
|
7
|
-
if (
|
|
8
|
-
|
|
1
|
+
import { useRef as c, useState as w, useEffect as A } from "react";
|
|
2
|
+
const R = (a, r) => {
|
|
3
|
+
const e = c(null), n = c(0), [i, o] = w(!1), s = r?.enabled ?? !0, f = c(a);
|
|
4
|
+
f.current = a;
|
|
5
|
+
const t = (u) => {
|
|
6
|
+
const m = u - n.current;
|
|
7
|
+
if (r?.delay && m < r?.delay) {
|
|
8
|
+
e.current = window.requestAnimationFrame(t);
|
|
9
9
|
return;
|
|
10
10
|
}
|
|
11
|
-
|
|
12
|
-
},
|
|
13
|
-
|
|
11
|
+
n.current = u, f.current({ delta: m, timestamp: u }), e.current = window.requestAnimationFrame(t);
|
|
12
|
+
}, l = () => {
|
|
13
|
+
i || (o(!0), n.current = 0, e.current = window.requestAnimationFrame(t));
|
|
14
14
|
};
|
|
15
|
-
function
|
|
16
|
-
|
|
15
|
+
function d() {
|
|
16
|
+
e.current && (o(!1), window.cancelAnimationFrame(e.current), e.current = null);
|
|
17
17
|
}
|
|
18
|
-
return
|
|
19
|
-
if (
|
|
20
|
-
return
|
|
21
|
-
}, [
|
|
22
|
-
active:
|
|
23
|
-
pause:
|
|
24
|
-
resume:
|
|
18
|
+
return A(() => {
|
|
19
|
+
if (s)
|
|
20
|
+
return l(), d;
|
|
21
|
+
}, [s, r?.delay]), {
|
|
22
|
+
active: i,
|
|
23
|
+
pause: d,
|
|
24
|
+
resume: l
|
|
25
25
|
};
|
|
26
26
|
};
|
|
27
27
|
export {
|
|
28
|
-
|
|
28
|
+
R as useRaf
|
|
29
29
|
};
|
|
30
30
|
//# sourceMappingURL=useRaf.mjs.map
|