We built a report designer for Blazor and 4 components along with it

stsrki1 pts1 comments

Announcing Blazorise 2.3 - Jadro

Blazorise 2.3 is codenamed Jadro, after the river that runs through Solin, Croatia, an ancient city known as Salona in Roman times.<br>The release itself started with a simple idea: build a Reporting solution for Blazorise. Once work began, it quickly became clear that a report designer needed several things that did not yet exist in the framework. Instead of building them only for Reporting, we turned them into reusable components that everyone can use.<br>That became the main story of Blazorise 2.3. But Reporting is only part of the release. We also added CodeEditor and Resizer, rebuilt DatePicker and TimePicker with Blazor and C#, and continued improving Gantt, Scheduler, PdfViewer, and styling.

Key Blazorise 2.3 Highlights<br>Here are some of the most important additions and updates:<br>Reporting: Visual report designer with multiple data sources and HTML/PDF output.<br>Reporting Building Blocks: New DockLayout, ContextMenu, PropertyGrid, and PDF generation.<br>CodeEditor: Source-code and custom language editing for Blazor applications.<br>DatePicker and TimePicker: Rebuilt in Blazor and C#, removing the Flatpickr dependency.<br>Gantt and Scheduler: Weekly Gantt timelines, milestones, custom Scheduler fields, and custom appointment editors.<br>Layout and Styling: A new Resizer component, shorter CSS value syntax, and support for custom CSS colors.

Upgrading from 2.2.x to 2.3<br>Update all Blazorise.* package references to 2.3.

"Blazorise" Version="2.2.*" /><br>"Blazorise.Bootstrap5" Version="2.2.*" />

Change them to:

"Blazorise" Version="2.3.0" /><br>"Blazorise.Bootstrap5" Version="2.3.0" />

Reporting and the Components It Needed<br>Reporting is one of the largest features we have built for Blazorise. The goal was to provide a reporting system that felt like part of the framework, with a visual designer and enough flexibility for common business reports.

Reports use a familiar band-based model and can work with application objects, tabular data, CSV files, and SQL sources. The expression system covers formulas, totals, grouping, and formatting, while reports can be previewed as HTML or PDF.<br>The designer focuses on the tasks users expect from a visual reporting tool. You can drag fields and report elements onto the page, move and resize them, edit their properties, align items, and undo changes. Report definitions and designer state can also be saved and loaded.<br>We also spent a lot of time on the parts users don't immediately see, but that matter in real applications. The designer keeps its layout and editing state when switching between Design and Preview, longer operations can be cancelled, older preview results cannot replace newer ones, and larger reports refresh more efficiently. Accessibility, localization, theming, and error handling were also brought in line with the rest of Blazorise.<br>The Reporting documentation covers the designer, data sources, expressions, and complete examples.<br>DockLayout<br>The first missing piece was the designer workspace. Reporting needed panels that users could move, resize, group into tabs, hide, and restore.<br>That work became DockLayout, a standalone component for building IDE-style and user-configurable layouts. Applications can create horizontal and vertical splits, dock panes by dragging them, and save the layout so it can be restored later.

DockLayout is used by the Reporting designer, but it can also be used for dashboards, admin tools, editors, and other applications that need a flexible workspace.<br>More layout and docking examples are available in the DockLayout documentation.<br>ContextMenu<br>The designer also needed context-specific actions for the object being edited, which led to the new ContextMenu component.<br>ContextMenu covers the common menu cases, including nested items, checked items, groups, keyboard navigation, and opening from either a target element or application code. Focus handling, accessibility, and menu positioning are built in, so it behaves like a complete Blazorise component rather than a Reporting-only helper.<br>For more examples, visit the ContextMenu documentation.<br>PropertyGrid<br>Once a report element was selected, users needed a clear way to inspect and change its settings. That became the new PropertyGrid component.<br>PropertyGrid can build editors manually or from a schema, with support for grouping, search, descriptions, templates, and actions. Reporting uses it in the designer, but it can also be used for settings pages, configuration tools, admin screens, and other object-editing scenarios.<br>Manual and schema-driven setups are covered in the PropertyGrid documentation.<br>PDF Generation<br>Reporting also needed PDF preview and export, which led to the new Blazorise.Pdf extension.<br>PDF documents can be created with Razor components or fluent builders. The API covers the main building blocks needed for business documents, including text, images, shapes, and tables, with support for Unicode and custom fonts.<br>We also spent time making PDF generation...

reporting blazorise designer needed report docklayout

Related Articles