@dimaslz/svelteuse NPM

SvelteUse

List of hooks inspired on https://usehooks.com, https://usehooks-ts.com and https://vueuse.org.

Installation

npm

npm install @dimaslz/svelteuse

yarn

yarn add @dimaslz/svelteuse

bun

bun add @dimaslz/svelteuse

TODO

This list is orientative, let's try to get all 👨‍💻.

useReducer
useLocation (https://vueuse.org/core/useBrowserLocation/)
useEventCallback: https://usehooks-ts.com/react-hook/use-event-callback
usePreferredDark (https://vueuse.org/core/usePreferredDark/)
useCountdown (https://usehooks-ts.com/react-hook/use-countdown, https://usehooks.com/usecountdown)
useIntersectionObserver (https://usehooks-ts.com/react-hook/use-intersection-observer, https://usehooks.com/useintersectionobserver, https://vueuse.org/core/useIntersectionObserver/)
useMouseInElement (https://vueuse.org/core/useMouseInElement/, https://usehooks.com/usemouse)
useRandomInterval (https://usehooks.com/userandominterval)
useNow (https://vueuse.org/core/useNow/)
useIsClient (https://usehooks-ts.com/react-hook/use-is-client, https://usehooks.com/useisclient)
useTimestamp (https://vueuse.org/core/useTimestamp/)
useTransition (https://vueuse.org/core/useTransition/)
usePrevious (https://usehooks.com/useprevious, https://vueuse.org/core/usePrevious/)
useNetwork (https://vueuse.org/core/useNetwork/, https://usehooks.com/usenetworkstate)
useOrientation (https://usehooks.com/useorientation, https://vueuse.org/core/useScreenOrientation/)
usePreferredLanguage (https://usehooks.com/usepreferredlanguage, https://vueuse.org/core/usePreferredLanguages/)
useRetry (https://usehooks.com/usecontinuousretry)
useVisibilityChange (https://usehooks.com/usevisibilitychange, https://vueuse.org/core/useDocumentVisibility/)
useRenderInfo (https://usehooks.com/userenderinfo)
useRenderCount (https://usehooks.com/userendercount)
useIsFirstRender (https://usehooks-ts.com/react-hook/use-is-first-render, https://usehooks.com/useisfirstrender)
useLongPress (https://usehooks.com/uselongpress, https://vueuse.org/core/onLongPress/)
useFavicon (https://usehooks.com/usefavicon, https://vueuse.org/core/useFavicon/)
useDefault (https://usehooks.com/usedefault)
useWindowScroll (https://usehooks.com/usewindowscroll, https://vueuse.org/core/useWindowScroll/)
useWindowFocus (https://vueuse.org/core/useWindowFocus/)
useMeasure (https://usehooks.com/usemeasure)
useList (https://usehooks.com/uselist)
useLockBodyScroll (https://usehooks.com/uselockbodyscroll, https://usehooks-ts.com/react-hook/use-locked-body)
useScroll (https://vueuse.org/core/useScroll/)
useScrollLock (https://vueuse.org/core/useScrollLock/)
useQueue (https://usehooks.com/usequeue)
useKeyPress (https://usehooks.com/usekeypress)
useTimeoutPoll (https://vueuse.org/core/useTimeoutPoll/, )
useSet (https://usehooks.com/useset, https://vueuse.org/shared/set/)
useIdle (https://usehooks.com/useidle, https://vueuse.org/core/useIdle/)
useHistory (https://usehooks.com/usehistorystate, https://vueuse.org/core/useRefHistory/, )
useThrottledHistory (https://vueuse.org/core/useThrottledRefHistory/)
useDebouncedHistory (https://vueuse.org/core/useDebouncedRefHistory/)
useManualHistory (https://vueuse.org/core/useManualRefHistory/)
usePageLeave (https://usehooks.com/usepageleave, https://vueuse.org/core/usePageLeave/)
useObjectState (https://usehooks.com/useobjectstate)
isMounted (https://usehooks-ts.com/react-hook/use-is-mounted)
useFullScreen (https://vueuse.org/core/useFullscreen/)
useSsr (https://usehooks-ts.com/react-hook/use-ssr)
useStep (https://usehooks-ts.com/react-hook/use-step)
useStepper (https://vueuse.org/core/useStepper/)
useTernaryDarkMode (https://usehooks-ts.com/react-hook/use-ternary-dark-mode)
useAsyncState (https://vueuse.org/core/useAsyncState/)
useLastChanged (https://vueuse.org/shared/useLastChanged/)
useStorage (https://vueuse.org/core/useStorage/)
useActiveElement (https://vueuse.org/core/useActiveElement/)
useDraggable (https://vueuse.org/core/useDraggable/)
useDropZone (https://vueuse.org/core/useDropZone/)
useElementBounding (https://vueuse.org/core/useElementBounding/)
useElementVisibility (https://vueuse.org/core/useElementVisibility/)
useMutationObserver (https://vueuse.org/core/useMutationObserver/)
useParentElement (https://vueuse.org/core/useParentElement/)
useBreakpoints (https://vueuse.org/core/useBreakpoints/)
useBroadcastChannel (https://vueuse.org/core/useBroadcastChannel/)
useColorMode (https://vueuse.org/core/useColorMode/)
useCssVar (https://vueuse.org/core/useCssVar/)
useEyeDropper (https://vueuse.org/core/useEyeDropper/)
useFileDialog (https://vueuse.org/core/useFileDialog/)
useFileSystemAccess (https://vueuse.org/core/useFileSystemAccess/)
useMediaControls (https://vueuse.org/core/useMediaControls/)
useMemory (https://vueuse.org/core/useMemory/)
useObjectUrl (https://vueuse.org/core/useObjectUrl/)
usePerformanceObserver (https://vueuse.org/core/usePerformanceObserver/)
usePermission (https://vueuse.org/core/usePermission/)
usePreferredColorScheme (https://vueuse.org/core/usePreferredColorScheme/)
usePreferredContrast (https://vueuse.org/core/usePreferredContrast/)
usePreferredReducedMotion (https://vueuse.org/core/usePreferredReducedMotion/)
useStyleTag (https://vueuse.org/core/useStyleTag/)
useTextareaAutosize (https://vueuse.org/core/useTextareaAutosize/)
useTextDirection (https://vueuse.org/core/useTextDirection/)
useUrlSearchParams (https://vueuse.org/core/useUrlSearchParams/?foo=bar&vueuse=awesome)
useWakeLock (https://vueuse.org/core/useWakeLock/)
useWebNotification (https://vueuse.org/core/useWebNotification/)
onStartTyping (https://vueuse.org/core/onStartTyping/)
useFocus (https://vueuse.org/core/useFocus/)
useFocusWithin (https://vueuse.org/core/useFocusWithin/)
useInfiniteScroll (https://vueuse.org/core/useInfiniteScroll/)
useKeyModifier (https://vueuse.org/core/useKeyModifier/)
useMagicKeys (https://vueuse.org/core/useMagicKeys/)
useMouse (https://vueuse.org/core/useMouse/)
useMousePressed (https://vueuse.org/core/useMousePressed/)
useNavigatorLanguage (https://vueuse.org/core/useNavigatorLanguage/)
useOnline (https://vueuse.org/core/useOnline/)
usePointer (https://vueuse.org/core/usePointer/)
usePointerLock (https://vueuse.org/core/usePointerLock/)
usePointerSwipe (https://vueuse.org/core/usePointerSwipe/)
useSpeechRecognition (https://vueuse.org/core/useSpeechRecognition/)
useSpeechSynthesis (https://vueuse.org/core/useSpeechSynthesis/)
useSwipe (https://vueuse.org/core/useSwipe/)
useTextSelection (https://vueuse.org/core/useTextSelection/)
useUserMedia (https://vueuse.org/core/useUserMedia/)
useWebSocket (https://vueuse.org/core/useWebSocket/)

Author

{
	"name": "Dimas López Zurita",
	"role": "Senior Software Engineer",
	"alias": "dimaslz",
	"linkedin": "https://www.linkedin.com/in/dimaslopezzurita",
	"github": "https://github.com/dimaslz",
	"twitter": "https://twitter.com/dimaslz",
	"tags": "tooling, docker, tailwindcss, vue, SAAS, nodejs+express"
}

My other projects

https://ng-heroicons.dimaslz.dev/: An Angular components library to use Heroicons.com in your Angular projects.
https://randomdata.loremapi.io/: A tool to create mock Api responses with your custom schema.
https://svg-icon-2-fw-component.dimaslz.dev: A tool to create a framework icon component from a SVG
https://loremapi.io: Mock and document your Api's
https://cv.dimaslz.dev: My online CV
https://api.dimaslz.dev: My professional info by API
https://dimaslz.dev: Dev landing
https://dimaslz.com: Profesional landing profile