diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/declare.d.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/declare.d.ts
index 825a4af..b3dbf5d 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/declare.d.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/declare.d.ts
@@ -22,7 +22,10 @@
 interface JQuery {
   overlay(data?: any, options?: any): JQuery; // XXX is "data" correct?
   datetimepicker(data?: any, options?: any): JQuery;
+
   popover(data?: any, options?: any): JQuery;
+
   modal(data?: any, options?: any): JQuery;
+
   typeahead(data?: any, options?: any): JQuery;
 }
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/hello-world.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/hello-world.ts
index 3cc6d11..80b355d 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/hello-world.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/hello-world.ts
@@ -18,7 +18,7 @@
 export const hello = () => 'Hello world!';
 
 export function es6test(): any {
-  return [0,1, 2, 3, 4,5,6,7,8,9,10,11,12,13,14,15,16].map((n) => n * n);
+  return [0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16].map((n) => n * n);
 }
 
 export namespace T {
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-calendar.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-calendar.ts
index ca5e5dc..1e43d1b 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-calendar.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-calendar.ts
@@ -170,127 +170,127 @@
     }
   }
 
-/*
- Get the pattern from the "Java world" (http://docs.oracle.com/javase/8/docs/api/java/text/SimpleDateFormat.html)
- and convert it to 'moment.js'.
- Attention: Not every pattern char is supported.
- */
-static analyzePattern = function (pattern) {
+  /*
+   Get the pattern from the "Java world" (http://docs.oracle.com/javase/8/docs/api/java/text/SimpleDateFormat.html)
+   and convert it to 'moment.js'.
+   Attention: Not every pattern char is supported.
+   */
+  static analyzePattern = function (pattern) {
 
-  if (!pattern || pattern.length > 100) {
-    console.warn("Pattern not supported: " + pattern);
-    pattern = "";
-  }
-
-  var analyzedPattern = "";
-  var nextSegment = "";
-  var escMode = false;
-  for (var i = 0; i < pattern.length; i++) {
-    var currentChar = pattern.charAt(i);
-    if (currentChar == "'" && escMode == false) {
-      escMode = true;
-      analyzedPattern += DateTime.analyzePatternPart(nextSegment);
-      nextSegment = "";
-    } else if (currentChar == "'" && pattern.charAt(i + 1) == "'") {
-      if (escMode) {
-        nextSegment += "\\";
-      }
-      nextSegment += "'";
-      i++;
-    } else if (currentChar == "'" && escMode == true) {
-      escMode = false;
-      analyzedPattern += nextSegment;
-      nextSegment = "";
-    } else {
-      if (escMode) {
-        nextSegment += "\\";
-      }
-      nextSegment += currentChar;
+    if (!pattern || pattern.length > 100) {
+      console.warn("Pattern not supported: " + pattern);
+      pattern = "";
     }
-  }
-  if (nextSegment != "") {
-    if (escMode) {
-      analyzedPattern += nextSegment;
-    } else {
-      analyzedPattern += DateTime.analyzePatternPart(nextSegment);
+
+    var analyzedPattern = "";
+    var nextSegment = "";
+    var escMode = false;
+    for (var i = 0; i < pattern.length; i++) {
+      var currentChar = pattern.charAt(i);
+      if (currentChar == "'" && escMode == false) {
+        escMode = true;
+        analyzedPattern += DateTime.analyzePatternPart(nextSegment);
+        nextSegment = "";
+      } else if (currentChar == "'" && pattern.charAt(i + 1) == "'") {
+        if (escMode) {
+          nextSegment += "\\";
+        }
+        nextSegment += "'";
+        i++;
+      } else if (currentChar == "'" && escMode == true) {
+        escMode = false;
+        analyzedPattern += nextSegment;
+        nextSegment = "";
+      } else {
+        if (escMode) {
+          nextSegment += "\\";
+        }
+        nextSegment += currentChar;
+      }
     }
-  }
+    if (nextSegment != "") {
+      if (escMode) {
+        analyzedPattern += nextSegment;
+      } else {
+        analyzedPattern += DateTime.analyzePatternPart(nextSegment);
+      }
+    }
 
-  return analyzedPattern;
-};
+    return analyzedPattern;
+  };
 
-static analyzePatternPart = function (pattern) {
+  static analyzePatternPart = function (pattern) {
 
-  if (pattern.search("G") > -1 || pattern.search("W") > -1 || pattern.search("F") > -1
-      || pattern.search("K") > -1 || pattern.search("z") > -1 || pattern.search("X") > -1) {
-    console.warn("Pattern chars 'G', 'W', 'F', 'K', 'z' and 'X' are not supported: " + pattern);
-    pattern = "";
-  }
+    if (pattern.search("G") > -1 || pattern.search("W") > -1 || pattern.search("F") > -1
+        || pattern.search("K") > -1 || pattern.search("z") > -1 || pattern.search("X") > -1) {
+      console.warn("Pattern chars 'G', 'W', 'F', 'K', 'z' and 'X' are not supported: " + pattern);
+      pattern = "";
+    }
 
-  if (pattern.search("y") > -1) {
-    pattern = pattern.replace(/y/g, "Y");
-  }
-  if (pattern.search("Y") > -1) {
-    pattern = pattern.replace(/\bY\b/g, "YYYY");
-    pattern = pattern.replace(/\bYYY\b/g, "YY");
-    pattern = pattern.replace(/YYYYYY+/g, "YYYYY");
-  }
+    if (pattern.search("y") > -1) {
+      pattern = pattern.replace(/y/g, "Y");
+    }
+    if (pattern.search("Y") > -1) {
+      pattern = pattern.replace(/\bY\b/g, "YYYY");
+      pattern = pattern.replace(/\bYYY\b/g, "YY");
+      pattern = pattern.replace(/YYYYYY+/g, "YYYYY");
+    }
 
-  if (pattern.search("MMMMM") > -1) {
-    pattern = pattern.replace(/MMMMM+/g, "MMMM");
-  }
+    if (pattern.search("MMMMM") > -1) {
+      pattern = pattern.replace(/MMMMM+/g, "MMMM");
+    }
 
-  if (pattern.search("w") > -1) {
-    pattern = pattern.replace(/\bw\b/g, "W");
-    pattern = pattern.replace(/www+/g, "WW");
-  }
+    if (pattern.search("w") > -1) {
+      pattern = pattern.replace(/\bw\b/g, "W");
+      pattern = pattern.replace(/www+/g, "WW");
+    }
 
-  if (pattern.search("D") > -1) {
-    pattern = pattern.replace(/DDD+/g, "DDDD");
-    pattern = pattern.replace(/\bD{1,2}\b/g, "DDD");
-  }
+    if (pattern.search("D") > -1) {
+      pattern = pattern.replace(/DDD+/g, "DDDD");
+      pattern = pattern.replace(/\bD{1,2}\b/g, "DDD");
+    }
 
-  if (pattern.search("d") > -1) {
-    pattern = pattern.replace(/dd+/g, "DD");
-    pattern = pattern.replace(/\bd\b/g, "D");
-  }
+    if (pattern.search("d") > -1) {
+      pattern = pattern.replace(/dd+/g, "DD");
+      pattern = pattern.replace(/\bd\b/g, "D");
+    }
 
-  if (pattern.search("E") > -1) {
-    pattern = pattern.replace(/\bE{1,3}\b/g, "dd");
-    pattern = pattern.replace(/EEEE+/g, "dddd");
-  }
+    if (pattern.search("E") > -1) {
+      pattern = pattern.replace(/\bE{1,3}\b/g, "dd");
+      pattern = pattern.replace(/EEEE+/g, "dddd");
+    }
 
-  if (pattern.search("u") > -1) {
-    pattern = pattern.replace(/u+/g, "E");
-  }
-  if (pattern.search("a") > -1) {
-    pattern = pattern.replace(/a+/g, "A");
-  }
-  if (pattern.search("HHH") > -1) {
-    pattern = pattern.replace(/HHH+/g, "HH");
-  }
-  if (pattern.search("kkk") > -1) {
-    pattern = pattern.replace(/kkk+/g, "kk");
-  }
-  if (pattern.search("hhh") > -1) {
-    pattern = pattern.replace(/hhh+/g, "hh");
-  }
-  if (pattern.search("mmm") > -1) {
-    pattern = pattern.replace(/mmm+/g, "mm");
-  }
-  if (pattern.search("sss") > -1) {
-    pattern = pattern.replace(/sss+/g, "ss");
-  }
-  if (pattern.search("SSSS") > -1) {
-    pattern = pattern.replace(/SSSS+/g, "SSS");
-  }
-  if (pattern.search("Z") > -1) {
-    pattern = pattern.replace(/\bZ\b/g, "ZZ");
-    pattern = pattern.replace(/ZZZ+/g, "ZZ");
-  }
+    if (pattern.search("u") > -1) {
+      pattern = pattern.replace(/u+/g, "E");
+    }
+    if (pattern.search("a") > -1) {
+      pattern = pattern.replace(/a+/g, "A");
+    }
+    if (pattern.search("HHH") > -1) {
+      pattern = pattern.replace(/HHH+/g, "HH");
+    }
+    if (pattern.search("kkk") > -1) {
+      pattern = pattern.replace(/kkk+/g, "kk");
+    }
+    if (pattern.search("hhh") > -1) {
+      pattern = pattern.replace(/hhh+/g, "hh");
+    }
+    if (pattern.search("mmm") > -1) {
+      pattern = pattern.replace(/mmm+/g, "mm");
+    }
+    if (pattern.search("sss") > -1) {
+      pattern = pattern.replace(/sss+/g, "ss");
+    }
+    if (pattern.search("SSSS") > -1) {
+      pattern = pattern.replace(/SSSS+/g, "SSS");
+    }
+    if (pattern.search("Z") > -1) {
+      pattern = pattern.replace(/\bZ\b/g, "ZZ");
+      pattern = pattern.replace(/ZZZ+/g, "ZZ");
+    }
 
-  return pattern;
-};
+    return pattern;
+  };
 }
 
 Listener.register(DateTime.init, Phase.DOCUMENT_READY);
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-command.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-command.ts
index 5ac6c9c..3b5b12b 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-command.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-command.ts
@@ -51,160 +51,160 @@
 
 class Command {
 
-static initEnter(elements) {
-  elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
-  var page = Tobago4Utils.selectWithJQuery(elements, ".tobago-page");
-  page.keypress(function (event) {
-    var code = event.which;
-    if (code === 0) {
-      code = event.keyCode;
-    }
-    if (code === 13) {
-      var target = event.target;
-      if (target.tagName === "A" || target.tagName === "BUTTON") {
-        return;
+  static initEnter(elements) {
+    elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
+    var page = Tobago4Utils.selectWithJQuery(elements, ".tobago-page");
+    page.keypress(function (event) {
+      var code = event.which;
+      if (code === 0) {
+        code = event.keyCode;
       }
-      if (target.tagName === "TEXTAREA") {
-        if (!event.metaKey && !event.ctrlKey) {
+      if (code === 13) {
+        var target = event.target;
+        if (target.tagName === "A" || target.tagName === "BUTTON") {
           return;
         }
-      }
-      var id = target.name ? target.name : target.id;
-      while (id != null) {
-        var command = jQuery("[data-tobago-default='" + id + "']");
-        if (command.length > 0) {
-          command.click();
-          break;
+        if (target.tagName === "TEXTAREA") {
+          if (!event.metaKey && !event.ctrlKey) {
+            return;
+          }
         }
-        id = Tobago4Utils.getNamingContainerId(id);
-      }
-      return false;
-    }
-  });
-}
-
-static init = function(element: HTMLElement) {
-
-  for (const commandElement of DomUtils.selfOrQuerySelectorAll(element, "[data-tobago-commands]")) {
-
-    const $element = jQuery(commandElement);
-
-  const commands = $element.data("tobago-commands");
-
-  var normalEvents = []; // todo: find a better way to do that in JS
-  if (commands.click) {
-    normalEvents.push({event: "click", command: commands.click});
-  }
-  if (commands.dblclick) {
-    normalEvents.push({event: "dblclick", command: commands.dblclick});
-  }
-  if (commands.focus) {
-    normalEvents.push({event: "focus", command: commands.focus});
-  }
-  if (commands.blur) {
-    normalEvents.push({event: "blur", command: commands.blur});
-  }
-
-  for (var i in normalEvents) {
-
-    $element.on(normalEvents[i].event, {command: normalEvents[i].command}, function (event) {
-      var command = event.data.command;
-      var confirmation = command.confirmation;
-      if (confirmation != null) {
-        if (!confirm(confirmation)) {
-          event.preventDefault();
-          return;
+        var id = target.name ? target.name : target.id;
+        while (id != null) {
+          var command = jQuery("[data-tobago-default='" + id + "']");
+          if (command.length > 0) {
+            command.click();
+            break;
+          }
+          id = Tobago4Utils.getNamingContainerId(id);
         }
+        return false;
       }
-      var collapse = command.collapse;
-      if (collapse) {
-        Collapse.execute(collapse);
+    });
+  }
+
+  static init = function (element: HTMLElement) {
+
+    for (const commandElement of DomUtils.selfOrQuerySelectorAll(element, "[data-tobago-commands]")) {
+
+      const $element = jQuery(commandElement);
+
+      const commands = $element.data("tobago-commands");
+
+      var normalEvents = []; // todo: find a better way to do that in JS
+      if (commands.click) {
+        normalEvents.push({event: "click", command: commands.click});
+      }
+      if (commands.dblclick) {
+        normalEvents.push({event: "dblclick", command: commands.dblclick});
+      }
+      if (commands.focus) {
+        normalEvents.push({event: "focus", command: commands.focus});
+      }
+      if (commands.blur) {
+        normalEvents.push({event: "blur", command: commands.blur});
       }
 
-      if (command.omit !== true) {
-        var popup = command.popup;
-        if (popup && popup.command === "close" && popup.immediate) {
-          Popup.close(this);
-        } else {
-          var action = command.action ? command.action : jQuery(this).attr("id");
-          if (command.execute || command.render) {
-            Command.preparePartialOverlay(command);
+      for (var i in normalEvents) {
+
+        $element.on(normalEvents[i].event, {command: normalEvents[i].command}, function (event) {
+          var command = event.data.command;
+          var confirmation = command.confirmation;
+          if (confirmation != null) {
+            if (!confirm(confirmation)) {
+              event.preventDefault();
+              return;
+            }
+          }
+          var collapse = command.collapse;
+          if (collapse) {
+            Collapse.execute(collapse);
+          }
+
+          if (command.omit !== true) {
+            var popup = command.popup;
+            if (popup && popup.command === "close" && popup.immediate) {
+              Popup.close(this);
+            } else {
+              var action = command.action ? command.action : jQuery(this).attr("id");
+              if (command.execute || command.render) {
+                Command.preparePartialOverlay(command);
+                jsf.ajax.request(
+                    action,
+                    event,
+                    {
+                      "javax.faces.behavior.event": event.type,
+                      execute: command.execute,
+                      render: command.render
+                    });
+              } else {
+                Tobago4.submitAction(this, action, command);
+              }
+              if (popup && popup.command === "close") {
+                Popup.close(this);
+              }
+            }
+          }
+        });
+      }
+      if (commands.change) {
+        $element.change(function (event) {
+          if (commands.change.execute || commands.change.render) {
             jsf.ajax.request(
-                action,
+                jQuery(this).attr("name"),
                 event,
                 {
-                  "javax.faces.behavior.event": event.type,
-                  execute: command.execute,
-                  render: command.render
+                  "javax.faces.behavior.event": "change",
+                  execute: commands.change.execute,
+                  render: commands.change.render
                 });
           } else {
-            Tobago4.submitAction(this, action, command);
+            Tobago4.submitAction(this, commands.change.action, commands.change);
           }
-          if (popup && popup.command === "close") {
-            Popup.close(this);
+        });
+      }
+      if (commands.complete) {
+        if ($element.val() >= parseFloat($element.attr("max"))) {
+          if (commands.complete.execute || commands.complete.render) {
+            jsf.ajax.request(
+                jQuery(this).attr("id"),
+                null,
+                {
+                  "javax.faces.behavior.event": "complete",
+                  execute: commands.complete.execute,
+                  render: commands.complete.render
+                });
+          } else {
+            Tobago4.submitAction(this, commands.complete.action, commands.complete);
           }
         }
       }
-    });
-  }
-  if (commands.change) {
-    $element.change(function (event) {
-      if (commands.change.execute || commands.change.render) {
-        jsf.ajax.request(
-            jQuery(this).attr("name"),
-            event,
-            {
-              "javax.faces.behavior.event": "change",
-              execute: commands.change.execute,
-              render: commands.change.render
-            });
-      } else {
-        Tobago4.submitAction(this, commands.change.action, commands.change);
+      if (commands.load) {
+        setTimeout(function () {
+              Tobago4.submitAction(this, commands.load.action, commands.load);
+            },
+            commands.load.delay || 100);
       }
-    });
-  }
-  if (commands.complete) {
-    if ($element.val() >= parseFloat($element.attr("max"))) {
-      if (commands.complete.execute || commands.complete.render) {
-        jsf.ajax.request(
-            jQuery(this).attr("id"),
-            null,
-            {
-              "javax.faces.behavior.event": "complete",
-              execute: commands.complete.execute,
-              render: commands.complete.render
-            });
-      } else {
-        Tobago4.submitAction(this, commands.complete.action, commands.complete);
+      if (commands.resize) {
+        jQuery(window).resize(function () {
+          console.debug("window resize event: " + commands.resize);
+          Tobago4.submitAction(this, commands.resize.action, commands.resize);
+        });
       }
     }
-  }
-  if (commands.load) {
-    setTimeout(function () {
-          Tobago4.submitAction(this, commands.load.action, commands.load);
-        },
-        commands.load.delay || 100);
-  }
-  if (commands.resize) {
-    jQuery(window).resize(function () {
-      console.debug("window resize event: " + commands.resize);
-      Tobago4.submitAction(this, commands.resize.action, commands.resize);
-    });
-  }
-}
-};
+  };
 
-static preparePartialOverlay = function (command) {
-  if (command.transition === undefined || command.transition == null || command.transition) {
-    console.debug("[tobago-command] render: '" + command.render + "'");
-    if (command.render) {
-      let partialIds = command.render.split(" ");
-      for (let i = 0; i < partialIds.length; i++) {
-        new Overlay(document.getElementById(partialIds[i]), true);
+  static preparePartialOverlay = function (command) {
+    if (command.transition === undefined || command.transition == null || command.transition) {
+      console.debug("[tobago-command] render: '" + command.render + "'");
+      if (command.render) {
+        let partialIds = command.render.split(" ");
+        for (let i = 0; i < partialIds.length; i++) {
+          new Overlay(document.getElementById(partialIds[i]), true);
+        }
       }
     }
-  }
-};
+  };
 }
 
 Listener.register(Command.initEnter, Phase.DOCUMENT_READY);
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-config.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-config.ts
index 710f5e7..ac1fcc4 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-config.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-config.ts
@@ -19,11 +19,11 @@
 
   private static map: Map<string, any> = new Map<string, any>();
 
-static set(key: string, value: any) {
+  static set(key: string, value: any) {
     this.map.set(key, value);
   }
 
- static get(key: string): any {
+  static get(key: string): any {
     const value = this.map.get(key);
     if (value) {
       return value;
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-core.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-core.ts
index 1bfae43..19ecaec 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-core.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-core.ts
@@ -42,14 +42,14 @@
    * @const
    * @type {string}
    */
- static readonly COMPONENT_SEP= ':';
+  static readonly COMPONENT_SEP = ':';
 
   /**
    * Tobago's subComponent separator constant
    * @const
    * @type {string}
    */
-static readonly SUB_COMPONENT_SEP= '::';
+  static readonly SUB_COMPONENT_SEP = '::';
 
   // -------- Variables -------------------------------------------------------
 
@@ -57,25 +57,25 @@
    * The html form object of current page.
    * set via init function
    */
-static  form= null;
+  static form = null;
 
-static  htmlIdIndex= 0;
+  static htmlIdIndex = 0;
 
-static  createHtmlId= function() {
+  static createHtmlId = function () {
     var id = '__tbg_id_' + Tobago4.htmlIdIndex++;
     console.debug('created id = ' + id);
     return id;
   };
 
-static  jsObjects= [];
+  static jsObjects = [];
 
-static  isSubmit= false;
+  static isSubmit = false;
 
-static  initMarker= false;
+  static initMarker = false;
 
   // -------- Functions -------------------------------------------------------
 
-  static  findPage= function() {
+  static findPage = function () {
     return jQuery(".tobago-page");
   };
 
@@ -83,7 +83,7 @@
    * Find a sub-element of the page. Like the form with id e.g. page::form
    * @param suffix
    */
-  static  findSubElementOfPage= function(suffix) {
+  static findSubElementOfPage = function (suffix) {
     return jQuery(DomUtils.escapeClientId(Tobago4.findPage().attr("id") + Tobago4.SUB_COMPONENT_SEP + suffix));
   };
 
@@ -91,7 +91,7 @@
    * Tobago's central init function.
    * Called when the document (DOM) is ready
    */
-  static  init= function() {
+  static init = function () {
 
     if (Tobago4.initMarker) {
       return;
@@ -119,7 +119,7 @@
     console.timeEnd("[tobago] init");
   };
 
-  static  onSubmit= function(listenerOptions) {
+  static onSubmit = function (listenerOptions) {
     Listener.executeBeforeSubmit();
     /*
     XXX check if we need the return false case
@@ -148,7 +148,7 @@
     return true;
   };
 
-  static  onBeforeUnload= function() {
+  static onBeforeUnload = function () {
     if (this.transition) {
       new Overlay(DomUtils.page());
     }
@@ -158,7 +158,7 @@
   /**
    * Wrapper function to call application generated onunload function
    */
-  static  onUnload= function() {
+  static onUnload = function () {
 
     console.info('on onload');
 
@@ -184,12 +184,12 @@
    * options.transition
    * options.target
    */
-  static  submitAction= function(source, actionId, options?) {
+  static submitAction = function (source, actionId, options?) {
     options = options || {};
 
     var transition = options.transition === undefined || options.transition == null || options.transition;
 
-    Transport.request(function() {
+    Transport.request(function () {
       if (!Tobago4.isSubmit) {
         Tobago4.isSubmit = true;
         const form = <HTMLFormElement>document.getElementsByTagName("form")[0];
@@ -241,7 +241,7 @@
     }, true);
   };
 
-  static  initDom= function(elements) {
+  static initDom = function (elements) {
     elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
 
     // focus
@@ -250,7 +250,7 @@
     Tobago4.initScrollPosition(elements ? elements : jQuery(".tobago-page"));
   };
 
-  static  initScrollPosition= function(elements) {
+  static initScrollPosition = function (elements) {
     var scrollPanels;
     if (elements.data("tobago-scroll-panel")) {
       scrollPanels = elements;
@@ -266,7 +266,7 @@
     });
     scrollPanels.each(function () {
       var panel = jQuery(this);
-      const position : string = panel.children("[data-tobago-scroll-position]").val() as string;
+      const position: string = panel.children("[data-tobago-scroll-position]").val() as string;
       var sep = position.indexOf(";");
       if (sep !== -1) {
         var scrollLeft = position.substr(0, sep);
@@ -289,7 +289,7 @@
    * - last (the element from the last request with same id gets the focus, not AJAX)
    * - first (the first input element (without tabindex=-1) gets the focus, not AJAX)
    */
-  static  initFocus= function(elements) {
+  static initFocus = function (elements) {
 
     var $focusable = jQuery(":input:enabled:visible:not(button):not([tabindex='-1'])");
     $focusable.focus(function () {
@@ -310,7 +310,7 @@
       // nothing to do, because the browser make the work.
 
       // autofocus in popups doesn't work automatically... so we fix that here
-      jQuery('.modal').on('shown.bs.modal', function() {
+      jQuery('.modal').on('shown.bs.modal', function () {
         Tobago4.setFocus(jQuery(this).find('[autofocus]'));
       });
 
@@ -335,7 +335,7 @@
     }
   };
 
-  static  setFocus= function($element) {
+  static setFocus = function ($element) {
     try {
       // focus() on not visible elements breaks some IE
       $element.focus();
@@ -344,7 +344,7 @@
     }
   };
 
-  static  toString= function(element) {
+  static toString = function (element) {
     var result = '';
     for (var property in element) {
       if (property && element[property]) {
@@ -359,11 +359,11 @@
 
 }
 
-document.addEventListener('DOMContentLoaded',function() {
+document.addEventListener('DOMContentLoaded', function () {
   Tobago4.init();
 });
 
-window.addEventListener("load", function() {
+window.addEventListener("load", function () {
   Listener.executeWindowLoad();
 });
 
@@ -374,15 +374,15 @@
 Listener.register(Tobago4.initDom, Phase.AFTER_UPDATE, Order.LATER);
 
 class Transport {
-  static  requests= [];
-  static  currentActionId= null;
-  static  pageSubmitted= false;
-  static startTime:Date;
+  static requests = [];
+  static currentActionId = null;
+  static pageSubmitted = false;
+  static startTime: Date;
 
   /**
    * @return true if the request is queued.
    */
-  static  request= function(req, submitPage, actionId?) {
+  static request = function (req, submitPage, actionId?) {
     var index = 0;
     if (submitPage) {
       Transport.pageSubmitted = true;
@@ -416,11 +416,11 @@
 
 // TBD XXX REMOVE is this called in non AJAX case?
 
-  static requestComplete= function() {
+  static requestComplete = function () {
     Transport.requests.shift();
     Transport.currentActionId = null;
     console.debug('Request complete! Duration: ' + (new Date().getTime() - Transport.startTime.getTime()) + 'ms; '
-       + 'Queue size : ' + Transport.requests.length);
+        + 'Queue size : ' + Transport.requests.length);
     if (Transport.requests.length > 0) {
       console.debug('Execute request!');
       Transport.startTime = new Date();
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-overlay.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-overlay.ts
index d618817..be309d2 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-overlay.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-overlay.ts
@@ -59,7 +59,7 @@
     this.error = error;
     this.waitOverlayDelay = waitOverlayDelay
         ? waitOverlayDelay
-        : Config.get(this.ajax ? "Ajax.waitOverlayDelay": "Tobago.waitOverlayDelay");
+        : Config.get(this.ajax ? "Ajax.waitOverlayDelay" : "Tobago.waitOverlayDelay");
 
     // create the overlay
 
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-popover.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-popover.ts
index 3b35110..795aea4 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-popover.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-popover.ts
@@ -31,7 +31,7 @@
       ],
       trigger: 'focus'
     });
-  }
+  };
 }
 
 Listener.register(MessagePopover.init, Phase.DOCUMENT_READY);
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-popup.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-popup.ts
index 331ff8e..6c2381c 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-popup.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-popup.ts
@@ -20,31 +20,31 @@
 
 export class Popup {
 
-/**
- * Init popup for bootstrap
- */
-static init = function (elements) {
-  elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
-  var popups = Tobago4Utils.selectWithJQuery(elements, ".modal");
-  popups.each(function () {
-    var $popup = jQuery(this);
-    var $hidden = Collapse.findHidden($popup);
-    if ($hidden.val() == "false") {
-      // XXX hack: this is needed for popups open by AJAX.
-      // XXX currently the DOM replacement done by Tobago doesn't remove the modal-backdrop
-      jQuery(".modal-backdrop").remove();
+  /**
+   * Init popup for bootstrap
+   */
+  static init = function (elements) {
+    elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
+    var popups = Tobago4Utils.selectWithJQuery(elements, ".modal");
+    popups.each(function () {
+      var $popup = jQuery(this);
+      var $hidden = Collapse.findHidden($popup);
+      if ($hidden.val() == "false") {
+        // XXX hack: this is needed for popups open by AJAX.
+        // XXX currently the DOM replacement done by Tobago doesn't remove the modal-backdrop
+        jQuery(".modal-backdrop").remove();
 
-      jQuery(this).modal("show"); // inits and opens the popup
-    } else {
-      jQuery(this).modal("hide"); // inits and hides the popup
-    }
-  });
-};
+        jQuery(this).modal("show"); // inits and opens the popup
+      } else {
+        jQuery(this).modal("hide"); // inits and hides the popup
+      }
+    });
+  };
 
-static close = function (button) {
-  jQuery(button).parents('.modal:first').modal("hide");
+  static close = function (button) {
+    jQuery(button).parents('.modal:first').modal("hide");
 
-};
+  };
 }
 
 Listener.register(Popup.init, Phase.DOCUMENT_READY);
@@ -52,39 +52,39 @@
 
 export class Collapse {
 
-static findHidden = function ($element) {
-  return jQuery(DomUtils.escapeClientId($element.attr("id") + "::collapse"));
-};
+  static findHidden = function ($element) {
+    return jQuery(DomUtils.escapeClientId($element.attr("id") + "::collapse"));
+  };
 
-static execute = function (collapse) {
-  var transition = collapse.transition;
-  var $for = jQuery(DomUtils.escapeClientId(collapse.forId));
-  var $hidden = Collapse.findHidden($for);
-  var isPopup = $for.hasClass("tobago-popup");
-  var newCollapsed;
-  switch (transition) {
-    case "hide":
-      newCollapsed = true;
-      break;
-    case "show":
-      newCollapsed = false;
-      break;
-    default:
-      console.error("unknown transition: '" + transition + "'");
-  }
-  if (newCollapsed) {
-    if (isPopup) {
-      $for.modal("hide");
-    } else {
-      $for.addClass("tobago-collapsed");
+  static execute = function (collapse) {
+    var transition = collapse.transition;
+    var $for = jQuery(DomUtils.escapeClientId(collapse.forId));
+    var $hidden = Collapse.findHidden($for);
+    var isPopup = $for.hasClass("tobago-popup");
+    var newCollapsed;
+    switch (transition) {
+      case "hide":
+        newCollapsed = true;
+        break;
+      case "show":
+        newCollapsed = false;
+        break;
+      default:
+        console.error("unknown transition: '" + transition + "'");
     }
-  } else {
-    if (isPopup) {
-      $for.modal("show");
+    if (newCollapsed) {
+      if (isPopup) {
+        $for.modal("hide");
+      } else {
+        $for.addClass("tobago-collapsed");
+      }
     } else {
-      $for.removeClass("tobago-collapsed");
+      if (isPopup) {
+        $for.modal("show");
+      } else {
+        $for.removeClass("tobago-collapsed");
+      }
     }
-  }
-  $hidden.val(newCollapsed);
-};
+    $hidden.val(newCollapsed);
+  };
 }
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-reload.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-reload.ts
index 597a76a..9b591c2 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-reload.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-reload.ts
@@ -37,7 +37,7 @@
     }
   };
 
-  public schedule (id: string, reloadMillis: number) {
+  public schedule(id: string, reloadMillis: number) {
     if (reloadMillis > 0) {
 
       // may remove old schedule
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-select.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-select.ts
index 854dd98..47f48fa 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-select.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-select.ts
@@ -22,58 +22,58 @@
 
 class SelectManyShuttle {
 
-static init = function(elements) {
-  elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
-  var shuttles = Tobago4Utils.selectWithJQuery(elements, ".tobago-selectManyShuttle:not(.tobago-selectManyShuttle-disabled)");
+  static init = function (elements) {
+    elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
+    var shuttles = Tobago4Utils.selectWithJQuery(elements, ".tobago-selectManyShuttle:not(.tobago-selectManyShuttle-disabled)");
 
-  shuttles.find(".tobago-selectManyShuttle-unselected").dblclick(function() {
-    SelectManyShuttle.moveSelectedItems(jQuery(this).parents(".tobago-selectManyShuttle"), true, false);
-  });
+    shuttles.find(".tobago-selectManyShuttle-unselected").dblclick(function () {
+      SelectManyShuttle.moveSelectedItems(jQuery(this).parents(".tobago-selectManyShuttle"), true, false);
+    });
 
-  shuttles.find(".tobago-selectManyShuttle-selected").dblclick(function() {
-    SelectManyShuttle.moveSelectedItems(jQuery(this).parents(".tobago-selectManyShuttle"), false, false);
-  });
+    shuttles.find(".tobago-selectManyShuttle-selected").dblclick(function () {
+      SelectManyShuttle.moveSelectedItems(jQuery(this).parents(".tobago-selectManyShuttle"), false, false);
+    });
 
-  shuttles.find(".tobago-selectManyShuttle-addAll").click(function() {
-    SelectManyShuttle.moveSelectedItems(jQuery(this).parents(".tobago-selectManyShuttle"), true, true);
-  });
+    shuttles.find(".tobago-selectManyShuttle-addAll").click(function () {
+      SelectManyShuttle.moveSelectedItems(jQuery(this).parents(".tobago-selectManyShuttle"), true, true);
+    });
 
-  shuttles.find(".tobago-selectManyShuttle-add").click(function() {
-    SelectManyShuttle.moveSelectedItems(jQuery(this).parents(".tobago-selectManyShuttle"), true, false);
-  });
+    shuttles.find(".tobago-selectManyShuttle-add").click(function () {
+      SelectManyShuttle.moveSelectedItems(jQuery(this).parents(".tobago-selectManyShuttle"), true, false);
+    });
 
-  shuttles.find(".tobago-selectManyShuttle-removeAll").click(function() {
-    SelectManyShuttle.moveSelectedItems(jQuery(this).parents(".tobago-selectManyShuttle"), false, true);
-  });
+    shuttles.find(".tobago-selectManyShuttle-removeAll").click(function () {
+      SelectManyShuttle.moveSelectedItems(jQuery(this).parents(".tobago-selectManyShuttle"), false, true);
+    });
 
-  shuttles.find(".tobago-selectManyShuttle-remove").click(function() {
-    SelectManyShuttle.moveSelectedItems(jQuery(this).parents(".tobago-selectManyShuttle"), false, false);
-  });
-};
+    shuttles.find(".tobago-selectManyShuttle-remove").click(function () {
+      SelectManyShuttle.moveSelectedItems(jQuery(this).parents(".tobago-selectManyShuttle"), false, false);
+    });
+  };
 
-static moveSelectedItems = function($shuttle, direction, all) {
-  var $unselected = $shuttle.find(".tobago-selectManyShuttle-unselected");
-  var $selected = $shuttle.find(".tobago-selectManyShuttle-selected");
-  var count = $selected.children().length;
-  var $source = direction ? $unselected : $selected;
-  var $target = direction ? $selected : $unselected;
-  var $shifted = $source.find(all ? "option:not(:disabled)" : "option:selected").remove().appendTo($target);
+  static moveSelectedItems = function ($shuttle, direction, all) {
+    var $unselected = $shuttle.find(".tobago-selectManyShuttle-unselected");
+    var $selected = $shuttle.find(".tobago-selectManyShuttle-selected");
+    var count = $selected.children().length;
+    var $source = direction ? $unselected : $selected;
+    var $target = direction ? $selected : $unselected;
+    var $shifted = $source.find(all ? "option:not(:disabled)" : "option:selected").remove().appendTo($target);
 
-  // synchronize the hidden select
-  var $hidden = $shuttle.find(".tobago-selectManyShuttle-hidden");
-  var $hiddenOptions = $hidden.find("option");
-  // todo: may be optimized: put values in a hash map?
-  $shifted.each(function() {
-    var $option = jQuery(this);
-    $hiddenOptions.filter("[value='" + $option.val() + "']").prop("selected", direction);
-  });
+    // synchronize the hidden select
+    var $hidden = $shuttle.find(".tobago-selectManyShuttle-hidden");
+    var $hiddenOptions = $hidden.find("option");
+    // todo: may be optimized: put values in a hash map?
+    $shifted.each(function () {
+      var $option = jQuery(this);
+      $hiddenOptions.filter("[value='" + $option.val() + "']").prop("selected", direction);
+    });
 
-  if (count !== $selected.children().length) {
-    var e = jQuery.Event("change");
-    // trigger an change event for command facets
-    $hidden.trigger( e );
-  }
-};
+    if (count !== $selected.children().length) {
+      var e = jQuery.Event("change");
+      // trigger an change event for command facets
+      $hidden.trigger(e);
+    }
+  };
 }
 
 Listener.register(SelectManyShuttle.init, Phase.DOCUMENT_READY);
@@ -83,44 +83,44 @@
 
 class SelectOneRadio {
 
-static init = function(elements) {
-  elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
-  var selectOneRadios = Tobago4Utils.selectWithJQuery(elements, ".tobago-selectOneRadio");
-  selectOneRadios.each(function() {
-    var ul = jQuery(this);
-    var id = ul.closest("[id]").attr("id");
-    var radios = jQuery('input[name="' + id.replace(/([:\.])/g, '\\$1') + '"]');
-    radios.each(function () {
-      var selectOneRadio = jQuery(this);
-      selectOneRadio.data("tobago-old-value", selectOneRadio.prop("checked"));
-    });
-    radios.click(function() {
-      var selectOneRadio = jQuery(this);
-      var readonly = selectOneRadio.prop("readonly");
-      var required = selectOneRadio.prop("required");
-      if (!required && !readonly) {
-        if (selectOneRadio.data("tobago-old-value") == selectOneRadio.prop("checked")) {
-          selectOneRadio.prop("checked", false);
-        }
+  static init = function (elements) {
+    elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
+    var selectOneRadios = Tobago4Utils.selectWithJQuery(elements, ".tobago-selectOneRadio");
+    selectOneRadios.each(function () {
+      var ul = jQuery(this);
+      var id = ul.closest("[id]").attr("id");
+      var radios = jQuery('input[name="' + id.replace(/([:\.])/g, '\\$1') + '"]');
+      radios.each(function () {
+        var selectOneRadio = jQuery(this);
         selectOneRadio.data("tobago-old-value", selectOneRadio.prop("checked"));
-      }
-      if (readonly) {
-        radios.each(function () {
-          var radio = jQuery(this);
-          radio.prop("checked", radio.data("tobago-old-value"));
-        });
-      } else {
-        radios.each(function () {
-          if (this.id != selectOneRadio.get(0).id) {
-            var radio = jQuery(this);
-            radio.prop("checked", false);
-            radio.data("tobago-old-value", radio.prop("checked"));
+      });
+      radios.click(function () {
+        var selectOneRadio = jQuery(this);
+        var readonly = selectOneRadio.prop("readonly");
+        var required = selectOneRadio.prop("required");
+        if (!required && !readonly) {
+          if (selectOneRadio.data("tobago-old-value") == selectOneRadio.prop("checked")) {
+            selectOneRadio.prop("checked", false);
           }
-        });
-      }
+          selectOneRadio.data("tobago-old-value", selectOneRadio.prop("checked"));
+        }
+        if (readonly) {
+          radios.each(function () {
+            var radio = jQuery(this);
+            radio.prop("checked", radio.data("tobago-old-value"));
+          });
+        } else {
+          radios.each(function () {
+            if (this.id != selectOneRadio.get(0).id) {
+              var radio = jQuery(this);
+              radio.prop("checked", false);
+              radio.data("tobago-old-value", radio.prop("checked"));
+            }
+          });
+        }
+      });
     });
-  });
-};
+  };
 }
 
 Listener.register(SelectOneRadio.init, Phase.DOCUMENT_READY);
@@ -130,25 +130,25 @@
 
 class SelectOneListbox {
 
-static init = function (elements) {
-  elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
-  var selects = Tobago4Utils.selectWithJQuery(elements, ".tobago-selectOneListbox");
-  var notRequired = selects.not(".tobago-selectOneListbox-markup-required");
-  notRequired
-      .change(function () {
-        var element = jQuery(this);
-        if (element.data("tobago-old-value") == undefined) {
-          element.data("tobago-old-value", -1);
-        }
-      }).click(function () {
-        var element = jQuery(this);
-        if (element.data("tobago-old-value") == undefined
-            || element.data("tobago-old-value") == element.prop("selectedIndex")) {
-          element.prop("selectedIndex", -1);
-        }
-        element.data("tobago-old-value", element.prop("selectedIndex"));
-      });
-};
+  static init = function (elements) {
+    elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
+    var selects = Tobago4Utils.selectWithJQuery(elements, ".tobago-selectOneListbox");
+    var notRequired = selects.not(".tobago-selectOneListbox-markup-required");
+    notRequired
+        .change(function () {
+          var element = jQuery(this);
+          if (element.data("tobago-old-value") == undefined) {
+            element.data("tobago-old-value", -1);
+          }
+        }).click(function () {
+      var element = jQuery(this);
+      if (element.data("tobago-old-value") == undefined
+          || element.data("tobago-old-value") == element.prop("selectedIndex")) {
+        element.prop("selectedIndex", -1);
+      }
+      element.data("tobago-old-value", element.prop("selectedIndex"));
+    });
+  };
 }
 
 Listener.register(SelectOneListbox.init, Phase.DOCUMENT_READY);
@@ -158,17 +158,17 @@
 
 class SelectBooleanCheckbox {
 
-static init = function(elements) {
-  elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
-  var checkboxes = Tobago4Utils.selectWithJQuery(elements, ".tobago-selectBooleanCheckbox input[readonly]");
-  checkboxes.each(function() {
-    // Save the initial state to restore it, when the user tries to manipulate it.
-    var initial = jQuery(this).is(":checked");
-    jQuery(this).click(function() {
-      jQuery(this).prop("checked", initial);
+  static init = function (elements) {
+    elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
+    var checkboxes = Tobago4Utils.selectWithJQuery(elements, ".tobago-selectBooleanCheckbox input[readonly]");
+    checkboxes.each(function () {
+      // Save the initial state to restore it, when the user tries to manipulate it.
+      var initial = jQuery(this).is(":checked");
+      jQuery(this).click(function () {
+        jQuery(this).prop("checked", initial);
+      });
     });
-  });
-};
+  };
 }
 
 Listener.register(SelectBooleanCheckbox.init, Phase.DOCUMENT_READY);
@@ -178,17 +178,17 @@
 
 class SelectBooleanToggle {
 
-static init = function(elements) {
-  elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
-  var toggles = Tobago4Utils.selectWithJQuery(elements, ".tobago-selectBooleanToggle input[readonly]");
-  toggles.each(function() {
-    // Save the initial state to restore it, when the user tries to manipulate it.
-    var initial = jQuery(this).is(":checked");
-    jQuery(this).click(function() {
-      jQuery(this).prop("checked", initial);
+  static init = function (elements) {
+    elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
+    var toggles = Tobago4Utils.selectWithJQuery(elements, ".tobago-selectBooleanToggle input[readonly]");
+    toggles.each(function () {
+      // Save the initial state to restore it, when the user tries to manipulate it.
+      var initial = jQuery(this).is(":checked");
+      jQuery(this).click(function () {
+        jQuery(this).prop("checked", initial);
+      });
     });
-  });
-};
+  };
 }
 
 Listener.register(SelectBooleanToggle.init, Phase.DOCUMENT_READY);
@@ -198,17 +198,17 @@
 
 class SelectManyCheckbox {
 
-static init = function(elements) {
-  elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
-  var checkboxes = Tobago4Utils.selectWithJQuery(elements, ".tobago-selectManyCheckbox input[readonly]");
-  checkboxes.each(function() {
-    // Save the initial state to restore it, when the user tries to manipulate it.
-    var initial = jQuery(this).is(":checked");
-    jQuery(this).click(function() {
-      jQuery(this).prop("checked", initial);
+  static init = function (elements) {
+    elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
+    var checkboxes = Tobago4Utils.selectWithJQuery(elements, ".tobago-selectManyCheckbox input[readonly]");
+    checkboxes.each(function () {
+      // Save the initial state to restore it, when the user tries to manipulate it.
+      var initial = jQuery(this).is(":checked");
+      jQuery(this).click(function () {
+        jQuery(this).prop("checked", initial);
+      });
     });
-  });
-};
+  };
 }
 
 Listener.register(SelectManyCheckbox.init, Phase.DOCUMENT_READY);
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-sheet.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-sheet.ts
index e6b929f..48bb8ed 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-sheet.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-sheet.ts
@@ -37,446 +37,446 @@
     this.dblClickReloadComponentId = null;//todo commands.dblclick.partially;// fixme: partially no longer used?
   }
 
-static init = function(element:HTMLElement) {
-  console.time("[tobago-sheet] init");
-  const sheets: Array<HTMLElement> = DomUtils.selfOrElementsByClassName(element, "tobago-sheet");
-  sheets.forEach(function (element):void {
-    var $sheet = jQuery(element);
-    var id = $sheet.attr("id");
-    const commands = $sheet.data("tobago-row-action");
-    const behavior = $sheet.data("tobago-behavior-commands");
-    const sheet = new Sheet(id, commands, behavior);
-    Sheet.SHEETS.set(id, sheet);
-  });
-
-  Sheet.setup(sheets);
-
-  element.querySelectorAll( ".tobago-sheet-header .tobago-sheet-columnSelector").forEach(function (element) {
-    element.addEventListener("click", function(event: MouseEvent) {
-      var $checkbox = jQuery(event.target);
-      if ($checkbox.is(':checked')) {
-        Sheet.selectAll($checkbox.closest(".tobago-sheet"));
-      } else {
-        Sheet.deselectAll($checkbox.closest(".tobago-sheet"));
-      }
+  static init = function (element: HTMLElement) {
+    console.time("[tobago-sheet] init");
+    const sheets: Array<HTMLElement> = DomUtils.selfOrElementsByClassName(element, "tobago-sheet");
+    sheets.forEach(function (element): void {
+      var $sheet = jQuery(element);
+      var id = $sheet.attr("id");
+      const commands = $sheet.data("tobago-row-action");
+      const behavior = $sheet.data("tobago-behavior-commands");
+      const sheet = new Sheet(id, commands, behavior);
+      Sheet.SHEETS.set(id, sheet);
     });
-  });
 
-  console.timeEnd("[tobago-sheet] init");
-};
+    Sheet.setup(sheets);
 
-static setup = function (sheets) {
-
-  // synchronize column widths
-  sheets.forEach(function (element):void {
-    var $sheet = jQuery(element);
-
-    // basic idea: there are two possible sources for the sizes:
-    // 1. the columns attribute of <tc:sheet> like {"columns":[1.0,1.0,1.0]}, held by data attribute "tobago-layout"
-    // 2. the hidden field which may contain a value like ",300,200,100,"
-    //
-    // The 1st source usually is the default set by the developer.
-    // The 2nd source usually is the value set by the user manipulating the column widths.
-    //
-    // So, if the 2nd is set, we use it, if not set, we use the 1st source.
-    //
-
-    var hidden = Sheet.findHiddenWidths($sheet);
-
-    if (hidden.length > 0 && hidden.val()) {
-      // if the hidden has a value, than also the colgroup/col are set correctly
-      var columnWidths = JSON.parse(hidden.get(0).getAttribute("value"));
-      console.info("columnWidths: " + columnWidths);
-    }
-    if (columnWidths !== undefined && columnWidths.length === 0) {
-      // otherwise use the layout definition
-      var layout = $sheet.data("tobago-layout");
-      if (layout && layout.columns && layout.columns.length > 0) {
-        var tokens = layout.columns;
-        var rendered = JSON.parse(Sheet.findHiddenRendered($sheet).get(0).getAttribute("value"));
-
-        var $headerTable = $sheet.children("header").children("table");
-        var $headerCol = $headerTable.children("colgroup").children("col");
-        var $bodyTable = $sheet.children("div").children("table");
-        var $bodyCol = $bodyTable.children("colgroup").children("col");
-
-        console.assert($headerCol.length - 1 === $bodyCol.length, "header and body column number doesn't match");
-
-        var i;
-        var intValue;
-        var sumRelative = 0;
-        var widthRelative = $bodyTable.width();
-        for (i = 0; i < tokens.length; i++) {
-          if (rendered[i] === "true") {
-            if (typeof tokens[i] === "number") {
-              sumRelative += tokens[i];
-            } else if (typeof tokens[i] === "object" && tokens[i].measure !== undefined) {
-              intValue = parseInt(tokens[i].measure);
-              if (tokens[i].measure.lastIndexOf("px") > 0) {
-                widthRelative -= intValue;
-              } else if (tokens[i].measure.lastIndexOf("%") > 0) {
-                widthRelative -= $bodyTable.width() / 100 * intValue;
-              }
-            } else {
-              console.debug("auto? = " + tokens[i]);
-            }
-          }
+    element.querySelectorAll(".tobago-sheet-header .tobago-sheet-columnSelector").forEach(function (element) {
+      element.addEventListener("click", function (event: MouseEvent) {
+        var $checkbox = jQuery(event.target);
+        if ($checkbox.is(':checked')) {
+          Sheet.selectAll($checkbox.closest(".tobago-sheet"));
+        } else {
+          Sheet.deselectAll($checkbox.closest(".tobago-sheet"));
         }
-        if (widthRelative < 0) {
-          widthRelative = 0;
-        }
-
-        var headerBodyColCount = 0;
-        for (i = 0; i < tokens.length; i++) {
-          var colWidth = 0;
-          if (rendered[i] === "true") {
-            if (typeof tokens[i] === "number") {
-              colWidth = tokens[i] * widthRelative / sumRelative;
-            } else if (typeof tokens[i] === "object" && tokens[i].measure !== undefined) {
-              intValue = parseInt(tokens[i].measure);
-              if (tokens[i].measure.lastIndexOf("px") > 0) {
-                colWidth = intValue;
-              } else if (tokens[i].measure.lastIndexOf("%") > 0) {
-                colWidth = $bodyTable.width() / 100 * intValue;
-              }
-            } else {
-              console.debug("auto? = " + tokens[i]);
-            }
-            if (colWidth > 0) { // because tokens[i] == "auto"
-              $headerCol.eq(headerBodyColCount).attr("width", colWidth);
-              $bodyCol.eq(headerBodyColCount).attr("width", colWidth);
-            }
-            headerBodyColCount++;
-          }
-        }
-      }
-    }
-    Sheet.addHeaderFillerWidth($sheet);
-  });
-
-  // resize: mouse events
-  sheets.forEach(function (element): void {
-    element.querySelectorAll(".tobago-sheet-headerResize").forEach(function (resizeElement): void {
-      const $resizeElement = jQuery(resizeElement);
-      $resizeElement.click(function () {
-        return false;
       });
-      $resizeElement.mousedown(function (event) {
-        // begin resizing
-        console.info("down");
-        var columnIndex = $resizeElement.data("tobago-column-index");
-        var $body = jQuery("body");
-        var $sheet = $resizeElement.closest(".tobago-sheet");
-        var $headerTable = $sheet.find(".tobago-sheet-headerTable");
-        var $bodyTable = $sheet.find(".tobago-sheet-bodyTable");
-        var headerColumn = $headerTable.children("colgroup").children("col").eq(columnIndex);
-        var bodyColumn = $bodyTable.children("colgroup").children("col").eq(columnIndex);
-        var data = {
-          columnIndex: columnIndex,
-          originalClientX: event.clientX,
-          headerColumn: headerColumn,
-          bodyColumn: bodyColumn,
-          originalHeaderColumnWidth: parseInt(headerColumn.attr("width"))
-        };
+    });
 
-        // Set width attribute: Avoid scrollBar position flip to 0.
-        $headerTable.css("width", $headerTable.outerWidth());
-        $bodyTable.css("width", $bodyTable.outerWidth());
+    console.timeEnd("[tobago-sheet] init");
+  };
 
-        $body.on("mousemove", data, function (event) {
-          console.info("move");
-          var delta = event.clientX - event.data.originalClientX;
-          delta = -Math.min(-delta, event.data.originalHeaderColumnWidth - 10);
-          var columnWidth = event.data.originalHeaderColumnWidth + delta;
-          event.data.headerColumn.attr("width", columnWidth);
-          event.data.bodyColumn.attr("width", columnWidth);
-          if (window.getSelection) {
-            window.getSelection().removeAllRanges();
-          }
-          return false;
-        });
-        $body.one("mouseup", function (event) {
-          // switch off the mouse move listener
-          jQuery("body").off("mousemove");
-          console.info("up");
-          // copy the width values from the header to the body, (and build a list of it)
-          var tokens = $sheet.data("tobago-layout").columns;
+  static setup = function (sheets) {
+
+    // synchronize column widths
+    sheets.forEach(function (element): void {
+      var $sheet = jQuery(element);
+
+      // basic idea: there are two possible sources for the sizes:
+      // 1. the columns attribute of <tc:sheet> like {"columns":[1.0,1.0,1.0]}, held by data attribute "tobago-layout"
+      // 2. the hidden field which may contain a value like ",300,200,100,"
+      //
+      // The 1st source usually is the default set by the developer.
+      // The 2nd source usually is the value set by the user manipulating the column widths.
+      //
+      // So, if the 2nd is set, we use it, if not set, we use the 1st source.
+      //
+
+      var hidden = Sheet.findHiddenWidths($sheet);
+
+      if (hidden.length > 0 && hidden.val()) {
+        // if the hidden has a value, than also the colgroup/col are set correctly
+        var columnWidths = JSON.parse(hidden.get(0).getAttribute("value"));
+        console.info("columnWidths: " + columnWidths);
+      }
+      if (columnWidths !== undefined && columnWidths.length === 0) {
+        // otherwise use the layout definition
+        var layout = $sheet.data("tobago-layout");
+        if (layout && layout.columns && layout.columns.length > 0) {
+          var tokens = layout.columns;
           var rendered = JSON.parse(Sheet.findHiddenRendered($sheet).get(0).getAttribute("value"));
-          var hidden = Sheet.findHiddenWidths($sheet);
-          var hiddenWidths;
-          if (hidden.length > 0 && hidden.val()) {
-            hiddenWidths = JSON.parse(hidden.get(0).getAttribute("value"));
-          }
-          var headerCols = $headerTable.find("col");
-          var bodyCols = $bodyTable.find("col");
-          var widths = [];
-          var oldWidthList = [];
-          var i;
-          for (i = 0; i < bodyCols.length; i++) {
-            oldWidthList[i] = bodyCols.eq(i).width();
-          }
-          var usedWidth = 0;
-          var headerBodyColCount = 0;
-          for (i = 0; i < rendered.length; i++) {
-            if (rendered[i] === "true") {
-              // last column is the filler column
-              var newWidth = headerCols.eq(headerBodyColCount).width();
-              // for the hidden field
-              widths[i] = newWidth;
-              usedWidth += newWidth;
 
-              var oldWidth = bodyCols.eq(headerBodyColCount).width();
-              if (oldWidth !== newWidth) {
-                // set to the body
-                bodyCols.eq(headerBodyColCount).attr("width", newWidth);
-                // reset the width inside of the cells (TD) if the value was changed.
-                var $tds = jQuery("td:nth-child(" + (headerBodyColCount + 1) + ")", $bodyTable);
-                if ($tds.length > 0) {
-                  var innerWidth = $tds.children().eq(0).width() - oldWidthList[headerBodyColCount] + newWidth;
-                  // setting all sizes of the inner cells to the same value
-                  $tds.children().width(innerWidth);
-                  // XXX later, if we have box-sizing: border-box we can set the width to 100%
+          var $headerTable = $sheet.children("header").children("table");
+          var $headerCol = $headerTable.children("colgroup").children("col");
+          var $bodyTable = $sheet.children("div").children("table");
+          var $bodyCol = $bodyTable.children("colgroup").children("col");
+
+          console.assert($headerCol.length - 1 === $bodyCol.length, "header and body column number doesn't match");
+
+          var i;
+          var intValue;
+          var sumRelative = 0;
+          var widthRelative = $bodyTable.width();
+          for (i = 0; i < tokens.length; i++) {
+            if (rendered[i] === "true") {
+              if (typeof tokens[i] === "number") {
+                sumRelative += tokens[i];
+              } else if (typeof tokens[i] === "object" && tokens[i].measure !== undefined) {
+                intValue = parseInt(tokens[i].measure);
+                if (tokens[i].measure.lastIndexOf("px") > 0) {
+                  widthRelative -= intValue;
+                } else if (tokens[i].measure.lastIndexOf("%") > 0) {
+                  widthRelative -= $bodyTable.width() / 100 * intValue;
                 }
+              } else {
+                console.debug("auto? = " + tokens[i]);
+              }
+            }
+          }
+          if (widthRelative < 0) {
+            widthRelative = 0;
+          }
+
+          var headerBodyColCount = 0;
+          for (i = 0; i < tokens.length; i++) {
+            var colWidth = 0;
+            if (rendered[i] === "true") {
+              if (typeof tokens[i] === "number") {
+                colWidth = tokens[i] * widthRelative / sumRelative;
+              } else if (typeof tokens[i] === "object" && tokens[i].measure !== undefined) {
+                intValue = parseInt(tokens[i].measure);
+                if (tokens[i].measure.lastIndexOf("px") > 0) {
+                  colWidth = intValue;
+                } else if (tokens[i].measure.lastIndexOf("%") > 0) {
+                  colWidth = $bodyTable.width() / 100 * intValue;
+                }
+              } else {
+                console.debug("auto? = " + tokens[i]);
+              }
+              if (colWidth > 0) { // because tokens[i] == "auto"
+                $headerCol.eq(headerBodyColCount).attr("width", colWidth);
+                $bodyCol.eq(headerBodyColCount).attr("width", colWidth);
               }
               headerBodyColCount++;
-            } else if (hiddenWidths !== undefined && hiddenWidths.length >= i) {
-              widths[i] = hiddenWidths[i];
-            } else {
-              if (typeof tokens[i] === "number") {
-                widths[i] = 100;
-              } else if (typeof tokens[i] === "object" && tokens[i].measure !== undefined) {
-                var intValue = parseInt(tokens[i].measure);
-                if (tokens[i].measure.lastIndexOf("px") > 0) {
-                  widths[i] = intValue;
-                } else if (tokens[i].measure.lastIndexOf("%") > 0) {
-                  widths[i] = $bodyTable.width() / 100 * intValue;
-                }
-              }
             }
           }
-          // Remove width attribute: Avoid scrollBar position flip to 0.
-          $headerTable.css("width", "");
-          $bodyTable.css("width", "");
+        }
+      }
+      Sheet.addHeaderFillerWidth($sheet);
+    });
 
-          // store the width values in a hidden field
-          Sheet.findHiddenWidths($sheet).val(JSON.stringify(widths));
+    // resize: mouse events
+    sheets.forEach(function (element): void {
+      element.querySelectorAll(".tobago-sheet-headerResize").forEach(function (resizeElement): void {
+        const $resizeElement = jQuery(resizeElement);
+        $resizeElement.click(function () {
           return false;
         });
-      });
-    });
-  });
+        $resizeElement.mousedown(function (event) {
+          // begin resizing
+          console.info("down");
+          var columnIndex = $resizeElement.data("tobago-column-index");
+          var $body = jQuery("body");
+          var $sheet = $resizeElement.closest(".tobago-sheet");
+          var $headerTable = $sheet.find(".tobago-sheet-headerTable");
+          var $bodyTable = $sheet.find(".tobago-sheet-bodyTable");
+          var headerColumn = $headerTable.children("colgroup").children("col").eq(columnIndex);
+          var bodyColumn = $bodyTable.children("colgroup").children("col").eq(columnIndex);
+          var data = {
+            columnIndex: columnIndex,
+            originalClientX: event.clientX,
+            headerColumn: headerColumn,
+            bodyColumn: bodyColumn,
+            originalHeaderColumnWidth: parseInt(headerColumn.attr("width"))
+          };
 
-  // scrolling
-  sheets.forEach(function (element): void {
-    var $sheet = jQuery(element);
-    $sheet.find(".tobago-sheet-body").on("scroll", function () {
-      var sheetBody = jQuery(this);
-      var scrollLeft = sheetBody.prop("scrollLeft");
-      var scrollTop = sheetBody.prop("scrollTop");
+          // Set width attribute: Avoid scrollBar position flip to 0.
+          $headerTable.css("width", $headerTable.outerWidth());
+          $bodyTable.css("width", $bodyTable.outerWidth());
 
-      // scrolling the table should move the header
-      sheetBody.siblings(".tobago-sheet-header").prop("scrollLeft", scrollLeft);
-
-      // store the position in a hidden field
-      var hidden = Sheet.findHiddenScrollPosition(sheetBody.parent());
-      hidden.val(Math.round(scrollLeft) + ";" + Math.round(scrollTop));
-    });
-  });
-
-  // restore scroll position
-  sheets.forEach(function (element):void {
-    var $sheet = jQuery(element);
-    var $hidden = Sheet.findHiddenScrollPosition($sheet);
-    const value = $hidden.get(0).getAttribute("value");
-    var sep = value.indexOf(";");
-    if (sep !== -1) {
-      var scrollLeft = value.substr(0, sep);
-      var scrollTop = value.substr(sep + 1);
-      var $body = $sheet.children(".tobago-sheet-body");
-      $body.prop("scrollLeft", scrollLeft);
-      $body.prop("scrollTop", scrollTop);
-      $sheet.children(".tobago-sheet-header").prop("scrollLeft", scrollLeft);
-    }
-  });
-
-  // add selection listeners
-  sheets.forEach(function (element): void {
-    var $sheet = jQuery(element);
-    var selectionMode = $sheet.data("tobago-selection-mode");
-    if (selectionMode === "single" || selectionMode === "singleOrNone" || selectionMode === "multi") {
-      Sheet.getRows($sheet).each(function () {
-        var $row = jQuery(this);
-        $row.on("mousedown", function (event) {
-          $sheet.data("tobago-mouse-down-x", event.clientX);
-          $sheet.data("tobago-mouse-down-y", event.clientY);
-        });
-        $row.click(function (event) {
-          var $target = jQuery(event.target);
-          var $row = jQuery(this);
-          if ($target.hasClass("tobago-sheet-columnSelector") || !Sheet.isInputElement($target)) {
-            var $sheet = $row.closest(".tobago-sheet");
-
-            if (Math.abs($sheet.data("tobago-mouse-down-x") - event.clientX)
-                + Math.abs($sheet.data("tobago-mouse-down-y") - event.clientY) > 5) {
-              // The user has moved the mouse. We assume, the user want to select some text inside the sheet,
-              // so we doesn't select the row.
-              return;
-            }
-
+          $body.on("mousemove", data, function (event) {
+            console.info("move");
+            var delta = event.clientX - event.data.originalClientX;
+            delta = -Math.min(-delta, event.data.originalHeaderColumnWidth - 10);
+            var columnWidth = event.data.originalHeaderColumnWidth + delta;
+            event.data.headerColumn.attr("width", columnWidth);
+            event.data.bodyColumn.attr("width", columnWidth);
             if (window.getSelection) {
               window.getSelection().removeAllRanges();
             }
-
-            var $rows = Sheet.getRows($sheet);
-            var $selector = Sheet.getSelectorCheckbox($row);
-
-            var selectionMode = $sheet.data("tobago-selection-mode");
-
-            if ((!event.ctrlKey && !event.metaKey && $selector.length === 0)
-                || selectionMode === "single" || selectionMode === "singleOrNone") {
-              Sheet.deselectAll($sheet);
-              Sheet.resetSelected($sheet);
-            }
-
-            var lastClickedRowIndex = $sheet.data("tobago-last-clicked-row-index");
-            if (event.shiftKey && selectionMode === "multi" && lastClickedRowIndex > -1) {
-              if (lastClickedRowIndex <= $row.index()) {
-                Sheet.selectRange($sheet, $rows, lastClickedRowIndex, $row.index(), true, false);
-              } else {
-                Sheet.selectRange($sheet, $rows, $row.index(), lastClickedRowIndex, true, false);
-              }
-            } else if (selectionMode !== "singleOrNone" || !Sheet.isRowSelected($sheet, $row)) {
-              Sheet.toggleSelection($sheet, $row, $selector);
-            }
-            var commands = $sheet.data("tobago-row-action");
-            var click = commands ? commands.click : undefined;
-            var clickActionId = click ? click.action : undefined;
-            var clickExecuteIds = click ? click.execute : undefined;
-            var clickRenderIds = click ? click.render : undefined;
-
-            var id = $sheet.attr("id");
-
-            if (clickActionId) {
-              var action;
-              var index = clickActionId.indexOf(id);
-              var rowIndex = Sheet.getDataIndex($sheet, $row);
-              if (index >= 0) {
-                action = id + ":" + rowIndex + ":" + clickActionId.substring(index + id.length + 1);
-              } else {
-                action = id + ":" + rowIndex + ":" + clickActionId;
-              }
-              if (clickExecuteIds && clickExecuteIds.length > 0) {
-                //Tobago.reloadComponent($target.get(0), clickReloadComponentId, action)
-                jsf.ajax.request(
-                    action,
-                    event,
-                    {
-                      //"javax.faces.behavior.event": "click",
-                      execute: clickExecuteIds,
-                      render: clickRenderIds
-                    });
-              } else {
-                Tobago4.submitAction($target.get(0), action);
-              }
-            }
-          }
-        });
-        // todo: check if this works correctly
-        const sheet = Sheet.SHEETS.get($sheet.attr("id"));
-        if (sheet && sheet.dblClickActionId) {
-          $row.on("dblclick", function (event) {
-            // todo: re-implement
-           sheet.doDblClick(event);
+            return false;
           });
-        }
-      });
-    }
-    $sheet.find(".tobago-sheet-cell > input.tobago-sheet-columnSelector").click(
-        function (event) {
-          event.preventDefault();
-        });
-  });
+          $body.one("mouseup", function (event) {
+            // switch off the mouse move listener
+            jQuery("body").off("mousemove");
+            console.info("up");
+            // copy the width values from the header to the body, (and build a list of it)
+            var tokens = $sheet.data("tobago-layout").columns;
+            var rendered = JSON.parse(Sheet.findHiddenRendered($sheet).get(0).getAttribute("value"));
+            var hidden = Sheet.findHiddenWidths($sheet);
+            var hiddenWidths;
+            if (hidden.length > 0 && hidden.val()) {
+              hiddenWidths = JSON.parse(hidden.get(0).getAttribute("value"));
+            }
+            var headerCols = $headerTable.find("col");
+            var bodyCols = $bodyTable.find("col");
+            var widths = [];
+            var oldWidthList = [];
+            var i;
+            for (i = 0; i < bodyCols.length; i++) {
+              oldWidthList[i] = bodyCols.eq(i).width();
+            }
+            var usedWidth = 0;
+            var headerBodyColCount = 0;
+            for (i = 0; i < rendered.length; i++) {
+              if (rendered[i] === "true") {
+                // last column is the filler column
+                var newWidth = headerCols.eq(headerBodyColCount).width();
+                // for the hidden field
+                widths[i] = newWidth;
+                usedWidth += newWidth;
 
-  // init paging by pages
-  sheets.forEach(function (element): void {
-    var $sheet = jQuery(element);
-    $sheet.find(".tobago-sheet-pagingText").each(function () {
-      var pagingText = jQuery(this);
-      pagingText.click(function () {
-        var text = jQuery(this);
-        text.children(".tobago-sheet-pagingOutput").hide();
-        text.children(".tobago-sheet-pagingInput").show().focus().select();
-      });
-      pagingText.children(".tobago-sheet-pagingInput")
-          .blur(function () {
-            Sheet.hideInputOrSubmit(jQuery(this));
-          }).keydown(function (event) {
-        if (event.keyCode === 13) {
-          event.stopPropagation();
-          event.preventDefault();
-          jQuery(this).blur();
-        }
+                var oldWidth = bodyCols.eq(headerBodyColCount).width();
+                if (oldWidth !== newWidth) {
+                  // set to the body
+                  bodyCols.eq(headerBodyColCount).attr("width", newWidth);
+                  // reset the width inside of the cells (TD) if the value was changed.
+                  var $tds = jQuery("td:nth-child(" + (headerBodyColCount + 1) + ")", $bodyTable);
+                  if ($tds.length > 0) {
+                    var innerWidth = $tds.children().eq(0).width() - oldWidthList[headerBodyColCount] + newWidth;
+                    // setting all sizes of the inner cells to the same value
+                    $tds.children().width(innerWidth);
+                    // XXX later, if we have box-sizing: border-box we can set the width to 100%
+                  }
+                }
+                headerBodyColCount++;
+              } else if (hiddenWidths !== undefined && hiddenWidths.length >= i) {
+                widths[i] = hiddenWidths[i];
+              } else {
+                if (typeof tokens[i] === "number") {
+                  widths[i] = 100;
+                } else if (typeof tokens[i] === "object" && tokens[i].measure !== undefined) {
+                  var intValue = parseInt(tokens[i].measure);
+                  if (tokens[i].measure.lastIndexOf("px") > 0) {
+                    widths[i] = intValue;
+                  } else if (tokens[i].measure.lastIndexOf("%") > 0) {
+                    widths[i] = $bodyTable.width() / 100 * intValue;
+                  }
+                }
+              }
+            }
+            // Remove width attribute: Avoid scrollBar position flip to 0.
+            $headerTable.css("width", "");
+            $bodyTable.css("width", "");
+
+            // store the width values in a hidden field
+            Sheet.findHiddenWidths($sheet).val(JSON.stringify(widths));
+            return false;
+          });
+        });
       });
     });
-  });
-};
 
-static hideInputOrSubmit = function ($input) {
-  let $output = $input.siblings(".tobago-sheet-pagingOutput");
-  let changed = $output.html() !== $input.val();
-  let sheetId = $input.parents(".tobago-sheet:first").attr("id");
-  $output.html($input.val());
-  if (changed) {
-    console.debug("reloading sheet '" + $input.attr("id") + "' '" + sheetId + "'");
-    jsf.ajax.request(
-        $input.attr("id"),
-        null,
-        {
-          "javax.faces.behavior.event": "reload",
-          execute: sheetId,
-          render: sheetId
+    // scrolling
+    sheets.forEach(function (element): void {
+      var $sheet = jQuery(element);
+      $sheet.find(".tobago-sheet-body").on("scroll", function () {
+        var sheetBody = jQuery(this);
+        var scrollLeft = sheetBody.prop("scrollLeft");
+        var scrollTop = sheetBody.prop("scrollTop");
+
+        // scrolling the table should move the header
+        sheetBody.siblings(".tobago-sheet-header").prop("scrollLeft", scrollLeft);
+
+        // store the position in a hidden field
+        var hidden = Sheet.findHiddenScrollPosition(sheetBody.parent());
+        hidden.val(Math.round(scrollLeft) + ";" + Math.round(scrollTop));
+      });
+    });
+
+    // restore scroll position
+    sheets.forEach(function (element): void {
+      var $sheet = jQuery(element);
+      var $hidden = Sheet.findHiddenScrollPosition($sheet);
+      const value = $hidden.get(0).getAttribute("value");
+      var sep = value.indexOf(";");
+      if (sep !== -1) {
+        var scrollLeft = value.substr(0, sep);
+        var scrollTop = value.substr(sep + 1);
+        var $body = $sheet.children(".tobago-sheet-body");
+        $body.prop("scrollLeft", scrollLeft);
+        $body.prop("scrollTop", scrollTop);
+        $sheet.children(".tobago-sheet-header").prop("scrollLeft", scrollLeft);
+      }
+    });
+
+    // add selection listeners
+    sheets.forEach(function (element): void {
+      var $sheet = jQuery(element);
+      var selectionMode = $sheet.data("tobago-selection-mode");
+      if (selectionMode === "single" || selectionMode === "singleOrNone" || selectionMode === "multi") {
+        Sheet.getRows($sheet).each(function () {
+          var $row = jQuery(this);
+          $row.on("mousedown", function (event) {
+            $sheet.data("tobago-mouse-down-x", event.clientX);
+            $sheet.data("tobago-mouse-down-y", event.clientY);
+          });
+          $row.click(function (event) {
+            var $target = jQuery(event.target);
+            var $row = jQuery(this);
+            if ($target.hasClass("tobago-sheet-columnSelector") || !Sheet.isInputElement($target)) {
+              var $sheet = $row.closest(".tobago-sheet");
+
+              if (Math.abs($sheet.data("tobago-mouse-down-x") - event.clientX)
+                  + Math.abs($sheet.data("tobago-mouse-down-y") - event.clientY) > 5) {
+                // The user has moved the mouse. We assume, the user want to select some text inside the sheet,
+                // so we doesn't select the row.
+                return;
+              }
+
+              if (window.getSelection) {
+                window.getSelection().removeAllRanges();
+              }
+
+              var $rows = Sheet.getRows($sheet);
+              var $selector = Sheet.getSelectorCheckbox($row);
+
+              var selectionMode = $sheet.data("tobago-selection-mode");
+
+              if ((!event.ctrlKey && !event.metaKey && $selector.length === 0)
+                  || selectionMode === "single" || selectionMode === "singleOrNone") {
+                Sheet.deselectAll($sheet);
+                Sheet.resetSelected($sheet);
+              }
+
+              var lastClickedRowIndex = $sheet.data("tobago-last-clicked-row-index");
+              if (event.shiftKey && selectionMode === "multi" && lastClickedRowIndex > -1) {
+                if (lastClickedRowIndex <= $row.index()) {
+                  Sheet.selectRange($sheet, $rows, lastClickedRowIndex, $row.index(), true, false);
+                } else {
+                  Sheet.selectRange($sheet, $rows, $row.index(), lastClickedRowIndex, true, false);
+                }
+              } else if (selectionMode !== "singleOrNone" || !Sheet.isRowSelected($sheet, $row)) {
+                Sheet.toggleSelection($sheet, $row, $selector);
+              }
+              var commands = $sheet.data("tobago-row-action");
+              var click = commands ? commands.click : undefined;
+              var clickActionId = click ? click.action : undefined;
+              var clickExecuteIds = click ? click.execute : undefined;
+              var clickRenderIds = click ? click.render : undefined;
+
+              var id = $sheet.attr("id");
+
+              if (clickActionId) {
+                var action;
+                var index = clickActionId.indexOf(id);
+                var rowIndex = Sheet.getDataIndex($sheet, $row);
+                if (index >= 0) {
+                  action = id + ":" + rowIndex + ":" + clickActionId.substring(index + id.length + 1);
+                } else {
+                  action = id + ":" + rowIndex + ":" + clickActionId;
+                }
+                if (clickExecuteIds && clickExecuteIds.length > 0) {
+                  //Tobago.reloadComponent($target.get(0), clickReloadComponentId, action)
+                  jsf.ajax.request(
+                      action,
+                      event,
+                      {
+                        //"javax.faces.behavior.event": "click",
+                        execute: clickExecuteIds,
+                        render: clickRenderIds
+                      });
+                } else {
+                  Tobago4.submitAction($target.get(0), action);
+                }
+              }
+            }
+          });
+          // todo: check if this works correctly
+          const sheet = Sheet.SHEETS.get($sheet.attr("id"));
+          if (sheet && sheet.dblClickActionId) {
+            $row.on("dblclick", function (event) {
+              // todo: re-implement
+              sheet.doDblClick(event);
+            });
+          }
         });
-  } else {
-    console.info("no update needed");
-    $input.hide();
-    $output.show();
-  }
-};
+      }
+      $sheet.find(".tobago-sheet-cell > input.tobago-sheet-columnSelector").click(
+          function (event) {
+            event.preventDefault();
+          });
+    });
 
-static findHiddenSelected = function($sheet){
-  var id = $sheet.attr("id") + Tobago4.SUB_COMPONENT_SEP + "selected";
-  return jQuery(DomUtils.escapeClientId(id));
-};
+    // init paging by pages
+    sheets.forEach(function (element): void {
+      var $sheet = jQuery(element);
+      $sheet.find(".tobago-sheet-pagingText").each(function () {
+        var pagingText = jQuery(this);
+        pagingText.click(function () {
+          var text = jQuery(this);
+          text.children(".tobago-sheet-pagingOutput").hide();
+          text.children(".tobago-sheet-pagingInput").show().focus().select();
+        });
+        pagingText.children(".tobago-sheet-pagingInput")
+            .blur(function () {
+              Sheet.hideInputOrSubmit(jQuery(this));
+            }).keydown(function (event) {
+          if (event.keyCode === 13) {
+            event.stopPropagation();
+            event.preventDefault();
+            jQuery(this).blur();
+          }
+        });
+      });
+    });
+  };
 
-static findHiddenScrollPosition = function($sheet){
-  var id = $sheet.attr("id") + Tobago4.SUB_COMPONENT_SEP + "scrollPosition";
-  return jQuery(DomUtils.escapeClientId(id));
-};
+  static hideInputOrSubmit = function ($input) {
+    let $output = $input.siblings(".tobago-sheet-pagingOutput");
+    let changed = $output.html() !== $input.val();
+    let sheetId = $input.parents(".tobago-sheet:first").attr("id");
+    $output.html($input.val());
+    if (changed) {
+      console.debug("reloading sheet '" + $input.attr("id") + "' '" + sheetId + "'");
+      jsf.ajax.request(
+          $input.attr("id"),
+          null,
+          {
+            "javax.faces.behavior.event": "reload",
+            execute: sheetId,
+            render: sheetId
+          });
+    } else {
+      console.info("no update needed");
+      $input.hide();
+      $output.show();
+    }
+  };
 
-static findHiddenWidths = function($sheet){
-  var id = $sheet.attr("id") + Tobago4.SUB_COMPONENT_SEP + "widths";
-  return jQuery(DomUtils.escapeClientId(id));
-};
+  static findHiddenSelected = function ($sheet) {
+    var id = $sheet.attr("id") + Tobago4.SUB_COMPONENT_SEP + "selected";
+    return jQuery(DomUtils.escapeClientId(id));
+  };
 
-static findHiddenRendered = function($sheet){
-  var id = $sheet.attr("id") + Tobago4.SUB_COMPONENT_SEP + "rendered";
-  return jQuery(DomUtils.escapeClientId(id));
-};
+  static findHiddenScrollPosition = function ($sheet) {
+    var id = $sheet.attr("id") + Tobago4.SUB_COMPONENT_SEP + "scrollPosition";
+    return jQuery(DomUtils.escapeClientId(id));
+  };
 
-static addHeaderFillerWidth = function($sheet) {
-  var $headerTable = $sheet.find(".tobago-sheet-headerTable");
-  var $headerCols = $headerTable.find("col");
-  $headerCols.last().attr("width", Sheet.getScrollBarSize());
-};
+  static findHiddenWidths = function ($sheet) {
+    var id = $sheet.attr("id") + Tobago4.SUB_COMPONENT_SEP + "widths";
+    return jQuery(DomUtils.escapeClientId(id));
+  };
 
-static getScrollBarSize = function() {
-  var $outer = $('<div>').css({visibility: 'hidden', width: 100, overflow: 'scroll'}).appendTo('body'),
-      widthWithScroll = $('<div>').css({width: '100%'}).appendTo($outer).outerWidth();
-  $outer.remove();
-  return 100 - widthWithScroll;
-};
+  static findHiddenRendered = function ($sheet) {
+    var id = $sheet.attr("id") + Tobago4.SUB_COMPONENT_SEP + "rendered";
+    return jQuery(DomUtils.escapeClientId(id));
+  };
 
-doDblClick(event) {
+  static addHeaderFillerWidth = function ($sheet) {
+    var $headerTable = $sheet.find(".tobago-sheet-headerTable");
+    var $headerCols = $headerTable.find("col");
+    $headerCols.last().attr("width", Sheet.getScrollBarSize());
+  };
+
+  static getScrollBarSize = function () {
+    var $outer = $('<div>').css({visibility: 'hidden', width: 100, overflow: 'scroll'}).appendTo('body'),
+        widthWithScroll = $('<div>').css({width: '100%'}).appendTo($outer).outerWidth();
+    $outer.remove();
+    return 100 - widthWithScroll;
+  };
+
+  doDblClick(event) {
     var target = event.target;
     if (!Sheet.isInputElement(jQuery(target))) {
       var row = jQuery(target).closest("tr");
@@ -486,7 +486,7 @@
         var action;
         var index = this.dblClickActionId.indexOf(this.id);
         if (index >= 0) {
-          action = this.id + ":" + rowIndex + ":" + this.dblClickActionId.substring(index + this.id.length +1);
+          action = this.id + ":" + rowIndex + ":" + this.dblClickActionId.substring(index + this.id.length + 1);
         } else {
           action = this.id + ":" + rowIndex + ":" + this.dblClickActionId;
         }
@@ -506,124 +506,128 @@
     }
   };
 
-/**
- * Get the element, which indicates the selection
- * @param row as a jQuery object
- */
-static getSelectorCheckbox = function(row) {
-  return row.find(">td>input.tobago-sheet-columnSelector");
-};
+  /**
+   * Get the element, which indicates the selection
+   * @param row as a jQuery object
+   */
+  static getSelectorCheckbox = function (row) {
+    return row.find(">td>input.tobago-sheet-columnSelector");
+  };
 
-static getSiblingRow = function(row, i) {
-  return row.parentNode.childNodes[i];
-};
+  static getSiblingRow = function (row, i) {
+    return row.parentNode.childNodes[i];
+  };
 
-static getRows = function($sheet) {
-  return $sheet.find(">div>table>tbody>tr");
-};
+  static getRows = function ($sheet) {
+    return $sheet.find(">div>table>tbody>tr");
+  };
 
-static isRowSelected = function($sheet, row) {
-  var rowIndex = +row.data("tobago-row-index");
-  if (!rowIndex) {
-    rowIndex = row.index() + $sheet.data("tobago-first");
-  }
-  return Sheet.isSelected($sheet, rowIndex);
-};
-
-static isSelected = function($sheet, rowIndex) {
-  return Sheet.findHiddenSelected($sheet).get(0).getAttribute("value").indexOf("," + rowIndex + ",") >= 0;
-};
-
-static resetSelected = function($sheet) {
-  Sheet.findHiddenSelected($sheet).val(",");
-};
-
-static toggleSelection = function($sheet, $row, $checkbox) {
-  $sheet.data("tobago-last-clicked-row-index", $row.index());
-  if (!$checkbox.is(":disabled")) {
-    var $selected = Sheet.findHiddenSelected($sheet);
-    var rowIndex = Sheet.getDataIndex($sheet, $row);
-    if (Sheet.isSelected($sheet, rowIndex)) {
-      Sheet.deselectRow($selected, rowIndex, $row, $checkbox);
-    } else {
-      Sheet.selectRow($selected, rowIndex, $row, $checkbox);
+  static isRowSelected = function ($sheet, row) {
+    var rowIndex = +row.data("tobago-row-index");
+    if (!rowIndex) {
+      rowIndex = row.index() + $sheet.data("tobago-first");
     }
-  }
-};
+    return Sheet.isSelected($sheet, rowIndex);
+  };
 
-static selectAll = function($sheet) {
-  var $rows = Sheet.getRows($sheet);
-  Sheet.selectRange($sheet, $rows, 0, $rows.length - 1, true, false);
-};
+  static isSelected = function ($sheet, rowIndex) {
+    return Sheet.findHiddenSelected($sheet).get(0).getAttribute("value").indexOf("," + rowIndex + ",") >= 0;
+  };
 
-static deselectAll = function($sheet) {
-  var $rows = Sheet.getRows($sheet);
-  Sheet.selectRange($sheet, $rows, 0, $rows.length - 1, false, true);
-};
+  static resetSelected = function ($sheet) {
+    Sheet.findHiddenSelected($sheet).val(",");
+  };
 
-static toggleAll = function(sheet) {
-  var rows = Sheet.getRows(sheet);
-  Sheet.selectRange(sheet, rows, 0, rows.length - 1, true, true);
-};
-
-static selectRange = function($sheet, $rows, first, last, selectDeselected, deselectSelected) {
-  if ($rows.length === 0) {
-    return;
-  }
-  var selected = Sheet.findHiddenSelected($sheet);
-  for (var i = first; i <= last; i++) {
-    var $row = $rows.eq(i);
-    var checkbox = Sheet.getSelectorCheckbox($row);
-    if (!checkbox.is(":disabled")) {
+  static toggleSelection = function ($sheet, $row, $checkbox) {
+    $sheet.data("tobago-last-clicked-row-index", $row.index());
+    if (!$checkbox.is(":disabled")) {
+      var $selected = Sheet.findHiddenSelected($sheet);
       var rowIndex = Sheet.getDataIndex($sheet, $row);
-      var on = selected.get(0).getAttribute("value").indexOf("," + rowIndex + ",") >= 0;
-      if (selectDeselected && !on) {
-        Sheet.selectRow(selected, rowIndex, $row, checkbox);
-      } else if (deselectSelected && on) {
-        Sheet.deselectRow(selected, rowIndex, $row, checkbox);
+      if (Sheet.isSelected($sheet, rowIndex)) {
+        Sheet.deselectRow($selected, rowIndex, $row, $checkbox);
+      } else {
+        Sheet.selectRow($selected, rowIndex, $row, $checkbox);
       }
     }
-  }
-};
+  };
 
-static getDataIndex = function($sheet, $row) {
-  var rowIndex = $row.data("tobago-row-index");
-  if (rowIndex) {
-    return +rowIndex;
-  } else {
-    return $row.index() + $sheet.data("tobago-first");
-  }
-};
+  static selectAll = function ($sheet) {
+    var $rows = Sheet.getRows($sheet);
+    Sheet.selectRange($sheet, $rows, 0, $rows.length - 1, true, false);
+  };
 
-/**
- * @param $selected input-element type=hidden: Hidden field with the selection state information
- * @param rowIndex int: zero based index of the row.
- * @param $row tr-element: the row.
- * @param $checkbox input-element: selector in the row.
- */
-static selectRow = function($selected, rowIndex, $row, $checkbox) {
-  $selected.val($selected.val() + rowIndex + ",");
-  $row.addClass("tobago-sheet-row-markup-selected table-info");
+  static deselectAll = function ($sheet) {
+    var $rows = Sheet.getRows($sheet);
+    Sheet.selectRange($sheet, $rows, 0, $rows.length - 1, false, true);
+  };
+
+  static toggleAll = function (sheet) {
+    var rows = Sheet.getRows(sheet);
+    Sheet.selectRange(sheet, rows, 0, rows.length - 1, true, true);
+  };
+
+  static selectRange = function ($sheet, $rows, first, last, selectDeselected, deselectSelected) {
+    if ($rows.length === 0) {
+      return;
+    }
+    var selected = Sheet.findHiddenSelected($sheet);
+    for (var i = first; i <= last; i++) {
+      var $row = $rows.eq(i);
+      var checkbox = Sheet.getSelectorCheckbox($row);
+      if (!checkbox.is(":disabled")) {
+        var rowIndex = Sheet.getDataIndex($sheet, $row);
+        var on = selected.get(0).getAttribute("value").indexOf("," + rowIndex + ",") >= 0;
+        if (selectDeselected && !on) {
+          Sheet.selectRow(selected, rowIndex, $row, checkbox);
+        } else if (deselectSelected && on) {
+          Sheet.deselectRow(selected, rowIndex, $row, checkbox);
+        }
+      }
+    }
+  };
+
+  static getDataIndex = function ($sheet, $row) {
+    var rowIndex = $row.data("tobago-row-index");
+    if (rowIndex) {
+      return +rowIndex;
+    } else {
+      return $row.index() + $sheet.data("tobago-first");
+    }
+  };
+
+  /**
+   * @param $selected input-element type=hidden: Hidden field with the selection state information
+   * @param rowIndex int: zero based index of the row.
+   * @param $row tr-element: the row.
+   * @param $checkbox input-element: selector in the row.
+   */
+  static selectRow = function ($selected, rowIndex, $row, $checkbox) {
+    $selected.val($selected.val() + rowIndex + ",");
+    $row.addClass("tobago-sheet-row-markup-selected table-info");
 //  checkbox.prop("checked", true);
-  setTimeout(function() {$checkbox.prop("checked", true);}, 0);
-};
+    setTimeout(function () {
+      $checkbox.prop("checked", true);
+    }, 0);
+  };
 
-/**
- * @param $selected input-element type=hidden: Hidden field with the selection state information
- * @param rowIndex int: zero based index of the row.
- * @param $row tr-element: the row.
- * @param $checkbox input-element: selector in the row.
- */
-static deselectRow = function($selected, rowIndex, $row, $checkbox) {
-  $selected.val($selected.val().replace(new RegExp("," + rowIndex + ","), ","));
-  $row.removeClass("tobago-sheet-row-markup-selected table-info");
+  /**
+   * @param $selected input-element type=hidden: Hidden field with the selection state information
+   * @param rowIndex int: zero based index of the row.
+   * @param $row tr-element: the row.
+   * @param $checkbox input-element: selector in the row.
+   */
+  static deselectRow = function ($selected, rowIndex, $row, $checkbox) {
+    $selected.val($selected.val().replace(new RegExp("," + rowIndex + ","), ","));
+    $row.removeClass("tobago-sheet-row-markup-selected table-info");
 //  checkbox.prop("checked", false); Async because of TOBAGO-1312
-  setTimeout(function() {$checkbox.prop("checked", false);}, 0);
-};
+    setTimeout(function () {
+      $checkbox.prop("checked", false);
+    }, 0);
+  };
 
-static isInputElement = function($element) {
-  return ["INPUT", "TEXTAREA", "SELECT", "A", "BUTTON"].indexOf($element.prop("tagName")) > -1;
-};
+  static isInputElement = function ($element) {
+    return ["INPUT", "TEXTAREA", "SELECT", "A", "BUTTON"].indexOf($element.prop("tagName")) > -1;
+  };
 
 }
 
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-split-layout.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-split-layout.ts
index 9ca72aa..41bb9e9 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-split-layout.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-split-layout.ts
@@ -20,126 +20,126 @@
 
 class SplitLayout {
 
-    private readonly element: HTMLDivElement;
-    private readonly horizontal: boolean;
-    private offset: number;
+  private readonly element: HTMLDivElement;
+  private readonly horizontal: boolean;
+  private offset: number;
 
-    static init = function (element: HTMLElement): void {
-      for (const splitLayout of DomUtils.selfOrElementsByClassName(element, "tobago-splitLayout")) {
-        new SplitLayout(<HTMLDivElement>splitLayout);
-      }
-    };
+  static init = function (element: HTMLElement): void {
+    for (const splitLayout of DomUtils.selfOrElementsByClassName(element, "tobago-splitLayout")) {
+      new SplitLayout(<HTMLDivElement>splitLayout);
+    }
+  };
 
-    constructor(element: HTMLDivElement) {
-      this.element = element;
+  constructor(element: HTMLDivElement) {
+    this.element = element;
 
-      for (const splitter of this.element.getElementsByClassName("tobago-splitLayout-horizontal")) {
-        splitter.addEventListener("mousedown", this.start.bind(this));
-        this.horizontal = true;
-      }
-
-      for (const splitter of this.element.getElementsByClassName("tobago-splitLayout-vertical")) {
-        splitter.addEventListener("mousedown", this.start.bind(this));
-        this.horizontal = false;
-      }
+    for (const splitter of this.element.getElementsByClassName("tobago-splitLayout-horizontal")) {
+      splitter.addEventListener("mousedown", this.start.bind(this));
+      this.horizontal = true;
     }
 
-    start(event: MouseEvent) {
-      event.preventDefault();
-      const splitter = <HTMLElement>event.target;
-      const previous = DomUtils.previousElementSibling(splitter);
-      this.offset = this.horizontal ? event.pageX - previous.offsetWidth : event.pageY - previous.offsetHeight;
-      const mousedown = SplitLayoutMousedown.save(event, splitter);
-      document.addEventListener("mousemove", this.move.bind(this));
-      document.addEventListener("mouseup", this.stop.bind(this));
-      const previousArea = mousedown.previous;
-      if (this.horizontal) {
-        previousArea.style.width = String(previousArea.offsetWidth + "px");
-      } else {
-        previousArea.style.height = String(previousArea.offsetHeight + "px");
-      }
-      previousArea.style.flexGrow = "inherit";
-      previousArea.style.flexBasis = "auto";
-      console.info("initial = " + (this.horizontal ? previousArea.style.width : previousArea.style.height));
-    };
-
-    move(event: MouseEvent): void {
-      event.preventDefault();
-      const data = SplitLayoutMousedown.load();
-      const previousArea = data.previous;
-      if (this.horizontal) {
-        previousArea.style.width = String(event.pageX - this.offset) + "px";
-      } else {
-        previousArea.style.height = String(event.pageY - this.offset) + "px";
-      }
-    };
-
-    stop(event: MouseEvent): void {
-      document.removeEventListener("mousemove", this.move.bind(this));
-      document.removeEventListener("mouseup", this.stop.bind(this));
-      SplitLayoutMousedown.remove();
-    };
+    for (const splitter of this.element.getElementsByClassName("tobago-splitLayout-vertical")) {
+      splitter.addEventListener("mousedown", this.start.bind(this));
+      this.horizontal = false;
+    }
   }
 
-  /**
-   * Data class to store "offset" and "splitter"-element of the mouse down event in the tobago-page.
-   */
-  interface SplitLayoutMousedownData {
-    readonly splitLayoutId: string;
-    readonly splitterIndex: number;
-    readonly horizontal: boolean;
+  start(event: MouseEvent) {
+    event.preventDefault();
+    const splitter = <HTMLElement>event.target;
+    const previous = DomUtils.previousElementSibling(splitter);
+    this.offset = this.horizontal ? event.pageX - previous.offsetWidth : event.pageY - previous.offsetHeight;
+    const mousedown = SplitLayoutMousedown.save(event, splitter);
+    document.addEventListener("mousemove", this.move.bind(this));
+    document.addEventListener("mouseup", this.stop.bind(this));
+    const previousArea = mousedown.previous;
+    if (this.horizontal) {
+      previousArea.style.width = String(previousArea.offsetWidth + "px");
+    } else {
+      previousArea.style.height = String(previousArea.offsetHeight + "px");
+    }
+    previousArea.style.flexGrow = "inherit";
+    previousArea.style.flexBasis = "auto";
+    console.info("initial = " + (this.horizontal ? previousArea.style.width : previousArea.style.height));
+  };
+
+  move(event: MouseEvent): void {
+    event.preventDefault();
+    const data = SplitLayoutMousedown.load();
+    const previousArea = data.previous;
+    if (this.horizontal) {
+      previousArea.style.width = String(event.pageX - this.offset) + "px";
+    } else {
+      previousArea.style.height = String(event.pageY - this.offset) + "px";
+    }
+  };
+
+  stop(event: MouseEvent): void {
+    document.removeEventListener("mousemove", this.move.bind(this));
+    document.removeEventListener("mouseup", this.stop.bind(this));
+    SplitLayoutMousedown.remove();
+  };
+}
+
+/**
+ * Data class to store "offset" and "splitter"-element of the mouse down event in the tobago-page.
+ */
+interface SplitLayoutMousedownData {
+  readonly splitLayoutId: string;
+  readonly splitterIndex: number;
+  readonly horizontal: boolean;
+}
+
+class SplitLayoutMousedown {
+
+  private data: SplitLayoutMousedownData;
+
+  private constructor(data: SplitLayoutMousedownData | string) {
+    this.data = typeof data === "string" ? JSON.parse(data) : data;
   }
 
-  class SplitLayoutMousedown {
+  get splitter(): HTMLElement {
+    return document.getElementById(this.data.splitLayoutId).getElementsByClassName(
+        this.data.horizontal ? "tobago-splitLayout-horizontal" : "tobago-splitLayout-vertical")
+        .item(this.data.splitterIndex) as HTMLElement;
+  }
 
-    private data: SplitLayoutMousedownData;
+  get previous(): HTMLElement {
+    return DomUtils.previousElementSibling(this.splitter);
+  }
 
-    private constructor(data: SplitLayoutMousedownData | string) {
-      this.data = typeof data === "string" ? JSON.parse(data) : data;
-    }
+  static save(event: MouseEvent, splitter: HTMLElement): SplitLayoutMousedown {
+    const horizontal = splitter.classList.contains("tobago-splitLayout-horizontal");
+    const previous = DomUtils.previousElementSibling(splitter);
+    const data: SplitLayoutMousedownData = {
+      splitLayoutId: splitter.parentElement.id,
+      horizontal: horizontal,
+      splitterIndex: this.indexOfSplitter(splitter, horizontal)
+    };
+    DomUtils.page().dataset["SplitLayoutMousedownData"] = JSON.stringify(data);
+    return new SplitLayoutMousedown(data);
+  }
 
-    get splitter(): HTMLElement {
-      return document.getElementById(this.data.splitLayoutId).getElementsByClassName(
-          this.data.horizontal ? "tobago-splitLayout-horizontal" : "tobago-splitLayout-vertical")
-          .item(this.data.splitterIndex) as HTMLElement;
-    }
+  static load() {
+    return new SplitLayoutMousedown(DomUtils.page().dataset["SplitLayoutMousedownData"]);
+  }
 
-    get previous(): HTMLElement {
-      return DomUtils.previousElementSibling(this.splitter);
-    }
+  static remove() {
+    return DomUtils.page().dataset["SplitLayoutMousedownData"] = null;
+  }
 
-    static save(event: MouseEvent, splitter: HTMLElement): SplitLayoutMousedown {
-      const horizontal = splitter.classList.contains("tobago-splitLayout-horizontal");
-      const previous = DomUtils.previousElementSibling(splitter);
-      const data: SplitLayoutMousedownData = {
-        splitLayoutId: splitter.parentElement.id,
-        horizontal: horizontal,
-        splitterIndex: this.indexOfSplitter(splitter, horizontal)
-      };
-      DomUtils.page().dataset["SplitLayoutMousedownData"] = JSON.stringify(data);
-      return new SplitLayoutMousedown(data);
-    }
-
-    static load() {
-      return new SplitLayoutMousedown(DomUtils.page().dataset["SplitLayoutMousedownData"]);
-    }
-
-    static remove() {
-      return DomUtils.page().dataset["SplitLayoutMousedownData"] = null;
-    }
-
-    private static indexOfSplitter(splitter: HTMLElement, horizontal: boolean): number {
-      const list = splitter.parentElement.getElementsByClassName(
-          horizontal ? "tobago-splitLayout-horizontal" : "tobago-splitLayout-vertical");
-      for (let k = 0; k < list.length; k++) {
-        if (list.item(k) === splitter) {
-          return k;
-        }
+  private static indexOfSplitter(splitter: HTMLElement, horizontal: boolean): number {
+    const list = splitter.parentElement.getElementsByClassName(
+        horizontal ? "tobago-splitLayout-horizontal" : "tobago-splitLayout-vertical");
+    for (let k = 0; k < list.length; k++) {
+      if (list.item(k) === splitter) {
+        return k;
       }
-      return -1;
     }
-
+    return -1;
   }
 
-  Listener.register(SplitLayout.init, Phase.DOCUMENT_READY);
-  Listener.register(SplitLayout.init, Phase.AFTER_UPDATE);
+}
+
+Listener.register(SplitLayout.init, Phase.DOCUMENT_READY);
+Listener.register(SplitLayout.init, Phase.AFTER_UPDATE);
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-stars.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-stars.ts
index 60178b2..c8cc6cb 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-stars.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-stars.ts
@@ -20,144 +20,144 @@
 
 class Stars {
 
-static init(elements) {
-  elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
-  var starComponents = Tobago4Utils.selectWithJQuery(elements, ".tobago-stars");
-  starComponents.each(function () {
-    var $starComponent = jQuery(this);
+  static init(elements) {
+    elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
+    var starComponents = Tobago4Utils.selectWithJQuery(elements, ".tobago-stars");
+    starComponents.each(function () {
+      var $starComponent = jQuery(this);
 
-    var $hiddenInput = $starComponent.find("input[type=hidden]");
-    var $container = $starComponent.find(".tobago-stars-container");
-    var $tooltip = $container.find(".tobago-stars-tooltip");
-    var $selected = $container.find(".tobago-stars-selected");
-    var $unselected = $container.find(".tobago-stars-unselected");
-    var $preselected = $container.find(".tobago-stars-preselected");
-    var $slider = $container.find(".tobago-stars-slider");
+      var $hiddenInput = $starComponent.find("input[type=hidden]");
+      var $container = $starComponent.find(".tobago-stars-container");
+      var $tooltip = $container.find(".tobago-stars-tooltip");
+      var $selected = $container.find(".tobago-stars-selected");
+      var $unselected = $container.find(".tobago-stars-unselected");
+      var $preselected = $container.find(".tobago-stars-preselected");
+      var $slider = $container.find(".tobago-stars-slider");
 
-    var readonly = $slider.prop("readonly");
-    var disabled = $slider.prop("disabled");
-    var required = $slider.prop("required");
+      var readonly = $slider.prop("readonly");
+      var disabled = $slider.prop("disabled");
+      var required = $slider.prop("required");
 
-    var max = $slider.prop("max");
-    var placeholder = $slider.prop("placeholder");
+      var max = $slider.prop("max");
+      var placeholder = $slider.prop("placeholder");
 
-    if ($slider.prop("min") === "0") {
-      $slider.css("left", "-" + (100 / max) + "%");
-      $slider.css("width", 100 + (100 / max) + "%");
-    }
-
-    if ($hiddenInput.val() > 0) {
-      var percentValue = 100 * ($hiddenInput.val() as number) / max;
-      $selected.css("width", percentValue + "%");
-      $unselected.css("left", percentValue + "%");
-      $unselected.css("width", 100 - percentValue + "%");
-    } else if (placeholder) {
-      $selected.addClass("tobago-placeholder");
-
-      var placeholderValue = 100 * placeholder / max;
-      $selected.css("width", placeholderValue + "%");
-      $unselected.css("left", placeholderValue + "%");
-      $unselected.css("width", 100 - placeholderValue + "%");
-    }
-
-    if (!readonly && !disabled) {
-      /* preselectMode is a Workaround for IE11: fires change event instead of input event */
-      var preselectMode = false;
-      $slider.on('mousedown', function (event) {
-        preselectMode = true;
-      });
-      $slider.on('mouseup', function (event) {
-        preselectMode = false;
-        selectStars();
-      });
-
-      $slider.on('input', function (event) {
-        preselectStars();
-      });
-      $slider.on('touchend', function (event) {
-        /* Workaround for mobile devices. TODO: fire AJAX request for 'touchend' */
-        $slider.trigger("change");
-      });
-      $slider.on('change', function (event) {
-        if (preselectMode) {
-          preselectStars();
-        } else {
-          selectStars();
-        }
-      });
-
-      $slider.on('touchstart touchmove', function (event) {
-        /* Workaround for Safari browser on iPhone */
-        var sliderValue = (event.target.max / event.target.offsetWidth)
-            // @ts-ignore
-            * (event.originalEvent.touches[0].pageX - $slider.offset().left);
-        if (sliderValue > event.target.max) {
-          $slider.val(event.target.max);
-        } else if (sliderValue < event.target.min) {
-          $slider.val(event.target.min);
-        } else {
-          $slider.val(sliderValue);
-        }
-
-        preselectStars();
-      });
-    }
-
-    function preselectStars() {
-      $tooltip.addClass("show");
-
-      if ($slider.val() > 0) {
-        $tooltip.removeClass("trash");
-        $tooltip.text(Number((5 * ($slider.val() as number) / max).toFixed(2)));
-
-        $preselected.addClass("show");
-        $preselected.css("width", (100 * ($slider.val() as number) / max) + "%");
-      } else {
-        $tooltip.text("");
-        $tooltip.addClass("trash");
-
-        if (placeholder) {
-          $preselected.addClass("show");
-          $preselected.css("width", (100 * placeholder / max) + "%");
-        } else {
-          $preselected.removeClass("show");
-        }
+      if ($slider.prop("min") === "0") {
+        $slider.css("left", "-" + (100 / max) + "%");
+        $slider.css("width", 100 + (100 / max) + "%");
       }
-    }
 
-    function selectStars() {
-      $tooltip.removeClass("show");
-      $preselected.removeClass("show");
-
-      if ($slider.val() > 0) {
-        $selected.removeClass("tobago-placeholder");
-
-        var percentValue = 100 * ($slider.val() as number) / max;
+      if ($hiddenInput.val() > 0) {
+        var percentValue = 100 * ($hiddenInput.val() as number) / max;
         $selected.css("width", percentValue + "%");
         $unselected.css("left", percentValue + "%");
         $unselected.css("width", 100 - percentValue + "%");
+      } else if (placeholder) {
+        $selected.addClass("tobago-placeholder");
 
-        $hiddenInput.val($slider.val());
-      } else {
-        if (placeholder) {
-          $selected.addClass("tobago-placeholder");
-
-          var placeholderValue = 100 * placeholder / max;
-          $selected.css("width", placeholderValue + "%");
-          $unselected.css("left", placeholderValue + "%");
-          $unselected.css("width", 100 - placeholderValue + "%");
-        } else {
-          $selected.removeClass("tobago-placeholder");
-          $selected.css("width", "");
-          $unselected.css("left", "");
-          $unselected.css("width", "");
-        }
-
-        $hiddenInput.val(required ? "" : $slider.val());
+        var placeholderValue = 100 * placeholder / max;
+        $selected.css("width", placeholderValue + "%");
+        $unselected.css("left", placeholderValue + "%");
+        $unselected.css("width", 100 - placeholderValue + "%");
       }
-    }
-  });
-};
+
+      if (!readonly && !disabled) {
+        /* preselectMode is a Workaround for IE11: fires change event instead of input event */
+        var preselectMode = false;
+        $slider.on('mousedown', function (event) {
+          preselectMode = true;
+        });
+        $slider.on('mouseup', function (event) {
+          preselectMode = false;
+          selectStars();
+        });
+
+        $slider.on('input', function (event) {
+          preselectStars();
+        });
+        $slider.on('touchend', function (event) {
+          /* Workaround for mobile devices. TODO: fire AJAX request for 'touchend' */
+          $slider.trigger("change");
+        });
+        $slider.on('change', function (event) {
+          if (preselectMode) {
+            preselectStars();
+          } else {
+            selectStars();
+          }
+        });
+
+        $slider.on('touchstart touchmove', function (event) {
+          /* Workaround for Safari browser on iPhone */
+          var sliderValue = (event.target.max / event.target.offsetWidth)
+              // @ts-ignore
+              * (event.originalEvent.touches[0].pageX - $slider.offset().left);
+          if (sliderValue > event.target.max) {
+            $slider.val(event.target.max);
+          } else if (sliderValue < event.target.min) {
+            $slider.val(event.target.min);
+          } else {
+            $slider.val(sliderValue);
+          }
+
+          preselectStars();
+        });
+      }
+
+      function preselectStars() {
+        $tooltip.addClass("show");
+
+        if ($slider.val() > 0) {
+          $tooltip.removeClass("trash");
+          $tooltip.text(Number((5 * ($slider.val() as number) / max).toFixed(2)));
+
+          $preselected.addClass("show");
+          $preselected.css("width", (100 * ($slider.val() as number) / max) + "%");
+        } else {
+          $tooltip.text("");
+          $tooltip.addClass("trash");
+
+          if (placeholder) {
+            $preselected.addClass("show");
+            $preselected.css("width", (100 * placeholder / max) + "%");
+          } else {
+            $preselected.removeClass("show");
+          }
+        }
+      }
+
+      function selectStars() {
+        $tooltip.removeClass("show");
+        $preselected.removeClass("show");
+
+        if ($slider.val() > 0) {
+          $selected.removeClass("tobago-placeholder");
+
+          var percentValue = 100 * ($slider.val() as number) / max;
+          $selected.css("width", percentValue + "%");
+          $unselected.css("left", percentValue + "%");
+          $unselected.css("width", 100 - percentValue + "%");
+
+          $hiddenInput.val($slider.val());
+        } else {
+          if (placeholder) {
+            $selected.addClass("tobago-placeholder");
+
+            var placeholderValue = 100 * placeholder / max;
+            $selected.css("width", placeholderValue + "%");
+            $unselected.css("left", placeholderValue + "%");
+            $unselected.css("width", 100 - placeholderValue + "%");
+          } else {
+            $selected.removeClass("tobago-placeholder");
+            $selected.css("width", "");
+            $unselected.css("left", "");
+            $unselected.css("width", "");
+          }
+
+          $hiddenInput.val(required ? "" : $slider.val());
+        }
+      }
+    });
+  };
 }
 
 Listener.register(Stars.init, Phase.DOCUMENT_READY);
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-tree.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-tree.ts
index 12dfa6d..04a6899 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-tree.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-tree.ts
@@ -295,7 +295,7 @@
     listbox.children("option:selected").each(function () {
       jQuery(this).data("tobago-select").show();
     });
-  TreeListbox.setSelected(listbox);
+    TreeListbox.setSelected(listbox);
 
     // Deeper level (2nd and later) should only show the empty select tag.
     // The first child is the empty selection.
diff --git a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-utils.ts b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-utils.ts
index 6e82657..5ed2e47 100644
--- a/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-utils.ts
+++ b/tobago-theme/tobago-theme-standard/src/main/npm/ts/tobago-utils.ts
@@ -17,7 +17,7 @@
 
 export class DomUtils {
 
-  static page():HTMLElement {
+  static page(): HTMLElement {
     const pages = document.getElementsByClassName("tobago-page");
     if (pages.length > 0) {
       if (pages.length >= 2) {
@@ -112,117 +112,117 @@
 
 export class Tobago4Utils {
 
-/**
- * Helps to select either elements from the whole DOM or only find in sub trees
- * (in the case of AJAX partial rendering)
- * @param elements a jQuery object to initialize (ajax) or null for initializing the whole document (full load).
- * @param selector a jQuery selector.
- */
-static selectWithJQuery(elements, selector) {
-  elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
-  return elements == null
-      ? jQuery(selector)
-      : elements.find(selector).add(elements.filter(selector));
-};
+  /**
+   * Helps to select either elements from the whole DOM or only find in sub trees
+   * (in the case of AJAX partial rendering)
+   * @param elements a jQuery object to initialize (ajax) or null for initializing the whole document (full load).
+   * @param selector a jQuery selector.
+   */
+  static selectWithJQuery(elements, selector) {
+    elements = elements.jQuery ? elements : jQuery(elements); // fixme jQuery -> ES5
+    return elements == null
+        ? jQuery(selector)
+        : elements.find(selector).add(elements.filter(selector));
+  };
 
-static findSubComponent(element, subId) {
-  return jQuery(Tobago4Utils.getSubComponentId(element.attr('id'), subId));
-};
+  static findSubComponent(element, subId) {
+    return jQuery(Tobago4Utils.getSubComponentId(element.attr('id'), subId));
+  };
 
-static getSubComponentId(id, subId) {
-  if (id != null) {
-    return "#" + id.replace(/:/g, "\\:") + "\\:\\:" + subId;
-  } else {
-    return null;
-  }
-};
-
-/** @deprecated */
-static findSuperComponent(element) {
-  return jQuery(Tobago4Utils.getSuperComponentId(element.attr('id')));
-};
-
-static getSuperComponentId(id) {
-  return "#" + id.substring(0, id.lastIndexOf("::")).replace(/:/g, "\\:");
-};
-
-/**
- * "a:b" -> "a"
- * "a:b:c" -> "a:b"
- * "a" -> null
- * null -> null
- * "a:b::sub-component" -> "a"
- * "a::sub-component:b" -> "a::sub-component" // should currently not happen in Tobago
- *
- * @param id The clientId of a component.
- * @return The clientId of the naming container.
- */
-static getNamingContainerId(id) {
-  if (id == null) {
-    return null;
-  }
-  if (id.lastIndexOf(":") == -1) {
-    return null;
-  }
-  while (true) {
-    var sub = id.lastIndexOf("::");
-    if (sub == -1) {
-      break;
-    }
-    if (sub + 1 == id.lastIndexOf(":")) {
-      id = id.substring(0, sub);
+  static getSubComponentId(id, subId) {
+    if (id != null) {
+      return "#" + id.replace(/:/g, "\\:") + "\\:\\:" + subId;
     } else {
-      break;
+      return null;
     }
-  }
-  return id.substring(0, id.lastIndexOf(":"));
-};
+  };
 
-/**
- * fix position, when the element it is outside of the current page
- * @param elements is an jQuery Array of elements to be fixed.
- */
-static keepElementInVisibleArea(elements) {
-  elements.each(function () {
-    var element = jQuery(this);
-    var page = jQuery(".tobago-page-content:first");
-    var left = element.offset().left;
-    var top = element.offset().top;
-    // fix menu position, when it is outside of the current page
-    left = Math.max(0, Math.min(left, page.outerWidth() - element.outerWidth()));
-    top = Math.max(0, Math.min(top, page.outerHeight() - element.outerHeight()));
-    element.css('left', left);
-    element.css('top', top);
-  });
-};
+  /** @deprecated */
+  static findSuperComponent(element) {
+    return jQuery(Tobago4Utils.getSuperComponentId(element.attr('id')));
+  };
 
-static addDataMarkup(element, markupString) {
-  var dataTobagoMarkup = element.attr("data-tobago-markup");
-  if (dataTobagoMarkup !== undefined) {
-    var markups = jQuery.parseJSON(dataTobagoMarkup);
-    markups.push(markupString);
-    element.attr("data-tobago-markup", JSON.stringify(markups));
-  } else {
-    element.attr("data-tobago-markup", JSON.stringify(markupString));
-  }
-};
+  static getSuperComponentId(id) {
+    return "#" + id.substring(0, id.lastIndexOf("::")).replace(/:/g, "\\:");
+  };
 
-static removeDataMarkup(element, markupString) {
-  var dataTobagoMarkup = element.attr("data-tobago-markup");
-  if (dataTobagoMarkup !== undefined) {
-    var markups = jQuery.parseJSON(dataTobagoMarkup);
-    var index = jQuery.inArray(markupString, markups);
-    if (index >= 0) {
-      markups.splice(index, 1);
-    } else if (markups === markupString) {
-      markups = [];
+  /**
+   * "a:b" -> "a"
+   * "a:b:c" -> "a:b"
+   * "a" -> null
+   * null -> null
+   * "a:b::sub-component" -> "a"
+   * "a::sub-component:b" -> "a::sub-component" // should currently not happen in Tobago
+   *
+   * @param id The clientId of a component.
+   * @return The clientId of the naming container.
+   */
+  static getNamingContainerId(id) {
+    if (id == null) {
+      return null;
     }
+    if (id.lastIndexOf(":") == -1) {
+      return null;
+    }
+    while (true) {
+      var sub = id.lastIndexOf("::");
+      if (sub == -1) {
+        break;
+      }
+      if (sub + 1 == id.lastIndexOf(":")) {
+        id = id.substring(0, sub);
+      } else {
+        break;
+      }
+    }
+    return id.substring(0, id.lastIndexOf(":"));
+  };
 
-    if (markups.length > 0) {
+  /**
+   * fix position, when the element it is outside of the current page
+   * @param elements is an jQuery Array of elements to be fixed.
+   */
+  static keepElementInVisibleArea(elements) {
+    elements.each(function () {
+      var element = jQuery(this);
+      var page = jQuery(".tobago-page-content:first");
+      var left = element.offset().left;
+      var top = element.offset().top;
+      // fix menu position, when it is outside of the current page
+      left = Math.max(0, Math.min(left, page.outerWidth() - element.outerWidth()));
+      top = Math.max(0, Math.min(top, page.outerHeight() - element.outerHeight()));
+      element.css('left', left);
+      element.css('top', top);
+    });
+  };
+
+  static addDataMarkup(element, markupString) {
+    var dataTobagoMarkup = element.attr("data-tobago-markup");
+    if (dataTobagoMarkup !== undefined) {
+      var markups = jQuery.parseJSON(dataTobagoMarkup);
+      markups.push(markupString);
       element.attr("data-tobago-markup", JSON.stringify(markups));
     } else {
-      element.removeAttr("data-tobago-markup");
+      element.attr("data-tobago-markup", JSON.stringify(markupString));
     }
-  }
-};
+  };
+
+  static removeDataMarkup(element, markupString) {
+    var dataTobagoMarkup = element.attr("data-tobago-markup");
+    if (dataTobagoMarkup !== undefined) {
+      var markups = jQuery.parseJSON(dataTobagoMarkup);
+      var index = jQuery.inArray(markupString, markups);
+      if (index >= 0) {
+        markups.splice(index, 1);
+      } else if (markups === markupString) {
+        markups = [];
+      }
+
+      if (markups.length > 0) {
+        element.attr("data-tobago-markup", JSON.stringify(markups));
+      } else {
+        element.removeAttr("data-tobago-markup");
+      }
+    }
+  };
 }
\ No newline at end of file