Inline edit

1"use client";2 3import { useId, useRef, useState } from "react";4import type {5  FocusEvent,6  InputHTMLAttributes,7  KeyboardEvent,8  MouseEvent,9} from "react";10import { ViewTransitionSafe } from "./ViewTransitionSafe";11import { runViewTransition } from "@/lib/view-transition";12 13export type InlineEditProps = Omit<14  InputHTMLAttributes<HTMLInputElement>,15  "value" | "defaultValue" | "onChange" | "onSubmit" | "children" | "type"16> & {17  /** Current text; pair with onCommit for controlled use. */18  value?: string;19  /** Initial text for uncontrolled use. */20  defaultValue?: string;21  /**22   * Called with the committed text on Enter or blur. Return a promise to23   * show a pending state until the save resolves — a rejection keeps the24   * editor open with an error.25   */26  onCommit?: (value: string) => void | Promise<void>;27  /** Called when editing is cancelled via Escape or the cancel button. */28  onCancel?: () => void;