مستندات و راه‌اندازی

راهنمای گام‌به‌گام افزودن بلیزی فای به پروژه‌ی Blazor شما.

1. نصب

پروژه‌ی BzCore را به‌صورت Reference یا پکیج اضافه کنید:

افزودن پروژه (Reference)
dotnet add reference ../src/BzCore/BzCore.csproj
یا نصب پکیج NuGet
dotnet add package BzCore

2. ثبت سرویس‌ها (Program.cs)

سرویس‌های تم، دیالوگ و اعلان با یک فراخوانی ثبت می‌شوند:

Program.cs
using BzCore.Extensions;

var builder = WebApplication.CreateBuilder(args);

builder.Services.AddRazorPages();
builder.Services.AddServerSideBlazor();

builder.Services.AddBz();

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

3. ایمپورت فضای‌نام‌ها (_Imports.razor)

_Imports.razor
@using BzCore.Enums
@using BzCore.Components.Button
@using BzCore.Components.Input
@using BzCore.Components.Notification
@* ... سایر فضای‌نام‌های مورد نیاز *@

4. افزودن CSS و JS

در _Host.cshtml (یا index.html برای WASM) لینک استایل و اسکریپت‌ها را اضافه کنید. فونت Vazirmatn و FontAwesome هم پیشنهاد می‌شوند:

head
<link rel="stylesheet" href="_content/Blazify/css/nab.css" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn/Vazirmatn-font-face.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" />
انتهای body
<script src="_content/Blazify/js/bz-core.js"></script>
<script src="_content/Blazify/js/bz-input.js"></script>
<script src="_content/Blazify/js/bz-button.js"></script>
<script src="_content/Blazify/js/bz-dialog.js"></script>
<!-- برای BzEditor (اختیاری) -->
<script src="https://cdn.ckeditor.com/ckeditor5/41.4.2/classic/ckeditor.js"></script>
<script src="_content/Blazify/js/bz-editor.js"></script>

5. راه‌اندازی Layout

یک‌بار در ریشه، BzThemeProvider و هاست‌های دیالوگ/اعلان را قرار دهید:

MainLayout.razor
@using BzCore.Theming
@using BzCore.Components.Dialog
@using BzCore.Components.Notification

<BzThemeProvider>
    @Body
    <BzDialogHost />
    <BzNotificationHost />
</BzThemeProvider>

6. اولین استفاده

حالا هر کامپوننتی را می‌توانید استفاده کنید:

نمونه
<BzButton Text="ذخیره" Color="BzColor.Primary"
           StartIcon="fa-solid fa-floppy-disk"
           OnClick="Save" />

<BzInput TValue="string" @bind-Value="name"
          Label="نام" Placeholder="نام را وارد کنید" />

@code {
    string? name;
    void Save() { /* ... */ }
}