Pattern — Inline edit

Status: v0.1.0 — Draft. Promoted from the Atlassian Design parity scan (meta/docs/stack #088). Source: https://atlassian.design/components/inline-edit/

R1 — When to use

Use inline edit for one value the user changes occasionally in context (a title, a status, a single field). Do NOT use it for:

• multi-field input → a form / specs/patterns/one-thing-per-page.kmd;
• long rich text → a dedicated editor;
• frequently-changing controls that should always be inputs (a search box).

R2 — Read view + affordance

• The value renders as text with an edit affordance revealed on hover and on keyboard focus (a pencil icon / underline) — never an invisible hit target.
• The read view is a single keyboard-focusable control; activating it (click / Enter / Space) enters edit mode.

R3 — Edit mode

• An input replaces (or overlays at the same position to avoid layout jump) the read view, pre-filled with the current value and selected for easy replace.
• The input type matches the value (text, number, select, date); for a constrained set use a select, not free text.

R4 — Commit & cancel

• Enter or blur/click-away commits; Esc cancels and reverts to the prior value; Tab commits and moves focus on (in a grid context, to the next editable cell — the specs/components/data-table.kmd R8 specialization).
• An explicit confirm/cancel control pair MAY be shown for touch/ambiguous cases; the keyboard rules above still hold.

R5 — Validation & async save

• Validate on commit; an invalid value keeps edit mode open with an inline error (specs/errors/user-facing-messages.kmd), never silently dropping input.
• While saving, show a pending state (specs/interaction/states.kmd); on failure, revert OR re-open with the error — the user's typed value is never lost without a path to recover it.

R6 — Accessibility

• The read view announces that it is editable ("Edit {label}"); entering edit mode moves focus into the input with its label associated.
• Commit/cancel outcomes and validation errors are announced to assistive tech.
• The whole cycle is operable by keyboard alone (no hover-only path).

Não-escopo

• Multi-field forms and wizards.
• Rich-text / WYSIWYG editing.
• The data-table grid mechanics (cell navigation) — specialized in specs/components/data-table.kmd.
• Real-time collaborative editing / presence.