DashboardApi

TypeScript
declare class DashboardApi extends BaseApi
Extends

BaseApi

Methods

MethodDescription
getAvailableRuntimeBarWidgets()Returns list of widgets that are available at runtime
getAvailableRuntimeTabsWidgetIds()
getCustomWidgets()
getDashboardState()
getRuntimeCustomWidgets()Returns a list of custom widget ids
getWidgetDefinition(widgetType)
getWidgetLabel(widgetType)
setCellSummaryAggregationFunctionForWidget(fnName, dashboardWidgetId)
setDashboardBarWidgets(position, widgetsState)
setDashboardDrawerSize(position, size)
setDashboardStyle(position, style)
setDashboardTabs(position, tabItems)
setOpenTabName(position, tabName)

Method Details

getAvailableRuntimeBarWidgets

Returns list of widgets that are available at runtime

TypeScript
getAvailableRuntimeBarWidgets(): ("view" | "ribbon" | "row-count" | "application-name" | "theme" | "alert" | "export" | "styledCell" | "quickSearch" | "calculatedColumn" | "settingsPanel" | "dashboard" | "flashingCell" | "cell-summary")[];
Returns

("view" | "ribbon" | "row-count" | "application-name" | "theme" | "alert" | "export" | "styledCell" | "quickSearch" | "calculatedColumn" | "settingsPanel" | "dashboard" | "flashingCell" | "cell-summary")[]

getAvailableRuntimeTabsWidgetIds

TypeScript
getAvailableRuntimeTabsWidgetIds(): ("view" | "column-chooser" | "theme" | "alert" | "export" | "styledCell" | "quickSearch" | "calculatedColumn" | "settingsPanel" | "dashboard" | "flashingCell" | "cell-summary")[];
Returns

("view" | "column-chooser" | "theme" | "alert" | "export" | "styledCell" | "quickSearch" | "calculatedColumn" | "settingsPanel" | "dashboard" | "flashingCell" | "cell-summary")[]

getCustomWidgets

TypeScript
getCustomWidgets(): DashboardState['customWidgets'];
Returns

DashboardState['customWidgets']

getDashboardState

TypeScript
getDashboardState(): DashboardState;
Returns

DashboardState

getRuntimeCustomWidgets

Returns a list of custom widget ids

TypeScript
getRuntimeCustomWidgets(): string[];
Returns

string[]

getWidgetDefinition

TypeScript
getWidgetDefinition(widgetType: WidgetIdType): {
        readonly label: "Noop";
        readonly component: react.FunctionComponent<WidgetProps<never>>;
        readonly instances: WidgetInstanceType.Multiple;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly label: "Info";
        readonly component: react.FunctionComponent<InfoWidgetProps>;
        readonly instances: WidgetInstanceType.Multiple;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly label: "[Ribbon]";
        readonly component: react.FunctionComponent<TabsWidgetProps>;
        readonly instances: WidgetInstanceType.Multiple;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly label: "Button";
        readonly component: react.FunctionComponent<ButtonWidgetProps>;
        readonly instances: WidgetInstanceType.Multiple;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly label: "Custom Content";
        readonly component: react.FunctionComponent<CustomContentWidgetProps>;
        readonly instances: WidgetInstanceType.Multiple;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly label: "Row Count";
        readonly component: react.FunctionComponent<RowCountWidgetProps>;
        readonly instances: WidgetInstanceType.Multiple;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly label: "Application Name";
        readonly component: react.FunctionComponent<ApplicationNameWidgetProps>;
        readonly instances: WidgetInstanceType.Multiple;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly label: "Custom";
        readonly component: react.FunctionComponent<CustomWidgetProps>;
        readonly instances: WidgetInstanceType.Multiple;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly label: "Column Chooser";
        readonly component: ({ orientation, location }: ColumnChooserWidgetProps) => JSX.Element;
        readonly getDefaultWidgetSize: typeof getWidgetSize;
        readonly instances: WidgetInstanceType.Multiple;
    } | {
        readonly component: react.FunctionComponent<ThemeWidgetProps>;
        readonly label: string;
        readonly instances: WidgetInstanceType.Single;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly component: react.FunctionComponent<ViewWidgetProps>;
        readonly label: string;
        readonly instances: WidgetInstanceType.Single;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly component: react.FunctionComponent<StyledCellsWidgetProps>;
        readonly label: string;
        readonly instances: WidgetInstanceType.Single;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly component: react.FunctionComponent<QuickSearchWidgetProps>;
        readonly label: string;
        readonly instances: WidgetInstanceType.Single;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly component: react.FunctionComponent<CalculatedColumnWidgetProps>;
        readonly label: string;
        readonly instances: WidgetInstanceType.Single;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly component: react.FunctionComponent<SettingsPanelWidgetProps>;
        readonly label: string;
        readonly instances: WidgetInstanceType.Single;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly component: react.FunctionComponent<DashboardWidgetProps>;
        readonly label: "Dashboard";
        readonly instances: WidgetInstanceType.Single;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly component: react.FunctionComponent<FlashingCellsWidgetProps>;
        readonly label: string;
        readonly instances: WidgetInstanceType.Single;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly component: (props: ExportWidgetProps) => JSX.Element;
        readonly label: string;
        readonly instances: WidgetInstanceType.Single;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly component: (props: CellSummaryWidgetProps) => JSX.Element;
        readonly label: string;
        readonly instances: WidgetInstanceType.Multiple;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    } | {
        readonly component: react.FunctionComponent<AlertWidgetProps>;
        readonly label: string;
        readonly instances: WidgetInstanceType.Single;
        readonly getDefaultWidgetSize: (_options: {
            location: WidgetLocation;
            orientation: "horizontal" | "vertical";
        }) => Partial<{
            width: number;
            height: number;
        }>;
    };
Parameters
ParameterType
widgetTypeWidgetIdType
Returns

{ readonly label: "Noop"; readonly component: react.FunctionComponent<WidgetProps<never>>; readonly instances: WidgetInstanceType.Multiple; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly label: "Info"; readonly component: react.FunctionComponent<InfoWidgetProps>; readonly instances: WidgetInstanceType.Multiple; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly label: "[Ribbon]"; readonly component: react.FunctionComponent<TabsWidgetProps>; readonly instances: WidgetInstanceType.Multiple; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly label: "Button"; readonly component: react.FunctionComponent<ButtonWidgetProps>; readonly instances: WidgetInstanceType.Multiple; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly label: "Custom Content"; readonly component: react.FunctionComponent<CustomContentWidgetProps>; readonly instances: WidgetInstanceType.Multiple; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly label: "Row Count"; readonly component: react.FunctionComponent<RowCountWidgetProps>; readonly instances: WidgetInstanceType.Multiple; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly label: "Application Name"; readonly component: react.FunctionComponent<ApplicationNameWidgetProps>; readonly instances: WidgetInstanceType.Multiple; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly label: "Custom"; readonly component: react.FunctionComponent<CustomWidgetProps>; readonly instances: WidgetInstanceType.Multiple; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly label: "Column Chooser"; readonly component: ({ orientation, location }: ColumnChooserWidgetProps) => JSX.Element; readonly getDefaultWidgetSize: typeof getWidgetSize; readonly instances: WidgetInstanceType.Multiple; } | { readonly component: react.FunctionComponent<ThemeWidgetProps>; readonly label: string; readonly instances: WidgetInstanceType.Single; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly component: react.FunctionComponent<ViewWidgetProps>; readonly label: string; readonly instances: WidgetInstanceType.Single; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly component: react.FunctionComponent<StyledCellsWidgetProps>; readonly label: string; readonly instances: WidgetInstanceType.Single; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly component: react.FunctionComponent<QuickSearchWidgetProps>; readonly label: string; readonly instances: WidgetInstanceType.Single; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly component: react.FunctionComponent<CalculatedColumnWidgetProps>; readonly label: string; readonly instances: WidgetInstanceType.Single; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly component: react.FunctionComponent<SettingsPanelWidgetProps>; readonly label: string; readonly instances: WidgetInstanceType.Single; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly component: react.FunctionComponent<DashboardWidgetProps>; readonly label: "Dashboard"; readonly instances: WidgetInstanceType.Single; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly component: react.FunctionComponent<FlashingCellsWidgetProps>; readonly label: string; readonly instances: WidgetInstanceType.Single; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly component: (props: ExportWidgetProps) => JSX.Element; readonly label: string; readonly instances: WidgetInstanceType.Single; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly component: (props: CellSummaryWidgetProps) => JSX.Element; readonly label: string; readonly instances: WidgetInstanceType.Multiple; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; } | { readonly component: react.FunctionComponent<AlertWidgetProps>; readonly label: string; readonly instances: WidgetInstanceType.Single; readonly getDefaultWidgetSize: (_options: { location: WidgetLocation; orientation: "horizontal" | "vertical"; }) => Partial<{ width: number; height: number; }>; }

getWidgetLabel

TypeScript
getWidgetLabel(widgetType: WidgetIdType): string;
Parameters
ParameterType
widgetTypeWidgetIdType
Returns

string

setCellSummaryAggregationFunctionForWidget

TypeScript
setCellSummaryAggregationFunctionForWidget(fnName: AggregationFunctionType, dashboardWidgetId: string): void;
Parameters
ParameterType
fnNameAggregationFunctionType
dashboardWidgetIdstring
Returns

void

setDashboardBarWidgets

TypeScript
setDashboardBarWidgets(position: DashboardPosition, widgetsState: WidgetState[]): void;
Parameters
ParameterType
positionDashboardPosition
widgetsStateWidgetState[]
Returns

void

setDashboardDrawerSize

TypeScript
setDashboardDrawerSize(position: DashboardPosition, size: number): void;
Parameters
ParameterType
positionDashboardPosition
sizenumber
Returns

void

setDashboardStyle

TypeScript
setDashboardStyle(position: DashboardPosition, style: DashboardSection['style']): void;
Parameters
ParameterType
positionDashboardPosition
styleDashboardSection['style']
Returns

void

setDashboardTabs

TypeScript
setDashboardTabs(position: DashboardPosition, tabItems: DashboardRibbonDefinition['tabs']): void;
Parameters
ParameterType
positionDashboardPosition
tabItemsDashboardRibbonDefinition['tabs']
Returns

void

setOpenTabName

TypeScript
setOpenTabName(position: DashboardPosition, tabName: string | null): void;
Parameters

| Parameter | Type | | --------- | ------------------- | ----- | | position | DashboardPosition | | tabName | string | null |

Returns

void