SidebarMenuBadge

Source: client/lib/theme/vueda-tailwind/navigation/index.js

Count or status badge anchored to a menu button. Tone handling stays local to sidebar tokens and hides in icon-collapsed mode.

Vue component: SidebarMenuBadge

Slot	Default classes	Description
root	callback	Count or status badge anchored to a menu button. Tone handling stays local to sidebar tokens and hides in icon-collapsed mode.

root

Count or status badge anchored to a menu button. Tone handling stays local to sidebar tokens and hides in icon-collapsed mode.

Callback:

({ tone }) => ({
            class: [
                // Positioning and layout.
                "pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-vueda-control px-1",

                // Type.
                "font-mono text-[length:var(--vueda-text-micro)] font-semibold tabular-nums select-none",

                // Size alignment.
                "peer-data-[size=sm]/menu-button:top-1",
                "peer-data-[size=default]/menu-button:top-1.5",
                "peer-data-[size=lg]/menu-button:top-2.5",

                // Tone classes.
                {
                    "bg-sidebar-accent text-sidebar-foreground peer-data-[active=true]/menu-button:bg-[color-mix(in_oklab,var(--sidebar-primary)_14%,transparent)] peer-data-[active=true]/menu-button:text-sidebar-primary":
                        !tone || tone === "neutral",
                    "bg-[color-mix(in_oklab,var(--sidebar-primary)_14%,transparent)] text-sidebar-primary":
                        tone === "primary",
                    "bg-[color-mix(in_oklab,var(--destructive)_14%,transparent)] text-destructive":
                        tone === "destructive",
                },

                // Collapsed state.
                "group-data-[collapsible=icon]:hidden",
            ],
        })

Source: client/lib/theme/vueda-tailwind/navigation/SidebarMenuBadge.theme.js:16