@stryke/hooks 0.1.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +201 -0
- package/README.md +62 -0
- package/dist/index.cjs +192 -0
- package/dist/index.d.ts +25 -0
- package/dist/index.mjs +1 -0
- package/dist/use-battery.cjs +46 -0
- package/dist/use-battery.d.ts +4 -0
- package/dist/use-battery.mjs +1 -0
- package/dist/use-callback-ref.cjs +13 -0
- package/dist/use-callback-ref.d.ts +5 -0
- package/dist/use-callback-ref.mjs +1 -0
- package/dist/use-callback-stable.cjs +10 -0
- package/dist/use-callback-stable.d.ts +19 -0
- package/dist/use-callback-stable.mjs +1 -0
- package/dist/use-click-away.cjs +22 -0
- package/dist/use-click-away.d.ts +7 -0
- package/dist/use-click-away.mjs +1 -0
- package/dist/use-compose-refs.cjs +21 -0
- package/dist/use-compose-refs.d.ts +25 -0
- package/dist/use-compose-refs.mjs +1 -0
- package/dist/use-copy-to-clipboard.cjs +25 -0
- package/dist/use-copy-to-clipboard.d.ts +6 -0
- package/dist/use-copy-to-clipboard.mjs +1 -0
- package/dist/use-debounce.cjs +26 -0
- package/dist/use-debounce.d.ts +9 -0
- package/dist/use-debounce.mjs +1 -0
- package/dist/use-did-finish-ssr.cjs +28 -0
- package/dist/use-did-finish-ssr.d.ts +7 -0
- package/dist/use-did-finish-ssr.mjs +1 -0
- package/dist/use-escape-keydown.cjs +19 -0
- package/dist/use-escape-keydown.d.ts +4 -0
- package/dist/use-escape-keydown.mjs +1 -0
- package/dist/use-event.cjs +20 -0
- package/dist/use-event.d.ts +9 -0
- package/dist/use-event.mjs +1 -0
- package/dist/use-hover.cjs +21 -0
- package/dist/use-hover.d.ts +6 -0
- package/dist/use-hover.mjs +1 -0
- package/dist/use-idle.cjs +27 -0
- package/dist/use-idle.d.ts +7 -0
- package/dist/use-idle.mjs +1 -0
- package/dist/use-isomorphic-layout-effect.cjs +9 -0
- package/dist/use-isomorphic-layout-effect.d.ts +7 -0
- package/dist/use-isomorphic-layout-effect.mjs +1 -0
- package/dist/use-keyboard-visible.cjs +23 -0
- package/dist/use-keyboard-visible.d.ts +1 -0
- package/dist/use-keyboard-visible.mjs +1 -0
- package/dist/use-memo-stable.cjs +28 -0
- package/dist/use-memo-stable.d.ts +15 -0
- package/dist/use-memo-stable.mjs +1 -0
- package/dist/use-network-state.cjs +44 -0
- package/dist/use-network-state.d.ts +13 -0
- package/dist/use-network-state.mjs +1 -0
- package/dist/use-previous.cjs +14 -0
- package/dist/use-previous.d.ts +1 -0
- package/dist/use-previous.mjs +1 -0
- package/package.json +338 -0
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { type Ref } from "react";
|
|
2
|
+
/**
|
|
3
|
+
* Set a given ref to a given value
|
|
4
|
+
* This utility takes care of different types of refs: callback refs and RefObject(s)
|
|
5
|
+
*
|
|
6
|
+
* @param ref - The ref to set
|
|
7
|
+
* @param value - The value to set the ref to
|
|
8
|
+
*/
|
|
9
|
+
export declare function setRef<T>(ref: Ref<T> | undefined, value: T): void;
|
|
10
|
+
/**
|
|
11
|
+
* A utility to compose multiple refs together
|
|
12
|
+
* Accepts callback refs and RefObject(s)
|
|
13
|
+
*
|
|
14
|
+
* @param refs - The refs to compose
|
|
15
|
+
* @returns A function that sets all refs to a given value
|
|
16
|
+
*/
|
|
17
|
+
export declare function composeRefs<T>(...refs: Ref<T>[]): (node: T) => void;
|
|
18
|
+
/**
|
|
19
|
+
* A custom hook that composes multiple refs
|
|
20
|
+
* Accepts callback refs and RefObject(s)
|
|
21
|
+
*
|
|
22
|
+
* @param refs - The refs to compose
|
|
23
|
+
* @returns A function that sets all refs to a given value
|
|
24
|
+
*/
|
|
25
|
+
export declare function useComposedRefs<T>(...refs: Ref<T>[]): (node: T) => void;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{isFunction as f}from"@stryke/types/type-checks/is-function";import{useCallback as n}from"react";export function setRef(e,o){e&&(f(e)?e(o):e.current=o)}export function composeRefs(...e){return o=>{for(const t of e)setRef(t,o)}}export function useComposedRefs(...e){return n(composeRefs(...e),e)}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useCopyToClipboard = useCopyToClipboard;
|
|
7
|
+
var _base = require("@stryke/types/utility-types/base");
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
function i(r) {
|
|
10
|
+
const t = document.createElement("textarea");
|
|
11
|
+
t.value = r, document.body.append(t), t.select(), document.execCommand("copy"), t.remove();
|
|
12
|
+
}
|
|
13
|
+
function useCopyToClipboard() {
|
|
14
|
+
const [r, t] = (0, _react.useState)(null),
|
|
15
|
+
n = (0, _react.useCallback)(e => {
|
|
16
|
+
(async () => {
|
|
17
|
+
try {
|
|
18
|
+
if (navigator?.clipboard?.writeText) await navigator.clipboard.writeText(e ?? _base.EMPTY_STRING), t(e ?? _base.EMPTY_STRING);else throw new Error("writeText not supported");
|
|
19
|
+
} catch {
|
|
20
|
+
i(e ?? _base.EMPTY_STRING), t(e ?? _base.EMPTY_STRING);
|
|
21
|
+
}
|
|
22
|
+
})();
|
|
23
|
+
}, []);
|
|
24
|
+
return [r, n];
|
|
25
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{EMPTY_STRING as o}from"@stryke/types/utility-types/base";import{useCallback as a,useState as c}from"react";function i(r){const t=document.createElement("textarea");t.value=r,document.body.append(t),t.select(),document.execCommand("copy"),t.remove()}export function useCopyToClipboard(){const[r,t]=c(null),n=a(e=>{(async()=>{try{if(navigator?.clipboard?.writeText)await navigator.clipboard.writeText(e??o),t(e??o);else throw new Error("writeText not supported")}catch{i(e??o),t(e??o)}})()},[]);return[r,n]}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useDebounce = useDebounce;
|
|
7
|
+
exports.useDebounceValue = useDebounceValue;
|
|
8
|
+
var _debounce = require("@stryke/helpers/debounce");
|
|
9
|
+
var _react = require("react");
|
|
10
|
+
function useDebounce(e, n, u = {}, r = [e, u, n]) {
|
|
11
|
+
const t = (0, _react.useRef)(null);
|
|
12
|
+
return (0, _react.useEffect)(() => () => {
|
|
13
|
+
t.current?.cancel();
|
|
14
|
+
}, []), (0, _react.useMemo)(() => (t.current = (0, _debounce.debounce)(e, n, u), t.current), [e, u, n]);
|
|
15
|
+
}
|
|
16
|
+
function useDebounceValue(e, n = 0) {
|
|
17
|
+
const [u, r] = (0, _react.useState)(e);
|
|
18
|
+
return (0, _react.useEffect)(() => {
|
|
19
|
+
const t = setTimeout(() => {
|
|
20
|
+
r(c => c === e ? c : e);
|
|
21
|
+
}, n);
|
|
22
|
+
return () => {
|
|
23
|
+
clearTimeout(t);
|
|
24
|
+
};
|
|
25
|
+
}, [n, e]), u;
|
|
26
|
+
}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { DebounceOptions } from "@stryke/helpers/debounce";
|
|
2
|
+
export declare function useDebounce<A extends (...args: any) => any | undefined | null, DebouncedFn extends A & {
|
|
3
|
+
cancel: () => void;
|
|
4
|
+
}>(fn: A, wait: number, options?: DebounceOptions, mountArgs?: any[]): DebouncedFn;
|
|
5
|
+
/**
|
|
6
|
+
* Returns a value once it stops changing after "amt" time.
|
|
7
|
+
* Note: you may need to memo or this will keep re-rendering
|
|
8
|
+
*/
|
|
9
|
+
export declare function useDebounceValue<A>(val: A, amt?: number): A;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{debounce as s}from"@stryke/helpers/debounce";import{useEffect as o,useMemo as b,useRef as d,useState as f}from"react";export function useDebounce(e,n,u={},r=[e,u,n]){const t=d(null);return o(()=>()=>{t.current?.cancel()},[]),b(()=>(t.current=s(e,n,u),t.current),[e,u,n])}export function useDebounceValue(e,n=0){const[u,r]=f(e);return o(()=>{const t=setTimeout(()=>{r(c=>c===e?c:e)},n);return()=>{clearTimeout(t)}},[n,e]),u}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useClientValue = useClientValue;
|
|
7
|
+
exports.useDidFinishSSR = useDidFinishSSR;
|
|
8
|
+
exports.useDidFinishSSRSync = useDidFinishSSRSync;
|
|
9
|
+
var _isFunction = require("@stryke/types/type-checks/is-function");
|
|
10
|
+
var _react = require("react");
|
|
11
|
+
const a = () => {},
|
|
12
|
+
c = () => a;
|
|
13
|
+
function useDidFinishSSR(e, n) {
|
|
14
|
+
if (process.env.TAMAGUI_TARGET === "native") return e ?? !0;
|
|
15
|
+
if (n?.sync) return (0, _react.useSyncExternalStore)(c, () => e ?? !0, () => !1);
|
|
16
|
+
const [t, r] = (0, _react.useState)(e);
|
|
17
|
+
return (0, _react.useEffect)(() => {
|
|
18
|
+
r(e ?? !0);
|
|
19
|
+
}, [e]), t ?? !1;
|
|
20
|
+
}
|
|
21
|
+
function useDidFinishSSRSync(e) {
|
|
22
|
+
return useDidFinishSSR(e, {
|
|
23
|
+
sync: !0
|
|
24
|
+
});
|
|
25
|
+
}
|
|
26
|
+
function useClientValue(e) {
|
|
27
|
+
return useDidFinishSSR() ? (0, _isFunction.isFunction)(e) ? e() : e : void 0;
|
|
28
|
+
}
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
export declare function useDidFinishSSR<A = boolean>(value?: A, options?: {
|
|
2
|
+
sync?: boolean;
|
|
3
|
+
}): A | false;
|
|
4
|
+
export declare function useDidFinishSSRSync<A = boolean>(value?: A): A | false;
|
|
5
|
+
type FunctionOrValue<Value> = Value extends () => infer X ? X : Value;
|
|
6
|
+
export declare function useClientValue<Value>(value?: Value): FunctionOrValue<Value> | undefined;
|
|
7
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{isFunction as u}from"@stryke/types/type-checks/is-function";import{useEffect as o,useState as s,useSyncExternalStore as i}from"react";const a=()=>{},c=()=>a;export function useDidFinishSSR(e,n){if(process.env.TAMAGUI_TARGET==="native")return e??!0;if(n?.sync)return i(c,()=>e??!0,()=>!1);const[t,r]=s(e);return o(()=>{r(e??!0)},[e]),t??!1}export function useDidFinishSSRSync(e){return useDidFinishSSR(e,{sync:!0})}export function useClientValue(e){return useDidFinishSSR()?u(e)?e():e:void 0}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useEscapeKeydown = useEscapeKeydown;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
var _useCallbackRef = require("./use-callback-ref.cjs");
|
|
9
|
+
function useEscapeKeydown(s, e = globalThis?.document) {
|
|
10
|
+
const o = (0, _useCallbackRef.useCallbackRef)(s);
|
|
11
|
+
(0, _react.useEffect)(() => {
|
|
12
|
+
const n = t => {
|
|
13
|
+
t.key === "Escape" && o(t);
|
|
14
|
+
};
|
|
15
|
+
return e.addEventListener("keydown", n), () => {
|
|
16
|
+
e.removeEventListener("keydown", n);
|
|
17
|
+
};
|
|
18
|
+
}, [o, e]);
|
|
19
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{useEffect as a}from"react";import{useCallbackRef as d}from"./use-callback-ref";export function useEscapeKeydown(s,e=globalThis?.document){const o=d(s);a(()=>{const n=t=>{t.key==="Escape"&&o(t)};return e.addEventListener("keydown",n),()=>{e.removeEventListener("keydown",n)}},[o,e])}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useEvent = useEvent;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
var _useIsomorphicLayoutEffect = require("./use-isomorphic-layout-effect.cjs");
|
|
9
|
+
function useEvent(n) {
|
|
10
|
+
return s(n, l, !0);
|
|
11
|
+
}
|
|
12
|
+
const l = () => {
|
|
13
|
+
throw new Error("Cannot call an event handler while rendering.");
|
|
14
|
+
};
|
|
15
|
+
function s(n, r, t) {
|
|
16
|
+
const e = (0, _react.useRef)(r ?? n);
|
|
17
|
+
return (0, _useIsomorphicLayoutEffect.useIsomorphicLayoutEffect)(() => {
|
|
18
|
+
e.current = n;
|
|
19
|
+
}), (0, _react.useCallback)(t ? (...o) => e.current?.apply(null, o) : () => e.current, []);
|
|
20
|
+
}
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
type AnyFunction = (...args: any[]) => any;
|
|
2
|
+
/**
|
|
3
|
+
* The function returns a memoized event handler.
|
|
4
|
+
*
|
|
5
|
+
* @param callback - The event handler to memoize.
|
|
6
|
+
* @returns A memoized event handler.
|
|
7
|
+
*/
|
|
8
|
+
export declare function useEvent<T extends AnyFunction>(callback?: T): T;
|
|
9
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{useCallback as u,useRef as a}from"react";import{useIsomorphicLayoutEffect as c}from"./use-isomorphic-layout-effect";export function useEvent(n){return s(n,l,!0)}const l=()=>{throw new Error("Cannot call an event handler while rendering.")};function s(n,r,t){const e=a(r??n);return c(()=>{e.current=n}),u(t?(...o)=>e.current?.apply(null,o):()=>e.current,[])}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useHover = void 0;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
const useHover = () => {
|
|
9
|
+
const [u, s] = (0, _react.useState)(!1),
|
|
10
|
+
e = (0, _react.useRef)(null),
|
|
11
|
+
n = (0, _react.useCallback)(() => {
|
|
12
|
+
s(!0);
|
|
13
|
+
}, []),
|
|
14
|
+
o = (0, _react.useCallback)(() => {
|
|
15
|
+
s(!1);
|
|
16
|
+
}, []);
|
|
17
|
+
return [(0, _react.useCallback)(t => {
|
|
18
|
+
e.current?.nodeType === Node.ELEMENT_NODE && (e.current.removeEventListener("mouseenter", n), e.current.removeEventListener("mouseleave", o)), t?.nodeType === Node.ELEMENT_NODE && (t.addEventListener("mouseenter", n), t.addEventListener("mouseleave", o)), e.current = t;
|
|
19
|
+
}, [n, o]), u];
|
|
20
|
+
};
|
|
21
|
+
exports.useHover = useHover;
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* A hook that returns tuple containing a ref and a boolean indicating if the element (referenced by the ref) is being hovered.
|
|
3
|
+
*
|
|
4
|
+
* @returns A tuple containing a ref and a boolean indicating if the element is being hovered
|
|
5
|
+
*/
|
|
6
|
+
export declare const useHover: () => [(node: HTMLElement) => void, boolean];
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{useCallback as r,useRef as l,useState as E}from"react";export const useHover=()=>{const[u,s]=E(!1),e=l(null),n=r(()=>{s(!0)},[]),o=r(()=>{s(!1)},[]);return[r(t=>{e.current?.nodeType===Node.ELEMENT_NODE&&(e.current.removeEventListener("mouseenter",n),e.current.removeEventListener("mouseleave",o)),t?.nodeType===Node.ELEMENT_NODE&&(t.addEventListener("mouseenter",n),t.addEventListener("mouseleave",o)),e.current=t},[n,o]),u]};
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useIdle = void 0;
|
|
7
|
+
var _throttle = require("@stryke/helpers/throttle");
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
const useIdle = (o = 1e3 * 60) => {
|
|
10
|
+
const [l, n] = (0, _react.useState)(!1);
|
|
11
|
+
return (0, _react.useEffect)(() => {
|
|
12
|
+
let t = -1;
|
|
13
|
+
const i = () => {
|
|
14
|
+
n(!0);
|
|
15
|
+
},
|
|
16
|
+
e = (0, _throttle.throttle)(() => {
|
|
17
|
+
n(!1), globalThis.clearTimeout(t), t = globalThis.setTimeout(i, o);
|
|
18
|
+
}, 500),
|
|
19
|
+
s = () => {
|
|
20
|
+
document.hidden || e();
|
|
21
|
+
};
|
|
22
|
+
return t = globalThis.setTimeout(i, o), globalThis.addEventListener("mousemove", e), globalThis.addEventListener("mousedown", e), window.addEventListener("resize", e), globalThis.addEventListener("keydown", e), globalThis.addEventListener("touchstart", e), window.addEventListener("wheel", e), document.addEventListener("visibilitychange", s), () => {
|
|
23
|
+
globalThis.removeEventListener("mousemove", e), globalThis.removeEventListener("mousedown", e), window.removeEventListener("resize", e), globalThis.removeEventListener("keydown", e), globalThis.removeEventListener("touchstart", e), window.removeEventListener("wheel", e), document.removeEventListener("visibilitychange", s), globalThis.clearTimeout(t);
|
|
24
|
+
};
|
|
25
|
+
}, [o]), l;
|
|
26
|
+
};
|
|
27
|
+
exports.useIdle = useIdle;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* A hook that returns a boolean indicating if the user is idle.
|
|
3
|
+
*
|
|
4
|
+
* @param ms - The number of milliseconds to wait before considering the user as idle
|
|
5
|
+
* @returns A boolean indicating if the user is idle
|
|
6
|
+
*/
|
|
7
|
+
export declare const useIdle: (ms?: number) => boolean;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{throttle as r}from"@stryke/helpers/throttle";import{useEffect as d,useState as a}from"react";export const useIdle=(o=1e3*60)=>{const[l,n]=a(!1);return d(()=>{let t=-1;const i=()=>{n(!0)},e=r(()=>{n(!1),globalThis.clearTimeout(t),t=globalThis.setTimeout(i,o)},500),s=()=>{document.hidden||e()};return t=globalThis.setTimeout(i,o),globalThis.addEventListener("mousemove",e),globalThis.addEventListener("mousedown",e),window.addEventListener("resize",e),globalThis.addEventListener("keydown",e),globalThis.addEventListener("touchstart",e),window.addEventListener("wheel",e),document.addEventListener("visibilitychange",s),()=>{globalThis.removeEventListener("mousemove",e),globalThis.removeEventListener("mousedown",e),window.removeEventListener("resize",e),globalThis.removeEventListener("keydown",e),globalThis.removeEventListener("touchstart",e),window.removeEventListener("wheel",e),document.removeEventListener("visibilitychange",s),globalThis.clearTimeout(t)}},[o]),l};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useIsomorphicLayoutEffect = void 0;
|
|
7
|
+
var _isRuntimeServer = require("@stryke/helpers/is-runtime-server");
|
|
8
|
+
var _react = require("react");
|
|
9
|
+
const useIsomorphicLayoutEffect = exports.useIsomorphicLayoutEffect = (0, _isRuntimeServer.isRuntimeServer)() ? _react.useEffect : _react.useLayoutEffect;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{isRuntimeServer as e}from"@stryke/helpers/is-runtime-server";import{useEffect as o,useLayoutEffect as t}from"react";export const useIsomorphicLayoutEffect=e()?o:t;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useKeyboardVisible = void 0;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
var _reactNative = require("react-native");
|
|
9
|
+
const useKeyboardVisible = () => {
|
|
10
|
+
const [o, e] = (0, _react.useState)(!1);
|
|
11
|
+
return (0, _react.useEffect)(() => {
|
|
12
|
+
const i = _reactNative.Keyboard.addListener("keyboardDidShow", () => {
|
|
13
|
+
e(!0);
|
|
14
|
+
}),
|
|
15
|
+
d = _reactNative.Keyboard.addListener("keyboardDidHide", () => {
|
|
16
|
+
e(!1);
|
|
17
|
+
});
|
|
18
|
+
return () => {
|
|
19
|
+
d.remove(), i.remove();
|
|
20
|
+
};
|
|
21
|
+
}, []), o;
|
|
22
|
+
};
|
|
23
|
+
exports.useKeyboardVisible = useKeyboardVisible;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const useKeyboardVisible: () => boolean;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{useEffect as s,useState as t}from"react";import{Keyboard as r}from"react-native";export const useKeyboardVisible=()=>{const[o,e]=t(!1);return s(()=>{const i=r.addListener("keyboardDidShow",()=>{e(!0)}),d=r.addListener("keyboardDidHide",()=>{e(!1)});return()=>{d.remove(),i.remove()}},[]),o};
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useMemoStable = useMemoStable;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
const i = (t, e) => {
|
|
9
|
+
if (t.length !== e.length) return !1;
|
|
10
|
+
for (const [u, r] of t.entries()) if (r !== e[u]) return !1;
|
|
11
|
+
return !0;
|
|
12
|
+
};
|
|
13
|
+
function useMemoStable(t, e) {
|
|
14
|
+
const u = (0, _react.useState)(() => ({
|
|
15
|
+
inputs: e,
|
|
16
|
+
result: t()
|
|
17
|
+
}))[0],
|
|
18
|
+
r = (0, _react.useRef)(!0),
|
|
19
|
+
n = (0, _react.useRef)(u),
|
|
20
|
+
s = r.current || !!(e && n.current.inputs && i(e, n.current.inputs)),
|
|
21
|
+
a = (0, _react.useMemo)(() => s ? n.current : {
|
|
22
|
+
inputs: e,
|
|
23
|
+
result: t()
|
|
24
|
+
}, [e, t, s]);
|
|
25
|
+
return (0, _react.useEffect)(() => {
|
|
26
|
+
r.current = !1, n.current = a;
|
|
27
|
+
}, [a]), a.result;
|
|
28
|
+
}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* `useMemo` and `useCallback` cache the most recent result. However, this cache can be destroyed by React when it wants to.
|
|
3
|
+
*
|
|
4
|
+
* `useMemoStable` and `useCallbackStable` are concurrent mode safe alternatives to `useMemo` and `useCallback` that do provide semantic guarantee. What this means is that you will always get the same reference for a memoized value so long as there is no input change.
|
|
5
|
+
*
|
|
6
|
+
* Using `useMemoStable` and `useCallbackStable` will consume more memory than useMemo and `useCallback` in order to provide a stable cache. React can release the cache of `useMemo` and `useCallback`, but `useMemoStable` will not release the cache until it is garbage collected.
|
|
7
|
+
*
|
|
8
|
+
* @remarks
|
|
9
|
+
* You may rely on useMemo as a performance optimization, not as a semantic guarantee. In the future, React may choose to “forget” some previously memoized values and recalculate them on next render, e.g. to free memory for offscreen components. Write your code so that it still works without `useMemo` — and then add it to optimize performance.
|
|
10
|
+
*
|
|
11
|
+
* @param getResult - The function used to generate the result
|
|
12
|
+
* @param inputs - The inputs to watch for changes
|
|
13
|
+
* @returns The memoized result
|
|
14
|
+
*/
|
|
15
|
+
export declare function useMemoStable<TResult>(getResult: () => TResult, inputs?: any[]): TResult;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{useEffect as o,useMemo as l,useRef as c,useState as f}from"react";const i=(t,e)=>{if(t.length!==e.length)return!1;for(const[u,r]of t.entries())if(r!==e[u])return!1;return!0};export function useMemoStable(t,e){const u=f(()=>({inputs:e,result:t()}))[0],r=c(!0),n=c(u),s=r.current||!!(e&&n.current.inputs&&i(e,n.current.inputs)),a=l(()=>s?n.current:{inputs:e,result:t()},[e,t,s]);return o(()=>{r.current=!1,n.current=a},[a]),a.result}
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useNetworkState = useNetworkState;
|
|
7
|
+
exports.useNetworkStateSubscribe = void 0;
|
|
8
|
+
var _isEqual = require("@stryke/types/type-checks/is-equal");
|
|
9
|
+
var _react = require("react");
|
|
10
|
+
const i = () => navigator["connection"] || navigator["mozConnection"] || navigator["webkitConnection"];
|
|
11
|
+
const useNetworkStateSubscribe = e => {
|
|
12
|
+
globalThis.addEventListener("online", e, {
|
|
13
|
+
passive: !0
|
|
14
|
+
}), globalThis.addEventListener("offline", e, {
|
|
15
|
+
passive: !0
|
|
16
|
+
});
|
|
17
|
+
const t = i();
|
|
18
|
+
return t && t.addEventListener("change", e, {
|
|
19
|
+
passive: !0
|
|
20
|
+
}), () => {
|
|
21
|
+
globalThis.removeEventListener("online", e), globalThis.removeEventListener("offline", e), t && t.removeEventListener("change", e);
|
|
22
|
+
};
|
|
23
|
+
};
|
|
24
|
+
exports.useNetworkStateSubscribe = useNetworkStateSubscribe;
|
|
25
|
+
const f = () => {
|
|
26
|
+
throw new Error("useNetworkState is a client-only hook");
|
|
27
|
+
};
|
|
28
|
+
function useNetworkState() {
|
|
29
|
+
const e = (0, _react.useRef)({});
|
|
30
|
+
return (0, _react.useSyncExternalStore)(useNetworkStateSubscribe, () => {
|
|
31
|
+
const r = navigator.onLine,
|
|
32
|
+
n = i(),
|
|
33
|
+
o = {
|
|
34
|
+
online: r,
|
|
35
|
+
downlink: n?.downlink,
|
|
36
|
+
downlinkMax: n?.downlinkMax,
|
|
37
|
+
effectiveType: n?.effectiveType,
|
|
38
|
+
rtt: n?.rtt,
|
|
39
|
+
saveData: n?.saveData,
|
|
40
|
+
type: n?.type
|
|
41
|
+
};
|
|
42
|
+
return (0, _isEqual.isEqual)(e.current, o) ? e.current : (e.current = o, o);
|
|
43
|
+
}, f);
|
|
44
|
+
}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Subscribes to network state changes.
|
|
3
|
+
*
|
|
4
|
+
* @param callback - The callback function to call when the network state changes
|
|
5
|
+
* @returns A function to unsubscribe from the network state changes
|
|
6
|
+
*/
|
|
7
|
+
export declare const useNetworkStateSubscribe: (callback: (event: Event) => any) => () => void;
|
|
8
|
+
/**
|
|
9
|
+
* A hook that returns the network state.
|
|
10
|
+
*
|
|
11
|
+
* @returns The network state
|
|
12
|
+
*/
|
|
13
|
+
export declare function useNetworkState(): NetworkState;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{isEqual as a}from"@stryke/types/type-checks/is-equal";import{useRef as s,useSyncExternalStore as c}from"react";const i=()=>navigator["connection"]||navigator["mozConnection"]||navigator["webkitConnection"];export const useNetworkStateSubscribe=e=>{globalThis.addEventListener("online",e,{passive:!0}),globalThis.addEventListener("offline",e,{passive:!0});const t=i();return t&&t.addEventListener("change",e,{passive:!0}),()=>{globalThis.removeEventListener("online",e),globalThis.removeEventListener("offline",e),t&&t.removeEventListener("change",e)}};const f=()=>{throw new Error("useNetworkState is a client-only hook")};export function useNetworkState(){const e=s({});return c(useNetworkStateSubscribe,()=>{const r=navigator.onLine,n=i(),o={online:r,downlink:n?.downlink,downlinkMax:n?.downlinkMax,effectiveType:n?.effectiveType,rtt:n?.rtt,saveData:n?.saveData,type:n?.type};return a(e.current,o)?e.current:(e.current=o,o)},f)}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.usePrevious = usePrevious;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
function usePrevious(r) {
|
|
9
|
+
const e = (0, _react.useRef)({
|
|
10
|
+
value: r,
|
|
11
|
+
previous: r
|
|
12
|
+
});
|
|
13
|
+
return (0, _react.useMemo)(() => (e.current.value !== r && (e.current.previous = e.current.value, e.current.value = r), e.current.previous), [r]);
|
|
14
|
+
}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function usePrevious<T>(value: T): T;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{useMemo as u,useRef as t}from"react";export function usePrevious(r){const e=t({value:r,previous:r});return u(()=>(e.current.value!==r&&(e.current.previous=e.current.value,e.current.value=r),e.current.previous),[r])}
|