UNPKG

@progress/telerik-angular-native-report-viewer

Version:

Progress® Telerik® Native Report Viewer for Angular

1,197 lines (1,196 loc) 46.1 kB
import { ReportingAngularViewerService } from './reporting-angular-viewer.service'; import { Observable, Subscription } from 'rxjs'; import { AfterViewInit, ElementRef, EventEmitter, NgZone, OnDestroy, Renderer2, SimpleChanges, ChangeDetectorRef, OnInit, ViewContainerRef, TemplateRef } from '@angular/core'; import { DocumentInfo, PageInfo, ReportSourceOptions, ReportServerSettings, ReportServerTokenSettings, ParameterInfo, PageActionEventArgs, PrintStartedEventArgs, PrintDocumentReadyEventArgs, ExportStartedEventArgs, ExportDocumentReadyEventArgs, CurrentPageChangedEventArgs, TooltipEventArgs } from '@progress/telerik-common-report-viewer'; import { SVGIcon } from '@progress/kendo-svg-icons'; import { NotificationService } from "@progress/kendo-angular-notification"; import { PageMode, PrintMode, ScaleMode, ServiceType, ViewMode } from './models/types'; import { LicenseInfo } from '@progress/telerik-common-report-viewer/dist/Types/LicenseInfoType'; import { PromptOutput } from '@progress/kendo-angular-conversational-ui'; import * as i0 from "@angular/core"; /** * Native Angular Report Viewer Component. * Provides a comprehensive interface for previewing reports * from a Telerik Reporting REST Service or a Telerik Report Server instance. * @example * ```html * <reporting-angular-viewer #viewerId * [serviceUrl]="serviceUrl" * [reportSource]="reportSource"> * </reporting-angular-viewer> * ``` * @example * ```typescript * import { Component, ViewChild } from '@angular/core'; * import { ReportingAngularViewerComponent, ReportingAngularViewerModule } from '@progress/telerik-angular-native-report-viewer' * import { ReportSourceOptions } from '@progress/telerik-common-report-viewer' * * @Component({ * imports: [ReportingAngularViewerModule] * }) * export class AppComponent { * @ViewChild('viewerId') reportViewer!: ReportingAngularViewerComponent; * serviceUrl: string = 'https://demos.telerik.com/reporting/api/reports'; * reportSource: ReportSourceOptions = { * report: 'Report Catalog.trdp', * parameters: {} * }; * } * ``` */ export declare class ReportingAngularViewerComponent implements OnInit, AfterViewInit, OnDestroy { private ngZone; private renderer; private cdr; hostEl: ElementRef; service: ReportingAngularViewerService; private kendoNotificationService; hostClass: boolean; private readonly historySessionKey; private readonly currentHistoryIndexSessionKey; private readonly currentHistoryItemSessionKey; /** * Sets the scale factor for the report pages. * The scale takes effect when the scaleMode is set to 'specific'. * @default 1.0 (100% - original size of the report) * @example * ```html * <reporting-angular-viewer * [scale]="scale"> * </reporting-angular-viewer> * ``` * @example * ```typescript * scale: number = 1.5 // 150% scale * ``` */ scale: number; /** * Sets the address of the Reporting REST Service. * Required when serviceType is 'REST'. * @example * ```html * <reporting-angular-viewer * [serviceUrl]="serviceUrl"> * </reporting-angular-viewer> * ``` * @example * ```typescript * serviceUrl: string = 'https://demos.telerik.com/reporting/api/reports'; * ``` */ serviceUrl?: string; /** * Sets the width of the report viewer container. * @default '100%' * @example * ```html * <reporting-angular-viewer * [width]="width"> * </reporting-angular-viewer> * ``` * @example * ```typescript * width: string = '800px'; * ``` */ width: string; /** * Sets the height of the report viewer container. * @default '700px' * @example * ```html * <reporting-angular-viewer #viewerId * [height]="height"> * </reporting-angular-viewer> * ``` * @example * ```typescript * height: string = '600px'; * ``` */ height: string; /** * A bearer token to be added in the Authorization header of each request. * Used for authentication with the reporting service. * @example * ```html * <reporting-angular-viewer * [authenticationToken]="authenticationToken"> * </reporting-angular-viewer> * ``` * @example * ```typescript * authenticationToken: string = "Bearer your-authentication-token"; * ``` */ authenticationToken?: string; /** * Sets the tab index for the report viewer content. * @default 1000 * @example * ```html * <reporting-angular-viewer * [contentTabIndex]="contentTabIndex"> * </reporting-angular-viewer> * ``` * @example * ```typescript * contentTabIndex: number = 1500; * ``` */ contentTabIndex: number; /** * Sets how the report pages are scaled. * @default 'specific' * @example * ```html * <reporting-angular-viewer * [scaleMode]="scaleMode"> * </reporting-angular-viewer> * ``` * @example * ```typescript * scaleMode: ScaleMode = 'fitPageWidth'; * ``` */ scaleMode: ScaleMode; /** * Enables or disables the send email functionality. * @default false * @example * ```html * <reporting-angular-viewer * [enableSendEmail]="enableSendEmail"> * </reporting-angular-viewer> * ``` * @example * ```typescript * enableSendEmail: boolean = true; * ``` */ enableSendEmail: boolean; /** * Determines whether to keep the client session alive. * When true, prevents the session from timing out during long periods of inactivity. * @default false * @example * ```html * <reporting-angular-viewer * [keepClientAlive]="keepClientAlive"> * </reporting-angular-viewer> * ``` * @example * ```typescript * keepClientAlive: boolean = true; * ``` */ keepClientAlive: boolean; /** * Specifies the type of service that the report viewer will connect to. * @default 'REST' * @example * ```html * <reporting-angular-viewer * [serviceType]="serviceType"> * </reporting-angular-viewer> * ``` * @example * ```typescript * serviceType: ServiceType = 'reportServer'; * ``` */ serviceType: ServiceType; /** * Sets the view mode of the report viewer. * @default 'interactive' * @example * ```html * <reporting-angular-viewer * [viewMode]="viewMode"> * </reporting-angular-viewer> * ``` * @example * ```typescript * viewMode: ViewMode = 'printPreview'; * ``` */ viewMode: ViewMode; /** * Controls the visibility of the document map panel if a document map is available. * @default true * @example * ```html * <reporting-angular-viewer * [documentMapVisible]="documentMapVisible"> * </reporting-angular-viewer> * ``` * @example * ```typescript * documentMapVisible: boolean = false; * ``` */ documentMapVisible: boolean; /** * Specifies the report and initial report parameter values to be displayed. * The report property can be a relative path to a physical file (TRDP/TRDX/TRBP) or an assembly qualified name for type definitions. * The ReportSourceOptions type should be imported from '@progress/telerik-common-report-viewer'. * @example * ```html * <reporting-angular-viewer * [reportSource]="reportSource"> * </reporting-angular-viewer> * ``` * @example * ```typescript * reportSource: ReportSourceOptions = { * report: 'Dashboard.trdx', // or '{Category}/{ReportName}' when connected to a Report Server * parameters: { ReportYear: 2004 } * }; * ``` */ reportSource?: ReportSourceOptions; /** * Sets the print mode for the report viewer. * @default 'autoSelect' * @example * ```html * <reporting-angular-viewer * [printMode]="printMode"> * </reporting-angular-viewer> * ``` * @example * ```typescript * printMode: PrintMode = 'forcePDFFile'; * ``` */ printMode: PrintMode; /** * Controls the visibility of the parameters area if the report has parameters. * @default true * @example * ```html * <reporting-angular-viewer * [parametersAreaVisible]="parametersAreaVisible"> * </reporting-angular-viewer> * ``` * @example * ```typescript * parametersAreaVisible: boolean = false; * ``` */ parametersAreaVisible: boolean; /** * Sets the page display mode of the viewer. * @default 'continuousScroll' * @example * ```html * <reporting-angular-viewer * [pageMode]="pageMode"> * </reporting-angular-viewer> * ``` * @example * ```typescript * pageMode: PageMode = 'singlePage'; * ``` */ pageMode: PageMode; /** * Configuration for Telerik Report Server connection. * * The authentication method depends on the Report Server version: * - Report Server for .NET: Supports Token authentication (ReportServerTokenSettings) or username/password authentication (ReportServerSettings). The token can be from any user, including the Guest user. * - Report Server for .NET Framework 4.6.2: Supports username/password authentication (ReportServerSettings) or Guest account (url only with ReportServerSettings, if Guest is enabled on the server). * * Required when serviceType is set to 'reportServer'. * The ReportServerSettings or ReportServerTokenSettings types should be imported from '@progress/telerik-common-report-viewer'. * * ReportServerTokenSettings properties: * - url (string, required) - The URL to the Telerik Report Server instance. * - getPersonalAccessToken (function, required) - A callback function that returns the Token for authentication against the Telerik Report Server for .NET instance wrapped in a Promise. This is the recommended authentication method for Report Server for .NET. The token can be from any user account, including the Guest user. Only supported by Report Server for .NET. * * ReportServerSettings properties: * - url (string, required) - The URL to the Telerik Report Server instance. * - username (string, required) - A registered username in the Report Server that will be used to get access to the reports. Supported by both Report Server for .NET and Report Server for .NET Framework 4.6.2. * - password (string, required) - The password for the provided username. Supported by both Report Server for .NET and Report Server for .NET Framework 4.6.2. * * @example * ```html * <!-- Report Server for .NET - Token authentication (recommended) --> * <reporting-angular-viewer * [reportServer]="{ * url: 'https://my-report-server-net/', * getPersonalAccessToken: getPersonalAccessToken * }" * [reportSource]="{ * report: 'Samples/Dashboard' * }"> * </reporting-angular-viewer> * ``` * @example * ```typescript * // Report Server for .NET - Token authentication (recommended) * getPersonalAccessToken() { * return Promise.resolve('<personal-access-token>'); * } * ``` * * @example * ```html * <!-- Report Server for .NET - Token authentication with secure endpoint --> * <reporting-angular-viewer * [reportServer]="{ * url: 'https://my-report-server-net/', * getPersonalAccessToken: getPersonalAccessToken * }" * [reportSource]="{ * report: 'Samples/Dashboard' * }"> * </reporting-angular-viewer> * ``` * @example * ```typescript * // Report Server for .NET - Token authentication with secure endpoint * getPersonalAccessToken() { * return fetch('/rs-token') * .then(response => response.text()); * } * ``` * * @example * ```html * <!-- Report Server for .NET - Token authentication with Guest user token --> * <reporting-angular-viewer * [reportServer]="{ * url: 'https://my-report-server-net/', * getPersonalAccessToken: getPersonalAccessToken * }" * [reportSource]="{ * report: 'Samples/Dashboard' * }"> * </reporting-angular-viewer> * ``` * @example * ```typescript * // Report Server for .NET - Token authentication with Guest user token * getPersonalAccessToken() { * return Promise.resolve('<guest-user-token>'); * } * ``` * * @example * ```typescript * // Report Server for .NET - Token authentication using ReportServerTokenSettings * import { ReportServerTokenSettings } from '@progress/telerik-common-report-viewer'; * * reportServer: ReportServerTokenSettings = new ReportServerTokenSettings( * 'https://my-report-server-net/', * () => Promise.resolve('<personal-access-token>') * ); * ``` * * @example * ```html * <!-- Report Server for .NET - Username/password authentication --> * <reporting-angular-viewer * [reportServer]="{ * url: 'https://my-report-server-net/', * username: 'myUser', * password: 'myPassword' * }" * [reportSource]="{ * report: 'Samples/Dashboard' * }"> * </reporting-angular-viewer> * ``` * * @example * ```typescript * // Report Server for .NET - Username/password authentication using ReportServerSettings * import { ReportServerSettings } from '@progress/telerik-common-report-viewer'; * * reportServer: ReportServerSettings = new ReportServerSettings( * 'https://my-report-server-net/', * 'myUser', * 'myPassword' * ); * ``` * * @example * ```html * <!-- Report Server for .NET Framework 4.6.2 - Username/password authentication --> * <reporting-angular-viewer * [reportServer]="{ * url: 'https://my-report-server-framework/', * username: 'myUser', * password: 'myPassword' * }" * [reportSource]="{ * report: 'Samples/Dashboard' * }"> * </reporting-angular-viewer> * ``` * * @example * ```typescript * // Report Server for .NET Framework 4.6.2 - Username/password authentication using ReportServerSettings * import { ReportServerSettings } from '@progress/telerik-common-report-viewer'; * * reportServer: ReportServerSettings = new ReportServerSettings( * 'https://my-report-server-framework/', * 'myUser', * 'myPassword' * ); * ``` * * @example * ```html * <!-- Report Server for .NET Framework 4.6.2 - Guest account (requires Guest enabled on server) --> * <reporting-angular-viewer * [reportServer]="{ * url: 'https://my-report-server-framework/' * }" * [reportSource]="{ * report: 'Samples/Dashboard' * }"> * </reporting-angular-viewer> * ``` * * @example * ```typescript * // Complete example with Report Server for .NET using Token authentication * import { Component } from '@angular/core'; * import { ReportServerTokenSettings, ReportSource } from '@progress/telerik-common-report-viewer'; * * @Component({ * selector: 'app-root', * templateUrl: './app.component.html' * }) * export class AppComponent { * reportServer: ReportServerTokenSettings = { * url: 'https://my-report-server-net/', * getPersonalAccessToken: this.getPersonalAccessToken * }; * * reportSource: ReportSource = { * report: 'Samples/Dashboard', * parameters: { * ReportYear: 2004 * } * }; * * getPersonalAccessToken() { * return Promise.resolve('<personal-access-token>'); * } * } * ``` */ reportServer?: ReportServerSettings | ReportServerTokenSettings | null; /** * Determines whether to persist the viewer session across browser sessions. * @default false * @example * ```html * <reporting-angular-viewer * [persistSession]="persistSession"> * </reporting-angular-viewer> * ``` * @example * ```typescript * persistSession: boolean = true; * ``` */ persistSession: boolean; /** * Event emitted when the state of the viewer changes. * This event is triggered during various viewer operations and state transitions. * @event updateUI * @example * ```html * <reporting-angular-viewer * (updateUI)="updateUI()"> * </reporting-angular-viewer> * ``` * @example * ```typescript * updateUI() { * console.log("This event handler will be called when the state of the viewer changes."); * }; * ``` */ updateUI: EventEmitter<any>; /** * Event emitted when an error occurs in the viewer. * Provides error message details for debugging and user notification. * The event handler receives a 'string' argument containing the error message. * @event error * ```html * <reporting-angular-viewer * (error)="error($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * error(message: string) { * console.log("The error message.", message); * console.log("This event will be emitted when viewer encounters an error."); * }; * ``` */ error: EventEmitter<string>; /** * Event emitted when printing starts. * Triggered at the beginning of a print operation. * @event printStarted * @example * ```html * <reporting-angular-viewer * (printStarted)="printStarted($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * printStarted(printStartedEventArgs: PrintStartedEventArgs) { * console.log("This event will be emitted when the printing starts.", printStartedEventArgs); * }; * ``` */ printStarted: EventEmitter<PrintStartedEventArgs>; /** * Event emitted when an export operation is triggered. * Fired at the start of any report export process. * @event exportStarted * @example * ```html * <reporting-angular-viewer * (exportStarted)="exportStarted($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * exportStarted(exportStartedEventArgs: ExportStartedEventArgs) { * console.log("This event will be emitted when an export operation is triggered.", exportStartedEventArgs); * }; * ``` */ exportStarted: EventEmitter<ExportStartedEventArgs>; /** * Event emitted after the rendering of a report begins. * Indicates that the report rendering process has started. * @event beginLoadReport * @example * ```html * <reporting-angular-viewer * (beginLoadReport)="beginLoadReport()"> * </reporting-angular-viewer> * ``` * @example * ```typescript * beginLoadReport() { * console.log("This event will be emitted after the rendering of a report begins."); * }; * ``` */ beginLoadReport: EventEmitter<any>; /** * Event emitted before the rendering of a report begins. * Provides an opportunity to perform actions before report loading starts. * @event beforeLoadReport * @example * ```html * <reporting-angular-viewer * (beforeLoadReport)="beforeLoadReport()"> * </reporting-angular-viewer> * ``` * @example * ```typescript * beforeLoadReport() { * console.log("This event will be emitted before the rendering of a report begins."); * }; * ``` */ beforeLoadReport: EventEmitter<any>; /** * Event emitted when report rendering is stopped. * Triggered when the user stops an ongoing rendering operation. * @event renderingStopped * @example * ```html * <reporting-angular-viewer * (renderingStopped)="renderingStopped()"> * </reporting-angular-viewer> * ``` * @example * ```typescript * renderingStopped() { * console.log("This event will be emitted when report rendering is cancelled."); * }; * ``` */ renderingStopped: EventEmitter<any>; /** * Event emitted when the loaded report changes. * Triggered during navigation between different reports. * @event loadedReportChange * @example * ```html * <reporting-angular-viewer * (loadedReportChange)="loadedReportChange()"> * </reporting-angular-viewer> * ``` * @example * ```typescript * loadedReportChange() { * console.log("This event will be emitted when the loaded report is changed."); * }; * ``` */ loadedReportChange: EventEmitter<any>; /** * Event emitted after the viewer finishes printing the report. * Indicates that the print document is ready and the print operation is complete. * @event printDocumentReady * @example * ```html * <reporting-angular-viewer * (printDocumentReady)="printDocumentReady($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * printDocumentReady(printDocumentReadyEventArgs: PrintDocumentReadyEventArgs) { * console.log("This event will be emitted after the viewer finishes printing the report.", printDocumentReadyEventArgs); * }; * ``` */ printDocumentReady: EventEmitter<PrintDocumentReadyEventArgs>; /** * Event emitted when a report page is ready. * Provides information about the rendered page, including page number and content details. * The event handler receives an object of type 'PageInfo' containing details about the rendered page. * The 'PageInfo' type should be imported from '@progress/telerik-common-report-viewer'. * @event pageReady * @example * ```html * <reporting-angular-viewer * (pageReady)="pageReady($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * pageReady(pageInfo: PageInfo) { * console.log("The current page information such as the page number, the page content, etc.", pageInfo); * console.log("This event will be emitted when the viewer content has been loaded from the template and is ready to display reports or perform any other operations on it."); * }; * ``` */ pageReady: EventEmitter<PageInfo>; /** * Event emitted after the viewer finishes exporting the report. * Triggered when an export operation completes successfully. * @event exportDocumentReady * @example * ```html * <reporting-angular-viewer * (exportDocumentReady)="exportDocumentReady($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * exportDocumentReady(exportDocumentReadyEventArgs: ExportDocumentReadyEventArgs) { * console.log("This event will be emitted after the viewer finishes exporting the report.", exportDocumentReadyEventArgs); * }; * ``` */ exportDocumentReady: EventEmitter<ExportDocumentReadyEventArgs>; /** * Event emitted when the cursor hovers over an interactive action. * Provides an object containing information about the interactive action. * The event handler receives a PageActionEventArgs object containing information about the interactive action. * The PageActionEventArgs type should be imported from '@progress/telerik-common-report-viewer'. * @event interactiveActionEnter * @example * ```html * <reporting-angular-viewer * (interactiveActionEnter)="interactiveActionEnter($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * interactiveActionEnter(interactiveActionArgs: PageActionEventArgs) { * console.log("The interactive action arguments.", interactiveActionArgs); * console.log("This event will be emitted when the cursor hovers over an interactive action."); * }; * ``` */ interactiveActionEnter: EventEmitter<PageActionEventArgs>; /** * Event emitted when an interactive action is being executed. * Triggered for actions like drill-down, bookmarks, and hyperlinks. * @event interactiveActionExecuting * @example * ```html * <reporting-angular-viewer * (interactiveActionExecuting)="interactiveActionExecuting($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * interactiveActionExecuting(pageActionEventArgs: PageActionEventArgs) { * console.log("This event will be emitted before an interactive action is executed."); * }; * ``` */ interactiveActionExecuting: EventEmitter<PageActionEventArgs>; /** * Event emitted when the cursor leaves the interactive action area. * Provides an object containing information about the interactive action. * The event handler receives a PageActionEventArgs object containing information about the interactive action. * The PageActionEventArgs type should be imported from '@progress/telerik-common-report-viewer'. * @event interactiveActionLeave * @example * ```html * <reporting-angular-viewer * (interactiveActionLeave)="interactiveActionLeave($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * interactiveActionLeave(interactiveActionArgs: PageActionEventArgs) { * console.log("The interactive action arguments.", interactiveActionArgs); * console.log("This event will be emitted when the cursor leaves the interactive action area."); * }; * ``` */ interactiveActionLeave: EventEmitter<PageActionEventArgs>; /** * Event emitted when a tooltip is opened. * Provides an object containing information about the tooltip. * The event handler receives a TooltipEventArgs object containing information about the tooltip. * The TooltipEventArgs type should be imported from '@progress/telerik-common-report-viewer'. * @event toolTipOpening * @example * ```html * <reporting-angular-viewer * (toolTipOpening)="toolTipOpening($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * toolTipOpening(tooltipEventArgs: TooltipEventArgs) { * console.log("The tooltip arguments.", tooltipEventArgs); * console.log("This event will be emitted when a tooltip is opened."); * }; * ``` */ toolTipOpening: EventEmitter<TooltipEventArgs>; /** * Event emitted when a tooltip is closed. * Provides an object containing information about the tooltip. * The event handler receives a TooltipEventArgs object containing information about the tooltip. * The TooltipEventArgs type should be imported from '@progress/telerik-common-report-viewer'. * @event toolTipClosing * @example * ```html * <reporting-angular-viewer * (toolTipClosing)="toolTipClosing($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * toolTipClosing(tooltipEventArgs: TooltipEventArgs) { * console.log("The tooltip arguments.", tooltipEventArgs); * console.log("This event will be emitted when a tooltip is closed."); * }; * ``` */ toolTipClosing: EventEmitter<TooltipEventArgs>; /** * Event emitted when there's a version mismatch between the viewer and REST service. * Provides an error message indicating the version incompatibility. * The event handler receives a 'string' argument containing the version of the Reporting REST service backend. * @event reportVersionMismatch * @example * ```html * <reporting-angular-viewer * (reportVersionMismatch)="reportVersionMismatch($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * reportVersionMismatch(restVersion: string) { * console.log("REST Service version.", restVersion); * console.log("This event will be emitted when there is mismatch between the version of the viewer and the reporting service."); * }; * ``` */ reportVersionMismatch: EventEmitter<string>; /** * Event emitted after each successful Get Document Info request until report rendering is complete. * Provides progress information during the report loading process. * The event handler receives an object of type 'DocumentInfo' containing the document information object. * The DocumentInfo type should be imported from '@progress/telerik-common-report-viewer'. * @event reportLoadProgress * @example * ```html * <reporting-angular-viewer * (reportLoadProgress)="reportLoadProgress($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * reportLoadProgress(documentInfo: DocumentInfo) { * console.log("The documentInfo parameter will contain the current information for the report rendering progress.", documentInfo); * console.log("This event will be emitted after each successful Get Document Info request until the report rendering is complete."); * }; * ``` */ reportLoadProgress: EventEmitter<DocumentInfo>; /** * Event emitted after the rendering of a report ends. * Provides complete document information including page count, document map availability, etc. * The event handler receives an object of type 'DocumentInfo' containing the document information object. * The DocumentInfo type should be imported from '@progress/telerik-common-report-viewer'. * @event reportLoadComplete * @example * ```html * <reporting-angular-viewer * (reportLoadComplete)="reportLoadComplete($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * reportLoadComplete(documentInfo: DocumentInfo) { * console.log("The document information such as the page count, whether it has a document map, etc. will be sent via the documentInfo object.", documentInfo); * console.log("This event will be emitted after the rendering of a report ends."); * }; * ``` */ reportLoadComplete: EventEmitter<DocumentInfo>; /** * Event emitted when report auto-run is disabled. * Triggered when the report requires user input for parameters before rendering. * @event reportAutoRunOff * @example * ```html * <reporting-angular-viewer * (reportAutoRunOff)="reportAutoRunOff()"> * </reporting-angular-viewer> * ``` * @example * ```typescript * reportAutoRunOff() { * console.log("This event can be emitted once the report parameters are loaded."); * console.log("This event is emitted if and only if the report's AutoRun setting is set to false."); * }; * ``` */ reportAutoRunOff: EventEmitter<any>; /** * Event emitted when the current page changes. * Provides information about the new current page and report document ID. * The event handler receives an object of type 'CurrentPageOptions' containing the new current page number and report document ID. * @event currentPageChanged * @example * ```html * <reporting-angular-viewer * (currentPageChanged)="currentPageChanged($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * currentPageChanged(currentPageChangedEventArgs: CurrentPageChangedEventArgs) { * console.log("The page number and document id.", currentPageChangedEventArgs); * console.log("This event will be emitted when the viewer changes its currently displayed page."); * }; * ``` */ currentPageChanged: EventEmitter<CurrentPageChangedEventArgs>; /** * Event emitted when navigating to a different report. * Triggered by interactive actions that load a new report, such as drill-through actions. * The event handler receives an object of type 'ReportSourceOptions' containing the new report source options. * The ReportSourceOptions type should be imported from '@progress/telerik-common-report-viewer'. * @event navigateToReport * @example * ```html * <reporting-angular-viewer * (navigateToReport)="navigateToReport($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * navigateToReport(reportSourceOptions: ReportSourceOptions) { * console.log("The report source object of the newly loaded report.", reportSourceOptions); * console.log("This event will be emitted when the viewer navigates to a new report through the Drillthrough/Navigate To Report action."); * }; * ``` */ navigateToReport: EventEmitter<ReportSourceOptions>; /** * Event emitted when report parameters are loaded. * Provides an array of parameter information including their values and metadata. * The event handler receives an array of type 'ParameterInfo[]' containing parameter information objects. * The ParameterInfo type should be imported from '@progress/telerik-common-report-viewer'. * @event parametersLoaded * @example * ```html * <reporting-angular-viewer * (parametersLoaded)="parametersLoaded($event)"> * </reporting-angular-viewer> * ``` * @example * ```typescript * parametersLoaded(parameterInfos: ParameterInfo[]) { * console.log("An array of the parameter values is sent via the parameterInfos object.", parameterInfos); * console.log("This event will be emitted after the Get Report Parameters request is made."); * }; * ``` */ parametersLoaded: EventEmitter<ParameterInfo[]>; redoIcon: SVGIcon; undoIcon: SVGIcon; printIcon: SVGIcon; rewindIcon: SVGIcon; zoomInIcon: SVGIcon; searchIcon: SVGIcon; sparklesIcon: SVGIcon; xCircleIcon: SVGIcon; forwardIcon: SVGIcon; zoomOutIcon: SVGIcon; fileTxtIcon: SVGIcon; downloadIcon: SVGIcon; alignLeftIcon: SVGIcon; positionLeftIcon: SVGIcon; positionRightIcon: SVGIcon; arrowRotateCwIcon: SVGIcon; caretAltToLeftIcon: SVGIcon; caretAltToRightIcon: SVGIcon; questionCircleIcon: SVGIcon; warningTriangleIcon: SVGIcon; subs: Subscription; resizeObservable: Observable<Event>; tooltipSelector: string; searchTerms: string[]; licenseBannerAppendTo: ViewContainerRef; licenseBannerTemplate: TemplateRef<unknown>; licenseBannerData: LicenseInfo | null; showLicenseBanner: boolean; showLicenseOverlay: boolean; aiAvailable: boolean; aiPromptOutputs: Array<PromptOutput>; aiPredefinedPrompts: Array<string>; constructor(ngZone: NgZone, renderer: Renderer2, cdr: ChangeDetectorRef, hostEl: ElementRef, service: ReportingAngularViewerService, kendoNotificationService: NotificationService); ngOnInit(): void; ngAfterViewInit(): void; ngOnChanges(changes: SimpleChanges): void; ngOnDestroy(): void; /** * Gets the current report's document map nodes if any. * @returns an array of DocumentMapNode objects if any. * @example * ```typescript * console.log("Document map nodes:", JSON.stringify(this.viewer.getDocumentMapNodes)); * ``` */ get getDocumentMapNodes(): any; /** * Gets the current report's rendering extensions. * @returns an array of RenderingExtension objects if any. * @example * ```typescript * console.log("Rendering extensions:", JSON.stringify(this.viewer.getRenderingExtensions)); * ``` */ get getRenderingExtensions(): any[]; onApplyButtonClick(): void; onParameterChanged(event: any): void; children: (dataItem: any) => Observable<any[]>; hasChildren: (dataItem: any) => boolean; navigateToPage(ev: any): void; getToolbarButtonTitle(buttonName: string): string; get splitterWrapperClasses(): string; /** * Gets whether the current report has parameters that have AutoRefresh disabled. * @returns true if at least one parameter has AutoRefresh disabled, false otherwise. * @example * ```typescript * if (this.viewer.hasLazyParameters) { * console.log("This report has lazy parameters."); * } * ``` */ get hasLazyParameters(): boolean; /** * Gets whether the report's AutoRun setting is enabled. * @returns true if the AutoRun setting is enabled, false otherwise. * @example * ```typescript * if (this.viewer.autoRunEnabled) { * console.log("This report's AutoRun setting is enabled."); * } * ``` */ get autoRunEnabled(): boolean; /** * Gets whether the parameter area is displayed. * @returns true if the parameter area is displayed, false otherwise. * @example * ```typescript * if (this.viewer.displayParameterArea) { * console.log("This report's parameter area is displayed."); * } * ``` */ get displayParameterArea(): boolean; /** * Gets whether the document map is displayed. * @returns true if the document map is displayed, false otherwise. * @example * ```typescript * if (this.viewer.displayDocumentMap) { * console.log("This report's document map is displayed."); * } * ``` */ get displayDocumentMap(): boolean; /** * Gets whether the current report is still being rendered. * @returns true if the report rendering process is ongoing, false otherwise. * @example * ```typescript * if (this.viewer.isRenderingInProgress) { * console.log("This report is still being rendered."); * } * ``` */ get isRenderingInProgress(): boolean; /** * Gets whether the current report has visible parameters. * @returns true if the report has visible parameters, false otherwise. * @example * ```typescript * if (this.viewer.isParametersSectionAvailable) { * console.log("This report has visible parameters."); * } * ``` */ get isParametersSectionAvailable(): boolean; /** * Gets whether the document map is available for the current report. * @returns True if the report has a document map, false otherwise. * @example * ```typescript * if (this.viewer.isDocumentMapAvailable) { * console.log("This report has a document map."); * } * ``` */ get isDocumentMapAvailable(): boolean; /** * Gets whether the search window is currently open. * @returns True if the search dialog is visible, false otherwise. * @example * ```typescript * if (this.viewer.isSearchWindowOpen) { * console.log("The search window is currently open."); * } * ``` */ get isSearchWindowOpen(): boolean; /** * Gets whether the AI prompt window is currently open. * @returns true if the AI assistant dialog is visible, false otherwise. * @example * ```typescript * if (this.viewer.isAiPromptWindowOpen) { * console.log("The AI prompt window is currently open."); * } * ``` */ get isAiPromptWindowOpen(): boolean; /** * Gets the total number of pages in the current report. * @returns The total page count of the rendered report. * @example * ```typescript * console.log("The total number of pages in the current report are.", this.viewer.totalPages); * ``` */ get totalPages(): number; /** * Executes a command on the report viewer. * This method allows you to programmatically trigger various viewer operations * such as navigation, export, zoom, and more. Commands are executed with optional * values that provide additional parameters for the operation. * Available commands: * - 'navigateBackward': Goes back to the previously rendered report from history. * - 'navigateForward': Goes forward to the previously rendered report from history. * - 'refreshReport': Refreshes the report. * - 'navigateToFirstPage': Goes to the first page of the report. * - 'navigateToPrevPage': Goes to the previous page of the report. * - 'navigateToNextPage': Goes to the next page of the report. * - 'navigateToLastPage': Goes to the last page of the report. * - 'setViewMode': Toggles between Print Preview and Interactive view modes. * - 'setScaleMode': Changes the viewer's scale mode. Accepts an object with 'scale' and 'scaleMode' properties which correspond to the viewer's 'scale' and 'scaleMode' settings. * - 'setReportSource': Changes the report source and refreshes the viewer. Accepts a ReportSourceOptions object. * - 'setAuthenticationToken': Sets a bearer token for authentication. Accepts a string value for the authentication token. * - 'exportReport': Exports the report using the specified rendering extension. Accepts a string value for the rendering extension. * - 'printReport': Triggers the report printing. * - 'toggleDocumentMap': Shows or hides the document map. * - 'toggleParametersSection': Shows or hides the parameters area. * - 'toggleSearchWindow': Shows or hides the search dialog. * - 'zoomIn': Zoom-in the report. * - 'zoomOut': Zoom-out the report. * - 'stopRendering': Stops the current rendering operation. * @param commandName - The name of the command to execute * @param commandValue - Optional value/parameters for the command * @example * ```typescript * this.viewer.executeCommand('exportReport', 'pdf'); // Export the report as PDF * ``` */ executeCommand(commandName: string, commandValue?: any): void; /** * Gets whether the viewer is in print preview mode. * @returns true if the viewer is in print preview mode, false otherwise. * @example * ```typescript * if (this.viewer.isInPrintViewMode) { * console.log("The viewer is currently in print preview mode."); * } * ``` */ get isInPrintViewMode(): boolean; private executeCommandInternal; private getPrintModeAsNumber; private getScaleModeAsNumber; private getPageModeAsNumber; private getViewModeAsNumber; private getServiceTypeAsNumber; private getErrorMessage; private initReportingSubs; private onBeforeLoadReport; private onReportVersionMismatch; private onReportLoadProgress; private onLoadedReportChange; private onReportLoadComplete; private onReportAutoRunOff; private saveSession; private restoreSession; private onRenderingStopped; private onError; private onParametersLoaded; private onCurrentPageChanged; private updateCurrentHistoryItemPageNumber; private onNavigateToReport; private onScaleModeChanged; private onScaleChanged; private onViewModeChanged; private updateScaleModeHistory; private updateScaleHistory; private updateViewModeHistory; private onMissingOrInvalidParameters; static ɵfac: i0.ɵɵFactoryDeclaration<ReportingAngularViewerComponent, never>; static ɵcmp: i0.ɵɵComponentDeclaration<ReportingAngularViewerComponent, "reporting-angular-viewer", never, { "scale": { "alias": "scale"; "required": false; }; "serviceUrl": { "alias": "serviceUrl"; "required": false; }; "width": { "alias": "width"; "required": false; }; "height": { "alias": "height"; "required": false; }; "authenticationToken": { "alias": "authenticationToken"; "required": false; }; "contentTabIndex": { "alias": "contentTabIndex"; "required": false; }; "scaleMode": { "alias": "scaleMode"; "required": false; }; "enableSendEmail": { "alias": "enableSendEmail"; "required": false; }; "keepClientAlive": { "alias": "keepClientAlive"; "required": false; }; "serviceType": { "alias": "serviceType"; "required": false; }; "viewMode": { "alias": "viewMode"; "required": false; }; "documentMapVisible": { "alias": "documentMapVisible"; "required": false; }; "reportSource": { "alias": "reportSource"; "required": false; }; "printMode": { "alias": "printMode"; "required": false; }; "parametersAreaVisible": { "alias": "parametersAreaVisible"; "required": false; }; "pageMode": { "alias": "pageMode"; "required": false; }; "reportServer": { "alias": "reportServer"; "required": false; }; "persistSession": { "alias": "persistSession"; "required": false; }; }, { "updateUI": "updateUI"; "error": "error"; "printStarted": "printStarted"; "exportStarted": "exportStarted"; "beginLoadReport": "beginLoadReport"; "beforeLoadReport": "beforeLoadReport"; "renderingStopped": "renderingStopped"; "loadedReportChange": "loadedReportChange"; "printDocumentReady": "printDocumentReady"; "pageReady": "pageReady"; "exportDocumentReady": "exportDocumentReady"; "interactiveActionEnter": "interactiveActionEnter"; "interactiveActionExecuting": "interactiveActionExecuting"; "interactiveActionLeave": "interactiveActionLeave"; "toolTipOpening": "toolTipOpening"; "toolTipClosing": "toolTipClosing"; "reportVersionMismatch": "reportVersionMismatch"; "reportLoadProgress": "reportLoadProgress"; "reportLoadComplete": "reportLoadComplete"; "reportAutoRunOff": "reportAutoRunOff"; "currentPageChanged": "currentPageChanged"; "navigateToReport": "navigateToReport"; "parametersLoaded": "parametersLoaded"; }, never, never, false, never>; }