SuggestionList

Overview

Typed "Did you mean?" suggestion list for system 404 views. Renders an uppercase head row with a mono source label above a bordered list of clickable router-link rows. Two layout shapes are supported: route (similarity score chip in the trailing column) and action (HTTP verb chip). Each row is a 4-column grid: 24 px icon · 1fr label+sub · auto trailing · auto chevron. Kit canon: "At scale, 'Did you mean?' is a piece of UI, not a sentence."

Theme entry: SuggestionList

Props

Name	Type	Required	Default	Description
iconOverride	Object		null	A partial icon registry ({ [componentName]: { [iconName]: { component, props } } }) merged with inherited and default icon entries; scopes icon overrides to this component and its descendants.
themeOverride	String|Object|Array		null	A partial theme object merged with the component's default theme; accepts a class string, class array, or theme object.
items	{ icon?: import('vue').Component, label: string, sub?: string, score?: number, verb?: string, to: import('vue-router').RouteLocationRaw }[]		[]	Suggestion rows. Each entry becomes one navigable row.
head	string		undefined	Uppercase head label displayed above the list (e.g. "Did you mean" or "Available actions").
source	string		undefined	Mono source label beside the head (e.g. "router.suggest()").
shape	string		"route"	Row layout variant. route shows a similarity score chip in the trailing column; action shows an HTTP verb chip.
class	import('vue').HTMLAttributes['class']		undefined	Additional CSS classes applied to the root element.

Source

client/lib/display/system-message/SuggestionList.vue