@babylonjs/gui 5.20.0 → 5.22.1

package/2D/controls/inputText.js

@@ -1,4 +1,4 @@
-import { __decorate, __extends } from "tslib";
+import { __decorate } from "@babylonjs/core/tslib.es6.js";
 import { Observable } from "@babylonjs/core/Misc/observable.js";
 import { ClipboardEventTypes } from "@babylonjs/core/Events/clipboardEvents.js";
 import { PointerEventTypes } from "@babylonjs/core/Events/pointerEvents.js";
@@ -10,355 +10,272 @@ import { serialize } from "@babylonjs/core/Misc/decorators.js";
 /**
  * Class used to create input text control
  */
-var InputText = /** @class */ (function (_super) {
-    __extends(InputText, _super);
+export class InputText extends Control {
     /**
      * Creates a new InputText
      * @param name defines the control name
      * @param text defines the text of the control
      */
-    function InputText(name, text) {
-        if (text === void 0) { text = ""; }
-        var _this = _super.call(this, name) || this;
-        _this.name = name;
-        _this._placeholderText = "";
-        _this._background = "#222222";
-        _this._focusedBackground = "#000000";
-        _this._focusedColor = "white";
-        _this._placeholderColor = "gray";
-        _this._thickness = 1;
-        _this._margin = new ValueAndUnit(10, ValueAndUnit.UNITMODE_PIXEL);
-        _this._autoStretchWidth = true;
-        _this._maxWidth = new ValueAndUnit(1, ValueAndUnit.UNITMODE_PERCENTAGE, false);
-        _this._isFocused = false;
-        _this._blinkIsEven = false;
-        _this._cursorOffset = 0;
-        _this._deadKey = false;
-        _this._addKey = true;
-        _this._currentKey = "";
-        _this._isTextHighlightOn = false;
-        _this._textHighlightColor = "#d5e0ff";
-        _this._highligherOpacity = 0.4;
-        _this._highlightedText = "";
-        _this._startHighlightIndex = 0;
-        _this._endHighlightIndex = 0;
-        _this._cursorIndex = -1;
-        _this._onFocusSelectAll = false;
-        _this._isPointerDown = false;
+    constructor(name, text = "") {
+        super(name);
+        this.name = name;
+        this._placeholderText = "";
+        this._background = "#222222";
+        this._focusedBackground = "#000000";
+        this._focusedColor = "white";
+        this._placeholderColor = "gray";
+        this._thickness = 1;
+        this._margin = new ValueAndUnit(10, ValueAndUnit.UNITMODE_PIXEL);
+        this._autoStretchWidth = true;
+        this._maxWidth = new ValueAndUnit(1, ValueAndUnit.UNITMODE_PERCENTAGE, false);
+        this._isFocused = false;
+        this._blinkIsEven = false;
+        this._cursorOffset = 0;
+        this._deadKey = false;
+        this._addKey = true;
+        this._currentKey = "";
+        this._isTextHighlightOn = false;
+        this._textHighlightColor = "#d5e0ff";
+        this._highligherOpacity = 0.4;
+        this._highlightedText = "";
+        this._startHighlightIndex = 0;
+        this._endHighlightIndex = 0;
+        this._cursorIndex = -1;
+        this._onFocusSelectAll = false;
+        this._isPointerDown = false;
         /** Gets or sets a string representing the message displayed on mobile when the control gets the focus */
-        _this.promptMessage = "Please enter text:";
+        this.promptMessage = "Please enter text:";
         /** Force disable prompt on mobile device */
-        _this.disableMobilePrompt = false;
+        this.disableMobilePrompt = false;
         /** Observable raised when the text changes */
-        _this.onTextChangedObservable = new Observable();
+        this.onTextChangedObservable = new Observable();
         /** Observable raised just before an entered character is to be added */
-        _this.onBeforeKeyAddObservable = new Observable();
+        this.onBeforeKeyAddObservable = new Observable();
         /** Observable raised when the control gets the focus */
-        _this.onFocusObservable = new Observable();
+        this.onFocusObservable = new Observable();
         /** Observable raised when the control loses the focus */
-        _this.onBlurObservable = new Observable();
+        this.onBlurObservable = new Observable();
         /**Observable raised when the text is highlighted */
-        _this.onTextHighlightObservable = new Observable();
+        this.onTextHighlightObservable = new Observable();
         /**Observable raised when copy event is triggered */
-        _this.onTextCopyObservable = new Observable();
+        this.onTextCopyObservable = new Observable();
         /** Observable raised when cut event is triggered */
-        _this.onTextCutObservable = new Observable();
+        this.onTextCutObservable = new Observable();
         /** Observable raised when paste event is triggered */
-        _this.onTextPasteObservable = new Observable();
+        this.onTextPasteObservable = new Observable();
         /** Observable raised when a key event was processed */
-        _this.onKeyboardEventProcessedObservable = new Observable();
-        _this.text = text;
-        _this.isPointerBlocker = true;
-        return _this;
+        this.onKeyboardEventProcessedObservable = new Observable();
+        this.text = text;
+        this.isPointerBlocker = true;
     }
-    Object.defineProperty(InputText.prototype, "maxWidth", {
-        /** Gets or sets the maximum width allowed by the control */
-        get: function () {
-            return this._maxWidth.toString(this._host);
-        },
-        set: function (value) {
-            if (this._maxWidth.toString(this._host) === value) {
-                return;
-            }
-            if (this._maxWidth.fromString(value)) {
-                this._markAsDirty();
-            }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "maxWidthInPixels", {
-        /** Gets the maximum width allowed by the control in pixels */
-        get: function () {
-            return this._maxWidth.getValueInPixel(this._host, this._cachedParentMeasure.width);
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "highligherOpacity", {
-        /** Gets or sets the text highlighter transparency; default: 0.4 */
-        get: function () {
-            return this._highligherOpacity;
-        },
-        set: function (value) {
-            if (this._highligherOpacity === value) {
-                return;
-            }
-            this._highligherOpacity = value;
-            this._markAsDirty();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "onFocusSelectAll", {
-        /** Gets or sets a boolean indicating whether to select complete text by default on input focus */
-        get: function () {
-            return this._onFocusSelectAll;
-        },
-        set: function (value) {
-            if (this._onFocusSelectAll === value) {
-                return;
-            }
-            this._onFocusSelectAll = value;
-            this._markAsDirty();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "textHighlightColor", {
-        /** Gets or sets the text hightlight color */
-        get: function () {
-            return this._textHighlightColor;
-        },
-        set: function (value) {
-            if (this._textHighlightColor === value) {
-                return;
-            }
-            this._textHighlightColor = value;
-            this._markAsDirty();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "margin", {
-        /** Gets or sets control margin */
-        get: function () {
-            return this._margin.toString(this._host);
-        },
-        set: function (value) {
-            if (this._margin.toString(this._host) === value) {
-                return;
-            }
-            if (this._margin.fromString(value)) {
-                this._markAsDirty();
-            }
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "marginInPixels", {
-        /** Gets control margin in pixels */
-        get: function () {
-            return this._margin.getValueInPixel(this._host, this._cachedParentMeasure.width);
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "autoStretchWidth", {
-        /** Gets or sets a boolean indicating if the control can auto stretch its width to adapt to the text */
-        get: function () {
-            return this._autoStretchWidth;
-        },
-        set: function (value) {
-            if (this._autoStretchWidth === value) {
-                return;
-            }
-            this._autoStretchWidth = value;
-            this._markAsDirty();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "thickness", {
-        /** Gets or sets border thickness */
-        get: function () {
-            return this._thickness;
-        },
-        set: function (value) {
-            if (this._thickness === value) {
-                return;
-            }
-            this._thickness = value;
-            this._markAsDirty();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "focusedBackground", {
-        /** Gets or sets the background color when focused */
-        get: function () {
-            return this._focusedBackground;
-        },
-        set: function (value) {
-            if (this._focusedBackground === value) {
-                return;
-            }
-            this._focusedBackground = value;
-            this._markAsDirty();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "focusedColor", {
-        /** Gets or sets the background color when focused */
-        get: function () {
-            return this._focusedColor;
-        },
-        set: function (value) {
-            if (this._focusedColor === value) {
-                return;
-            }
-            this._focusedColor = value;
-            this._markAsDirty();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "background", {
-        /** Gets or sets the background color */
-        get: function () {
-            return this._background;
-        },
-        set: function (value) {
-            if (this._background === value) {
-                return;
-            }
-            this._background = value;
-            this._markAsDirty();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "placeholderColor", {
-        /** Gets or sets the placeholder color */
-        get: function () {
-            return this._placeholderColor;
-        },
-        set: function (value) {
-            if (this._placeholderColor === value) {
-                return;
-            }
-            this._placeholderColor = value;
-            this._markAsDirty();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "placeholderText", {
-        /** Gets or sets the text displayed when the control is empty */
-        get: function () {
-            return this._placeholderText;
-        },
-        set: function (value) {
-            if (this._placeholderText === value) {
-                return;
-            }
-            this._placeholderText = value;
+    /** Gets or sets the maximum width allowed by the control */
+    get maxWidth() {
+        return this._maxWidth.toString(this._host);
+    }
+    /** Gets the maximum width allowed by the control in pixels */
+    get maxWidthInPixels() {
+        return this._maxWidth.getValueInPixel(this._host, this._cachedParentMeasure.width);
+    }
+    set maxWidth(value) {
+        if (this._maxWidth.toString(this._host) === value) {
+            return;
+        }
+        if (this._maxWidth.fromString(value)) {
             this._markAsDirty();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "deadKey", {
-        /** Gets or sets the dead key flag */
-        get: function () {
-            return this._deadKey;
-        },
-        set: function (flag) {
-            this._deadKey = flag;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "highlightedText", {
-        /** Gets or sets the highlight text */
-        get: function () {
-            return this._highlightedText;
-        },
-        set: function (text) {
-            if (this._highlightedText === text) {
-                return;
-            }
-            this._highlightedText = text;
+        }
+    }
+    /** Gets or sets the text highlighter transparency; default: 0.4 */
+    get highligherOpacity() {
+        return this._highligherOpacity;
+    }
+    set highligherOpacity(value) {
+        if (this._highligherOpacity === value) {
+            return;
+        }
+        this._highligherOpacity = value;
+        this._markAsDirty();
+    }
+    /** Gets or sets a boolean indicating whether to select complete text by default on input focus */
+    get onFocusSelectAll() {
+        return this._onFocusSelectAll;
+    }
+    set onFocusSelectAll(value) {
+        if (this._onFocusSelectAll === value) {
+            return;
+        }
+        this._onFocusSelectAll = value;
+        this._markAsDirty();
+    }
+    /** Gets or sets the text hightlight color */
+    get textHighlightColor() {
+        return this._textHighlightColor;
+    }
+    set textHighlightColor(value) {
+        if (this._textHighlightColor === value) {
+            return;
+        }
+        this._textHighlightColor = value;
+        this._markAsDirty();
+    }
+    /** Gets or sets control margin */
+    get margin() {
+        return this._margin.toString(this._host);
+    }
+    /** Gets control margin in pixels */
+    get marginInPixels() {
+        return this._margin.getValueInPixel(this._host, this._cachedParentMeasure.width);
+    }
+    set margin(value) {
+        if (this._margin.toString(this._host) === value) {
+            return;
+        }
+        if (this._margin.fromString(value)) {
             this._markAsDirty();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "addKey", {
-        /** Gets or sets if the current key should be added */
-        get: function () {
-            return this._addKey;
-        },
-        set: function (flag) {
-            this._addKey = flag;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "currentKey", {
-        /** Gets or sets the value of the current key being entered */
-        get: function () {
-            return this._currentKey;
-        },
-        set: function (key) {
-            this._currentKey = key;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(InputText.prototype, "text", {
-        /** Gets or sets the text displayed in the control */
-        get: function () {
-            return this._textWrapper.text;
-        },
-        set: function (value) {
-            var valueAsString = value.toString(); // Forcing convertion
-            if (!this._textWrapper) {
-                this._textWrapper = new TextWrapper();
-            }
-            if (this._textWrapper.text === valueAsString) {
-                return;
-            }
-            this._textWrapper.text = valueAsString;
-            this._textHasChanged();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    InputText.prototype._textHasChanged = function () {
+        }
+    }
+    /** Gets or sets a boolean indicating if the control can auto stretch its width to adapt to the text */
+    get autoStretchWidth() {
+        return this._autoStretchWidth;
+    }
+    set autoStretchWidth(value) {
+        if (this._autoStretchWidth === value) {
+            return;
+        }
+        this._autoStretchWidth = value;
+        this._markAsDirty();
+    }
+    /** Gets or sets border thickness */
+    get thickness() {
+        return this._thickness;
+    }
+    set thickness(value) {
+        if (this._thickness === value) {
+            return;
+        }
+        this._thickness = value;
+        this._markAsDirty();
+    }
+    /** Gets or sets the background color when focused */
+    get focusedBackground() {
+        return this._focusedBackground;
+    }
+    set focusedBackground(value) {
+        if (this._focusedBackground === value) {
+            return;
+        }
+        this._focusedBackground = value;
+        this._markAsDirty();
+    }
+    /** Gets or sets the background color when focused */
+    get focusedColor() {
+        return this._focusedColor;
+    }
+    set focusedColor(value) {
+        if (this._focusedColor === value) {
+            return;
+        }
+        this._focusedColor = value;
+        this._markAsDirty();
+    }
+    /** Gets or sets the background color */
+    get background() {
+        return this._background;
+    }
+    set background(value) {
+        if (this._background === value) {
+            return;
+        }
+        this._background = value;
+        this._markAsDirty();
+    }
+    /** Gets or sets the placeholder color */
+    get placeholderColor() {
+        return this._placeholderColor;
+    }
+    set placeholderColor(value) {
+        if (this._placeholderColor === value) {
+            return;
+        }
+        this._placeholderColor = value;
+        this._markAsDirty();
+    }
+    /** Gets or sets the text displayed when the control is empty */
+    get placeholderText() {
+        return this._placeholderText;
+    }
+    set placeholderText(value) {
+        if (this._placeholderText === value) {
+            return;
+        }
+        this._placeholderText = value;
+        this._markAsDirty();
+    }
+    /** Gets or sets the dead key flag */
+    get deadKey() {
+        return this._deadKey;
+    }
+    set deadKey(flag) {
+        this._deadKey = flag;
+    }
+    /** Gets or sets the highlight text */
+    get highlightedText() {
+        return this._highlightedText;
+    }
+    set highlightedText(text) {
+        if (this._highlightedText === text) {
+            return;
+        }
+        this._highlightedText = text;
+        this._markAsDirty();
+    }
+    /** Gets or sets if the current key should be added */
+    get addKey() {
+        return this._addKey;
+    }
+    set addKey(flag) {
+        this._addKey = flag;
+    }
+    /** Gets or sets the value of the current key being entered */
+    get currentKey() {
+        return this._currentKey;
+    }
+    set currentKey(key) {
+        this._currentKey = key;
+    }
+    /** Gets or sets the text displayed in the control */
+    get text() {
+        return this._textWrapper.text;
+    }
+    set text(value) {
+        const valueAsString = value.toString(); // Forcing convertion
+        if (!this._textWrapper) {
+            this._textWrapper = new TextWrapper();
+        }
+        if (this._textWrapper.text === valueAsString) {
+            return;
+        }
+        this._textWrapper.text = valueAsString;
+        this._textHasChanged();
+    }
+    _textHasChanged() {
         this._markAsDirty();
         this.onTextChangedObservable.notifyObservers(this);
-    };
-    Object.defineProperty(InputText.prototype, "width", {
-        /** Gets or sets control width */
-        get: function () {
-            return this._width.toString(this._host);
-        },
-        set: function (value) {
-            if (this._width.toString(this._host) === value) {
-                return;
-            }
-            if (this._width.fromString(value)) {
-                this._markAsDirty();
-            }
-            this.autoStretchWidth = false;
-        },
-        enumerable: false,
-        configurable: true
-    });
+    }
+    /** Gets or sets control width */
+    get width() {
+        return this._width.toString(this._host);
+    }
+    set width(value) {
+        if (this._width.toString(this._host) === value) {
+            return;
+        }
+        if (this._width.fromString(value)) {
+            this._markAsDirty();
+        }
+        this.autoStretchWidth = false;
+    }
     /** @hidden */
-    InputText.prototype.onBlur = function () {
+    onBlur() {
         this._isFocused = false;
         this._scrollLeft = null;
         this._cursorOffset = 0;
@@ -369,14 +286,13 @@ var InputText = /** @class */ (function (_super) {
         if (this._onClipboardObserver) {
             this._host.onClipboardObservable.remove(this._onClipboardObserver);
         }
-        var scene = this._host.getScene();
+        const scene = this._host.getScene();
         if (this._onPointerDblTapObserver && scene) {
             scene.onPointerObservable.remove(this._onPointerDblTapObserver);
         }
-    };
+    }
     /** @hidden */
-    InputText.prototype.onFocus = function () {
-        var _this = this;
+    onFocus() {
         if (!this._isEnabled) {
             return;
         }
@@ -387,7 +303,7 @@ var InputText = /** @class */ (function (_super) {
         this._markAsDirty();
         this.onFocusObservable.notifyObservers(this);
         if (this._focusedBy === "touch" && !this.disableMobilePrompt) {
-            var value = prompt(this.promptMessage);
+            const value = prompt(this.promptMessage);
             if (value !== null) {
                 this.text = value;
             }
@@ -395,73 +311,73 @@ var InputText = /** @class */ (function (_super) {
             return;
         }
         this._host.registerClipboardEvents();
-        this._onClipboardObserver = this._host.onClipboardObservable.add(function (clipboardInfo) {
+        this._onClipboardObserver = this._host.onClipboardObservable.add((clipboardInfo) => {
             // process clipboard event, can be configured.
             switch (clipboardInfo.type) {
                 case ClipboardEventTypes.COPY:
-                    _this._onCopyText(clipboardInfo.event);
-                    _this.onTextCopyObservable.notifyObservers(_this);
+                    this._onCopyText(clipboardInfo.event);
+                    this.onTextCopyObservable.notifyObservers(this);
                     break;
                 case ClipboardEventTypes.CUT:
-                    _this._onCutText(clipboardInfo.event);
-                    _this.onTextCutObservable.notifyObservers(_this);
+                    this._onCutText(clipboardInfo.event);
+                    this.onTextCutObservable.notifyObservers(this);
                     break;
                 case ClipboardEventTypes.PASTE:
-                    _this._onPasteText(clipboardInfo.event);
-                    _this.onTextPasteObservable.notifyObservers(_this);
+                    this._onPasteText(clipboardInfo.event);
+                    this.onTextPasteObservable.notifyObservers(this);
                     break;
                 default:
                     return;
             }
         });
-        var scene = this._host.getScene();
+        const scene = this._host.getScene();
         if (scene) {
             //register the pointer double tap event
-            this._onPointerDblTapObserver = scene.onPointerObservable.add(function (pointerInfo) {
-                if (!_this._isFocused) {
+            this._onPointerDblTapObserver = scene.onPointerObservable.add((pointerInfo) => {
+                if (!this._isFocused) {
                     return;
                 }
                 if (pointerInfo.type === PointerEventTypes.POINTERDOUBLETAP) {
-                    _this._processDblClick(pointerInfo);
+                    this._processDblClick(pointerInfo);
                 }
             });
         }
         if (this._onFocusSelectAll) {
             this._selectAllText();
         }
-    };
+    }
     /**
      * Function to focus an inputText programmatically
      */
-    InputText.prototype.focus = function () {
+    focus() {
         this._host.moveFocusToControl(this);
-    };
+    }
     /**
      * Function to unfocus an inputText programmatically
      */
-    InputText.prototype.blur = function () {
+    blur() {
         this._host.focusedControl = null;
-    };
-    InputText.prototype._getTypeName = function () {
+    }
+    _getTypeName() {
         return "InputText";
-    };
+    }
     /**
      * Function called to get the list of controls that should not steal the focus from this control
      * @returns an array of controls
      */
-    InputText.prototype.keepsFocusWith = function () {
+    keepsFocusWith() {
         if (!this._connectedVirtualKeyboard) {
             return null;
         }
         return [this._connectedVirtualKeyboard];
-    };
+    }
     /**
      * @param keyCode
      * @param key
      * @param evt
      * @hidden
      */
-    InputText.prototype.processKey = function (keyCode, key, evt) {
+    processKey(keyCode, key, evt) {
         if (this.isReadOnly) {
             return;
         }
@@ -504,7 +420,7 @@ var InputText = /** @class */ (function (_super) {
                         this.text = this._textWrapper.substr(0, this._textWrapper.length - 1);
                     }
                     else {
-                        var deletePosition = this._textWrapper.length - this._cursorOffset;
+                        const deletePosition = this._textWrapper.length - this._cursorOffset;
                         if (deletePosition > 0) {
                             this._textWrapper.removePart(deletePosition - 1, deletePosition);
                             this._textHasChanged();
@@ -527,7 +443,7 @@ var InputText = /** @class */ (function (_super) {
                     return;
                 }
                 if (this._textWrapper.text && this._textWrapper.length > 0 && this._cursorOffset > 0) {
-                    var deletePosition = this._textWrapper.length - this._cursorOffset;
+                    const deletePosition = this._textWrapper.length - this._cursorOffset;
                     this._textWrapper.removePart(deletePosition, deletePosition + 1);
                     this._textHasChanged();
                     this._cursorOffset--;
@@ -731,18 +647,18 @@ var InputText = /** @class */ (function (_super) {
                     this.text += key;
                 }
                 else {
-                    var insertPosition = this._textWrapper.length - this._cursorOffset;
+                    const insertPosition = this._textWrapper.length - this._cursorOffset;
                     this._textWrapper.removePart(insertPosition, insertPosition, key);
                     this._textHasChanged();
                 }
             }
         }
-    };
+    }
     /**
      * @param offset
      * @hidden
      */
-    InputText.prototype._updateValueFromCursorIndex = function (offset) {
+    _updateValueFromCursorIndex(offset) {
         //update the cursor
         this._blinkIsEven = false;
         if (this._cursorIndex === -1) {
@@ -765,17 +681,17 @@ var InputText = /** @class */ (function (_super) {
         }
         this._isTextHighlightOn = true;
         this._markAsDirty();
-    };
+    }
     /**
      * @param evt
      * @hidden
      */
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    InputText.prototype._processDblClick = function (evt) {
+    _processDblClick(evt) {
         //pre-find the start and end index of the word under cursor, speeds up the rendering
         this._startHighlightIndex = this._textWrapper.length - this._cursorOffset;
         this._endHighlightIndex = this._startHighlightIndex;
-        var moveLeft, moveRight;
+        let moveLeft, moveRight;
         do {
             moveRight = this._endHighlightIndex < this._textWrapper.length && this._textWrapper.isWord(this._endHighlightIndex) ? ++this._endHighlightIndex : 0;
             moveLeft = this._startHighlightIndex > 0 && this._textWrapper.isWord(this._startHighlightIndex - 1) ? --this._startHighlightIndex : 0;
@@ -787,9 +703,9 @@ var InputText = /** @class */ (function (_super) {
         this._blinkIsEven = true;
         this._cursorIndex = -1;
         this._markAsDirty();
-    };
+    }
     /** @hidden */
-    InputText.prototype._selectAllText = function () {
+    _selectAllText() {
         this._blinkIsEven = true;
         this._isTextHighlightOn = true;
         this._startHighlightIndex = 0;
@@ -797,34 +713,34 @@ var InputText = /** @class */ (function (_super) {
         this._cursorOffset = this._textWrapper.length;
         this._cursorIndex = -1;
         this._markAsDirty();
-    };
+    }
     /**
      * Handles the keyboard event
      * @param evt Defines the KeyboardEvent
      */
-    InputText.prototype.processKeyboard = function (evt) {
+    processKeyboard(evt) {
         // process pressed key
         this.processKey(evt.keyCode, evt.key, evt);
         this.onKeyboardEventProcessedObservable.notifyObservers(evt);
-    };
+    }
     /**
      * @param ev
      * @hidden
      */
-    InputText.prototype._onCopyText = function (ev) {
+    _onCopyText(ev) {
         this._isTextHighlightOn = false;
         //when write permission to clipbaord data is denied
         try {
             ev.clipboardData && ev.clipboardData.setData("text/plain", this._highlightedText);
         }
-        catch (_a) { } //pass
+        catch { } //pass
         this._host.clipboardData = this._highlightedText;
-    };
+    }
     /**
      * @param ev
      * @hidden
      */
-    InputText.prototype._onCutText = function (ev) {
+    _onCutText(ev) {
         if (!this._highlightedText) {
             return;
         }
@@ -836,16 +752,16 @@ var InputText = /** @class */ (function (_super) {
         try {
             ev.clipboardData && ev.clipboardData.setData("text/plain", this._highlightedText);
         }
-        catch (_a) { } //pass
+        catch { } //pass
         this._host.clipboardData = this._highlightedText;
         this._highlightedText = "";
-    };
+    }
     /**
      * @param ev
      * @hidden
      */
-    InputText.prototype._onPasteText = function (ev) {
-        var data = "";
+    _onPasteText(ev) {
+        let data = "";
         if (ev.clipboardData && ev.clipboardData.types.indexOf("text/plain") !== -1) {
             data = ev.clipboardData.getData("text/plain");
         }
@@ -853,12 +769,11 @@ var InputText = /** @class */ (function (_super) {
             //get the cached data; returns blank string by default
             data = this._host.clipboardData;
         }
-        var insertPosition = this._textWrapper.length - this._cursorOffset;
+        const insertPosition = this._textWrapper.length - this._cursorOffset;
         this._textWrapper.removePart(insertPosition, insertPosition, data);
         this._textHasChanged();
-    };
-    InputText.prototype._draw = function (context) {
-        var _this = this;
+    }
+    _draw(context) {
         context.save();
         this._applyStates(context);
         if (this.shadowBlur || this.shadowOffsetX || this.shadowOffsetY) {
@@ -887,11 +802,11 @@ var InputText = /** @class */ (function (_super) {
             this._fontOffset = Control._GetFontOffset(context.font);
         }
         // Text
-        var clipTextLeft = this._currentMeasure.left + this._margin.getValueInPixel(this._host, this._tempParentMeasure.width);
+        const clipTextLeft = this._currentMeasure.left + this._margin.getValueInPixel(this._host, this._tempParentMeasure.width);
         if (this.color) {
             context.fillStyle = this.color;
         }
-        var text = this._beforeRenderText(this._textWrapper);
+        let text = this._beforeRenderText(this._textWrapper);
         if (!this._isFocused && !this._textWrapper.text && this._placeholderText) {
             text = new TextWrapper();
             text.text = this._placeholderText;
@@ -900,19 +815,19 @@ var InputText = /** @class */ (function (_super) {
             }
         }
         this._textWidth = context.measureText(text.text).width;
-        var marginWidth = this._margin.getValueInPixel(this._host, this._tempParentMeasure.width) * 2;
+        const marginWidth = this._margin.getValueInPixel(this._host, this._tempParentMeasure.width) * 2;
         if (this._autoStretchWidth) {
             this.width = Math.min(this._maxWidth.getValueInPixel(this._host, this._tempParentMeasure.width), this._textWidth + marginWidth) + "px";
             this._autoStretchWidth = true; // setting the width will have reset _autoStretchWidth to false!
         }
-        var rootY = this._fontOffset.ascent + (this._currentMeasure.height - this._fontOffset.height) / 2;
-        var availableWidth = this._width.getValueInPixel(this._host, this._tempParentMeasure.width) - marginWidth;
+        const rootY = this._fontOffset.ascent + (this._currentMeasure.height - this._fontOffset.height) / 2;
+        const availableWidth = this._width.getValueInPixel(this._host, this._tempParentMeasure.width) - marginWidth;
         context.save();
         context.beginPath();
         context.rect(clipTextLeft, this._currentMeasure.top + (this._currentMeasure.height - this._fontOffset.height) / 2, availableWidth + 2, this._currentMeasure.height);
         context.clip();
         if (this._isFocused && this._textWidth > availableWidth) {
-            var textLeft = clipTextLeft - this._textWidth + availableWidth;
+            const textLeft = clipTextLeft - this._textWidth + availableWidth;
             if (!this._scrollLeft) {
                 this._scrollLeft = textLeft;
             }
@@ -925,11 +840,11 @@ var InputText = /** @class */ (function (_super) {
         if (this._isFocused) {
             // Need to move cursor
             if (this._clickedCoordinate) {
-                var rightPosition = this._scrollLeft + this._textWidth;
-                var absoluteCursorPosition = rightPosition - this._clickedCoordinate;
-                var currentSize = 0;
+                const rightPosition = this._scrollLeft + this._textWidth;
+                const absoluteCursorPosition = rightPosition - this._clickedCoordinate;
+                let currentSize = 0;
                 this._cursorOffset = 0;
-                var previousDist = 0;
+                let previousDist = 0;
                 do {
                     if (this._cursorOffset) {
                         previousDist = Math.abs(absoluteCursorPosition - currentSize);
@@ -946,9 +861,9 @@ var InputText = /** @class */ (function (_super) {
             }
             // Render cursor
             if (!this._blinkIsEven) {
-                var cursorOffsetText = text.substr(text.length - this._cursorOffset);
-                var cursorOffsetWidth = context.measureText(cursorOffsetText).width;
-                var cursorLeft = this._scrollLeft + this._textWidth - cursorOffsetWidth;
+                const cursorOffsetText = text.substr(text.length - this._cursorOffset);
+                const cursorOffsetWidth = context.measureText(cursorOffsetText).width;
+                let cursorLeft = this._scrollLeft + this._textWidth - cursorOffsetWidth;
                 if (cursorLeft < clipTextLeft) {
                     this._scrollLeft += clipTextLeft - cursorLeft;
                     cursorLeft = clipTextLeft;
@@ -964,17 +879,17 @@ var InputText = /** @class */ (function (_super) {
                 }
             }
             clearTimeout(this._blinkTimeout);
-            this._blinkTimeout = setTimeout(function () {
-                _this._blinkIsEven = !_this._blinkIsEven;
-                _this._markAsDirty();
+            this._blinkTimeout = setTimeout(() => {
+                this._blinkIsEven = !this._blinkIsEven;
+                this._markAsDirty();
             }, 500);
             //show the highlighted text
             if (this._isTextHighlightOn) {
                 clearTimeout(this._blinkTimeout);
-                var highlightCursorOffsetWidth = context.measureText(text.substring(this._startHighlightIndex)).width;
-                var highlightCursorLeft = this._scrollLeft + this._textWidth - highlightCursorOffsetWidth;
+                const highlightCursorOffsetWidth = context.measureText(text.substring(this._startHighlightIndex)).width;
+                let highlightCursorLeft = this._scrollLeft + this._textWidth - highlightCursorOffsetWidth;
                 this._highlightedText = text.substring(this._startHighlightIndex, this._endHighlightIndex);
-                var width = context.measureText(text.substring(this._startHighlightIndex, this._endHighlightIndex)).width;
+                let width = context.measureText(text.substring(this._startHighlightIndex, this._endHighlightIndex)).width;
                 if (highlightCursorLeft < clipTextLeft) {
                     width = width - (clipTextLeft - highlightCursorLeft);
                     if (!width) {
@@ -1008,9 +923,9 @@ var InputText = /** @class */ (function (_super) {
             context.strokeRect(this._currentMeasure.left + this._thickness / 2, this._currentMeasure.top + this._thickness / 2, this._currentMeasure.width - this._thickness, this._currentMeasure.height - this._thickness);
         }
         context.restore();
-    };
-    InputText.prototype._onPointerDown = function (target, coordinates, pointerId, buttonIndex, pi) {
-        if (!_super.prototype._onPointerDown.call(this, target, coordinates, pointerId, buttonIndex, pi)) {
+    }
+    _onPointerDown(target, coordinates, pointerId, buttonIndex, pi) {
+        if (!super._onPointerDown(target, coordinates, pointerId, buttonIndex, pi)) {
             return false;
         }
         if (this.isReadOnly) {
@@ -1034,25 +949,25 @@ var InputText = /** @class */ (function (_super) {
         }
         this._host.focusedControl = this;
         return true;
-    };
-    InputText.prototype._onPointerMove = function (target, coordinates, pointerId, pi) {
+    }
+    _onPointerMove(target, coordinates, pointerId, pi) {
         if (this._host.focusedControl === this && this._isPointerDown && !this.isReadOnly) {
             this._clickedCoordinate = coordinates.x;
             this._markAsDirty();
             this._updateValueFromCursorIndex(this._cursorOffset);
         }
-        _super.prototype._onPointerMove.call(this, target, coordinates, pointerId, pi);
-    };
-    InputText.prototype._onPointerUp = function (target, coordinates, pointerId, buttonIndex, notifyClick) {
+        super._onPointerMove(target, coordinates, pointerId, pi);
+    }
+    _onPointerUp(target, coordinates, pointerId, buttonIndex, notifyClick) {
         this._isPointerDown = false;
         delete this._host._capturingControl[pointerId];
-        _super.prototype._onPointerUp.call(this, target, coordinates, pointerId, buttonIndex, notifyClick);
-    };
-    InputText.prototype._beforeRenderText = function (textWrapper) {
+        super._onPointerUp(target, coordinates, pointerId, buttonIndex, notifyClick);
+    }
+    _beforeRenderText(textWrapper) {
         return textWrapper;
-    };
-    InputText.prototype.dispose = function () {
-        _super.prototype.dispose.call(this);
+    }
+    dispose() {
+        super.dispose();
         this.onBlurObservable.clear();
         this.onFocusObservable.clear();
         this.onTextChangedObservable.clear();
@@ -1061,60 +976,58 @@ var InputText = /** @class */ (function (_super) {
         this.onTextPasteObservable.clear();
         this.onTextHighlightObservable.clear();
         this.onKeyboardEventProcessedObservable.clear();
-    };
-    __decorate([
-        serialize()
-    ], InputText.prototype, "promptMessage", void 0);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "disableMobilePrompt", void 0);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "maxWidth", null);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "highligherOpacity", null);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "onFocusSelectAll", null);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "textHighlightColor", null);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "margin", null);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "autoStretchWidth", null);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "thickness", null);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "focusedBackground", null);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "focusedColor", null);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "background", null);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "placeholderColor", null);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "placeholderText", null);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "deadKey", null);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "text", null);
-    __decorate([
-        serialize()
-    ], InputText.prototype, "width", null);
-    return InputText;
-}(Control));
-export { InputText };
+    }
+}
+__decorate([
+    serialize()
+], InputText.prototype, "promptMessage", void 0);
+__decorate([
+    serialize()
+], InputText.prototype, "disableMobilePrompt", void 0);
+__decorate([
+    serialize()
+], InputText.prototype, "maxWidth", null);
+__decorate([
+    serialize()
+], InputText.prototype, "highligherOpacity", null);
+__decorate([
+    serialize()
+], InputText.prototype, "onFocusSelectAll", null);
+__decorate([
+    serialize()
+], InputText.prototype, "textHighlightColor", null);
+__decorate([
+    serialize()
+], InputText.prototype, "margin", null);
+__decorate([
+    serialize()
+], InputText.prototype, "autoStretchWidth", null);
+__decorate([
+    serialize()
+], InputText.prototype, "thickness", null);
+__decorate([
+    serialize()
+], InputText.prototype, "focusedBackground", null);
+__decorate([
+    serialize()
+], InputText.prototype, "focusedColor", null);
+__decorate([
+    serialize()
+], InputText.prototype, "background", null);
+__decorate([
+    serialize()
+], InputText.prototype, "placeholderColor", null);
+__decorate([
+    serialize()
+], InputText.prototype, "placeholderText", null);
+__decorate([
+    serialize()
+], InputText.prototype, "deadKey", null);
+__decorate([
+    serialize()
+], InputText.prototype, "text", null);
+__decorate([
+    serialize()
+], InputText.prototype, "width", null);
 RegisterClass("BABYLON.GUI.InputText", InputText);
 //# sourceMappingURL=inputText.js.map