@sisense/sdk-ui-vue 1.31.0 → 1.33.0

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

@@ -0,0 +1,24 @@
+import type { DashboardConfig as DashboardConfigPreact, DashboardByIdConfig as DashboardByIdConfigPreact, DashboardFiltersPanelConfig as DashboardFiltersPanelConfigPreact } from '@sisense/sdk-ui-preact';
+/**
+ * {@inheritDoc @sisense/sdk-ui!DashboardFiltersPanelConfig}
+ */
+export interface DashboardFiltersPanelConfig extends Omit<DashboardFiltersPanelConfigPreact, 'actions'> {
+}
+/**
+ * {@inheritDoc @sisense/sdk-ui!DashboardConfig}
+ */
+export interface DashboardConfig extends Omit<DashboardConfigPreact, 'filtersPanel'> {
+    /**
+     * {@inheritDoc @sisense/sdk-ui!DashboardConfig.filtersPanel}
+     */
+    filtersPanel?: DashboardFiltersPanelConfig;
+}
+/**
+ * {@inheritDoc @sisense/sdk-ui!DashboardByIdConfig}
+ */
+export interface DashboardByIdConfig extends Omit<DashboardByIdConfigPreact, 'filtersPanel'> {
+    /**
+     * {@inheritDoc @sisense/sdk-ui!DashboardByIdConfig.filtersPanel}
+     */
+    filtersPanel?: DashboardFiltersPanelConfig;
+}

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

@@ -0,0 +1,2 @@
+export * from './maybe-ref';
+export * from './dashboard-config';

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

@@ -0,0 +1,14 @@
+import type { Ref } from 'vue';
+export type MaybeRef<T> = Ref<T> | T;
+export type MaybeWithRefs<T extends object> = {
+    [Property in keyof T]: MaybeRef<T[Property]>;
+};
+export type MaybeRefOrWithRefs<T extends Object> = MaybeRef<T> | MaybeWithRefs<T>;
+/**
+ * Converts all non-function properties of `T` into Vue refs while keeping function properties specified by `Fns` unchanged.
+ *
+ * @internal
+ */
+export type ToRefsExceptFns<T, Fns extends keyof T> = {
+    [K in keyof Omit<T, Fns>]: Ref<T[K]>;
+} & Pick<T, Fns>;

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

@@ -0,0 +1,105 @@
+import type { Filter, FilterRelations } from '@sisense/sdk-data';
+import type { DashboardProps } from '../components/dashboard';
+/**
+ * {@inheritDoc @sisense/sdk-ui!dashboardHelpers.replaceFilters}
+ *
+ * @example
+ * Replace all filters on a dashboard with a new set of filters.
+ * ```ts
+ * const existingDashboard: DashboardProps = {...}
+ * const newFilters: Filter[] = [{...}, {...}, ...];
+ * const updatedDashboard = dashboardHelpers.replaceFilters(existingDashboard, newFilters);
+ * ```
+ * @param dashboard - The original dashboard (`DashboardProps`) whose filters are to be replaced.
+ * @param newFilters - An array of new filters or filter relations to set on the dashboard.
+ * @returns A new dashboard instance with the updated filters.
+ */
+export declare const replaceFilters: (dashboard: DashboardProps, newFilters: Filter[] | FilterRelations) => DashboardProps;
+/**
+ * {@inheritDoc @sisense/sdk-ui!dashboardHelpers.addFilter}
+ *
+ * @example
+ * Add a new filter to a dashboard.
+ * ```ts
+ * const existingDashboard: DashboardProps = {...};
+ * const newFilter: Filter = {...};
+ * const updatedDashboard = dashboardHelpers.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;
+/**
+ * {@inheritDoc @sisense/sdk-ui!dashboardHelpers.addFilters}
+ *
+ * @example
+ * Add multiple new filters to a dashboard.
+ * ```ts
+ * const existingDashboard: DashboardProps = {...};
+ * const newFilters: Filter[] = [{...}, {...}, ...];
+ * const updatedDashboard = dashboardHelpers.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;
+/**
+ * {@inheritDoc @sisense/sdk-ui!dashboardHelpers.replaceFilter}
+ *
+ * @example
+ * Replace a filter in a dashboard.
+ * ```ts
+ * const existingDashboard: DashboardProps = {...};
+ * const filterToReplace: Filter = {...};
+ * const newFilter: Filter = {...};
+ * const updatedDashboard = dashboardHelpers.replaceFilter(existingDashboard, filterToReplace, newFilter);
+ * ```
+ * @param dashboard - The original dashboard (`DashboardProps`) containing the filter to be replaced.
+ * @param filterToReplace - The existing filter to be replaced.
+ * @param newFilter - The new filter to replace the existing one.
+ * @returns A new dashboard instance with the specified filter replaced.
+ */
+export declare const replaceFilter: (dashboard: DashboardProps, filterToReplace: Filter, newFilter: Filter) => DashboardProps;
+/**
+ * {@inheritDoc @sisense/sdk-ui!dashboardHelpers.modifyFilter}
+ *
+ * @deprecated Use {@link replaceFilter} instead
+ *
+ * @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;
+/**
+ * {@inheritDoc @sisense/sdk-ui!dashboardHelpers.removeFilter}
+ *
+ * @example
+ * Remove a filter from a dashboard.
+ * ```ts
+ * const existingDashboard: DashboardProps = {...};
+ * const filterToRemove: Filter = {...};
+ * const updatedDashboard = dashboardHelpers.removeFilter(existingDashboard, filterToRemove);
+ * ```
+ * @param dashboard - The original dashboard (`DashboardProps`) from which to remove the filter.
+ * @param filterToRemove - The filter to be removed.
+ * @returns A new dashboard instance with the specified filter removed.
+ */
+export declare const removeFilter: (dashboard: DashboardProps, filterToRemove: Filter) => DashboardProps;
+/**
+ * {@inheritDoc @sisense/sdk-ui!dashboardHelpers.removeFilters}
+ *
+ * @example
+ * Remove multiple filters from a dashboard.
+ * ```ts
+ * const existingDashboard: DashboardProps = {...};
+ * const filtersToRemove: Filter[] = [{...}, {...}, ...];
+ * const updatedDashboard = dashboardHelpers.removeFilters(existingDashboard, filtersToRemove);
+ * ```
+ * @param dashboard - The original dashboard (`DashboardProps`) from which the specified filters are removed.
+ * @param filtersToRemove - An array of filters to remove.
+ * @returns A new dashboard instance with the specified filters removed.
+ */
+export declare const removeFilters: (dashboard: DashboardProps, filtersToRemove: Filter[]) => DashboardProps;

package/dist/packages/sdk-ui-vue/src/utilities/dashboard-model-translator.d.ts

@@ -0,0 +1,37 @@
+import { type DashboardModel } from '@sisense/sdk-ui-preact';
+import type { DashboardProps } from '../components/dashboard';
+/**
+ * Translates {@link DashboardModel} to {@link DashboardProps}.
+ *
+ * @example
+ * ```vue
+<script setup lang="ts">
+import { dashboardModelTranslator, useGetDashboardModel, Dashboard } from '@sisense/sdk-ui-vue';
+import { computed } from 'vue';
+
+const { dashboard } = useGetDashboardModel({
+  dashboardOid: 'your-dashboard-oid',
+  includeWidgets: true,
+  includeFilters: true,
+});
+
+const dashboardProps = computed(() =>
+  dashboard.value ? dashboardModelTranslator.toDashboardProps(dashboard.value) : null,
+);
+</script>
+
+<template>
+  <Dashboard
+    v-if="dashboardProps"
+    :title="dashboardProps.title"
+    :layoutOptions="dashboardProps.layoutOptions"
+    :widgets="dashboardProps.widgets"
+    :filters="dashboardProps.filters"
+    :defaultDataSource="dashboardProps.defaultDataSource"
+    :widgetsOptions="dashboardProps.widgetsOptions"
+    :styleOptions="dashboardProps.styleOptions"
+  />
+</template>
+ * ```
+ */
+export declare function toDashboardProps(dashboardModel: DashboardModel): DashboardProps;

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

@@ -0,0 +1,23 @@
+/**
+ * {@inheritDoc @sisense/sdk-ui!dashboardModelTranslator}
+ *
+ * @group Fusion Assets
+ * @fusionEmbed
+ * @shortDescription Utility functions to translate a Fusion dashboard model from and to other dashboard data structures
+ */
+export * as dashboardModelTranslator from './dashboard-model-translator';
+/**
+ * {@inheritDoc @sisense/sdk-ui!dashboardHelpers}
+ *
+ * @group Dashboards
+ * @shortDescription Utility functions to manipulate dashboard elements
+ */
+export * as dashboardHelpers from './dashboard-helpers';
+/**
+ * {@inheritDoc @sisense/sdk-ui!widgetModelTranslator}
+ *
+ * @group Fusion Assets
+ * @fusionEmbed
+ * @shortDescription Utility functions to translate a Fusion widget model from and to other widget data structures
+ */
+export * as widgetModelTranslator from './widget-model-translator';

package/dist/packages/sdk-ui-vue/src/utilities/widget-model-translator.d.ts

@@ -0,0 +1,247 @@
+import { type WidgetModel, type TextWidgetProps, type ExecutePivotQueryParams, type ExecuteQueryParams, type PivotTableWidgetProps } from '@sisense/sdk-ui-preact';
+import type { ChartProps, PivotTableProps, TableProps } from '../components/charts';
+import type { ChartWidgetProps } from '../components/widgets';
+/**
+ * Translates a {@link WidgetModel} to the parameters for executing a query for the widget.
+ *
+ * @example
+ * ```vue
+<script setup lang="ts">
+import { widgetModelTranslator, useGetWidgetModel, useExecuteQuery } from '@sisense/sdk-ui-vue';
+import { computed } from 'vue';
+
+const { data: widgetModel } = useGetWidgetModel({
+  dashboardOid: 'your-dashboard-oid',
+  widgetOid: 'your-widget-oid',
+});
+
+const executeQueryParams = computed(() =>
+  widgetModel.value
+    ? widgetModelTranslator.toExecuteQueryParams(widgetModel.value)
+    : { enabled: false },
+);
+
+const { data, isLoading, isError } = useExecuteQuery(executeQueryParams);
+</script>
+ * ```
+ *
+ * Note: this method is not supported for getting pivot query.
+ * Use {@link toExecutePivotQueryParams} instead for getting query parameters for the pivot widget.
+ */
+export declare const toExecuteQueryParams: (widgetModel: WidgetModel) => ExecuteQueryParams;
+/**
+ * Translates a {@link WidgetModel} to the parameters for executing a query for the pivot widget.
+ *
+ * @example
+ * ```vue
+<script setup lang="ts">
+import { widgetModelTranslator, useGetWidgetModel, useExecuteQuery } from '@sisense/sdk-ui-vue';
+import { computed } from 'vue';
+
+const { data: widgetModel } = useGetWidgetModel({
+  dashboardOid: 'your-dashboard-oid',
+  widgetOid: 'your-widget-oid',
+});
+
+const executePivotQueryParams = computed(() =>
+  widgetModel.value ? widgetModelTranslator.toExecutePivotQueryParams(widgetModel.value): { enabled: false },
+);
+
+const { data, isLoading, isError } = useExecutePivotQuery(executePivotQueryParams);
+</script>
+ * ```
+ *
+ * Note: this method is supported only for getting pivot query.
+ * Use {@link toExecuteQueryParams} instead for getting query parameters for non-pivot widgets.
+ */
+export declare const toExecutePivotQueryParams: (widgetModel: WidgetModel) => ExecutePivotQueryParams;
+/**
+ * Translates a {@link WidgetModel} to the props for rendering a chart.
+ *
+ * @example
+ * ```vue
+<script setup lang="ts">
+import { widgetModelTranslator, useGetWidgetModel, Chart } from '@sisense/sdk-ui-vue';
+import { computed } from 'vue';
+
+const { data: widgetModel } = useGetWidgetModel({
+  dashboardOid: 'your-dashboard-oid',
+  widgetOid: 'your-widget-oid',
+});
+
+const chartProps = computed(() =>
+  widgetModel.value ? widgetModelTranslator.toChartProps(widgetModel.value) : null,
+);
+</script>
+
+<template>
+  <Chart
+    v-if="chartProps"
+    :chartType="chartProps.chartType"
+    :dataSet="chartProps.dataSet"
+    :dataOptions="chartProps.dataOptions"
+    :filters="chartProps.filters"
+    :highlights="chartProps.highlights"
+    :styleOptions="chartProps.styleOptions"
+  />
+</template>
+ * ```
+ *
+ * Note: this method is not supported for pivot widgets.
+ * Use {@link toPivotTableProps} instead for getting props for the {@link PivotTable}.
+ */
+export declare function toChartProps(widgetModel: WidgetModel): ChartProps;
+/**
+ * Translates a {@link WidgetModel} to the props for rendering a table.
+ *
+ * @example
+ * ```vue
+<script setup lang="ts">
+import { widgetModelTranslator, useGetWidgetModel, Table } from '@sisense/sdk-ui-vue';
+import { computed } from 'vue';
+
+const { data: widgetModel } = useGetWidgetModel({
+  dashboardOid: 'your-dashboard-oid',
+  widgetOid: 'your-widget-oid',
+});
+
+const tableProps = computed(() =>
+  widgetModel.value ? widgetModelTranslator.toTableProps(widgetModel.value) : null,
+);
+</script>
+
+<template>
+  <Table
+    v-if="tableProps"
+    :dataSet="tableProps.dataSet"
+    :dataOptions="tableProps.dataOptions"
+    :filters="tableProps.filters"
+    :styleOptions="tableProps.styleOptions"
+  />
+</template>
+ * ```
+ *
+ * Note: this method is not supported for chart and pivot widgets.
+ * Use {@link toChartProps} instead for getting props for the {@link Chart}.
+ * Use {@link toPivotTableProps} instead for getting props for the {@link PivotTable}.
+ */
+export declare function toTableProps(widgetModel: WidgetModel): TableProps;
+/**
+ * Translates a {@link WidgetModel} to the props for rendering a pivot table.
+ *
+ * @example
+ * ```vue
+<script setup lang="ts">
+import { widgetModelTranslator, useGetWidgetModel, PivotTable } from '@sisense/sdk-ui-vue';
+import { computed } from 'vue';
+
+const { data: widgetModel } = useGetWidgetModel({
+  dashboardOid: 'your-dashboard-oid',
+  widgetOid: 'your-widget-oid',
+});
+
+const pivotTableProps = computed(() =>
+  widgetModel.value ? widgetModelTranslator.toPivotTableProps(widgetModel.value) : null,
+);
+</script>
+
+<template>
+  <PivotTable
+    v-if="pivotTableProps"
+    :dataSet="pivotTableProps.dataSet"
+    :dataOptions="pivotTableProps.dataOptions"
+    :filters="pivotTableProps.filters"
+    :styleOptions="pivotTableProps.styleOptions"
+  />
+</template>
+ * ```
+ *
+ * Note: this method is not supported for chart or table widgets.
+ * Use {@link toChartProps} instead for getting props for the {@link Chart}.
+ * Use {@link toTableProps} instead for getting props for the {@link Table}.
+ */
+export declare function toPivotTableProps(widgetModel: WidgetModel): PivotTableProps;
+/**
+ * Translates a {@link WidgetModel} to the props for rendering a chart widget.
+ *
+ * @example
+ * ```vue
+<script setup lang="ts">
+import { widgetModelTranslator, useGetWidgetModel, ChartWidget } from '@sisense/sdk-ui-vue';
+import { computed } from 'vue';
+
+const { data: widgetModel } = useGetWidgetModel({
+  dashboardOid: 'your-dashboard-oid',
+  widgetOid: 'your-widget-oid',
+});
+
+const chartWidgetProps = computed(() =>
+  widgetModel.value ? widgetModelTranslator.toChartWidgetProps(widgetModel.value) : null,
+);
+</script>
+
+<template>
+  <ChartWidget
+    v-if="chartWidgetProps"
+    :chartType="chartWidgetProps.chartType"
+    :dataSource="chartWidgetProps.dataSource"
+    :dataOptions="chartWidgetProps.dataOptions"
+    :filters="chartWidgetProps.filters"
+    :highlights="chartWidgetProps.highlights"
+    :styleOptions="chartWidgetProps.styleOptions"
+  />
+</template>
+ * ```
+ *
+ * Note: this method is not supported for pivot widgets.
+ */
+export declare function toChartWidgetProps(widgetModel: WidgetModel): ChartWidgetProps;
+/**
+ * Translates a {@link WidgetModel} to the props for rendering a pivot table widget.
+ *
+ * @example
+ * ```vue
+<script setup lang="ts">
+import { widgetModelTranslator, useGetWidgetModel } from '@sisense/sdk-ui-vue';
+import { computed } from 'vue';
+
+const { data: widgetModel } = useGetWidgetModel({
+  dashboardOid: 'your-dashboard-oid',
+  widgetOid: 'your-widget-oid',
+});
+
+const pivotTableWidgetProps = computed(() =>
+  widgetModel.value ? widgetModelTranslator.toPivotTableWidgetProps(widgetModel.value) : null,
+);
+</script>
+ * ```
+ *
+ * Note: this method is not supported for chart or table widgets.
+ * Use {@link toChartWidgetProps} instead for getting props for the {@link ChartWidget}.
+ */
+export declare function toPivotTableWidgetProps(widgetModel: WidgetModel): PivotTableWidgetProps;
+/**
+ * Translates a {@link WidgetModel} to the props for rendering a text widget.
+ *
+ * @example
+ * ```vue
+<script setup lang="ts">
+import { widgetModelTranslator, useGetWidgetModel } from '@sisense/sdk-ui-vue';
+import { computed } from 'vue';
+
+const { data: widgetModel } = useGetWidgetModel({
+  dashboardOid: 'your-dashboard-oid',
+  widgetOid: 'your-widget-oid',
+});
+
+const textWidgetProps = computed(() =>
+  widgetModel.value ? widgetModelTranslator.toTextWidgetProps(widgetModel.value) : null,
+);
+</script>
+ * ```
+ *
+ * Note: this method is not supported for chart or pivot widgets.
+ * Use {@link toChartWidgetProps} instead for getting props for the {@link ChartWidget}.
+ * Use {@link toPivotTableWidgetProps} instead for getting props for the pivot table widget.
+ */
+export declare function toTextWidgetProps(widgetModel: WidgetModel): TextWidgetProps;