@c8y/ngx-components
Version:
Angular modules for Cumulocity IoT applications
328 lines • 12.3 kB
TypeScript
import { InjectionToken } from '@angular/core';
import { IManagedObject } from '@c8y/client';
import { Widget, DynamicComponentDefinition, Route, ViewContext, WidgetDisplaySettings, TabWithTemplate, WidgetSettings } from '@c8y/ngx-components';
import { Observable } from 'rxjs/internal/Observable';
import { SupportedIconsSuggestions } from '@c8y/ngx-components/icon-selector/icons';
export declare const CONTEXT_DASHBOARD_CONFIG: InjectionToken<any>;
export declare const DASHBOARD_SETTINGS_CHANGES: {
readonly classes: "theme";
readonly globalRolesIds: "global roles";
readonly widgetClasses: "widget header style";
readonly widgetMargin: "widget margin";
readonly icon: "icon";
readonly name: "name";
readonly priority: "priority";
readonly c8y_IsNavigatorNode: "navigator item";
readonly translateWidgetTitle: "translate widget title";
readonly children: "widgets";
};
export interface ContextDashboardConfig {
widgetFilter?: (component: DynamicComponentDefinition) => boolean;
allowFullscreen?: boolean;
/**
* @deprecated
*/
routes?: Route[];
}
export interface ContextWidgetConfig {
/**
* Settings that define how the default config component is
* displayed. They are static and will not be saved.
*/
settings?: WidgetSettings;
/**
* Settings that are injected in any displaying component.
*/
displaySettings?: WidgetDisplaySettings;
/**
* Whatever should be added to the configuration when a widget is created.
*/
config?: {
/**
* Any other information that should be stored here.
*/
[key: string]: any;
};
/**
* The selected device or group (note: naming is inconsistent as group was added later
* but must stay for already implemented widgets)
*/
device?: {
id?: string | number;
name?: string;
[key: string]: any;
};
/**
* Method to export the widget configuration during dashboard export to a json file. It enhances the configuration with
* additional data that can be used later by the `import` method to restore the widget configuration in a new context.
* @param config Widget configuration
* @return Enhanced widget configuration
*/
export?: (config: any) => any | Promise<any>;
/**
* Method to import the widget configuration during dashboard import from a json file. It restores the widget configuration
* with data exported by the `export` method.
* @param config Widget configuration enhanced with export method
* @param dashboardData Dashboard metadata
* @return Restored widget configuration
*/
import?: (config: any, dashboardData: DashboardMetadata) => any | Promise<any>;
/**
* Hides the asset-selector tab in the widget configuration.
* This is useful for device-type dashboards where the user should not be able to select a device.
*/
hideTarget?: boolean;
/**
* Any other information that should be stored here.
*/
[key: string]: any;
}
export interface ContextDashboardManagedObject extends IManagedObject {
c8y_Dashboard?: ContextDashboard;
name?: string;
c8y_DashboardHistory?: ContextDashboard[];
}
export interface ContextDashboard {
icon?: SupportedIconsSuggestions | null;
name?: string | null;
priority?: number | null;
deviceType?: boolean | null;
deviceTypeValue?: string | null;
isFrozen?: boolean | null;
classes?: {
[key: string]: boolean;
} | null;
widgetClasses?: {
[key: string]: boolean;
} | null;
widgetMargin?: number | null;
translateWidgetTitle?: boolean | null;
global?: boolean | null;
/**
* The amount of columns on that dashboard.
* Can be freely chosen, but product uses either 12 or 24.
*/
columns?: number | null;
children?: {
[id: string]: Widget;
};
globalRolesIds?: DashboardGlobalRoles | null;
c8y_IsNavigatorNode?: object | null;
description?: string | null;
historyDescription?: DashboardHistoryDescription | null;
created?: string | null;
author?: string | null;
}
/**
* Object describing changes applied to dashboard settings and its widgets. Used to display user-friendly change log.
*/
export interface DashboardHistoryDescription {
/**
* Indicates type of dashboard change (or creation).
*/
changeType?: 'reset' | 'create' | 'update' | null;
/**
* List of dashboard settings that has been changed.
*/
dashboardSettingChanges?: (typeof DASHBOARD_SETTINGS_CHANGES)[keyof typeof DASHBOARD_SETTINGS_CHANGES][];
/**
* True if dashboard is typed dashboard, false if it's not.
*/
deviceType?: boolean | null;
/**
* Object containing lists of widgets (by title) that has been changed, grouped by change type, e.g.:
* ```ts
* widgetChanges: {
* removed: ['Applications'],
* config?: ['Data points graph', 'Events list'],
* },
* ```
*/
widgetChanges?: {
removed?: string[];
added?: string[];
config?: string[];
arrangement?: string[];
} | null;
/**
* String used to display the date from which the state was restored.
*/
restored?: string;
}
export declare const DASHBOARD_CHILDREN_STATE_NAME: {
readonly initial: "Initial state";
readonly config: "Widget configuration changed";
readonly removed: "Widget removed";
readonly added: "Widget added";
readonly arrangement: "Widgets rearranged";
};
/**
* Object representing state of dashboard widgets. Its main purpose is to allow to undo and redo changes
* applied to dashboard children.
*/
export type DashboardChildrenState = {
/**
* Name of the change applied to dashboard that results in current state, e.g. 'widget removed'
*/
name: (typeof DASHBOARD_CHILDREN_STATE_NAME)[keyof typeof DASHBOARD_CHILDREN_STATE_NAME];
/**
* Dashboard children in particular, immutable state.
*/
children: ContextDashboard['children'];
/**
* Object describing changes applied to dashboard widgets that can be easily mapped to DashboardHistoryDescription widgetChanges.
* ```ts
* {
* removed: {
* 0969692617637703: { componentId: "Data points graph", config: {...}, classes: {...} ...}
* },
* config: {
* 6347567345767653: { componentId: "Applications", config: {...}, classes: {...} ...},
* 6456345634564566: { componentId: "Events list", config: {...}, classes: {...} ...},
* }
* }
* ```
*/
changeHistory: Partial<Record<keyof DashboardHistoryDescription['widgetChanges'], {
[id: string]: Widget;
}>>;
};
export declare enum ContextDashboardType {
Device = "device",
Type = "type",
Group = "group",
Named = "name",
Report = "report"
}
export declare enum DashboardDetailsTabId {
GENERAL = "general",
APPEARANCE = "appearance",
VERSIONHISTORY = "versionHistory"
}
export type DashboardDetailsTabs = Record<DashboardDetailsTabId, TabWithTemplate<string> & {
featureId: DashboardDetailsTabId;
}>;
export interface DashboardAndWidgetThemeDefinition {
label: string;
class: string;
description: string;
}
export declare const WIDGET_HEADER_CLASSES: [{
readonly label: "Regular`style`";
readonly class: "panel-title-regular";
readonly description: "The widget has no border between header and content.";
}, {
readonly label: "Border`style`";
readonly class: "panel-title-border";
readonly description: "The widget has a small separation border between header and content.";
}, {
readonly label: "Overlay`style`";
readonly class: "panel-title-overlay";
readonly description: "The widget content overlays the header.";
}, {
readonly label: "Hidden`style`";
readonly class: "panel-title-hidden";
readonly description: "The widget header is not shown.";
}];
export declare const WIDGET_CONTENT_CLASSES: [{
readonly label: "Branded`style`";
readonly class: "panel-content-branded";
readonly description: "The widget is styled with the main brand color.";
}, {
readonly label: "Match dashboard`style`";
readonly class: "panel-content-light";
readonly description: "The widget appearance matches the dashboard appearance.";
}, {
readonly label: "Light`style`";
readonly class: "panel-content-white";
readonly description: "The widget has light appearance, that is, dark text on light background.";
}, {
readonly label: "Dark`style`";
readonly class: "panel-content-dark";
readonly description: "The widget has dark appearance, that is, light text on dark background.";
}, {
readonly label: "Transparent`style`";
readonly class: "panel-content-transparent";
readonly description: "The widget has no background.";
}];
export declare const DASHBOARD_THEME_CLASSES: [{
readonly label: "Match UI`theme`";
readonly class: "dashboard-theme-light";
readonly description: "The dashboard appearance matches the UI appearance.";
}, {
readonly label: "Light`theme`";
readonly class: "dashboard-theme-white";
readonly description: "The dashboard has light appearance, that is, dark text on light background.";
}, {
readonly label: "Dark`theme`";
readonly class: "dashboard-theme-dark";
readonly description: "The dashboard has dark appearance, that is, light text on dark background.";
}, {
readonly label: "Branded`theme`";
readonly class: "dashboard-theme-branded";
readonly description: "The dashboard is styled using the brand palette.";
}];
export declare const STYLING_CLASS_PREFIXES: readonly ["dashboard-theme-", "panel-title-", "panel-content-"];
export interface DashboardCopyClipboard {
dashboardId: string;
dashboard: ContextDashboard;
context: DashboardContext;
}
export interface DashboardContext {
context: ViewContext;
contextData: Partial<IManagedObject>;
}
export declare const ALL_GLOBAL_ROLES_SELECTED: "all";
export type DashboardGlobalRoles = number[] | typeof ALL_GLOBAL_ROLES_SELECTED;
export declare const PRODUCT_EXPERIENCE: {
readonly DASHBOARD: {
readonly EVENTS: {
readonly DASHBOARDS: "dashboards";
readonly REPORTS: "reports";
readonly DASHBOARD_TEMPLATE: "dashboardTemplate";
};
readonly COMPONENTS: {
readonly DASHBOARD_VIEW: "context-dashboard";
readonly DASHBOARD_AVAILABILITY: "dashboard-availability";
readonly REPORTS_LIST: "report-dashboard-list";
readonly ADD_REPORT: "report-dashboard-list";
readonly ADD_DASHBOARD: "add-dashboard";
readonly DELETE_DASHBOARD: "context-dashboard";
readonly TYPED_DASHBOARD_SETTINGS: "typed-dashboard-settings";
};
readonly CONTEXT: {
readonly REPORT: "report";
readonly DEVICE: "device";
readonly ASSET: "asset";
readonly GROUP: "group";
};
readonly ACTIONS: {
readonly APPLY_GLOBAL_ROLES_CHANGES: "applyGlobalRolesChanges";
readonly DELETE: "delete";
readonly LOAD: "load";
readonly CREATE: "create";
readonly ADD_REPORT: "addReport";
readonly DUPLICATE_AS_REGULAR_DASHBOARD: "duplicateAsRegularDashboard";
};
};
};
export interface CanDeactivateComponent {
canDeactivate: () => boolean | Observable<boolean> | Promise<boolean>;
}
export declare const REPORT_DEFAULT_NAVIGATION_NODE_PRIORITY = 30;
export type AllowTypeDashboard = 'allow' | 'disallow' | 'allow_if_type_filled';
export declare const DASHBOARD_DETAILS_OUTLET: "dashboard-details";
export declare const DASHBOARD_DETAILS_TABS_OUTLET_NAME: "dashboardTabs";
export interface DashboardMetadata {
isReport: boolean;
isNamedDashboard: boolean;
hideAvailability: boolean;
dashboard: ContextDashboard;
deviceTypeValue: string;
displayDeviceTypeValue: string;
mo: ContextDashboardManagedObject;
allowTypeDashboard: AllowTypeDashboard;
isDevice: boolean;
context: any;
}
//# sourceMappingURL=context-dashboard.model.d.ts.map