Components / Save Bar
Save Bar
The commit row for an inline edit on a page: a table of checkboxes, a settings block, a picker. It sits directly under the thing it commits, right-aligned, and renders only while there are unsaved changes.
import { SaveBar } from '@layers/ui/save-bar'Rendered stock
House rules
- Bottom right of the thing being edited, never at the top of a card (founder ruling 2026-09-27). The eye finishes the edit where the edit ends.
- Only while dirty. A Save with nothing to save is a dead affordance, and dead affordances are removed, not disabled. saveDisabled is for "not valid yet" only.
- One place, one meaning. The control that edits never turns into Cancel or Save in place; this row appears beneath it instead.
- The summary says what is pending in a few words: "2 selected · 1 change". Omit it when the edit is one field.
- saveLabel names the outcome when "Save" undersells it: "Connect Account", "Save Key". Discard is always the way back.
- A sheet whose whole body is one form keeps CanvasSheetFooter. This is for inline, per-section commits on a page.