Editable

The Editable component shows preview text that switches to an input when you edit.

The Editable component shows preview text that switches to an input when you edit. Every interaction, activating edit mode, typing, saving, and canceling is handled with built-in accessibility, so it works well for all users. Key features Compatible with Framer native forms Built-in accessibility for readable, usable interactions Works on desktop and mobile Single-line inline editing with preview and input modes Icon triggers for Edit, Save, and Cancel Activation by focus, click, double-click, or programmatic control Submit on Enter, blur, both, or via the Save button Separate styling for preview (read-only text) and input (edit mode) Highly customizable: fonts, colors, borders, radii, padding, and more in Framer Keyboard support: Enter to save, Escape to cancel Ideal for Inline editing in tables and lists User profiles and settings CMS-style content editing Any flow that needs quick single-line edits without a separate form License Your Pro License includes: Single user license Use on unlimited sites Use for unlimited clients Restrictions: Not for resale or sharing in component libraries or templates. Contact me for custom license plans. Support Contact me at info@netoum.com

Native Editable Framer Form