Auto-generated by scripts/hooks/component-catalog.ts from exported UI entries under
src/ui (.tsx React components, ADR-008) and exported create/build/swatch/inject helpers in
src/ui/_shared (.ts). Do not hand-edit: regenerate with
bun run scripts/hooks/component-catalog.ts. A
pre-commit gate (--check) fails the commit when this file drifts from the real exports.
| Name | File | Signature | Doc | Styles |
|---|---|---|---|---|
| AltFields | src/ui/components/alt-fields/index.tsx | ({ value, onChange }: AltFieldsProps) | .wrap .section .gtitle | |
| AnimatedThemeToggler | src/ui/components/animated-theme-toggler/index.tsx | ({ theme, onToggle, duration = 400, fromCenter = false, id, }: AnimatedThemeTogglerProps) | Switch between paper and stage with a reveal that grows from the control. | .iconStack .hidden .shown |
| App | src/ui/shell/App.tsx | () | ||
| AppCatalog | src/ui/apps/app-catalog/index.tsx | ({ ctx }: { ctx: AppContext }) | Browse and open every official app packaged in this build. | .room .head .eyebrow .status .title .lede .description .grid ... |
| AppMark | src/ui/components/app-mark/index.tsx | ({ markSvg, className }: AppMarkProps) | Render one sanitized application mark. | |
| AssetManager | src/ui/components/asset-manager/index.tsx | ({ assets, onChange, onOpenSprites }: AssetManagerProps) | .wrap .group .ghead .handoff .handoffBtn .tiles .tile .preview ... | |
| AttachLoreDialog | src/ui/components/attach-lore-dialog/index.tsx | ({ books, alreadyLinked, onConfirm, onDismiss, }: AttachLoreDialogProps) | .sheet .body .kick .h .p .empty .list .row ... | |
| AttachPanel | src/ui/components/sprite-pack/dialog-panels.tsx | ({ packCatalog, attachId, attachBusy, onAttachId, onAttach, }: { packCatalog: readonly PackCatalogEntry[]; attachId: ... | .sheet .head .title .closeX .bar .lbl .sel .meta ... | |
| AvatarCrop | src/ui/components/avatar-crop/index.tsx | ({ value, onChange, imageSrc }: AvatarCropProps) | .wrap .help .meta .actions .btn .row .canvas .img ... | |
| BenchImport | src/ui/apps/workbench/regex/bench-import.tsx | ({ ctx, sample, existingRules, onImportPicked, }: BenchImportProps) | ||
| BenchPane | src/ui/apps/workbench/regex/bench-pane.tsx | ({ ctx, rules, initialTab = "try", onClose, onImportPicked, }: BenchPaneProps) | ||
| BentoCard | src/ui/components/bento-card/index.tsx | ({ title, icon, aff, filled, off, offMode = "dim", missing, onMove, children }: BentoCardProps) | One card of the editor bento. Folds from its chevron; lens states per vs-editor-2. | .card .off .head .mark .title .aff .dot .full ... |
| BentoView | src/ui/apps/workbench/presenters/bento-view.tsx | ({ bcard, leftCard, sealedCard, macroCard, columns, spanRow, styles }: BentoViewProps) | ||
| BinderSide | src/ui/apps/workbench/lore/binder-side.tsx | ({ sidePane, setSidePane, body, baseline, entry, notes, styles, setSession, extraFindings, }: BinderSideProps) | ||
| BlockContent | src/ui/apps/workbench/preset/block-content.tsx | ({ block, onPatch }: BlockContentProps) | ||
| BlockList | src/ui/apps/workbench/preset/block-list.tsx | ({ blocks, groups = [], collapsedGroups, onToggleGroup, totalBlocks, tab, query, onClearQuery, onShowAll, selectedId,... | ||
| BlockRow | src/ui/apps/workbench/preset/block-row.tsx | ({ block, index, active, selected, expanded, onSelectRow, onToggleCheck, onToggleExpand, onToggle, onDelete, onPatch,... | ||
| BootErrorScreen | src/ui/shell/BootErrorScreen.tsx | ({ problem }: { problem: BootProblem | null }) | ||
| BottomSheet | src/ui/components/bottom-sheet/index.tsx | ({ title, ariaLabel, onDismiss, titleAction, footerAction, children }: BottomSheetProps) | A scrim + grab-handle sheet docked to the pane's bottom; clicking the scrim dismisses. | .overlay .sheet .grab .titleRow .title .closeX .body .footer |
| BulkBar | src/ui/apps/workbench/preset/bulk-bar.tsx | ({ count, onClear, onEnable, onDisable, onDuplicate, onDelete }: BulkBarProps) | ||
| CardsView | src/ui/apps/workbench/lore/cards-view.tsx | ({ entries, writeFor, onSelect, onPatch, onAdd, }: CardsViewProps) | ||
| ChangesPane | src/ui/apps/workbench/lore/changes-pane.tsx | ({ baseline, body, onRevertField, onRestoreEntry, onUndoSwap, onJumpEntry, onClose, }: ChangesPaneProps) | ||
| CharacterEditor | src/ui/apps/workbench/Editor.tsx | ({ entity, revision, ctx, piece, topRight }: CharacterEditorProps) | Build the writable pane for one canonical character (the vs-editor-2 surface, 1:1). | .room .newPackBtn .stage .crumb .pip .cn .cc .pane ... |
| CharacterFilterBlock | src/ui/apps/workbench/lore/platforms/filter-block.tsx | ({ entry, styles, onPatch, }: { entry: LorebookEntry; styles: Readonly<Record<string, string>>; onPatch: (patch: Part... | ||
| ClosePieceDialog | src/ui/shell/ClosePieceDialog.tsx | () | ||
| ClosePiecePrompt | src/ui/shell/ClosePieceDialog.tsx | ({ name, onDiscard, onKeep, }: ClosePiecePromptProps) | ||
| CodeEditor | src/ui/components/code-editor/index.tsx | (props: CodeEditorProps) | ||
| ColorPicker | src/ui/components/color-picker/index.tsx | ({ value, onChange }: ColorPickerProps) | .cp .sv .hue .thumb .foot .chip .hex | |
| ConfirmSwitch | src/ui/apps/settings/sections/updates-dialogs.tsx | ({ installed, target, kind, onConfirm, onCancel, }: { installed: string; target: string; kind: "update" | "rollback";... | Confirm a switch. Rollbacks read as danger; a rollback to a pre-feature version says so plainly. | |
| ContentCard | src/ui/apps/workbench/persona/persona-cards.tsx | ({ body, onBody, writeFor, }: { body: PersonaBody; onBody: OnBody; writeFor: PersonaWriteForProfile; }) | The flat identity text (the whole persona on section-less platforms). | |
| CssAdvancedPane | src/ui/components/css-workshop/advanced-pane.tsx | ({ value, onChange, doc, selected, onSelectRule, onRuleChange, onChip, }: CssAdvancedPaneProps) | Code + breakdown split for advanced authors. | .root .banner .modeToggle .modeBtn .modeOn .tabs .tab .tabOn ... |
| CssAssistPane | src/ui/components/css-workshop/assist-pane.tsx | ({ pack, doc, selected, onSelectRule, onAddRule, onRuleChange, onDeleteRule, }: CssAssistPaneProps) | Structured assist over one rule at a time. | .root .banner .modeToggle .modeBtn .modeOn .tabs .tab .tabOn ... |
| CssSourcePane | src/ui/components/css-workshop/source-pane.tsx | ({ value, onChange, onChip }: CssSourcePaneProps) | Source tab: chips assist, editor is the sheet. | .root .banner .modeToggle .modeBtn .modeOn .tabs .tab .tabOn ... |
| CssStarters | src/ui/components/css-workshop/starters.tsx | ({ packId, packBlurb, onApply }: CssStartersProps) | Recipe list filtered by active target pack. | .root .banner .modeToggle .modeBtn .modeOn .tabs .tab .tabOn ... |
| CssWorkshop | src/ui/components/css-workshop/index.tsx | ({ value, onChange, defaultPackId = "universal", onPackChange, note = DEFAULT_NOTE, mode: modeProp, onModeChange, ini... | Main assisted CSS editor shell. | .root .banner .modeToggle .modeBtn .modeOn .tabs .tab .tabOn ... |
| CssWorkshopRoom | src/ui/apps/css-workshop/room.tsx | ({ ctx }: CssWorkshopRoomProps) | Full app canvas for the CSS Workshop dock tile. | .room .head .titles .eyebrow .title .lede .actions .modeToggle ... |
| DamageNotice | src/ui/apps/library/damage-notice.tsx | (props: { entries: readonly StudioDamagedEntry[]; studioDir?: string; }) | ||
| DocContent | src/ui/apps/docs/doc-content.tsx | ({ doc, docs, figures, body, anchor, loading, onPick }: DocContentProps) | .room .nav .search .shelves .shelf .on .group .section ... | |
| Dock | src/ui/shell/Dock.tsx | () | ||
| DocNav | src/ui/apps/docs/doc-nav.tsx | ({ docs, activeId, query, onQuery, onPick }: DocNavProps) | .room .nav .search .shelves .shelf .on .group .section ... | |
| DocsRoom | src/ui/apps/docs/room.tsx | ({ ctx }: { ctx: AppContext }) | .room .nav .search .shelves .shelf .on .group .section ... | |
| DocToc | src/ui/apps/docs/doc-toc.tsx | ({ anchors, activeSlug, onJump }: DocTocProps) | .room .nav .search .shelves .shelf .on .group .section ... | |
| DropVeil | src/ui/shell/DropVeil.tsx | () | ||
| EditorDialogs | src/ui/apps/workbench/presenters/editor-dialogs.tsx | ({ exportOpen, setExportOpen, spritesOpen, setSpritesOpen, setSpritesFocusLabel, spritesFocusLabel, namedOpen, setNam... | ||
| EditorEhead | src/ui/components/editor-ehead/index.tsx | ({ mark, name, onNameChange, namePlaceholder, nameAriaLabel, meta, dirty, saving, onSave, saveTitle = "Save · ctrl+s"... | .ehead .spine .spineMark .spineText .spineName .spineMeta .acts .save | |
| EditorHeader | src/ui/apps/workbench/presenters/editor-chrome.tsx | ({ name, version, onClose, editorScale, stepScale, setEditorScale, scaleMin, scaleMax, onboarded, mode, setMode, edit... | ||
| EditorLeftCard | src/ui/apps/workbench/presenters/editor-left.tsx | ({ artUrl, draft, piece, vary, styles, setField, mediaCaps, spriteCount, namedCount, setSpritesOpen, setSpritesFocusL... | ||
| EditorModeBar | src/ui/apps/workbench/presenters/editor-modebar.tsx | (props: EditorModeBarProps) | ||
| EditorTabstrip | src/ui/apps/workbench/presenters/editor-chrome.tsx | ({ coverage, targets, platformLabel, toggleTarget, clearTargets, offTarget, pickOffTarget, lensActive, lensVisibleCou... | ||
| EntryTocItem | src/ui/apps/workbench/lore/entry-toc-item.tsx | ({ entry, writeFor, styles, categories, onPatch, onOpen, onDuplicate, onDelete, onOpenBeside, }: EntryTocItemProps) | ||
| EntryWhenWhere | src/ui/apps/workbench/lore/entry-when-where.tsx | ({ entry, writeFor, styles, onPatch, folds, onFoldToggle, }: EntryWhenWhereProps) | ||
| ExampleMode | src/ui/apps/workbench/regex/example-mode.tsx | ({ exampleText, styles, onChangeExamples }: ExampleModeProps) | ||
| ExportDialog | src/ui/components/export-dialog/index.tsx | ({ ctx, entity, name, hasPackage = false, onClose, }: ExportDialogProps) | .sheet .title .sub .chips .chip .list .opt .optOn ... | |
| ExpressionGroups | src/ui/components/expression-map/groups.tsx | ({ value, onChange }: ExpressionGroupsProps) | .wrap .note .row .k .lbl .sel .gtitle | |
| ExpressionMap | src/ui/components/expression-map/index.tsx | ({ value, onChange, hideEnabled }: ExpressionMapProps) | .wrap .note .row .k .lbl .sel .gtitle | |
| ExpressionStage | src/ui/components/expression-stage/index.tsx | ({ pack, profile }: ExpressionStageProps) | .wrap .seal .row .face .moods .mood .moodOn .ta ... | |
| FieldForm | src/ui/components/field-form/index.tsx | ({ fields, value, onChange }: FieldFormProps) | .grid .field .half .label .text .num .sel .rmax ... | |
| FinePrint | src/ui/apps/workbench/regex/fine-print.tsx | ({ rule, rules, writeFor, styles, onPatch }: FinePrintProps) | ||
| FlowView | src/ui/apps/workbench/presenters/flow-view.tsx | (props: FlowViewProps) | ||
| FocusToggle | src/ui/components/focus-toggle/index.tsx | ({ focused, onToggle }: FocusToggleProps) | The expand/shrink icon button. Static first-party markup parsed via DOMParser + importNode | .btn |
| FolderInspector | src/ui/apps/workbench/lore/folder-inspector.tsx | ({ category, categories, edges, collapsed, styles, onRename, onMove, onToggleEnabled, onClone, onToggleCollapse, onDe... | ||
| FollowDialog | src/ui/shell/FollowDialog.tsx | () | ||
| GalleryPane | src/ui/apps/workbench/regex/gallery-pane.tsx | ({ onPick, onStartBlank, onClose }: GalleryPaneProps) | ||
| GradientControl | src/ui/apps/workbench/controls/color-controls.tsx | ({ value, onChange, styles }: GradientControlProps) | ||
| HealthPane | src/ui/apps/workbench/lore/health-pane.tsx | ({ body, onTransform, onJumpEntry, onClose, extraFindings = [], }: HealthPaneProps) | ||
| HealthPane | src/ui/apps/workbench/regex/health-pane.tsx | ({ findings, rules, onClose, onGoTo, onFix }: HealthPaneProps) | ||
| HelpDot | src/ui/apps/workbench/preset/help-dot.tsx | ({ help }: { help: FieldHelp }) | ||
| IconBox | src/ui/components/icon-box/index.tsx | ({ svg, size = 2 }: IconBoxProps) | A bordered square that parses and mounts a static SVG mark. | .box |
| IdentityCard | src/ui/apps/workbench/persona/persona-cards.tsx | ({ body, onBody }: { body: PersonaBody; onBody: OnBody }) | Identity: tagline + pronouns/height/age + the BRIEF with its never-injected honesty line. | |
| ImagePromptEditor | src/ui/components/image-prompt/index.tsx | ({ value, onChange }: ImagePromptEditorProps) | .wrap .section .lbl .input .ta .rows .row .rm ... | |
| ImportOverlay | src/ui/apps/library/import-flow.tsx | ({ state, onCommit, onCancel, onAddMore, }: { state: ImportState; onCommit: (checkedIndexes: number[]) => void; onCan... | ||
| InjectionCard | src/ui/apps/workbench/persona/injection-card.tsx | ({ body, onBody, stops, labels, showWrapper }: InjectionCardProps) | ||
| InkDialog | src/ui/components/ink-dialog/index.tsx | ({ children, onDismiss, ariaLabel, sheetClassName }: InkDialogProps) | A centered modal sheet over a dark scrim; clicking the scrim or pressing Escape calls onDismiss. | .overlay .sheet |
| KeywordChips | src/ui/apps/workbench/lore/keyword-chips.tsx | ({ triggers, onChange, styles, placeholder, ariaLabel, advanced = false, pickedIndex, onPick, entryProbability = 100,... | ||
| KnowledgeRail | src/ui/apps/workbench/lore/KnowledgeRail.tsx | ({ ctx, refs, onChange }: KnowledgeRailProps) | ||
| LanCard | src/ui/apps/settings/sections/lan-card.tsx | ({ ctx, hidden, redacted, }: { ctx: AppContext; hidden: boolean; redacted: boolean; }) | ||
| LeavingGate | src/ui/components/leaving-gate/index.tsx | () | .scrim .card .kicker .lede .badge .tile .globe .pname ... | |
| LensRail | src/ui/components/lens-rail/index.tsx | ({ platforms, selected, onToggle, onClear, offTarget, onOffTarget }: LensRailProps) | One-line sideways-scrolling lens chips; Hoplight (full card) first, off-target mode at the tail. | .rail .scroll .chip .on .offt .fade |
| LinkOut | src/ui/components/link-out/index.tsx | ({ icon, title, meta, action, onAction, empty, emptyLabel }: LinkOutProps) | .row .ic .body .title .meta .go .pending .empty | |
| ListEditor | src/ui/components/list-editor/index.tsx | ({ items, fields, onChange, addLabel, itemTitle, makeItem }: ListEditorProps) | .wrap .item .ihead .ititle .rm .add | |
| ListToolbar | src/ui/apps/workbench/preset/list-toolbar.tsx | ({ counts, query, onQuery, tab, onTab, onExpandAll, onCollapseAll, onAdd, onAddCategory, }: ListToolbarProps) | ||
| LiveBuild | src/ui/apps/workbench/preset/live-build.tsx | ({ body, onSelect }: LiveBuildProps) | ||
| LorebookEditor | src/ui/apps/workbench/LorebookEditor.tsx | ({ entity, revision, ctx, piece, topRight }: LorebookEditorProps) | .room .newPackBtn .stage .crumb .pip .cn .cc .pane ... | |
| LoreBookSettings | src/ui/apps/workbench/lore/book-settings.tsx | ({ body, styles, onBook }: BookSettingsProps) | ||
| LoreBulkBar | src/ui/apps/workbench/lore/bulk-bar.tsx | ({ count, styles, onEnable, onDelete, onClear, onMove, }: BulkBarProps) | ||
| LoreCategories | src/ui/components/lore-categories/index.tsx | ({ categories, onChange }: LoreCategoriesProps) | .wrap .head .label .add .empty .list .row .name ... | |
| LoreEntryPage | src/ui/apps/workbench/lore/entry-page.tsx | ({ entry, writeFor, styles, onPatch, index, count, onPrev, onNext, tokenEstimate, prefs, }: EntryPageProps) | ||
| LoreEntryRail | src/ui/apps/workbench/lore/entry-rail.tsx | ({ body, focusedId, entries, notes, styles, onOpenHealth, onOpenChanges, onOpenRehearsal, onSelectEntry, }: EntryRail... | ||
| LoreEntryToc | src/ui/apps/workbench/lore/entry-toc.tsx | ({ entries, focusedId, writeFor, styles, categories = [], onSelect, onAdd, onPatch, onDuplicate, onDelete, onReorder,... | ||
| LoreSpecialTriggers | src/ui/components/lore-special-triggers/index.tsx | ({ triggers, onChange, advanced = false, }: LoreSpecialTriggersProps) | .wrap .trigger .triggerOn .menu .section .note .item .itemLabel ... | |
| LoreWorkshopDialog | src/ui/apps/library/lore-workshop-dialog.tsx | ({ ctx, state, onDone, onDismiss, }: LoreWorkshopDialogProps) | ||
| MacroAssist | src/ui/apps/workbench/workshop/macros/chips.tsx | ({ value, onInsert, vars }: MacroAssistProps) | ||
| MacroReference | src/ui/apps/workbench/preset/macro-reference.tsx | ({ groups }: MacroReferenceProps) | ||
| MarinaraFolderToc | src/ui/apps/workbench/lore/folder-toc.tsx | ({ entries, categories, edges, focusedId, selectedFolderId, collapsed, writeFor, styles, bookName, onSelectEntry, onS... | ||
| Menu | src/ui/shell/Menu.tsx | () | ||
| MiniSelect | src/ui/apps/workbench/workshop/mini-select.tsx | ({ opts, value, onChange }: MiniSelectProps) | .shell .rail .railhead .part .partOn .ct .sealed .ico ... | |
| MobileEditorHead | src/ui/components/mobile-editor-head/index.tsx | ({ name, sub, dirty, saving, onBack, onSave, menu }: MobileEditorHeadProps) | Back / name / save / kebab at 2.2rem touch targets; the kebab holds the long tail. | .head .back .name .save .kebabWrap .kebab .menu |
| ModeGuided | src/ui/apps/workbench/regex/mode-guided.tsx | ({ rule, writeFor, styles, onPatch, onEscape }: ModeGuidedProps) | ||
| ModeSelect | src/ui/apps/workbench/lore/entry-toc-mode.tsx | ({ mode, vectorOk, styles, onChange, }: { mode: EntryFireMode; vectorOk: boolean; styles: Readonly<Record<string, str... | ||
| ModeWords | src/ui/apps/workbench/regex/mode-words.tsx | ({ rule, styles, onPatch }: ModeWordsProps) | ||
| MonoTag | src/ui/components/mono-tag/index.tsx | ({ children, dim }: MonoTagProps) | A mono, uppercase, letter-spaced meta label. | .tag .tagDim |
| NamedAssets | src/ui/components/named-assets/index.tsx | ({ value, onChange, assetFiles, macroHint = true, }: NamedAssetsProps) | .sheet .head .title .closeX .table .kind .name .ops ... | |
| NamedAssetsDialog | src/ui/components/named-assets/dialog.tsx | ({ characterName, value, assetFiles, onApply, onClose, }: NamedAssetsDialogProps) | .sheet .head .title .closeX .table .kind .name .ops ... | |
| NewInDeckButton | src/ui/apps/library/new-in-deck-button.tsx | ({ kind, ctx, onCreated, compact = false }: NewInDeckButtonProps) | ||
| NovelAiBiasBlock | src/ui/apps/workbench/lore/platforms/novelai-bias.tsx | ({ entry, styles, onPatch, }: { entry: LorebookEntry; styles: Readonly<Record<string, string>>; onPatch: (patch: Part... | ||
| OptionCards | src/ui/apps/workbench/controls/option-cards.tsx | ({ options, value, onSelect, styles }: OptionCardsProps) | ||
| PackEditor | src/ui/apps/workbench/PackEditor.tsx | ({ entity, revision, ctx, piece, topRight }: PackEditorProps) | .room .newPackBtn .stage .crumb .pip .cn .cc .pane ... | |
| PaintPicker | src/ui/components/paint-picker/index.tsx | ({ value, allow: allowProp, onChange }: PaintPickerProps) | .pp .modes .on .grad .bar .stop .sel .row ... | |
| PaletteCard | src/ui/apps/workbench/persona/persona-cards.tsx | ({ body, onBody }: { body: PersonaBody; onBody: OnBody }) | Color palette on the SHARED controls (registry-first): SwatchRow is the signature slot (the | |
| PaletteControl | src/ui/apps/workbench/controls/color-controls.tsx | ({ value, onChange, styles, twoField }: PaletteControlProps) | ||
| PersonaEditor | src/ui/apps/workbench/PersonaEditor.tsx | (props: PersonaEditorProps) | .room .newPackBtn .stage .crumb .pip .cn .cc .pane ... | |
| PersonaEditorView | src/ui/apps/workbench/persona/persona-editor.tsx | ({ entity, revision, ctx, piece, topRight }: PersonaEditorViewProps) | ||
| PhasePicker | src/ui/apps/workbench/regex/phase-picker.tsx | ({ phases, writeFor, styles, onToggle }: PhasePickerProps) | ||
| PlatformTabs | src/ui/components/platform-tabs/index.tsx | ({ platforms, selected, onToggle, onClear, offTarget, onOffTarget }: PlatformTabsProps) | Multi-select platform lens tabs + the dim/hide off-target switch (vs-editor-2). | .strip .tab .offt .on .hint |
| PlaybackTab | src/ui/apps/workbench/lore/playback-tab.tsx | ({ body, onJumpEntry }: PlaybackTabProps) | ||
| PlaybillView | src/ui/apps/workbench/presenters/playbill-view.tsx | ({ leftCard, sealedCard, acts, actModules, lensHides, lensDims, wideKinds, panelKinds, controlFor, nativeItems, nativ... | ||
| PortableLora | src/ui/components/portable-lora/index.tsx | ({ value, onChange }: PortableLoraProps) | .wrap .warn .lbl .input .ta .row .k .clear | |
| PortraitCard | src/ui/apps/workbench/controls/portrait-card.tsx | ({ artUrl, name, tokens, updatedAt, sourceVariant, vary, styles, onPortraitChange, showSprites = true, onOpenSprites,... | ||
| PositionPicker | src/ui/apps/workbench/lore/position-picker.tsx | ({ position, depth, role, writeFor, showDepth, showRole, styles, onPatch, }: PositionPickerProps) | ||
| PresetEditor | src/ui/apps/workbench/PresetEditor.tsx | (props: PresetEditorProps) | .room .newPackBtn .stage .crumb .pip .cn .cc .pane ... | |
| PresetEditorView | src/ui/apps/workbench/preset/preset-editor.tsx | ({ entity, revision, ctx, piece, topRight }: PresetEditorViewProps) | ||
| PreviewCard | src/ui/apps/workbench/persona/persona-cards.tsx | ({ xml, tokens, stopLabel }: { xml: string; tokens: number; stopLabel: string }) | Live preview: the REAL compiler's output + the shared token convention. | |
| ProgressChecklist | src/ui/components/progress-checklist/index.tsx | ({ items, extraStat }: ProgressChecklistProps) | Bar + count chip; the checklist itself lives in a bottom sheet. | .prog .bar .tap .row .ok .no .pendingLabel |
| PromptEditPanel | src/ui/apps/workbench/preset/prompt-edit-panel.tsx | ({ block, stops, writeFor, groups, onSetGroup, onClose, onPatch, }: PromptEditPanelProps) | ||
| RawExtensions | src/ui/components/raw-extensions/index.tsx | ({ data, handled, onChange }: RawExtensionsProps) | .wrap .head .row .key .text .num .json .bad | |
| Recommendations | src/ui/components/recommendations/index.tsx | ({ value, onChange }: RecommendationsProps) | .wrap .group .ghead | |
| RegexSetEditor | src/ui/apps/workbench/regex/set-editor.tsx | ({ entity, revision, ctx, piece, topRight }: RegexSetEditorProps) | ||
| RegexWorkshopDialog | src/ui/apps/library/regex-workshop-dialog.tsx | ({ ctx, state, onDone, onDismiss, }: RegexWorkshopDialogProps) | ||
| RehearsalPane | src/ui/apps/workbench/lore/rehearsal-pane.tsx | ({ body, onClose, onJumpEntry, onAddKeyword, }: RehearsalPaneProps) | ||
| RenderBox | src/ui/components/render-box/index.tsx | ({ value, format, children, defaultRendered = true, displayOnly = false, onLinkClick, }: RenderBoxProps) | A content box that toggles between a sanitized rendered view and its raw source. | .box .bar .toggle .out .src .plain |
| ResponseSchema | src/ui/components/response-schema/index.tsx | ({ value, onChange }: ResponseSchemaProps) | .wrap .lbl .row .input .sel .ta .name .grid ... | |
| RpgStats | src/ui/components/rpg-stats/index.tsx | ({ value, onChange }: RpgStatsProps) | .wrap .row .k .group .gtitle | |
| RuleKnobs | src/ui/components/css-workshop/knobs.tsx | ({ rule, onChange }: RuleKnobsProps) | Property knobs for the selected rule. | .root .banner .modeToggle .modeBtn .modeOn .tabs .tab .tabOn ... |
| RulePage | src/ui/apps/workbench/regex/rule-page.tsx | ({ rule, rules, writeFor, index, count, styles, onPrev, onNext, onPatch, onDuplicate, onDelete, }: RulePageProps) | ||
| RuleRail | src/ui/apps/workbench/regex/rule-rail.tsx | ({ rule, styles, onOpenBench, findings, onOpenHealth }: RuleRailProps) | ||
| RuleToc | src/ui/apps/workbench/regex/rule-toc.tsx | ({ rules, focusedId, styles, onSelect, onAdd, slowIds }: RuleTocProps) | ||
| SampleMatchStage | src/ui/apps/workbench/lore/sample-match-stage.tsx | ({ entries, styles }: SampleMatchStageProps) | ||
| SealedHtmlPreview | src/ui/components/sealed-html-preview/index.tsx | ({ html, css = "", title = "Backdrop preview", }: SealedHtmlPreviewProps) | Sandboxed iframe preview of card backdrop HTML. | .frame |
| SealedMedia | src/ui/components/sealed-media/index.tsx | ({ kind, src, name }: SealedMediaProps) | .box .img .audio .video .none | |
| SectionCard | src/ui/apps/workbench/persona/persona-cards.tsx | ({ body, onBody, writeFor, sectionKey, title, placeholder, }: { body: PersonaBody; onBody: OnBody; writeFor: PersonaW... | One canonical text section as a bento tile; Personality also carries the trait chips. | |
| SegControl | src/ui/apps/settings/section-contract.tsx | ({ options, current, onPick, }: { options: { value: T; label: string }[]; current: T; onPick: (value: T) => void; }) | A house segmented control bound call-and-response to a settings value. | .roomHost .room .tabs .tab .on .body .row .tx ... |
| SettingsBar | src/ui/apps/workbench/preset/settings-bar.tsx | ({ body, showSamplers, onDescription, onSampler }: SettingsBarProps) | ||
| SettingsRow | src/ui/apps/settings/section-contract.tsx | ({ label, hint, children }: { label: string; hint: string; children: ReactNode }) | A titled control row: label + hint on the left, the control on the right. | .roomHost .room .tabs .tab .on .body .row .tx ... |
| SetupWizard | src/ui/setup/wizard.tsx | ({ ctx, existing, onComplete }: SetupWizardProps) | Renders the wizard; calls onComplete with the draft (all keys filled) when OPEN VAUDE is pressed. | |
| SheetSlicePanel | src/ui/components/sprite-pack/dialog-panels.tsx | ({ sheetCols, sheetRows, sheetRef, onCols, onRows, onPick, onFile, }: { sheetCols: number; sheetRows: number; sheetRe... | .sheet .head .title .closeX .bar .lbl .sel .meta ... | |
| ShelfKicker | src/ui/components/ticket-window/index.tsx | ({ children }: { children: string }) | The mono microlabel naming a strip shelf; siblings (variants, expressions) borrow it so every | .sheet .booth .marquee .marqueeTitle .glass .glassDrag .monogram .emptyLine ... |
| Slider | src/ui/components/slider/index.tsx | ({ value, min, max, step = 1, onChange, format, "aria-label": ariaLabel, }: SliderProps) | .wrap .range .readout | |
| SpritePack | src/ui/components/sprite-pack/index.tsx | ({ value, onChange, showEnabled = false, showDefault = true, allowMultiFile = true, profile, showSlots = false, focus... | .sheet .head .title .closeX .bar .lbl .sel .meta ... | |
| SpritePackDialog | src/ui/components/sprite-pack/dialog.tsx | ({ characterName, pack, groups: initialGroups = {}, targets = [], showEnabled = false, showDefault = true, showGroups... | .sheet .head .title .closeX .bar .lbl .sel .meta ... | |
| SpriteParts | src/ui/components/sprite-parts/index.tsx | ({ value, visualType = "sprite", onChange, onVisualTypeChange, }: SpritePartsProps) | .wrap .row .lbl .sel .input .parts .part .color ... | |
| Stamp | src/ui/components/stamp/index.tsx | ({ children, onClick, disabled, accent, title, type = "button", id, "aria-label": ariaLabel, }: StampProps) | The stamp button: rest sits flush, hover lifts and grows its shadow, active presses flat. | .topbtn |
| StateGraphPane | src/ui/apps/workbench/workshop/state-graph/pane.tsx | ({ triggers, defaultVarsText, onApply, }: StateGraphPaneProps) | ||
| StatusBar | src/ui/shell/StatusBar.tsx | () | ||
| StructuredPersona | src/ui/components/structured-persona/index.tsx | ({ value, onChange }: StructuredPersonaProps) | .wrap .kinds .kind .kindOn .attr .top .key .chips ... | |
| StubEditor | src/ui/components/stub-editor/index.tsx | ({ title, note, onClose, children }: StubEditorProps) | .head .note .body .close | |
| SwatchRow | src/ui/components/swatch-row/index.tsx | ({ palette, value, onChange, allowCustom }: SwatchRowProps) | .wrap .row .sw .on .lbl .custom .empty .panel | |
| SwitchProgress | src/ui/apps/settings/sections/updates-dialogs.tsx | ({ message }: { message: string }) | Progress while a switch runs (the manager's status message). | |
| SwitchResult | src/ui/apps/settings/sections/updates-dialogs.tsx | ({ outcome, onDone, onUndo, }: { outcome: SwitchOutcome; onDone: () => void; onUndo: (from: string) => void; }) | The post-restart popup, from the pending-switch marker. Undo (back to where you came from) on success. | |
| TabStrip | src/ui/shell/TabStrip.tsx | () | ||
| TicketWindow | src/ui/components/ticket-window/index.tsx | ({ label, title, artUrl, monogram, onPick, onRemove, alternates, onHang, onAdd, }: TicketWindowProps) | .sheet .booth .marquee .marqueeTitle .glass .glassDrag .monogram .emptyLine ... | |
| ToggleSwitch | src/ui/components/toggle-switch/index.tsx | ({ on, onChange, label }: ToggleSwitchProps) | .btn .track .on .knob | |
| TourGuide | src/ui/components/tour-guide/index.tsx | ({ tour, ctx, onClose }: TourGuideProps) | .rail .kick .skip .dots .done .now .count .title ... | |
| TrackerCardColors | src/ui/components/tracker-card-colors/index.tsx | ({ value, onChange }: TrackerCardColorsProps) | .wrap .help .colorBlock .k .cssIn | |
| TrackerSetup | src/ui/components/tracker-setup/index.tsx | ({ value, onChange }: TrackerSetupProps) | .wrap .wt .notes .k .sel .ta .mod .on ... | |
| TransferBench | src/ui/components/transfer-bench/index.tsx | ({ leftTitle, rightTitle, left, right, name, namePlaceholder = "Name for the new book", applyLabel = "Apply", require... | .wrap .nameRow .note .bench .col .colHead .small .list ... | |
| TriggerEditor | src/ui/apps/workbench/lore/trigger-editor.tsx | ({ triggers, onChange, styles, advanced, placeholder, ariaLabel, showSpecials = false, entryProbability = 100, }: Tri... | ||
| VariantStrip | src/ui/components/variant-strip/index.tsx | ({ variants, activeId, artUrl, variantArt = {}, onSelect, onAdd, onRemove, onRename, onMode, }: VariantStripProps) | .wrap .row .thumb .on .add .editRow .name .mode ... | |
| VoiceSetup | src/ui/components/voice-setup/index.tsx | ({ value, onChange }: VoiceSetupProps) | .wrap .grid .lbl .sel .input .extras .exrow .rm ... | |
| WebView | src/ui/apps/workbench/lore/web-view.tsx | ({ body, onSelect, onFallbackCards }: WebViewProps) | ||
| WorkshopCodePane | src/ui/apps/workbench/workshop/code-pane.tsx | (props: WorkshopCodePaneProps) | .shell .rail .railhead .part .partOn .ct .sealed .ico ... | |
| WorkshopConsole | src/ui/apps/workbench/workshop/console.tsx | (props: WorkshopConsoleProps) | .shell .rail .railhead .part .partOn .ct .sealed .ico ... | |
| WorkshopEhead | src/ui/apps/workbench/workshop/ehead.tsx | ({ title, sub, trailing }: WorkshopEheadProps) | .shell .rail .railhead .part .partOn .ct .sealed .ico ... | |
| WorkshopNotice | src/ui/apps/workbench/workshop/notice.tsx | ({ kind, children, role = "status" }: WorkshopNoticeProps) | .shell .rail .railhead .part .partOn .ct .sealed .ico ... | |
| WorkshopRail | src/ui/apps/workbench/workshop/rail.tsx | ({ parts, part, onPart, hasPackage }: WorkshopRailProps) | .shell .rail .railhead .part .partOn .ct .sealed .ico ... | |
| WorkshopStarters | src/ui/apps/workbench/workshop/starters.tsx | ({ emptyTriggers, undo, onApply }: WorkshopStartersProps) | .shell .rail .railhead .part .partOn .ct .sealed .ico ... | |
| WorkshopTriggerCard | src/ui/apps/workbench/workshop/trigger-card.tsx | ({ trigger: t, index: ti, triggers, onWrite, vars = [], }: WorkshopTriggerCardProps) | .shell .rail .railhead .part .partOn .ct .sealed .ico ... | |
| WorkshopTriggersPane | src/ui/apps/workbench/workshop/triggers-pane.tsx | ({ triggers, onWrite, undo, vars = [], }: WorkshopTriggersPaneProps) | .shell .rail .railhead .part .partOn .ct .sealed .ico ... | |
| WorkshopVariablesPane | src/ui/apps/workbench/workshop/variables-pane.tsx | ({ vars, onChange }: WorkshopVariablesPaneProps) | .shell .rail .railhead .part .partOn .ct .sealed .ico ... | |
| WorkshopView | src/ui/apps/workbench/workshop/view.tsx | ({ draft, setField, original, setOriginal, targets = [], ctx, }: WorkshopViewProps) | .shell .rail .railhead .part .partOn .ct .sealed .ico ... | |
| WriteForStrip | src/ui/components/write-for-strip/index.tsx | ({ profiles, labels, value, onChange, }: WriteForStripProps ) |
.strip .stripLabel .pill .pillOn |
| Name | File | Signature | Doc | Styles |
|---|---|---|---|---|
| buildTimeline | src/ui/_shared/version-history.ts | ( releases: readonly ReleaseInfo[], installed: string, hasMore = false, ) | Build the timeline against the running version. Relation and behind-count come from the SIGN of |