@c8y/ngx-components
Version:
Angular modules for Cumulocity IoT applications
198 lines (192 loc) • 9.01 kB
JavaScript
import { PreviewService, DynamicManagedObjectResolver, WIDGET_CONFIGURATION_GRID_SIZE, hookWidget, hookPreview } from '@c8y/ngx-components';
import { quoteAndEscape, hookWidgetConfig } from '@c8y/ngx-components/context-dashboard';
import * as i0 from '@angular/core';
import { inject, Injectable } from '@angular/core';
import { gettext } from '@c8y/ngx-components/gettext';
import { map } from 'rxjs';
import { defaultWidgetIds } from '@c8y/ngx-components/widgets/definitions';
import { PRESET_NAME } from '@c8y/ngx-components/global-context';
import { importConfigWithDevice, exportConfigWithDevice } from '@c8y/ngx-components/widgets/import-export-config';
class HtmlWidgetConfigFactory {
constructor() {
this.betaPreviewService = inject(PreviewService);
this.baseWidgetConfigDefinition = [
{
widgetId: defaultWidgetIds.HTML,
providers: () => import('@c8y/ngx-components/widgets/implementations/html-widget').then(m => [
m.HtmlWidgetConfigService
]),
label: gettext('Asset selection'),
loadComponent: () => import('@c8y/ngx-components/context-dashboard').then(m => m.WidgetAssetSelectorComponent),
priority: 100,
initialState: {
isRequired: false,
groupsSelectable: true
}
},
{
widgetId: defaultWidgetIds.HTML,
label: gettext('Asset properties'),
loadComponent: () => import('@c8y/ngx-components/context-dashboard').then(m => m.AssetPropertyMappingsComponent),
priority: 70,
initialState: {
widgetConfigPath: ['properties'],
initialMappings: {
lastUpdated: {
label: 'Last updated',
assetProperty: {
c8y_JsonSchema: {
properties: {
lastUpdated: {
type: 'string',
label: 'Last updated'
}
}
},
name: 'lastUpdated',
label: 'Last updated',
type: 'string',
isEditable: false,
isStandardProperty: true,
active: true
}
},
lastDeviceMessage: {
label: 'Last device message',
assetProperty: {
c8y_JsonSchema: {
properties: {
lastDeviceMessage: {
label: 'Last device message',
type: 'string'
}
}
},
name: 'lastDeviceMessage',
label: 'Last device message',
printFormat: 'datetime',
type: 'string',
computed: true,
isEditable: false,
isStandardProperty: true,
active: true
}
}
},
allowAddingNewMappings: true,
allowRenamingMappings: true,
allowRelabellingMappings: false,
allowEditingMappings: true,
allowRemovingMappings: true,
showLabels: false,
showNames: true,
showAssets: true,
showValues: true,
onBeforeCopyMappingToClipboard: (mapping) => {
const nonAlphanumericRegex = /[^a-zA-Z0-9]/;
const name = String(mapping.name);
const nameQuotedEscaped = quoteAndEscape(name);
const key = nonAlphanumericRegex.test(name) ? `[${nameQuotedEscaped}]` : name;
return '${this.c8yProperties?.' + key + '}';
}
}
},
{
widgetId: defaultWidgetIds.HTML,
priority: 40,
label: gettext('Time context'),
initialState: {
controls: PRESET_NAME.AUTO_REFRESH_ONLY_CONFIG
},
loadComponent: () => import('@c8y/ngx-components/context-dashboard').then(m => m.GlobalContextSectionComponent)
},
{
widgetId: defaultWidgetIds.HTML,
providers: () => import('@c8y/ngx-components/widgets/implementations/html-widget').then(m => [
m.HtmlWidgetConfigService
]),
label: gettext('Settings'),
loadComponent: () => import('@c8y/ngx-components/widgets/implementations/html-widget').then(m => m.HtmlWidgetConfigComponent),
priority: 0,
expanded: true
}
];
}
get() {
return this.betaPreviewService.getState$('ui.html-widget.v2').pipe(map(state => {
if (state) {
return this.baseWidgetConfigDefinition;
}
return [];
}));
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: HtmlWidgetConfigFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: HtmlWidgetConfigFactory, providedIn: 'root' }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: HtmlWidgetConfigFactory, decorators: [{
type: Injectable,
args: [{
providedIn: 'root'
}]
}] });
class HtmlWidgetFactory {
constructor() {
this.betaPreviewService = inject(PreviewService);
this.baseWidgetDefinition = {
id: defaultWidgetIds.HTML,
label: gettext('HTML'),
description: gettext(`Display custom HTML code.`),
loadComponent: () => import('@c8y/ngx-components/widgets/implementations/html-widget').then(m => m.HtmlWidgetComponent),
previewImage: 'c8y-style-assets/html-widget-pr.png',
data: {
schema: () => import('c8y-schema-loader?interfaceName=HtmlWidgetConfig&type=widget-config!@c8y/ngx-components/widgets/implementations/html-widget'),
export: exportConfigWithDevice,
import: importConfigWithDevice,
settings: {
noNewWidgets: false,
configurationViewGridSize: WIDGET_CONFIGURATION_GRID_SIZE.HALF,
widgetDefaults: {
_width: 8,
_height: 4
}
}
},
resolve: {
device: DynamicManagedObjectResolver
}
};
}
get() {
return this.betaPreviewService.getState$('ui.html-widget.v2').pipe(map(state => {
if (state) {
return [this.baseWidgetDefinition];
}
return [];
}));
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: HtmlWidgetFactory, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: HtmlWidgetFactory, providedIn: 'root' }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.19", ngImport: i0, type: HtmlWidgetFactory, decorators: [{
type: Injectable,
args: [{
providedIn: 'root'
}]
}] });
const htmlWidgetProviders = [
hookWidget(HtmlWidgetFactory),
hookWidgetConfig(HtmlWidgetConfigFactory),
hookPreview({
key: 'ui.html-widget.v2',
label: 'Improved HTML widget',
description: () => import('@c8y/style/markdown-files/html-widget-preview.md').then(m => m.default),
settings: {
reload: true
}
})
];
/**
* Generated bundle index. Do not edit.
*/
export { htmlWidgetProviders };
//# sourceMappingURL=c8y-ngx-components-widgets-definitions-html-widget.mjs.map