FreemanCraft.MudBlazorAddons 1.1.9

FreemanCraft.MudBlazorAddons

Productivity components and lightweight services extending MudBlazor for Blazor (.NET 8 / .NET 9): dynamic runtime drawers, an IDE‑style bottom dock workspace, and copy/clipboard helpers designed for rapid internal tooling, dashboards, and developer UX panels.

✨ Highlights

• Dynamic runtime drawers (spawn, resize, close, host arbitrary RenderFragment content)
• Bottom docked tab workspace (IDE feel) (service + host component)
• Minimal copy/clipboard helper component
• Service-first patterns: add functionality without coupling to pages
• Ships multi-targeted: net8.0, net9.0
• MIT licensed – safe for commercial & internal apps

📦 Install

dotnet add package FreemanCraft.MudBlazorAddons

NuGet: https://www.nuget.org/packages/FreemanCraft.MudBlazorAddons Repository: https://github.com/freeman412/MudBlazor.Addons

Ensure MudBlazor is in your .csproj:

<ItemGroup>
  <PackageReference Include="MudBlazor" Version="8.*" />
</ItemGroup>

⚙️ Quick Start

1. Register services in Program.cs:

builder.Services.AddMudServices();
builder.Services.AddScoped<DrawerService>();
builder.Services.AddScoped<BottomDockService>();

2. Add host components to your layout:

<MudLayout>
    <MudAppBar Elevation="1">My App</MudAppBar>
    <MudMainContent>
        @Body
    </MudMainContent>
    
    <DrawerHost />
    <BottomDockHost />
</MudLayout>

3. Create drawers at runtime:

@inject DrawerService DrawerService
@using MudBlazor

<MudButton OnClick="OpenLogDrawer" Variant="Variant.Outlined" Color="Color.Info">
    Open Log Drawer
</MudButton>

@code {
    private void OpenLogDrawer()
    {
        var id = Guid.NewGuid();
        RenderFragment body = @<MudText Typo="Typo.body2">Log output here...</MudText>;
        DrawerService.AddDrawer($"Logs - {id.ToString()[..8]}", body, id);
    }
}

4. Add clipboard helpers:

<CopyToClipboard Text="dotnet add package FreemanCraft.MudBlazorAddons" />

🚀 Use Cases

• Live log monitoring and debugging panels
• Feature flag toggles and configuration
• Database query profiling and EF Core insights
• Real-time telemetry and metrics dashboards
• Background job and queue inspection
• User session context and diagnostic viewers
• API response inspection and testing tools

🛠 Design Philosophy

• Minimal abstractions: Build on standard MudBlazor components
• Runtime composition: Use RenderFragment for maximum flexibility
• Service-first: Clear separation between state management and UI
• Small surface area: Scale through usage patterns, not heavy frameworks
• Developer-friendly: Optimize for internal tooling and admin interfaces

🧪 Complete Example

Program.cs:

var builder = WebApplication.CreateBuilder(args);
builder.Services.AddRazorPages();
builder.Services.AddServerSideBlazor();
builder.Services.AddMudServices();
builder.Services.AddScoped<DrawerService>();
builder.Services.AddScoped<BottomDockService>();

var app = builder.Build();
app.UseRouting();
app.MapBlazorHub();
app.MapFallbackToPage("/_Host");
app.Run();

Feature Component:

@inject DrawerService DrawerService
@inject BottomDockService DockService

<MudStack Row="true" Spacing="2">
    <MudButton OnClick="OpenMetrics" Color="Color.Primary">
        Live Metrics
    </MudButton>
    <MudButton OnClick="OpenConsole" Color="Color.Secondary">
        Console
    </MudButton>
</MudStack>

@code {
    private void OpenMetrics()
    {
        RenderFragment content = @<div>
            <MudText Typo="Typo.h6">System Metrics</MudText>
            <MudProgressLinear Value="75" Color="Color.Success" />
            <MudText>CPU: 75% | Memory: 2.1GB</MudText>
        </div>;
        
        DrawerService.AddDrawer("Live Metrics", content, Guid.NewGuid());
    }
    
    private void OpenConsole()
    {
        RenderFragment console = @<div>
            <MudText Typo="Typo.body2" Style="font-family: monospace;">
                > dotnet run<br/>
                > Application started successfully
            </MudText>
        </div>;
        
        DockService.AddTab("Console", console, Guid.NewGuid());
    }
}

🔄 Versioning & Compatibility

• Targets: .NET 8, .NET 9
• MudBlazor: 8.x compatible
• Versioning: Semantic versioning (MAJOR.MINOR.PATCH)
• License: MIT - safe for commercial use

🤝 Contributing

1. Fork the repository
2. Create feature branch: git checkout -b feature/amazing-feature
3. Make changes and add tests
4. Commit: git commit -m 'Add amazing feature'
5. Push: git push origin feature/amazing-feature
6. Create Pull Request

✅ Checklist

• Install NuGet package
• Register services in Program.cs
• Add host components to layout
• Create first dynamic drawer
• Test clipboard functionality
• Star the repository ⭐

📄 License

MIT License - see LICENSE file for details.

🙌 Support

• Issues: Bug reports and feature requests
• Discussions: Ideas and design feedback
• Repository: https://github.com/freeman412/FreemanCraft.MudBlazorAddons