Component gallery

Icon

The named icon registry: string keys the whole kit accepts, rendered through one component at any size or color.

The registry, searchable

Every key in IconFor, filtered by substring; a tile copies its Icon prop
84 of 84

Sizes

Below 16px the SVG scales down instead of shrinking natively
12px
16px
20px
24px
32px
48px

Loading

loading, the LoadingIcon sentinel, and a custom loading node all reach the same slot
custom loading node

Dev-only fallback

An unrecognized key never crashes in production; in development it pings red

What each app actually renders

walmart-mvp and speedway's own icon maps, scanned from source, plus the promotion shortlist

walmart-mvp

37 concepts, all resolve to kit keys

homeHome
importPlus
jobsPackage
activePartsClipboardCheck
partTypePartType
unlistedPartsClock
errorsWarning
processingPackage
liveSuccess
scrapedGlobe
imagesImage
contentPencil
attributesTag
autoResolvedZap
manualResolvedCheck
publishedSuccess
liveThisMonthTrendingUp
settingsSettings
adminLockLock
teamTeam
tableTable
databaseDatabase
searchSearch
linkExternalLinkExternal
infoInfo
documentDocument
uploadUpload
refreshRefresh
trashTrash
playPlay
spreadsheetSpreadsheet
workflowWorkflow
eyeEye
downloadDownload
ignoreIgnore
closeClose
rightArrowRightArrow

speedway

24 concepts, all resolve to kit keys

homeHome
filesFileSheet
jobsTable
reviewReview
auditLogDocument
exportDownload
taxonomyFolder
attributesSpreadsheet
accountsTeam
usageStar
queuedClock
runningRefresh
ingestingUpload
doneCheck
errorError
needsReviewReview
menuMenu
signOutSignOut
adminAdmin
notificationNotification
filterFilter
sparkleSparkle
helpHelp
stampStamp

Promotion shortlist

No glyph rendered here on purpose: none of these resolve to a kit key yet.

TbInputSearchIngestion cycle frame 1, no kit key yetspeedway/app/components/IconCycle.tsx:2, 71
TbInputSparkIngestion cycle frame 2, no kit key yetspeedway/app/components/IconCycle.tsx:2, 71
RxInputIngestion cycle frame 3, no kit key yetspeedway/app/components/IconCycle.tsx:3, 71
RiToggleFill / RiToggleLineAlready in the kit as Toggle / ToggleOff, app has not migratedspeedway/app/routes/workspaces/modules.tsx:24, 841, 906
TbRefreshDotAlready in the kit as Workflow, app has not migratedspeedway/app/lib/modules/meta.ts:3, 10

What icons do across the kit

Every component type that carries an icon prop, one fragment each
PageTitle, icon disc

Jobs

37 jobs across 4 modules
Button, leading icon and a loading one
StatTile, leading glyph
Jobs
37
EmptyState, state icon

No jobs yet

Create a job from your files.

StatusPill, leading glyphNeeds attention
ListItem, leading icon
AC Delco Q3.csv2,412 rows
2h ago
Tooltip trigger, RenderIcon beside textCoverage counts mapped attributes only
RenderIcon inline in a table cell
JobModuleStatus
job_9421Part TypeComplete
job_9420ScrapeNeeds attention
job_9419NormalizeRunning
Dropzone, center glyph

Drop a catalog file

CSV or XLSX

Chip, with an Icon

Styling slots

RenderIcon's own two slots; every component's iconClassName documents on that component's own page
className
the svg itself
loadingClassName
the loading placeholder swapped in for the icon
@versable-git/ui · all states, both themes