@react-solutions/inputs 0.2.1 → 0.2.3

package/dist/index.d.mts

@@ -1,1333 +1,1789 @@
+import { SliderProps, FormControlProps, FormLabelProps, SwitchProps, FormControlLabelProps, RadioGroupProps, RadioProps, FormControl, CheckboxProps, Box, Stack, ButtonProps, TextFieldProps, AutocompleteProps, AutocompleteChangeReason, AutocompleteInputChangeReason, AutocompleteCloseReason, SelectProps, MenuItemProps, InputLabel, SelectChangeEvent, IconButtonProps, TextFieldPropsSizeOverrides, SxProps, Theme } from '@mui/material';
+import * as React from 'react';
+import React__default, { SyntheticEvent, FocusEvent, ChangeEvent } from 'react';
+import { AdapterDateFns } from '@mui/x-date-pickers/AdapterDateFns/index';
+import { DateCalendarProps, TimeClockProps, TimeView, TimePickerProps, DatePickerProps } from '@mui/x-date-pickers';
+import { FilterOptionsState } from '@mui/material/useAutocomplete';
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import { FieldValues, Control, FieldErrors } from 'react-hook-form';
-import { ComponentType } from 'react';
 
-/**
- * @module @react-solutions/input
- * @description A comprehensive React form input library with React Hook Form integration and Material-UI components.
- * Provides both standalone FormFields and React Hook Form integrated HookFormFields.
- * @version 0.0.0
- * @author React Solutions
- *
- * @example
- * ```typescript
- * import { FormInputTextField, useForm } from '@react-solutions/input';
- * import { useForm } from 'react-hook-form';
- *
- * function MyForm() {
- *   const { control, handleSubmit, formState: { errors } } = useForm();
- *
- *   const onSubmit = (data) => {
- *     console.log(data);
- *   };
- *
- *   return (
- *     <form onSubmit={handleSubmit(onSubmit)}>
- *       <FormInputTextField
- *         name="username"
- *         label="Username"
- *         control={control}
- *         errors={errors}
- *       />
- *       <button type="submit">Submit</button>
- *     </form>
- *   );
- * }
- * ```
- */
-
-// ============================================================================
-// HOOK FORM FIELDS - Text Inputs
-// ============================================================================
-
-/**
- * @component FormInputTextField
- * @description React Hook Form integrated text input field component.
- * Wraps TextInputField with React Hook Form Controller for form state management.
- *
- * @example
- * ```typescript
- * import { FormInputTextField } from '@react-solutions/input';
- * import { useForm } from 'react-hook-form';
- *
- * function LoginForm() {
- *   const { control, formState: { errors } } = useForm({
- *     defaultValues: { email: '' }
- *   });
- *
- *   return (
- *     <FormInputTextField
- *       name="email"
- *       label="Email Address"
- *       control={control}
- *       errors={errors}
- *       placeholder="Enter your email"
- *       required
- *       type="email"
- *     />
- *   );
- * }
- * ```
- *
- * @example
- * ```typescript
- * // With validation
- * <FormInputTextField
- *   name="username"
- *   label="Username"
- *   control={control}
- *   errors={errors}
- *   defaultValue=""
- *   onChange={(value) => console.log('Changed:', value)}
- *   disabled={false}
- *   fullWidth
- *   size="medium"
- * />
- * ```
- *
- * @props {IFormInputFields} props - Component props
- * @props {string} props.name - Field name for form identification (required)
- * @props {string} [props.label] - Label text for the field
- * @props {Control} props.control - React Hook Form control object (required)
- * @props {FieldErrors} props.errors - React Hook Form errors object (required)
- * @props {string} [props.defaultValue=""] - Default value for the field
- * @props {string} [props.placeholder] - Placeholder text
- * @props {"small"|"medium"} [props.size] - Field size
- * @props {boolean} [props.disabled] - Whether the field is disabled
- * @props {boolean} [props.required] - Whether the field is required
- * @props {boolean} [props.fullWidth] - Full width of the field
- * @props {function} [props.onChange] - Callback fired when value changes: (value: any) => void
- */
-declare const FormInputTextField: ComponentType<any>;
-
-/**
- * @component FormInputTextArea
- * @description React Hook Form integrated textarea field component.
- * Supports multiline text input with customizable rows and resize options.
- *
- * @example
- * ```typescript
- * import { FormInputTextArea } from '@react-solutions/input';
- *
- * <FormInputTextArea
- *   name="description"
- *   label="Description"
- *   control={control}
- *   errors={errors}
- *   placeholder="Enter description"
- *   rows={4}
- *   minRows={3}
- *   maxRows={10}
- *   resize="vertical"
- * />
- * ```
- *
- * @props {IFormInputTextAreaFields} props - Component props
- * @props {string} props.name - Field name (required)
- * @props {Control} props.control - React Hook Form control (required)
- * @props {FieldErrors} props.errors - React Hook Form errors (required)
- * @props {number} [props.rows] - Number of rows
- * @props {number} [props.minRows] - Minimum number of rows
- * @props {number} [props.maxRows] - Maximum number of rows
- * @props {"none"|"both"|"horizontal"|"vertical"} [props.resize] - Resize option
- */
-declare const FormInputTextArea: ComponentType<any>;
-
-/**
- * @component FormInputPasswordField
- * @description React Hook Form integrated password input field with secure text masking.
- *
- * @example
- * ```typescript
- * <FormInputPasswordField
- *   name="password"
- *   label="Password"
- *   control={control}
- *   errors={errors}
- *   placeholder="Enter password"
- *   required
- *   autoComplete="current-password"
- * />
- * ```
- */
-declare const FormInputPasswordField: ComponentType<any>;
-
-/**
- * @component FormInputNumberField
- * @description React Hook Form integrated number input field with validation.
- * Supports min/max values, decimal places, and custom patterns.
- *
- * @example
- * ```typescript
- * <FormInputNumberField
- *   name="age"
- *   label="Age"
- *   control={control}
- *   errors={errors}
- *   min={0}
- *   max={120}
- *   step={1}
- *   allowDecimals={false}
- * />
- * ```
- *
- * @props {IFormInputNumberFields} props - Component props
- * @props {number} [props.min] - Minimum value
- * @props {number} [props.max] - Maximum value
- * @props {number} [props.step] - Step value
- * @props {boolean} [props.allowDecimals] - Allow decimal numbers
- * @props {number} [props.decimalPlaces] - Number of decimal places
- */
-declare const FormInputNumberField: ComponentType<any>;
-
-/**
- * @component FormInputTelField
- * @description React Hook Form integrated telephone number input field.
- *
- * @example
- * ```typescript
- * <FormInputTelField
- *   name="phone"
- *   label="Phone Number"
- *   control={control}
- *   errors={errors}
- *   placeholder="+1 (555) 123-4567"
- * />
- * ```
- */
-declare const FormInputTelField: ComponentType<any>;
-
-/**
- * @component FormInputSearchField
- * @description React Hook Form integrated search input field.
- *
- * @example
- * ```typescript
- * <FormInputSearchField
- *   name="search"
- *   label="Search"
- *   control={control}
- *   errors={errors}
- *   placeholder="Search..."
- *   onEnterPress={(value) => handleSearch(value)}
- * />
- * ```
- */
-declare const FormInputSearchField: ComponentType<any>;
-
-/**
- * @component FormInputOTPField
- * @description React Hook Form integrated OTP (One-Time Password) input field.
- *
- * @example
- * ```typescript
- * <FormInputOTPField
- *   name="otp"
- *   label="Enter OTP"
- *   control={control}
- *   errors={errors}
- *   length={6}
- * />
- * ```
- */
-declare const FormInputOTPField: ComponentType<any>;
-
-// ============================================================================
-// HOOK FORM FIELDS - Dropdown Inputs
-// ============================================================================
-
-/**
- * @component FormInputSelect
- * @description React Hook Form integrated select dropdown field.
- * Supports single and multiple selection with custom options.
- *
- * @example
- * ```typescript
- * const options = [
- *   { name: 'Option 1', value: '1' },
- *   { name: 'Option 2', value: '2' },
- *   { name: 'Option 3', value: '3' }
- * ];
- *
- * <FormInputSelect
- *   name="category"
- *   label="Category"
- *   control={control}
- *   errors={errors}
- *   options={options}
- *   defaultValue=""
- * />
- * ```
- *
- * @example
- * ```typescript
- * // Multiple selection
- * <FormInputSelect
- *   name="tags"
- *   label="Tags"
- *   control={control}
- *   errors={errors}
- *   options={options}
- *   multiple
- *   limitTags={3}
- * />
- * ```
- *
- * @props {IFormInputFieldsWithOptions} props - Component props
- * @props {Option[]} [props.options=[]] - Options array for dropdown
- * @props {number} [props.limitTags] - Limit number of tags displayed (for multi-select)
- * @props {boolean} [props.multiple] - Allow multiple selections
- */
-declare const FormInputSelect: ComponentType<any>;
-
-/**
- * @component FormInputMultiSelect
- * @description React Hook Form integrated multi-select dropdown field.
- *
- * @example
- * ```typescript
- * <FormInputMultiSelect
- *   name="skills"
- *   label="Skills"
- *   control={control}
- *   errors={errors}
- *   options={skillOptions}
- *   limitTags={5}
- *   filterSelectedOptions
- * />
- * ```
- */
-declare const FormInputMultiSelect: ComponentType<any>;
-
-/**
- * @component FormInputAutoComplete
- * @description React Hook Form integrated autocomplete field with search functionality.
- *
- * @example
- * ```typescript
- * const countries = [
- *   { name: 'United States', value: 'US' },
- *   { name: 'Canada', value: 'CA' },
- *   { name: 'Mexico', value: 'MX' }
- * ];
- *
- * <FormInputAutoComplete
- *   name="country"
- *   label="Country"
- *   control={control}
- *   errors={errors}
- *   options={countries}
- *   placeholder="Select or type country"
- * />
- * ```
- *
- * @props {IFormInputFieldsWithOptions} props - Component props
- * @props {Option[]} [props.options=[]] - Options array
- * @props {function} [props.getOptionLabel] - Custom function to get option label
- * @props {function} [props.renderOption] - Custom render function for options
- */
-declare const FormInputAutoComplete: ComponentType<any>;
-
-/**
- * @component FormInputMultiAutoComplete
- * @description React Hook Form integrated multi-select autocomplete field.
- *
- * @example
- * ```typescript
- * <FormInputMultiAutoComplete
- *   name="ingredients"
- *   label="Ingredients"
- *   control={control}
- *   errors={errors}
- *   options={ingredientOptions}
- *   limitTags={3}
- *   disableCheckBox={false}
- * />
- * ```
- */
-declare const FormInputMultiAutoComplete: ComponentType<any>;
-
-/**
- * @component FormInputColorPicker
- * @description React Hook Form integrated color picker field.
- *
- * @example
- * ```typescript
- * <FormInputColorPicker
- *   name="themeColor"
- *   label="Theme Color"
- *   control={control}
- *   errors={errors}
- *   defaultValue="#000000"
- * />
- * ```
- */
-declare const FormInputColorPicker: ComponentType<any>;
-
-/**
- * @component FormInputFileUpload
- * @description React Hook Form integrated file upload field.
- *
- * @example
- * ```typescript
- * <FormInputFileUpload
- *   name="avatar"
- *   label="Upload Avatar"
- *   control={control}
- *   errors={errors}
- *   accept="image/*"
- *   multiple={false}
- * />
- * ```
- */
-declare const FormInputFileUpload: ComponentType<any>;
-
-// ============================================================================
-// HOOK FORM FIELDS - Date/Time Inputs
-// ============================================================================
-
-/**
- * @component FormInputDatePicker
- * @description React Hook Form integrated date picker field.
- * Uses MUI X Date Pickers with date-fns adapter.
- *
- * @example
- * ```typescript
- * import { useForm } from 'react-hook-form';
- *
- * <FormInputDatePicker
- *   name="birthDate"
- *   label="Birth Date"
- *   control={control}
- *   errors={errors}
- *   minDate={new Date('1900-01-01')}
- *   maxDate={new Date()}
- *   disablePast
- * />
- * ```
- *
- * @example
- * ```typescript
- * // With custom date validation
- * <FormInputDatePicker
- *   name="appointmentDate"
- *   label="Appointment Date"
- *   control={control}
- *   errors={errors}
- *   shouldDisableDate={(date) => {
- *     // Disable weekends
- *     return date.getDay() === 0 || date.getDay() === 6;
- *   }}
- * />
- * ```
- *
- * @props {IFormInputDateFields} props - Component props
- * @props {Date|null} [props.defaultValue=null] - Default date value
- * @props {Date} [props.minDate] - Minimum selectable date
- * @props {Date} [props.maxDate] - Maximum selectable date
- * @props {boolean} [props.readOnly] - Whether the field is read-only
- * @props {boolean} [props.disablePast] - Whether to disable past dates
- * @props {function} [props.shouldDisableDate] - Custom function to disable specific dates: (date: Date) => boolean
- */
-declare const FormInputDatePicker: ComponentType<any>;
-
-/**
- * @component FormInputTimePicker
- * @description React Hook Form integrated time picker field.
- *
- * @example
- * ```typescript
- * <FormInputTimePicker
- *   name="appointmentTime"
- *   label="Appointment Time"
- *   control={control}
- *   errors={errors}
- *   ampm={true}
- *   views={['hours', 'minutes']}
- * />
- * ```
- *
- * @props {IFormInputDateFields} props - Component props
- * @props {boolean} [props.ampm] - Whether to use 12-hour format (AM/PM)
- * @props {TimeView[]} [props.views] - Views to show in picker
- */
-declare const FormInputTimePicker: ComponentType<any>;
-
-/**
- * @component FormInputTimeClock
- * @description React Hook Form integrated time clock field.
- *
- * @example
- * ```typescript
- * <FormInputTimeClock
- *   name="alarmTime"
- *   label="Alarm Time"
- *   control={control}
- *   errors={errors}
- *   ampm={true}
- *   ampmInClock={true}
- * />
- * ```
- */
-declare const FormInputTimeClock: ComponentType<any>;
-
-/**
- * @component FormInputCalendar
- * @description React Hook Form integrated calendar field.
- *
- * @example
- * ```typescript
- * <FormInputCalendar
- *   name="selectedDate"
- *   label="Select Date"
- *   control={control}
- *   errors={errors}
- *   defaultValue={new Date()}
- * />
- * ```
- */
-declare const FormInputCalendar: ComponentType<any>;
-
-// ============================================================================
-// HOOK FORM FIELDS - Box Inputs
-// ============================================================================
-
-/**
- * @component FormInputCheckBox
- * @description React Hook Form integrated single checkbox field.
- *
- * @example
- * ```typescript
- * <FormInputCheckBox
- *   name="agreeToTerms"
- *   label="I agree to the terms and conditions"
- *   control={control}
- *   errors={errors}
- *   defaultValue={false}
- *   color="primary"
- *   labelPlacement="end"
- * />
- * ```
- *
- * @props {IFormInputFields} props - Component props
- * @props {boolean} [props.defaultValue=false] - Default checked state
- */
-declare const FormInputCheckBox: ComponentType<any>;
-
-/**
- * @component FormInputCheckBoxGroup
- * @description React Hook Form integrated checkbox group field.
- * Supports multiple selections from a list of options.
- *
- * @example
- * ```typescript
- * const interests = [
- *   { name: 'Sports', value: 'sports' },
- *   { name: 'Music', value: 'music' },
- *   { name: 'Reading', value: 'reading' }
- * ];
- *
- * <FormInputCheckBoxGroup
- *   name="interests"
- *   label="Interests"
- *   control={control}
- *   errors={errors}
- *   options={interests}
- *   row={true}
- *   color="primary"
- * />
- * ```
- *
- * @props {IFormInputCheckBoxGroupFields} props - Component props
- * @props {Option[]} [props.options=[]] - Options array
- * @props {boolean} [props.row] - Whether to display checkboxes in a row
- * @props {"default"|"primary"|"secondary"|"error"|"info"|"success"|"warning"} [props.color] - Checkbox color
- */
-declare const FormInputCheckBoxGroup: ComponentType<any>;
-
-/**
- * @component FormInputSwitch
- * @description React Hook Form integrated switch/toggle field.
- *
- * @example
- * ```typescript
- * <FormInputSwitch
- *   name="notifications"
- *   label="Enable Notifications"
- *   control={control}
- *   errors={errors}
- *   defaultValue={false}
- *   color="primary"
- * />
- * ```
- */
-declare const FormInputSwitch: ComponentType<any>;
-
-/**
- * @component FormInputSlider
- * @description React Hook Form integrated slider/range field.
- *
- * @example
- * ```typescript
- * <FormInputSlider
- *   name="volume"
- *   label="Volume"
- *   control={control}
- *   errors={errors}
- *   defaultValue={50}
- *   min={0}
- *   max={100}
- *   step={1}
- *   marks
- * />
- * ```
- */
-declare const FormInputSlider: ComponentType<any>;
-
-/**
- * @component FormInputSingleRadio
- * @description React Hook Form integrated single radio button field.
- *
- * @example
- * ```typescript
- * <FormInputSingleRadio
- *   name="gender"
- *   label="Male"
- *   control={control}
- *   errors={errors}
- *   value="male"
- *   checked={watch('gender') === 'male'}
- * />
- * ```
- */
-declare const FormInputSingleRadio: ComponentType<any>;
-
-/**
- * @component FormInputRadioButtonGroup
- * @description React Hook Form integrated radio button group field.
- * Supports single selection from a list of options.
- *
- * @example
- * ```typescript
- * const genderOptions = [
- *   { name: 'Male', value: 'male' },
- *   { name: 'Female', value: 'female' },
- *   { name: 'Other', value: 'other' }
- * ];
- *
- * <FormInputRadioButtonGroup
- *   name="gender"
- *   label="Gender"
- *   control={control}
- *   errors={errors}
- *   options={genderOptions}
- *   row={true}
- *   color="primary"
- * />
- * ```
- *
- * @props {IFormInputFieldsWithOptions} props - Component props
- * @props {Option[]} [props.options=[]] - Options array
- * @props {boolean} [props.row] - Whether to display radio buttons in a row
- */
-declare const FormInputRadioButtonGroup: ComponentType<any>;
-
-// ============================================================================
-// FORM FIELDS - Text Inputs (Standalone)
-// ============================================================================
-
-/**
- * @component TextInputField
- * @description Standalone text input field component without React Hook Form integration.
- * Use this when you need direct control over the input value and onChange handler.
- *
- * @example
- * ```typescript
- * import { TextInputField } from '@react-solutions/input';
- * import { useState } from 'react';
- *
- * function MyComponent() {
- *   const [value, setValue] = useState('');
- *
- *   return (
- *     <TextInputField
- *       name="username"
- *       label="Username"
- *       value={value}
- *       onChange={(e) => setValue(e.target.value)}
- *       placeholder="Enter username"
- *       required
- *       fullWidth
- *     />
- *   );
- * }
- * ```
- *
- * @example
- * ```typescript
- * // Multiline textarea
- * <TextInputField
- *   name="description"
- *   label="Description"
- *   value={description}
- *   onChange={(e) => setDescription(e.target.value)}
- *   multiline
- *   rows={4}
- *   minRows={3}
- *   maxRows={10}
- *   resize="vertical"
- * />
- * ```
- *
- * @props {ITextInputFieldProps} props - Component props
- * @props {string} props.value - Current text value (required)
- * @props {function} props.onChange - Callback fired when value changes: (event: ChangeEvent) => void (required)
- * @props {string} [props.name] - Field name
- * @props {string} [props.label] - Label text
- * @props {FieldError} [props.error] - Error object with optional message
- * @props {string} [props.helperText] - Helper text to display below field
- * @props {boolean} [props.disabled=false] - Whether the field is disabled
- * @props {string} [props.placeholder] - Placeholder text
- * @props {"outlined"|"filled"|"standard"} [props.variant="outlined"] - TextField variant
- * @props {"small"|"medium"} [props.size] - TextField size
- * @props {boolean} [props.fullWidth=true] - Full width of the field
- * @props {boolean} [props.multiline=false] - Whether to enable multiline input (textarea)
- * @props {number} [props.rows] - Number of rows for multiline input
- * @props {number} [props.minRows] - Minimum number of rows
- * @props {number} [props.maxRows] - Maximum number of rows
- * @props {"none"|"both"|"horizontal"|"vertical"} [props.resize="both"] - Resize option for textarea
- * @props {number} [props.maxLength] - Maximum length of input
- * @props {string} [props.type="text"] - Input type (text, email, number, tel, url, etc.)
- * @props {React.ReactNode} [props.startAdornment] - Start adornment (icon or element before input)
- * @props {React.ReactNode} [props.endAdornment] - End adornment (icon or element after input)
- * @props {function} [props.onEnterPress] - Callback fired on Enter key press: (value: string) => void
- */
-declare const TextInputField: ComponentType<any>;
-
-/**
- * @component PasswordField
- * @description Standalone password input field with secure text masking.
- *
- * @example
- * ```typescript
- * <PasswordField
- *   name="password"
- *   label="Password"
- *   value={password}
- *   onChange={(e) => setPassword(e.target.value)}
- *   placeholder="Enter password"
- *   showPasswordToggle
- * />
- * ```
- */
-declare const PasswordField: ComponentType<any>;
-
-/**
- * @component NumberField
- * @description Standalone number input field with validation.
- *
- * @example
- * ```typescript
- * <NumberField
- *   name="age"
- *   label="Age"
- *   value={age}
- *   onChange={(e) => setAge(e.target.value)}
- *   min={0}
- *   max={120}
- *   step={1}
- * />
- * ```
- */
-declare const NumberField: ComponentType<any>;
-
-/**
- * @component TelInputField
- * @description Standalone telephone number input field.
- *
- * @example
- * ```typescript
- * <TelInputField
- *   name="phone"
- *   label="Phone Number"
- *   value={phone}
- *   onChange={(e) => setPhone(e.target.value)}
- *   placeholder="+1 (555) 123-4567"
- * />
- * ```
- */
-declare const TelInputField: ComponentType<any>;
-
-/**
- * @component SearchInputField
- * @description Standalone search input field.
- *
- * @example
- * ```typescript
- * <SearchInputField
- *   name="search"
- *   label="Search"
- *   value={searchTerm}
- *   onChange={(e) => setSearchTerm(e.target.value)}
- *   onEnterPress={(value) => handleSearch(value)}
- * />
- * ```
- */
-declare const SearchInputField: ComponentType<any>;
-
-/**
- * @component OTPField
- * @description Standalone OTP (One-Time Password) input field.
- *
- * @example
- * ```typescript
- * <OTPField
- *   name="otp"
- *   label="Enter OTP"
- *   value={otp}
- *   onChange={setOtp}
- *   length={6}
- * />
- * ```
- */
-declare const OTPField: ComponentType<any>;
-
-// ============================================================================
-// FORM FIELDS - Dropdown Inputs (Standalone)
-// ============================================================================
-
-/**
- * @component SelectInputField
- * @description Standalone select dropdown field without React Hook Form integration.
- *
- * @example
- * ```typescript
- * const options = [
- *   { name: 'Option 1', value: '1' },
- *   { name: 'Option 2', value: '2' }
- * ];
- *
- * <SelectInputField
- *   name="category"
- *   label="Category"
- *   value={selectedValue}
- *   onChange={(e) => setSelectedValue(e.target.value)}
- *   options={options}
- *   fullWidth
- * />
- * ```
- *
- * @props {ISelectInputFieldProps} props - Component props
- * @props {string|number|(string|number)[]|""} props.value - Current selected value(s) (required)
- * @props {function} props.onChange - Callback fired when value changes: (event: SelectChangeEvent) => void (required)
- * @props {SelectOption[]} props.options - Options array to display in dropdown (required)
- * @props {boolean} [props.multiple] - Whether to allow multiple selections
- * @props {function} [props.renderValue] - Custom render function for selected value(s)
- * @props {function} [props.renderMenuItem] - Custom render function for menu items
- */
-declare const SelectInputField: ComponentType<any>;
-
-/**
- * @component AutoCompleteField
- * @description Standalone autocomplete field with search functionality.
- *
- * @example
- * ```typescript
- * const countries = [
- *   { name: 'United States', value: 'US' },
- *   { name: 'Canada', value: 'CA' }
- * ];
- *
- * <AutoCompleteField
- *   name="country"
- *   label="Country"
- *   value={selectedCountry}
- *   onChange={(_, newValue) => setSelectedCountry(newValue)}
- *   options={countries}
- *   placeholder="Select or type country"
- * />
- * ```
- */
-declare const AutoCompleteField: ComponentType<any>;
-
-/**
- * @component ColorPickerField
- * @description Standalone color picker field.
- *
- * @example
- * ```typescript
- * <ColorPickerField
- *   name="themeColor"
- *   label="Theme Color"
- *   value={color}
- *   onChange={setColor}
- *   defaultValue="#000000"
- * />
- * ```
- */
-declare const ColorPickerField: ComponentType<any>;
-
-/**
- * @component FileUploadField
- * @description Standalone file upload field.
- *
- * @example
- * ```typescript
- * <FileUploadField
- *   name="avatar"
- *   label="Upload Avatar"
- *   value={file}
- *   onChange={setFile}
- *   accept="image/*"
- *   multiple={false}
- * />
- * ```
- */
-declare const FileUploadField: ComponentType<any>;
-
-// ============================================================================
-// FORM FIELDS - Date/Time Inputs (Standalone)
-// ============================================================================
-
-/**
- * @component DatePickerField
- * @description Standalone date picker field without React Hook Form integration.
- * Uses MUI X Date Pickers with date-fns adapter.
- *
- * @example
- * ```typescript
- * <DatePickerField
- *   name="birthDate"
- *   label="Birth Date"
- *   value={date}
- *   onChange={setDate}
- *   minDate={new Date('1900-01-01')}
- *   maxDate={new Date()}
- *   disablePast
- * />
- * ```
- *
- * @props {IDatePickerFieldProps} props - Component props
- * @props {Date|null} props.value - Current selected date value (required)
- * @props {function} props.onChange - Callback fired when date changes: (newValue: Date | null) => void (required)
- * @props {Date} [props.minDate] - Minimum selectable date
- * @props {Date} [props.maxDate] - Maximum selectable date
- * @props {boolean} [props.disablePast] - Whether to disable past dates
- * @props {function} [props.shouldDisableDate] - Custom function to disable specific dates: (date: Date) => boolean
- */
-declare const DatePickerField: ComponentType<any>;
-
-/**
- * @component TimePickerField
- * @description Standalone time picker field.
- *
- * @example
- * ```typescript
- * <TimePickerField
- *   name="appointmentTime"
- *   label="Appointment Time"
- *   value={time}
- *   onChange={setTime}
- *   ampm={true}
- *   views={['hours', 'minutes']}
- * />
- * ```
- */
-declare const TimePickerField: ComponentType<any>;
-
-/**
- * @component TimeClockField
- * @description Standalone time clock field.
- *
- * @example
- * ```typescript
- * <TimeClockField
- *   name="alarmTime"
- *   label="Alarm Time"
- *   value={time}
- *   onChange={setTime}
- *   ampm={true}
- *   ampmInClock={true}
- * />
- * ```
- */
-declare const TimeClockField: ComponentType<any>;
-
-/**
- * @component DateCalendarField
- * @description Standalone calendar field.
- *
- * @example
- * ```typescript
- * <DateCalendarField
- *   name="selectedDate"
- *   label="Select Date"
- *   value={date}
- *   onChange={setDate}
- *   defaultValue={new Date()}
- * />
- * ```
- */
-declare const DateCalendarField: ComponentType<any>;
-
-// ============================================================================
-// FORM FIELDS - Box Inputs (Standalone)
-// ============================================================================
-
-/**
- * @component CheckBoxField
- * @description Standalone single checkbox field without React Hook Form integration.
- *
- * @example
- * ```typescript
- * <CheckBoxField
- *   name="agreeToTerms"
- *   label="I agree to the terms and conditions"
- *   value={checked}
- *   onChange={setChecked}
- *   color="primary"
- *   labelPlacement="end"
- * />
- * ```
- *
- * @props {ICheckboxFieldProps} props - Component props
- * @props {boolean} props.value - Current checked state (required)
- * @props {function} props.onChange - Callback fired when checked state changes: (checked: boolean) => void (required)
- * @props {React.ReactNode} [props.label] - Label text or element
- * @props {"default"|"primary"|"secondary"|"error"|"info"|"success"|"warning"} [props.color] - Checkbox color
- * @props {"end"|"start"|"top"|"bottom"} [props.labelPlacement] - Label placement
- */
-declare const CheckBoxField: ComponentType<any>;
-
-/**
- * @component CheckBoxFieldGroup
- * @description Standalone checkbox group field.
- * Supports multiple selections from a list of options.
- *
- * @example
- * ```typescript
- * const interests = [
- *   { name: 'Sports', value: 'sports' },
- *   { name: 'Music', value: 'music' }
- * ];
- *
- * <CheckBoxFieldGroup
- *   name="interests"
- *   label="Interests"
- *   value={selectedInterests}
- *   onChange={setSelectedInterests}
- *   options={interests}
- *   row={true}
- *   color="primary"
- * />
- * ```
- */
-declare const CheckBoxFieldGroup: ComponentType<any>;
-
-/**
- * @component RadioButtonField
- * @description Standalone single radio button field.
- *
- * @example
- * ```typescript
- * <RadioButtonField
- *   name="gender"
- *   label="Male"
- *   value={selectedGender === 'male'}
- *   onChange={() => setSelectedGender('male')}
- *   color="primary"
- * />
- * ```
- */
-declare const RadioButtonField: ComponentType<any>;
-
-/**
- * @component RadioButtonFieldGroup
- * @description Standalone radio button group field.
- * Supports single selection from a list of options.
- *
- * @example
- * ```typescript
- * const genderOptions = [
- *   { name: 'Male', value: 'male' },
- *   { name: 'Female', value: 'female' }
- * ];
- *
- * <RadioButtonFieldGroup
- *   name="gender"
- *   label="Gender"
- *   value={selectedGender}
- *   onChange={setSelectedGender}
- *   options={genderOptions}
- *   row={true}
- *   color="primary"
- * />
- * ```
- */
-declare const RadioButtonFieldGroup: ComponentType<any>;
-
-/**
- * @component SwitchField
- * @description Standalone switch/toggle field.
- *
- * @example
- * ```typescript
- * <SwitchField
- *   name="notifications"
- *   label="Enable Notifications"
- *   value={enabled}
- *   onChange={setEnabled}
- *   color="primary"
- * />
- * ```
- */
-declare const SwitchField: ComponentType<any>;
-
-/**
- * @component SliderField
- * @description Standalone slider/range field.
- *
- * @example
- * ```typescript
- * <SliderField
- *   name="volume"
- *   label="Volume"
- *   value={volume}
- *   onChange={setVolume}
- *   min={0}
- *   max={100}
- *   step={1}
- *   marks
- * />
- * ```
- */
-declare const SliderField: ComponentType<any>;
-
-// ============================================================================
-// TYPES
-// ============================================================================
-
-/**
- * @typedef {Object} Option
- * @description Base option type for dropdown fields
- * @property {string} name - Display name of the option
- * @property {string|number} value - Value of the option
- * @property {boolean} [disabled] - Whether the option is disabled
- * @property {*} [key] - Additional properties
- */
-type Option = {
-	name: string;
-	value: number | string;
-	disabled?: boolean;
-	[key: string]: unknown;
-};
-
-/**
- * @typedef {Object} IFormInputFields
- * @description Base interface for all HookForm field components
- * @property {string} name - Field name for form identification (required)
- * @property {string} [label] - Label text for the field
- * @property {Control} control - React Hook Form control object (required)
- * @property {FieldErrors} errors - React Hook Form errors object (required)
- * @property {*} [defaultValue] - Default value for the field
- * @property {string} [placeholder] - Placeholder text
- * @property {"small"|"medium"} [size] - Field size
- * @property {boolean} [disabled] - Whether the field is disabled
- * @property {boolean} [required] - Whether the field is required
- * @property {boolean} [fullWidth] - Full width of the field
- * @property {SxProps} [inputStyles] - Custom styles for input
- * @property {SxProps} [sx] - Custom styles
- * @property {*} [slotProps] - Custom slot props for MUI v7
- * @property {*} [slots] - Custom slots for MUI v7
- * @property {function} [onChange] - Callback fired when the value changes: (value: any) => void
- */
-interface IFormInputFields<TFieldValues extends FieldValues = FieldValues> {
-	name: string;
-	label?: string;
-	control: Control<TFieldValues>;
-	errors: FieldErrors<TFieldValues>;
-	defaultValue?: any;
-	placeholder?: string;
-	size?: "small" | "medium";
-	disabled?: boolean;
-	required?: boolean;
-	fullWidth?: boolean;
-	inputStyles?: any;
-	sx?: any;
-	slotProps?: any;
-	slots?: any;
-	onChange?: (value: any) => void;
-	[key: string]: any;
-}
-
-/**
- * @typedef {Object} IFormInputFieldsWithOptions
- * @description Interface for fields with options (Select, AutoComplete, etc.)
- * @extends {IFormInputFields}
- * @property {Option[]} [options] - Options array for dropdown fields
- * @property {number} [limitTags] - Limit number of tags displayed (for multi-select)
- * @property {function} [renderOption] - Custom render function for options
- * @property {function} [getOptionLabel] - Custom function to get option label
- * @property {boolean} [isRenderSingle] - Whether to render single option
- * @property {function} [renderOptionValue] - Custom render function for option value
- * @property {boolean} [disableCheckBox] - Whether to disable checkbox in multi-select
- * @property {boolean} [filterSelectedOptions] - Whether to filter selected options
- */
-interface IFormInputFieldsWithOptions<TFieldValues extends FieldValues = FieldValues>
-	extends IFormInputFields<TFieldValues> {
-	options?: Option[];
-	limitTags?: number;
-	renderOption?: any;
-	getOptionLabel?: any;
-	isRenderSingle?: boolean;
-	renderOptionValue?: any;
-	disableCheckBox?: boolean;
-	filterSelectedOptions?: boolean;
-}
-
-/**
- * @typedef {Object} IFormInputDateFields
- * @description Interface for date/time picker fields
- * @extends {IFormInputFields}
- * @property {Date|null} [defaultValue] - Default date value
- * @property {Date} [minDate] - Minimum selectable date
- * @property {Date} [maxDate] - Maximum selectable date
- * @property {boolean} [readOnly] - Whether the field is read-only
- * @property {*} [timezone] - Timezone setting
- * @property {boolean} [ampm] - Whether to use 12-hour format (AM/PM)
- * @property {TimeView[]} [views] - Views to show in picker
- * @property {boolean} [ampmInClock] - Whether to show AM/PM in clock
- * @property {boolean} [disablePast] - Whether to disable past dates
- * @property {function} [shouldDisableDate] - Custom function to disable specific dates: (date: Date) => boolean
- */
-interface IFormInputDateFields<TFieldValues extends FieldValues = FieldValues>
-	extends IFormInputFields<TFieldValues> {
-	defaultValue?: Date | null;
-	minDate?: Date;
-	maxDate?: Date;
-	readOnly?: boolean;
-	timezone?: any;
-	ampm?: boolean;
-	views?: any[];
-	ampmInClock?: boolean;
-	disablePast?: boolean;
-	shouldDisableDate?: (date: Date) => boolean;
-}
-
-/**
- * @typedef {Object} IFormInputNumberFields
- * @description Interface for number input fields
- * @extends {IFormInputFields}
- * @property {string} [pattern] - Number pattern type or custom pattern string
- * @property {number} [min] - Minimum value
- * @property {number} [max] - Maximum value
- * @property {number} [step] - Step value
- * @property {boolean} [allowDecimals] - Allow decimal numbers
- * @property {number} [decimalPlaces] - Number of decimal places
- */
-interface IFormInputNumberFields<TFieldValues extends FieldValues = FieldValues>
-	extends IFormInputFields<TFieldValues> {
-	pattern?: string;
-	min?: number;
-	max?: number;
-	step?: number;
-	allowDecimals?: boolean;
-	decimalPlaces?: number;
-}
-
-/**
- * @typedef {Object} IFormInputTextAreaFields
- * @description Interface for text area fields
- * @extends {IFormInputFields}
- * @property {number} [rows] - Number of rows
- * @property {number} [minRows] - Minimum number of rows
- * @property {number} [maxRows] - Maximum number of rows
- * @property {"none"|"both"|"horizontal"|"vertical"} [resize] - Resize option
- */
-interface IFormInputTextAreaFields<TFieldValues extends FieldValues = FieldValues>
-	extends IFormInputFields<TFieldValues> {
-	rows?: number;
-	minRows?: number;
-	maxRows?: number;
-	resize?: "none" | "both" | "horizontal" | "vertical";
-}
-
-/**
- * @typedef {Object} IFormInputRadioFields
- * @description Interface for radio button fields (single)
- * @extends {IFormInputFields}
- * @property {boolean} [checked] - Current checked state
- * @property {"default"|"primary"|"secondary"|"error"|"info"|"success"|"warning"} [color] - Radio color
- * @property {"end"|"start"|"top"|"bottom"} [labelPlacement] - Label placement
- */
-interface IFormInputRadioFields<TFieldValues extends FieldValues = FieldValues>
-	extends IFormInputFields<TFieldValues> {
-	checked?: boolean;
-	color?: "default" | "primary" | "secondary" | "error" | "info" | "success" | "warning";
-	labelPlacement?: "end" | "start" | "top" | "bottom";
-}
-
-/**
- * @typedef {Object} IFormInputCheckBoxGroupFields
- * @description Interface for checkbox group fields
- * @extends {IFormInputFieldsWithOptions}
- * @property {boolean} [row] - Whether to display checkboxes in a row
- * @property {"default"|"primary"|"secondary"|"error"|"info"|"success"|"warning"} [color] - Checkbox color
- * @property {"end"|"start"|"top"|"bottom"} [labelPlacement] - Label placement
- */
-interface IFormInputCheckBoxGroupFields<TFieldValues extends FieldValues = FieldValues>
-	extends IFormInputFieldsWithOptions<TFieldValues> {
-	row?: boolean;
-	color?: "default" | "primary" | "secondary" | "error" | "info" | "success" | "warning";
-	labelPlacement?: "end" | "start" | "top" | "bottom";
-}
-
-// Default export
-declare const _default: {
-	// HookFormFields
-	FormInputTextField: ComponentType<any>;
-	FormInputTextArea: ComponentType<any>;
-	FormInputPasswordField: ComponentType<any>;
-	FormInputNumberField: ComponentType<any>;
-	FormInputTelField: ComponentType<any>;
-	FormInputSearchField: ComponentType<any>;
-	FormInputOTPField: ComponentType<any>;
-	FormInputSelect: ComponentType<any>;
-	FormInputMultiSelect: ComponentType<any>;
-	FormInputAutoComplete: ComponentType<any>;
-	FormInputMultiAutoComplete: ComponentType<any>;
-	FormInputColorPicker: ComponentType<any>;
-	FormInputFileUpload: ComponentType<any>;
-	FormInputDatePicker: ComponentType<any>;
-	FormInputTimePicker: ComponentType<any>;
-	FormInputTimeClock: ComponentType<any>;
-	FormInputCalendar: ComponentType<any>;
-	FormInputCheckBox: ComponentType<any>;
-	FormInputCheckBoxGroup: ComponentType<any>;
-	FormInputSwitch: ComponentType<any>;
-	FormInputSlider: ComponentType<any>;
-	FormInputSingleRadio: ComponentType<any>;
-	FormInputRadioButtonGroup: ComponentType<any>;
-	// FormFields
-	TextInputField: ComponentType<any>;
-	PasswordField: ComponentType<any>;
-	NumberField: ComponentType<any>;
-	TelInputField: ComponentType<any>;
-	SearchInputField: ComponentType<any>;
-	OTPField: ComponentType<any>;
-	SelectInputField: ComponentType<any>;
-	AutoCompleteField: ComponentType<any>;
-	ColorPickerField: ComponentType<any>;
-	FileUploadField: ComponentType<any>;
-	DatePickerField: ComponentType<any>;
-	TimePickerField: ComponentType<any>;
-	TimeClockField: ComponentType<any>;
-	DateCalendarField: ComponentType<any>;
-	CheckBoxField: ComponentType<any>;
-	CheckBoxFieldGroup: ComponentType<any>;
-	RadioButtonField: ComponentType<any>;
-	RadioButtonFieldGroup: ComponentType<any>;
-	SwitchField: ComponentType<any>;
-	SliderField: ComponentType<any>;
+/**
+ * Error object type
+ */
+type FieldError$j = {
+    message?: string;
+} | null;
+/**
+ * Extended Slider Field Props
+ * Extends MUI SliderProps with custom form field props
+ */
+interface ISliderFieldProps extends Omit<SliderProps, "value" | "onChange" | "onChangeCommitted" | "name" | "orientation"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the slider */
+    label?: React__default.ReactNode;
+    /** Current slider value(s) */
+    value: number | number[];
+    /** Error object with optional message */
+    error?: FieldError$j;
+    /** Helper text to display below slider */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Slider orientation - horizontal or vertical */
+    orientation?: "horizontal" | "vertical";
+    /** Minimum value (default: 0) */
+    min?: number;
+    /** Maximum value (default: 100) */
+    max?: number;
+    /** Step value (default: 1) */
+    step?: number | null;
+    /** Whether to show value label */
+    valueLabelDisplay?: SliderProps["valueLabelDisplay"];
+    /** Custom format for value label */
+    valueLabelFormat?: SliderProps["valueLabelFormat"];
+    /** Slider color */
+    color?: SliderProps["color"];
+    /** Slider size */
+    size?: SliderProps["size"];
+    /** Marks on the slider */
+    marks?: boolean | SliderProps["marks"];
+    /** Track display mode */
+    track?: SliderProps["track"];
+    /** Custom styles for the Slider */
+    sliderStyles?: SliderProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: FormControlProps["sx"];
+    /** Custom styles for FormLabel */
+    formLabelStyles?: FormLabelProps["sx"];
+    /** Callback fired when the value changes (during drag) */
+    onChange?: (value: number | number[]) => void;
+    /** Callback fired when the value change is committed (on mouse up) */
+    onChangeCommitted?: (value: number | number[]) => void;
+    /** Callback fired when slider receives focus */
+    onFocus?: (event: SyntheticEvent) => void;
+    /** Callback fired when slider loses focus */
+    onBlur?: (event: SyntheticEvent) => void;
+    /** Custom slot props for MUI v7 */
+    slotProps?: SliderProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: SliderProps["slots"];
+    /** FormLabel props */
+    formLabelProps?: Omit<FormLabelProps, "children">;
+}
+declare const SliderField: React__default.ForwardRefExoticComponent<Omit<ISliderFieldProps, "ref"> & React__default.RefAttributes<HTMLSpanElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError$i = {
+    message?: string;
+} | null;
+/**
+ * Extended Switch Field Props
+ * Extends MUI SwitchProps with custom form field props
+ */
+interface ISwitchFieldProps extends Omit<SwitchProps, "checked" | "onChange" | "name"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the switch */
+    label?: React__default.ReactNode;
+    /** Current checked state */
+    value: boolean;
+    /** Error object with optional message */
+    error?: FieldError$i;
+    /** Helper text to display below switch */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Switch color */
+    color?: SwitchProps["color"];
+    /** Switch size */
+    size?: SwitchProps["size"];
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Label placement */
+    labelPlacement?: FormControlLabelProps["labelPlacement"];
+    /** Edge placement for the switch */
+    edge?: SwitchProps["edge"];
+    /** Custom icon for checked state */
+    checkedIcon?: React__default.ReactNode;
+    /** Custom icon for unchecked state */
+    icon?: React__default.ReactNode;
+    /** Custom styles for the Switch */
+    switchStyles?: SwitchProps["sx"];
+    /** Custom styles for FormControlLabel */
+    labelStyles?: FormControlLabelProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: FormControlProps["sx"];
+    /** Callback fired when the value changes */
+    onChange?: (checked: boolean) => void;
+    /** Callback fired when switch is clicked */
+    onClick?: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
+    /** Callback fired when switch receives focus */
+    onFocus?: SwitchProps["onFocus"];
+    /** Callback fired when switch loses focus */
+    onBlur?: SwitchProps["onBlur"];
+    /** Custom slot props for MUI v7 */
+    slotProps?: SwitchProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: SwitchProps["slots"];
+    /** FormControlLabel props */
+    formControlLabelProps?: Omit<FormControlLabelProps, "control" | "label" | "checked">;
+}
+declare const SwitchField: React__default.ForwardRefExoticComponent<Omit<ISwitchFieldProps, "ref"> & React__default.RefAttributes<HTMLButtonElement>>;
+
+/**
+ * Base option type for Radio Button Group
+ */
+type RadioOption = {
+    name: string;
+    value: string | number;
+    disabled?: boolean;
+    [key: string]: unknown;
+};
+/**
+ * Error object type
+ */
+type FieldError$h = {
+    message?: string;
+} | null;
+/**
+ * Extended Radio Button Group Props
+ * Extends MUI RadioGroupProps with custom form field props
+ */
+interface IRadioButtonGroupFieldProps extends Omit<RadioGroupProps, "value" | "onChange" | "name" | "children" | "onFocus" | "onBlur" | "onClick"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the radio group */
+    label?: React__default.ReactNode;
+    /** Current selected value */
+    value: string | number | null | undefined;
+    /** Options array to display as radio buttons */
+    options: RadioOption[];
+    /** Error object with optional message */
+    error?: FieldError$h;
+    /** Helper text to display below radio group */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Radio color */
+    color?: RadioProps["color"];
+    /** Radio size */
+    size?: RadioProps["size"];
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Label placement for each radio button */
+    labelPlacement?: FormControlLabelProps["labelPlacement"];
+    /** Row layout (horizontal) or column layout (vertical) */
+    row?: boolean;
+    /** Custom icon for checked state */
+    checkedIcon?: React__default.ReactNode;
+    /** Custom icon for unchecked state */
+    icon?: React__default.ReactNode;
+    /** Custom styles for individual Radio components */
+    radioStyles?: RadioProps["sx"];
+    /** Custom styles for FormControlLabel components */
+    labelStyles?: FormControlLabelProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: FormControlProps["sx"];
+    /** Custom styles for FormLabel */
+    formLabelStyles?: FormLabelProps["sx"];
+    /** Custom styles for RadioGroup */
+    radioGroupStyles?: RadioGroupProps["sx"];
+    /** Custom render function for radio buttons */
+    renderRadio?: (option: RadioOption, index: number) => React__default.ReactNode;
+    /** Callback fired when the value changes */
+    onChange?: (value: string | number) => void;
+    /** Callback fired when a radio button is clicked */
+    onClick?: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
+    /** Callback fired when a radio button receives focus */
+    onFocus?: RadioProps["onFocus"];
+    /** Callback fired when a radio button loses focus */
+    onBlur?: RadioProps["onBlur"];
+    /** Custom slot props for MUI v7 */
+    slotProps?: {
+        radio?: RadioProps["slotProps"];
+        formControlLabel?: FormControlLabelProps["slotProps"];
+    };
+    /** Custom slots for MUI v7 */
+    slots?: {
+        radio?: RadioProps["slots"];
+        formControlLabel?: FormControlLabelProps["slots"];
+    };
+    /** FormLabel props */
+    formLabelProps?: Omit<FormLabelProps, "children">;
+    /** FormControlLabel props */
+    formControlLabelProps?: Omit<FormControlLabelProps, "control" | "label" | "value">;
+}
+declare const RadioButtonFieldGroup: React__default.ForwardRefExoticComponent<Omit<IRadioButtonGroupFieldProps, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError$g = {
+    message?: string;
+} | null;
+/**
+ * Extended Radio Button Field Props
+ * Extends MUI RadioProps with custom form field props
+ */
+interface IRadioButtonFieldProps extends Omit<RadioProps, "checked" | "onChange" | "name"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the radio button */
+    label?: React__default.ReactNode;
+    /** Current checked state */
+    value: boolean;
+    /** Error object with optional message */
+    error?: FieldError$g;
+    /** Helper text to display below radio button */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Radio color */
+    color?: RadioProps["color"];
+    /** Radio size */
+    size?: RadioProps["size"];
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Label placement */
+    labelPlacement?: FormControlLabelProps["labelPlacement"];
+    /** Callback fired when the value changes */
+    onChange?: (checked: boolean) => void;
+    /** Callback fired when radio button is clicked */
+    onClick?: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
+    /** Callback fired when radio button receives focus */
+    onFocus?: RadioProps["onFocus"];
+    /** Callback fired when radio button loses focus */
+    onBlur?: RadioProps["onBlur"];
+    /** Custom icon for checked state */
+    checkedIcon?: React__default.ReactNode;
+    /** Custom icon for unchecked state */
+    icon?: React__default.ReactNode;
+    /** Custom styles for the Radio */
+    radioStyles?: RadioProps["sx"];
+    /** Custom styles for FormControlLabel */
+    labelStyles?: FormControlLabelProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: React__default.ComponentProps<typeof FormControl>["sx"];
+    /** Custom slot props for MUI v7 */
+    slotProps?: RadioProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: RadioProps["slots"];
+    /** FormControlLabel props */
+    formControlLabelProps?: Omit<FormControlLabelProps, "control" | "label" | "value">;
+}
+declare const RadioButtonField: React__default.ForwardRefExoticComponent<Omit<IRadioButtonFieldProps, "ref"> & React__default.RefAttributes<HTMLButtonElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError$f = {
+    message?: string;
+} | null;
+/**
+ * Checkbox option type
+ */
+type CheckboxOption = {
+    value: string | number;
+    label: React__default.ReactNode;
+    disabled?: boolean;
+};
+/**
+ * Extended Checkbox Group Field Props
+ */
+interface ICheckboxFieldGroupProps extends Omit<FormControlProps, "error" | "disabled" | "required" | "fullWidth" | "color" | "size" | "onChange" | "onFocus" | "onBlur" | "onClick"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the checkbox group */
+    label?: React__default.ReactNode;
+    /** Array of selected values */
+    value: (string | number)[];
+    /** Array of checkbox options */
+    options: CheckboxOption[];
+    /** Error object with optional message */
+    error?: FieldError$f;
+    /** Helper text to display below field */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Checkbox color */
+    color?: CheckboxProps["color"];
+    /** Checkbox size */
+    size?: CheckboxProps["size"];
+    /** Label placement relative to checkbox */
+    labelPlacement?: FormControlLabelProps["labelPlacement"];
+    /** Whether to display checkboxes in a row */
+    row?: boolean;
+    /** Custom icon for checked state */
+    checkedIcon?: React__default.ReactNode;
+    /** Custom icon for unchecked state */
+    icon?: React__default.ReactNode;
+    /** Custom styles for individual checkboxes */
+    checkboxStyles?: CheckboxProps["sx"];
+    /** Custom styles for checkbox labels */
+    labelStyles?: FormControlLabelProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: FormControlProps["sx"];
+    /** Custom styles for FormLabel */
+    formLabelStyles?: FormLabelProps["sx"];
+    /** Callback fired when the value changes */
+    onChange?: (value: (string | number)[]) => void;
+    /** Callback fired when a checkbox receives focus */
+    onFocus?: (event: FocusEvent<HTMLButtonElement>, value: string | number) => void;
+    /** Callback fired when a checkbox loses focus */
+    onBlur?: (event: FocusEvent<HTMLButtonElement>, value: string | number) => void;
+    /** Callback fired when a checkbox is clicked */
+    onClick?: (event: React__default.MouseEvent<HTMLButtonElement>, value: string | number) => void;
+    /** Custom render function for checkboxes */
+    renderCheckbox?: (option: CheckboxOption, index: number, isChecked: boolean, handleChange: (event: ChangeEvent<HTMLInputElement>) => void) => React__default.ReactNode;
+    /** Custom slot props for MUI v7 */
+    slotProps?: {
+        checkbox?: CheckboxProps["slotProps"];
+        formControlLabel?: FormControlLabelProps["slotProps"];
+    };
+    /** Custom slots for MUI v7 */
+    slots?: {
+        checkbox?: CheckboxProps["slots"];
+    };
+    /** FormLabel props */
+    formLabelProps?: Omit<FormLabelProps, "children">;
+    /** FormControlLabel props */
+    formControlLabelProps?: Omit<FormControlLabelProps, "control" | "label" | "value">;
+}
+declare const CheckboxFieldGroup: React__default.ForwardRefExoticComponent<Omit<ICheckboxFieldGroupProps, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError$e = {
+    message?: string;
+} | null;
+/**
+ * Extended Checkbox Field Props
+ * Extends MUI CheckboxProps with custom form field props
+ */
+interface ICheckboxFieldProps extends Omit<CheckboxProps, "checked" | "onChange" | "name"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the checkbox */
+    label?: React__default.ReactNode;
+    /** Current checked state */
+    value: boolean;
+    /** Error object with optional message */
+    error?: FieldError$e;
+    /** Helper text to display below checkbox */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Checkbox color */
+    color?: CheckboxProps["color"];
+    /** Checkbox size */
+    size?: CheckboxProps["size"];
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Label placement */
+    labelPlacement?: FormControlLabelProps["labelPlacement"];
+    /** Callback fired when the value changes */
+    onChange?: (checked: boolean) => void;
+    /** Callback fired when checkbox is clicked */
+    onClick?: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
+    /** Callback fired when checkbox receives focus */
+    onFocus?: CheckboxProps["onFocus"];
+    /** Callback fired when checkbox loses focus */
+    onBlur?: CheckboxProps["onBlur"];
+    /** Custom icon for checked state */
+    checkedIcon?: React__default.ReactNode;
+    /** Custom icon for unchecked state */
+    icon?: React__default.ReactNode;
+    /** Custom styles for the Checkbox */
+    checkboxStyles?: CheckboxProps["sx"];
+    /** Custom styles for FormControlLabel */
+    labelStyles?: FormControlLabelProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: React__default.ComponentProps<typeof FormControl>["sx"];
+    /** Indeterminate state */
+    indeterminate?: boolean;
+    /** Custom slot props for MUI v7 */
+    slotProps?: CheckboxProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: CheckboxProps["slots"];
+}
+declare const CheckboxField: React__default.ForwardRefExoticComponent<Omit<ICheckboxFieldProps, "ref"> & React__default.RefAttributes<HTMLButtonElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError$d = {
+    message?: string;
+} | null;
+/**
+ * Extended Date Calendar Field Props
+ * Extends MUI DateCalendarProps with custom form field props
+ */
+interface IDateCalendarFieldProps extends Omit<DateCalendarProps, "value" | "onChange" | "defaultValue" | "slots" | "slotProps"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the calendar */
+    label?: React__default.ReactNode;
+    /** Current selected date value */
+    value: Date | null;
+    /** Default date value */
+    defaultValue?: Date | null;
+    /** Error object with optional message */
+    error?: FieldError$d;
+    /** Helper text to display below calendar */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Minimum selectable date */
+    minDate?: Date;
+    /** Maximum selectable date */
+    maxDate?: Date;
+    /** Function to disable specific dates */
+    shouldDisableDate?: (date: Date) => boolean;
+    /** Function to disable specific months */
+    shouldDisableMonth?: (month: Date) => boolean;
+    /** Function to disable specific years */
+    shouldDisableYear?: (year: Date) => boolean;
+    /** Custom styles for the DateCalendar */
+    calendarStyles?: DateCalendarProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: React__default.ComponentProps<typeof FormControl>["sx"];
+    /** Custom styles for FormLabel */
+    formLabelStyles?: FormLabelProps["sx"];
+    /** Custom styles for the container Box */
+    containerStyles?: React__default.ComponentProps<typeof Box>["sx"];
+    /** Callback fired when the date changes */
+    onChange?: (value: Date | null) => void;
+    /** Callback fired when a view change is requested */
+    onViewChange?: (view: "day" | "month" | "year") => void;
+    /** Callback fired when a month change is requested */
+    onMonthChange?: (month: Date) => void;
+    /** Callback fired when a year change is requested */
+    onYearChange?: (year: Date) => void;
+    /** Custom slot props for MUI v7 */
+    slotProps?: DateCalendarProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: DateCalendarProps["slots"];
+    /** Date adapter to use (defaults to AdapterDateFns) */
+    dateAdapter?: typeof AdapterDateFns;
+    /** Whether to show days outside current month */
+    showDaysOutsideCurrentMonth?: boolean;
+    /** Whether to disable past dates */
+    disablePast?: boolean;
+    /** Whether to disable future dates */
+    disableFuture?: boolean;
+    /** Reference date for the calendar */
+    referenceDate?: Date;
+    /** Controlled view state */
+    view?: "day" | "month" | "year";
+}
+declare const DateCalendarField: React__default.ForwardRefExoticComponent<IDateCalendarFieldProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError$c = {
+    message?: string;
+} | null;
+/**
+ * Extended Time Clock Field Props
+ * Extends MUI TimeClockProps with custom form field props
+ */
+interface ITimeClockFieldProps extends Omit<TimeClockProps<TimeView>, "value" | "onChange" | "defaultValue" | "slots" | "slotProps" | "view" | "onViewChange"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the time clock */
+    label?: React__default.ReactNode;
+    /** Current selected time value */
+    value: Date | null;
+    /** Default time value */
+    defaultValue?: Date | null;
+    /** Error object with optional message */
+    error?: FieldError$c;
+    /** Helper text to display below time clock */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Available views (hours, minutes, seconds) */
+    views?: TimeView[];
+    /** Whether to show AM/PM in the clock */
+    ampmInClock?: boolean;
+    /** Whether to use 12-hour format */
+    ampm?: boolean;
+    /** Whether to disable past times */
+    disablePast?: boolean;
+    /** Whether to disable future times */
+    disableFuture?: boolean;
+    /** Minimum selectable time */
+    minTime?: Date;
+    /** Maximum selectable time */
+    maxTime?: Date;
+    /** Function to disable specific times */
+    shouldDisableTime?: (time: Date, view: TimeView) => boolean;
+    /** Custom styles for the TimeClock */
+    clockStyles?: TimeClockProps<TimeView>["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: React__default.ComponentProps<typeof FormControl>["sx"];
+    /** Custom styles for FormLabel */
+    formLabelStyles?: FormLabelProps["sx"];
+    /** Custom styles for the container Box */
+    containerStyles?: React__default.ComponentProps<typeof Box>["sx"];
+    /** Custom styles for the view buttons Stack */
+    buttonsStackStyles?: React__default.ComponentProps<typeof Stack>["sx"];
+    /** Custom styles for view buttons */
+    buttonStyles?: ButtonProps["sx"];
+    /** Custom styles for active view button */
+    activeButtonStyles?: ButtonProps["sx"];
+    /** Whether to show view selector buttons */
+    showViewButtons?: boolean;
+    /** Initial view */
+    initialView?: TimeView;
+    /** Controlled view state */
+    view?: TimeView;
+    /** Callback fired when the time changes */
+    onChange?: (value: Date | null) => void;
+    /** Callback fired when a view change is requested */
+    onViewChange?: (view: TimeView) => void;
+    /** Custom slot props for MUI v7 */
+    slotProps?: TimeClockProps<TimeView>["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: TimeClockProps<TimeView>["slots"];
+    /** Date adapter to use (defaults to AdapterDateFns) */
+    dateAdapter?: typeof AdapterDateFns;
+    /** Auto focus */
+    autoFocus?: boolean;
+}
+declare const TimeClockField: React__default.ForwardRefExoticComponent<ITimeClockFieldProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError$b = {
+    message?: string;
+} | null;
+/**
+ * Extended Time Picker Field Props
+ * Extends MUI TimePickerProps with custom form field props
+ */
+interface ITimePickerFieldProps extends Omit<TimePickerProps, "value" | "onChange" | "defaultValue" | "slots" | "slotProps" | "renderInput" | "onViewChange"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the time picker */
+    label?: string;
+    /** Current selected time value */
+    value: Date | null;
+    /** Default time value */
+    defaultValue?: Date | null;
+    /** Error object with optional message */
+    error?: FieldError$b;
+    /** Helper text to display below field */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Minimum selectable time */
+    minTime?: Date;
+    /** Maximum selectable time */
+    maxTime?: Date;
+    /** Function to disable specific times */
+    shouldDisableTime?: (time: Date, view: "hours" | "minutes" | "seconds") => boolean;
+    /** TextField size */
+    size?: TextFieldProps["size"];
+    /** TextField variant */
+    variant?: TextFieldProps["variant"];
+    /** TextField color */
+    color?: TextFieldProps["color"];
+    /** Placeholder text */
+    placeholder?: string;
+    /** Whether the field is read-only */
+    readOnly?: boolean;
+    /** Whether to show clear button */
+    showClearButton?: boolean;
+    /** Whether to disable past times */
+    disablePast?: boolean;
+    /** Whether to disable future times */
+    disableFuture?: boolean;
+    /** Whether to use 12-hour format */
+    ampm?: boolean;
+    /** Available views (hours, minutes, seconds) */
+    views?: ("hours" | "minutes" | "seconds")[];
+    /** Controlled view state */
+    view?: "hours" | "minutes" | "seconds";
+    /** Default view */
+    openTo?: "hours" | "minutes" | "seconds";
+    /** Format for displaying the time */
+    format?: string;
+    /** Custom styles for the TimePicker */
+    pickerStyles?: TimePickerProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: React__default.ComponentProps<typeof FormControl>["sx"];
+    /** Custom styles for FormLabel */
+    formLabelStyles?: FormLabelProps["sx"];
+    /** Custom styles for the container Box */
+    containerStyles?: React__default.ComponentProps<typeof Box>["sx"];
+    /** Custom styles for the TextField */
+    textFieldStyles?: TextFieldProps["sx"];
+    /** Callback fired when the time changes */
+    onChange?: (value: Date | null) => void;
+    /** Callback fired when the field receives focus */
+    onFocus?: (event: React__default.FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired when the field loses focus */
+    onBlur?: (event: React__default.FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired when a view change is requested */
+    onViewChange?: (view: "hours" | "minutes" | "seconds" | "meridiem") => void;
+    /** Callback fired when the picker opens */
+    onOpen?: () => void;
+    /** Callback fired when the picker closes */
+    onClose?: () => void;
+    /** Custom slot props for MUI v7 */
+    slotProps?: TimePickerProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: TimePickerProps["slots"];
+    /** Date adapter to use (defaults to AdapterDateFns) */
+    dateAdapter?: typeof AdapterDateFns;
+    /** Auto focus the input */
+    autoFocus?: boolean;
+}
+declare const TimePickerField: React__default.ForwardRefExoticComponent<ITimePickerFieldProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError$a = {
+    message?: string;
+} | null;
+/**
+ * Extended Date Picker Field Props
+ * Extends MUI DatePickerProps with custom form field props
+ */
+interface IDatePickerFieldProps extends Omit<DatePickerProps, "value" | "onChange" | "defaultValue" | "slots" | "slotProps" | "renderInput"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the date picker */
+    label?: string;
+    /** Current selected date value */
+    value: Date | null;
+    /** Default date value */
+    defaultValue?: Date | null;
+    /** Error object with optional message */
+    error?: FieldError$a;
+    /** Helper text to display below field */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Minimum selectable date */
+    minDate?: Date;
+    /** Maximum selectable date */
+    maxDate?: Date;
+    /** Function to disable specific dates */
+    shouldDisableDate?: (date: Date) => boolean;
+    /** Function to disable specific months */
+    shouldDisableMonth?: (month: Date) => boolean;
+    /** Function to disable specific years */
+    shouldDisableYear?: (year: Date) => boolean;
+    /** TextField size */
+    size?: TextFieldProps["size"];
+    /** TextField variant */
+    variant?: TextFieldProps["variant"];
+    /** TextField color */
+    color?: TextFieldProps["color"];
+    /** Placeholder text */
+    placeholder?: string;
+    /** Whether the field is read-only */
+    readOnly?: boolean;
+    /** Whether to show clear button */
+    showClearButton?: boolean;
+    /** Whether to disable past dates */
+    disablePast?: boolean;
+    /** Whether to disable future dates */
+    disableFuture?: boolean;
+    /** Reference date for the calendar */
+    referenceDate?: Date;
+    /** Controlled view state */
+    view?: "day" | "month" | "year";
+    /** Format for displaying the date */
+    format?: string;
+    /** Whether to open the calendar on focus */
+    openTo?: "day" | "month" | "year";
+    /** Custom styles for the DatePicker */
+    pickerStyles?: DatePickerProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: React__default.ComponentProps<typeof FormControl>["sx"];
+    /** Custom styles for FormLabel */
+    formLabelStyles?: FormLabelProps["sx"];
+    /** Custom styles for the container Box */
+    containerStyles?: React__default.ComponentProps<typeof Box>["sx"];
+    /** Custom styles for the TextField */
+    textFieldStyles?: TextFieldProps["sx"];
+    /** Callback fired when the date changes */
+    onChange?: (value: Date | null) => void;
+    /** Callback fired when the field receives focus */
+    onFocus?: (event: React__default.FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired when the field loses focus */
+    onBlur?: (event: React__default.FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired when a view change is requested */
+    onViewChange?: (view: "day" | "month" | "year") => void;
+    /** Callback fired when a month change is requested */
+    onMonthChange?: (month: Date) => void;
+    /** Callback fired when a year change is requested */
+    onYearChange?: (year: Date) => void;
+    /** Callback fired when the calendar opens */
+    onOpen?: () => void;
+    /** Callback fired when the calendar closes */
+    onClose?: () => void;
+    /** Custom slot props for MUI v7 */
+    slotProps?: DatePickerProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: DatePickerProps["slots"];
+    /** Date adapter to use (defaults to AdapterDateFns) */
+    dateAdapter?: typeof AdapterDateFns;
+    /** Whether to reduce animations */
+    reduceAnimations?: boolean;
+    /** Auto focus the input */
+    autoFocus?: boolean;
+}
+declare const DatePickerField: React__default.ForwardRefExoticComponent<IDatePickerFieldProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError$9 = {
+    message?: string;
+} | null;
+/**
+ * Extended File Upload Field Props
+ * Extends MUI TextFieldProps with custom file upload props
+ */
+interface IFileUploadFieldProps extends Omit<TextFieldProps, "value" | "onChange" | "name" | "type" | "error" | "onDrop"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the file upload field */
+    label?: string;
+    /** Current file value */
+    value?: File | File[] | {
+        name: string;
+    } | null;
+    /** Error object with optional message */
+    error?: FieldError$9;
+    /** Helper text to display below field */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** File types to accept (e.g., "image/*", ".pdf,.doc") */
+    accept?: string;
+    /** Whether to allow multiple file selection */
+    multiple?: boolean;
+    /** Maximum file size in bytes */
+    maxSize?: number;
+    /** Minimum file size in bytes */
+    minSize?: number;
+    /** Allowed file types (MIME types or extensions) */
+    allowedTypes?: string[];
+    /** Whether to show file preview */
+    showPreview?: boolean;
+    /** Whether to enable drag and drop */
+    enableDragDrop?: boolean;
+    /** Placeholder text */
+    placeholder?: string;
+    /** TextField variant */
+    variant?: TextFieldProps["variant"];
+    /** TextField size */
+    size?: TextFieldProps["size"];
+    /** TextField color */
+    color?: TextFieldProps["color"];
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Upload button text */
+    buttonText?: string;
+    /** Upload button variant */
+    buttonVariant?: ButtonProps["variant"];
+    /** Upload button color */
+    buttonColor?: ButtonProps["color"];
+    /** Upload button size */
+    buttonSize?: ButtonProps["size"];
+    /** Custom upload icon */
+    uploadIcon?: React__default.ReactNode;
+    /** Callback fired when file(s) change */
+    onChange?: (file: File | File[] | undefined) => void;
+    /** Callback fired when file is selected */
+    onFileSelect?: (file: File | File[] | undefined) => void;
+    /** Callback fired when file is removed */
+    onFileRemove?: () => void;
+    /** Callback fired on file validation error */
+    onValidationError?: (error: string) => void;
+    /** Callback fired when file is dropped (drag and drop) */
+    onDrop?: (files: FileList) => void;
+    /** Custom styles for the TextField */
+    inputStyles?: TextFieldProps["sx"];
+    /** Custom styles for the Button */
+    buttonStyles?: ButtonProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: React__default.ComponentProps<typeof FormControl>["sx"];
+    /** Custom styles for the container */
+    containerStyles?: React__default.CSSProperties;
+    /** Custom slot props for MUI v7 */
+    slotProps?: TextFieldProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: TextFieldProps["slots"];
+}
+declare const FileUploadField: React__default.ForwardRefExoticComponent<Omit<IFileUploadFieldProps, "ref"> & React__default.RefAttributes<HTMLInputElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError$8 = {
+    message?: string;
+} | null;
+/**
+ * Color format types
+ */
+type ColorFormat = "hex" | "rgb" | "rgba" | "hsl" | "hsla";
+/**
+ * Extended Color Picker Field Props
+ */
+interface IColorPickerFieldProps extends Omit<TextFieldProps, "value" | "onChange" | "name" | "type" | "error" | "inputRef" | "multiline" | "variant" | "size"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the color picker field */
+    label?: string;
+    /** Current color value (hex string or color object) */
+    value: string;
+    /** Error object with optional message */
+    error?: FieldError$8;
+    /** Helper text to display below field */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Placeholder text */
+    placeholder?: string;
+    /** TextField variant */
+    variant?: TextFieldProps["variant"];
+    /** TextField size */
+    size?: TextFieldProps["size"];
+    /** TextField color */
+    color?: TextFieldProps["color"];
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Color format (hex, rgb, rgba, hsl, hsla) */
+    format?: ColorFormat;
+    /** Whether to show color preview swatch */
+    showPreview?: boolean;
+    /** Whether to show native color input */
+    showNativeInput?: boolean;
+    /** Whether to show popover picker */
+    showPopoverPicker?: boolean;
+    /** Preset colors to display */
+    presetColors?: string[];
+    /** Whether to show preset colors */
+    showPresetColors?: boolean;
+    /** Callback fired when the color changes */
+    onChange?: (value: string) => void;
+    /** Callback fired when field receives focus */
+    onFocus?: (event: FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired when field loses focus */
+    onBlur?: (event: FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired on Enter key press */
+    onEnterPress?: (value: string) => void;
+    /** Custom styles for the color preview swatch */
+    previewStyles?: React__default.CSSProperties;
+    /** Custom styles for FormControl */
+    formControlStyles?: FormControlProps["sx"];
+    /** Custom styles for TextField */
+    inputStyles?: TextFieldProps["sx"];
+    /** Custom slot props for MUI v7 */
+    slotProps?: TextFieldProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: TextFieldProps["slots"];
+}
+declare const ColorPickerField: React__default.NamedExoticComponent<Omit<IColorPickerFieldProps, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
+
+type AutoCompleteOption = {
+    name: string;
+    value: string | number;
+    [key: string]: unknown;
+};
+/**
+ * Error object type
+ */
+type FieldError$7 = {
+    message?: string;
+} | null;
+/**
+ * Extended Autocomplete Input Props
+ * Extends MUI AutocompleteProps with custom form field props
+ */
+interface IAutoCompleteInputProps<T extends AutoCompleteOption = AutoCompleteOption, Multiple extends boolean = false, DisableClearable extends boolean = false, FreeSolo extends boolean = false> extends Omit<AutocompleteProps<T, Multiple, DisableClearable, FreeSolo>, "renderInput" | "options" | "value" | "onChange" | "getOptionLabel" | "isOptionEqualToValue" | "renderOption"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the input field */
+    label?: string;
+    /** Current selected value */
+    value: Multiple extends true ? T[] : T | null;
+    /** Options array to display in dropdown */
+    options: T[];
+    /** Error object with optional message */
+    error?: FieldError$7;
+    /** Helper text to display below input */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Placeholder text */
+    placeholder?: string;
+    /** TextField variant */
+    variant?: TextFieldProps["variant"];
+    /** TextField size */
+    size?: TextFieldProps["size"];
+    /** TextField color */
+    color?: TextFieldProps["color"];
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Custom function to get option label (defaults to option.name) */
+    getOptionLabel?: (option: T | string) => string;
+    /** Custom function to check option equality (defaults to comparing option.name) */
+    isOptionEqualToValue?: (option: T, value: T) => boolean;
+    /** Custom render function for options */
+    renderOption?: (props: React__default.HTMLAttributes<HTMLLIElement>, option: T, state?: {
+        selected: boolean;
+        inputValue: string;
+    }) => React__default.ReactNode;
+    /** Callback fired when the value changes */
+    onChange?: (event: SyntheticEvent, newValue: Multiple extends true ? T[] : T | null, reason?: AutocompleteChangeReason) => void;
+    /** Callback fired when input value changes */
+    onInputChange?: (event: SyntheticEvent, newInputValue: string, reason: AutocompleteInputChangeReason) => void;
+    /** Callback fired when popup opens */
+    onOpen?: (event: SyntheticEvent) => void;
+    /** Callback fired when popup closes */
+    onClose?: (event: SyntheticEvent, reason: AutocompleteCloseReason) => void;
+    /** Custom icon for popup indicator */
+    popupIcon?: React__default.ReactNode;
+    /** Custom styles for the TextField */
+    inputStyles?: TextFieldProps["sx"];
+    /** Custom styles for the Autocomplete */
+    autocompleteStyles?: AutocompleteProps<T, Multiple, DisableClearable, FreeSolo>["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: React__default.ComponentProps<typeof FormControl>["sx"];
+    /** Whether to show loading state */
+    loading?: boolean;
+    /** Text to show when loading */
+    loadingText?: React__default.ReactNode;
+    /** Text to show when no options available */
+    noOptionsText?: React__default.ReactNode;
+    /** Text to show when options are being filtered */
+    filterText?: string;
+    /** Custom filter options function */
+    filterOptions?: (options: T[], state: FilterOptionsState<T>) => T[];
+    /** Whether to highlight the first option */
+    autoHighlight?: boolean;
+    /** Whether to select the first option on highlight */
+    autoSelect?: boolean;
+    /** Whether to disable portal rendering */
+    disablePortal?: boolean;
+    /** Whether to disable list wrapping */
+    disableListWrap?: boolean;
+    /** Custom slot props for MUI v7 */
+    slotProps?: AutocompleteProps<T, Multiple, DisableClearable, FreeSolo>["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: AutocompleteProps<T, Multiple, DisableClearable, FreeSolo>["slots"];
+}
+declare const AutoCompleteField: React__default.NamedExoticComponent<Omit<IAutoCompleteInputProps<AutoCompleteOption, boolean, boolean, boolean>, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Base option type for Select
+ */
+type SelectOption = {
+    name: string;
+    value: string | number;
+    disabled?: boolean;
+    [key: string]: unknown;
+};
+/**
+ * Error object type
+ */
+type FieldError$6 = {
+    message?: string;
+} | null;
+/**
+ * Extended Select Input Props
+ * Extends MUI SelectProps with custom form field props
+ */
+interface ISelectInputFieldProps extends Omit<SelectProps<string | number | (string | number)[]>, "value" | "onChange" | "name" | "error" | "children" | "renderValue"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the select field */
+    label?: string;
+    /** Current selected value(s) */
+    value: string | number | (string | number)[] | "";
+    /** Options array to display in dropdown */
+    options: SelectOption[];
+    /** Error object with optional message */
+    error?: FieldError$6;
+    /** Helper text to display below select */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Select variant */
+    variant?: SelectProps["variant"];
+    /** Select size */
+    size?: SelectProps["size"];
+    /** Select color */
+    color?: SelectProps["color"];
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Whether to allow multiple selections */
+    multiple?: boolean;
+    /** Custom icon for dropdown indicator */
+    icon?: React__default.ReactNode;
+    /** Custom render function for selected value(s) */
+    renderValue?: SelectProps<string | number | (string | number)[]>["renderValue"];
+    /** Custom render function for menu items */
+    renderMenuItem?: (option: SelectOption, index: number) => React__default.ReactNode;
+    /** Custom styles for MenuItem - can be static styles or a function that receives (option, index) */
+    menuItemStyles?: MenuItemProps["sx"] | ((option: SelectOption, index: number) => MenuItemProps["sx"]);
+    /** Custom styles for the Select */
+    selectStyles?: SelectProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: React__default.ComponentProps<typeof FormControl>["sx"];
+    /** Custom styles for InputLabel */
+    labelStyles?: React__default.ComponentProps<typeof InputLabel>["sx"];
+    /** Callback fired when the value changes */
+    onChange?: (event: SelectChangeEvent<string | number | (string | number)[]>, child?: React__default.ReactNode) => void;
+    /** Callback fired when menu opens */
+    onOpen?: (event: SyntheticEvent) => void;
+    /** Callback fired when menu closes */
+    onClose?: (event: SyntheticEvent) => void;
+    /** Custom slot props for MUI v7 */
+    slotProps?: SelectProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: SelectProps["slots"];
+    /** Display empty value */
+    displayEmpty?: boolean;
+    /** Auto width for menu */
+    autoWidth?: boolean;
+    /** Native select element */
+    native?: boolean;
+    /** Menu props */
+    MenuProps?: SelectProps["MenuProps"];
+}
+declare const SelectInputField: React__default.ForwardRefExoticComponent<Omit<ISelectInputFieldProps, "ref"> & React__default.RefAttributes<HTMLInputElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError$5 = {
+    message?: string;
+} | null;
+/**
+ * Extended OTP Input Field Props
+ */
+interface IOTPInputFieldProps extends Omit<TextFieldProps, "value" | "onChange" | "name" | "type" | "error" | "inputRef" | "multiline" | "variant" | "size"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the OTP field */
+    label?: string;
+    /** Current OTP value (string of digits) */
+    value: string;
+    /** Error object with optional message */
+    error?: FieldError$5;
+    /** Helper text to display below field */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Number of OTP input boxes (default: 6) */
+    length?: number;
+    /** TextField variant */
+    variant?: TextFieldProps["variant"];
+    /** TextField size */
+    size?: TextFieldProps["size"];
+    /** TextField color */
+    color?: TextFieldProps["color"];
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Spacing between OTP boxes */
+    spacing?: number;
+    /** Whether to auto-focus first input on mount */
+    autoFocus?: boolean;
+    /** Whether to auto-submit when all boxes are filled */
+    autoSubmit?: boolean;
+    /** Callback fired when the value changes */
+    onChange?: (value: string) => void;
+    /** Callback fired when all OTP boxes are filled */
+    onComplete?: (value: string) => void;
+    /** Callback fired when field receives focus */
+    onFocus?: (event: FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired when field loses focus */
+    onBlur?: (event: FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired on Enter key press */
+    onEnterPress?: (value: string) => void;
+    /** Custom styles for the OTP container */
+    containerStyles?: React__default.CSSProperties;
+    /** Custom styles for individual OTP input boxes */
+    inputStyles?: TextFieldProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: FormControlProps["sx"];
+    /** Custom slot props for MUI v7 */
+    slotProps?: TextFieldProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: TextFieldProps["slots"];
+}
+declare const OTPField: React__default.ForwardRefExoticComponent<Omit<IOTPInputFieldProps, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError$4 = {
+    message?: string;
+} | null;
+/**
+ * Extended Search Input Field Props
+ * Extends MUI TextFieldProps with custom search field props
+ */
+interface ISearchInputFieldProps extends Omit<TextFieldProps, "value" | "onChange" | "name" | "type" | "error" | "inputRef"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the search field */
+    label?: string;
+    /** Current search value */
+    value: string;
+    /** Error object with optional message */
+    error?: FieldError$4;
+    /** Helper text to display below field */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Placeholder text */
+    placeholder?: string;
+    /** TextField variant */
+    variant?: TextFieldProps["variant"];
+    /** TextField size */
+    size?: TextFieldProps["size"];
+    /** TextField color */
+    color?: TextFieldProps["color"];
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Whether to show clear button */
+    showClearButton?: boolean;
+    /** Whether to show search button */
+    showSearchButton?: boolean;
+    /** Custom clear icon */
+    clearIcon?: React__default.ReactNode;
+    /** Custom search icon */
+    searchIcon?: React__default.ReactNode;
+    /** Custom icon button props for clear button */
+    clearButtonProps?: IconButtonProps;
+    /** Custom icon button props for search button */
+    searchButtonProps?: IconButtonProps;
+    /** Callback fired when the value changes */
+    onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
+    /** Callback fired when field receives focus */
+    onFocus?: (event: FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired when field loses focus */
+    onBlur?: (event: FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired when search button is clicked */
+    onSearch?: (value: string) => void;
+    /** Callback fired when clear button is clicked */
+    onClear?: () => void;
+    /** Callback fired on Enter key press */
+    onEnterPress?: (value: string) => void;
+    /** Enable debounce for search (default: true) */
+    enableDebounce?: boolean;
+    /** Debounce delay in milliseconds (default: 300) */
+    debounceDelay?: number;
+    /** Enable throttle for search (default: false) */
+    enableThrottle?: boolean;
+    /** Throttle delay in milliseconds (default: 300) */
+    throttleDelay?: number;
+    /** Custom styles for the TextField */
+    inputStyles?: TextFieldProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: React__default.ComponentProps<typeof FormControl>["sx"];
+    /** Custom slot props for MUI v7 */
+    slotProps?: TextFieldProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: TextFieldProps["slots"];
+}
+declare const SearchField: React__default.NamedExoticComponent<Omit<ISearchInputFieldProps, "ref"> & React__default.RefAttributes<HTMLInputElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError$3 = {
+    message?: string;
+} | null;
+/**
+ * Extended Tel Input Field Props
+ * Extends MUI TextFieldProps with custom tel field props
+ */
+interface ITelInputFieldProps extends Omit<TextFieldProps, "value" | "onChange" | "name" | "type" | "error" | "inputRef"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the tel field */
+    label?: string;
+    /** Current tel value (digits only, formatting is handled internally) */
+    value: string;
+    /** Error object with optional message */
+    error?: FieldError$3;
+    /** Helper text to display below field */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Placeholder text (auto-generated from pattern if not provided) */
+    placeholder?: string;
+    /** TextField variant */
+    variant?: TextFieldProps["variant"];
+    /** TextField size */
+    size?: TextFieldProps["size"];
+    /** TextField color */
+    color?: TextFieldProps["color"];
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Pattern string (e.g., "XXX-XXXX" where X represents digits) */
+    pattern?: string;
+    /** Maximum length (defaults to pattern length if pattern provided) */
+    maxLength?: number;
+    /** Country code to display */
+    countryCode?: string;
+    /** Whether to show country code */
+    showCountryCode?: boolean;
+    /** Start adornment (icon or element before input) */
+    startAdornment?: React__default.ReactNode;
+    /** End adornment (icon or element after input) */
+    endAdornment?: React__default.ReactNode;
+    /** Callback fired when the value changes (returns digits only) */
+    onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
+    /** Callback fired when field receives focus */
+    onFocus?: (event: FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired when field loses focus */
+    onBlur?: (event: FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired on Enter key press */
+    onEnterPress?: (value: string) => void;
+    /** Custom styles for the TextField */
+    inputStyles?: TextFieldProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: FormControlProps["sx"];
+    /** Custom styles for country code display */
+    countryCodeStyles?: React__default.CSSProperties;
+    /** Custom slot props for MUI v7 */
+    slotProps?: TextFieldProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: TextFieldProps["slots"];
+}
+declare const TeliField: React__default.NamedExoticComponent<Omit<ITelInputFieldProps, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError$2 = {
+    message?: string;
+} | null;
+/**
+ * Number pattern types
+ */
+type NumberPattern = "phone" | "credit-card" | "currency" | "ssn" | "zip-code" | "decimal" | "integer" | "percentage" | "custom";
+/**
+ * Extended Number Input Field Props
+ * Extends MUI TextFieldProps with custom number field props
+ */
+interface INumberInputFieldProps extends Omit<TextFieldProps, "value" | "onChange" | "name" | "type" | "error" | "inputRef"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the number field */
+    label?: string;
+    /** Current number value (as string to support formatted values) */
+    value: string;
+    /** Error object with optional message */
+    error?: FieldError$2;
+    /** Helper text to display below field */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Placeholder text */
+    placeholder?: string;
+    /** TextField variant */
+    variant?: TextFieldProps["variant"];
+    /** TextField size */
+    size?: TextFieldProps["size"];
+    /** TextField color */
+    color?: TextFieldProps["color"];
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Number pattern type or pattern string (e.g., "XXX-XXXX" where X represents digits) */
+    pattern?: NumberPattern | string;
+    /** Custom regex pattern (used when pattern is "custom") */
+    customPattern?: RegExp;
+    /** Custom formatter function */
+    customFormatter?: (value: string) => string;
+    /** Minimum value */
+    min?: number;
+    /** Maximum value */
+    max?: number;
+    /** Step value for number input */
+    step?: number;
+    /** Allow decimal numbers (for decimal pattern) */
+    allowDecimals?: boolean;
+    /** Number of decimal places */
+    decimalPlaces?: number;
+    /** Start adornment (icon or element before input) */
+    startAdornment?: React__default.ReactNode;
+    /** End adornment (icon or element after input) */
+    endAdornment?: React__default.ReactNode;
+    /** Callback fired when the value changes (returns formatted string) */
+    onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
+    /** Callback fired when field receives focus */
+    onFocus?: (event: FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired when field loses focus */
+    onBlur?: (event: FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired on Enter key press */
+    onEnterPress?: (value: string) => void;
+    /** Custom styles for the TextField */
+    inputStyles?: TextFieldProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: React__default.ComponentProps<typeof FormControl>["sx"];
+    /** Custom slot props for MUI v7 */
+    slotProps?: TextFieldProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: TextFieldProps["slots"];
+}
+declare const NumberField: React__default.NamedExoticComponent<Omit<INumberInputFieldProps, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError$1 = {
+    message?: string;
+} | null;
+/**
+ * Password strength level
+ */
+type PasswordStrength = "weak" | "medium" | "strong" | "very-strong";
+/**
+ * Extended Password Field Props
+ * Extends MUI TextFieldProps with custom password field props
+ */
+interface IPasswordFieldProps extends Omit<TextFieldProps, "value" | "onChange" | "name" | "type" | "error" | "inputRef"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the password field */
+    label?: string;
+    /** Current password value */
+    value: string;
+    /** Error object with optional message */
+    error?: FieldError$1;
+    /** Helper text to display below field */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Placeholder text */
+    placeholder?: string;
+    /** TextField variant */
+    variant?: TextFieldProps["variant"];
+    /** TextField size */
+    size?: TextFieldProps["size"];
+    /** TextField color */
+    color?: TextFieldProps["color"];
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Whether to show password strength indicator */
+    showPasswordStrength?: boolean;
+    /** Minimum password length */
+    minLength?: number;
+    /** Maximum password length */
+    maxLength?: number;
+    /** Whether to show password by default */
+    defaultShowPassword?: boolean;
+    /** Custom visibility toggle icon (when password is visible) */
+    visibilityIcon?: React__default.ReactNode;
+    /** Custom visibility off icon (when password is hidden) */
+    visibilityOffIcon?: React__default.ReactNode;
+    /** Custom icon button props */
+    iconButtonProps?: IconButtonProps;
+    /** Callback fired when the value changes */
+    onChange?: (event: ChangeEvent<HTMLInputElement>) => void;
+    /** Callback fired when field receives focus */
+    onFocus?: (event: FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired when field loses focus */
+    onBlur?: (event: FocusEvent<HTMLInputElement>) => void;
+    /** Callback fired when password visibility toggles */
+    onVisibilityToggle?: (isVisible: boolean) => void;
+    /** Custom function to calculate password strength */
+    getPasswordStrength?: (password: string) => PasswordStrength;
+    /** Custom styles for the TextField */
+    inputStyles?: TextFieldProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: React__default.ComponentProps<typeof FormControl>["sx"];
+    /** Custom slot props for MUI v7 */
+    slotProps?: TextFieldProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: TextFieldProps["slots"];
+}
+declare const PasswordField: React__default.NamedExoticComponent<Omit<IPasswordFieldProps, "ref"> & React__default.RefAttributes<HTMLInputElement>>;
+
+/**
+ * Error object type
+ */
+type FieldError = {
+    message?: string;
+} | null;
+/**
+ * Resize options for textarea
+ */
+type ResizeOption = "none" | "both" | "horizontal" | "vertical";
+/**
+ * Extended Text Input Field Props
+ * Extends MUI TextFieldProps with custom text field props
+ */
+interface ITextInputFieldProps extends Omit<TextFieldProps, "value" | "onChange" | "name" | "type" | "error" | "inputRef" | "multiline"> {
+    /** Field name for form identification */
+    name?: string;
+    /** Label text for the text field */
+    label?: string;
+    /** Current text value */
+    value: string;
+    /** Error object with optional message */
+    error?: FieldError;
+    /** Helper text to display below field */
+    helperText?: string;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Placeholder text */
+    placeholder?: string;
+    /** TextField variant */
+    variant?: TextFieldProps["variant"];
+    /** TextField size */
+    size?: TextFieldProps["size"];
+    /** TextField color */
+    color?: TextFieldProps["color"];
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Required field indicator */
+    required?: boolean;
+    /** Whether to enable multiline input (textarea) */
+    multiline?: boolean;
+    /** Number of rows for multiline input */
+    rows?: number;
+    /** Minimum number of rows for multiline input */
+    minRows?: number;
+    /** Maximum number of rows for multiline input */
+    maxRows?: number;
+    /** Resize option for textarea (none, both, horizontal, vertical) */
+    resize?: ResizeOption;
+    /** Maximum length of input */
+    maxLength?: number;
+    /** Minimum length of input */
+    minLength?: number;
+    /** Input type (text, email, number, tel, url, etc.) */
+    type?: string;
+    /** Auto complete attribute */
+    autoComplete?: string;
+    /** Start adornment (icon or element before input) */
+    startAdornment?: React__default.ReactNode;
+    /** End adornment (icon or element after input) */
+    endAdornment?: React__default.ReactNode;
+    /** Callback fired when the value changes */
+    onChange?: (event: ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+    /** Callback fired when field receives focus */
+    onFocus?: (event: FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+    /** Callback fired when field loses focus */
+    onBlur?: (event: FocusEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
+    /** Callback fired on Enter key press */
+    onEnterPress?: (value: string) => void;
+    /** Custom styles for the TextField */
+    inputStyles?: TextFieldProps["sx"];
+    /** Custom styles for FormControl */
+    formControlStyles?: React__default.ComponentProps<typeof FormControl>["sx"];
+    /** Custom slot props for MUI v7 */
+    slotProps?: TextFieldProps["slotProps"];
+    /** Custom slots for MUI v7 */
+    slots?: TextFieldProps["slots"];
+}
+declare const TextInputField: React__default.NamedExoticComponent<Omit<ITextInputFieldProps, "ref"> & React__default.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Base option type for dropdown fields
+ */
+type Option = {
+    name: string;
+    value: number | string;
+    disabled?: boolean;
+    [key: string]: unknown;
+};
+/**
+ * Base interface for all HookForm field components
+ */
+interface IFormInputFields<TFieldValues extends FieldValues = FieldValues> {
+    /** Field name for form identification */
+    name: string;
+    /** Label text for the field */
+    label?: string;
+    /** React Hook Form control object */
+    control: Control<TFieldValues>;
+    /** React Hook Form errors object */
+    errors: FieldErrors<TFieldValues>;
+    /** Default value for the field */
+    defaultValue?: any;
+    /** Placeholder text */
+    placeholder?: string;
+    /** Field size */
+    size?: TextFieldPropsSizeOverrides;
+    /** Whether the field is disabled */
+    disabled?: boolean;
+    /** Whether the field is required */
+    required?: boolean;
+    /** Full width of the field */
+    fullWidth?: boolean;
+    /** Custom styles for input */
+    inputStyles?: SxProps<Theme>;
+    /** Custom styles */
+    sx?: SxProps<Theme>;
+    /** Custom slot props for MUI v7 */
+    slotProps?: any;
+    /** Custom slots for MUI v7 */
+    slots?: any;
+    /** Callback fired when the value changes - allows manual updates/actions */
+    onChange?: (value: any) => void;
+    /** Additional props */
+    [key: string]: any;
+}
+/**
+ * Interface for fields with options (Select, AutoComplete, etc.)
+ */
+interface IFormInputFieldsWithOptions<TFieldValues extends FieldValues = FieldValues> extends IFormInputFields<TFieldValues> {
+    /** Options array for dropdown fields */
+    options?: Option[];
+    /** Limit number of tags displayed (for multi-select) */
+    limitTags?: number;
+    /** Custom render function for options */
+    renderOption?: any;
+    /** Custom function to get option label */
+    getOptionLabel?: any;
+    /** Whether to render single option */
+    isRenderSingle?: boolean;
+    /** Custom render function for option value */
+    renderOptionValue?: any;
+    /** Whether to disable checkbox in multi-select */
+    disableCheckBox?: boolean;
+    /** Whether to filter selected options */
+    filterSelectedOptions?: boolean;
+}
+/**
+ * Interface for date/time picker fields
+ */
+interface IFormInputDateFields<TFieldValues extends FieldValues = FieldValues> extends IFormInputFields<TFieldValues> {
+    /** Default date value */
+    defaultValue?: Date | null;
+    /** Minimum selectable date */
+    minDate?: Date;
+    /** Maximum selectable date */
+    maxDate?: Date;
+    /** Whether the field is read-only */
+    readOnly?: boolean;
+    /** Timezone setting */
+    timezone?: any;
+    /** Whether to use 12-hour format (AM/PM) */
+    ampm?: boolean;
+    /** Views to show in picker */
+    views?: TimeView[];
+    /** Whether to show AM/PM in clock */
+    ampmInClock?: boolean;
+    /** Whether to disable past dates */
+    disablePast?: boolean;
+    /** Custom function to disable specific dates */
+    shouldDisableDate?: (date: Date) => boolean;
+}
+/**
+ * Interface for number input fields
+ */
+interface IFormInputNumberFields<TFieldValues extends FieldValues = FieldValues> extends IFormInputFields<TFieldValues> {
+    /** Number pattern type or custom pattern string */
+    pattern?: string;
+    /** Minimum value */
+    min?: number;
+    /** Maximum value */
+    max?: number;
+    /** Step value */
+    step?: number;
+    /** Allow decimal numbers */
+    allowDecimals?: boolean;
+    /** Number of decimal places */
+    decimalPlaces?: number;
+}
+/**
+ * Interface for text area fields
+ */
+interface IFormInputTextAreaFields<TFieldValues extends FieldValues = FieldValues> extends IFormInputFields<TFieldValues> {
+    /** Number of rows */
+    rows?: number;
+    /** Minimum number of rows */
+    minRows?: number;
+    /** Maximum number of rows */
+    maxRows?: number;
+    /** Resize option */
+    resize?: "none" | "both" | "horizontal" | "vertical";
+}
+/**
+ * Interface for radio button fields (single)
+ */
+interface IFormInputRadioFields<TFieldValues extends FieldValues = FieldValues> extends IFormInputFields<TFieldValues> {
+    /** Current checked state */
+    checked?: boolean;
+    /** Radio color */
+    color?: "default" | "primary" | "secondary" | "error" | "info" | "success" | "warning";
+    /** Label placement */
+    labelPlacement?: "end" | "start" | "top" | "bottom";
+}
+/**
+ * Interface for checkbox group fields
+ */
+interface IFormInputCheckBoxGroupFields<TFieldValues extends FieldValues = FieldValues> extends IFormInputFieldsWithOptions<TFieldValues> {
+    /** Whether to display checkboxes in a row */
+    row?: boolean;
+    /** Checkbox color */
+    color?: "default" | "primary" | "secondary" | "error" | "info" | "success" | "warning";
+    /** Label placement */
+    labelPlacement?: "end" | "start" | "top" | "bottom";
+}
+
+declare const FormInputTextField: React__default.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputTextArea: React__default.MemoExoticComponent<({ name, label, control, errors, rows, minRows, maxRows, resize, defaultValue, onChange, ...props }: IFormInputTextAreaFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputPasswordField: React__default.MemoExoticComponent<({ name, label, control, errors, size, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputNumberField: React__default.MemoExoticComponent<({ name, label, control, errors, pattern, min, max, step, allowDecimals, decimalPlaces, defaultValue, onChange, ...props }: IFormInputNumberFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputTelField: React__default.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputSearchField: React__default.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputOTPField: React__default.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputSelect: React__default.MemoExoticComponent<({ name, label, control, errors, options, defaultValue, onChange, ...props }: IFormInputFieldsWithOptions) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputMultiSelect: React__default.MemoExoticComponent<({ name, label, control, errors, options, defaultValue, onChange, ...props }: IFormInputFieldsWithOptions) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputAutoComplete: React__default.MemoExoticComponent<({ name, label, control, errors, options, disabled, placeholder, defaultValue, onChange, ...props }: IFormInputFieldsWithOptions) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputMultiAutoComplete: React__default.MemoExoticComponent<({ name, label, control, errors, options, disabled, placeholder, defaultValue, onChange, ...props }: IFormInputFieldsWithOptions) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputColorPicker: React__default.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputFileUpload: React__default.MemoExoticComponent<({ name, label, control, errors, size, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputDatePicker: React__default.MemoExoticComponent<({ name, label, control, errors, size, readOnly, shouldDisableDate, disabled, placeholder, defaultValue, onChange, ...props }: IFormInputDateFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputTimePicker: React__default.MemoExoticComponent<({ name, label, control, errors, ampm, timezone, defaultValue, onChange, ...props }: IFormInputDateFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputTimeClock: React__default.MemoExoticComponent<({ name, label, control, errors, readOnly, disabled, ampm, views, ampmInClock, disablePast, defaultValue, onChange, ...props }: IFormInputDateFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputCalendar: React__default.MemoExoticComponent<({ name, label, control, errors, readOnly, disabled, defaultValue, onChange, ...props }: IFormInputDateFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputCheckBox: React__default.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputCheckBoxGroup: React__default.MemoExoticComponent<({ name, label, control, errors, options, defaultValue, onChange, row, color, labelPlacement, ...props }: IFormInputCheckBoxGroupFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputSwitch: React__default.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputSlider: React__default.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputRadioButton: React__default.MemoExoticComponent<({ name, label, control, errors, checked, defaultValue, onChange, color, labelPlacement, ...props }: IFormInputRadioFields) => react_jsx_runtime.JSX.Element>;
+
+declare const FormInputRadioButtonGroup: React__default.MemoExoticComponent<({ name, label, control, errors, options, defaultValue, onChange, ...props }: IFormInputFieldsWithOptions) => react_jsx_runtime.JSX.Element>;
+
+declare const FormFields: {
+    FormInputTextField: React.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+    FormInputTextArea: React.MemoExoticComponent<({ name, label, control, errors, rows, minRows, maxRows, resize, defaultValue, onChange, ...props }: IFormInputTextAreaFields) => react_jsx_runtime.JSX.Element>;
+    FormInputPasswordField: React.MemoExoticComponent<({ name, label, control, errors, size, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+    FormInputNumberField: React.MemoExoticComponent<({ name, label, control, errors, pattern, min, max, step, allowDecimals, decimalPlaces, defaultValue, onChange, ...props }: IFormInputNumberFields) => react_jsx_runtime.JSX.Element>;
+    FormInputTelField: React.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+    FormInputSearchField: React.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+    FormInputOTPField: React.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+    FormInputSelect: React.MemoExoticComponent<({ name, label, control, errors, options, defaultValue, onChange, ...props }: IFormInputFieldsWithOptions) => react_jsx_runtime.JSX.Element>;
+    FormInputMultiSelect: React.MemoExoticComponent<({ name, label, control, errors, options, defaultValue, onChange, ...props }: IFormInputFieldsWithOptions) => react_jsx_runtime.JSX.Element>;
+    FormInputAutoComplete: React.MemoExoticComponent<({ name, label, control, errors, options, disabled, placeholder, defaultValue, onChange, ...props }: IFormInputFieldsWithOptions) => react_jsx_runtime.JSX.Element>;
+    FormInputMultiAutoComplete: React.MemoExoticComponent<({ name, label, control, errors, options, disabled, placeholder, defaultValue, onChange, ...props }: IFormInputFieldsWithOptions) => react_jsx_runtime.JSX.Element>;
+    FormInputColorPicker: React.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+    FormInputFileUpload: React.MemoExoticComponent<({ name, label, control, errors, size, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+    FormInputDatePicker: React.MemoExoticComponent<({ name, label, control, errors, size, readOnly, shouldDisableDate, disabled, placeholder, defaultValue, onChange, ...props }: IFormInputDateFields) => react_jsx_runtime.JSX.Element>;
+    FormInputTimePicker: React.MemoExoticComponent<({ name, label, control, errors, ampm, timezone, defaultValue, onChange, ...props }: IFormInputDateFields) => react_jsx_runtime.JSX.Element>;
+    FormInputTimeClock: React.MemoExoticComponent<({ name, label, control, errors, readOnly, disabled, ampm, views, ampmInClock, disablePast, defaultValue, onChange, ...props }: IFormInputDateFields) => react_jsx_runtime.JSX.Element>;
+    FormInputCalendar: React.MemoExoticComponent<({ name, label, control, errors, readOnly, disabled, defaultValue, onChange, ...props }: IFormInputDateFields) => react_jsx_runtime.JSX.Element>;
+    FormInputCheckBox: React.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+    FormInputCheckBoxGroup: React.MemoExoticComponent<({ name, label, control, errors, options, defaultValue, onChange, row, color, labelPlacement, ...props }: IFormInputCheckBoxGroupFields) => react_jsx_runtime.JSX.Element>;
+    FormInputSwitch: React.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+    FormInputSlider: React.MemoExoticComponent<({ name, label, control, errors, defaultValue, onChange, ...props }: IFormInputFields) => react_jsx_runtime.JSX.Element>;
+    FormInputSingleRadio: React.MemoExoticComponent<({ name, label, control, errors, checked, defaultValue, onChange, color, labelPlacement, ...props }: IFormInputRadioFields) => react_jsx_runtime.JSX.Element>;
+    FormInputRadioButtonGroup: React.MemoExoticComponent<({ name, label, control, errors, options, defaultValue, onChange, ...props }: IFormInputFieldsWithOptions) => react_jsx_runtime.JSX.Element>;
+    TextInputField: React.NamedExoticComponent<Omit<ITextInputFieldProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    PasswordField: React.NamedExoticComponent<Omit<IPasswordFieldProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+    NumberField: React.NamedExoticComponent<Omit<INumberInputFieldProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    TelInputField: React.NamedExoticComponent<Omit<ITelInputFieldProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    SearchInputField: React.NamedExoticComponent<Omit<ISearchInputFieldProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+    OTPField: React.ForwardRefExoticComponent<Omit<IOTPInputFieldProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    SelectInputField: React.ForwardRefExoticComponent<Omit<ISelectInputFieldProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+    AutoCompleteField: React.NamedExoticComponent<Omit<IAutoCompleteInputProps<AutoCompleteOption, boolean, boolean, boolean>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    ColorPickerField: React.NamedExoticComponent<Omit<IColorPickerFieldProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    FileUploadField: React.ForwardRefExoticComponent<Omit<IFileUploadFieldProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
+    DatePickerField: React.ForwardRefExoticComponent<IDatePickerFieldProps & React.RefAttributes<HTMLDivElement>>;
+    TimePickerField: React.ForwardRefExoticComponent<ITimePickerFieldProps & React.RefAttributes<HTMLDivElement>>;
+    TimeClockField: React.ForwardRefExoticComponent<ITimeClockFieldProps & React.RefAttributes<HTMLDivElement>>;
+    DateCalendarField: React.ForwardRefExoticComponent<IDateCalendarFieldProps & React.RefAttributes<HTMLDivElement>>;
+    CheckBoxField: React.ForwardRefExoticComponent<Omit<ICheckboxFieldProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+    CheckBoxFieldGroup: React.ForwardRefExoticComponent<Omit<ICheckboxFieldGroupProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    RadioButtonField: React.ForwardRefExoticComponent<Omit<IRadioButtonFieldProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+    RadioButtonFieldGroup: React.ForwardRefExoticComponent<Omit<IRadioButtonGroupFieldProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    SwitchField: React.ForwardRefExoticComponent<Omit<ISwitchFieldProps, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+    SliderField: React.ForwardRefExoticComponent<Omit<ISliderFieldProps, "ref"> & React.RefAttributes<HTMLSpanElement>>;
 };
 
-export { AutoCompleteField, CheckBoxField, CheckBoxFieldGroup, ColorPickerField, DateCalendarField, DatePickerField, FileUploadField, FormInputAutoComplete, FormInputCalendar, FormInputCheckBox, FormInputCheckBoxGroup, FormInputColorPicker, FormInputDatePicker, FormInputFileUpload, FormInputMultiAutoComplete, FormInputMultiSelect, FormInputNumberField, FormInputOTPField, FormInputPasswordField, FormInputRadioButtonGroup, FormInputSearchField, FormInputSelect, FormInputSingleRadio, FormInputSlider, FormInputSwitch, FormInputTelField, FormInputTextArea, FormInputTextField, FormInputTimeClock, FormInputTimePicker, type IFormInputCheckBoxGroupFields, type IFormInputDateFields, type IFormInputFields, type IFormInputFieldsWithOptions, type IFormInputNumberFields, type IFormInputRadioFields, type IFormInputTextAreaFields, NumberField, OTPField, type Option, PasswordField, RadioButtonField, RadioButtonFieldGroup, SearchInputField, SelectInputField, SliderField, SwitchField, TelInputField, TextInputField, TimeClockField, TimePickerField, _default as default };
+export { AutoCompleteField, CheckboxField as CheckBoxField, CheckboxFieldGroup as CheckBoxFieldGroup, ColorPickerField, DateCalendarField, DatePickerField, FileUploadField, FormInputAutoComplete, FormInputCalendar, FormInputCheckBox, FormInputCheckBoxGroup, FormInputColorPicker, FormInputDatePicker, FormInputFileUpload, FormInputMultiAutoComplete, FormInputMultiSelect, FormInputNumberField, FormInputOTPField, FormInputPasswordField, FormInputRadioButtonGroup, FormInputSearchField, FormInputSelect, FormInputRadioButton as FormInputSingleRadio, FormInputSlider, FormInputSwitch, FormInputTelField, FormInputTextArea, FormInputTextField, FormInputTimeClock, FormInputTimePicker, type IFormInputCheckBoxGroupFields, type IFormInputDateFields, type IFormInputFields, type IFormInputFieldsWithOptions, type IFormInputNumberFields, type IFormInputRadioFields, type IFormInputTextAreaFields, NumberField, OTPField, type Option, PasswordField, RadioButtonField, RadioButtonFieldGroup, SearchField as SearchInputField, SelectInputField, SliderField, SwitchField, TeliField as TelInputField, TextInputField, TimeClockField, TimePickerField, FormFields as default };