feat(core): color a dock-bar entry's badge via a new badgeVariant field - #528
feat(core): color a dock-bar entry's badge via a new badgeVariant field#528dvcolomban wants to merge 2 commits into
Conversation
DockEntry's badge has always been a plain count with a fixed gray fill — no way to distinguish, at a glance, "this count is provisional" from "this is the settled value". json-render's own Tabs component already solved this one level down (TabDescriptor.badgeVariant, with a real variant→color map); this carries that same variant set up to the dock-bar entry itself. badgeVariant is declared via the existing DevframeDockEntryRegistry declaration-merge pattern this package already uses, staying optional so every existing badge consumer keeps its current look unchanged. DockEntry.vue falls back to its pre-existing bg-gray-6/text-white classes at 'default'/ unset, and only switches to an inline-styled fill (reusing Tabs.ts's own colors map) for a non-default variant.
@vitejs/devtools
@vitejs/devtools-kit
@vitejs/devtools-oxc
@vitejs/devtools-rolldown
@vitejs/devtools-vite
@vitejs/devtools-vitest
commit: |
…ents The tab-badge fill (colors[variant].bg, alpha 0.15) read as too faint reused on the dock bar — boosted via CSS relative-color syntax instead of adding a second color table.
|
Thanks for this fix! As of #529, the client UI previously at Since this PR's changes target code that no longer lives here, we're labeling it |
antfubot
added
the
devframe
3 participants
Why
DockEntry's badge is a plain string label with a fixed gray fill — no way to color it. json-render's ownTabscomponent already supports this one level down (TabDescriptor.badgeVariant, with a real variant→color map, used today by tab strips inside a dock's own content); the dock-bar entry itself has no equivalent, even though it's the same kind of label.What changed
badgeVariant?: 'default' | 'info' | 'success' | 'warning' | 'danger'onDevframeDockEntryBase, declared via the samedeclare module '@devframes/hub/types'merge this package already uses forDevframeDockEntryRegistry— no new field on the hub package itself.DockEntry.vue/DockEntries.vuethread it through, reusingTabs.ts's owncolorstoken map rather than inventing a second one.DockEntry.vuefalls back to its pre-existingbg-gray-6/text-whiteclasses at'default'/unset, and only switches to an inline-styled fill for an explicit non-default variant — every existing badge consumer keeps its current look, unchanged.Linked Issues
Additional context
Verified with
pnpm build,pnpm test(updated the public-API.d.tssnapshot for the new export, 381 passing total),pnpm typecheck,pnpm lint— all green.