Add use-object

Author: exoRift

hooks/use-object.ts

@@ -0,0 +1,28 @@
+import { useMemo, useState } from 'react'
+
+/**
+ * Create an object state value that auto updates on mutation
+ * @param initial The initial object
+ * @returns       [object, setObject]
+ */
+export function useObject<T extends object> (initial: T): [object: T, setObject: React.Dispatch<React.SetStateAction<T>>] {
+  const [signal, setSignal] = useState(0)
+  const [object, setObject] = useState(initial)
+
+  const proxy = useMemo(() => new Proxy(object, {
+    set (target, prop, newValue) {
+      if (prop !== 'valueOf' && target[prop as keyof typeof target] !== newValue) setSignal((prior) => prior + 1)
+      target[prop as keyof typeof target] = newValue
+      return true
+    },
+
+    deleteProperty (target, prop) {
+      if (prop in target) setSignal((prior) => prior + 1)
+      delete target[prop as keyof typeof target]
+      return true
+    }
+  }), [object])
+
+  proxy.valueOf = () => signal
+  return [proxy, setObject]
+}

hooks/use-promise.ts

@@ -22,7 +22,7 @@ export type PromiseResult<T, P extends boolean, E = unknown> = {
  * @param persist Persist result values and error values into states that wouldn't normally have them
  * @returns       An object containing the state and settled values
  */
-export function useFetch<T, P extends boolean, E = unknown> (
+export function usePromise<T, P extends boolean, E = unknown> (
   fn: () => false | undefined | null | '' | ((signal?: AbortSignal) => Promise<T>),
   deps: React.DependencyList = [],
   persist?: P

index.ts

@@ -8,6 +8,15 @@ export {
   useSet
 } from './hooks/use-set'
 
+export {
+  type PromiseResult,
+  usePromise
+} from './hooks/use-promise'
+
+export {
+  useObject
+} from './hooks/use-object'
+
 export {
   useDebouncedState
 } from './hooks/use-debounced-state'

package.json

@@ -1,6 +1,7 @@
 {
   "name": "react-exo-hooks",
   "module": "index.ts",
+  "main": "dist/index.js",
   "devDependencies": {
     "@types/bun": "latest",
     "@types/next": "^9.0.0",

tsconfig.json

@@ -10,9 +10,11 @@
 
     // Bundler mode
     "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
+    // "allowImportingTsExtensions": true,
     "verbatimModuleSyntax": true,
-    "noEmit": true,
+    // "noEmit": true,
+    "declaration": true,
+    "outDir": "dist/",
 
     // Best practices
     "strict": true,