@nativescript/core 8.9.0-napi-es5.0 → 8.9.0-napi.1

package/ui/core/view/view-common.js

@@ -17,31 +17,27 @@ import { accessibilityBlurEvent, accessibilityFocusChangedEvent, accessibilityFo
 import { SharedTransition } from '../../transition/shared-transition';
 // helpers (these are okay re-exported here)
 export * from './view-helper';
-var animationModule;
+let animationModule;
 function ensureAnimationModule() {
     if (!animationModule) {
         animationModule = require('../../animation');
     }
 }
 export function CSSType(type) {
-    return function (cls) {
+    return (cls) => {
         cls.prototype.cssType = type;
     };
 }
 export function viewMatchesModuleContext(view, context, types) {
-    return context && view._moduleName && context.type && types.some(function (type) { return type === context.type; }) && context.path && context.path.includes(view._moduleName);
+    return context && view._moduleName && context.type && types.some((type) => type === context.type) && context.path && context.path.includes(view._moduleName);
 }
-export function PseudoClassHandler() {
-    var pseudoClasses = [];
-    for (var _i = 0; _i < arguments.length; _i++) {
-        pseudoClasses[_i] = arguments[_i];
-    }
-    var stateEventNames = pseudoClasses.map(function (s) { return ':' + s; });
-    var listeners = Symbol('listeners');
-    return function (target, propertyKey, descriptor) {
+export function PseudoClassHandler(...pseudoClasses) {
+    const stateEventNames = pseudoClasses.map((s) => ':' + s);
+    const listeners = Symbol('listeners');
+    return (target, propertyKey, descriptor) => {
         function update(change) {
-            var prev = this[listeners] || 0;
-            var next = prev + change;
+            const prev = this[listeners] || 0;
+            const next = prev + change;
             if (prev <= 0 && next > 0) {
                 this[propertyKey](true);
             }
@@ -49,45 +45,39 @@ export function PseudoClassHandler() {
                 this[propertyKey](false);
             }
         }
-        stateEventNames.forEach(function (s) { return (target[s] = update); });
+        stateEventNames.forEach((s) => (target[s] = update));
     };
 }
-export var _rootModalViews = new Array();
+export const _rootModalViews = new Array();
 // TODO: remove once we fully switch to the new event system
-var warnedEvent = new Set();
-var ViewCommon = /** @class */ (function (_super) {
-    __extends(ViewCommon, _super);
-    function ViewCommon() {
-        var _this = _super !== null && _super.apply(this, arguments) || this;
-        _this._gestureObservers = {};
-        return _this;
-    }
-    Object.defineProperty(ViewCommon.prototype, "css", {
-        get: function () {
-            var scope = this._styleScope;
-            return scope && scope.css;
-        },
-        set: function (value) {
-            this._updateStyleScope(undefined, undefined, value);
-        },
-        enumerable: false,
-        configurable: true
-    });
-    ViewCommon.prototype.addCss = function (cssString) {
+const warnedEvent = new Set();
+export class ViewCommon extends ViewBase {
+    constructor() {
+        super(...arguments);
+        this._gestureObservers = {};
+    }
+    get css() {
+        const scope = this._styleScope;
+        return scope && scope.css;
+    }
+    set css(value) {
+        this._updateStyleScope(undefined, undefined, value);
+    }
+    addCss(cssString) {
         this._updateStyleScope(undefined, cssString);
-    };
-    ViewCommon.prototype.addCssFile = function (cssFileName) {
+    }
+    addCssFile(cssFileName) {
         this._updateStyleScope(cssFileName);
-    };
-    ViewCommon.prototype.changeCssFile = function (cssFileName) {
-        var scope = this._styleScope;
+    }
+    changeCssFile(cssFileName) {
+        const scope = this._styleScope;
         if (scope && cssFileName) {
             scope.changeCssFile(cssFileName);
             this._onCssStateChange();
         }
-    };
-    ViewCommon.prototype._updateStyleScope = function (cssFileName, cssString, css) {
-        var scope = this._styleScope;
+    }
+    _updateStyleScope(cssFileName, cssString, css) {
+        let scope = this._styleScope;
         if (!scope) {
             scope = new StyleScope();
             this.setScopeProperty(scope, cssFileName, cssString, css);
@@ -98,8 +88,8 @@ var ViewCommon = /** @class */ (function (_super) {
             this.setScopeProperty(scope, cssFileName, cssString, css);
             this._onCssStateChange();
         }
-    };
-    ViewCommon.prototype.setScopeProperty = function (scope, cssFileName, cssString, css) {
+    }
+    setScopeProperty(scope, cssFileName, cssString, css) {
         if (cssFileName !== undefined) {
             scope.addCssFile(cssFileName);
         }
@@ -109,73 +99,73 @@ var ViewCommon = /** @class */ (function (_super) {
         else if (css !== undefined) {
             scope.css = css;
         }
-    };
-    ViewCommon.prototype.onLoaded = function () {
+    }
+    onLoaded() {
         if (!this.isLoaded) {
-            var hasTap = this.hasListeners('tap') || this.hasListeners('tapChange') || !!this.getGestureObservers(GestureTypes.tap);
-            var enableTapAnimations = TouchManager.enableGlobalTapAnimations && hasTap;
+            const hasTap = this.hasListeners('tap') || this.hasListeners('tapChange') || !!this.getGestureObservers(GestureTypes.tap);
+            const enableTapAnimations = TouchManager.enableGlobalTapAnimations && hasTap;
             if (!this.ignoreTouchAnimation && (this.touchAnimation || enableTapAnimations)) {
                 TouchManager.addAnimations(this);
             }
             if (__VISIONOS__) {
-                var enableHoverStyle = TouchManager.enableGlobalHoverWhereTap && hasTap;
+                const enableHoverStyle = TouchManager.enableGlobalHoverWhereTap && hasTap;
                 if (!this.visionIgnoreHoverStyle && (this.visionHoverStyle || enableHoverStyle)) {
                     TouchManager.addHoverStyle(this);
                 }
             }
         }
-        _super.prototype.onLoaded.call(this);
+        super.onLoaded();
         setupAccessibleView(this);
-    };
-    ViewCommon.prototype._closeAllModalViewsInternal = function () {
+    }
+    _closeAllModalViewsInternal() {
         if (_rootModalViews && _rootModalViews.length > 0) {
-            _rootModalViews.forEach(function (v) {
+            _rootModalViews.forEach((v) => {
                 v.closeModal();
             });
             return true;
         }
         return false;
-    };
-    ViewCommon.prototype._getRootModalViews = function () {
+    }
+    _getRootModalViews() {
         return _rootModalViews;
-    };
-    ViewCommon.prototype._onLivesync = function (context) {
+    }
+    _onLivesync(context) {
         if (Trace.isEnabled()) {
-            Trace.write("".concat(this, "._onLivesync(").concat(JSON.stringify(context), ")"), Trace.categories.Livesync);
+            Trace.write(`${this}._onLivesync(${JSON.stringify(context)})`, Trace.categories.Livesync);
         }
-        var handled = false;
+        let handled = false;
         if (this._closeAllModalViewsInternal()) {
             handled = true;
         }
         if (this._handleLivesync(context)) {
             return true;
         }
-        this.eachChildView(function (child) {
+        this.eachChildView((child) => {
             if (child._onLivesync(context)) {
                 handled = true;
                 return false;
             }
         });
         return handled;
-    };
-    ViewCommon.prototype._handleLivesync = function (context) {
+    }
+    _handleLivesync(context) {
         if (Trace.isEnabled()) {
-            Trace.write("".concat(this, "._handleLivesync(").concat(JSON.stringify(context), ")"), Trace.categories.Livesync);
+            Trace.write(`${this}._handleLivesync(${JSON.stringify(context)})`, Trace.categories.Livesync);
         }
         // Handle local CSS
         if (viewMatchesModuleContext(this, context, ['style'])) {
             if (Trace.isEnabled()) {
-                Trace.write("Change Handled: Changing CSS for ".concat(this), Trace.categories.Livesync);
+                Trace.write(`Change Handled: Changing CSS for ${this}`, Trace.categories.Livesync);
             }
             // Always load styles with ".css" extension. Even when changes are in ".scss" ot ".less" files
-            var cssModuleName = "".concat(sanitizeModuleName(context.path), ".css");
+            const cssModuleName = `${sanitizeModuleName(context.path)}.css`;
             this.changeCssFile(cssModuleName);
             return true;
         }
         // Handle script/markup changes in custom components by falling back to page refresh
         if (viewMatchesModuleContext(this, context, ['markup', 'script']) && this.page && this.page.frame) {
             if (Trace.isEnabled()) {
-                Trace.write("Change Handled: Changing ".concat(context.type, " for ").concat(this, " inside ").concat(this.page), Trace.categories.Livesync);
+                Trace.write(`Change Handled: Changing ${context.type} for ${this} inside ${this.page}`, Trace.categories.Livesync);
             }
             return this.page.frame._handleLivesync({
                 type: context.type,
@@ -183,17 +173,16 @@ var ViewCommon = /** @class */ (function (_super) {
             });
         }
         return false;
-    };
-    ViewCommon.prototype._setupAsRootView = function (context) {
-        _super.prototype._setupAsRootView.call(this, context);
+    }
+    _setupAsRootView(context) {
+        super._setupAsRootView(context);
         if (!this._styleScope) {
             this._updateStyleScope();
         }
-    };
-    ViewCommon.prototype._observe = function (type, callback, thisArg) {
-        var _a;
+    }
+    _observe(type, callback, thisArg) {
         thisArg = thisArg || undefined;
-        if ((_a = this._gestureObservers[type]) === null || _a === void 0 ? void 0 : _a.find(function (observer) { return observer.callback === callback && observer.context === thisArg; })) {
+        if (this._gestureObservers[type]?.find((observer) => observer.callback === callback && observer.context === thisArg)) {
             // Already added.
             return;
         }
@@ -201,70 +190,70 @@ var ViewCommon = /** @class */ (function (_super) {
             this._gestureObservers[type] = [];
         }
         this._gestureObservers[type].push(gestureObserve(this, type, callback, thisArg));
-    };
-    ViewCommon.prototype.getGestureObservers = function (type) {
+    }
+    getGestureObservers(type) {
         return this._gestureObservers[type];
-    };
-    ViewCommon.prototype.addEventListener = function (eventNames, callback, thisArg) {
+    }
+    addEventListener(eventNames, callback, thisArg) {
         thisArg = thisArg || undefined;
         // TODO: Remove this once we fully switch to the new event system
         if (typeof eventNames === 'number') {
             // likely a gesture type from a plugin
-            var gestureName = gestureToString(eventNames);
+            const gestureName = gestureToString(eventNames);
             if (!warnedEvent.has(gestureName)) {
-                console.warn("Using a gesture type (".concat(gestureName, ") as an event name is deprecated. Please use the event name instead."));
+                console.warn(`Using a gesture type (${gestureName}) as an event name is deprecated. Please use the event name instead.`);
                 warnedEvent.add(gestureName);
             }
             eventNames = gestureName;
         }
         // Normalize "ontap" -> "tap"
-        var normalizedName = getEventOrGestureName(eventNames);
+        const normalizedName = getEventOrGestureName(eventNames);
         // Coerce "tap" -> GestureTypes.tap
         // Coerce "loaded" -> undefined
-        var gestureType = gestureFromString(normalizedName);
+        const gestureType = gestureFromString(normalizedName);
         // If it's a gesture (and this Observable declares e.g. `static tapEvent`)
         if (gestureType && !this._isEvent(normalizedName)) {
             this._observe(gestureType, callback, thisArg);
             return;
         }
-        _super.prototype.addEventListener.call(this, normalizedName, callback, thisArg);
-    };
-    ViewCommon.prototype.removeEventListener = function (eventNames, callback, thisArg) {
+        super.addEventListener(normalizedName, callback, thisArg);
+    }
+    removeEventListener(eventNames, callback, thisArg) {
         thisArg = thisArg || undefined;
         // TODO: Remove this once we fully switch to the new event system
         if (typeof eventNames === 'number') {
             // likely a gesture type from a plugin
-            var gestureName = gestureToString(eventNames);
+            const gestureName = gestureToString(eventNames);
             if (!warnedEvent.has(gestureName)) {
-                console.warn("Using a gesture type (".concat(gestureName, ") as an event name is deprecated. Please use the event name instead."));
+                console.warn(`Using a gesture type (${gestureName}) as an event name is deprecated. Please use the event name instead.`);
                 warnedEvent.add(gestureName);
             }
             eventNames = gestureName;
         }
         // Normalize "ontap" -> "tap"
-        var normalizedName = getEventOrGestureName(eventNames);
+        const normalizedName = getEventOrGestureName(eventNames);
         // Coerce "tap" -> GestureTypes.tap
         // Coerce "loaded" -> undefined
-        var gestureType = gestureFromString(normalizedName);
+        const gestureType = gestureFromString(normalizedName);
         // If it's a gesture (and this Observable declares e.g. `static tapEvent`)
         if (gestureType && !this._isEvent(normalizedName)) {
             this._disconnectGestureObservers(gestureType, callback, thisArg);
             return;
         }
-        _super.prototype.removeEventListener.call(this, normalizedName, callback, thisArg);
-    };
-    ViewCommon.prototype.onBackPressed = function () {
+        super.removeEventListener(normalizedName, callback, thisArg);
+    }
+    onBackPressed() {
         return false;
-    };
-    ViewCommon.prototype._getFragmentManager = function () {
+    }
+    _getFragmentManager() {
         return undefined;
-    };
-    ViewCommon.prototype.getModalOptions = function (args) {
+    }
+    getModalOptions(args) {
         if (args.length === 0) {
             throw new Error('showModal without parameters is deprecated. Please call showModal on a view instance instead.');
         }
         else {
-            var options = null;
+            let options = null;
             if (args.length === 2) {
                 options = args[1];
             }
@@ -283,137 +272,119 @@ var ViewCommon = /** @class */ (function (_super) {
                     stretched: args[5],
                 };
             }
-            var firstArgument = args[0];
-            var view = firstArgument instanceof ViewCommon ? firstArgument : Builder.createViewFromEntry({
+            const firstArgument = args[0];
+            const view = firstArgument instanceof ViewCommon ? firstArgument : Builder.createViewFromEntry({
                 moduleName: firstArgument,
             });
-            return { view: view, options: options };
+            return { view, options };
         }
-    };
-    ViewCommon.prototype.showModal = function () {
-        var _a, _b;
-        var args = [];
-        for (var _i = 0; _i < arguments.length; _i++) {
-            args[_i] = arguments[_i];
-        }
-        var _c = this.getModalOptions(args), view = _c.view, options = _c.options;
-        if ((_a = options.transition) === null || _a === void 0 ? void 0 : _a.instance) {
-            SharedTransition.updateState((_b = options.transition) === null || _b === void 0 ? void 0 : _b.instance.id, {
+    }
+    showModal(...args) {
+        const { view, options } = this.getModalOptions(args);
+        if (options.transition?.instance) {
+            SharedTransition.updateState(options.transition?.instance.id, {
                 page: this,
                 toPage: view,
             });
         }
         view._showNativeModalView(this, options);
         return view;
-    };
-    ViewCommon.prototype.closeModal = function () {
-        var args = [];
-        for (var _i = 0; _i < arguments.length; _i++) {
-            args[_i] = arguments[_i];
-        }
-        var closeCallback = this._closeModalCallback;
+    }
+    closeModal(...args) {
+        const closeCallback = this._closeModalCallback;
         if (closeCallback) {
-            closeCallback.apply(void 0, args);
+            closeCallback(...args);
         }
         else {
-            var parent_1 = this.parent;
-            if (parent_1) {
-                parent_1.closeModal.apply(parent_1, args);
+            const parent = this.parent;
+            if (parent) {
+                parent.closeModal(...args);
             }
         }
-    };
-    Object.defineProperty(ViewCommon.prototype, "modal", {
-        get: function () {
-            return this._modal;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    ViewCommon.prototype._showNativeModalView = function (parent, options) {
-        var _this = this;
+    }
+    get modal() {
+        return this._modal;
+    }
+    _showNativeModalView(parent, options) {
         _rootModalViews.push(this);
         this.cssClasses.add(CSSUtils.MODAL_ROOT_VIEW_CSS_CLASS);
-        var modalRootViewCssClasses = CSSUtils.getSystemCssClasses();
-        modalRootViewCssClasses.forEach(function (c) { return _this.cssClasses.add(c); });
+        const modalRootViewCssClasses = CSSUtils.getSystemCssClasses();
+        modalRootViewCssClasses.forEach((c) => this.cssClasses.add(c));
         parent._modal = this;
         this.style.fontScaleInternal = getCurrentFontScale();
         this._modalParent = parent;
         this._modalContext = options.context;
-        this._closeModalCallback = function () {
-            var originalArgs = [];
-            for (var _i = 0; _i < arguments.length; _i++) {
-                originalArgs[_i] = arguments[_i];
-            }
-            var cleanupModalViews = function () {
-                var modalIndex = _rootModalViews.indexOf(_this);
+        this._closeModalCallback = (...originalArgs) => {
+            const cleanupModalViews = () => {
+                const modalIndex = _rootModalViews.indexOf(this);
                 _rootModalViews.splice(modalIndex, 1);
-                _this._modalParent = null;
-                _this._modalContext = null;
-                _this._closeModalCallback = null;
-                _this._dialogClosed();
+                this._modalParent = null;
+                this._modalContext = null;
+                this._closeModalCallback = null;
+                this._dialogClosed();
                 parent._modal = null;
             };
-            var whenClosedCallback = function () {
-                var transitionState = SharedTransition.getState(_this.transitionId);
-                if (transitionState === null || transitionState === void 0 ? void 0 : transitionState.interactiveBegan) {
-                    SharedTransition.updateState(_this.transitionId, {
+            const whenClosedCallback = () => {
+                const transitionState = SharedTransition.getState(this.transitionId);
+                if (transitionState?.interactiveBegan) {
+                    SharedTransition.updateState(this.transitionId, {
                         interactiveBegan: false,
                     });
-                    if (!(transitionState === null || transitionState === void 0 ? void 0 : transitionState.interactiveCancelled)) {
+                    if (!transitionState?.interactiveCancelled) {
                         cleanupModalViews();
                     }
                 }
-                if (!(transitionState === null || transitionState === void 0 ? void 0 : transitionState.interactiveCancelled)) {
+                if (!transitionState?.interactiveCancelled) {
                     if (typeof options.closeCallback === 'function') {
                         options.closeCallback.apply(undefined, originalArgs);
                     }
-                    _this._tearDownUI(true);
+                    this._tearDownUI(true);
                 }
             };
-            var transitionState = SharedTransition.getState(_this.transitionId);
-            if (!(transitionState === null || transitionState === void 0 ? void 0 : transitionState.interactiveBegan)) {
+            const transitionState = SharedTransition.getState(this.transitionId);
+            if (!transitionState?.interactiveBegan) {
                 cleanupModalViews();
             }
-            _this._hideNativeModalView(parent, whenClosedCallback);
+            this._hideNativeModalView(parent, whenClosedCallback);
         };
-    };
-    ViewCommon.prototype._hideNativeModalView = function (parent, whenClosedCallback) { };
-    ViewCommon.prototype._raiseLayoutChangedEvent = function () {
-        var args = {
+    }
+    _hideNativeModalView(parent, whenClosedCallback) { }
+    _raiseLayoutChangedEvent() {
+        const args = {
             eventName: ViewCommon.layoutChangedEvent,
             object: this,
         };
         this.notify(args);
-    };
-    ViewCommon.prototype._raiseShownModallyEvent = function () {
-        var args = {
+    }
+    _raiseShownModallyEvent() {
+        const args = {
             eventName: ViewCommon.shownModallyEvent,
             object: this,
             context: this._modalContext,
             closeCallback: this._closeModalCallback,
         };
         this.notify(args);
-    };
-    ViewCommon.prototype._raiseShowingModallyEvent = function () {
-        var args = {
+    }
+    _raiseShowingModallyEvent() {
+        const args = {
             eventName: ViewCommon.showingModallyEvent,
             object: this,
             context: this._modalContext,
             closeCallback: this._closeModalCallback,
         };
         this.notify(args);
-    };
-    ViewCommon.prototype._isEvent = function (name) {
-        return this.constructor && "".concat(name, "Event") in this.constructor;
-    };
-    ViewCommon.prototype._disconnectGestureObservers = function (type, callback, thisArg) {
+    }
+    _isEvent(name) {
+        return this.constructor && `${name}Event` in this.constructor;
+    }
+    _disconnectGestureObservers(type, callback, thisArg) {
         // Largely mirrors the implementation of Observable.innerRemoveEventListener().
-        var observers = this.getGestureObservers(type);
+        const observers = this.getGestureObservers(type);
         if (!observers) {
             return;
         }
-        for (var i = 0; i < observers.length; i++) {
-            var observer = observers[i];
+        for (let i = 0; i < observers.length; i++) {
+            const observer = observers[i];
             // If we have a `thisArg`, refine on both `callback` and `thisArg`.
             if (thisArg && (observer.callback !== callback || observer.context !== thisArg)) {
                 continue;
@@ -429,732 +400,475 @@ var ViewCommon = /** @class */ (function (_super) {
         if (!observers.length) {
             delete this._gestureObservers[type];
         }
-    };
-    Object.defineProperty(ViewCommon.prototype, "flexFlow", {
-        // START Style property shortcuts
-        get: function () {
-            return this.style.flexFlow;
-        },
-        set: function (value) {
-            this.style.flexFlow = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "flex", {
-        get: function () {
-            return this.style.flex;
-        },
-        set: function (value) {
-            this.style.flex = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "borderColor", {
-        get: function () {
-            return this.style.borderColor;
-        },
-        set: function (value) {
-            this.style.borderColor = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "borderTopColor", {
-        get: function () {
-            return this.style.borderTopColor;
-        },
-        set: function (value) {
-            this.style.borderTopColor = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "borderRightColor", {
-        get: function () {
-            return this.style.borderRightColor;
-        },
-        set: function (value) {
-            this.style.borderRightColor = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "borderBottomColor", {
-        get: function () {
-            return this.style.borderBottomColor;
-        },
-        set: function (value) {
-            this.style.borderBottomColor = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "borderLeftColor", {
-        get: function () {
-            return this.style.borderLeftColor;
-        },
-        set: function (value) {
-            this.style.borderLeftColor = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "borderWidth", {
-        get: function () {
-            return this.style.borderWidth;
-        },
-        set: function (value) {
-            this.style.borderWidth = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "borderTopWidth", {
-        get: function () {
-            return this.style.borderTopWidth;
-        },
-        set: function (value) {
-            this.style.borderTopWidth = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "borderRightWidth", {
-        get: function () {
-            return this.style.borderRightWidth;
-        },
-        set: function (value) {
-            this.style.borderRightWidth = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "borderBottomWidth", {
-        get: function () {
-            return this.style.borderBottomWidth;
-        },
-        set: function (value) {
-            this.style.borderBottomWidth = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "borderLeftWidth", {
-        get: function () {
-            return this.style.borderLeftWidth;
-        },
-        set: function (value) {
-            this.style.borderLeftWidth = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "borderRadius", {
-        get: function () {
-            return this.style.borderRadius;
-        },
-        set: function (value) {
-            this.style.borderRadius = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "borderTopLeftRadius", {
-        get: function () {
-            return this.style.borderTopLeftRadius;
-        },
-        set: function (value) {
-            this.style.borderTopLeftRadius = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "borderTopRightRadius", {
-        get: function () {
-            return this.style.borderTopRightRadius;
-        },
-        set: function (value) {
-            this.style.borderTopRightRadius = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "borderBottomRightRadius", {
-        get: function () {
-            return this.style.borderBottomRightRadius;
-        },
-        set: function (value) {
-            this.style.borderBottomRightRadius = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "borderBottomLeftRadius", {
-        get: function () {
-            return this.style.borderBottomLeftRadius;
-        },
-        set: function (value) {
-            this.style.borderBottomLeftRadius = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "color", {
-        get: function () {
-            return this.style.color;
-        },
-        set: function (value) {
-            this.style.color = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "background", {
-        get: function () {
-            return this.style.background;
-        },
-        set: function (value) {
-            this.style.background = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "backgroundColor", {
-        get: function () {
-            return this.style.backgroundColor;
-        },
-        set: function (value) {
-            this.style.backgroundColor = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "backgroundImage", {
-        get: function () {
-            return this.style.backgroundImage;
-        },
-        set: function (value) {
-            this.style.backgroundImage = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "backgroundSize", {
-        get: function () {
-            return this.style.backgroundSize;
-        },
-        set: function (value) {
-            this.style.backgroundSize = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "backgroundPosition", {
-        get: function () {
-            return this.style.backgroundPosition;
-        },
-        set: function (value) {
-            this.style.backgroundPosition = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "backgroundRepeat", {
-        get: function () {
-            return this.style.backgroundRepeat;
-        },
-        set: function (value) {
-            this.style.backgroundRepeat = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "boxShadow", {
-        get: function () {
-            return this.style.boxShadow;
-        },
-        set: function (value) {
-            this.style.boxShadow = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "minWidth", {
-        get: function () {
-            return this.style.minWidth;
-        },
-        set: function (value) {
-            this.style.minWidth = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "minHeight", {
-        get: function () {
-            return this.style.minHeight;
-        },
-        set: function (value) {
-            this.style.minHeight = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "width", {
-        get: function () {
-            return this.style.width;
-        },
-        set: function (value) {
-            this.style.width = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "height", {
-        get: function () {
-            return this.style.height;
-        },
-        set: function (value) {
-            this.style.height = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "margin", {
-        get: function () {
-            return this.style.margin;
-        },
-        set: function (value) {
-            this.style.margin = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "marginLeft", {
-        get: function () {
-            return this.style.marginLeft;
-        },
-        set: function (value) {
-            this.style.marginLeft = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "marginTop", {
-        get: function () {
-            return this.style.marginTop;
-        },
-        set: function (value) {
-            this.style.marginTop = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "marginRight", {
-        get: function () {
-            return this.style.marginRight;
-        },
-        set: function (value) {
-            this.style.marginRight = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "marginBottom", {
-        get: function () {
-            return this.style.marginBottom;
-        },
-        set: function (value) {
-            this.style.marginBottom = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "horizontalAlignment", {
-        get: function () {
-            return this.style.horizontalAlignment;
-        },
-        set: function (value) {
-            this.style.horizontalAlignment = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "verticalAlignment", {
-        get: function () {
-            return this.style.verticalAlignment;
-        },
-        set: function (value) {
-            this.style.verticalAlignment = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "visibility", {
-        get: function () {
-            return this.style.visibility;
-        },
-        set: function (value) {
-            this.style.visibility = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "opacity", {
-        get: function () {
-            return this.style.opacity;
-        },
-        set: function (value) {
-            this.style.opacity = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "rotate", {
-        get: function () {
-            return this.style.rotate;
-        },
-        set: function (value) {
-            this.style.rotate = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "rotateX", {
-        get: function () {
-            return this.style.rotateX;
-        },
-        set: function (value) {
-            this.style.rotateX = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "rotateY", {
-        get: function () {
-            return this.style.rotateY;
-        },
-        set: function (value) {
-            this.style.rotateY = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "perspective", {
-        get: function () {
-            return this.style.perspective;
-        },
-        set: function (value) {
-            this.style.perspective = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "textTransform", {
-        get: function () {
-            return this.style.textTransform;
-        },
-        set: function (value) {
-            this.style.textTransform = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "translateX", {
-        get: function () {
-            return this.style.translateX;
-        },
-        set: function (value) {
-            this.style.translateX = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "translateY", {
-        get: function () {
-            return this.style.translateY;
-        },
-        set: function (value) {
-            this.style.translateY = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "scaleX", {
-        get: function () {
-            return this.style.scaleX;
-        },
-        set: function (value) {
-            this.style.scaleX = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "scaleY", {
-        get: function () {
-            return this.style.scaleY;
-        },
-        set: function (value) {
-            this.style.scaleY = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "accessible", {
-        get: function () {
-            return this.style.accessible;
-        },
-        set: function (value) {
-            this.style.accessible = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "accessibilityHidden", {
-        get: function () {
-            return this.style.accessibilityHidden;
-        },
-        set: function (value) {
-            this.style.accessibilityHidden = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "accessibilityRole", {
-        get: function () {
-            return this.style.accessibilityRole;
-        },
-        set: function (value) {
-            this.style.accessibilityRole = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "accessibilityState", {
-        get: function () {
-            return this.style.accessibilityState;
-        },
-        set: function (value) {
-            this.style.accessibilityState = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "accessibilityLiveRegion", {
-        get: function () {
-            return this.style.accessibilityLiveRegion;
-        },
-        set: function (value) {
-            this.style.accessibilityLiveRegion = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "accessibilityLanguage", {
-        get: function () {
-            return this.style.accessibilityLanguage;
-        },
-        set: function (value) {
-            this.style.accessibilityLanguage = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "accessibilityMediaSession", {
-        get: function () {
-            return this.style.accessibilityMediaSession;
-        },
-        set: function (value) {
-            this.style.accessibilityMediaSession = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "iosAccessibilityAdjustsFontSize", {
-        get: function () {
-            return this.style.iosAccessibilityAdjustsFontSize;
-        },
-        set: function (value) {
-            this.style.iosAccessibilityAdjustsFontSize = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "iosAccessibilityMinFontScale", {
-        get: function () {
-            return this.style.iosAccessibilityMinFontScale;
-        },
-        set: function (value) {
-            this.style.iosAccessibilityMinFontScale = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "iosAccessibilityMaxFontScale", {
-        get: function () {
-            return this.style.iosAccessibilityMaxFontScale;
-        },
-        set: function (value) {
-            this.style.iosAccessibilityMaxFontScale = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "automationText", {
-        get: function () {
-            return this.accessibilityIdentifier;
-        },
-        set: function (value) {
-            this.accessibilityIdentifier = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "androidElevation", {
-        get: function () {
-            return this.style.androidElevation;
-        },
-        set: function (value) {
-            this.style.androidElevation = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "androidDynamicElevationOffset", {
-        get: function () {
-            return this.style.androidDynamicElevationOffset;
-        },
-        set: function (value) {
-            this.style.androidDynamicElevationOffset = value;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "isLayoutValid", {
-        get: function () {
-            return this._isLayoutValid;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "cssType", {
-        get: function () {
-            if (!this._cssType) {
-                this._cssType = this.typeName.toLowerCase();
-            }
-            return this._cssType;
-        },
-        set: function (type) {
-            this._cssType = type.toLowerCase();
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "isLayoutRequired", {
-        get: function () {
-            return true;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    Object.defineProperty(ViewCommon.prototype, "needsNativeDrawableFill", {
-        get: function () {
-            return false;
-        },
-        enumerable: false,
-        configurable: true
-    });
-    ViewCommon.prototype.measure = function (widthMeasureSpec, heightMeasureSpec) {
+    }
+    // START Style property shortcuts
+    get flexFlow() {
+        return this.style.flexFlow;
+    }
+    set flexFlow(value) {
+        this.style.flexFlow = value;
+    }
+    get flex() {
+        return this.style.flex;
+    }
+    set flex(value) {
+        this.style.flex = value;
+    }
+    get borderColor() {
+        return this.style.borderColor;
+    }
+    set borderColor(value) {
+        this.style.borderColor = value;
+    }
+    get borderTopColor() {
+        return this.style.borderTopColor;
+    }
+    set borderTopColor(value) {
+        this.style.borderTopColor = value;
+    }
+    get borderRightColor() {
+        return this.style.borderRightColor;
+    }
+    set borderRightColor(value) {
+        this.style.borderRightColor = value;
+    }
+    get borderBottomColor() {
+        return this.style.borderBottomColor;
+    }
+    set borderBottomColor(value) {
+        this.style.borderBottomColor = value;
+    }
+    get borderLeftColor() {
+        return this.style.borderLeftColor;
+    }
+    set borderLeftColor(value) {
+        this.style.borderLeftColor = value;
+    }
+    get borderWidth() {
+        return this.style.borderWidth;
+    }
+    set borderWidth(value) {
+        this.style.borderWidth = value;
+    }
+    get borderTopWidth() {
+        return this.style.borderTopWidth;
+    }
+    set borderTopWidth(value) {
+        this.style.borderTopWidth = value;
+    }
+    get borderRightWidth() {
+        return this.style.borderRightWidth;
+    }
+    set borderRightWidth(value) {
+        this.style.borderRightWidth = value;
+    }
+    get borderBottomWidth() {
+        return this.style.borderBottomWidth;
+    }
+    set borderBottomWidth(value) {
+        this.style.borderBottomWidth = value;
+    }
+    get borderLeftWidth() {
+        return this.style.borderLeftWidth;
+    }
+    set borderLeftWidth(value) {
+        this.style.borderLeftWidth = value;
+    }
+    get borderRadius() {
+        return this.style.borderRadius;
+    }
+    set borderRadius(value) {
+        this.style.borderRadius = value;
+    }
+    get borderTopLeftRadius() {
+        return this.style.borderTopLeftRadius;
+    }
+    set borderTopLeftRadius(value) {
+        this.style.borderTopLeftRadius = value;
+    }
+    get borderTopRightRadius() {
+        return this.style.borderTopRightRadius;
+    }
+    set borderTopRightRadius(value) {
+        this.style.borderTopRightRadius = value;
+    }
+    get borderBottomRightRadius() {
+        return this.style.borderBottomRightRadius;
+    }
+    set borderBottomRightRadius(value) {
+        this.style.borderBottomRightRadius = value;
+    }
+    get borderBottomLeftRadius() {
+        return this.style.borderBottomLeftRadius;
+    }
+    set borderBottomLeftRadius(value) {
+        this.style.borderBottomLeftRadius = value;
+    }
+    get color() {
+        return this.style.color;
+    }
+    set color(value) {
+        this.style.color = value;
+    }
+    get background() {
+        return this.style.background;
+    }
+    set background(value) {
+        this.style.background = value;
+    }
+    get backgroundColor() {
+        return this.style.backgroundColor;
+    }
+    set backgroundColor(value) {
+        this.style.backgroundColor = value;
+    }
+    get backgroundImage() {
+        return this.style.backgroundImage;
+    }
+    set backgroundImage(value) {
+        this.style.backgroundImage = value;
+    }
+    get backgroundSize() {
+        return this.style.backgroundSize;
+    }
+    set backgroundSize(value) {
+        this.style.backgroundSize = value;
+    }
+    get backgroundPosition() {
+        return this.style.backgroundPosition;
+    }
+    set backgroundPosition(value) {
+        this.style.backgroundPosition = value;
+    }
+    get backgroundRepeat() {
+        return this.style.backgroundRepeat;
+    }
+    set backgroundRepeat(value) {
+        this.style.backgroundRepeat = value;
+    }
+    get boxShadow() {
+        return this.style.boxShadow;
+    }
+    set boxShadow(value) {
+        this.style.boxShadow = value;
+    }
+    get minWidth() {
+        return this.style.minWidth;
+    }
+    set minWidth(value) {
+        this.style.minWidth = value;
+    }
+    get minHeight() {
+        return this.style.minHeight;
+    }
+    set minHeight(value) {
+        this.style.minHeight = value;
+    }
+    get width() {
+        return this.style.width;
+    }
+    set width(value) {
+        this.style.width = value;
+    }
+    get height() {
+        return this.style.height;
+    }
+    set height(value) {
+        this.style.height = value;
+    }
+    get margin() {
+        return this.style.margin;
+    }
+    set margin(value) {
+        this.style.margin = value;
+    }
+    get marginLeft() {
+        return this.style.marginLeft;
+    }
+    set marginLeft(value) {
+        this.style.marginLeft = value;
+    }
+    get marginTop() {
+        return this.style.marginTop;
+    }
+    set marginTop(value) {
+        this.style.marginTop = value;
+    }
+    get marginRight() {
+        return this.style.marginRight;
+    }
+    set marginRight(value) {
+        this.style.marginRight = value;
+    }
+    get marginBottom() {
+        return this.style.marginBottom;
+    }
+    set marginBottom(value) {
+        this.style.marginBottom = value;
+    }
+    get horizontalAlignment() {
+        return this.style.horizontalAlignment;
+    }
+    set horizontalAlignment(value) {
+        this.style.horizontalAlignment = value;
+    }
+    get verticalAlignment() {
+        return this.style.verticalAlignment;
+    }
+    set verticalAlignment(value) {
+        this.style.verticalAlignment = value;
+    }
+    get visibility() {
+        return this.style.visibility;
+    }
+    set visibility(value) {
+        this.style.visibility = value;
+    }
+    get opacity() {
+        return this.style.opacity;
+    }
+    set opacity(value) {
+        this.style.opacity = value;
+    }
+    get rotate() {
+        return this.style.rotate;
+    }
+    set rotate(value) {
+        this.style.rotate = value;
+    }
+    get rotateX() {
+        return this.style.rotateX;
+    }
+    set rotateX(value) {
+        this.style.rotateX = value;
+    }
+    get rotateY() {
+        return this.style.rotateY;
+    }
+    set rotateY(value) {
+        this.style.rotateY = value;
+    }
+    get perspective() {
+        return this.style.perspective;
+    }
+    set perspective(value) {
+        this.style.perspective = value;
+    }
+    get textTransform() {
+        return this.style.textTransform;
+    }
+    set textTransform(value) {
+        this.style.textTransform = value;
+    }
+    get translateX() {
+        return this.style.translateX;
+    }
+    set translateX(value) {
+        this.style.translateX = value;
+    }
+    get translateY() {
+        return this.style.translateY;
+    }
+    set translateY(value) {
+        this.style.translateY = value;
+    }
+    get scaleX() {
+        return this.style.scaleX;
+    }
+    set scaleX(value) {
+        this.style.scaleX = value;
+    }
+    get scaleY() {
+        return this.style.scaleY;
+    }
+    set scaleY(value) {
+        this.style.scaleY = value;
+    }
+    get accessible() {
+        return this.style.accessible;
+    }
+    set accessible(value) {
+        this.style.accessible = value;
+    }
+    get accessibilityHidden() {
+        return this.style.accessibilityHidden;
+    }
+    set accessibilityHidden(value) {
+        this.style.accessibilityHidden = value;
+    }
+    get accessibilityRole() {
+        return this.style.accessibilityRole;
+    }
+    set accessibilityRole(value) {
+        this.style.accessibilityRole = value;
+    }
+    get accessibilityState() {
+        return this.style.accessibilityState;
+    }
+    set accessibilityState(value) {
+        this.style.accessibilityState = value;
+    }
+    get accessibilityLiveRegion() {
+        return this.style.accessibilityLiveRegion;
+    }
+    set accessibilityLiveRegion(value) {
+        this.style.accessibilityLiveRegion = value;
+    }
+    get accessibilityLanguage() {
+        return this.style.accessibilityLanguage;
+    }
+    set accessibilityLanguage(value) {
+        this.style.accessibilityLanguage = value;
+    }
+    get accessibilityMediaSession() {
+        return this.style.accessibilityMediaSession;
+    }
+    set accessibilityMediaSession(value) {
+        this.style.accessibilityMediaSession = value;
+    }
+    get iosAccessibilityAdjustsFontSize() {
+        return this.style.iosAccessibilityAdjustsFontSize;
+    }
+    set iosAccessibilityAdjustsFontSize(value) {
+        this.style.iosAccessibilityAdjustsFontSize = value;
+    }
+    get iosAccessibilityMinFontScale() {
+        return this.style.iosAccessibilityMinFontScale;
+    }
+    set iosAccessibilityMinFontScale(value) {
+        this.style.iosAccessibilityMinFontScale = value;
+    }
+    get iosAccessibilityMaxFontScale() {
+        return this.style.iosAccessibilityMaxFontScale;
+    }
+    set iosAccessibilityMaxFontScale(value) {
+        this.style.iosAccessibilityMaxFontScale = value;
+    }
+    get automationText() {
+        return this.accessibilityIdentifier;
+    }
+    set automationText(value) {
+        this.accessibilityIdentifier = value;
+    }
+    get androidElevation() {
+        return this.style.androidElevation;
+    }
+    set androidElevation(value) {
+        this.style.androidElevation = value;
+    }
+    get androidDynamicElevationOffset() {
+        return this.style.androidDynamicElevationOffset;
+    }
+    set androidDynamicElevationOffset(value) {
+        this.style.androidDynamicElevationOffset = value;
+    }
+    get isLayoutValid() {
+        return this._isLayoutValid;
+    }
+    get cssType() {
+        if (!this._cssType) {
+            this._cssType = this.typeName.toLowerCase();
+        }
+        return this._cssType;
+    }
+    set cssType(type) {
+        this._cssType = type.toLowerCase();
+    }
+    get isLayoutRequired() {
+        return true;
+    }
+    get needsNativeDrawableFill() {
+        return false;
+    }
+    measure(widthMeasureSpec, heightMeasureSpec) {
         this._setCurrentMeasureSpecs(widthMeasureSpec, heightMeasureSpec);
-    };
-    ViewCommon.prototype.layout = function (left, top, right, bottom) {
+    }
+    layout(left, top, right, bottom) {
         this._setCurrentLayoutBounds(left, top, right, bottom);
-    };
-    ViewCommon.prototype.getMeasuredWidth = function () {
+    }
+    getMeasuredWidth() {
         return this._measuredWidth & layout.MEASURED_SIZE_MASK || 0;
-    };
-    ViewCommon.prototype.getMeasuredHeight = function () {
+    }
+    getMeasuredHeight() {
         return this._measuredHeight & layout.MEASURED_SIZE_MASK || 0;
-    };
-    ViewCommon.prototype.getMeasuredState = function () {
+    }
+    getMeasuredState() {
         return (this._measuredWidth & layout.MEASURED_STATE_MASK) | ((this._measuredHeight >> layout.MEASURED_HEIGHT_STATE_SHIFT) & (layout.MEASURED_STATE_MASK >> layout.MEASURED_HEIGHT_STATE_SHIFT));
-    };
-    ViewCommon.prototype.setMeasuredDimension = function (measuredWidth, measuredHeight) {
+    }
+    setMeasuredDimension(measuredWidth, measuredHeight) {
         this._measuredWidth = measuredWidth;
         this._measuredHeight = measuredHeight;
         if (Trace.isEnabled()) {
             Trace.write(this + ' :setMeasuredDimension: ' + measuredWidth + ', ' + measuredHeight, Trace.categories.Layout);
         }
-    };
-    ViewCommon.prototype.requestLayout = function () {
+    }
+    requestLayout() {
         this._isLayoutValid = false;
-        _super.prototype.requestLayout.call(this);
-    };
-    ViewCommon.resolveSizeAndState = function (size, specSize, specMode, childMeasuredState) {
+        super.requestLayout();
+    }
+    static resolveSizeAndState(size, specSize, specMode, childMeasuredState) {
         return ViewHelper.resolveSizeAndState(size, specSize, specMode, childMeasuredState);
-    };
-    ViewCommon.combineMeasuredStates = function (curState, newState) {
+    }
+    static combineMeasuredStates(curState, newState) {
         return ViewHelper.combineMeasuredStates(curState, newState);
-    };
-    ViewCommon.layoutChild = function (parent, child, left, top, right, bottom, setFrame) {
-        if (setFrame === void 0) { setFrame = true; }
+    }
+    static layoutChild(parent, child, left, top, right, bottom, setFrame = true) {
         ViewHelper.layoutChild(parent, child, left, top, right, bottom);
-    };
-    ViewCommon.measureChild = function (parent, child, widthMeasureSpec, heightMeasureSpec) {
+    }
+    static measureChild(parent, child, widthMeasureSpec, heightMeasureSpec) {
         return ViewHelper.measureChild(parent, child, widthMeasureSpec, heightMeasureSpec);
-    };
-    ViewCommon.prototype._setCurrentMeasureSpecs = function (widthMeasureSpec, heightMeasureSpec) {
-        var changed = this._currentWidthMeasureSpec !== widthMeasureSpec || this._currentHeightMeasureSpec !== heightMeasureSpec;
+    }
+    _setCurrentMeasureSpecs(widthMeasureSpec, heightMeasureSpec) {
+        const changed = this._currentWidthMeasureSpec !== widthMeasureSpec || this._currentHeightMeasureSpec !== heightMeasureSpec;
         this._currentWidthMeasureSpec = widthMeasureSpec;
         this._currentHeightMeasureSpec = heightMeasureSpec;
         return changed;
-    };
-    ViewCommon.prototype._getCurrentLayoutBounds = function () {
+    }
+    _getCurrentLayoutBounds() {
         return { left: 0, top: 0, right: 0, bottom: 0 };
-    };
+    }
     /**
      * Returns two booleans - the first if "boundsChanged" the second is "sizeChanged".
      */
-    ViewCommon.prototype._setCurrentLayoutBounds = function (left, top, right, bottom) {
+    _setCurrentLayoutBounds(left, top, right, bottom) {
         this._isLayoutValid = true;
-        var boundsChanged = this._oldLeft !== left || this._oldTop !== top || this._oldRight !== right || this._oldBottom !== bottom;
-        var sizeChanged = this._oldRight - this._oldLeft !== right - left || this._oldBottom - this._oldTop !== bottom - top;
+        const boundsChanged = this._oldLeft !== left || this._oldTop !== top || this._oldRight !== right || this._oldBottom !== bottom;
+        const sizeChanged = this._oldRight - this._oldLeft !== right - left || this._oldBottom - this._oldTop !== bottom - top;
         this._oldLeft = left;
         this._oldTop = top;
         this._oldRight = right;
         this._oldBottom = bottom;
-        return { boundsChanged: boundsChanged, sizeChanged: sizeChanged };
-    };
-    ViewCommon.prototype.eachChild = function (callback) {
+        return { boundsChanged, sizeChanged };
+    }
+    eachChild(callback) {
         this.eachChildView(callback);
-    };
-    ViewCommon.prototype.eachChildView = function (callback) {
+    }
+    eachChildView(callback) {
         //
-    };
-    ViewCommon.prototype._getNativeViewsCount = function () {
+    }
+    _getNativeViewsCount() {
         return this._isAddedToNativeVisualTree ? 1 : 0;
-    };
-    ViewCommon.prototype._eachLayoutView = function (callback) {
+    }
+    _eachLayoutView(callback) {
         return callback(this);
-    };
-    ViewCommon.prototype.focus = function () {
+    }
+    focus() {
         return undefined;
-    };
-    ViewCommon.prototype.getSafeAreaInsets = function () {
+    }
+    getSafeAreaInsets() {
         return { left: 0, top: 0, right: 0, bottom: 0 };
-    };
-    ViewCommon.prototype.getLocationInWindow = function () {
+    }
+    getLocationInWindow() {
         return undefined;
-    };
-    ViewCommon.prototype.getLocationOnScreen = function () {
+    }
+    getLocationOnScreen() {
         return undefined;
-    };
-    ViewCommon.prototype.getLocationRelativeTo = function (otherView) {
+    }
+    getLocationRelativeTo(otherView) {
         return undefined;
-    };
-    ViewCommon.prototype.getActualSize = function () {
-        var currentBounds = this._getCurrentLayoutBounds();
+    }
+    getActualSize() {
+        const currentBounds = this._getCurrentLayoutBounds();
         if (!currentBounds) {
             return undefined;
         }
@@ -1162,22 +876,22 @@ var ViewCommon = /** @class */ (function (_super) {
             width: layout.toDeviceIndependentPixels(currentBounds.right - currentBounds.left),
             height: layout.toDeviceIndependentPixels(currentBounds.bottom - currentBounds.top),
         };
-    };
-    ViewCommon.prototype.animate = function (animation) {
+    }
+    animate(animation) {
         return this.createAnimation(animation).play();
-    };
-    ViewCommon.prototype.createAnimation = function (animation) {
+    }
+    createAnimation(animation) {
         ensureAnimationModule();
         if (!this._localAnimations) {
             this._localAnimations = new Set();
         }
         animation.target = this;
-        var anim = new animationModule.Animation([animation]);
+        const anim = new animationModule.Animation([animation]);
         this._localAnimations.add(anim);
         return anim;
-    };
-    ViewCommon.prototype._removeAnimation = function (animation) {
-        var localAnimations = this._localAnimations;
+    }
+    _removeAnimation(animation) {
+        const localAnimations = this._localAnimations;
         if (localAnimations && localAnimations.has(animation)) {
             localAnimations.delete(animation);
             if (animation.isPlaying) {
@@ -1186,98 +900,95 @@ var ViewCommon = /** @class */ (function (_super) {
             return true;
         }
         return false;
-    };
-    ViewCommon.prototype.resetNativeView = function () {
-        var _this = this;
+    }
+    resetNativeView() {
         if (this._localAnimations) {
-            this._localAnimations.forEach(function (a) { return _this._removeAnimation(a); });
+            this._localAnimations.forEach((a) => this._removeAnimation(a));
         }
-        _super.prototype.resetNativeView.call(this);
-    };
-    ViewCommon.prototype._setNativeViewFrame = function (nativeView, frame) {
+        super.resetNativeView();
+    }
+    _setNativeViewFrame(nativeView, frame) {
         //
-    };
-    ViewCommon.prototype._getValue = function () {
+    }
+    _getValue() {
         throw new Error('The View._getValue is obsolete. There is a new property system.');
-    };
-    ViewCommon.prototype._setValue = function () {
+    }
+    _setValue() {
         throw new Error('The View._setValue is obsolete. There is a new property system.');
-    };
-    ViewCommon.prototype._updateEffectiveLayoutValues = function (parentWidthMeasureSize, parentWidthMeasureMode, parentHeightMeasureSize, parentHeightMeasureMode) {
-        var style = this.style;
-        var availableWidth = parentWidthMeasureMode === layout.UNSPECIFIED ? -1 : parentWidthMeasureSize;
+    }
+    _updateEffectiveLayoutValues(parentWidthMeasureSize, parentWidthMeasureMode, parentHeightMeasureSize, parentHeightMeasureMode) {
+        const style = this.style;
+        const availableWidth = parentWidthMeasureMode === layout.UNSPECIFIED ? -1 : parentWidthMeasureSize;
         this.effectiveWidth = PercentLength.toDevicePixels(style.width, -2, availableWidth);
         this.effectiveMarginLeft = PercentLength.toDevicePixels(style.marginLeft, 0, availableWidth);
         this.effectiveMarginRight = PercentLength.toDevicePixels(style.marginRight, 0, availableWidth);
-        var availableHeight = parentHeightMeasureMode === layout.UNSPECIFIED ? -1 : parentHeightMeasureSize;
+        const availableHeight = parentHeightMeasureMode === layout.UNSPECIFIED ? -1 : parentHeightMeasureSize;
         this.effectiveHeight = PercentLength.toDevicePixels(style.height, -2, availableHeight);
         this.effectiveMarginTop = PercentLength.toDevicePixels(style.marginTop, 0, availableHeight);
         this.effectiveMarginBottom = PercentLength.toDevicePixels(style.marginBottom, 0, availableHeight);
-    };
-    ViewCommon.prototype._setNativeClipToBounds = function () {
+    }
+    _setNativeClipToBounds() {
         //
-    };
-    ViewCommon.prototype._redrawNativeBackground = function (value) {
+    }
+    _redrawNativeBackground(value) {
         //
-    };
-    ViewCommon.prototype._applyBackground = function (background, isBorderDrawable, onlyColor, backgroundDrawable) {
+    }
+    _applyBackground(background, isBorderDrawable, onlyColor, backgroundDrawable) {
         //
-    };
-    ViewCommon.prototype._onAttachedToWindow = function () {
+    }
+    _onAttachedToWindow() {
         //
-    };
-    ViewCommon.prototype._onDetachedFromWindow = function () {
+    }
+    _onDetachedFromWindow() {
         //
-    };
-    ViewCommon.prototype._hasAncestorView = function (ancestorView) {
-        var matcher = function (view) { return view === ancestorView; };
-        for (var parent_2 = this.parent; parent_2 != null; parent_2 = parent_2.parent) {
-            if (matcher(parent_2)) {
+    }
+    _hasAncestorView(ancestorView) {
+        const matcher = (view) => view === ancestorView;
+        for (let parent = this.parent; parent != null; parent = parent.parent) {
+            if (matcher(parent)) {
                 return true;
             }
         }
         return false;
-    };
-    ViewCommon.prototype.sendAccessibilityEvent = function (options) {
+    }
+    sendAccessibilityEvent(options) {
         return;
-    };
-    ViewCommon.prototype.accessibilityAnnouncement = function (msg) {
+    }
+    accessibilityAnnouncement(msg) {
         return;
-    };
-    ViewCommon.prototype.accessibilityScreenChanged = function () {
+    }
+    accessibilityScreenChanged() {
         return;
-    };
-    ViewCommon.prototype.setAccessibilityIdentifier = function (view, value) {
+    }
+    setAccessibilityIdentifier(view, value) {
         return;
-    };
-    ViewCommon.layoutChangedEvent = 'layoutChanged';
-    ViewCommon.shownModallyEvent = 'shownModally';
-    ViewCommon.showingModallyEvent = 'showingModally';
-    ViewCommon.accessibilityBlurEvent = accessibilityBlurEvent;
-    ViewCommon.accessibilityFocusEvent = accessibilityFocusEvent;
-    ViewCommon.accessibilityFocusChangedEvent = accessibilityFocusChangedEvent;
-    ViewCommon.accessibilityPerformEscapeEvent = accessibilityPerformEscapeEvent;
-    return ViewCommon;
-}(ViewBase));
-export { ViewCommon };
-export var originXProperty = new Property({
+    }
+}
+ViewCommon.layoutChangedEvent = 'layoutChanged';
+ViewCommon.shownModallyEvent = 'shownModally';
+ViewCommon.showingModallyEvent = 'showingModally';
+ViewCommon.accessibilityBlurEvent = accessibilityBlurEvent;
+ViewCommon.accessibilityFocusEvent = accessibilityFocusEvent;
+ViewCommon.accessibilityFocusChangedEvent = accessibilityFocusChangedEvent;
+ViewCommon.accessibilityPerformEscapeEvent = accessibilityPerformEscapeEvent;
+export const originXProperty = new Property({
     name: 'originX',
     defaultValue: 0.5,
-    valueConverter: function (v) { return parseFloat(v); },
+    valueConverter: (v) => parseFloat(v),
 });
 originXProperty.register(ViewCommon);
-export var originYProperty = new Property({
+export const originYProperty = new Property({
     name: 'originY',
     defaultValue: 0.5,
-    valueConverter: function (v) { return parseFloat(v); },
+    valueConverter: (v) => parseFloat(v),
 });
 originYProperty.register(ViewCommon);
-export var isEnabledProperty = new Property({
+export const isEnabledProperty = new Property({
     name: 'isEnabled',
     defaultValue: true,
     valueConverter: booleanConverter,
-    valueChanged: function (target, oldValue, newValue) {
-        var state = 'disabled';
+    valueChanged(target, oldValue, newValue) {
+        const state = 'disabled';
         if (newValue) {
             target._removeVisualState(state);
         }
@@ -1287,51 +998,51 @@ export var isEnabledProperty = new Property({
     },
 });
 isEnabledProperty.register(ViewCommon);
-export var isUserInteractionEnabledProperty = new Property({
+export const isUserInteractionEnabledProperty = new Property({
     name: 'isUserInteractionEnabled',
     defaultValue: true,
     valueConverter: booleanConverter,
 });
 isUserInteractionEnabledProperty.register(ViewCommon);
-export var iosOverflowSafeAreaProperty = new Property({
+export const iosOverflowSafeAreaProperty = new Property({
     name: 'iosOverflowSafeArea',
     defaultValue: false,
     valueConverter: booleanConverter,
 });
 iosOverflowSafeAreaProperty.register(ViewCommon);
-export var iosOverflowSafeAreaEnabledProperty = new InheritedProperty({
+export const iosOverflowSafeAreaEnabledProperty = new InheritedProperty({
     name: 'iosOverflowSafeAreaEnabled',
     defaultValue: true,
     valueConverter: booleanConverter,
 });
 iosOverflowSafeAreaEnabledProperty.register(ViewCommon);
-export var iosIgnoreSafeAreaProperty = new InheritedProperty({
+export const iosIgnoreSafeAreaProperty = new InheritedProperty({
     name: 'iosIgnoreSafeArea',
     defaultValue: false,
     valueConverter: booleanConverter,
 });
 iosIgnoreSafeAreaProperty.register(ViewCommon);
-export var visionHoverStyleProperty = new Property({
+export const visionHoverStyleProperty = new Property({
     name: 'visionHoverStyle',
-    valueChanged: function (view, oldValue, newValue) {
+    valueChanged(view, oldValue, newValue) {
         view.visionHoverStyle = newValue;
     },
 });
 visionHoverStyleProperty.register(ViewCommon);
-var visionIgnoreHoverStyleProperty = new Property({
+const visionIgnoreHoverStyleProperty = new Property({
     name: 'visionIgnoreHoverStyle',
-    valueChanged: function (view, oldValue, newValue) {
+    valueChanged(view, oldValue, newValue) {
         view.visionIgnoreHoverStyle = newValue;
     },
     valueConverter: booleanConverter,
 });
 visionIgnoreHoverStyleProperty.register(ViewCommon);
-var touchAnimationProperty = new Property({
+const touchAnimationProperty = new Property({
     name: 'touchAnimation',
-    valueChanged: function (view, oldValue, newValue) {
+    valueChanged(view, oldValue, newValue) {
         view.touchAnimation = newValue;
     },
-    valueConverter: function (value) {
+    valueConverter(value) {
         if (isObject(value)) {
             return value;
         }
@@ -1341,23 +1052,23 @@ var touchAnimationProperty = new Property({
     },
 });
 touchAnimationProperty.register(ViewCommon);
-var ignoreTouchAnimationProperty = new Property({
+const ignoreTouchAnimationProperty = new Property({
     name: 'ignoreTouchAnimation',
-    valueChanged: function (view, oldValue, newValue) {
+    valueChanged(view, oldValue, newValue) {
         view.ignoreTouchAnimation = newValue;
     },
     valueConverter: booleanConverter,
 });
 ignoreTouchAnimationProperty.register(ViewCommon);
-var touchDelayProperty = new Property({
+const touchDelayProperty = new Property({
     name: 'touchDelay',
-    valueChanged: function (view, oldValue, newValue) {
+    valueChanged(view, oldValue, newValue) {
         view.touchDelay = newValue;
     },
-    valueConverter: function (v) { return parseFloat(v); },
+    valueConverter: (v) => parseFloat(v),
 });
 touchDelayProperty.register(ViewCommon);
-export var testIDProperty = new Property({
+export const testIDProperty = new Property({
     name: 'testID',
 });
 testIDProperty.register(ViewCommon);