Element: #239 Leading icons and brand logos (navigation/menu) What it shows: A dropdown menu of agents where brand-colored icons opt out of the item's text color, including a scheme-aware monochrome mark. When to use: Pickers that list third-party products or agents with their real logos, such as a new-tab or integration menu. Spec: - `` with `{#snippet triggerChild(props)}` rendering `New tab` - `Agents` followed by 4 items: Shell, Claude Code, Codex, Coming soon - Shell uses `{#snippet icon()}{/snippet}`; Claude Code and Codex set `brandIcon` so the inline `svg` keeps its own colors - Codex wraps `` with `{#snippet light()}` and `{#snippet dark()}` svg variants - Last item is `brandIcon disabled` - Each item sets `last` through `onclick`, shown as `Opened: {last}` with `aria-live="polite"` Tags: dropdown-menu, menu, brand-icon, scheme-asset, dark-mode, icon, disabled Needs: @codeatlasdev/ui@4.4.0 Components: DropdownMenu, DropdownMenuItem, DropdownMenuLabel, SchemeAsset, Button Live demo: https://ui.codeatlas.com.br/docs/navigation/menu#leading-icons-and-brand-logos {#snippet triggerChild(props)} New tab {/snippet} Agents (last = 'Shell')}> {#snippet icon()}{/snippet} Shell (last = 'Claude Code')}> {#snippet icon()} {/snippet} Claude Code (last = 'Codex')}> {#snippet icon()} {#snippet light()}{/snippet} {#snippet dark()}{/snippet} {/snippet} Codex {#snippet icon()} {/snippet} Coming soon {#if last}Opened: {last}{/if}