@c8y/ngx-components
Version:
Angular modules for Cumulocity IoT applications
457 lines (439 loc) • 23.6 kB
TypeScript
import * as i0 from '@angular/core';
import { OnInit, ElementRef, EventEmitter, OnChanges, SimpleChanges, PipeTransform } from '@angular/core';
import * as i1 from '@c8y/ngx-components/assets-navigator';
import { MillerViewComponent } from '@c8y/ngx-components/assets-navigator';
import * as i2 from 'ngx-bootstrap/collapse';
import * as i3 from '@c8y/ngx-components';
import { AppStateService, ColorService, ListItemDragHandleComponent, ForOfFilterPipe } from '@c8y/ngx-components';
import * as i4 from 'ngx-bootstrap/dropdown';
import * as i5 from 'ngx-bootstrap/modal';
import { BsModalRef, BsModalService } from 'ngx-bootstrap/modal';
import * as i6 from 'ngx-bootstrap/tooltip';
import * as i7 from 'ngx-bootstrap/popover';
import * as i8 from '@angular/cdk/drag-drop';
import { CdkDragDrop } from '@angular/cdk/drag-drop';
import { ControlValueAccessor, Validator, FormGroup, FormBuilder, AbstractControl, ValidationErrors, FormArray, ValidatorFn } from '@angular/forms';
import { IIdentified, IManagedObject, InventoryService, MeasurementService, IResultList } from '@c8y/client';
import { BehaviorSubject, Observable } from 'rxjs';
import { SupportedIconsSuggestions } from '@c8y/ngx-components/icon-selector/icons';
import { WidgetConfigComponent } from '@c8y/ngx-components/context-dashboard';
declare const AXIS_TYPES: readonly [{
readonly val: any;
readonly text: "Auto";
}, {
readonly val: "left";
readonly text: "Left";
}, {
readonly val: "right";
readonly text: "Right";
}];
type AxisTypes = (typeof AXIS_TYPES)[1 | 2]['val'];
declare const CHART_LINE_TYPES: readonly [{
readonly val: "line";
readonly text: "Line";
}, {
readonly val: "points";
readonly text: "Points";
}, {
readonly val: "linePoints";
readonly text: "Line and points";
}, {
readonly val: "bars";
readonly text: "Bars";
}, {
readonly val: "step-before";
readonly text: "Step before";
}, {
readonly val: "step-after";
readonly text: "Step after";
}];
type ChartLineTypes = (typeof CHART_LINE_TYPES)[number]['val'];
declare const CHART_RENDER_TYPES: readonly [{
readonly val: "min";
readonly text: "Minimum";
}, {
readonly val: "max";
readonly text: "Maximum";
}, {
readonly val: "area";
readonly text: "Minimum and maximum";
}];
type ChartRenderTypes = (typeof CHART_RENDER_TYPES)[number]['val'];
declare const DATAPOINT_LIBRARY_FRAGMENT = "c8y_Kpi";
interface KPIDetails {
fragment: string;
series: string;
orientation?: string | null;
__target?: IIdentified | null;
__active?: boolean | null;
__template?: string | null | number;
unit?: string | null;
min?: number | null;
color?: string | null;
max?: number | null;
label?: string | null;
target?: number | null;
yellowRangeMax?: number | null;
yellowRangeMin?: number | null;
redRangeMin?: number | null;
redRangeMax?: number | null;
description?: string | null;
renderType?: string | null;
lineType?: string | null;
yAxisType?: string | null;
[key: string]: any;
}
interface ManagedObjectKPI extends IManagedObject {
[DATAPOINT_LIBRARY_FRAGMENT]: KPIDetails;
}
interface DatapointAction {
label: string;
callback: (datapoint: KPIDetails) => void;
icon: SupportedIconsSuggestions;
}
interface DatapointAttributesFormConfig {
showTarget: boolean;
showRange: boolean;
showYellowRange: boolean;
showRedRange: boolean;
showChart: boolean;
showFormIfTemplateWasSelected: boolean;
selectableChartRenderTypes: ChartRenderTypes[];
selectableChartLineTypes: ChartLineTypes[];
selectableAxisTypes: AxisTypes[];
}
type DatapointSelectorModalAssetSelectorOptions = Omit<MillerViewComponent, 'multi' | 'singleColumn' | 'onSelected' | 'millerViewWrapper' | 'columns' | 'ngOnInit' | 'ngOnChanges' | 'addNewColumn' | 'onSelectionChange'>;
declare class DatapointLibraryService {
private inventory;
private appState;
private measurements;
private color;
protected cache: Promise<ManagedObjectKPI[]>;
constructor(inventory: InventoryService, appState: AppStateService, measurements: MeasurementService, color: ColorService);
getAllDatapointLibraryEntriesCached(forceCacheRenew?: boolean): Promise<ManagedObjectKPI[]>;
getFirstDatapointLibraryPage(): Promise<IResultList<ManagedObjectKPI>>;
getAllDatapointLibraryItemsCached(): Promise<KPIDetails[]>;
updateDatapoints(datapoints: KPIDetails[], skipUpdatingTarget?: boolean): Promise<KPIDetails[]>;
getDatapointsOfAsset(parentReference: IIdentified, ignoreDatapointTemplates?: boolean, datapointTemplatesOnly?: boolean): Promise<KPIDetails[]>;
/**
* Requests the last measurement with the given fragment and series to extract it's unit.
* If the source attribute is provided, it will check the last measurement for this specific source.
* @returns found unit or an empty string instead
*/
guessUnitOfDatapoint(fragment: string, series: string, source?: IIdentified): Promise<string>;
protected combineFragmentSeriesTuplesWithDetails(tuples: Array<{
fragment: string;
series: string;
}>, target: IIdentified, kpis: ManagedObjectKPI[], datapointTemplatesOnly?: boolean): Promise<KPIDetails[]>;
protected assignColorToDatapoints(datapoints: KPIDetails[]): Promise<void>;
protected getAllDatapointLibraryEntries(): Promise<ManagedObjectKPI[]>;
protected mapDatapointLibraryEntry(entry: ManagedObjectKPI): KPIDetails;
protected getCurrentTemplatesFromDatapoints(datapoints: KPIDetails[]): Promise<IManagedObject[]>;
protected getCurrentVersionOfTargetsFromDatapoints(datapoints: KPIDetails[]): Promise<IManagedObject[]>;
protected getMOsByIds(ids: Array<string | number>): Promise<IManagedObject[]>;
static ɵfac: i0.ɵɵFactoryDeclaration<DatapointLibraryService, never>;
static ɵprov: i0.ɵɵInjectableDeclaration<DatapointLibraryService>;
}
declare class DatapointSelectorComponent implements OnInit, ControlValueAccessor {
private datapointService;
contextAsset: IIdentified;
allowChangingContext: boolean;
allowDatapointsFromMultipleAssets: boolean;
selectedDatapoints: KPIDetails[];
defaultActiveState: boolean;
ignoreDatapointTemplates: boolean;
datapointTemplatesOnly: boolean;
guessDatapointUnit: boolean;
allowSearch: boolean;
hideSelection: boolean;
itemsEditable: boolean;
searchString: string;
maxNumberOfDatapoints: number;
selectorTitle: string;
emptyStateTitle: string;
selectedListTitle: string;
AddButtonTypes: {
readonly none: "none";
readonly addRemove: "add-remove";
readonly select: "select";
};
loadingDatapoints: boolean;
assetSelection: BehaviorSubject<IIdentified>;
datapoints$: Observable<KPIDetails[]>;
filteredDatapoints$: Observable<KPIDetails[]>;
searchStringChanges$: Observable<string>;
datapointLibraryEntries: Observable<IResultList<ManagedObjectKPI>>;
emptyStateSubtitleWhenNoMatchingDataPoints: "Try another search term.";
emptyStateSubtitleWhenNoDataPointsInAsset: "Select an asset with data points from the list.";
private searchString$;
private touched;
private onChange;
private onTouched;
constructor(datapointService: DatapointLibraryService);
ngOnInit(): void;
writeValue(obj: KPIDetails[]): void;
registerOnChange(fn: any): void;
registerOnTouched(fn: any): void;
datapointAdded(dp: KPIDetails): void;
datapointRemoved(dp: KPIDetails): void;
selectionChanged(evt: IIdentified | IIdentified[]): void;
trackByFn(_index: number, item: KPIDetails): string;
searchStringChanged(newValue?: string): void;
private setupObservables;
private selectAsset;
private clearSelection;
private emitCurrentSelection;
private markAsTouched;
private includesSearchString;
static ɵfac: i0.ɵɵFactoryDeclaration<DatapointSelectorComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<DatapointSelectorComponent, "c8y-datapoint-selector", never, { "contextAsset": { "alias": "contextAsset"; "required": false; }; "allowChangingContext": { "alias": "allowChangingContext"; "required": false; }; "allowDatapointsFromMultipleAssets": { "alias": "allowDatapointsFromMultipleAssets"; "required": false; }; "defaultActiveState": { "alias": "defaultActiveState"; "required": false; }; "ignoreDatapointTemplates": { "alias": "ignoreDatapointTemplates"; "required": false; }; "datapointTemplatesOnly": { "alias": "datapointTemplatesOnly"; "required": false; }; "guessDatapointUnit": { "alias": "guessDatapointUnit"; "required": false; }; "allowSearch": { "alias": "allowSearch"; "required": false; }; "hideSelection": { "alias": "hideSelection"; "required": false; }; "itemsEditable": { "alias": "itemsEditable"; "required": false; }; }, {}, never, never, true, never>;
}
declare class DatapointSelectorModalComponent implements OnInit {
private bsModal;
private elementRef;
contextAsset: IIdentified;
allowChangingContext: boolean;
allowSearch: boolean;
allowDatapointsFromMultipleAssets: boolean;
selectedDatapoints: KPIDetails[];
title: string;
saveButtonLabel: string;
guessDatapointUnit: boolean;
defaultActiveState: boolean;
finishWithFirstSelection: boolean;
ignoreDatapointTemplates: boolean;
itemsEditable: boolean;
datapointTemplatesOnly: boolean;
assetSelectorConfig: Partial<DatapointSelectorModalAssetSelectorOptions>;
readonly result: Promise<KPIDetails[]>;
private save;
private cancel;
constructor(bsModal: BsModalRef, elementRef: ElementRef);
ngOnInit(): void;
saveChanges(): void;
close(): void;
selectionChange(selection: Array<KPIDetails>): void;
/**
* changes the z-index of the modal, to make sure this modal is on top.
* required as angularJS modals are placing them selves on top via adjusting z-index.
* while angular modals use the order within the dom for this..
*/
private applyWorkaroundForAngularJSModalsThatMightBeOpenedInParallel;
static ɵfac: i0.ɵɵFactoryDeclaration<DatapointSelectorModalComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<DatapointSelectorModalComponent, "c8y-datapoint-selector-modal", never, {}, {}, never, never, true, never>;
}
declare const AddButtonTypes: {
readonly none: "none";
readonly addRemove: "add-remove";
readonly select: "select";
};
type AddButtonType = (typeof AddButtonTypes)[keyof typeof AddButtonTypes];
declare class DatapointSelectorListItemComponent implements ControlValueAccessor, Validator {
private formBuilder;
formGroup: FormGroup;
defaultFormOptions: Partial<DatapointAttributesFormConfig>;
isSelected: boolean;
isCollapsed: boolean;
addButtonType: AddButtonType;
editable: boolean;
showActiveToggle: boolean;
activeToggleDisabled: boolean;
showOptions: boolean;
datapointLibraryEntries: Observable<IResultList<ManagedObjectKPI>>;
actions: DatapointAction[];
optionToRemove: boolean;
hasUnlinkTemplateOption: boolean;
added: EventEmitter<KPIDetails>;
removed: EventEmitter<KPIDetails>;
colorPickerDisabled: boolean;
disableTypeaheadIfSelected: boolean;
highlightText: string;
dragHandle: ListItemDragHandleComponent;
pattern: string;
filterPipe: ForOfFilterPipe<ManagedObjectKPI>;
isValid$: Observable<boolean>;
errorMessage: string;
AddButtonTypes: {
readonly none: "none";
readonly addRemove: "add-remove";
readonly select: "select";
};
constructor(formBuilder: FormBuilder);
validate(_control: AbstractControl): ValidationErrors;
writeValue(obj: any): void;
registerOnChange(fn: any): void;
registerOnTouched(fn: any): void;
setDisabledState(isDisabled: boolean): void;
collapse(): void;
addOrRemoveItem(): void;
remove(): void;
setPipe(filterStr: string): void;
unlinkDatapointTemplate(): void;
dataPointTemplateSelected(template: ManagedObjectKPI): void;
private resetUnusedProperties;
private filterDatapointLabel;
private transformFormValue;
static ɵfac: i0.ɵɵFactoryDeclaration<DatapointSelectorListItemComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<DatapointSelectorListItemComponent, "c8y-datapoint-selector-list-item", never, { "defaultFormOptions": { "alias": "defaultFormOptions"; "required": false; }; "isSelected": { "alias": "isSelected"; "required": false; }; "isCollapsed": { "alias": "isCollapsed"; "required": false; }; "addButtonType": { "alias": "addButtonType"; "required": false; }; "editable": { "alias": "editable"; "required": false; }; "showActiveToggle": { "alias": "showActiveToggle"; "required": false; }; "activeToggleDisabled": { "alias": "activeToggleDisabled"; "required": false; }; "showOptions": { "alias": "showOptions"; "required": false; }; "datapointLibraryEntries": { "alias": "datapointLibraryEntries"; "required": false; }; "actions": { "alias": "actions"; "required": false; }; "optionToRemove": { "alias": "optionToRemove"; "required": false; }; "hasUnlinkTemplateOption": { "alias": "hasUnlinkTemplateOption"; "required": false; }; "colorPickerDisabled": { "alias": "colorPickerDisabled"; "required": false; }; "disableTypeaheadIfSelected": { "alias": "disableTypeaheadIfSelected"; "required": false; }; "highlightText": { "alias": "highlightText"; "required": false; }; }, { "added": "added"; "removed": "removed"; }, ["dragHandle"], ["c8y-li-drag-handle"], true, never>;
}
type DatapointSelectorModalOptions = Omit<DatapointSelectorModalComponent, 'result' | 'saveChanges' | 'close' | 'selectionChange'>;
declare class DatapointSelectorService {
protected modal: BsModalService;
constructor(modal: BsModalService);
selectDataPoints(initialState?: Partial<DatapointSelectorModalOptions>): Promise<KPIDetails[]>;
static ɵfac: i0.ɵɵFactoryDeclaration<DatapointSelectorService, never>;
static ɵprov: i0.ɵɵInjectableDeclaration<DatapointSelectorService>;
}
declare class DatapointSelectionListComponent implements ControlValueAccessor, Validator, OnInit, OnChanges {
private datapointSelector;
private datapointLibrary;
private formBuilder;
private widgetComponent;
actions: DatapointAction[];
/**
* Enable or disable drag and drop functionality.
*/
allowDragAndDrop: boolean;
config: Partial<DatapointSelectorModalOptions>;
defaultFormOptions: Partial<DatapointAttributesFormConfig>;
/**
* Maximum number of active datapoints allowed in the list.
*/
maxActiveCount: number;
/**
* Minimum number of active datapoints required in the list.
*/
minActiveCount: number;
resolveContext: boolean;
listTitle: string;
formArray: FormArray;
datapointLibraryEntries: Observable<IResultList<ManagedObjectKPI>>;
maxActiveCountReached: boolean;
AddButtonTypes: {
readonly none: "none";
readonly addRemove: "add-remove";
readonly select: "select";
};
isValid: Observable<boolean>;
change: Observable<any[]>;
private usedValidators;
constructor(datapointSelector: DatapointSelectorService, datapointLibrary: DatapointLibraryService, formBuilder: FormBuilder, widgetComponent: WidgetConfigComponent);
ngOnChanges(changes: SimpleChanges): void;
registerOnTouched(fn: any): void;
validate(_control: AbstractControl): ValidationErrors;
ngOnInit(): void;
writeValue(obj: KPIDetails[]): void;
registerOnChange(fn: any): void;
add(): void;
onItemRemoved(index: number): void;
drop(event: CdkDragDrop<KPIDetails[]>): void;
private transformValue;
private calculateMaxActiveCount;
static ɵfac: i0.ɵɵFactoryDeclaration<DatapointSelectionListComponent, [null, null, null, { optional: true; }]>;
static ɵcmp: i0.ɵɵComponentDeclaration<DatapointSelectionListComponent, "c8y-datapoint-selection-list", never, { "actions": { "alias": "actions"; "required": false; }; "allowDragAndDrop": { "alias": "allowDragAndDrop"; "required": false; }; "config": { "alias": "config"; "required": false; }; "defaultFormOptions": { "alias": "defaultFormOptions"; "required": false; }; "maxActiveCount": { "alias": "maxActiveCount"; "required": false; }; "minActiveCount": { "alias": "minActiveCount"; "required": false; }; "resolveContext": { "alias": "resolveContext"; "required": false; }; "listTitle": { "alias": "listTitle"; "required": false; }; }, { "isValid": "isValid"; "change": "change"; }, never, [".alert"], true, never>;
}
declare class DatapointTemplatePopoverComponent {
datapoint: KPIDetails;
attributes: Array<{
label: string;
labelColor?: string;
key: keyof KPIDetails;
}>;
static ɵfac: i0.ɵɵFactoryDeclaration<DatapointTemplatePopoverComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<DatapointTemplatePopoverComponent, "c8y-datapoint-template-popover", never, { "datapoint": { "alias": "datapoint"; "required": false; }; "attributes": { "alias": "attributes"; "required": false; }; }, {}, never, never, true, never>;
}
declare class IncludesDatapointPipe implements PipeTransform {
transform(datapointList: KPIDetails[], datapoint?: KPIDetails): boolean;
static ɵfac: i0.ɵɵFactoryDeclaration<IncludesDatapointPipe, never>;
static ɵpipe: i0.ɵɵPipeDeclaration<IncludesDatapointPipe, "includesDatapoint", true>;
}
declare class DatapointLabelPipe implements PipeTransform {
transform(datapoint: KPIDetails, options?: {
includeDevice: boolean;
doNotUseLabel: boolean;
}): string;
static ɵfac: i0.ɵɵFactoryDeclaration<DatapointLabelPipe, never>;
static ɵpipe: i0.ɵɵPipeDeclaration<DatapointLabelPipe, "datapointLabel", true>;
}
declare class FilterDatapointsPipe implements PipeTransform {
transform(datapoints: KPIDetails[], searchString: string): KPIDetails[];
private includesSearchStringIgnoringCasing;
static ɵfac: i0.ɵɵFactoryDeclaration<FilterDatapointsPipe, never>;
static ɵpipe: i0.ɵɵPipeDeclaration<FilterDatapointsPipe, "filterDatapoints", true>;
}
declare class DatapointAttributesFormValidationService {
private formBuilder;
constructor(formBuilder: FormBuilder);
getDefaultFormGroup(fieldsToRemove?: string[]): FormGroup;
convertToBackendFormat(formDataStructure: any, showChart: boolean): {};
convertToFormGroupFormat(backendDataStructure: any): {};
getColorValidators(): ValidatorFn[];
getLabelValidators(): ValidatorFn[];
getDescriptionValidators(): ValidatorFn[];
getFragmentValidators(): ValidatorFn[];
getSeriesValidators(): ValidatorFn[];
getMinMaxValidators(): ValidatorFn[];
getUnitValidators(): ValidatorFn[];
getTargetValidators(): ValidatorFn[];
getOverallValidators(): ValidatorFn[];
getMinMaxFormGroup(): FormGroup;
getChartFormGroup(): FormGroup;
getDisplayFormGroup(): FormGroup;
getTargetFormGroup(): FormGroup;
private convertStringToNumber;
static ɵfac: i0.ɵɵFactoryDeclaration<DatapointAttributesFormValidationService, never>;
static ɵprov: i0.ɵɵInjectableDeclaration<DatapointAttributesFormValidationService>;
}
declare class DatapointAttributesFormComponent implements ControlValueAccessor, Validator, OnInit {
private formValidations;
selectableChartRenderTypes: ChartRenderTypes[];
selectableChartLineTypes: ChartLineTypes[];
selectableAxisTypes: AxisTypes[];
showTarget: boolean;
showRange: boolean;
showYellowRange: boolean;
showRedRange: boolean;
showChart: boolean;
showFormIfTemplateWasSelected: boolean;
formGroup: FormGroup;
range: FormGroup;
yellowRange: FormGroup;
redRange: FormGroup;
chart: FormGroup;
display: FormGroup;
rawValue: any;
CHART_RENDER_TYPES: Array<(typeof CHART_RENDER_TYPES)[number]>;
CHART_LINE_TYPES: Array<(typeof CHART_LINE_TYPES)[number]>;
AXIS_TYPES: Array<(typeof AXIS_TYPES)[number]>;
customValidationErrorMessages: {
[formField: string]: {
[validationError: string]: string;
};
};
shouldForceInitialValidation: boolean;
showOnlyDisplayForm: boolean;
showChartForm: boolean;
constructor(formValidations: DatapointAttributesFormValidationService);
ngOnInit(): void;
validate(_control: AbstractControl): ValidationErrors;
writeValue(obj: any): void;
registerOnChange(fn: any): void;
registerOnTouched(fn: any): void;
setDisabledState(isDisabled: boolean): void;
private setSubForms;
private initializeFormVisibility;
private filterChartTypes;
private filterRenderTypes;
private filterLineTypes;
private filterAxisTypes;
static ɵfac: i0.ɵɵFactoryDeclaration<DatapointAttributesFormComponent, never>;
static ɵcmp: i0.ɵɵComponentDeclaration<DatapointAttributesFormComponent, "c8y-datapoint-attributes-form", never, { "selectableChartRenderTypes": { "alias": "selectableChartRenderTypes"; "required": false; }; "selectableChartLineTypes": { "alias": "selectableChartLineTypes"; "required": false; }; "selectableAxisTypes": { "alias": "selectableAxisTypes"; "required": false; }; "showTarget": { "alias": "showTarget"; "required": false; }; "showRange": { "alias": "showRange"; "required": false; }; "showYellowRange": { "alias": "showYellowRange"; "required": false; }; "showRedRange": { "alias": "showRedRange"; "required": false; }; "showChart": { "alias": "showChart"; "required": false; }; "showFormIfTemplateWasSelected": { "alias": "showFormIfTemplateWasSelected"; "required": false; }; }, {}, never, never, true, never>;
}
declare class DatapointSelectorModule {
static ɵfac: i0.ɵɵFactoryDeclaration<DatapointSelectorModule, never>;
static ɵmod: i0.ɵɵNgModuleDeclaration<DatapointSelectorModule, never, [typeof i1.AssetSelectorModule, typeof i2.CollapseModule, typeof i3.CoreModule, typeof i4.BsDropdownModule, typeof i5.ModalModule, typeof i6.TooltipModule, typeof i7.PopoverModule, typeof i8.DragDropModule, typeof DatapointSelectorComponent, typeof DatapointSelectorModalComponent, typeof DatapointSelectorListItemComponent, typeof DatapointSelectionListComponent, typeof DatapointTemplatePopoverComponent, typeof IncludesDatapointPipe, typeof DatapointLabelPipe, typeof FilterDatapointsPipe, typeof DatapointAttributesFormComponent], [typeof DatapointSelectorComponent, typeof DatapointSelectorModalComponent, typeof DatapointSelectorListItemComponent, typeof DatapointSelectionListComponent, typeof DatapointTemplatePopoverComponent, typeof IncludesDatapointPipe, typeof DatapointLabelPipe, typeof DatapointAttributesFormComponent]>;
static ɵinj: i0.ɵɵInjectorDeclaration<DatapointSelectorModule>;
}
export { AXIS_TYPES, AddButtonTypes, CHART_LINE_TYPES, CHART_RENDER_TYPES, DATAPOINT_LIBRARY_FRAGMENT, DatapointAttributesFormComponent, DatapointAttributesFormValidationService, DatapointLabelPipe, DatapointLibraryService, DatapointSelectionListComponent, DatapointSelectorComponent, DatapointSelectorListItemComponent, DatapointSelectorModalComponent, DatapointSelectorModule, DatapointSelectorService, DatapointTemplatePopoverComponent, IncludesDatapointPipe };
export type { AddButtonType, AxisTypes, ChartLineTypes, ChartRenderTypes, DatapointAction, DatapointAttributesFormConfig, DatapointSelectorModalAssetSelectorOptions, DatapointSelectorModalOptions, KPIDetails, ManagedObjectKPI };
//# sourceMappingURL=index.d.ts.map