diff --git a/package.json b/package.json index d99aedbf..fe129c45 100644 --- a/package.json +++ b/package.json @@ -19,6 +19,7 @@ "lint": "eslint {src,tests}/**/*.{ts,tsx}", "lint:fix": "yarn lint --fix", "lint:types": "tsc --noEmit", + "lint:prettier":"yarn prettier --write src/**/**/*.{ts,tsx}", "build:cjs": "tsc", "build:es": "tsc -m esNext --outDir esm", "build": "yarn build:cjs && yarn build:es", @@ -148,8 +149,9 @@ ] }, "lint-staged": { - "src/**/*.{ts,tsx}": [ + "src/**/**/*.{ts,tsx}": [ "eslint --fix", + "prettier --write", "git add" ] }, diff --git a/src/createBreakpoint.ts b/src/createBreakpoint.ts index 0c53ff9f..eee72085 100644 --- a/src/createBreakpoint.ts +++ b/src/createBreakpoint.ts @@ -1,4 +1,3 @@ -/* eslint-disable */ import { useEffect, useState, useMemo } from 'react'; const createBreakpoint = ( diff --git a/src/createGlobalState.ts b/src/createGlobalState.ts index fe0fd8bf..cb76af8a 100644 --- a/src/createGlobalState.ts +++ b/src/createGlobalState.ts @@ -1,4 +1,3 @@ -/* eslint-disable */ import { useState } from 'react'; import useEffectOnce from './useEffectOnce'; import useIsomorphicLayoutEffect from './useIsomorphicLayoutEffect'; @@ -8,7 +7,7 @@ export function createGlobalState(initialState?: S) { state: initialState, setState(state: S) { store.state = state; - store.setters.forEach(setter => setter(store.state)); + store.setters.forEach((setter) => setter(store.state)); }, setters: [], }; @@ -17,7 +16,7 @@ export function createGlobalState(initialState?: S) { const [globalState, stateSetter] = useState(store.state); useEffectOnce(() => () => { - store.setters = store.setters.filter(setter => setter !== stateSetter); + store.setters = store.setters.filter((setter) => setter !== stateSetter); }); useIsomorphicLayoutEffect(() => { diff --git a/src/createMemo.ts b/src/createMemo.ts index b407d2ab..9b796877 100644 --- a/src/createMemo.ts +++ b/src/createMemo.ts @@ -1,4 +1,3 @@ -/* eslint-disable */ import { useMemo } from 'react'; const createMemo = any>(fn: T) => (...args: Parameters) => diff --git a/src/createReducer.ts b/src/createReducer.ts index 50b8ec06..c53b9dd0 100644 --- a/src/createReducer.ts +++ b/src/createReducer.ts @@ -30,7 +30,7 @@ const createReducer = (...middlewares: Middleware[ const [, setState] = useState(ref.current); const dispatch = useCallback( - action => { + (action) => { ref.current = reducer(ref.current, action); setState(ref.current); return action; diff --git a/src/createRouter.ts b/src/createRouter.ts index fbbe7b86..f2690e09 100644 --- a/src/createRouter.ts +++ b/src/createRouter.ts @@ -1,5 +1,4 @@ -/* eslint-disable */ -import * as React from 'react'; +import React from 'react'; export interface RouterProviderProps { route: string; @@ -14,7 +13,7 @@ const createRouter = () => { // not sure if this supposed to be unused, ignoring ts error for now // @ts-ignore - const Router: React.SFC = props => { + const Router: React.SFC = (props) => { const { route, fullRoute, parent, children } = props; if (process.env.NODE_ENV !== 'production') { diff --git a/src/useAsyncFn.ts b/src/useAsyncFn.ts index 0ec39a52..a58b4d11 100644 --- a/src/useAsyncFn.ts +++ b/src/useAsyncFn.ts @@ -1,4 +1,3 @@ -/* eslint-disable */ import { DependencyList, useCallback, useState, useRef } from 'react'; import useMountedState from './useMountedState'; import { FnReturningPromise, PromiseType } from './util'; @@ -40,15 +39,15 @@ export default function useAsyncFn( const callback = useCallback((...args: Parameters): ReturnType => { const callId = ++lastCallId.current; - set(prevState => ({ ...prevState, loading: true })); + set((prevState) => ({ ...prevState, loading: true })); return fn(...args).then( - value => { + (value) => { isMounted() && callId === lastCallId.current && set({ value, loading: false }); return value; }, - error => { + (error) => { isMounted() && callId === lastCallId.current && set({ error, loading: false }); return error; diff --git a/src/useAsyncRetry.ts b/src/useAsyncRetry.ts index aa0a43d5..a51c18b0 100644 --- a/src/useAsyncRetry.ts +++ b/src/useAsyncRetry.ts @@ -1,4 +1,3 @@ -/* eslint-disable */ import { DependencyList, useCallback, useState } from 'react'; import useAsync, { AsyncState } from './useAsync'; @@ -20,7 +19,7 @@ const useAsyncRetry = (fn: () => Promise, deps: DependencyList = []) => { return; } - setAttempt(currentAttempt => currentAttempt + 1); + setAttempt((currentAttempt) => currentAttempt + 1); }, [...deps, stateLoading]); return { ...state, retry }; diff --git a/src/useBattery.ts b/src/useBattery.ts index 53083efb..bdb4a2b0 100644 --- a/src/useBattery.ts +++ b/src/useBattery.ts @@ -1,9 +1,6 @@ -/* eslint-disable */ -import * as React from 'react'; +import { useState, useEffect } from 'react'; import { off, on, isDeepEqual } from './util'; -const { useState, useEffect } = React; - export interface BatteryState { charging: boolean; chargingTime: number; diff --git a/src/useClickAway.ts b/src/useClickAway.ts index 12794b9b..490b918f 100644 --- a/src/useClickAway.ts +++ b/src/useClickAway.ts @@ -13,7 +13,7 @@ const useClickAway = ( savedCallback.current = onClickAway; }, [onClickAway]); useEffect(() => { - const handler = event => { + const handler = (event) => { const { current: el } = ref; el && !el.contains(event.target) && savedCallback.current(event); }; diff --git a/src/useCopyToClipboard.ts b/src/useCopyToClipboard.ts index e39f9c6d..783ba0ef 100644 --- a/src/useCopyToClipboard.ts +++ b/src/useCopyToClipboard.ts @@ -1,4 +1,3 @@ -/* eslint-disable */ import writeText from 'copy-to-clipboard'; import { useCallback } from 'react'; import useMountedState from './useMountedState'; @@ -18,7 +17,7 @@ const useCopyToClipboard = (): [CopyToClipboardState, (value: string) => void] = noUserInteraction: true, }); - const copyToClipboard = useCallback(value => { + const copyToClipboard = useCallback((value) => { if (!isMounted()) { return; } diff --git a/src/useCounter.ts b/src/useCounter.ts index 227feca7..03c0ad36 100644 --- a/src/useCounter.ts +++ b/src/useCounter.ts @@ -1,4 +1,3 @@ -/* eslint-disable */ import { useMemo } from 'react'; import useGetSet from './useGetSet'; import { HookState, InitialHookState, resolveHookState } from './util/resolveHookState'; diff --git a/src/useDrop.ts b/src/useDrop.ts index 62ceda66..135594c1 100644 --- a/src/useDrop.ts +++ b/src/useDrop.ts @@ -1,7 +1,4 @@ -/* eslint-disable */ -import * as React from 'react'; - -const { useState, useMemo, useCallback, useEffect } = React; +import { useState, useMemo, useCallback, useEffect } from 'react'; export interface DropAreaState { over: boolean; @@ -50,12 +47,12 @@ const useDrop = (options: DropAreaOptions = {}, args = []): DropAreaState => { const process = useMemo(() => createProcess(options), [onFiles, onText, onUri]); useEffect(() => { - const onDragOver = event => { + const onDragOver = (event) => { event.preventDefault(); setOver(true); }; - const onDragEnter = event => { + const onDragEnter = (event) => { event.preventDefault(); setOver(true); }; @@ -68,13 +65,13 @@ const useDrop = (options: DropAreaOptions = {}, args = []): DropAreaState => { setOver(false); }; - const onDrop = event => { + const onDrop = (event) => { event.preventDefault(); setOver(false); process(event.dataTransfer, event); }; - const onPaste = event => { + const onPaste = (event) => { process(event.clipboardData, event); }; diff --git a/src/useDropArea.ts b/src/useDropArea.ts index 6f816ec1..6586002b 100644 --- a/src/useDropArea.ts +++ b/src/useDropArea.ts @@ -41,7 +41,7 @@ const createProcess = (options: DropAreaOptions, mounted: boolean) => (dataTrans } if (dataTransfer.items && dataTransfer.items.length) { - dataTransfer.items[0].getAsString(text => { + dataTransfer.items[0].getAsString((text) => { if (mounted) { (options.onText || noop)(text, event); } @@ -50,23 +50,23 @@ const createProcess = (options: DropAreaOptions, mounted: boolean) => (dataTrans }; const createBond = (process, setOver): DropAreaBond => ({ - onDragOver: event => { + onDragOver: (event) => { event.preventDefault(); }, - onDragEnter: event => { + onDragEnter: (event) => { event.preventDefault(); setOver(true); }, onDragLeave: () => { setOver(false); }, - onDrop: event => { + onDrop: (event) => { event.preventDefault(); event.persist(); setOver(false); process(event.dataTransfer, event); }, - onPaste: event => { + onPaste: (event) => { event.persist(); process(event.clipboardData, event); }, diff --git a/src/useFullscreen.ts b/src/useFullscreen.ts index 1826642c..cd380fbd 100644 --- a/src/useFullscreen.ts +++ b/src/useFullscreen.ts @@ -4,12 +4,11 @@ import screenfull from 'screenfull'; import useIsomorphicLayoutEffect from './useIsomorphicLayoutEffect'; export interface FullScreenOptions { - video?: RefObject void; webkitExitFullscreen?: () => void; }>; + video?: RefObject void; webkitExitFullscreen?: () => void }>; onClose?: (error?: Error) => void; } -const noop = () => { -}; +const noop = () => {}; const useFullscreen = (ref: RefObject, on: boolean, options: FullScreenOptions = {}): boolean => { const { video, onClose = noop } = options; @@ -62,8 +61,7 @@ const useFullscreen = (ref: RefObject, on: boolean, options: FullScreen try { screenfull.off('change', onChange); screenfull.exit(); - } catch { - } + } catch {} } else if (video && video.current && video.current.webkitExitFullscreen) { video.current.removeEventListener('webkitendfullscreen', onWebkitEndFullscreen); video.current.webkitExitFullscreen(); diff --git a/src/useGeolocation.ts b/src/useGeolocation.ts index 8c2c831c..70790849 100644 --- a/src/useGeolocation.ts +++ b/src/useGeolocation.ts @@ -45,7 +45,7 @@ const useGeolocation = (options?: PositionOptions): GeoLocationSensorState => { } }; const onEventError = (error: PositionError) => - mounted && setState(oldState => ({ ...oldState, loading: false, error })); + mounted && setState((oldState) => ({ ...oldState, loading: false, error })); useEffect(() => { navigator.geolocation.getCurrentPosition(onEvent, onEventError, options); diff --git a/src/useHash.ts b/src/useHash.ts index 34d5dd75..3d67bcc4 100644 --- a/src/useHash.ts +++ b/src/useHash.ts @@ -1,27 +1,33 @@ -import { useState, useCallback } from "react" -import useLifecycles from "./useLifecycles" +import { useState, useCallback } from 'react'; +import useLifecycles from './useLifecycles'; /** * read and write url hash, response to url hash change */ export const useHash = () => { - const [hash, setHash] = useState(() => window.location.hash) + const [hash, setHash] = useState(() => window.location.hash); const onHashChange = useCallback(() => { - setHash(window.location.hash) - }, []) + setHash(window.location.hash); + }, []); - useLifecycles(() => { - window.addEventListener('hashchange', onHashChange) - }, () => { - window.removeEventListener('hashchange', onHashChange) - }) - - const _setHash = useCallback((newHash: string) => { - if (newHash !== hash) { - window.location.hash = newHash + useLifecycles( + () => { + window.addEventListener('hashchange', onHashChange); + }, + () => { + window.removeEventListener('hashchange', onHashChange); } - }, [hash]) + ); - return [hash, _setHash] as const -} \ No newline at end of file + const _setHash = useCallback( + (newHash: string) => { + if (newHash !== hash) { + window.location.hash = newHash; + } + }, + [hash] + ); + + return [hash, _setHash] as const; +}; diff --git a/src/useKey.ts b/src/useKey.ts index 8affdad0..650888ea 100644 --- a/src/useKey.ts +++ b/src/useKey.ts @@ -26,7 +26,7 @@ const useKey = (key: KeyFilter, fn: Handler = noop, opts: UseKeyOptions = {}, de const { event = 'keydown', target, options } = opts; const useMemoHandler = useMemo(() => { const predicate: KeyPredicate = createKeyPredicate(key); - const handler: Handler = handlerEvent => { + const handler: Handler = (handlerEvent) => { if (predicate(handlerEvent)) { return fn(handlerEvent); } diff --git a/src/useKeyPress.ts b/src/useKeyPress.ts index 54b8273a..2f48e0fb 100644 --- a/src/useKeyPress.ts +++ b/src/useKeyPress.ts @@ -3,8 +3,8 @@ import useKey, { KeyFilter } from './useKey'; const useKeyPress = (keyFilter: KeyFilter) => { const [state, set] = useState<[boolean, null | KeyboardEvent]>([false, null]); - useKey(keyFilter, event => set([true, event]), { event: 'keydown' }, [state]); - useKey(keyFilter, event => set([false, event]), { event: 'keyup' }, [state]); + useKey(keyFilter, (event) => set([true, event]), { event: 'keydown' }, [state]); + useKey(keyFilter, (event) => set([false, event]), { event: 'keyup' }, [state]); return state; }; diff --git a/src/useKeyboardJs.ts b/src/useKeyboardJs.ts index b1651ee7..bdf13564 100644 --- a/src/useKeyboardJs.ts +++ b/src/useKeyboardJs.ts @@ -6,7 +6,7 @@ const useKeyboardJs = (combination: string | string[]) => { const [keyboardJs, setKeyboardJs] = useState(null); useMount(() => { - import('keyboardjs').then(k => setKeyboardJs(k.default || k)); + import('keyboardjs').then((k) => setKeyboardJs(k.default || k)); }); useEffect(() => { @@ -14,8 +14,8 @@ const useKeyboardJs = (combination: string | string[]) => { return; } - const down = event => set([true, event]); - const up = event => set([false, event]); + const down = (event) => set([true, event]); + const up = (event) => set([false, event]); keyboardJs.bind(combination, down, up, true); return () => { diff --git a/src/useLatest.ts b/src/useLatest.ts index f7386758..cd4230d2 100644 --- a/src/useLatest.ts +++ b/src/useLatest.ts @@ -1,6 +1,6 @@ -import {useRef} from 'react'; +import { useRef } from 'react'; -const useLatest = (value: T): {readonly current: T} => { +const useLatest = (value: T): { readonly current: T } => { const ref = useRef(value); ref.current = value; return ref; diff --git a/src/useList.ts b/src/useList.ts index c6d94bfe..818020d6 100644 --- a/src/useList.ts +++ b/src/useList.ts @@ -99,17 +99,17 @@ function useList(initialList: InitialHookState = []): [T[], ListActions< }, update: (predicate: (a: T, b: T) => boolean, newItem: T) => { - actions.set((curr: T[]) => curr.map(item => (predicate(item, newItem) ? newItem : item))); + actions.set((curr: T[]) => curr.map((item) => (predicate(item, newItem) ? newItem : item))); }, updateFirst: (predicate: (a: T, b: T) => boolean, newItem: T) => { - const index = list.current.findIndex(item => predicate(item, newItem)); + const index = list.current.findIndex((item) => predicate(item, newItem)); index >= 0 && actions.updateAt(index, newItem); }, upsert: (predicate: (a: T, b: T) => boolean, newItem: T) => { - const index = list.current.findIndex(item => predicate(item, newItem)); + const index = list.current.findIndex((item) => predicate(item, newItem)); index >= 0 ? actions.updateAt(index, newItem) : actions.push(newItem); }, diff --git a/src/useLocalStorage.ts b/src/useLocalStorage.ts index 2044e3f6..062ad36a 100644 --- a/src/useLocalStorage.ts +++ b/src/useLocalStorage.ts @@ -26,7 +26,7 @@ const useLocalStorage = ( throw new Error('useLocalStorage key may not be falsy'); } - const deserializer = options ? (options.raw ? value => value : options.deserializer) : JSON.parse; + const deserializer = options ? (options.raw ? (value) => value : options.deserializer) : JSON.parse; const [state, setState] = useState(() => { try { @@ -48,7 +48,7 @@ const useLocalStorage = ( }); const set: Dispatch> = useCallback( - valOrFunc => { + (valOrFunc) => { try { const newState = typeof valOrFunc === 'function' ? (valOrFunc as Function)(state) : valOrFunc; if (typeof newState === 'undefined') return; diff --git a/src/useLocation.ts b/src/useLocation.ts index c593a1d1..2a62692f 100644 --- a/src/useLocation.ts +++ b/src/useLocation.ts @@ -2,10 +2,10 @@ import { useEffect, useState } from 'react'; import { isClient, off, on } from './util'; -const patchHistoryMethod = method => { +const patchHistoryMethod = (method) => { const original = history[method]; - history[method] = function(state) { + history[method] = function (state) { const result = original.apply(this, arguments); const event = new Event(method.toLowerCase()); diff --git a/src/useLockBodyScroll.ts b/src/useLockBodyScroll.ts index 60133297..f8fe9049 100644 --- a/src/useLockBodyScroll.ts +++ b/src/useLockBodyScroll.ts @@ -48,7 +48,7 @@ export default !doc : function useLockBody(locked: boolean = true, elementRef?: RefObject) { elementRef = elementRef || useRef(doc!.body); - const lock = body => { + const lock = (body) => { const bodyInfo = bodies.get(body); if (!bodyInfo) { bodies.set(body, { counter: 1, initialOverflow: body.style.overflow }); @@ -66,7 +66,7 @@ export default !doc } }; - const unlock = body => { + const unlock = (body) => { const bodyInfo = bodies.get(body); if (bodyInfo) { if (bodyInfo.counter === 1) { diff --git a/src/useMap.ts b/src/useMap.ts index 90f2fb01..f6021e40 100644 --- a/src/useMap.ts +++ b/src/useMap.ts @@ -18,7 +18,7 @@ const useMap = (initialMap: T = {} as T): [T, Actions const stableActions = useMemo>( () => ({ set: (key, entry) => { - set(prevMap => ({ + set((prevMap) => ({ ...prevMap, [key]: entry, })); @@ -26,8 +26,8 @@ const useMap = (initialMap: T = {} as T): [T, Actions setAll: (newMap: T) => { set(newMap); }, - remove: key => { - set(prevMap => { + remove: (key) => { + set((prevMap) => { const { [key]: omit, ...rest } = prevMap; return rest as T; }); @@ -38,7 +38,7 @@ const useMap = (initialMap: T = {} as T): [T, Actions ); const utils = { - get: useCallback(key => map[key], [map]), + get: useCallback((key) => map[key], [map]), ...stableActions, } as Actions; diff --git a/src/useMeasure.ts b/src/useMeasure.ts index 04e801d8..bdfc3415 100644 --- a/src/useMeasure.ts +++ b/src/useMeasure.ts @@ -26,7 +26,7 @@ const useMeasure = (): UseMeasureResult const observer = useMemo( () => - new (window as any).ResizeObserver(entries => { + new (window as any).ResizeObserver((entries) => { if (entries[0]) { const { x, y, width, height, top, left, bottom, right } = entries[0].contentRect; setRect({ x, y, width, height, top, left, bottom, right }); @@ -48,4 +48,4 @@ const useMeasure = (): UseMeasureResult const useMeasureMock: typeof useMeasure = () => [() => {}, defaultState]; -export default (isClient && !!(window as any).ResizeObserver) ? useMeasure : useMeasureMock; +export default isClient && !!(window as any).ResizeObserver ? useMeasure : useMeasureMock; diff --git a/src/useMeasureDirty.ts b/src/useMeasureDirty.ts index 2bc4a82e..b884220b 100644 --- a/src/useMeasureDirty.ts +++ b/src/useMeasureDirty.ts @@ -24,7 +24,7 @@ const useMeasureDirty = (ref: RefObject): ContentRect => { const [observer] = useState( () => - new ResizeObserver(entries => { + new ResizeObserver((entries) => { const entry = entries[0]; if (entry) { diff --git a/src/useMediaDevices.ts b/src/useMediaDevices.ts index d9601274..6a43542e 100644 --- a/src/useMediaDevices.ts +++ b/src/useMediaDevices.ts @@ -12,7 +12,7 @@ const useMediaDevices = () => { const onChange = () => { navigator.mediaDevices .enumerateDevices() - .then(devices => { + .then((devices) => { if (mounted) { setState({ devices: devices.map(({ deviceId, groupId, kind, label }) => ({ deviceId, groupId, kind, label })), diff --git a/src/useMotion.ts b/src/useMotion.ts index 29f1a1b1..e5bb836d 100644 --- a/src/useMotion.ts +++ b/src/useMotion.ts @@ -43,7 +43,7 @@ const useMotion = (initialState: MotionSensorState = defaultState) => { const [state, setState] = useState(initialState); useEffect(() => { - const handler = event => { + const handler = (event) => { const { acceleration, accelerationIncludingGravity, rotationRate, interval } = event; setState({ diff --git a/src/useMouseWheel.ts b/src/useMouseWheel.ts index f8793e05..7159e4ad 100644 --- a/src/useMouseWheel.ts +++ b/src/useMouseWheel.ts @@ -1,14 +1,13 @@ -import {useEffect, useState} from 'react' +import { useEffect, useState } from 'react'; export default () => { - const [mouseWheelScrolled, setMouseWheelScrolled] = useState(0) - useEffect(()=>{ - const updateScroll = (e : MouseWheelEvent) => { - setMouseWheelScrolled(e.deltaY + mouseWheelScrolled) - } - window.addEventListener('wheel', updateScroll, false) - return () => window.removeEventListener('wheel', updateScroll) - }) - return mouseWheelScrolled -} - + const [mouseWheelScrolled, setMouseWheelScrolled] = useState(0); + useEffect(() => { + const updateScroll = (e: MouseWheelEvent) => { + setMouseWheelScrolled(e.deltaY + mouseWheelScrolled); + }; + window.addEventListener('wheel', updateScroll, false); + return () => window.removeEventListener('wheel', updateScroll); + }); + return mouseWheelScrolled; +}; diff --git a/src/useNetwork.ts b/src/useNetwork.ts index 4a66a205..5693f1e8 100644 --- a/src/useNetwork.ts +++ b/src/useNetwork.ts @@ -40,7 +40,7 @@ const useNetwork = (initialState: NetworkState = {}) => { useEffect(() => { let localState = state; - const localSetState = patch => { + const localSetState = (patch) => { localState = { ...localState, ...patch }; setState(localState); }; diff --git a/src/usePageLeave.ts b/src/usePageLeave.ts index 948b3204..c2f921d1 100644 --- a/src/usePageLeave.ts +++ b/src/usePageLeave.ts @@ -7,7 +7,7 @@ const usePageLeave = (onPageLeave, args = []) => { return; } - const handler = event => { + const handler = (event) => { event = event ? event : (window.event as any); const from = event.relatedTarget || event.toElement; if (!from || (from as any).nodeName === 'HTML') { diff --git a/src/usePermission.ts b/src/usePermission.ts index 86e99ca7..7ddd3110 100644 --- a/src/usePermission.ts +++ b/src/usePermission.ts @@ -32,7 +32,7 @@ const usePermission = (permissionDesc: PermissionDesc): State => { useEffect(() => { navigator.permissions .query(permissionDesc) - .then(status => { + .then((status) => { permissionStatus = status; changeState(); }) diff --git a/src/usePrevious.ts b/src/usePrevious.ts index 89d194c4..a5233144 100644 --- a/src/usePrevious.ts +++ b/src/usePrevious.ts @@ -4,7 +4,7 @@ export default function usePrevious(state: T): T | undefined { const ref = useRef(); useEffect(() => { - ref.current = state + ref.current = state; }); return ref.current; diff --git a/src/usePromise.ts b/src/usePromise.ts index d1aa5c56..1a3ebdc2 100644 --- a/src/usePromise.ts +++ b/src/usePromise.ts @@ -9,10 +9,10 @@ const usePromise: UsePromise = () => { return useCallback( (promise: Promise) => new Promise((resolve, reject) => { - const onValue = value => { + const onValue = (value) => { isMounted() && resolve(value); }; - const onError = error => { + const onError = (error) => { isMounted() && reject(error); }; promise.then(onValue, onError); diff --git a/src/useQueue.ts b/src/useQueue.ts index 97a8372d..e0299aef 100644 --- a/src/useQueue.ts +++ b/src/useQueue.ts @@ -11,8 +11,8 @@ export interface QueueMethods { const useQueue = (initialValue: T[] = []): QueueMethods => { const [state, set] = useState(initialValue); return { - add: value => { - set(queue => [...queue, value]); + add: (value) => { + set((queue) => [...queue, value]); }, remove: () => { let result; diff --git a/src/useRafLoop.ts b/src/useRafLoop.ts index 444d4ee1..5f5b667c 100644 --- a/src/useRafLoop.ts +++ b/src/useRafLoop.ts @@ -15,22 +15,28 @@ export default function useRafLoop(callback: FrameRequestCallback, initiallyActi } }, []); - const result = useMemo(() => ([ - () => { // stop - if (rafActivity.current) { - rafActivity.current = false; - raf.current && cancelAnimationFrame(raf.current); - } - }, - () => { // start - if (!rafActivity.current) { - rafActivity.current = true; - raf.current = requestAnimationFrame(step); - } - }, - (): boolean => rafActivity.current // isActive - // eslint-disable-next-line react-hooks/exhaustive-deps - ] as RafLoopReturns), []); + const result = useMemo( + () => + [ + () => { + // stop + if (rafActivity.current) { + rafActivity.current = false; + raf.current && cancelAnimationFrame(raf.current); + } + }, + () => { + // start + if (!rafActivity.current) { + rafActivity.current = true; + raf.current = requestAnimationFrame(step); + } + }, + (): boolean => rafActivity.current, // isActive + // eslint-disable-next-line react-hooks/exhaustive-deps + ] as RafLoopReturns, + [] + ); useEffect(() => { if (initiallyActive) { diff --git a/src/useScratch.ts b/src/useScratch.ts index 6703d348..f88a15cc 100644 --- a/src/useScratch.ts +++ b/src/useScratch.ts @@ -30,7 +30,7 @@ export interface ScratchSensorState { } const useScratch = (params: ScratchSensorParams = {}): [(el: HTMLElement | null) => void, ScratchSensorState] => { - const {disabled} = params; + const { disabled } = params; const paramsRef = useLatest(params); const [state, setState] = useState({ isScratching: false }); const refState = useRef(state); @@ -49,7 +49,7 @@ const useScratch = (params: ScratchSensorParams = {}): [(el: HTMLElement | null) const elY = top + window.scrollY; const x = docX - elX; const y = docY - elY; - setState(oldState => { + setState((oldState) => { const newState = { ...oldState, dx: x - (oldState.x || 0), @@ -64,11 +64,11 @@ const useScratch = (params: ScratchSensorParams = {}): [(el: HTMLElement | null) }); }; - const onMouseMove = event => { + const onMouseMove = (event) => { onMoveEvent(event.pageX, event.pageY); }; - const onTouchMove = event => { + const onTouchMove = (event) => { onMoveEvent(event.changedTouches[0].pageX, event.changedTouches[0].pageY); }; @@ -122,12 +122,12 @@ const useScratch = (params: ScratchSensorParams = {}): [(el: HTMLElement | null) window.addEventListener('touchend', onTouchEnd); }; - const onMouseDown = event => { + const onMouseDown = (event) => { refScratching.current = true; startScratching(event.pageX, event.pageY); }; - const onTouchStart = event => { + const onTouchStart = (event) => { refScratching.current = true; startScratching(event.changedTouches[0].pageX, event.changedTouches[0].pageY); }; @@ -159,13 +159,13 @@ export interface ScratchSensorProps extends ScratchSensorParams { children: (state: ScratchSensorState, ref: (el: HTMLElement | null) => void) => React.ReactElement; } -export const ScratchSensor: FC = props => { +export const ScratchSensor: FC = (props) => { const { children, ...params } = props; const [ref, state] = useScratch(params); const element = render(props, state); return cloneElement(element, { ...element.props, - ref: el => { + ref: (el) => { if (element.props.ref) { if (typeof element.props.ref === 'object') element.props.ref.current = el; if (typeof element.props.ref === 'function') element.props.ref(el); diff --git a/src/useSearchParam.ts b/src/useSearchParam.ts index eae57813..4f893c37 100644 --- a/src/useSearchParam.ts +++ b/src/useSearchParam.ts @@ -5,7 +5,7 @@ const getValue = (search: string, param: string) => new URLSearchParams(search). export type UseQueryParam = (param: string) => string | null; -const useSearchParam: UseQueryParam = param => { +const useSearchParam: UseQueryParam = (param) => { const [value, setValue] = useState(() => getValue(location.search, param)); useEffect(() => { diff --git a/src/useSet.ts b/src/useSet.ts index 4ceca005..1cd87cad 100644 --- a/src/useSet.ts +++ b/src/useSet.ts @@ -16,12 +16,12 @@ const useSet = (initialSet = new Set()): [Set, Actions] => { const [set, setSet] = useState(initialSet); const stableActions = useMemo>(() => { - const add = (item: K) => setSet(prevSet => new Set([...Array.from(prevSet), item])); - const remove = (item: K) => setSet(prevSet => new Set(Array.from(prevSet).filter(i => i !== item))); + const add = (item: K) => setSet((prevSet) => new Set([...Array.from(prevSet), item])); + const remove = (item: K) => setSet((prevSet) => new Set(Array.from(prevSet).filter((i) => i !== item))); const toggle = (item: K) => - setSet(prevSet => + setSet((prevSet) => prevSet.has(item) - ? new Set(Array.from(prevSet).filter(i => i !== item)) + ? new Set(Array.from(prevSet).filter((i) => i !== item)) : new Set([...Array.from(prevSet), item]) ); @@ -29,7 +29,7 @@ const useSet = (initialSet = new Set()): [Set, Actions] => { }, [setSet]); const utils = { - has: useCallback(item => set.has(item), [set]), + has: useCallback((item) => set.has(item), [set]), ...stableActions, } as Actions; diff --git a/src/useSetState.ts b/src/useSetState.ts index 41b88e6a..d589f46a 100644 --- a/src/useSetState.ts +++ b/src/useSetState.ts @@ -5,8 +5,8 @@ const useSetState = ( ): [T, (patch: Partial | ((prevState: T) => Partial)) => void] => { const [state, set] = useState(initialState); const setState = useCallback( - patch => { - set(prevState => Object.assign({}, prevState, patch instanceof Function ? patch(prevState) : patch)); + (patch) => { + set((prevState) => Object.assign({}, prevState, patch instanceof Function ? patch(prevState) : patch)); }, [set] ); diff --git a/src/useSpring.ts b/src/useSpring.ts index ddbb26f3..d08e727e 100644 --- a/src/useSpring.ts +++ b/src/useSpring.ts @@ -10,7 +10,7 @@ const useSpring = (targetValue: number = 0, tension: number = 50, friction: numb // listener fn will be different on each re-render and wouldn't unsubscribe properly. const listener = useMemo( () => ({ - onSpringUpdate: currentSpring => { + onSpringUpdate: (currentSpring) => { const newValue = currentSpring.getCurrentValue(); setValue(newValue); }, diff --git a/src/useStartTyping.ts b/src/useStartTyping.ts index 3669102f..c77834be 100644 --- a/src/useStartTyping.ts +++ b/src/useStartTyping.ts @@ -42,7 +42,7 @@ const isTypedCharGood = ({ keyCode, metaKey, ctrlKey, altKey }: KeyboardEvent) = const useStartTyping = (onStartTyping: (event: KeyboardEvent) => void) => { useIsomorphicLayoutEffect(() => { - const keydown = event => { + const keydown = (event) => { !isFocusedElementEditable() && isTypedCharGood(event) && onStartTyping(event); }; diff --git a/src/useStateWithHistory.ts b/src/useStateWithHistory.ts index 4dd029b8..fd25ace0 100644 --- a/src/useStateWithHistory.ts +++ b/src/useStateWithHistory.ts @@ -57,7 +57,7 @@ export function useStateWithHistory( const setState = useCallback( (newState: ResolvableHookState): void => { - innerSetState(currentState => { + innerSetState((currentState) => { newState = resolveHookState(newState); // is state has changed diff --git a/src/useUnmountPromise.ts b/src/useUnmountPromise.ts index 3c3d3801..cb561a2d 100644 --- a/src/useUnmountPromise.ts +++ b/src/useUnmountPromise.ts @@ -12,10 +12,10 @@ const useUnmountPromise = (): Race => { const race =

, E>(promise: P, onError?: (error: E) => void) => { const newPromise: P = new Promise((resolve, reject) => { promise.then( - result => { + (result) => { if (!refUnmounted.current) resolve(result); }, - error => { + (error) => { if (!refUnmounted.current) reject(error); else if (onError) onError(error); else console.error('useUnmountPromise', error); diff --git a/src/util/createHTMLMediaHook.ts b/src/util/createHTMLMediaHook.ts index b72ea1f8..43ef3e70 100644 --- a/src/util/createHTMLMediaHook.ts +++ b/src/util/createHTMLMediaHook.ts @@ -51,7 +51,7 @@ const createHTMLMediaHook = (tag: 'audio' | 'video') => { const ref = useRef(null); const wrapEvent = (userEvent, proxyEvent?) => { - return event => { + return (event) => { try { proxyEvent && proxyEvent(event); } finally { diff --git a/src/util/createRenderProp.ts b/src/util/createRenderProp.ts index 8a6fb6f1..31767a7e 100644 --- a/src/util/createRenderProp.ts +++ b/src/util/createRenderProp.ts @@ -1,7 +1,7 @@ -const defaultMapPropsToArgs = props => [props]; +const defaultMapPropsToArgs = (props) => [props]; const createRenderProp = (hook, mapPropsToArgs = defaultMapPropsToArgs) => { - const RenderProp = props => { + const RenderProp = (props) => { const state = hook(...mapPropsToArgs(props)); const { children, render = children } = props; return render ? render(state) || null : null; diff --git a/src/util/parseTimeRanges.ts b/src/util/parseTimeRanges.ts index 1348024c..873a2d02 100644 --- a/src/util/parseTimeRanges.ts +++ b/src/util/parseTimeRanges.ts @@ -1,4 +1,4 @@ -const parseTimeRanges = ranges => { +const parseTimeRanges = (ranges) => { const result: { start: number; end: number }[] = []; for (let i = 0; i < ranges.length; i++) {