@simpleangularcontrols/sac-common 10.0.0-rc.26 → 10.0.0-rc.28

package/bundles/simpleangularcontrols-sac-common.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common/http'), require('rxjs'), require('@angular/forms'), require('moment'), require('imask'), require('ngx-uploadx'), require('@angular/common')) :
-    typeof define === 'function' && define.amd ? define('@simpleangularcontrols/sac-common', ['exports', '@angular/core', '@angular/common/http', 'rxjs', '@angular/forms', 'moment', 'imask', 'ngx-uploadx', '@angular/common'], factory) :
-    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.simpleangularcontrols = global.simpleangularcontrols || {}, global.simpleangularcontrols['sac-common'] = {}), global.ng.core, global.ng.common.http, global.rxjs, global.ng.forms, global.moment, global.IMask, global.ngxUploadx, global.ng.common));
-}(this, (function (exports, i0, i1, rxjs, forms, moment_, IMask, ngxUploadx, common) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common/http'), require('rxjs'), require('@angular/forms'), require('moment'), require('angular-imask'), require('imask'), require('ngx-uploadx'), require('@angular/common')) :
+    typeof define === 'function' && define.amd ? define('@simpleangularcontrols/sac-common', ['exports', '@angular/core', '@angular/common/http', 'rxjs', '@angular/forms', 'moment', 'angular-imask', 'imask', 'ngx-uploadx', '@angular/common'], factory) :
+    (global = typeof globalThis !== 'undefined' ? globalThis : global || self, factory((global.simpleangularcontrols = global.simpleangularcontrols || {}, global.simpleangularcontrols['sac-common'] = {}), global.ng.core, global.ng.common.http, global.rxjs, global.ng.forms, global.moment, global.angularImask, global.IMask, global.ngxUploadx, global.ng.common));
+}(this, (function (exports, i0, i1, rxjs, forms, moment_, angularImask, IMask, ngxUploadx, common) { 'use strict';
 
     function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
@@ -23,37 +23,51 @@
              */
             this._role = 'default';
             /**
-             * Input Property für Icon Style Klasse; default Wert - ''
-             */
-            this.icon = '';
-            /**
-             * Input Property für Name; default Wert - ''
-             */
-            this.name = '';
-            /**
-             * Input Property für Text des Buttons; default Wert - ''
+             * Das boolean property ist benutzt für Aktivation des Spinner des Button. Default ist false.
              */
-            this.text = '';
+            this._isloadingvalue = false;
             /**
              * Output Event Emitter
              */
             this.clicked = new i0.EventEmitter();
             /**
-             * Das boolean property ist benutzt für Aktivation des Spinner des Button. Default ist false.
+             * Identifier used for the E2E data attribute.
              */
-            this._isloadingvalue = false;
+            this.e2eidentifier = null;
             /**
              * Boolean Property für Error; default Wert - false
              */
             this.hasError = false;
+            /**
+             * Input Property für Icon Style Klasse; default Wert - ''
+             */
+            this.icon = '';
+            /**
+             * Input Property für Name; default Wert - ''
+             */
+            this.name = '';
+            /**
+             * Input Property für Text des Buttons; default Wert - ''
+             */
+            this.text = '';
             // #endregion Public Methods
         }
+        Object.defineProperty(SacButtonCommon.prototype, "_isdisabled", {
+            // #endregion Properties
+            // #region Public Getters And Setters
+            /**
+             * Getter Methode. Ergibt boolean Wert. Definiert, ob das Button desabled ist.
+             */
+            get: function () {
+                return this._isdisabledvalue;
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(SacButtonCommon.prototype, "isdisabled", {
             get: function () {
                 return this._isdisabledvalue;
             },
-            // #endregion Properties
-            // #region Public Getters And Setters
             /**
              * Deaktivieren von Buttons
              * @param v Deaktiviert den Button
@@ -130,16 +144,6 @@
             enumerable: false,
             configurable: true
         });
-        Object.defineProperty(SacButtonCommon.prototype, "_isdisabled", {
-            /**
-             * Getter Methode. Ergibt boolean Wert. Definiert, ob das Button desabled ist.
-             */
-            get: function () {
-                return this._isdisabledvalue;
-            },
-            enumerable: false,
-            configurable: true
-        });
         // #endregion Public Getters And Setters
         // #region Public Methods
         /**
@@ -156,10 +160,11 @@
         { type: i0.Directive }
     ];
     SacButtonCommon.propDecorators = {
+        clicked: [{ type: i0.Output }],
+        e2eidentifier: [{ type: i0.Input }],
         icon: [{ type: i0.Input }],
         name: [{ type: i0.Input }],
         text: [{ type: i0.Input }],
-        clicked: [{ type: i0.Output }],
         isdisabled: [{ type: i0.Input }],
         isloading: [{ type: i0.Input }],
         role: [{ type: i0.Input }]
@@ -678,6 +683,7 @@
      */
     var SacFormLayoutCommon = /** @class */ (function () {
         function SacFormLayoutCommon() {
+            // #region Properties
             /**
              * Defines the default display for a checkbox. You can choose between a checkbox and a switch. If no style is defined, the global style or the style on the control is used.
              */
@@ -726,8 +732,11 @@
              * Detach label text and tooltip from each other in Label so that label and tooltip can be aligned differently. This is in Bootstrap 3 not supported!
              */
             this.splitlabelandhelptext = null;
+            // #endregion Public Getters And Setters
         }
         Object.defineProperty(SacFormLayoutCommon.prototype, "IsInlineErrorEnabled", {
+            // #endregion Properties
+            // #region Public Getters And Setters
             /**
              * Returns whether the inline error messages for the form are active.
              */
@@ -776,6 +785,13 @@
         ControlHeight[ControlHeight["Large"] = 2] = "Large";
     })(exports.ControlHeight || (exports.ControlHeight = {}));
 
+    // #region Variables
+    /**
+     * injection token for component configuration service
+     */
+    var SACCONFIGURATION_SERVICE = new i0.InjectionToken('SacConfigurationService');
+    // #endregion Variables
+    // #region Exported Classes
     /**
      * abstract class for configuration settings providing in components
      */
@@ -797,6 +813,7 @@
             return _super !== null && _super.apply(this, arguments) || this;
         }
         Object.defineProperty(SacDefaultConfigurationService.prototype, "CheckboxStyle", {
+            // #region Public Getters And Setters
             /**
              * @inheritdoc
              */
@@ -826,6 +843,16 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(SacDefaultConfigurationService.prototype, "EnableE2EAttributes", {
+            /**
+             * @inheritdoc
+             */
+            get: function () {
+                return false;
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(SacDefaultConfigurationService.prototype, "HelptextMode", {
             /**
              * @inheritdoc
@@ -932,10 +959,6 @@
     SacDefaultConfigurationService.decorators = [
         { type: i0.Injectable, args: [{ providedIn: 'root' },] }
     ];
-    /**
-     * injection token for component configuration service
-     */
-    var SACCONFIGURATION_SERVICE = new i0.InjectionToken('SacConfigurationService');
 
     /**
      * Klasse für API Request zum löschen eines Files
@@ -1035,10 +1058,13 @@
         return BrowserNodeRequest;
     }());
 
+    // #region Variables
     /**
      * Injection Token für Language Service
      */
     var SACFILEBROWSER_SERVICE = new i0.InjectionToken('FileBrowserService');
+    // #endregion Variables
+    // #region Exported Classes
     /**
      * Abstrakte Implementierung des File Service für die Browser Component
      */
@@ -1058,6 +1084,7 @@
      */
     var SacDefaultFileBrowserService = /** @class */ (function (_super) {
         __extends(SacDefaultFileBrowserService, _super);
+        // #region Constructors
         /**
          * Konstruktor
          * @param httpclient HTTP Client Service
@@ -1067,18 +1094,20 @@
             _this.httpclient = httpclient;
             return _this;
         }
+        // #endregion Constructors
+        // #region Public Methods
         /**
-         * Gibt einen Node zurück
+         * Löscht eine Datei
          * @param apiurl URL zu API Service
-         * @param path Pfad des Node welcher angefordert wird
-         * @param allowedextensions Erlaubte Extensions die angezeigt werden dürfen
+         * @param path Pfad des Files welches gelöscht werden soll
+         * @param allowedextensions Erlaubte Extensions für Files
          */
-        SacDefaultFileBrowserService.prototype.GetNode = function (apiurl, path, allowedextensions) {
-            var url = apiurl + "/getnodes";
+        SacDefaultFileBrowserService.prototype.DeleteFile = function (apiurl, path, allowedextensions) {
+            var url = apiurl + "/deletefile";
             if (!path) {
                 path = '';
             }
-            var request = new BrowserNodeRequest({
+            var request = new BrowserFileDeleteRequest({
                 Path: path,
                 AllowedTypes: allowedextensions,
             });
@@ -1087,113 +1116,115 @@
             });
         };
         /**
-         * Speichert einen Node
+         * Löscht einen Node
          * @param apiurl URL zu API Service
-         * @param path Pfad in welchem der Node gespeichert werden soll
-         * @param newFoldername Name des neuen Nodes
+         * @param path Pfad des Nodes welcher gelöscht werden soll
          */
-        SacDefaultFileBrowserService.prototype.SaveNode = function (apiurl, path, newFoldername) {
-            var url = apiurl + "/newnode";
+        SacDefaultFileBrowserService.prototype.DeleteNode = function (apiurl, path) {
+            var url = apiurl + "/deletenode";
             if (!path) {
                 path = '';
             }
-            var request = new BrowserNodeNewRequest({
+            var request = new BrowserNodeDeleteRequest({
                 Path: path,
-                NewFoldername: newFoldername,
             });
             return this.httpclient.post(url, request, {
                 withCredentials: true,
             });
         };
         /**
-         * Rename eines Nodes
+         * Methode welche die Dateien eines Nodes ausliest
          * @param apiurl URL zu API Service
-         * @param path Pfad des Nodes welcher umbenannt werden soll
-         * @param newFoldername Neuer Name des Nodes
+         * @param path Pfad des Nodes in welchem die Files gelesen werden sollen
+         * @param allowedextensions Erlaubte File Extensions
          */
-        SacDefaultFileBrowserService.prototype.RenameNode = function (apiurl, path, newFoldername) {
-            var url = apiurl + "/renamenode";
+        SacDefaultFileBrowserService.prototype.GetFiles = function (apiurl, path, allowedextensions) {
+            var url = apiurl + "/getfiles";
             if (!path) {
                 path = '';
             }
-            var request = new BrowserNodeRenameRequest({
+            var request = new BrowserNodeRequest({
                 Path: path,
-                NewFoldername: newFoldername,
+                AllowedTypes: allowedextensions,
             });
-            return this.httpclient.put(url, request, {
+            return this.httpclient.post(url, request, {
                 withCredentials: true,
             });
         };
         /**
-         * Löscht einen Node
+         * Gibt einen Node zurück
          * @param apiurl URL zu API Service
-         * @param path Pfad des Nodes welcher gelöscht werden soll
+         * @param path Pfad des Node welcher angefordert wird
+         * @param allowedextensions Erlaubte Extensions die angezeigt werden dürfen
          */
-        SacDefaultFileBrowserService.prototype.DeleteNode = function (apiurl, path) {
-            var url = apiurl + "/deletenode";
+        SacDefaultFileBrowserService.prototype.GetNode = function (apiurl, path, allowedextensions) {
+            var url = apiurl + "/getnodes";
             if (!path) {
                 path = '';
             }
-            var request = new BrowserNodeDeleteRequest({
+            var request = new BrowserNodeRequest({
                 Path: path,
+                AllowedTypes: allowedextensions,
             });
             return this.httpclient.post(url, request, {
                 withCredentials: true,
             });
         };
         /**
-         * Methode welche die Dateien eines Nodes ausliest
+         * Methode welche eine Datei umbenannt
          * @param apiurl URL zu API Service
-         * @param path Pfad des Nodes in welchem die Files gelesen werden sollen
-         * @param allowedextensions Erlaubte File Extensions
+         * @param path Pfad zum File welches umbenannt werden soll
+         * @param newFilename Neuer Dateiname
+         * @param allowedextensions Erlaubte Extension für Files
          */
-        SacDefaultFileBrowserService.prototype.GetFiles = function (apiurl, path, allowedextensions) {
-            var url = apiurl + "/getfiles";
+        SacDefaultFileBrowserService.prototype.RenameFile = function (apiurl, path, newFilename, allowedextensions) {
+            var url = apiurl + "/renamefile";
             if (!path) {
                 path = '';
             }
-            var request = new BrowserNodeRequest({
+            var request = new BrowserFileRenameRequest({
                 Path: path,
+                NewFilename: newFilename,
                 AllowedTypes: allowedextensions,
             });
-            return this.httpclient.post(url, request, {
+            return this.httpclient.put(url, request, {
                 withCredentials: true,
             });
         };
         /**
-         * Speichert eine Hochgeladene Datei in der Struktur
+         * Rename eines Nodes
          * @param apiurl URL zu API Service
-         * @param path Pfad in welchem das neue File gespeichert werden soll
-         * @param id ID des Uploads
-         * @param allowedextensions Erlaubte Extensions für den Upload
+         * @param path Pfad des Nodes welcher umbenannt werden soll
+         * @param newFoldername Neuer Name des Nodes
          */
-        SacDefaultFileBrowserService.prototype.SaveFile = function (apiurl, path, id, allowedextensions) {
-            var url = apiurl + "/uploadfile";
+        SacDefaultFileBrowserService.prototype.RenameNode = function (apiurl, path, newFoldername) {
+            var url = apiurl + "/renamenode";
             if (!path) {
                 path = '';
             }
-            var request = new BrowserFileSaveRequest({
+            var request = new BrowserNodeRenameRequest({
                 Path: path,
-                UploadId: id,
-                AllowedTypes: allowedextensions,
+                NewFoldername: newFoldername,
             });
-            return this.httpclient.post(url, request, {
+            return this.httpclient.put(url, request, {
                 withCredentials: true,
             });
         };
         /**
-         * Löscht eine Datei
+         * Speichert eine Hochgeladene Datei in der Struktur
          * @param apiurl URL zu API Service
-         * @param path Pfad des Files welches gelöscht werden soll
-         * @param allowedextensions Erlaubte Extensions für Files
+         * @param path Pfad in welchem das neue File gespeichert werden soll
+         * @param id ID des Uploads
+         * @param allowedextensions Erlaubte Extensions für den Upload
          */
-        SacDefaultFileBrowserService.prototype.DeleteFile = function (apiurl, path, allowedextensions) {
-            var url = apiurl + "/deletefile";
+        SacDefaultFileBrowserService.prototype.SaveFile = function (apiurl, path, id, allowedextensions) {
+            var url = apiurl + "/uploadfile";
             if (!path) {
                 path = '';
             }
-            var request = new BrowserFileDeleteRequest({
+            var request = new BrowserFileSaveRequest({
                 Path: path,
+                UploadId: id,
                 AllowedTypes: allowedextensions,
             });
             return this.httpclient.post(url, request, {
@@ -1201,23 +1232,21 @@
             });
         };
         /**
-         * Methode welche eine Datei umbenannt
+         * Speichert einen Node
          * @param apiurl URL zu API Service
-         * @param path Pfad zum File welches umbenannt werden soll
-         * @param newFilename Neuer Dateiname
-         * @param allowedextensions Erlaubte Extension für Files
+         * @param path Pfad in welchem der Node gespeichert werden soll
+         * @param newFoldername Name des neuen Nodes
          */
-        SacDefaultFileBrowserService.prototype.RenameFile = function (apiurl, path, newFilename, allowedextensions) {
-            var url = apiurl + "/renamefile";
+        SacDefaultFileBrowserService.prototype.SaveNode = function (apiurl, path, newFoldername) {
+            var url = apiurl + "/newnode";
             if (!path) {
                 path = '';
             }
-            var request = new BrowserFileRenameRequest({
+            var request = new BrowserNodeNewRequest({
                 Path: path,
-                NewFilename: newFilename,
-                AllowedTypes: allowedextensions,
+                NewFoldername: newFoldername,
             });
-            return this.httpclient.put(url, request, {
+            return this.httpclient.post(url, request, {
                 withCredentials: true,
             });
         };
@@ -1401,6 +1430,56 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(SacDefaultIconService.prototype, "GridButtonDefaultDeleteIcon", {
+            /**
+             * @inheritdoc
+             */
+            get: function () {
+                return 'fa-trash';
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(SacDefaultIconService.prototype, "GridButtonDefaultDeleteIconSet", {
+            /**
+             * @inheritdoc
+             */
+            get: function () {
+                return 'fa';
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(SacDefaultIconService.prototype, "GridButtonDefaultEditIcon", {
+            /**
+             * @inheritdoc
+             */
+            get: function () {
+                return 'fa-pen';
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(SacDefaultIconService.prototype, "GridButtonDefaultEditIconSet", {
+            /**
+             * @inheritdoc
+             */
+            get: function () {
+                return 'fa';
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(SacDefaultIconService.prototype, "GridButtonDisabledIconSuffix", {
+            /**
+             * @inheritdoc
+             */
+            get: function () {
+                return ' disabled';
+            },
+            enumerable: false,
+            configurable: true
+        });
         Object.defineProperty(SacDefaultIconService.prototype, "GridComponentSortDown", {
             /**
              * @inheritdoc
@@ -1566,10 +1645,13 @@
         IconType[IconType["CssSprite"] = 2] = "CssSprite";
     })(exports.IconType || (exports.IconType = {}));
 
+    // #region Variables
     /**
      * injection token for language service
      */
     var SACLANGUAGE_SERVICE = new i0.InjectionToken('SacLanguageService');
+    // #endregion Variables
+    // #region Exported Classes
     /**
      * abstract class for languages provides in components
      */
@@ -1590,6 +1672,7 @@
         function SacDefaultLanguageService() {
             return _super !== null && _super.apply(this, arguments) || this;
         }
+        // #region Public Methods
         /**
          * @inheritdoc
          */
@@ -2591,10 +2674,10 @@
         return obj;
     }
 
-    // #region Functions
     /**
      * create a guid with crypto library if availabe and a fallback to Math.Random implementation
      */
+    // #region Exported Functions
     function createGuid() {
         if (typeof crypto !== undefined && crypto['randomUUID'] !== undefined) {
             // return guid without hyphen
@@ -2602,12 +2685,12 @@
         }
         else {
             return 'xxxxxxxxxxxx4xxxyxxxxxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
-                var r = (Math.random() * 16) | 0, v = c == 'x' ? r : (r & 0x3) | 0x8;
+                var r = (Math.random() * 16) | 0, v = c === 'x' ? r : (r & 0x3) | 0x8;
                 return v.toString(16);
             });
         }
     }
-    // #endregion Functions
+    // #endregion Exported Functions
 
     /**
      * Abstract Klasse für SacBaseModelControl. Implements ControlValueAccessor, Validator, OnInit
@@ -2667,6 +2750,10 @@
              * Deaktiviert das Label im Template
              */
             this.disablelabel = false;
+            /**
+             * Identifier used for the E2E data attribute.
+             */
+            this.e2eidentifier = null;
             /**
              * Text to support the user during input.
              */
@@ -3158,6 +3245,7 @@
         componentHeight: [{ type: i0.Input }],
         disabled: [{ type: i0.Input }],
         disablelabel: [{ type: i0.Input }],
+        e2eidentifier: [{ type: i0.Input }],
         helptext: [{ type: i0.Input }],
         helptextmode: [{ type: i0.Input }],
         inlineError: [{ type: i0.Input }],
@@ -4056,12 +4144,15 @@
      * Base Komponente für Dialog
      */
     var SacDialogCommon = /** @class */ (function () {
+        // #endregion Properties
+        // #region Constructors
         /**
          * Konstruktor
          * Inject des Formulars
          */
         function SacDialogCommon(cdRef) {
             this.cdRef = cdRef;
+            // #region Properties
             this.hasSetBodyTag = false;
             /**
              * Boolean Property definiert ob das Dialog angezeigt wird
@@ -4084,20 +4175,26 @@
              * Steuert ob im Header des Dialogs ein Button angezeigt wird.
              */
             this.closebutton = true;
+            /**
+             * Identifier used for the E2E data attribute.
+             */
+            this.e2eidentifier = null;
             /**
              * Output Emitter. Wird aufgerufen, wenn das Wert des _show property geändert ist - damait das Dialog geöfnet/geschlossen wird.
              */
             this.isvisibleChange = new i0.EventEmitter();
             /**
-             * Input Property. Erhält den Namen des Dialog - benutzt für das ID. Default Value: ''
+             * name of control
              */
-            this.name = '';
+            this.name = createGuid();
             /**
              * Input Property. Erhält den Title des Dialog. Default Value: 'Dialog'.
              */
             this.title = 'Dialog';
         }
         Object.defineProperty(SacDialogCommon.prototype, "dialogElementSetter", {
+            // #endregion Constructors
+            // #region Public Getters And Setters
             /**
              * Implementation als Setter, da mit ngIf das Element bei Unsichtbarkeit UNDEFINED ist.
              */
@@ -4118,15 +4215,11 @@
              * Setter. Erhält das boolen Wert des _show property
              */
             set: function (v) {
-                if (v &&
-                    !this.hasSetBodyTag &&
-                    !document.body.classList.contains('modal-open')) {
+                if (v && !this.hasSetBodyTag && !document.body.classList.contains('modal-open')) {
                     document.body.classList.add('modal-open');
                     this.hasSetBodyTag = true;
                 }
-                if (!v &&
-                    this.hasSetBodyTag &&
-                    document.body.classList.contains('modal-open')) {
+                if (!v && this.hasSetBodyTag && document.body.classList.contains('modal-open')) {
                     document.body.classList.remove('modal-open');
                     this.hasSetBodyTag = false;
                 }
@@ -4149,6 +4242,8 @@
             configurable: true
         });
         Object.defineProperty(SacDialogCommon.prototype, "ChangeDetector", {
+            // #endregion Public Getters And Setters
+            // #region Protected Getters And Setters
             /**
              * Getter for ChangeDetector.
              */
@@ -4158,6 +4253,8 @@
             enumerable: false,
             configurable: true
         });
+        // #endregion Protected Getters And Setters
+        // #region Public Methods
         /**
          * Die Methode setz den Wert des _show property auf false
          */
@@ -4204,8 +4301,7 @@
          */
         SacDialogCommon.prototype.show = function () {
             this._show = true;
-            if (!this.hasSetBodyTag &&
-                !document.body.classList.contains('modal-open')) {
+            if (!this.hasSetBodyTag && !document.body.classList.contains('modal-open')) {
                 document.body.classList.add('modal-open');
                 this.hasSetBodyTag = true;
             }
@@ -4223,6 +4319,7 @@
         allowesc: [{ type: i0.Input }],
         backdrop: [{ type: i0.Input }],
         closebutton: [{ type: i0.Input }],
+        e2eidentifier: [{ type: i0.Input }],
         isvisibleChange: [{ type: i0.Output }],
         name: [{ type: i0.Input }],
         title: [{ type: i0.Input }],
@@ -4233,8 +4330,7 @@
         onKeydownHandler: [{ type: i0.HostListener, args: ['document:keydown', ['$event'],] }]
     };
 
-    // #endregion Type aliases
-    // #region Classes
+    // #region Exported Classes
     /**
      * Base Komponente für SacFormular
      */
@@ -4367,7 +4463,7 @@
     SacFormCommon.propDecorators = {
         updateon: [{ type: i0.Input }]
     };
-    // #endregion Classes
+    // #endregion Exported Types
 
     /**
      * Abstract Klasse für SacBaseListControl. Extendes SacBaseModelControl
@@ -4461,6 +4557,7 @@
      * @param id ID
      * @param value Wert der an das Element gebunden werden soll
      */
+    // #region Exported Functions
     function _buildValueString(id, value) {
         // Wenn ID null ist Object zurückgeben
         if (id == null) {
@@ -4473,12 +4570,15 @@
         // String als ID
         return (id + ": " + value).slice(0, 50);
     }
+    // #endregion Exported Functions
 
     /**
      * Base Dropdown Komponente
      */
     var SacDropdownCommon = /** @class */ (function (_super) {
         __extends(SacDropdownCommon, _super);
+        // #endregion Properties
+        // #region Constructors
         /**
          * Constructor
          * @param formlayout SacFormLayoutCommon to define scoped layout settings
@@ -4490,6 +4590,7 @@
             var _this = _super.call(this, formlayout, injector) || this;
             _this.renderer = renderer;
             _this.elementRef = elementRef;
+            // #region Properties
             /**
              * compareWith-Funktion
              */
@@ -4521,6 +4622,8 @@
             return _this;
         }
         Object.defineProperty(SacDropdownCommon.prototype, "comparewith", {
+            // #endregion Constructors
+            // #region Public Getters And Setters
             /**
              * compareWith-Funktion
              */
@@ -4533,6 +4636,8 @@
             enumerable: false,
             configurable: true
         });
+        // #endregion Public Getters And Setters
+        // #region Public Methods
         /**
          * Registriert das OptionID-Counter als String
          */
@@ -4583,6 +4688,8 @@
             this.setSelectedValue(value);
             _super.prototype.writeValue.call(this, value);
         };
+        // #endregion Public Methods
+        // #region Private Methods
         /**
          * ID extrahieren
          * @param valueString String bei welchem die ID Extrahiert werden soll
@@ -4663,6 +4770,8 @@
      * SacDropdownOption-Klasse
      */
     var SacDropdownOptionCommon = /** @class */ (function () {
+        // #endregion Properties
+        // #region Constructors
         /**
          * Konstruktor
          * @param _element Referenz auf HTML Element
@@ -4673,6 +4782,7 @@
             this._element = _element;
             this._renderer = _renderer;
             this._dropdown = _dropdown;
+            // #region Properties
             /**
              * ID-String
              */
@@ -4682,6 +4792,8 @@
             }
         }
         Object.defineProperty(SacDropdownOptionCommon.prototype, "ngValue", {
+            // #endregion Constructors
+            // #region Public Getters And Setters
             /**
              * Option ngValue
              */
@@ -4707,6 +4819,8 @@
             enumerable: false,
             configurable: true
         });
+        // #endregion Public Getters And Setters
+        // #region Public Methods
         /**
          * Den Wert vom Option-Element einstellen
          * @param value Wert
@@ -4763,7 +4877,7 @@
                 this._listbox.registerOption(this);
             }
         }
-        Object.defineProperty(SacListboxOptionCommon.prototype, "ngvalue", {
+        Object.defineProperty(SacListboxOptionCommon.prototype, "ngValue", {
             // #endregion Constructors
             // #region Public Getters And Setters
             /**
@@ -4820,7 +4934,7 @@
         { type: SacListboxCommon }
     ]; };
     SacListboxOptionCommon.propDecorators = {
-        ngvalue: [{ type: i0.Input }],
+        ngValue: [{ type: i0.Input }],
         value: [{ type: i0.Input }]
     };
     /**
@@ -4939,42 +5053,40 @@
      */
     var SacTabCommon = /** @class */ (function () {
         function SacTabCommon() {
+            // #region Properties
             /**
-             * control name
+             * Identifier used for the E2E data attribute.
              */
-            this.name = '';
+            this.e2eidentifier = null;
             /**
-             * dispose tabs when they are hidden
+             * name of control
              */
-            this.unloadtabitemswhenhidden = null;
+            this.name = createGuid();
             /**
              * Event when new tab is selected
              */
             this.tabselected = new i0.EventEmitter();
+            /**
+             * dispose tabs when they are hidden
+             */
+            this.unloadtabitemswhenhidden = null;
+            // #endregion Private Methods
         }
-        // #region Control initialisieren
+        // #endregion Properties
+        // #region Public Methods
         /**
-         * AfterContentInit Event
+         * get id of tab button
+         * @param tabitemid id of tab
          */
-        SacTabCommon.prototype.ngAfterContentInit = function () {
-            this.initTabs();
+        SacTabCommon.prototype.GetTabItemButtonId = function (tabitemid) {
+            return this.name + '_' + tabitemid;
         };
         /**
-         * Initialisiert die Tabs
+         * AfterContentInit Event
          */
-        SacTabCommon.prototype.initTabs = function () {
-            var _this = this;
-            var activeTab = this.tabItems().filter(function (tab) { return tab.active; });
-            this.tabItems().forEach(function (itm) {
-                if (_this.unloadtabitemswhenhidden !== null) {
-                    itm.unloadwhenhidden = _this.unloadtabitemswhenhidden;
-                }
-            });
-            if (activeTab.length === 0) {
-                this.selectTab(this.tabItems()[0]);
-            }
+        SacTabCommon.prototype.ngAfterContentInit = function () {
+            this.initTabs();
         };
-        // #endregion
         /**
          * select new tab
          * @param tab tab that should be selected
@@ -4988,12 +5100,22 @@
             tab.active = true;
             this.tabselected.emit(tab.id);
         };
+        // #endregion Public Methods
+        // #region Private Methods
         /**
-         * get id of tab button
-         * @param tabitemid id of tab
+         * Initialisiert die Tabs
          */
-        SacTabCommon.prototype.GetTabItemButtonId = function (tabitemid) {
-            return this.name + '_' + tabitemid;
+        SacTabCommon.prototype.initTabs = function () {
+            var _this = this;
+            var activeTab = this.tabItems().filter(function (tab) { return tab.active; });
+            this.tabItems().forEach(function (itm) {
+                if (_this.unloadtabitemswhenhidden !== null) {
+                    itm.unloadwhenhidden = _this.unloadtabitemswhenhidden;
+                }
+            });
+            if (activeTab.length === 0) {
+                this.selectTab(this.tabItems()[0]);
+            }
         };
         return SacTabCommon;
     }());
@@ -5001,10 +5123,11 @@
         { type: i0.Directive }
     ];
     SacTabCommon.propDecorators = {
+        e2eidentifier: [{ type: i0.Input }],
         name: [{ type: i0.Input }],
         tablabeltemplate: [{ type: i0.Input }],
-        unloadtabitemswhenhidden: [{ type: i0.Input }],
-        tabselected: [{ type: i0.Output }]
+        tabselected: [{ type: i0.Output }],
+        unloadtabitemswhenhidden: [{ type: i0.Input }]
     };
 
     /**
@@ -5012,6 +5135,7 @@
      */
     var SacTabItemCommon = /** @class */ (function () {
         function SacTabItemCommon() {
+            // #region Properties
             /**
              * Boolean Property prüft ob das Tab aktiv ist
              */
@@ -5024,6 +5148,7 @@
              * Das Input property ekzeptiert boolen Wert. Default ist true. Definiert, ob die Komponente hidden sein sollte.
              */
             this.unloadwhenhidden = true;
+            // #endregion Properties
         }
         return SacTabItemCommon;
     }());
@@ -5035,8 +5160,8 @@
         disabled: [{ type: i0.Input }],
         id: [{ type: i0.Input }],
         label: [{ type: i0.Input }],
-        unloadwhenhidden: [{ type: i0.Input }],
-        templateRef: [{ type: i0.ContentChild, args: [i0.TemplateRef, { static: true },] }]
+        templateRef: [{ type: i0.ContentChild, args: [i0.TemplateRef, { static: true },] }],
+        unloadwhenhidden: [{ type: i0.Input }]
     };
 
     /**
@@ -5051,9 +5176,13 @@
          */
         function SacValidationSummaryCommon(parent, injector) {
             /**
-             * Name-Property
+             * Identifier used for the E2E data attribute.
              */
-            this.name = '';
+            this.e2eidentifier = null;
+            /**
+             * name of control
+             */
+            this.name = createGuid();
             this.parent = parent;
             this.validationKeyService = injector.get(SACVALIDATIONKEY_SERVICE, new SacDefaultValidationKeyService());
             this.lngResourceService = injector.get(SACLOCALISATION_SERVICE, new SacDefaultLocalisationService(this.validationKeyService));
@@ -5172,6 +5301,7 @@
         { type: i0.Injector }
     ]; };
     SacValidationSummaryCommon.propDecorators = {
+        e2eidentifier: [{ type: i0.Input }],
         form: [{ type: i0.Input }],
         formGroupName: [{ type: i0.Input }],
         name: [{ type: i0.Input }]
@@ -5819,14 +5949,14 @@
              * Text welcher auf dem Button angezeigt wird
              */
             _this.buttontext = '';
-            /**
-             * Name des Such-Icons
-             */
-            _this.iconname = '';
             /**
              * Event wenn auf das Such-Icon geclickt wird
              */
             _this.clicked = new i0.EventEmitter();
+            /**
+             * Name des Such-Icons
+             */
+            _this.iconname = '';
             return _this;
             // #endregion Private Methods
         }
@@ -5870,14 +6000,29 @@
     SacInputSearchCommon.propDecorators = {
         buttonmode: [{ type: i0.Input }],
         buttontext: [{ type: i0.Input }],
-        iconname: [{ type: i0.Input }],
-        clicked: [{ type: i0.Output }]
+        clicked: [{ type: i0.Output }],
+        iconname: [{ type: i0.Input }]
     };
 
-    // #region Classes
     /**
      * GridResponse class
      */
+    (function (SortOrder) {
+        /**
+         * No sorting
+         */
+        SortOrder[SortOrder["None"] = 0] = "None";
+        /**
+         * Ascending
+         */
+        SortOrder[SortOrder["Ascending"] = 1] = "Ascending";
+        /**
+         * Descending
+         */
+        SortOrder[SortOrder["Descending"] = 2] = "Descending";
+    })(exports.SortOrder || (exports.SortOrder = {}));
+    // #endregion Exported Enums
+    // #region Exported Classes
     var GridResponse = /** @class */ (function () {
         function GridResponse() {
         }
@@ -5958,21 +6103,7 @@
         }
         return SortDescriptor;
     }());
-    (function (SortOrder) {
-        /**
-         * No sorting
-         */
-        SortOrder[SortOrder["None"] = 0] = "None";
-        /**
-         * Ascending
-         */
-        SortOrder[SortOrder["Ascending"] = 1] = "Ascending";
-        /**
-         * Descending
-         */
-        SortOrder[SortOrder["Descending"] = 2] = "Descending";
-    })(exports.SortOrder || (exports.SortOrder = {}));
-    // #endregion Enums
+    // #endregion Exported Classes
 
     /**
      * Basic component for SacGrid
@@ -6000,6 +6131,18 @@
              * Contains Array of Pages.
              */
             this.paginators = [];
+            /**
+             * Number of columns in the grid
+             */
+            this.ColumnCount = 0;
+            /**
+             * Identifier used for the E2E data attribute.
+             */
+            this.e2eidentifier = null;
+            /**
+             * name of control
+             */
+            this.name = createGuid();
             /**
              * Deactivates the selection of the PageSize in the pager
              */
@@ -6012,14 +6155,6 @@
              * Event when the pager is clicked.
              */
             this.paging = new i0.EventEmitter();
-            /**
-             * Event when a header is clicked so that the grid is sorted.
-             */
-            this.sorting = new i0.EventEmitter();
-            /**
-             * Number of columns in the grid
-             */
-            this.ColumnCount = 0;
             /**
              * Column by which currently sorted.
              */
@@ -6028,6 +6163,10 @@
              * Current direction of sorting
              */
             this.sortDirection = exports.SortOrder.None;
+            /**
+             * Event when a header is clicked so that the grid is sorted.
+             */
+            this.sorting = new i0.EventEmitter();
             this.validationKeyService = injector.get(SACVALIDATIONKEY_SERVICE, new SacDefaultValidationKeyService());
             // Set Default Values from Injector
             this.pagesizetext = this.validationKeyService.PagingEntries;
@@ -6105,6 +6244,7 @@
     ]; };
     SacGridCommon.propDecorators = {
         body: [{ type: i0.Input }],
+        e2eidentifier: [{ type: i0.Input }],
         emptytext: [{ type: i0.Input }],
         headers: [{ type: i0.Input }],
         maxvisiblepagenumbers: [{ type: i0.Input }],
@@ -6113,10 +6253,10 @@
         pagesizedisabled: [{ type: i0.Input }],
         pagesizes: [{ type: i0.Input }],
         pagesizetext: [{ type: i0.Input }],
-        pagingtext: [{ type: i0.Input }],
-        value: [{ type: i0.Input }],
         paging: [{ type: i0.Output }],
+        pagingtext: [{ type: i0.Input }],
         sorting: [{ type: i0.Output }],
+        value: [{ type: i0.Input }],
         sortdata: [{ type: i0.Input }]
     };
 
@@ -6124,28 +6264,35 @@
      * Base Grid Action Button
      */
     var SacGridButtonCommon = /** @class */ (function () {
-        function SacGridButtonCommon() {
-            // #region Properties
+        // #endregion Properties
+        // #region Constructors
+        /**
+         * Constructor
+         *
+         * @param injector Injector to resovle services
+         */
+        function SacGridButtonCommon(injector) {
+            this.injector = injector;
             /**
              * Button is deactivated
              */
             this._isdisabledvalue = false;
-            /**
-             * Input property for styling the button. Defines the CSS classes of the button
-             */
-            this.iconstyle = '';
             /**
              * Event when the button is clicked
              */
             this.clicked = new i0.EventEmitter();
-            // #endregion Public Methods
+            /**
+             * Input property for styling the button. Defines the CSS classes of the button
+             */
+            this.iconstyle = '';
+            this.iconService = injector.get(SACICON_SERVICE, new SacDefaultIconService());
         }
         Object.defineProperty(SacGridButtonCommon.prototype, "isdisabled", {
+            // #endregion Constructors
+            // #region Public Getters And Setters
             get: function () {
                 return this._isdisabledvalue;
             },
-            // #endregion Properties
-            // #region Public Getters And Setters
             /**
              * Deactivating buttons
              * @param v Deactivates the button. Can be a Boolean or the strings `true` or `false`.
@@ -6172,15 +6319,48 @@
                 this.clicked.emit(this.iconstyle);
             }
         };
+        /**
+         * Defines the CSS class for the icon on the button
+         */
+        SacGridButtonCommon.prototype.getIconClass = function () {
+            var cssclass;
+            // Handle Default Icons
+            if (this.iconstyle === '') {
+                switch (this.icon) {
+                    case 'edit':
+                        cssclass = this.iconService.GridButtonDefaultEditIconSet + " " + this.iconService.GridButtonDefaultEditIcon;
+                        break;
+                    case 'delete':
+                        cssclass = this.iconService.GridButtonDefaultDeleteIconSet + " " + this.iconService.GridButtonDefaultDeleteIcon;
+                        break;
+                    default:
+                        cssclass = this.icon;
+                        break;
+                }
+            }
+            else {
+                cssclass = this.iconstyle + " " + this.icon;
+            }
+            // trim style
+            cssclass = cssclass.trim();
+            if (this._isdisabledvalue) {
+                cssclass += this.iconService.GridButtonDisabledIconSuffix;
+            }
+            return cssclass;
+        };
         return SacGridButtonCommon;
     }());
     SacGridButtonCommon.decorators = [
         { type: i0.Directive }
     ];
+    SacGridButtonCommon.ctorParameters = function () { return [
+        { type: i0.Injector }
+    ]; };
     SacGridButtonCommon.propDecorators = {
+        clicked: [{ type: i0.Output }],
         icon: [{ type: i0.Input }],
         iconstyle: [{ type: i0.Input }],
-        clicked: [{ type: i0.Output }],
+        name: [{ type: i0.Input }],
         isdisabled: [{ type: i0.Input }]
     };
 
@@ -6200,6 +6380,10 @@
             this.grid = grid;
             this.injector = injector;
             this.el = el;
+            /**
+             * Align the column
+             */
+            this.alignment = 'left';
             /**
              * Click on Column Element
              */
@@ -6279,9 +6463,7 @@
          * Triggers the events so that the table is sorted according to this column.
          */
         SacGridColumnBaseCommon.prototype.SortByColumn = function () {
-            if (this.sortkey !== undefined &&
-                this.sortkey !== null &&
-                this.sortkey !== '') {
+            if (this.sortkey !== undefined && this.sortkey !== null && this.sortkey !== '') {
                 return this.grid.SortBy(this.sortkey);
             }
         };
@@ -6289,6 +6471,12 @@
          * Called when the component is destroyed.
          */
         SacGridColumnBaseCommon.prototype.ngOnDestroy = function () {
+            if (this.headerElement) {
+                this.headerElement.nativeElement.remove();
+            }
+            if (this.bodyElement) {
+                this.bodyElement.nativeElement.remove();
+            }
             if (this.IsHeader()) {
                 this.grid.UnregisterColumn();
             }
@@ -6318,13 +6506,16 @@
         { type: i0.ElementRef }
     ]; };
     SacGridColumnBaseCommon.propDecorators = {
+        alignment: [{ type: i0.Input }],
+        bodyElement: [{ type: i0.ViewChild, args: ['bodyElement', { static: false },] }],
         header: [{ type: i0.Input }],
+        headerElement: [{ type: i0.ViewChild, args: ['headerElement', { static: false },] }],
         name: [{ type: i0.Input }],
+        rowclicked: [{ type: i0.Output }],
         sortkey: [{ type: i0.Input }],
         type: [{ type: i0.Input }],
         value: [{ type: i0.Input }],
-        width: [{ type: i0.Input }],
-        rowclicked: [{ type: i0.Output }]
+        width: [{ type: i0.Input }]
     };
 
     /**
@@ -6347,14 +6538,14 @@
             return _this;
         }
         Object.defineProperty(SacGridColumnCommon.prototype, "ellipsis", {
+            // #endregion Constructors
+            // #region Public Getters And Setters
             /**
              * Getter for the ellipsis property. Always returns a boolean type.
              */
             get: function () {
                 return this._ellipsis;
             },
-            // #endregion Constructors
-            // #region Public Getters And Setters
             /**
              * Sets the ellipsis property. Can be a Boolean or the strings `true` or `false`.
              */
@@ -6443,6 +6634,30 @@
              * Total number of rows
              */
             this.totalRowCount = 0;
+            /**
+             * Active page index
+             */
+            this.activePageIndex = 0;
+            /**
+             * Identifier used for the E2E data attribute.
+             */
+            this.e2eidentifier = null;
+            /**
+             * First page index
+             */
+            this.firstPageIndex = 0;
+            /**
+             * Last page index
+             */
+            this.lastPageIndex = 0;
+            /**
+             * name of control
+             */
+            this.name = createGuid();
+            /**
+             * Number of elements per page
+             */
+            this.pageSize = 20;
             /**
              * Deactivate page size selection
              */
@@ -6460,59 +6675,28 @@
              */
             this.pagesizetext = '';
             /**
-             * Text in pager for 'Page x of y'. The following interpolation texts are available:
-             * {{CURRENTPAGE}}: Current page
-             * {{TOTALPAGES}}: Number of pages
+             * Item for each paging element (page number)
              */
-            this.pagingtext = '';
+            this.paginators = [];
             /**
              * Event when the page is changed in the grid. The new PageIndex is given as a parameter.
              */
             this.paging = new i0.EventEmitter();
             /**
-             * Active page index
-             */
-            this.activePageIndex = 0;
-            /**
-             * First page index
-             */
-            this.firstPageIndex = 0;
-            /**
-             * Last page index
-             */
-            this.lastPageIndex = 0;
-            /**
-             * Number of elements per page
-             */
-            this.pageSize = 20;
-            /**
-             * Item for each paging element (page number)
+             * Text in pager for 'Page x of y'. The following interpolation texts are available:
+             * {{CURRENTPAGE}}: Current page
+             * {{TOTALPAGES}}: Number of pages
              */
-            this.paginators = [];
+            this.pagingtext = '';
             this.validationKeyService = injector.get(SACVALIDATIONKEY_SERVICE, new SacDefaultValidationKeyService());
             // Set Default Values from Injector
             this.pagesizetext = this.validationKeyService.PagingEntries;
             this.pagingtext = this.validationKeyService.PagingPageOf;
             this.lngResourceService = injector.get(SACLOCALISATION_SERVICE, new SacDefaultLocalisationService(this.validationKeyService));
         }
-        Object.defineProperty(SacPagingCommon.prototype, "pagerdata", {
+        Object.defineProperty(SacPagingCommon.prototype, "PageSizeText", {
             // #endregion Constructors
             // #region Public Getters And Setters
-            /**
-             * Property for Pager Data
-             */
-            set: function (p) {
-                if (p != null) {
-                    this.totalRowCount = p.TotalRowCount;
-                    this.activePageIndex = p.CurrentPageIndex;
-                    this.pageSize = p.PageSize;
-                }
-                this.createPager();
-            },
-            enumerable: false,
-            configurable: true
-        });
-        Object.defineProperty(SacPagingCommon.prototype, "PageSizeText", {
             /**
              * Property with text for total entries in page
              */
@@ -6545,6 +6729,21 @@
             enumerable: false,
             configurable: true
         });
+        Object.defineProperty(SacPagingCommon.prototype, "pagerdata", {
+            /**
+             * Property for Pager Data
+             */
+            set: function (p) {
+                if (p != null) {
+                    this.totalRowCount = p.TotalRowCount;
+                    this.activePageIndex = p.CurrentPageIndex;
+                    this.pageSize = p.PageSize;
+                }
+                this.createPager();
+            },
+            enumerable: false,
+            configurable: true
+        });
         // #endregion Public Getters And Setters
         // #region Public Methods
         /**
@@ -6683,12 +6882,13 @@
         { type: i0.Injector }
     ]; };
     SacPagingCommon.propDecorators = {
+        e2eidentifier: [{ type: i0.Input }],
         name: [{ type: i0.Input }],
         pagesizedisabled: [{ type: i0.Input }],
         pagesizes: [{ type: i0.Input }],
         pagesizetext: [{ type: i0.Input }],
-        pagingtext: [{ type: i0.Input }],
         paging: [{ type: i0.Output }],
+        pagingtext: [{ type: i0.Input }],
         pagerdata: [{ type: i0.Input }]
     };
 
@@ -7212,6 +7412,9 @@
                 else {
                     this.value = null;
                 }
+                // update imaks reference
+                this.cdRef.detectChanges();
+                this.iMask.maskRef.updateControl();
             },
             enumerable: false,
             configurable: true
@@ -7385,6 +7588,7 @@
         { type: i0.ChangeDetectorRef }
     ]; };
     SacBaseDateTimeControl.propDecorators = {
+        iMask: [{ type: i0.ViewChild, args: [angularImask.IMaskDirective, { static: false },] }],
         isrequired: [{ type: i0.Input }],
         pickerarrow: [{ type: i0.ViewChild, args: ['pickerarrow', { static: false },] }],
         pickerbutton: [{ type: i0.ViewChild, args: ['pickerbutton', { static: true },] }],
@@ -7671,6 +7875,14 @@
         }
         return DateSelectorItem;
     }());
+    // #endregion Classes
+    // #region Variables
+    /**
+     * Moment
+     */
+    var moment$2 = moment___default['default'];
+    // #endregion Variables
+    // #region Exported Classes
     /**
      *Basis Komponente für SacDateSelector
      */
@@ -7694,10 +7906,18 @@
              * Datum Selector
              */
             this.dateselection = false;
+            /**
+             * Identifier used for the E2E data attribute.
+             */
+            this.e2eidentifier = null;
             /**
              * Monat
              */
             this.month = 4;
+            /**
+             * name of control
+             */
+            this.name = createGuid();
             /**
              * Output Event beim Datum Selektieren
              */
@@ -7778,6 +7998,10 @@
                 tempValue.year(1900);
                 this._selectedValue = tempValue.utc();
             }
+            if (this._selectedValue === null && this._initialValue !== null) {
+                this.selectdate.emit({ date: this._initialValue.local() });
+                return;
+            }
             this.selectdate.emit({
                 date: this._selectedValue,
             });
@@ -7879,12 +8103,8 @@
          */
         SacDateSelectorCommon.prototype.selectDate = function (v) {
             if (v.isenabled) {
-                this.dates.forEach(function (date) { return date
-                    .filter(function (filter) { return filter.isnew; })
-                    .forEach(function (itm) { return (itm.isnew = false); }); });
-                this.dates.forEach(function (date) { return date
-                    .filter(function (filter) { return filter.isselected; })
-                    .forEach(function (itm) { return (itm.isselected = false); }); });
+                this.dates.forEach(function (date) { return date.filter(function (filter) { return filter.isnew; }).forEach(function (itm) { return (itm.isnew = false); }); });
+                this.dates.forEach(function (date) { return date.filter(function (filter) { return filter.isselected; }).forEach(function (itm) { return (itm.isselected = false); }); });
                 v.isnew = true;
                 v.isselected = true;
                 var dateValue = moment$2(v.date);
@@ -7912,6 +8132,9 @@
          * Setter für Stunden Uhrzeit
          */
         SacDateSelectorCommon.prototype.setHours = function (v) {
+            if (v >= 24) {
+                return;
+            }
             /**
              * Select Value setzen falls leer
              */
@@ -7927,6 +8150,9 @@
          * Setter für Minuten Uhrzeit
          */
         SacDateSelectorCommon.prototype.setMinutes = function (v) {
+            if (v >= 60) {
+                return;
+            }
             /**
              * Select Value setzen falls leer
              */
@@ -8004,9 +8230,7 @@
             for (var dayinmonth = 1; dayinmonth <= currentMonth.daysInMonth(); dayinmonth++) {
                 var isSelectedDate = false;
                 var isNewDate = false;
-                var isCurrentDate = moment$2().month() === this.month &&
-                    moment$2().year() === this.year &&
-                    moment$2().date() === dayinmonth;
+                var isCurrentDate = moment$2().month() === this.month && moment$2().year() === this.year && moment$2().date() === dayinmonth;
                 // Initial Wert setzen, falls vorhanden
                 if (this._initialValue !== null) {
                     isSelectedDate =
@@ -8058,6 +8282,11 @@
             if (this._selectedValue === null) {
                 if (this._initialValue === null) {
                     this._selectedValue = moment$2();
+                    /**
+                     * clean seconds and miliseconds for initial values
+                     */
+                    this._selectedValue.second(0);
+                    this._selectedValue.millisecond(0);
                 }
                 else {
                     this._selectedValue = this._initialValue;
@@ -8075,19 +8304,15 @@
     SacDateSelectorCommon.propDecorators = {
         autoapplyselection: [{ type: i0.Input }],
         dateselection: [{ type: i0.Input }],
+        e2eidentifier: [{ type: i0.Input }],
         month: [{ type: i0.Input }],
+        name: [{ type: i0.Input }],
         selectdate: [{ type: i0.Output }],
         timeselection: [{ type: i0.Input }],
         year: [{ type: i0.Input }],
         initialvalue: [{ type: i0.Input }]
     };
-    // #endregion Classes
-    // #region Variables
-    /**
-     * Moment
-     */
-    var moment$2 = moment___default['default'];
-    // #endregion Variables
+    // #endregion Exported Classes
 
     /**
      * Komponente für SacDateTimeCommon. Extends SacBaseDateTimeControl
@@ -8621,7 +8846,10 @@
              */
             _this.allowhtml = false;
             return _this;
+            // #endregion Public Methods
         }
+        // #endregion Properties
+        // #region Public Methods
         /**
          * Validierung des Controls
          *
@@ -8646,18 +8874,15 @@
      */
     var SacWizardCommon = /** @class */ (function () {
         function SacWizardCommon() {
-            /**
-             * Name des Controls
-             */
-            this.name = '';
+            // #region Properties
             /**
              * Boolean Property prüft ob Navigation im Wizard disabled ist; default Wert - false
              */
             this.disablenavigation = false;
             /**
-             * EventEmitter wenn der Schritt geändert wird
+             * Name des Controls
              */
-            this.stepchanged = new i0.EventEmitter();
+            this.name = '';
             /**
              * Leere Implementation von 'propagateChange'. Muss gemacht werden, damit kein Fehler entsteht
              */
@@ -8666,8 +8891,15 @@
              * Leere Implementation von 'propagateTouch'. Muss gemacht werden, damit kein Fehler entsteht
              */
             this.propagateTouch = function () { };
+            /**
+             * EventEmitter wenn der Schritt geändert wird
+             */
+            this.stepchanged = new i0.EventEmitter();
+            // #endregion Private Methods
         }
         Object.defineProperty(SacWizardCommon.prototype, "currentstep", {
+            // #endregion Properties
+            // #region Public Getters And Setters
             get: function () {
                 return this._currentstep;
             },
@@ -8681,41 +8913,8 @@
             enumerable: false,
             configurable: true
         });
-        SacWizardCommon.prototype.setStepInternal = function (step) {
-            this._currentstep = step;
-            this.propagateChange(this._currentstep);
-        };
-        // #region Control initialisieren
-        /**
-         * AfterContentInit Event
-         */
-        SacWizardCommon.prototype.ngAfterContentInit = function () {
-            this.initSteps();
-        };
-        /**
-         * Ursprünglicher Schritt wird selektiert
-         */
-        SacWizardCommon.prototype.initSteps = function () {
-            var activeStep = this.wizardItems().filter(function (step) { return step.active; });
-            if (activeStep.length === 0) {
-                var initStep = this.wizardItems().toArray()[0];
-                this.selectStep(initStep);
-                initStep.disabled = false;
-                this.setStepInternal(initStep.id);
-            }
-        };
-        // #endregion
-        /**
-         * Schritt selektieren
-         * @param step Step welcher selektiert werden soll
-         */
-        SacWizardCommon.prototype.selectStep = function (step) {
-            // Cancel if Navigation disabled
-            if (this.disablenavigation) {
-                return;
-            }
-            this.changeStep(step.id);
-        };
+        // #endregion Public Getters And Setters
+        // #region Public Methods
         /**
          * Auf nächsten/vorherigen Schritt gehen
          * @param step Step auf welchen gewechselt werden soll
@@ -8751,6 +8950,12 @@
             this.setStepInternal(step);
             this.stepchanged.emit(step);
         };
+        /**
+         * AfterContentInit Event
+         */
+        SacWizardCommon.prototype.ngAfterContentInit = function () {
+            this.initSteps();
+        };
         /**
          * Methode, damit andere Controls änderungen im Control mitbekommen können
          * Zur Änderungsinfo die Methode propagateChange aufrufen.
@@ -8764,6 +8969,17 @@
         SacWizardCommon.prototype.registerOnTouched = function (fn) {
             this.propagateTouch = function (obj) { return fn(obj); };
         };
+        /**
+         * Schritt selektieren
+         * @param step Step welcher selektiert werden soll
+         */
+        SacWizardCommon.prototype.selectStep = function (step) {
+            // Cancel if Navigation disabled
+            if (this.disablenavigation) {
+                return;
+            }
+            this.changeStep(step.id);
+        };
         /**
          * Methode zum schreiben von Werten aus dem Model in das Control
          */
@@ -8772,16 +8988,34 @@
                 this.changeStep(value);
             }
         };
+        // #endregion Public Methods
+        // #region Private Methods
+        /**
+         * Ursprünglicher Schritt wird selektiert
+         */
+        SacWizardCommon.prototype.initSteps = function () {
+            var activeStep = this.wizardItems().filter(function (step) { return step.active; });
+            if (activeStep.length === 0) {
+                var initStep = this.wizardItems().toArray()[0];
+                this.selectStep(initStep);
+                initStep.disabled = false;
+                this.setStepInternal(initStep.id);
+            }
+        };
+        SacWizardCommon.prototype.setStepInternal = function (step) {
+            this._currentstep = step;
+            this.propagateChange(this._currentstep);
+        };
         return SacWizardCommon;
     }());
     SacWizardCommon.decorators = [
         { type: i0.Directive }
     ];
     SacWizardCommon.propDecorators = {
-        name: [{ type: i0.Input }],
         disablenavigation: [{ type: i0.Input }],
-        currentstep: [{ type: i0.Input }],
-        stepchanged: [{ type: i0.Output }]
+        name: [{ type: i0.Input }],
+        stepchanged: [{ type: i0.Output }],
+        currentstep: [{ type: i0.Input }]
     };
 
     /**
@@ -8789,14 +9023,16 @@
      */
     var SacWizardItemCommon = /** @class */ (function () {
         function SacWizardItemCommon() {
-            /**
-             * Prüft ob der Schritt abgeschlossen wurde.
-             */
-            this.iscomplete = false;
+            // #region Properties
             /**
              * Prüft ob der Schritt disabled ist.
              */
             this.disabled = true;
+            /**
+             * Prüft ob der Schritt abgeschlossen wurde.
+             */
+            this.iscomplete = false;
+            // #endregion Properties
         }
         return SacWizardItemCommon;
     }());
@@ -8805,9 +9041,9 @@
     ];
     SacWizardItemCommon.propDecorators = {
         active: [{ type: i0.Input }],
-        iscomplete: [{ type: i0.Input }],
         disabled: [{ type: i0.Input }],
         id: [{ type: i0.Input }],
+        iscomplete: [{ type: i0.Input }],
         label: [{ type: i0.Input }]
     };
 
@@ -8815,6 +9051,8 @@
      * Settings für TinyMCE Dialog
      */
     var TinyMceDialogSettings = /** @class */ (function () {
+        // #endregion Properties
+        // #region Constructors
         /**
          * Konstruktor
          * @param init Initale Werte
@@ -8854,6 +9092,10 @@
                 file_picker_callback: _this.showSelectDialog,
                 save_onsavecallback: function () { },
             };
+            /**
+             * TinyMCE Config
+             */
+            _this._config = {};
             /**
              * Erlaubt im Filebrowser das löschen von Dateien
              */
@@ -8902,40 +9144,36 @@
              * Definiert das Control als Required
              */
             _this.isrequired = false;
-            /**
-             * Resource Key für Validation Message Required bei Control
-             */
-            _this.validationmessagerequired = _this.validationKeyService.ValidationErrorRequired;
-            /**
-             * Resource Key für Validation Message Required in Validation Summary
-             */
-            _this.validationmessagesummaryrequired = _this.validationKeyService.ValidationErrorSummaryRequired;
             /**
              * Event wenn Save Action in TinyMCE ausgelöst wird
              */
             _this.onsave = new i0.EventEmitter();
-            /**
-             * TinyMCE Config
-             */
-            _this._config = {};
             /**
              * Der Select Dialog wird angezeigt
              */
             _this.selectdialogvisible = false;
+            /**
+             * Resource Key für Validation Message Required bei Control
+             */
+            _this.validationmessagerequired = _this.validationKeyService.ValidationErrorRequired;
+            /**
+             * Resource Key für Validation Message Required in Validation Summary
+             */
+            _this.validationmessagesummaryrequired = _this.validationKeyService.ValidationErrorSummaryRequired;
             _this.validationKeyService = injector.get(SACVALIDATIONKEY_SERVICE, new SacDefaultValidationKeyService());
             _this.lngResourceService = injector.get(SACLOCALISATION_SERVICE, new SacDefaultLocalisationService(_this.validationKeyService));
             _this.config = {};
             return _this;
         }
         Object.defineProperty(SacTinyMceCommon.prototype, "config", {
+            // #endregion Constructors
+            // #region Public Getters And Setters
             /**
              * TinyMCE Konfiguration
              */
             get: function () {
                 return this._config;
             },
-            // #endregion Constructors
-            // #region Public Getters And Setters
             /**
              * TinyMCE Konfiguration
              * @link https://www.tiny.cloud/docs/configure/
@@ -8948,6 +9186,12 @@
         });
         // #endregion Public Getters And Setters
         // #region Public Methods
+        /**
+         * event when control is touched
+         */
+        SacTinyMceCommon.prototype.blur = function () {
+            this.propagateTouch();
+        };
         /**
          * Schliesst den Dateiauswahl Dialog
          */
@@ -8966,10 +9210,8 @@
          */
         SacTinyMceCommon.prototype.setSelectDialogResult = function () {
             if (this.selectDialogSettings.value) {
-                if (this.selectDialogSettings.value.startsWith('/') ||
-                    this.selectDialogSettings.value.startsWith('\\')) {
-                    this.selectDialogSettings.value =
-                        this.selectDialogSettings.value.substring(1);
+                if (this.selectDialogSettings.value.startsWith('/') || this.selectDialogSettings.value.startsWith('\\')) {
+                    this.selectDialogSettings.value = this.selectDialogSettings.value.substring(1);
                 }
                 this.selectDialogSettings.callback(this.selectDialogSettings.value);
             }
@@ -8995,16 +9237,13 @@
                     });
                     switch (meta.filetype) {
                         case 'image':
-                            _this.settings.angular.selectDialogSettings.allowedtypes =
-                                _this.settings.angular.filetypesimages;
+                            _this.settings.angular.selectDialogSettings.allowedtypes = _this.settings.angular.filetypesimages;
                             break;
                         case 'media':
-                            _this.settings.angular.selectDialogSettings.allowedtypes =
-                                _this.settings.angular.filetypesvideo;
+                            _this.settings.angular.selectDialogSettings.allowedtypes = _this.settings.angular.filetypesvideo;
                             break;
                         default:
-                            _this.settings.angular.selectDialogSettings.allowedtypes =
-                                _this.settings.angular.filetypesfiles;
+                            _this.settings.angular.selectDialogSettings.allowedtypes = _this.settings.angular.filetypesfiles;
                             break;
                     }
                 });
@@ -9022,7 +9261,7 @@
             }
             return error;
         };
-        // #endregion Public Abstract Methods
+        // #endregion Public Methods
         // #region Private Methods
         /**
          * Gibt die TinyMCE Settings zurück, die aus den Properties der Angular Komponenten erzeugt werden
@@ -9058,9 +9297,9 @@
         filetypesvideo: [{ type: i0.Input }],
         height: [{ type: i0.Input }],
         isrequired: [{ type: i0.Input }],
+        onsave: [{ type: i0.Output }],
         validationmessagerequired: [{ type: i0.Input }],
         validationmessagesummaryrequired: [{ type: i0.Input }],
-        onsave: [{ type: i0.Output }],
         config: [{ type: i0.Input }]
     };
 
@@ -9507,6 +9746,14 @@
              * Position of the tooltip at the top
              */
             this.TopPos = 0;
+            /**
+             * Identifier used for the E2E data attribute.
+             */
+            this.e2eidentifier = null;
+            /**
+             * name of control
+             */
+            this.name = createGuid();
             /**
              * Position of the picker arrow at the left
              */
@@ -9707,6 +9954,8 @@
     ]; };
     SacTooltipCommon.propDecorators = {
         content: [{ type: i0.ViewChild, args: ['container', { static: true },] }],
+        e2eidentifier: [{ type: i0.Input }],
+        name: [{ type: i0.Input }],
         position: [{ type: i0.Input }],
         tooltiptext: [{ type: i0.Input }],
         inlinemode: [{ type: i0.Input }],
@@ -9761,9 +10010,22 @@
              * Handling von neuen Files im Input Control
              */
             _this.fileListener = function () {
-                if (_this.uploadInput.nativeElement.files) {
-                    _this.uploadService.handleFileList(_this.uploadInput.nativeElement.files);
+                // exit if files is null or undefined
+                if (!_this.uploadInput.nativeElement.files) {
+                    return;
                 }
+                if (_this.GetMaxFiles() > 0) {
+                    var maxFiles = _this.GetMaxFiles() + _this.UploadedFileCount();
+                    var possibleFiles = maxFiles - _this.uploadInput.nativeElement.files.length;
+                    if (possibleFiles < 0) {
+                        var dataTransfer_1 = new DataTransfer();
+                        var files = Array.from(_this.uploadInput.nativeElement.files).splice(0, _this.uploadInput.nativeElement.files.length + possibleFiles);
+                        // clone files
+                        files.forEach(function (file) { return dataTransfer_1.items.add(file); });
+                        _this.uploadInput.nativeElement.files = dataTransfer_1.files;
+                    }
+                }
+                _this.uploadService.handleFileList(_this.uploadInput.nativeElement.files);
             };
             /**
              * Definiert das Control als Required
@@ -10131,7 +10393,7 @@
             }
             return error;
         };
-        // #endregion Public Methods
+        // #endregion Protected Methods
         // #region Private Methods
         SacUploadBase.prototype.UpdateFileCount = function () {
             // HACK: Add addition property to FormControl. Can be fixed if solution for ticket: https://github.com/angular/angular/issues/19686
@@ -10271,7 +10533,7 @@
              */
             _this.validationmessagesummaryminfiles = _this.validationKeyService.ValidationErrorSummaryFilesMin;
             return _this;
-            // #endregion Public Methods
+            // #endregion Protected Methods
         }
         // #endregion Properties
         // #region Public Methods
@@ -10386,6 +10648,14 @@
             }
             return error;
         };
+        // #endregion Public Methods
+        // #region Protected Methods
+        /**
+         * @inheritdoc
+         */
+        SacDropzoneMultipleCommon.prototype.GetMaxFiles = function () {
+            return this.maxfiles;
+        };
         return SacDropzoneMultipleCommon;
     }(SacUploadBase));
     SacDropzoneMultipleCommon.decorators = [
@@ -10415,7 +10685,7 @@
              */
             _this.uploadheight = null;
             return _this;
-            // #endregion Public Methods
+            // #endregion Protected Methods
         }
         // #endregion Properties
         // #region Public Methods
@@ -10498,6 +10768,14 @@
                 this.active = true;
             }
         };
+        // #endregion Public Methods
+        // #region Protected Methods
+        /**
+         * @inheritdoc
+         */
+        SacDropzoneSingleCommon.prototype.GetMaxFiles = function () {
+            return 1;
+        };
         return SacDropzoneSingleCommon;
     }(SacUploadBase));
     SacDropzoneSingleCommon.decorators = [
@@ -10539,7 +10817,7 @@
              */
             _this.validationmessagesummaryminfiles = _this.validationKeyService.ValidationErrorSummaryFilesMin;
             return _this;
-            // #endregion Public Methods
+            // #endregion Protected Methods
         }
         // #endregion Properties
         // #region Public Methods
@@ -10613,6 +10891,14 @@
             }
             return error;
         };
+        // #endregion Public Methods
+        // #region Protected Methods
+        /**
+         * @inheritdoc
+         */
+        SacUploadMultipleCommon.prototype.GetMaxFiles = function () {
+            return this.maxfiles;
+        };
         return SacUploadMultipleCommon;
     }(SacUploadBase));
     SacUploadMultipleCommon.decorators = [
@@ -10643,7 +10929,7 @@
              */
             _this.buttonupload = '';
             return _this;
-            // #endregion Public Methods
+            // #endregion Protected Methods
         }
         // #endregion Properties
         // #region Public Methods
@@ -10676,6 +10962,14 @@
                 }
             }
         };
+        // #endregion Public Methods
+        // #region Protected Methods
+        /**
+         * @inheritdoc
+         */
+        SacUploadSingleCommon.prototype.GetMaxFiles = function () {
+            return 1;
+        };
         return SacUploadSingleCommon;
     }(SacUploadBase));
     SacUploadSingleCommon.decorators = [
@@ -11168,43 +11462,35 @@
      */
     var SacConfirmCommon = /** @class */ (function () {
         function SacConfirmCommon() {
-            //#region Input / Output Properties
-            /**
-             * Event wenn Dialog geschlossen wird
-             */
-            this.onconfirm = new i0.EventEmitter();
-            /**
-           * Dialog Titel für Confirm Dialog
-           */
-            this.title = '';
+            // #region Properties
             /**
-             * Nachricht die auf dem Dialog angezeigt wird
+             * Map mit Buttons die in Dialog angezeigt werden.
              */
-            this.message = '';
+            this.buttons = [];
             /**
              * Icon welches auf dem Dialog angezeigt wird
              */
             this.image = '';
-            /**
-             * Map mit Buttons die in Dialog angezeigt werden.
-             */
-            this.buttons = [];
-            //#endregion
-            //#region Internal Properties and Methods
             /**
              * Definiert ob der Dialog sichtbar ist
              */
             this.isvisible = false;
-            //#endregion
+            /**
+             * Nachricht die auf dem Dialog angezeigt wird
+             */
+            this.message = '';
+            /**
+             * Event wenn Dialog geschlossen wird
+             */
+            this.onconfirm = new i0.EventEmitter();
+            /**
+           * Dialog Titel für Confirm Dialog
+           */
+            this.title = '';
+            // #endregion Public Methods
         }
-        /**
-         * Definiert, ob für den Dialog ein Image definiert wurde
-         */
-        SacConfirmCommon.prototype.hasImage = function () {
-            return this.image !== '';
-        };
-        //#endregion
-        //#region Public Methods
+        // #endregion Properties
+        // #region Public Methods
         /**
          * Action wenn Button auf Dialog geklickt wurde. Löst den EventEmitter aus und blendet den Dialog aus.
          * @param action
@@ -11214,10 +11500,10 @@
             this.isvisible = false;
         };
         /**
-         * Zeigt den Dialog an
+         * Definiert, ob für den Dialog ein Image definiert wurde
          */
-        SacConfirmCommon.prototype.show = function () {
-            this.isvisible = true;
+        SacConfirmCommon.prototype.hasImage = function () {
+            return this.image !== '';
         };
         /**
          * Blendet den Dialog aus
@@ -11225,17 +11511,23 @@
         SacConfirmCommon.prototype.hide = function () {
             this.isvisible = false;
         };
+        /**
+         * Zeigt den Dialog an
+         */
+        SacConfirmCommon.prototype.show = function () {
+            this.isvisible = true;
+        };
         return SacConfirmCommon;
     }());
     SacConfirmCommon.decorators = [
         { type: i0.Directive }
     ];
     SacConfirmCommon.propDecorators = {
-        onconfirm: [{ type: i0.Output }],
-        title: [{ type: i0.Input }],
-        message: [{ type: i0.Input }],
+        buttons: [{ type: i0.Input }],
         image: [{ type: i0.Input }],
-        buttons: [{ type: i0.Input }]
+        message: [{ type: i0.Input }],
+        onconfirm: [{ type: i0.Output }],
+        title: [{ type: i0.Input }]
     };
 
     /**
@@ -11775,10 +12067,18 @@
              * Extra CSS Klassen für das Control
              */
             this.cssclass = '';
+            /**
+             * Identifier used for the E2E data attribute.
+             */
+            this.e2eidentifier = null;
             /**
              * Definiert ob das Dropdown offen ist.
              */
             this.isopen = false;
+            /**
+             * name of control
+             */
+            this.name = createGuid();
             /**
              * The preferred placement of the dropdown.
              *
@@ -11931,8 +12231,10 @@
         buttontemplate: [{ type: i0.Input }],
         container: [{ type: i0.Input }],
         cssclass: [{ type: i0.Input }],
+        e2eidentifier: [{ type: i0.Input }],
         isopen: [{ type: i0.Input }],
         menuitems: [{ type: i0.ContentChildren, args: [SacContextmenuItemCommon,] }],
+        name: [{ type: i0.Input }],
         placement: [{ type: i0.Input }],
         onClick: [{ type: i0.HostListener, args: ['document:click', ['$event.target'],] }]
     };
@@ -12659,6 +12961,57 @@
         exitEditMode: [{ type: i0.HostListener, args: ['document:click', ['$event.target'],] }]
     };
 
+    var SacTestingAttributePipe = /** @class */ (function () {
+        // #endregion Properties
+        // #region Constructors
+        /**
+         *
+         */
+        function SacTestingAttributePipe(injector) {
+            // get attribute state from config
+            var configurationService = injector.get(SACCONFIGURATION_SERVICE, new SacDefaultConfigurationService());
+            this.isEnabled = configurationService.EnableE2EAttributes;
+        }
+        // #endregion Constructors
+        // #region Public Methods
+        SacTestingAttributePipe.prototype.transform = function (controlname, e2eattribute) {
+            // return null to disable attribute if disabled
+            if (!this.isEnabled) {
+                return null;
+            }
+            if (e2eattribute) {
+                return e2eattribute;
+            }
+            if (controlname) {
+                return controlname;
+            }
+            // disable attribute if name and e2e attribute is not set
+            return null;
+        };
+        return SacTestingAttributePipe;
+    }());
+    SacTestingAttributePipe.decorators = [
+        { type: i0.Pipe, args: [{
+                    name: 'testingattribute',
+                },] }
+    ];
+    SacTestingAttributePipe.ctorParameters = function () { return [
+        { type: i0.Injector }
+    ]; };
+
+    var SACCommonUtliltiesModule = /** @class */ (function () {
+        function SACCommonUtliltiesModule() {
+        }
+        return SACCommonUtliltiesModule;
+    }());
+    SACCommonUtliltiesModule.decorators = [
+        { type: i0.NgModule, args: [{
+                    declarations: [SacTestingAttributePipe],
+                    imports: [],
+                    exports: [SacTestingAttributePipe],
+                },] }
+    ];
+
     /**
      * Model für Sprachen
      */
@@ -12681,7 +13034,7 @@
         { type: i0.NgModule, args: [{
                     declarations: [],
                     imports: [],
-                    exports: []
+                    exports: [],
                 },] }
     ];
 
@@ -12701,6 +13054,7 @@
     exports.Positioning = Positioning;
     exports.SACCONFIGURATION_SERVICE = SACCONFIGURATION_SERVICE;
     exports.SACCommonListboxOptionModule = SACCommonListboxOptionModule;
+    exports.SACCommonUtliltiesModule = SACCommonUtliltiesModule;
     exports.SACFILEBROWSER_SERVICE = SACFILEBROWSER_SERVICE;
     exports.SACICON_SERVICE = SACICON_SERVICE;
     exports.SACLANGUAGE_SERVICE = SACLANGUAGE_SERVICE;
@@ -12761,6 +13115,7 @@
     exports.SacStaticLabelCommon = SacStaticLabelCommon;
     exports.SacTabCommon = SacTabCommon;
     exports.SacTabItemCommon = SacTabItemCommon;
+    exports.SacTestingAttributePipe = SacTestingAttributePipe;
     exports.SacTimeCommon = SacTimeCommon;
     exports.SacTinyMceCommon = SacTinyMceCommon;
     exports.SacTooltipCommon = SacTooltipCommon;