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

package/hooks/useOnMount.js.map

@@ -1 +1 @@
-{"version":3,"file":"useOnMount.js","sources":["../../src/hooks/useOnMount.ts"],"sourcesContent":["import { useEffect, useRef, type DependencyList } from 'react';\n\n/**\n * Custom hook to execute a callback function only on component mount.\n *\n * @param callback - The callback function to be executed on mount.\n * @param deps - The dependencies array for the useEffect hook.\n */\nconst useOnMount = (callback: () => void, deps: DependencyList) => {\n    const componentJustMountedRef = useRef(true);\n\n    useEffect(() => {\n        if (componentJustMountedRef.current) {\n            componentJustMountedRef.current = false;\n            return callback();\n        }\n    }, deps);\n};\n\nexport default useOnMount;\n"],"names":["useOnMount","callback","deps","componentJustMountedRef","useRef","useEffect"],"mappings":";AAQA,MAAMA,IAAa,CAACC,GAAsBC,MAAyB;AAC/D,QAAMC,IAA0BC,EAAO,EAAI;AAE3C,EAAAC,EAAU,MAAM;AACZ,QAAIF,EAAwB;AACxB,aAAAA,EAAwB,UAAU,IAC3BF,EAAA;AAAA,EAEf,GAAGC,CAAI;AACX;"}
+{"version":3,"file":"useOnMount.js","names":[],"sources":["../../src/hooks/useOnMount.ts"],"sourcesContent":["import { useEffect, useRef, type DependencyList } from 'react';\n\n/**\n * Custom hook to execute a callback function only on component mount.\n *\n * @param callback - The callback function to be executed on mount.\n * @param deps - The dependencies array for the useEffect hook.\n */\nconst useOnMount = (callback: () => void, deps: DependencyList) => {\n    const componentJustMountedRef = useRef(true);\n\n    useEffect(() => {\n        if (componentJustMountedRef.current) {\n            componentJustMountedRef.current = false;\n            return callback();\n        }\n    }, deps);\n};\n\nexport default useOnMount;\n"],"mappings":";;AAQA,IAAM,KAAc,GAAsB,MAAyB;CAC/D,IAAM,IAA0B,EAAO,EAAI;CAE3C,QAAgB;EACZ,IAAI,EAAwB,SAExB,OADA,EAAwB,UAAU,IAC3B,EAAS;CAExB,GAAG,CAAI;AACX"}

package/hooks/useOnScreen.d.ts

@@ -1,5 +1,5 @@
 import { RefObject } from 'react';
-export type UseOnScreen = (ref: RefObject<HTMLElement>, options?: {
+export type UseOnScreen = (ref: RefObject<HTMLElement | null>, options?: {
     rootMargin?: string;
     threshold?: number | number[];
 }) => boolean;

package/hooks/useOnScreen.js

@@ -1,16 +1,16 @@
-import { useState as i, useEffect as o } from "react";
-const b = (e, r = { rootMargin: "0px" }) => {
-  const [n, s] = i(!1);
-  return o(() => {
-    if (!e.current)
-      return;
-    const c = ([u]) => s(u.isIntersecting), t = new IntersectionObserver(c, r);
-    return t.observe(e.current), () => {
-      e.current && t.unobserve(e.current);
-    };
-  }, [e, r]), n;
+import { useEffect as e, useState as t } from "react";
+//#region src/hooks/useOnScreen.ts
+var n = (n, r = { rootMargin: "0px" }) => {
+	let [i, a] = t(!1);
+	return e(() => {
+		if (!n.current) return;
+		let e = new IntersectionObserver(([e]) => a(e.isIntersecting), r);
+		return e.observe(n.current), () => {
+			n.current && e.unobserve(n.current);
+		};
+	}, [n, r]), i;
 };
-export {
-  b as default
-};
-//# sourceMappingURL=useOnScreen.js.map
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=useOnScreen.js.map

package/hooks/useOnScreen.js.map

@@ -1 +1 @@
-{"version":3,"file":"useOnScreen.js","sources":["../../src/hooks/useOnScreen.ts"],"sourcesContent":["// Inspired by https://github.com/WebDevSimplified/useful-custom-react-hooks/blob/main/src/14-useOnScreen/useOnScreen.js\nimport { useEffect, useState, type RefObject } from 'react';\n\nexport type UseOnScreen = (\n    ref: RefObject<HTMLElement>,\n    options?: {\n        rootMargin?: string;\n        threshold?: number | number[];\n    }\n) => boolean;\n\n/**\n * Custom React hook to detect whether an element is within the viewport.\n *\n * @param {RefObject<HTMLElement>} ref - Reference object for the target element to observe.\n * @param {object} [options] - Options for configuring the IntersectionObserver.\n * @param {string} [options.rootMargin='0px'] - Margin around the root (viewport) to track intersections.\n * @param {number | number[]} [options.threshold] - A single threshold value or an array of threshold values\n *        which indicate the percentage of the target element's visibility needed to trigger the callback.\n *\n * @returns {boolean} - Boolean value indicating whether the target element is currently visible in the viewport.\n */\nconst useOnScreen: UseOnScreen = (\n    ref: RefObject<HTMLElement>,\n    options: { rootMargin?: string; threshold?: number | number[] } = { rootMargin: '0px' }\n): boolean => {\n    const [isVisible, setIsVisible] = useState(false);\n\n    useEffect(() => {\n        if (!ref.current) {\n            return;\n        }\n\n        /**\n         * Callback function for IntersectionObserver.\n         *\n         * @param {IntersectionObserverEntry[]} entries - An array of IntersectionObserverEntry objects describing\n         * the intersection between the target element and its root container at a specific moment of transition.\n         */\n        const callback = ([entry]: IntersectionObserverEntry[]) => setIsVisible(entry.isIntersecting);\n\n        // Create a new IntersectionObserver instance\n        const observer = new IntersectionObserver(callback, options);\n\n        // Start observing the target element\n        observer.observe(ref.current);\n\n        // Cleanup function to stop observing the target element when the component unmounts\n        return () => {\n            if (!ref.current) {\n                return;\n            }\n            observer.unobserve(ref.current);\n        };\n    }, [ref, options]);\n\n    return isVisible;\n};\n\nexport default useOnScreen;\n"],"names":["useOnScreen","ref","options","isVisible","setIsVisible","useState","useEffect","callback","entry","observer"],"mappings":";AAsBA,MAAMA,IAA2B,CAC7BC,GACAC,IAAkE,EAAE,YAAY,YACtE;AACV,QAAM,CAACC,GAAWC,CAAY,IAAIC,EAAS,EAAK;AAEhD,SAAAC,EAAU,MAAM;AACZ,QAAI,CAACL,EAAI;AACL;AASJ,UAAMM,IAAW,CAAC,CAACC,CAAK,MAAmCJ,EAAaI,EAAM,cAAc,GAGtFC,IAAW,IAAI,qBAAqBF,GAAUL,CAAO;AAG3D,WAAAO,EAAS,QAAQR,EAAI,OAAO,GAGrB,MAAM;AACT,MAAKA,EAAI,WAGTQ,EAAS,UAAUR,EAAI,OAAO;AAAA,IAClC;AAAA,EACJ,GAAG,CAACA,GAAKC,CAAO,CAAC,GAEVC;AACX;"}
+{"version":3,"file":"useOnScreen.js","names":[],"sources":["../../src/hooks/useOnScreen.ts"],"sourcesContent":["// Inspired by https://github.com/WebDevSimplified/useful-custom-react-hooks/blob/main/src/14-useOnScreen/useOnScreen.js\nimport { useEffect, useState, type RefObject } from 'react';\n\nexport type UseOnScreen = (\n    ref: RefObject<HTMLElement | null>,\n    options?: {\n        rootMargin?: string;\n        threshold?: number | number[];\n    }\n) => boolean;\n\n/**\n * Custom React hook to detect whether an element is within the viewport.\n *\n * @param {RefObject<HTMLElement>} ref - Reference object for the target element to observe.\n * @param {object} [options] - Options for configuring the IntersectionObserver.\n * @param {string} [options.rootMargin='0px'] - Margin around the root (viewport) to track intersections.\n * @param {number | number[]} [options.threshold] - A single threshold value or an array of threshold values\n *        which indicate the percentage of the target element's visibility needed to trigger the callback.\n *\n * @returns {boolean} - Boolean value indicating whether the target element is currently visible in the viewport.\n */\nconst useOnScreen: UseOnScreen = (\n    ref: RefObject<HTMLElement | null>,\n    options: { rootMargin?: string; threshold?: number | number[] } = { rootMargin: '0px' }\n): boolean => {\n    const [isVisible, setIsVisible] = useState(false);\n\n    useEffect(() => {\n        if (!ref.current) {\n            return;\n        }\n\n        /**\n         * Callback function for IntersectionObserver.\n         *\n         * @param {IntersectionObserverEntry[]} entries - An array of IntersectionObserverEntry objects describing\n         * the intersection between the target element and its root container at a specific moment of transition.\n         */\n        const callback = ([entry]: IntersectionObserverEntry[]) => setIsVisible(entry.isIntersecting);\n\n        // Create a new IntersectionObserver instance\n        const observer = new IntersectionObserver(callback, options);\n\n        // Start observing the target element\n        observer.observe(ref.current);\n\n        // Cleanup function to stop observing the target element when the component unmounts\n        return () => {\n            if (!ref.current) {\n                return;\n            }\n            observer.unobserve(ref.current);\n        };\n    }, [ref, options]);\n\n    return isVisible;\n};\n\nexport default useOnScreen;\n"],"mappings":";;AAsBA,IAAM,KACF,GACA,IAAkE,EAAE,YAAY,MAAM,MAC5E;CACV,IAAM,CAAC,GAAW,KAAgB,EAAS,EAAK;CA8BhD,OA5BA,QAAgB;EACZ,IAAI,CAAC,EAAI,SACL;EAYJ,IAAM,IAAW,IAAI,sBAHH,CAAC,OAAwC,EAAa,EAAM,cAAc,GAGxC,CAAO;EAM3D,OAHA,EAAS,QAAQ,EAAI,OAAO,SAGf;GACJ,EAAI,WAGT,EAAS,UAAU,EAAI,OAAO;EAClC;CACJ,GAAG,CAAC,GAAK,CAAO,CAAC,GAEV;AACX"}

package/hooks/useOnboarding.js

@@ -1,96 +1,62 @@
-import { driver as l } from "driver.js";
+import { driver as e } from "driver.js";
 import "driver.js/dist/driver.css";
-const A = (s) => {
-  const {
-    steps: t,
-    prevBtnText: r = "Previous",
-    nextBtnText: n = "Next",
-    doneBtnText: i = "Done",
-    showProgress: o = !0,
-    allowClose: a = !1,
-    stagePadding: p = 10,
-    stageRadius: c = 5,
-    allowKeyboardControl: g = !0,
-    showButtons: h,
-    disableButtons: u,
-    popoverClass: y,
-    noBackdrop: x = !1,
-    onPopoverRender: P = () => {
-    },
-    onDestroyed: S = () => {
-    },
-    ...m
-  } = s, f = (d, T) => {
-    P(d, T.state);
-  }, B = () => {
-    S();
-  }, v = !t || t.length === 1, e = l({
-    steps: t,
-    prevBtnText: r,
-    nextBtnText: n,
-    doneBtnText: i,
-    showProgress: v ? !1 : o,
-    showButtons: v ? ["close"] : h,
-    allowClose: a,
-    overlayOpacity: x ? 0 : 0.5,
-    disableButtons: u,
-    progressText: "{{current}} / {{total}}",
-    overlayColor: "var(--color-black)",
-    stagePadding: p,
-    stageRadius: c,
-    allowKeyboardControl: g,
-    popoverClass: y,
-    onPopoverRender: f,
-    onDestroyed: B,
-    ...m
-  });
-  return {
-    // Use for onboarding tours. Pass in all steps as "steps" parameter for initial configuration.
-    run: () => e.drive(),
-    // Use for single element highlights -> see useOnboardingTip
-    // highlight: (step: OnboardingStep) => driverInstance.highlight(step),
-    // Cleanup the onboarding
-    destroy: () => e.destroy(),
-    // Gets the current state of the onboarding with the current step
-    onboardingState: () => e.getState(),
-    // Recalculate and redraw the highlight
-    refresh: () => e.refresh(),
-    // Is the tour or highlight currently active
-    isActive: () => e.isActive(),
-    // Move to the next step
-    moveNext: () => e.moveNext(),
-    // Move to the previous step
-    movePrevious: () => e.movePrevious(),
-    // Move to the step 4
-    moveTo: (d) => e.moveTo(d),
-    // Is there a next step
-    hasNextStep: () => e.hasNextStep(),
-    // Is there a previous step
-    hasPreviousStep: () => e.hasPreviousStep(),
-    // Is the current step the first step
-    isFirstStep: () => e.isFirstStep(),
-    // Is the current step the last step
-    isLastStep: () => e.isLastStep(),
-    // Gets the active step index
-    getActiveIndex: () => e.getActiveIndex()
-  };
-}, C = (s) => {
-  const { allowClose: t = !0, stagePadding: r = 0, stageRadius: n = 5, noBackdrop: i = !0 } = s || {}, o = l({
-    allowClose: t,
-    stagePadding: r,
-    stageRadius: n,
-    overlayOpacity: i ? 0 : 0.5,
-    overlayColor: void 0
-  });
-  return {
-    highlight: (a) => o.highlight(a),
-    destroy: () => o.destroy(),
-    refresh: () => o.refresh(),
-    isActive: () => o.isActive()
-  };
+//#region src/hooks/useOnboarding.ts
+var t = (t) => {
+	let { steps: n, prevBtnText: r = "Previous", nextBtnText: i = "Next", doneBtnText: a = "Done", showProgress: o = !0, allowClose: s = !1, stagePadding: c = 10, stageRadius: l = 5, allowKeyboardControl: u = !0, showButtons: d, disableButtons: f, popoverClass: p, noBackdrop: m = !1, onPopoverRender: h = () => {}, onDestroyed: g = () => {}, ..._ } = t, v = (e, t) => {
+		h(e, t.state);
+	}, y = () => {
+		g();
+	}, b = !n || n.length === 1, x = e({
+		steps: n,
+		prevBtnText: r,
+		nextBtnText: i,
+		doneBtnText: a,
+		showProgress: !b && o,
+		showButtons: b ? ["close"] : d,
+		allowClose: s,
+		overlayOpacity: m ? 0 : .5,
+		disableButtons: f,
+		progressText: "{{current}} / {{total}}",
+		overlayColor: "var(--color-black)",
+		stagePadding: c,
+		stageRadius: l,
+		allowKeyboardControl: u,
+		popoverClass: p,
+		onPopoverRender: v,
+		onDestroyed: y,
+		..._
+	});
+	return {
+		run: () => x.drive(),
+		destroy: () => x.destroy(),
+		onboardingState: () => x.getState(),
+		refresh: () => x.refresh(),
+		isActive: () => x.isActive(),
+		moveNext: () => x.moveNext(),
+		movePrevious: () => x.movePrevious(),
+		moveTo: (e) => x.moveTo(e),
+		hasNextStep: () => x.hasNextStep(),
+		hasPreviousStep: () => x.hasPreviousStep(),
+		isFirstStep: () => x.isFirstStep(),
+		isLastStep: () => x.isLastStep(),
+		getActiveIndex: () => x.getActiveIndex()
+	};
+}, n = (t) => {
+	let { allowClose: n = !0, stagePadding: r = 0, stageRadius: i = 5, noBackdrop: a = !0 } = t || {}, o = e({
+		allowClose: n,
+		stagePadding: r,
+		stageRadius: i,
+		overlayOpacity: a ? 0 : .5,
+		overlayColor: void 0
+	});
+	return {
+		highlight: (e) => o.highlight(e),
+		destroy: () => o.destroy(),
+		refresh: () => o.refresh(),
+		isActive: () => o.isActive()
+	};
 };
-export {
-  C as useOnboardingTip,
-  A as useOnboardingTour
-};
-//# sourceMappingURL=useOnboarding.js.map
+//#endregion
+export { n as useOnboardingTip, t as useOnboardingTour };
+
+//# sourceMappingURL=useOnboarding.js.map

package/hooks/useOnboarding.js.map

@@ -1 +1 @@
-{"version":3,"file":"useOnboarding.js","sources":["../../src/hooks/useOnboarding.ts"],"sourcesContent":["import {\n    driver,\n    type PopoverDOM as DriverPopoverDOM,\n    type State as DriverState,\n    type AllowedButtons,\n    type DriveStep,\n    type DriverHook,\n} from 'driver.js';\nimport 'driver.js/dist/driver.css';\n\n// Features:\n// [x] - Close on click outside\n// [x] - Multiple steps with backdrop\n// [x] - drive vs. highlight\n// [x] - allow for controlling state (setStep, etc)\n// [-] - Single step to replace OnboardingTip (no buttons except close), no backdrop\n// [-] - Styling - as driver.js is using a singleton, setting styles for another onboarding step will override the global styles\n\nexport type PopoverDOM = DriverPopoverDOM;\nexport type OnboardingState = DriverState;\n\ntype DriverCallbackOptions = Parameters<DriverHook>[2];\n\ntype OnboardingPopoverContent = {\n    /**\n     * Title text to be shown.\n     *\n     * You can use HTML here, but maybe you shouldn't.\n     */\n    title?: string;\n\n    /**\n     * Description text to be shown.\n     *\n     * You can use HTML here, but maybe you shouldn't.\n     */\n    description?: string;\n\n    /**\n     * The position of the popover relative to the target element.\n     *\n     * @default 'left'\n     */\n    side?: 'top' | 'right' | 'bottom' | 'left' | 'over';\n\n    /**\n     * Where the popover is anchored to the target element.\n     *\n     * @default 'start'\n     */\n    align?: 'start' | 'center' | 'end';\n\n    /**\n     * The buttons that should be shown in the popover - for this step only.\n     *\n     * When highlighting a single element (there is just a single step), there are no buttons by default. When\n     * showing a step of a multi-step tour, all buttons are shown by default.\n     *\n     * The \"close\" button is a simple \"X\" in the popover.\n     * The \"previous\" and \"next\" buttons are actual text buttons. can define the text contents of those buttons via\n     * the {@link prevBtnText}, {@link nextBtnText} and {@link doneBtnText} properties.\n     *\n     * This overrides the showButtons array on the {@link OnboardingOptions}.\n     */\n    showButtons?: AllowedButtons[];\n\n    /**\n     * The buttons that should be disabled in the popover - for this step only.\n     *\n     * This is useful when you want to show some of the buttons, but disable them anyway.\n     *\n     * This overrides the disableButtons array on the {@link OnboardingOptions}.\n     */\n    disableButtons?: AllowedButtons[];\n\n    /**\n     * Whether to disable interaction with the highlighted element.\n     *\n     * @default false\n     */\n    disableActiveInteraction?: boolean;\n\n    /**\n     * Custom class to add to the popover element.\n     *\n     * This can be used to style the popover.\n     */\n    popoverClass?: string;\n\n    /**\n     * Text to use for the \"previous\" button - specific for this step only.\n     *\n     * This overrides the prevBtnText on the {@link OnboardingOptions}.\n     */\n    prevBtnText?: string;\n\n    /**\n     * Text to use for the \"next\" button - specific for this step only.\n     *\n     * This overrides the nextBtnText on the {@link OnboardingOptions}.\n     */\n    nextBtnText?: string;\n\n    /**\n     * Text to use for the \"done\" (a.k.a. the final \"next\") button - specific for this step only.\n     *\n     * This overrides the doneBtnText on the {@link OnboardingOptions}.\n     */\n    doneBtnText?: string;\n};\n\n/**\n * Describes a single step in an Onboarding Tour.\n *\n * Is based on the underlying {@link DriveStep driver.js step configuration object}.\n *\n * @see https://driverjs.com/docs/configuration\n */\nexport type OnboardingStep = DriveStep & {\n    /**\n     * The target element to highlight.\n     *\n     * This can be a DOM element (ref), a function that returns a DOM element, or a CSS selector (most likely, you want\n     * to go with a selector as it's the easiest one to implement).\n     *\n     * If this is a selector, the first matching element will be highlighted.\n     *\n     * If no element is given, the popover will simply be centered on the screen.\n     *\n     * @example '[data-onboarding-walkthrough-step=\"2\"]'\n     */\n    element?: string | Element;\n\n    /**\n     * Defines the content and appearance of the popover.\n     */\n    popover: OnboardingPopoverContent;\n\n    /**\n     * Callback triggered when the highlighting is about to become visible.\n     *\n     * @param element The target DOM element of the step.\n     * @param step The {@link DriveStep driver.js step object} configured for the step.\n     * @param opts The configuration options and current state of the driver object as well as the driver object itself.\n     */\n    onHighlightStarted?: (element: Element | undefined, step: OnboardingStep, opts: DriverCallbackOptions) => void;\n\n    /**\n     * Callback triggered when the highlight is visible.\n     *\n     * @param element The target DOM element of the step.\n     * @param step The {@link DriveStep driver.js step object} configured for the step.\n     * @param opts The configuration options and current state of the driver object as well as the driver object itself.\n     */\n    onHighlighted?: (element: Element | undefined, step: OnboardingStep, opts: DriverCallbackOptions) => void;\n\n    /**\n     * Callback triggered when the highlight is about to become invisible.\n     *\n     * @param element The target DOM element of the step.\n     * @param step The {@link DriveStep driver.js step object} configured for the step.\n     * @param opts The configuration options and current state of the driver object as well as the driver object itself.\n     */\n    onDeselected?: (element: Element | undefined, step: OnboardingStep, opts: DriverCallbackOptions) => void;\n};\n\ntype OnboardingOptions = {\n    /**\n     * Array of steps to highlight.\n     *\n     * You should pass this when you want to set up a tour.\n     */\n    steps?: OnboardingStep[];\n\n    /**\n     * Array of buttons to show in the popover.\n     *\n     * When highlighting a single element (there is just a single step), there are no buttons by default. When showing\n     * a step of a multi-step tour, all buttons are shown by default.\n     *\n     * The `close` button is a simple \"X\" in the popover.\n     *\n     * The `previous` and `next` buttons are actual text buttons. You can define the text contents of those buttons via\n     * the {@link prevBtnText}, {@link nextBtnText} and {@link doneBtnText} properties.\n     *\n     * Defaults to [\"next\", \"previous\", \"close\"] for product tours and [] for single element highlighting.\n     *\n     * @default '[\"next\", \"previous\", \"close\"]'\n     */\n    showButtons?: AllowedButtons[];\n\n    /**\n     * The buttons that should be disabled in popovers.\n     *\n     * This is useful when you want to show some of the buttons, but disable them anyway.\n     */\n    disableButtons?: AllowedButtons[];\n\n    /**\n     * Text to use for the \"previous\" button.\n     *\n     * @default 'Previous'\n     */\n    prevBtnText?: string;\n\n    /**\n     * Text to use for the \"next\" button.\n     *\n     * @default 'Next'\n     */\n    nextBtnText?: string;\n\n    /**\n     * Text to use for the \"done\" (a.k.a. the final \"next\") button.\n     *\n     * When given, this overrides the {@link nextBtnText} in the final popover of a tour.\n     *\n     * @default 'Done'\n     */\n    doneBtnText?: string;\n\n    /**\n     * Indicates whether to show progress in the onboarding popover.\n     *\n     * @default true\n     */\n    showProgress?: boolean;\n\n    /**\n     * Whether to allow closing the popover by clicking on the backdrop.\n     *\n     * This should be disabled during a tour to ensure the user completes the tour, but can be enabled on the last step.\n     *\n     * @default false\n     */\n    allowClose?: boolean;\n\n    /**\n     * Distance between the highlighted element and the cutout.\n     *\n     * @default 10\n     */\n    stagePadding?: number;\n\n    /**\n     * Radius of the cutout around the highlighted element.\n     *\n     * @default 5\n     */\n    stageRadius?: number;\n\n    /**\n     * Whether to allow keyboard navigation.\n     *\n     * @default true\n     */\n    allowKeyboardControl?: boolean;\n\n    /**\n     * Whether to disable interaction with the highlighted element.\n     * Can be configured at the step level as well.\n     *\n     * @default false\n     */\n    disableActiveInteraction?: boolean;\n\n    /**\n     * Option to disable the backdrop. Note, the backdrop element is still there but with 100% opacity\n     * and the close on the backdrop is disabled.\n     *\n     * @default false\n     */\n    noBackdrop?: boolean;\n\n    /**\n     * Additional classes set on the popover itself.\n     */\n    popoverClass?: string;\n\n    /**\n     * Callback triggered when an onboarding popover renders.\n     *\n     * @param element The target DOM element of the step.\n     * @param opts The configuration options and current state of the driver object as well as the driver object itself.\n     */\n    onPopoverRender?: (popover: PopoverDOM, opts: OnboardingState) => void;\n\n    /**\n     * Callback triggered when the onboarding tour is destroyed.\n     */\n    onDestroyed?: () => void;\n};\n\nexport const useOnboardingTour = (params: OnboardingOptions) => {\n    const {\n        steps,\n        prevBtnText = 'Previous',\n        nextBtnText = 'Next',\n        doneBtnText = 'Done',\n        showProgress = true,\n        allowClose = false,\n        stagePadding = 10,\n        stageRadius = 5,\n        allowKeyboardControl = true,\n        showButtons,\n        disableButtons,\n        popoverClass,\n        noBackdrop = false,\n        onPopoverRender = () => {},\n        onDestroyed = () => {},\n        ...driverProps\n    } = params;\n\n    const handlePopoverRender = (popover: DriverPopoverDOM, options: DriverCallbackOptions) => {\n        onPopoverRender(popover, options.state);\n    };\n\n    const handleDestroyed = () => {\n        onDestroyed();\n    };\n\n    const isSingleStep = !steps || steps.length === 1;\n\n    // This configuration is applied to all steps.\n    // Driver.js allows also for individual customization for single steps too.\n    const driverInstance = driver({\n        steps,\n        prevBtnText,\n        nextBtnText,\n        doneBtnText,\n        showProgress: isSingleStep ? false : showProgress,\n        showButtons: isSingleStep ? (['close'] as AllowedButtons[]) : showButtons,\n        allowClose,\n        overlayOpacity: noBackdrop ? 0 : 0.5,\n        disableButtons,\n        progressText: '{{current}} / {{total}}',\n        overlayColor: 'var(--color-black)',\n        stagePadding,\n        stageRadius,\n        allowKeyboardControl,\n        popoverClass,\n        onPopoverRender: handlePopoverRender,\n        onDestroyed: handleDestroyed,\n        ...driverProps,\n    });\n\n    return {\n        // Use for onboarding tours. Pass in all steps as \"steps\" parameter for initial configuration.\n        run: () => driverInstance.drive(),\n\n        // Use for single element highlights -> see useOnboardingTip\n        // highlight: (step: OnboardingStep) => driverInstance.highlight(step),\n\n        // Cleanup the onboarding\n        destroy: () => driverInstance.destroy(),\n\n        // Gets the current state of the onboarding with the current step\n        onboardingState: () => driverInstance.getState(),\n\n        // Recalculate and redraw the highlight\n        refresh: () => driverInstance.refresh(),\n\n        // Is the tour or highlight currently active\n        isActive: () => driverInstance.isActive(),\n\n        // Move to the next step\n        moveNext: () => driverInstance.moveNext(),\n\n        // Move to the previous step\n        movePrevious: () => driverInstance.movePrevious(),\n\n        // Move to the step 4\n        moveTo: (stepNumber: number) => driverInstance.moveTo(stepNumber),\n\n        // Is there a next step\n        hasNextStep: () => driverInstance.hasNextStep(),\n\n        // Is there a previous step\n        hasPreviousStep: () => driverInstance.hasPreviousStep(),\n\n        // Is the current step the first step\n        isFirstStep: () => driverInstance.isFirstStep(),\n\n        // Is the current step the last step\n        isLastStep: () => driverInstance.isLastStep(),\n\n        // Gets the active step index\n        getActiveIndex: () => driverInstance.getActiveIndex(),\n    };\n};\n\ntype OnboardingTipOptions = {\n    allowClose?: boolean;\n    stagePadding?: number;\n    stageRadius?: number;\n    noBackdrop?: boolean;\n};\n\n/**\n * Note: please use the {@link import('../components/onboarding/OnboardingTip')#default OnboardingTip} instead of this\n * hook!\n *\n * This is kept only for future development of driver.js with the hope to solve the global driver styling issue and to\n * eventually replace the OnboardingTooltip also with driver.js.\n *\n * @experimental\n */\nexport const useOnboardingTip = (options?: OnboardingTipOptions) => {\n    const { allowClose = true, stagePadding = 0, stageRadius = 5, noBackdrop = true } = options || {};\n\n    const driverInstance = driver({\n        allowClose,\n        stagePadding,\n        stageRadius,\n        overlayOpacity: noBackdrop ? 0 : 0.5,\n        overlayColor: undefined,\n    });\n\n    return {\n        highlight: (step: OnboardingStep) => driverInstance.highlight(step),\n        destroy: () => driverInstance.destroy(),\n        refresh: () => driverInstance.refresh(),\n        isActive: () => driverInstance.isActive(),\n    };\n};\n"],"names":["useOnboardingTour","params","steps","prevBtnText","nextBtnText","doneBtnText","showProgress","allowClose","stagePadding","stageRadius","allowKeyboardControl","showButtons","disableButtons","popoverClass","noBackdrop","onPopoverRender","onDestroyed","driverProps","handlePopoverRender","popover","options","handleDestroyed","isSingleStep","driverInstance","driver","stepNumber","useOnboardingTip","step"],"mappings":";;AAqSO,MAAMA,IAAoB,CAACC,MAA8B;AAC5D,QAAM;AAAA,IACF,OAAAC;AAAA,IACA,aAAAC,IAAc;AAAA,IACd,aAAAC,IAAc;AAAA,IACd,aAAAC,IAAc;AAAA,IACd,cAAAC,IAAe;AAAA,IACf,YAAAC,IAAa;AAAA,IACb,cAAAC,IAAe;AAAA,IACf,aAAAC,IAAc;AAAA,IACd,sBAAAC,IAAuB;AAAA,IACvB,aAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,cAAAC;AAAA,IACA,YAAAC,IAAa;AAAA,IACb,iBAAAC,IAAkB,MAAM;AAAA,IAAC;AAAA,IACzB,aAAAC,IAAc,MAAM;AAAA,IAAC;AAAA,IACrB,GAAGC;AAAA,EAAA,IACHhB,GAEEiB,IAAsB,CAACC,GAA2BC,MAAmC;AACvF,IAAAL,EAAgBI,GAASC,EAAQ,KAAK;AAAA,EAC1C,GAEMC,IAAkB,MAAM;AAC1B,IAAAL,EAAA;AAAA,EACJ,GAEMM,IAAe,CAACpB,KAASA,EAAM,WAAW,GAI1CqB,IAAiBC,EAAO;AAAA,IAC1B,OAAAtB;AAAA,IACA,aAAAC;AAAA,IACA,aAAAC;AAAA,IACA,aAAAC;AAAA,IACA,cAAciB,IAAe,KAAQhB;AAAA,IACrC,aAAagB,IAAgB,CAAC,OAAO,IAAyBX;AAAA,IAC9D,YAAAJ;AAAA,IACA,gBAAgBO,IAAa,IAAI;AAAA,IACjC,gBAAAF;AAAA,IACA,cAAc;AAAA,IACd,cAAc;AAAA,IACd,cAAAJ;AAAA,IACA,aAAAC;AAAA,IACA,sBAAAC;AAAA,IACA,cAAAG;AAAA,IACA,iBAAiBK;AAAA,IACjB,aAAaG;AAAA,IACb,GAAGJ;AAAA,EAAA,CACN;AAED,SAAO;AAAA;AAAA,IAEH,KAAK,MAAMM,EAAe,MAAA;AAAA;AAAA;AAAA;AAAA,IAM1B,SAAS,MAAMA,EAAe,QAAA;AAAA;AAAA,IAG9B,iBAAiB,MAAMA,EAAe,SAAA;AAAA;AAAA,IAGtC,SAAS,MAAMA,EAAe,QAAA;AAAA;AAAA,IAG9B,UAAU,MAAMA,EAAe,SAAA;AAAA;AAAA,IAG/B,UAAU,MAAMA,EAAe,SAAA;AAAA;AAAA,IAG/B,cAAc,MAAMA,EAAe,aAAA;AAAA;AAAA,IAGnC,QAAQ,CAACE,MAAuBF,EAAe,OAAOE,CAAU;AAAA;AAAA,IAGhE,aAAa,MAAMF,EAAe,YAAA;AAAA;AAAA,IAGlC,iBAAiB,MAAMA,EAAe,gBAAA;AAAA;AAAA,IAGtC,aAAa,MAAMA,EAAe,YAAA;AAAA;AAAA,IAGlC,YAAY,MAAMA,EAAe,WAAA;AAAA;AAAA,IAGjC,gBAAgB,MAAMA,EAAe,eAAA;AAAA,EAAe;AAE5D,GAkBaG,IAAmB,CAACN,MAAmC;AAChE,QAAM,EAAE,YAAAb,IAAa,IAAM,cAAAC,IAAe,GAAG,aAAAC,IAAc,GAAG,YAAAK,IAAa,GAAA,IAASM,KAAW,CAAA,GAEzFG,IAAiBC,EAAO;AAAA,IAC1B,YAAAjB;AAAA,IACA,cAAAC;AAAA,IACA,aAAAC;AAAA,IACA,gBAAgBK,IAAa,IAAI;AAAA,IACjC,cAAc;AAAA,EAAA,CACjB;AAED,SAAO;AAAA,IACH,WAAW,CAACa,MAAyBJ,EAAe,UAAUI,CAAI;AAAA,IAClE,SAAS,MAAMJ,EAAe,QAAA;AAAA,IAC9B,SAAS,MAAMA,EAAe,QAAA;AAAA,IAC9B,UAAU,MAAMA,EAAe,SAAA;AAAA,EAAS;AAEhD;"}
+{"version":3,"file":"useOnboarding.js","names":[],"sources":["../../src/hooks/useOnboarding.ts"],"sourcesContent":["import {\n    driver,\n    type PopoverDOM as DriverPopoverDOM,\n    type State as DriverState,\n    type AllowedButtons,\n    type DriveStep,\n    type DriverHook,\n} from 'driver.js';\nimport 'driver.js/dist/driver.css';\n\n// Features:\n// [x] - Close on click outside\n// [x] - Multiple steps with backdrop\n// [x] - drive vs. highlight\n// [x] - allow for controlling state (setStep, etc)\n// [-] - Single step to replace OnboardingTip (no buttons except close), no backdrop\n// [-] - Styling - as driver.js is using a singleton, setting styles for another onboarding step will override the global styles\n\nexport type PopoverDOM = DriverPopoverDOM;\nexport type OnboardingState = DriverState;\n\ntype DriverCallbackOptions = Parameters<DriverHook>[2];\n\ntype OnboardingPopoverContent = {\n    /**\n     * Title text to be shown.\n     *\n     * You can use HTML here, but maybe you shouldn't.\n     */\n    title?: string;\n\n    /**\n     * Description text to be shown.\n     *\n     * You can use HTML here, but maybe you shouldn't.\n     */\n    description?: string;\n\n    /**\n     * The position of the popover relative to the target element.\n     *\n     * @default 'left'\n     */\n    side?: 'top' | 'right' | 'bottom' | 'left' | 'over';\n\n    /**\n     * Where the popover is anchored to the target element.\n     *\n     * @default 'start'\n     */\n    align?: 'start' | 'center' | 'end';\n\n    /**\n     * The buttons that should be shown in the popover - for this step only.\n     *\n     * When highlighting a single element (there is just a single step), there are no buttons by default. When\n     * showing a step of a multi-step tour, all buttons are shown by default.\n     *\n     * The \"close\" button is a simple \"X\" in the popover.\n     * The \"previous\" and \"next\" buttons are actual text buttons. can define the text contents of those buttons via\n     * the {@link prevBtnText}, {@link nextBtnText} and {@link doneBtnText} properties.\n     *\n     * This overrides the showButtons array on the {@link OnboardingOptions}.\n     */\n    showButtons?: AllowedButtons[];\n\n    /**\n     * The buttons that should be disabled in the popover - for this step only.\n     *\n     * This is useful when you want to show some of the buttons, but disable them anyway.\n     *\n     * This overrides the disableButtons array on the {@link OnboardingOptions}.\n     */\n    disableButtons?: AllowedButtons[];\n\n    /**\n     * Whether to disable interaction with the highlighted element.\n     *\n     * @default false\n     */\n    disableActiveInteraction?: boolean;\n\n    /**\n     * Custom class to add to the popover element.\n     *\n     * This can be used to style the popover.\n     */\n    popoverClass?: string;\n\n    /**\n     * Text to use for the \"previous\" button - specific for this step only.\n     *\n     * This overrides the prevBtnText on the {@link OnboardingOptions}.\n     */\n    prevBtnText?: string;\n\n    /**\n     * Text to use for the \"next\" button - specific for this step only.\n     *\n     * This overrides the nextBtnText on the {@link OnboardingOptions}.\n     */\n    nextBtnText?: string;\n\n    /**\n     * Text to use for the \"done\" (a.k.a. the final \"next\") button - specific for this step only.\n     *\n     * This overrides the doneBtnText on the {@link OnboardingOptions}.\n     */\n    doneBtnText?: string;\n};\n\n/**\n * Describes a single step in an Onboarding Tour.\n *\n * Is based on the underlying {@link DriveStep driver.js step configuration object}.\n *\n * @see https://driverjs.com/docs/configuration\n */\nexport type OnboardingStep = DriveStep & {\n    /**\n     * The target element to highlight.\n     *\n     * This can be a DOM element (ref), a function that returns a DOM element, or a CSS selector (most likely, you want\n     * to go with a selector as it's the easiest one to implement).\n     *\n     * If this is a selector, the first matching element will be highlighted.\n     *\n     * If no element is given, the popover will simply be centered on the screen.\n     *\n     * @example '[data-onboarding-walkthrough-step=\"2\"]'\n     */\n    element?: string | Element;\n\n    /**\n     * Defines the content and appearance of the popover.\n     */\n    popover: OnboardingPopoverContent;\n\n    /**\n     * Callback triggered when the highlighting is about to become visible.\n     *\n     * @param element The target DOM element of the step.\n     * @param step The {@link DriveStep driver.js step object} configured for the step.\n     * @param opts The configuration options and current state of the driver object as well as the driver object itself.\n     */\n    onHighlightStarted?: (element: Element | undefined, step: OnboardingStep, opts: DriverCallbackOptions) => void;\n\n    /**\n     * Callback triggered when the highlight is visible.\n     *\n     * @param element The target DOM element of the step.\n     * @param step The {@link DriveStep driver.js step object} configured for the step.\n     * @param opts The configuration options and current state of the driver object as well as the driver object itself.\n     */\n    onHighlighted?: (element: Element | undefined, step: OnboardingStep, opts: DriverCallbackOptions) => void;\n\n    /**\n     * Callback triggered when the highlight is about to become invisible.\n     *\n     * @param element The target DOM element of the step.\n     * @param step The {@link DriveStep driver.js step object} configured for the step.\n     * @param opts The configuration options and current state of the driver object as well as the driver object itself.\n     */\n    onDeselected?: (element: Element | undefined, step: OnboardingStep, opts: DriverCallbackOptions) => void;\n};\n\ntype OnboardingOptions = {\n    /**\n     * Array of steps to highlight.\n     *\n     * You should pass this when you want to set up a tour.\n     */\n    steps?: OnboardingStep[];\n\n    /**\n     * Array of buttons to show in the popover.\n     *\n     * When highlighting a single element (there is just a single step), there are no buttons by default. When showing\n     * a step of a multi-step tour, all buttons are shown by default.\n     *\n     * The `close` button is a simple \"X\" in the popover.\n     *\n     * The `previous` and `next` buttons are actual text buttons. You can define the text contents of those buttons via\n     * the {@link prevBtnText}, {@link nextBtnText} and {@link doneBtnText} properties.\n     *\n     * Defaults to [\"next\", \"previous\", \"close\"] for product tours and [] for single element highlighting.\n     *\n     * @default '[\"next\", \"previous\", \"close\"]'\n     */\n    showButtons?: AllowedButtons[];\n\n    /**\n     * The buttons that should be disabled in popovers.\n     *\n     * This is useful when you want to show some of the buttons, but disable them anyway.\n     */\n    disableButtons?: AllowedButtons[];\n\n    /**\n     * Text to use for the \"previous\" button.\n     *\n     * @default 'Previous'\n     */\n    prevBtnText?: string;\n\n    /**\n     * Text to use for the \"next\" button.\n     *\n     * @default 'Next'\n     */\n    nextBtnText?: string;\n\n    /**\n     * Text to use for the \"done\" (a.k.a. the final \"next\") button.\n     *\n     * When given, this overrides the {@link nextBtnText} in the final popover of a tour.\n     *\n     * @default 'Done'\n     */\n    doneBtnText?: string;\n\n    /**\n     * Indicates whether to show progress in the onboarding popover.\n     *\n     * @default true\n     */\n    showProgress?: boolean;\n\n    /**\n     * Whether to allow closing the popover by clicking on the backdrop.\n     *\n     * This should be disabled during a tour to ensure the user completes the tour, but can be enabled on the last step.\n     *\n     * @default false\n     */\n    allowClose?: boolean;\n\n    /**\n     * Distance between the highlighted element and the cutout.\n     *\n     * @default 10\n     */\n    stagePadding?: number;\n\n    /**\n     * Radius of the cutout around the highlighted element.\n     *\n     * @default 5\n     */\n    stageRadius?: number;\n\n    /**\n     * Whether to allow keyboard navigation.\n     *\n     * @default true\n     */\n    allowKeyboardControl?: boolean;\n\n    /**\n     * Whether to disable interaction with the highlighted element.\n     * Can be configured at the step level as well.\n     *\n     * @default false\n     */\n    disableActiveInteraction?: boolean;\n\n    /**\n     * Option to disable the backdrop. Note, the backdrop element is still there but with 100% opacity\n     * and the close on the backdrop is disabled.\n     *\n     * @default false\n     */\n    noBackdrop?: boolean;\n\n    /**\n     * Additional classes set on the popover itself.\n     */\n    popoverClass?: string;\n\n    /**\n     * Callback triggered when an onboarding popover renders.\n     *\n     * @param element The target DOM element of the step.\n     * @param opts The configuration options and current state of the driver object as well as the driver object itself.\n     */\n    onPopoverRender?: (popover: PopoverDOM, opts: OnboardingState) => void;\n\n    /**\n     * Callback triggered when the onboarding tour is destroyed.\n     */\n    onDestroyed?: () => void;\n};\n\nexport const useOnboardingTour = (params: OnboardingOptions) => {\n    const {\n        steps,\n        prevBtnText = 'Previous',\n        nextBtnText = 'Next',\n        doneBtnText = 'Done',\n        showProgress = true,\n        allowClose = false,\n        stagePadding = 10,\n        stageRadius = 5,\n        allowKeyboardControl = true,\n        showButtons,\n        disableButtons,\n        popoverClass,\n        noBackdrop = false,\n        onPopoverRender = () => {},\n        onDestroyed = () => {},\n        ...driverProps\n    } = params;\n\n    const handlePopoverRender = (popover: DriverPopoverDOM, options: DriverCallbackOptions) => {\n        onPopoverRender(popover, options.state);\n    };\n\n    const handleDestroyed = () => {\n        onDestroyed();\n    };\n\n    const isSingleStep = !steps || steps.length === 1;\n\n    // This configuration is applied to all steps.\n    // Driver.js allows also for individual customization for single steps too.\n    const driverInstance = driver({\n        steps,\n        prevBtnText,\n        nextBtnText,\n        doneBtnText,\n        showProgress: isSingleStep ? false : showProgress,\n        showButtons: isSingleStep ? (['close'] as AllowedButtons[]) : showButtons,\n        allowClose,\n        overlayOpacity: noBackdrop ? 0 : 0.5,\n        disableButtons,\n        progressText: '{{current}} / {{total}}',\n        overlayColor: 'var(--color-black)',\n        stagePadding,\n        stageRadius,\n        allowKeyboardControl,\n        popoverClass,\n        onPopoverRender: handlePopoverRender,\n        onDestroyed: handleDestroyed,\n        ...driverProps,\n    });\n\n    return {\n        // Use for onboarding tours. Pass in all steps as \"steps\" parameter for initial configuration.\n        run: () => driverInstance.drive(),\n\n        // Use for single element highlights -> see useOnboardingTip\n        // highlight: (step: OnboardingStep) => driverInstance.highlight(step),\n\n        // Cleanup the onboarding\n        destroy: () => driverInstance.destroy(),\n\n        // Gets the current state of the onboarding with the current step\n        onboardingState: () => driverInstance.getState(),\n\n        // Recalculate and redraw the highlight\n        refresh: () => driverInstance.refresh(),\n\n        // Is the tour or highlight currently active\n        isActive: () => driverInstance.isActive(),\n\n        // Move to the next step\n        moveNext: () => driverInstance.moveNext(),\n\n        // Move to the previous step\n        movePrevious: () => driverInstance.movePrevious(),\n\n        // Move to the step 4\n        moveTo: (stepNumber: number) => driverInstance.moveTo(stepNumber),\n\n        // Is there a next step\n        hasNextStep: () => driverInstance.hasNextStep(),\n\n        // Is there a previous step\n        hasPreviousStep: () => driverInstance.hasPreviousStep(),\n\n        // Is the current step the first step\n        isFirstStep: () => driverInstance.isFirstStep(),\n\n        // Is the current step the last step\n        isLastStep: () => driverInstance.isLastStep(),\n\n        // Gets the active step index\n        getActiveIndex: () => driverInstance.getActiveIndex(),\n    };\n};\n\ntype OnboardingTipOptions = {\n    allowClose?: boolean;\n    stagePadding?: number;\n    stageRadius?: number;\n    noBackdrop?: boolean;\n};\n\n/**\n * Note: please use the {@link import('../components/onboarding/OnboardingTip')#default OnboardingTip} instead of this\n * hook!\n *\n * This is kept only for future development of driver.js with the hope to solve the global driver styling issue and to\n * eventually replace the OnboardingTooltip also with driver.js.\n *\n * @experimental\n */\nexport const useOnboardingTip = (options?: OnboardingTipOptions) => {\n    const { allowClose = true, stagePadding = 0, stageRadius = 5, noBackdrop = true } = options || {};\n\n    const driverInstance = driver({\n        allowClose,\n        stagePadding,\n        stageRadius,\n        overlayOpacity: noBackdrop ? 0 : 0.5,\n        overlayColor: undefined,\n    });\n\n    return {\n        highlight: (step: OnboardingStep) => driverInstance.highlight(step),\n        destroy: () => driverInstance.destroy(),\n        refresh: () => driverInstance.refresh(),\n        isActive: () => driverInstance.isActive(),\n    };\n};\n"],"mappings":";;;AAqSA,IAAa,KAAqB,MAA8B;CAC5D,IAAM,EACF,UACA,iBAAc,YACd,iBAAc,QACd,iBAAc,QACd,kBAAe,IACf,gBAAa,IACb,kBAAe,IACf,iBAAc,GACd,0BAAuB,IACvB,gBACA,mBACA,iBACA,gBAAa,IACb,2BAAwB,CAAC,GACzB,uBAAoB,CAAC,GACrB,GAAG,MACH,GAEE,KAAuB,GAA2B,MAAmC;EACvF,EAAgB,GAAS,EAAQ,KAAK;CAC1C,GAEM,UAAwB;EAC1B,EAAY;CAChB,GAEM,IAAe,CAAC,KAAS,EAAM,WAAW,GAI1C,IAAiB,EAAO;EAC1B;EACA;EACA;EACA;EACA,cAAc,MAAuB;EACrC,aAAa,IAAgB,CAAC,OAAO,IAAyB;EAC9D;EACA,gBAAgB,IAAa,IAAI;EACjC;EACA,cAAc;EACd,cAAc;EACd;EACA;EACA;EACA;EACA,iBAAiB;EACjB,aAAa;EACb,GAAG;CACP,CAAC;CAED,OAAO;EAEH,WAAW,EAAe,MAAM;EAMhC,eAAe,EAAe,QAAQ;EAGtC,uBAAuB,EAAe,SAAS;EAG/C,eAAe,EAAe,QAAQ;EAGtC,gBAAgB,EAAe,SAAS;EAGxC,gBAAgB,EAAe,SAAS;EAGxC,oBAAoB,EAAe,aAAa;EAGhD,SAAS,MAAuB,EAAe,OAAO,CAAU;EAGhE,mBAAmB,EAAe,YAAY;EAG9C,uBAAuB,EAAe,gBAAgB;EAGtD,mBAAmB,EAAe,YAAY;EAG9C,kBAAkB,EAAe,WAAW;EAG5C,sBAAsB,EAAe,eAAe;CACxD;AACJ,GAkBa,KAAoB,MAAmC;CAChE,IAAM,EAAE,gBAAa,IAAM,kBAAe,GAAG,iBAAc,GAAG,gBAAa,OAAS,KAAW,CAAC,GAE1F,IAAiB,EAAO;EAC1B;EACA;EACA;EACA,gBAAgB,IAAa,IAAI;EACjC,cAAc,KAAA;CAClB,CAAC;CAED,OAAO;EACH,YAAY,MAAyB,EAAe,UAAU,CAAI;EAClE,eAAe,EAAe,QAAQ;EACtC,eAAe,EAAe,QAAQ;EACtC,gBAAgB,EAAe,SAAS;CAC5C;AACJ"}

package/hooks/useOnlineStatus.js

@@ -1,10 +1,11 @@
-import { useState as t } from "react";
 import e from "./useEvent.js";
-const r = () => {
-  const [o, n] = t(navigator.onLine);
-  return e("online", () => n(navigator.onLine), !1, window), e("offline", () => n(navigator.onLine), !1, window), o;
-};
-export {
-  r as default
+import { useState as t } from "react";
+//#region src/hooks/useOnlineStatus.ts
+var n = () => {
+	let [n, r] = t(navigator.onLine);
+	return e("online", () => r(navigator.onLine), !1, window), e("offline", () => r(navigator.onLine), !1, window), n;
 };
-//# sourceMappingURL=useOnlineStatus.js.map
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=useOnlineStatus.js.map

package/hooks/useOnlineStatus.js.map

@@ -1 +1 @@
-{"version":3,"file":"useOnlineStatus.js","sources":["../../src/hooks/useOnlineStatus.ts"],"sourcesContent":["// Inspired by https://github.com/WebDevSimplified/useful-custom-react-hooks/blob/main/src/26-useOnlineStatus/useOnlineStatus.js\nimport { useState } from 'react';\n\nimport useEvent from './useEvent';\n\n/**\n * Custom hook to track online/offline status of the browser.\n *\n * @returns Returns true if the browser is online, otherwise false.\n */\nconst useOnlineStatus = (): boolean => {\n    const [online, setOnline] = useState(navigator.onLine);\n\n    useEvent('online', () => setOnline(navigator.onLine), false, window);\n    useEvent('offline', () => setOnline(navigator.onLine), false, window);\n\n    return online;\n};\n\nexport default useOnlineStatus;\n"],"names":["useOnlineStatus","online","setOnline","useState","useEvent"],"mappings":";;AAUA,MAAMA,IAAkB,MAAe;AACnC,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAS,UAAU,MAAM;AAErD,SAAAC,EAAS,UAAU,MAAMF,EAAU,UAAU,MAAM,GAAG,IAAO,MAAM,GACnEE,EAAS,WAAW,MAAMF,EAAU,UAAU,MAAM,GAAG,IAAO,MAAM,GAE7DD;AACX;"}
+{"version":3,"file":"useOnlineStatus.js","names":[],"sources":["../../src/hooks/useOnlineStatus.ts"],"sourcesContent":["// Inspired by https://github.com/WebDevSimplified/useful-custom-react-hooks/blob/main/src/26-useOnlineStatus/useOnlineStatus.js\nimport { useState } from 'react';\n\nimport useEvent from './useEvent';\n\n/**\n * Custom hook to track online/offline status of the browser.\n *\n * @returns Returns true if the browser is online, otherwise false.\n */\nconst useOnlineStatus = (): boolean => {\n    const [online, setOnline] = useState(navigator.onLine);\n\n    useEvent('online', () => setOnline(navigator.onLine), false, window);\n    useEvent('offline', () => setOnline(navigator.onLine), false, window);\n\n    return online;\n};\n\nexport default useOnlineStatus;\n"],"mappings":";;;AAUA,IAAM,UAAiC;CACnC,IAAM,CAAC,GAAQ,KAAa,EAAS,UAAU,MAAM;CAKrD,OAHA,EAAS,gBAAgB,EAAU,UAAU,MAAM,GAAG,IAAO,MAAM,GACnE,EAAS,iBAAiB,EAAU,UAAU,MAAM,GAAG,IAAO,MAAM,GAE7D;AACX"}

package/hooks/usePostMessage.js

@@ -1,29 +1,28 @@
-import { useEffect as d } from "react";
-import { isEmpty as p, noop as u } from "es-toolkit/compat";
-const l = (o, r) => {
-  const i = (s) => {
-    const e = document.referrer;
-    e && window.parent.postMessage(s, e);
-  }, a = (s, e) => {
-    if (!e || p(e))
-      return;
-    [...Array.isArray(e) ? [...e] : [e]].forEach((f) => {
-      const t = f.contentWindow;
-      t && t.postMessage(s, "*");
-    });
-  }, c = (s, e) => {
-    const n = s.data.type;
-    n && n.startsWith(o) && e(s.data);
-  };
-  return d(() => {
-    const s = (e) => c(e, r || u);
-    return window.addEventListener("message", s, !1), () => window.removeEventListener("message", s, !1);
-  }, []), {
-    sendMessageToParent: i,
-    sendMessageToWidget: a
-  };
+import { useEffect as e } from "react";
+import { isEmpty as t, noop as n } from "es-toolkit/compat";
+//#region src/hooks/usePostMessage.ts
+var r = (r, i) => {
+	let a = (e) => {
+		let t = document.referrer;
+		t && window.parent.postMessage(e, t);
+	}, o = (e, n) => {
+		!n || t(n) || [...Array.isArray(n) ? [...n] : [n]].forEach((t) => {
+			let n = t.contentWindow;
+			n && n.postMessage(e, "*");
+		});
+	}, s = (e, t) => {
+		let n = e.data.type;
+		n && n.startsWith(r) && t(e.data);
+	};
+	return e(() => {
+		let e = (e) => s(e, i || n);
+		return window.addEventListener("message", e, !1), () => window.removeEventListener("message", e, !1);
+	}, []), {
+		sendMessageToParent: a,
+		sendMessageToWidget: o
+	};
 };
-export {
-  l as default
-};
-//# sourceMappingURL=usePostMessage.js.map
+//#endregion
+export { r as default };
+
+//# sourceMappingURL=usePostMessage.js.map

package/hooks/usePostMessage.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePostMessage.js","sources":["../../src/hooks/usePostMessage.ts"],"sourcesContent":["import { useEffect } from 'react';\nimport { isEmpty, noop } from 'es-toolkit/compat';\n\nexport type RemoteAction = {\n    /**\n     * The RemoteAction is inspired by a plain redux action where the type is the\n     * action identifier.\n     *\n     * @example\n     *\n     * ```json\n     * {\n     *      \"type\": \"EVENT_SET_VISIBLE_WIDGETS\",\n     *      \"payload\": [\"foo\", \"bar\"],\n     * }\n     * ```\n     */\n    type: string;\n\n    /**\n     * The action payload itself.\n     */\n    payload: any;\n};\n\n/**\n * A custom hook to ease the exchange of postMessage events between iframes and the parent window.\n *\n * @param messagePrefix a custom prefix to limit the event listener for these events\n * @param onReceiveMessage a callback function triggered when a message is received\n * @deprecated Please use the {@link import('./useIncomingPostMessages')#default useIncomingPostMessages} and/or\n * {@link import('./usePostMessageSender')#default usePostMessageSender} hooks instead.\n */\nconst usePostMessage = (messagePrefix: string, onReceiveMessage?: (eventData: any) => void) => {\n    const sendMessageToParent = (message: RemoteAction) => {\n        const referrer = document.referrer;\n        if (referrer) {\n            window.parent.postMessage(message, referrer);\n        }\n    };\n\n    const sendMessageToWidget = (message: RemoteAction, targetFrames: HTMLIFrameElement | HTMLIFrameElement[]) => {\n        if (!targetFrames || isEmpty(targetFrames)) {\n            return;\n        }\n\n        const frames = Array.isArray(targetFrames) ? [...targetFrames] : [targetFrames];\n\n        [...frames].forEach(target => {\n            const contentWindow = target.contentWindow;\n            if (contentWindow) {\n                contentWindow.postMessage(message, '*');\n            }\n        });\n    };\n\n    const receiveMessage = (event: MessageEvent, callback: (eventData: any) => void) => {\n        const actionType = event.data.type;\n        if (!actionType) {\n            return;\n        }\n\n        if (actionType.startsWith(messagePrefix)) {\n            callback(event.data);\n        }\n    };\n\n    useEffect(() => {\n        const listenerCallback = (event: MessageEvent) => receiveMessage(event, onReceiveMessage || noop);\n        window.addEventListener('message', listenerCallback, false);\n        return () => window.removeEventListener('message', listenerCallback, false);\n    }, []);\n\n    return {\n        sendMessageToParent,\n        sendMessageToWidget,\n    };\n};\n\nexport default usePostMessage;\n"],"names":["usePostMessage","messagePrefix","onReceiveMessage","sendMessageToParent","message","referrer","sendMessageToWidget","targetFrames","isEmpty","target","contentWindow","receiveMessage","event","callback","actionType","useEffect","listenerCallback","noop"],"mappings":";;AAiCA,MAAMA,IAAiB,CAACC,GAAuBC,MAAgD;AAC3F,QAAMC,IAAsB,CAACC,MAA0B;AACnD,UAAMC,IAAW,SAAS;AAC1B,IAAIA,KACA,OAAO,OAAO,YAAYD,GAASC,CAAQ;AAAA,EAEnD,GAEMC,IAAsB,CAACF,GAAuBG,MAA0D;AAC1G,QAAI,CAACA,KAAgBC,EAAQD,CAAY;AACrC;AAKJ,KAAC,GAFc,MAAM,QAAQA,CAAY,IAAI,CAAC,GAAGA,CAAY,IAAI,CAACA,CAAY,CAEpE,EAAE,QAAQ,CAAAE,MAAU;AAC1B,YAAMC,IAAgBD,EAAO;AAC7B,MAAIC,KACAA,EAAc,YAAYN,GAAS,GAAG;AAAA,IAE9C,CAAC;AAAA,EACL,GAEMO,IAAiB,CAACC,GAAqBC,MAAuC;AAChF,UAAMC,IAAaF,EAAM,KAAK;AAC9B,IAAKE,KAIDA,EAAW,WAAWb,CAAa,KACnCY,EAASD,EAAM,IAAI;AAAA,EAE3B;AAEA,SAAAG,EAAU,MAAM;AACZ,UAAMC,IAAmB,CAACJ,MAAwBD,EAAeC,GAAOV,KAAoBe,CAAI;AAChG,kBAAO,iBAAiB,WAAWD,GAAkB,EAAK,GACnD,MAAM,OAAO,oBAAoB,WAAWA,GAAkB,EAAK;AAAA,EAC9E,GAAG,CAAA,CAAE,GAEE;AAAA,IACH,qBAAAb;AAAA,IACA,qBAAAG;AAAA,EAAA;AAER;"}
+{"version":3,"file":"usePostMessage.js","names":[],"sources":["../../src/hooks/usePostMessage.ts"],"sourcesContent":["import { useEffect } from 'react';\nimport { isEmpty, noop } from 'es-toolkit/compat';\n\nexport type RemoteAction = {\n    /**\n     * The RemoteAction is inspired by a plain redux action where the type is the\n     * action identifier.\n     *\n     * @example\n     *\n     * ```json\n     * {\n     *      \"type\": \"EVENT_SET_VISIBLE_WIDGETS\",\n     *      \"payload\": [\"foo\", \"bar\"],\n     * }\n     * ```\n     */\n    type: string;\n\n    /**\n     * The action payload itself.\n     */\n    payload: any;\n};\n\n/**\n * A custom hook to ease the exchange of postMessage events between iframes and the parent window.\n *\n * @param messagePrefix a custom prefix to limit the event listener for these events\n * @param onReceiveMessage a callback function triggered when a message is received\n * @deprecated Please use the {@link import('./useIncomingPostMessages')#default useIncomingPostMessages} and/or\n * {@link import('./usePostMessageSender')#default usePostMessageSender} hooks instead.\n */\nconst usePostMessage = (messagePrefix: string, onReceiveMessage?: (eventData: any) => void) => {\n    const sendMessageToParent = (message: RemoteAction) => {\n        const referrer = document.referrer;\n        if (referrer) {\n            window.parent.postMessage(message, referrer);\n        }\n    };\n\n    const sendMessageToWidget = (message: RemoteAction, targetFrames: HTMLIFrameElement | HTMLIFrameElement[]) => {\n        if (!targetFrames || isEmpty(targetFrames)) {\n            return;\n        }\n\n        const frames = Array.isArray(targetFrames) ? [...targetFrames] : [targetFrames];\n\n        [...frames].forEach(target => {\n            const contentWindow = target.contentWindow;\n            if (contentWindow) {\n                contentWindow.postMessage(message, '*');\n            }\n        });\n    };\n\n    const receiveMessage = (event: MessageEvent, callback: (eventData: any) => void) => {\n        const actionType = event.data.type;\n        if (!actionType) {\n            return;\n        }\n\n        if (actionType.startsWith(messagePrefix)) {\n            callback(event.data);\n        }\n    };\n\n    useEffect(() => {\n        const listenerCallback = (event: MessageEvent) => receiveMessage(event, onReceiveMessage || noop);\n        window.addEventListener('message', listenerCallback, false);\n        return () => window.removeEventListener('message', listenerCallback, false);\n    }, []);\n\n    return {\n        sendMessageToParent,\n        sendMessageToWidget,\n    };\n};\n\nexport default usePostMessage;\n"],"mappings":";;;AAiCA,IAAM,KAAkB,GAAuB,MAAgD;CAC3F,IAAM,KAAuB,MAA0B;EACnD,IAAM,IAAW,SAAS;EAC1B,AAAI,KACA,OAAO,OAAO,YAAY,GAAS,CAAQ;CAEnD,GAEM,KAAuB,GAAuB,MAA0D;EACtG,CAAC,KAAgB,EAAQ,CAAY,KAMzC,CAAC,GAFc,MAAM,QAAQ,CAAY,IAAI,CAAC,GAAG,CAAY,IAAI,CAAC,CAAY,CAEpE,CAAC,CAAC,SAAQ,MAAU;GAC1B,IAAM,IAAgB,EAAO;GAC7B,AAAI,KACA,EAAc,YAAY,GAAS,GAAG;EAE9C,CAAC;CACL,GAEM,KAAkB,GAAqB,MAAuC;EAChF,IAAM,IAAa,EAAM,KAAK;EACzB,KAID,EAAW,WAAW,CAAa,KACnC,EAAS,EAAM,IAAI;CAE3B;CAQA,OANA,QAAgB;EACZ,IAAM,KAAoB,MAAwB,EAAe,GAAO,KAAoB,CAAI;EAEhG,OADA,OAAO,iBAAiB,WAAW,GAAkB,EAAK,SAC7C,OAAO,oBAAoB,WAAW,GAAkB,EAAK;CAC9E,GAAG,CAAC,CAAC,GAEE;EACH;EACA;CACJ;AACJ"}

package/hooks/usePostMessageSender.js

@@ -1,21 +1,23 @@
-import { useCallback as n } from "react";
-const f = () => {
-  const o = n(
-    (e, s, t = "*") => {
-      s?.postMessage(e, t);
-    },
-    []
-  ), a = n((e, s = "*") => {
-    parent !== window && o(e, parent, s);
-  }, []), r = n((e, s = "*") => {
-    top !== window && o(e, top, s);
-  }, []), c = n((e, s = "*") => {
-    for (const t of document.querySelectorAll("iframe"))
-      o(e, t.contentWindow, s);
-  }, []);
-  return { sendMessage: o, sendMessageToParent: a, sendMessageToTop: r, sendMessageToAllIframes: c };
+import { useCallback as e } from "react";
+//#region src/hooks/usePostMessageSender.ts
+var t = () => {
+	let t = e((e, t, n = "*") => {
+		t?.postMessage(e, n);
+	}, []);
+	return {
+		sendMessage: t,
+		sendMessageToParent: e((e, n = "*") => {
+			parent !== window && t(e, parent, n);
+		}, []),
+		sendMessageToTop: e((e, n = "*") => {
+			top !== window && t(e, top, n);
+		}, []),
+		sendMessageToAllIframes: e((e, n = "*") => {
+			for (let r of document.querySelectorAll("iframe")) t(e, r.contentWindow, n);
+		}, [])
+	};
 };
-export {
-  f as default
-};
-//# sourceMappingURL=usePostMessageSender.js.map
+//#endregion
+export { t as default };
+
+//# sourceMappingURL=usePostMessageSender.js.map

package/hooks/usePostMessageSender.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePostMessageSender.js","sources":["../../src/hooks/usePostMessageSender.ts"],"sourcesContent":["import { useCallback } from 'react';\n\n/**\n * Provides helper functions to allow sending {@link postMessage} events.\n */\nconst usePostMessageSender = () => {\n    /**\n     * Sends the given message to the given target window.\n     *\n     * If the target window is null or undefined, this will do nothing.\n     *\n     * Note that the target window's origin is not checked.\n     *\n     * @param message The message data to send.\n     * @param targetWindow The window to receive the message.\n     * @param targetOrigin The expected origin of the target window (optional, defaults to '*').\n     */\n    const sendMessage = useCallback(\n        (message: unknown, targetWindow: WindowProxy | null | undefined, targetOrigin = '*') => {\n            targetWindow?.postMessage(message, targetOrigin);\n        },\n        []\n    );\n\n    /**\n     * Sends the given message to the current \"parent\" window.\n     *\n     * If there is no parent window (or if window.parent points to the current window), this will do nothing.\n     *\n     * @param message The message data to send.\n     * @param targetOrigin The expected origin of the target window (optional, defaults to '*').\n     */\n    const sendMessageToParent = useCallback((message: unknown, targetOrigin = '*') => {\n        if (parent !== window) {\n            sendMessage(message, parent, targetOrigin);\n        }\n    }, []);\n\n    /**\n     * Sends the given message to the current \"top\" window.\n     *\n     * If there is no top window (or if window.top points to the current window), this will do nothing.\n     *\n     * @param message The message data to send.\n     * @param targetOrigin The expected origin of the target window (optional, defaults to '*').\n     */\n    const sendMessageToTop = useCallback((message: unknown, targetOrigin = '*') => {\n        if (top !== window) {\n            sendMessage(message, top, targetOrigin);\n        }\n    }, []);\n\n    /**\n     * \"Broadcast\" the given message to all iframes that are currently in the browsing context.\n     *\n     * @param message The message data to send.\n     * @param targetOrigin The expected origin of the target window (optional, defaults to '*').\n     */\n    const sendMessageToAllIframes = useCallback((message: unknown, targetOrigin = '*') => {\n        for (const iframe of document.querySelectorAll('iframe')) {\n            sendMessage(message, iframe.contentWindow, targetOrigin);\n        }\n    }, []);\n\n    return { sendMessage, sendMessageToParent, sendMessageToTop, sendMessageToAllIframes };\n};\n\nexport default usePostMessageSender;\n"],"names":["usePostMessageSender","sendMessage","useCallback","message","targetWindow","targetOrigin","sendMessageToParent","sendMessageToTop","sendMessageToAllIframes","iframe"],"mappings":";AAKA,MAAMA,IAAuB,MAAM;AAY/B,QAAMC,IAAcC;AAAA,IAChB,CAACC,GAAkBC,GAA8CC,IAAe,QAAQ;AACpF,MAAAD,GAAc,YAAYD,GAASE,CAAY;AAAA,IACnD;AAAA,IACA,CAAA;AAAA,EAAC,GAWCC,IAAsBJ,EAAY,CAACC,GAAkBE,IAAe,QAAQ;AAC9E,IAAI,WAAW,UACXJ,EAAYE,GAAS,QAAQE,CAAY;AAAA,EAEjD,GAAG,CAAA,CAAE,GAUCE,IAAmBL,EAAY,CAACC,GAAkBE,IAAe,QAAQ;AAC3E,IAAI,QAAQ,UACRJ,EAAYE,GAAS,KAAKE,CAAY;AAAA,EAE9C,GAAG,CAAA,CAAE,GAQCG,IAA0BN,EAAY,CAACC,GAAkBE,IAAe,QAAQ;AAClF,eAAWI,KAAU,SAAS,iBAAiB,QAAQ;AACnD,MAAAR,EAAYE,GAASM,EAAO,eAAeJ,CAAY;AAAA,EAE/D,GAAG,CAAA,CAAE;AAEL,SAAO,EAAE,aAAAJ,GAAa,qBAAAK,GAAqB,kBAAAC,GAAkB,yBAAAC,EAAA;AACjE;"}
+{"version":3,"file":"usePostMessageSender.js","names":[],"sources":["../../src/hooks/usePostMessageSender.ts"],"sourcesContent":["import { useCallback } from 'react';\n\n/**\n * Provides helper functions to allow sending {@link postMessage} events.\n */\nconst usePostMessageSender = () => {\n    /**\n     * Sends the given message to the given target window.\n     *\n     * If the target window is null or undefined, this will do nothing.\n     *\n     * Note that the target window's origin is not checked.\n     *\n     * @param message The message data to send.\n     * @param targetWindow The window to receive the message.\n     * @param targetOrigin The expected origin of the target window (optional, defaults to '*').\n     */\n    const sendMessage = useCallback(\n        (message: unknown, targetWindow: WindowProxy | null | undefined, targetOrigin = '*') => {\n            targetWindow?.postMessage(message, targetOrigin);\n        },\n        []\n    );\n\n    /**\n     * Sends the given message to the current \"parent\" window.\n     *\n     * If there is no parent window (or if window.parent points to the current window), this will do nothing.\n     *\n     * @param message The message data to send.\n     * @param targetOrigin The expected origin of the target window (optional, defaults to '*').\n     */\n    const sendMessageToParent = useCallback((message: unknown, targetOrigin = '*') => {\n        if (parent !== window) {\n            sendMessage(message, parent, targetOrigin);\n        }\n    }, []);\n\n    /**\n     * Sends the given message to the current \"top\" window.\n     *\n     * If there is no top window (or if window.top points to the current window), this will do nothing.\n     *\n     * @param message The message data to send.\n     * @param targetOrigin The expected origin of the target window (optional, defaults to '*').\n     */\n    const sendMessageToTop = useCallback((message: unknown, targetOrigin = '*') => {\n        if (top !== window) {\n            sendMessage(message, top, targetOrigin);\n        }\n    }, []);\n\n    /**\n     * \"Broadcast\" the given message to all iframes that are currently in the browsing context.\n     *\n     * @param message The message data to send.\n     * @param targetOrigin The expected origin of the target window (optional, defaults to '*').\n     */\n    const sendMessageToAllIframes = useCallback((message: unknown, targetOrigin = '*') => {\n        for (const iframe of document.querySelectorAll('iframe')) {\n            sendMessage(message, iframe.contentWindow, targetOrigin);\n        }\n    }, []);\n\n    return { sendMessage, sendMessageToParent, sendMessageToTop, sendMessageToAllIframes };\n};\n\nexport default usePostMessageSender;\n"],"mappings":";;AAKA,IAAM,UAA6B;CAY/B,IAAM,IAAc,GACf,GAAkB,GAA8C,IAAe,QAAQ;EACpF,GAAc,YAAY,GAAS,CAAY;CACnD,GACA,CAAC,CACL;CA0CA,OAAO;EAAE;EAAa,qBAhCM,GAAa,GAAkB,IAAe,QAAQ;GAC9E,AAAI,WAAW,UACX,EAAY,GAAS,QAAQ,CAAY;EAEjD,GAAG,CAAC,CA4BkB;EAAqB,kBAlBlB,GAAa,GAAkB,IAAe,QAAQ;GAC3E,AAAI,QAAQ,UACR,EAAY,GAAS,KAAK,CAAY;EAE9C,GAAG,CAAC,CAcuC;EAAkB,yBAN7B,GAAa,GAAkB,IAAe,QAAQ;GAClF,KAAK,IAAM,KAAU,SAAS,iBAAiB,QAAQ,GACnD,EAAY,GAAS,EAAO,eAAe,CAAY;EAE/D,GAAG,CAAC,CAEyD;CAAwB;AACzF"}

package/hooks/usePrevious.js

@@ -1,10 +1,14 @@
-import { useRef as u } from "react";
-import { isEqual as o } from "es-toolkit/compat";
-const i = (e, t) => {
-  const r = u({ target: e, previous: e });
-  return (t ? !t(e, r.current.target) : !o(e, r.current.target)) && (r.current.previous = r.current.target, r.current.target = e), r.current.previous;
+import { useRef as e } from "react";
+import { isEqual as t } from "es-toolkit/compat";
+//#region src/hooks/usePrevious.ts
+var n = (n, r) => {
+	let i = e({
+		target: n,
+		previous: n
+	});
+	return (r ? !r(n, i.current.target) : !t(n, i.current.target)) && (i.current.previous = i.current.target, i.current.target = n), i.current.previous;
 };
-export {
-  i as default
-};
-//# sourceMappingURL=usePrevious.js.map
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=usePrevious.js.map

package/hooks/usePrevious.js.map

@@ -1 +1 @@
-{"version":3,"file":"usePrevious.js","sources":["../../src/hooks/usePrevious.ts"],"sourcesContent":["import { useRef } from 'react';\nimport { isEqual } from 'es-toolkit/compat';\n\n// Based on the react beta docs, we avoid using an effect here but\n// use another state to store the previous value to compare to.\n// See: https://react.dev/reference/react/useState#storing-information-from-previous-renders\n\n/**\n * The usePrevious hook allows to easily access state from previous component render.\n * Instead of using a *React.ref* or a *useEffect*, this hook uses a *useState* internally to keep track of the\n * previous state value.\n *\n * Quoting from the React documentation:\n *\n * **In most cases, you don’t need this:**\n *\n * - *If the value you need can be computed entirely from the current props or other state, remove*\n * *that redundant state altogether. If you’re worried about recomputing too often, the useMemo Hook can help.*\n * - *If you want to reset the entire component tree’s state, pass a different key to your component.*\n * - *If you can, update all the relevant state in the event handlers.*\n *\n * @link https://react.dev/reference/react/useState#storing-information-from-previous-renders\n *\n * @param state The value of the current state to keep track of.\n * @returns\n */\nconst usePrevious = <T>(\n    state: T,\n    isEqualFunc?: ((value: T | null | undefined, current: T | null | undefined) => any) | undefined\n): T => {\n    const ref = useRef<{ target: T; previous: T }>({ target: state, previous: state });\n\n    if (isEqualFunc ? !isEqualFunc(state, ref.current.target) : !isEqual(state, ref.current.target)) {\n        ref.current.previous = ref.current.target;\n        ref.current.target = state;\n    }\n\n    return ref.current.previous;\n};\n\nexport default usePrevious;\n"],"names":["usePrevious","state","isEqualFunc","ref","useRef","isEqual"],"mappings":";;AA0BA,MAAMA,IAAc,CAChBC,GACAC,MACI;AACJ,QAAMC,IAAMC,EAAmC,EAAE,QAAQH,GAAO,UAAUA,GAAO;AAEjF,UAAIC,IAAc,CAACA,EAAYD,GAAOE,EAAI,QAAQ,MAAM,IAAI,CAACE,EAAQJ,GAAOE,EAAI,QAAQ,MAAM,OAC1FA,EAAI,QAAQ,WAAWA,EAAI,QAAQ,QACnCA,EAAI,QAAQ,SAASF,IAGlBE,EAAI,QAAQ;AACvB;"}
+{"version":3,"file":"usePrevious.js","names":[],"sources":["../../src/hooks/usePrevious.ts"],"sourcesContent":["import { useRef } from 'react';\nimport { isEqual } from 'es-toolkit/compat';\n\n// Based on the react beta docs, we avoid using an effect here but\n// use another state to store the previous value to compare to.\n// See: https://react.dev/reference/react/useState#storing-information-from-previous-renders\n\n/**\n * The usePrevious hook allows to easily access state from previous component render.\n * Instead of using a *React.ref* or a *useEffect*, this hook uses a *useState* internally to keep track of the\n * previous state value.\n *\n * Quoting from the React documentation:\n *\n * **In most cases, you don’t need this:**\n *\n * - *If the value you need can be computed entirely from the current props or other state, remove*\n * *that redundant state altogether. If you’re worried about recomputing too often, the useMemo Hook can help.*\n * - *If you want to reset the entire component tree’s state, pass a different key to your component.*\n * - *If you can, update all the relevant state in the event handlers.*\n *\n * @link https://react.dev/reference/react/useState#storing-information-from-previous-renders\n *\n * @param state The value of the current state to keep track of.\n * @returns\n */\nconst usePrevious = <T>(\n    state: T,\n    isEqualFunc?: ((value: T | null | undefined, current: T | null | undefined) => any) | undefined\n): T => {\n    const ref = useRef<{ target: T; previous: T }>({ target: state, previous: state });\n\n    if (isEqualFunc ? !isEqualFunc(state, ref.current.target) : !isEqual(state, ref.current.target)) {\n        ref.current.previous = ref.current.target;\n        ref.current.target = state;\n    }\n\n    return ref.current.previous;\n};\n\nexport default usePrevious;\n"],"mappings":";;;AA0BA,IAAM,KACF,GACA,MACI;CACJ,IAAM,IAAM,EAAmC;EAAE,QAAQ;EAAO,UAAU;CAAM,CAAC;CAOjF,QALI,IAAc,CAAC,EAAY,GAAO,EAAI,QAAQ,MAAM,IAAI,CAAC,EAAQ,GAAO,EAAI,QAAQ,MAAM,OAC1F,EAAI,QAAQ,WAAW,EAAI,QAAQ,QACnC,EAAI,QAAQ,SAAS,IAGlB,EAAI,QAAQ;AACvB"}

package/hooks/useRenderCount.js

@@ -1,11 +1,12 @@
-import { useRef as t, useEffect as r } from "react";
-const n = () => {
-  const e = t(1);
-  return r(() => {
-    e.current++;
-  }), e.current;
+import { useEffect as e, useRef as t } from "react";
+//#region src/hooks/useRenderCount.ts
+var n = () => {
+	let n = t(1);
+	return e(() => {
+		n.current++;
+	}), n.current;
 };
-export {
-  n as default
-};
-//# sourceMappingURL=useRenderCount.js.map
+//#endregion
+export { n as default };
+
+//# sourceMappingURL=useRenderCount.js.map

package/hooks/useRenderCount.js.map

@@ -1 +1 @@
-{"version":3,"file":"useRenderCount.js","sources":["../../src/hooks/useRenderCount.ts"],"sourcesContent":["// Inspired by https://github.com/WebDevSimplified/useful-custom-react-hooks/blob/main/src/27-useRenderCount/useRenderCount.js\nimport { useEffect, useRef } from 'react';\n\nconst useRenderCount = (): number => {\n    const count = useRef(1);\n    useEffect(() => {\n        count.current++;\n    });\n    return count.current;\n};\n\nexport default useRenderCount;\n"],"names":["useRenderCount","count","useRef","useEffect"],"mappings":";AAGA,MAAMA,IAAiB,MAAc;AACjC,QAAMC,IAAQC,EAAO,CAAC;AACtB,SAAAC,EAAU,MAAM;AACZ,IAAAF,EAAM;AAAA,EACV,CAAC,GACMA,EAAM;AACjB;"}
+{"version":3,"file":"useRenderCount.js","names":[],"sources":["../../src/hooks/useRenderCount.ts"],"sourcesContent":["// Inspired by https://github.com/WebDevSimplified/useful-custom-react-hooks/blob/main/src/27-useRenderCount/useRenderCount.js\nimport { useEffect, useRef } from 'react';\n\nconst useRenderCount = (): number => {\n    const count = useRef(1);\n    useEffect(() => {\n        count.current++;\n    });\n    return count.current;\n};\n\nexport default useRenderCount;\n"],"mappings":";;AAGA,IAAM,UAA+B;CACjC,IAAM,IAAQ,EAAO,CAAC;CAItB,OAHA,QAAgB;EACZ,EAAM;CACV,CAAC,GACM,EAAM;AACjB"}