A two-field toolbar label that degrades predictably as its slot narrows: the secondary field
clips with an ellipsis, then disappears, leaving the primary field alone. A tooltip carries the
complete text whenever what is rendered is not all of it.
The ellipsis step needs no JavaScript. Both fields can shrink, but the secondary is weighted to
absorb ~all of it, so it clips to nothing before the primary gives up a character — and the
primary keeps an ellipsis of its own rather than being cut mid-glyph by the trigger's
overflow-hidden. Only the abbreviation and dropped steps need the caller to say so.
A two-field toolbar label that degrades predictably as its slot narrows: the secondary field clips with an ellipsis, then disappears, leaving the primary field alone. A tooltip carries the complete text whenever what is rendered is not all of it.
The ellipsis step needs no JavaScript. Both fields can shrink, but the secondary is weighted to absorb ~all of it, so it clips to nothing before the primary gives up a character — and the primary keeps an ellipsis of its own rather than being cut mid-glyph by the trigger's
overflow-hidden. Only the abbreviation and dropped steps need the caller to say so.