@nativescript/core 8.9.0-alpha.3 → 8.9.0-napi-es5.0

package/ui/action-bar/index.ios.js

@@ -1,22 +1,25 @@
 import { ActionItemBase, ActionBarBase, isVisible, flatProperty, iosIconRenderingModeProperty, traceMissingIcon } from './action-bar-common';
 import { View } from '../core/view';
 import { Color } from '../../color';
-import { colorProperty, backgroundColorProperty, backgroundInternalProperty } from '../styling/style-properties';
+import { ios as iosBackground } from '../styling/background';
+import { LinearGradient } from '../styling/linear-gradient';
+import { colorProperty, backgroundInternalProperty, backgroundColorProperty, backgroundImageProperty } from '../styling/style-properties';
+import { ios as iosViewUtils } from '../utils';
 import { ImageSource } from '../../image-source';
 import { layout, iOSNativeHelper, isFontIconURI } from '../../utils';
 import { accessibilityHintProperty, accessibilityLabelProperty, accessibilityLanguageProperty, accessibilityValueProperty } from '../../accessibility/accessibility-properties';
 export * from './action-bar-common';
-const majorVersion = iOSNativeHelper.MajorVersion;
-const UNSPECIFIED = layout.makeMeasureSpec(0, layout.UNSPECIFIED);
+var majorVersion = iOSNativeHelper.MajorVersion;
+var UNSPECIFIED = layout.makeMeasureSpec(0, layout.UNSPECIFIED);
 function loadActionIcon(item) {
-    let is = null;
-    let img = null;
-    const itemIcon = item.icon;
-    const itemStyle = item.style;
+    var is = null;
+    var img = null;
+    var itemIcon = item.icon;
+    var itemStyle = item.style;
     if (isFontIconURI(itemIcon)) {
-        const fontIconCode = itemIcon.split('//')[1];
-        const font = itemStyle.fontInternal;
-        const color = itemStyle.color;
+        var fontIconCode = itemIcon.split('//')[1];
+        var font = itemStyle.fontInternal;
+        var color = itemStyle.color;
         is = ImageSource.fromFontIconCodeSync(fontIconCode, font, color);
     }
     else {
@@ -52,104 +55,139 @@ var TapBarItemHandlerImpl = /** @class */ (function (_super) {
     };
     return TapBarItemHandlerImpl;
 }(NSObject));
-export class ActionItem extends ActionItemBase {
-    constructor() {
-        super(...arguments);
-        this._ios = {
+var ActionItem = /** @class */ (function (_super) {
+    __extends(ActionItem, _super);
+    function ActionItem() {
+        var _this = _super !== null && _super.apply(this, arguments) || this;
+        _this._ios = {
             position: 'left',
             systemIcon: undefined,
         };
+        return _this;
+    }
+    Object.defineProperty(ActionItem.prototype, "ios", {
+        // @ts-ignore
+        get: function () {
+            return this._ios;
+        },
+        set: function (value) {
+            throw new Error('ActionItem.ios is read-only');
+        },
+        enumerable: false,
+        configurable: true
+    });
+    return ActionItem;
+}(ActionItemBase));
+export { ActionItem };
+var NavigationButton = /** @class */ (function (_super) {
+    __extends(NavigationButton, _super);
+    function NavigationButton() {
+        return _super !== null && _super.apply(this, arguments) || this;
     }
-    // @ts-ignore
-    get ios() {
-        return this._ios;
-    }
-    set ios(value) {
-        throw new Error('ActionItem.ios is read-only');
-    }
-}
-export class NavigationButton extends ActionItem {
-    _onVisibilityChanged(visibility) {
+    NavigationButton.prototype._onVisibilityChanged = function (visibility) {
         if (this._navigationItem) {
-            const visible = visibility === 'visible';
+            var visible = visibility === 'visible';
             this._navigationItem.setHidesBackButtonAnimated(!visible, true);
         }
+    };
+    return NavigationButton;
+}(ActionItem));
+export { NavigationButton };
+var ActionBar = /** @class */ (function (_super) {
+    __extends(ActionBar, _super);
+    function ActionBar() {
+        return _super !== null && _super.apply(this, arguments) || this;
     }
-}
-export class ActionBar extends ActionBarBase {
-    get ios() {
-        const page = this.page;
-        if (!page || !page.parent) {
-            return;
-        }
-        const viewController = page.ios;
-        return viewController?.navigationController?.navigationBar;
-    }
-    [accessibilityValueProperty.setNative](value) {
-        value = value == null ? null : `${value}`;
+    Object.defineProperty(ActionBar.prototype, "ios", {
+        get: function () {
+            var _a;
+            var page = this.page;
+            if (!page || !page.parent) {
+                return;
+            }
+            var viewController = page.ios;
+            return (_a = viewController === null || viewController === void 0 ? void 0 : viewController.navigationController) === null || _a === void 0 ? void 0 : _a.navigationBar;
+        },
+        enumerable: false,
+        configurable: true
+    });
+    ActionBar.prototype[accessibilityValueProperty.setNative] = function (value) {
+        value = value == null ? null : "".concat(value);
         this.nativeViewProtected.accessibilityValue = value;
-        const navigationItem = this._getNavigationItem();
+        var navigationItem = this._getNavigationItem();
         if (navigationItem) {
             navigationItem.accessibilityValue = value;
         }
-    }
-    [accessibilityLabelProperty.setNative](value) {
-        value = value == null ? null : `${value}`;
+    };
+    ActionBar.prototype[accessibilityLabelProperty.setNative] = function (value) {
+        value = value == null ? null : "".concat(value);
         this.nativeViewProtected.accessibilityLabel = value;
-        const navigationItem = this._getNavigationItem();
+        var navigationItem = this._getNavigationItem();
         if (navigationItem) {
             navigationItem.accessibilityLabel = value;
         }
-    }
-    [accessibilityHintProperty.setNative](value) {
-        value = value == null ? null : `${value}`;
+    };
+    ActionBar.prototype[accessibilityHintProperty.setNative] = function (value) {
+        value = value == null ? null : "".concat(value);
         this.nativeViewProtected.accessibilityHint = value;
-        const navigationItem = this._getNavigationItem();
+        var navigationItem = this._getNavigationItem();
         if (navigationItem) {
             navigationItem.accessibilityHint = value;
         }
-    }
-    [accessibilityLanguageProperty.setNative](value) {
-        value = value == null ? null : `${value}`;
+    };
+    ActionBar.prototype[accessibilityLanguageProperty.setNative] = function (value) {
+        value = value == null ? null : "".concat(value);
         this.nativeViewProtected.accessibilityLanguage = value;
-        const navigationItem = this._getNavigationItem();
+        var navigationItem = this._getNavigationItem();
         if (navigationItem) {
             navigationItem.accessibilityLanguage = value;
         }
-    }
-    createNativeView() {
+    };
+    ActionBar.prototype.createNativeView = function () {
         return this.ios;
-    }
-    _addChildFromBuilder(name, value) {
+    };
+    ActionBar.prototype.disposeNativeView = function () {
+        var navBar = this.navBar;
+        if (navBar === null || navBar === void 0 ? void 0 : navBar.gradientLayer) {
+            navBar.gradientLayer = null;
+        }
+        _super.prototype.disposeNativeView.call(this);
+    };
+    ActionBar.prototype._addChildFromBuilder = function (name, value) {
+        var _a;
         if (value instanceof NavigationButton) {
             this.navigationButton = value;
         }
         else if (value instanceof ActionItem) {
-            this.actionItems?.addItem(value);
+            (_a = this.actionItems) === null || _a === void 0 ? void 0 : _a.addItem(value);
         }
         else if (value instanceof View) {
             this.titleView = value;
         }
-    }
-    get _getActualSize() {
-        const navBar = this.ios;
-        if (!navBar) {
-            return { width: 0, height: 0 };
-        }
-        const frame = navBar.frame;
-        const size = frame.size;
-        const width = layout.toDevicePixels(size.width);
-        const height = layout.toDevicePixels(size.height);
-        return { width, height };
-    }
-    layoutInternal() {
-        const { width, height } = this._getActualSize;
-        const widthSpec = layout.makeMeasureSpec(width, layout.EXACTLY);
-        const heightSpec = layout.makeMeasureSpec(height, layout.EXACTLY);
+    };
+    Object.defineProperty(ActionBar.prototype, "_getActualSize", {
+        get: function () {
+            var nativeView = this.ios;
+            if (!nativeView) {
+                return { width: 0, height: 0 };
+            }
+            var frame = nativeView.frame;
+            var size = frame.size;
+            var width = layout.toDevicePixels(size.width);
+            var height = layout.toDevicePixels(size.height);
+            return { width: width, height: height };
+        },
+        enumerable: false,
+        configurable: true
+    });
+    ActionBar.prototype.layoutInternal = function () {
+        var _a = this._getActualSize, width = _a.width, height = _a.height;
+        var widthSpec = layout.makeMeasureSpec(width, layout.EXACTLY);
+        var heightSpec = layout.makeMeasureSpec(height, layout.EXACTLY);
         this.measure(widthSpec, heightSpec);
         this.layout(0, 0, width, height, false);
-    }
-    _getIconRenderingMode() {
+    };
+    ActionBar.prototype._getIconRenderingMode = function () {
         switch (this.iosIconRenderingMode) {
             case 'alwaysOriginal':
                 return 1 /* UIImageRenderingMode.AlwaysOriginal */;
@@ -159,37 +197,37 @@ export class ActionBar extends ActionBarBase {
             default:
                 return 1 /* UIImageRenderingMode.AlwaysOriginal */;
         }
-    }
-    _getNavigationItem() {
-        const page = this.page;
+    };
+    ActionBar.prototype._getNavigationItem = function () {
+        var page = this.page;
         // Page should be attached to frame to update the action bar.
         if (!page || !page.frame) {
             return null;
         }
-        const viewController = page.ios;
+        var viewController = page.ios;
         return viewController.navigationItem;
-    }
-    update() {
-        const page = this.page;
+    };
+    ActionBar.prototype.update = function () {
+        var page = this.page;
         // Page should be attached to frame to update the action bar.
         if (!page || !page.frame) {
             return;
         }
-        const viewController = page.ios;
+        var viewController = page.ios;
         // visionOS may init with different nav stack setup
         if (!viewController) {
             return;
         }
-        const navigationItem = viewController.navigationItem;
-        const navController = viewController.navigationController;
+        var navigationItem = viewController.navigationItem;
+        var navController = viewController.navigationController;
         if (!navController) {
             return;
         }
-        const navigationBar = navController.navigationBar;
-        let previousController;
+        var navigationBar = navController.navigationBar;
+        var previousController;
         // Set Title
         navigationItem.title = this.title;
-        const titleView = this.titleView;
+        var titleView = this.titleView;
         if (titleView && titleView.ios) {
             navigationItem.titleView = titleView.ios;
         }
@@ -197,15 +235,15 @@ export class ActionBar extends ActionBarBase {
             navigationItem.titleView = null;
         }
         // Find previous ViewController in the navigation stack
-        const indexOfViewController = navController.viewControllers.indexOfObject(viewController);
+        var indexOfViewController = navController.viewControllers.indexOfObject(viewController);
         if (indexOfViewController > 0 && indexOfViewController < navController.viewControllers.count) {
             previousController = navController.viewControllers[indexOfViewController - 1];
         }
         // Set back button text
         if (previousController) {
             if (this.navigationButton) {
-                const tapHandler = TapBarItemHandlerImpl.initWithOwner(new WeakRef(this.navigationButton));
-                const barButtonItem = UIBarButtonItem.alloc().initWithTitleStyleTargetAction(this.navigationButton.text + '', 0 /* UIBarButtonItemStyle.Plain */, tapHandler, 'tap');
+                var tapHandler = TapBarItemHandlerImpl.initWithOwner(new WeakRef(this.navigationButton));
+                var barButtonItem = UIBarButtonItem.alloc().initWithTitleStyleTargetAction(this.navigationButton.text + '', 0 /* UIBarButtonItemStyle.Plain */, tapHandler, 'tap');
                 previousController.navigationItem.backBarButtonItem = barButtonItem;
             }
             else {
@@ -213,16 +251,16 @@ export class ActionBar extends ActionBarBase {
             }
         }
         // Set back button image
-        let img;
+        var img;
         if (this.navigationButton && isVisible(this.navigationButton) && this.navigationButton.icon) {
             img = loadActionIcon(this.navigationButton);
         }
         // TODO: This could cause issue when canceling BackEdge gesture - we will change the backIndicator to
         // show the one from the old page but the new page will still be visible (because we canceled EdgeBackSwipe gesutre)
         // Consider moving this to new method and call it from - navigationControllerDidShowViewControllerAnimated.
-        const image = img ? img.imageWithRenderingMode(1 /* UIImageRenderingMode.AlwaysOriginal */) : null;
+        var image = img ? img.imageWithRenderingMode(1 /* UIImageRenderingMode.AlwaysOriginal */) : null;
         if (majorVersion >= 15) {
-            const appearance = this._getAppearance(navigationBar);
+            var appearance = this._getAppearance(navigationBar);
             appearance.setBackIndicatorImageTransitionMaskImage(image, image);
             this._updateAppearance(navigationBar, appearance);
         }
@@ -238,7 +276,7 @@ export class ActionBar extends ActionBarBase {
         // Populate action items
         this.populateMenuItems(navigationItem);
         // update colors explicitly - they may have to be cleared form a previous page
-        this.updateColors(navigationBar);
+        this.updateFills(navigationBar);
         // the 'flat' property may have changed in between pages
         this.updateFlatness(navigationBar);
         if (!this.isLayoutValid) {
@@ -249,13 +287,14 @@ export class ActionBar extends ActionBarBase {
         navigationItem.accessibilityLabel = this.accessibilityLabel;
         navigationItem.accessibilityLanguage = this.accessibilityLanguage;
         navigationItem.accessibilityHint = this.accessibilityHint;
-    }
-    populateMenuItems(navigationItem) {
-        const items = this.actionItems?.getVisibleItems() ?? [];
-        const leftBarItems = NSMutableArray.new();
-        const rightBarItems = NSMutableArray.new();
-        for (let i = 0; i < items.length; i++) {
-            const barButtonItem = this.createBarButtonItem(items[i]);
+    };
+    ActionBar.prototype.populateMenuItems = function (navigationItem) {
+        var _a, _b;
+        var items = (_b = (_a = this.actionItems) === null || _a === void 0 ? void 0 : _a.getVisibleItems()) !== null && _b !== void 0 ? _b : [];
+        var leftBarItems = NSMutableArray.new();
+        var rightBarItems = NSMutableArray.new();
+        for (var i = 0; i < items.length; i++) {
+            var barButtonItem = this.createBarButtonItem(items[i]);
             if (items[i].ios.position === 'left') {
                 leftBarItems.addObject(barButtonItem);
             }
@@ -268,28 +307,28 @@ export class ActionBar extends ActionBarBase {
         if (leftBarItems.count > 0) {
             navigationItem.leftItemsSupplementBackButton = true;
         }
-    }
-    createBarButtonItem(item) {
-        const tapHandler = TapBarItemHandlerImpl.initWithOwner(new WeakRef(item));
+    };
+    ActionBar.prototype.createBarButtonItem = function (item) {
+        var tapHandler = TapBarItemHandlerImpl.initWithOwner(new WeakRef(item));
         // associate handler with menuItem or it will get collected by JSC.
         item.handler = tapHandler;
-        let barButtonItem;
+        var barButtonItem;
         if (item.actionView && item.actionView.ios) {
-            const recognizer = UITapGestureRecognizer.alloc().initWithTargetAction(tapHandler, 'tap');
+            var recognizer = UITapGestureRecognizer.alloc().initWithTargetAction(tapHandler, 'tap');
             item.actionView.ios.addGestureRecognizer(recognizer);
             barButtonItem = UIBarButtonItem.alloc().initWithCustomView(item.actionView.ios);
         }
         else if (item.ios.systemIcon !== undefined) {
-            let id = item.ios.systemIcon;
+            var id = item.ios.systemIcon;
             if (typeof id === 'string') {
                 id = parseInt(id);
             }
             barButtonItem = UIBarButtonItem.alloc().initWithBarButtonSystemItemTargetAction(id, tapHandler, 'tap');
         }
         else if (item.icon) {
-            const img = loadActionIcon(item);
+            var img = loadActionIcon(item);
             if (img) {
-                const image = img.imageWithRenderingMode(this._getIconRenderingMode());
+                var image = img.imageWithRenderingMode(this._getIconRenderingMode());
                 barButtonItem = UIBarButtonItem.alloc().initWithImageStyleTargetAction(image, 0 /* UIBarButtonItemStyle.Plain */, tapHandler, 'tap');
             }
         }
@@ -302,21 +341,24 @@ export class ActionBar extends ActionBarBase {
             barButtonItem.accessibilityTraits = UIAccessibilityTraitButton;
         }
         return barButtonItem;
-    }
-    updateColors(navBar) {
-        const color = this.color;
+    };
+    ActionBar.prototype.updateFills = function (navBar) {
+        var _this = this;
+        var color = this.color;
         this.setColor(navBar, color);
-        const bgColor = this.backgroundColor;
-        this.setBackgroundColor(navBar, bgColor);
-    }
-    setColor(navBar, color) {
+        this._setBackgroundColor(navBar, this.style.backgroundColor);
+        this._createBackgroundUIImage(navBar, this.style.backgroundImage, function (image) {
+            _this._setBackgroundImage(navBar, image);
+        });
+    };
+    ActionBar.prototype.setColor = function (navBar, color) {
         if (!navBar) {
             return;
         }
         if (color) {
-            const titleTextColor = NSDictionary.dictionaryWithObjectForKey(color.ios, NSForegroundColorAttributeName);
+            var titleTextColor = NSDictionary.dictionaryWithObjectForKey(color.ios, NSForegroundColorAttributeName);
             if (majorVersion >= 15) {
-                const appearance = this._getAppearance(navBar);
+                var appearance = this._getAppearance(navBar);
                 appearance.titleTextAttributes = titleTextColor;
             }
             navBar.titleTextAttributes = titleTextColor;
@@ -328,43 +370,123 @@ export class ActionBar extends ActionBarBase {
             navBar.largeTitleTextAttributes = null;
             navBar.tintColor = null;
         }
-    }
-    setBackgroundColor(navBar, color) {
+    };
+    ActionBar.prototype._setBackgroundColor = function (navBar, color) {
         if (!navBar) {
             return;
         }
-        const color_ = color instanceof Color ? color.ios : color;
+        var nativeColor = color instanceof Color ? color.ios : color;
         if (__VISIONOS__ || majorVersion >= 15) {
-            const appearance = this._getAppearance(navBar);
+            var appearance = this._getAppearance(navBar);
             // appearance.configureWithOpaqueBackground();
-            appearance.backgroundColor = color_;
+            appearance.backgroundColor = nativeColor;
             this._updateAppearance(navBar, appearance);
         }
         else {
             // legacy styling
-            navBar.barTintColor = color_;
+            navBar.barTintColor = nativeColor;
         }
-    }
-    _onTitlePropertyChanged() {
-        const page = this.page;
+    };
+    ActionBar.prototype._getBackgroundColor = function (navBar) {
+        if (!navBar) {
+            return null;
+        }
+        var color;
+        if (__VISIONOS__ || majorVersion >= 15) {
+            var appearance = this._getAppearance(navBar);
+            color = appearance.backgroundColor;
+        }
+        else {
+            // legacy styling
+            color = navBar.barTintColor;
+        }
+        return color;
+    };
+    ActionBar.prototype._setBackgroundImage = function (navBar, image) {
+        if (!navBar) {
+            return;
+        }
+        if (__VISIONOS__ || majorVersion >= 15) {
+            var appearance = this._getAppearance(navBar);
+            // appearance.configureWithOpaqueBackground();
+            appearance.backgroundImage = image;
+            this._updateAppearance(navBar, appearance);
+        }
+        else {
+            // legacy styling
+            // Set a blank image in case image is null and flatness is enabled
+            if (this.flat && !image) {
+                image = UIImage.new();
+            }
+            navBar.setBackgroundImageForBarMetrics(image, 0 /* UIBarMetrics.Default */);
+        }
+    };
+    ActionBar.prototype._getBackgroundImage = function (navBar) {
+        if (!navBar) {
+            return null;
+        }
+        var image;
+        if (__VISIONOS__ || majorVersion >= 15) {
+            var appearance = this._getAppearance(navBar);
+            image = appearance.backgroundImage;
+        }
+        else {
+            // legacy styling
+            image = navBar.backgroundImageForBarMetrics(0 /* UIBarMetrics.Default */);
+        }
+        return image;
+    };
+    ActionBar.prototype._createBackgroundUIImage = function (navBar, value, callback) {
+        if (!navBar) {
+            return;
+        }
+        if (value) {
+            if (value instanceof LinearGradient) {
+                if (!navBar.gradientLayer) {
+                    navBar.gradientLayer = CAGradientLayer.new();
+                }
+                iosViewUtils.drawGradient(navBar, navBar.gradientLayer, value);
+                var renderer = UIGraphicsImageRenderer.alloc().initWithSize(navBar.bounds.size);
+                var img = renderer.imageWithActions(function (context) {
+                    navBar.gradientLayer.renderInContext(context.CGContext);
+                });
+                callback(img);
+                // Return here to avoid unnecessary cleanups
+                return;
+            }
+            // Background image
+            iosBackground.createUIImageFromURI(this, value, false, callback);
+        }
+        else {
+            callback(null);
+        }
+        if (navBar.gradientLayer) {
+            navBar.gradientLayer = null;
+        }
+    };
+    ActionBar.prototype._onTitlePropertyChanged = function () {
+        var page = this.page;
         if (!page) {
             return;
         }
         if (page.frame) {
             page.frame._updateActionBar(page);
         }
-        const navigationItem = page.ios.navigationItem;
+        var navigationItem = page.ios.navigationItem;
         navigationItem.title = this.title;
-    }
-    updateFlatness(navBar) {
+    };
+    ActionBar.prototype.updateFlatness = function (navBar) {
         if (this.flat) {
             if (majorVersion >= 15) {
-                const appearance = this._getAppearance(navBar);
+                var appearance = this._getAppearance(navBar);
                 appearance.shadowColor = UIColor.clearColor;
                 this._updateAppearance(navBar, appearance);
             }
             else {
-                navBar.setBackgroundImageForBarMetrics(UIImage.new(), 0 /* UIBarMetrics.Default */);
+                // Do not apply blank image if background image is already set
+                if (!this.backgroundImage) {
+                    navBar.setBackgroundImageForBarMetrics(UIImage.new(), 0 /* UIBarMetrics.Default */);
+                }
                 navBar.shadowImage = UIImage.new();
                 navBar.translucent = false;
             }
@@ -373,43 +495,52 @@ export class ActionBar extends ActionBarBase {
             if (majorVersion >= 15) {
                 if (navBar.standardAppearance) {
                     // Not flat and never been set do nothing.
-                    const appearance = navBar.standardAppearance;
+                    var appearance = navBar.standardAppearance;
                     appearance.shadowColor = UINavigationBarAppearance.new().shadowColor;
                     this._updateAppearance(navBar, appearance);
                 }
             }
             else {
-                navBar.setBackgroundImageForBarMetrics(null, null);
+                // Do not apply blank image if background image is already set
+                if (!this.backgroundImage) {
+                    // Bar metrics is needed even when unsetting the image
+                    navBar.setBackgroundImageForBarMetrics(null, 0 /* UIBarMetrics.Default */);
+                }
                 navBar.shadowImage = null;
                 navBar.translucent = true;
             }
         }
-    }
-    _getAppearance(navBar) {
-        return navBar.standardAppearance ?? UINavigationBarAppearance.new();
-    }
-    _updateAppearance(navBar, appearance) {
+    };
+    ActionBar.prototype._getAppearance = function (navBar) {
+        var _a;
+        return (_a = navBar.standardAppearance) !== null && _a !== void 0 ? _a : UINavigationBarAppearance.new();
+    };
+    ActionBar.prototype._updateAppearance = function (navBar, appearance) {
         navBar.standardAppearance = appearance;
         navBar.compactAppearance = appearance;
         navBar.scrollEdgeAppearance = appearance;
-    }
-    onMeasure(widthMeasureSpec, heightMeasureSpec) {
-        const width = layout.getMeasureSpecSize(widthMeasureSpec);
-        const height = layout.getMeasureSpecSize(heightMeasureSpec);
+    };
+    ActionBar.prototype.onMeasure = function (widthMeasureSpec, heightMeasureSpec) {
+        var _this = this;
+        var _a;
+        var width = layout.getMeasureSpecSize(widthMeasureSpec);
+        var height = layout.getMeasureSpecSize(heightMeasureSpec);
         if (this.titleView) {
             View.measureChild(this, this.titleView, UNSPECIFIED, UNSPECIFIED);
         }
-        this.actionItems?.getItems().forEach((actionItem) => {
-            const actionView = actionItem.actionView;
+        (_a = this.actionItems) === null || _a === void 0 ? void 0 : _a.getItems().forEach(function (actionItem) {
+            var actionView = actionItem.actionView;
             if (actionView) {
-                View.measureChild(this, actionView, UNSPECIFIED, UNSPECIFIED);
+                View.measureChild(_this, actionView, UNSPECIFIED, UNSPECIFIED);
             }
         });
         // We ignore our width/height, minWidth/minHeight dimensions because it is against Apple policy to change height of NavigationBar.
         this.setMeasuredDimension(width, height);
-    }
-    onLayout(left, top, right, bottom) {
-        const titleView = this.titleView;
+    };
+    ActionBar.prototype.onLayout = function (left, top, right, bottom) {
+        var _this = this;
+        var _a;
+        var titleView = this.titleView;
         if (titleView) {
             if (majorVersion > 10) {
                 // On iOS 11 titleView is wrapped in another view that is centered with constraints.
@@ -421,62 +552,75 @@ export class ActionBar extends ActionBarBase {
                 View.layoutChild(this, titleView, 0, 0, right - left, bottom - top);
             }
         }
-        this.actionItems?.getItems().forEach((actionItem) => {
-            const actionView = actionItem.actionView;
+        (_a = this.actionItems) === null || _a === void 0 ? void 0 : _a.getItems().forEach(function (actionItem) {
+            var actionView = actionItem.actionView;
             if (actionView && actionView.ios) {
-                const measuredWidth = actionView.getMeasuredWidth();
-                const measuredHeight = actionView.getMeasuredHeight();
-                View.layoutChild(this, actionView, 0, 0, measuredWidth, measuredHeight);
+                var measuredWidth = actionView.getMeasuredWidth();
+                var measuredHeight = actionView.getMeasuredHeight();
+                View.layoutChild(_this, actionView, 0, 0, measuredWidth, measuredHeight);
             }
         });
-        super.onLayout(left, top, right, bottom);
-    }
-    layoutNativeView(left, top, right, bottom) {
+        _super.prototype.onLayout.call(this, left, top, right, bottom);
+    };
+    ActionBar.prototype.layoutNativeView = function (left, top, right, bottom) {
         return;
-    }
-    get navBar() {
-        // Page should be attached to frame to update the action bar.
-        if (this.page?.frame?.ios?.controller) {
-            return this.page.frame.ios.controller.navigationBar;
-        }
-        else {
-            return undefined;
-        }
-    }
-    [colorProperty.getDefault]() {
+    };
+    Object.defineProperty(ActionBar.prototype, "navBar", {
+        get: function () {
+            var _a, _b, _c;
+            // Page should be attached to frame to update the action bar.
+            if ((_c = (_b = (_a = this.page) === null || _a === void 0 ? void 0 : _a.frame) === null || _b === void 0 ? void 0 : _b.ios) === null || _c === void 0 ? void 0 : _c.controller) {
+                return this.page.frame.ios.controller.navigationBar;
+            }
+            else {
+                return undefined;
+            }
+        },
+        enumerable: false,
+        configurable: true
+    });
+    ActionBar.prototype[colorProperty.getDefault] = function () {
         return null;
-    }
-    [colorProperty.setNative](color) {
-        const navBar = this.navBar;
+    };
+    ActionBar.prototype[colorProperty.setNative] = function (color) {
+        var navBar = this.navBar;
         this.setColor(navBar, color);
-    }
-    [backgroundColorProperty.getDefault]() {
-        // This getter is never called.
-        // CssAnimationProperty use default value form their constructor.
-        return null;
-    }
-    [backgroundColorProperty.setNative](color) {
-        const navBar = this.navBar;
-        this.setBackgroundColor(navBar, color);
-    }
-    [backgroundInternalProperty.getDefault]() {
+    };
+    ActionBar.prototype[backgroundColorProperty.getDefault] = function () {
+        return this._getBackgroundColor(this.navBar);
+    };
+    ActionBar.prototype[backgroundColorProperty.setNative] = function (color) {
+        this._setBackgroundColor(this.navBar, color);
+    };
+    ActionBar.prototype[backgroundImageProperty.getDefault] = function () {
+        return this._getBackgroundImage(this.navBar);
+    };
+    ActionBar.prototype[backgroundImageProperty.setNative] = function (value) {
+        var _this = this;
+        var navBar = this.navBar;
+        this._createBackgroundUIImage(navBar, value, function (image) {
+            _this._setBackgroundImage(navBar, image);
+        });
+    };
+    ActionBar.prototype[backgroundInternalProperty.getDefault] = function () {
         return null;
-    }
-    [backgroundInternalProperty.setNative](value) {
-        // tslint:disable-line
-    }
-    [flatProperty.setNative](value) {
+    };
+    ActionBar.prototype[backgroundInternalProperty.setNative] = function (value) {
         // tslint:disable-line
-        const navBar = this.navBar;
+    };
+    ActionBar.prototype[flatProperty.setNative] = function (value) {
+        var navBar = this.navBar;
         if (navBar) {
             this.updateFlatness(navBar);
         }
-    }
-    [iosIconRenderingModeProperty.getDefault]() {
+    };
+    ActionBar.prototype[iosIconRenderingModeProperty.getDefault] = function () {
         return 'alwaysOriginal';
-    }
-    [iosIconRenderingModeProperty.setNative](value) {
+    };
+    ActionBar.prototype[iosIconRenderingModeProperty.setNative] = function (value) {
         this.update();
-    }
-}
+    };
+    return ActionBar;
+}(ActionBarBase));
+export { ActionBar };
 //# sourceMappingURL=index.ios.js.map