@rio-cloud/rio-uikit 0.16.1-beta.21 → 0.16.1-beta.22

package/utils/addFocusListener.js

@@ -9,21 +9,17 @@
 export default function addFocusListener(handler) {
   var useFocusin = !document.addEventListener;
   var remove;
-
   if (useFocusin) {
     document.attachEvent('onfocusin', handler);
-
     remove = function remove() {
       return document.detachEvent('onfocusin', handler);
     };
   } else {
     document.addEventListener('focus', handler, true);
-
     remove = function remove() {
       return document.removeEventListener('focus', handler, true);
     };
   }
-
   return {
     remove: remove
   };

package/utils/arrayMove.js

@@ -1,18 +1,15 @@
 import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
-
 // taken from https://github.com/sindresorhus/array-move
 // but added here so it will be compiled to es5 as the original library was not nad failed iin IE11
+
 var arrayMoveMutate = function arrayMoveMutate(array, from, to) {
   var startIndex = to < 0 ? array.length + to : to;
   var item = array.splice(from, 1)[0];
   array.splice(startIndex, 0, item);
 };
-
 var arrayMove = function arrayMove(array, from, to) {
   var newArray = _toConsumableArray(array);
-
   arrayMoveMutate(newArray, from, to);
   return newArray;
 };
-
 export default arrayMove;

package/utils/buttonEffect.js

@@ -8,27 +8,25 @@ export var createButtonRipple = function createButtonRipple(event, target) {
   circle.style.left = "".concat(event.clientX - buttonRect.left - radius, "px");
   circle.style.top = "".concat(event.clientY - buttonRect.top - radius, "px");
   circle.classList.add('btn-ripple');
-  var rippleElement = button.getElementsByClassName('btn-ripple')[0]; // Cleanup previous ripple element from current button in case there
-  // are multiple clicks on the button itself
+  var rippleElement = button.getElementsByClassName('btn-ripple')[0];
 
+  // Cleanup previous ripple element from current button in case there
+  // are multiple clicks on the button itself
   if (rippleElement) {
     rippleElement.remove();
   }
+  button.appendChild(circle);
 
-  button.appendChild(circle); // Cleanup ripple element after some time
-
+  // Cleanup ripple element after some time
   setTimeout(function () {
     return circle.remove();
   }, 1000);
 };
-
 var isTargetEligibleForEffect = function isTargetEligibleForEffect(target) {
   if (!target || !target.className) {
     return false;
   }
-
   var className = target.className;
-
   if (typeof className === 'string' || typeof className === 'array') {
     var isButton = className.includes('btn ');
     var isNotButtonComponent = !className.includes('btn-component');
@@ -37,28 +35,22 @@ var isTargetEligibleForEffect = function isTargetEligibleForEffect(target) {
     var isNotDisabled = !className.includes('disabled');
     return isButton && isNotButtonComponent && isNotDisabled && isNotLinkButton && isNotActionButton;
   }
-
   return false;
 };
-
 var enableButtonRipple = function enableButtonRipple(event) {
   var target = event.target;
-
   if (target) {
     var isButton = isTargetEligibleForEffect(target);
     var isChildOfButton = !isButton && isTargetEligibleForEffect(target.parentElement);
-
     if (isButton || isChildOfButton) {
       createButtonRipple(event, isChildOfButton ? target.parentElement : target);
     }
   }
 };
-
 export var registerButtonEffect = function (document) {
   if (!document) {
     return;
   }
-
   document.addEventListener('mousedown', enableButtonRipple, false);
   document.addEventListener('touchstart', enableButtonRipple, false);
 }(document);

package/utils/cssuseragent.js

@@ -0,0 +1,320 @@
+/**
+ * CssUserAgent (cssua.js) v2.1.31
+ * http://cssuseragent.org
+ *
+ * Copyright (c)2006-2015 Stephen M. McKamey.
+ * Licensed under The MIT License.
+ */
+/*jshint smarttabs:true, regexp:false, browser:true */
+
+/**
+ * @param html {Object} root DOM element
+ * @param userAgent {string} browser userAgent string
+ * @return {Object}
+ */
+export var cssua = function cssua(html, userAgent, sa) {
+  'use strict';
+
+  /**
+   * @const
+   * @type {string}
+   */
+  var PREFIX = ' ua-';
+
+  /**
+   * @const
+   * @type {RegExp}
+   */
+  var R_Platform = /\s*([\-\w ]+)[\s\/\:]([\d_]+\b(?:[\-\._\/]\w+)*)/;
+
+  /**
+   * @const
+   * @type {RegExp}
+   */
+  var R_Version = /([\w\-\.]+[\s\/][v]?[\d_]+\b(?:[\-\._\/]\w+)*)/g;
+
+  /**
+   * @const
+   * @type {RegExp}
+   */
+  var R_BlackBerry = /\b(?:(blackberry\w*|bb10)|(rim tablet os))(?:\/(\d+\.\d+(?:\.\w+)*))?/;
+
+  /**
+   * @const
+   * @type {RegExp}
+   */
+  var R_Silk = /\bsilk-accelerated=true\b/;
+
+  /**
+   * @const
+   * @type {RegExp}
+   */
+  var R_FluidApp = /\bfluidapp\b/;
+
+  /**
+   * @const
+   * @type {RegExp}
+   */
+  var R_desktop = /(\bwindows\b|\bmacintosh\b|\blinux\b|\bunix\b)/;
+
+  /**
+   * @const
+   * @type {RegExp}
+   */
+  var R_mobile = /(\bandroid\b|\bipad\b|\bipod\b|\bwindows phone\b|\bwpdesktop\b|\bxblwp7\b|\bzunewp7\b|\bwindows ce\b|\bblackberry\w*|\bbb10\b|\brim tablet os\b|\bmeego|\bwebos\b|\bpalm|\bsymbian|\bj2me\b|\bdocomo\b|\bpda\b|\bchtml\b|\bmidp\b|\bcldc\b|\w*?mobile\w*?|\w*?phone\w*?)/;
+
+  /**
+   * @const
+   * @type {RegExp}
+   */
+  var R_game = /(\bxbox\b|\bplaystation\b|\bnintendo\s+\w+)/;
+
+  /**
+   * The root CssUserAgent
+   * @type {Object}
+   */
+  var cssua = {
+    parse:
+    /**
+     * @param uaStr {string}
+     * @return {Object}
+     */
+    function parse(uaStr, sa) {
+      /**
+       * @type {Object}
+       */
+      var ua = {};
+      if (sa) {
+        ua.standalone = sa;
+      }
+      uaStr = ('' + uaStr).toLowerCase();
+      if (!uaStr) {
+        return ua;
+      }
+      var i,
+        count,
+        raw = uaStr.split(/[()]/);
+      for (var j = 0, rawCount = raw.length; j < rawCount; j++) {
+        if (j % 2) {
+          // inside parens covers platform identifiers
+          var platforms = raw[j].split(';');
+          for (i = 0, count = platforms.length; i < count; i++) {
+            if (R_Platform.exec(platforms[i])) {
+              var key = RegExp.$1.split(' ').join('_'),
+                val = RegExp.$2;
+
+              // if duplicate entries favor highest version
+              if (!ua[key] || parseFloat(ua[key]) < parseFloat(val)) {
+                ua[key] = val;
+              }
+            }
+          }
+        } else {
+          // outside parens covers most version identifiers
+          var uas = raw[j].match(R_Version);
+          if (uas) {
+            for (i = 0, count = uas.length; i < count; i++) {
+              var parts = uas[i].split(/[\/\s]+/);
+              if (parts.length && parts[0] !== 'mozilla') {
+                ua[parts[0].split(' ').join('_')] = parts.slice(1).join('-');
+              }
+            }
+          }
+        }
+      }
+      if (R_mobile.exec(uaStr)) {
+        // mobile device indicators
+        ua.mobile = RegExp.$1;
+        if (R_BlackBerry.exec(uaStr)) {
+          delete ua[ua.mobile];
+          ua.blackberry = ua.version || RegExp.$3 || RegExp.$2 || RegExp.$1;
+          if (RegExp.$1) {
+            // standardize non-tablet blackberry
+            ua.mobile = 'blackberry';
+          } else if (ua.version === '0.0.1') {
+            // fix playbook 1.0 quirk
+            ua.blackberry = '7.1.0.0';
+          }
+        }
+      } else if (R_game.exec(uaStr)) {
+        // game console indicators
+        ua.game = RegExp.$1;
+        var game = ua.game.split(' ').join('_');
+        if (ua.version && !ua[game]) {
+          ua[game] = ua.version;
+        }
+      } else if (R_desktop.exec(uaStr)) {
+        // desktop OS indicators
+        ua.desktop = RegExp.$1;
+      }
+
+      // platform naming standardizations
+      if (ua.intel_mac_os_x) {
+        ua.mac_os_x = ua.intel_mac_os_x.split('_').join('.');
+        delete ua.intel_mac_os_x;
+      } else if (ua.cpu_iphone_os) {
+        ua.ios = ua.cpu_iphone_os.split('_').join('.');
+        delete ua.cpu_iphone_os;
+      } else if (ua.cpu_os) {
+        ua.ios = ua.cpu_os.split('_').join('.');
+        delete ua.cpu_os;
+      } else if (ua.mobile === 'iphone' && !ua.ios) {
+        ua.ios = '1';
+      }
+
+      // UA naming standardizations
+      if (ua.opera && ua.version) {
+        ua.opera = ua.version;
+        // version/XXX refers to opera
+        delete ua.blackberry;
+      } else if (R_Silk.exec(uaStr)) {
+        ua.silk_accelerated = true;
+      } else if (R_FluidApp.exec(uaStr)) {
+        ua.fluidapp = ua.version;
+      }
+      if (ua.edge) {
+        delete ua.applewebkit;
+        delete ua.safari;
+        delete ua.chrome;
+        delete ua.android;
+      }
+      if (ua.applewebkit) {
+        ua.webkit = ua.applewebkit;
+        delete ua.applewebkit;
+        if (ua.opr) {
+          ua.opera = ua.opr;
+          delete ua.opr;
+          delete ua.chrome;
+        }
+        if (ua.safari) {
+          if (ua.chrome || ua.crios || ua.fxios || ua.opera || ua.silk || ua.fluidapp || ua.phantomjs || ua.mobile && !ua.ios) {
+            delete ua.safari;
+            if (ua.vivaldi) {
+              delete ua.chrome;
+            }
+          } else if (ua.version && !ua.rim_tablet_os) {
+            ua.safari = ua.version;
+          } else {
+            ua.safari = {
+              419: '2.0.4',
+              417: '2.0.3',
+              416: '2.0.2',
+              412: '2.0',
+              312: '1.3',
+              125: '1.2',
+              85: '1.0'
+            }[parseInt(ua.safari, 10)] || ua.safari;
+          }
+        }
+      } else if (ua.msie || ua.trident) {
+        if (!ua.opera) {
+          // standardize Internet Explorer
+          ua.ie = ua.msie || ua.rv;
+        }
+        delete ua.msie;
+        delete ua.android;
+        if (ua.windows_phone_os) {
+          // standardize window phone
+          ua.windows_phone = ua.windows_phone_os;
+          delete ua.windows_phone_os;
+        } else if (ua.mobile === 'wpdesktop' || ua.mobile === 'xblwp7' || ua.mobile === 'zunewp7') {
+          ua.mobile = 'windows desktop';
+          ua.windows_phone = +ua.ie < 9 ? '7.0' : +ua.ie < 10 ? '7.5' : '8.0';
+          delete ua.windows_nt;
+        }
+      } else if (ua.gecko || ua.firefox) {
+        ua.gecko = ua.rv;
+      }
+      if (ua.rv) {
+        delete ua.rv;
+      }
+      if (ua.version) {
+        delete ua.version;
+      }
+      return ua;
+    },
+    format:
+    /**
+     * @param ua {Object}
+     * @return {string}
+     */
+    function format(ua) {
+      /**
+       * @param b {string} browser key
+       * @param v {string} browser value
+       * @return {string} formatted CSS classes
+       */
+      function format(b, v) {
+        b = b.split('.').join('-');
+
+        /**
+         * @type {string}
+         */
+        var css = PREFIX + b;
+        if (typeof v === 'string') {
+          v = v.split(' ').join('_').split('.').join('-');
+          var i = v.indexOf('-');
+          while (i > 0) {
+            // loop through chopping last '-' to end off
+            // concat result onto return string
+            css += PREFIX + b + '-' + v.substring(0, i);
+            i = v.indexOf('-', i + 1);
+          }
+          css += PREFIX + b + '-' + v;
+        }
+        return css;
+      }
+
+      /**
+       * @type {string}
+       */
+      var uaCss = '';
+      for (var b in ua) {
+        if (b && ua.hasOwnProperty(b)) {
+          uaCss += format(b, ua[b]);
+        }
+      }
+
+      // user-agent classNames
+      return uaCss;
+    },
+    encode:
+    /**
+     * Encodes parsed userAgent object as a compact URI-Encoded key-value collection
+     * @param ua {Object}
+     * @return {string}
+     */
+    function encode(ua) {
+      var query = '';
+      for (var b in ua) {
+        if (b && ua.hasOwnProperty(b)) {
+          if (query) {
+            query += '&';
+          }
+          query += encodeURIComponent(b) + '=' + encodeURIComponent(ua[b]);
+        }
+      }
+      return query;
+    }
+  };
+
+  /**
+   * @const
+   * @type {Object}
+   */
+  cssua.userAgent = cssua.ua = cssua.parse(userAgent, sa);
+
+  /**
+   * @const
+   * @type {string}
+   */
+  var ua = cssua.format(cssua.ua) + ' js';
+
+  // append CSS classes to HTML node
+  if (html.className) {
+    html.className = html.className.replace(/\bno-js\b/g, '') + ua;
+  } else {
+    html.className = ua.substr(1);
+  }
+  return cssua;
+};

package/utils/deviceUtils.js

@@ -1,16 +1,15 @@
-// As "cssuseragent" is accessing the html dom object directly without checking whether it exists or not, we need to
-// use old shool require() to have a conditional import only when html really exists. This avoids issues when
-// running the UIKIT in a web-worker
+import { cssua } from './cssuseragent';
+
+// As "cssuseragent" is accessing the html dom object directly without checking whether it exists or not,
+// we need to initialize only when html really exists. This avoids issues when running the UIKIT in a web-worker
 if (document && document.documentElement) {
-  // eslint-disable-next-line global-require
-  import('cssuseragent');
+  cssua(document.documentElement, navigator.userAgent, navigator.standalone);
 }
-
 var isDefined = function isDefined(val) {
   return val !== undefined && val !== null;
-}; // see https://patrickhlauke.github.io/touch/touchscreen-detection/ for reference
-
+};
 
+// see https://patrickhlauke.github.io/touch/touchscreen-detection/ for reference
 export var hasTouch = function hasTouch() {
   if (window.PointerEvent && isDefined(navigator.maxTouchPoints)) {
     // if Pointer Events are supported, just check maxTouchPoints
@@ -25,10 +24,10 @@ export var hasTouch = function hasTouch() {
     // last resort - check for exposed touch events API / event handler
     return true;
   }
-
   return false;
-}; // Screen sizes
+};
 
+// Screen sizes
 export var MOBILE_SCREEN = 480;
 export var SCREEN_SM = 768;
 export var SCREEN_MD = 992;
@@ -49,30 +48,29 @@ export var inIframe = function inIframe() {
   } catch (_) {
     return true;
   }
-}; // Disables the Zoom for the mobile devices.
+};
+
+// Disables the Zoom for the mobile devices.
 // This is not good for accessibility but makes the webpage feel more like a native app.
 // <meta name="viewport" content="user-scalable=0 ..." />
-
 var USER_SCALABLE = 'user-scalable=0 maximum-scale=1';
 export var toggleZoomOnMobile = function toggleZoomOnMobile() {
   if (!document) {
     return;
   }
-
   var viewportMeta = document.head.querySelector('[name="viewport"]');
-
   if (!viewportMeta) {
     return;
   }
+  var isScalable = viewportMeta.content.includes(USER_SCALABLE);
 
-  var isScalable = viewportMeta.content.includes(USER_SCALABLE); // Restrict the zoom for mobile if not yet set
-
+  // Restrict the zoom for mobile if not yet set
   if (isMobile() && !isScalable) {
     viewportMeta.content += " ".concat(USER_SCALABLE);
     return;
-  } // Remove the setting, for non mobile cases
-
+  }
 
+  // Remove the setting, for non mobile cases
   if (!isMobile() && isScalable) {
     viewportMeta.content = viewportMeta.content.replace(USER_SCALABLE, '').trim();
     return;

package/utils/getDropDirection.js

@@ -4,12 +4,12 @@ export default function getDropDirection(toggleNode, menuNode) {
   if (!toggleNode || !menuNode) {
     return {};
   }
-
   var clientRect = toggleNode.getBoundingClientRect();
   var pageX = clientRect.x;
   var pageY = clientRect.y;
-  var toggleHeight = toggleNode.offsetHeight; // menu has its height and width already when closed because visibility is collapse
+  var toggleHeight = toggleNode.offsetHeight;
 
+  // menu has its height and width already when closed because visibility is collapse
   var menuWidth = menuNode.offsetWidth;
   var menuHeight = menuNode.offsetHeight;
   var spaceUp = pageY - toggleHeight - menuHeight - window.pageYOffset;

package/utils/getOffsetTopWholeScreen.js

@@ -2,6 +2,5 @@ export default function getOffsetTopWholeScreen(currentTarget) {
   if (currentTarget.offsetParent) {
     return getOffsetTopWholeScreen(currentTarget.offsetParent) + currentTarget.offsetTop;
   }
-
   return currentTarget.offsetTop;
 }

package/utils/init.js

@@ -5,48 +5,37 @@ import throttle from 'lodash/fp/throttle';
 import { inIframe } from './deviceUtils';
 import versionJson from '../version.json';
 var uikitVersion = versionJson.version;
-
 var isProdEnv = function isProdEnv() {
   return process.env.NODE_ENV === 'production';
 };
-
 var isTestEnv = function isTestEnv() {
   return process.env.NODE_ENV === 'test';
 };
-
 var isLocalhost = function isLocalhost() {
   var _window, _window$location;
-
   return ((_window = window) === null || _window === void 0 ? void 0 : (_window$location = _window.location) === null || _window$location === void 0 ? void 0 : _window$location.hostname) === 'localhost';
-}; // https://css-tricks.com/the-trick-to-viewport-units-on-mobile/
-
+};
 
+// https://css-tricks.com/the-trick-to-viewport-units-on-mobile/
 var calcViewportUnits = function calcViewportUnits() {
   var vh = window.innerHeight * 0.01;
   return "--vh: ".concat(vh, "px");
 };
-
 var logStyled = function logStyled(log) {
   return console.log('%c%s', 'color: #697a8b;', log);
 };
-
 var printPoweredByRIO = function printPoweredByRIO() {
   logStyled('- - - - - - - - - - - - - - - - - - - - - - -');
-
   if (!isLocalhost() && !inIframe()) {
     logStyled("  ____  ___ ___    _   _ ___ _  _____ _____\n |  _ \\|_ _/ _ \\  | | | |_ _| |/ /_ _|_   _|\n | |_) || | | | | | | | || || ' / | |  | |\n |  _ < | | |_| | | |_| || || . \\ | |  | |\n |_| \\_\\___\\___/   \\___/|___|_|\\_\\___| |_|\n");
   }
-
   var message = [" Version ".concat(uikitVersion, " | https://uikit.developers.rio.cloud")];
-
   if (isProdEnv() && !inIframe()) {
     message.push('\n\n You are a Developer? RIO is hiring! | https://rio.cloud/en/career');
   }
-
   logStyled(message.join(''));
   logStyled('- - - - - - - - - - - - - - - - - - - - - -');
 };
-
 var checkForReleaseVersion = /*#__PURE__*/function () {
   var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
     var remoteVersionsListUrl, response, data;
@@ -58,9 +47,7 @@ var checkForReleaseVersion = /*#__PURE__*/function () {
               _context.next = 2;
               break;
             }
-
             return _context.abrupt("return");
-
           case 2:
             remoteVersionsListUrl = 'https://uikit.developers.rio.cloud/versionsList.json';
             _context.prev = 3;
@@ -68,28 +55,22 @@ var checkForReleaseVersion = /*#__PURE__*/function () {
             return fetch(remoteVersionsListUrl, {
               method: 'get'
             });
-
           case 6:
             response = _context.sent;
             _context.next = 9;
             return response.json();
-
           case 9:
             data = _context.sent;
-
             if (data.latest_release !== uikitVersion) {
               console.log("\uD83C\uDD95 UIKIT version ".concat(data.latest_release, " is the latest released version! Your are using ").concat(uikitVersion));
             }
-
             _context.next = 16;
             break;
-
           case 13:
             _context.prev = 13;
             _context.t0 = _context["catch"](3);
             // console.warn(error);
             console.warn("Faild to fetch versionsList from ".concat(remoteVersionsListUrl));
-
           case 16:
           case "end":
             return _context.stop();
@@ -97,21 +78,17 @@ var checkForReleaseVersion = /*#__PURE__*/function () {
       }
     }, _callee, null, [[3, 13]]);
   }));
-
   return function checkForReleaseVersion() {
     return _ref.apply(this, arguments);
   };
 }();
-
 var checkMatchingUkitVersions = function checkMatchingUkitVersions() {
   Array.from(document.querySelectorAll('link[rel="stylesheet"]')).forEach(function (cssLink) {
     var href = cssLink.href;
-
     if (href.includes('uikit.developers.rio.cloud')) {
       var _URL$pathname$split = new URL(href).pathname.split('/'),
-          _URL$pathname$split2 = _slicedToArray(_URL$pathname$split, 2),
-          uikitVersionCSS = _URL$pathname$split2[1];
-
+        _URL$pathname$split2 = _slicedToArray(_URL$pathname$split, 2),
+        uikitVersionCSS = _URL$pathname$split2[1];
       if (!href.includes(uikitVersion)) {
         console.warn(['You are using different UIKIT JS and CSS versions.\n', "Your current JS version is ".concat(uikitVersion, " and "), "your current CSS version is ".concat(uikitVersionCSS, ".\n"), 'If this is not on purpose, please fix it. Otherwise, this may lead to UI bugs.'].join(''));
       }
@@ -120,35 +97,27 @@ var checkMatchingUkitVersions = function checkMatchingUkitVersions() {
     }
   });
 };
-
 export var initDocumentBootstrapping = function initDocumentBootstrapping(document) {
   if (!document || !document.documentElement) {
     return;
   }
-
   if (!isTestEnv()) {
     console.group('UIKIT');
     console.log("Init document bootstrapping for ".concat(document.location.href));
   }
-
   var html = document.documentElement;
-
   var setViewportUnits = function setViewportUnits() {
     return html.setAttribute('style', calcViewportUnits());
   };
-
   window.addEventListener('orientationchange', throttle(1000, setViewportUnits));
   window.addEventListener('resize', throttle(1000, setViewportUnits));
   setViewportUnits();
-
   if (!window.CSS || !window.CSS.supports || !window.CSS.supports('gap: 1px')) {
     html.classList.add('css-no-gap');
   }
-
   if (html && inIframe()) {
     html.classList.add('window-iframe');
   }
-
   if (!isTestEnv()) {
     printPoweredByRIO();
     checkForReleaseVersion();

package/utils/logDeprecatedWarnings.js

@@ -1,7 +1,8 @@
 import has from 'lodash/fp/has';
-export var BASE_URL = 'https://uikit.developers.rio.cloud/'; // Logs deprecation warnings to console if prop is used.
-// use this function in the render method of a component.
+export var BASE_URL = 'https://uikit.developers.rio.cloud/';
 
+// Logs deprecation warnings to console if prop is used.
+// use this function in the render method of a component.
 export var logDeprecatedWarnings = function logDeprecatedWarnings() {
   var deprecatedProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
   var props = arguments.length > 1 ? arguments[1] : undefined;

package/utils/logPropError.js

@@ -1,6 +1,7 @@
 import has from 'lodash/fp/has';
-export var BASE_URL = 'https://uikit.developers.rio.cloud/'; // Logs prop errors.
+export var BASE_URL = 'https://uikit.developers.rio.cloud/';
 
+// Logs prop errors.
 export var logPropError = function logPropError() {
   var errorProps = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
   var props = arguments.length > 1 ? arguments[1] : undefined;