EditableHeading

A click-to-edit heading. At rest it renders a real <h1><h4> whose text doubles as a button affordance; activating it swaps in an Input seeded with the current value. Enter or blur commit, Esc cancels and reverts. This is a presentational styled shell — it owns no editor engine. It is fully controlled via value / onChange; the consuming app wraps it to wire real document state.

Default — h2, click or focus + Enter to edit

value = "Compliance Overview"

Levels 1–4 (type ramp follows the heading element)

Empty — placeholder shows until committed

value = ""

Read-only — display only, no edit affordance

Imperative handle — a parent (e.g. the editor) drives edit mode