@sisense/sdk-ui-vue 2.14.0 → 2.15.0

package/dist/packages/sdk-ui-vue/src/components/charts/pivot-table.d.ts

@@ -16,7 +16,7 @@ export { PivotTableProps };
  * import { ref } from 'vue';
  * import { measureFactory, filterFactory } from '@sisense/sdk-data';
  * import * as DM from '../assets/sample-retail-model';
- * import { PivotTable, type PivotTableProps } from '@sisense/sdk-ui-vue/Table';
+ * import { PivotTable, type PivotTableProps } from '@sisense/sdk-ui-vue';
  *
  * const dimProductName = DM.DimProducts.ProductName;
  * const measureTotalRevenue = measureFactory.sum(DM.Fact_Sale_orders.OrderRevenue, 'Total Revenue');

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

@@ -1,4 +1,5 @@
 export { ChartWidget, type ChartWidgetProps } from './chart-widget';
 export { WidgetById, type WidgetByIdProps } from './widget-by-id';
 export { TableWidget, type TableWidgetProps } from './table-widget';
+export { PivotTableWidget } from './pivot-table-widget';
 export { Widget, type WidgetProps, type WithCommonWidgetProps, type TextWidgetProps, type CustomWidgetProps, type PivotTableWidgetProps, } from './widget';

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

@@ -0,0 +1,208 @@
+/// <reference types="react" />
+import { type PivotTableWidgetProps } from '@sisense/sdk-ui-preact';
+import type { PropType } from 'vue';
+export { PivotTableWidgetProps };
+/**
+ * The PivotTableWidget component extending the {@link PivotTable} component to support widget style options.
+ *
+ * @example
+ * Here's how you can use the PivotTableWidget component in a Vue application:
+ * ```vue
+ * <template>
+ *   <PivotTableWidget :props="pivotTableWidgetProps" />
+ * </template>
+ *
+ * <script setup lang="ts">
+ * import { ref } from 'vue';
+ * import { PivotTableWidget } from '@sisense/sdk-ui-vue';
+ *
+ * const pivotTableWidgetProps = ref({
+ *   // Configure your PivotTableWidget here
+ * });
+ * </script>
+ * ```
+ * <img src="media://vue-pivot-table-widget-example.png" width="600px" />
+ * @param props - Pivot Table Widget properties
+ * @returns Widget component representing a pivot table
+ * @group Dashboards
+ * @beta
+ */
+export declare const PivotTableWidget: import("vue").DefineComponent<{
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.dataOptions}
+     *
+     * @category Chart
+     */
+    dataOptions: {
+        type: PropType<import("@sisense/sdk-ui-preact").PivotTableDataOptions>;
+        required: true;
+    };
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.dataSource}
+     *
+     * @category Data
+     */
+    dataSource: PropType<import("@sisense/sdk-data").DataSource | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.description}
+     *
+     * @category Widget
+     */
+    description: PropType<string | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.filters}
+     *
+     * @category Data
+     */
+    filters: PropType<import("@sisense/sdk-data").FilterRelations | import("@sisense/sdk-data").Filter[] | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.styleOptions}
+     *
+     * @category Widget
+     */
+    styleOptions: PropType<import("@sisense/sdk-ui-preact").PivotTableWidgetStyleOptions | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.title}
+     *
+     * @category Widget
+     */
+    title: PropType<string | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.topSlot}
+     *
+     * @category Widget
+     * @internal
+     */
+    topSlot: PropType<import("react").ReactNode>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.bottomSlot}
+     *
+     * @category Widget
+     * @internal
+     */
+    bottomSlot: PropType<import("react").ReactNode>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.highlights}
+     *
+     * @category Data
+     */
+    highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.onDataPointClick}
+     *
+     * @category Callbacks
+     * @internal
+     */
+    onDataPointClick: PropType<import("@sisense/sdk-ui-preact").PivotTableDataPointEventHandler | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.onDataPointContextMenu}
+     *
+     * @category Callbacks
+     * @internal
+     */
+    onDataPointContextMenu: PropType<import("@sisense/sdk-ui-preact").PivotTableDataPointEventHandler | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.onDataCellFormat}
+     *
+     * @category Callbacks
+     * @internal
+     */
+    onDataCellFormat: PropType<import("@sisense/sdk-ui/dist/packages/sdk-ui/src/pivot-table/formatters/types").CustomDataCellFormatter | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.onHeaderCellFormat}
+     *
+     * @category Callbacks
+     * @internal
+     */
+    onHeaderCellFormat: PropType<import("@sisense/sdk-ui/dist/packages/sdk-ui/src/pivot-table/formatters/types").CustomHeaderCellFormatter | undefined>;
+}, (() => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>) | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.dataOptions}
+     *
+     * @category Chart
+     */
+    dataOptions: {
+        type: PropType<import("@sisense/sdk-ui-preact").PivotTableDataOptions>;
+        required: true;
+    };
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.dataSource}
+     *
+     * @category Data
+     */
+    dataSource: PropType<import("@sisense/sdk-data").DataSource | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.description}
+     *
+     * @category Widget
+     */
+    description: PropType<string | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.filters}
+     *
+     * @category Data
+     */
+    filters: PropType<import("@sisense/sdk-data").FilterRelations | import("@sisense/sdk-data").Filter[] | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.styleOptions}
+     *
+     * @category Widget
+     */
+    styleOptions: PropType<import("@sisense/sdk-ui-preact").PivotTableWidgetStyleOptions | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.title}
+     *
+     * @category Widget
+     */
+    title: PropType<string | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.topSlot}
+     *
+     * @category Widget
+     * @internal
+     */
+    topSlot: PropType<import("react").ReactNode>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.bottomSlot}
+     *
+     * @category Widget
+     * @internal
+     */
+    bottomSlot: PropType<import("react").ReactNode>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.highlights}
+     *
+     * @category Data
+     */
+    highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.onDataPointClick}
+     *
+     * @category Callbacks
+     * @internal
+     */
+    onDataPointClick: PropType<import("@sisense/sdk-ui-preact").PivotTableDataPointEventHandler | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.onDataPointContextMenu}
+     *
+     * @category Callbacks
+     * @internal
+     */
+    onDataPointContextMenu: PropType<import("@sisense/sdk-ui-preact").PivotTableDataPointEventHandler | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.onDataCellFormat}
+     *
+     * @category Callbacks
+     * @internal
+     */
+    onDataCellFormat: PropType<import("@sisense/sdk-ui/dist/packages/sdk-ui/src/pivot-table/formatters/types").CustomDataCellFormatter | undefined>;
+    /**
+     * {@inheritDoc @sisense/sdk-ui!PivotTableWidgetProps.onHeaderCellFormat}
+     *
+     * @category Callbacks
+     * @internal
+     */
+    onHeaderCellFormat: PropType<import("@sisense/sdk-ui/dist/packages/sdk-ui/src/pivot-table/formatters/types").CustomHeaderCellFormatter | undefined>;
+}>>, {}, {}>;

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

@@ -1,6 +1,7 @@
 export { useExecuteQuery } from './use-execute-query.js';
 export { useExecuteQueryByWidgetId } from './use-execute-query-by-widget-id.js';
 export { useExecuteCsvQuery } from './use-execute-csv-query.js';
+export { useExecutePivotQuery } from './use-execute-pivot-query.js';
 export { useExecuteCustomWidgetQuery, type ExecuteCustomWidgetQueryParams, type CustomWidgetQueryState, } from './use-execute-custom-widget-query.js';
 export { useGetFilterMembers } from './use-get-filter-members.js';
 export { useGetDashboardModel } from './use-get-dashboard-model.js';

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

@@ -0,0 +1,43 @@
+import { type ExecutePivotQueryParams, type PivotQueryState } from '@sisense/sdk-ui-preact';
+import type { MaybeRefOrWithRefs } from '../types';
+/**
+ * A Vue composable function `useExecutePivotQuery` that executes a pivot data query.
+
+ * @param {MaybeRefOrWithRefs<ExecutePivotQueryParams>} params - The parameters for the query, supporting reactive Vue refs.
+ * Includes details such as `dataSource`, `dimensions`, `rows`, `columns`, `values`, `filters` and more, allowing for comprehensive
+ * query configuration. The `filters` parameter supports dynamic filtering based on user interaction or other application
+ * state changes.
+ *
+ * @example
+ * How to use `useExecutePivotQuery` within a Vue component:
+ * ```vue
+ * <script setup>
+ * import { ref } from 'vue';
+ * import { useExecutePivotQuery } from '@sisense/sdk-ui-vue';
+ *
+ * const dataSource = ref('your_data_source_id');
+ * // Set up other query parameters as needed (dimensions, rows, columns, values, filters, etc.)
+ *
+ * const { data, isLoading, isError, isSuccess, error } = useExecutePivotQuery({
+ *   dataSource,
+ *   columns: [...],
+ *   rows: [...],
+ *   values: [...],
+ *   filters: [...],
+ *   // Additional query parameters
+ * });
+ * </script>
+ * ```
+ *
+ * The composable returns an object with the following reactive properties to manage the query state:
+ * - `data`: The Pivot query result data set returned from the query. It remains `undefined` until the query completes successfully.
+ * - `isLoading`: Indicates if the query is in progress.
+ * - `isError`: Indicates if an error occurred during query execution.
+ * - `isSuccess`: Indicates if the query executed successfully without errors.
+ * - `error`: Contains the error object if an error occurred during the query.
+ *
+ * This composable facilitates integrating Sisense data fetching into Vue applications, enabling developers
+ * to easily manage query states and dynamically adjust query parameters based on application needs.
+ * @group Queries
+ */
+export declare const useExecutePivotQuery: (params: MaybeRefOrWithRefs<ExecutePivotQueryParams>) => import("vue").ToRefs<PivotQueryState>;