@breakside/jskit 2021.37.0 → 2021.39.0

package/Root/Frameworks/UIKit/UIListView.js

@@ -18,6 +18,7 @@
 // #import "UIPlatform.js"
 // #import "UIImageView.js"
 // #import "UIViewPropertyAnimator.js"
+// #import "JSColor+UIKit.js"
 /* global UIListViewCell, UIListViewHeaderFooterView */
 'use strict';
 
@@ -3029,22 +3030,22 @@ JSClass("UIListViewDefaultStyler", UIListViewStyler, {
             this.headerFont = JSFont.systemFontOfSize(JSFont.Size.normal).fontWithWeight(JSFont.Weight.bold);
         }
         if (this.cellTextColor === null){
-            this.cellTextColor = JSColor.black;
+            this.cellTextColor = JSColor.text;
         }
         if (this.cellDetailTextColor === null){
-            this.cellDetailTextColor = this.cellTextColor.colorLightenedByPercentage(0.6);
+            this.cellDetailTextColor = JSColor.secondaryText;
         }
         if (this.cellDetailFont === null && this.cellFont !== null){
-            this.cellDetailFont = this.cellFont.fontWithPointSize(Math.round(this.cellFont.pointSize * 12.0 / 14.0));
+            this.cellDetailFont = this.cellFont.fontWithPointSize(JSFont.Size.detail);
         }
         if (this.selectedCellBackgroundColor === null){
-            this.selectedCellBackgroundColor = JSColor.initWithRGBA(70/255, 153/255, 254/255, 1);
+            this.selectedCellBackgroundColor = JSColor.highlight;
         }
         if (this.contextSelectedCellBorderColor === null){
             this.contextSelectedCellBorderColor = this.selectedCellBackgroundColor.colorDarkenedByPercentage(0.5);
         }
         if (this.headerTextColor === null){
-            this.headerTextColor = JSColor.black;
+            this.headerTextColor = JSColor.text;
         }
         if (this.cellSeparatorColor === null){
             this.cellSeparatorColor = this.cellTextColor.colorWithAlpha(0.2);
@@ -3053,13 +3054,13 @@ JSClass("UIListViewDefaultStyler", UIListViewStyler, {
             this.accessoryColor = this.cellTextColor;
         }
         if (this.selectedCellTextColor === null){
-            this.selectedCellTextColor = JSColor.white;
+            this.selectedCellTextColor = JSColor.highlightedText;
         }
         if (this.selectedCellDetailTextColor === null){
             this.selectedCellDetailTextColor = this.selectedCellTextColor;
         }
         if (this.selectedCellSeparatorColor === null){
-            this.selectedCellSeparatorColor = this.selectedCellBackgroundColor.colorLightenedByPercentage(0.2);
+            this.selectedCellSeparatorColor = JSColor.clear;
         }
         if (this.activeCellBackgroundColor === null){
             this.activeCellBackgroundColor = this.cellBackgroundColor;
@@ -3080,10 +3081,10 @@ JSClass("UIListViewDefaultStyler", UIListViewStyler, {
             this.mutedSelectedCellDetailTextColor = this.cellDetailTextColor;
         }
         if (this.mutedSelectedCellBackgroundColor === null){
-            this.mutedSelectedCellBackgroundColor = this.cellSeparatorColor;
+            this.mutedSelectedCellBackgroundColor = JSColor.mutedHighlight;
         }
         if (this.mutedSelectedCellSeparatorColor === null){
-            this.mutedSelectedCellSeparatorColor = this.mutedSelectedCellBackgroundColor.colorLightenedByPercentage(0.2);
+            this.mutedSelectedCellSeparatorColor = JSColor.clear;
         }
         if (this.cellContentInsets === null){
             this.cellContentInsets = JSInsets.Zero;

package/Root/Frameworks/UIKit/UIMenu.js

@@ -20,6 +20,7 @@
 // #import "UIEvent.js"
 // #import "UIWindow.js"
 // #import "UIAccessibility.js"
+// #import "JSColor+UIKit.js"
 /* global UIMenuWindow */
 'use strict';
 
@@ -444,12 +445,12 @@ JSClass("UIMenuStyler", JSObject, {
 
 });
 
-var defaultTextColor = JSColor.initWithRGBA(51/255, 51/255, 51/255, 1);
-var defaultHighlightTextColor = JSColor.initWithRGBA(1, 1, 1, 1);
-var defaultDisabledTextColor = JSColor.initWithRGBA(223/255, 223/255, 223/255, 1);
-var defaultHighlightColor = JSColor.initWithRGBA(70/255, 153/255, 254/255, 1);
-var defaultBackgroundColor = JSColor.initWithRGBA(240/255, 240/255, 240/255, 1);
-var defaultBorderColor = JSColor.initWithRGBA(184/255, 184/255, 184/255, 1);
+var defaultTextColor = JSColor.text;
+var defaultHighlightTextColor = JSColor.highlightedText;
+var defaultDisabledTextColor = JSColor.text.colorWithAlpha(0.2);
+var defaultHighlightColor = JSColor.highlight;
+var defaultBackgroundColor = JSColor.menu;
+var defaultBorderColor = JSColor.initWithUIStyles(JSColor.black.colorWithAlpha(0.2), JSColor.white.colorWithAlpha(0.2));
 
 JSClass("UIMenuWindowStyler", UIMenuStyler, {
 
@@ -465,7 +466,7 @@ JSClass("UIMenuWindowStyler", UIMenuStyler, {
     itemContentInsets: JSDynamicProperty('_itemContentInsets', JSInsets(2, 3, 2, 7)),
     indentationSize: JSDynamicProperty('_indentationSize', 10),
     separatorSize: 10,
-    separatorLineWidth: 2,
+    separatorLineWidth: 1,
     separatorColor: null,
     shadowColor: null,
     shadowRadius: 14,
@@ -474,14 +475,14 @@ JSClass("UIMenuWindowStyler", UIMenuStyler, {
 
     init: function(){
         UIMenuWindowStyler.$super.init.call(this);
-        this.shadowColor = JSColor.initWithRGBA(0, 0, 0, 0.2);
+        this.shadowColor = JSColor.menuShadow;
         this.shadowOffset = JSPoint.Zero;
         this.separatorColor = this.disabledTextColor;
     },
 
     initWithSpec: function(spec){
         UIMenuWindowStyler.$super.initWithSpec.call(this, spec);
-        this.shadowColor = JSColor.initWithRGBA(0, 0, 0, 0.2);
+        this.shadowColor = JSColor.menuShadow;
         this.shadowOffset = JSPoint.Zero;
         if (spec.containsKey('capSize')){
             this._capSize = spec.valueForKey("capSize");

package/Root/Frameworks/UIKit/UIMenuBar.js

@@ -16,6 +16,7 @@
 // #import "UIWindow.js"
 // #import "UIMenu.js"
 // #import "UIMenuView.js"
+// #import "JSColor+UIKit.js"
 'use strict';
 
 JSClass("UIMenuBar", UIWindow, {
@@ -86,11 +87,11 @@ JSClass("UIMenuBar", UIWindow, {
         this.contentView = UIView.init();
         this._clipView = UIView.init();
         this.contentView.addSubview(this._clipView);
-        // this.backgroundColor = JSColor.initWithRGBA(1, 1, 1, 0.95);
+        this.backgroundColor = JSColor.menuBar;
         this._font = JSFont.systemFontOfSize(JSFont.Size.normal).fontWithWeight(JSFont.Weight.regular);
-        this._textColor = UIMenu.Styler.default.textColor;
-        this._highlightColor = UIMenu.Styler.default.highlightColor;
-        this._highlightedTextColor = UIMenu.Styler.default.highlightedTextColor;
+        this._textColor = JSColor.menuBarText;
+        this._highlightColor = JSColor.highlight;
+        this._highlightedTextColor = JSColor.highlightedText;
     },
 
     // --------------------------------------------------------------------

package/Root/Frameworks/UIKit/UIMenuView.js

@@ -20,6 +20,7 @@
 // #import "UIImageView.js"
 // #import "UIEvent.js"
 // #import "UIPlatform.js"
+// #import "JSColor+UIKit.js"
 'use strict';
 
 (function(){
@@ -635,7 +636,7 @@ JSClass("UIMenuView", UIView, {
 
     initWithFrame: function(frame){
         UIMenuView.$super.initWithFrame.call(this, frame);
-        this.backgroundColor = JSColor.initWithRGBA(255/255, 255/255, 255/255, 1.0);
+        this.backgroundColor = JSColor.background;
         this.itemViews = [];
     },
 
@@ -643,7 +644,7 @@ JSClass("UIMenuView", UIView, {
         var view = item.view;
         if (view === null){
             if (item.separator){
-                view = UIMenuItemSeparatorView.initWithColor(this.menuWindow.separatorColor, this.menuWindow.separatorLineWidth);
+                view = UIMenuItemSeparatorView.initWithColor(this.menuWindow.separatorColor, this.menuWindow.separatorLineWidth, this.menuWindow.itemContentInsets.insetsWithInsets(0, item.menu.showStatusColumn ? (item.menu.font.displayLineHeight + this.menuWindow.itemContentInsets.left) : 0, 0, 0));
                 view.frame = JSRect(0, 0, 1, this.menuWindow.separatorSize);
             }else{
                 view = UIMenuItemView.init();
@@ -714,10 +715,12 @@ JSClass("UIMenuItemSeparatorView", UIView, {
 
     lineLayer: null,
     size: 0,
+    insets: null,
 
-    initWithColor: function(color, size){
+    initWithColor: function(color, size, insets){
         UIMenuItemSeparatorView.$super.init.call(this);
         this.size = size;
+        this.insets = JSInsets(insets);
         this.lineLayer = UILayer.init();
         this.lineLayer.backgroundColor = color;
         this.layer.addSublayer(this.lineLayer);
@@ -725,7 +728,8 @@ JSClass("UIMenuItemSeparatorView", UIView, {
 
     layoutSubviews: function(){
         UIMenuItemSeparatorView.$super.layoutSubviews.call(this);
-        this.lineLayer.frame = JSRect(0, (this.bounds.size.height - this.size) / 2, this.bounds.size.width, this.size);
+
+        this.lineLayer.frame = JSRect(this.insets.left, (this.bounds.size.height - this.size) / 2, this.bounds.size.width - this.insets.width, this.size);
     },
 
     isAccessibilityElement: true,

package/Root/Frameworks/UIKit/UINavigationBar.js

@@ -17,6 +17,7 @@
 // #import "UILabel.js"
 // #import "UINavigationBarItem.js"
 // #import "UIViewPropertyAnimator.js"
+// #import "JSColor+UIKit.js"
 'use strict';
 
 (function(){
@@ -317,10 +318,11 @@ JSClass("UINavigationBarDefaultStyler", UINavigationBarStyler, {
     init: function(){
         UINavigationBarDefaultStyler.$super.init.call(this);
         this.coversContent = true;
-        this.backgroundColor = JSColor.initWithWhite(0.8);
+        this.backgroundColor = JSColor.background;
         this.contentSeparatorSize = 1;
-        this.contentSeparatorColor = JSColor.initWithWhite(0.8);
-        this.titleColor = JSColor.initWithWhite(0.2);
+        this.contentSeparatorColor = JSColor.initWithUIStyles(JSColor.black.colorWithAlpha(0.1), JSColor.white.colorWithAlpha(0.1));
+        this.titleColor = JSColor.text;
+        this.itemColor = JSColor.highlight;
         this.itemInsets = JSInsets.Zero;
         this._fillInDefaultStyles();
     },
@@ -336,8 +338,8 @@ JSClass("UINavigationBarDefaultStyler", UINavigationBarStyler, {
         if (spec.containsKey("contentSeparatorColor")){
             this.contentSeparatorColor = spec.valueForKey("contentSeparatorColor", JSColor);
         }
-        if (spec.containsKey("contentSeparatorWidth")){
-            this.contentSeparatorWidth = spec.valueForKey("contentSeparatorWidth");
+        if (spec.containsKey("contentSeparatorSize")){
+            this.contentSeparatorSize = spec.valueForKey("contentSeparatorSize");
         }
         if (spec.containsKey("titleColor")){
             this.titleColor = spec.valueForKey("titleColor", JSColor);
@@ -772,6 +774,7 @@ JSClass("UINavigationBarDefaultStyler", UINavigationBarStyler, {
         button.accessibilityLabel = barItem.accessibilityTitle;
         if (barItem.image){
             button.setImageForState(barItem.image, UIControl.State.normal);
+            button._imageView.automaticRenderMode = JSImage.RenderMode.template;
         }
         button.addAction(barItem.action, barItem.target);
         return button;

package/Root/Frameworks/UIKit/UINavigationController.js

@@ -17,6 +17,7 @@
 // #import "UINavigationBar.js"
 // #import "UIScrollView.js"
 // #import "UIViewPropertyAnimator.js"
+// #import "JSColor+UIKit.js"
 /* global UISplitViewController */
 'use strict';
 
@@ -195,7 +196,7 @@ JSClass("UINavigationController", UIViewController, {
             var navController = this;
             this.layoutChildView(viewController.view);
             viewController.view.transform = JSAffineTransform.Translated(viewController.view.bounds.size.width, 0);
-            viewController.view.shadowColor = JSColor.initWithWhite(0, 0.4);
+            viewController.view.shadowColor = JSColor.windowShadow;
             viewController.view.shadowRadius = 20;
             this.pushAnimator.addAnimations(function(){
                 viewController.view.transform = JSAffineTransform.Identity;
@@ -272,7 +273,7 @@ JSClass("UINavigationController", UIViewController, {
             var navController = this;
             this.layoutChildView(viewController.view);
             viewController.view.transform = JSAffineTransform.Translated(-viewController.view.bounds.size.width / 2, 0);
-            fromViewController.view.shadowColor = JSColor.initWithWhite(0, 0.4);
+            fromViewController.view.shadowColor = JSColor.windowShadow;
             fromViewController.view.shadowRadius = 20;
             this.popAnimator.addAnimations(function(){
                 viewController.view.transform = JSAffineTransform.Identity;

package/Root/Frameworks/UIKit/UIOutlineViewCell.js

@@ -16,6 +16,7 @@
 // #import "UIListViewCell.js"
 // #import "UIButton.js"
 // #import "UIEvent.js"
+// #import "JSColor+UIKit.js"
 'use strict';
 
 JSClass("UIOutlineViewCell", UIListViewCell, {
@@ -28,7 +29,7 @@ JSClass("UIOutlineViewCell", UIListViewCell, {
 
     _commonCellInit: function(){
         UIOutlineViewCell.$super._commonCellInit.call(this);
-        var buttonStyler = UIButtonImageStyler.initWithColor(JSColor.black);
+        var buttonStyler = UIButtonImageStyler.initWithColor(JSColor.text);
         this._disclosureButton = UIButton.initWithStyler(buttonStyler);
         this._disclosureButton.addAction("_toggleExpanded", this);
         this._disclosureButton.accessibilityRole = UIAccessibility.Role.disclosureTriangle;

package/Root/Frameworks/UIKit/UIPopupButton.js

@@ -17,6 +17,7 @@
 // #import "UILabel.js"
 // #import "UIImageView.js"
 // #import "UIMenu.js"
+// #import "JSColor+UIKit.js"
 'use strict';
 
 (function(){
@@ -480,7 +481,7 @@ JSClass("UIPopupButtonCustomStyler", UIPopupButtonStyler, {
     indicatorSpacing: 0,
 
     init: function(){
-        this.initWithColor(JSColor.black);
+        this.initWithColor(JSColor.text);
     },
 
     initWithColor: function(color){
@@ -588,7 +589,7 @@ JSClass("UIPopupButtonCustomStyler", UIPopupButtonStyler, {
             }
         }
         if (this.normalTitleColor === null){
-            this.normalTitleColor = JSColor.black;
+            this.normalTitleColor = JSColor.text;
         }
         if (this.activeTitleColor === null){
             this.activeTitleColor = this.normalTitleColor.colorDarkenedByPercentage(0.2);
@@ -703,31 +704,31 @@ JSClass("UIPopupButtonDefaultStyler", UIPopupButtonCustomStyler, {
 
     _fillInMissingColors: function(){
         if (this.normalBackgroundColor === null){
-            this.normalBackgroundColor = UIPopupButtonDefaultStyler.NormalBackgroundColor;
+            this.normalBackgroundColor = JSColor.controlBackground;
             if (this.activeBackgroundColor === null){
-                this.activeBackgroundColor = UIPopupButtonDefaultStyler.ActiveBackgroundColor;
+                this.activeBackgroundColor = JSColor.activeControlBackground;
             }
             if (this.disabledBackgroundColor === null){
-                this.disabledBackgroundColor = UIPopupButtonDefaultStyler.DisabledBackgroundColor;
+                this.disabledBackgroundColor = JSColor.disabledControlBackground;
             }
         }
         if (this.normalBorderColor === null){
-            this.normalBorderColor = UIPopupButtonDefaultStyler.NormalBorderColor;
+            this.normalBorderColor = JSColor.controlBorder;
             if (this.activeBorderColor === null){
-                this.activeBorderColor = UIPopupButtonDefaultStyler.ActiveBorderColor;
+                this.activeBorderColor = JSColor.activeControlBorder;
             }
             if (this.disabledBorderColor === null){
-                this.disabledBorderColor = UIPopupButtonDefaultStyler.DisabledBorderColor;
+                this.disabledBorderColor = JSColor.disabledControlBorder;
             }
         }
         if (this.normalTitleColor === null){
-            this.normalTitleColor = UIPopupButtonDefaultStyler.NormalTitleColor;
+            this.normalTitleColor = JSColor.controlTitle;
         }
         if (this.activeTitleColor === null){
-            this.activeTitleColor = UIPopupButtonDefaultStyler.ActiveTitleColor;
+            this.activeTitleColor = JSColor.activeControlTitle;
         }
         if (this.disabledTitleColor === null){
-            this.disabledTitleColor = UIPopupButtonDefaultStyler.DisabledTitleColor;
+            this.disabledTitleColor = JSColor.disabledControlTitle;
         }
     }
 
@@ -744,7 +745,7 @@ JSClass("UIPopupButtonImageStyler", UIPopupButtonStyler, {
     cornerRadius: 0,
 
     init: function(){
-        this.initWithColor(JSColor.black);
+        this.initWithColor(JSColor.text);
     },
 
     initWithColor: function(color){
@@ -832,18 +833,6 @@ JSClass("UIPopupButtonImageStyler", UIPopupButtonStyler, {
 
 });
 
-UIPopupButtonDefaultStyler.NormalBackgroundColor = JSColor.initWithRGBA(250/255,250/255,250/255);
-UIPopupButtonDefaultStyler.ActiveBackgroundColor = JSColor.initWithRGBA(224/255,224/255,224/255);
-UIPopupButtonDefaultStyler.DisabledBackgroundColor = JSColor.initWithRGBA(240/255,240/255,240/255);
-
-UIPopupButtonDefaultStyler.NormalBorderColor = JSColor.initWithRGBA(204/255,204/255,204/255);
-UIPopupButtonDefaultStyler.ActiveBorderColor = JSColor.initWithRGBA(192/255,192/255,192/255);
-UIPopupButtonDefaultStyler.DisabledBorderColor = JSColor.initWithRGBA(224/255,224/255,224/255);
-
-UIPopupButtonDefaultStyler.NormalTitleColor = JSColor.initWithRGBA(51/255,51/255,51/255);
-UIPopupButtonDefaultStyler.ActiveTitleColor = JSColor.initWithRGBA(51/255,51/255,51/255);
-UIPopupButtonDefaultStyler.DisabledTitleColor = JSColor.initWithRGBA(152/255,152/255,152/255);
-
 var images = Object.create({}, {
 
     bundle: {

package/Root/Frameworks/UIKit/UIPopupWindow.js

@@ -15,6 +15,7 @@
 
 // #import "UIWindow.js"
 // #import "UIViewPropertyAnimator.js"
+// #import "JSColor+UIKit.js"
 'use strict';
 
 JSClass("UIPopupWindow", UIWindow, {
@@ -321,8 +322,8 @@ JSClass("UIPopupWindowStyler", UIWindowStyler, {
 
     init: function(){
         UIPopupWindowStyler.$super.init.call(this);
-        this.backgroundColor = JSColor.initWithRGBA(240/255,240/255,240/255,1);
-        this.shadowColor = JSColor.initWithRGBA(0, 0, 0, 0.4);
+        this.backgroundColor = JSColor.window;
+        this.shadowColor = JSColor.windowShadow;
         this.shadowOffset = JSPoint.Zero;
         this.shadowRadius = UIWindow.Styler.default.shadowRadius;
         this.cornerRadius = UIWindow.Styler.default.cornerRadius;

package/Root/Frameworks/UIKit/UIProgressIndicatorView.js

@@ -51,7 +51,7 @@ JSClass("UIProgressIndicatorView", UIView, {
 
     _commonProgressInit: function(){
         if (this._progressBarColor === null){
-            this._progressBarColor = JSColor.initWithRGBA(0, 0, 0, 0.4);
+            this._progressBarColor = JSColor.initWithUIStyles(JSColor.black.colorLightenedByPercentage(0.6), JSColor.white.colorDarkenedByPercentage(0.6));
         }
         if (this._progressBorderColor === null){
             this._progressBorderColor = this._progressBarColor;

package/Root/Frameworks/UIKit/UIRadioGroup.js

@@ -17,6 +17,7 @@
 // #import "UILabel.js"
 // #import "UIImageView.js"
 // #import "UIEvent.js"
+// #import "JSColor+UIKit.js"
 'use strict';
 
 (function(){
@@ -360,16 +361,16 @@ JSClass("UIRadioButtonDefaultStyler", UIRadioButtonStyler, {
     borderWidth: 1,
 
     init: function(){
-        this.normalBackgroundColor = UIRadioButtonDefaultStyler.NormalBackgroundColor;
-        this.disabledBackgroundColor = UIRadioButtonDefaultStyler.DisabledBackgroundColor;
-        this.activeBackgroundColor = UIRadioButtonDefaultStyler.ActiveBackgroundColor;
-        this.normalBorderColor = UIRadioButtonDefaultStyler.NormalBorderColor;
-        this.disabledBorderColor = UIRadioButtonDefaultStyler.DisabledBorderColor;
-        this.activeBorderColor = UIRadioButtonDefaultStyler.ActiveBorderColor;
-        this.normalTitleColor = UIRadioButtonDefaultStyler.NormalTitleColor;
-        this.disabledTitleColor = UIRadioButtonDefaultStyler.DisabledTitleColor;
-        this.activeTitleColor = UIRadioButtonDefaultStyler.ActiveTitleColor;
-        this.shadowColor = JSColor.initWithRGBA(0, 0, 0, 0.1);
+        this.normalBackgroundColor = JSColor.controlBackground;
+        this.disabledBackgroundColor = JSColor.disabledControlBackground;
+        this.activeBackgroundColor = JSColor.activeControlBackground;
+        this.normalBorderColor = JSColor.controlBorder;
+        this.disabledBorderColor = JSColor.disabledControlBorder;
+        this.activeBorderColor = JSColor.activeControlBorder;
+        this.normalTitleColor = JSColor.controlTitle;
+        this.disabledTitleColor = JSColor.disabledControlTitle;
+        this.activeTitleColor = JSColor.activeControlTitle;
+        this.shadowColor = JSColor.controlShadow;
         this.shadowOffset = JSPoint(0, 1);
     },
 
@@ -426,18 +427,6 @@ JSClass("UIRadioButtonDefaultStyler", UIRadioButtonStyler, {
 
 });
 
-UIRadioButtonDefaultStyler.NormalBackgroundColor = JSColor.initWithRGBA(250/255,250/255,250/255);
-UIRadioButtonDefaultStyler.ActiveBackgroundColor = JSColor.initWithRGBA(224/255,224/255,224/255);
-UIRadioButtonDefaultStyler.DisabledBackgroundColor = JSColor.initWithRGBA(240/255,240/255,240/255);
-
-UIRadioButtonDefaultStyler.NormalBorderColor = JSColor.initWithRGBA(204/255,204/255,204/255);
-UIRadioButtonDefaultStyler.ActiveBorderColor = JSColor.initWithRGBA(192/255,192/255,192/255);
-UIRadioButtonDefaultStyler.DisabledBorderColor = JSColor.initWithRGBA(224/255,224/255,224/255);
-
-UIRadioButtonDefaultStyler.NormalTitleColor = JSColor.initWithRGBA(51/255,51/255,51/255);
-UIRadioButtonDefaultStyler.ActiveTitleColor = JSColor.initWithRGBA(51/255,51/255,51/255);
-UIRadioButtonDefaultStyler.DisabledTitleColor = JSColor.initWithRGBA(152/255,152/255,152/255);
-
 var images = Object.create({}, {
 
     bundle: {

package/Root/Frameworks/UIKit/UIScroller.js

@@ -16,6 +16,7 @@
 // #import "UIControl.js"
 // #import "UIViewPropertyAnimator.js"
 // #import "UIDevice.js"
+// #import "JSColor+UIKit.js"
 'use strict';
 
 JSClass("UIScroller", UIControl, {
@@ -287,9 +288,9 @@ JSClass("UIScrollerDefaultStyler", UIScrollerStyler, {
         this.knobInsets = JSInsets(2, 3, 2, 2);
         var maxKnobWidth = this.expandedSize - this.knobInsets.left - this.knobInsets.right;
         this.minimumKnobLength = maxKnobWidth * 2;
-        this.trackColor = JSColor.initWithWhite(0, 0.1);
-        this.trackBorderColor = JSColor.initWithWhite(0, 0.15);
-        this.knobColor = JSColor.initWithWhite(0, 0.6);
+        this.trackColor = JSColor.initWithUIStyles(JSColor.initWithWhite(0, 0.1), JSColor.initWithWhite(1, 0.1));
+        this.trackBorderColor = JSColor.initWithUIStyles(JSColor.initWithWhite(0, 0.15), JSColor.initWithWhite(1, 0.05));
+        this.knobColor = JSColor.initWithUIStyles(JSColor.initWithWhite(0, 0.6), JSColor.initWithWhite(1, 0.6));
         if (UIDevice.shared && UIDevice.shared.primaryPointerType === UIUserInterface.PointerType.touch){
             this.collapsedSize = 8;
         }

package/Root/Frameworks/UIKit/UISegmentedControl.js

@@ -17,6 +17,7 @@
 // #import "UILabel.js"
 // #import "UIImageView.js"
 // #import "UIEvent.js"
+// #import "JSColor+UIKit.js"
 'use strict';
 
 JSClass("UISegmentedControl", UIControl, {
@@ -662,21 +663,21 @@ JSClass("UISegmentedControlDefaultStyler", UISegmentedControlStyler, {
     cornerRadius: 3,
 
     init: function(){
-        this.normalBackgroundColor = JSColor.initWithRGBA(250/255,250/255,250/255);
-        this.activeBackgroundColor = JSColor.initWithRGBA(224/255,224/255,224/255);
-        this.disabledBackgroundColor = JSColor.initWithRGBA(240/255,240/255,240/255);
-        this.selectedBackgroundColor = JSColor.initWithRGBA(128/255,128/255,128/255);
-        this.selectedActiveBackgroundColor = JSColor.initWithRGBA(102/255,102/255,102/255);
-        this.normalBorderColor = JSColor.initWithRGBA(204/255,204/255,204/255);
-        this.activeBorderColor = JSColor.initWithRGBA(192/255,192/255,192/255);
-        this.disabledBorderColor = JSColor.initWithRGBA(224/255,224/255,224/255);
-        this.selectedBorderColor = this.selectedBackgroundColor;
-        this.selectedActiveBorderColor = this.selectedActiveBackgroundColor;
-        this.normalTitleColor = JSColor.initWithRGBA(51/255,51/255,51/255);
-        this.activeTitleColor = JSColor.initWithRGBA(51/255,51/255,51/255);
-        this.disabledTitleColor = JSColor.initWithRGBA(152/255,152/255,152/255);
-        this.selectedTitleColor = JSColor.initWithRGBA(240/255,240/255,240/255);
-        this.selectedActiveTitleColor = this.selectedTitleColor;
+        this.normalBackgroundColor = JSColor.controlBackground;
+        this.activeBackgroundColor = JSColor.activeControlBackground;
+        this.disabledBackgroundColor = JSColor.disabledControlBackground;
+        this.selectedBackgroundColor = JSColor.selectedControlBackground;
+        this.selectedActiveBackgroundColor = JSColor.activeSelectedControlBackground;
+        this.normalBorderColor = JSColor.controlBorder;
+        this.activeBorderColor = JSColor.activeControlBorder;
+        this.disabledBorderColor = JSColor.disabledControlBorder;
+        this.selectedBorderColor = JSColor.selectedControlBorder;
+        this.selectedActiveBorderColor = JSColor.activeSelectedControlBorder;
+        this.normalTitleColor = JSColor.controlTitle;
+        this.activeTitleColor = JSColor.activeControlTitle;
+        this.disabledTitleColor = JSColor.disabledControlTitle;
+        this.selectedTitleColor = JSColor.selectedControlTitle;
+        this.selectedActiveTitleColor = JSColor.activeSelectedControlTitle;
         this.shadowColor = JSColor.initWithRGBA(0, 0, 0, 0.1);
         this.shadowOffset = JSPoint(0, 1);
         this.titleInsets = JSInsets(3, 7);

package/Root/Frameworks/UIKit/UISlider.js

@@ -330,21 +330,21 @@ JSClass("UISliderDefaultStyler", UISliderLayerBasedStyler, {
     init: function(){
         UISliderDefaultStyler.$super.init.call(this);
         this.knobSize = JSSize(16, 16);
-        this.normalTrackColor = UISliderDefaultStyler.NormalTrackColor;
-        this.activeTrackColor = UISliderDefaultStyler.ActiveTrackColor;
-        this.disabledTrackColor = UISliderDefaultStyler.DisabledTrackColor;
-        this.normalTrackBorderColor = UISliderDefaultStyler.NormalTrackBorderColor;
-        this.activeTrackBorderColor = UISliderDefaultStyler.ActiveTrackBorderColor;
-        this.disabledTrackBorderColor = UISliderDefaultStyler.DisabledTrackBorderColor;
+        this.normalTrackColor = JSColor.initWithUIStyles(JSColor.controlBackground.colorDarkenedByPercentage(0.02), JSColor.controlBackground.colorDarkenedByPercentage(0.3), JSColor.controlBackground, JSColor.controlBackground);
+        this.activeTrackColor = this.normalTrackColor;
+        this.disabledTrackColor = JSColor.disabledControlBackground;
+        this.normalTrackBorderColor = JSColor.controlBorder;
+        this.activeTrackBorderColor = JSColor.controlBorder;
+        this.disabledTrackBorderColor = JSColor.disabledControlBorder;
         this.trackInnerShadowColor = JSColor.black.colorWithAlpha(0.4);
         this.trackInnerShadowOffset = JSPoint(0, 1);
-        this.normalKnobBackgroundColor = UISliderDefaultStyler.NormalKnobBackgroundColor;
-        this.disabledKnobBackgroundColor = UISliderDefaultStyler.DisabledKnobBackgroundColor;
-        this.activeKnobBackgroundColor = UISliderDefaultStyler.ActiveKnobBackgroundColor;
-        this.normalKnobBorderColor = UISliderDefaultStyler.NormalKnobBorderColor;
-        this.disabledKnobBorderColor = UISliderDefaultStyler.DisabledKnobBorderColor;
-        this.activeKnobBorderColor = UISliderDefaultStyler.ActiveKnobBorderColor;
-        this.knobShadowColor = JSColor.black.colorWithAlpha(0.1);
+        this.normalKnobBackgroundColor = JSColor.controlBackground;
+        this.disabledKnobBackgroundColor = JSColor.disabledControlBackground;
+        this.activeKnobBackgroundColor = JSColor.activeControlBackground;
+        this.normalKnobBorderColor = JSColor.controlBorder;
+        this.disabledKnobBorderColor = JSColor.disabledControlBorder;
+        this.activeKnobBorderColor = JSColor.activeControlBorder;
+        this.knobShadowColor = JSColor.controlShadow;
         this.knobShadowOffset = JSPoint(0, 1);
     },
 
@@ -534,22 +534,6 @@ JSClass("UISliderDefaultStyler", UISliderLayerBasedStyler, {
 
 });
 
-UISliderDefaultStyler.NormalTrackColor = JSColor.initWithRGBA(245/255,245/255,245/255);
-UISliderDefaultStyler.ActiveTrackColor = UISliderDefaultStyler.NormalTrackColor;
-UISliderDefaultStyler.DisabledTrackColor = JSColor.initWithRGBA(240/255,240/255,240/255);
-
-UISliderDefaultStyler.NormalTrackBorderColor = JSColor.initWithRGBA(204/255,204/255,204/255);
-UISliderDefaultStyler.ActiveTrackBorderColor = UISliderDefaultStyler.NormalTrackBorderColor;
-UISliderDefaultStyler.DisabledTrackBorderColor = JSColor.initWithRGBA(224/255,224/255,224/255);
-
-UISliderDefaultStyler.NormalKnobBackgroundColor = JSColor.initWithRGBA(250/255,250/255,250/255);
-UISliderDefaultStyler.ActiveKnobBackgroundColor = JSColor.initWithRGBA(224/255,224/255,224/255);
-UISliderDefaultStyler.DisabledKnobBackgroundColor = JSColor.initWithRGBA(240/255,240/255,240/255);
-
-UISliderDefaultStyler.NormalKnobBorderColor = JSColor.initWithRGBA(204/255,204/255,204/255);
-UISliderDefaultStyler.ActiveKnobBorderColor = JSColor.initWithRGBA(192/255,192/255,192/255);
-UISliderDefaultStyler.DisabledKnobBorderColor = JSColor.initWithRGBA(224/255,224/255,224/255);
-
 JSClass("UISliderColorStyler", UISliderLayerBasedStyler, {
 
     gradient: null,
@@ -595,13 +579,13 @@ JSClass("UISliderColorStyler", UISliderLayerBasedStyler, {
             this.knobSize = JSSize(this.trackWidth + 6, this.trackWidth + 6);
         }
         this.trackRadius = this.trackWidth / 2;
-        this.normalKnobBackgroundColor = JSColor.white;
-        this.activeKnobBackgroundColor = JSColor.white;
-        this.disabledKnobBackgroundColor = this.normalKnobBackgroundColor.colorWithAlpha(0.5);
-        this.normalKnobBorderColor = JSColor.black.colorWithAlpha(0.2);
-        this.activeKnobBorderColor = JSColor.black.colorWithAlpha(0.3);
-        this.disabledKnobBorderColor = JSColor.black.colorWithAlpha(0.1);
-        this.checkerColor = JSColor.initWithWhite(0.9);
+        this.normalKnobBackgroundColor = JSColor.controlBackground;
+        this.activeKnobBackgroundColor = JSColor.activeControlBackground;
+        this.disabledKnobBackgroundColor = JSColor.disabledControlBackground;
+        this.normalKnobBorderColor = JSColor.controlBorder;
+        this.activeKnobBorderColor = JSColor.activeControlBorder;
+        this.disabledKnobBorderColor = JSColor.disabledControlBorder;
+        this.checkerColor = JSColor.initWithUIStyles(JSColor.initWithWhite(0.9), JSColor.initWithWhite(0.1));
     },
 
     setColors: function(colors){