@spothero/ui 15.0.0-beta.2 → 15.0.0-beta.3

package/styles/utils/environment.js

@@ -0,0 +1,425 @@
+// Most of the methods are pulled from https://is.js.org/. That library has many others that we'll never use so they are added here and made to work with SSR.
+import {window as ssrWindow} from 'ssr-window';
+
+// const appVersion = (
+//     (ssrWindow.navigator && ssrWindow.navigator.appVersion) ||
+//     ''
+// ).toLowerCase();
+// const userAgent = (
+//     (ssrWindow.navigator && ssrWindow.navigator.userAgent) ||
+//     ''
+// ).toLowerCase();
+// const vendor = (
+//     (ssrWindow.navigator && ssrWindow.navigator.vendor) ||
+//     ''
+// ).toLowerCase();
+// const comparator = {
+//     '<': (a, b) => {
+//         return a < b;
+//     },
+//     '<=': (a, b) => {
+//         return a <= b;
+//     },
+//     '>': (a, b) => {
+//         return a > b;
+//     },
+//     '>=': (a, b) => {
+//         return a >= b;
+//     },
+// };
+// const compareVersion = (version, range) => {
+//     const string = String(range);
+//     const n = Number(string.match(/\d+/) || NaN);
+//     const op = string.match(/^[<>]=?|/)[0];
+//
+//     return comparator[op]
+//         ? comparator[op](version, n)
+//         : version === n || n !== n; // eslint-disable-line no-self-compare
+// };
+
+/**
+ * Utilities for working with the execution environment.
+ * @module EnvironmentUtils
+ */
+const EnvironmentUtils = {
+    // /**
+    //  * Determines whether the code is being executed in the browser.
+    //  * @static
+    //  * @function isBrowser
+    //  * @example
+    //  * EnvironmentUtils.isBrowser();
+    //  * @returns {Boolean} - Whether the environment is the browser.
+    //  */
+    // isBrowser() {
+    //     return typeof window !== 'undefined';
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed in Google Chrome.
+    //  * @static
+    //  * @function isChrome
+    //  * @param {Number|String} [range] - The version range to test against.
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isChrome();
+    //  * @returns {Boolean} - Whether the environment is Google Chrome.
+    //  */
+    // isChrome(range, ua = userAgent) {
+    //     const match = /google inc/.test(vendor)
+    //         ? ua.match(/(?:chrome|crios)\/(\d+)/)
+    //         : null;
+    //
+    //     return (
+    //         match !== null &&
+    //         !this.isOpera(range, ua) &&
+    //         compareVersion(match[1], range)
+    //     );
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed in Mozilla Firefox.
+    //  * @static
+    //  * @function isFirefox
+    //  * @param {Number|String} [range] - The version range to test against.
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isFirefox();
+    //  * @returns {Boolean} - Whether the environment is Mozilla Firefox.
+    //  */
+    // isFirefox(range, ua = userAgent) {
+    //     const match = ua.match(/(?:firefox|fxios)\/(\d+)/);
+    //
+    //     return match !== null && compareVersion(match[1], range);
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed in Apple Safari.
+    //  * @static
+    //  * @function isSafari
+    //  * @param {Number|String} [range] - The version range to test against.
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isSafari();
+    //  * @returns {Boolean} - Whether the environment is Apple Safari.
+    //  */
+    // isSafari(range, ua = userAgent) {
+    //     const match = ua.match(/version\/(\d+).+?safari/);
+    //
+    //     return match !== null && compareVersion(match[1], range);
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed in Microsoft Edge.
+    //  * @static
+    //  * @function isEdge
+    //  * @param {Number|String} [range] - The version range to test against.
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isEdge();
+    //  * @returns {Boolean} - Whether the environment is Microsoft Edge.
+    //  */
+    // isEdge(range, ua = userAgent) {
+    //     const match = ua.match(/edge\/(\d+)/);
+    //
+    //     return match !== null && compareVersion(match[1], range);
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed in Microsoft Internet Explorer.
+    //  * @static
+    //  * @function isIE
+    //  * @param {Number|String} [range] - The version range to test against.
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isIE();
+    //  * @returns {Boolean} - Whether the environment is Microsoft Internet Explorer.
+    //  */
+    // isIE(range, ua = userAgent) {
+    //     const match = ua.match(/(?:msie |trident.+?; rv:)(\d+)/);
+    //
+    //     return match !== null && compareVersion(match[1], range);
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed in Opera.
+    //  * @static
+    //  * @function isOpera
+    //  * @param {Number|String} [range] - The version range to test against.
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isOpera();
+    //  * @returns {Boolean} - Whether the environment is Opera.
+    //  */
+    // isOpera(range, ua = userAgent) {
+    //     const match = ua.match(/(?:^opera.+?version|opr)\/(\d+)/);
+    //
+    //     return match !== null && compareVersion(match[1], range);
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed in iOS.
+    //  * @static
+    //  * @function isiOS
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isiOS();
+    //  * @returns {Boolean} - Whether the environment is iOS.
+    //  */
+    // isiOS(ua = userAgent) {
+    //     return (
+    //         this.isiPhone(null, ua) ||
+    //         this.isiPad(null, ua) ||
+    //         this.isiPod(null, ua)
+    //     );
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed on an iPhone.
+    //  * @static
+    //  * @function isiPhone
+    //  * @param {Number|String} [range] - The version range to test against.
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isiPhone();
+    //  * EnvironmentUtils.isiPhone(9);
+    //  * EnvironmentUtils.isiPhone('>=7');
+    //  * EnvironmentUtils.isiPhone('<8');
+    //  * @returns {Boolean} - Whether the environment is iPhone.
+    //  */
+    // isiPhone(range, ua = userAgent) {
+    //     // avoid false positive for Facebook in-app browser on ipad;
+    //     // original iphone doesn't have the OS portion of the UA
+    //     const match = this.isiPad(null, ua)
+    //         ? null
+    //         : ua.match(/iphone(?:.+?os (\d+))?/i);
+    //
+    //     return match !== null && compareVersion(match[1] || 1, range);
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed on an iPad.
+    //  * @static
+    //  * @function isiPad
+    //  * @param {Number|String} [range] - The version range to test against.
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isiPad();
+    //  * EnvironmentUtils.isiPad(9);
+    //  * EnvironmentUtils.isiPad('>=7');
+    //  * EnvironmentUtils.isiPad('<8');
+    //  * @returns {Boolean} - Whether the environment is iPad.
+    //  */
+    // isiPad(range, ua = userAgent) {
+    //     const match = ua.match(/ipad.+?os (\d+)/i);
+    //
+    //     return match !== null && compareVersion(match[1], range);
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed on an iPod.
+    //  * @static
+    //  * @function isiPod
+    //  * @param {Number|String} [range] - The version range to test against.
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isiPod();
+    //  * EnvironmentUtils.isiPod(9);
+    //  * EnvironmentUtils.isiPod('>=7');
+    //  * EnvironmentUtils.isiPod('<8');
+    //  * @returns {Boolean} - Whether the environment is iPod.
+    //  */
+    // isiPod(range, ua = userAgent) {
+    //     const match = ua.match(/ipod.+?os (\d+)/i);
+    //
+    //     return match !== null && compareVersion(match[1], range);
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed in Android.
+    //  * @static
+    //  * @function isAndroid
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isAndroid();
+    //  * @returns {Boolean} - Whether the environment is Android.
+    //  */
+    // isAndroid(ua = userAgent) {
+    //     return /android/i.test(ua);
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed on an Android phone.
+    //  * @static
+    //  * @function isAndroidPhone
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isAndroidPhone();
+    //  * @returns {Boolean} - Whether the environment is Android phone.
+    //  */
+    // isAndroidPhone(ua = userAgent) {
+    //     return /android/i.test(ua) && /mobile/i.test(ua);
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed on an Android tablet.
+    //  * @static
+    //  * @function isAndroidTablet
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isAndroidTablet();
+    //  * @returns {Boolean} - Whether the environment is Android tablet.
+    //  */
+    // isAndroidTablet(ua = userAgent) {
+    //     return /android/i.test(ua) && !/mobile/i.test(ua);
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed on a Blackberry.
+    //  * @static
+    //  * @function isBlackberry
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isBlackberry();
+    //  * @returns {Boolean} - Whether the environment is Blackberry.
+    //  */
+    // isBlackberry(ua = userAgent) {
+    //     return /blackberry/i.test(ua) || /bb10/i.test(ua);
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed on a Windows phone.
+    //  * @static
+    //  * @function isWindowsPhone
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isWindowsPhone();
+    //  * @returns {Boolean} - Whether the environment is Windows phone.
+    //  */
+    // isWindowsPhone(ua = userAgent) {
+    //     return this.isWindows() && /phone/i.test(ua);
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed on a Windows tablet.
+    //  * @static
+    //  * @function isWindowsTablet
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isWindowsTablet();
+    //  * @returns {Boolean} - Whether the environment is Windows tablet.
+    //  */
+    // isWindowsTablet(ua = userAgent) {
+    //     return (
+    //         this.isWindows() && !this.isWindowsPhone(ua) && /touch/i.test(ua)
+    //     );
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed on Windows.
+    //  * @static
+    //  * @function isWindows
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isWindows();
+    //  * @returns {Boolean} - Whether the environment is Windows.
+    //  */
+    // isWindows() {
+    //     return /win/i.test(appVersion);
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed on a tablet.
+    //  * @static
+    //  * @function isTablet
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isTablet();
+    //  * @returns {Boolean} - Whether the environment is a tablet.
+    //  */
+    // isTablet(ua = userAgent) {
+    //     return (
+    //         this.isiPad(null, ua) ||
+    //         this.isAndroidTablet(ua) ||
+    //         this.isWindowsTablet(ua)
+    //     );
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed on a mobile device.
+    //  * @static
+    //  * @function isMobileDevice
+    //  * @param {String} [ua=navigator.userAgent] - The user agent to test against.
+    //  * @example
+    //  * EnvironmentUtils.isMobileDevice();
+    //  * @returns {Boolean} - Whether the environment is a mobile device.
+    //  */
+    // isMobileDevice(ua = userAgent) {
+    //     return (
+    //         this.isiPhone(null, ua) ||
+    //         this.isiPod(null, ua) ||
+    //         this.isAndroidPhone(ua) ||
+    //         this.isBlackberry(ua) ||
+    //         this.isWindowsPhone(ua)
+    //     );
+    // },
+    //
+    // /**
+    //  * Determines whether the code is being executed on a touch device.
+    //  * @static
+    //  * @function isTouchDevice
+    //  * @example
+    //  * EnvironmentUtils.isTouchDevice();
+    //  * @returns {Boolean} - Whether the environment is a touch device.
+    //  */
+    // isTouchDevice() {
+    //     return (
+    //         Boolean(document) &&
+    //         ('ontouchstart' in document.documentElement ||
+    //             ('DocumentTouch' in document.documentElement &&
+    //                 document instanceof window.DocumentTouch))
+    //     );
+    // },
+
+    /**
+     * Determines whether the display has a high density.
+     * @static
+     * @function isHighDensityDisplay
+     * @example
+     * EnvironmentUtils.isHighDensityDisplay();
+     * @returns {Boolean} - Whether the display is high density.
+     */
+    isHighDensityDisplay() {
+        return (
+            (ssrWindow.matchMedia &&
+                (ssrWindow.matchMedia(
+                    'only screen and (min-resolution: 124dpi), only screen and (min-resolution: 1.3dppx), only screen and (min-resolution: 48.8dpcm)'
+                ).matches ||
+                    ssrWindow.matchMedia(
+                        'only screen and (-webkit-min-device-pixel-ratio: 1.3), only screen and (-o-min-device-pixel-ratio: 2.6/2), only screen and (min--moz-device-pixel-ratio: 1.3), only screen and (min-device-pixel-ratio: 1.3)'
+                    ).matches)) ||
+            (ssrWindow.devicePixelRatio && ssrWindow.devicePixelRatio > 1.3)
+        );
+    },
+
+    // /**
+    //  * Returns a string based on browser util booleans, consumed by Segment and Optimizely
+    //  * @static
+    //  * @function getBrowserCategory
+    //  * @returns {String} - The browser string
+    //  */
+    // getBrowserCategory() {
+    //     if (this.isChrome()) {
+    //         return 'Chrome';
+    //     } else if (this.isFirefox()) {
+    //         return 'Firefox';
+    //     } else if (this.isSafari()) {
+    //         return 'Safari';
+    //     } else if (this.isEdge() || this.isIE()) {
+    //         return 'IE/Edge';
+    //     }
+    //
+    //     return 'Other';
+    // },
+};
+
+export default EnvironmentUtils;

package/styles/utils/number.js

@@ -0,0 +1,33 @@
+import isNumber from 'lodash/isNumber';
+import isUndefined from 'lodash/isUndefined';
+
+/**
+ * Utilities for working with numbers.
+ * @module NumberUtils
+ */
+const NumberUtils = {
+    /**
+     * Rounds a given number down to the nearest specified number.
+     * @static
+     * @function roundDownToNearestStep
+     * @param {Number} num - The number to round.
+     * @param {Number} step - The step to round down to.
+     * @example
+     * NumberUtils.roundDownToNearestStep(57, 30); // 30
+     * NumberUtils.roundDownToNearestStep(161, 15); // 150
+     * @returns {Number} - The rounded number.
+     */
+    roundDownToNearestStep(num, step) {
+        if (!isNumber(num)) {
+            throw new Error('You can only round numbers.');
+        }
+
+        if (isUndefined(step)) {
+            throw new Error('You must provide a step to round down to.');
+        }
+
+        return step * Math.floor(num / step);
+    },
+};
+
+export default NumberUtils;