BlazorSBOMViewer 1.0.4

BlazorSBOMViewer

A powerful, customizable Blazor component library for visualizing Software Bill of Materials (SBOM) in CycloneDX, SPDX 2.x, and SPDX 3.0 formats.

Built on MudBlazor, it provides a clean, searchable interface for packages, files, licenses, vulnerabilities, and relationships.

Features

• Multi-Format Support:
  • CycloneDX: JSON, XML, Protobuf
  • SPDX 2.x: JSON, Tag-Value, XML, YAML, RDF/XML
  • SPDX 3.0: JSON-LD
• Unified Entry Point: One component (SbomViewer) handles all formats with automatic detection.
• Rich Visualization:
  • Metadata cards with creation info and timestamps.
  • Searchable tables for Components, Files, and Vulnerabilities.
  • Relationship graph views (tabular representation).
  • License expressions and URLs.
• Flexible Input: Load from file path, raw bytes, or pre-parsed document models.
• Themeable: Inherits your MudBlazor theme settings.
• Cross-Platform: Works in Blazor Server, WebAssembly, and MAUI Hybrid.

Installation

dotnet add package BlazorSBOMViewer

Note: BlazorSBOMViewer requires MudBlazor.

Setup

1. Register services in your Program.cs or MauiProgram.cs:

using BlazorSBOMViewer.Extensions;
using MudBlazor.Services;

// ...
builder.Services.AddMudServices();
builder.Services.AddBlazorSBOMViewer();

2. Add MudBlazor resources to your HTML host (e.g., App.razor, index.html, or _Host.cshtml):

<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" rel="stylesheet" />
<link href="_content/MudBlazor/MudBlazor.min.css" rel="stylesheet" />
<script src="_content/MudBlazor/MudBlazor.min.js"></script>

3. Ensure MudThemeProvider and other providers are in your MainLayout.razor:

<MudThemeProvider />
<MudPopoverProvider />
<MudDialogProvider />
<MudSnackbarProvider />

Usage

Import the component and model namespaces once in your page or _Imports.razor:

@using BlazorSBOMViewer.Components
@using BlazorSBOMViewer.Models

Simple Usage (Auto-Detection)

<SbomViewer RawBytes="@mySbomBytes" DownloadFileName="my-app-sbom" />

From File Path (Blazor Server / MAUI)

<SbomViewer FilePath="/path/to/sbom.spdx.json" />

With Pre-Parsed Document

<SbomViewer CycloneDxDocument="@myParsedCdxDoc" />

With Source Format Override

Use SourceFormatOverride when the input is non-JSON or when you want deterministic parsing instead of auto-detection:

<SbomViewer RawBytes="@xmlBytes"
            SourceFormatOverride="SbomSourceDocumentFormat.SpdxXml"
            DownloadFileName="sbom-from-xml" />

Customizing the UI

<SbomViewer RawBytes="@bytes"
            DownloadFileName="my-app-1.0"
            DisplayOptions="@(new SbomDisplayOptions {
                ShowVulnerabilitiesTab = false,
                ShowRelationshipsTab = false,
                EnableDownloads = false,
                DefaultPageSize = 50
            })" />

Custom Error Display

Supply a RenderFragment<string> to ErrorContent to replace the default error alert:

<SbomViewer RawBytes="@bytes">
    <ErrorContent Context="msg">
        <MudAlert Severity="Severity.Warning">Could not load SBOM: @msg</MudAlert>
    </ErrorContent>
</SbomViewer>

Using Parsers Directly

The parsers are registered in DI by AddBlazorSBOMViewer() and can be injected anywhere — no Blazor component required. They return strongly-typed document objects that can be used independently of the viewer.

Namespaces

using BlazorSBOMViewer.Services;        // CycloneDxParser, SpdxParser
using BlazorSBOMViewer.Services.Spdx3;  // Spdx3Parser
using BlazorSBOMViewer.Models.CycloneDx; // CycloneDxBomDocument
using BlazorSBOMViewer.Models.Spdx;     // SpdxDocument
using BlazorSBOMViewer.Models.Spdx3;    // Spdx3Document

Inject and Parse

// Blazor component or service
@inject CycloneDxParser CycloneDxParser
@inject SpdxParser SpdxParser
@inject Spdx3Parser Spdx3Parser

// From raw bytes (format auto-detected)
CycloneDxBomDocument cdx = CycloneDxParser.Parse(fileBytes);
SpdxDocument spdx        = SpdxParser.Parse(fileBytes);
Spdx3Document spdx3      = Spdx3Parser.Parse(fileBytes);

// From a string
CycloneDxBomDocument cdx = CycloneDxParser.Parse(jsonString);
SpdxDocument spdx        = SpdxParser.Parse(tagValueString);

// From a file path (server-side only)
CycloneDxBomDocument cdx = CycloneDxParser.ParseFile("/path/to/bom.cdx.json");
SpdxDocument spdx        = SpdxParser.ParseFile("/path/to/sbom.spdx");
Spdx3Document spdx3      = Spdx3Parser.ParseFile("/path/to/sbom.spdx3.json");

// From a stream
await using var stream = File.OpenRead("/path/to/bom.cdx.xml");
CycloneDxBomDocument cdx = CycloneDxParser.Parse(stream);

Force a Specific Format

Pass an optional format enum to skip auto-detection:

// CycloneDxDocumentFormat: Json | Xml | Protobuf
CycloneDxBomDocument cdx = CycloneDxParser.Parse(bytes, CycloneDxDocumentFormat.Xml);

// SpdxDocumentFormat: Json | TagValue | Xml | Yaml | Rdf
SpdxDocument spdx = SpdxParser.Parse(bytes, SpdxDocumentFormat.Yaml);

Parser API Summary

Example: Pipeline Without UI

// In a background service, API endpoint, or test
public class SbomAuditService(CycloneDxParser parser)
{
    public IEnumerable<string> GetLicenses(byte[] sbomBytes)
    {
        var doc = parser.Parse(sbomBytes);
        return doc.Components
            .SelectMany(c => c.Licenses)
            .Select(l => l.License?.Id ?? l.License?.Name ?? l.Expression)
            .Where(l => l is not null)
            .Distinct()!;
    }
}

Component Reference

SbomViewer Parameters

Input

Priority order when multiple inputs are set: pre-parsed documents → RawBytes → FilePath.

Format Control

SbomSourceDocumentFormat values: CycloneDxJson, CycloneDxXml, CycloneDxProtobuf, SpdxJson, SpdxTagValue, SpdxXml, SpdxYaml, SpdxRdf, Spdx3JsonLd.

UI & Behaviour

SbomDisplayOptions Properties

Download Formats

When downloads are enabled, the button offers formats matching the source document type:

Supported Formats

Limitations

• No Conversion: The library visualizes SBOMs but does not automatically convert between format families (e.g., converting CycloneDX to SPDX).
• MudBlazor Dependency: UI components are tightly integrated with MudBlazor.

License

MIT