@sisense/sdk-ui 2.6.0 → 2.8.0

package/dist/packages/sdk-ui/src/index.d.ts

@@ -10,6 +10,7 @@ export { getChartType } from './widget-by-id/utils';
 export * from './query-execution';
 export { executeQuery, executePivotQuery } from './query/execute-query';
 export { SisenseContextProvider } from './sisense-context/sisense-context-provider';
+export * from './decorators/component-decorators/with-tracking';
 export { DrilldownWidget } from './widgets/drilldown-widget';
 export { processDrilldownSelections } from './widgets/common/use-drilldown-core';
 export { ChartWidget } from './widgets/chart-widget';

package/dist/packages/sdk-ui/src/pivot-table/hooks/use-apply-pivot-table-cell-events/get-pivot-table-data-point.d.ts

@@ -0,0 +1,4 @@
+import { type PivotTableDataOptionsInternal } from '../../../chart-data-options/types';
+import { PivotTableDataPoint } from '../../../types';
+import { PivotTableCellPayload } from './types';
+export declare const getPivotTableDataPoint: (cellPayload: PivotTableCellPayload, dataOptions: PivotTableDataOptionsInternal) => PivotTableDataPoint;

package/dist/packages/sdk-ui/src/pivot-table/hooks/use-apply-pivot-table-cell-events/index.d.ts

@@ -0,0 +1 @@
+export { useApplyPivotTableCellEvents } from './use-apply-pivot-table-cell-events';

package/dist/packages/sdk-ui/src/pivot-table/hooks/use-apply-pivot-table-cell-events/types.d.ts

@@ -0,0 +1,32 @@
+type AbstractDataTreeNode = {
+    value: string;
+    content: string;
+    level: number;
+    metadataType: string;
+    userType: string;
+    parent: AbstractDataTreeNode | undefined;
+};
+export type ValueDataNode = AbstractDataTreeNode & {
+    index: number;
+    metadataType: 'measures';
+    userType: 'measureBottom' | 'measureTop';
+};
+export type RowDataNode = AbstractDataTreeNode & {
+    index: number;
+    metadataType: 'rows';
+    userType: 'corner' | 'subTotal' | 'grandTotal';
+};
+export type ColumnDataNode = AbstractDataTreeNode & {
+    index: number;
+    metadataType: 'columns';
+    userType: 'subTotal' | 'grandTotal';
+};
+export type PivotTableCellPayload = {
+    dataNode: ValueDataNode | RowDataNode | ColumnDataNode;
+    rowTreeNode?: RowDataNode;
+    columnTreeNode?: ColumnDataNode;
+    measureTreeNode?: ValueDataNode;
+    isDataCell: boolean;
+    event: MouseEvent;
+};
+export type { AbstractDataTreeNode };

package/dist/packages/sdk-ui/src/pivot-table/hooks/use-apply-pivot-table-cell-events/use-apply-pivot-table-cell-events.d.ts

@@ -0,0 +1,18 @@
+import { type PivotTableDataOptionsInternal } from '../../../chart-data-options/types';
+import { PivotTableDataPointEventHandler } from '../../../index-typedoc';
+import { PivotTableCellPayload } from './types';
+type UseApplyPivotTableCellEventsProps = {
+    dataOptions: PivotTableDataOptionsInternal;
+    onDataPointClick?: PivotTableDataPointEventHandler;
+    onDataPointContextMenu?: PivotTableDataPointEventHandler;
+};
+type UseApplyPivotTableCellEventsResult = {
+    handlePivotTableCellClick: (payload: PivotTableCellPayload) => void;
+};
+/**
+ * A hook that applies pivot table cell events.
+ *
+ * @internal
+ */
+export declare const useApplyPivotTableCellEvents: ({ dataOptions, onDataPointClick, onDataPointContextMenu, }: UseApplyPivotTableCellEventsProps) => UseApplyPivotTableCellEventsResult;
+export {};

package/dist/packages/sdk-ui/src/pivot-table/hooks/use-apply-pivot-table-cell-events/utils.d.ts

@@ -0,0 +1,11 @@
+import { AbstractDataTreeNode } from './types';
+export declare function getTreeNodeByLevel(node: AbstractDataTreeNode, level: number): AbstractDataTreeNode;
+export declare function isSubTotalTreeNode(node: AbstractDataTreeNode, type: 'rows' | 'columns'): boolean;
+export declare function isGrandTotalTreeNode(node: AbstractDataTreeNode, type: 'rows' | 'columns'): boolean;
+/**
+ * Safely performs modulo operation, returning 0 if divisor is null/undefined or 0
+ * @param dividend - The dividend number (defaults to 0 if not provided)
+ * @param divisor - The divisor number (optional)
+ * @returns The result of dividend % divisor, or 0 if divisor is invalid
+ */
+export declare function safeModulo(dividend?: number, divisor?: number): number;

package/dist/packages/sdk-ui/src/pivot-table/hooks/use-apply-pivot-table-formatting.d.ts

@@ -1,5 +1,5 @@
 import { type DataService } from '@sisense/sdk-pivot-client';
-import { type PivotTableDataOptions } from '../../chart-data-options/types';
+import { type PivotTableDataOptionsInternal } from '../../chart-data-options/types';
 /**
  * A hook that applies formatting over pivot table cells.
  *
@@ -7,5 +7,5 @@ import { type PivotTableDataOptions } from '../../chart-data-options/types';
  */
 export declare const useApplyPivotTableFormatting: ({ dataService, dataOptions, }: {
     dataService: DataService;
-    dataOptions: PivotTableDataOptions;
+    dataOptions: PivotTableDataOptionsInternal;
 }) => void;

package/dist/packages/sdk-ui/src/pivot-table/hooks/use-render-pivot.d.ts

@@ -1,13 +1,13 @@
-/// <reference types="react" />
 import { type PivotBuilder } from '@sisense/sdk-pivot-client';
 import type { CompleteThemeSettings, PivotTableStyleOptions } from '../../types';
-import type { PivotTableDataOptions } from '../../chart-data-options/types';
+import type { PivotTableDataOptionsInternal } from '../../chart-data-options/types';
 import type { ContainerSize } from '../../dynamic-size-container/dynamic-size-container';
+import { PivotTableDataPointEventHandler } from '../../index-typedoc';
 type PivotRenderOptions = {
     /** The pivot builder instance. */
     pivotBuilder: PivotBuilder;
     /** The pivot table data options. */
-    dataOptions: PivotTableDataOptions;
+    dataOptions: PivotTableDataOptionsInternal;
     /** The pivot table style options. */
     styleOptions: PivotTableStyleOptions;
     /** The theme settings. */
@@ -16,11 +16,15 @@ type PivotRenderOptions = {
     size: ContainerSize | null;
     /** Callback to handle total height change. */
     onTotalHeightChange?: (totalHeight: number) => void;
+    /** Callback to handle data point click. */
+    onDataPointClick?: PivotTableDataPointEventHandler;
+    /** Callback to handle data point context menu. */
+    onDataPointContextMenu?: PivotTableDataPointEventHandler;
 };
 /**
  * A hook that renders the pivot table.
  */
-export declare function useRenderPivot({ pivotBuilder, dataOptions, styleOptions, themeSettings, size, onTotalHeightChange, }: PivotRenderOptions): {
+export declare function useRenderPivot({ pivotBuilder, dataOptions, styleOptions, themeSettings, size, onTotalHeightChange, onDataPointClick, onDataPointContextMenu, }: PivotRenderOptions): {
     pivotElement: JSX.Element | null;
 };
 export {};

package/dist/packages/sdk-ui/src/props.d.ts

@@ -1,5 +1,5 @@
 import { Attribute, Filter, Measure, DataSource, Data, QueryResultData, FilterRelations } from '@sisense/sdk-data';
-import { ChartDataOptions, CartesianChartDataOptions, CategoricalChartDataOptions, ThemeSettings, PolarStyleOptions, PieStyleOptions, StackableStyleOptions, LineStyleOptions, AreaStyleOptions, FunnelStyleOptions, ScatterStyleOptions, ChartStyleOptions, ChartType, IndicatorStyleOptions, DrilldownOptions, ThemeOid, TreemapStyleOptions, CustomDrilldownResult, MenuPosition, MenuAlignment, MenuItemSection, SunburstStyleOptions, ChartWidgetStyleOptions, TableWidgetStyleOptions, WidgetByIdStyleOptions, BoxplotStyleOptions, ScattermapStyleOptions, AreamapStyleOptions, DataPoint, ScatterDataPoint, AreamapDataPoint, BoxplotDataPoint, ChartDataPoints, ScattermapDataPoint, PivotTableStyleOptions, PivotTableWidgetStyleOptions, RegularChartType, RegularChartStyleOptions, TabularChartStyleOptions, TableStyleOptions, AreaRangeStyleOptions, DrilldownSelection, TextWidgetStyleOptions, GenericDataOptions, IndicatorRenderOptions, TabberStyleProps, IndicatorDataPoint, TextWidgetDataPoint, CustomWidgetStyleOptions } from './types';
+import { ChartDataOptions, CartesianChartDataOptions, CategoricalChartDataOptions, ThemeSettings, PolarStyleOptions, PieStyleOptions, StackableStyleOptions, LineStyleOptions, AreaStyleOptions, FunnelStyleOptions, ScatterStyleOptions, ChartStyleOptions, ChartType, IndicatorStyleOptions, DrilldownOptions, ThemeOid, TreemapStyleOptions, CustomDrilldownResult, MenuPosition, MenuAlignment, MenuItemSection, SunburstStyleOptions, ChartWidgetStyleOptions, TableWidgetStyleOptions, WidgetByIdStyleOptions, BoxplotStyleOptions, ScattermapStyleOptions, AreamapStyleOptions, DataPoint, ScatterDataPoint, AreamapDataPoint, BoxplotDataPoint, ChartDataPoints, ScattermapDataPoint, PivotTableStyleOptions, PivotTableWidgetStyleOptions, RegularChartType, RegularChartStyleOptions, TabularChartStyleOptions, TableStyleOptions, AreaRangeStyleOptions, DrilldownSelection, TextWidgetStyleOptions, GenericDataOptions, IndicatorRenderOptions, TabberStyleProps, IndicatorDataPoint, TextWidgetDataPoint, CustomWidgetStyleOptions, PivotTableDataPoint } from './types';
 import { HighchartsOptions } from './chart-options-processor/chart-options-service';
 import { ComponentType, PropsWithChildren, ReactNode } from 'react';
 import { IndicatorChartDataOptions, BoxplotChartCustomDataOptions, BoxplotChartDataOptions, ScatterChartDataOptions, TableDataOptions, ScattermapChartDataOptions, AreamapChartDataOptions, PivotTableDataOptions, RegularChartDataOptions, TabularChartDataOptions, RangeChartDataOptions } from './chart-data-options/types';
@@ -306,6 +306,14 @@ export type TextWidgetDataPointEventHandler = (
 point: TextWidgetDataPoint, 
 /** Native MouseEvent */
 nativeEvent: MouseEvent) => void;
+/**
+ * Click handler for when a pivot table cell is clicked.
+ */
+export type PivotTableDataPointEventHandler = (
+/** Data point that was clicked */
+point: PivotTableDataPoint, 
+/** Native MouseEvent */
+nativeEvent: MouseEvent) => void;
 interface HighchartsBasedChartEventProps {
     /**
      * A callback that allows you to customize the underlying chart element before it is rendered.
@@ -871,6 +879,18 @@ export interface PivotTableProps {
      * @internal
      */
     onHeightChange?: (height: number) => void;
+    /**
+     * Callback function that is called when the pivot table cell is clicked
+     *
+     * @internal
+     */
+    onDataPointClick?: PivotTableDataPointEventHandler;
+    /**
+     * Callback function that is called when the pivot table cell is right-clicked
+     *
+     * @internal
+     */
+    onDataPointContextMenu?: PivotTableDataPointEventHandler;
 }
 /**
  * Props of the {@link ScatterChart} component.
@@ -1182,6 +1202,18 @@ export interface PivotTableWidgetProps {
      * @category Widget
      */
     description?: string;
+    /**
+     * Callback function that is called when the pivot table cell is clicked
+     *
+     * @internal
+     */
+    onDataPointClick?: PivotTableDataPointEventHandler;
+    /**
+     * Callback function that is called when the pivot table cell is right-clicked
+     *
+     * @internal
+     */
+    onDataPointContextMenu?: PivotTableDataPointEventHandler;
 }
 /**
  * Props for the `TextWidget` component.

package/dist/packages/sdk-ui/src/theme-provider/default-theme-settings.d.ts

@@ -3,7 +3,12 @@ export declare const DEFAULT_DIVIDER_COLOR = "#F2F2F2";
 export declare const DEFAULT_DIVIDER_WIDTH = 4;
 export declare const DEFAULT_DASHBOARD_BORDER_COLOR = "#D5D5D5";
 export declare const DEFAULT_DASHBOARD_BORDER_WIDTH = 1;
+export declare const DEFAULT_DASHBOARD_TOOLBAR_DIVIDER_LINE_COLOR = "#D5D5D5";
+export declare const DEFAULT_DASHBOARD_TOOLBAR_DIVIDER_LINE_WIDTH = 1;
+export declare const DEFAULT_FILTER_PANEL_DIVIDER_LINE_COLOR = "#DADADA";
+export declare const DEFAULT_FILTER_PANEL_DIVIDER_LINE_WIDTH = 1;
 export declare const DEFAULT_FILTER_PANEL_BORDER_COLOR = "#DADADA";
+export declare const DEFAULT_FILTER_PANEL_BORDER_WIDTH = 1;
 export declare const DEFAULT_TITLE_FONT_SIZE = 15;
 /**
  * Returns default theme settings, which can be used as base for custom theme options.

package/dist/packages/sdk-ui/src/types.d.ts

@@ -975,6 +975,10 @@ export type DashboardThemeSettings = {
         secondaryTextColor?: string;
         /** Background color for the dashboard toolbar */
         backgroundColor?: string;
+        /** Divider line color for the dashboard toolbar */
+        dividerLineColor?: string;
+        /** Divider line width for the dashboard toolbar */
+        dividerLineWidth?: number;
     };
 };
 /**
@@ -986,14 +990,24 @@ export type FilterThemeSettings = {
         titleColor?: string;
         /** Background color */
         backgroundColor?: string;
+        /** Divider line color for the filter panel */
+        dividerLineColor?: string;
+        /** Divider line width for the filter panel */
+        dividerLineWidth?: number;
         /**
-         * Border color
+         * Border color for the filter panel component
+         *
+         * **Note:** Does not apply to filter panel inside `Dashboard`
+         * use dividerLineColor and dividerLineWidth instead
          *
          * @internal
          * */
         borderColor?: string;
         /**
-         * Border width
+         * Border width for the filter panel component
+         *
+         * **Note:** Does not apply to filter panel inside `Dashboard`
+         * use dividerLineColor and dividerLineWidth instead
          *
          * @internal
          * */
@@ -1240,6 +1254,8 @@ export type NlqChartWidgetStyleOptions = {
 export type RenderToolbarHandler = (onRefresh: () => void, defaultToolbar: JSX.Element) => JSX.Element | null;
 /** @internal */
 export type RenderTitleHandler = (defaultHeaderTitle: ReactNode) => ReactNode;
+/** @internal */
+export type TextWidgetRenderToolbarHandler = (defaultToolbar: ReactNode) => ReactNode;
 /** Style settings defining the look and feel of the widget created in Fusion */
 export interface WidgetByIdStyleOptions extends WidgetContainerStyleOptions {
     /**
@@ -1280,11 +1296,45 @@ export type TextWidgetStyleOptions = {
     html: string;
     vAlign: `valign-${'middle' | 'top' | 'bottom'}`;
     bgColor: string;
+    /**
+     * Widget header styles
+     *
+     * @internal
+     */
+    header?: {
+        /**
+         * Header visibility toggle
+         *
+         * @internal
+         */
+        hidden?: boolean;
+        /**
+         * Custom toolbar to render to the right of the title
+         *
+         * @internal
+         */
+        renderToolbar?: TextWidgetRenderToolbarHandler;
+        /**
+         * Custom title to render in widget header
+         *
+         * @internal
+         */
+        renderTitle?: RenderTitleHandler;
+    };
 };
 /**
  * Style settings defining the look and feel of CustomWidget
  */
-export type CustomWidgetStyleOptions = Record<string, unknown> & WidgetContainerStyleOptions;
+export type CustomWidgetStyleOptions = WidgetContainerStyleOptions & Record<string, unknown> & {
+    /**
+     * The width of the custom widget component.
+     */
+    width?: number;
+    /**
+     * The height of the custom widget component.
+     */
+    height?: number;
+};
 /**
  * Runs type guard check for ThemeOid.
  *
@@ -1449,6 +1499,37 @@ export type TextWidgetDataPoint = {
     /** HTML content of the text widget */
     html?: string;
 };
+/** Data point in a PivotTable. */
+export type PivotTableDataPoint = {
+    /**
+     * Boolean flag that defines if the data point is a data cell
+     *
+     * @internal
+     */
+    isDataCell: boolean;
+    /**
+     * Boolean flag that defines if the data point is a caption cell
+     *
+     * @internal
+     */
+    isCaptionCell: boolean;
+    /**
+     * Boolean flag that defines if the data point is a total cell (subtotal or grandtotal)
+     *
+     * @internal
+     */
+    isTotalCell: boolean;
+    /**
+     * A collection of data point entries that represents values for all related `dataOptions`.
+     *
+     * @internal
+     */
+    entries: {
+        rows?: DataPointEntry[];
+        columns?: DataPointEntry[];
+        values?: DataPointEntry[];
+    };
+};
 /**
  * Data point in an Areamap chart.
  */

package/dist/packages/sdk-ui/src/widget-by-id/utils.d.ts

@@ -1,7 +1,7 @@
 import { ChartSubtype } from '../chart-options-processor/subtype-to-design-options.js';
 import { ChartType, RenderToolbarHandler } from '../types.js';
 import { Panel, PanelItem, TextWidgetDtoStyle, WidgetStyle, WidgetSubtype, FusionWidgetType } from './types.js';
-import { ChartProps, ChartWidgetProps, PivotTableWidgetProps, CustomWidgetProps, TextWidgetProps, CommonWidgetProps, WithCommonWidgetProps, WidgetProps, WidgetType } from '../props';
+import { ChartProps, ChartWidgetProps, PivotTableWidgetProps, CustomWidgetProps, TextWidgetProps, CommonWidgetProps, WithCommonWidgetProps, WidgetProps, WidgetType, PivotTableProps } from '../props';
 import { WidgetTypeInternal } from '../models/widget/types';
 import { WidgetModel } from '../models';
 export { mergeFilters, getFilterRelationsFromJaql, convertFilterRelationsModelToJaql, getFilterCompareId, } from '@sisense/sdk-data';
@@ -10,7 +10,7 @@ export { mergeFilters, getFilterRelationsFromJaql, convertFilterRelationsModelTo
  *
  * @internal
  */
-export declare function getChartType(fusionWidgetType: FusionWidgetType): ChartType;
+export declare function getChartType(fusionWidgetType: FusionWidgetType): ChartType | undefined;
 export declare function getFusionWidgetTypeFromChartType(chartType: ChartType): FusionWidgetType;
 export declare function getFusionWidgetType(widgetType: WidgetType, chartType?: ChartType): FusionWidgetType;
 export declare function getWidgetType(fusionWidgetType: FusionWidgetType): WidgetType;
@@ -97,7 +97,7 @@ export declare function registerDataPointClickHandler(widgetProps: WidgetProps,
  *
  * @internal
  */
-export declare function registerDataPointContextMenuHandler(widgetProps: WidgetProps, handler: NonNullable<ChartProps['onDataPointContextMenu']>): void;
+export declare function registerDataPointContextMenuHandler(widgetProps: WidgetProps, handler: NonNullable<ChartProps['onDataPointContextMenu'] | PivotTableProps['onDataPointContextMenu']>): void;
 /**
  * Registers new "onDataPointsSelected" handler for the Widget component
  *

package/dist/packages/sdk-ui/src/widgets/common/drilldown-breadcrumbs/styled-buttons.d.ts

@@ -1,11 +1,7 @@
 /// <reference types="react" />
-export declare const StyledPrevButton: import("@emotion/styled").StyledComponent<import("@mui/material/IconButton").IconButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, "loading" | "children" | "disabled" | "size" | "className" | "style" | "tabIndex" | "color" | "sx" | "classes" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "loadingIndicator"> & {
+export declare const StyledPrevButton: import("@emotion/styled").StyledComponent<import("@mui/material/IconButton").IconButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "loading" | "children" | "disabled" | "size" | "className" | "style" | "tabIndex" | "color" | "sx" | "classes" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "loadingIndicator"> & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;
-export declare const StyledNextButton: import("@emotion/styled").StyledComponent<import("@mui/material/IconButton").IconButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-}, "loading" | "children" | "disabled" | "size" | "className" | "style" | "tabIndex" | "color" | "sx" | "classes" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "loadingIndicator"> & {
+export declare const StyledNextButton: import("@emotion/styled").StyledComponent<import("@mui/material/IconButton").IconButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "loading" | "children" | "disabled" | "size" | "className" | "style" | "tabIndex" | "color" | "sx" | "classes" | "action" | "centerRipple" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "TouchRippleProps" | "touchRippleRef" | "disableFocusRipple" | "edge" | "loadingIndicator"> & {
     theme?: import("@emotion/react").Theme | undefined;
 }, {}, {}>;