@sisense/sdk-ui 2.1.1 → 2.2.0

package/dist/packages/sdk-ui/src/api/rest-api.d.ts

@@ -33,6 +33,7 @@ export declare class RestApi {
         }[] | undefined;
         layout?: import("./types/dashboard-dto").LayoutDto | undefined;
         style?: import("./types/dashboard-dto").DashboardStyleDto | undefined;
+        settings?: import("./types/dashboard-dto").DashboardSettings | undefined;
     } & import("../utils/utility-types").AnyObject)[]>;
     /**
      * Get a specific dashboard

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

@@ -41,6 +41,12 @@ export type DashboardStyleDto = {
     paletteId?: string;
 };
 export declare const isCascadingFilterDto: (filter: FilterDto | CascadingFilterDto) => filter is CascadingFilterDto;
+export type DashboardSettings = {
+    autoUpdateOnFiltersChange?: boolean;
+    useAcceleration?: boolean;
+    aiAssistantEnabled?: boolean;
+    managedByTool?: string;
+};
 /**
  * @internal
  */
@@ -56,5 +62,6 @@ export type DashboardDto = {
     }[];
     layout?: LayoutDto;
     style?: DashboardStyleDto;
+    settings?: DashboardSettings;
 } & AnyObject;
 export {};

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

@@ -0,0 +1,64 @@
+interface UseStateWithHistoryOptions<T> {
+    /**
+     * Maximum number of history entries to store
+     * @default 10
+     */
+    capacity?: number;
+    /**
+     * Initial history entries
+     * @default []
+     */
+    initialHistory?: T[];
+}
+interface StateWithHistoryResult<T> {
+    /** Current state value */
+    state: T;
+    /** All history entries */
+    history: T[];
+    /** Index of the current state in history */
+    currentIndex: number;
+    /** Set state and add to history */
+    setState: (value: T | ((prev: T) => T)) => void;
+    /** Go back to the previous state in history */
+    undo: () => void;
+    /** Go forward to the next state in history */
+    redo: () => void;
+    /** Whether there's a previous state to go back to */
+    canUndo: boolean;
+    /** Whether there's a next state to go forward to */
+    canRedo: boolean;
+    /** Go to a specific point in history by index */
+    goTo: (index: number) => void;
+    /** Clear all history except current state */
+    clearHistory: () => void;
+}
+/**
+ * A hook that provides state management with history tracking for undo/redo functionality.
+ *
+ * @param initialState - The initial state value
+ * @param options - Configuration options for history management
+ * @returns An object containing the current state, history, and methods to navigate through history
+ *
+ * @example
+ * ```tsx
+ * const {
+ *   state,
+ *   setState,
+ *   undo,
+ *   redo,
+ *   canUndo,
+ *   canRedo
+ * } = useStateWithHistory({ count: 0 });
+ *
+ * // Update state
+ * setState({ count: state.count + 1 });
+ *
+ * // Undo last action if possible
+ * if (canUndo) undo();
+ *
+ * // Redo last undone action if possible
+ * if (canRedo) redo();
+ * ```
+ */
+export declare function useStateWithHistory<T>(initialState: T, options?: UseStateWithHistoryOptions<T>): StateWithHistoryResult<T>;
+export {};

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

@@ -1,3 +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;
+export declare const DashboardHeader: ({ title, toolbar }: DashboardHeaderProps) => import("react/jsx-runtime").JSX.Element;

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

@@ -1,11 +1,14 @@
 /// <reference types="react" />
 import { DashboardProps } from '../dashboard/types';
 import { Filter, FilterRelations } from '@sisense/sdk-data';
+import { WidgetsPanelLayout } from '../models';
 export declare enum DashboardChangeType {
     /** Dashboard filters have been updated */
     FILTERS_UPDATE = "FILTERS.UPDATE",
     /** Filters panel collapsed state changed */
-    UI_FILTERS_PANEL_COLLAPSE = "UI.FILTERS.PANEL.COLLAPSE"
+    UI_FILTERS_PANEL_COLLAPSE = "UI.FILTERS.PANEL.COLLAPSE",
+    /** Widgets panel layout updated */
+    WIDGETS_PANEL_LAYOUT_UPDATE = "WIDGETS_PANEL_LAYOUT.UPDATE"
 }
 export type DashboardChangeAction = {
     type: DashboardChangeType.FILTERS_UPDATE;
@@ -13,6 +16,9 @@ export type DashboardChangeAction = {
 } | {
     type: DashboardChangeType.UI_FILTERS_PANEL_COLLAPSE;
     payload: boolean;
+} | {
+    type: DashboardChangeType.WIDGETS_PANEL_LAYOUT_UPDATE;
+    payload: WidgetsPanelLayout;
 };
 /**
  * React component that renders a dashboard whose elements are customizable. It includes internal logic of applying common filters to widgets.

package/dist/packages/sdk-ui/src/dashboard/hooks/use-dashboard-header-toolbar.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+export interface DashboardHeaderToolbarMenuItem {
+    title: string;
+    icon?: JSX.Element;
+    ariaLabel?: string;
+    onClick: () => void;
+}
+export interface UseDashboardHeaderToolbarProps {
+    menuItems: DashboardHeaderToolbarMenuItem[];
+}
+/**
+ * Hook that returns a toolbar element for dashboard header
+ */
+export declare const useDashboardHeaderToolbar: ({ menuItems }: UseDashboardHeaderToolbarProps) => {
+    toolbar: () => import("react/jsx-runtime").JSX.Element;
+};
+export default useDashboardHeaderToolbar;

package/dist/packages/sdk-ui/src/dashboard/hooks/use-edit-mode-toolbar.d.ts

@@ -0,0 +1,52 @@
+/// <reference types="react" />
+import { WidgetsPanelLayout } from '../../models';
+/**
+ * Props for the useEditModeToolbar hook
+ */
+export interface UseEditModeToolbarProps {
+    /**
+     * Initial layout to track history for
+     */
+    initialLayout: WidgetsPanelLayout;
+    /**
+     * Optional callback when layout is applied
+     */
+    onApply?: (layout: WidgetsPanelLayout) => void;
+    /**
+     * Optional callback when edit is canceled
+     */
+    onCancel?: () => void;
+    /**
+     * Maximum number of history entries to store
+     * @default 20
+     */
+    historyCapacity?: number;
+}
+/**
+ * Return type for the useEditModeToolbar hook
+ */
+export interface UseEditModeToolbarResult {
+    /**
+     * Current layout state
+     */
+    layout: WidgetsPanelLayout;
+    /**
+     * Function to update layout state and track in history
+     */
+    setLayout: (layout: WidgetsPanelLayout | ((prev: WidgetsPanelLayout) => WidgetsPanelLayout)) => void;
+    /**
+     * Whether there are unsaved changes
+     */
+    hasChanges: boolean;
+    /**
+     * Toolbar component with undo, redo, cancel, apply buttons
+     */
+    toolbar: () => JSX.Element;
+}
+/**
+ * Hook that provides layout state management with history tracking and a toolbar with undo/redo/cancel/apply buttons
+ *
+ * @param props Configuration options for the toolbar
+ * @returns Layout state and toolbar component
+ */
+export declare function useEditModeToolbar({ initialLayout, onApply, onCancel, historyCapacity, }: UseEditModeToolbarProps): UseEditModeToolbarResult;

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

@@ -3,6 +3,7 @@ import { WidgetProps } from '../props';
 import { DashboardChangeAction } from '../dashboard/dashboard';
 import { DataSource, Filter, FilterRelations } from '@sisense/sdk-data';
 import { FiltersPanelConfig } from '../filters/components/filters-panel/types';
+import { ReactNode } from 'react';
 export type { DashboardStyleOptions, WidgetsPanelColumnLayout, WidgetsPanelLayout, WidgetsPanelCell, WidgetsPanelRow, WidgetsPanelColumn, } from '../models';
 /**
  * Props of the {@link DashboardById} component.
@@ -88,7 +89,7 @@ export interface DashboardConfig {
          */
         responsive?: boolean;
         /**
-         * If true will render editable layout.
+         * If true will .
          *
          * @internal
          */
@@ -170,4 +171,5 @@ export interface DashboardProps {
  */
 export interface DashboardHeaderProps {
     title: string;
+    toolbar?: () => ReactNode;
 }

package/dist/packages/sdk-ui/src/error-boundary/error-boundary.d.ts

@@ -8,11 +8,14 @@ interface ErrorBoundaryProps {
     error?: AbstractTranslatableError | Error | string;
     children: ReactNode;
     resetKeys?: any[];
-    onError?: (error: Error) => void;
+    onError?: (error: Error) => void | ReactNode;
     isContainerComponent?: boolean;
+    /** If set to true, children will be rendered when an error is provided via props, but not when caught during rendering */
+    shouldRenderChildrenWithProvidedError?: boolean;
 }
 type ErrorBoundaryState = {
     error: AbstractTranslatableError | Error | string | null;
+    customErrorUI: ReactNode | null;
 };
 /**
  * This component is used to catch errors thrown by the UI component and display an error message
@@ -24,11 +27,12 @@ type ErrorBoundaryState = {
  */
 export declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
     showErrorBox: boolean;
-    onError?: (error: Error) => void;
+    onError?: (error: Error) => void | ReactNode;
     isContainerComponent: boolean;
     constructor(props: ErrorBoundaryProps);
     static getDerivedStateFromError(error: Error): {
         error: Error;
+        customErrorUI: null;
     };
     componentDidCatch(error: Error): void;
     componentDidUpdate(prevProps: ErrorBoundaryProps, prevState: ErrorBoundaryState): void;

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

@@ -2,6 +2,7 @@ import { DataSource, Filter, FilterRelations } from '@sisense/sdk-data';
 import { DashboardStyleOptions, TabbersOptions, WidgetModel } from '../../models';
 import { type WidgetsOptions } from './types';
 import { DashboardLayoutOptions } from '../../dashboard';
+import { DashboardSettings } from '../../api/types/dashboard-dto';
 /**
  * Model of Sisense Fusion dashboard defined in the abstractions of Compose SDK.
  *
@@ -55,4 +56,10 @@ export interface DashboardModel {
      * @internal
      */
     tabbersOptions?: TabbersOptions;
+    /**
+     * Dashboard settings.
+     *
+     * @internal
+     */
+    settings?: DashboardSettings;
 }

package/dist/packages/sdk-ui/src/models/dashboard/translate-dashboard-dto-utils.d.ts

@@ -1,5 +1,6 @@
 import { Filter } from '@sisense/sdk-data';
-import { CascadingFilterDto, FilterDto } from '../../api/types/dashboard-dto';
+import { CascadingFilterDto, FilterDto, LayoutDto } from '../../api/types/dashboard-dto';
+import { WidgetsPanelLayout } from '../../dashboard/types';
 /**
  * Translates a {@link Filter} to a {@link FilterDto}.
  *
@@ -8,3 +9,4 @@ import { CascadingFilterDto, FilterDto } from '../../api/types/dashboard-dto';
  * @internal
  */
 export declare function filterToFilterDto(filter: Filter): FilterDto | CascadingFilterDto;
+export declare function layoutToLayoutDto(layout: WidgetsPanelLayout): LayoutDto;

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

@@ -51,7 +51,7 @@ export type WidgetsOptions = Record<WidgetId, {
     filtersOptions?: CommonFiltersOptions;
 }>;
 /**
- * Options for TabberWidetss in a dashboard
+ * Options for TabberWidets in a dashboard
  *
  * This property actually moves responsibility on the layout management from the tabber widgets to the dashboard,
  * storing all the tabbers configs in the single place

package/dist/packages/sdk-ui/src/models/dashboard/use-dashboard-model/use-dashboard-model-reducer.d.ts

@@ -1,4 +1,4 @@
-import { DashboardModel, WidgetModel } from '../../../models';
+import { DashboardModel, WidgetModel, WidgetsPanelLayout } from '../../../models';
 import { Filter, FilterRelations } from '@sisense/sdk-data';
 import { RestApi } from '../../../api/rest-api';
 export type UseDashboardModelState = DashboardModel | null;
@@ -8,8 +8,7 @@ export type UseDashboardModelState = DashboardModel | null;
  * @internal
  */
 export declare enum UseDashboardModelActionTypeInternal {
-    DASHBOARD_INIT = "DASHBOARD.INIT",
-    DASHBOARD_UPDATE_LAYOUT = "DASHBOARD.UPDATE_LAYOUT"
+    DASHBOARD_INIT = "DASHBOARD.INIT"
 }
 /**
  * Action types for the dashboard model state used in {@link useDashboardModel}.
@@ -18,7 +17,8 @@ export declare enum UseDashboardModelActionTypeInternal {
  */
 export declare enum UseDashboardModelActionType {
     FILTERS_UPDATE = "FILTERS.UPDATE",
-    ADD_WIDGET = "WIDGETS.ADD"
+    ADD_WIDGET = "WIDGETS.ADD",
+    WIDGETS_PANEL_LAYOUT_UPDATE = "WIDGETS_PANEL_LAYOUT.UPDATE"
 }
 /**
  * Internal actions for the dashboard model state used in {@link useDashboardModel}.
@@ -34,7 +34,7 @@ export type UseDashboardModelInternalAction = UseDashboardModelAction | {
  *
  * @internal
  */
-export type UseDashboardModelAction = UseDashboardModelFilterUpdateAction | UseDashboardModelAddWidgetAction;
+export type UseDashboardModelAction = UseDashboardModelFilterUpdateAction | UseDashboardModelAddWidgetAction | UseDashboardModelLayoutUpdateAction;
 /**
  * Filter update actions for the dashboard model state used in {@link useDashboardModel}.
  *
@@ -53,6 +53,15 @@ export type UseDashboardModelAddWidgetAction = {
     type: UseDashboardModelActionType.ADD_WIDGET;
     payload: WidgetModel;
 };
+/**
+ * Layout update action for the dashboard model state used in {@link useDashboardModel}.
+ *
+ * @internal
+ */
+export type UseDashboardModelLayoutUpdateAction = {
+    type: UseDashboardModelActionType.WIDGETS_PANEL_LAYOUT_UPDATE;
+    payload: WidgetsPanelLayout;
+};
 /**
  * Reducer for the dashboard model state used in {@link useDashboardModel}.
  *

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

@@ -86,6 +86,9 @@ export interface SisenseContextProviderProps {
     /**
      * Callback function that is triggered when an error occurs within the Sisense context.
      *
+     * Return React node to render a custom error UI.
+     * Return `undefined` to use the default error UI.
+     *
      * This callback is useful for handling errors that happen during the initialization or runtime of the Sisense context,
      * such as incorrect configuration, invalid authentication, or network-related issues.
      *
@@ -100,7 +103,7 @@ export interface SisenseContextProviderProps {
         componentName: string;
         /** The props of the component that caused the error. */
         componentProps: unknown;
-    }) => void;
+    }) => void | ReactNode;
     /**
      * Boolean flag to enable sending silent pre-authentication requests to the Sisense instance.
      * Used to check if user is already authenticated, check is performed in an ivisible iframe.

package/dist/packages/sdk-ui/src/translation/resources/en.d.ts

@@ -352,6 +352,15 @@ export declare const translation: {
         grandTotal: string;
         subTotal: string;
     };
+    dashboard: {
+        toolbar: {
+            undo: string;
+            redo: string;
+            cancel: string;
+            apply: string;
+            editLayout: string;
+        };
+    };
 };
 /**
  * A reference type containing all currently used translation keys.

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

@@ -362,6 +362,15 @@ export declare const resources: {
             grandTotal: string;
             subTotal: string;
         };
+        dashboard: {
+            toolbar: {
+                undo: string;
+                redo: string;
+                cancel: string;
+                apply: string;
+                editLayout: string;
+            };
+        };
     };
     uk: {
         errors: {
@@ -717,5 +726,14 @@ export declare const resources: {
             grandTotal: string;
             subTotal: string;
         };
+        dashboard: {
+            toolbar: {
+                undo: string;
+                redo: string;
+                cancel: string;
+                apply: string;
+                editLayout: string;
+            };
+        };
     };
 };