esm

Author: jquense

package.json

@@ -1,6 +1,7 @@
 {
   "name": "@restart/hooks",
   "version": "0.5.1",
+  "type": "module",
   "exports": {
     ".": {
       "types": "./esm/index.d.ts",
@@ -31,9 +32,9 @@
     "test": "jest --coverage",
     "tdd": "jest --watch",
     "build": "rimraf lib cjs && concurrently --names 'esm,cjs' 'yarn build:esm' 'yarn build:cjs' && concurrently --names 'esm types,cjs types' 'yarn build:esm:types' 'yarn build:cjs:types'",
-    "build:esm": "babel src --env-name esm --out-dir lib --extensions '.ts,.tsx' --ignore='**/*.d.ts'",
+    "build:esm": "babel src --env-name esm --out-dir lib --extensions '.ts' --ignore='**/*.d.ts'",
     "build:esm:types": "tsc -p . --emitDeclarationOnly --declaration --outDir lib",
-    "build:cjs": "babel src --out-dir cjs --extensions '.ts,.tsx'  --ignore='**/*.d.ts'",
+    "build:cjs": "babel src --out-dir cjs --extensions '.ts'  --ignore='**/*.d.ts' && echo '{\"type\": \"commonjs\"}' > cjs/package.json",
     "build:cjs:types": "tsc -p . --emitDeclarationOnly --declaration --outDir cjs --module commonjs --moduleResolution node",
     "deploy-docs": "yarn --cwd www build --prefix-paths && gh-pages -d www/public",
     "prepublishOnly": "yarn build",

src/useAnimationFrame.ts

@@ -1,5 +1,5 @@
 import { useEffect, useState } from 'react'
-import useMounted from './useMounted'
+import useMounted from './useMounted.js'
 
 export interface UseAnimationFrameReturn {
   cancel(): void

src/useBreakpoint.ts

@@ -1,4 +1,4 @@
-import useMediaQuery from './useMediaQuery'
+import useMediaQuery from './useMediaQuery.js'
 import { useMemo } from 'react'
 
 export type BreakpointDirection = 'up' | 'down' | true

src/useCustomEffect.ts

@@ -5,7 +5,7 @@ import {
   useEffect,
   useDebugValue,
 } from 'react'
-import useMounted from './useMounted'
+import useMounted from './useMounted.js'
 
 export type EffectHook = (effect: EffectCallback, deps?: DependencyList) => void
 

src/useDebouncedCallback.ts

@@ -1,6 +1,6 @@
 import { useMemo, useRef } from 'react'
-import useTimeout from './useTimeout'
-import useEventCallback from './useEventCallback'
+import useTimeout from './useTimeout.js'
+import useEventCallback from './useEventCallback.js'
 
 export interface UseDebouncedCallbackOptions {
   wait: number

src/useDebouncedState.ts

@@ -1,7 +1,7 @@
 import { useState, Dispatch, SetStateAction } from 'react'
 import useDebouncedCallback, {
   UseDebouncedCallbackOptions,
-} from './useDebouncedCallback'
+} from './useDebouncedCallback.js'
 
 /**
  * Similar to `useState`, except the setter function is debounced by

src/useDebouncedValue.ts

@@ -1,6 +1,6 @@
 import { useEffect, useDebugValue, useRef } from 'react'
-import useDebouncedState from './useDebouncedState'
-import { UseDebouncedCallbackOptions } from './useDebouncedCallback'
+import useDebouncedState from './useDebouncedState.js'
+import { UseDebouncedCallbackOptions } from './useDebouncedCallback.js'
 
 const defaultIsEqual = (a: any, b: any) => a === b
 

src/useEventCallback.ts

@@ -1,12 +1,12 @@
 import { useEffect, useCallback, useRef } from 'react'
-import useCommittedRef from './useCommittedRef'
+import useCommittedRef from './useCommittedRef.js'
 
 export default function useEventCallback<
-  TCallback extends (...args: any[]) => any
+  TCallback extends (...args: any[]) => any,
 >(fn?: TCallback | null): TCallback {
   const ref = useCommittedRef(fn)
   return useCallback(
-    function(...args: any[]) {
+    function (...args: any[]) {
       return ref.current && ref.current(...args)
     },
     [ref],

src/useEventListener.ts

@@ -1,6 +1,6 @@
 import { useEffect } from 'react'
 
-import useEventCallback from './useEventCallback'
+import useEventCallback from './useEventCallback.js'
 
 type EventHandler<T, K extends keyof DocumentEventMap> = (
   this: T,

src/useFocusManager.ts

@@ -1,6 +1,6 @@
 import { useCallback, useMemo, useRef } from 'react'
-import useEventCallback from './useEventCallback'
-import useMounted from './useMounted'
+import useEventCallback from './useEventCallback.js'
+import useMounted from './useMounted.js'
 
 export interface FocusManagerOptions {
   /**
@@ -59,8 +59,8 @@ export default function useFocusManager(
 ): FocusController {
   const isMounted = useMounted()
 
-  const lastFocused = useRef<boolean | undefined>()
-  const handle = useRef<number | undefined>()
+  const lastFocused = useRef<boolean | undefined>(undefined)
+  const handle = useRef<number | undefined>(undefined)
 
   const willHandle = useEventCallback(opts.willHandle)
   const didHandle = useEventCallback(opts.didHandle)