Source
<sea-source-viewer> displays the selected document as a PDF, image or spreadsheet. It uses the existing format-specific viewers and follows Sea context's shared document and citation selection.
| Integration | Entry |
|---|---|
| React | SeaSourceViewer from @sea-dev/widget-lit/react/source-viewer |
| Without React | @sea-dev/widget-lit/source-viewer |
html
<sea-source-viewer step-label="data" style="height: 640px"></sea-source-viewer>Place it inside a process and Sea context, with the page API host configured before mounting. A single source opens automatically. With several sources, choose one from the document list. Set document-extraction-id to pin a source explicitly.
Before a source is available, the panel shows a loading or empty state. An explicit selection that cannot be found shows an error.
Use a field's source control to locate its citation. The context's document resolver or proxy applies to all formats. Format-specific viewers provide additional PDF, image and spreadsheet controls.
Attributes and properties
| Property | Attribute | Type | Default | Description |
|---|---|---|---|---|
stepLabel | step-label | string | "" | Selects the pipeline step with this unique label. Defaults to data. |
stepRole | step-role | PipelineStepRoleWire or undefined | — | Constrains the selected step to this execution role. |
stepId | step-id | string | "" | Selects a pipeline step by its definition ID. |
runStepId | run-step-id | string | "" | Selects an exact step instance within the run. |
outputFormId | output-form-id | string | "" | Restricts the selected step's outputs to this form. |
outputSubmissionId | output-submission-id | string | "" | Selects an exact output submission within the run. |
documentExtractionId | document-extraction-id | string | "" | Selects a source explicitly, overriding shared document selection. |
workerUrl | worker-url | string | "" | Sets the PDF.js worker URL when the selected document is a PDF. |
Events
| Event | Type | Description |
|---|---|---|
citation-clicked | CustomEvent | { annotationKey, citationId, citationIds } when a source highlight is selected. |
Styling parts
| Part | Description |
|---|---|
root | The source panel. |
toolbar | The viewer controls. |
content | The document surface. |
status | Loading, empty and unavailable messages. |
Give the element a height through its host class or style. The viewer fills that space. Layout and parts covers internal styling.