@musecat/functionkit 1.0.0 → 1.0.2

package/tests/components/ViewportPortal.test.tsx

@@ -0,0 +1,42 @@
+import { describe, test, expect, beforeEach } from "vitest";
+import { render, screen } from "@testing-library/react";
+import {
+	ViewportPortal,
+	getViewportPortalRoot,
+} from "@/packages/components/ViewportPortal";
+import React from "react";
+
+describe("ViewportPortal", () => {
+	beforeEach(() => {
+		document.body.innerHTML = "";
+	});
+
+	test("getViewportPortalRoot creates a root element if it doesn't exist", () => {
+		const root = getViewportPortalRoot();
+		expect(root).not.toBeNull();
+		expect(root?.id).toBe("viewport-portal-root");
+		expect(document.getElementById("viewport-portal-root")).toBe(root);
+	});
+
+	test("getViewportPortalRoot returns existing root element if it exists", () => {
+		const root1 = getViewportPortalRoot();
+		const root2 = getViewportPortalRoot();
+		expect(root1).toBe(root2);
+		expect(document.querySelectorAll("#viewport-portal-root").length).toBe(1);
+	});
+
+	test("ViewportPortal renders children into the portal root", () => {
+		render(
+			<ViewportPortal>
+				<div data-testid="portal-content">Portal Content</div>
+			</ViewportPortal>,
+		);
+
+		const root = document.getElementById("viewport-portal-root");
+		expect(root).not.toBeNull();
+
+		const content = screen.getByTestId("portal-content");
+		expect(content.textContent).toBe("Portal Content");
+		expect(root?.contains(content)).toBe(true);
+	});
+});

package/tests/cookie/cookie.test.ts

@@ -0,0 +1,156 @@
+import { describe, test, expect, beforeEach, vi, afterEach } from "vitest";
+import {
+	parseClientCookieNames,
+	getClientCookie,
+	setClientCookie,
+	clearClientCookie,
+	clearAllClientCookies,
+} from "@/packages/cookie/cookie.shared";
+
+describe("cookie module", () => {
+	beforeEach(() => {
+		// Reset cookies
+		Object.defineProperty(document, "cookie", {
+			writable: true,
+			value: "",
+		});
+
+		// Mock window location
+		Object.defineProperty(window, "location", {
+			writable: true,
+			value: { hostname: "example.com", pathname: "/test/path" },
+		});
+	});
+
+	afterEach(() => {
+		vi.restoreAllMocks();
+	});
+
+	describe("parseClientCookieNames", () => {
+		test("parses cookie string correctly", () => {
+			const result = parseClientCookieNames("foo=bar; baz=qux; ; empty=");
+			expect(result).toEqual(["foo", "baz", "empty"]);
+		});
+
+		test("returns empty array for empty string", () => {
+			expect(parseClientCookieNames("")).toEqual([]);
+		});
+	});
+
+	describe("getClientCookie", () => {
+		test("returns cookie value if it exists", () => {
+			document.cookie = "foo=bar; baz=qux";
+			expect(getClientCookie("foo")).toBe("bar");
+			expect(getClientCookie("baz")).toBe("qux");
+		});
+
+		test("returns undefined if cookie does not exist", () => {
+			document.cookie = "foo=bar";
+			expect(getClientCookie("missing")).toBeUndefined();
+		});
+
+		test("handles undefined document", () => {
+			const originalDocument = global.document;
+			// @ts-ignore
+			delete global.document;
+
+			expect(getClientCookie("foo")).toBeUndefined();
+
+			global.document = originalDocument;
+		});
+	});
+
+	describe("setClientCookie", () => {
+		test("sets cookie with name and value", () => {
+			setClientCookie("foo", "bar");
+			expect(document.cookie).toBe("foo=bar; path=/");
+		});
+
+		test("sets cookie with days", () => {
+			vi.useFakeTimers();
+			vi.setSystemTime(new Date("2020-01-01T00:00:00Z"));
+
+			setClientCookie("foo", "bar", 7);
+
+			const expectedDate = new Date("2020-01-08T00:00:00Z").toUTCString();
+			expect(document.cookie).toBe(`foo=bar; expires=${expectedDate}; path=/`);
+
+			vi.useRealTimers();
+		});
+
+		test("encodes cookie value", () => {
+			setClientCookie("foo", "val ue;");
+			expect(document.cookie).toBe("foo=val%20ue%3B; path=/");
+		});
+	});
+
+	describe("clearClientCookie", () => {
+		test("clears cookie with default options", () => {
+			document.cookie = "foo=bar";
+			clearClientCookie("foo");
+			expect(document.cookie).toBe(
+				"foo=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/; domain=example.com;",
+			);
+		});
+
+		test("clears cookie with custom options", () => {
+			const mockDoc = { cookie: "" };
+			clearClientCookie("foo", {
+				hostname: "custom.com",
+				path: "/custom",
+				documentRef: mockDoc as any,
+			});
+			expect(mockDoc.cookie).toBe(
+				"foo=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/custom; domain=custom.com;",
+			);
+		});
+	});
+
+	describe("clearAllClientCookies", () => {
+		test("clears all cookies based on documentRef.cookie", () => {
+			const mockDoc = { cookie: "a=1; b=2" };
+			const entries = clearAllClientCookies({ documentRef: mockDoc as any });
+
+			expect(entries).toEqual(["a", "b"]);
+			expect(mockDoc.cookie).toContain(
+				"b=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/test/path; domain=com;",
+			);
+		});
+
+		test("clears cookies using cookieStore if provided", async () => {
+			const cookieStore = { delete: vi.fn().mockResolvedValue(undefined) };
+			const mockDoc = { cookie: "a=1; b=2" };
+
+			const entries = clearAllClientCookies({
+				documentRef: mockDoc as any,
+				cookieStore: cookieStore as any,
+			});
+
+			expect(entries).toEqual(["a", "b"]);
+			expect(cookieStore.delete).toHaveBeenCalledWith("a");
+			expect(cookieStore.delete).toHaveBeenCalledWith("b");
+		});
+
+		test("clears cookies from root path when includeRoot is true", () => {
+			const mockDoc = { cookie: "a=1" };
+			clearAllClientCookies({ documentRef: mockDoc as any, includeRoot: true });
+
+			// The function iterates and updates document.cookie, so it will contain the last assignment.
+			// With paths ["/", "/test/path"] and domain "example.com"
+			expect(mockDoc.cookie).toContain(
+				"a=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/test/path; domain=com;",
+			);
+		});
+
+		test("uses provided cookieString instead of documentRef.cookie", () => {
+			const mockDoc = { cookie: "a=1" };
+			const entries = clearAllClientCookies({
+				documentRef: mockDoc as any,
+				cookieString: "x=1; y=2",
+			});
+
+			expect(entries).toEqual(["x", "y"]);
+			expect(mockDoc.cookie).toContain("y=;");
+		});
+	});
+});

package/tests/datetime/datetime.test.ts

@@ -0,0 +1,250 @@
+import { describe, test, expect } from "vitest";
+import {
+	normalizeAppLocale,
+	toIntlLocale,
+	toDate,
+	toUtcMidnight,
+	parseUtcDateInput,
+	formatUtcDateKey,
+	getUtcWeekdayIndex,
+	addUtcDays,
+	formatLongDate,
+	formatDotDate,
+	format24HourTime,
+	formatKoreanTime,
+	formatTwelveHourTime,
+	formatRelativeText,
+	formatRemainingText,
+} from "@/packages/datetime/dateTime.shared";
+import {
+	formatClientDate,
+	formatClientTime,
+	formatClientDateTime,
+	formatClientRelative,
+} from "@/packages/datetime/dateTime.client";
+import {
+	formatServerDate,
+	formatServerTime,
+	formatServerDateTime,
+	formatServerRelative,
+} from "@/packages/datetime/dateTime.server";
+
+describe("datetime module", () => {
+	describe("shared", () => {
+		describe("normalizeAppLocale", () => {
+			test("normalizes kr/ko", () => {
+				expect(normalizeAppLocale("kr")).toBe("kr");
+				expect(normalizeAppLocale("ko")).toBe("kr");
+			});
+			test("normalizes jp/ja", () => {
+				expect(normalizeAppLocale("jp")).toBe("jp");
+				expect(normalizeAppLocale("ja")).toBe("jp");
+			});
+			test("defaults to en", () => {
+				expect(normalizeAppLocale("fr")).toBe("en");
+				expect(normalizeAppLocale(undefined)).toBe("en");
+			});
+		});
+
+		describe("toIntlLocale", () => {
+			test("maps to correct intl locales", () => {
+				expect(toIntlLocale("kr")).toBe("ko-KR");
+				expect(toIntlLocale("jp")).toBe("ja-JP");
+				expect(toIntlLocale("en")).toBe("en-US");
+			});
+		});
+
+		describe("toDate", () => {
+			test("returns Date object for valid inputs", () => {
+				expect(toDate(new Date("2020-01-01"))).toBeInstanceOf(Date);
+				expect(toDate("2020-01-01")).toBeInstanceOf(Date);
+				expect(toDate(1577836800000)).toBeInstanceOf(Date);
+			});
+			test("returns null for invalid inputs", () => {
+				expect(toDate("invalid")).toBeNull();
+				expect(toDate(new Date("invalid"))).toBeNull();
+			});
+		});
+
+		describe("toUtcMidnight", () => {
+			test("converts to UTC midnight", () => {
+				const date = new Date("2020-01-01T15:30:00Z");
+				const utcDate = toUtcMidnight(date);
+				expect(utcDate.toISOString()).toBe("2020-01-01T00:00:00.000Z");
+			});
+		});
+
+		describe("parseUtcDateInput", () => {
+			test("parses YYYY-MM-DD string to UTC midnight", () => {
+				const result = parseUtcDateInput("2020-05-10");
+				expect(result?.toISOString()).toBe("2020-05-10T00:00:00.000Z");
+			});
+			test("parses Date object to UTC midnight", () => {
+				const result = parseUtcDateInput(new Date("2020-05-10T15:00:00Z"));
+				expect(result?.toISOString()).toBe("2020-05-10T00:00:00.000Z");
+			});
+			test("uses fallback", () => {
+				const result = parseUtcDateInput("invalid", "2020-01-01T00:00:00Z");
+				expect(result?.toISOString()).toBe("2020-01-01T00:00:00.000Z");
+			});
+			test("returns null if both invalid", () => {
+				expect(parseUtcDateInput("invalid", "invalid")).toBeNull();
+			});
+		});
+
+		describe("formatUtcDateKey", () => {
+			test("formats date to YYYY-MM-DD", () => {
+				expect(formatUtcDateKey(new Date("2020-05-05T00:00:00Z"))).toBe(
+					"2020-05-05",
+				);
+			});
+		});
+
+		describe("getUtcWeekdayIndex", () => {
+			test("returns correct weekday index", () => {
+				expect(getUtcWeekdayIndex(new Date("2020-01-05T00:00:00Z"))).toBe(0); // Sunday
+				expect(getUtcWeekdayIndex(new Date("2020-01-06T00:00:00Z"))).toBe(1); // Monday
+			});
+		});
+
+		describe("addUtcDays", () => {
+			test("adds days to date", () => {
+				const result = addUtcDays(new Date("2020-01-01T00:00:00Z"), 5);
+				expect(result.toISOString()).toBe("2020-01-06T00:00:00.000Z");
+			});
+			test("handles negative days", () => {
+				const result = addUtcDays(new Date("2020-01-05T00:00:00Z"), -2);
+				expect(result.toISOString()).toBe("2020-01-03T00:00:00.000Z");
+			});
+		});
+
+		describe("formatters", () => {
+			const testDate = new Date("2020-05-10T15:30:45Z"); // UTC time
+
+			test("formatLongDate", () => {
+				expect(formatLongDate(testDate, "kr", "UTC")).toBe("2020년 5월 10일");
+				expect(formatLongDate(testDate, "jp", "UTC")).toBe("2020年5月10日");
+				expect(formatLongDate(testDate, "en", "UTC")).toContain("2020");
+			});
+
+			test("formatDotDate", () => {
+				expect(formatDotDate(testDate, "UTC")).toBe("2020. 5. 10.");
+			});
+
+			test("format24HourTime", () => {
+				expect(format24HourTime(testDate, { timeZone: "UTC" })).toBe("15:30");
+				expect(
+					format24HourTime(testDate, { includeSeconds: true, timeZone: "UTC" }),
+				).toBe("15:30:45");
+			});
+
+			test("formatKoreanTime", () => {
+				expect(formatKoreanTime(testDate, "UTC")).toBe("오후 3시 30분");
+				expect(formatKoreanTime(new Date("2020-05-10T09:15:00Z"), "UTC")).toBe(
+					"오전 9시 15분",
+				);
+			});
+
+			test("formatTwelveHourTime", () => {
+				expect(formatTwelveHourTime(testDate, "kr", "UTC")).toBe("오후 3:30");
+				expect(formatTwelveHourTime(testDate, "en", "UTC")).toMatch(
+					/3:30 (PM|pm)/,
+				);
+			});
+		});
+
+		describe("formatRelativeText", () => {
+			test("formats seconds", () => {
+				expect(formatRelativeText(30000, "en")).toEqual({
+					text: "30 seconds ago",
+					isRelative: true,
+				});
+				expect(formatRelativeText(30000, "kr")).toEqual({
+					text: "30초 전",
+					isRelative: true,
+				});
+			});
+			test("formats minutes", () => {
+				expect(formatRelativeText(120000, "en")).toEqual({
+					text: "2 minutes ago",
+					isRelative: true,
+				});
+			});
+			test("formats hours", () => {
+				expect(formatRelativeText(7200000, "en")).toEqual({
+					text: "2 hours ago",
+					isRelative: true,
+				});
+			});
+			test("formats days", () => {
+				expect(formatRelativeText(172800000, "en")).toEqual({
+					text: "2 days ago",
+					isRelative: true,
+				});
+			});
+		});
+
+		describe("formatRemainingText", () => {
+			test("formats remaining time", () => {
+				expect(formatRemainingText(0)).toBe("Closed");
+				expect(formatRemainingText(0, "kr")).toBe("마감됨");
+				expect(formatRemainingText(0, "jp")).toBe("締切終了");
+
+				expect(formatRemainingText(1000, "en")).toBe("1 second left");
+				expect(formatRemainingText(65000, "en")).toBe(
+					"1 minute 5 seconds left",
+				);
+				expect(formatRemainingText(3665000, "kr")).toBe("1시간 1분 남음");
+				expect(formatRemainingText(90065000, "jp")).toBe("あと1日1時間");
+			});
+			test("without suffix", () => {
+				expect(formatRemainingText(1000, "en", { includeSuffix: false })).toBe(
+					"1 second",
+				);
+			});
+		});
+	});
+
+	describe("client/server wrappers", () => {
+		const testDate = new Date("2020-05-10T15:30:45Z");
+
+		test("formatClientDateTime / formatServerDateTime", () => {
+			expect(formatClientDateTime(testDate, { timeZone: "UTC" })).toBe(
+				"May 10, 2020 15:30",
+			);
+			expect(
+				formatClientDateTime(testDate, { locale: "kr", timeZone: "UTC" }),
+			).toBe("2020년 5월 10일 15:30");
+			expect(
+				formatServerDateTime(testDate, { locale: "kr", timeZone: "UTC" }),
+			).toBe("2020년 5월 10일 15:30");
+		});
+
+		test("formatClientRelative / formatServerRelative", () => {
+			const now = new Date("2020-05-10T15:35:45Z"); // 5 mins later
+			expect(formatClientRelative(testDate, { now, locale: "kr" })).toEqual({
+				text: "5분 전",
+				isRelative: true,
+			});
+			expect(formatServerRelative(testDate, { now, locale: "kr" })).toEqual({
+				text: "5분 전",
+				isRelative: true,
+			});
+
+			const farFutureNow = new Date("2020-05-20T15:30:45Z"); // 10 days later
+			expect(
+				formatClientRelative(testDate, {
+					now: farFutureNow,
+					locale: "kr",
+					fallbackDatePreset: "dot",
+					maxRelativeDays: 7,
+				}),
+			).toEqual({ text: formatDotDate(testDate), isRelative: false });
+		});
+
+		test("handles invalid inputs gracefully", () => {
+			expect(formatClientDate("invalid", { preset: "long" })).toBe("");
+			expect(formatServerTime("invalid", { preset: "ko" })).toBe("");
+		});
+	});
+});

package/tests/hooks/useAvoidKeyboard.test.ts

@@ -0,0 +1,12 @@
+import { describe, test, expect } from "vitest";
+import { renderHook } from "@testing-library/react";
+import { useAvoidKeyboard } from "@/packages/hooks/useAvoidKeyboard";
+
+describe("useAvoidKeyboard", () => {
+	test("returns style object", () => {
+		const { result } = renderHook(() => useAvoidKeyboard());
+		expect(result.current.style).toBeDefined();
+		expect(result.current.style.transform).toBeUndefined();
+		expect(result.current.style.transition).toContain("transform");
+	});
+});

package/tests/hooks/useCheckInvisible.test.ts

@@ -0,0 +1,28 @@
+import { describe, test, expect, vi } from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import { useCheckInvisible } from "@/packages/hooks/useCheckInvisible";
+
+describe("useCheckInvisible", () => {
+	test("returns isInvisible false when element is visible", () => {
+		const el = document.createElement("div");
+		el.className = "test-section";
+		el.getBoundingClientRect = vi.fn(() => ({ top: 100, bottom: 300, left: 0, right: 100, width: 100, height: 200, x: 0, y: 100 }) as DOMRect);
+		document.body.appendChild(el);
+
+		const { result } = renderHook(() => useCheckInvisible("test-section"));
+		expect(result.current.isInvisible).toBe(false);
+		document.body.removeChild(el);
+	});
+
+	test("returns isInvisible true when element is scrolled above viewport", () => {
+		const el = document.createElement("div");
+		el.className = "test-section";
+		el.getBoundingClientRect = vi.fn(() => ({ top: -50, bottom: 150, left: 0, right: 100, width: 100, height: 200, x: 0, y: -50 }) as DOMRect);
+		document.body.appendChild(el);
+
+		const { result } = renderHook(() => useCheckInvisible("test-section"));
+		act(() => { window.dispatchEvent(new Event("scroll")); });
+		expect(result.current.isInvisible).toBe(true);
+		document.body.removeChild(el);
+	});
+});

package/tests/hooks/useCheckScroll.test.ts

@@ -0,0 +1,23 @@
+import { describe, test, expect } from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import { useCheckScroll } from "@/packages/hooks/useCheckScroll";
+
+describe("useCheckScroll", () => {
+	test("initializes with scrollY state", () => {
+		Object.defineProperty(window, "scrollY", { value: 100, writable: true });
+		const { result } = renderHook(() => useCheckScroll());
+		expect(result.current.isScrolled).toBe(true);
+	});
+
+	test("updates state on scroll", () => {
+		Object.defineProperty(window, "scrollY", { value: 0, writable: true });
+		const { result } = renderHook(() => useCheckScroll());
+		expect(result.current.isScrolled).toBe(false);
+
+		act(() => {
+			window.scrollY = 150;
+			window.dispatchEvent(new Event("scroll"));
+		});
+		expect(result.current.isScrolled).toBe(true);
+	});
+});

package/tests/hooks/useClientDateTime.test.ts

@@ -0,0 +1,14 @@
+import { describe, test, expect } from "vitest";
+import { renderHook } from "@testing-library/react";
+import { useClientDateTime } from "@/packages/hooks/useClientDateTime";
+
+describe("useClientDateTime", () => {
+	test("returns ready state and formatted text", () => {
+		const { result } = renderHook(() =>
+			useClientDateTime("2024-06-15", { locale: "ko" }),
+		);
+		expect(result.current.ready).toBe(true);
+		expect(result.current.text).toBeTruthy();
+		expect(result.current.date).toBeInstanceOf(Date);
+	});
+});

package/tests/hooks/useDebounce.test.ts

@@ -0,0 +1,71 @@
+import { describe, test, expect, vi, beforeEach, afterEach } from "vitest";
+import { renderHook } from "@testing-library/react";
+import { debounce, useDebounce } from "@/packages/hooks/useDebounce";
+
+describe("debounce (standalone)", () => {
+	beforeEach(() => { vi.useFakeTimers(); });
+	afterEach(() => { vi.useRealTimers(); });
+
+	test("trailing: calls function after delay", () => {
+		const fn = vi.fn();
+		const d = debounce(fn, 100, { edges: ["trailing"] });
+		d();
+		expect(fn).not.toHaveBeenCalled();
+		vi.advanceTimersByTime(100);
+		expect(fn).toHaveBeenCalledOnce();
+	});
+
+	test("leading + trailing: calls immediately and debounces trailing", () => {
+		const fn = vi.fn();
+		const d = debounce(fn, 100, { edges: ["leading", "trailing"] });
+		d();
+		expect(fn).toHaveBeenCalledTimes(1);
+		d();
+		vi.advanceTimersByTime(100);
+		expect(fn).toHaveBeenCalledTimes(2);
+	});
+
+	test("leading only: calls immediately, no trailing", () => {
+		const fn = vi.fn();
+		const d = debounce(fn, 100, { edges: ["leading"] });
+		d();
+		expect(fn).toHaveBeenCalledTimes(1);
+		vi.advanceTimersByTime(100);
+		expect(fn).toHaveBeenCalledTimes(1);
+	});
+
+	test("cancel aborts pending call", () => {
+		const fn = vi.fn();
+		const d = debounce(fn, 100, { edges: ["trailing"] });
+		d();
+		d.cancel();
+		vi.advanceTimersByTime(100);
+		expect(fn).not.toHaveBeenCalled();
+	});
+
+	test("multiple calls reset the timer in trailing mode", () => {
+		const fn = vi.fn();
+		const d = debounce(fn, 100, { edges: ["trailing"] });
+		d();
+		vi.advanceTimersByTime(50);
+		d();
+		vi.advanceTimersByTime(50);
+		expect(fn).not.toHaveBeenCalled();
+		vi.advanceTimersByTime(50);
+		expect(fn).toHaveBeenCalledOnce();
+	});
+});
+
+describe("useDebounce", () => {
+	beforeEach(() => { vi.useFakeTimers(); });
+	afterEach(() => { vi.useRealTimers(); });
+
+	test("returns a debounced function", () => {
+		const fn = vi.fn();
+		const { result } = renderHook(() => useDebounce(fn, 100));
+		result.current();
+		expect(fn).not.toHaveBeenCalled();
+		vi.advanceTimersByTime(100);
+		expect(fn).toHaveBeenCalledOnce();
+	});
+});

package/tests/hooks/useDebouncedCallback.test.ts

@@ -0,0 +1,34 @@
+import { describe, test, expect, vi, beforeEach, afterEach } from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import { useDebouncedCallback } from "@/packages/hooks/useDebouncedCallback";
+
+describe("useDebouncedCallback", () => {
+	beforeEach(() => { vi.useFakeTimers(); });
+	afterEach(() => { vi.useRealTimers(); });
+
+	test("debounces onChange calls", () => {
+		const onChange = vi.fn();
+		const { result } = renderHook(() =>
+			useDebouncedCallback({ onChange, timeThreshold: 100 }),
+		);
+
+		act(() => { result.current(true); });
+		vi.advanceTimersByTime(100);
+		expect(onChange).toHaveBeenCalledWith(true);
+	});
+
+	test("skips duplicate value", () => {
+		const onChange = vi.fn();
+		const { result } = renderHook(() =>
+			useDebouncedCallback({ onChange, timeThreshold: 100 }),
+		);
+
+		act(() => { result.current(true); });
+		vi.advanceTimersByTime(100);
+		expect(onChange).toHaveBeenCalledTimes(1);
+
+		act(() => { result.current(true); });
+		vi.advanceTimersByTime(100);
+		expect(onChange).toHaveBeenCalledTimes(1);
+	});
+});

package/tests/hooks/useDoubleClick.test.ts

@@ -0,0 +1,31 @@
+import { describe, test, expect, vi, afterEach } from "vitest";
+import { renderHook, act } from "@testing-library/react";
+import { useDoubleClick } from "@/packages/hooks/useDoubleClick";
+
+describe("useDoubleClick", () => {
+	afterEach(() => { vi.useRealTimers(); });
+
+	test("fires click on single click (event.detail === 1)", () => {
+		vi.useFakeTimers();
+		const click = vi.fn();
+		const doubleClick = vi.fn();
+		const { result } = renderHook(() => useDoubleClick({ click, doubleClick }));
+
+		const event = new MouseEvent("click", { detail: 1 }) as unknown as React.MouseEvent<HTMLElement>;
+		act(() => { result.current(event); });
+		expect(doubleClick).not.toHaveBeenCalled();
+		vi.advanceTimersByTime(300);
+		expect(click).toHaveBeenCalledOnce();
+	});
+
+	test("fires doubleClick on double click (event.detail === 2)", () => {
+		const click = vi.fn();
+		const doubleClick = vi.fn();
+		const { result } = renderHook(() => useDoubleClick({ click, doubleClick }));
+
+		const event = new MouseEvent("click", { detail: 2 }) as unknown as React.MouseEvent<HTMLElement>;
+		act(() => { result.current(event); });
+		expect(doubleClick).toHaveBeenCalledOnce();
+		expect(click).not.toHaveBeenCalled();
+	});
+});