@jobber/components-native 0.84.3 → 0.84.4-CLEANUPre-6d043f4.28

package/dist/tsconfig.json

@@ -8,8 +8,11 @@
         "declarationDir": "./dist/types",
         "resolveJsonModule": true,
         "paths": {
+            "@jobber/hooks": [
+                "../hooks/src/index.ts"
+            ],
             "@jobber/hooks/*": [
-                "../../packages/hooks/src/*"
+                "../hooks/src/*"
             ]
         },
         "types": [
@@ -32,10 +35,5 @@
         "**/*.stories.tsx",
         "**/*.test.ts",
         "**/*.test.tsx",
-    ],
-    "references": [
-        {
-            "path": "../hooks"
-        }
     ]
 }

package/dist/types/src/Banner/components/BannerIcon/BannerIcon.style.d.ts

@@ -12,4 +12,7 @@ export declare const useStyles: () => {
     notice: {
         backgroundColor: string;
     };
+    success: {
+        backgroundColor: string;
+    };
 };

package/dist/types/src/Banner/types.d.ts

@@ -1,7 +1,7 @@
 import type { IconNames } from "@jobber/design";
 import type { ReactElement } from "react";
 import type { StyleProp, ViewStyle } from "react-native";
-export type BannerTypes = "error" | "warning" | "notice";
+export type BannerTypes = "error" | "warning" | "notice" | "success";
 export interface BannerStyleProps {
     /**
      * Styles applied to the main view of the banner. Styles are grabbed from Banner.style.ts file

package/dist/types/src/Form/components/FormCache/FormCache.d.ts

@@ -1,9 +1,9 @@
-import type { FieldValues } from "react-hook-form";
+import type { DeepPartial, FieldValues } from "react-hook-form";
 interface FormCacheProps<T extends FieldValues> {
     readonly localCacheId?: string | string[];
     readonly localCacheKey?: string;
     readonly localCacheExclude?: string[];
-    readonly setLocalCache: (data: T) => void;
+    readonly setLocalCache: (data: DeepPartial<T>) => void;
 }
 export declare function FormCache<T extends FieldValues>({ localCacheExclude, localCacheKey, setLocalCache, }: FormCacheProps<T>): JSX.Element;
 export {};

package/dist/types/src/Form/context/types.d.ts

@@ -1,5 +1,5 @@
 import type { MutableRefObject } from "react";
-import type { FieldValues, UseFormReturn } from "react-hook-form";
+import type { DeepPartial, FieldValues, UseFormReturn } from "react-hook-form";
 export interface UseConfirmBeforeBackProps {
     alwaysPreventBack: boolean;
     onAcceptEvent?: () => void;
@@ -18,7 +18,7 @@ interface LocalCacheOptions {
 export interface AtlantisFormContextProps {
     useConfirmBeforeBack: (props: UseConfirmBeforeBackProps) => MutableRefObject<() => void>;
     useInternalFormLocalCache: <TData extends FieldValues>(formMethods: UseFormReturn<TData>, cacheKey?: string, options?: LocalCacheOptions) => {
-        setLocalCache: (data: TData) => void;
+        setLocalCache: (data: DeepPartial<TData>) => void;
         removeLocalCache: () => void;
     };
 }

package/dist/types/src/Form/hooks/useInternalForm.d.ts

@@ -1,4 +1,4 @@
-import type { FieldValues, UseFormHandleSubmit, UseFormReturn } from "react-hook-form";
+import type { DeepPartial, FieldValues, UseFormHandleSubmit, UseFormReturn } from "react-hook-form";
 import type { MutableRefObject, RefObject } from "react";
 import type { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
 import type { InternalFormProps } from "../types";
@@ -13,7 +13,7 @@ interface UseInternalForm<T extends FieldValues> {
     readonly isSubmitting: boolean;
     readonly isDirty: boolean;
     readonly removeListenerRef: MutableRefObject<() => void>;
-    readonly setLocalCache: (data: T) => void;
+    readonly setLocalCache: (data: DeepPartial<T>) => void;
 }
 export declare function useInternalForm<T extends FieldValues, SubmitResponseType>({ mode, reValidateMode, initialValues, formRef, localCacheKey, localCacheId, scrollViewRef, saveButtonHeight, messageBannerHeight, }: UseInternalFormProps<T, SubmitResponseType>): UseInternalForm<T>;
 export {};

package/dist/types/src/Form/types.d.ts

@@ -1,8 +1,8 @@
 import type { MutableRefObject, RefObject } from "react";
-import type { ControllerProps, DeepPartial, FieldPath, FieldValues, Mode, UnpackNestedValue, UseFormReturn } from "react-hook-form";
+import type { ControllerProps, DefaultValues, FieldPath, FieldValues, Mode, UseFormReturn } from "react-hook-form";
 import type { IconNames } from "@jobber/design";
 import type { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
-export type FormValues<T> = UnpackNestedValue<T>;
+export type FormValues<T> = T;
 export type FormErrors = FormNetworkErrors | FormUserErrors;
 export type FormBannerMessage = FormWarningMessage | FormNoticeMessage;
 export declare enum FormSubmitErrorType {
@@ -81,7 +81,7 @@ export interface FormProps<T extends FieldValues, SubmitResponseType> {
      * The initial values of the form inputs
      * This should be available as soon as initialLoading is set to false
      */
-    initialValues?: FormValues<DeepPartial<T>>;
+    initialValues?: DefaultValues<T>;
     /**
      * When the validation should happen.
      * Possible values are "onBlur", "onChange", "onSubmit", "onTouched", and "all".

package/dist/types/src/InputFieldWrapper/InputFieldWrapper.style.d.ts

@@ -23,6 +23,7 @@ export declare const useStyles: () => {
         right: number;
         bottom: number;
         left: number;
+        zIndex: number;
     };
     miniLabel: {
         top: number;
@@ -30,7 +31,6 @@ export declare const useStyles: () => {
         backgroundColor: string;
         marginRight: number;
         maxHeight: number;
-        zIndex: number;
     };
     miniLabelShowClearAction: {
         backgroundColor: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components-native",
-  "version": "0.84.3",
+  "version": "0.84.4-CLEANUPre-6d043f4.28+6d043f490",
   "license": "MIT",
   "description": "React Native implementation of Atlantis",
   "repository": {
@@ -32,10 +32,10 @@
     "build": "npm run build:clean && npm run compile",
     "bootstrap": "npm run build",
     "prepack": "npm run build",
-    "compile": "tsc -b",
+    "compile": "tsc -p tsconfig.build.json",
     "build:clean": "rm -rf ./dist",
     "storybook": "storybook dev -p 6008 --disable-telemetry",
-    "build-storybook": "storybook build --disable-telemetry"
+    "storybook:build": "storybook build --disable-telemetry"
   },
   "dependencies": {
     "@react-native-clipboard/clipboard": "^1.11.2",
@@ -43,8 +43,8 @@
     "autolinker": "^4.0.0",
     "deepmerge": "^4.2.2",
     "lodash": "^4.17.21",
-    "react-hook-form": "^7.30.0",
-    "react-intl": "^6.4.2",
+    "react-hook-form": "^7.52.0",
+    "react-intl": "^7.1.11",
     "react-native-keyboard-aware-scroll-view": "^0.9.5",
     "react-native-modalize": "^2.0.13",
     "react-native-portalize": "^1.0.7",
@@ -53,18 +53,27 @@
     "ts-xor": "^1.1.0"
   },
   "devDependencies": {
+    "@react-native-community/datetimepicker": "^8.4.5",
+    "@react-native/babel-preset": "^0.81.1",
     "@storybook/addon-a11y": "^9.1.2",
     "@storybook/react": "^9.1.2",
     "@storybook/react-native-web-vite": "^9.1.2",
-    "@testing-library/jest-native": "^5.4.2",
-    "@testing-library/react-native": "^12.0.1",
+    "@testing-library/react-native": "^13.3.3",
     "@types/lodash.chunk": "^4.2.7",
     "@types/lodash.debounce": "^4.0.7",
     "@types/lodash.identity": "^3.0.7",
-    "@types/react": "^18.0.28",
     "@types/react-native-uuid": "^1.4.0",
-    "metro-react-native-babel-preset": "^0.76.0",
-    "react-test-renderer": "^18.2.0",
+    "@types/react-test-renderer": "19.1.0",
+    "date-fns": "^2.30.0",
+    "date-fns-tz": "^2.0.0",
+    "react-native": "^0.81.4",
+    "react-native-gesture-handler": "^2.28.0",
+    "react-native-modal-datetime-picker": "^18.0.0",
+    "react-native-reanimated": "^3.7.1",
+    "react-native-safe-area-context": "^5.4.0",
+    "react-native-svg": "^15.1.0",
+    "react-native-web": "^0.20.0",
+    "react-test-renderer": "19.1.0",
     "storybook": "^9.1.2"
   },
   "peerDependencies": {
@@ -73,10 +82,10 @@
     "@react-native-community/datetimepicker": ">=6.7.0",
     "date-fns": "^2.30.0",
     "date-fns-tz": "^2.0.0",
-    "react": "^18.2.0",
-    "react-intl": "^6.4.2",
-    "react-native": ">=0.76.0",
-    "react-native-gesture-handler": ">=2.10.0",
+    "react": "^18 || ^19.1.0",
+    "react-intl": "^6 || ^7",
+    "react-native": ">=0.79.5",
+    "react-native-gesture-handler": ">=2.22.0",
     "react-native-keyboard-aware-scroll-view": "^0.9.5",
     "react-native-modal-datetime-picker": " >=13.0.0",
     "react-native-modalize": "^2.0.13",
@@ -85,5 +94,5 @@
     "react-native-safe-area-context": "^5.4.0",
     "react-native-svg": ">=12.0.0"
   },
-  "gitHead": "35579c7a74222f56c1f6d00ae964f244886471b6"
+  "gitHead": "6d043f4908d39d779d91ffa9fe2e84418734665c"
 }

package/src/AtlantisContext/AtlantisContext.test.tsx

@@ -1,7 +1,7 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
 import type { PropsWithChildren } from "react";
 import React from "react";
-import { renderHook } from "@testing-library/react-hooks";
+import { renderHook } from "@testing-library/react-native";
 import type { AtlantisContextProps } from "./AtlantisContext";
 import {
   AtlantisContext,

package/src/AutoLink/AutoLink.test.tsx

@@ -1,12 +1,10 @@
 import React from "react";
 import { fireEvent, render } from "@testing-library/react-native";
+import { Linking } from "react-native";
 import { copyTextToClipboard } from "./clipboard";
 import { AutoLink } from "./AutoLink";
 
-const mockOpenUrl = jest.fn();
-jest.mock("react-native/Libraries/Linking/Linking", () => ({
-  openURL: mockOpenUrl,
-}));
+const mockOpenUrl = jest.spyOn(Linking, "openURL").mockImplementation();
 
 jest.mock("./clipboard", () => {
   return {

package/src/Banner/Banner.test.tsx

@@ -35,6 +35,18 @@ describe("Banner", () => {
       expect(getByText("Notice me")).toBeDefined();
       expect(icon.props.children.props.name).toBe("starburst");
     });
+
+    it("renders a success Banner", () => {
+      const { getByText, getByTestId } = render(
+        <Banner type="success">
+          <Text>Your import is complete</Text>
+        </Banner>,
+      );
+
+      const icon = getByTestId("ATL-Banner-Icon");
+      expect(getByText("Your import is complete")).toBeDefined();
+      expect(icon.props.children.props.name).toBe("checkmark");
+    });
   });
 
   describe("Children", () => {

package/src/Banner/Banner.tsx

@@ -97,5 +97,7 @@ function getBannerIcon(type: BannerTypes): IconNames | undefined {
       return "help";
     case "error":
       return "alert";
+    case "success":
+      return "checkmark";
   }
 }

package/src/Banner/components/BannerIcon/BannerIcon.style.ts

@@ -15,5 +15,8 @@ export const useStyles = buildThemedStyles(tokens => {
     notice: {
       backgroundColor: tokens["color-informative"],
     },
+    success: {
+      backgroundColor: tokens["color-success"],
+    },
   };
 });

package/src/Banner/types.ts

@@ -2,7 +2,7 @@ import type { IconNames } from "@jobber/design";
 import type { ReactElement } from "react";
 import type { StyleProp, ViewStyle } from "react-native";
 
-export type BannerTypes = "error" | "warning" | "notice";
+export type BannerTypes = "error" | "warning" | "notice" | "success";
 
 export interface BannerStyleProps {
   /**

package/src/Button/components/InternalButtonLoading/InternalButtonLoading.tsx

@@ -23,7 +23,6 @@ const leftOffset = -1 * offset;
 
 // looks like deprecation for FlatList in reanimated is cascading down to other exports
 // This is not createAnimatedComponent(FlatList), we are fine
-// eslint-disable-next-line import/no-deprecated
 const AnimatedImage = Animated.createAnimatedComponent(ImageBackground);
 
 function InternalButtonLoadingInternal({

package/src/Checkbox/CheckboxGroup.test.tsx

@@ -172,12 +172,8 @@ describe("when the parent checkbox does not have a label", () => {
   it("does not render the parent checkbox", async () => {
     const { checkboxGroup } = setup(undefined);
 
-    const findParentCheckbox = () => {
-      checkboxGroup.getByLabelText(parentCheckboxLabel);
-    };
-    expect(findParentCheckbox).toThrow(
-      "Unable to find an element with accessibilityLabel: all condiments",
-    );
+    const parentCheckbox = checkboxGroup.queryByLabelText(parentCheckboxLabel);
+    expect(parentCheckbox).toBeNull();
   });
 });
 

package/src/ContentOverlay/hooks/useKeyboardVisibility.test.ts

@@ -1,4 +1,4 @@
-import { act, renderHook } from "@testing-library/react-hooks";
+import { act, renderHook } from "@testing-library/react-native";
 import type { KeyboardEvent } from "react-native";
 import { DeviceEventEmitter } from "react-native";
 import { useKeyboardVisibility } from "./useKeyboardVisibility";

package/src/ContentOverlay/hooks/useViewLayoutHeight.test.ts

@@ -1,4 +1,4 @@
-import { act, renderHook } from "@testing-library/react-hooks";
+import { act, renderHook } from "@testing-library/react-native";
 import type { LayoutChangeEvent } from "react-native";
 import { useViewLayoutHeight } from "./useViewLayoutHeight";
 

package/src/EmptyState/EmptyState.test.tsx

@@ -1,8 +1,8 @@
 import React from "react";
-import { fireEvent, render } from "@testing-library/react-native";
+import { fireEvent, render, screen } from "@testing-library/react-native";
+import { Path } from "react-native-svg";
 import type { EmptyStateProps } from "./EmptyState";
 import { EmptyState } from "./EmptyState";
-import * as IconComponent from "../Icon/Icon";
 
 const primaryOnPress = jest.fn();
 const secondaryOnPress = jest.fn();
@@ -27,83 +27,70 @@ const component = (overrideProps?: Partial<EmptyStateProps>) => {
     ...overrideProps,
   };
 
-  return render(<EmptyState {...props} />);
+  render(<EmptyState {...props} />);
 };
 
-const iconSpy = jest.spyOn(IconComponent, "Icon");
-
-afterEach(() => jest.clearAllMocks());
-
 describe("EmptyState", () => {
   it("renders the title", () => {
-    const { getByText } = component();
+    component();
 
-    expect(getByText(defaultProps.title)).toBeDefined();
+    expect(screen.getByText(defaultProps.title)).toBeDefined();
   });
 
   it("renders the description", () => {
-    const { getByText } = component();
-
-    expect(getByText(defaultProps.description)).toBeDefined();
-  });
-
-  it("renders the icon", () => {
-    const { getByTestId } = component();
+    component();
 
-    expect(getByTestId(defaultProps.icon)).toBeDefined();
+    expect(screen.getByText(defaultProps.description)).toBeDefined();
   });
 
-  it("calls icon with correct default params", () => {
+  it("renders the icon with default color and large size", () => {
     component();
-
-    expect(iconSpy).toHaveBeenCalledWith(
-      {
-        color: "blue",
-        name: defaultProps.icon,
-        size: "large",
-      },
-      {},
+    const icon = screen.getByTestId(defaultProps.icon);
+    const path = icon.findByType(Path);
+    expect(path.props.fill).toBe("hsl(197, 90%, 12%)");
+    expect(icon.props.style).toEqual(
+      expect.arrayContaining([
+        expect.objectContaining({
+          width: 32,
+          height: 32,
+        }),
+      ]),
     );
   });
 
-  it("calls icon with correct params", () => {
-    component({ iconColor: "greyBlue", icon: "link" });
+  it("renders the correct icon color when specified", async () => {
+    component({ iconColor: "warning" });
 
-    expect(iconSpy).toHaveBeenCalledWith(
-      {
-        color: "greyBlue",
-        name: "link",
-        size: "large",
-      },
-      {},
-    );
+    const icon = screen.getByTestId(defaultProps.icon);
+    const pathElement = icon.findByType(Path);
+    expect(pathElement.props.fill).toBe("hsl(51, 64%, 49%)");
   });
 
   it("renders the primary action and allows users to interact with it by clicking", () => {
-    const { getByLabelText } = component();
+    component();
 
-    const button = getByLabelText(defaultProps.primaryAction.label);
+    const button = screen.getByLabelText(defaultProps.primaryAction.label);
     expect(button).toBeDefined();
     fireEvent.press(button);
     expect(primaryOnPress).toHaveBeenCalledTimes(1);
   });
 
   it("renders the secondary action and allows users to interact with it by clicking", () => {
-    const { getByLabelText } = component();
+    component();
 
-    const button = getByLabelText(defaultProps.secondaryAction.label);
+    const button = screen.getByLabelText(defaultProps.secondaryAction.label);
     expect(button).toBeDefined();
     fireEvent.press(button);
     expect(secondaryOnPress).toHaveBeenCalledTimes(1);
   });
 
   it("does render buttons if neither primary nor secondary action is passed in", () => {
-    const { queryAllByRole } = component({
+    component({
       description: "No buttons",
       primaryAction: undefined,
       secondaryAction: undefined,
     });
 
-    expect(queryAllByRole("button")).toHaveLength(0);
+    expect(screen.queryAllByRole("button")).toHaveLength(0);
   });
 });

package/src/Form/components/FormCache/FormCache.tsx

@@ -1,5 +1,5 @@
 import React, { useEffect, useMemo } from "react";
-import type { FieldValues } from "react-hook-form";
+import type { DeepPartial, FieldValues } from "react-hook-form";
 import { useFormContext, useWatch } from "react-hook-form";
 import omit from "lodash/omit";
 
@@ -7,7 +7,7 @@ interface FormCacheProps<T extends FieldValues> {
   readonly localCacheId?: string | string[];
   readonly localCacheKey?: string;
   readonly localCacheExclude?: string[];
-  readonly setLocalCache: (data: T) => void;
+  readonly setLocalCache: (data: DeepPartial<T>) => void;
 }
 
 export function FormCache<T extends FieldValues>({
@@ -18,7 +18,7 @@ export function FormCache<T extends FieldValues>({
   const { control, formState } = useFormContext<T>();
   const { isDirty } = formState;
 
-  const formData = useWatch<T>({ control });
+  const formData = useWatch({ control });
   const shouldExclude = useMemo(() => {
     return Array.isArray(localCacheExclude) && localCacheExclude.length > 0;
   }, [localCacheExclude]);
@@ -46,5 +46,6 @@ export function FormCache<T extends FieldValues>({
     }
   }, [formData, isDirty, localCacheExclude, setLocalCache, shouldExclude]);
 
+  // eslint-disable-next-line react/jsx-no-useless-fragment
   return <></>;
 }

package/src/Form/components/FormMessage/FormMessage.test.tsx

@@ -1,30 +1,41 @@
 import React from "react";
-import { fireEvent, render } from "@testing-library/react-native";
+import {
+  fireEvent,
+  render,
+  screen,
+  waitFor,
+} from "@testing-library/react-native";
 import { FormMessage } from ".";
 
 describe("FormMessage", () => {
   it("should render null when there are no message to show", () => {
-    const view = render(<FormMessage />);
-    expect(view.toJSON()).toMatchInlineSnapshot(`null`);
+    render(<FormMessage />);
+    expect(screen.toJSON()).toMatchInlineSnapshot(`null`);
   });
 
-  it("should show the message", () => {
-    const { getByText } = render(<FormMessage />);
+  it("should show the message", async () => {
+    render(<FormMessage />);
 
     const description = "🔥";
     FormMessage.show({ description });
-    expect(getByText(description)).toBeDefined();
+    await waitFor(() => {
+      expect(screen.getByText(description)).toBeDefined();
+    });
   });
 
-  it("should close the message", () => {
-    const { getByText, queryByText } = render(<FormMessage />);
+  it("should close the message", async () => {
+    render(<FormMessage />);
 
     const description = "🌚";
     FormMessage.show({ description });
-    expect(getByText(description)).toBeDefined();
+    await waitFor(() => {
+      expect(screen.getByText(description)).toBeDefined();
+    });
 
     FormMessage.close();
-    expect(queryByText(description)).toBeNull();
+    await waitFor(() => {
+      expect(screen.queryByText(description)).toBeNull();
+    });
   });
 
   describe("Opening another message through a message", () => {
@@ -40,33 +51,35 @@ describe("FormMessage", () => {
         },
       });
 
-    it("should show the most recent message", () => {
-      const { getByText, queryByText, getByLabelText } = render(
-        <FormMessage />,
-      );
+    it("should show the most recent message", async () => {
+      render(<FormMessage />);
 
       showMessage();
 
-      expect(getByText(firstMessage)).toBeDefined();
-      expect(queryByText(secondMessage)).toBeNull();
+      await waitFor(() => {
+        expect(screen.getByText(firstMessage)).toBeDefined();
+      });
+      expect(screen.queryByText(secondMessage)).toBeNull();
 
-      fireEvent.press(getByLabelText("Click me"));
+      fireEvent.press(screen.getByLabelText("Click me"));
 
-      expect(getByText(secondMessage)).toBeDefined();
-      expect(queryByText(firstMessage)).toBeNull();
+      expect(screen.getByText(secondMessage)).toBeDefined();
+      expect(screen.queryByText(firstMessage)).toBeNull();
     });
 
-    it("should close the most recent message", () => {
-      const { getByText, queryByText, getByLabelText } = render(
-        <FormMessage />,
-      );
+    it("should close the most recent message", async () => {
+      render(<FormMessage />);
 
       showMessage();
-      fireEvent.press(getByLabelText("Click me"));
+      await waitFor(() => {
+        expect(screen.getByText("Click me")).toBeDefined();
+      });
+      fireEvent.press(screen.getByLabelText("Click me"));
       FormMessage.close();
-
-      expect(getByText(firstMessage)).toBeDefined();
-      expect(queryByText(secondMessage)).toBeNull();
+      await waitFor(() => {
+        expect(screen.getByText(firstMessage)).toBeDefined();
+      });
+      expect(screen.queryByText(secondMessage)).toBeNull();
     });
   });
 });

package/src/Form/context/AtlantisFormContext.test.tsx

@@ -1,6 +1,6 @@
 import type { PropsWithChildren } from "react";
 import React from "react";
-import { renderHook } from "@testing-library/react-hooks";
+import { renderHook } from "@testing-library/react-native";
 import type { AtlantisFormContextProps } from "./types";
 import {
   AtlantisFormContext,

package/src/Form/context/types.ts

@@ -1,5 +1,5 @@
 import type { MutableRefObject } from "react";
-import type { FieldValues, UseFormReturn } from "react-hook-form";
+import type { DeepPartial, FieldValues, UseFormReturn } from "react-hook-form";
 
 export interface UseConfirmBeforeBackProps {
   alwaysPreventBack: boolean;
@@ -27,7 +27,7 @@ export interface AtlantisFormContextProps {
     cacheKey?: string,
     options?: LocalCacheOptions,
   ) => {
-    setLocalCache: (data: TData) => void;
+    setLocalCache: (data: DeepPartial<TData>) => void;
     removeLocalCache: () => void;
   };
 }

package/src/Form/hooks/useInternalForm.ts

@@ -1,4 +1,5 @@
 import type {
+  DeepPartial,
   FieldValues,
   UseFormHandleSubmit,
   UseFormReturn,
@@ -31,7 +32,7 @@ interface UseInternalForm<T extends FieldValues> {
   readonly isSubmitting: boolean;
   readonly isDirty: boolean;
   readonly removeListenerRef: MutableRefObject<() => void>;
-  readonly setLocalCache: (data: T) => void;
+  readonly setLocalCache: (data: DeepPartial<T>) => void;
 }
 
 export function useInternalForm<T extends FieldValues, SubmitResponseType>({

package/src/Form/hooks/useScrollToError/useScrollToError.test.tsx

@@ -1,4 +1,4 @@
-import { renderHook } from "@testing-library/react-hooks";
+import { renderHook } from "@testing-library/react-native";
 import { useScrollToError } from "./useScrollToError";
 
 const mockFormState = {
@@ -25,6 +25,7 @@ jest.mock("../../../ErrorMessageWrapper", () => ({
       el: {
         measure: jest.fn((_, callback) => callback()),
         hasErrorMessage: true,
+        accessibilityFocus: jest.fn(),
       },
     },
     register: jest.fn(),