@redsift/dashboard 6.1.0 → 6.3.0

package/index.d.ts

@@ -1,9 +1,16 @@
+import * as crossfilter2 from 'crossfilter2';
 import { Crossfilter, Group as Group$1, NaturallyOrderedValue, Dimension as Dimension$1, ComparableObject, OrderedValueSelector } from 'crossfilter2';
-import React, { Ref, ReactElement, Dispatch, ComponentProps } from 'react';
-import { GridFilterItem, DataGridProps as DataGridProps$1 } from '@redsift/table';
 import { PieChartLabelVariant, PieChartSize, PieChartTheme, PieChartVariant } from '@redsift/charts';
-export { PieChartLabelVariant, PieChartSize, PieChartTheme, PieChartVariant } from '@redsift/charts';
+export { ColorTheme, PieChartLabelVariant, PieChartSize, PieChartTheme, PieChartVariant } from '@redsift/charts';
+import React, { Ref, ReactElement, ComponentProps, Dispatch } from 'react';
+import { GridFilterItem, DataGridProps as DataGridProps$1 } from '@redsift/table';
 
+declare type SuccessDangerColorTheme = {
+    success: string;
+    warning: string;
+    danger: string;
+    neutral?: string;
+};
 declare type JSONValue = string | number | boolean | {
     [x: string]: JSONValue;
 } | Array<JSONValue> | undefined | null;
@@ -25,6 +32,11 @@ declare type ChartDimensions = {
     marginLeft?: number;
 };
 
+declare const COUNT: (d: Dimension) => crossfilter2.Group<any, crossfilter2.NaturallyOrderedValue, unknown>;
+
+declare const groupReduceSum: (field: string) => (d: Dimension) => crossfilter2.Group<any, crossfilter2.NaturallyOrderedValue, unknown>;
+declare const SUM: (field: string) => (d: Dimension) => crossfilter2.Group<any, crossfilter2.NaturallyOrderedValue, unknown>;
+
 /** Component Type. */
 declare type Comp<P, T = HTMLElement> = {
     (props: P & {
@@ -42,6 +54,22 @@ declare type Comp<P, T = HTMLElement> = {
 /** Get types of the values of a record. */
 declare type ValueOf<T extends Record<any, any>> = T[keyof T];
 
+/**
+ * Component props.
+ */
+interface ChartEmptyStateProps extends ComponentProps<'div'> {
+    /** Method to call when the reset button is pressed. Also conditioned whether the button is displayed or not. */
+    onReset?: () => void;
+    /** Reset button label. */
+    resetLabel?: string;
+    /** Subtitle. */
+    subtitle?: string;
+    /** Title. */
+    title?: string;
+}
+
+declare const ChartEmptyState: Comp<ChartEmptyStateProps, HTMLDivElement>;
+
 /**
  * Context props.
  */
@@ -58,12 +86,14 @@ declare type DashboardReducerState = {
     tableFilters: GridFilterItem[];
 };
 declare enum DashboardReducerActionType {
+    ResetFilter = "reset-filter",
+    ResetFilters = "reset-filters",
     FilterTable = "filter-table",
     FilterTableBatch = "filter-table-batch"
 }
 declare type DashboardReducerAction = {
     type: DashboardReducerActionType;
-    filter: GridFilterItem | GridFilterItem[];
+    filter?: GridFilterItem | GridFilterItem[];
 };
 /**
  * Component props.
@@ -103,12 +133,18 @@ declare type HorizontalBarChartSize = ValueOf<typeof HorizontalBarChartSize>;
  */
 declare const HorizontalBarChartTheme: {
     readonly default: "default";
+    /**
+     * Component theme.
+     */
     readonly dark: "dark";
     readonly darker: "darker";
     readonly monochrome: "monochrome";
 };
 declare type HorizontalBarChartTheme = ValueOf<typeof HorizontalBarChartTheme>;
 interface LocaleText$2 {
+    emptyChartTitle?: string;
+    emptyChartSubtitle?: string;
+    emptyChartResetLabel?: string;
     resetLabel?: string;
 }
 /**
@@ -121,30 +157,35 @@ interface HorizontalBarChartProps extends ComponentProps<'div'> {
     caption?: string;
     /** Whether the x axis labels are rotated or not. */
     areXLabelsRotated?: boolean;
-    /** Field value of the DataGrid column to filter. */
-    columnToFilter?: string;
     /** Dataset to use to generate the chart, if no context is provided. */
     data?: JSONArray;
+    /** Which datagrid column the chart is filtering and using which operation. */
+    datagridFilter?: {
+        field: string;
+        operator: 'containsAnyOf' | 'endsWithAnyOf' | 'isAnyOf';
+    };
     /** Method that will be used by crossfilter to compute the dimensions of the charts. */
     dimension: DimensionSelector;
     /** Reset function that is triggered when reset button is pressed in the empty state chart. */
     emptyChartResetFn?: () => void;
     /** Method that will be used by crossfilter to compute the groups of the charts. */
-    group: GroupSelector;
+    group: (d: Dimension) => Group;
+    /** Whether the dimension field is an array or not. */
+    isDimensionArray?: boolean;
     /** Whether the reset button is hidden or not. */
     isResetable?: boolean;
     /** Overriden values for internal labels and texts. */
     localeText?: LocaleText$2;
+    /** Method to call when a filter occured on the chart. */
+    onFilter?: (filters?: string[]) => void;
     /** Whether a category should be displayed for categories that has been removed by the caping option. Optionaly, this prop can be used to change the label of this category. */
     others?: boolean | string;
+    /** Method to override the data labels. */
+    setLabels?: (key: string) => string | undefined;
     /** HorizontalBarChart size. */
     size?: HorizontalBarChartSize;
     /** Color palette to use. You can choose among the list of available color palette or also choose to use the success/warning/danger theme for which you have to specify which key corresponds to which status.  */
-    theme?: HorizontalBarChartTheme | {
-        success: string;
-        warning: string;
-        danger: string;
-    };
+    theme?: HorizontalBarChartTheme | SuccessDangerColorTheme;
     /** Title. */
     title?: string;
 }
@@ -166,34 +207,41 @@ interface PieChartProps extends ComponentProps<'div'> {
     caping?: number;
     /** Caption. */
     caption?: string;
-    /** Field value of the DataGrid column to filter. */
-    columnToFilter?: string;
     /** Dataset to use to generate the chart, if no context is provided. */
     data?: JSONArray;
+    /** Which datagrid column the chart is filtering and using which operation. */
+    datagridFilter?: {
+        field: string;
+        operator: 'containsAnyOf' | 'endsWithAnyOf' | 'isAnyOf';
+    };
     /** Method that will be used by crossfilter to compute the dimensions of the charts. */
     dimension: DimensionSelector;
     /** Method that will be used by crossfilter to compute the groups of the charts. */
-    group: GroupSelector;
+    group: (d: Dimension) => Group;
+    /** Whether the dimension field is an array or not. */
+    isDimensionArray?: boolean;
     /** Whether the reset button is hidden or not. */
     isResetable?: boolean;
     /** Define whether the labels should be displayed inside or outside the charts and if they should contain raw or percentage values. */
     labelVariant?: PieChartLabelVariant;
     /** Overriden values for internal labels and texts. */
     localeText?: LocaleText$1;
+    /** Method to call when a filter occured on the chart. */
+    onFilter?: (filters?: string[]) => void;
     /** Whether a category should be displayed for categories that has been removed by the caping option. Optionaly, this prop can be used to change the label of this category. */
     others?: boolean | string;
+    /** Method to override the data labels. */
+    setLabels?: (key: string) => string | undefined;
     /** PieChart size. */
     size?: PieChartSize;
-    /** Secondary text to be displayed in the middle of the chart, above the main text. Only for donut variant. */
-    subtext?: string;
     /** Main text to be displayed in the middle of the chart. Only for donut variant. */
     text?: string;
+    /** Secondary text to be displayed in the middle of the chart, between the main text and subtext. Recommended to be used with donut variants only. */
+    middleText?: string;
+    /** Secondary text to be displayed in the middle of the chart, above the main text. Only for donut variant. */
+    subtext?: string;
     /** Color palette to use. You can choose among the list of available color palette or also choose to use the success/warning/danger theme for which you have to specify which key corresponds to which status.  */
-    theme?: PieChartTheme | {
-        success: string;
-        warning: string;
-        danger: string;
-    };
+    theme?: PieChartTheme | SuccessDangerColorTheme;
     /** Title. */
     title?: string;
     /** PieChart variant. */
@@ -219,6 +267,9 @@ declare type TimeSeriesBarChartSize = ValueOf<typeof TimeSeriesBarChartSize>;
  * Component theme.
  */
 declare const TimeSeriesBarChartTheme: {
+    /**
+     * Component theme.
+     */
     readonly default: "default";
     readonly dark: "dark";
     readonly darker: "darker";
@@ -227,6 +278,9 @@ declare const TimeSeriesBarChartTheme: {
 declare type TimeSeriesBarChartTheme = ValueOf<typeof TimeSeriesBarChartTheme>;
 declare type datetimeEnum = 'hour' | 'day' | 'week' | 'month' | 'year';
 interface LocaleText {
+    emptyChartTitle?: string;
+    emptyChartSubtitle?: string;
+    emptyChartResetLabel?: string;
     resetLabel?: string;
 }
 /**
@@ -253,18 +307,18 @@ interface TimeSeriesBarChartProps extends ComponentProps<'div'> {
     isResetable?: boolean;
     /** Overriden values for internal labels and texts. */
     localeText?: LocaleText;
+    /** Method to call when a filter occured on the chart. */
+    onFilter?: (filters?: string[], allFiltered?: JSONArray) => void;
     /** TimeSeriesChart size. */
     size?: TimeSeriesBarChartSize;
     /** Color palette to use. You can choose among the list of available color palette or also choose to use the success/warning/danger theme for which you have to specify which key corresponds to which status.  */
-    theme?: TimeSeriesBarChartTheme | {
-        success: string;
-        warning: string;
-        danger: string;
-    };
+    theme?: TimeSeriesBarChartTheme | SuccessDangerColorTheme;
     /** Title. */
     title?: string;
     /** Dataset key to use to stack values. */
     stackedCategory?: string;
+    /** X Axis Label. */
+    xAxisLabel?: string;
     /** Y Axis Label. */
     yAxisLabel?: string;
 }
@@ -272,4 +326,4 @@ declare type StyledTimeSeriesBarChartProps = Omit<TimeSeriesBarChartProps, 'dime
 
 declare const TimeSeriesBarChart: Comp<TimeSeriesBarChartProps, HTMLDivElement>;
 
-export { ChartDimensions, Dashboard, DashboardContext, DashboardContextProps, DashboardProps, DashboardReducer, DashboardReducerAction, DashboardReducerActionType, DashboardReducerState, DataGrid, DataGridProps, Dimension, DimensionSelector, Group, GroupSelector, HorizontalBarChart, HorizontalBarChartProps, HorizontalBarChartSize, HorizontalBarChartTheme, JSONArray, JSONObject, JSONValue, PieChart, PieChartProps, StyledHorizontalBarChartProps, StyledPieChartProps, StyledTimeSeriesBarChartProps, TNdx, TimeSeriesBarChart, TimeSeriesBarChartProps, TimeSeriesBarChartSize, TimeSeriesBarChartTheme, datetimeEnum, initialState };
+export { COUNT, ChartDimensions, ChartEmptyState, ChartEmptyStateProps, Dashboard, DashboardContext, DashboardContextProps, DashboardProps, DashboardReducer, DashboardReducerAction, DashboardReducerActionType, DashboardReducerState, DataGrid, DataGridProps, Dimension, DimensionSelector, Group, GroupSelector, HorizontalBarChart, HorizontalBarChartProps, HorizontalBarChartSize, HorizontalBarChartTheme, JSONArray, JSONObject, JSONValue, PieChart, PieChartProps, SUM, StyledHorizontalBarChartProps, StyledPieChartProps, StyledTimeSeriesBarChartProps, SuccessDangerColorTheme, TNdx, TimeSeriesBarChart, TimeSeriesBarChartProps, TimeSeriesBarChartSize, TimeSeriesBarChartTheme, datetimeEnum, groupReduceSum, initialState };