@sisense/sdk-ui-angular 1.12.0 → 1.14.0

package/dist/fesm2020/sisense-sdk-ui-angular.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
 import { EventEmitter, Component, ViewChild, Input, Output, InjectionToken, Injectable, Inject, NgModule, Optional } from '@angular/core';
 import { CommonModule } from '@angular/common';
-import { ComponentAdapter, createElement, BasicMemberFilterTile, createContextProviderRenderer, CustomThemeProvider, CustomSisenseContextProvider, createClientApplication, executeQuery, executeQueryByWidgetId, getDashboardModel, getDashboardModels, getWidgetModel, getDefaultThemeSettings, getThemeSettingsByOid, MemberFilterTile, DateRangeFilterTile, Chart, Table, PivotTable, TableWidget, DashboardWidget, createWrapperElementHandler, createWrapperElement, DrilldownWidget, createComponentRenderer, ChartWidget, DrilldownBreadcrumbs, ContextMenu } from '@sisense/sdk-ui-preact';
+import { ComponentAdapter, createElement, BasicMemberFilterTile, createContextProviderRenderer, CustomThemeProvider, CustomSisenseContextProvider, createClientApplication, executeQuery, executeQueryByWidgetId, getDashboardModel, getDashboardModels, getWidgetModel, getDefaultThemeSettings, getThemeSettingsByOid, MemberFilterTile, DateRangeFilterTile, Chart, Table, PivotTable, TableWidget, DashboardWidget, createWrapperElementHandler, createWrapperElement, DrilldownWidget, createComponentRenderer, ChartWidget, DashboardById, Dashboard, DrilldownBreadcrumbs, ContextMenu } from '@sisense/sdk-ui-preact';
 export { boxWhiskerProcessResult } from '@sisense/sdk-ui-preact';
 import { map, BehaviorSubject } from 'rxjs';
 import { __decorate } from 'tslib';
@@ -340,7 +340,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 }]
         }], ctorParameters: function () { return [{ type: SisenseContextService }]; } });
 
-var packageVersion = '1.12.0';
+var packageVersion = '1.14.0';
 
 function Trackable(target, propertyKey, descriptor) {
     const originalMethod = descriptor.value;
@@ -373,7 +373,7 @@ async function track(action, methodName) {
                 packageVersion,
                 methodName,
             };
-            void trackProductEvent(action, payload, app.httpClient, !enableTracking).catch((e) => console.warn(`An error occurred when sending the ${action} event`, e));
+            void trackProductEvent(action, payload, app.httpClient, !enableTracking);
         }
     }
     catch (e) {
@@ -419,6 +419,8 @@ const THEME_CONFIG_TOKEN = new InjectionToken('theme configuration');
 /**
  * Service for working with Sisense Fusion themes.
  *
+ * If no theme service is used, the current Fusion theme is applied by default.
+ *
  * @group Contexts
  */
 let ThemeService = class ThemeService {
@@ -2851,6 +2853,153 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 type: Input
             }] } });
 
+/**
+ * A component that displays a range of data over a given time period or across multiple categories.
+ * It is particularly useful for visualizing the minimum and maximum values in a dataset, along with
+ * the area between these values.
+ *
+ * @example
+ * ```html
+ *    <csdk-area-range-chart
+ *      [dataSet]="chart.dataSet"
+ *      [dataOptions]="chart.dataOptions"
+ *      [highlights]="filters"
+ *      [beforeRender]="onBeforeRender"
+ *      (dataPointClick)="logArguments($event)"
+ *      (dataPointContextMenu)="logArguments($event)"
+ *      (dataPointsSelect)="logArguments($event)"
+ *    />
+ * ```
+ * ```ts
+import { Component } from '@angular/core';
+import { measureFactory, filterFactory, Filter } from '@sisense/sdk-data';
+import * as DM from '../../assets/sample-healthcare-model';
+import type { ChartType, RangeChartDataOptions } from '@sisense/sdk-ui-angular';
+
+@Component({
+  selector: 'app-analytics',
+  templateUrl: './analytics.component.html',
+  styleUrls: ['./analytics.component.scss'],
+})
+export class AnalyticsComponent {
+  DM = DM;
+  filters = [filterFactory.members(DM.Divisions.Divison_name, ['Cardiology', 'Neurology'])];
+  chart = {
+    chartType: 'arearange' as ChartType,
+    dataSet: DM.DataSource,
+    dataOptions: {
+      category: [DM.Admissions.Admission_Time.Years],
+      value: [
+        {
+            title: 'Admission Cost Range',
+            upperBound: measureFactory.multiply(
+              measureFactory.sum(DM.Admissions.Cost_of_admission, 'Lower Admission'),
+              0.6,
+            ),
+            lowerBound: measureFactory.multiply(
+              measureFactory.sum(DM.Admissions.Cost_of_admission, 'Upper Admission'),
+              1.4,
+             ),
+        }
+      ],
+      breakBy: [],
+    } as RangeChartDataOptions,
+  };
+
+  onBeforeRender(options: any) {
+    console.log('beforeRender');
+    console.log(options);
+    return options;
+  }
+
+  logArguments(...args: any[]) {
+    console.log(args);
+  }
+}
+ * ```
+ * <img src="media://angular-area-range-chart-example.png" width="800px" />
+ *
+ * @group Charts
+ * @beta
+ */
+class AreaRangeChartComponent {
+    constructor() {
+        /**
+         * {@inheritDoc @sisense/sdk-ui!AreaRangeChartProps.onDataPointClick}
+         *
+         * @category Callbacks
+         */
+        this.dataPointClick = new EventEmitter();
+        /**
+         * {@inheritDoc @sisense/sdk-ui!AreaRangeChartProps.onDataPointContextMenu}
+         *
+         * @category Callbacks
+         */
+        this.dataPointContextMenu = new EventEmitter();
+        /**
+         * {@inheritDoc @sisense/sdk-ui!AreaRangeChartProps.onDataPointsSelected}
+         *
+         * @category Callbacks
+         */
+        this.dataPointsSelect = new EventEmitter();
+        /** @internal */
+        this.chartType = 'arearange';
+    }
+}
+AreaRangeChartComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AreaRangeChartComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+AreaRangeChartComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: AreaRangeChartComponent, selector: "csdk-area-range-chart", inputs: { dataSet: "dataSet", dataOptions: "dataOptions", filters: "filters", highlights: "highlights", styleOptions: "styleOptions", beforeRender: "beforeRender" }, outputs: { dataPointClick: "dataPointClick", dataPointContextMenu: "dataPointContextMenu", dataPointsSelect: "dataPointsSelect" }, ngImport: i0, template: `
+    <csdk-chart
+      [chartType]="chartType"
+      [dataSet]="dataSet"
+      [dataOptions]="dataOptions"
+      [filters]="filters"
+      [highlights]="highlights"
+      [styleOptions]="styleOptions"
+      [beforeRender]="beforeRender"
+      (dataPointClick)="dataPointClick.emit($event)"
+      (dataPointContextMenu)="dataPointContextMenu.emit($event)"
+      (dataPointsSelect)="dataPointsSelect.emit($event)"
+    />
+  `, isInline: true, dependencies: [{ kind: "component", type: ChartComponent, selector: "csdk-chart", inputs: ["chartType", "dataSet", "dataOptions", "filters", "highlights", "styleOptions", "beforeRender"], outputs: ["dataPointClick", "dataPointContextMenu", "dataPointsSelect"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: AreaRangeChartComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'csdk-area-range-chart',
+                    template: `
+    <csdk-chart
+      [chartType]="chartType"
+      [dataSet]="dataSet"
+      [dataOptions]="dataOptions"
+      [filters]="filters"
+      [highlights]="highlights"
+      [styleOptions]="styleOptions"
+      [beforeRender]="beforeRender"
+      (dataPointClick)="dataPointClick.emit($event)"
+      (dataPointContextMenu)="dataPointContextMenu.emit($event)"
+      (dataPointsSelect)="dataPointsSelect.emit($event)"
+    />
+  `,
+                }]
+        }], propDecorators: { dataSet: [{
+                type: Input
+            }], dataOptions: [{
+                type: Input
+            }], filters: [{
+                type: Input
+            }], highlights: [{
+                type: Input
+            }], styleOptions: [{
+                type: Input
+            }], beforeRender: [{
+                type: Input
+            }], dataPointClick: [{
+                type: Output
+            }], dataPointContextMenu: [{
+                type: Output
+            }], dataPointsSelect: [{
+                type: Output
+            }] } });
+
 /**
  * The Table Widget component extending {@link TableComponent} component to support widget style options.
  *
@@ -3384,6 +3533,222 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                 type: Output
             }] } });
 
+/**
+ * An Angular component used for easily rendering a dashboard by its ID created in a Sisense Fusion instance.
+ *
+ * @example
+ * ```html
+ * <csdk-dashboard-by-id
+ *   [dashboardOid]="dashboardOid"
+ * />
+ * ```
+ * ```ts
+ * import { Component } from '@angular/core';
+ *
+ * @Component({
+ *  selector: 'app-dashboard',
+ *  templateUrl: './dashboard.component.html',
+ *  styleUrls: ['./dashboard.component.scss'],
+ * })
+ * export class DashboardComponent {
+ *  dashboardOid: string = '60f3e3e3e4b0e3e3e4b0e3e3';
+ * }
+ * ```
+ * @group Fusion Embed
+ * @fusionEmbed
+ * @internal
+ */
+class DashboardByIdComponent {
+    /**
+     * Constructor for the `DashboardById` component.
+     *
+     * @param sisenseContextService - Sisense context service
+     * @param themeService - Theme service
+     */
+    constructor(
+    /**
+     * Sisense context service
+     *
+     * @category Constructor
+     */
+    sisenseContextService, 
+    /**
+     * Theme service
+     *
+     * @category Constructor
+     */
+    themeService) {
+        this.sisenseContextService = sisenseContextService;
+        this.themeService = themeService;
+        this.componentAdapter = new ComponentAdapter(() => this.createPreactComponent(), [
+            createSisenseContextConnector(this.sisenseContextService),
+            createThemeContextConnector(this.themeService),
+        ]);
+    }
+    /**
+     * @internal
+     */
+    ngAfterViewInit() {
+        this.componentAdapter.render(this.preactRef.nativeElement);
+    }
+    /**
+     * @internal
+     */
+    ngOnChanges() {
+        if (this.preactRef) {
+            this.componentAdapter.render(this.preactRef.nativeElement);
+        }
+    }
+    createPreactComponent() {
+        const props = {
+            dashboardOid: this.dashboardOid,
+        };
+        return createElement(DashboardById, props);
+    }
+    /**
+     * @internal
+     */
+    ngOnDestroy() {
+        this.componentAdapter.destroy();
+    }
+}
+DashboardByIdComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DashboardByIdComponent, deps: [{ token: SisenseContextService }, { token: ThemeService }], target: i0.ɵɵFactoryTarget.Component });
+DashboardByIdComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DashboardByIdComponent, selector: "csdk-dashboard-by-id", inputs: { dashboardOid: "dashboardOid" }, viewQueries: [{ propertyName: "preactRef", first: true, predicate: ["preact"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "\n    <div #preact style=\"width: 100%; height: 100%\"></div>\n", isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DashboardByIdComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'csdk-dashboard-by-id',
+                    template,
+                }]
+        }], ctorParameters: function () { return [{ type: SisenseContextService }, { type: ThemeService }]; }, propDecorators: { preactRef: [{
+                type: ViewChild,
+                args: [rootId]
+            }], dashboardOid: [{
+                type: Input
+            }] } });
+
+/**
+ * An Angular component used for easily rendering a dashboard.
+ *
+ * @example
+ * ```html
+ * <csdk-dashboard
+ *  *ngIf="dashboard"
+ *  [title]="dashboard!.title"
+ *  [layout]="dashboard!.layout"
+ *  [widgets]="dashboard!.widgets"
+ *  [filters]="dashboard!.filters"
+ *  [defaultDataSource]="dashboard!.dataSource"
+ *  [widgetFilterOptions]="dashboard!.widgetFilterOptions"
+ * />
+ * ```
+ * ```ts
+ * import { Component } from '@angular/core';
+ * import { type DashboardModel, DashboardService } from '@sisense/sdk-ui-angular';
+ *
+ * @Component({
+ *  selector: 'app-dashboard',
+ *  templateUrl: './dashboard.component.html',
+ *  styleUrls: ['./dashboard.component.scss'],
+ * })
+ * export class DashboardComponent {
+ *
+ *  dashboard: DashboardModel | null = null;
+ *
+ *  constructor(private dashboardService: DashboardService) {}
+ *
+ *  async ngOnInit(): Promise<void> {
+ *    this.dashboard = await this.dashboardService.getDashboardModel('60f3e3e3e4b0e3e3e4b0e3e3', { includeWidgets: true, includeFilters: true });
+ *  }
+ * ```
+ * @group Fusion Embed
+ * @fusionEmbed
+ * @internal
+ */
+class DashboardComponent {
+    /**
+     * Constructor for the `Dashboard` component.
+     *
+     * @param sisenseContextService - Sisense context service
+     * @param themeService - Theme service
+     */
+    constructor(
+    /**
+     * Sisense context service
+     *
+     * @category Constructor
+     */
+    sisenseContextService, 
+    /**
+     * Theme service
+     *
+     * @category Constructor
+     */
+    themeService) {
+        this.sisenseContextService = sisenseContextService;
+        this.themeService = themeService;
+        this.componentAdapter = new ComponentAdapter(() => this.createPreactComponent(), [
+            createSisenseContextConnector(this.sisenseContextService),
+            createThemeContextConnector(this.themeService),
+        ]);
+    }
+    /**
+     * @internal
+     */
+    ngAfterViewInit() {
+        this.componentAdapter.render(this.preactRef.nativeElement);
+    }
+    /**
+     * @internal
+     */
+    ngOnChanges() {
+        if (this.preactRef) {
+            this.componentAdapter.render(this.preactRef.nativeElement);
+        }
+    }
+    createPreactComponent() {
+        const props = {
+            title: this.title,
+            layout: this.layout,
+            widgets: this.widgets,
+            filters: this.filters,
+            defaultDataSource: this.defaultDataSource,
+            widgetFilterOptions: this.widgetFilterOptions,
+        };
+        return createElement(Dashboard, props);
+    }
+    /**
+     * @internal
+     */
+    ngOnDestroy() {
+        this.componentAdapter.destroy();
+    }
+}
+DashboardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DashboardComponent, deps: [{ token: SisenseContextService }, { token: ThemeService }], target: i0.ɵɵFactoryTarget.Component });
+DashboardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.10", type: DashboardComponent, selector: "csdk-dashboard", inputs: { title: "title", layout: "layout", widgets: "widgets", filters: "filters", defaultDataSource: "defaultDataSource", widgetFilterOptions: "widgetFilterOptions" }, viewQueries: [{ propertyName: "preactRef", first: true, predicate: ["preact"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "\n    <div #preact style=\"width: 100%; height: 100%\"></div>\n", isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: DashboardComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'csdk-dashboard',
+                    template,
+                }]
+        }], ctorParameters: function () { return [{ type: SisenseContextService }, { type: ThemeService }]; }, propDecorators: { preactRef: [{
+                type: ViewChild,
+                args: [rootId]
+            }], title: [{
+                type: Input
+            }], layout: [{
+                type: Input
+            }], widgets: [{
+                type: Input
+            }], filters: [{
+                type: Input
+            }], defaultDataSource: [{
+                type: Input
+            }], widgetFilterOptions: [{
+                type: Input
+            }] } });
+
 /**
  * Drilldown Breadcrumbs Component
  *
@@ -3604,6 +3969,7 @@ SdkUiModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "1
         ColumnChartComponent,
         BarChartComponent,
         AreaChartComponent,
+        AreaRangeChartComponent,
         LineChartComponent,
         IndicatorChartComponent,
         ScatterChartComponent,
@@ -3622,13 +3988,16 @@ SdkUiModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "1
         BoxplotChartComponent,
         ScattermapChartComponent,
         AreamapChartComponent,
-        PivotTableComponent], imports: [CommonModule, DecoratorsModule], exports: [BasicMemberFilterTileComponent,
+        PivotTableComponent,
+        DashboardByIdComponent,
+        DashboardComponent], imports: [CommonModule, DecoratorsModule], exports: [BasicMemberFilterTileComponent,
         ChartComponent,
         TableComponent,
         ChartWidgetComponent,
         ColumnChartComponent,
         BarChartComponent,
         AreaChartComponent,
+        AreaRangeChartComponent,
         LineChartComponent,
         IndicatorChartComponent,
         ScatterChartComponent,
@@ -3647,7 +4016,9 @@ SdkUiModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "1
         BoxplotChartComponent,
         ScattermapChartComponent,
         AreamapChartComponent,
-        PivotTableComponent] });
+        PivotTableComponent,
+        DashboardByIdComponent,
+        DashboardComponent] });
 SdkUiModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SdkUiModule, imports: [CommonModule, DecoratorsModule] });
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImport: i0, type: SdkUiModule, decorators: [{
             type: NgModule,
@@ -3660,6 +4031,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                         ColumnChartComponent,
                         BarChartComponent,
                         AreaChartComponent,
+                        AreaRangeChartComponent,
                         LineChartComponent,
                         IndicatorChartComponent,
                         ScatterChartComponent,
@@ -3679,6 +4051,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                         ScattermapChartComponent,
                         AreamapChartComponent,
                         PivotTableComponent,
+                        DashboardByIdComponent,
+                        DashboardComponent,
                     ],
                     imports: [CommonModule, DecoratorsModule],
                     exports: [
@@ -3689,6 +4063,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                         ColumnChartComponent,
                         BarChartComponent,
                         AreaChartComponent,
+                        AreaRangeChartComponent,
                         LineChartComponent,
                         IndicatorChartComponent,
                         ScatterChartComponent,
@@ -3708,6 +4083,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
                         ScattermapChartComponent,
                         AreamapChartComponent,
                         PivotTableComponent,
+                        DashboardByIdComponent,
+                        DashboardComponent,
                     ],
                     providers: [],
                 }]
@@ -3723,8 +4100,20 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
  * @packageDocumentation
  * @groupDescription Charts
  * Angular components for charts
+ * @groupDescription Chart Utilities
+ * Utilities to be used with charts
+ * @groupDescription Data Grids
+ * Angular components for data grids
+ * @groupDescription Drilldown
+ * Angular components for creating drilldown experiences
+ * @groupDescription Filter Tiles
+ * Angular filter tile components
+ * @groupDescription Contexts
+ * Angular context modules, services, and variables
+ * @groupDescription Queries
+ * Angular query service
  * @groupDescription Fusion Embed
- * Fusion Dashboards, Widgets, Queries, and Formulas
+ * Angular modules, services, and components for working with Fusion Embed dashboards, widgets, queries, and formulas
  * @groupDescription Interfaces
  * TypeScript interfaces for components and services listed above
  * @groupDescription Type Aliases
@@ -3735,5 +4124,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.10", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AreaChartComponent, AreamapChartComponent, BarChartComponent, BasicMemberFilterTileComponent, BoxplotChartComponent, ChartComponent, ChartWidgetComponent, ColumnChartComponent, ContextMenuComponent, DashboardService, DashboardWidgetComponent, DateRangeFilterTileComponent, DrilldownBreadcrumbsComponent, DrilldownWidgetComponent, FunnelChartComponent, IndicatorChartComponent, LineChartComponent, MemberFilterTileComponent, PieChartComponent, PivotTableComponent, PolarChartComponent, QueryService, SISENSE_CONTEXT_CONFIG_TOKEN, ScatterChartComponent, ScattermapChartComponent, SdkUiModule, SisenseContextService, SunburstChartComponent, THEME_CONFIG_TOKEN, TableComponent, TableWidgetComponent, ThemeService, TreemapChartComponent, WidgetService };
+export { AreaChartComponent, AreaRangeChartComponent, AreamapChartComponent, BarChartComponent, BasicMemberFilterTileComponent, BoxplotChartComponent, ChartComponent, ChartWidgetComponent, ColumnChartComponent, ContextMenuComponent, DashboardByIdComponent, DashboardComponent, DashboardService, DashboardWidgetComponent, DateRangeFilterTileComponent, DrilldownBreadcrumbsComponent, DrilldownWidgetComponent, FunnelChartComponent, IndicatorChartComponent, LineChartComponent, MemberFilterTileComponent, PieChartComponent, PivotTableComponent, PolarChartComponent, QueryService, SISENSE_CONTEXT_CONFIG_TOKEN, ScatterChartComponent, ScattermapChartComponent, SdkUiModule, SisenseContextService, SunburstChartComponent, THEME_CONFIG_TOKEN, TableComponent, TableWidgetComponent, ThemeService, TreemapChartComponent, WidgetService };
 //# sourceMappingURL=sisense-sdk-ui-angular.mjs.map