import { type ReactElement, type ReactNode, type Ref } from 'react'; import type { TestableProps } from '../../utils/testId'; import { type InlineEditActivationMode, type InlineEditStatus, type InlineEditSubmitMode } from './InlineEditContext'; export interface InlineEditProps extends TestableProps { value?: T; defaultValue?: T; onValueChange?: (value: T) => void; onValueCommit?: (value: T) => void | Promise; onValueRevert?: (value: T) => void; /** * Commit guard. Called on every submit (Enter, blur, popover close, * confirm button) before `onValueCommit`, with the draft to be committed * and the current committed value. Only an explicit `false` (or a promise * resolving to `false`) blocks the commit: the field silently stays in * edit mode with the draft. Any other result — `true`, `undefined`, no * return — lets the commit proceed. A rejection or a synchronous throw is * treated like a commit failure: status `error`, message from the error, * field stays in edit mode. * * While the guard's promise is pending the edit session is held: duplicate * submits are suppressed, blur neither submits nor cancels, and the field * shows no status (`idle` — the consumer's confirmation UI is the * feedback). Escape still cancels; a late resolution after cancel is * dropped. The value committed on `true` is exactly the `value` argument * the guard received; if the draft changed while the guard was pending, * the resolution is dropped and the field stays in edit mode. * * Guards must settle via non-blocking UI (a promise resolved by dialog * buttons). Synchronous blocking dialogs (`window.confirm`) are * unsupported with submitMode 'blur'/'both' (the queued blur re-prompts). * The guard's owner never gets its consumer UI closed by the DS — treat * the dialog's own buttons as the source of truth for closing it. */ onBeforeValueCommit?: (value: T, committedValue: T) => boolean | void | Promise; edit?: boolean; defaultEdit?: boolean; onEditChange?: (editing: boolean) => void; activationMode?: InlineEditActivationMode; submitMode?: InlineEditSubmitMode; selectOnFocus?: boolean; status?: InlineEditStatus; savedDuration?: number; disabled?: boolean; readOnly?: boolean; className?: string; children?: ReactNode; ref?: Ref; } export declare function InlineEdit({ value, defaultValue, onValueChange, onValueCommit, onValueRevert, onBeforeValueCommit, edit, defaultEdit, onEditChange, activationMode, submitMode, selectOnFocus, status, savedDuration, disabled, readOnly, className, children, ref, 'data-testid': testIdProp, }: InlineEditProps): ReactElement; export declare namespace InlineEdit { var displayName: string; }