@tamagui/use-debounce 1.0.0-alpha.4

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2020 Nate Wienert
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/index.cjs

@@ -0,0 +1,91 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __markAsModule = (target) => __defProp(target, "__esModule", { value: true });
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __export = (target, all) => {
+  __markAsModule(target);
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __reExport = (target, module2, desc) => {
+  if (module2 && typeof module2 === "object" || typeof module2 === "function") {
+    for (let key of __getOwnPropNames(module2))
+      if (!__hasOwnProp.call(target, key) && key !== "default")
+        __defProp(target, key, { get: () => module2[key], enumerable: !(desc = __getOwnPropDesc(module2, key)) || desc.enumerable });
+  }
+  return target;
+};
+var __toModule = (module2) => {
+  return __reExport(__markAsModule(__defProp(module2 != null ? __create(__getProtoOf(module2)) : {}, "default", module2 && module2.__esModule && "default" in module2 ? { get: () => module2.default, enumerable: true } : { value: module2, enumerable: true })), module2);
+};
+
+// src/index.ts
+__export(exports, {
+  debounce: () => debounce,
+  useDebounce: () => useDebounce,
+  useDebounceValue: () => useDebounceValue
+});
+var import_react = __toModule(require("react"));
+function debounce(func, wait, leading) {
+  let timeout;
+  let isCancelled;
+  function debounced() {
+    isCancelled = false;
+    let context = this;
+    let args = arguments;
+    if (leading && !timeout) {
+      func.apply(context, args);
+    }
+    clearTimeout(timeout);
+    timeout = setTimeout(function() {
+      timeout = null;
+      if (!leading && !isCancelled) {
+        func.apply(context, args);
+      }
+      isCancelled = false;
+    }, wait);
+  }
+  __name(debounced, "debounced");
+  debounced.cancel = () => {
+    isCancelled = true;
+  };
+  return debounced;
+}
+__name(debounce, "debounce");
+var defaultOpts = { leading: false };
+function useDebounce(fn, wait, options = defaultOpts, mountArgs = []) {
+  const dbEffect = (0, import_react.useRef)(null);
+  (0, import_react.useEffect)(() => {
+    return () => {
+      var _a;
+      (_a = dbEffect.current) == null ? void 0 : _a.cancel();
+    };
+  }, []);
+  return (0, import_react.useMemo)(() => {
+    dbEffect.current = debounce(fn, wait, options.leading);
+    return dbEffect.current;
+  }, [options.leading, ...mountArgs]);
+}
+__name(useDebounce, "useDebounce");
+function useDebounceValue(val, amt = 0) {
+  const [state, setState] = (0, import_react.useState)(val);
+  (0, import_react.useEffect)(() => {
+    let tm = setTimeout(() => {
+      setState((prev) => {
+        if (prev === val)
+          return prev;
+        return val;
+      });
+    }, amt);
+    return () => {
+      clearTimeout(tm);
+    };
+  }, [val]);
+  return state;
+}
+__name(useDebounceValue, "useDebounceValue");
+//# sourceMappingURL=index.cjs.map

package/dist/index.cjs.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/index.ts"],
+  "sourcesContent": ["import { useEffect, useMemo, useRef, useState } from 'react'\n\ntype DebounceSettings = {\n  leading?: boolean\n}\n\nexport function debounce<A extends Function>(\n  func: A,\n  wait?: number,\n  leading?: boolean\n): A & {\n  cancel: Function\n} {\n  let timeout: any\n  let isCancelled\n  function debounced(this: any) {\n    isCancelled = false\n    let context = this\n    let args = arguments\n    if (leading && !timeout) {\n      func.apply(context, args)\n    }\n    clearTimeout(timeout)\n    timeout = setTimeout(function () {\n      timeout = null\n      if (!leading && !isCancelled) {\n        func.apply(context, args)\n      }\n      isCancelled = false\n    }, wait)\n  }\n  debounced.cancel = () => {\n    isCancelled = true\n  }\n  return debounced as any\n}\n\nconst defaultOpts = { leading: false }\n\nexport function useDebounce<\n  A extends (...args: any) => any | undefined | null,\n  DebouncedFn extends A & {\n    cancel: () => void\n  }\n>(\n  fn: A,\n  wait: number,\n  options: DebounceSettings = defaultOpts,\n  mountArgs: any[] = []\n): DebouncedFn {\n  const dbEffect = useRef<DebouncedFn | null>(null)\n\n  useEffect(() => {\n    return () => {\n      dbEffect.current?.cancel()\n    }\n  }, [])\n\n  return useMemo(() => {\n    dbEffect.current = debounce(fn, wait, options.leading) as unknown as DebouncedFn\n    return dbEffect.current\n  }, [options.leading, ...mountArgs])\n}\n\n/**\n * Returns a value once it stops changing after \"amt\" time.\n * Note: you may need to memo or this will keep re-rendering\n */\nexport function useDebounceValue<A>(val: A, amt = 0): A {\n  const [state, setState] = useState(val)\n\n  useEffect(() => {\n    let tm = setTimeout(() => {\n      setState((prev) => {\n        if (prev === val) return prev\n        return val\n      })\n    }, amt)\n\n    return () => {\n      clearTimeout(tm)\n    }\n  }, [val])\n\n  return state\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAqD;AAM9C,kBACL,MACA,MACA,SAGA;AACA,MAAI;AACJ,MAAI;AACJ,uBAA8B;AAC5B,kBAAc;AACd,QAAI,UAAU;AACd,QAAI,OAAO;AACX,QAAI,WAAW,CAAC,SAAS;AACvB,WAAK,MAAM,SAAS;AAAA;AAEtB,iBAAa;AACb,cAAU,WAAW,WAAY;AAC/B,gBAAU;AACV,UAAI,CAAC,WAAW,CAAC,aAAa;AAC5B,aAAK,MAAM,SAAS;AAAA;AAEtB,oBAAc;AAAA,OACb;AAAA;AAdI;AAgBT,YAAU,SAAS,MAAM;AACvB,kBAAc;AAAA;AAEhB,SAAO;AAAA;AA5BO;AA+BhB,IAAM,cAAc,EAAE,SAAS;AAExB,qBAML,IACA,MACA,UAA4B,aAC5B,YAAmB,IACN;AACb,QAAM,WAAW,yBAA2B;AAE5C,8BAAU,MAAM;AACd,WAAO,MAAM;AArDjB;AAsDM,qBAAS,YAAT,mBAAkB;AAAA;AAAA,KAEnB;AAEH,SAAO,0BAAQ,MAAM;AACnB,aAAS,UAAU,SAAS,IAAI,MAAM,QAAQ;AAC9C,WAAO,SAAS;AAAA,KACf,CAAC,QAAQ,SAAS,GAAG;AAAA;AAtBV;AA6BT,0BAA6B,KAAQ,MAAM,GAAM;AACtD,QAAM,CAAC,OAAO,YAAY,2BAAS;AAEnC,8BAAU,MAAM;AACd,QAAI,KAAK,WAAW,MAAM;AACxB,eAAS,CAAC,SAAS;AACjB,YAAI,SAAS;AAAK,iBAAO;AACzB,eAAO;AAAA;AAAA,OAER;AAEH,WAAO,MAAM;AACX,mBAAa;AAAA;AAAA,KAEd,CAAC;AAEJ,SAAO;AAAA;AAhBO;",
+  "names": []
+}

package/dist/index.js

@@ -0,0 +1,66 @@
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+import { useEffect, useMemo, useRef, useState } from "react";
+function debounce(func, wait, leading) {
+  let timeout;
+  let isCancelled;
+  function debounced() {
+    isCancelled = false;
+    let context = this;
+    let args = arguments;
+    if (leading && !timeout) {
+      func.apply(context, args);
+    }
+    clearTimeout(timeout);
+    timeout = setTimeout(function() {
+      timeout = null;
+      if (!leading && !isCancelled) {
+        func.apply(context, args);
+      }
+      isCancelled = false;
+    }, wait);
+  }
+  __name(debounced, "debounced");
+  debounced.cancel = () => {
+    isCancelled = true;
+  };
+  return debounced;
+}
+__name(debounce, "debounce");
+const defaultOpts = { leading: false };
+function useDebounce(fn, wait, options = defaultOpts, mountArgs = []) {
+  const dbEffect = useRef(null);
+  useEffect(() => {
+    return () => {
+      dbEffect.current?.cancel();
+    };
+  }, []);
+  return useMemo(() => {
+    dbEffect.current = debounce(fn, wait, options.leading);
+    return dbEffect.current;
+  }, [options.leading, ...mountArgs]);
+}
+__name(useDebounce, "useDebounce");
+function useDebounceValue(val, amt = 0) {
+  const [state, setState] = useState(val);
+  useEffect(() => {
+    let tm = setTimeout(() => {
+      setState((prev) => {
+        if (prev === val)
+          return prev;
+        return val;
+      });
+    }, amt);
+    return () => {
+      clearTimeout(tm);
+    };
+  }, [val]);
+  return state;
+}
+__name(useDebounceValue, "useDebounceValue");
+export {
+  debounce,
+  useDebounce,
+  useDebounceValue
+};
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../src/index.ts"],
+  "sourcesContent": ["import { useEffect, useMemo, useRef, useState } from 'react'\n\ntype DebounceSettings = {\n  leading?: boolean\n}\n\nexport function debounce<A extends Function>(\n  func: A,\n  wait?: number,\n  leading?: boolean\n): A & {\n  cancel: Function\n} {\n  let timeout: any\n  let isCancelled\n  function debounced(this: any) {\n    isCancelled = false\n    let context = this\n    let args = arguments\n    if (leading && !timeout) {\n      func.apply(context, args)\n    }\n    clearTimeout(timeout)\n    timeout = setTimeout(function () {\n      timeout = null\n      if (!leading && !isCancelled) {\n        func.apply(context, args)\n      }\n      isCancelled = false\n    }, wait)\n  }\n  debounced.cancel = () => {\n    isCancelled = true\n  }\n  return debounced as any\n}\n\nconst defaultOpts = { leading: false }\n\nexport function useDebounce<\n  A extends (...args: any) => any | undefined | null,\n  DebouncedFn extends A & {\n    cancel: () => void\n  }\n>(\n  fn: A,\n  wait: number,\n  options: DebounceSettings = defaultOpts,\n  mountArgs: any[] = []\n): DebouncedFn {\n  const dbEffect = useRef<DebouncedFn | null>(null)\n\n  useEffect(() => {\n    return () => {\n      dbEffect.current?.cancel()\n    }\n  }, [])\n\n  return useMemo(() => {\n    dbEffect.current = debounce(fn, wait, options.leading) as unknown as DebouncedFn\n    return dbEffect.current\n  }, [options.leading, ...mountArgs])\n}\n\n/**\n * Returns a value once it stops changing after \"amt\" time.\n * Note: you may need to memo or this will keep re-rendering\n */\nexport function useDebounceValue<A>(val: A, amt = 0): A {\n  const [state, setState] = useState(val)\n\n  useEffect(() => {\n    let tm = setTimeout(() => {\n      setState((prev) => {\n        if (prev === val) return prev\n        return val\n      })\n    }, amt)\n\n    return () => {\n      clearTimeout(tm)\n    }\n  }, [val])\n\n  return state\n}\n"],
+  "mappings": ";;AAAA;AAMO,kBACL,MACA,MACA,SAGA;AACA,MAAI;AACJ,MAAI;AACJ,uBAA8B;AAC5B,kBAAc;AACd,QAAI,UAAU;AACd,QAAI,OAAO;AACX,QAAI,WAAW,CAAC,SAAS;AACvB,WAAK,MAAM,SAAS;AAAA;AAEtB,iBAAa;AACb,cAAU,WAAW,WAAY;AAC/B,gBAAU;AACV,UAAI,CAAC,WAAW,CAAC,aAAa;AAC5B,aAAK,MAAM,SAAS;AAAA;AAEtB,oBAAc;AAAA,OACb;AAAA;AAdI;AAgBT,YAAU,SAAS,MAAM;AACvB,kBAAc;AAAA;AAEhB,SAAO;AAAA;AA5BO;AA+BhB,MAAM,cAAc,EAAE,SAAS;AAExB,qBAML,IACA,MACA,UAA4B,aAC5B,YAAmB,IACN;AACb,QAAM,WAAW,OAA2B;AAE5C,YAAU,MAAM;AACd,WAAO,MAAM;AACX,eAAS,SAAS;AAAA;AAAA,KAEnB;AAEH,SAAO,QAAQ,MAAM;AACnB,aAAS,UAAU,SAAS,IAAI,MAAM,QAAQ;AAC9C,WAAO,SAAS;AAAA,KACf,CAAC,QAAQ,SAAS,GAAG;AAAA;AAtBV;AA6BT,0BAA6B,KAAQ,MAAM,GAAM;AACtD,QAAM,CAAC,OAAO,YAAY,SAAS;AAEnC,YAAU,MAAM;AACd,QAAI,KAAK,WAAW,MAAM;AACxB,eAAS,CAAC,SAAS;AACjB,YAAI,SAAS;AAAK,iBAAO;AACzB,eAAO;AAAA;AAAA,OAER;AAEH,WAAO,MAAM;AACX,mBAAa;AAAA;AAAA,KAEd,CAAC;AAEJ,SAAO;AAAA;AAhBO;",
+  "names": []
+}

package/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "@tamagui/use-debounce",
+  "version": "1.0.0-alpha.4",
+  "source": "src/index.ts",
+  "main": "dist/index.cjs",
+  "module": "dist/index.js",
+  "typings": "types.d.ts",
+  "files": [
+    "dist",
+    "src"
+  ],
+  "scripts": {
+    "build": "tamagui-build",
+    "watch": "tamagui-build --watch"
+  },
+  "devDependencies": {
+    "@tamagui/build": "^1.0.0-alpha.2"
+  },
+  "peerDependencies": {
+    "react": "*"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "gitHead": "3e3b5401f9daea70cf9a99782d325f58357ca681"
+}

package/src/index.ts

@@ -0,0 +1,89 @@
+import { useEffect, useMemo, useRef, useState } from 'react'
+
+type DebounceSettings = {
+  leading?: boolean
+}
+
+export function debounce<A extends Function>(
+  func: A,
+  wait?: number,
+  leading?: boolean
+): A & {
+  cancel: () => void
+} {
+  let timeout: any
+  let isCancelled = false
+
+  function debounced(this: any) {
+    isCancelled = false
+    let context = this
+    let args = arguments
+    if (leading && !timeout) {
+      func.apply(context, args)
+    }
+    clearTimeout(timeout)
+    timeout = setTimeout(function () {
+      timeout = null
+      if (!leading && !isCancelled) {
+        func.apply(context, args)
+      }
+      isCancelled = false
+    }, wait)
+  }
+
+  debounced.cancel = () => {
+    isCancelled = true
+  }
+
+  return debounced as any
+}
+
+const defaultOpts = { leading: false }
+
+export function useDebounce<
+  A extends (...args: any) => any | undefined | null,
+  DebouncedFn extends A & {
+    cancel: () => void
+  }
+>(
+  fn: A,
+  wait: number,
+  options: DebounceSettings = defaultOpts,
+  mountArgs: any[] = []
+): DebouncedFn {
+  const dbEffect = useRef<DebouncedFn | null>(null)
+
+  useEffect(() => {
+    return () => {
+      dbEffect.current?.cancel()
+    }
+  }, [])
+
+  return useMemo(() => {
+    dbEffect.current = debounce(fn, wait, options.leading) as unknown as DebouncedFn
+    return dbEffect.current
+  }, [options.leading, ...mountArgs])
+}
+
+/**
+ * Returns a value once it stops changing after "amt" time.
+ * Note: you may need to memo or this will keep re-rendering
+ */
+export function useDebounceValue<A>(val: A, amt = 0): A {
+  const [state, setState] = useState(val)
+
+  useEffect(() => {
+    let tm = setTimeout(() => {
+      setState((prev) => {
+        if (prev === val) return prev
+        return val
+      })
+    }, amt)
+
+    return () => {
+      clearTimeout(tm)
+    }
+  }, [val])
+
+  return state
+}