Every component unit in src/lib/components/ is listed here — a unit is a
component file or a directory of coordinated parts — grouped by origin.
Custom and wrapped components (we wrote or extended them) link to a
dedicated page on this site where one exists; vendored primitives used
unmodified link to their official registry docs.
Provenance is recorded in
docs/dev-guide/_extracted/component-provenance.json (hand-maintained). See
UI stack for how the registries layer.
Where new components live. Every component/composable judged reusable
lands in @primebrick/ui (primebrick-v3-ui) at creation — never in
src/lib/components. Remote module bundles can only consume vendored
packages, so anything FE-local is unreachable to remotes: "reusable" and
"FE-local" are contradictory by definition. FE-local code is reserved for
host-shell-only pieces; domain-specific components consumed only by one
service's remote bundle stay in that service's fe/.
Custom components (81)
Built from scratch for Primebrick. Rows marked — have no dedicated page yet —
their props are still in the auto-generated
API reference .
App shell
Component Path Summary Page AppShellsrc/lib/components/AppShell.svelteRoot application shell page AppSidebarsrc/lib/components/AppSidebar.svelteApplication sidebar page AppTopbarsrc/lib/components/AppTopbar.svelteTop bar page AppPageLayoutsrc/lib/components/AppPageLayout.svelteAuthenticated page layout page AppPageScaffoldsrc/lib/components/AppPageScaffold.sveltePage scaffold page AppPageBreadcrumbsrc/lib/components/AppPageBreadcrumb.svelteBreadcrumb segments page AppServerBannersrc/lib/components/AppServerBanner.svelteNon-production backend banner page CommandPalettesrc/lib/components/CommandPalette.svelteGlobal Cmd+K palette page BrowserClientInfosrc/lib/components/BrowserClientInfo.svelteBrowser capability detection page LangSelectsrc/lib/components/LangSelect.svelteLanguage selector page ThemeTogglesrc/lib/components/ThemeToggle.svelteLight/dark toggle page SidebarAppLaunchersrc/lib/components/sidebar/SidebarAppLauncher.svelteFinder-style app/module/page launcher page SidebarHealthBadgesrc/lib/components/sidebar/SidebarHealthBadge.svelteBackend health badge page SidebarOrgSwitchersrc/lib/components/sidebar/SidebarOrgSwitcher.svelteOrg switcher page SidebarProfileMenusrc/lib/components/sidebar/SidebarProfileMenu.svelteProfile menu page SidebarVersionBadgesrc/lib/components/sidebar/SidebarVersionBadge.svelteVersion badge page
Entity list & metadata-driven pages
Component Path Summary Page EntityListTablesrc/lib/components/entity-list-table/Generic controlled list/table/card system page EntityTablePagesrc/lib/components/entity-table-page/Route-level host for entity table pages — owns useEntityList and renders EntityListTable section
Config entries (metadata-driven config)
Component Path Summary Page config-listsrc/lib/components/config-list/Config entries list — ConfigList + ConfigListRow + ConfigBulkActionBar + ConfigValueInput — config-buildersrc/lib/components/config-builder/TypeConfigBuilder + sections (validation rules, widget config, select-source, JSON preview) — BadgeValuesEditorsrc/lib/components/config-builder/BadgeValuesEditor.svelteBadge value list editor page
Anchor tabs
Component Path Summary Page anchor-tabssrc/lib/components/anchor-tabs/URL-anchor tab set — anchor-tabs + anchor-tabs-list + anchor-tabs-trigger + anchor-tabs-content + anchor-tabs-mode-switch —
Remote pages
Component Path Summary Page RemotePageMountsrc/lib/components/remote-page/RemotePageMount.svelteMount point for remote ESM page modules (mountPage(el, ctx)) — RemoteMountSlotsrc/lib/components/remote-page/RemoteMountSlot.svelteNamed slot that a remote module mounts into — PageSectionSlotsrc/lib/components/remote-page/PageSectionSlot.svelteLayout-section dispatch host (layout.sections) — HostMountShellsrc/lib/components/remote-page/HostMountShell.svelteShell wrapper hosting remote mounts — RemotePageErrorPanelsrc/lib/components/remote-page/RemotePageErrorPanel.svelteRemote-page load/mount error surface —
Error page
Component Path Summary Page ErrorPagesrc/lib/components/error-page/ErrorPage.svelteFull-page error surface —
Shell infrastructure
Component Path Summary Page sheet-panelsrc/lib/shell/sheets/Global side-sheet host + panels (ErrorsPanel, DocsPanel, VersionsPanel, …) page
Forms
Component Path Summary Page button (async)src/lib/components/button.svelteButton wrapper with loading + onClickPromise page FormPageLayoutsrc/lib/components/FormPageLayout.svelteEntity form page layout page FormLabelWithPriorityHelpsrc/lib/components/forms/FormLabelWithPriorityHelp.svelteLabel with priority tooltip page PasswordChecklistsrc/lib/components/forms/PasswordChecklist.sveltePassword policy checklist page otp-input@primebrick/ui (OtpInput)OTP code input (over the input-otp primitive, also @primebrick/ui) — ComboSelectsrc/lib/components/ui/combo-select/Searchable single/multi select with typed display templates page SliderFieldsrc/lib/components/ui/slider-field/Nullable range slider — NULL = inherit, no numeric input page SwitchFieldsrc/lib/components/ui/switch-field/Labelled switch — switch + label + optional sublabel + help tooltip (mandatory standard) page SelectableFieldsetsrc/lib/components/ui/selectable-fieldset/Grouped content box — gradient label over gradient border (mandatory standard) page ColorSelectorsrc/lib/components/ui/color-selector/Curated palette + native color input page Choiceboxsrc/lib/components/ui/choicebox/Radiogroup-style selectable card list page date-wheel-pickersrc/lib/components/date-dropper/date-wheel-picker.svelteDate/time picker on wheel-picker page email-inputsrc/lib/components/ui/email-input/Email input with validation chrome — numeric-inputsrc/lib/components/ui/numeric-input/Numeric input with formatting — phone-inputsrc/lib/components/ui/phone-input/Phone input with prefix selection — url-inputsrc/lib/components/ui/url-input/URL input with validation chrome —
Display & feedback
Component Path Summary Page DynamicIconsrc/lib/components/ui/dynamic-icon/Runtime Lucide™ icon by name page ai-iconsrc/lib/components/ui/ai-icon/AI feature icon — bot-iconsrc/lib/components/ui/bot-icon/Bot/agent icon — gradient-iconsrc/lib/components/ui/gradient-icon/Gradient-tinted icon tile — AvatarPreviewsrc/lib/components/ui/avatar-preview/Initials + color avatar preview page EventCardsrc/lib/components/ui/event-card/Error/notification event card page EventToastsrc/lib/components/toasts/EventToast.svelteEvent toast via svelte-sonner page LoadingBarsrc/lib/components/ui/loading-bar/Indeterminate loading bar page MetadataLoadingsrc/lib/components/ui/metadata-loading/List metadata loading placeholder page JsonTableViewersrc/lib/components/ui/JsonTableViewer.svelteJSON as readable table page json-code-blocksrc/lib/components/ui/json-code-block/JSON code block with syntax chrome — NumberTickersrc/lib/components/ui/number-ticker/Animated count-up number for KPI values (UoM attached) page StatCardsrc/lib/components/ui/stat-card/KPI stat card — label + animated value + icon column page Toolbarsrc/lib/components/ui/toolbar/Action strip — enforced CTA ordering (groups/refresh/primary), card or bare page realtime-metersrc/lib/components/ui/realtime-meter/Realtime metric meter — refresh-buttonsrc/lib/components/ui/refresh-button/Refresh action button — dialog-borderedsrc/lib/components/ui/dialog-bordered.svelteSeverity-accented dialog wrapper page entity-confirm-dialogssrc/lib/components/entity-list-table/dialogs/Entity delete/restore dialogs (title + body from translation keys) page rfc-error-dialogsrc/lib/components/ui/rfc-error-dialog.svelteRFC7807 error dialog page
Smart components
Component Path Summary Page smart-regex-inputsrc/lib/components/ui/smart-regex-input/Regex input with AI assistance page smart-aisrc/lib/components/ui/smart-ai/AI assistant surfaces (action chips, chat panel, cerebellum selector, …) — smart-guidesrc/lib/components/ui/smart-guide/AI guided-flow surfaces — smart-json-assistantsrc/lib/components/ui/smart-json-assistant/AI-assisted JSON editing — smart-json-configsrc/lib/components/ui/smart-json-config/AI-assisted JSON config editing —
Auth
Component Path Summary Page LoginFormsrc/lib/components/auth/LoginForm.svelteLogin form page PasskeyButtonsrc/lib/components/auth/PasskeyButton.svelteWebAuthn passkey trigger page PasskeyEnrollmentsrc/lib/components/auth/PasskeyEnrollment.sveltePasskey enrollment UI page PasskeyEnrollmentSectionsrc/lib/components/auth/PasskeyEnrollmentSection.svelteSettings-section wrapper for passkey enrollment — AuthMethodsPromptDialogsrc/lib/components/auth/AuthMethodsPromptDialog.sveltePost-login passkey/MFA prompt page SessionExpiredDialogsrc/lib/components/auth/SessionExpiredDialog.svelteSession expiry dialog page ChangePasswordCardsrc/lib/components/auth/ChangePasswordCard.svelteChange-password card — LoadingWatermarksrc/lib/components/auth/LoadingWatermark.svelteWatermark shown while auth screens load — MfaChallengesrc/lib/components/auth/MfaChallenge.svelteMFA challenge step — MfaEnrollmentSectionsrc/lib/components/auth/MfaEnrollmentSection.svelteSettings-section wrapper for MFA enrollment — MfaManagementsrc/lib/components/auth/MfaManagement.svelteManage enrolled MFA factors — MfaStepUpDialogsrc/lib/components/auth/MfaStepUpDialog.svelteStep-up MFA verification dialog —
Wrapped shadcn-svelte™ primitives (6)
Vendored from shadcn-svelte™ and extended with Primebrick-specific additions.
Component Path Extension Page buttonsrc/lib/components/ui/button/variant × tone matrix (gradient semantic tones) page inputsrc/lib/components/ui/input/async-validated-input, text-input, input-chrome.tspage slidersrc/lib/components/ui/slider/range-slider.sveltepage tooltipsrc/lib/components/ui/tooltip/tooltip-portal, priority-tooltip-contentpage formsrc/lib/components/ui/form/TranslatedFieldErrorspage PrimeFieldsrc/lib/components/ui/form/prime-field.svelteStandalone field-row wrapper (label + help + hint + errors, non-superforms) page
more-shadcn-svelte™ (5)
Vendored from more-shadcn-svelte™ . Assumed
unmodified; phase 2 page authoring will confirm.
Vendored from shadcn-svelte-extras™ .
Assumed unmodified; phase 2 page authoring will confirm.
Component Path Official docs copy-buttonsrc/lib/components/ui/copy-button/copy-button passwordsrc/lib/components/ui/password/password windowsrc/lib/components/ui/window/window
shadcn-svelte™ primitives (30, unmodified)
Vendored from shadcn-svelte™ and used as-is.
Learn them on the official site; full prop tables are in the
API reference .
accordion · alert · avatar · badge · breadcrumb · button-group ·
card · checkbox · command · dialog · dropdown-menu · input-group ·
kbd · label · popover · resizable · scroll-area ·
separator · sheet · sidebar · skeleton · sonner · spinner ·
switch · table · tabs · textarea · toggle
Next steps
Last modified on October 28, 2026
