import { InputProps } from "../Input/Input.js";
import "../Input/index.js";
import { FC } from "react";

//#region src/components/EditableField/EditableFieldInput.d.ts
/**
 * Props for the EditableFieldInput component, extending standard Input props
 */
type EditableFieldInputProps = InputProps & {
  /** Callback function called when the user saves the edited value */onSave?: (value: string) => void; /** Callback function called when the user cancels the edit operation */
  onCancel?: () => void;
};
/**
 * EditableFieldInput Component
 *
 * An inline editable input field that displays as read-only text until clicked.
 * When activated, it shows an input field with save and cancel buttons.
 *
 * @example
 * ```tsx
 * <EditableFieldInput
 *   defaultValue="Edit me"
 *   placeholder="Click to edit..."
 *   onSave={(value) => console.log('Saved:', value)}
 *   onCancel={() => console.log('Cancelled')}
 * />
 * ```
 *
 * ## Features
 * - **Inline Editing**: Click to edit, displays as text when not editing
 * - **Save/Cancel Actions**: Built-in save and cancel buttons with callbacks
 * - **Keyboard Support**: Accessible keyboard navigation
 * - **Input Variants**: Supports all Input component variants and sizes
 * - **Auto-save on Click Away**: Saves automatically when clicking outside
 * - **Ref Forwarding**: Exposes the underlying input element reference
 *
 * ## Accessibility
 * - Uses semantic HTML with proper ARIA attributes
 * - Keyboard accessible with tab navigation
 * - Screen reader friendly with descriptive labels
 * - Focus management for edit mode transitions
 *
 * @param props - EditableFieldInputProps extending InputProps
 * @returns React functional component
 */
declare const EditableFieldInput: FC<EditableFieldInputProps>;
//#endregion
export { EditableFieldInput };
//# sourceMappingURL=EditableFieldInput.d.ts.map