raise-blazor

USE FOR: Building Blazor applications with Radzen Blazor components, including DataGrid, Form, Scheduler, and Chart. Use when you need a free, open-source component library with an optional Radzen IDE for rapid application development. DO NOT USE FOR: Non-Blazor projects, native mobile or desktop apps (use MAUI or Avalonia), or projects that require deep integration with a specific CSS framework other than Radzen's built-in theme system.

跳到安装

仓库: Tyler-R-Kendrick/agent-skills
最近来源活动: 2026年2月11日 05:14
检测到的 SKILL.md 语言: 英语
星标: 10
分支: 4

安装方式

默认使用会先检查来源的 Prompt；你也可以切换为直接命令，或下载本地副本。

用 Codex 或 Claude 帮你安装复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。

直接命令不会经过审查 Prompt；运行前请先检查来源。

npx skills add https://github.com/Tyler-R-Kendrick/agent-skills --skill raise-blazor

命令会保持在同一行。复制前请横向滚动并检查完整内容。

想先保存到本地？可下载 SkillsMP 当前能够提供的文件。

检查来源文件

决定是否安装前，请先阅读 SKILL.md，以及 SkillsMP 当前展示的配套文件。

文件资源管理器

20 个文件

SKILL.md

来源说明 · 只读预览

返回搜索返回安装

name	raise-blazor
description	USE FOR: Building Blazor applications with Radzen Blazor components, including DataGrid, Form, Scheduler, and Chart. Use when you need a free, open-source component library with an optional Radzen IDE for rapid application development. DO NOT USE FOR: Non-Blazor projects, native mobile or desktop apps (use MAUI or Avalonia), or projects that require deep integration with a specific CSS framework other than Radzen's built-in theme system.
license	MIT
metadata	{"displayName":"Radzen Blazor Components","author":"Tyler-R-Kendrick","version":"1.0.0"}
compatibility	["claude","copilot","cursor"]
references	[{"title":"Radzen Blazor Components Official Site","url":"https://blazor.radzen.com/"},{"title":"Radzen Blazor GitHub Repository","url":"https://github.com/radzenhq/radzen-blazor"},{"title":"Radzen.Blazor NuGet Package","url":"https://www.nuget.org/packages/Radzen.Blazor"}]

Radzen Blazor Components

Overview

Radzen Blazor Components is a free, open-source library of 90+ Blazor components including DataGrid, Scheduler, Chart, Form, Dialog, and Notification. The library provides its own design system with multiple built-in themes (Material, Standard, Dark, Humanistic) and does not depend on Bootstrap or other CSS frameworks. Radzen components support Blazor Server, Blazor WebAssembly, and .NET 8+ SSR with per-component interactivity. The optional Radzen IDE provides visual CRUD page generation, but the component library works standalone via NuGet.

@page "/invoices" @using Radzen @using Radzen.Blazor @inject IInvoiceService InvoiceService <RadzenDataGrid @ref="_grid" Data="_invoices" Count="_count" LoadData="OnLoadData" TItem="Invoice" AllowSorting="true" AllowFiltering="true" AllowPaging="true" PageSize="20" PagerHorizontalAlign="HorizontalAlign.Center" FilterMode="FilterMode.Advanced" Style="height: 600px"> <Columns> <RadzenDataGridColumn TItem="Invoice" Property="InvoiceNumber" Title="Invoice #" Width="140px" /> <RadzenDataGridColumn TItem="Invoice" Property="CustomerName" Title="Customer" Width="200px" /> <RadzenDataGridColumn TItem="Invoice" Property="Amount" Title="Amount" FormatString="{0:C2}" Width="120px" /> <RadzenDataGridColumn TItem="Invoice" Property="DueDate" Title="Due Date" FormatString="{0:d}" Width="130px" /> <RadzenDataGridColumn TItem="Invoice" Property="Status" Title="Status" Width="120px"> <Template Context="invoice"> <RadzenBadge BadgeStyle="@GetBadgeStyle(invoice.Status)" Text="@invoice.Status" /> </Template> </RadzenDataGridColumn> <RadzenDataGridColumn TItem="Invoice" Filterable="false" Sortable="false" Width="100px"> <Template Context="invoice"> <RadzenButton Icon="edit" ButtonStyle="ButtonStyle.Light" Size="ButtonSize.Small" Click="() => EditInvoice(invoice)" /> <RadzenButton Icon="delete" ButtonStyle="ButtonStyle.Danger" Size="ButtonSize.Small" Click="() => DeleteInvoice(invoice)" /> </Template> </RadzenDataGridColumn> </Columns> </RadzenDataGrid> @code { private RadzenDataGrid<Invoice> _grid = null!; private IEnumerable<Invoice>? _invoices; private int _count; private async Task OnLoadData(LoadDataArgs args) { var result = await InvoiceService.GetPagedAsync( filter: args.Filter, orderBy: args.OrderBy, skip: args.Skip ?? 0, top: args.Top ?? 20); _invoices = result.Items; _count = result.TotalCount; } private BadgeStyle GetBadgeStyle(string status) => status switch { "Paid" => BadgeStyle.Success, "Overdue" => BadgeStyle.Danger, "Pending" => BadgeStyle.Warning, _ => BadgeStyle.Light }; private void EditInvoice(Invoice invoice) { /* navigation logic */ } private void DeleteInvoice(Invoice invoice) { /* delete with confirmation */ } }

@page "/contacts/new" @using Radzen @using Radzen.Blazor @inject NavigationManager Navigation @inject IContactService ContactService @inject NotificationService NotificationService <RadzenTemplateForm TItem="ContactModel" Data="_model" Submit="HandleSubmit"> <RadzenFieldset Text="New Contact"> <RadzenStack Gap="1rem"> <RadzenFormField Text="Full Name" Variant="Variant.Outlined"> <ChildContent> <RadzenTextBox @bind-Value="_model.FullName" Name="FullName" /> </ChildContent> <Helper> <RadzenRequiredValidator Component="FullName" Text="Name is required" /> </Helper> </RadzenFormField> <RadzenFormField Text="Email" Variant="Variant.Outlined"> <ChildContent> <RadzenTextBox @bind-Value="_model.Email" Name="Email" /> </ChildContent> <Helper> <RadzenRequiredValidator Component="Email" Text="Email is required" /> <RadzenEmailValidator Component="Email" Text="Invalid email format" /> </Helper> </RadzenFormField> <RadzenFormField Text="Phone" Variant="Variant.Outlined"> <ChildContent> <RadzenMask @bind-Value="_model.Phone" Mask="(***) ***-****" Placeholder="(555) 123-4567" Name="Phone" /> </ChildContent> </RadzenFormField> <RadzenFormField Text="Category" Variant="Variant.Outlined"> <ChildContent> <RadzenDropDown @bind-Value="_model.Category" Data="_categories" Name="Category" Placeholder="Select..." /> </ChildContent> <Helper> <RadzenRequiredValidator Component="Category" Text="Category is required" /> </Helper> </RadzenFormField> <RadzenButton ButtonType="ButtonType.Submit" Text="Save Contact" ButtonStyle="ButtonStyle.Primary" /> </RadzenStack> </RadzenFieldset> </RadzenTemplateForm> @code { private ContactModel _model = new(); private readonly List<string> _categories = new() { "Client", "Vendor", "Partner", "Internal" }; private async Task HandleSubmit() { await ContactService.CreateAsync(_model); NotificationService.Notify(NotificationSeverity.Success, "Saved", "Contact created."); Navigation.NavigateTo("/contacts"); } public class ContactModel { public string FullName { get; set; } = string.Empty; public string Email { get; set; } = string.Empty; public string Phone { get; set; } = string.Empty; public string Category { get; set; } = string.Empty; } }

Feature	Radzen	MudBlazor	Blazorise (free)	Ant Design Blazor
Component count	90+	60+	50+ (free tier)	60+
Built-in themes	5	3	Via provider	1
DataGrid	Full-featured	Full-featured	Basic	Full-featured
Scheduler	Yes	No	No	No
Dialog service	Yes	Yes	Yes	Yes
Form validators	Component-based	EditForm-based	Component-based	EditForm-based
Visual IDE	Radzen IDE (optional)	No	No	No

raise-blazor

安装方式

检查来源文件

Radzen Blazor Components

Overview

Radzen Blazor Components

Overview

Installation and Service Registration

DataGrid with Server-Side Loading

Forms with Validation

Dialog Service

Radzen vs Other Free Blazor Libraries

Best Practices

raise-blazor

来源信息

安装方式

检查来源文件

同仓库更多 Skills

Radzen Blazor Components

Overview

Radzen Blazor Components

Overview

Installation and Service Registration

DataGrid with Server-Side Loading

Forms with Validation

Dialog Service

Radzen vs Other Free Blazor Libraries

Best Practices

同仓库更多 Skills