@nucleux/hooks 0.1.0
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 +21 -0
- package/dist/index.cjs +61 -0
- package/dist/index.cjs.map +1 -0
- package/dist/index.d.cts +33 -0
- package/dist/index.d.ts +33 -0
- package/dist/index.js +58 -0
- package/dist/index.js.map +1 -0
- package/package.json +43 -0
package/LICENSE
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2026 Nucleux
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
+
in the Software without restriction, including without limitation the rights
|
|
8
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
+
furnished to do so, subject to the following conditions:
|
|
11
|
+
|
|
12
|
+
The above copyright notice and this permission notice shall be included in all
|
|
13
|
+
copies or substantial portions of the Software.
|
|
14
|
+
|
|
15
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
+
SOFTWARE.
|
package/dist/index.cjs
ADDED
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
'use strict';
|
|
3
|
+
|
|
4
|
+
var react = require('react');
|
|
5
|
+
|
|
6
|
+
// src/use-auto-scroll.ts
|
|
7
|
+
function useAutoScroll({
|
|
8
|
+
dependency,
|
|
9
|
+
threshold = 48
|
|
10
|
+
} = {}) {
|
|
11
|
+
const ref = react.useRef(null);
|
|
12
|
+
const [pinned, setPinned] = react.useState(true);
|
|
13
|
+
const scrollToBottom = react.useCallback((behavior = "smooth") => {
|
|
14
|
+
const el = ref.current;
|
|
15
|
+
if (!el) return;
|
|
16
|
+
el.scrollTo({ top: el.scrollHeight, behavior });
|
|
17
|
+
setPinned(true);
|
|
18
|
+
}, []);
|
|
19
|
+
const handleScroll = react.useCallback(() => {
|
|
20
|
+
const el = ref.current;
|
|
21
|
+
if (!el) return;
|
|
22
|
+
const distance = el.scrollHeight - el.scrollTop - el.clientHeight;
|
|
23
|
+
setPinned(distance <= threshold);
|
|
24
|
+
}, [threshold]);
|
|
25
|
+
react.useLayoutEffect(() => {
|
|
26
|
+
if (pinned) scrollToBottom("auto");
|
|
27
|
+
}, [dependency]);
|
|
28
|
+
react.useEffect(() => {
|
|
29
|
+
const el = ref.current;
|
|
30
|
+
if (!el) return;
|
|
31
|
+
el.addEventListener("scroll", handleScroll, { passive: true });
|
|
32
|
+
return () => el.removeEventListener("scroll", handleScroll);
|
|
33
|
+
}, [handleScroll]);
|
|
34
|
+
return { ref, pinned, scrollToBottom };
|
|
35
|
+
}
|
|
36
|
+
function useCopyToClipboard({ timeout = 2e3 } = {}) {
|
|
37
|
+
const [copied, setCopied] = react.useState(false);
|
|
38
|
+
const timer = react.useRef(null);
|
|
39
|
+
const copy = react.useCallback(
|
|
40
|
+
async (value) => {
|
|
41
|
+
if (typeof navigator === "undefined" || !navigator.clipboard) return false;
|
|
42
|
+
try {
|
|
43
|
+
await navigator.clipboard.writeText(value);
|
|
44
|
+
setCopied(true);
|
|
45
|
+
if (timer.current) clearTimeout(timer.current);
|
|
46
|
+
timer.current = setTimeout(() => setCopied(false), timeout);
|
|
47
|
+
return true;
|
|
48
|
+
} catch {
|
|
49
|
+
setCopied(false);
|
|
50
|
+
return false;
|
|
51
|
+
}
|
|
52
|
+
},
|
|
53
|
+
[timeout]
|
|
54
|
+
);
|
|
55
|
+
return { copied, copy };
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
exports.useAutoScroll = useAutoScroll;
|
|
59
|
+
exports.useCopyToClipboard = useCopyToClipboard;
|
|
60
|
+
//# sourceMappingURL=index.cjs.map
|
|
61
|
+
//# sourceMappingURL=index.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/use-auto-scroll.ts","../src/use-copy-to-clipboard.ts"],"names":["useRef","useState","useCallback","useLayoutEffect","useEffect"],"mappings":";;;;;AAcO,SAAS,aAAA,CAAsD;AAAA,EACpE,UAAA;AAAA,EACA,SAAA,GAAY;AACd,CAAA,GAA0B,EAAC,EAAG;AAC5B,EAAA,MAAM,GAAA,GAAMA,aAAU,IAAI,CAAA;AAC1B,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAIC,eAAS,IAAI,CAAA;AAEzC,EAAA,MAAM,cAAA,GAAiBC,iBAAA,CAAY,CAAC,QAAA,GAA2B,QAAA,KAAa;AAC1E,IAAA,MAAM,KAAK,GAAA,CAAI,OAAA;AACf,IAAA,IAAI,CAAC,EAAA,EAAI;AACT,IAAA,EAAA,CAAG,SAAS,EAAE,GAAA,EAAK,EAAA,CAAG,YAAA,EAAc,UAAU,CAAA;AAC9C,IAAA,SAAA,CAAU,IAAI,CAAA;AAAA,EAChB,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,YAAA,GAAeA,kBAAY,MAAM;AACrC,IAAA,MAAM,KAAK,GAAA,CAAI,OAAA;AACf,IAAA,IAAI,CAAC,EAAA,EAAI;AACT,IAAA,MAAM,QAAA,GAAW,EAAA,CAAG,YAAA,GAAe,EAAA,CAAG,YAAY,EAAA,CAAG,YAAA;AACrD,IAAA,SAAA,CAAU,YAAY,SAAS,CAAA;AAAA,EACjC,CAAA,EAAG,CAAC,SAAS,CAAC,CAAA;AAEd,EAAAC,qBAAA,CAAgB,MAAM;AACpB,IAAA,IAAI,MAAA,iBAAuB,MAAM,CAAA;AAAA,EAEnC,CAAA,EAAG,CAAC,UAAU,CAAC,CAAA;AAEf,EAAAC,eAAA,CAAU,MAAM;AACd,IAAA,MAAM,KAAK,GAAA,CAAI,OAAA;AACf,IAAA,IAAI,CAAC,EAAA,EAAI;AACT,IAAA,EAAA,CAAG,iBAAiB,QAAA,EAAU,YAAA,EAAc,EAAE,OAAA,EAAS,MAAM,CAAA;AAC7D,IAAA,OAAO,MAAM,EAAA,CAAG,mBAAA,CAAoB,QAAA,EAAU,YAAY,CAAA;AAAA,EAC5D,CAAA,EAAG,CAAC,YAAY,CAAC,CAAA;AAEjB,EAAA,OAAO,EAAE,GAAA,EAAK,MAAA,EAAQ,cAAA,EAAe;AACvC;ACrCO,SAAS,mBAAmB,EAAE,OAAA,GAAU,GAAA,EAAK,GAA+B,EAAC,EAAG;AACrF,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAIH,eAAS,KAAK,CAAA;AAC1C,EAAA,MAAM,KAAA,GAAQD,aAA6C,IAAI,CAAA;AAE/D,EAAA,MAAM,IAAA,GAAOE,iBAAAA;AAAA,IACX,OAAO,KAAA,KAAkB;AACvB,MAAA,IAAI,OAAO,SAAA,KAAc,WAAA,IAAe,CAAC,SAAA,CAAU,WAAW,OAAO,KAAA;AACrE,MAAA,IAAI;AACF,QAAA,MAAM,SAAA,CAAU,SAAA,CAAU,SAAA,CAAU,KAAK,CAAA;AACzC,QAAA,SAAA,CAAU,IAAI,CAAA;AACd,QAAA,IAAI,KAAA,CAAM,OAAA,EAAS,YAAA,CAAa,KAAA,CAAM,OAAO,CAAA;AAC7C,QAAA,KAAA,CAAM,UAAU,UAAA,CAAW,MAAM,SAAA,CAAU,KAAK,GAAG,OAAO,CAAA;AAC1D,QAAA,OAAO,IAAA;AAAA,MACT,CAAA,CAAA,MAAQ;AACN,QAAA,SAAA,CAAU,KAAK,CAAA;AACf,QAAA,OAAO,KAAA;AAAA,MACT;AAAA,IACF,CAAA;AAAA,IACA,CAAC,OAAO;AAAA,GACV;AAEA,EAAA,OAAO,EAAE,QAAQ,IAAA,EAAK;AACxB","file":"index.cjs","sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useRef, useState } from \"react\";\n\nexport interface UseAutoScrollOptions {\n /** Re-evaluate scrolling whenever this value changes (e.g. message count). */\n dependency?: unknown;\n /** Distance (px) from the bottom still considered \"pinned\". */\n threshold?: number;\n}\n\n/**\n * Keep a scroll container pinned to the bottom as new content streams in —\n * unless the user has scrolled up, in which case auto-scroll pauses until they\n * return to the bottom. Ideal for chat/agent transcripts.\n */\nexport function useAutoScroll<T extends HTMLElement = HTMLDivElement>({\n dependency,\n threshold = 48,\n}: UseAutoScrollOptions = {}) {\n const ref = useRef<T>(null);\n const [pinned, setPinned] = useState(true);\n\n const scrollToBottom = useCallback((behavior: ScrollBehavior = \"smooth\") => {\n const el = ref.current;\n if (!el) return;\n el.scrollTo({ top: el.scrollHeight, behavior });\n setPinned(true);\n }, []);\n\n const handleScroll = useCallback(() => {\n const el = ref.current;\n if (!el) return;\n const distance = el.scrollHeight - el.scrollTop - el.clientHeight;\n setPinned(distance <= threshold);\n }, [threshold]);\n\n useLayoutEffect(() => {\n if (pinned) scrollToBottom(\"auto\");\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [dependency]);\n\n useEffect(() => {\n const el = ref.current;\n if (!el) return;\n el.addEventListener(\"scroll\", handleScroll, { passive: true });\n return () => el.removeEventListener(\"scroll\", handleScroll);\n }, [handleScroll]);\n\n return { ref, pinned, scrollToBottom };\n}\n","import { useCallback, useRef, useState } from \"react\";\n\nexport interface UseCopyToClipboardOptions {\n /** How long (ms) the `copied` flag stays true after a successful copy. */\n timeout?: number;\n}\n\n/**\n * Copy text to the clipboard and expose a transient `copied` flag, handy for\n * \"copy\" buttons on code blocks and messages.\n */\nexport function useCopyToClipboard({ timeout = 2000 }: UseCopyToClipboardOptions = {}) {\n const [copied, setCopied] = useState(false);\n const timer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const copy = useCallback(\n async (value: string) => {\n if (typeof navigator === \"undefined\" || !navigator.clipboard) return false;\n try {\n await navigator.clipboard.writeText(value);\n setCopied(true);\n if (timer.current) clearTimeout(timer.current);\n timer.current = setTimeout(() => setCopied(false), timeout);\n return true;\n } catch {\n setCopied(false);\n return false;\n }\n },\n [timeout],\n );\n\n return { copied, copy };\n}\n"]}
|
package/dist/index.d.cts
ADDED
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
|
|
3
|
+
interface UseAutoScrollOptions {
|
|
4
|
+
/** Re-evaluate scrolling whenever this value changes (e.g. message count). */
|
|
5
|
+
dependency?: unknown;
|
|
6
|
+
/** Distance (px) from the bottom still considered "pinned". */
|
|
7
|
+
threshold?: number;
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* Keep a scroll container pinned to the bottom as new content streams in —
|
|
11
|
+
* unless the user has scrolled up, in which case auto-scroll pauses until they
|
|
12
|
+
* return to the bottom. Ideal for chat/agent transcripts.
|
|
13
|
+
*/
|
|
14
|
+
declare function useAutoScroll<T extends HTMLElement = HTMLDivElement>({ dependency, threshold, }?: UseAutoScrollOptions): {
|
|
15
|
+
ref: react.RefObject<T>;
|
|
16
|
+
pinned: boolean;
|
|
17
|
+
scrollToBottom: (behavior?: ScrollBehavior) => void;
|
|
18
|
+
};
|
|
19
|
+
|
|
20
|
+
interface UseCopyToClipboardOptions {
|
|
21
|
+
/** How long (ms) the `copied` flag stays true after a successful copy. */
|
|
22
|
+
timeout?: number;
|
|
23
|
+
}
|
|
24
|
+
/**
|
|
25
|
+
* Copy text to the clipboard and expose a transient `copied` flag, handy for
|
|
26
|
+
* "copy" buttons on code blocks and messages.
|
|
27
|
+
*/
|
|
28
|
+
declare function useCopyToClipboard({ timeout }?: UseCopyToClipboardOptions): {
|
|
29
|
+
copied: boolean;
|
|
30
|
+
copy: (value: string) => Promise<boolean>;
|
|
31
|
+
};
|
|
32
|
+
|
|
33
|
+
export { type UseAutoScrollOptions, type UseCopyToClipboardOptions, useAutoScroll, useCopyToClipboard };
|
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
|
|
3
|
+
interface UseAutoScrollOptions {
|
|
4
|
+
/** Re-evaluate scrolling whenever this value changes (e.g. message count). */
|
|
5
|
+
dependency?: unknown;
|
|
6
|
+
/** Distance (px) from the bottom still considered "pinned". */
|
|
7
|
+
threshold?: number;
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* Keep a scroll container pinned to the bottom as new content streams in —
|
|
11
|
+
* unless the user has scrolled up, in which case auto-scroll pauses until they
|
|
12
|
+
* return to the bottom. Ideal for chat/agent transcripts.
|
|
13
|
+
*/
|
|
14
|
+
declare function useAutoScroll<T extends HTMLElement = HTMLDivElement>({ dependency, threshold, }?: UseAutoScrollOptions): {
|
|
15
|
+
ref: react.RefObject<T>;
|
|
16
|
+
pinned: boolean;
|
|
17
|
+
scrollToBottom: (behavior?: ScrollBehavior) => void;
|
|
18
|
+
};
|
|
19
|
+
|
|
20
|
+
interface UseCopyToClipboardOptions {
|
|
21
|
+
/** How long (ms) the `copied` flag stays true after a successful copy. */
|
|
22
|
+
timeout?: number;
|
|
23
|
+
}
|
|
24
|
+
/**
|
|
25
|
+
* Copy text to the clipboard and expose a transient `copied` flag, handy for
|
|
26
|
+
* "copy" buttons on code blocks and messages.
|
|
27
|
+
*/
|
|
28
|
+
declare function useCopyToClipboard({ timeout }?: UseCopyToClipboardOptions): {
|
|
29
|
+
copied: boolean;
|
|
30
|
+
copy: (value: string) => Promise<boolean>;
|
|
31
|
+
};
|
|
32
|
+
|
|
33
|
+
export { type UseAutoScrollOptions, type UseCopyToClipboardOptions, useAutoScroll, useCopyToClipboard };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { useRef, useState, useCallback, useLayoutEffect, useEffect } from 'react';
|
|
3
|
+
|
|
4
|
+
// src/use-auto-scroll.ts
|
|
5
|
+
function useAutoScroll({
|
|
6
|
+
dependency,
|
|
7
|
+
threshold = 48
|
|
8
|
+
} = {}) {
|
|
9
|
+
const ref = useRef(null);
|
|
10
|
+
const [pinned, setPinned] = useState(true);
|
|
11
|
+
const scrollToBottom = useCallback((behavior = "smooth") => {
|
|
12
|
+
const el = ref.current;
|
|
13
|
+
if (!el) return;
|
|
14
|
+
el.scrollTo({ top: el.scrollHeight, behavior });
|
|
15
|
+
setPinned(true);
|
|
16
|
+
}, []);
|
|
17
|
+
const handleScroll = useCallback(() => {
|
|
18
|
+
const el = ref.current;
|
|
19
|
+
if (!el) return;
|
|
20
|
+
const distance = el.scrollHeight - el.scrollTop - el.clientHeight;
|
|
21
|
+
setPinned(distance <= threshold);
|
|
22
|
+
}, [threshold]);
|
|
23
|
+
useLayoutEffect(() => {
|
|
24
|
+
if (pinned) scrollToBottom("auto");
|
|
25
|
+
}, [dependency]);
|
|
26
|
+
useEffect(() => {
|
|
27
|
+
const el = ref.current;
|
|
28
|
+
if (!el) return;
|
|
29
|
+
el.addEventListener("scroll", handleScroll, { passive: true });
|
|
30
|
+
return () => el.removeEventListener("scroll", handleScroll);
|
|
31
|
+
}, [handleScroll]);
|
|
32
|
+
return { ref, pinned, scrollToBottom };
|
|
33
|
+
}
|
|
34
|
+
function useCopyToClipboard({ timeout = 2e3 } = {}) {
|
|
35
|
+
const [copied, setCopied] = useState(false);
|
|
36
|
+
const timer = useRef(null);
|
|
37
|
+
const copy = useCallback(
|
|
38
|
+
async (value) => {
|
|
39
|
+
if (typeof navigator === "undefined" || !navigator.clipboard) return false;
|
|
40
|
+
try {
|
|
41
|
+
await navigator.clipboard.writeText(value);
|
|
42
|
+
setCopied(true);
|
|
43
|
+
if (timer.current) clearTimeout(timer.current);
|
|
44
|
+
timer.current = setTimeout(() => setCopied(false), timeout);
|
|
45
|
+
return true;
|
|
46
|
+
} catch {
|
|
47
|
+
setCopied(false);
|
|
48
|
+
return false;
|
|
49
|
+
}
|
|
50
|
+
},
|
|
51
|
+
[timeout]
|
|
52
|
+
);
|
|
53
|
+
return { copied, copy };
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
export { useAutoScroll, useCopyToClipboard };
|
|
57
|
+
//# sourceMappingURL=index.js.map
|
|
58
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../src/use-auto-scroll.ts","../src/use-copy-to-clipboard.ts"],"names":["useState","useRef","useCallback"],"mappings":";;;AAcO,SAAS,aAAA,CAAsD;AAAA,EACpE,UAAA;AAAA,EACA,SAAA,GAAY;AACd,CAAA,GAA0B,EAAC,EAAG;AAC5B,EAAA,MAAM,GAAA,GAAM,OAAU,IAAI,CAAA;AAC1B,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,SAAS,IAAI,CAAA;AAEzC,EAAA,MAAM,cAAA,GAAiB,WAAA,CAAY,CAAC,QAAA,GAA2B,QAAA,KAAa;AAC1E,IAAA,MAAM,KAAK,GAAA,CAAI,OAAA;AACf,IAAA,IAAI,CAAC,EAAA,EAAI;AACT,IAAA,EAAA,CAAG,SAAS,EAAE,GAAA,EAAK,EAAA,CAAG,YAAA,EAAc,UAAU,CAAA;AAC9C,IAAA,SAAA,CAAU,IAAI,CAAA;AAAA,EAChB,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,YAAA,GAAe,YAAY,MAAM;AACrC,IAAA,MAAM,KAAK,GAAA,CAAI,OAAA;AACf,IAAA,IAAI,CAAC,EAAA,EAAI;AACT,IAAA,MAAM,QAAA,GAAW,EAAA,CAAG,YAAA,GAAe,EAAA,CAAG,YAAY,EAAA,CAAG,YAAA;AACrD,IAAA,SAAA,CAAU,YAAY,SAAS,CAAA;AAAA,EACjC,CAAA,EAAG,CAAC,SAAS,CAAC,CAAA;AAEd,EAAA,eAAA,CAAgB,MAAM;AACpB,IAAA,IAAI,MAAA,iBAAuB,MAAM,CAAA;AAAA,EAEnC,CAAA,EAAG,CAAC,UAAU,CAAC,CAAA;AAEf,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,MAAM,KAAK,GAAA,CAAI,OAAA;AACf,IAAA,IAAI,CAAC,EAAA,EAAI;AACT,IAAA,EAAA,CAAG,iBAAiB,QAAA,EAAU,YAAA,EAAc,EAAE,OAAA,EAAS,MAAM,CAAA;AAC7D,IAAA,OAAO,MAAM,EAAA,CAAG,mBAAA,CAAoB,QAAA,EAAU,YAAY,CAAA;AAAA,EAC5D,CAAA,EAAG,CAAC,YAAY,CAAC,CAAA;AAEjB,EAAA,OAAO,EAAE,GAAA,EAAK,MAAA,EAAQ,cAAA,EAAe;AACvC;ACrCO,SAAS,mBAAmB,EAAE,OAAA,GAAU,GAAA,EAAK,GAA+B,EAAC,EAAG;AACrF,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAIA,SAAS,KAAK,CAAA;AAC1C,EAAA,MAAM,KAAA,GAAQC,OAA6C,IAAI,CAAA;AAE/D,EAAA,MAAM,IAAA,GAAOC,WAAAA;AAAA,IACX,OAAO,KAAA,KAAkB;AACvB,MAAA,IAAI,OAAO,SAAA,KAAc,WAAA,IAAe,CAAC,SAAA,CAAU,WAAW,OAAO,KAAA;AACrE,MAAA,IAAI;AACF,QAAA,MAAM,SAAA,CAAU,SAAA,CAAU,SAAA,CAAU,KAAK,CAAA;AACzC,QAAA,SAAA,CAAU,IAAI,CAAA;AACd,QAAA,IAAI,KAAA,CAAM,OAAA,EAAS,YAAA,CAAa,KAAA,CAAM,OAAO,CAAA;AAC7C,QAAA,KAAA,CAAM,UAAU,UAAA,CAAW,MAAM,SAAA,CAAU,KAAK,GAAG,OAAO,CAAA;AAC1D,QAAA,OAAO,IAAA;AAAA,MACT,CAAA,CAAA,MAAQ;AACN,QAAA,SAAA,CAAU,KAAK,CAAA;AACf,QAAA,OAAO,KAAA;AAAA,MACT;AAAA,IACF,CAAA;AAAA,IACA,CAAC,OAAO;AAAA,GACV;AAEA,EAAA,OAAO,EAAE,QAAQ,IAAA,EAAK;AACxB","file":"index.js","sourcesContent":["import { useCallback, useEffect, useLayoutEffect, useRef, useState } from \"react\";\n\nexport interface UseAutoScrollOptions {\n /** Re-evaluate scrolling whenever this value changes (e.g. message count). */\n dependency?: unknown;\n /** Distance (px) from the bottom still considered \"pinned\". */\n threshold?: number;\n}\n\n/**\n * Keep a scroll container pinned to the bottom as new content streams in —\n * unless the user has scrolled up, in which case auto-scroll pauses until they\n * return to the bottom. Ideal for chat/agent transcripts.\n */\nexport function useAutoScroll<T extends HTMLElement = HTMLDivElement>({\n dependency,\n threshold = 48,\n}: UseAutoScrollOptions = {}) {\n const ref = useRef<T>(null);\n const [pinned, setPinned] = useState(true);\n\n const scrollToBottom = useCallback((behavior: ScrollBehavior = \"smooth\") => {\n const el = ref.current;\n if (!el) return;\n el.scrollTo({ top: el.scrollHeight, behavior });\n setPinned(true);\n }, []);\n\n const handleScroll = useCallback(() => {\n const el = ref.current;\n if (!el) return;\n const distance = el.scrollHeight - el.scrollTop - el.clientHeight;\n setPinned(distance <= threshold);\n }, [threshold]);\n\n useLayoutEffect(() => {\n if (pinned) scrollToBottom(\"auto\");\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [dependency]);\n\n useEffect(() => {\n const el = ref.current;\n if (!el) return;\n el.addEventListener(\"scroll\", handleScroll, { passive: true });\n return () => el.removeEventListener(\"scroll\", handleScroll);\n }, [handleScroll]);\n\n return { ref, pinned, scrollToBottom };\n}\n","import { useCallback, useRef, useState } from \"react\";\n\nexport interface UseCopyToClipboardOptions {\n /** How long (ms) the `copied` flag stays true after a successful copy. */\n timeout?: number;\n}\n\n/**\n * Copy text to the clipboard and expose a transient `copied` flag, handy for\n * \"copy\" buttons on code blocks and messages.\n */\nexport function useCopyToClipboard({ timeout = 2000 }: UseCopyToClipboardOptions = {}) {\n const [copied, setCopied] = useState(false);\n const timer = useRef<ReturnType<typeof setTimeout> | null>(null);\n\n const copy = useCallback(\n async (value: string) => {\n if (typeof navigator === \"undefined\" || !navigator.clipboard) return false;\n try {\n await navigator.clipboard.writeText(value);\n setCopied(true);\n if (timer.current) clearTimeout(timer.current);\n timer.current = setTimeout(() => setCopied(false), timeout);\n return true;\n } catch {\n setCopied(false);\n return false;\n }\n },\n [timeout],\n );\n\n return { copied, copy };\n}\n"]}
|
package/package.json
ADDED
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@nucleux/hooks",
|
|
3
|
+
"version": "0.1.0",
|
|
4
|
+
"type": "module",
|
|
5
|
+
"sideEffects": false,
|
|
6
|
+
"main": "./dist/index.cjs",
|
|
7
|
+
"module": "./dist/index.js",
|
|
8
|
+
"types": "./dist/index.d.ts",
|
|
9
|
+
"exports": {
|
|
10
|
+
".": {
|
|
11
|
+
"types": "./dist/index.d.ts",
|
|
12
|
+
"import": "./dist/index.js",
|
|
13
|
+
"require": "./dist/index.cjs"
|
|
14
|
+
}
|
|
15
|
+
},
|
|
16
|
+
"files": [
|
|
17
|
+
"dist"
|
|
18
|
+
],
|
|
19
|
+
"peerDependencies": {
|
|
20
|
+
"react": ">=18",
|
|
21
|
+
"react-dom": ">=18"
|
|
22
|
+
},
|
|
23
|
+
"devDependencies": {
|
|
24
|
+
"tsup": "^8.3.5",
|
|
25
|
+
"typescript": "^5.7.2",
|
|
26
|
+
"@types/react": "^18.3.18",
|
|
27
|
+
"react": "^18.3.1",
|
|
28
|
+
"lucide-react": "^0.469.0"
|
|
29
|
+
},
|
|
30
|
+
"publishConfig": {
|
|
31
|
+
"access": "public"
|
|
32
|
+
},
|
|
33
|
+
"license": "MIT",
|
|
34
|
+
"repository": {
|
|
35
|
+
"type": "git",
|
|
36
|
+
"url": "git+https://github.com/intelligaia-open-labs/nucleux.git",
|
|
37
|
+
"directory": "packages/hooks"
|
|
38
|
+
},
|
|
39
|
+
"homepage": "https://github.com/intelligaia-open-labs/nucleux#readme",
|
|
40
|
+
"scripts": {
|
|
41
|
+
"build": "tsup"
|
|
42
|
+
}
|
|
43
|
+
}
|