What's New in ActiveReportsJS 4.0

March 28 2023

ActiveReports v4.0 brings several enhancements that improve the product experience for your application's developers, report authors, and end-users.

Ready to See the New Features? Download ActiveReportsJS Today!

Modern Front-End Tools Support

ActiveReportsJS has included support for React, Angular, and Vue frameworks since the beginning. Front-end development trends, though, brought new frameworks and tools which are now supported by ActiveReportsJS.

Vite

Vite.js is a build tool that provides a fast and lean development experience for modern web projects. You can now build your React or Vue projects that utilize the React Report Viewer and Designer or Vue Report Viewer and Designer, respectively, with Vite v2 or v3.

Next.js

Next.js is a React-based framework that provides a well-defined structure for your application and optimizations that make the development process and final application faster. You can now use the React Report Viewer and Designer in your Next.js v13 projects. It's important to realize that ActiveReportsJS components work only on the client side, and thus they have to be dynamically loaded. You can check this blog post for more information.

Nuxt.js

Nuxt.js is a Vue-based framework that provides a well-defined structure for your application and optimizations that make the development process and final application faster. You can now use the Vue Report Viewer and Designer in your Nuxt.js 3x Single Page Applications.

Svelte

Svelte is a radically new approach to building web applications. It's a compiler that converts components into efficient JavaScript that surgically updates the DOM. You can now use the Pure JavaScript Viewer and Designer components in your Svelte v3 projects.

New Layout Features

Multi-Section Continuous Page Layout

Continuous Page Layout has been updated to support multiple sections, each with a distinct page size, orientation, and margins. This feature enables you to integrate various types of content into a single report seamlessly. You can experience the versatility of the Multi-Section Layout feature by visiting the demo.

Multi-Section Report

Advanced Layout Options for the List

The List data region can now be configured to produce a grid-like representation of your data using advanced layout options. You can visit the Configuring List Layout for more information and check the demo on the website.

Advanced Layout Options

Advanced Interactivity

You can now configure the Apply Parameters interactive action to implement the Runtime Filtering in your reports. You can check the demo on the website to see the new interactive capabilities in action.

Runtime Filters

New API and Expressions

IndexOf Function

You can use the newly introduced IndexOf function to determine whether a given element can be found in the array or string.

Viewer.showParametersOnOpen Property

The Report Viewer component now exposes the showParametersOnOpen property that indicates whether the Parameters Panel should open automatically upon report loading, even if the report's parameters have default values.

Designer.documentChanged Event

The ReportDesigner component has been updated to include the ability to register a documentChanged event handler. This event is triggered whenever a user modifies a report that is currently loaded into the designer instance. This new API can be utilized to implement the AutoSave functionality and other scenarios.

UI Improvements

The User Interface of the Report Viewer and the Report Designer components can now be displayed in French.
The Report Designer User Interface has been refreshed and now includes the Rulers that you could use to set the margins of a report page.

Report Designer