@rio-cloud/rio-uikit 2.5.0 → 3.0.0-beta.1

package/hooks/useResizeObserver.js

@@ -1,35 +1,35 @@
-import { useState as k, useRef as a, useCallback as d, useLayoutEffect as v } from "react";
-const c = (e) => {
-  const t = e?.borderBoxSize?.at(0);
-  return {
-    blockSize: t?.blockSize ?? e?.contentRect.height,
-    inlineSize: t?.inlineSize ?? e?.contentRect.width
-  };
-}, g = (e) => {
-  const [t, f] = k(null), s = a(null), o = a(null), r = d(() => o.current?.disconnect(), []), l = d(() => {
-    o.current = new ResizeObserver(([n]) => {
-      f((i) => {
-        if (!i)
-          return n;
-        const b = c(i), u = c(n);
-        return i.target === n.target && b.blockSize === u.blockSize && b.inlineSize === u.inlineSize ? i : n;
-      });
-    });
-    const S = e ?? s.current;
-    S && o.current.observe(S);
-  }, [e]);
-  v(() => (r(), l(), () => r()), [r, l]);
-  const z = c(t);
-  return [
-    s,
-    t,
-    {
-      blockSize: z.blockSize,
-      inlineSize: z.inlineSize
-    }
-  ];
+import { useCallback as e, useLayoutEffect as t, useRef as n, useState as r } from "react";
+//#region src/hooks/useResizeObserver.ts
+var i = (e) => {
+	let t = e?.borderBoxSize?.at(0);
+	return {
+		blockSize: t?.blockSize ?? e?.contentRect.height,
+		inlineSize: t?.inlineSize ?? e?.contentRect.width
+	};
+}, a = (a) => {
+	let [o, s] = r(null), c = n(null), l = n(null), u = e(() => l.current?.disconnect(), []), d = e(() => {
+		l.current = new ResizeObserver(([e]) => {
+			s((t) => {
+				if (!t) return e;
+				let n = i(t), r = i(e);
+				return t.target === e.target && n.blockSize === r.blockSize && n.inlineSize === r.inlineSize ? t : e;
+			});
+		});
+		let e = a ?? c.current;
+		e && l.current.observe(e);
+	}, [a]);
+	t(() => (u(), d(), () => u()), [u, d]);
+	let f = i(o);
+	return [
+		c,
+		o,
+		{
+			blockSize: f.blockSize,
+			inlineSize: f.inlineSize
+		}
+	];
 };
-export {
-  g as default
-};
-//# sourceMappingURL=useResizeObserver.js.map
+//#endregion
+export { a as default };
+
+//# sourceMappingURL=useResizeObserver.js.map

package/hooks/useResizeObserver.js.map

@@ -1 +1 @@
-{"version":3,"file":"useResizeObserver.js","sources":["../../src/hooks/useResizeObserver.ts"],"sourcesContent":["// inspired from https://tobbelindstrom.com/blog/resize-observer-hook/\n\nimport { useRef, useLayoutEffect, useState, useCallback, type MutableRefObject } from 'react';\n\nconst getObservedSize = (entry: ResizeObserverEntry | null) => {\n    const borderBoxSize = entry?.borderBoxSize?.at(0);\n\n    return {\n        blockSize: borderBoxSize?.blockSize ?? entry?.contentRect.height,\n        inlineSize: borderBoxSize?.inlineSize ?? entry?.contentRect.width,\n    };\n};\n\nexport type UseResizeObserverSize = {\n    blockSize: number | undefined;\n    inlineSize: number | undefined;\n};\n\nexport type UseResizeObserverReturn<T extends HTMLElement = HTMLDivElement> = [\n    MutableRefObject<T | null>,\n    ResizeObserverEntry | null,\n    UseResizeObserverSize,\n];\n\n/**\n * Observes size changes of an element with `ResizeObserver`.\n *\n * Use the returned `ref` for the common case where the hook owns the observed element.\n * Alternatively, pass an existing element via `observedElement` to observe it directly.\n *\n * The third tuple item exposes `inlineSize` and `blockSize` with a `borderBoxSize` first\n * strategy and falls back to `contentRect` when needed.\n *\n * @template T The observed element type. Defaults to `HTMLDivElement`.\n * @param observedElement Optional existing DOM element to observe instead of the returned ref target.\n * @returns `[ref, observerEntry, size]`\n *\n * `ref` is the ref object for the observed element when the hook owns that element.\n * `observerEntry` is `null` until the first resize notification arrives.\n * `size` contains `inlineSize` and `blockSize`, preferring `borderBoxSize` and falling back to `contentRect`.\n */\nconst useResizeObserver = <T extends HTMLElement = HTMLDivElement>(\n    observedElement?: T | null\n): UseResizeObserverReturn<T> => {\n    const [observerEntry, setObserverEntry] = useState<ResizeObserverEntry | null>(null);\n\n    const nodeRef = useRef<T | null>(null);\n\n    const observer = useRef<ResizeObserver | null>(null);\n\n    const disconnect = useCallback(() => observer.current?.disconnect(), []);\n\n    const observe = useCallback(() => {\n        observer.current = new ResizeObserver(([entry]) => {\n            setObserverEntry(previousEntry => {\n                if (!previousEntry) {\n                    return entry;\n                }\n\n                const previousSize = getObservedSize(previousEntry);\n                const nextSize = getObservedSize(entry);\n\n                return previousEntry.target === entry.target &&\n                    previousSize.blockSize === nextSize.blockSize &&\n                    previousSize.inlineSize === nextSize.inlineSize\n                    ? previousEntry\n                    : entry;\n            });\n        });\n        const targetElement = observedElement ?? nodeRef.current;\n\n        if (targetElement) {\n            observer.current.observe(targetElement);\n        }\n    }, [observedElement]);\n\n    useLayoutEffect(() => {\n        disconnect();\n        observe();\n        return () => disconnect();\n    }, [disconnect, observe]);\n\n    const observedSize = getObservedSize(observerEntry);\n\n    return [\n        nodeRef,\n        observerEntry,\n        {\n            blockSize: observedSize.blockSize,\n            inlineSize: observedSize.inlineSize,\n        },\n    ];\n};\nexport default useResizeObserver;\n"],"names":["getObservedSize","entry","borderBoxSize","useResizeObserver","observedElement","observerEntry","setObserverEntry","useState","nodeRef","useRef","observer","disconnect","useCallback","observe","previousEntry","previousSize","nextSize","targetElement","useLayoutEffect","observedSize"],"mappings":";AAIA,MAAMA,IAAkB,CAACC,MAAsC;AAC3D,QAAMC,IAAgBD,GAAO,eAAe,GAAG,CAAC;AAEhD,SAAO;AAAA,IACH,WAAWC,GAAe,aAAaD,GAAO,YAAY;AAAA,IAC1D,YAAYC,GAAe,cAAcD,GAAO,YAAY;AAAA,EAAA;AAEpE,GA8BME,IAAoB,CACtBC,MAC6B;AAC7B,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAqC,IAAI,GAE7EC,IAAUC,EAAiB,IAAI,GAE/BC,IAAWD,EAA8B,IAAI,GAE7CE,IAAaC,EAAY,MAAMF,EAAS,SAAS,WAAA,GAAc,EAAE,GAEjEG,IAAUD,EAAY,MAAM;AAC9B,IAAAF,EAAS,UAAU,IAAI,eAAe,CAAC,CAACT,CAAK,MAAM;AAC/C,MAAAK,EAAiB,CAAAQ,MAAiB;AAC9B,YAAI,CAACA;AACD,iBAAOb;AAGX,cAAMc,IAAef,EAAgBc,CAAa,GAC5CE,IAAWhB,EAAgBC,CAAK;AAEtC,eAAOa,EAAc,WAAWb,EAAM,UAClCc,EAAa,cAAcC,EAAS,aACpCD,EAAa,eAAeC,EAAS,aACnCF,IACAb;AAAA,MACV,CAAC;AAAA,IACL,CAAC;AACD,UAAMgB,IAAgBb,KAAmBI,EAAQ;AAEjD,IAAIS,KACAP,EAAS,QAAQ,QAAQO,CAAa;AAAA,EAE9C,GAAG,CAACb,CAAe,CAAC;AAEpB,EAAAc,EAAgB,OACZP,EAAA,GACAE,EAAA,GACO,MAAMF,EAAA,IACd,CAACA,GAAYE,CAAO,CAAC;AAExB,QAAMM,IAAenB,EAAgBK,CAAa;AAElD,SAAO;AAAA,IACHG;AAAA,IACAH;AAAA,IACA;AAAA,MACI,WAAWc,EAAa;AAAA,MACxB,YAAYA,EAAa;AAAA,IAAA;AAAA,EAC7B;AAER;"}
+{"version":3,"file":"useResizeObserver.js","names":[],"sources":["../../src/hooks/useResizeObserver.ts"],"sourcesContent":["// inspired from https://tobbelindstrom.com/blog/resize-observer-hook/\n\nimport { useRef, useLayoutEffect, useState, useCallback, type MutableRefObject } from 'react';\n\nconst getObservedSize = (entry: ResizeObserverEntry | null) => {\n    const borderBoxSize = entry?.borderBoxSize?.at(0);\n\n    return {\n        blockSize: borderBoxSize?.blockSize ?? entry?.contentRect.height,\n        inlineSize: borderBoxSize?.inlineSize ?? entry?.contentRect.width,\n    };\n};\n\nexport type UseResizeObserverSize = {\n    blockSize: number | undefined;\n    inlineSize: number | undefined;\n};\n\nexport type UseResizeObserverReturn<T extends HTMLElement = HTMLDivElement> = [\n    MutableRefObject<T | null>,\n    ResizeObserverEntry | null,\n    UseResizeObserverSize,\n];\n\n/**\n * Observes size changes of an element with `ResizeObserver`.\n *\n * Use the returned `ref` for the common case where the hook owns the observed element.\n * Alternatively, pass an existing element via `observedElement` to observe it directly.\n *\n * The third tuple item exposes `inlineSize` and `blockSize` with a `borderBoxSize` first\n * strategy and falls back to `contentRect` when needed.\n *\n * @template T The observed element type. Defaults to `HTMLDivElement`.\n * @param observedElement Optional existing DOM element to observe instead of the returned ref target.\n * @returns `[ref, observerEntry, size]`\n *\n * `ref` is the ref object for the observed element when the hook owns that element.\n * `observerEntry` is `null` until the first resize notification arrives.\n * `size` contains `inlineSize` and `blockSize`, preferring `borderBoxSize` and falling back to `contentRect`.\n */\nconst useResizeObserver = <T extends HTMLElement = HTMLDivElement>(\n    observedElement?: T | null\n): UseResizeObserverReturn<T> => {\n    const [observerEntry, setObserverEntry] = useState<ResizeObserverEntry | null>(null);\n\n    const nodeRef = useRef<T | null>(null);\n\n    const observer = useRef<ResizeObserver | null>(null);\n\n    const disconnect = useCallback(() => observer.current?.disconnect(), []);\n\n    const observe = useCallback(() => {\n        observer.current = new ResizeObserver(([entry]) => {\n            setObserverEntry(previousEntry => {\n                if (!previousEntry) {\n                    return entry;\n                }\n\n                const previousSize = getObservedSize(previousEntry);\n                const nextSize = getObservedSize(entry);\n\n                return previousEntry.target === entry.target &&\n                    previousSize.blockSize === nextSize.blockSize &&\n                    previousSize.inlineSize === nextSize.inlineSize\n                    ? previousEntry\n                    : entry;\n            });\n        });\n        const targetElement = observedElement ?? nodeRef.current;\n\n        if (targetElement) {\n            observer.current.observe(targetElement);\n        }\n    }, [observedElement]);\n\n    useLayoutEffect(() => {\n        disconnect();\n        observe();\n        return () => disconnect();\n    }, [disconnect, observe]);\n\n    const observedSize = getObservedSize(observerEntry);\n\n    return [\n        nodeRef,\n        observerEntry,\n        {\n            blockSize: observedSize.blockSize,\n            inlineSize: observedSize.inlineSize,\n        },\n    ];\n};\nexport default useResizeObserver;\n"],"mappings":";;AAIA,IAAM,KAAmB,MAAsC;CAC3D,IAAM,IAAgB,GAAO,eAAe,GAAG,CAAC;CAEhD,OAAO;EACH,WAAW,GAAe,aAAa,GAAO,YAAY;EAC1D,YAAY,GAAe,cAAc,GAAO,YAAY;CAChE;AACJ,GA8BM,KACF,MAC6B;CAC7B,IAAM,CAAC,GAAe,KAAoB,EAAqC,IAAI,GAE7E,IAAU,EAAiB,IAAI,GAE/B,IAAW,EAA8B,IAAI,GAE7C,IAAa,QAAkB,EAAS,SAAS,WAAW,GAAG,CAAC,CAAC,GAEjE,IAAU,QAAkB;EAC9B,EAAS,UAAU,IAAI,gBAAgB,CAAC,OAAW;GAC/C,GAAiB,MAAiB;IAC9B,IAAI,CAAC,GACD,OAAO;IAGX,IAAM,IAAe,EAAgB,CAAa,GAC5C,IAAW,EAAgB,CAAK;IAEtC,OAAO,EAAc,WAAW,EAAM,UAClC,EAAa,cAAc,EAAS,aACpC,EAAa,eAAe,EAAS,aACnC,IACA;GACV,CAAC;EACL,CAAC;EACD,IAAM,IAAgB,KAAmB,EAAQ;EAEjD,AAAI,KACA,EAAS,QAAQ,QAAQ,CAAa;CAE9C,GAAG,CAAC,CAAe,CAAC;CAEpB,SACI,EAAW,GACX,EAAQ,SACK,EAAW,IACzB,CAAC,GAAY,CAAO,CAAC;CAExB,IAAM,IAAe,EAAgB,CAAa;CAElD,OAAO;EACH;EACA;EACA;GACI,WAAW,EAAa;GACxB,YAAY,EAAa;EAC7B;CACJ;AACJ"}

package/hooks/useRioCookieConsent.js

@@ -1,47 +1,43 @@
-import { useCallback as c } from "react";
-import a from "./useCookies.js";
-const n = (e) => {
-  if (!e)
-    return {
-      cookieName: "cookie_settings",
-      isSet: !1,
-      uxCookiesAccepted: !1,
-      marketingCookiesAccepted: !1,
-      status: "missing"
-    };
-  try {
-    const t = JSON.parse(e), s = t["switch-49"] === 1, o = t["switch-2"] === 1;
-    let i = "custom";
-    return s && !o ? i = "ux-cookies-accepted" : !s && o && (i = "marketing-cookies-accepted"), {
-      cookieName: "cookie_settings",
-      isSet: !0,
-      rawValue: e,
-      parsedValue: {
-        "switch-2": Number(t["switch-2"]),
-        "switch-49": Number(t["switch-49"])
-      },
-      uxCookiesAccepted: s,
-      marketingCookiesAccepted: o,
-      status: i
-    };
-  } catch {
-    return {
-      cookieName: "cookie_settings",
-      isSet: !0,
-      rawValue: e,
-      uxCookiesAccepted: !1,
-      marketingCookiesAccepted: !1,
-      status: "invalid"
-    };
-  }
-}, u = () => {
-  const { getCookie: e } = a();
-  return { getRioCookieConsentInfo: c(
-    () => n(e("cookie_settings")),
-    [e]
-  ) };
+import e from "./useCookies.js";
+import { useCallback as t } from "react";
+//#region src/hooks/useRioCookieConsent.ts
+var n = (e) => {
+	if (!e) return {
+		cookieName: "cookie_settings",
+		isSet: !1,
+		uxCookiesAccepted: !1,
+		marketingCookiesAccepted: !1,
+		status: "missing"
+	};
+	try {
+		let t = JSON.parse(e), n = t["switch-49"] === 1, r = t["switch-2"] === 1, i = "custom";
+		return n && !r ? i = "ux-cookies-accepted" : !n && r && (i = "marketing-cookies-accepted"), {
+			cookieName: "cookie_settings",
+			isSet: !0,
+			rawValue: e,
+			parsedValue: {
+				"switch-2": Number(t["switch-2"]),
+				"switch-49": Number(t["switch-49"])
+			},
+			uxCookiesAccepted: n,
+			marketingCookiesAccepted: r,
+			status: i
+		};
+	} catch {
+		return {
+			cookieName: "cookie_settings",
+			isSet: !0,
+			rawValue: e,
+			uxCookiesAccepted: !1,
+			marketingCookiesAccepted: !1,
+			status: "invalid"
+		};
+	}
+}, r = () => {
+	let { getCookie: r } = e();
+	return { getRioCookieConsentInfo: t(() => n(r("cookie_settings")), [r]) };
 };
-export {
-  u as default
-};
-//# sourceMappingURL=useRioCookieConsent.js.map
+//#endregion
+export { r as default };
+
+//# sourceMappingURL=useRioCookieConsent.js.map

package/hooks/useRioCookieConsent.js.map

@@ -1 +1 @@
-{"version":3,"file":"useRioCookieConsent.js","sources":["../../src/hooks/useRioCookieConsent.ts"],"sourcesContent":["import { useCallback } from 'react';\n\nimport useCookies from './useCookies';\n\nexport type RioCookieConsentStatus =\n    | 'missing'\n    | 'invalid'\n    | 'ux-cookies-accepted'\n    | 'marketing-cookies-accepted'\n    | 'custom';\n\nexport type RioCookieConsentInfo = {\n    /**\n     * Name of the RIO consent cookie.\n     */\n    cookieName: 'cookie_settings';\n\n    /**\n     * Indicates whether the consent cookie exists.\n     */\n    isSet: boolean;\n\n    /**\n     * Raw cookie value as read from `document.cookie`.\n     */\n    rawValue?: string;\n\n    /**\n     * Parsed and normalized cookie switches when JSON parsing succeeds.\n     */\n    parsedValue?: Record<string, number>;\n\n    /**\n     * True when UX cookies are accepted (`switch-49 === 1`).\n     */\n    uxCookiesAccepted: boolean;\n\n    /**\n     * True when marketing cookies are accepted (`switch-2 === 1`).\n     */\n    marketingCookiesAccepted: boolean;\n\n    /**\n     * Computed consent status derived from parsed cookie values.\n     */\n    status: RioCookieConsentStatus;\n};\n\nexport type UseRioCookieConsentResult = {\n    /**\n     * Reads and parses the RIO cookie consent settings.\n     */\n    getRioCookieConsentInfo: () => RioCookieConsentInfo;\n};\n\nconst evaluateRioCookieSettings = (cookieValue?: string): RioCookieConsentInfo => {\n    if (!cookieValue) {\n        return {\n            cookieName: 'cookie_settings',\n            isSet: false,\n            uxCookiesAccepted: false,\n            marketingCookiesAccepted: false,\n            status: 'missing',\n        };\n    }\n\n    try {\n        const parsed = JSON.parse(cookieValue) as Record<string, unknown>;\n        const uxCookiesAccepted = parsed['switch-49'] === 1;\n        const marketingCookiesAccepted = parsed['switch-2'] === 1;\n\n        let status: RioCookieConsentStatus = 'custom';\n        if (uxCookiesAccepted && !marketingCookiesAccepted) {\n            status = 'ux-cookies-accepted';\n        } else if (!uxCookiesAccepted && marketingCookiesAccepted) {\n            status = 'marketing-cookies-accepted';\n        }\n\n        return {\n            cookieName: 'cookie_settings',\n            isSet: true,\n            rawValue: cookieValue,\n            parsedValue: {\n                'switch-2': Number(parsed['switch-2']),\n                'switch-49': Number(parsed['switch-49']),\n            },\n            uxCookiesAccepted,\n            marketingCookiesAccepted,\n            status,\n        };\n    } catch {\n        return {\n            cookieName: 'cookie_settings',\n            isSet: true,\n            rawValue: cookieValue,\n            uxCookiesAccepted: false,\n            marketingCookiesAccepted: false,\n            status: 'invalid',\n        };\n    }\n};\n\n/**\n * Returns helpers for reading RIO's cookie consent state from `cookie_settings`.\n *\n * @returns {UseRioCookieConsentResult} Cookie consent helper functions.\n *\n * @example\n * const { getRioCookieConsentInfo } = useRioCookieConsent();\n * const consent = getRioCookieConsentInfo();\n * const uxAccepted = consent.uxCookiesAccepted;\n */\nconst useRioCookieConsent = (): UseRioCookieConsentResult => {\n    const { getCookie } = useCookies();\n\n    const getRioCookieConsentInfo = useCallback(\n        () => evaluateRioCookieSettings(getCookie('cookie_settings')),\n        [getCookie]\n    );\n\n    return { getRioCookieConsentInfo };\n};\n\nexport default useRioCookieConsent;\n"],"names":["evaluateRioCookieSettings","cookieValue","parsed","uxCookiesAccepted","marketingCookiesAccepted","status","useRioCookieConsent","getCookie","useCookies","useCallback"],"mappings":";;AAuDA,MAAMA,IAA4B,CAACC,MAA+C;AAC9E,MAAI,CAACA;AACD,WAAO;AAAA,MACH,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,mBAAmB;AAAA,MACnB,0BAA0B;AAAA,MAC1B,QAAQ;AAAA,IAAA;AAIhB,MAAI;AACA,UAAMC,IAAS,KAAK,MAAMD,CAAW,GAC/BE,IAAoBD,EAAO,WAAW,MAAM,GAC5CE,IAA2BF,EAAO,UAAU,MAAM;AAExD,QAAIG,IAAiC;AACrC,WAAIF,KAAqB,CAACC,IACtBC,IAAS,wBACF,CAACF,KAAqBC,MAC7BC,IAAS,+BAGN;AAAA,MACH,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,UAAUJ;AAAA,MACV,aAAa;AAAA,QACT,YAAY,OAAOC,EAAO,UAAU,CAAC;AAAA,QACrC,aAAa,OAAOA,EAAO,WAAW,CAAC;AAAA,MAAA;AAAA,MAE3C,mBAAAC;AAAA,MACA,0BAAAC;AAAA,MACA,QAAAC;AAAA,IAAA;AAAA,EAER,QAAQ;AACJ,WAAO;AAAA,MACH,YAAY;AAAA,MACZ,OAAO;AAAA,MACP,UAAUJ;AAAA,MACV,mBAAmB;AAAA,MACnB,0BAA0B;AAAA,MAC1B,QAAQ;AAAA,IAAA;AAAA,EAEhB;AACJ,GAYMK,IAAsB,MAAiC;AACzD,QAAM,EAAE,WAAAC,EAAA,IAAcC,EAAA;AAOtB,SAAO,EAAE,yBALuBC;AAAA,IAC5B,MAAMT,EAA0BO,EAAU,iBAAiB,CAAC;AAAA,IAC5D,CAACA,CAAS;AAAA,EAAA,EAGL;AACb;"}
+{"version":3,"file":"useRioCookieConsent.js","names":[],"sources":["../../src/hooks/useRioCookieConsent.ts"],"sourcesContent":["import { useCallback } from 'react';\n\nimport useCookies from './useCookies';\n\nexport type RioCookieConsentStatus =\n    | 'missing'\n    | 'invalid'\n    | 'ux-cookies-accepted'\n    | 'marketing-cookies-accepted'\n    | 'custom';\n\nexport type RioCookieConsentInfo = {\n    /**\n     * Name of the RIO consent cookie.\n     */\n    cookieName: 'cookie_settings';\n\n    /**\n     * Indicates whether the consent cookie exists.\n     */\n    isSet: boolean;\n\n    /**\n     * Raw cookie value as read from `document.cookie`.\n     */\n    rawValue?: string;\n\n    /**\n     * Parsed and normalized cookie switches when JSON parsing succeeds.\n     */\n    parsedValue?: Record<string, number>;\n\n    /**\n     * True when UX cookies are accepted (`switch-49 === 1`).\n     */\n    uxCookiesAccepted: boolean;\n\n    /**\n     * True when marketing cookies are accepted (`switch-2 === 1`).\n     */\n    marketingCookiesAccepted: boolean;\n\n    /**\n     * Computed consent status derived from parsed cookie values.\n     */\n    status: RioCookieConsentStatus;\n};\n\nexport type UseRioCookieConsentResult = {\n    /**\n     * Reads and parses the RIO cookie consent settings.\n     */\n    getRioCookieConsentInfo: () => RioCookieConsentInfo;\n};\n\nconst evaluateRioCookieSettings = (cookieValue?: string): RioCookieConsentInfo => {\n    if (!cookieValue) {\n        return {\n            cookieName: 'cookie_settings',\n            isSet: false,\n            uxCookiesAccepted: false,\n            marketingCookiesAccepted: false,\n            status: 'missing',\n        };\n    }\n\n    try {\n        const parsed = JSON.parse(cookieValue) as Record<string, unknown>;\n        const uxCookiesAccepted = parsed['switch-49'] === 1;\n        const marketingCookiesAccepted = parsed['switch-2'] === 1;\n\n        let status: RioCookieConsentStatus = 'custom';\n        if (uxCookiesAccepted && !marketingCookiesAccepted) {\n            status = 'ux-cookies-accepted';\n        } else if (!uxCookiesAccepted && marketingCookiesAccepted) {\n            status = 'marketing-cookies-accepted';\n        }\n\n        return {\n            cookieName: 'cookie_settings',\n            isSet: true,\n            rawValue: cookieValue,\n            parsedValue: {\n                'switch-2': Number(parsed['switch-2']),\n                'switch-49': Number(parsed['switch-49']),\n            },\n            uxCookiesAccepted,\n            marketingCookiesAccepted,\n            status,\n        };\n    } catch {\n        return {\n            cookieName: 'cookie_settings',\n            isSet: true,\n            rawValue: cookieValue,\n            uxCookiesAccepted: false,\n            marketingCookiesAccepted: false,\n            status: 'invalid',\n        };\n    }\n};\n\n/**\n * Returns helpers for reading RIO's cookie consent state from `cookie_settings`.\n *\n * @returns {UseRioCookieConsentResult} Cookie consent helper functions.\n *\n * @example\n * const { getRioCookieConsentInfo } = useRioCookieConsent();\n * const consent = getRioCookieConsentInfo();\n * const uxAccepted = consent.uxCookiesAccepted;\n */\nconst useRioCookieConsent = (): UseRioCookieConsentResult => {\n    const { getCookie } = useCookies();\n\n    const getRioCookieConsentInfo = useCallback(\n        () => evaluateRioCookieSettings(getCookie('cookie_settings')),\n        [getCookie]\n    );\n\n    return { getRioCookieConsentInfo };\n};\n\nexport default useRioCookieConsent;\n"],"mappings":";;;AAuDA,IAAM,KAA6B,MAA+C;CAC9E,IAAI,CAAC,GACD,OAAO;EACH,YAAY;EACZ,OAAO;EACP,mBAAmB;EACnB,0BAA0B;EAC1B,QAAQ;CACZ;CAGJ,IAAI;EACA,IAAM,IAAS,KAAK,MAAM,CAAW,GAC/B,IAAoB,EAAO,iBAAiB,GAC5C,IAA2B,EAAO,gBAAgB,GAEpD,IAAiC;EAOrC,OANI,KAAqB,CAAC,IACtB,IAAS,wBACF,CAAC,KAAqB,MAC7B,IAAS,+BAGN;GACH,YAAY;GACZ,OAAO;GACP,UAAU;GACV,aAAa;IACT,YAAY,OAAO,EAAO,WAAW;IACrC,aAAa,OAAO,EAAO,YAAY;GAC3C;GACA;GACA;GACA;EACJ;CACJ,QAAQ;EACJ,OAAO;GACH,YAAY;GACZ,OAAO;GACP,UAAU;GACV,mBAAmB;GACnB,0BAA0B;GAC1B,QAAQ;EACZ;CACJ;AACJ,GAYM,UAAuD;CACzD,IAAM,EAAE,iBAAc,EAAW;CAOjC,OAAO,EAAE,yBALuB,QACtB,EAA0B,EAAU,iBAAiB,CAAC,GAC5D,CAAC,CAAS,CAGL,EAAwB;AACrC"}

package/hooks/useScrollPosition.js

@@ -1,25 +1,26 @@
-import { useState as c, useEffect as i } from "react";
-const f = () => document.querySelector(".module-content > .scrollbar-view"), d = (e) => {
-  const [n, l] = c(null), [u, o] = c(0);
-  i(() => {
-    let t = null;
-    return e ? e && t ? clearInterval(t) : e instanceof Object && "current" in e && e.current ? l(e.current) : l(e) : t = setInterval(() => {
-      const s = f();
-      s && l(s);
-    }, 300), () => {
-      t && clearInterval(t);
-    };
-  }, [e]);
-  const r = () => {
-    requestAnimationFrame(() => {
-      o(n === window ? window.scrollY : n.scrollTop);
-    });
-  };
-  return i(() => (n instanceof EventTarget && n.addEventListener("scroll", r), () => {
-    n instanceof EventTarget && n.removeEventListener("scroll", r);
-  }), [n]), u;
+import { useEffect as e, useState as t } from "react";
+//#region src/hooks/useScrollPosition.ts
+var n = () => document.querySelector(".module-content > .scrollbar-view"), r = (r) => {
+	let [i, a] = t(null), [o, s] = t(0);
+	e(() => {
+		let e = null;
+		return r ? r && e ? clearInterval(e) : r instanceof Object && "current" in r && r.current ? a(r.current) : a(r) : e = setInterval(() => {
+			let e = n();
+			e && a(e);
+		}, 300), () => {
+			e && clearInterval(e);
+		};
+	}, [r]);
+	let c = () => {
+		requestAnimationFrame(() => {
+			s(i === window ? window.scrollY : i.scrollTop);
+		});
+	};
+	return e(() => (i instanceof EventTarget && i.addEventListener("scroll", c), () => {
+		i instanceof EventTarget && i.removeEventListener("scroll", c);
+	}), [i]), o;
 };
-export {
-  d as default
-};
-//# sourceMappingURL=useScrollPosition.js.map
+//#endregion
+export { r as default };
+
+//# sourceMappingURL=useScrollPosition.js.map

package/hooks/useScrollPosition.js.map

@@ -1 +1 @@
-{"version":3,"file":"useScrollPosition.js","sources":["../../src/hooks/useScrollPosition.ts"],"sourcesContent":["import { useState, useEffect, type RefObject } from 'react';\n\nexport type TargetType =\n    | Window\n    | Document\n    | HTMLBodyElement\n    | HTMLElement\n    | Element\n    | React.ReactElement\n    | RefObject<HTMLElement>;\n\nconst getModuleContent = () => document.querySelector('.module-content > .scrollbar-view');\n\n// \"target\" can be \"window\", \"document.body\", a \"ref\" or undefined\n// where in later case the module-content is taken as default\n\n/**\n * A custom hook that tracks the scroll position of a target element.\n *\n * @param target The target element for scroll position tracking.\n * @returns The current scroll position of the target element.\n */\nconst useScrollPosition = (target?: TargetType): number => {\n    const [targetElement, setTargetElement] = useState<TargetType | null>(null);\n    const [scrollPosition, setScrollPosition] = useState(0);\n\n    useEffect(() => {\n        let checkForModuleContent: number | null = null;\n\n        // In case the target is undefined it might be that the module-content is\n        // not rendered yet, hence check periodically for the existence in the DOM\n        if (!target) {\n            checkForModuleContent = setInterval(() => {\n                const element = getModuleContent();\n                if (element) {\n                    setTargetElement(element);\n                }\n            }, 300);\n        } else if (target && checkForModuleContent) {\n            clearInterval(checkForModuleContent);\n        }\n\n        // In case the target is a \"ref\" - set the targetElement when current is defined\n        else if (target instanceof Object && 'current' in target && target.current) {\n            setTargetElement(target.current);\n        }\n\n        // In case it's \"window\" or \"document.body\"\n        else {\n            setTargetElement(target);\n        }\n\n        return () => {\n            if (checkForModuleContent) {\n                clearInterval(checkForModuleContent);\n            }\n        };\n    }, [target]);\n\n    const handleScroll = () => {\n        requestAnimationFrame(() => {\n            if (targetElement === window) {\n                setScrollPosition(window.scrollY);\n            } else {\n                setScrollPosition((targetElement as HTMLElement).scrollTop);\n            }\n        });\n    };\n\n    useEffect(() => {\n        if (targetElement instanceof EventTarget) {\n            targetElement.addEventListener('scroll', handleScroll);\n        }\n\n        return () => {\n            if (targetElement instanceof EventTarget) {\n                targetElement.removeEventListener('scroll', handleScroll);\n            }\n        };\n    }, [targetElement]);\n\n    return scrollPosition;\n};\n\nexport default useScrollPosition;\n"],"names":["getModuleContent","useScrollPosition","target","targetElement","setTargetElement","useState","scrollPosition","setScrollPosition","useEffect","checkForModuleContent","element","handleScroll"],"mappings":";AAWA,MAAMA,IAAmB,MAAM,SAAS,cAAc,mCAAmC,GAWnFC,IAAoB,CAACC,MAAgC;AACvD,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAA4B,IAAI,GACpE,CAACC,GAAgBC,CAAiB,IAAIF,EAAS,CAAC;AAEtD,EAAAG,EAAU,MAAM;AACZ,QAAIC,IAAuC;AAI3C,WAAKP,IAOMA,KAAUO,IACjB,cAAcA,CAAqB,IAI9BP,aAAkB,UAAU,aAAaA,KAAUA,EAAO,UAC/DE,EAAiBF,EAAO,OAAO,IAK/BE,EAAiBF,CAAM,IAjBvBO,IAAwB,YAAY,MAAM;AACtC,YAAMC,IAAUV,EAAA;AAChB,MAAIU,KACAN,EAAiBM,CAAO;AAAA,IAEhC,GAAG,GAAG,GAeH,MAAM;AACT,MAAID,KACA,cAAcA,CAAqB;AAAA,IAE3C;AAAA,EACJ,GAAG,CAACP,CAAM,CAAC;AAEX,QAAMS,IAAe,MAAM;AACvB,0BAAsB,MAAM;AACxB,MACIJ,EADAJ,MAAkB,SACA,OAAO,UAENA,EAA8B,SAFjB;AAAA,IAIxC,CAAC;AAAA,EACL;AAEA,SAAAK,EAAU,OACFL,aAAyB,eACzBA,EAAc,iBAAiB,UAAUQ,CAAY,GAGlD,MAAM;AACT,IAAIR,aAAyB,eACzBA,EAAc,oBAAoB,UAAUQ,CAAY;AAAA,EAEhE,IACD,CAACR,CAAa,CAAC,GAEXG;AACX;"}
+{"version":3,"file":"useScrollPosition.js","names":[],"sources":["../../src/hooks/useScrollPosition.ts"],"sourcesContent":["import { useState, useEffect, type RefObject } from 'react';\n\nexport type TargetType =\n    | Window\n    | Document\n    | HTMLBodyElement\n    | HTMLElement\n    | Element\n    | React.ReactElement\n    | RefObject<HTMLElement>;\n\nconst getModuleContent = () => document.querySelector('.module-content > .scrollbar-view');\n\n// \"target\" can be \"window\", \"document.body\", a \"ref\" or undefined\n// where in later case the module-content is taken as default\n\n/**\n * A custom hook that tracks the scroll position of a target element.\n *\n * @param target The target element for scroll position tracking.\n * @returns The current scroll position of the target element.\n */\nconst useScrollPosition = (target?: TargetType): number => {\n    const [targetElement, setTargetElement] = useState<TargetType | null>(null);\n    const [scrollPosition, setScrollPosition] = useState(0);\n\n    useEffect(() => {\n        let checkForModuleContent: number | null = null;\n\n        // In case the target is undefined it might be that the module-content is\n        // not rendered yet, hence check periodically for the existence in the DOM\n        if (!target) {\n            checkForModuleContent = setInterval(() => {\n                const element = getModuleContent();\n                if (element) {\n                    setTargetElement(element);\n                }\n            }, 300);\n        } else if (target && checkForModuleContent) {\n            clearInterval(checkForModuleContent);\n        }\n\n        // In case the target is a \"ref\" - set the targetElement when current is defined\n        else if (target instanceof Object && 'current' in target && target.current) {\n            setTargetElement(target.current);\n        }\n\n        // In case it's \"window\" or \"document.body\"\n        else {\n            setTargetElement(target);\n        }\n\n        return () => {\n            if (checkForModuleContent) {\n                clearInterval(checkForModuleContent);\n            }\n        };\n    }, [target]);\n\n    const handleScroll = () => {\n        requestAnimationFrame(() => {\n            if (targetElement === window) {\n                setScrollPosition(window.scrollY);\n            } else {\n                setScrollPosition((targetElement as HTMLElement).scrollTop);\n            }\n        });\n    };\n\n    useEffect(() => {\n        if (targetElement instanceof EventTarget) {\n            targetElement.addEventListener('scroll', handleScroll);\n        }\n\n        return () => {\n            if (targetElement instanceof EventTarget) {\n                targetElement.removeEventListener('scroll', handleScroll);\n            }\n        };\n    }, [targetElement]);\n\n    return scrollPosition;\n};\n\nexport default useScrollPosition;\n"],"mappings":";;AAWA,IAAM,UAAyB,SAAS,cAAc,mCAAmC,GAWnF,KAAqB,MAAgC;CACvD,IAAM,CAAC,GAAe,KAAoB,EAA4B,IAAI,GACpE,CAAC,GAAgB,KAAqB,EAAS,CAAC;CAEtD,QAAgB;EACZ,IAAI,IAAuC;EAyB3C,OArBK,IAOM,KAAU,IACjB,cAAc,CAAqB,IAI9B,aAAkB,UAAU,aAAa,KAAU,EAAO,UAC/D,EAAiB,EAAO,OAAO,IAK/B,EAAiB,CAAM,IAjBvB,IAAwB,kBAAkB;GACtC,IAAM,IAAU,EAAiB;GACjC,AAAI,KACA,EAAiB,CAAO;EAEhC,GAAG,GAAG,SAeG;GACT,AAAI,KACA,cAAc,CAAqB;EAE3C;CACJ,GAAG,CAAC,CAAM,CAAC;CAEX,IAAM,UAAqB;EACvB,4BAA4B;GACxB,AACI,EADA,MAAkB,SACA,OAAO,UAEN,EAA8B,SAAS;EAElE,CAAC;CACL;CAcA,OAZA,SACQ,aAAyB,eACzB,EAAc,iBAAiB,UAAU,CAAY,SAG5C;EACT,AAAI,aAAyB,eACzB,EAAc,oBAAoB,UAAU,CAAY;CAEhE,IACD,CAAC,CAAa,CAAC,GAEX;AACX"}

package/hooks/useSearch.js

@@ -1,42 +1,42 @@
-import { useState as i, useMemo as b, useCallback as V, useEffect as h } from "react";
-import { debounce as v } from "es-toolkit/function";
-const y = (r, e) => e.split(".").reduce((t, s) => t ? t[s] : void 0, r), C = (r) => Object.keys(r).filter((e) => {
-  const t = r[e];
-  return typeof t == "string" || typeof t == "number";
-}), w = (r, e = {}) => {
-  const [t, s] = i(""), [l, a] = i(""), f = b(() => e.debounceMs ? v((c) => a(c), e.debounceMs) : null, [e.debounceMs]), m = V(
-    (u) => {
-      if (s(u), !f) {
-        a(u);
-        return;
-      }
-      f(u);
-    },
-    [f]
-  );
-  h(() => {
-    e.debounceMs || a(t);
-  }, [e.debounceMs, t]);
-  const S = b(() => {
-    const u = e.debounceMs ? l : t;
-    if (!t)
-      return r;
-    if (r.length === 0)
-      return [];
-    const c = e.caseSensitive ?? !1, d = c ? u : u.toLowerCase();
-    if (e.customFilter)
-      return r.filter((o) => e.customFilter?.(o, u));
-    const g = e.fields ?? C(r[0]);
-    return r.filter(
-      (o) => g.some((M) => {
-        const n = y(o, M.toString());
-        return typeof n == "string" ? (c ? n : n.toLowerCase()).includes(d) : typeof n == "number" ? n.toString().includes(d) : !1;
-      })
-    );
-  }, [l, r, e, t]);
-  return { searchValue: t, setSearchValue: m, filteredList: S };
+import { useCallback as e, useEffect as t, useMemo as n, useState as r } from "react";
+import { debounce as i } from "es-toolkit/function";
+//#region src/hooks/useSearch.ts
+var a = (e, t) => t.split(".").reduce((e, t) => e ? e[t] : void 0, e), o = (e) => Object.keys(e).filter((t) => {
+	let n = e[t];
+	return typeof n == "string" || typeof n == "number";
+}), s = (s, c = {}) => {
+	let [l, u] = r(""), [d, f] = r(""), p = n(() => c.debounceMs ? i((e) => f(e), c.debounceMs) : null, [c.debounceMs]), m = e((e) => {
+		if (u(e), !p) {
+			f(e);
+			return;
+		}
+		p(e);
+	}, [p]);
+	return t(() => {
+		c.debounceMs || f(l);
+	}, [c.debounceMs, l]), {
+		searchValue: l,
+		setSearchValue: m,
+		filteredList: n(() => {
+			let e = c.debounceMs ? d : l;
+			if (!l) return s;
+			if (s.length === 0) return [];
+			let t = c.caseSensitive ?? !1, n = t ? e : e.toLowerCase();
+			if (c.customFilter) return s.filter((t) => c.customFilter?.(t, e));
+			let r = c.fields ?? o(s[0]);
+			return s.filter((e) => r.some((r) => {
+				let i = a(e, r.toString());
+				return typeof i == "string" ? (t ? i : i.toLowerCase()).includes(n) : typeof i == "number" && i.toString().includes(n);
+			}));
+		}, [
+			d,
+			s,
+			c,
+			l
+		])
+	};
 };
-export {
-  w as default
-};
-//# sourceMappingURL=useSearch.js.map
+//#endregion
+export { s as default };
+
+//# sourceMappingURL=useSearch.js.map

package/hooks/useSearch.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSearch.js","sources":["../../src/hooks/useSearch.ts"],"sourcesContent":["import { useMemo, useState, useCallback, useEffect } from 'react';\nimport { debounce } from 'es-toolkit/function';\n\n/**\n * Options for configuring the `useSearch` hook.\n */\ntype UseSearchOptions<T> = {\n    /**\n     * List of object fields to search within. Dot notation (e.g. `'address.city'`) is supported for nested properties.\n     * If omitted, all top-level string and number fields will be used.\n     */\n    fields?: (keyof T | string)[]; // `string` to allow dot notation\n\n    /**\n     * Optional custom filtering function.\n     * If provided, this takes precedence over field-based filtering.\n     *\n     * @param item - The current item in the list.\n     * @param query - The current search query string.\n     * @returns `true` if the item should be included in the filtered list.\n     */\n    customFilter?: (item: T, query: string) => boolean;\n\n    /**\n     * Number of milliseconds to debounce the search input.\n     * If omitted, debounce is disabled.\n     */\n    debounceMs?: number;\n\n    /**\n     * Whether to perform a case-sensitive match.\n     * Default is `false` (case-insensitive).\n     *\n     * @default false\n     */\n    caseSensitive?: boolean;\n};\n\n/**\n * Gets the value of a nested field from an object using dot notation.\n *\n * @param obj - The object to traverse.\n * @param path - The dot-notated path string.\n * @returns The value at the specified path, or undefined.\n */\nconst getNestedValue = (obj: any, path: string): unknown =>\n    path.split('.').reduce((val, key) => (val ? val[key] : undefined), obj);\n\nconst inferSearchableFields = <T extends object>(item: T): string[] =>\n    Object.keys(item).filter(key => {\n        const value = (item as any)[key];\n        return typeof value === 'string' || typeof value === 'number';\n    });\n\n/**\n * A hook to filter a list of objects by a search value.\n * Supports field-based filtering, custom filtering logic, debounce, and case sensitivity.\n *\n * @template T - The type of items in the list (must be an object).\n *\n * @param list - The array of objects to search through.\n * @param options - Configuration options for the search behavior.\n * @param options.fields - Fields to search through. If omitted, all top-level string/number fields are used.\n * @param options.customFilter - Optional custom filter function overriding field-based filtering.\n * @param options.debounceMs - Debounce time in milliseconds.\n * @param options.caseSensitive - Whether the search should be case-sensitive.\n *\n * @returns An object containing:\n * - `searchValue`: The current search input string.\n * - `setSearchValue`: A setter function to update the search query.\n * - `filteredList`: The list of items matching the current search query.\n *\n * @example\n * ```ts\n * const { searchValue, setSearchValue, filteredList } = useSearch(users, {\n *   fields: ['name', 'email'],\n *   debounceMs: 300,\n * });\n * ```\n */\nconst useSearch = <T extends object>(list: T[], options: UseSearchOptions<T> = {}) => {\n    // what the input renders (must update immediately)\n    const [searchValue, _setSearchValue] = useState('');\n\n    // what filtering uses (debounced if configured)\n    const [debouncedValue, setDebouncedValue] = useState('');\n\n    // stable debounced updater\n    const debouncedUpdate = useMemo(() => {\n        if (!options.debounceMs) {\n            return null;\n        }\n\n        const fn = debounce((query: string) => setDebouncedValue(query), options.debounceMs);\n        return fn;\n    }, [options.debounceMs]);\n\n    // setter exposed to consumers\n    const setSearchValue = useCallback(\n        (query: string) => {\n            _setSearchValue(query);\n\n            if (!debouncedUpdate) {\n                setDebouncedValue(query);\n                return;\n            }\n\n            debouncedUpdate(query);\n        },\n        [debouncedUpdate]\n    );\n\n    // keep debouncedValue in sync for the \"no debounce\" case and initial render\n    useEffect(() => {\n        if (!options.debounceMs) {\n            setDebouncedValue(searchValue);\n        }\n    }, [options.debounceMs, searchValue]);\n\n    const filteredList = useMemo(() => {\n        const activeQueryValue = options.debounceMs ? debouncedValue : searchValue;\n\n        if (!searchValue) {\n            return list;\n        }\n        if (list.length === 0) {\n            return [];\n        }\n\n        const isCaseSensitive = options.caseSensitive ?? false;\n        const query = isCaseSensitive ? activeQueryValue : activeQueryValue.toLowerCase();\n\n        // Custom filter takes precedence\n        if (options.customFilter) {\n            return list.filter(item => options.customFilter?.(item, activeQueryValue));\n        }\n\n        const fields = options.fields ?? inferSearchableFields(list[0]);\n\n        return list.filter(item =>\n            fields.some(field => {\n                const value = getNestedValue(item, field.toString());\n\n                if (typeof value === 'string') {\n                    const target = isCaseSensitive ? value : value.toLowerCase();\n                    return target.includes(query);\n                }\n\n                if (typeof value === 'number') {\n                    return value.toString().includes(query);\n                }\n\n                return false;\n            })\n        );\n    }, [debouncedValue, list, options, searchValue]);\n\n    return { searchValue, setSearchValue, filteredList };\n};\n\nexport default useSearch;\n"],"names":["getNestedValue","obj","path","val","key","inferSearchableFields","item","value","useSearch","list","options","searchValue","_setSearchValue","useState","debouncedValue","setDebouncedValue","debouncedUpdate","useMemo","debounce","query","setSearchValue","useCallback","useEffect","filteredList","activeQueryValue","isCaseSensitive","fields","field"],"mappings":";;AA6CA,MAAMA,IAAiB,CAACC,GAAUC,MAC9BA,EAAK,MAAM,GAAG,EAAE,OAAO,CAACC,GAAKC,MAASD,IAAMA,EAAIC,CAAG,IAAI,QAAYH,CAAG,GAEpEI,IAAwB,CAAmBC,MAC7C,OAAO,KAAKA,CAAI,EAAE,OAAO,CAAAF,MAAO;AAC5B,QAAMG,IAASD,EAAaF,CAAG;AAC/B,SAAO,OAAOG,KAAU,YAAY,OAAOA,KAAU;AACzD,CAAC,GA4BCC,IAAY,CAAmBC,GAAWC,IAA+B,OAAO;AAElF,QAAM,CAACC,GAAaC,CAAe,IAAIC,EAAS,EAAE,GAG5C,CAACC,GAAgBC,CAAiB,IAAIF,EAAS,EAAE,GAGjDG,IAAkBC,EAAQ,MACvBP,EAAQ,aAIFQ,EAAS,CAACC,MAAkBJ,EAAkBI,CAAK,GAAGT,EAAQ,UAAU,IAHxE,MAKZ,CAACA,EAAQ,UAAU,CAAC,GAGjBU,IAAiBC;AAAA,IACnB,CAACF,MAAkB;AAGf,UAFAP,EAAgBO,CAAK,GAEjB,CAACH,GAAiB;AAClB,QAAAD,EAAkBI,CAAK;AACvB;AAAA,MACJ;AAEA,MAAAH,EAAgBG,CAAK;AAAA,IACzB;AAAA,IACA,CAACH,CAAe;AAAA,EAAA;AAIpB,EAAAM,EAAU,MAAM;AACZ,IAAKZ,EAAQ,cACTK,EAAkBJ,CAAW;AAAA,EAErC,GAAG,CAACD,EAAQ,YAAYC,CAAW,CAAC;AAEpC,QAAMY,IAAeN,EAAQ,MAAM;AAC/B,UAAMO,IAAmBd,EAAQ,aAAaI,IAAiBH;AAE/D,QAAI,CAACA;AACD,aAAOF;AAEX,QAAIA,EAAK,WAAW;AAChB,aAAO,CAAA;AAGX,UAAMgB,IAAkBf,EAAQ,iBAAiB,IAC3CS,IAAQM,IAAkBD,IAAmBA,EAAiB,YAAA;AAGpE,QAAId,EAAQ;AACR,aAAOD,EAAK,OAAO,CAAAH,MAAQI,EAAQ,eAAeJ,GAAMkB,CAAgB,CAAC;AAG7E,UAAME,IAAShB,EAAQ,UAAUL,EAAsBI,EAAK,CAAC,CAAC;AAE9D,WAAOA,EAAK;AAAA,MAAO,CAAAH,MACfoB,EAAO,KAAK,CAAAC,MAAS;AACjB,cAAMpB,IAAQP,EAAeM,GAAMqB,EAAM,UAAU;AAEnD,eAAI,OAAOpB,KAAU,YACFkB,IAAkBlB,IAAQA,EAAM,YAAA,GACjC,SAASY,CAAK,IAG5B,OAAOZ,KAAU,WACVA,EAAM,WAAW,SAASY,CAAK,IAGnC;AAAA,MACX,CAAC;AAAA,IAAA;AAAA,EAET,GAAG,CAACL,GAAgBL,GAAMC,GAASC,CAAW,CAAC;AAE/C,SAAO,EAAE,aAAAA,GAAa,gBAAAS,GAAgB,cAAAG,EAAA;AAC1C;"}
+{"version":3,"file":"useSearch.js","names":[],"sources":["../../src/hooks/useSearch.ts"],"sourcesContent":["import { useMemo, useState, useCallback, useEffect } from 'react';\nimport { debounce } from 'es-toolkit/function';\n\n/**\n * Options for configuring the `useSearch` hook.\n */\ntype UseSearchOptions<T> = {\n    /**\n     * List of object fields to search within. Dot notation (e.g. `'address.city'`) is supported for nested properties.\n     * If omitted, all top-level string and number fields will be used.\n     */\n    fields?: (keyof T | string)[]; // `string` to allow dot notation\n\n    /**\n     * Optional custom filtering function.\n     * If provided, this takes precedence over field-based filtering.\n     *\n     * @param item - The current item in the list.\n     * @param query - The current search query string.\n     * @returns `true` if the item should be included in the filtered list.\n     */\n    customFilter?: (item: T, query: string) => boolean;\n\n    /**\n     * Number of milliseconds to debounce the search input.\n     * If omitted, debounce is disabled.\n     */\n    debounceMs?: number;\n\n    /**\n     * Whether to perform a case-sensitive match.\n     * Default is `false` (case-insensitive).\n     *\n     * @default false\n     */\n    caseSensitive?: boolean;\n};\n\n/**\n * Gets the value of a nested field from an object using dot notation.\n *\n * @param obj - The object to traverse.\n * @param path - The dot-notated path string.\n * @returns The value at the specified path, or undefined.\n */\nconst getNestedValue = (obj: any, path: string): unknown =>\n    path.split('.').reduce((val, key) => (val ? val[key] : undefined), obj);\n\nconst inferSearchableFields = <T extends object>(item: T): string[] =>\n    Object.keys(item).filter(key => {\n        const value = (item as any)[key];\n        return typeof value === 'string' || typeof value === 'number';\n    });\n\n/**\n * A hook to filter a list of objects by a search value.\n * Supports field-based filtering, custom filtering logic, debounce, and case sensitivity.\n *\n * @template T - The type of items in the list (must be an object).\n *\n * @param list - The array of objects to search through.\n * @param options - Configuration options for the search behavior.\n * @param options.fields - Fields to search through. If omitted, all top-level string/number fields are used.\n * @param options.customFilter - Optional custom filter function overriding field-based filtering.\n * @param options.debounceMs - Debounce time in milliseconds.\n * @param options.caseSensitive - Whether the search should be case-sensitive.\n *\n * @returns An object containing:\n * - `searchValue`: The current search input string.\n * - `setSearchValue`: A setter function to update the search query.\n * - `filteredList`: The list of items matching the current search query.\n *\n * @example\n * ```ts\n * const { searchValue, setSearchValue, filteredList } = useSearch(users, {\n *   fields: ['name', 'email'],\n *   debounceMs: 300,\n * });\n * ```\n */\nconst useSearch = <T extends object>(list: T[], options: UseSearchOptions<T> = {}) => {\n    // what the input renders (must update immediately)\n    const [searchValue, _setSearchValue] = useState('');\n\n    // what filtering uses (debounced if configured)\n    const [debouncedValue, setDebouncedValue] = useState('');\n\n    // stable debounced updater\n    const debouncedUpdate = useMemo(() => {\n        if (!options.debounceMs) {\n            return null;\n        }\n\n        const fn = debounce((query: string) => setDebouncedValue(query), options.debounceMs);\n        return fn;\n    }, [options.debounceMs]);\n\n    // setter exposed to consumers\n    const setSearchValue = useCallback(\n        (query: string) => {\n            _setSearchValue(query);\n\n            if (!debouncedUpdate) {\n                setDebouncedValue(query);\n                return;\n            }\n\n            debouncedUpdate(query);\n        },\n        [debouncedUpdate]\n    );\n\n    // keep debouncedValue in sync for the \"no debounce\" case and initial render\n    useEffect(() => {\n        if (!options.debounceMs) {\n            setDebouncedValue(searchValue);\n        }\n    }, [options.debounceMs, searchValue]);\n\n    const filteredList = useMemo(() => {\n        const activeQueryValue = options.debounceMs ? debouncedValue : searchValue;\n\n        if (!searchValue) {\n            return list;\n        }\n        if (list.length === 0) {\n            return [];\n        }\n\n        const isCaseSensitive = options.caseSensitive ?? false;\n        const query = isCaseSensitive ? activeQueryValue : activeQueryValue.toLowerCase();\n\n        // Custom filter takes precedence\n        if (options.customFilter) {\n            return list.filter(item => options.customFilter?.(item, activeQueryValue));\n        }\n\n        const fields = options.fields ?? inferSearchableFields(list[0]);\n\n        return list.filter(item =>\n            fields.some(field => {\n                const value = getNestedValue(item, field.toString());\n\n                if (typeof value === 'string') {\n                    const target = isCaseSensitive ? value : value.toLowerCase();\n                    return target.includes(query);\n                }\n\n                if (typeof value === 'number') {\n                    return value.toString().includes(query);\n                }\n\n                return false;\n            })\n        );\n    }, [debouncedValue, list, options, searchValue]);\n\n    return { searchValue, setSearchValue, filteredList };\n};\n\nexport default useSearch;\n"],"mappings":";;;AA6CA,IAAM,KAAkB,GAAU,MAC9B,EAAK,MAAM,GAAG,CAAC,CAAC,QAAQ,GAAK,MAAS,IAAM,EAAI,KAAO,KAAA,GAAY,CAAG,GAEpE,KAA2C,MAC7C,OAAO,KAAK,CAAI,CAAC,CAAC,QAAO,MAAO;CAC5B,IAAM,IAAS,EAAa;CAC5B,OAAO,OAAO,KAAU,YAAY,OAAO,KAAU;AACzD,CAAC,GA4BC,KAA+B,GAAW,IAA+B,CAAC,MAAM;CAElF,IAAM,CAAC,GAAa,KAAmB,EAAS,EAAE,GAG5C,CAAC,GAAgB,KAAqB,EAAS,EAAE,GAGjD,IAAkB,QACf,EAAQ,aAIF,GAAU,MAAkB,EAAkB,CAAK,GAAG,EAAQ,UAClE,IAJI,MAKZ,CAAC,EAAQ,UAAU,CAAC,GAGjB,IAAiB,GAClB,MAAkB;EAGf,IAFA,EAAgB,CAAK,GAEjB,CAAC,GAAiB;GAClB,EAAkB,CAAK;GACvB;EACJ;EAEA,EAAgB,CAAK;CACzB,GACA,CAAC,CAAe,CACpB;CA+CA,OA5CA,QAAgB;EACZ,AAAK,EAAQ,cACT,EAAkB,CAAW;CAErC,GAAG,CAAC,EAAQ,YAAY,CAAW,CAAC,GAwC7B;EAAE;EAAa;EAAgB,cAtCjB,QAAc;GAC/B,IAAM,IAAmB,EAAQ,aAAa,IAAiB;GAE/D,IAAI,CAAC,GACD,OAAO;GAEX,IAAI,EAAK,WAAW,GAChB,OAAO,CAAC;GAGZ,IAAM,IAAkB,EAAQ,iBAAiB,IAC3C,IAAQ,IAAkB,IAAmB,EAAiB,YAAY;GAGhF,IAAI,EAAQ,cACR,OAAO,EAAK,QAAO,MAAQ,EAAQ,eAAe,GAAM,CAAgB,CAAC;GAG7E,IAAM,IAAS,EAAQ,UAAU,EAAsB,EAAK,EAAE;GAE9D,OAAO,EAAK,QAAO,MACf,EAAO,MAAK,MAAS;IACjB,IAAM,IAAQ,EAAe,GAAM,EAAM,SAAS,CAAC;IAWnD,OATI,OAAO,KAAU,YACF,IAAkB,IAAQ,EAAM,YAAY,EAAA,CAC7C,SAAS,CAAK,IAG5B,OAAO,KAAU,YACV,EAAM,SAAS,CAAC,CAAC,SAAS,CAAK;GAI9C,CAAC,CACL;EACJ,GAAG;GAAC;GAAgB;GAAM;GAAS;EAAW,CAER;CAAa;AACvD"}

package/hooks/useSearchHighlight.d.ts

@@ -3,7 +3,7 @@ export type UseSearchHighlightParams = {
     /**
      * Ref to the element whose text content should be searched.
      */
-    ref: React.RefObject<HTMLElement>;
+    ref: React.RefObject<HTMLElement | null>;
     /**
      * Search query used for highlighting.
      */

package/hooks/useSearchHighlight.js

@@ -1,54 +1,47 @@
-import { useMemo as d, useEffect as x } from "react";
-const m = "search-result-highlight", u = () => typeof window < "u" && "CSS" in window && "highlights" in CSS && typeof Highlight < "u", w = (s) => s.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), H = (s, c, h) => {
-  const t = [];
-  if (!c)
-    return t;
-  const n = new RegExp(w(c), h ? "g" : "gi"), a = document.createTreeWalker(s, NodeFilter.SHOW_TEXT);
-  let e = a.nextNode();
-  for (; e; ) {
-    const o = e.textContent ?? "";
-    n.lastIndex = 0;
-    let r = n.exec(o);
-    for (; r; ) {
-      const i = document.createRange();
-      i.setStart(e, r.index), i.setEnd(e, r.index + r[0].length), t.push(i), r = n.exec(o);
-    }
-    e = a.nextNode();
-  }
-  return t;
-}, C = (s) => {
-  const {
-    ref: c,
-    query: h,
-    highlightClassName: t = m,
-    scopeSelector: n,
-    caseSensitive: a = !1,
-    deps: e
-  } = s, o = d(() => h.trim(), [h]), r = d(() => e ?? [], [e]);
-  x(() => {
-    if (!u())
-      return;
-    const i = c.current;
-    if (!i)
-      return;
-    const g = CSS.highlights.get(t) ?? new Highlight();
-    CSS.highlights.set(t, g);
-    const p = () => {
-      if (g.clear(), !o)
-        return;
-      const l = n ? i.querySelector(n) : i;
-      if (l)
-        for (const f of H(l, o, a))
-          g.add(f);
-    }, S = window.requestAnimationFrame(p);
-    return () => {
-      window.cancelAnimationFrame(S), g.clear();
-    };
-  }, [a, t, o, c, n, r]);
+import { useEffect as e, useMemo as t } from "react";
+//#region src/hooks/useSearchHighlight.ts
+var n = "search-result-highlight", r = () => typeof window < "u" && "CSS" in window && "highlights" in CSS && typeof Highlight < "u", i = (e) => e.replace(/[.*+?^${}()|[\]\\]/g, "\\$&"), a = (e, t, n) => {
+	let r = [];
+	if (!t) return r;
+	let a = new RegExp(i(t), n ? "g" : "gi"), o = document.createTreeWalker(e, NodeFilter.SHOW_TEXT), s = o.nextNode();
+	for (; s;) {
+		let e = s.textContent ?? "";
+		a.lastIndex = 0;
+		let t = a.exec(e);
+		for (; t;) {
+			let n = document.createRange();
+			n.setStart(s, t.index), n.setEnd(s, t.index + t[0].length), r.push(n), t = a.exec(e);
+		}
+		s = o.nextNode();
+	}
+	return r;
+}, o = (i) => {
+	let { ref: o, query: s, highlightClassName: c = n, scopeSelector: l, caseSensitive: u = !1, deps: d } = i, f = t(() => s.trim(), [s]);
+	e(() => {
+		if (!r()) return;
+		let e = o.current;
+		if (!e) return;
+		let t = CSS.highlights.get(c) ?? new Highlight();
+		CSS.highlights.set(c, t);
+		let n = window.requestAnimationFrame(() => {
+			if (t.clear(), !f) return;
+			let n = l ? e.querySelector(l) : e;
+			if (n) for (let e of a(n, f, u)) t.add(e);
+		});
+		return () => {
+			window.cancelAnimationFrame(n), t.clear();
+		};
+	}, [
+		u,
+		c,
+		f,
+		o,
+		l,
+		t(() => d ?? [], [d])
+	]);
 };
-C.supported = () => u();
-export {
-  m as SEARCH_HIGHLIGHT_CLASS,
-  C as default
-};
-//# sourceMappingURL=useSearchHighlight.js.map
+o.supported = () => r();
+//#endregion
+export { n as SEARCH_HIGHLIGHT_CLASS, o as default };
+
+//# sourceMappingURL=useSearchHighlight.js.map

package/hooks/useSearchHighlight.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSearchHighlight.js","sources":["../../src/hooks/useSearchHighlight.ts"],"sourcesContent":["import { useEffect, useMemo } from 'react';\n\nexport const SEARCH_HIGHLIGHT_CLASS = 'search-result-highlight';\n\nexport type UseSearchHighlightParams = {\n    /**\n     * Ref to the element whose text content should be searched.\n     */\n    ref: React.RefObject<HTMLElement>;\n\n    /**\n     * Search query used for highlighting.\n     */\n    query: string;\n\n    /**\n     * Name of the CSS highlight.\n     *\n     * @default 'search-result-highlight'\n     */\n    highlightClassName?: string;\n\n    /**\n     * Optional selector to limit the search scope\n     * (e.g. '.ListMenuGroup' or '.OptionLabel').\n     */\n    scopeSelector?: string;\n\n    /**\n     * Whether to perform a case-sensitive match.\n     *\n     * @default false\n     */\n    caseSensitive?: boolean;\n\n    /**\n     * Optional dependencies that should trigger re-collecting and applying ranges.\n     * Useful when the DOM changes after the query changes (e.g. debounced filtering).\n     */\n    deps?: unknown[];\n};\n\n// Guard for browser support of the CSS Highlight API.\nconst isSearchHighlightSupported = () =>\n    typeof window !== 'undefined' && 'CSS' in window && 'highlights' in CSS && typeof Highlight !== 'undefined';\n\nconst escapeRegExp = (value: string) => value.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&');\n\n/**\n * Collects DOM Ranges for all matches of a search query\n * within the text content of a given root element.\n *\n * Purpose:\n * This utility is used by `useSearchHighlight` to translate a plain-text\n * search query into DOM `Range` objects that can be consumed by the\n * native CSS Highlight API (`Highlight` / `CSS.highlights`).\n *\n * Why this exists:\n * - The Highlight API does not accept strings or selectors, only `Range`s.\n * - React nodes may contain arbitrary nested markup; injecting `<mark>`\n *   elements would break component structure and semantics.\n * - Walking the DOM text nodes allows highlighting without mutating\n *   the rendered output.\n *\n * What it does:\n * - Traverses all text nodes inside `root` using a `TreeWalker`\n * - Finds all matches of `query`\n * - Creates a `Range` for each match, precisely spanning the matched text\n * - Returns all collected ranges in document order\n *\n * What it does NOT do:\n * - It does not modify the DOM\n * - It does not register or apply highlights\n * - It does not perform filtering or visibility logic\n *\n * Performance notes:\n * - Intended for reasonably sized, already-filtered DOM trees\n *   (e.g. visible menu items, dropdown options)\n * - Consumers should avoid running this on large, unbounded documents\n *\n * @param root           The root element whose text content should be searched\n * @param query          The normalized (trimmed) search query\n * @param caseSensitive  Whether matches should be case-sensitive\n * @returns     An array of DOM Ranges matching the query\n */\nconst collectRanges = (root: HTMLElement, query: string, caseSensitive: boolean): Range[] => {\n    const ranges: Range[] = [];\n\n    if (!query) {\n        return ranges;\n    }\n\n    const regex = new RegExp(escapeRegExp(query), caseSensitive ? 'g' : 'gi');\n\n    // Walk text nodes only to avoid splitting markup.\n    const walker = document.createTreeWalker(root, NodeFilter.SHOW_TEXT);\n\n    let node: Node | null = walker.nextNode();\n\n    while (node) {\n        const text = node.textContent ?? '';\n        regex.lastIndex = 0;\n\n        let match: RegExpExecArray | null = regex.exec(text);\n\n        while (match) {\n            const range = document.createRange();\n            range.setStart(node, match.index);\n            range.setEnd(node, match.index + match[0].length);\n            ranges.push(range);\n\n            match = regex.exec(text);\n        }\n\n        node = walker.nextNode();\n    }\n\n    return ranges;\n};\n\n/**\n * React hook for visually highlighting search query matches\n * using the native CSS Highlight API.\n *\n * The hook scans the text content of the referenced element\n * and applies a named CSS highlight to all matching substrings.\n *\n * Key characteristics:\n * - Progressive enhancement: safely no-ops in unsupported browsers\n * - Does not modify or re-render DOM markup\n * - Designed for search UIs (Autocomplete, ListMenu, Dropdown, etc.)\n *\n * Usage notes:\n * - The hook must always be called unconditionally\n * - Use `useSearchHighlight.supported()` only for render-time\n *   fallback decisions (e.g. `<mark>` rendering)\n *\n * @param ref           Ref to the element whose text should be searched\n * @param query         Search query to highlight\n * @param highlightName Optional CSS highlight name\n * @param scopeSelector Optional selector to limit the search scope\n */\nconst useSearchHighlight = (params: UseSearchHighlightParams) => {\n    const {\n        ref,\n        query,\n        highlightClassName = SEARCH_HIGHLIGHT_CLASS,\n        scopeSelector,\n        caseSensitive = false,\n        deps,\n    } = params;\n\n    const normalizedQuery = useMemo(() => query.trim(), [query]);\n\n    const extraDeps = useMemo(() => deps ?? [], [deps]);\n\n    useEffect(() => {\n        if (!isSearchHighlightSupported()) {\n            return;\n        }\n\n        const container = ref.current;\n        if (!container) {\n            return;\n        }\n\n        // Reuse the named highlight so multiple renders update the same layer.\n        const highlight = CSS.highlights.get(highlightClassName) ?? new Highlight();\n        CSS.highlights.set(highlightClassName, highlight);\n\n        const applyHighlight = () => {\n            // Always clear before re-adding to avoid stale ranges.\n            highlight.clear();\n\n            if (!normalizedQuery) {\n                return;\n            }\n\n            const scopeRoot = scopeSelector\n                ? (container.querySelector(scopeSelector) as HTMLElement | null)\n                : container;\n\n            if (!scopeRoot) {\n                return;\n            }\n\n            for (const range of collectRanges(scopeRoot, normalizedQuery, caseSensitive)) {\n                highlight.add(range);\n            }\n        };\n\n        // Defer until after layout so text nodes are in place.\n        const raf = window.requestAnimationFrame(applyHighlight);\n\n        return () => {\n            window.cancelAnimationFrame(raf);\n            // Ensure highlights are removed when query or component unmounts.\n            highlight.clear();\n        };\n    }, [caseSensitive, highlightClassName, normalizedQuery, ref, scopeSelector, extraDeps]);\n};\n\n/**\n * Indicates whether the current environment supports\n * the native CSS Highlight API.\n *\n * Can be used to decide whether to render a `<mark>` fallback.\n */\nuseSearchHighlight.supported = () => isSearchHighlightSupported();\n\nexport default useSearchHighlight;\n"],"names":["SEARCH_HIGHLIGHT_CLASS","isSearchHighlightSupported","escapeRegExp","value","collectRanges","root","query","caseSensitive","ranges","regex","walker","node","text","match","range","useSearchHighlight","params","ref","highlightClassName","scopeSelector","deps","normalizedQuery","useMemo","extraDeps","useEffect","container","highlight","applyHighlight","scopeRoot","raf"],"mappings":";AAEO,MAAMA,IAAyB,2BAyChCC,IAA6B,MAC/B,OAAO,SAAW,OAAe,SAAS,UAAU,gBAAgB,OAAO,OAAO,YAAc,KAE9FC,IAAe,CAACC,MAAkBA,EAAM,QAAQ,uBAAuB,MAAM,GAuC7EC,IAAgB,CAACC,GAAmBC,GAAeC,MAAoC;AACzF,QAAMC,IAAkB,CAAA;AAExB,MAAI,CAACF;AACD,WAAOE;AAGX,QAAMC,IAAQ,IAAI,OAAOP,EAAaI,CAAK,GAAGC,IAAgB,MAAM,IAAI,GAGlEG,IAAS,SAAS,iBAAiBL,GAAM,WAAW,SAAS;AAEnE,MAAIM,IAAoBD,EAAO,SAAA;AAE/B,SAAOC,KAAM;AACT,UAAMC,IAAOD,EAAK,eAAe;AACjC,IAAAF,EAAM,YAAY;AAElB,QAAII,IAAgCJ,EAAM,KAAKG,CAAI;AAEnD,WAAOC,KAAO;AACV,YAAMC,IAAQ,SAAS,YAAA;AACvB,MAAAA,EAAM,SAASH,GAAME,EAAM,KAAK,GAChCC,EAAM,OAAOH,GAAME,EAAM,QAAQA,EAAM,CAAC,EAAE,MAAM,GAChDL,EAAO,KAAKM,CAAK,GAEjBD,IAAQJ,EAAM,KAAKG,CAAI;AAAA,IAC3B;AAEA,IAAAD,IAAOD,EAAO,SAAA;AAAA,EAClB;AAEA,SAAOF;AACX,GAwBMO,IAAqB,CAACC,MAAqC;AAC7D,QAAM;AAAA,IACF,KAAAC;AAAA,IACA,OAAAX;AAAA,IACA,oBAAAY,IAAqBlB;AAAA,IACrB,eAAAmB;AAAA,IACA,eAAAZ,IAAgB;AAAA,IAChB,MAAAa;AAAA,EAAA,IACAJ,GAEEK,IAAkBC,EAAQ,MAAMhB,EAAM,QAAQ,CAACA,CAAK,CAAC,GAErDiB,IAAYD,EAAQ,MAAMF,KAAQ,CAAA,GAAI,CAACA,CAAI,CAAC;AAElD,EAAAI,EAAU,MAAM;AACZ,QAAI,CAACvB;AACD;AAGJ,UAAMwB,IAAYR,EAAI;AACtB,QAAI,CAACQ;AACD;AAIJ,UAAMC,IAAY,IAAI,WAAW,IAAIR,CAAkB,KAAK,IAAI,UAAA;AAChE,QAAI,WAAW,IAAIA,GAAoBQ,CAAS;AAEhD,UAAMC,IAAiB,MAAM;AAIzB,UAFAD,EAAU,MAAA,GAEN,CAACL;AACD;AAGJ,YAAMO,IAAYT,IACXM,EAAU,cAAcN,CAAa,IACtCM;AAEN,UAAKG;AAIL,mBAAWd,KAASV,EAAcwB,GAAWP,GAAiBd,CAAa;AACvE,UAAAmB,EAAU,IAAIZ,CAAK;AAAA,IAE3B,GAGMe,IAAM,OAAO,sBAAsBF,CAAc;AAEvD,WAAO,MAAM;AACT,aAAO,qBAAqBE,CAAG,GAE/BH,EAAU,MAAA;AAAA,IACd;AAAA,EACJ,GAAG,CAACnB,GAAeW,GAAoBG,GAAiBJ,GAAKE,GAAeI,CAAS,CAAC;AAC1F;AAQAR,EAAmB,YAAY,MAAMd,EAAA;"}
+{"version":3,"file":"useSearchHighlight.js","names":[],"sources":["../../src/hooks/useSearchHighlight.ts"],"sourcesContent":["import { useEffect, useMemo } from 'react';\n\nexport const SEARCH_HIGHLIGHT_CLASS = 'search-result-highlight';\n\nexport type UseSearchHighlightParams = {\n    /**\n     * Ref to the element whose text content should be searched.\n     */\n    ref: React.RefObject<HTMLElement | null>;\n\n    /**\n     * Search query used for highlighting.\n     */\n    query: string;\n\n    /**\n     * Name of the CSS highlight.\n     *\n     * @default 'search-result-highlight'\n     */\n    highlightClassName?: string;\n\n    /**\n     * Optional selector to limit the search scope\n     * (e.g. '.ListMenuGroup' or '.OptionLabel').\n     */\n    scopeSelector?: string;\n\n    /**\n     * Whether to perform a case-sensitive match.\n     *\n     * @default false\n     */\n    caseSensitive?: boolean;\n\n    /**\n     * Optional dependencies that should trigger re-collecting and applying ranges.\n     * Useful when the DOM changes after the query changes (e.g. debounced filtering).\n     */\n    deps?: unknown[];\n};\n\n// Guard for browser support of the CSS Highlight API.\nconst isSearchHighlightSupported = () =>\n    typeof window !== 'undefined' && 'CSS' in window && 'highlights' in CSS && typeof Highlight !== 'undefined';\n\nconst escapeRegExp = (value: string) => value.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&');\n\n/**\n * Collects DOM Ranges for all matches of a search query\n * within the text content of a given root element.\n *\n * Purpose:\n * This utility is used by `useSearchHighlight` to translate a plain-text\n * search query into DOM `Range` objects that can be consumed by the\n * native CSS Highlight API (`Highlight` / `CSS.highlights`).\n *\n * Why this exists:\n * - The Highlight API does not accept strings or selectors, only `Range`s.\n * - React nodes may contain arbitrary nested markup; injecting `<mark>`\n *   elements would break component structure and semantics.\n * - Walking the DOM text nodes allows highlighting without mutating\n *   the rendered output.\n *\n * What it does:\n * - Traverses all text nodes inside `root` using a `TreeWalker`\n * - Finds all matches of `query`\n * - Creates a `Range` for each match, precisely spanning the matched text\n * - Returns all collected ranges in document order\n *\n * What it does NOT do:\n * - It does not modify the DOM\n * - It does not register or apply highlights\n * - It does not perform filtering or visibility logic\n *\n * Performance notes:\n * - Intended for reasonably sized, already-filtered DOM trees\n *   (e.g. visible menu items, dropdown options)\n * - Consumers should avoid running this on large, unbounded documents\n *\n * @param root           The root element whose text content should be searched\n * @param query          The normalized (trimmed) search query\n * @param caseSensitive  Whether matches should be case-sensitive\n * @returns     An array of DOM Ranges matching the query\n */\nconst collectRanges = (root: HTMLElement, query: string, caseSensitive: boolean): Range[] => {\n    const ranges: Range[] = [];\n\n    if (!query) {\n        return ranges;\n    }\n\n    const regex = new RegExp(escapeRegExp(query), caseSensitive ? 'g' : 'gi');\n\n    // Walk text nodes only to avoid splitting markup.\n    const walker = document.createTreeWalker(root, NodeFilter.SHOW_TEXT);\n\n    let node: Node | null = walker.nextNode();\n\n    while (node) {\n        const text = node.textContent ?? '';\n        regex.lastIndex = 0;\n\n        let match: RegExpExecArray | null = regex.exec(text);\n\n        while (match) {\n            const range = document.createRange();\n            range.setStart(node, match.index);\n            range.setEnd(node, match.index + match[0].length);\n            ranges.push(range);\n\n            match = regex.exec(text);\n        }\n\n        node = walker.nextNode();\n    }\n\n    return ranges;\n};\n\n/**\n * React hook for visually highlighting search query matches\n * using the native CSS Highlight API.\n *\n * The hook scans the text content of the referenced element\n * and applies a named CSS highlight to all matching substrings.\n *\n * Key characteristics:\n * - Progressive enhancement: safely no-ops in unsupported browsers\n * - Does not modify or re-render DOM markup\n * - Designed for search UIs (Autocomplete, ListMenu, Dropdown, etc.)\n *\n * Usage notes:\n * - The hook must always be called unconditionally\n * - Use `useSearchHighlight.supported()` only for render-time\n *   fallback decisions (e.g. `<mark>` rendering)\n *\n * @param ref           Ref to the element whose text should be searched\n * @param query         Search query to highlight\n * @param highlightName Optional CSS highlight name\n * @param scopeSelector Optional selector to limit the search scope\n */\nconst useSearchHighlight = (params: UseSearchHighlightParams) => {\n    const {\n        ref,\n        query,\n        highlightClassName = SEARCH_HIGHLIGHT_CLASS,\n        scopeSelector,\n        caseSensitive = false,\n        deps,\n    } = params;\n\n    const normalizedQuery = useMemo(() => query.trim(), [query]);\n\n    const extraDeps = useMemo(() => deps ?? [], [deps]);\n\n    useEffect(() => {\n        if (!isSearchHighlightSupported()) {\n            return;\n        }\n\n        const container = ref.current;\n        if (!container) {\n            return;\n        }\n\n        // Reuse the named highlight so multiple renders update the same layer.\n        const highlight = CSS.highlights.get(highlightClassName) ?? new Highlight();\n        CSS.highlights.set(highlightClassName, highlight);\n\n        const applyHighlight = () => {\n            // Always clear before re-adding to avoid stale ranges.\n            highlight.clear();\n\n            if (!normalizedQuery) {\n                return;\n            }\n\n            const scopeRoot = scopeSelector\n                ? (container.querySelector(scopeSelector) as HTMLElement | null)\n                : container;\n\n            if (!scopeRoot) {\n                return;\n            }\n\n            for (const range of collectRanges(scopeRoot, normalizedQuery, caseSensitive)) {\n                highlight.add(range);\n            }\n        };\n\n        // Defer until after layout so text nodes are in place.\n        const raf = window.requestAnimationFrame(applyHighlight);\n\n        return () => {\n            window.cancelAnimationFrame(raf);\n            // Ensure highlights are removed when query or component unmounts.\n            highlight.clear();\n        };\n    }, [caseSensitive, highlightClassName, normalizedQuery, ref, scopeSelector, extraDeps]);\n};\n\n/**\n * Indicates whether the current environment supports\n * the native CSS Highlight API.\n *\n * Can be used to decide whether to render a `<mark>` fallback.\n */\nuseSearchHighlight.supported = () => isSearchHighlightSupported();\n\nexport default useSearchHighlight;\n"],"mappings":";;AAEA,IAAa,IAAyB,2BAyChC,UACF,OAAO,SAAW,OAAe,SAAS,UAAU,gBAAgB,OAAO,OAAO,YAAc,KAE9F,KAAgB,MAAkB,EAAM,QAAQ,uBAAuB,MAAM,GAuC7E,KAAiB,GAAmB,GAAe,MAAoC;CACzF,IAAM,IAAkB,CAAC;CAEzB,IAAI,CAAC,GACD,OAAO;CAGX,IAAM,IAAQ,IAAI,OAAO,EAAa,CAAK,GAAG,IAAgB,MAAM,IAAI,GAGlE,IAAS,SAAS,iBAAiB,GAAM,WAAW,SAAS,GAE/D,IAAoB,EAAO,SAAS;CAExC,OAAO,IAAM;EACT,IAAM,IAAO,EAAK,eAAe;EACjC,EAAM,YAAY;EAElB,IAAI,IAAgC,EAAM,KAAK,CAAI;EAEnD,OAAO,IAAO;GACV,IAAM,IAAQ,SAAS,YAAY;GAKnC,AAJA,EAAM,SAAS,GAAM,EAAM,KAAK,GAChC,EAAM,OAAO,GAAM,EAAM,QAAQ,EAAM,EAAE,CAAC,MAAM,GAChD,EAAO,KAAK,CAAK,GAEjB,IAAQ,EAAM,KAAK,CAAI;EAC3B;EAEA,IAAO,EAAO,SAAS;CAC3B;CAEA,OAAO;AACX,GAwBM,KAAsB,MAAqC;CAC7D,IAAM,EACF,QACA,UACA,wBAAqB,GACrB,kBACA,mBAAgB,IAChB,YACA,GAEE,IAAkB,QAAc,EAAM,KAAK,GAAG,CAAC,CAAK,CAAC;CAI3D,QAAgB;EACZ,IAAI,CAAC,EAA2B,GAC5B;EAGJ,IAAM,IAAY,EAAI;EACtB,IAAI,CAAC,GACD;EAIJ,IAAM,IAAY,IAAI,WAAW,IAAI,CAAkB,KAAK,IAAI,UAAU;EAC1E,IAAI,WAAW,IAAI,GAAoB,CAAS;EAwBhD,IAAM,IAAM,OAAO,4BAtBU;GAIzB,IAFA,EAAU,MAAM,GAEZ,CAAC,GACD;GAGJ,IAAM,IAAY,IACX,EAAU,cAAc,CAAa,IACtC;GAED,OAIL,KAAK,IAAM,KAAS,EAAc,GAAW,GAAiB,CAAa,GACvE,EAAU,IAAI,CAAK;EAE3B,CAGuD;EAEvD,aAAa;GAGT,AAFA,OAAO,qBAAqB,CAAG,GAE/B,EAAU,MAAM;EACpB;CACJ,GAAG;EAAC;EAAe;EAAoB;EAAiB;EAAK;EA7C3C,QAAc,KAAQ,CAAC,GAAG,CAAC,CAAI,CA6C2B;CAAS,CAAC;AAC1F;AAQA,EAAmB,kBAAkB,EAA2B"}