@sisense/sdk-ui 1.20.0 → 1.22.0

package/dist/packages/sdk-ui/src/query-execution/use-execute-pivot-query.d.ts

@@ -14,7 +14,6 @@ import { ExecutePivotQueryParams, PivotQueryState } from './types';
  *  style='border:none;'
  * />
  *
- * @param params - Parameters of the query
  * @returns Query state that contains the status of the query execution, the result data, or the error if any occurred
  * @group Queries
  * @beta
@@ -23,6 +22,7 @@ export declare const useExecutePivotQuery: (params: ExecutePivotQueryParams) =>
 /**
  * {@link useExecutePivotQuery} without tracking to be used inside other hooks or components in Compose SDK.
  *
+ * @param params - Parameters of the query
  * @internal
  */
 export declare function useExecutePivotQueryInternal(params: ExecutePivotQueryParams): PivotQueryState;

package/dist/packages/sdk-ui/src/query-execution/use-execute-query-by-widget-id.d.ts

@@ -27,15 +27,15 @@ import { QueryResultData } from '@sisense/sdk-data';
   return null;
  ```
  * See also hook {@link useExecuteQuery}, which execute a query specified in code.
- * @param params - Parameters to identify the target widget
  * @returns Query state that contains the status of the query execution, the result data, the constructed query parameters, or the error if any occurred
- * @group Fusion Embed
+ * @group Fusion Assets
  * @fusionEmbed
  */
 export declare const useExecuteQueryByWidgetId: (params: ExecuteQueryByWidgetIdParams) => QueryByWidgetIdState;
 /**
  * {@link useExecuteQueryByWidgetId} without tracking to be used inside other hooks or components in Compose SDK.
  *
+ * @param params - Parameters to identify the target widget
  * @internal
  */
 export declare function useExecuteQueryByWidgetIdInternal(params: ExecuteQueryByWidgetIdParams): QueryByWidgetIdState;

package/dist/packages/sdk-ui/src/query-execution/use-execute-query.d.ts

@@ -20,7 +20,6 @@ import { ExecuteQueryParams, ExecuteQueryResult } from './types';
  * - [Query with Sorting](https://www.sisense.com/platform/compose-sdk/playground/?example=queries%2Fuse-execute-query-sorting)
  * - [Take Control of Your Data Visualizations]( https://www.sisense.com/blog/take-control-of-your-data-visualizations/) blog post with examples of using the hook to fetch data to display in third-party charts.
  *
- * @param params - Parameters of the query
  * @returns Query state that contains the status of the query execution, the result data, or the error if any occurred
  * @group Queries
  */
@@ -28,6 +27,7 @@ export declare const useExecuteQuery: (params: ExecuteQueryParams) => ExecuteQue
 /**
  * {@link useExecuteQuery} without tracking to be used inside other hooks or components in Compose SDK.
  *
+ * @param params - Parameters of the query
  * @internal
  */
 export declare function useExecuteQueryInternal(params: ExecuteQueryParams): ExecuteQueryResult;

package/dist/packages/sdk-ui/src/translation/custom-translations-loader.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { CustomTranslationsLoaderProps } from '../props.js';
+/**
+ * Utility wrapper component to load custom translations into the i18n instance.
+ *
+ * @internal
+ * @param customTranslations - array of custom translation objects to be loaded
+ * @returns CustomTranslationsLoader component
+ */
+export declare const CustomTranslationsLoader: React.FC<CustomTranslationsLoaderProps>;

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

@@ -41,9 +41,41 @@ export declare const translation: {
         secondsDateTimeLevelSupportedOnlyForLive: string;
         missingMenuRoot: string;
         missingDataSource: string;
+        incorrectOnDataReadyHandler: string;
+        undefinedDataSource: string;
+        emptyModel: string;
+        missingMetadata: string;
+        missingModelTitle: string;
+        httpClientNotFound: string;
+        serverSettingsNotLoaded: string;
+        requiredColumnMissing: string;
+        unexpectedChartType: string;
+        noRowNumColumn: string;
+        ticIntervalCalculationFailed: string;
+        polarChartDesignOptionsExpected: string;
+        polarChartDesignOptionsNotExpected: string;
+        indicatorInvalidRelativeSize: string;
+        unsupportedMapType: string;
+        mapLoadingFailed: string;
+        cascadingFilterOriginalNotFound: string;
+        dashboardLoadFailed: string;
+        dashboardWithOidNotFound: string;
+        widgetWithOidNotFound: string;
+        widgetEmptyResponse: string;
+        dateFilterIncorrectOperator: string;
+        synchronizedFilterInvalidProps: string;
+        methodNotImplemented: string;
+        noPivotClient: string;
+        unexpectedCacheValue: string;
+        notAMembersFilter: string;
+        drilldownNoInitialDimension: string;
     };
     errorBoxText: string;
     chartNoData: string;
+    filters: string;
+    widgetDetails: string;
+    cancel: string;
+    includeAll: string;
     criteriaFilter: {
         displayModePrefix: string;
         equals: string;
@@ -72,7 +104,9 @@ export declare const translation: {
         last: string;
         next: string;
         from: string;
+        to: string;
         count: string;
+        select: string;
         today: string;
         days: string;
         weeks: string;
@@ -82,6 +116,11 @@ export declare const translation: {
         earliestDate: string;
         latestDate: string;
         todayOutOfRange: string;
+        dateRange: {
+            fromTo: string;
+            from: string;
+            to: string;
+        };
     };
     boxplot: {
         tooltip: {
@@ -117,10 +156,8 @@ export declare const translation: {
             max: string;
         };
     };
-    unsupportedFilter: {
-        title: string;
-        message: string;
-    };
+    unsupportedFilterMessage: string;
+    unsupportedFilter: string;
     commonFilter: {
         clearSelectionButton: string;
         selectMenuItem: string;
@@ -130,6 +167,63 @@ export declare const translation: {
     drilldown: {
         drillMenuItem: string;
         breadcrumbsAllSuffix: string;
+        breadcrumbsPrev: string;
+        breadcrumbsNext: string;
+        popover: {
+            members: string;
+            table: string;
+            column: string;
+        };
+    };
+    widgetHeader: {
+        info: {
+            details: string;
+            tooltip: string;
+        };
+    };
+    plugins: {
+        registerPrompt: string;
+    };
+    ai: {
+        analyticsChatbot: string;
+        dataTopics: string;
+        chatbotDescription: string;
+        topicSelectPrompt: string;
+        betaLabel: string;
+        preview: string;
+        clearHistoryPrompt: string;
+        config: {
+            inputPromptText: string;
+            welcomeText: string;
+            suggestionsWelcomeText: string;
+        };
+        buttons: {
+            insights: string;
+            correctResponse: string;
+            incorrectResponse: string;
+            clearChat: string;
+            refresh: string;
+            readMore: string;
+            collapse: string;
+            yes: string;
+            no: string;
+            seeMore: string;
+        };
+        disclaimer: {
+            poweredByAi: string;
+            rateRequest: string;
+        };
+        errors: {
+            chatUnavailable: string;
+            fetchHistory: string;
+            recommendationsNotAvailable: string;
+            insightsNotAvailable: string;
+            unexpectedChatResponse: string;
+            unexpected: string;
+            unknownResponse: string;
+            invalidInput: string;
+            noAvailableDataTopics: string;
+        };
     };
 };
 export type TranslationDictionary = typeof translation;

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

@@ -45,9 +45,41 @@ export declare const resources: {
             secondsDateTimeLevelSupportedOnlyForLive: string;
             missingMenuRoot: string;
             missingDataSource: string;
+            incorrectOnDataReadyHandler: string;
+            undefinedDataSource: string;
+            emptyModel: string;
+            missingMetadata: string;
+            missingModelTitle: string;
+            httpClientNotFound: string;
+            serverSettingsNotLoaded: string;
+            requiredColumnMissing: string;
+            unexpectedChartType: string;
+            noRowNumColumn: string;
+            ticIntervalCalculationFailed: string;
+            polarChartDesignOptionsExpected: string;
+            polarChartDesignOptionsNotExpected: string;
+            indicatorInvalidRelativeSize: string;
+            unsupportedMapType: string;
+            mapLoadingFailed: string;
+            cascadingFilterOriginalNotFound: string;
+            dashboardLoadFailed: string;
+            dashboardWithOidNotFound: string;
+            widgetWithOidNotFound: string;
+            widgetEmptyResponse: string;
+            dateFilterIncorrectOperator: string;
+            synchronizedFilterInvalidProps: string;
+            methodNotImplemented: string;
+            noPivotClient: string;
+            unexpectedCacheValue: string;
+            notAMembersFilter: string;
+            drilldownNoInitialDimension: string;
         };
         errorBoxText: string;
         chartNoData: string;
+        filters: string;
+        widgetDetails: string;
+        cancel: string;
+        includeAll: string;
         criteriaFilter: {
             displayModePrefix: string;
             equals: string;
@@ -76,7 +108,9 @@ export declare const resources: {
             last: string;
             next: string;
             from: string;
+            to: string;
             count: string;
+            select: string;
             today: string;
             days: string;
             weeks: string;
@@ -86,6 +120,11 @@ export declare const resources: {
             earliestDate: string;
             latestDate: string;
             todayOutOfRange: string;
+            dateRange: {
+                fromTo: string;
+                from: string;
+                to: string;
+            };
         };
         boxplot: {
             tooltip: {
@@ -121,10 +160,8 @@ export declare const resources: {
                 max: string;
             };
         };
-        unsupportedFilter: {
-            title: string;
-            message: string;
-        };
+        unsupportedFilterMessage: string;
+        unsupportedFilter: string;
         commonFilter: {
             clearSelectionButton: string;
             selectMenuItem: string;
@@ -134,6 +171,63 @@ export declare const resources: {
         drilldown: {
             drillMenuItem: string;
             breadcrumbsAllSuffix: string;
+            breadcrumbsPrev: string;
+            breadcrumbsNext: string;
+            popover: {
+                members: string;
+                table: string;
+                column: string;
+            };
+        };
+        widgetHeader: {
+            info: {
+                details: string;
+                tooltip: string;
+            };
+        };
+        plugins: {
+            registerPrompt: string;
+        };
+        ai: {
+            analyticsChatbot: string;
+            dataTopics: string;
+            chatbotDescription: string;
+            topicSelectPrompt: string;
+            betaLabel: string;
+            preview: string;
+            clearHistoryPrompt: string;
+            config: {
+                inputPromptText: string;
+                welcomeText: string;
+                suggestionsWelcomeText: string;
+            };
+            buttons: {
+                insights: string;
+                correctResponse: string;
+                incorrectResponse: string;
+                clearChat: string;
+                refresh: string;
+                readMore: string;
+                collapse: string;
+                yes: string;
+                no: string;
+                seeMore: string;
+            };
+            disclaimer: {
+                poweredByAi: string;
+                rateRequest: string;
+            };
+            errors: {
+                chatUnavailable: string;
+                fetchHistory: string;
+                recommendationsNotAvailable: string;
+                insightsNotAvailable: string;
+                unexpectedChatResponse: string;
+                unexpected: string;
+                unknownResponse: string;
+                invalidInput: string;
+                noAvailableDataTopics: string;
+            };
         };
     };
     uk: {
@@ -179,9 +273,41 @@ export declare const resources: {
             secondsDateTimeLevelSupportedOnlyForLive: string;
             missingMenuRoot: string;
             missingDataSource: string;
+            incorrectOnDataReadyHandler: string;
+            undefinedDataSource: string;
+            emptyModel: string;
+            missingMetadata: string;
+            missingModelTitle: string;
+            httpClientNotFound: string;
+            serverSettingsNotLoaded: string;
+            requiredColumnMissing: string;
+            unexpectedChartType: string;
+            noRowNumColumn: string;
+            ticIntervalCalculationFailed: string;
+            polarChartDesignOptionsExpected: string;
+            polarChartDesignOptionsNotExpected: string;
+            indicatorInvalidRelativeSize: string;
+            unsupportedMapType: string;
+            mapLoadingFailed: string;
+            cascadingFilterOriginalNotFound: string;
+            dashboardLoadFailed: string;
+            dashboardWithOidNotFound: string;
+            widgetWithOidNotFound: string;
+            widgetEmptyResponse: string;
+            dateFilterIncorrectOperator: string;
+            synchronizedFilterInvalidProps: string;
+            methodNotImplemented: string;
+            noPivotClient: string;
+            unexpectedCacheValue: string;
+            notAMembersFilter: string;
+            drilldownNoInitialDimension: string;
         };
         errorBoxText: string;
         chartNoData: string;
+        filters: string;
+        widgetDetails: string;
+        cancel: string;
+        includeAll: string;
         criteriaFilter: {
             displayModePrefix: string;
             equals: string;
@@ -210,7 +336,9 @@ export declare const resources: {
             last: string;
             next: string;
             from: string;
+            to: string;
             count: string;
+            select: string;
             today: string;
             days: string;
             weeks: string;
@@ -220,6 +348,11 @@ export declare const resources: {
             earliestDate: string;
             latestDate: string;
             todayOutOfRange: string;
+            dateRange: {
+                fromTo: string;
+                from: string;
+                to: string;
+            };
         };
         boxplot: {
             tooltip: {
@@ -255,10 +388,8 @@ export declare const resources: {
                 max: string;
             };
         };
-        unsupportedFilter: {
-            title: string;
-            message: string;
-        };
+        unsupportedFilterMessage: string;
+        unsupportedFilter: string;
         commonFilter: {
             clearSelectionButton: string;
             selectMenuItem: string;
@@ -268,6 +399,63 @@ export declare const resources: {
         drilldown: {
             drillMenuItem: string;
             breadcrumbsAllSuffix: string;
+            breadcrumbsPrev: string;
+            breadcrumbsNext: string;
+            popover: {
+                members: string;
+                table: string;
+                column: string;
+            };
+        };
+        widgetHeader: {
+            info: {
+                details: string;
+                tooltip: string;
+            };
+        };
+        plugins: {
+            registerPrompt: string;
+        };
+        ai: {
+            analyticsChatbot: string;
+            dataTopics: string;
+            chatbotDescription: string;
+            topicSelectPrompt: string;
+            betaLabel: string;
+            preview: string;
+            clearHistoryPrompt: string;
+            config: {
+                inputPromptText: string;
+                welcomeText: string;
+                suggestionsWelcomeText: string;
+            };
+            buttons: {
+                insights: string;
+                correctResponse: string;
+                incorrectResponse: string;
+                clearChat: string;
+                refresh: string;
+                readMore: string;
+                collapse: string;
+                yes: string;
+                no: string;
+                seeMore: string;
+            };
+            disclaimer: {
+                poweredByAi: string;
+                rateRequest: string;
+            };
+            errors: {
+                chatUnavailable: string;
+                fetchHistory: string;
+                recommendationsNotAvailable: string;
+                insightsNotAvailable: string;
+                unexpectedChatResponse: string;
+                unexpected: string;
+                unknownResponse: string;
+                invalidInput: string;
+                noAvailableDataTopics: string;
+            };
         };
     };
 };

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

@@ -921,11 +921,8 @@ export type WidgetThemeSettings = {
  * @internal
  */
 export type DashboardThemeSettings = {
-    /** Background color */
     backgroundColor?: string;
-    /** Width of the divider line between widgets */
     dividerLineWidth?: number;
-    /** Divider line color */
     dividerLineColor?: string;
 };
 /**
@@ -1435,3 +1432,27 @@ export type LoadingIndicatorConfig = {
  * Data options with arbitrary keys. This is typically used in the context of a plugin widget.
  */
 export type GenericDataOptions = Record<string, Array<StyledColumn | StyledMeasureColumn>>;
+/**
+ * Translation resources with nested structure.
+ */
+export type NestedTranslationResources = {
+    [key: string]: string | NestedTranslationResources;
+};
+/**
+ * Custom translation object.
+ */
+export type CustomTranslationObject = {
+    /**
+     * The language code of the translations.
+     */
+    language: string;
+    /**
+     * The translation resources.
+     */
+    resources: NestedTranslationResources;
+    /**
+     * The package name of the translations.
+     * Default value is `sdkUi`.
+     */
+    packageName?: string;
+};

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

@@ -22,6 +22,6 @@ import { ChartWidgetProps } from '../props';
  * <img src="media://chart-widget-with-drilldown-example-1.png" width="800px" />
  * @param props - ChartWidget properties
  * @returns ChartWidget component representing a chart type as specified in `ChartWidgetProps.`{@link ChartWidgetProps.chartType | chartType}
- * @group Dashboarding
+ * @group Dashboards
  */
 export declare const ChartWidget: FunctionComponent<ChartWidgetProps>;

package/dist/packages/sdk-ui/src/widgets/common/drilldown-utils.d.ts

@@ -0,0 +1,7 @@
+import { DataPoint, ChartType, ChartDataOptions } from '../../types';
+import { Attribute } from '@sisense/sdk-data';
+import { ScatterDataPoint } from '../..';
+export declare function getDrilldownInitialDimension(chartType: ChartType, dataOptions: ChartDataOptions): Attribute | undefined;
+export declare function isDrilldownApplicableToChart(chartType: ChartType, dataOptions: ChartDataOptions): boolean;
+export declare function applyDrilldownDimension(chartType: ChartType, dataOptions: ChartDataOptions, drilldownDimension: Attribute): ChartDataOptions;
+export declare function prepareDrilldownSelectionPoints(points: (DataPoint | ScatterDataPoint)[], nativeEvent: MouseEvent, dataOptions: ChartDataOptions): DataPoint[];

package/dist/packages/sdk-ui/src/widgets/common/{use-drilldown.d.ts → use-drilldown-core.d.ts}

@@ -1,22 +1,22 @@
 import { type TFunction } from '@sisense/sdk-common';
 import { Attribute, Column, MembersFilter } from '@sisense/sdk-data';
-import { StyledColumn, DrilldownSelection, DataPoint, ChartDataPoint, MenuItemSection } from '../../types.js';
+import { StyledColumn, DrilldownSelection, DataPoint, ChartDataPoint } from '../../types.js';
 import { Hierarchy } from '../../models';
-type UseDrilldownParams = {
-    drilldownPaths: (Attribute | Hierarchy)[];
+type UseDrilldownCoreParams = {
+    drilldownPaths?: (Attribute | Hierarchy)[];
     initialDimension: Column | StyledColumn;
     drilldownSelections?: DrilldownSelection[];
     onDrilldownSelectionsChange?: (selections: DrilldownSelection[]) => void;
 };
-export declare const useDrilldown: (params: UseDrilldownParams) => {
+export declare const useDrilldownCore: (params: UseDrilldownCoreParams) => {
+    drilldownSelections: DrilldownSelection[];
+    availableDrilldownPaths: (Attribute | Hierarchy)[];
     drilldownFilters: MembersFilter[];
     drilldownFiltersDisplayValues: string[][];
     drilldownDimension: Attribute;
     selectDrilldown: (points: DataPoint[], nextDimension: Attribute, hierarchy?: Hierarchy) => void;
     sliceDrilldownSelections: (i: number) => void;
     clearDrilldownSelections: () => void;
-    drilldownSelections: DrilldownSelection[];
-    availableDrilldownPaths: (Attribute | Hierarchy)[];
 };
 /**
  * @internal
@@ -26,7 +26,6 @@ export declare const processDrilldownSelections: (drilldownSelections: Drilldown
     drilldownFiltersDisplayValues: string[][];
     drilldownDimension: Attribute;
 };
+export declare function getDisplayMemberNameFromDataPoint(point: ChartDataPoint): string;
 export declare function getMemberNameFromDataPoint(point: ChartDataPoint): string;
-export declare function getSelectionTitleMenuItem(points: DataPoint[], drilldownDimension: Attribute): MenuItemSection;
-export declare function getDrilldownMenuItems(availableDrilldownPaths: (Attribute | Hierarchy)[], drilldownDimension: Attribute, selectFn: (nextDimension: Attribute, hierarchy?: Hierarchy) => void, translate: TFunction): MenuItemSection;
 export {};

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

@@ -3,6 +3,7 @@ import { CommonWidgetProps } from '../props';
 /**
  * Facade component that renders a widget within a dashboard based on the widget type.
  *
+ * @group Dashboards
  * @internal
  */
 export declare const CommonWidget: React.FC<CommonWidgetProps>;

package/dist/packages/sdk-ui/src/widgets/hooks/use-drilldown.d.ts

@@ -0,0 +1,25 @@
+import { Attribute, Column } from '@sisense/sdk-data';
+import { type TFunction } from '@sisense/sdk-common';
+import { StyledColumn, DrilldownSelection, DataPoint, MenuPosition, MenuItemSection } from '../../types.js';
+import { Hierarchy } from '../../models';
+import { OpenMenuFn } from '../../common/components/menu/types.js';
+type UseDrilldownParams = {
+    initialDimension: Column | StyledColumn;
+    drilldownPaths?: (Attribute | Hierarchy)[];
+    drilldownSelections?: DrilldownSelection[];
+    /**
+     * todo: make it optional when we will have a public `MenuProvider`.
+     * Without provided function, it should open internal menu with the help of `useMenu` hook
+     */
+    openMenu: OpenMenuFn;
+    onDrilldownSelectionsChange?: (selections: DrilldownSelection[]) => void;
+};
+export declare const useDrilldown: ({ initialDimension, drilldownPaths, drilldownSelections, openMenu, onDrilldownSelectionsChange, }: UseDrilldownParams) => {
+    drilldownDimension: Attribute;
+    drilldownFilters: import("@sisense/sdk-data").MembersFilter[];
+    breadcrumbs: import("react/jsx-runtime").JSX.Element;
+    openDrilldownMenu: (position: MenuPosition, points: DataPoint[]) => void;
+};
+export declare function getSelectionTitleMenuItem(points: DataPoint[], drilldownDimension: Attribute): MenuItemSection;
+export declare function getDrilldownMenuItems(availableDrilldownPaths: (Attribute | Hierarchy)[], drilldownDimension: Attribute, selectFn: (nextDimension: Attribute, hierarchy?: Hierarchy) => void, translate: TFunction): MenuItemSection;
+export {};

package/dist/packages/sdk-ui/src/widgets/hooks/use-with-drilldown.d.ts

@@ -0,0 +1,12 @@
+import { DrilldownSelection } from '../../types.js';
+import { ChartWidgetProps } from '../../props.js';
+type UseWithDrilldownParams = {
+    propsToExtend: ChartWidgetProps;
+    onDrilldownSelectionsChange?: (selections: DrilldownSelection[]) => void;
+};
+export declare const useWithDrilldown: ({ propsToExtend, onDrilldownSelectionsChange, }: UseWithDrilldownParams) => {
+    propsWithDrilldown: ChartWidgetProps;
+    isDrilldownEnabled: boolean | 0;
+    breadcrumbs: import("react/jsx-runtime").JSX.Element;
+};
+export {};

package/dist/packages/sdk-ui/src/widgets/pivot-table-widget.d.ts

@@ -17,7 +17,7 @@ import { PivotTableWidgetProps } from '../props';
  * ```
  * @param props - Pivot Table Widget properties
  * @returns Widget component representing a pivot table
- * @group Dashboarding
+ * @group Dashboards
  * @beta
  */
 export declare const PivotTableWidget: FunctionComponent<PivotTableWidgetProps>;

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { WidgetProps } from '..';
+/**
+ * Facade component that renders a widget within a dashboard based on the widget type.
+ *
+ * @group Dashboards
+ * @alpha
+ */
+export declare const Widget: React.FC<WidgetProps>;