refactor: update imports to use type-only imports for React in form components

- Replaced standard React imports with type-only imports across multiple form components for improved type safety and clarity.
- Ensured consistency in the usage of functional components with TypeScript interfaces.

Author: jaruesink

packages/medusa-forms/src/controlled/ControlledCurrencyInput.tsx

@@ -1,3 +1,4 @@
+import type * as React from 'react';
 import {
   Controller,
   type ControllerProps,

packages/medusa-forms/src/controlled/ControlledSelect.tsx

@@ -1,3 +1,4 @@
+import type * as React from 'react';
 import {
   Controller,
   type ControllerProps,

packages/medusa-forms/src/controlled/ControlledTextArea.tsx

@@ -1,3 +1,4 @@
+import type * as React from 'react';
 import {
   Controller,
   type ControllerProps,

packages/medusa-forms/src/ui/ColorInput.tsx

@@ -1,3 +1,4 @@
+import type * as React from 'react';
 import { Input } from './Input';
 
 interface ColorInputProps {

packages/medusa-forms/src/ui/CurrencyInput.tsx

@@ -1,15 +1,16 @@
 import { CurrencyInput as MedusaCurrencyInput } from '@medusajs/ui';
-import { type FC } from 'react';
+import type * as React from 'react';
+import type { FC } from 'react';
 import { FieldWrapper } from './FieldWrapper';
 import type { BasicFieldProps, MedusaCurrencyInputProps } from './types';
 
-export type Props = MedusaCurrencyInputProps & BasicFieldProps & {
-  ref?: React.Ref<HTMLInputElement>;
-};
+export type Props = MedusaCurrencyInputProps &
+  BasicFieldProps & {
+    ref?: React.Ref<HTMLInputElement>;
+  };
 
 const Wrapper = FieldWrapper<Props>;
 
 export const CurrencyInput: FC<Props> = ({ ref, ...props }) => (
   <Wrapper {...props}>{(inputProps) => <MedusaCurrencyInput {...inputProps} ref={ref} />}</Wrapper>
 );
-

packages/medusa-forms/src/ui/DatePicker.tsx

@@ -1,15 +1,16 @@
 import { DatePicker } from '@medusajs/ui';
-import { type FC } from 'react';
+import type * as React from 'react';
+import type { FC } from 'react';
 import { FieldWrapper } from './FieldWrapper';
 import type { BasicFieldProps, DatePickerProps } from './types';
 
-export type Props = DatePickerProps & BasicFieldProps & {
-  ref?: React.Ref<HTMLInputElement>;
-};
+export type Props = DatePickerProps &
+  BasicFieldProps & {
+    ref?: React.Ref<HTMLInputElement>;
+  };
 
 const Wrapper = FieldWrapper<Props>;
 
 export const DatePickerInput: FC<Props> = ({ ref, ...props }) => {
   return <Wrapper {...props}>{(inputProps) => <DatePicker {...{ ...inputProps, ref }} />}</Wrapper>;
 };
-

packages/medusa-forms/src/ui/FieldCheckbox.tsx

@@ -1,5 +1,6 @@
 import { Checkbox as MedusaCheckbox } from '@medusajs/ui';
 import clsx from 'clsx';
+import type * as React from 'react';
 import { FieldWrapper } from './FieldWrapper';
 import { Label } from './Label';
 import type { BasicFieldProps } from './types';
@@ -11,16 +12,16 @@ export type FieldCheckboxProps = BasicFieldProps & {
   ref?: React.Ref<HTMLButtonElement>;
 };
 
-export const FieldCheckbox: React.FC<FieldCheckboxProps> = ({ 
-  label, 
-  labelClassName, 
-  labelTooltip, 
-  wrapperClassName, 
-  errorClassName, 
-  formErrors, 
-  onChange, 
+export const FieldCheckbox: React.FC<FieldCheckboxProps> = ({
+  label,
+  labelClassName,
+  labelTooltip,
+  wrapperClassName,
+  errorClassName,
+  formErrors,
+  onChange,
   ref,
-  ...props 
+  ...props
 }) => {
   return (
     <FieldWrapper<FieldCheckboxProps>
@@ -57,4 +58,3 @@ export const FieldCheckbox: React.FC<FieldCheckboxProps> = ({
     </FieldWrapper>
   );
 };
-

packages/medusa-forms/src/ui/FieldGroup.tsx

@@ -1,4 +1,5 @@
 import clsx from 'clsx';
+import type * as React from 'react';
 
 export const FieldGroup = ({ className, children }: { className?: string; children: React.ReactNode }) => {
   return <div className={clsx('flex flex-col gap-y-small', className)}>{children}</div>;

packages/medusa-forms/src/ui/Input.tsx

@@ -1,14 +1,15 @@
 import { Input as MedusaInput } from '@medusajs/ui';
+import type * as React from 'react';
 import { FieldWrapper } from './FieldWrapper';
 import type { BasicFieldProps, MedusaInputProps } from './types';
 
-export type Props = MedusaInputProps & BasicFieldProps & {
-  ref?: React.Ref<HTMLInputElement>;
-};
+export type Props = MedusaInputProps &
+  BasicFieldProps & {
+    ref?: React.Ref<HTMLInputElement>;
+  };
 
 const Wrapper = FieldWrapper<Props>;
 
 export const Input: React.FC<Props> = ({ ref, ...props }) => (
   <Wrapper {...props}>{(inputProps) => <MedusaInput {...inputProps} ref={ref} />}</Wrapper>
 );
-

packages/medusa-forms/src/ui/Label.tsx

@@ -1,6 +1,7 @@
 import { InformationCircle } from '@medusajs/icons';
 import { Label as MedusaLabel, Tooltip } from '@medusajs/ui';
 import clsx from 'clsx';
+import type * as React from 'react';
 
 interface Props {
   htmlFor?: string;