Blazor.GoldenLayout 1.0.1

.NET 8.0 This package targets .NET 8.0. The package is compatible with this framework or higher. 
dotnet add package Blazor.GoldenLayout --version 1.0.1
                    


                    

                
NuGet\Install-Package Blazor.GoldenLayout -Version 1.0.1
This command is intended to be used within the Package Manager Console in Visual Studio, as it uses the NuGet module's version of Install-Package. 
<PackageReference Include="Blazor.GoldenLayout" Version="1.0.1" />
For projects that support PackageReference, copy this XML node into the project file to reference the package. 
<PackageVersion Include="Blazor.GoldenLayout" Version="1.0.1" />
                    


                            Directory.Packages.props
                        

                    

                
<PackageReference Include="Blazor.GoldenLayout" />
                    


                            Project file
For projects that support Central Package Management (CPM), copy this XML node into the solution Directory.Packages.props file to version the package. 
paket add Blazor.GoldenLayout --version 1.0.1
                    


                    

                
#r "nuget: Blazor.GoldenLayout, 1.0.1"
#r directive can be used in F# Interactive and Polyglot Notebooks. Copy this into the interactive tool or source code of the script to reference the package. 
#:package Blazor.GoldenLayout@1.0.1
#:package directive can be used in C# file-based apps starting in .NET 10 preview 4. Copy this into a .cs file before any lines of code to reference the package. 
#addin nuget:?package=Blazor.GoldenLayout&version=1.0.1
                    


                            Install as a Cake Addin
                        

                    

                
#tool nuget:?package=Blazor.GoldenLayout&version=1.0.1
                    


                            Install as a Cake Tool

👉 查看中文文档

Hi, I'm Ouse. Welcome to this library!

This is a Blazor wrapper for GoldenLayout.js, which helps you create dockable, resizable layouts in your Blazor applications. A huge thanks to the GoldenLayout team for their amazing work! 🙌

✨ Quick Start

1️⃣ Install NuGet Package
Install-Package Blazor.GoldenLayout
2️⃣ Add Theme CSS

Add your preferred theme to index.html (Blazor Wasm) or App.razor (Blazor Web App). JS files will be injected dynamically.

Example (dark theme):

<link type="text/css" rel="stylesheet" href="_content/Blazor.GoldenLayout/goldenlayout-dark-theme.css" />
3️⃣ Register Components

In Program.cs, register your components like this:

For Blazor WebAssembly:

builder.Services.RegisterGoldenLayoutService(new Dictionary<Type, string>
{
    { typeof(Counter), "Counter"},
    { typeof(HelloWorld), "HelloWorld"},
});
builder.RootComponents.RegisterGoldenLayoutComponent();

For Blazor Server:

builder.Services.RegisterGoldenLayoutService(new Dictionary<Type, string>
{
    { typeof(Counter), "Counter"},
    { typeof(HelloWorld), "HelloWorld"},
});

builder.Services.AddServerSideBlazor(options =>
{
    options.RootComponents.RegisterGoldenLayoutComponent();
});
4️⃣ Disable Prerendering (If enabled)

Due to lifecycle differences, prerendering must be disabled for now to avoid duplicate component registration.

<body>
    <Routes @rendermode="@(new InteractiveServerRenderMode(prerender: false))" />
    <script src="_framework/blazor.web.js"></script>
</body>

🧩 Razor-Based Layout Example

See the Chinese version above for a detailed Razor example.

🔧 C#-Based Layout Configuration

Also see the code example in the Chinese section.

💡 How It Works

This library is built as a Blazor wrapper over GoldenLayout's JavaScript API, but supports declarative Razor syntax to make layout definition more Blazor-friendly.

More technical documentation coming soon!

🔮 Roadmap

  • More API coverage
  • GitHub Pages + live preview
  • Automatic handling of prerendering
  • Lazy loading + component registry improvements
Product Compatible and additional computed target framework versions.
.NET net8.0 is compatible.  net8.0-android was computed.  net8.0-browser was computed.  net8.0-ios was computed.  net8.0-maccatalyst was computed.  net8.0-macos was computed.  net8.0-tvos was computed.  net8.0-windows was computed.  net9.0 is compatible.  net9.0-android was computed.  net9.0-browser was computed.  net9.0-ios was computed.  net9.0-maccatalyst was computed.  net9.0-macos was computed.  net9.0-tvos was computed.  net9.0-windows was computed.  net10.0 was computed.  net10.0-android was computed.  net10.0-browser was computed.  net10.0-ios was computed.  net10.0-maccatalyst was computed.  net10.0-macos was computed.  net10.0-tvos was computed.  net10.0-windows was computed. 
Compatible target framework(s)
Included target framework(s) (in package)
Learn more about Target Frameworks and .NET Standard.

NuGet packages

This package is not used by any NuGet packages.

GitHub repositories

This package is not used by any popular GitHub repositories.

Version Downloads Last Updated
1.0.1 292 5/15/2025
1.0.0 262 5/14/2025