@justeat/fozzie
Advanced tools
Comparing version 9.0.0-beta.11 to 9.0.0
@@ -8,3 +8,3 @@ "use strict"; | ||
enumerable: true, | ||
get: function () { | ||
get: function get() { | ||
return _breakpointHelper.getBreakpoints; | ||
@@ -15,3 +15,3 @@ } | ||
enumerable: true, | ||
get: function () { | ||
get: function get() { | ||
return _breakpointHelper.getCurrentScreenWidth; | ||
@@ -22,3 +22,3 @@ } | ||
enumerable: true, | ||
get: function () { | ||
get: function get() { | ||
return _breakpointHelper.isWithinBreakpoint; | ||
@@ -25,0 +25,0 @@ } |
@@ -8,2 +8,14 @@ "use strict"; | ||
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); } | ||
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } | ||
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); } | ||
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; } | ||
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } | ||
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; } | ||
/** | ||
@@ -14,10 +26,10 @@ * @overview Breakpoint handler | ||
*/ | ||
const getBreakpoints = () => { | ||
const output = {}; // Append hidden element to body | ||
var getBreakpoints = function getBreakpoints() { | ||
var output = {}; // Append hidden element to body | ||
const screenSizer = document.createElement('div'); | ||
var screenSizer = document.createElement('div'); | ||
screenSizer.classList.add('c-screen-sizer'); | ||
document.body.appendChild(screenSizer); // It should have a 'content' property containing the breakpoints | ||
const breakpoints = window.getComputedStyle(document.querySelector('.c-screen-sizer')).getPropertyValue('content').replace(/["']/g, '').split(','); // Gives a list of breakpoints in the form ['narrow:414px', ...etc] | ||
var breakpoints = window.getComputedStyle(document.querySelector('.c-screen-sizer')).getPropertyValue('content').replace(/["']/g, '').split(','); // Gives a list of breakpoints in the form ['narrow:414px', ...etc] | ||
// When there is no content, at this stage breakpoints should be [''] | ||
@@ -29,5 +41,9 @@ | ||
return breakpoints.reduce((prev, current) => { | ||
return breakpoints.reduce(function (prev, current) { | ||
// `current` is of the form 'narrow:414px' | ||
const [breakpointName, breakpointValue] = current.split(':'); | ||
var _current$split = current.split(':'), | ||
_current$split2 = _slicedToArray(_current$split, 2), | ||
breakpointName = _current$split2[0], | ||
breakpointValue = _current$split2[1]; | ||
prev[breakpointName] = breakpointValue; // <- the initial value is used for the first iteration | ||
@@ -42,7 +58,7 @@ // The object, e.g., { 'narrow': '414px' } is returned to be used as `prev` in the next iteration | ||
const createBreakpointArray = breakpoints => { | ||
var createBreakpointArray = function createBreakpointArray(breakpoints) { | ||
// Order the breakpoints from widest to narrowest, | ||
// takes the form [['narrow', '414px'], [...etc]] | ||
const bps = []; | ||
Object.keys(breakpoints).forEach(key => { | ||
var bps = []; | ||
Object.keys(breakpoints).forEach(function (key) { | ||
bps.unshift([key, breakpoints[key]]); | ||
@@ -55,11 +71,11 @@ }); | ||
const getCurrentScreenWidth = () => { | ||
const currentWidth = window.innerWidth; | ||
const breakpoints = getBreakpoints(); | ||
const bps = createBreakpointArray(breakpoints); | ||
var getCurrentScreenWidth = function getCurrentScreenWidth() { | ||
var currentWidth = window.innerWidth; | ||
var breakpoints = getBreakpoints(); | ||
var bps = createBreakpointArray(breakpoints); | ||
for (let i = 0; i < bps.length; i++) { | ||
for (var i = 0; i < bps.length; i++) { | ||
// Loops through the breakpoints (in descending order) | ||
// returning the first one that is narrower than currentWidth. | ||
const breakpointWidth = parseInt(bps[i][1], 10); // This also strips the 'px' from the string | ||
var breakpointWidth = parseInt(bps[i][1], 10); // This also strips the 'px' from the string | ||
@@ -78,15 +94,19 @@ if (i === bps.length - 1 || currentWidth > breakpointWidth) { | ||
const isWithinBreakpoint = breakpointString => { | ||
const operatorRegex = /[<>=]+/; | ||
const operatorMatch = breakpointString.match(operatorRegex); | ||
const operator = operatorMatch ? operatorMatch[0] : ''; | ||
const [, breakpoint] = breakpointString.split(operatorRegex); | ||
const currentScreenWidth = window.innerWidth; | ||
const breakpoints = getBreakpoints(); | ||
const bps = createBreakpointArray(breakpoints); // We loop through the breakpoint array until we get a match. | ||
var isWithinBreakpoint = function isWithinBreakpoint(breakpointString) { | ||
var operatorRegex = /[<>=]+/; | ||
var operatorMatch = breakpointString.match(operatorRegex); | ||
var operator = operatorMatch ? operatorMatch[0] : ''; | ||
var _breakpointString$spl = breakpointString.split(operatorRegex), | ||
_breakpointString$spl2 = _slicedToArray(_breakpointString$spl, 2), | ||
breakpoint = _breakpointString$spl2[1]; | ||
var currentScreenWidth = window.innerWidth; | ||
var breakpoints = getBreakpoints(); | ||
var bps = createBreakpointArray(breakpoints); // We loop through the breakpoint array until we get a match. | ||
// If we match we return the px value as an int. If we do not match we return false | ||
const breakpointToPX = breakpointName => { | ||
let match = false; | ||
bps.forEach(bp => { | ||
var breakpointToPX = function breakpointToPX(breakpointName) { | ||
var match = false; | ||
bps.forEach(function (bp) { | ||
if (bp[0] === breakpointName) { | ||
@@ -99,3 +119,3 @@ match = parseInt(bp[1], 10); | ||
const breakpointInPX = breakpointToPX(breakpoint); // If the breakpoint passed in does not match any we; | ||
var breakpointInPX = breakpointToPX(breakpoint); // If the breakpoint passed in does not match any we; | ||
@@ -106,3 +126,3 @@ if (!breakpointInPX) { | ||
const mediaQuery = { | ||
var mediaQuery = { | ||
'<': currentScreenWidth < breakpointInPX, | ||
@@ -114,3 +134,3 @@ '<=': currentScreenWidth <= breakpointInPX, | ||
}; | ||
const result = mediaQuery[operator]; | ||
var result = mediaQuery[operator]; | ||
@@ -117,0 +137,0 @@ if (result == null) { |
@@ -5,3 +5,3 @@ { | ||
"description": "UI Web Framework for the Just Eat Global Platform", | ||
"version": "9.0.0-beta.11", | ||
"version": "9.0.0", | ||
"main": "dist/js/index.js", | ||
@@ -8,0 +8,0 @@ "files": [ |
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
No v1
QualityPackage is not semver >=1. This means it is not stable and does not support ^ ranges.
Found 1 instance in 1 package
274791
65
125
0