Merge pull request #680 from gadget-inc/switch-out-react-hook-form

infiton · web-flow · commit 90dfc789020b · 2024-10-18T10:56:10.000-04:00
use the exported members of react-hook-form from useActionForm
diff --git a/packages/react/cypress/component/auto/form/PolarisAutoRichTextInput.cy.tsx b/packages/react/cypress/component/auto/form/PolarisAutoRichTextInput.cy.tsx
@@ -1,7 +1,7 @@
 import React from "react";
-import { useFormContext } from "react-hook-form";
 import { PolarisAutoForm } from "../../../../src/auto/polaris/PolarisAutoForm.js";
 import PolarisAutoRichTextInput from "../../../../src/auto/polaris/inputs/PolarisAutoRichTextInput.js";
+import { useFormContext } from "../../../../src/useActionForm.js";
 import { DebugFormState } from "../../../support/DebugFormState.js";
 import { api } from "../../../support/api.js";
 import { PolarisWrapper } from "../../../support/auto.js";
diff --git a/packages/react/cypress/support/DebugFormState.tsx b/packages/react/cypress/support/DebugFormState.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import { useFormContext } from "react-hook-form";
+import { useFormContext } from "../../src/useActionForm.js";
 
 /** debug component for explicitly rendering out the form state for visual inspection in tests */
 export const DebugFormState = () => {
diff --git a/packages/react/cypress/support/auto.tsx b/packages/react/cypress/support/auto.tsx
@@ -5,10 +5,10 @@ import "@shopify/polaris/build/esm/styles.css";
 import translations from "@shopify/polaris/locales/en.json";
 import type { ComponentType, ReactNode } from "react";
 import React from "react";
-import { FormProvider, useForm } from "react-hook-form";
 import type { AutoAdapter } from "../../src/auto/index.js";
 import * as MUIAdapter from "../../src/auto/mui/test-index.js";
 import * as PolarisAdapter from "../../src/auto/polaris/index.js";
+import { FormProvider, useForm } from "../../src/useActionForm.js";
 
 interface AutoSuiteConfig {
   name: string;
diff --git a/packages/react/spec/auto/MockForm.tsx b/packages/react/spec/auto/MockForm.tsx
@@ -2,8 +2,8 @@ import { AppProvider } from "@shopify/polaris";
 import translations from "@shopify/polaris/locales/en.json";
 import type { ReactNode } from "react";
 import React from "react";
-import { FormProvider, useForm } from "react-hook-form";
 import { AutoFormMetadataContext } from "../../src/auto/AutoFormContext.js";
+import { FormProvider, useForm } from "../../src/useActionForm.js";
 import { testApi as api } from "../apis.js";
 import { MockClientProvider } from "../testWrappers.js";
 
diff --git a/packages/react/spec/auto/PolarisAutoForm.stories.jsx b/packages/react/spec/auto/PolarisAutoForm.stories.jsx
@@ -1,11 +1,11 @@
 import { AppProvider, Card, Page } from "@shopify/polaris";
 import translations from "@shopify/polaris/locales/en.json";
 import React from "react";
-import { FormProvider, useForm } from "react-hook-form";
 import { Provider } from "../../src/GadgetProvider.tsx";
 import { PolarisAutoForm } from "../../src/auto/polaris/PolarisAutoForm.tsx";
 import { PolarisAutoInput } from "../../src/auto/polaris/inputs/PolarisAutoInput.tsx";
 import { PolarisAutoSubmit } from "../../src/auto/polaris/submit/PolarisAutoSubmit.tsx";
+import { FormProvider, useForm } from "../../src/useActionForm.ts";
 import { testApi as api } from "../apis.ts";
 import { StorybookErrorBoundary } from "./StorybookErrorBoundary.tsx";
 
diff --git a/packages/react/spec/auto/form/PolarisAutoFormErrors.stories.jsx b/packages/react/spec/auto/form/PolarisAutoFormErrors.stories.jsx
@@ -1,9 +1,9 @@
 import { AppProvider, Card, Page } from "@shopify/polaris";
 import translations from "@shopify/polaris/locales/en.json";
 import React from "react";
-import { FormProvider, useForm } from "react-hook-form";
 import { Provider } from "../../../src/GadgetProvider.tsx";
 import { PolarisAutoForm } from "../../../src/auto/polaris/PolarisAutoForm.tsx";
+import { FormProvider, useForm } from "../../../src/useActionForm.ts";
 import { testApi as api } from "../../apis.ts";
 
 export default {
diff --git a/packages/react/spec/auto/form/PolarisAutoFormFindByUniqueField.stories.jsx b/packages/react/spec/auto/form/PolarisAutoFormFindByUniqueField.stories.jsx
@@ -1,9 +1,9 @@
 import { AppProvider, Card, Page } from "@shopify/polaris";
 import translations from "@shopify/polaris/locales/en.json";
 import React from "react";
-import { FormProvider, useForm } from "react-hook-form";
 import { Provider } from "../../../src/GadgetProvider.tsx";
 import { PolarisAutoForm } from "../../../src/auto/polaris/PolarisAutoForm.tsx";
+import { FormProvider, useForm } from "../../../src/useActionForm.ts";
 import { testApi as api } from "../../apis.ts";
 
 export default {
diff --git a/packages/react/spec/auto/inputs/PolarisAutoEnumInput.stories.jsx b/packages/react/spec/auto/inputs/PolarisAutoEnumInput.stories.jsx
@@ -1,9 +1,9 @@
 import { AppProvider, Card, Page } from "@shopify/polaris";
 import React from "react";
-import { FormProvider, useForm } from "react-hook-form";
 import { Provider } from "../../../src/GadgetProvider.tsx";
 import { PolarisAutoForm } from "../../../src/auto/polaris/PolarisAutoForm.tsx";
 import { PolarisAutoEnumInput } from "../../../src/auto/polaris/inputs/PolarisAutoEnumInput.tsx";
+import { FormProvider, useForm } from "../../../src/useActionForm.ts";
 import { testApi as api } from "../../apis.ts";
 
 // More on how to set up stories at: https://storybook.js.org/docs/writing-stories#default-export
diff --git a/packages/react/spec/auto/inputs/PolarisAutoPasswordInput.stories.jsx b/packages/react/spec/auto/inputs/PolarisAutoPasswordInput.stories.jsx
@@ -1,12 +1,12 @@
 import { AppProvider, Card, Page } from "@shopify/polaris";
 import translations from "@shopify/polaris/locales/en.json";
 import React from "react";
-import { FormProvider, useForm } from "react-hook-form";
 import { Provider } from "../../../src/GadgetProvider.tsx";
 import { PolarisAutoForm } from "../../../src/auto/polaris/PolarisAutoForm.tsx";
 import { PolarisAutoPasswordInput } from "../../../src/auto/polaris/inputs/PolarisAutoPasswordInput.tsx";
 import { PolarisAutoSubmit } from "../../../src/auto/polaris/submit/PolarisAutoSubmit.tsx";
 import { PolarisSubmitResultBanner } from "../../../src/auto/polaris/submit/PolarisSubmitResultBanner.tsx";
+import { FormProvider, useForm } from "../../../src/useActionForm.ts";
 import { testApi as api } from "../../apis.ts";
 // More on how to set up stories at: https://storybook.js.org/docs/writing-stories#default-export
 export default {
diff --git a/packages/react/spec/auto/inputs/PolarisBooleanInput.stories.jsx b/packages/react/spec/auto/inputs/PolarisBooleanInput.stories.jsx
@@ -1,10 +1,10 @@
 import { AppProvider } from "@shopify/polaris";
 import translations from "@shopify/polaris/locales/en.json";
 import React from "react";
-import { FormProvider, useForm } from "react-hook-form";
 import { Provider } from "../../../src/GadgetProvider.tsx";
 import { PolarisAutoForm } from "../../../src/auto/polaris/PolarisAutoForm.tsx";
 import { PolarisAutoBooleanInput } from "../../../src/auto/polaris/inputs/PolarisAutoBooleanInput.tsx";
+import { FormProvider, useForm } from "../../../src/useActionForm.ts";
 import { testApi as api } from "../../apis.ts";
 export default {
   title: "Polaris/BooleanInput",
diff --git a/packages/react/spec/auto/inputs/PolarisFileInput.stories.jsx b/packages/react/spec/auto/inputs/PolarisFileInput.stories.jsx
@@ -1,10 +1,10 @@
 import { AppProvider } from "@shopify/polaris";
 import translations from "@shopify/polaris/locales/en.json";
 import React from "react";
-import { FormProvider, useForm } from "react-hook-form";
 import { Provider } from "../../../src/GadgetProvider.tsx";
 import { PolarisAutoForm } from "../../../src/auto/polaris/PolarisAutoForm.tsx";
 import { PolarisAutoFileInput } from "../../../src/auto/polaris/inputs/PolarisAutoFileInput.tsx";
+import { FormProvider, useForm } from "../../../src/useActionForm.ts";
 import { testApi as api } from "../../apis.ts";
 
 export default {
diff --git a/packages/react/spec/auto/inputs/PolarisJsonInput.stories.jsx b/packages/react/spec/auto/inputs/PolarisJsonInput.stories.jsx
@@ -1,10 +1,10 @@
 import { AppProvider, Card, Page } from "@shopify/polaris";
 import translations from "@shopify/polaris/locales/en.json";
 import React from "react";
-import { FormProvider, useForm } from "react-hook-form";
 import { Provider } from "../../../src/GadgetProvider.tsx";
 import { PolarisAutoForm } from "../../../src/auto/polaris/PolarisAutoForm.tsx";
 import { PolarisAutoJSONInput } from "../../../src/auto/polaris/inputs/PolarisAutoJSONInput.tsx";
+import { FormProvider, useForm } from "../../../src/useActionForm.ts";
 import { testApi as api } from "../../apis.ts";
 
 export default {
diff --git a/packages/react/spec/auto/inputs/PolarisStringInput.stories.jsx b/packages/react/spec/auto/inputs/PolarisStringInput.stories.jsx
@@ -1,10 +1,10 @@
 import { AppProvider, Card, Page } from "@shopify/polaris";
 import translations from "@shopify/polaris/locales/en.json";
 import React from "react";
-import { FormProvider, useForm } from "react-hook-form";
 import { Provider } from "../../../src/GadgetProvider.tsx";
 import { PolarisAutoForm } from "../../../src/auto/polaris/PolarisAutoForm.tsx";
 import { PolarisAutoTextInput } from "../../../src/auto/polaris/inputs/PolarisAutoTextInput.tsx";
+import { FormProvider, useForm } from "../../../src/useActionForm.ts";
 import { testApi as api } from "../../apis.ts";
 
 // More on how to set up stories at: https://storybook.js.org/docs/writing-stories#default-export
diff --git a/packages/react/src/auto/hooks/useBelongsToInputController.tsx b/packages/react/src/auto/hooks/useBelongsToInputController.tsx
@@ -1,5 +1,5 @@
 import { useCallback, useEffect, useMemo } from "react";
-import { useController, useFormContext } from "react-hook-form";
+import { useController, useFormContext } from "../../useActionForm.js";
 import { useAutoFormMetadata } from "../AutoFormContext.js";
 import type { AutoRelationshipInputProps } from "../interfaces/AutoRelationshipInputProps.js";
 import { useFieldMetadata } from "./useFieldMetadata.js";
diff --git a/packages/react/src/auto/hooks/useEnumInputController.tsx b/packages/react/src/auto/hooks/useEnumInputController.tsx
@@ -1,5 +1,5 @@
 import { useCallback, useMemo, useState } from "react";
-import { useController, type Control } from "react-hook-form";
+import { useController, type Control } from "../../useActionForm.js";
 import { useFieldMetadata } from "./useFieldMetadata.js";
 
 export const useEnumInputController = (props: {
diff --git a/packages/react/src/auto/hooks/useFileInputController.tsx b/packages/react/src/auto/hooks/useFileInputController.tsx
@@ -1,8 +1,8 @@
 import { filesize } from "filesize";
 import { useCallback, useEffect, useMemo, useState } from "react";
-import { useController, useFormContext, type Control } from "react-hook-form";
 import { useApi } from "../../GadgetProvider.js";
 import type { GadgetOnlyImageFileFieldValidation, GadgetRangeFieldValidation } from "../../internal/gql/graphql.js";
+import { useController, useFormContext, type Control } from "../../useActionForm.js";
 import type { AutoFileFieldValue } from "../../validationSchema.js";
 import { RequiredValidationSpecId, isAutoFileFieldValue } from "../../validationSchema.js";
 import { useFieldMetadata } from "./useFieldMetadata.js";
diff --git a/packages/react/src/auto/hooks/useHasManyInputController.tsx b/packages/react/src/auto/hooks/useHasManyInputController.tsx
@@ -1,6 +1,6 @@
 import { useCallback, useEffect, useMemo } from "react";
-import { useFieldArray, useFormContext } from "react-hook-form";
 import type { GadgetHasManyConfig } from "../../internal/gql/graphql.js";
+import { useFieldArray, useFormContext } from "../../useActionForm.js";
 import { uniq } from "../../utils.js";
 import type { AutoRelationshipInputProps } from "../interfaces/AutoRelationshipInputProps.js";
 import { useFieldMetadata } from "./useFieldMetadata.js";
diff --git a/packages/react/src/auto/hooks/useHasOneInputController.tsx b/packages/react/src/auto/hooks/useHasOneInputController.tsx
@@ -1,6 +1,6 @@
 import { useCallback, useMemo } from "react";
-import { useFieldArray } from "react-hook-form";
 import type { GadgetHasOneConfig } from "../../internal/gql/graphql.js";
+import { useFieldArray } from "../../useActionForm.js";
 import { uniq } from "../../utils.js";
 import type { AutoRelationshipInputProps } from "../interfaces/AutoRelationshipInputProps.js";
 import { useFieldMetadata } from "./useFieldMetadata.js";
diff --git a/packages/react/src/auto/hooks/useHiddenInput.tsx b/packages/react/src/auto/hooks/useHiddenInput.tsx
@@ -1,6 +1,6 @@
 import { useEffect } from "react";
-import { useFormContext } from "react-hook-form";
 import { GadgetFieldType } from "../../internal/gql/graphql.js";
+import { useFormContext } from "../../useActionForm.js";
 import { useFieldMetadata } from "./useFieldMetadata.js";
 
 export const useHiddenInput = (props: { field: string; value: any }) => {
diff --git a/packages/react/src/auto/hooks/useJSONInputController.tsx b/packages/react/src/auto/hooks/useJSONInputController.tsx
@@ -1,6 +1,6 @@
 import { useCallback, useEffect, useState } from "react";
 import deepEqual from "react-fast-compare";
-import type { UseControllerProps } from "react-hook-form";
+import type { UseControllerProps } from "../../useActionForm.js";
 import { isFailedJSONParse, type FailedJSONParse } from "../../validationSchema.js";
 import { useStringInputController } from "./useStringInputController.js";
 
diff --git a/packages/react/src/auto/hooks/useRoleInputController.tsx b/packages/react/src/auto/hooks/useRoleInputController.tsx
@@ -1,7 +1,7 @@
 import { useMemo } from "react";
-import type { Control } from "react-hook-form";
-import { useController } from "react-hook-form";
 import { useRolesMetadata } from "../../metadata.js";
+import type { Control } from "../../useActionForm.js";
+import { useController } from "../../useActionForm.js";
 import { useFieldMetadata } from "./useFieldMetadata.js";
 
 export const useRoleInputController = (props: {
diff --git a/packages/react/src/auto/hooks/useStringInputController.tsx b/packages/react/src/auto/hooks/useStringInputController.tsx
@@ -1,7 +1,7 @@
-import type { UseControllerProps } from "react-hook-form";
-import { useController } from "react-hook-form";
 import type { GadgetFieldType } from "../../internal/gql/graphql.js";
 import { FieldType } from "../../metadata.js";
+import type { UseControllerProps } from "../../useActionForm.js";
+import { useController } from "../../useActionForm.js";
 import { useFieldMetadata } from "./useFieldMetadata.js";
 
 export const FieldTypeToInputType: Partial<Record<GadgetFieldType, string>> = {
diff --git a/packages/react/src/auto/interfaces/AutoRelationshipInputProps.tsx b/packages/react/src/auto/interfaces/AutoRelationshipInputProps.tsx
@@ -1,5 +1,5 @@
 import type { ReactNode } from "react";
-import type { Control } from "react-hook-form";
+import type { Control } from "../../useActionForm.js";
 
 export interface AutoRelationshipInputProps {
   field: string;
diff --git a/packages/react/src/auto/mui/MUIAutoForm.tsx b/packages/react/src/auto/mui/MUIAutoForm.tsx
@@ -2,7 +2,7 @@ import type { ActionFunction } from "@gadgetinc/api-client-core";
 import type { GridProps } from "@mui/material";
 import { Grid, Skeleton, Typography } from "@mui/material";
 import React from "react";
-import { FormProvider } from "react-hook-form";
+import { FormProvider } from "../../useActionForm.js";
 import { humanizeCamelCase, type OptionsType } from "../../utils.js";
 import { useAutoForm, type AutoFormProps } from "../AutoForm.js";
 import { validateAutoFormProps } from "../AutoFormActionValidators.js";
diff --git a/packages/react/src/auto/mui/inputs/MUIAutoBooleanInput.tsx b/packages/react/src/auto/mui/inputs/MUIAutoBooleanInput.tsx
@@ -1,7 +1,7 @@
 import type { CheckboxProps } from "@mui/material";
 import { Checkbox } from "@mui/material";
 import React from "react";
-import { useController, type Control } from "react-hook-form";
+import { useController, type Control } from "../../../useActionForm.js";
 import { useFieldMetadata } from "../../hooks/useFieldMetadata.js";
 import { MUIAutoFormControl } from "./MUIAutoFormControl.js";
 
diff --git a/packages/react/src/auto/mui/inputs/MUIAutoDateTimePicker.tsx b/packages/react/src/auto/mui/inputs/MUIAutoDateTimePicker.tsx
@@ -1,9 +1,9 @@
 import { Box } from "@mui/material";
 import { DatePicker, TimePicker } from "@mui/x-date-pickers";
 import React from "react";
-import { useController } from "react-hook-form";
 import { zonedTimeToUtc } from "../../../dateTimeUtils.js";
 import type { GadgetDateTimeConfig } from "../../../internal/gql/graphql.js";
+import { useController } from "../../../useActionForm.js";
 import { useFieldMetadata } from "../../hooks/useFieldMetadata.js";
 
 export const MUIAutoDateTimePicker = (props: {
diff --git a/packages/react/src/auto/mui/inputs/MUIAutoEncryptedStringInput.tsx b/packages/react/src/auto/mui/inputs/MUIAutoEncryptedStringInput.tsx
@@ -1,7 +1,7 @@
 import type { TextFieldProps } from "@mui/material";
 import { IconButton } from "@mui/material";
 import React, { useState } from "react";
-import type { Control } from "react-hook-form";
+import type { Control } from "../../../useActionForm.js";
 import { MUIAutoTextInput } from "./MUIAutoTextInput.js";
 
 export const MUIAutoEncryptedStringInput = (
diff --git a/packages/react/src/auto/mui/inputs/MUIAutoFileInput.tsx b/packages/react/src/auto/mui/inputs/MUIAutoFileInput.tsx
@@ -1,6 +1,6 @@
 import { Button, styled } from "@mui/material";
 import React from "react";
-import type { Control } from "react-hook-form";
+import type { Control } from "../../../useActionForm.js";
 import { useFileInputController } from "../../hooks/useFileInputController.js";
 import { MUIAutoFormControl } from "./MUIAutoFormControl.js";
 
diff --git a/packages/react/src/auto/mui/inputs/MUIAutoFormControl.tsx b/packages/react/src/auto/mui/inputs/MUIAutoFormControl.tsx
@@ -1,7 +1,7 @@
 import { FormControl, FormControlLabel, FormGroup, FormHelperText } from "@mui/material";
 import type { ReactElement } from "react";
 import React from "react";
-import { useController } from "react-hook-form";
+import { useController } from "../../../useActionForm.js";
 import { useFieldMetadata } from "../../hooks/useFieldMetadata.js";
 
 export const MUIAutoFormControl = (props: { field: string; children: ReactElement; label?: string }) => {
diff --git a/packages/react/src/auto/mui/inputs/MUIAutoJSONInput.tsx b/packages/react/src/auto/mui/inputs/MUIAutoJSONInput.tsx
@@ -1,7 +1,7 @@
 import type { TextFieldProps } from "@mui/material";
 import { TextField } from "@mui/material";
 import React from "react";
-import type { Control } from "react-hook-form";
+import type { Control } from "../../../useActionForm.js";
 import { useFocus } from "../../../useFocus.js";
 import { useJSONInputController } from "../../hooks/useJSONInputController.js";
 
diff --git a/packages/react/src/auto/mui/inputs/MUIAutoPasswordInput.tsx b/packages/react/src/auto/mui/inputs/MUIAutoPasswordInput.tsx
@@ -1,7 +1,7 @@
 import type { TextFieldProps } from "@mui/material";
 import { IconButton } from "@mui/material";
 import React, { useState } from "react";
-import { useController, type Control } from "react-hook-form";
+import { useController, type Control } from "../../../useActionForm.js";
 import { useAutoFormMetadata } from "../../AutoFormContext.js";
 import { useFieldMetadata } from "../../hooks/useFieldMetadata.js";
 import { MUIAutoEncryptedStringInput } from "./MUIAutoEncryptedStringInput.js";
diff --git a/packages/react/src/auto/mui/inputs/MUIAutoRolesInput.tsx b/packages/react/src/auto/mui/inputs/MUIAutoRolesInput.tsx
@@ -1,7 +1,7 @@
 import type { AutocompleteProps } from "@mui/material";
 import { Autocomplete, TextField } from "@mui/material";
 import React from "react";
-import type { Control } from "react-hook-form";
+import type { Control } from "../../../useActionForm.js";
 import { useRoleInputController } from "../../hooks/useRoleInputController.js";
 
 export const MUIAutoRolesInput = (
diff --git a/packages/react/src/auto/mui/inputs/MUIAutoTextInput.tsx b/packages/react/src/auto/mui/inputs/MUIAutoTextInput.tsx
@@ -1,7 +1,7 @@
 import type { TextFieldProps } from "@mui/material";
 import { TextField } from "@mui/material";
 import React from "react";
-import type { Control } from "react-hook-form";
+import type { Control } from "../../../useActionForm.js";
 import { useStringInputController } from "../../hooks/useStringInputController.js";
 
 export const MUIAutoTextInput = (
diff --git a/packages/react/src/auto/polaris/PolarisAutoForm.tsx b/packages/react/src/auto/polaris/PolarisAutoForm.tsx
@@ -2,7 +2,7 @@ import type { ActionFunction } from "@gadgetinc/api-client-core";
 import type { FormProps } from "@shopify/polaris";
 import { BlockStack, Form, FormLayout, SkeletonBodyText, SkeletonDisplayText, Text } from "@shopify/polaris";
 import React from "react";
-import { FormProvider } from "react-hook-form";
+import { FormProvider } from "../../useActionForm.js";
 import { humanizeCamelCase, type OptionsType } from "../../utils.js";
 import type { AutoFormProps } from "../AutoForm.js";
 import { useAutoForm } from "../AutoForm.js";
diff --git a/packages/react/src/auto/polaris/inputs/PolarisAutoBooleanInput.tsx b/packages/react/src/auto/polaris/inputs/PolarisAutoBooleanInput.tsx
@@ -1,8 +1,8 @@
 import type { CheckboxProps } from "@shopify/polaris";
 import { Checkbox } from "@shopify/polaris";
 import React from "react";
-import type { Control } from "react-hook-form";
-import { useController } from "react-hook-form";
+import type { Control } from "../../../useActionForm.js";
+import { useController } from "../../../useActionForm.js";
 import { useFieldMetadata } from "../../hooks/useFieldMetadata.js";
 
 export const PolarisAutoBooleanInput = (props: { field: string; control?: Control<any> } & Partial<CheckboxProps>) => {
diff --git a/packages/react/src/auto/polaris/inputs/PolarisAutoDateTimePicker.tsx b/packages/react/src/auto/polaris/inputs/PolarisAutoDateTimePicker.tsx
@@ -2,9 +2,9 @@ import type { DatePickerProps, TextFieldProps } from "@shopify/polaris";
 import { DatePicker, Icon, InlineStack, Popover, TextField } from "@shopify/polaris";
 import { CalendarIcon } from "@shopify/polaris-icons";
 import React, { useCallback, useMemo, useState } from "react";
-import { useController } from "react-hook-form";
 import { formatShortDateString, isValidDate, utcToZonedTime, zonedTimeToUtc } from "../../../dateTimeUtils.js";
 import type { GadgetDateTimeConfig } from "../../../internal/gql/graphql.js";
+import { useController } from "../../../useActionForm.js";
 import { useFieldMetadata } from "../../hooks/useFieldMetadata.js";
 import type { DateTimeState } from "./PolarisAutoTimePicker.js";
 import PolarisAutoTimePicker from "./PolarisAutoTimePicker.js";
diff --git a/packages/react/src/auto/polaris/inputs/PolarisAutoEncryptedStringInput.tsx b/packages/react/src/auto/polaris/inputs/PolarisAutoEncryptedStringInput.tsx
@@ -2,7 +2,7 @@ import type { TextFieldProps } from "@shopify/polaris";
 import { Button } from "@shopify/polaris";
 import { HideIcon, ViewIcon } from "@shopify/polaris-icons";
 import React, { useState } from "react";
-import type { Control } from "react-hook-form";
+import type { Control } from "../../../useActionForm.js";
 import { PolarisAutoTextInput } from "./PolarisAutoTextInput.js";
 
 export const PolarisAutoEncryptedStringInput = (
diff --git a/packages/react/src/auto/polaris/inputs/PolarisAutoEnumInput.tsx b/packages/react/src/auto/polaris/inputs/PolarisAutoEnumInput.tsx
@@ -1,7 +1,7 @@
 import type { ComboboxProps } from "@shopify/polaris";
 import { AutoSelection, Box, Combobox, InlineStack, Listbox, Tag, Text } from "@shopify/polaris";
 import React, { useCallback } from "react";
-import { type Control } from "react-hook-form";
+import type { Control } from "../../../useActionForm.js";
 import { useEnumInputController } from "../../hooks/useEnumInputController.js";
 
 export const PolarisAutoEnumInput = (props: { field: string; control?: Control<any>; label?: string } & Partial<ComboboxProps>) => {
diff --git a/packages/react/src/auto/polaris/inputs/PolarisAutoFileInput.tsx b/packages/react/src/auto/polaris/inputs/PolarisAutoFileInput.tsx
@@ -3,7 +3,7 @@ import { Box, Button, DropZone, InlineError, InlineStack, Thumbnail } from "@sho
 import { DeleteIcon, NoteIcon } from "@shopify/polaris-icons";
 import { filesize } from "filesize";
 import React, { useMemo } from "react";
-import type { Control } from "react-hook-form";
+import type { Control } from "../../../useActionForm.js";
 import { isAutoFileFieldValue } from "../../../validationSchema.js";
 import { getFileSizeValidationMessage, imageFileTypes, useFileInputController } from "../../hooks/useFileInputController.js";
 
diff --git a/packages/react/src/auto/polaris/inputs/PolarisAutoJSONInput.tsx b/packages/react/src/auto/polaris/inputs/PolarisAutoJSONInput.tsx
@@ -1,7 +1,7 @@
 import type { TextFieldProps } from "@shopify/polaris";
 import { TextField } from "@shopify/polaris";
 import React from "react";
-import type { Control } from "react-hook-form";
+import type { Control } from "../../../useActionForm.js";
 import { useFocus } from "../../../useFocus.js";
 import { getPropsWithoutRef } from "../../../utils.js";
 import { useJSONInputController } from "../../hooks/useJSONInputController.js";
diff --git a/packages/react/src/auto/polaris/inputs/PolarisAutoNumberInput.tsx b/packages/react/src/auto/polaris/inputs/PolarisAutoNumberInput.tsx
diff --git a/packages/react/src/auto/polaris/inputs/PolarisAutoPasswordInput.tsx b/packages/react/src/auto/polaris/inputs/PolarisAutoPasswordInput.tsx
diff --git a/packages/react/src/auto/polaris/inputs/PolarisAutoRolesInput.tsx b/packages/react/src/auto/polaris/inputs/PolarisAutoRolesInput.tsx
diff --git a/packages/react/src/auto/polaris/inputs/PolarisAutoTextInput.tsx b/packages/react/src/auto/polaris/inputs/PolarisAutoTextInput.tsx
diff --git a/packages/react/src/auto/polaris/inputs/PolarisAutoTimePicker.tsx b/packages/react/src/auto/polaris/inputs/PolarisAutoTimePicker.tsx
diff --git a/packages/react/src/auto/shared/AutoRichTextInput.tsx b/packages/react/src/auto/shared/AutoRichTextInput.tsx
diff --git a/packages/react/src/auto/shared/AutoRichTextInputProps.tsx b/packages/react/src/auto/shared/AutoRichTextInputProps.tsx
