4.10.9 changes

examples/angular/package.json

@@ -19,28 +19,28 @@
     "@angular/platform-browser": "~11.0.6",
     "@angular/platform-browser-dynamic": "~11.0.6",
     "@angular/router": "~11.0.6",
-    "@mobiscroll/angular-lite": "^4.10.8",
-    "rxjs": "~6.6.0",
-    "tslib": "^2.0.0",
+    "@mobiscroll/angular-lite": "file:mobiscroll-angular-lite-4.10.9.tgz",
+    "rxjs": "^6.6.7",
+    "tslib": "^2.2.0",
     "zone.js": "~0.10.2"
   },
   "devDependencies": {
     "@angular-devkit/build-angular": "~0.1100.6",
     "@angular/cli": "~11.0.6",
     "@angular/compiler-cli": "~11.0.6",
-    "@types/jasmine": "~3.6.0",
-    "@types/node": "^12.11.1",
-    "codelyzer": "^6.0.0",
+    "@types/jasmine": "^3.6.11",
+    "@types/node": "^12.20.13",
+    "codelyzer": "^6.0.2",
     "jasmine-core": "~3.6.0",
     "jasmine-spec-reporter": "~5.0.0",
     "karma": "~5.1.0",
     "karma-chrome-launcher": "~3.1.0",
     "karma-coverage": "~2.0.3",
     "karma-jasmine": "~4.0.0",
-    "karma-jasmine-html-reporter": "^1.5.0",
+    "karma-jasmine-html-reporter": "^1.6.0",
     "protractor": "~7.0.0",
     "ts-node": "~8.3.0",
     "tslint": "~6.1.0",
-    "typescript": "~4.0.2"
+    "typescript": "^4.0.7"
   }
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "mobiscroll",
-  "version": "4.10.8",
+  "version": "4.10.9",
   "description": "Cross platform UI controls for progressive web an hybrid apps",
   "homepage": "https://mobiscroll.com/",
   "license": "Apache-2.0",

packages/angular/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@mobiscroll/angular-lite",
-    "version": "4.10.8",
+    "version": "4.10.9",
     "description": "Angular UI library for progressive web and hybrid apps",
     "homepage": "https://mobiscroll.com/",
     "license": "Apache-2.0",

packages/angularjs/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@mobiscroll/angularjs-lite",
-    "version": "4.10.8",
+    "version": "4.10.9",
     "description": "AngularJS UI library for progressive web and hybrid apps",
     "homepage": "https://mobiscroll.com/",
     "license": "Apache-2.0",

packages/javascript/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@mobiscroll/javascript-lite",
-    "version": "4.10.8",
+    "version": "4.10.9",
     "description": "Framework agnostic UI library for progressive web and hybrid apps",
     "homepage": "https://mobiscroll.com/",
     "license": "Apache-2.0",

packages/jquery/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@mobiscroll/jquery-lite",
-    "version": "4.10.8",
+    "version": "4.10.9",
     "description": "jQuery and jQuery Mobile UI library for progressive web and hybrid apps",
     "homepage": "https://mobiscroll.com/",
     "license": "Apache-2.0",

packages/react/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@mobiscroll/react-lite",
-    "version": "4.10.8",
+    "version": "4.10.9",
     "description": "React UI library for progressive web and hybrid apps",
     "homepage": "https://mobiscroll.com/",
     "license": "Apache-2.0",

src/js/classes/frame.js

@@ -638,6 +638,7 @@ export const Frame = function (el, settings, inherit) {
                     });
 
                     if ($label && $label.length) {
+                        tapOff($label);
                         that.tap($label, function (ev) {
                             ev.preventDefault();
                             if (ev.target !== $elm[0]) {

src/js/classes/scroller.js

@@ -81,11 +81,11 @@ export const Scroller = function (el, settings, inherit) {
             maxSelect = isNumeric(wheel.multiple) ? wheel.multiple : Infinity;
 
         if (trigger('onItemTap', {
-                target: $item[0],
-                index: i,
-                value: val,
-                selected: $item.hasClass('mbsc-sc-itm-sel')
-            }) !== false && !that._prevItemTap) {
+            target: $item[0],
+            index: i,
+            value: val,
+            selected: $item.hasClass('mbsc-sc-itm-sel')
+        }) !== false && !that._prevItemTap) {
 
             // Select item on tap
             if (wheel.multiple && !wheel._disabled[val]) {
@@ -634,6 +634,7 @@ export const Scroller = function (el, settings, inherit) {
 
                 // TODO: this should be done on initialization, not on show
                 var w = initWheel(ww, l);
+                var topMargin = !isPointer || (s.rows % 2) ? itemHeight3d / 2 : 0;
                 wheels[l] = w;
 
                 maxPopupWidth += s.maxWidth ? (s.maxWidth[l] || s.maxWidth) : (s.width ? (s.width[l] || s.width) : 0);
@@ -653,7 +654,7 @@ export const Scroller = function (el, settings, inherit) {
                         '<div data-index="' + l + '" data-step="-1" class="mbsc-sc-btn mbsc-sc-btn-minus ' + (s.btnMinusClass || '') + '"></div>' : '') + // - button
                     '<div class="mbsc-sc-lbl">' + lbl + '</div>' + // Wheel label
                     '<div class="mbsc-sc-whl-c"' +
-                    ' style="height:' + itemHeight3d + 'px;margin-top:-' + (itemHeight3d / 2 + 1) + 'px;' + style + '">' +
+                    ' style="height:' + itemHeight3d + 'px;margin-top:-' + (topMargin + 1) + 'px;' + style + '">' +
                     '<div class="mbsc-sc-whl-sc" style="top:' + ((itemHeight3d - itemHeight) / 2) + 'px;">';
 
                 // Create wheel values
@@ -885,7 +886,7 @@ Scroller.prototype = {
         timeUnit: 0.08,
         checkIcon: 'checkmark',
         compClass: 'mbsc-sc',
-        validate: function () {},
+        validate: function () { },
         formatValue: function (d) {
             return d.join(' ');
         },

src/js/classes/stepper.js

@@ -62,7 +62,9 @@ export const Stepper = function (control, settings) {
 
         if (val == min) {
             $btnMinus.addClass('mbsc-disabled');
-        } else if (val == max) {
+        }
+
+        if (val == max) {
             $btnPlus.addClass('mbsc-disabled');
         }
 

src/js/core/core.js

@@ -1,5 +1,5 @@
 /*!
- * Mobiscroll v4.10.8
+ * Mobiscroll v4.10.9
  * http://mobiscroll.com
  *
  *
@@ -106,7 +106,7 @@ extend(util, {
 
 ms = extend(mobiscroll, {
     $: $,
-    version: '4.10.8',
+    version: '4.10.9',
     autoTheme: 'mobiscroll',
     themes: {
         form: {},
@@ -243,7 +243,7 @@ const Base = function (el, settings) {
             preset = that._presets[s.preset];
 
             if (preset) {
-                preset = preset.call(el, that, settings);
+                preset = preset.call(el, that, settings, resp);
                 extend(s, preset, settings, resp);
             }
         }

src/js/frameworks/angular.ts

@@ -497,8 +497,15 @@ export class MbscControlBase extends MbscCloneBase implements ControlValueAccess
         let that = this;
         $(element || this.element).on('change', function () {
             that.zone.run(function () {
-                if (that.element.value !== that.instance._value && that.enableManualEdit) {
-                    that.instance.setVal(that.element.value, true, true);
+                const elmValue = that.element.value;
+                const instValue = that.instance._value;
+                // the element's value cannot be null, if the element is empty, it will be an empty string
+                // also the instance _value cannot be an empty string, bc. if the value is empty, under the hood
+                // the _value will be set to null
+                // SO the null and '' values are treated as equal, and there should not be a setVal call when these are to be used,
+                // otherwise it will be an infinite loop.
+                if (elmValue !== instValue && (instValue !== null || elmValue !== '') && that.enableManualEdit) {
+                    that.instance.setVal(elmValue, true, true);
                 } else {
                     let value = that.instance.getVal();
                     if (that.control) {

src/scss/forms/forms.ios.colors.scss

@@ -75,10 +75,10 @@ $mbsc-ios-dark-colors: map-merge($mbsc-ios-dark-colors, (
 
     // default background color
     @if (lightness($background) > 50%) {
-      $background: adjust-hue(darken(saturate($background, 19%), 2%), 240%);
+      $background: adjust-hue(darken(saturate($background, 19%), 2%), 240deg);
     }
     @else {
-      $background: adjust-hue(lighten(desaturate($background, 19%), 10%), 240%);
+      $background: adjust-hue(lighten(desaturate($background, 19%), 10%), 240deg);
     }
 
     // overwrite custom variables

src/scss/page/page.ios.colors.scss

@@ -31,10 +31,10 @@ $mbsc-ios-dark-colors: map-merge($mbsc-ios-dark-colors, (
     $button: map-get($colors, 'button');
 
     @if (lightness($background) > 50%) {
-      $background: adjust-hue(darken(saturate($background, 19%), 2%), 240%);
+      $background: adjust-hue(darken(saturate($background, 19%), 2%), 240deg);
     }
     @else {
-      $background: adjust-hue(lighten(desaturate($background, 19%), 10%), 240%);
+      $background: adjust-hue(lighten(desaturate($background, 19%), 10%), 240deg);
     }
 
     // get custom params

src/scss/scroller/scroller.ios.colors.scss

@@ -41,7 +41,7 @@
     $button-active: '';
     $top-bottom-wheel-border: '';
     @if (lightness($background) > 50%) {
-      $top-bottom-frame: adjust-hue(darken(saturate($background, 12%), 13%), 216%);
+      $top-bottom-frame: adjust-hue(darken(saturate($background, 12%), 13%), 216deg);
       $border-color: darken($background-limited, 17%);
       $item-3d: darken($background-limited, 33%);
       $popup-border: $border-color;