@boxcustodia/library 2.0.0-alpha.17 → 2.0.0-alpha.19

package/src/hooks/use-is-visible/use-is-visible.test.tsx

@@ -0,0 +1,135 @@
+import { act, render, screen } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+import { useIsVisible } from "./use-is-visible";
+
+// IntersectionObserver isn't available in jsdom. Provide a controllable mock.
+type ObserverCallback = IntersectionObserverCallback;
+
+let observerCallback: ObserverCallback | null = null;
+let observedEl: Element | null = null;
+
+class IntersectionObserverMock implements IntersectionObserver {
+  readonly root = null;
+  readonly rootMargin = "0px";
+  readonly thresholds = [0];
+
+  constructor(cb: ObserverCallback) {
+    observerCallback = cb;
+  }
+
+  observe(el: Element) {
+    observedEl = el;
+  }
+  unobserve() {
+    observedEl = null;
+  }
+  disconnect() {}
+  takeRecords() {
+    return [];
+  }
+}
+
+vi.stubGlobal("IntersectionObserver", IntersectionObserverMock);
+
+function makeEntry(isIntersecting: boolean): IntersectionObserverEntry {
+  return { isIntersecting } as IntersectionObserverEntry;
+}
+
+function Fixture({
+  onVisible,
+}: {
+  onVisible?: () => void;
+}) {
+  const { ref, isVisible } = useIsVisible<HTMLDivElement>({ onVisible });
+  return (
+    <div ref={ref} data-testid="target">
+      {isVisible ? "visible" : "hidden"}
+    </div>
+  );
+}
+
+describe("useIsVisible", () => {
+  it("starts as hidden", () => {
+    render(<Fixture />);
+    expect(screen.getByTestId("target")).toHaveTextContent("hidden");
+  });
+
+  it("becomes visible when IntersectionObserver fires with isIntersecting=true", () => {
+    render(<Fixture />);
+
+    act(() => {
+      observerCallback?.([makeEntry(true)], {} as IntersectionObserver);
+    });
+
+    expect(screen.getByTestId("target")).toHaveTextContent("visible");
+  });
+
+  it("goes back to hidden when isIntersecting=false", () => {
+    render(<Fixture />);
+
+    act(() => {
+      observerCallback?.([makeEntry(true)], {} as IntersectionObserver);
+    });
+    act(() => {
+      observerCallback?.([makeEntry(false)], {} as IntersectionObserver);
+    });
+
+    expect(screen.getByTestId("target")).toHaveTextContent("hidden");
+  });
+
+  it("calls onVisible when element becomes visible", () => {
+    const onVisible = vi.fn();
+    render(<Fixture onVisible={onVisible} />);
+
+    act(() => {
+      observerCallback?.([makeEntry(true)], {} as IntersectionObserver);
+    });
+
+    expect(onVisible).toHaveBeenCalledOnce();
+  });
+
+  it("does not call onVisible when element becomes hidden", () => {
+    const onVisible = vi.fn();
+    render(<Fixture onVisible={onVisible} />);
+
+    act(() => {
+      observerCallback?.([makeEntry(true)], {} as IntersectionObserver);
+    });
+    onVisible.mockClear();
+
+    act(() => {
+      observerCallback?.([makeEntry(false)], {} as IntersectionObserver);
+    });
+
+    expect(onVisible).not.toHaveBeenCalled();
+  });
+
+  it("observes the DOM element", () => {
+    render(<Fixture />);
+    expect(observedEl).not.toBeNull();
+  });
+
+  it("calls unobserve when observer options change (cleanup while mounted)", () => {
+    const unobserveSpy = vi.spyOn(
+      IntersectionObserverMock.prototype,
+      "unobserve",
+    );
+
+    function Resettable({ margin }: { margin: string }) {
+      const { ref, isVisible } = useIsVisible<HTMLDivElement>({
+        rootMargin: margin,
+      });
+      return (
+        <div ref={ref} data-testid="resettable">
+          {isVisible ? "visible" : "hidden"}
+        </div>
+      );
+    }
+
+    const { rerender } = render(<Resettable margin="0px" />);
+    rerender(<Resettable margin="10px" />);
+
+    expect(unobserveSpy).toHaveBeenCalled();
+    unobserveSpy.mockRestore();
+  });
+});

package/src/hooks/{useIsVisible/useIsVisible.tsx → use-is-visible/use-is-visible.tsx}

@@ -9,7 +9,7 @@ interface UseIsVisibleReturn<T> {
   isVisible: boolean;
 }
 
-function useIsVisible<T extends HTMLElement>({
+export function useIsVisible<T extends HTMLElement>({
   onVisible,
   root = null,
   rootMargin = "0px",
@@ -47,4 +47,3 @@ function useIsVisible<T extends HTMLElement>({
   return { ref, isVisible };
 }
 
-export default useIsVisible;

package/src/hooks/use-local-storage/index.ts

@@ -0,0 +1 @@
+export * from "./use-local-storage";

package/src/hooks/{useLocalStorage/__doc__/useLocalStorage.stories.tsx → use-local-storage/use-local-storage.stories.tsx}

@@ -1,7 +1,7 @@
 import { Meta } from "@storybook/react-vite";
 import { Trash } from "lucide-react";
-import { Button, Input } from "../../../components";
-import useLocalStorage from "../useLocalStorage";
+import { Button, Input } from "../../components";
+import { useLocalStorage } from "../use-local-storage";
 
 /**
  * Hook que proporciona una interfaz sencilla para interactuar con el localStorage de manera tipada.

package/src/hooks/{useLocalStorage/__test__/useLocalStorage.test.ts → use-local-storage/use-local-storage.test.ts}

@@ -1,6 +1,6 @@
 import { act, renderHook } from "@testing-library/react";
 import { beforeEach, describe, expect, it, vi } from "vitest";
-import useLocalStorage from "../useLocalStorage";
+import { useLocalStorage } from "../use-local-storage";
 
 describe("useLocalStorage hook", () => {
   const key = "testKey";
@@ -82,4 +82,50 @@ describe("useLocalStorage hook", () => {
 
     consoleErrorSpy.mockRestore();
   });
+
+  it("calls removeItem when storedValue is undefined (no initial value)", () => {
+    const removeItemMock = vi.fn();
+    vi.stubGlobal("localStorage", {
+      getItem: vi.fn().mockReturnValue(null),
+      setItem: vi.fn(),
+      removeItem: removeItemMock,
+      clear: vi.fn(),
+    });
+    renderHook(() => useLocalStorage<string>("empty-key"));
+    expect(removeItemMock).toHaveBeenCalledWith("empty-key");
+    vi.unstubAllGlobals();
+  });
+
+  it("handles localStorage.setItem errors in useEffect gracefully", () => {
+    const errorSpy = vi.spyOn(console, "error").mockImplementation(() => {});
+    vi.stubGlobal("localStorage", {
+      getItem: vi.fn().mockReturnValue(null),
+      setItem: vi.fn().mockImplementation(() => {
+        throw new Error("Storage full");
+      }),
+      removeItem: vi.fn(),
+      clear: vi.fn(),
+    });
+    renderHook(() => useLocalStorage<string>("err-key", "value"));
+    expect(errorSpy).toHaveBeenCalled();
+    vi.unstubAllGlobals();
+    errorSpy.mockRestore();
+  });
+
+  it("handles localStorage.removeItem errors in remove() gracefully", () => {
+    const errorSpy = vi.spyOn(console, "error").mockImplementation(() => {});
+    vi.stubGlobal("localStorage", {
+      getItem: vi.fn().mockReturnValue(JSON.stringify("value")),
+      setItem: vi.fn(),
+      removeItem: vi.fn().mockImplementation(() => {
+        throw new Error("remove error");
+      }),
+      clear: vi.fn(),
+    });
+    const { result } = renderHook(() => useLocalStorage<string>("key", "value"));
+    act(() => result.current[2]());
+    expect(errorSpy).toHaveBeenCalled();
+    vi.unstubAllGlobals();
+    errorSpy.mockRestore();
+  });
 });

package/src/hooks/{useLocalStorage/useLocalStorage.ts → use-local-storage/use-local-storage.ts}

@@ -1,13 +1,13 @@
 import { useEffect, useState } from "react";
 
-function useLocalStorage<T>(
+export function useLocalStorage<T>(
   key: string,
 ): [T | undefined, (value: T) => void, () => void];
-function useLocalStorage<T>(
+export function useLocalStorage<T>(
   key: string,
   initialValue: T,
 ): [T, (value: T) => void, () => void];
-function useLocalStorage<T>(
+export function useLocalStorage<T>(
   key: string,
   initialValue?: T,
 ): [T | undefined, (value: T) => void, () => void] {
@@ -54,4 +54,3 @@ function useLocalStorage<T>(
   return [storedValue, setValue, remove];
 }
 
-export default useLocalStorage;

package/src/hooks/use-media-query/index.ts

@@ -0,0 +1 @@
+export * from "./use-media-query";

package/src/hooks/{useMediaQuery/__doc__/useMediaQuery.stories.tsx → use-media-query/use-media-query.stories.tsx}

@@ -1,5 +1,5 @@
 import { Meta } from "@storybook/react-vite";
-import useMediaQuery from "../useMediaQuery";
+import { useMediaQuery } from "../use-media-query";
 
 const meta: Meta = {
   title: "hooks/useMediaQuery",

package/src/hooks/{useMediaQuery/useMediaQuery.ts → use-media-query/use-media-query.ts}

@@ -1,6 +1,6 @@
 import { useEffect, useState } from "react";
 
-const useMediaQuery = (query: string): boolean => {
+export const useMediaQuery = (query: string): boolean => {
   const [matches, setMatches] = useState<boolean>(false);
 
   useEffect(() => {
@@ -18,5 +18,3 @@ const useMediaQuery = (query: string): boolean => {
 
   return matches;
 };
-
-export default useMediaQuery;

package/src/hooks/use-memoized-fn/index.ts

@@ -0,0 +1 @@
+export * from "./use-memoized-fn";

package/src/hooks/use-memoized-fn/use-memoized-fn.test.ts

@@ -0,0 +1,52 @@
+import { renderHook } from "@testing-library/react";
+import { describe, expect, it, vi } from "vitest";
+import { useMemoizedFn } from "./use-memoized-fn";
+
+describe("useMemoizedFn", () => {
+  it("returns a stable function reference across re-renders", () => {
+    const fn = vi.fn();
+    const { result, rerender } = renderHook(() => useMemoizedFn(fn));
+    const first = result.current;
+    rerender();
+    expect(result.current).toBe(first);
+  });
+
+  it("calls the latest version of the function", () => {
+    const first = vi.fn(() => "first");
+    const second = vi.fn(() => "second");
+
+    const { result, rerender } = renderHook(({ fn }) => useMemoizedFn(fn), {
+      initialProps: { fn: first as () => string },
+    });
+
+    const stable = result.current;
+
+    rerender({ fn: second });
+
+    expect(stable()).toBe("second");
+    expect(first).not.toHaveBeenCalled();
+    expect(second).toHaveBeenCalledOnce();
+  });
+
+  it("forwards arguments correctly", () => {
+    const fn = vi.fn((a: number, b: string) => `${a}-${b}`);
+    const { result } = renderHook(() => useMemoizedFn(fn));
+
+    const ret = result.current(1, "hello");
+
+    expect(fn).toHaveBeenCalledWith(1, "hello");
+    expect(ret).toBe("1-hello");
+  });
+
+  it("logs error when non-function is passed", () => {
+    const consoleSpy = vi.spyOn(console, "error").mockImplementation(() => {});
+
+    renderHook(() => useMemoizedFn("not-a-function" as any));
+
+    expect(consoleSpy).toHaveBeenCalledWith(
+      expect.stringContaining("useMemoizedFn expected parameter is a function"),
+    );
+
+    consoleSpy.mockRestore();
+  });
+});

package/src/hooks/{useMemoizedFn/useMemoizedFn.ts → use-memoized-fn/use-memoized-fn.ts}

@@ -1,4 +1,3 @@
-import { isFunction } from "lodash";
 import { useMemo, useRef } from "react";
 
 type noop = (this: any, ...args: any[]) => any;
@@ -8,8 +7,8 @@ type PickFunction<T extends noop> = (
   ...args: Parameters<T>
 ) => ReturnType<T>;
 
-function useMemoizedFn<T extends noop>(fn: T) {
-  if (!isFunction(fn)) {
+export function useMemoizedFn<T extends noop>(fn: T) {
+  if (typeof fn !== "function") {
     console.error(
       `useMemoizedFn expected parameter is a function, got ${typeof fn}`,
     );
@@ -29,4 +28,3 @@ function useMemoizedFn<T extends noop>(fn: T) {
   return memoizedFn.current as T;
 }
 
-export default useMemoizedFn;

package/src/hooks/use-mutation/index.ts

@@ -0,0 +1 @@
+export * from "./use-mutation";

package/src/hooks/{useMutation/__doc__/useMutation.stories.tsx → use-mutation/use-mutation.stories.tsx}

@@ -1,9 +1,9 @@
 import { Meta } from "@storybook/react-vite";
 import { FormEvent } from "react";
-import { Button, Input } from "../../../components";
-import { getFormData } from "../../../utils";
-import useAsync from "../../useAsync/useAsync";
-import useMutation from "../useMutation";
+import { Button, Input } from "../../components";
+import { getFormData } from "../../utils";
+import { useAsync } from "../use-async/use-async";
+import { useMutation } from "../use-mutation";
 
 /**
  * El hook `useMutation` permite manejar operaciones de mutación asincrónicas, proporcionando estados de carga, error y éxito.

package/src/hooks/{useMutation/__test__/useMutation.test.tsx → use-mutation/use-mutation.test.tsx}

@@ -1,6 +1,6 @@
 import { renderHook, waitFor } from "@testing-library/react";
 import { describe, expect, it, vi } from "vitest";
-import useMutation from "../useMutation";
+import { useMutation } from "../use-mutation";
 
 const mockMutationSuccess = async (data: any) => {
   return new Promise((resolve) => setTimeout(() => resolve(data), 100));

package/src/hooks/{useMutation/useMutation.tsx → use-mutation/use-mutation.tsx}

@@ -23,18 +23,18 @@ export const useMutation = <TArgs extends any[], TReturn>(
 ): UseMutationReturn<TArgs, TReturn> => {
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState<Error | null>(null);
-  const [data, setdata] = useState<TReturn | null>(null);
+  const [data, setData] = useState<TReturn | null>(null);
 
   const mutate = useCallback(
     async (...args: TArgs) => {
       setLoading(true);
       setError(null);
-      setdata(null);
+      setData(null);
 
       try {
         const result = await opts.fn(...args);
         opts.onSuccess?.(result);
-        setdata(result);
+        setData(result);
         return result;
       } catch (err) {
         const error = err as Error;
@@ -57,4 +57,3 @@ export const useMutation = <TArgs extends any[], TReturn>(
   };
 };
 
-export default useMutation;

package/src/hooks/use-object/index.ts

@@ -0,0 +1 @@
+export * from "./use-object";

package/src/hooks/{useObject/__doc__/useObject.stories.tsx → use-object/use-object.stories.tsx}

@@ -1,7 +1,7 @@
 import { Meta } from "@storybook/react-vite";
 import { ChevronLeft, ChevronRight } from "lucide-react";
-import { Button, Input } from "../../../components";
-import useObject from "../useObject";
+import { Button, Input } from "../../components";
+import { useObject } from "../use-object";
 
 /**
  * Hook para manejar un estado en forma de objeto

package/src/hooks/{useObject/__test__/useObject.test.tsx → use-object/use-object.test.tsx}

@@ -1,7 +1,6 @@
-import { renderHook } from "@testing-library/react";
-import { act } from "react";
+import { act, renderHook } from "@testing-library/react";
 import { describe, expect, it } from "vitest";
-import useObject from "../useObject";
+import { useObject } from "../use-object";
 
 describe("useObject hook", () => {
   it("should initialize with default state", () => {
@@ -84,4 +83,20 @@ describe("useObject hook", () => {
 
     expect(result.current[0]).toEqual({ count: 1, name: "updated" });
   });
+
+  it("function update returning non-object keeps previous state", () => {
+    const { result } = renderHook(() => useObject({ count: 1 }));
+    act(() => {
+      result.current[1]((_state) => null as any);
+    });
+    expect(result.current[0]).toEqual({ count: 1 });
+  });
+
+  it("non-function non-object arg keeps previous state", () => {
+    const { result } = renderHook(() => useObject({ count: 1 }));
+    act(() => {
+      result.current[1](42 as any);
+    });
+    expect(result.current[0]).toEqual({ count: 1 });
+  });
 });

package/src/hooks/{useObject/useObject.tsx → use-object/use-object.tsx}

@@ -1,4 +1,3 @@
-import { isFunction, isObject } from "lodash";
 import { useCallback, useState } from "react";
 
 type GenericObject = Record<string, any>;
@@ -11,9 +10,9 @@ type MaybeReturn<TState> = Return<
   ((state: TState | undefined) => Partial<TState>) | Partial<TState>
 >;
 
-function useObject<T extends GenericObject>(): MaybeReturn<T>;
-function useObject<T extends GenericObject>(initialValue: T): Return<T>;
-function useObject<T extends GenericObject>(initialValue?: T) {
+export function useObject<T extends GenericObject>(): MaybeReturn<T>;
+export function useObject<T extends GenericObject>(initialValue: T): Return<T>;
+export function useObject<T extends GenericObject>(initialValue?: T) {
   const [state, setState] = useState<T | undefined>(initialValue);
 
   const reset = useCallback(() => setState(initialValue), [initialValue]);
@@ -21,16 +20,16 @@ function useObject<T extends GenericObject>(initialValue?: T) {
   const setNewState = useCallback(
     (arg: ((state: T | undefined) => Partial<T>) | Partial<T>) => {
       setState((prevState) => {
-        if (isFunction(arg)) {
+        if (typeof arg === "function") {
           const newState = arg(prevState);
-          if (isObject(newState)) {
+          if (newState !== null && typeof newState === "object") {
             return {
               ...prevState,
               ...newState,
             } as T;
           }
           return prevState;
-        } else if (isObject(arg)) {
+        } else if (arg !== null && typeof arg === "object") {
           return {
             ...prevState,
             ...arg,
@@ -45,4 +44,3 @@ function useObject<T extends GenericObject>(initialValue?: T) {
   return [state, setNewState, reset] as const;
 }
 
-export default useObject;

package/src/hooks/use-on-mount/index.ts

@@ -0,0 +1 @@
+export * from "./use-on-mount";

package/src/hooks/use-on-mount/use-on-mount.stories.tsx

@@ -0,0 +1,85 @@
+import type { Meta, StoryObj } from "@storybook/react-vite";
+import { useState } from "react";
+import { Button } from "../../components/button";
+import { Stack } from "../../components/stack";
+import { useOnMount } from "./use-on-mount";
+
+/**
+ * Run a callback exactly once, when the component mounts.
+ *
+ * It's basically `useEffect(fn, [])` with two improvements: the callback
+ * never re-runs even if React's StrictMode replays effects in dev, and
+ * the intent ("on mount") is right there in the name — no `// biome-ignore`
+ * for an empty deps array.
+ *
+ * ```tsx
+ * useOnMount(() => {
+ *   trackPageView("/dashboard");
+ * });
+ * ```
+ *
+ * Good to know:
+ * - Returning a function from the callback registers a cleanup that runs
+ *   on unmount — same contract as `useEffect`.
+ * - The callback identity is captured on first run. Passing a new function
+ *   on later renders does **not** re-fire the hook, so you don't need to
+ *   memoize it.
+ * - For "do something on every update except the first one" use a different
+ *   pattern (a ref-guarded `useEffect` with deps) — this hook is mount-only.
+ */
+const meta: Meta<typeof useOnMount> = {
+  title: "hooks/useOnMount",
+  parameters: { layout: "centered" },
+  tags: ["new"],
+};
+
+export default meta;
+type Story = StoryObj<typeof useOnMount>;
+
+/**
+ * The hook stamps a timestamp on the first render and never touches it
+ * again. Click "Force re-render" as many times as you want — the
+ * "Mounted at" value stays frozen while the render counter ticks up.
+ * That's the proof that `useOnMount` fires exactly once.
+ */
+export const Default: Story = {
+  render: () => {
+    const [mountedAt, setMountedAt] = useState("");
+    const [renderCount, setRenderCount] = useState(0);
+
+    useOnMount(() => {
+      setMountedAt(
+        new Date().toLocaleTimeString(undefined, {
+          hour12: false,
+          hour: "2-digit",
+          minute: "2-digit",
+          second: "2-digit",
+        }),
+      );
+    });
+
+    return (
+      <Stack
+        direction="vertical"
+        gap={16}
+        style={{ minWidth: 360, padding: 20, borderRadius: 12 }}
+        className="border border-border bg-card"
+      >
+        <Stack direction="vertical" gap={4}>
+          <span className="text-sm">
+            <strong>Mounted at:</strong>{" "}
+            <code className="text-success">{mountedAt || "..."}</code>
+          </span>
+          <span className="text-xs text-muted-foreground">
+            Re-rendered {renderCount} time{renderCount === 1 ? "" : "s"} —
+            timestamp stays the same.
+          </span>
+        </Stack>
+
+        <Button onClick={() => setRenderCount((n) => n + 1)}>
+          Force re-render
+        </Button>
+      </Stack>
+    );
+  },
+};

package/src/hooks/use-on-mount/use-on-mount.test.tsx

@@ -0,0 +1,51 @@
+import { renderHook } from "@testing-library/react";
+import { StrictMode } from "react";
+import { describe, expect, it, vi } from "vitest";
+import { useOnMount } from "./use-on-mount";
+
+describe("useOnMount", () => {
+  it("runs the callback once on mount", () => {
+    const fn = vi.fn();
+    renderHook(() => useOnMount(fn));
+    expect(fn).toHaveBeenCalledTimes(1);
+  });
+
+  it("does not re-run on subsequent renders", () => {
+    const fn = vi.fn();
+    const { rerender } = renderHook(() => useOnMount(fn));
+    rerender();
+    rerender();
+    expect(fn).toHaveBeenCalledTimes(1);
+  });
+
+  it("does not re-run when the callback identity changes", () => {
+    const fn1 = vi.fn();
+    const fn2 = vi.fn();
+    const { rerender } = renderHook(({ cb }) => useOnMount(cb), {
+      initialProps: { cb: fn1 },
+    });
+    rerender({ cb: fn2 });
+    expect(fn1).toHaveBeenCalledTimes(1);
+    expect(fn2).not.toHaveBeenCalled();
+  });
+
+  it("runs the returned cleanup function on unmount", () => {
+    const cleanup = vi.fn();
+    const { unmount } = renderHook(() => useOnMount(() => cleanup));
+    expect(cleanup).not.toHaveBeenCalled();
+
+    unmount();
+    expect(cleanup).toHaveBeenCalledTimes(1);
+  });
+
+  it("does not throw when the callback returns nothing", () => {
+    const { unmount } = renderHook(() => useOnMount(() => undefined));
+    expect(() => unmount()).not.toThrow();
+  });
+
+  it("guard prevents double-run in React StrictMode", () => {
+    const fn = vi.fn();
+    renderHook(() => useOnMount(fn), { wrapper: StrictMode });
+    expect(fn).toHaveBeenCalledTimes(1);
+  });
+});

package/src/hooks/use-on-mount/use-on-mount.tsx

@@ -0,0 +1,13 @@
+import { useEffect, useRef } from "react";
+
+export type UseOnMountCallback = () => void | (() => void);
+
+export function useOnMount(callback: UseOnMountCallback): void {
+  const hasRunRef = useRef(false);
+
+  useEffect(() => {
+    if (hasRunRef.current) return;
+    hasRunRef.current = true;
+    return callback();
+  }, []);
+}

package/src/hooks/use-pagination/index.ts

@@ -0,0 +1 @@
+export * from "./use-pagination";

package/src/hooks/{usePagination/__doc__/usePagination.stories.tsx → use-pagination/use-pagination.stories.tsx}

@@ -1,8 +1,8 @@
 import { Meta } from "@storybook/react-vite";
 import { useState } from "react";
 import { action } from "storybook/actions";
-import { Button } from "../../../components";
-import usePagination from "../usePagination";
+import { Button } from "../../components";
+import { usePagination } from "../use-pagination";
 
 const TABLE_PAGE_SIZES = [5, 10, 20, 50, 100];
 /**

package/src/hooks/{usePagination/__test__/usePagination.test.tsx → use-pagination/use-pagination.test.tsx}

@@ -1,6 +1,6 @@
 import { act, renderHook, waitFor } from "@testing-library/react";
 import { describe, expect, it } from "vitest";
-import usePagination from "../usePagination";
+import { usePagination } from "../use-pagination";
 
 describe("usePagination hook", () => {
   it("should be defined", () => {