Label Manager
Label settings panel with a ruled table of color-swatched labels, message counts, rename and delete actions, an inline create row, and a drag-to-nest note.
Label settings panel with a ruled table of color-swatched labels, message counts, rename and delete actions, an inline create row, and a drag-to-nest note.
The Application Collection unlocks the source for every Application block. All Access unlocks every Collection.
Already purchased? Log in
Label Manager is the settings panel for organizing Acme inbox labels, a ruled table of six rows each carrying a theme-token color swatch, label name, message count in tabular-nums, and inline rename and delete icon buttons. Roadmap, Engineering, Finance, Design, and Legal sit at the root level; Q2 Planning is indented beneath Roadmap with an arrow glyph to show nesting. A create-label row at the bottom pairs a dashed placeholder swatch with an inline Input and a Create button. A note below the table explains drag-to-nest and how nested labels appear indented in the sidebar.
Label rows are one typed const array; the indented field drives the pl-10 and arrow glyph conditions so nesting is visible in a static render without drag state. Color swatches use chart token classes so they respect the active theme.
Reach for this block on the labels settings page of a mail product, wired to your label CRUD endpoints. Wire the rename button to an inline edit field, delete to a confirmation dialog, and the Create button to your POST route.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the workspace label administration panel. Other label manager configurations:
Tip: the create row inline in the table is faster than a separate dialog and keeps the user in context while they add multiple labels in a row.