Installation

1. Install the NuGet package

From your project folder, run:

dotnet add package MgLibrary
# or specify a version
# dotnet add package MgLibrary --version 1.2.3

Alternatively, add a PackageReference to your .csproj:

<PackageReference Include="MgLibrary" Version="1.*" />

2. Include styles and scripts

Add the library CSS and optional JS to the appropriate host file:

Blazor WebAssembly (wwwroot/index.html)

<link href="_content/MgLibrary/css/mglibrary.min.css" rel="stylesheet" />
<script src="_content/MgLibrary/scripts/mglibrary.min.js"></script>

Blazor Server (App.razor or Layout)

<link href="_content/MgLibrary/css/mglibrary.min.css" rel="stylesheet" />
<script src="_content/MgLibrary/scripts/mglibrary.min.js"></script>

Note: If you use Tailwind, include the library CSS after your Tailwind output so utility classes can be overridden where intended.

3. Register required services

In Program.cs (for WASM or Server) register the library services and optional state managers:

// Blazor WebAssembly / Server (minimal sample)
var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.Services.AddMgServices();
// optional companion packages
builder.Services.AddMgStateManager();
builder.Services.AddMgMediator();

If your project is server-side, call AddMgServices() on the server DI container in Program.cs similarly.

4. Configure theming and provider

Wrap your application (for example in MainLayout or App.razor) with the MgThemeProvider so theme variables and runtime switching work:

<MgThemeProvider>
    <Router AppAssembly="MgLibrary" />
</MgThemeProvider>

5. Verify installation

Add a simple component to a page to confirm styles and scripts load correctly:

<MgButton DisplayText="Hello MgLibrary" />

Run the app and ensure the button renders with the expected styles. Check browser console for missing resource errors (404s) which often indicate the _content path is incorrect or the package version differs.

6. Troubleshooting

• 404 on _content paths: make sure the NuGet package is restored and the correct package id/path (MgLibrary) is used.
• Icons missing: ensure Bootstrap icons or the configured icon set are included in your project.
• Tailwind conflicts: include the component CSS after Tailwind output or use ThemeProvider variables to override tokens.
• JS interop features not working: confirm mglibrary.min.js is referenced and loaded before invoking interop code.

7. Next steps

See the Overview for architecture and companion packages, or visit the Demos to explore components by category.