Inline edit
An inline edit displays a custom input component that switches between reading and editing on the same page.
When to use
- A single value a reader changes occasionally in place, such as a title or an owner.
- A field where the reading view matters more than the editing view, which is most detail panels.
- Somewhere a full form would be more machinery than the one value deserves.
When not to use
- Several fields that should be saved together. That is a form, with one submit.
- A value with consequences, where a stray click should not be able to change it.
- A required value on first entry. An empty inline edit looks like text rather than a field waiting to be filled.
Guidance
Do
Show the value as text and let the reader click into it. The reading view is the one they see most.
Don't
Do not use an inline edit for a value that has to be filled in. An empty one reads as a hint rather than as a field.
Intensity
What each of this component's grounds spends, measured against the ladder in both themes.
| Appearance | Ground | Light | Dark |
|---|---|---|---|
| inline-edit | neutral | 0.042Ambient | 0.066Substrate |
Substrate, Ambient and Marked are measured. Directed depends on what else is in the region, and Demanded is declared and rationed, so neither is a property this component carries by itself. See intensity.
Content
What to write, and what to leave out.
- The label names the value, as in Queue name.
- The placeholder says what belongs there, not what to do. A queue name, rather than Click to enter a value.