@sisense/sdk-ui 1.20.0 → 1.22.0

package/dist/packages/sdk-ui/src/chart-data-options/validate-data-options/validate-data-options.d.ts

@@ -1,4 +1,4 @@
-import { ChartDataOptions, ChartDataOptionsInternal, Value } from '../types';
+import { ChartDataOptions, ChartDataOptionsInternal } from '../types';
 import { ChartType } from '../../types';
 import { Attribute, Data, Filter, Measure } from '@sisense/sdk-data';
 import { DataTable } from '../../chart-data-processor/table-processor';
@@ -9,7 +9,7 @@ export type DataColumnNamesMapping = Record<string, string>;
  * @param measures - An array of Value objects representing measures.
  * @returns - The mapping of unique names to original names.
  */
-export declare const generateUniqueDataColumnsNames: (measures: Value[]) => DataColumnNamesMapping;
+export declare const generateUniqueDataColumnsNames: (measures: Measure[]) => DataColumnNamesMapping;
 /**
  * Applies default chart data options based on input chart type.
  */

package/dist/packages/sdk-ui/src/chart-options-processor/data-points.d.ts

@@ -1,10 +1,11 @@
+import { Measure } from '@sisense/sdk-data';
 import { HighchartsPoint } from '../types';
 import { SisenseChartDataPoint } from '../sisense-chart/types';
-import { Category, ChartDataOptionsInternal, Value } from '..';
-export declare function getDataPointMetadata(dataOptionPath: string, dataOption: Category | Value): {
-    measure?: import("@sisense/sdk-data").Measure | undefined;
+import { ChartDataOptionsInternal, StyledColumn, StyledMeasureColumn } from '..';
+export declare function getDataPointMetadata(dataOptionPath: string, dataOption: StyledColumn | StyledMeasureColumn): {
+    measure?: Measure | undefined;
     attribute?: import("@sisense/sdk-data").Attribute | undefined;
     id: string;
-    dataOption: import("..").AnyColumn;
+    dataOption: StyledColumn | StyledMeasureColumn;
 };
 export declare function getDataPoint(point: HighchartsPoint, dataOptions: ChartDataOptionsInternal): SisenseChartDataPoint;

package/dist/packages/sdk-ui/src/chart-options-processor/plot-bands.d.ts

@@ -7,7 +7,7 @@ type CategoryIndexMapPlotBands = {
     indexMap: number[];
     plotBands: PlotBand[];
 };
-export declare const applyNumberFormatToPlotBands: (chartDataOptions: ChartDataOptionsInternal, categoryIndexMapPlotBands: CategoryIndexMapPlotBands) => CategoryIndexMapPlotBands;
+export declare const applyNumberFormatToPlotBands: (dataOptions: ChartDataOptionsInternal, categoryIndexMapPlotBands: CategoryIndexMapPlotBands) => CategoryIndexMapPlotBands;
 /**
  * This method returns three arrays to create chart options
  * categories - values to display on the bottom X1 axis

package/dist/packages/sdk-ui/src/chart-options-processor/translations/axis-section.d.ts

@@ -1,5 +1,5 @@
 import { Stacking, Style } from '../chart-options-service';
-import { ChartDataOptionsInternal, Category } from '../../chart-data-options/types';
+import { ChartDataOptionsInternal, StyledColumn } from '../../chart-data-options/types';
 import { ChartType } from '../../types';
 import { CategoricalXValues } from '../../chart-data/types';
 import { AxisClipped } from './translations-to-highcharts';
@@ -102,7 +102,7 @@ export type AxisPlotBand = {
 };
 export declare const getCategoricalCompareValue: (value: CategoricalXValues) => number;
 export declare const getDefaultDateFormat: (granularity?: string) => "HH:mm:ss" | "yyyy" | "yyyy Q" | "MM/yyyy" | "ww yyyy" | "M/d/yy" | "HH" | "M/d/yy HH" | "HH:mm" | undefined;
-export declare const getDateFormatter: (category: Category, dateFormatter?: ((date: Date, format: string) => string) | undefined) => (time: number) => string;
-export declare const getXAxisDatetimeSettings: (axis: Axis, category: Category, values: number[], dateFormatter?: ((date: Date, format: string) => string) | undefined) => AxisSettings[];
-export declare const getXAxisSettings: (axis: Axis, axis2: Axis | undefined, categories: string[], plotBands: PlotBand[], xAxisOrientation: AxisOrientation, chartDataOptions: ChartDataOptionsInternal, chartType: ChartType) => AxisSettings[];
-export declare const getYAxisSettings: (axis: Axis, axis2: Axis | undefined, axisMinMax: AxisMinMax, axis2MinMax: AxisMinMax | undefined, showTotal: boolean, chartDataOptions: ChartDataOptionsInternal, stacking: Stacking | undefined) => [AxisSettings[], AxisClipped[]];
+export declare const getDateFormatter: (category: StyledColumn, dateFormatter?: ((date: Date, format: string) => string) | undefined) => (time: number) => string;
+export declare const getXAxisDatetimeSettings: (axis: Axis, category: StyledColumn, values: number[], dateFormatter?: ((date: Date, format: string) => string) | undefined) => AxisSettings[];
+export declare const getXAxisSettings: (axis: Axis, axis2: Axis | undefined, categories: string[], plotBands: PlotBand[], xAxisOrientation: AxisOrientation, dataOptions: ChartDataOptionsInternal, chartType: ChartType) => AxisSettings[];
+export declare const getYAxisSettings: (axis: Axis, axis2: Axis | undefined, axisMinMax: AxisMinMax, axis2MinMax: AxisMinMax | undefined, showTotal: boolean, dataOptions: ChartDataOptionsInternal, stacking: Stacking | undefined) => [AxisSettings[], AxisClipped[]];

package/dist/packages/sdk-ui/src/chart-options-processor/translations/boxplot/boxplot-axis.d.ts

@@ -1,10 +1,10 @@
 import { BoxplotChartData } from '../../../chart-data/types';
 import { Axis, AxisSettings } from '../axis-section';
-import { Value, type Category } from '../../../chart-data-options/types';
+import { StyledColumn, StyledMeasureColumn } from '../../../chart-data-options/types';
 export declare const commonColor = "#d1d1d7";
 export declare const calculateYAxisMinMax: (chartData: BoxplotChartData) => {
     min: number;
     max: number;
 };
-export declare const getBoxplotXAxisSettings: (axis: Axis, categories: string[], axisDataOption?: Category) => AxisSettings[];
-export declare const getBoxplotYAxisSettings: (axis: Axis, chartData: BoxplotChartData, axisDataOption?: Value) => AxisSettings[];
+export declare const getBoxplotXAxisSettings: (axis: Axis, categories: string[], axisDataOption?: StyledColumn) => AxisSettings[];
+export declare const getBoxplotYAxisSettings: (axis: Axis, chartData: BoxplotChartData, axisDataOption?: StyledMeasureColumn) => AxisSettings[];

package/dist/packages/sdk-ui/src/chart-options-processor/translations/scatter-axis.d.ts

@@ -1,7 +1,7 @@
 import { ScatterCategories } from '../../chart-data/types';
-import { ScatterChartDataOptionsInternal, Category, Value } from './../../chart-data-options/types';
+import { ScatterChartDataOptionsInternal, StyledColumn, StyledMeasureColumn } from './../../chart-data-options/types';
 import { Axis, AxisSettings } from './axis-section';
 export declare const commonColor = "#d1d1d7";
-export declare function scatterFormatter(axisAttribute: Category | Value | undefined, value: string | number, categories: (string | number)[] | undefined): string;
+export declare function scatterFormatter(axisAttribute: StyledColumn | StyledMeasureColumn | undefined, value: string | number, categories: (string | number)[] | undefined): string;
 export declare const getScatterXAxisSettings: (xAxis: Axis, categories: ScatterCategories, scatterDataOptions: ScatterChartDataOptionsInternal) => AxisSettings[];
 export declare const getScatterYAxisSettings: (yAxis: Axis, categories: ScatterCategories, scatterDataOptions: ScatterChartDataOptionsInternal) => AxisSettings[];

package/dist/packages/sdk-ui/src/chart-options-processor/translations/tooltip-utils.d.ts

@@ -1,8 +1,8 @@
-import { Category, Value } from '../../chart-data-options/types.js';
-export declare const isXValueNumeric: (dataOptionX: Value | Category | undefined) => boolean | "";
-export declare const formatTooltipValue: (dataOption: Value | Category | undefined, value: number | undefined, displayValue: string) => string;
-export declare const formatTooltipXValue: (dataOption: Value | Category | undefined, value: number | string | undefined, displayValue: string) => string;
-export declare function isTooltipPercentValueSupported(options: Value | undefined): boolean;
+import { StyledMeasureColumn, StyledColumn } from '../../chart-data-options/types.js';
+export declare const isXValueNumeric: (dataOptionX: StyledMeasureColumn | StyledColumn | undefined) => boolean | "";
+export declare const formatTooltipValue: (dataOption: StyledMeasureColumn | StyledColumn | undefined, value: number | undefined, displayValue: string) => string;
+export declare const formatTooltipXValue: (dataOption: StyledMeasureColumn | StyledColumn | undefined, value: number | string | undefined, displayValue: string) => string;
+export declare function isTooltipPercentValueSupported(options: StyledMeasureColumn | undefined): boolean;
 export type TooltipSettings = {
     enabled?: boolean;
     animation?: boolean;

package/dist/packages/sdk-ui/src/chart-options-processor/translations/translations-to-highcharts.d.ts

@@ -75,7 +75,7 @@ export declare const addStackingIfSpecified: (chartType: ChartType, designOption
  */
 export declare const indexMapWhenOnlyY: (categories: string[], index: number) => (-1 | 0)[];
 export declare const formatSeriesContinuousXAxis: (series: CategoricalSeriesValues, indexMap: number[], treatNullDataAsZeros: boolean, interval: number, maxCategories: number, dateFormatter: (time: number) => string, yAxisSettings: AxisSettings, axisClipped: AxisClipped) => HighchartsSeriesValues;
-export declare const formatSeries: (series: CategoricalSeriesValues, indexMap: number[], treatNullDataAsZeros: boolean, categories?: string[], categoryColors?: string[]) => HighchartsSeriesValues;
+export declare const formatSeries: (series: CategoricalSeriesValues, indexMap: number[], treatNullDataAsZeros: boolean, categories?: string[], categoryColors?: string[], convertValuesToAbsolute?: boolean) => HighchartsSeriesValues;
 export declare const adjustMinMaxWhenInvalid: (explicitAxis: AxisMinMax, autoMinMax: AxisMinMax) => {
     min: number;
     max: number;

package/dist/packages/sdk-ui/src/charts/indicator/indicator-legacy-chart-data-options.d.ts

@@ -3,7 +3,7 @@ import { IndicatorChartDesignOptions } from '../../chart-options-processor/trans
 import { IndicatorChartData } from '../../chart-data/types';
 import { LegacyIndicatorChartTypes } from './types';
 export type IndicatorLegacyChartDataOptions = ReturnType<typeof createLegacyChartDataOptions>;
-export declare const createLegacyChartDataOptions: (chartData: IndicatorChartData, chartDesignOptions: IndicatorChartDesignOptions, chartDataOptions: IndicatorChartDataOptions) => {
+export declare const createLegacyChartDataOptions: (chartData: IndicatorChartData, chartDesignOptions: IndicatorChartDesignOptions, dataOptions: IndicatorChartDataOptions) => {
     type: LegacyIndicatorChartTypes;
     skin: 1 | 2 | "vertical" | "horizontal";
     title: {

package/dist/packages/sdk-ui/src/common/hooks/use-fetch.d.ts

@@ -16,7 +16,7 @@ export type RequestConfig = {
  * The result of the `useFetch` hook.
  * Return value of the `useQuery` hook from `@tanstack/react-query`.
  *
- * @link https://tanstack.com/query/v4/docs/framework/react/reference/useQuery
+ * @see https://tanstack.com/query/v4/docs/framework/react/reference/useQuery
  * @template TData - The type of the data returned by the fetch request
  * @template TError - The type of the error returned by the fetch request
  */
@@ -30,11 +30,8 @@ export type UseQueryResult<TData, TError> = TanstackUseQueryResult<TData, TError
     method: 'POST',
   });
  ```
- * @param path - The endpoint path to fetch data from. This should be a relative path like '/api/v1/endpoint'.
- * @param init - The request init object
- * @param options - The additional request options
  * @returns Query state that contains the status of the query execution, the result data, or the error if any occurred
- * @group Fusion Embed
+ * @group Fusion Assets
  */
 export declare const useFetch: <TData = unknown, TError = unknown>(path: string, init?: RequestInit | undefined, options?: {
     requestConfig?: RequestConfig | undefined;

package/dist/packages/sdk-ui/src/common/hooks/use-synced-state.d.ts

@@ -0,0 +1,19 @@
+import { Dispatch, SetStateAction } from 'react';
+type UseSyncedStateOptions<T> = {
+    /**
+     * A callback function that is triggered when the state is updated via the local setter,
+     * but not through synchronization with `syncValue`.
+     */
+    onLocalStateChange?: (state: T) => void;
+    /**
+     * A custom comparison function to determine if the external `syncValue` is different
+     * from the current state. The default function performs a deep equality check using `isEqual`.
+     */
+    syncCompareFn?: (currentState: T, syncValue: T) => boolean;
+};
+/**
+ * A custom React hook that behaves like the regular `useState`, but also synchronizes the state
+ * with an external `syncValue`.
+ */
+export declare function useSyncedState<T>(syncValue: T, { onLocalStateChange, syncCompareFn }?: UseSyncedStateOptions<T>): [T, Dispatch<SetStateAction<T>>];
+export {};

package/dist/packages/sdk-ui/src/common-filters/selection-utils.d.ts

@@ -9,7 +9,15 @@ type DataSelection = {
 };
 export declare function getWidgetSelections(widgetType: WidgetTypeInternal, dataOptions: ChartDataOptions | PivotTableDataOptions, points: Array<ChartDataPoint>): DataSelection[];
 export declare function getSelectableWidgetAttributes(widgetType: WidgetTypeInternal, dataOptions: ChartDataOptions | PivotTableDataOptions): Attribute[];
-export declare function createCommonFiltersOverSelections(selections: DataSelection[], existingCommonFilters: Filter[]): Filter[];
+type FiltersWithSelectionFlag = {
+    filters: Filter[];
+    isSelection: boolean;
+};
+/**
+ * Creates a set of common filters based on the current selections, considering existing filters and
+ * the common filters unselection rules.
+ */
+export declare function createCommonFiltersOverSelections(selections: DataSelection[], existingCommonFilters: Filter[], allowPartialUnselection?: boolean): FiltersWithSelectionFlag;
 export declare function getWidgetSelectionsTitleMenuItem(widgetType: WidgetTypeInternal, dataOptions: ChartDataOptions | PivotTableDataOptions, points: Array<ChartDataPoint>): MenuItemSection | null;
 export declare function getSelectMenuItem(title: string, selectHandler: () => void): MenuItemSection;
 export {};

package/dist/packages/sdk-ui/src/common-filters/use-common-filters.d.ts

@@ -2,11 +2,13 @@
 import { type Filter } from '@sisense/sdk-data';
 import { CommonFiltersOptions } from './types.js';
 import { WidgetProps } from '../props.js';
-import { OpenMenuFn } from '../common/components/menu/types.js';
+import { BeforeMenuOpenHandler, OpenMenuFn } from '../common/components/menu/types.js';
 /** @internal */
-export declare const useCommonFilters: ({ initialFilters, openMenu, }?: {
+export declare const useCommonFilters: ({ initialFilters, openMenu, onBeforeMenuOpen, onFiltersChange, }?: {
     initialFilters?: Filter[] | undefined;
     openMenu?: OpenMenuFn | undefined;
+    onBeforeMenuOpen?: BeforeMenuOpenHandler | undefined;
+    onFiltersChange?: ((filters: Filter[]) => void) | undefined;
 }) => {
     filters: Filter[];
     setFilters: import("react").Dispatch<import("react").SetStateAction<Filter[]>>;

package/dist/packages/sdk-ui/src/dashboard/components/HorizontalCollapse.d.ts

@@ -0,0 +1,5 @@
+import { ReactNode } from 'react';
+export declare const HorizontalCollapse: ({ collapsedOnInit, children, }: {
+    collapsedOnInit?: boolean | undefined;
+    children: ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/packages/sdk-ui/src/dashboard/components/dashboard-header.d.ts

@@ -1,2 +1,3 @@
 import { DashboardHeaderProps } from '../../dashboard/types';
+export declare const DASHBOARD_HEADER_HEIGHT = 48;
 export declare const DashboardHeader: ({ title }: DashboardHeaderProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -22,7 +22,10 @@ import { DashboardByIdProps } from './types';
 
   export default CodeExample;
  * ```
- * @group Fusion Embed
+ *
+ * To learn more about this and related dashboard components,
+ * see [Embedded Dashboards](/guides/sdk/guides/dashboards/index.html).
+ * @group Fusion Assets
  * @fusionEmbed
  * @beta
  */

package/dist/packages/sdk-ui/src/dashboard/dashboard-helpers.d.ts

@@ -0,0 +1,91 @@
+import { Filter } from '@sisense/sdk-data';
+import { DashboardProps } from './types';
+/**
+ * Creates a new dashboard instance with its filters replaced by a new set of filters.
+ *
+ * This function does not modify the original dashboard; instead, it returns a new dashboard with the updated filters.
+ *
+ * @example
+ * Replace all filters on a dashboard with a new set of filters.
+ * ```ts
+ * const existingDashboard: DashboardProps = {...}
+ * const newFilters: Filter[] = [{...}, {...}, ...];
+ * const updatedDashboard = replaceFilters(existingDashboard, newFilters);
+ * ```
+ * @param dashboard - The original dashboard (`DashboardProps`) whose filters are to be replaced.
+ * @param newFilters - An array of new filters to set on the dashboard.
+ * @returns A new dashboard instance with the updated filters.
+ */
+export declare const replaceFilters: (dashboard: DashboardProps, newFilters: Filter[]) => DashboardProps;
+/**
+ * Creates a new dashboard instance with an additional filter added to its existing filters.
+ *
+ * This function does not modify the original dashboard; instead, it returns a new dashboard with the added filter.
+ *
+ * @example
+ * Add a new filter to a dashboard.
+ * ```ts
+ * const existingDashboard: DashboardProps = {...};
+ * const newFilter: Filter = {...};
+ * const updatedDashboard = addFilter(existingDashboard, newFilter);
+ * ```
+ * @param dashboard - The original dashboard (`DashboardProps`) to which the filter will be added.
+ * @param newFilter - The filter to add to the dashboard.
+ * @returns A new dashboard instance with the new filter added.
+ */
+export declare const addFilter: (dashboard: DashboardProps, newFilter: Filter) => DashboardProps;
+/**
+ * Creates a new dashboard instance with additional filters added to its existing filters.
+ *
+ * This function does not modify the original dashboard; instead, it returns a new dashboard with the added filters.
+ *
+ * @example
+ * Add multiple new filters to a dashboard.
+ * ```ts
+ * const existingDashboard: DashboardProps = {...};
+ * const newFilters: Filter[] = [{...}, {...}, ...];
+ * const updatedDashboard = addFilters(existingDashboard, newFilters);
+ * ```
+ * @param dashboard - The original dashboard (`DashboardProps`) to which the filters will be added.
+ * @param newFilters - An array of filters to add to the dashboard.
+ * @returns A new dashboard instance with the new filters added.
+ */
+export declare const addFilters: (dashboard: DashboardProps, newFilters: Filter[]) => DashboardProps;
+/**
+ * Creates a new dashboard instance with a specific filter modified.
+ *
+ * This function searches for a filter with the same GUID as the provided `filterToModify` and replaces it with `newFilter`.
+ * This function does not modify the original dashboard; instead, it returns a new dashboard with the updated filters.
+ *
+ * @example
+ * Modify a filter in a dashboard.
+ * ```ts
+ * const existingDashboard: DashboardProps = {...};
+ * const filterToModify: Filter = {...};
+ * const newFilter: Filter = {...};
+ * const updatedDashboard = modifyFilter(existingDashboard, filterToModify, newFilter);
+ * ```
+ * @param dashboard - The original dashboard (`DashboardProps`) containing the filter to modify.
+ * @param filterToModify - The existing filter to be modified.
+ * @param newFilter - The new filter to replace the existing one.
+ * @returns A new dashboard instance with the specified filter modified.
+ */
+export declare const modifyFilter: (dashboard: DashboardProps, filterToModify: Filter, newFilter: Filter) => DashboardProps;
+/**
+ * Creates a new dashboard instance with a specific filter removed.
+ *
+ * This function removes the filter with the same GUID as the provided filter from the dashboard's filters.
+ * This function does not modify the original dashboard; instead, it returns a new dashboard with the updated filters.
+ *
+ * @example
+ * Remove a filter from a dashboard.
+ * ```ts
+ * const existingDashboard: DashboardProps = {...};
+ * const filterToRemove: Filter = {...};
+ * const updatedDashboard = removeFilter(existingDashboard, filterToRemove);
+ * ```
+ * @param dashboard - The original dashboard (`DashboardProps`) from which to remove the filter.
+ * @param filter - The filter to be removed.
+ * @returns A new dashboard instance with the specified filter removed.
+ */
+export declare const removeFilter: (dashboard: DashboardProps, filter: Filter) => DashboardProps;

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

@@ -1,5 +1,14 @@
 /// <reference types="react" />
 import { DashboardProps } from '../dashboard/types';
+import { Filter } from '@sisense/sdk-data';
+export declare enum DashboardChangeType {
+    /** Dashboard filters have been updated */
+    FILTERS_UPDATE = "FILTERS.UPDATE"
+}
+export type DashboardChangeAction = {
+    type: DashboardChangeType.FILTERS_UPDATE;
+    payload: Filter[];
+};
 /**
  * React component that renders a dashboard whose elements are customizable. It includes internal logic of applying common filters to widgets.
  *
@@ -30,7 +39,10 @@ const CodeExample = () => {
 
 export default CodeExample;
  * ```
- * @group Dashboarding
+ *
+ * To learn more about this and related dashboard components,
+ * see [Embedded Dashboards](/guides/sdk/guides/dashboards/index.html).
+ * @group Dashboards
  * @beta
  */
 export declare const Dashboard: import("react").FunctionComponent<DashboardProps>;

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

@@ -1,3 +1,5 @@
 export { DashboardById } from './dashboard-by-id';
 export { Dashboard } from './dashboard';
+export { useComposedDashboard, type ComposableDashboardProps, type UseComposedDashboardOptions, } from './use-composed-dashboard';
+export { useDashboardTheme, type DashboardThemeParams } from './use-dashboard-theme';
 export type { DashboardByIdProps, DashboardProps, DashboardLayoutOptions, DashboardStyleOptions, DashboardConfig, } from './types';

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

@@ -1,6 +1,7 @@
 import { DashboardStyleOptions, WidgetsOptions, WidgetsPanelLayout } from '../models';
 import { WidgetProps } from '../props';
 import { DataSource, Filter } from '@sisense/sdk-data';
+import { DashboardChangeAction } from '../dashboard/dashboard';
 export type { DashboardStyleOptions, WidgetsPanelColumnLayout } from '../models';
 /**
  * Props for the DashboardById component
@@ -10,6 +11,17 @@ export interface DashboardByIdProps {
      * The OID of the dashboard to render.
      */
     dashboardOid: string;
+    /**
+     * Boolean flag indicating whether changes to the embedded dashboard should be saved to the dashboard in Fusion.
+     *
+     * If not specified, the default value is `false`.
+     *
+     * Limitations:
+     * - WAT authentication does not support persistence.
+     * - As an alpha feature, currently only changes to dashboard filters are persisted.
+     * @internal
+     */
+    persist?: boolean;
 }
 /**
  * Props for the DashboardContainer component
@@ -72,6 +84,12 @@ export interface DashboardProps {
     widgetsOptions?: WidgetsOptions;
     /** The style options for the dashboard */
     styleOptions?: DashboardStyleOptions;
+    /**
+     * Callback to receive changes
+     *
+     * @internal
+     */
+    onChange?: (action: DashboardChangeAction) => void;
 }
 /**
  * Props for the Dashboard Header component

package/dist/packages/sdk-ui/src/dashboard/use-composed-dashboard.d.ts

@@ -0,0 +1,30 @@
+import { DashboardProps } from './types.js';
+import { Filter } from '@sisense/sdk-data';
+export type ComposableDashboardProps = Pick<DashboardProps, 'filters' | 'widgets' | 'widgetsOptions'>;
+export type UseComposedDashboardOptions = {
+    /**
+     * @internal
+     */
+    onFiltersChange?: (filters: Filter[]) => void;
+};
+/**
+ * {@link useComposedDashboard} without tracking to be used inside other hooks or components in Compose SDK.
+ *
+ * @param params - Parameters of the composable dashboard props
+ * @internal
+ */
+export declare function useComposedDashboardInternal<D extends ComposableDashboardProps | DashboardProps>(initialDashboard: D, { onFiltersChange }?: UseComposedDashboardOptions): {
+    dashboard: D;
+    setFilters: (filters: Filter[]) => void;
+};
+/**
+ * React hook that takes in separate dashboard elements and
+ * composes them into a coordinated dashboard with change detection, cross filtering, and drill down.
+ *
+ * @group Dashboards
+ * @alpha
+ */
+export declare const useComposedDashboard: <D extends DashboardProps | ComposableDashboardProps>(args_0: D, args_1?: UseComposedDashboardOptions | undefined) => {
+    dashboard: D;
+    setFilters: (filters: Filter[]) => void;
+};

package/dist/packages/sdk-ui/src/dashboard/use-dashboard-theme.d.ts

@@ -0,0 +1,40 @@
+import { DashboardStyleOptions } from '../models';
+/**
+ * @internal
+ */
+export interface DashboardThemeParams {
+    styleOptions?: DashboardStyleOptions;
+}
+/**
+ * {@link useDashboardTheme} without tracking to be used inside other hooks or components in Compose SDK.
+ *
+ * @param params - Parameters of the dashboard to be retrieved
+ * @internal
+ */
+export declare const useDashboardThemeInternal: ({ styleOptions }: DashboardThemeParams) => {
+    themeSettings: {
+        dashboard: {
+            backgroundColor: string;
+            dividerLineWidth: number;
+            dividerLineColor: string;
+        };
+        palette?: import("..").ColorPaletteTheme | undefined;
+    };
+};
+/**
+ * React hook that returns dashboard theme settings
+ *
+ * @group Dashboards
+ * @alpha
+ * @internal
+ */
+export declare const useDashboardTheme: (args_0: DashboardThemeParams) => {
+    themeSettings: {
+        dashboard: {
+            backgroundColor: string;
+            dividerLineWidth: number;
+            dividerLineColor: string;
+        };
+        palette?: import("..").ColorPaletteTheme | undefined;
+    };
+};

package/dist/packages/sdk-ui/src/dashboard-widget/dashboard-widget.d.ts

@@ -11,7 +11,7 @@ import { DashboardWidgetProps } from '../props';
  *
  * ## Example
  *
- * Display two dashboard widgets from a Fusion Embed instance.
+ * Display two dashboard widgets from a Fusion instance.
  *
  * <iframe
  *  src='https://csdk-playground.sisense.com/?example=fusion-assets%2Ffusion-widgets&mode=docs'
@@ -20,7 +20,7 @@ import { DashboardWidgetProps } from '../props';
  *  style='border:none;'
  * />
  *
- * @group Fusion Embed
+ * @group Fusion Assets
  * @fusionEmbed
  */
 export declare const DashboardWidget: FunctionComponent<DashboardWidgetProps>;

package/dist/packages/sdk-ui/src/dashboard-widget/translate-widget-data-options.d.ts

@@ -1,8 +1,8 @@
-import { DimensionalBaseMeasure, DimensionalAttribute, DimensionalCalculatedMeasure, Jaql, JaqlDataSource } from '@sisense/sdk-data';
+import { DimensionalBaseMeasure, DimensionalAttribute, DimensionalCalculatedMeasure, Jaql, JaqlDataSource, Filter } from '@sisense/sdk-data';
 import { StyledMeasureColumn, StyledColumn, Color } from '../types';
 import { Panel, PanelItem, WidgetType, WidgetStyle, BoxplotWidgetStyle } from './types';
 import { WidgetDataOptions } from '../models';
-export declare function createDimensionalElementFromJaql(jaql: Jaql, format?: PanelItem['format']): import("@sisense/sdk-data").Filter | DimensionalAttribute | DimensionalCalculatedMeasure | DimensionalBaseMeasure;
+export declare function createDimensionalElementFromJaql(jaql: Jaql, format?: PanelItem['format']): Filter | DimensionalAttribute | DimensionalCalculatedMeasure | DimensionalBaseMeasure;
 /** @internal */
 export declare function applyStatisticalModels(dataOption: StyledMeasureColumn, statisticalModels?: {
     forecast?: {
@@ -17,11 +17,21 @@ export declare function applyStatisticalModels(dataOption: StyledMeasureColumn,
         trendType: string;
     };
 }): StyledMeasureColumn;
-export declare function createDataColumn(item: PanelItem, customPaletteColors?: Color[]): StyledMeasureColumn | StyledColumn;
+export declare function createDataColumn(item: PanelItem, customPaletteColors?: Color[]): StyledColumn | StyledMeasureColumn;
+/** @internal */
+export declare function createPanelItem(column: StyledColumn | StyledMeasureColumn): PanelItem;
 /** @internal */
 export declare const createDataOptionsFromPanels: (panels: Panel[], variantColors: Color[]) => {
     [key: string]: any[];
 };
+export declare const createPanelsFromDataOptions: (dataOptions: {
+    [key: string]: any[];
+}) => {
+    name: string;
+    items: {
+        jaql: any;
+    }[];
+}[];
 export declare function createColumnsFromPanelItems<ColumnType = StyledColumn | StyledMeasureColumn>(panels: Panel[], panelName: string, customPaletteColors?: Color[]): ColumnType[];
 export declare function extractBoxplotBoxType(style: BoxplotWidgetStyle): "iqr" | "extremums" | "standardDeviation";
 /**

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

@@ -95,7 +95,7 @@ export interface HierarchyDto {
     levels: BaseJaql[];
 }
 /**
- * @description the scroll location of the navigator scroller / auto zoom feature
+ * The scroll location of the navigator scroller / auto zoom feature
  */
 export type AutoZoomNavigatorScrollerLocation = {
     min: number;

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

@@ -5,6 +5,7 @@ import { FiltersMergeStrategy, Panel, PanelItem, TextWidgetDtoStyle, WidgetStyle
 import { ChartProps, ChartWidgetProps, PivotTableWidgetProps, PluginWidgetProps, RenderToolbarHandler, TextWidgetProps, CommonWidgetProps, WithWidgetType, WidgetProps } from '..';
 import { WidgetTypeInternal } from '../models/widget/types';
 export declare function getChartType(widgetType: WidgetType): ChartType;
+export declare function getWidgetTypeFromChartType(chartType: ChartType): WidgetType;
 export declare function getChartSubtype(widgetSubtype: WidgetSubtype): ChartSubtype | undefined;
 type WidgetTypeOrString = string | WidgetType;
 export declare function isSupportedWidgetType(widgetType: WidgetTypeOrString): widgetType is WidgetType;

package/dist/packages/sdk-ui/src/decorators/hook-decorators/with-tracking.d.ts

@@ -1,12 +1,13 @@
 import { ClientApplication } from '../../app/client-application';
 export type HookDecorator<DecoratorConfig> = (decoratorConfig: DecoratorConfig) => <HookArgs extends any[], HookResult>(hook: (...args: HookArgs) => HookResult) => (...args: HookArgs) => HookResult;
 /**
- * @internal
- * @description This is a function that tracks the hook event and sends it to the server.
+ * Tracks the hook event and sends it to the server.
+ *
  * @param hookName - The name of the hook
  * @param packageName - The name of the package
  * @param app - The client application
  * @param onFinally - The function to call after the tracking is done
+ * @internal
  */
 export declare const trackHook: (hookName: string, packageName: string, app: ClientApplication, onFinally: () => void) => void;
 export declare const withTracking: HookDecorator<string>;

package/dist/packages/sdk-ui/src/filters/components/criteria-filter-tile/criteria-filter-tile.d.ts

@@ -26,7 +26,7 @@ export interface CriteriaFilterTileProps {
 export type CriteriaFilterType = NumericFilter | TextFilter | RankingFilter | ExcludeFilter;
 /**
  * UI component that allows the user to filter numeric or text attributes according to
- * a number of built-in operations defined in the {@link NumericFilter}, {@link TextFilter}, or {@link RankingFilter}.
+ * a number of built-in operations defined in the numeric filter, text filter, or ranking filter.
  *
  * The arrangement prop determines whether the filter is rendered vertically or horizontally, with the latter intended for toolbar use and omitting title, enable/disable, and collapse/expand functionality.
  *

package/dist/packages/sdk-ui/src/filters/components/date-filter/date-range-filter-tile/date-range-filter-display.d.ts

@@ -1,6 +1,7 @@
+import React from 'react';
 import { DateRangeFilter } from '@sisense/sdk-data';
 type DateRangeFilterDisplayProps = {
     filter: DateRangeFilter;
 };
-export declare const DateRangeFilterDisplay: (props: DateRangeFilterDisplayProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DateRangeFilterDisplay: React.FC<DateRangeFilterDisplayProps>;
 export {};

package/dist/packages/sdk-ui/src/filters/components/filters-panel/filters-panel.d.ts

@@ -3,7 +3,6 @@ import { DataSource, Filter } from '@sisense/sdk-data';
 /**
  * Props of the {@link FiltersPanel} component
  *
- * @internal
  */
 export type FiltersPanelProps = {
     /** Array of filters to display */
@@ -16,6 +15,7 @@ export type FiltersPanelProps = {
 /**
  * Filters panel component that renders a list of filter tiles
  *
- * @internal
+ * @group Filter Tiles
+ * @alpha
  */
 export declare const FiltersPanel: import("react").FunctionComponent<FiltersPanelProps>;

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

@@ -1,2 +1,2 @@
-export { FiltersPanel } from './filters-panel';
+export { FiltersPanel, type FiltersPanelProps } from './filters-panel';
 export { FiltersPanelTile } from './filters-panel-tile';

package/dist/packages/sdk-ui/src/filters/components/unsupported-filter-tile.d.ts

@@ -0,0 +1,12 @@
+import { FilterTileDesignOptions } from '../../filters/components/filter-tile';
+import { Filter } from '@sisense/sdk-data';
+export type UnsupportedFilterTileProps = {
+    filter: Filter;
+    design?: FilterTileDesignOptions;
+};
+/**
+ * Filter tile component that renders an unsupported filter (which is not recognized by the JAQL to Filter translation)
+ *
+ * @internal
+ */
+export declare const UnsupportedFilterTile: ({ filter, design }: UnsupportedFilterTileProps) => import("react/jsx-runtime").JSX.Element;