BzInputGroup
یک ورودی با امکان افزودن Template دلخواه قبل و بعد از آن (آیکن، متن، دکمه، Select…) در 6 طرح مختلف.
1) Default — حاشیهدار با جداکننده
https://
.ir
@using BzCore.Components.Input
@using BzCore.Enums
<BzInputGroup @bind-Value="site" Label="آدرس سایت" Placeholder="example"
Variant="BzInputGroupVariant.Default">
<Prepend><i class="fa-solid fa-globe"></i> https://</Prepend>
<Append>.ir</Append>
</BzInputGroup>
@code {
string? site;
}2) Filled — پسزمینهٔ نرم
تومان
@using BzCore.Components.Input
@using BzCore.Enums
<BzInputGroup @bind-Value="amount" Label="مبلغ" Placeholder="0"
Variant="BzInputGroupVariant.Filled">
<Prepend>تومان</Prepend>
<Append><i class="fa-solid fa-wallet"></i></Append>
</BzInputGroup>
@code {
string? amount;
}3) Outlined — Addon تینتدار
@
@using BzCore.Components.Input
@using BzCore.Enums
<BzInputGroup @bind-Value="user" Label="نام کاربری" Placeholder="username"
Variant="BzInputGroupVariant.Outlined">
<Prepend>@@</Prepend>
</BzInputGroup>
@code {
string? user;
}4) Pill — گرد کامل + دکمهٔ جستجو
@using BzCore.Components.Input
@using BzCore.Enums
<BzInputGroup @bind-Value="query" Placeholder="جستجو…"
Variant="BzInputGroupVariant.Pill">
<Prepend><i class="fa-solid fa-magnifying-glass"></i></Prepend>
<Append>
<button type="button" @onclick="Search"><i class="fa-solid fa-arrow-left"></i> برو</button>
</Append>
</BzInputGroup>
@code {
string? query;
void Search() { /* handle search */ }
}5) Underline — خط زیرین مینیمال
+98
@using BzCore.Components.Input
@using BzCore.Enums
<BzInputGroup @bind-Value="phone" Label="موبایل" Placeholder="9xxxxxxxxx"
Variant="BzInputGroupVariant.Underline">
<Prepend><i class="fa-solid fa-phone"></i> +98</Prepend>
</BzInputGroup>
@code {
string? phone;
}6) Seamless — Addonهای جدا (چیپی)
ریال
@using BzCore.Components.Input
@using BzCore.Enums
<BzInputGroup @bind-Value="price" Label="قیمت" Placeholder="0"
Variant="BzInputGroupVariant.Seamless">
<Prepend><i class="fa-solid fa-tag"></i></Prepend>
<Append>ریال</Append>
</BzInputGroup>
@code {
string? price;
}site= | amount= | user= | query= | phone= | price=