npm - @c8y/ngx-components - Versions diffs - 1023.30.0 → 1023.42.1 - Mend

@c8y/ngx-components 1023.30.0 → 1023.42.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (125) hide show

package/fesm2022/c8y-ngx-components-widgets-implementations-datapoints-table.mjs CHANGED Viewed

@@ -919,7 +919,7 @@ class DatapointsTableComponent {
         }));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DatapointsTableComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: DatapointsTableComponent, isStandalone: true, selector: "c8y-datapoints-table", inputs: { aggregationType: "aggregationType", datapointsTableItems: "datapointsTableItems", devicesColumnHeaders: "devicesColumnHeaders", decimalPlaces: "decimalPlaces", hasMultipleDatapoints: "hasMultipleDatapoints", isLoading: "isLoading", seriesWithoutPermissionToReadCount: "seriesWithoutPermissionToReadCount" }, outputs: { isScrolling: "isScrolling" }, host: { classAttribute: "d-col flex-grow" }, usesOnChanges: true, ngImport: i0, template: "@if (!hasNoPermissionsToReadAnyMeasurement) {\n  <div class=\"c8y-cq-440\">\n    <div\n      class=\"hidden-xs c8y-list__item c8y-list--timeline hidden-cq\"\n      [ngClass]=\"{ 'separator-top-bottom': devicesColumnHeaders.length > 0 }\"\n    >\n      <div class=\"d-flex container-fluid\">\n        <div class=\"c8y-list--timeline__item__date\"></div>\n        <div class=\"c8y-list__item__block flex-grow min-width-0\">\n          <div class=\"c8y-list__item__body\">\n            <div class=\"d-flex row\">\n              @if (hasMultipleDatapoints) {\n                <div\n                  class=\"min-width-0\"\n                  [title]=\"'Device' | translate\"\n                  [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                >\n                  <span class=\"text-medium text-truncate\">\n                    {{ 'Device' | translate }}\n                  </span>\n                </div>\n              }\n              <!-- Data points column headers -->\n              @for (header of devicesColumnHeaders; track header) {\n                <div\n                  class=\"min-width-0\"\n                  title=\"{{ header | columnTitle }}\"\n                  [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                >\n                  <span class=\"text-medium text-truncate\">\n                    {{ header.label }} {{ header.unit }}\n                  </span>\n                </div>\n              }\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  <!-- The record list -->\n  @if (!isLoading) {\n    @if (datapointsTableItems.length) {\n      <c8y-list-group\n        class=\"p-t-8 flex-grow c8y-cq-440\"\n        c8yVirtualScrollListener\n        (scrolled)=\"onListScrolled()\"\n        (scrolledToTop)=\"onListScrolledToTop()\"\n      >\n        <c8y-li-timeline\n          *c8yFor=\"\n            let tableItem of { data: datapointsTableItems, res: null };\n            enableVirtualScroll: true;\n            virtualScrollElementSize: 48;\n            virtualScrollStrategy: 'fixed'\n          \"\n        >\n          {{ tableItem.dateAndTime | c8yDate: 'mediumDate' }}\n          {{\n            tableItem.dateAndTime\n              | c8yDate: 'mediumTime'\n              | adjustAggregatedTimeRange: aggregationType\n          }}\n          <c8y-li>\n            <c8y-li-body>\n              <div class=\"d-flex row\">\n                @if (devicesColumnHeaders.length > 1) {\n                  <div\n                    class=\"min-width-0\"\n                    [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                    [attr.data-label]=\"'Device' | translate\"\n                  >\n                    <div\n                      class=\"text-truncate\"\n                      title=\"{{ tableItem.deviceName }}\"\n                    >\n                      {{ tableItem.deviceName }}\n                    </div>\n                  </div>\n                }\n                <!-- Data point value row cells -->\n\n                @for (row of tableItem.rowItems; track row) {\n                  @if (row !== null) {\n                    @switch (row.renderType) {\n                      @case ('min') {\n                        <div\n                          [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                          [ngClass]=\"row.value.min ?? null | applyRangeClass: getRangeValues(row)\"\n                          [attr.data-label]=\"row.label\"\n                        >\n                          <div\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.min ?? '' | number: getFractionSize(row.value.min)\n                            }}\"\n                          >\n                            {{ row.value.min ?? '' | number: getFractionSize(row.value.min) }}\n                          </div>\n                        </div>\n                      }\n                      @case ('max') {\n                        <div\n                          class=\"col-md-4\"\n                          [ngClass]=\"row.value.max ?? null | applyRangeClass: getRangeValues(row)\"\n                        >\n                          <div\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.max ?? '' | number: getFractionSize(row.value.max)\n                            }}\"\n                          >\n                            {{ row.value.max ?? '' | number: getFractionSize(row.value.max) }}\n                          </div>\n                        </div>\n                      }\n                      @case ('area') {\n                        <div [c8yDynamicColumn]=\"devicesColumnHeaders.length\">\n                          <span\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.min ?? '' | number: getFractionSize(row.value.min)\n                            }}\"\n                            [ngClass]=\"row.value.min ?? null | applyRangeClass: getRangeValues(row)\"\n                          >\n                            {{ row.value.min ?? '' | number: getFractionSize(row.value.min) }}\n                          </span>\n                          ...\n                          <span\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.max ?? '' | number: getFractionSize(row.value.max)\n                            }}\"\n                            [ngClass]=\"row.value.max ?? null | applyRangeClass: getRangeValues(row)\"\n                          >\n                            {{ row.value.max ?? '' | number: getFractionSize(row.value.max) }}\n                          </span>\n                        </div>\n                      }\n                      @default {\n                        <div [c8yDynamicColumn]=\"devicesColumnHeaders.length\">\n                          <span\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.min ?? '' | number: getFractionSize(row.value.min)\n                            }}\"\n                            [ngClass]=\"row.value.min ?? null | applyRangeClass: getRangeValues(row)\"\n                          >\n                            {{ row.value.min ?? '' | number: getFractionSize(row.value.min) }}\n                          </span>\n                        </div>\n                      }\n                    }\n                  } @else {\n                    <div [c8yDynamicColumn]=\"devicesColumnHeaders.length\"></div>\n                  }\n                }\n              </div>\n            </c8y-li-body>\n          </c8y-li>\n        </c8y-li-timeline>\n      </c8y-list-group>\n    } @else {\n      <div class=\"p-relative p-l-24\">\n        <c8y-ui-empty-state\n          [icon]=\"'c8y-alert-idle'\"\n          [title]=\"'No data to display.' | translate\"\n          [horizontal]=\"true\"\n          data-cy=\"datapoints-table-list--empty-state\"\n        >\n          <p c8y-guide-docs>\n            <small\n              translate\n              ngNonBindable\n            >\n              Find out more in the\n              <a c8y-guide-href=\"/docs/cockpit/widgets-collection/#data-point-table\">\n                user documentation\n              </a>\n              .\n            </small>\n          </p>\n        </c8y-ui-empty-state>\n      </div>\n    }\n  } @else {\n    <c8y-loading></c8y-loading>\n  }\n} @else {\n  <div class=\"p-t-24 p-r-16 p-l-16 p-b-16 d-flex\">\n    <div class=\"center-block\">\n      <c8y-dynamic-component-alerts\n        [alerts]=\"missingAllPermissionsAlert\"\n      ></c8y-dynamic-component-alerts>\n    </div>\n  </div>\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: i1$2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i1$2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.ForOfDirective, selector: "[c8yFor]", inputs: ["c8yForOf", "c8yForLoadMore", "c8yForPipe", "c8yForNotFound", "c8yForMaxIterations", "c8yForLoadingTemplate", "c8yForLoadNextLabel", "c8yForLoadingLabel", "c8yForRealtime", "c8yForRealtimeOptions", "c8yForComparator", "c8yForEnableVirtualScroll", "c8yForVirtualScrollElementSize", "c8yForVirtualScrollStrategy", "c8yForVirtualScrollContainerHeight"], outputs: ["c8yForCount", "c8yForChange", "c8yForLoadMoreComponent"] }, { kind: "component", type: i1$2.LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "ngmodule", type: DocsModule }, { kind: "directive", type: i1$2.GuideHrefDirective, selector: "[c8y-guide-href]", inputs: ["c8y-guide-href"] }, { kind: "component", type: i1$2.GuideDocsComponent, selector: "[c8y-guide-docs]" }, { kind: "directive", type: DynamicColumnDirective, selector: "[c8yDynamicColumn]", inputs: ["c8yDynamicColumn"] }, { kind: "ngmodule", type: DynamicComponentModule }, { kind: "component", type: i1$2.DynamicComponentAlertsComponent, selector: "c8y-dynamic-component-alerts", inputs: ["alerts"] }, { kind: "ngmodule", type: ListGroupModule }, { kind: "component", type: i1$2.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i1$2.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i1$2.ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "component", type: i1$2.ListItemTimelineComponent, selector: "c8y-list-item-timeline, c8y-li-timeline" }, { kind: "directive", type: VirtualScrollListenerDirective, selector: "[c8yVirtualScrollListener]", inputs: ["scrollThreshold"], outputs: ["scrolled", "scrolledToTop"] }, { kind: "pipe", type: AdjustAggregatedTimeRangePipe, name: "adjustAggregatedTimeRange" }, { kind: "pipe", type: ApplyRangeClassPipe, name: "applyRangeClass" }, { kind: "pipe", type: ColumnTitlePipe, name: "columnTitle" }, { kind: "pipe", type: i1$2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i2.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$2.DatePipe, name: "c8yDate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: DatapointsTableComponent, isStandalone: true, selector: "c8y-datapoints-table", inputs: { aggregationType: "aggregationType", datapointsTableItems: "datapointsTableItems", devicesColumnHeaders: "devicesColumnHeaders", decimalPlaces: "decimalPlaces", hasMultipleDatapoints: "hasMultipleDatapoints", isLoading: "isLoading", seriesWithoutPermissionToReadCount: "seriesWithoutPermissionToReadCount" }, outputs: { isScrolling: "isScrolling" }, host: { classAttribute: "d-col flex-grow" }, usesOnChanges: true, ngImport: i0, template: "@if (!hasNoPermissionsToReadAnyMeasurement) {\n  <div class=\"c8y-cq-440\">\n    <div\n      class=\"hidden-xs c8y-list__item c8y-list--timeline hidden-cq\"\n      [ngClass]=\"{ 'separator-top-bottom': devicesColumnHeaders.length > 0 }\"\n    >\n      <div class=\"d-flex container-fluid\">\n        <div class=\"c8y-list--timeline__item__date\"></div>\n        <div class=\"c8y-list__item__block flex-grow min-width-0\">\n          <div class=\"c8y-list__item__body\">\n            <div class=\"d-flex row\">\n              @if (hasMultipleDatapoints) {\n                <div\n                  class=\"min-width-0\"\n                  [title]=\"'Device' | translate\"\n                  [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                >\n                  <span class=\"text-medium text-truncate\">\n                    {{ 'Device' | translate }}\n                  </span>\n                </div>\n              }\n              <!-- Data points column headers -->\n              @for (header of devicesColumnHeaders; track header) {\n                <div\n                  class=\"min-width-0\"\n                  title=\"{{ header | columnTitle }}\"\n                  [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                >\n                  <span class=\"text-medium text-truncate\">\n                    {{ header.label }} {{ header.unit }}\n                  </span>\n                </div>\n              }\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  <!-- The record list -->\n  @if (!isLoading) {\n    @if (datapointsTableItems.length) {\n      <c8y-list-group\n        class=\"p-t-8 flex-grow c8y-cq-440\"\n        c8yVirtualScrollListener\n        (scrolled)=\"onListScrolled()\"\n        (scrolledToTop)=\"onListScrolledToTop()\"\n      >\n        <c8y-li-timeline\n          *c8yFor=\"\n            let tableItem of { data: datapointsTableItems, res: null };\n            enableVirtualScroll: true;\n            virtualScrollElementSize: 48;\n            virtualScrollStrategy: 'fixed'\n          \"\n        >\n          {{ tableItem.dateAndTime | c8yDate: 'mediumDate' }}\n          {{\n            tableItem.dateAndTime\n              | c8yDate: 'mediumTime'\n              | adjustAggregatedTimeRange: aggregationType\n          }}\n          <c8y-li>\n            <c8y-li-body>\n              <div class=\"d-flex row\">\n                @if (devicesColumnHeaders.length > 1) {\n                  <div\n                    class=\"min-width-0\"\n                    [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                    [attr.data-label]=\"'Device' | translate\"\n                  >\n                    <div\n                      class=\"text-truncate\"\n                      title=\"{{ tableItem.deviceName }}\"\n                    >\n                      {{ tableItem.deviceName }}\n                    </div>\n                  </div>\n                }\n                <!-- Data point value row cells -->\n\n                @for (row of tableItem.rowItems; track row) {\n                  @if (row !== null) {\n                    @switch (row.renderType) {\n                      @case ('min') {\n                        <div\n                          [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                          [ngClass]=\"row.value.min ?? null | applyRangeClass: getRangeValues(row)\"\n                          [attr.data-label]=\"row.label\"\n                          data-cy=\"c8y-datapoints-table--value-min\"\n                        >\n                          <div\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.min ?? '' | number: getFractionSize(row.value.min)\n                            }}\"\n                          >\n                            {{ row.value.min ?? '' | number: getFractionSize(row.value.min) }}\n                          </div>\n                        </div>\n                      }\n                      @case ('max') {\n                        <div\n                          class=\"col-md-4\"\n                          [ngClass]=\"row.value.max ?? null | applyRangeClass: getRangeValues(row)\"\n                          data-cy=\"c8y-datapoints-table--value-max\"\n                        >\n                          <div\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.max ?? '' | number: getFractionSize(row.value.max)\n                            }}\"\n                          >\n                            {{ row.value.max ?? '' | number: getFractionSize(row.value.max) }}\n                          </div>\n                        </div>\n                      }\n                      @case ('area') {\n                        <div\n                          [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                          data-cy=\"c8y-datapoints-table--value-minmax\"\n                        >\n                          <span\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.min ?? '' | number: getFractionSize(row.value.min)\n                            }}\"\n                            [ngClass]=\"row.value.min ?? null | applyRangeClass: getRangeValues(row)\"\n                            data-cy=\"c8y-datapoints-table--value-minmax-min\"\n                          >\n                            {{ row.value.min ?? '' | number: getFractionSize(row.value.min) }}\n                          </span>\n                          ...\n                          <span\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.max ?? '' | number: getFractionSize(row.value.max)\n                            }}\"\n                            [ngClass]=\"row.value.max ?? null | applyRangeClass: getRangeValues(row)\"\n                            data-cy=\"c8y-datapoints-table--value-minmax-max\"\n                          >\n                            {{ row.value.max ?? '' | number: getFractionSize(row.value.max) }}\n                          </span>\n                        </div>\n                      }\n                      @default {\n                        <div [c8yDynamicColumn]=\"devicesColumnHeaders.length\">\n                          <span\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.min ?? '' | number: getFractionSize(row.value.min)\n                            }}\"\n                            [ngClass]=\"row.value.min ?? null | applyRangeClass: getRangeValues(row)\"\n                          >\n                            {{ row.value.min ?? '' | number: getFractionSize(row.value.min) }}\n                          </span>\n                        </div>\n                      }\n                    }\n                  } @else {\n                    <div [c8yDynamicColumn]=\"devicesColumnHeaders.length\"></div>\n                  }\n                }\n              </div>\n            </c8y-li-body>\n          </c8y-li>\n        </c8y-li-timeline>\n      </c8y-list-group>\n    } @else {\n      <div class=\"p-relative p-l-24\">\n        <c8y-ui-empty-state\n          [icon]=\"'c8y-alert-idle'\"\n          [title]=\"'No data to display.' | translate\"\n          [horizontal]=\"true\"\n          data-cy=\"datapoints-table-list--empty-state\"\n        >\n          <p c8y-guide-docs>\n            <small\n              translate\n              ngNonBindable\n            >\n              Find out more in the\n              <a c8y-guide-href=\"/docs/cockpit/widgets-collection/#data-point-table\">\n                user documentation\n              </a>\n              .\n            </small>\n          </p>\n        </c8y-ui-empty-state>\n      </div>\n    }\n  } @else {\n    <c8y-loading></c8y-loading>\n  }\n} @else {\n  <div class=\"p-t-24 p-r-16 p-l-16 p-b-16 d-flex\">\n    <div class=\"center-block\">\n      <c8y-dynamic-component-alerts\n        [alerts]=\"missingAllPermissionsAlert\"\n      ></c8y-dynamic-component-alerts>\n    </div>\n  </div>\n}\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: i1$2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i1$2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$2.ForOfDirective, selector: "[c8yFor]", inputs: ["c8yForOf", "c8yForLoadMore", "c8yForPipe", "c8yForNotFound", "c8yForMaxIterations", "c8yForLoadingTemplate", "c8yForLoadNextLabel", "c8yForLoadingLabel", "c8yForRealtime", "c8yForRealtimeOptions", "c8yForComparator", "c8yForEnableVirtualScroll", "c8yForVirtualScrollElementSize", "c8yForVirtualScrollStrategy", "c8yForVirtualScrollContainerHeight"], outputs: ["c8yForCount", "c8yForChange", "c8yForLoadMoreComponent"] }, { kind: "component", type: i1$2.LoadingComponent, selector: "c8y-loading", inputs: ["layout", "progress", "message"] }, { kind: "ngmodule", type: DocsModule }, { kind: "directive", type: i1$2.GuideHrefDirective, selector: "[c8y-guide-href]", inputs: ["c8y-guide-href"] }, { kind: "component", type: i1$2.GuideDocsComponent, selector: "[c8y-guide-docs]" }, { kind: "directive", type: DynamicColumnDirective, selector: "[c8yDynamicColumn]", inputs: ["c8yDynamicColumn"] }, { kind: "ngmodule", type: DynamicComponentModule }, { kind: "component", type: i1$2.DynamicComponentAlertsComponent, selector: "c8y-dynamic-component-alerts", inputs: ["alerts"] }, { kind: "ngmodule", type: ListGroupModule }, { kind: "component", type: i1$2.ListGroupComponent, selector: "c8y-list-group" }, { kind: "component", type: i1$2.ListItemComponent, selector: "c8y-list-item, c8y-li", inputs: ["active", "highlighted", "emptyActions", "dense", "collapsed", "selectable"], outputs: ["collapsedChange"] }, { kind: "component", type: i1$2.ListItemBodyComponent, selector: "c8y-list-item-body, c8y-li-body", inputs: ["body"] }, { kind: "component", type: i1$2.ListItemTimelineComponent, selector: "c8y-list-item-timeline, c8y-li-timeline" }, { kind: "directive", type: VirtualScrollListenerDirective, selector: "[c8yVirtualScrollListener]", inputs: ["scrollThreshold"], outputs: ["scrolled", "scrolledToTop"] }, { kind: "pipe", type: AdjustAggregatedTimeRangePipe, name: "adjustAggregatedTimeRange" }, { kind: "pipe", type: ApplyRangeClassPipe, name: "applyRangeClass" }, { kind: "pipe", type: ColumnTitlePipe, name: "columnTitle" }, { kind: "pipe", type: i1$2.C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i2.DecimalPipe, name: "number" }, { kind: "pipe", type: i1$2.DatePipe, name: "c8yDate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DatapointsTableComponent, decorators: [{
             type: Component,
@@ -933,7 +933,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImpo
                         DynamicComponentModule,
                         ListGroupModule,
                         VirtualScrollListenerDirective
-                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (!hasNoPermissionsToReadAnyMeasurement) {\n  <div class=\"c8y-cq-440\">\n    <div\n      class=\"hidden-xs c8y-list__item c8y-list--timeline hidden-cq\"\n      [ngClass]=\"{ 'separator-top-bottom': devicesColumnHeaders.length > 0 }\"\n    >\n      <div class=\"d-flex container-fluid\">\n        <div class=\"c8y-list--timeline__item__date\"></div>\n        <div class=\"c8y-list__item__block flex-grow min-width-0\">\n          <div class=\"c8y-list__item__body\">\n            <div class=\"d-flex row\">\n              @if (hasMultipleDatapoints) {\n                <div\n                  class=\"min-width-0\"\n                  [title]=\"'Device' | translate\"\n                  [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                >\n                  <span class=\"text-medium text-truncate\">\n                    {{ 'Device' | translate }}\n                  </span>\n                </div>\n              }\n              <!-- Data points column headers -->\n              @for (header of devicesColumnHeaders; track header) {\n                <div\n                  class=\"min-width-0\"\n                  title=\"{{ header | columnTitle }}\"\n                  [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                >\n                  <span class=\"text-medium text-truncate\">\n                    {{ header.label }} {{ header.unit }}\n                  </span>\n                </div>\n              }\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  <!-- The record list -->\n  @if (!isLoading) {\n    @if (datapointsTableItems.length) {\n      <c8y-list-group\n        class=\"p-t-8 flex-grow c8y-cq-440\"\n        c8yVirtualScrollListener\n        (scrolled)=\"onListScrolled()\"\n        (scrolledToTop)=\"onListScrolledToTop()\"\n      >\n        <c8y-li-timeline\n          *c8yFor=\"\n            let tableItem of { data: datapointsTableItems, res: null };\n            enableVirtualScroll: true;\n            virtualScrollElementSize: 48;\n            virtualScrollStrategy: 'fixed'\n          \"\n        >\n          {{ tableItem.dateAndTime | c8yDate: 'mediumDate' }}\n          {{\n            tableItem.dateAndTime\n              | c8yDate: 'mediumTime'\n              | adjustAggregatedTimeRange: aggregationType\n          }}\n          <c8y-li>\n            <c8y-li-body>\n              <div class=\"d-flex row\">\n                @if (devicesColumnHeaders.length > 1) {\n                  <div\n                    class=\"min-width-0\"\n                    [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                    [attr.data-label]=\"'Device' | translate\"\n                  >\n                    <div\n                      class=\"text-truncate\"\n                      title=\"{{ tableItem.deviceName }}\"\n                    >\n                      {{ tableItem.deviceName }}\n                    </div>\n                  </div>\n                }\n                <!-- Data point value row cells -->\n\n                @for (row of tableItem.rowItems; track row) {\n                  @if (row !== null) {\n                    @switch (row.renderType) {\n                      @case ('min') {\n                        <div\n                          [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                          [ngClass]=\"row.value.min ?? null | applyRangeClass: getRangeValues(row)\"\n                          [attr.data-label]=\"row.label\"\n                        >\n                          <div\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.min ?? '' | number: getFractionSize(row.value.min)\n                            }}\"\n                          >\n                            {{ row.value.min ?? '' | number: getFractionSize(row.value.min) }}\n                          </div>\n                        </div>\n                      }\n                      @case ('max') {\n                        <div\n                          class=\"col-md-4\"\n                          [ngClass]=\"row.value.max ?? null | applyRangeClass: getRangeValues(row)\"\n                        >\n                          <div\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.max ?? '' | number: getFractionSize(row.value.max)\n                            }}\"\n                          >\n                            {{ row.value.max ?? '' | number: getFractionSize(row.value.max) }}\n                          </div>\n                        </div>\n                      }\n                      @case ('area') {\n                        <div [c8yDynamicColumn]=\"devicesColumnHeaders.length\">\n                          <span\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.min ?? '' | number: getFractionSize(row.value.min)\n                            }}\"\n                            [ngClass]=\"row.value.min ?? null | applyRangeClass: getRangeValues(row)\"\n                          >\n                            {{ row.value.min ?? '' | number: getFractionSize(row.value.min) }}\n                          </span>\n                          ...\n                          <span\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.max ?? '' | number: getFractionSize(row.value.max)\n                            }}\"\n                            [ngClass]=\"row.value.max ?? null | applyRangeClass: getRangeValues(row)\"\n                          >\n                            {{ row.value.max ?? '' | number: getFractionSize(row.value.max) }}\n                          </span>\n                        </div>\n                      }\n                      @default {\n                        <div [c8yDynamicColumn]=\"devicesColumnHeaders.length\">\n                          <span\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.min ?? '' | number: getFractionSize(row.value.min)\n                            }}\"\n                            [ngClass]=\"row.value.min ?? null | applyRangeClass: getRangeValues(row)\"\n                          >\n                            {{ row.value.min ?? '' | number: getFractionSize(row.value.min) }}\n                          </span>\n                        </div>\n                      }\n                    }\n                  } @else {\n                    <div [c8yDynamicColumn]=\"devicesColumnHeaders.length\"></div>\n                  }\n                }\n              </div>\n            </c8y-li-body>\n          </c8y-li>\n        </c8y-li-timeline>\n      </c8y-list-group>\n    } @else {\n      <div class=\"p-relative p-l-24\">\n        <c8y-ui-empty-state\n          [icon]=\"'c8y-alert-idle'\"\n          [title]=\"'No data to display.' | translate\"\n          [horizontal]=\"true\"\n          data-cy=\"datapoints-table-list--empty-state\"\n        >\n          <p c8y-guide-docs>\n            <small\n              translate\n              ngNonBindable\n            >\n              Find out more in the\n              <a c8y-guide-href=\"/docs/cockpit/widgets-collection/#data-point-table\">\n                user documentation\n              </a>\n              .\n            </small>\n          </p>\n        </c8y-ui-empty-state>\n      </div>\n    }\n  } @else {\n    <c8y-loading></c8y-loading>\n  }\n} @else {\n  <div class=\"p-t-24 p-r-16 p-l-16 p-b-16 d-flex\">\n    <div class=\"center-block\">\n      <c8y-dynamic-component-alerts\n        [alerts]=\"missingAllPermissionsAlert\"\n      ></c8y-dynamic-component-alerts>\n    </div>\n  </div>\n}\n" }]
+                    ], changeDetection: ChangeDetectionStrategy.OnPush, template: "@if (!hasNoPermissionsToReadAnyMeasurement) {\n  <div class=\"c8y-cq-440\">\n    <div\n      class=\"hidden-xs c8y-list__item c8y-list--timeline hidden-cq\"\n      [ngClass]=\"{ 'separator-top-bottom': devicesColumnHeaders.length > 0 }\"\n    >\n      <div class=\"d-flex container-fluid\">\n        <div class=\"c8y-list--timeline__item__date\"></div>\n        <div class=\"c8y-list__item__block flex-grow min-width-0\">\n          <div class=\"c8y-list__item__body\">\n            <div class=\"d-flex row\">\n              @if (hasMultipleDatapoints) {\n                <div\n                  class=\"min-width-0\"\n                  [title]=\"'Device' | translate\"\n                  [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                >\n                  <span class=\"text-medium text-truncate\">\n                    {{ 'Device' | translate }}\n                  </span>\n                </div>\n              }\n              <!-- Data points column headers -->\n              @for (header of devicesColumnHeaders; track header) {\n                <div\n                  class=\"min-width-0\"\n                  title=\"{{ header | columnTitle }}\"\n                  [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                >\n                  <span class=\"text-medium text-truncate\">\n                    {{ header.label }} {{ header.unit }}\n                  </span>\n                </div>\n              }\n            </div>\n          </div>\n        </div>\n      </div>\n    </div>\n  </div>\n  <!-- The record list -->\n  @if (!isLoading) {\n    @if (datapointsTableItems.length) {\n      <c8y-list-group\n        class=\"p-t-8 flex-grow c8y-cq-440\"\n        c8yVirtualScrollListener\n        (scrolled)=\"onListScrolled()\"\n        (scrolledToTop)=\"onListScrolledToTop()\"\n      >\n        <c8y-li-timeline\n          *c8yFor=\"\n            let tableItem of { data: datapointsTableItems, res: null };\n            enableVirtualScroll: true;\n            virtualScrollElementSize: 48;\n            virtualScrollStrategy: 'fixed'\n          \"\n        >\n          {{ tableItem.dateAndTime | c8yDate: 'mediumDate' }}\n          {{\n            tableItem.dateAndTime\n              | c8yDate: 'mediumTime'\n              | adjustAggregatedTimeRange: aggregationType\n          }}\n          <c8y-li>\n            <c8y-li-body>\n              <div class=\"d-flex row\">\n                @if (devicesColumnHeaders.length > 1) {\n                  <div\n                    class=\"min-width-0\"\n                    [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                    [attr.data-label]=\"'Device' | translate\"\n                  >\n                    <div\n                      class=\"text-truncate\"\n                      title=\"{{ tableItem.deviceName }}\"\n                    >\n                      {{ tableItem.deviceName }}\n                    </div>\n                  </div>\n                }\n                <!-- Data point value row cells -->\n\n                @for (row of tableItem.rowItems; track row) {\n                  @if (row !== null) {\n                    @switch (row.renderType) {\n                      @case ('min') {\n                        <div\n                          [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                          [ngClass]=\"row.value.min ?? null | applyRangeClass: getRangeValues(row)\"\n                          [attr.data-label]=\"row.label\"\n                          data-cy=\"c8y-datapoints-table--value-min\"\n                        >\n                          <div\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.min ?? '' | number: getFractionSize(row.value.min)\n                            }}\"\n                          >\n                            {{ row.value.min ?? '' | number: getFractionSize(row.value.min) }}\n                          </div>\n                        </div>\n                      }\n                      @case ('max') {\n                        <div\n                          class=\"col-md-4\"\n                          [ngClass]=\"row.value.max ?? null | applyRangeClass: getRangeValues(row)\"\n                          data-cy=\"c8y-datapoints-table--value-max\"\n                        >\n                          <div\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.max ?? '' | number: getFractionSize(row.value.max)\n                            }}\"\n                          >\n                            {{ row.value.max ?? '' | number: getFractionSize(row.value.max) }}\n                          </div>\n                        </div>\n                      }\n                      @case ('area') {\n                        <div\n                          [c8yDynamicColumn]=\"devicesColumnHeaders.length\"\n                          data-cy=\"c8y-datapoints-table--value-minmax\"\n                        >\n                          <span\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.min ?? '' | number: getFractionSize(row.value.min)\n                            }}\"\n                            [ngClass]=\"row.value.min ?? null | applyRangeClass: getRangeValues(row)\"\n                            data-cy=\"c8y-datapoints-table--value-minmax-min\"\n                          >\n                            {{ row.value.min ?? '' | number: getFractionSize(row.value.min) }}\n                          </span>\n                          ...\n                          <span\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.max ?? '' | number: getFractionSize(row.value.max)\n                            }}\"\n                            [ngClass]=\"row.value.max ?? null | applyRangeClass: getRangeValues(row)\"\n                            data-cy=\"c8y-datapoints-table--value-minmax-max\"\n                          >\n                            {{ row.value.max ?? '' | number: getFractionSize(row.value.max) }}\n                          </span>\n                        </div>\n                      }\n                      @default {\n                        <div [c8yDynamicColumn]=\"devicesColumnHeaders.length\">\n                          <span\n                            class=\"text-truncate\"\n                            title=\"{{\n                              row.value.min ?? '' | number: getFractionSize(row.value.min)\n                            }}\"\n                            [ngClass]=\"row.value.min ?? null | applyRangeClass: getRangeValues(row)\"\n                          >\n                            {{ row.value.min ?? '' | number: getFractionSize(row.value.min) }}\n                          </span>\n                        </div>\n                      }\n                    }\n                  } @else {\n                    <div [c8yDynamicColumn]=\"devicesColumnHeaders.length\"></div>\n                  }\n                }\n              </div>\n            </c8y-li-body>\n          </c8y-li>\n        </c8y-li-timeline>\n      </c8y-list-group>\n    } @else {\n      <div class=\"p-relative p-l-24\">\n        <c8y-ui-empty-state\n          [icon]=\"'c8y-alert-idle'\"\n          [title]=\"'No data to display.' | translate\"\n          [horizontal]=\"true\"\n          data-cy=\"datapoints-table-list--empty-state\"\n        >\n          <p c8y-guide-docs>\n            <small\n              translate\n              ngNonBindable\n            >\n              Find out more in the\n              <a c8y-guide-href=\"/docs/cockpit/widgets-collection/#data-point-table\">\n                user documentation\n              </a>\n              .\n            </small>\n          </p>\n        </c8y-ui-empty-state>\n      </div>\n    }\n  } @else {\n    <c8y-loading></c8y-loading>\n  }\n} @else {\n  <div class=\"p-t-24 p-r-16 p-l-16 p-b-16 d-flex\">\n    <div class=\"center-block\">\n      <c8y-dynamic-component-alerts\n        [alerts]=\"missingAllPermissionsAlert\"\n      ></c8y-dynamic-component-alerts>\n    </div>\n  </div>\n}\n" }]
         }], propDecorators: { aggregationType: [{
                 type: Input
             }], datapointsTableItems: [{
@@ -1235,7 +1235,7 @@ class DatapointsTableViewWidgetComponent {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DatapointsTableViewWidgetComponent, deps: [{ token: i1$2.AlertService }, { token: DatapointsTableViewService }, { token: i1$1.TranslateService }, { token: i2$1.ContextDashboardComponent, optional: true }, { token: i5.WidgetConfigMigrationService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: DatapointsTableViewWidgetComponent, isStandalone: true, selector: "c8y-datapoints-table-view", inputs: { config: "config", isInPreviewMode: "isInPreviewMode" }, host: { classAttribute: "d-col fit-h" }, viewQueries: [{ propertyName: "globalContextWidgetWrapperComponent", first: true, predicate: GlobalContextWidgetWrapperComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!isInPreviewMode\">\n  <div class=\"d-flex gap-16 p-r-16 inner-scroll h-auto min-width-0\">\n    <c8y-global-context-widget-wrapper\n      *ngIf=\"widgetControls\"\n      [widgetControls]=\"widgetControls\"\n      [displayMode]=\"'inline'\"\n      [isLoading]=\"isLoading$ | async\"\n      [config]=\"config\"\n      (globalContextChange)=\"onGlobalContextChange($event)\"\n    ></c8y-global-context-widget-wrapper>\n    <ng-container *ngIf=\"config.datapoints.length > 0\"></ng-container>\n    <c8y-datapoints-export-selector\n      class=\"m-l-auto p-b-8\"\n      [containerClass]=\"containerClass\"\n      [exportConfig]=\"exportConfig\"\n      (isOpen)=\"onExportModalOpen($event)\"\n    ></c8y-datapoints-export-selector>\n  </div>\n</ng-container>\n<ng-container *ngIf=\"devicesColumnHeaders\">\n  <c8y-datapoints-table\n    [aggregationType]=\"config.aggregation\"\n    [datapointsTableItems]=\"datapointsTableItems\"\n    [decimalPlaces]=\"config.decimalPlaces\"\n    [devicesColumnHeaders]=\"devicesColumnHeaders\"\n    [hasMultipleDatapoints]=\"hasMultipleDatapoints\"\n    [isLoading]=\"isLoading$ | async\"\n    [seriesWithoutPermissionToReadCount]=\"seriesWithoutPermissionToRead?.length\"\n    (isScrolling)=\"onScrolling($event)\"\n  ></c8y-datapoints-table>\n</ng-container>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DatapointsExportSelectorComponent, selector: "c8y-datapoints-export-selector", inputs: ["containerClass", "exportConfig"], outputs: ["isOpen"] }, { kind: "component", type: DatapointsTableComponent, selector: "c8y-datapoints-table", inputs: ["aggregationType", "datapointsTableItems", "devicesColumnHeaders", "decimalPlaces", "hasMultipleDatapoints", "isLoading", "seriesWithoutPermissionToReadCount"], outputs: ["isScrolling"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: GlobalContextWidgetWrapperComponent, selector: "c8y-global-context-widget-wrapper", inputs: ["isLoading", "displayMode", "widgetControls", "controlLinks", "dashboardChildForLegacy", "config"], outputs: ["globalContextChange"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: DatapointsTableViewWidgetComponent, isStandalone: true, selector: "c8y-datapoints-table-view", inputs: { config: "config", isInPreviewMode: "isInPreviewMode" }, host: { classAttribute: "d-col fit-h" }, viewQueries: [{ propertyName: "globalContextWidgetWrapperComponent", first: true, predicate: GlobalContextWidgetWrapperComponent, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<ng-container *ngIf=\"!isInPreviewMode\">\n  <div class=\"d-flex gap-16 p-r-16 inner-scroll h-auto min-width-0\">\n    <c8y-global-context-widget-wrapper\n      *ngIf=\"widgetControls\"\n      [widgetControls]=\"widgetControls\"\n      [displayMode]=\"'inline'\"\n      [isLoading]=\"isLoading$ | async\"\n      [config]=\"config\"\n      (globalContextChange)=\"onGlobalContextChange($event)\"\n    ></c8y-global-context-widget-wrapper>\n    <ng-container *ngIf=\"config.datapoints.length > 0\"></ng-container>\n    <c8y-datapoints-export-selector\n      class=\"m-l-auto p-b-8\"\n      [containerClass]=\"containerClass\"\n      [exportConfig]=\"exportConfig\"\n      (isOpen)=\"onExportModalOpen($event)\"\n    ></c8y-datapoints-export-selector>\n  </div>\n</ng-container>\n<ng-container *ngIf=\"devicesColumnHeaders\">\n  <c8y-datapoints-table\n    [aggregationType]=\"config.aggregation\"\n    [datapointsTableItems]=\"datapointsTableItems\"\n    [decimalPlaces]=\"config.decimalPlaces\"\n    [devicesColumnHeaders]=\"devicesColumnHeaders\"\n    [hasMultipleDatapoints]=\"hasMultipleDatapoints\"\n    [isLoading]=\"isLoading$ | async\"\n    [seriesWithoutPermissionToReadCount]=\"seriesWithoutPermissionToRead?.length\"\n    (isScrolling)=\"onScrolling($event)\"\n  ></c8y-datapoints-table>\n</ng-container>\n", dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: DatapointsExportSelectorComponent, selector: "c8y-datapoints-export-selector", inputs: ["containerClass", "exportConfig"], outputs: ["isOpen"] }, { kind: "component", type: DatapointsTableComponent, selector: "c8y-datapoints-table", inputs: ["aggregationType", "datapointsTableItems", "devicesColumnHeaders", "decimalPlaces", "hasMultipleDatapoints", "isLoading", "seriesWithoutPermissionToReadCount"], outputs: ["isScrolling"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "component", type: GlobalContextWidgetWrapperComponent, selector: "c8y-global-context-widget-wrapper", inputs: ["isLoading", "displayMode", "widgetControls", "controlLinks", "dashboardChildForLegacy", "config", "disableRefreshEmits"], outputs: ["globalContextChange"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DatapointsTableViewWidgetComponent, decorators: [{
             type: Component,
@@ -1380,7 +1380,7 @@ class DatapointsTableWidgetConfigComponent {
         });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DatapointsTableWidgetConfigComponent, deps: [{ token: i1$3.NgForm }, { token: i1$3.FormBuilder }, { token: i2$1.WidgetConfigComponent }, { token: i2$1.WidgetConfigService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: DatapointsTableWidgetConfigComponent, isStandalone: true, selector: "c8y-datapoints-table-view-config", inputs: { config: "config" }, viewQueries: [{ propertyName: "previewMapSet", first: true, predicate: ["datapointsTablePreview"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"p-l-24 p-r-24\">\n  @if (formGroup) {\n    <form\n      class=\"no-card-context\"\n      [formGroup]=\"formGroup\"\n    >\n      <fieldset class=\"c8y-fieldset\">\n        <legend>\n          {{ 'Decimal places' | translate }}\n        </legend>\n        <c8y-form-group class=\"p-t-8\">\n          <input\n            class=\"form-control\"\n            name=\"decimalPlaces\"\n            type=\"number\"\n            formControlName=\"decimalPlaces\"\n            step=\"1\"\n          />\n        </c8y-form-group>\n      </fieldset>\n      <c8y-datapoint-selection-list\n        class=\"bg-inherit separator-top p-t-16 d-block\"\n        listTitle=\"{{ 'Data points' | translate }}\"\n        name=\"datapoints\"\n        [defaultFormOptions]=\"defaultFormOptions\"\n        [config]=\"datapointSelectionConfig\"\n        [minActiveCount]=\"1\"\n        formControlName=\"datapoints\"\n      ></c8y-datapoint-selection-list>\n    </form>\n  }\n</div>\n\n<ng-template #datapointsTablePreview>\n  @if (formGroup && formGroup.value && formGroup.value.datapoints?.length > 0) {\n    <c8y-global-context-widget-wrapper\n      [widgetControls]=\"widgetControls\"\n      [displayMode]=\"'preview'\"\n      [config]=\"composedConfig\"\n    ></c8y-global-context-widget-wrapper>\n    @if (composedConfig) {\n      <c8y-datapoints-table-view\n        [config]=\"composedConfig\"\n        [isInPreviewMode]=\"true\"\n      ></c8y-datapoints-table-view>\n    }\n  } @else {\n    <div class=\"col-md-6 d-col a-i-start j-c-center\">\n      <c8y-ui-empty-state\n        [icon]=\"'c8y-data-points'\"\n        [title]=\"'No data points selected' | translate\"\n        [subtitle]=\"'Select data point to render content' | translate\"\n        [horizontal]=\"false\"\n        data-cy=\"datapoints-table-list--empty-state-no-data-point-selected\"\n      >\n        <p c8y-guide-docs>\n          <small\n            translate\n            ngNonBindable\n          >\n            Find out more in the\n            <a c8y-guide-href=\"/docs/cockpit/widgets-collection/#data-point-table\">\n              user documentation\n            </a>\n            .\n          </small>\n        </p>\n      </c8y-ui-empty-state>\n    </div>\n  }\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CoreModule }, { kind: "component", type: i1$2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i1$2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i1$2.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: i1$2.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: i1$2.GuideHrefDirective, selector: "[c8y-guide-href]", inputs: ["c8y-guide-href"] }, { kind: "component", type: i1$2.GuideDocsComponent, selector: "[c8y-guide-docs]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: DatapointSelectorModule }, { kind: "component", type: i4.DatapointSelectionListComponent, selector: "c8y-datapoint-selection-list", inputs: ["actions", "allowDragAndDrop", "config", "defaultFormOptions", "maxActiveCount", "minActiveCount", "resolveContext", "listTitle"], outputs: ["isValid", "change"] }, { kind: "component", type: DatapointsTableViewWidgetComponent, selector: "c8y-datapoints-table-view", inputs: ["config", "isInPreviewMode"] }, { kind: "component", type: GlobalContextWidgetWrapperComponent, selector: "c8y-global-context-widget-wrapper", inputs: ["isLoading", "displayMode", "widgetControls", "controlLinks", "dashboardChildForLegacy", "config"], outputs: ["globalContextChange"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "pipe", type: i1$2.C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: DatapointsTableWidgetConfigComponent, isStandalone: true, selector: "c8y-datapoints-table-view-config", inputs: { config: "config" }, viewQueries: [{ propertyName: "previewMapSet", first: true, predicate: ["datapointsTablePreview"], descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div class=\"p-l-24 p-r-24\">\n  @if (formGroup) {\n    <form\n      class=\"no-card-context\"\n      [formGroup]=\"formGroup\"\n    >\n      <fieldset class=\"c8y-fieldset\">\n        <legend>\n          {{ 'Decimal places' | translate }}\n        </legend>\n        <c8y-form-group class=\"p-t-8\">\n          <input\n            class=\"form-control\"\n            name=\"decimalPlaces\"\n            type=\"number\"\n            formControlName=\"decimalPlaces\"\n            step=\"1\"\n          />\n        </c8y-form-group>\n      </fieldset>\n      <c8y-datapoint-selection-list\n        class=\"bg-inherit separator-top p-t-16 d-block\"\n        listTitle=\"{{ 'Data points' | translate }}\"\n        name=\"datapoints\"\n        [defaultFormOptions]=\"defaultFormOptions\"\n        [config]=\"datapointSelectionConfig\"\n        [minActiveCount]=\"1\"\n        formControlName=\"datapoints\"\n      ></c8y-datapoint-selection-list>\n    </form>\n  }\n</div>\n\n<ng-template #datapointsTablePreview>\n  @if (formGroup && formGroup.value && formGroup.value.datapoints?.length > 0) {\n    <c8y-global-context-widget-wrapper\n      [widgetControls]=\"widgetControls\"\n      [displayMode]=\"'preview'\"\n      [config]=\"composedConfig\"\n    ></c8y-global-context-widget-wrapper>\n    @if (composedConfig) {\n      <c8y-datapoints-table-view\n        [config]=\"composedConfig\"\n        [isInPreviewMode]=\"true\"\n      ></c8y-datapoints-table-view>\n    }\n  } @else {\n    <div class=\"col-md-6 d-col a-i-start j-c-center\">\n      <c8y-ui-empty-state\n        [icon]=\"'c8y-data-points'\"\n        [title]=\"'No data points selected' | translate\"\n        [subtitle]=\"'Select data point to render content' | translate\"\n        [horizontal]=\"false\"\n        data-cy=\"datapoints-table-list--empty-state-no-data-point-selected\"\n      >\n        <p c8y-guide-docs>\n          <small\n            translate\n            ngNonBindable\n          >\n            Find out more in the\n            <a c8y-guide-href=\"/docs/cockpit/widgets-collection/#data-point-table\">\n              user documentation\n            </a>\n            .\n          </small>\n        </p>\n      </c8y-ui-empty-state>\n    </div>\n  }\n</ng-template>\n", dependencies: [{ kind: "ngmodule", type: CoreModule }, { kind: "component", type: i1$2.EmptyStateComponent, selector: "c8y-ui-empty-state", inputs: ["icon", "title", "subtitle", "horizontal"] }, { kind: "directive", type: i1$2.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i1$3.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { kind: "directive", type: i1$3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$3.NumberValueAccessor, selector: "input[type=number][formControlName],input[type=number][formControl],input[type=number][ngModel]" }, { kind: "directive", type: i1$3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$3.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "component", type: i1$2.FormGroupComponent, selector: "c8y-form-group", inputs: ["hasError", "hasWarning", "hasSuccess", "novalidation", "status"] }, { kind: "directive", type: i1$2.RequiredInputPlaceholderDirective, selector: "input[required], input[formControlName]" }, { kind: "directive", type: i1$2.GuideHrefDirective, selector: "[c8y-guide-href]", inputs: ["c8y-guide-href"] }, { kind: "component", type: i1$2.GuideDocsComponent, selector: "[c8y-guide-docs]" }, { kind: "directive", type: i1$3.FormGroupDirective, selector: "[formGroup]", inputs: ["formGroup"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "directive", type: i1$3.FormControlName, selector: "[formControlName]", inputs: ["formControlName", "disabled", "ngModel"], outputs: ["ngModelChange"] }, { kind: "ngmodule", type: DatapointSelectorModule }, { kind: "component", type: i4.DatapointSelectionListComponent, selector: "c8y-datapoint-selection-list", inputs: ["actions", "allowDragAndDrop", "config", "defaultFormOptions", "maxActiveCount", "minActiveCount", "resolveContext", "listTitle"], outputs: ["isValid", "change"] }, { kind: "component", type: DatapointsTableViewWidgetComponent, selector: "c8y-datapoints-table-view", inputs: ["config", "isInPreviewMode"] }, { kind: "component", type: GlobalContextWidgetWrapperComponent, selector: "c8y-global-context-widget-wrapper", inputs: ["isLoading", "displayMode", "widgetControls", "controlLinks", "dashboardChildForLegacy", "config", "disableRefreshEmits"], outputs: ["globalContextChange"] }, { kind: "ngmodule", type: PopoverModule }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "pipe", type: i1$2.C8yTranslatePipe, name: "translate" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DatapointsTableWidgetConfigComponent, decorators: [{
             type: Component,