stimulsoft-dashboards-js-react 2025.2.1

package/viewer.d.ts

@@ -0,0 +1,25 @@
+import * as React from 'react'
+import { Stimulsoft } from './stimulsoft.reports'
+export { Stimulsoft };
+
+interface ViewerProperties {
+    report?: Stimulsoft.Report.StiReport;
+    visible?: boolean,
+    options?: Stimulsoft.Viewer.StiViewerOptions,
+    id?: string,
+
+    onPrepareVariables?: (args: Stimulsoft.Report.PrepareVariablesArgs, callback: (result: Stimulsoft.Report.PrepareVariablesObject[] | Stimulsoft.Report.PrepareVariablesArgs) => void) => void,
+    onBeginProcessData?: (args: Stimulsoft.Report.BeginProcessDataArgs, callback: (result: any) => void) => void,
+    onEndProcessData?: (args: Stimulsoft.Report.EndProcessDataArgs) => void,
+    onPrintReport?: (args: Stimulsoft.Viewer.PrintReportEventArgs, callback: () => void) => void,
+    onBeginExportReport?: (args: Stimulsoft.Viewer.BeginExportReportArgs, callback: () => void) => void,
+    onEndExportReport?: (args: Stimulsoft.Viewer.EndExportReportArgs, callback: () => void) => void,
+    onInteraction?: (args: Stimulsoft.Viewer.InteractionArgs, callback: () => void) => void,
+    onEmailReport?: (args: Stimulsoft.Viewer.EmailReportArgs, callback: () => void) => void,
+    onDesignReport?: (args: Stimulsoft.Viewer.DesignReportArgs) => void,
+    onShowReport?: (args: Stimulsoft.Viewer.ShowReportArgs, callback: () => void) => void,
+    onOpenReport?: (args: Stimulsoft.Viewer.OpenReportArgs, callback: () => void) => void,
+    onOpenedReport?: (args: Stimulsoft.Viewer.OpenedReportArgs, callback: () => void) => void
+}
+
+export const Viewer: React.FunctionComponent<ViewerProperties>;

package/viewer.js

@@ -0,0 +1,69 @@
+import React from "react";
+import { } from "./stimulsoft.reports.engine.mjs";
+import { } from "./stimulsoft.reports.chart.mjs";
+import { } from "./stimulsoft.reports.export.mjs";
+import { } from "./stimulsoft.reports.import.xlsx.mjs";
+import { } from "./stimulsoft.reports.maps.mjs";
+import { } from "./stimulsoft.dashboards.mjs";
+import { Stimulsoft } from "./stimulsoft.viewer.mjs";
+export { Stimulsoft };
+
+export class Viewer extends React.Component {
+    #viewer;
+    #parentRef = React.createRef();
+
+    #createViewer() {
+        this.#viewer = new Stimulsoft.Viewer.StiViewer(this.props.options, this.props.id, false);
+        this.#viewer.renderHtml(this.#parentRef.current);
+        this.#bindEvents();
+
+        this.#viewer.visible = this.props.visible ?? true;
+    }
+
+    #bindEvents() {
+        if (typeof this.props.onPrepareVariables == "function") this.#viewer.onPrepareVariables = this.props.onPrepareVariables?.bind(this);
+        if (typeof this.props.onBeginProcessData == "function") this.#viewer.onBeginProcessData = this.props.onPonBeginProcessDatarepareVariables?.bind(this);
+        if (typeof this.props.onEndProcessData == "function") this.#viewer.onEndProcessData = this.props.onEndProcessData?.bind(this);
+        if (typeof this.props.onPrintReport == "function") this.#viewer.onPrintReport = this.props.onPrintReport?.bind(this);
+        if (typeof this.props.onBeginExportReport == "function") this.#viewer.onBeginExportReport = this.props.onBeginExportReport?.bind(this);
+        if (typeof this.props.onEndExportReport == "function") this.#viewer.onEndExportReport = this.props.onEndExportReport?.bind(this);
+        if (typeof this.props.onInteraction == "function") this.#viewer.onInteraction = this.props.onInteraction?.bind(this);
+        if (typeof this.props.onEmailReport == "function") this.#viewer.onEmailReport = this.props.onEmailReport?.bind(this);
+        if (typeof this.props.onDesignReport == "function") this.#viewer.onDesignReport = this.props.onDesignReport?.bind(this);
+        if (typeof this.props.onShowReport == "function") this.#viewer.onShowReport = this.props.onShowReport?.bind(this);
+        if (typeof this.props.onOpenReport == "function") this.#viewer.onOpenReport = (args, callback) => {
+            args.preventDefault = false;
+            this.props.onOpenReport?.bind(this)(args, callback);
+        }
+        if (typeof this.props.onOpenedReport == "function") this.#viewer.onOpenedReport = this.props.onOpenedReport?.bind(this);
+    }
+
+    componentDidMount() {
+        this.#createViewer();
+        this.#viewer.report = this.props.report;
+    }
+
+    componentWillUnmount() {
+        if (this.#viewer != null)
+            this.#viewer.dispose();
+    }
+
+    componentDidUpdate(prevProps) {
+        if (this.props.options !== prevProps.options) {
+            this.#createViewer();
+            this.#viewer.report = this.props.report;
+        }
+        if (this.props.report !== prevProps.report)
+            this.#viewer.report = this.props.report;
+        if (this.props.visible !== prevProps.visible)
+            this.#viewer.visible = this.props.visible;
+        if (this.props.id !== prevProps.id) {
+            this.#createViewer();
+            this.#viewer.report = this.props.report;
+        }
+    }
+
+    render() {
+        return React.createElement('div', { ref: this.#parentRef });
+    }
+}