@sisense/sdk-ui-vue 1.4.1 → 1.6.0

package/dist/src/components/charts/area-chart.d.ts

@@ -4,7 +4,6 @@ import type { PropType } from 'vue';
  * but with filled in areas under each line and an option to display them as stacked.
  * More info on [Sisense Documentation page](https://docs.sisense.com/main/SisenseLinux/area-chart.htm).
  *
- * <img src="media://area-chart-example-1.png" width="800"/>
  * @example
  * Here's how you can use the AreaChart component in a Vue application:
  * ```vue
@@ -18,8 +17,12 @@ import type { PropType } from 'vue';
  *
  * <script setup lang="ts">
  * import { ref } from 'vue';
+ * import { measureFactory, filterFactory } from '@sisense/sdk-data';
+ * import * as DM from '../assets/sample-retail-model';
  * import {AreaChart, type AreaChartProps} from '@sisense/sdk-ui-vue';
  *
+ * const dimProductName = DM.DimProducts.ProductName;
+ * const measureTotalRevenue = measureFactory.sum(DM.Fact_Sale_orders.OrderRevenue, 'Total Revenue');
  * const areaChartProps = ref<AreaChartProps>({
  *   dataSet: DM.DataSource,
  *   dataOptions: {
@@ -30,12 +33,14 @@ import type { PropType } from 'vue';
  *   filters: [],
  * });
  * ```
+ * <img src="media://vue-area-chart-example.png" width="800"/>
  * @param {AreaChartProps} - Area chart properties
  * @returns Area Chart component
+ * @group Charts
  */
 export declare const AreaChart: import("vue").DefineComponent<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").CartesianChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;
@@ -47,7 +52,7 @@ export declare const AreaChart: import("vue").DefineComponent<{
     [key: string]: any;
 }>) | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").CartesianChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;

package/dist/src/components/charts/areamap-chart.d.ts

@@ -16,8 +16,13 @@ import type { PropType } from 'vue';
  *
  * <script setup lang="ts">
  * import { ref } from 'vue';
+ * import { measureFactory, filterFactory } from '@sisense/sdk-data';
+ * import * as DM from '../assets/sample-retail-model';
  * import {AreamapChart, type AreamapChartProps} from '@sisense/sdk-ui-vue';
- *
+
+ * const dimProductName = DM.DimProducts.ProductName;
+ * const measureTotalRevenue = measureFactory.sum(DM.Fact_Sale_orders.OrderRevenue, 'Total Revenue');
+
   const areamapChartProps = ref<AreamapChartProps>({
     dataSet: DM.DataSource,
     dataOptions: {
@@ -28,13 +33,15 @@ import type { PropType } from 'vue';
   });
  * </script>
  * ```
+ * <img src="media://vue-areamap-chart-example.png" width="600px" />
  * @param props - Areamap chart properties
  * @returns Areamap Chart component
+ * @group Charts
  * @beta
  */
 export declare const AreamapChart: import("vue").DefineComponent<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").AreamapChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     styleOptions: PropType<import("@sisense/sdk-ui-preact").AreamapStyleOptions | undefined>;
@@ -43,7 +50,7 @@ export declare const AreamapChart: import("vue").DefineComponent<{
     [key: string]: any;
 }>) | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").AreamapChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     styleOptions: PropType<import("@sisense/sdk-ui-preact").AreamapStyleOptions | undefined>;

package/dist/src/components/charts/bar-chart.d.ts

@@ -16,8 +16,12 @@ import type { PropType } from 'vue';
  *
  * <script setup lang="ts">
  * import { ref } from 'vue';
- * import {BarChart} from '@sisense/sdk-ui-vue';
- *
+ * import { measureFactory, filterFactory } from '@sisense/sdk-data';
+ * import * as DM from '../assets/sample-retail-model';
+ * import {BarChart,type BarChartProps} from '@sisense/sdk-ui-vue';
+
+ * const dimProductName = DM.DimProducts.ProductName;
+ * const measureTotalRevenue = measureFactory.sum(DM.Fact_Sale_orders.OrderRevenue, 'Total Revenue');
   const barChartProps = ref<BarChartProps>({
     dataSet: DM.DataSource,
     dataOptions: {
@@ -29,9 +33,10 @@ import type { PropType } from 'vue';
   });
  * </script>
  * ```
- * <img src="media://bar-chart-example-1.png" width="800"/>
+ * <img src="media://vue-bar-chart-example.png" width="800"/>
  * @param props - Bar chart properties
  * @returns Bar Chart component
+ * @group Charts
  */
 export declare const BarChart: import("vue").DefineComponent<{
     /**
@@ -39,7 +44,7 @@ export declare const BarChart: import("vue").DefineComponent<{
      * including both BaseChartProps and ChartEventProps.
      */
     dataOptions: PropType<import("@sisense/sdk-ui-preact").CartesianChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;
@@ -55,7 +60,7 @@ export declare const BarChart: import("vue").DefineComponent<{
      * including both BaseChartProps and ChartEventProps.
      */
     dataOptions: PropType<import("@sisense/sdk-ui-preact").CartesianChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;

package/dist/src/components/charts/boxplot-chart.d.ts

@@ -16,9 +16,13 @@ import type { PropType } from 'vue';
  *
  * <script setup lang="ts">
  * import { ref } from 'vue';
+ * import { measureFactory, filterFactory } from '@sisense/sdk-data';
+ * import * as DM from '../assets/sample-retail-model';
  * import {BoxplotChart, type BoxplotChartProps} from '@sisense/sdk-ui-vue';
- *
-  const boxplotChartProps = ref<BoxplotChartProps>({
+
+ * const dimProductName = DM.DimProducts.ProductName;
+ * const measureTotalRevenue = measureFactory.sum(DM.Fact_Sale_orders.OrderRevenue, 'Total Revenue');
+ * const boxplotChartProps = ref<BoxplotChartProps>({
     dataSet: DM.DataSource,
     dataOptions: {
       category: [dimProductName],
@@ -29,14 +33,15 @@ import type { PropType } from 'vue';
     filters: [filterFactory.topRanking(dimProductName, measureTotalRevenue, 10)],
   });
  * ```
- * <img src="media://boxplot-chart-example-1.png" width="600px" />
+ * <img src="media://vue-boxplot-chart-example.png" width="600px" />
  * @param props - Boxplot chart properties
  * @returns Boxplot Chart component
+ * @group Charts
  * @beta
  */
 export declare const BoxplotChart: import("vue").DefineComponent<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").BoxplotChartDataOptions | import("@sisense/sdk-ui-preact").BoxplotChartCustomDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     styleOptions: PropType<import("@sisense/sdk-ui-preact").BoxplotStyleOptions | undefined>;
@@ -48,7 +53,7 @@ export declare const BoxplotChart: import("vue").DefineComponent<{
     [key: string]: any;
 }>) | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").BoxplotChartDataOptions | import("@sisense/sdk-ui-preact").BoxplotChartCustomDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     styleOptions: PropType<import("@sisense/sdk-ui-preact").BoxplotStyleOptions | undefined>;

package/dist/src/components/charts/chart.d.ts

@@ -16,16 +16,30 @@ import { type PropType } from 'vue';
  * const dimProductName = DM.DimProducts.ProductName;
  * const measureTotalRevenue = measureFactory.sum(DM.Fact_Sale_orders.OrderRevenue, 'Total Revenue');
  *
- * const chartProps = ref<ChartProps>({
- *   chartType: 'bar',
- *   dataSet: DM.DataSource,
- *   dataOptions: {
- *     category: [dimProductName],
- *     value: [{ column: measureTotalRevenue, sortType: 'sortDesc' }],
- *     breakBy: [],
- *   },
- *   filters: [filterFactory.topRanking(dimProductName, measureTotalRevenue, 10)]
- * });
+const chartProps = ref<ChartProps>({
+  chartType: 'bar',
+  dataSet: DM.DataSource,
+  dataOptions: {
+    category: [dimProductName],
+    value: [{ column: measureTotalRevenue, sortType: 'sortDesc' }],
+    breakBy: [],
+  },
+  filters: [filterFactory.topRanking(dimProductName, measureTotalRevenue, 10)],
+  styleOptions: {
+    xAxis: {
+      title: {
+        text: 'Product Name',
+        enabled: true,
+      },
+    },
+    yAxis: {
+      title: {
+        text: 'Total Revenue',
+        enabled: true,
+      },
+    },
+  },
+});
  * </script>
  *
  * <template>
@@ -34,18 +48,20 @@ import { type PropType } from 'vue';
        :dataSet="chartProps.dataSet"
        :dataOptions="chartProps.dataOptions"
        :filters="chartProps.filters"
+       :styleOptions="chartProps.styleOptions"
      />
  * </template>
  * ```
  *
- * <img src="media://chart-local-data-example-1.png" width="800px" />
+ * <img src="media://vue-chart-example.png" width="800px" />
  * @param props - Chart properties
  * @returns Chart component representing a chart type as specified in `ChartProps.`{@link ChartProps.chartType | chartType}
+ * @group Charts
  */
 export declare const Chart: import("vue").DefineComponent<{
     chartType: PropType<import("@sisense/sdk-ui-preact").ChartType>;
     dataOptions: PropType<import("@sisense/sdk-ui-preact").ChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;
@@ -59,7 +75,7 @@ export declare const Chart: import("vue").DefineComponent<{
 }>) | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     chartType: PropType<import("@sisense/sdk-ui-preact").ChartType>;
     dataOptions: PropType<import("@sisense/sdk-ui-preact").ChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;

package/dist/src/components/charts/column-chart.d.ts

@@ -17,8 +17,13 @@ import type { PropType } from 'vue';
  *
  * <script setup lang="ts">
  * import { ref } from 'vue';
+ * import { measureFactory, filterFactory } from '@sisense/sdk-data';
+ * import * as DM from '../assets/sample-retail-model';
  * import {ColumnChart, type ColumnChartProps} from '@sisense/sdk-ui-vue';
  *
+ * const dimProductName = DM.DimProducts.ProductName;
+ * const measureTotalRevenue = measureFactory.sum(DM.Fact_Sale_orders.OrderRevenue, 'Total Revenue');
+
 const columnChartProps = ref<ColumnChartProps>({
   dataSet: DM.DataSource,
   dataOptions: {
@@ -29,13 +34,14 @@ const columnChartProps = ref<ColumnChartProps>({
   filters: [filterFactory.topRanking(dimProductName, measureTotalRevenue, 10)],
 });
  * ```
- * <img src="media://column-chart-example-1.png" width="800"/>
+ * <img src="media://vue-column-chart-example.png" width="800"/>
  * @param props - Column chart properties
  * @returns Column Chart component
+ * @group Charts
  */
 export declare const ColumnChart: import("vue").DefineComponent<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").CartesianChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;
@@ -47,7 +53,7 @@ export declare const ColumnChart: import("vue").DefineComponent<{
     [key: string]: any;
 }>) | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").CartesianChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;

package/dist/src/components/charts/funnel-chart.d.ts

@@ -17,8 +17,13 @@ import type { PropType } from 'vue';
  * <script setup lang="ts">
  * import { ref } from 'vue';
  * import {FunnelChart, type FunnelChartProps} from '@sisense/sdk-ui-vue';
+ * import { measureFactory, filterFactory } from '@sisense/sdk-data';
+ * import * as DM from '../assets/sample-retail-model';
  *
-const funnelChartProps = ref<FunnelChartProps>({
+ * const dimProductName = DM.DimProducts.ProductName;
+ * const measureTotalRevenue = measureFactory.sum(DM.Fact_Sale_orders.OrderRevenue, 'Total Revenue');
+ *
+ * const funnelChartProps = ref<FunnelChartProps>({
   dataSet: DM.DataSource,
   dataOptions: {
     category: [dimProductName],
@@ -28,15 +33,16 @@ const funnelChartProps = ref<FunnelChartProps>({
 });
  * </script>
  * ```
- * <img src="media://funnel-chart-example-1.png" width="800"/>
+ * <img src="media://vue-funnel-chart-example.png" width="800"/>
  *
  * Note that the chart sorts the measure, `Unique Users`, in descending order by default.
  * @param props - Funnel chart properties
  * @returns Funnel Chart component
+ * @group Charts
  */
 export declare const FunnelChart: import("vue").DefineComponent<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").CategoricalChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;
@@ -48,7 +54,7 @@ export declare const FunnelChart: import("vue").DefineComponent<{
     [key: string]: any;
 }>) | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").CategoricalChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;

package/dist/src/components/charts/index.d.ts

@@ -11,10 +11,7 @@ export { TreemapChart } from './treemap-chart';
 export { SunburstChart } from './sunburst-chart';
 export { PolarChart } from './polar-chart';
 export { IndicatorChart } from './indicator-chart';
-export { ChartWidget } from './chart-widget';
 export { Chart } from './chart';
-export { DashboardWidget } from './dashboard-widget';
-export { TableWidget } from './table-widget';
 export { BoxplotChart } from './boxplot-chart';
 export { AreamapChart } from './areamap-chart';
 export { ScattermapChart } from './scattermap-chart';

package/dist/src/components/charts/indicator-chart.d.ts

@@ -16,24 +16,29 @@ import type { PropType } from 'vue';
  *
  * <script setup lang="ts">
  * import { ref } from 'vue';
+ * import { measureFactory, filterFactory } from '@sisense/sdk-data';
+ * import * as DM from '../assets/sample-retail-model';
  * import {IndicatorChart, type IndicatorChartProps} from '@sisense/sdk-ui-vue';
- *
-  const indicatorChartProps = ref<IndicatorChartProps>({
-    dataSet: DM.DataSource,
+
+ * const dimProductName = DM.DimProducts.ProductName;
+ * const measureTotalRevenue = measureFactory.sum(DM.Fact_Sale_orders.OrderRevenue, 'Total Revenue');
+   const indicatorChartProps = ref<IndicatorChartProps>({
+     dataSet: DM.DataSource,
     dataOptions: {
-      value: [{ column: measureTotalRevenue, sortType: 'sortDesc' }],
-    },
-    filters: [filterFactory.topRanking(dimProductName, measureTotalRevenue, 10)],
-  });
+       value: [{ column: measureTotalRevenue, sortType: 'sortDesc' }],
+     },
+     filters: [filterFactory.topRanking(dimProductName, measureTotalRevenue, 10)],
+   });
  * </script>
  * ```
- * <img src="media://indicator-chart-example-1.png" width="400px" />
+ * <img src="media://vue-indicator-chart-example.png" width="400px" />
  * @param props - Indicator chart properties
  * @returns Indicator Chart component
+ * @group Charts
  */
 export declare const IndicatorChart: import("vue").DefineComponent<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").IndicatorChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     styleOptions: PropType<import("@sisense/sdk-ui-preact").IndicatorStyleOptions | undefined>;
@@ -41,7 +46,7 @@ export declare const IndicatorChart: import("vue").DefineComponent<{
     [key: string]: any;
 }>) | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").IndicatorChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     styleOptions: PropType<import("@sisense/sdk-ui-preact").IndicatorStyleOptions | undefined>;

package/dist/src/components/charts/line-chart.d.ts

@@ -16,25 +16,30 @@ import type { PropType } from 'vue';
  *
  * <script setup lang="ts">
  * import { ref } from 'vue';
+ * import { measureFactory, filterFactory } from '@sisense/sdk-data';
+ * import * as DM from '../assets/sample-retail-model';
  * import {LineChart, type LineChartProps} from '@sisense/sdk-ui-vue';
- *
-const lineChartProps = ref<LineChartProps>({
-  dataSet: DM.DataSource,
-  dataOptions: {
-    category: [dimProductName],
-    value: [{ column: measureTotalRevenue, sortType: 'sortDesc' }],
-    breakBy: [],
-  },
-  filters: [filterFactory.topRanking(dimProductName, measureTotalRevenue, 10)],
-});
+
+ * const dimProductName = DM.DimProducts.ProductName;
+ * const measureTotalRevenue = measureFactory.sum(DM.Fact_Sale_orders.OrderRevenue, 'Total Revenue');
+ * const lineChartProps = ref<LineChartProps>({
+    dataSet: DM.DataSource,
+    dataOptions: {
+      category: [dimProductName],
+      value: [{ column: measureTotalRevenue, sortType: 'sortDesc' }],
+      breakBy: [],
+    },
+    filters: [filterFactory.topRanking(dimProductName, measureTotalRevenue, 10)],
+  });
  * ```
- * <img src="media://line-chart-example-1.png" width="800px" />
+ * <img src="media://vue-line-chart-example.png" width="800px" />
  * @param props - Line chart properties
  * @returns Line Chart component
+ * @group Charts
  */
 export declare const LineChart: import("vue").DefineComponent<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").CartesianChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;
@@ -46,7 +51,7 @@ export declare const LineChart: import("vue").DefineComponent<{
     [key: string]: any;
 }>) | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").CartesianChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;

package/dist/src/components/charts/pie-chart.d.ts

@@ -17,24 +17,29 @@ import type { PropType } from 'vue';
  *
  * <script setup lang="ts">
  * import { ref } from 'vue';
+ * import { measureFactory, filterFactory } from '@sisense/sdk-data';
+ * import * as DM from '../assets/sample-retail-model';
  * import {PieChart,type PieChartProps} from '@sisense/sdk-ui-vue';
  *
-const pieChartProps = ref<PieChartProps>({
-  dataSet: DM.DataSource,
-  dataOptions: {
-    category: [dimProductName],
-    value: [{ column: measureTotalRevenue, sortType: 'sortDesc' }],
-  },
-  filters: [filterFactory.topRanking(dimProductName, measureTotalRevenue, 10)],
-});
+ * const dimProductName = DM.DimProducts.ProductName;
+ * const measureTotalRevenue = measureFactory.sum(DM.Fact_Sale_orders.OrderRevenue, 'Total Revenue');
+ * const pieChartProps = ref<PieChartProps>({
+    dataSet: DM.DataSource,
+    dataOptions: {
+      category: [dimProductName],
+      value: [{ column: measureTotalRevenue, sortType: 'sortDesc' }],
+    },
+    filters: [filterFactory.topRanking(dimProductName, measureTotalRevenue, 10)],
+  });
  * ```
-* <img src="media://pie-chart-example-1.png" width="600px" />
+ * <img src="media://vue-pie-chart-example.png" width="800px" />
  * @param props - Pie chart properties
  * @returns Pie Chart component
+ * @group Charts
  */
 export declare const PieChart: import("vue").DefineComponent<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").CategoricalChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;
@@ -46,7 +51,7 @@ export declare const PieChart: import("vue").DefineComponent<{
     [key: string]: any;
 }>) | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").CategoricalChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;

package/dist/src/components/charts/pivot-table.d.ts

@@ -1,32 +1,45 @@
 import type { PropType } from 'vue';
 /**
- * TBU
- * A Vue component that wraps the PivotTable Preact component for use in Vue applications.
- * It provides a single 'props' prop to pass all the TableProps to the Table Preact component,
- * enabling the use of the table within Vue's reactivity system.
+ * A Vue component for Pivot table with pagination.
  *
  * @example
- * Here's how you can use the Table component in a Vue application:
+ * Here's how you can use the PivotTable component in a Vue application:
  * ```vue
  * <template>
- *   <Table :props="tableProps" />
+    <PivotTable :dataOptions="pivotTableProps.dataOptions" :dataSet="pivotTableProps.dataSet"
+        :styleOptions="pivotTableProps.styleOptions" :filters="pivotTableProps.filters" />
  * </template>
  *
  * <script setup lang="ts">
  * import { ref } from 'vue';
- * import Table from '@sisense/sdk-ui-vue/Table';
+ * 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';
  *
- * const tableProps = ref({
- *   // Define your TableProps configuration here
- * });
+ * const dimProductName = DM.DimProducts.ProductName;
+ * const measureTotalRevenue = measureFactory.sum(DM.Fact_Sale_orders.OrderRevenue, 'Total Revenue');
+const pivotTableProps = ref<PivotTableProps>({
+  dataSet: DM.DataSource,
+  dataOptions: {
+    rows: [dimProductName, dimColor],
+    columns: [dimCategoryName],
+    values: [measureTotalRevenue],
+  },
+  styleOptions: {
+    width: 1200,
+    height: 500,
+  },
+  filters: [filterFactory.topRanking(dimProductName, measureTotalRevenue, 1000)],
+});
  * </script>
  * ```
- *
+ * <img src="media://vue-pivot-table-example.png" width="800px" />
+ * @group Data Grids
  * @alpha
  */
 export declare const PivotTable: import("vue").DefineComponent<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").PivotTableDataOptions>;
-    dataSet: PropType<string | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     refreshCounter: PropType<number | undefined>;
     styleOptions: PropType<import("@sisense/sdk-ui-preact").PivotTableStyleOptions | undefined>;
@@ -34,7 +47,7 @@ export declare const PivotTable: import("vue").DefineComponent<{
     [key: string]: any;
 }>) | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").PivotTableDataOptions>;
-    dataSet: PropType<string | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     refreshCounter: PropType<number | undefined>;
     styleOptions: PropType<import("@sisense/sdk-ui-preact").PivotTableStyleOptions | undefined>;

package/dist/src/components/charts/polar-chart.d.ts

@@ -16,25 +16,30 @@ import { type PropType } from 'vue';
  *
  * <script setup lang="ts">
  * import { ref } from 'vue';
+ * import { measureFactory, filterFactory } from '@sisense/sdk-data';
+ * import * as DM from '../assets/sample-retail-model';
  * import {PolarChart,type PolarChartProps} from '@sisense/sdk-ui-vue';
  *
-const polarChartProps = ref<PolarChartProps>({
-  dataSet: DM.DataSource,
-  dataOptions: {
-    category: [dimProductName],
-    value: [{ column: measureTotalRevenue, sortType: 'sortDesc' }],
-    breakBy: [],
-  },
-  filters: [filterFactory.topRanking(dimProductName, measureTotalRevenue, 10)],
-});
+ * const dimProductName = DM.DimProducts.ProductName;
+ * const measureTotalRevenue = measureFactory.sum(DM.Fact_Sale_orders.OrderRevenue, 'Total Revenue');
+ * const polarChartProps = ref<PolarChartProps>({
+    dataSet: DM.DataSource,
+    dataOptions: {
+      category: [dimProductName],
+      value: [{ column: measureTotalRevenue, sortType: 'sortDesc' }],
+      breakBy: [],
+    },
+    filters: [filterFactory.topRanking(dimProductName, measureTotalRevenue, 10)],
+  });
  * ```
- * <img src="media://polar-chart-example-1.png" width="600px" />
+ * <img src="media://vue-polar-chart-example.png" width="600px" />
  * @param props - Polar chart properties
  * @returns Polar Chart component
+ * @group Charts
  */
 export declare const PolarChart: import("vue").DefineComponent<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").CartesianChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;
@@ -46,7 +51,7 @@ export declare const PolarChart: import("vue").DefineComponent<{
     [key: string]: any;
 }>) | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
     dataOptions: PropType<import("@sisense/sdk-ui-preact").CartesianChartDataOptions>;
-    dataSet: PropType<string | import("@sisense/sdk-data").Data | undefined>;
+    dataSet: PropType<import("@sisense/sdk-data").DataSource | import("@sisense/sdk-data").Data | undefined>;
     filters: PropType<import("@sisense/sdk-data").Filter[] | import("@sisense/sdk-data").FilterRelations | undefined>;
     highlights: PropType<import("@sisense/sdk-data").Filter[] | undefined>;
     onBeforeRender: PropType<import("@sisense/sdk-ui-preact").BeforeRenderHandler | undefined>;