Semantics List Page

v0.4.9

A pipeline-list page block with filtering, pagination, and delete-confirmation dialog.

Preview

Install & usage

npx shadcn@latest add @signalos/semantics-list-01

Pulls the page source plus its widget dependencies (@signalos/tokens, @signalos/utils, @signalos/button, @signalos/tooltip, @signalos/dropdown-menu, @signalos/filter-toolbar, @signalos/page-header, @signalos/pagination, @signalos/confirm-dialog, @signalos/data-primitives, @signalos/select, @signalos/textarea, @signalos/skeleton, @signalos/input, @signalos/label, @signalos/dialog) into your app - you own the copy. Requires access.

usage

// after: npx shadcn@latest add @signalos/semantics-list-01
// mount the pulled page in a route, e.g. src/app/semantics/page.tsx
import Semantics01 from "@/components/blocks/semantics-list-01/Semantics01"

export default function Page() {
  return <Semantics01 />
}

Props

PipelineLike

Prop	Type	Default	Description
id*	`string`	-	Stable unique identifier.
name*	`string`	-	Display name.
description	`string \| null \| undefined`	-	Optional description.
status*	`string`	-	Pipeline status key, e.g. "created", "running", "completed".
pipeline_type	`SemanticsPipelineType \| null \| undefined`	-	Source topology: "multi_source" shows a Layers icon; anything else shows GitBranch.
connector_count	`number \| undefined`	-	Number of connectors attached.
created_at	`string \| undefined`	-	ISO-8601 creation timestamp.
current_stage	`string \| undefined`	-	Current processing stage key, looked up in STAGE_LABELS.

Semantics01Props

Prop	Type	Default	Description
title	`ReactNode`	"Semantics"	Page heading.
description	`ReactNode`	"Manage your data pipelines…"	Sub-heading under the title.
onCreatePipeline	`(() => void) \| undefined`	-	Called when the "Create Pipeline" button is pressed.
items*	`readonly TItem[]`	-	Pipeline items to render.
isLoading	`boolean \| undefined`	-	Loading state — renders skeleton cards when true.
isError	`boolean \| undefined`	-	Error state — renders error message when true.
errorMessage	`ReactNode`	-	Error message shown when `isError` is true.
searchValue	`string \| undefined`	-	Current free-text search value.
onSearchChange	`((value: string) => void) \| undefined`	-	Called when the search input changes.
searchPlaceholder	`string \| undefined`	"Search pipelines…"
statusFilter	`string \| undefined`	"all"	Current value of the status filter dropdown.
onStatusFilterChange	`((value: string) => void) \| undefined`	-	Called when the status filter changes.
onRefresh	`(() => void) \| undefined`	-	Called when the refresh button is pressed. Omit to hide the button.
isRefreshing	`boolean \| undefined`	false
onOpen	`((item: TItem) => void) \| undefined`	-	Called when a pipeline card (or its "View" button) is activated.
onEdit	`((item: TItem) => void) \| undefined`	-	Called when the "Edit" menu item is selected.
onDelete	`((item: TItem) => void) \| undefined`	-	Called when the "Delete" menu item is selected.
createWizardOpen	`boolean \| undefined`	-	Whether the create wizard dialog is open.
onCreateWizardOpenChange	`((open: boolean) => void) \| undefined`	-	Called when the dialog open state changes.
createWizardStep	`number \| undefined`	-	The active step index (0 = Details, 1 = Context, 2 = Connectors, 3 = Review). The parent drives this so it can trigger per-step data fetches on advance.
onCreateWizardStepChange	`((step: number) => void) \| undefined`	-	Called when the wizard requests a step change; parent fetches data then updates `createWizardStep`.
createWizardName	`string \| undefined`	-	Pipeline name field value.
onCreateWizardNameChange	`((value: string) => void) \| undefined`	-	Called when the pipeline name changes.
createWizardDescription	`string \| undefined`	-	Pipeline description field value.
onCreateWizardDescriptionChange	`((value: string) => void) \| undefined`	-	Called when the pipeline description changes.
createWizardSelectedConnectionIds	`string[] \| undefined`	-	Selected connection ids.
onCreateWizardSelectedConnectionIdsChange	`((ids: string[]) => void) \| undefined`	-	Called when the selected connection ids change.
createWizardFieldErrors	`Record<string, string> \| undefined`	-	Per-field validation errors for the wizard.
onCreateWizardFieldErrorsChange	`((errors: Record<string, string>) => void) \| undefined`	-	Called when wizard field errors change.
createWizardReasoningModel	`string \| undefined`	-	Reasoning model canonical id.
onCreateWizardReasoningModelChange	`((canonical: string) => void) \| undefined`	-	Called when the reasoning model selection changes.
createWizardSupportingModel	`string \| undefined`	-	Supporting model canonical id.
onCreateWizardSupportingModelChange	`((canonical: string) => void) \| undefined`	-	Called when the supporting model selection changes.
createWizardEmbeddingModel	`string \| undefined`	-	Embedding model canonical id.
onCreateWizardEmbeddingModelChange	`((canonical: string) => void) \| undefined`	-	Called when the embedding model selection changes.
llmModels	`OrchestrationModelLike[] \| undefined`	-	LLM models for the model pickers (Step 1).
embeddingModels	`OrchestrationModelLike[] \| undefined`	-	Embedding models for the embedding picker (Step 1).
isLoadingModels	`boolean \| undefined`	-	True while LLM/embedding models are loading.
contextQuestions	`ContextQuestion[] \| undefined`	-	Onboarding context questions (Step 2).
isLoadingQuestions	`boolean \| undefined`	-	True while context questions are loading.
contextAnswers	`Record<string, string> \| undefined`	-	Current answers, keyed by `question_key`.
onContextAnswerChange	`((key: string, value: string) => void) \| undefined`	-	Called when the user types in an answer field.
connections	`ConnectionLike[] \| undefined`	-	Available platform connections (Step 3).
isLoadingConnectors	`boolean \| undefined`	-	True while connectors are loading.
isSubmitting	`boolean \| undefined`	-	True while the create mutation is in-flight.
onSubmit	`((payload: CreatePipelinePayload) => void) \| undefined`	-	Called with the collected payload when the user confirms creation.
onCreateCustomModel	`(() => void) \| undefined`	-	Called when the user clicks "Create model" inside the model picker.
pendingEdit	`TItem \| null \| undefined`	-	The pipeline currently being edited; controls the edit dialog.
onPendingEditChange	`((open: boolean) => void) \| undefined`	-	Called when the edit dialog open state changes.
onSaveEdit	`((id: string, fields: UpdatePipelineFields) => void) \| undefined`	-	Called with only the changed fields when the user saves.
isUpdating	`boolean \| undefined`	-	True while an update mutation is in-flight.
pendingDelete	`TItem \| null \| undefined`	-	The pipeline currently pending deletion; controls the confirm-dialog.
onPendingDeleteChange	`((open: boolean) => void) \| undefined`	-	Called when the confirm-dialog open state changes (e.g. user cancels).
onConfirmDelete	`(() => void) \| undefined`	-	Called when the user confirms deletion.
isDeleting	`boolean \| undefined`	-	True while a delete mutation is in-flight.
currentPage	`number \| undefined`	1
pageSize	`number \| undefined`	12	Number of items per page.
totalItems	`number \| undefined`	-	Total number of items across all pages.
onPageChange	`((page: number) => void) \| undefined`	-	Called when the user navigates to a different page.
emptyLabel	`ReactNode`	-	Override the empty-state label.
emptyDescription	`ReactNode`	-	Override the empty-state description.
className	`string \| undefined`	-
data-testid	`string \| undefined`	-	Test identifier rendered as `data-testid` on the root element.

Supporting types

export type KnownPipelineType =
  "single" | "multi_source" | "connector_onboarding"

export type SemanticsPipelineType = KnownPipelineType | (string & {})

Changelog

0.4.9

Decompose CreatePipelineWizard into WizardStepBar, WizardStepConnectors, WizardStepContext, WizardStepDetails, and WizardStepReview subcomponents; extract ModelSelect to its own file.
Define WIZARD_STEPS constant and typed step-component props interfaces for each wizard step.

0.4.8

Fix cross-item imports to use canonical @/components paths; add missing signalos.category to manifests.

0.4.7

Semantics01.constants.ts: remove { value: "running", label: "Running" } from STATUS_OPTIONS; rename metrics_baselines → functions (label "Functions & Workflow") in STAGE_LABELS.
Semantics01.tsx: default data-testid on the create button to "semantics-create" when no dataTestId prop is provided.
Semantics01.tsx: change loading grid data-testid to "pipeline-list-loading"; wrap empty state in a data-testid="pipeline-list-empty" div.
Semantics01.types.ts: add KnownPipelineType / SemanticsPipelineType union; allow null for description and pipeline_type on PipelineLike.
Semantics01.utils.ts: remove stale JSDoc module comment block.
CreatePipelineWizard: replace FormDialog+TextField with raw Dialog/DialogContent/DialogHeader/DialogTitle/DialogDescription and Input/Label.
Remove @signalos/form-dialog and @signalos/text-field from registryDependencies.

0.4.6

Replace raw Dialog with FormDialog in CreatePipelineWizard; footer=null, step indicator and wizard nav rendered as children.
Replace raw Dialog with FormDialog in EditPipelineDialog; EditPipelineForm now owns open/dataTestId and renders FormDialog directly.
Replace Label+Input with TextField for Pipeline name in both dialogs; Description and context Textarea fields keep inline label style.
Fix raw token text-error-500 → text-text-error on context step required asterisk.
Swap @signalos/dialog + @signalos/input + @signalos/label → @signalos/form-dialog + @signalos/text-field.

0.4.4

Content updates.

0.4.2

Lift CreatePipelineWizard form state (name, description, selectedConnectionIds, fieldErrors, reasoningModel, supportingModel, embeddingModel) to controlled props. Parent now owns all wizard form state.

semantics-list-01

0.3.2

0.3.1

Patch: no functional changes; version bump to resync content hash after file was added to the working tree.

0.3.0

Lift wizard step control to the parent: CreatePipelineWizard now accepts step/onStepChange props so the parent owns step transitions and triggers per-step data fetches.
Add isLoadingQuestions and isLoadingConnectors props to CreatePipelineWizard; wizard renders inline loading states for Steps 2 and 3.
Expose all wizard props (createWizardOpen, onCreateWizardOpenChange, createWizardStep, onCreateWizardStepChange, llmModels, embeddingModels, isLoadingModels, contextQuestions, isLoadingQuestions, contextAnswers, onContextAnswerChange, connections, isLoadingConnectors, isSubmitting, onSubmit, onCreateCustomModel) on Semantics01Props and render CreatePipelineWizard from the parent.
Re-export wizard structural types (ConnectionLike, ContextQuestion, CreatePipelinePayload, OrchestrationModelLike) from Semantics01.types.ts.

0.2.1

0.2.0

Breaking: Component is now a pure presentational block — all API calls, state management, and business logic must be handled by the parent. Props updated accordingly (see Semantics01.types.ts).
Add Semantics01Props<TItem> generic interface in Semantics01.types.ts; remove any throughout.
Add PipelineLike structural interface — consumers map their domain type onto it.
Remove STATUS_ICON_BG constant (used raw-scale tokens); PipelineCard now uses STATUS_ICON_CLASSES (semantic tokens only).
onCreatePipeline, onOpen, onEdit, onDelete, onRefresh are optional — controls render only when their callback is provided.
Fix manifest name from semantics-list-01 to semantics-list-01; add missing registryDependencies.