foundation-sites - npm Package Compare versions

Comparing version 6.2.0 to 6.2.1

js/foundation.abide.js

@@ -86,7 +86,2 @@ 'use strict';
     switch ($el[0].type) {
-      case 'checkbox':
-      case 'radio':
-        isGood = $el[0].checked;
-        break;
-
       case 'select':
@@ -146,2 +141,24 @@ case 'select-one':
   /**
+   * Get the set of labels associated with a set of radio els in this order
+   * 2. The <label> with the attribute `[for="someInputId"]`
+   * 3. The `.closest()` <label>
+   *
+   * @param {Object} $el - jQuery object to check for required attribute
+   * @returns {Boolean} Boolean value depends on whether or not attribute is checked or empty
+   */
+  findRadioLabels($els) {
+    var labels = $els.map((i, el) => {
+      var id = el.id;
+      var $label = this.$element.find(`label[for="${id}"]`);
+
+      if (!$label.length) {
+        $label = $(el).closest('label');
+      }
+      return $label[0];
+    });
+
+    return $(labels);
+  }
+
+  /**
    * Adds the CSS error class as specified by the Abide settings to the label, input, and the form
@@ -166,2 +183,25 @@ * @param {Object} $el - jQuery object to add the class to
   /**
+   * Remove CSS error classes etc from an entire radio button group
+   * @param {String} groupName - A string that specifies the name of a radio button group
+   *
+   */
+
+  removeRadioErrorClasses(groupName) {
+    var $els = this.$element.find(`:radio[name="${groupName}"]`);
+    var $labels = this.findRadioLabels($els);
+    var $formErrors = this.findFormError($els);
+
+    if ($labels.length) {
+      $labels.removeClass(this.options.labelErrorClass);
+    }
+
+    if ($formErrors.length) {
+      $formErrors.removeClass(this.options.formErrorClass);
+    }
+
+    $els.removeClass(this.options.inputErrorClass).removeAttr('data-invalid');
+
+  }
+
+  /**
    * Removes CSS error class as specified by the Abide settings from the label, input, and the form
@@ -171,2 +211,7 @@ * @param {Object} $el - jQuery object to remove the class from
   removeErrorClasses($el) {
+    // radios need to clear all of the els
+    if($el[0].type == 'radio') {
+      return this.removeRadioErrorClasses($el.attr('name'));
+    }
+
     var $label = this.findLabel($el);
@@ -227,2 +272,3 @@ var $formError = this.findFormError($el);
 
+
     var goodToGo = [clearRequire, validated, customValidator, equalTo].indexOf(false) === -1;
@@ -280,17 +326,30 @@ var message = (goodToGo ? 'valid' : 'invalid') + '.zf.abide';
   validateText($el, pattern) {
-    // pattern = pattern ? pattern : $el.attr('pattern') ? $el.attr('pattern') : $el.attr('type');
+    // A pattern can be passed to this function, or it will be infered from the input's "pattern" attribute, or it's "type" attribute
     pattern = (pattern || $el.attr('pattern') || $el.attr('type'));
     var inputText = $el.val();
+    var valid = false;
 
-    // if text, check if the pattern exists, if so, test it, if no text or no pattern, return true.
-    return inputText.length ?
-      this.options.patterns.hasOwnProperty(pattern) ? this.options.patterns[pattern].test(inputText) :
-        pattern && pattern !== $el.attr('type') ?
-          new RegExp(pattern).test(inputText) :
-        true :
-      true;
+    if (inputText.length) {
+      // If the pattern attribute on the element is in Abide's list of patterns, then test that regexp
+      if (this.options.patterns.hasOwnProperty(pattern)) {
+        valid = this.options.patterns[pattern].test(inputText);
+      }
+      // If the pattern name isn't also the type attribute of the field, then test it as a regexp
+      else if (pattern !== $el.attr('type')) {
+        valid = new RegExp(pattern).test(inputText);
+      }
+      else {
+        valid = true;
+      }
+    }
+    // An empty field is valid if it's not required
+    else if (!$el.prop('required')) {
+      valid = true;
+    }
+
+    return valid;
    }
 
   /**
-   * Determines whether or a not a radio input is valid based on whether or not it is required and selected
+   * Determines whether or a not a radio input is valid based on whether or not it is required and selected. Although the function targets a single `<input>`, it validates by checking the `required` and `checked` properties of all radio buttons in its group.
    * @param {String} groupName - A string that specifies the name of a radio button group
@@ -300,14 +359,20 @@ * @returns {Boolean} Boolean value depends on whether or not at least one radio input has been selected (if it's required)
   validateRadio(groupName) {
-    var $group = this.$element.find(`:radio[name="${groupName}"]`),
-        counter = [],
-        _this = this;
+    // If at least one radio in the group has the `required` attribute, the group is considered required
+    // Per W3C spec, all radio buttons in a group should have `required`, but we're being nice
+    var $group = this.$element.find(`:radio[name="${groupName}"]`);
+    var valid = false;
 
-    $group.each(function(){
-      var rdio = $(this),
-          clear = _this.requiredCheck(rdio);
-      counter.push(clear);
-      if(clear) _this.removeErrorClasses(rdio);
+    // .attr() returns undefined if no elements in $group have the attribute "required"
+    if ($group.attr('required') === undefined) {
+      valid = true;
+    }
+
+    // For the group to be valid, at least one radio needs to be checked
+    $group.each((i, e) => {
+      if ($(e).prop('checked')) {
+        valid = true;
+      }
     });
 
-    return counter.indexOf(false) === -1;
+    return valid;
   }
@@ -314,0 +379,0 @@

js/foundation.accordion.js

@@ -41,10 +41,7 @@ 'use strict';
     this.$element.attr('role', 'tablist');
-    this.$tabs = this.$element.children('li');
-    if (this.$tabs.length === 0) {
-      this.$tabs = this.$element.children('[data-accordion-item]');
-    }
-    this.$tabs.each(function(idx, el){
+    this.$tabs = this.$element.children('li, [data-accordion-item]');
 
+    this.$tabs.each(function(idx, el) {
       var $el = $(el),
-          $content = $el.find('[data-tab-content]'),
+          $content = $el.children('[data-tab-content]'),
           id = $content[0].id || Foundation.GetYoDigits(6, 'accordion'),
@@ -60,2 +57,3 @@ linkId = el.id || `${id}-label`;
       });
+
       $content.attr({'role': 'tabpanel', 'aria-labelledby': linkId, 'aria-hidden': true, 'id': id});
@@ -99,6 +97,12 @@ });
             next: function() {
-              $elem.next().find('a').focus().trigger('click.zf.accordion');
+              var $a = $elem.next().find('a').focus();
+              if (!_this.options.multiExpand) {
+                $a.trigger('click.zf.accordion')
+              }
             },
             previous: function() {
-              $elem.prev().find('a').focus().trigger('click.zf.accordion');
+              var $a = $elem.prev().find('a').focus();
+              if (!_this.options.multiExpand) {
+                $a.trigger('click.zf.accordion')
+              }
             },
@@ -138,5 +142,4 @@ handled: function() {
   down($target, firstTime) {
-    var _this = this;
-    if(!this.options.multiExpand && !firstTime){
-      var $currentActive = this.$element.find('.is-active').children('[data-tab-content]');
+    if (!this.options.multiExpand && !firstTime) {
+      var $currentActive = this.$element.children('.is-active').children('[data-tab-content]');
       if($currentActive.length){
@@ -153,15 +156,10 @@ this.up($currentActive);
 
-    // Foundation.Move(_this.options.slideSpeed, $target, function(){
-      $target.slideDown(_this.options.slideSpeed, function () {
-        /**
-         * Fires when the tab is done opening.
-         * @event Accordion#down
-         */
-        _this.$element.trigger('down.zf.accordion', [$target]);
-      });
-    // });
+    $target.slideDown(this.options.slideSpeed, () => {
+      /**
+       * Fires when the tab is done opening.
+       * @event Accordion#down
+       */
+      this.$element.trigger('down.zf.accordion', [$target]);
+    });
 
-    // if(!firstTime){
-    //   Foundation._reflow(this.$element.attr('data-accordion'));
-    // }
     $(`#${$target.attr('aria-labelledby')}`).attr({
@@ -168,0 +166,0 @@ 'aria-expanded': true,

js/foundation.accordionMenu.js

@@ -112,15 +112,15 @@ 'use strict';
         if ($(this).is($element)) {
-          $prevElement = $elements.eq(Math.max(0, i-1));
-          $nextElement = $elements.eq(Math.min(i+1, $elements.length-1));
+          $prevElement = $elements.eq(Math.max(0, i-1)).find('a').first();
+          $nextElement = $elements.eq(Math.min(i+1, $elements.length-1)).find('a').first();
 
           if ($(this).children('[data-submenu]:visible').length) { // has open sub menu
-            $nextElement = $element.find('li:first-child');
+            $nextElement = $element.find('li:first-child').find('a').first();
           }
           if ($(this).is(':first-child')) { // is first element of sub menu
-            $prevElement = $element.parents('li').first();
+            $prevElement = $element.parents('li').first().find('a').first();
           } else if ($prevElement.children('[data-submenu]:visible').length) { // if previous element has open sub menu
-            $prevElement = $prevElement.find('li:last-child');
+            $prevElement = $prevElement.find('li:last-child').find('a').first();
           }
           if ($(this).is(':last-child')) { // is last element of sub menu
-            $nextElement = $element.parents('li').first().next('li');
+            $nextElement = $element.parents('li').first().next('li').find('a').first();
           }
@@ -135,3 +135,3 @@
             _this.down($target);
-            $target.find('li').first().focus();
+            $target.find('li').first().find('a').first().focus();
           }
@@ -144,10 +144,12 @@ },
             _this.up($element.parent('[data-submenu]'));
-            $element.parents('li').first().focus();
+            $element.parents('li').first().find('a').first().focus();
           }
         },
         up: function() {
-          $prevElement.focus();
+          $prevElement.attr('tabindex', -1).focus();
+          e.preventDefault();
         },
         down: function() {
-          $nextElement.focus();
+          $nextElement.attr('tabindex', -1).focus();
+          e.preventDefault();
         },
@@ -163,3 +165,2 @@ toggle: function() {
         handled: function() {
-          e.preventDefault();
           e.stopImmediatePropagation();
@@ -166,0 +167,0 @@ }

js/foundation.core.js

@@ -5,3 +5,3 @@ !function($) {
 
-var FOUNDATION_VERSION = '6.2.0';
+var FOUNDATION_VERSION = '6.2.1';
 
@@ -8,0 +8,0 @@ // Global Foundation object

js/foundation.drilldown.js

@@ -47,5 +47,5 @@ 'use strict';
   _init() {
-    this.$submenuAnchors = this.$element.find('li.is-drilldown-submenu-parent');
-    this.$submenus = this.$submenuAnchors.children('[data-submenu]');
-    this.$menuItems = this.$element.find('li').not('.js-drilldown-back').attr('role', 'menuitem');
+    this.$submenuAnchors = this.$element.find('li.is-drilldown-submenu-parent').children('a');
+    this.$submenus = this.$submenuAnchors.parent('li').children('[data-submenu]');
+    this.$menuItems = this.$element.find('li').not('.js-drilldown-back').attr('role', 'menuitem').find('a');
 
@@ -117,3 +117,3 @@ this._prepareMenu();
       // }
-      _this._show($elem);
+      _this._show($elem.parent('li'));
 
@@ -137,5 +137,7 @@ if(_this.options.closeOnClick){
     var _this = this;
-    this.$menuItems.add(this.$element.find('.js-drilldown-back')).on('keydown.zf.drilldown', function(e){
+    
+    this.$menuItems.add(this.$element.find('.js-drilldown-back > a')).on('keydown.zf.drilldown', function(e){
+      
       var $element = $(this),
-          $elements = $element.parent('ul').children('li'),
+          $elements = $element.parent('li').parent('ul').children('li').children('a'),
           $prevElement,
@@ -151,24 +153,29 @@ $nextElement;
       });
+
       Foundation.Keyboard.handleKey(e, 'Drilldown', {
         next: function() {
           if ($element.is(_this.$submenuAnchors)) {
-            _this._show($element);
-            $element.on(Foundation.transitionend($element), function(){
-              $element.find('ul li').filter(_this.$menuItems).first().focus();
+            _this._show($element.parent('li'));
+            $element.parent('li').one(Foundation.transitionend($element), function(){
+              $element.parent('li').find('ul li a').filter(_this.$menuItems).first().focus();
             });
+            e.preventDefault();
           }
         },
         previous: function() {
-          _this._hide($element.parent('ul'));
-          $element.parent('ul').on(Foundation.transitionend($element), function(){
+          _this._hide($element.parent('li').parent('ul'));
+          $element.parent('li').parent('ul').one(Foundation.transitionend($element), function(){
             setTimeout(function() {
-              $element.parent('ul').parent('li').focus();
+              $element.parent('li').parent('ul').parent('li').children('a').first().focus();
             }, 1);
           });
+          e.preventDefault();
         },
         up: function() {
           $prevElement.focus();
+          e.preventDefault();
         },
         down: function() {
           $nextElement.focus();
+          e.preventDefault();
         },
@@ -181,11 +188,18 @@ close: function() {
           if (!$element.is(_this.$menuItems)) { // not menu item means back button
-            _this._hide($element.parent('ul'));
-            setTimeout(function(){$element.parent('ul').parent('li').focus();}, 1);
+            _this._hide($element.parent('li').parent('ul'));
+            $element.parent('li').parent('ul').one(Foundation.transitionend($element), function(){
+              setTimeout(function() {
+                $element.parent('li').parent('ul').parent('li').children('a').first().focus();
+              }, 1);
+            });            
+            e.preventDefault();
           } else if ($element.is(_this.$submenuAnchors)) {
-            _this._show($element);
-            setTimeout(function(){$element.find('ul li').filter(_this.$menuItems).first().focus();}, 1);
+            _this._show($element.parent('li'));
+            $element.parent('li').one(Foundation.transitionend($element), function(){
+              $element.parent('li').find('ul li a').filter(_this.$menuItems).first().focus();
+            });            
+            e.preventDefault();
           }
         },
         handled: function() {
-          e.preventDefault();
           e.stopImmediatePropagation();
@@ -252,3 +266,3 @@ }
    * @fires Drilldown#open
-   * @param {jQuery} $elem - the current element with a submenu to open.
+   * @param {jQuery} $elem - the current element with a submenu to open, i.e. the `li` tag.
    */
@@ -265,3 +279,3 @@ _show($elem) {
    * @fires Drilldown#hide
-   * @param {jQuery} $elem - the current sub-menu to hide.
+   * @param {jQuery} $elem - the current sub-menu to hide, i.e. the `ul` tag.
    */
@@ -329,3 +343,3 @@ _hide($elem) {
    */
-  backButton: '<li class="js-drilldown-back"><a>Back</a></li>',
+  backButton: '<li class="js-drilldown-back"><a tabindex="0">Back</a></li>',
   /**
@@ -355,2 +369,2 @@ * Markup used to wrap drilldown menu. Use a class name for independent styling; the JS applied class: `is-drilldown` is required. Remove the backslash (`\`) if copy and pasting.
 
-}(jQuery);
+}(jQuery);

js/foundation.dropdown.js

@@ -72,4 +72,7 @@ 'use strict';
   getPositionClass() {
-    var position = this.$element[0].className.match(/\b(top|left|right)\b/g);
-        position = position ? position[0] : '';
+    var verticalPosition = this.$element[0].className.match(/(top|left|right|bottom)/g);
+        verticalPosition = verticalPosition ? verticalPosition[0] : '';
+    var horizontalPosition = /float-(.+)\s/.exec(this.$anchor[0].className);
+        horizontalPosition = horizontalPosition ? horizontalPosition[1] : '';
+    var position = horizontalPosition ? horizontalPosition + ' ' + verticalPosition : verticalPosition;
     return position;
@@ -134,2 +137,4 @@ }
 
+
+
     if(($eleDims.width >= $eleDims.windowDims.width) || (!this.counter && !Foundation.Box.ImNotTouchingYou(this.$element))){
@@ -146,3 +151,3 @@ this.$element.offset(Foundation.Box.GetOffsets(this.$element, this.$anchor, 'center bottom', this.options.vOffset, this.options.hOffset, true)).css({
 
-    while(!Foundation.Box.ImNotTouchingYou(this.$element) && this.counter){
+    while(!Foundation.Box.ImNotTouchingYou(this.$element, false, true) && this.counter){
       this._reposition(position);
@@ -149,0 +154,0 @@ this._setPosition();

js/foundation.dropdownMenu.js

@@ -53,3 +53,3 @@ 'use strict';
 
-    if (this.$element.hasClass(this.options.rightClass) || this.options.alignment === 'right' || Foundation.rtl()) {
+    if (this.$element.hasClass(this.options.rightClass) || this.options.alignment === 'right' || Foundation.rtl() || this.$element.parents('.top-bar-right').is('*')) {
       this.options.alignment = 'right';
@@ -56,0 +56,0 @@ subs.addClass('opens-left');

js/foundation.equalizer.js

@@ -158,3 +158,3 @@ 'use strict';
   getHeightsByRow(cb) {
-    var lastElTopOffset = this.$watched.first().offset().top,
+    var lastElTopOffset = (this.$watched.length ? this.$watched.first().offset().top : 0),
         groups = [],
@@ -161,0 +161,0 @@ group = 0;

js/foundation.interchange.js

@@ -142,3 +142,3 @@ 'use strict';
     // Replacing background images
-    else if (path.match(/\.(gif|jpg|jpeg|tiff|png)([?#].*)?/i)) {
+    else if (path.match(/\.(gif|jpg|jpeg|png|svg|tiff)([?#].*)?/i)) {
       this.$element.css({ 'background-image': 'url('+path+')' })
@@ -145,0 +145,0 @@ .trigger(trigger);

js/foundation.orbit.js

@@ -203,3 +203,4 @@ 'use strict';
         //also need to handle enter/return and spacebar key presses
-        .on('click.zf.orbit touchend.zf.orbit', function(){
+        .on('click.zf.orbit touchend.zf.orbit', function(e){
+	  e.preventDefault();
           _this.changeSlide($(this).hasClass(_this.options.nextClass));
@@ -206,0 +207,0 @@ });

js/foundation.responsiveMenu.js

@@ -41,21 +41,24 @@ 'use strict';
   _init() {
-    var rulesTree = {};
+    // The first time an Interchange plugin is initialized, this.rules is converted from a string of "classes" to an object of rules
+    if (typeof this.rules === 'string') {
+      let rulesTree = {};
 
-    // Parse rules from "classes" in data attribute
-    var rules = this.rules.split(' ');
+      // Parse rules from "classes" pulled from data attribute
+      let rules = this.rules.split(' ');
 
-    // Iterate through every rule found
-    for (var i = 0; i < rules.length; i++) {
-      var rule = rules[i].split('-');
-      var ruleSize = rule.length > 1 ? rule[0] : 'small';
-      var rulePlugin = rule.length > 1 ? rule[1] : rule[0];
+      // Iterate through every rule found
+      for (let i = 0; i < rules.length; i++) {
+        let rule = rules[i].split('-');
+        let ruleSize = rule.length > 1 ? rule[0] : 'small';
+        let rulePlugin = rule.length > 1 ? rule[1] : rule[0];
 
-      if (MenuPlugins[rulePlugin] !== null) {
-        rulesTree[ruleSize] = MenuPlugins[rulePlugin];
+        if (MenuPlugins[rulePlugin] !== null) {
+          rulesTree[ruleSize] = MenuPlugins[rulePlugin];
+        }
       }
+
+      this.rules = rulesTree;
     }
 
-    this.rules = rulesTree;
-
-    if (!$.isEmptyObject(rulesTree)) {
+    if (!$.isEmptyObject(this.rules)) {
       this._checkMediaQueries();
@@ -62,0 +65,0 @@ }

js/foundation.reveal.js

@@ -112,13 +112,23 @@ 'use strict';
     var outerHeight = $(window).height();
-    var left = parseInt((outerWidth - width) / 2, 10);
-    var top;
-    if (height > outerHeight) {
-      top = parseInt(Math.min(100, outerHeight / 10), 10);
+    var left, top;
+    if (this.options.hOffset === 'auto') {
+      left = parseInt((outerWidth - width) / 2, 10);
     } else {
-      top = parseInt((outerHeight - height) / 4, 10);
+      left = parseInt(this.options.hOffset, 10);
     }
+    if (this.options.vOffset === 'auto') {
+      if (height > outerHeight) {
+        top = parseInt(Math.min(100, outerHeight / 10), 10);
+      } else {
+        top = parseInt((outerHeight - height) / 4, 10);
+      }
+    } else {
+      top = parseInt(this.options.vOffset, 10);
+    }
     this.$element.css({top: top + 'px'});
-    // only worry about left if we don't have an overlay, otherwise we're perfectly in the middle
-    if(!this.$overlay) {
+    // only worry about left if we don't have an overlay or we havea  horizontal offset,
+    // otherwise we're perfectly in the middle
+    if(!this.$overlay || (this.options.hOffset !== 'auto')) {
       this.$element.css({left: left + 'px'});
+      this.$element.css({margin: '0px'});
     }
@@ -228,3 +238,3 @@
       }
-      Foundation.Motion.animateIn(this.$element, this.options.animationIn, function() {
+      Foundation.Motion.animateIn(this.$element, this.options.animationIn, () => {
         this.focusableElements = Foundation.Keyboard.findFocusable(this.$element);
@@ -297,5 +307,2 @@ });
         });
-        if (_this.focusableElements.length === 0) { // no focusable elements inside the modal at all, prevent tabbing in general
-          e.preventDefault();
-        }
       });
@@ -314,2 +321,5 @@ }
           }
+          if (_this.focusableElements.length === 0) { // no focusable elements inside the modal at all, prevent tabbing in general
+            e.preventDefault();
+          }
         },
@@ -321,2 +331,5 @@ tab_backward: function() {
           }
+          if (_this.focusableElements.length === 0) { // no focusable elements inside the modal at all, prevent tabbing in general
+            e.preventDefault();
+          }
         },
@@ -445,2 +458,3 @@ open: function() {
     if (this.options.overlay) {
+      this.$element.appendTo($('body')); // move $element outside of $overlay to prevent error unregisterPlugin()
       this.$overlay.hide().off().remove();
@@ -502,11 +516,11 @@ }
    * @option
-   * @example 100
+   * @example auto
    */
-  vOffset: 100,
+  vOffset: 'auto',
   /**
    * Distance, in pixels, the modal should push in from the side of the screen.
    * @option
-   * @example 0
+   * @example auto
    */
-  hOffset: 0,
+  hOffset: 'auto',
   /**
@@ -513,0 +527,0 @@ * Allows the modal to be fullscreen, completely blocking out the rest of the view. JS checks for this as well.

js/foundation.slider.js

@@ -106,2 +106,3 @@ 'use strict';
    * @fires Slider#moved
+   * @fires Slider#changed
    */
@@ -141,3 +142,3 @@ _setHandlePos($hndl, location, noInvert, cb) {
         //percentage of bar min/max value based on click or drag point
-        pctOfBar = percent(location, this.options.end).toFixed(2),
+        pctOfBar = percent(location - this.options.start, this.options.end - this.options.start).toFixed(2),
         //number of actual pixels to shift the handle, based on the percentage obtained above
@@ -204,2 +205,11 @@ pxToMove = (elemDim - handleDim) * pctOfBar,
     });
+
+    /**
+     * Fires when the value has not been change for a given time.
+     * @event Slider#changed
+     */    
+    clearTimeout(_this.timeout);
+    _this.timeout = setTimeout(function(){
+      _this.$element.trigger('changed.zf.slider', [$hndl]);
+    }, _this.options.changedDelay);
   }
@@ -271,3 +281,3 @@
           offsetPct = percent(barXY, barDim);
-      value = (this.options.end - this.options.start) * offsetPct;
+      value = (this.options.end - this.options.start) * offsetPct + this.options.start;
 
@@ -527,3 +537,9 @@ // turn everything around for RTL, yay math!
    */
-  invertVertical: false
+  invertVertical: false,
+  /**
+   * Milliseconds before the `changed.zf-slider` event is triggered after value change. 
+   * @option
+   * @example 500
+   */
+  changedDelay: 500
 };
@@ -530,0 +546,0 @@

js/foundation.toggler.js

@@ -106,4 +106,4 @@ 'use strict';
       Foundation.Motion.animateIn(this.$element, this.animationIn, function() {
+        _this._updateARIA(true);
         this.trigger('on.zf.toggler');
-        _this._updateARIA(true);
       });
@@ -113,4 +113,4 @@ }
       Foundation.Motion.animateOut(this.$element, this.animationOut, function() {
+        _this._updateARIA(false);
         this.trigger('off.zf.toggler');
-        _this._updateARIA(false);
       });
@@ -117,0 +117,0 @@ }

js/foundation.util.box.js

@@ -175,2 +175,14 @@ 'use strict';
       break;
+    case 'left bottom':
+      return {
+        left: $anchorDims.offset.left - ($eleDims.width + hOffset),
+        top: $anchorDims.offset.top + $anchorDims.height
+      };
+      break;
+    case 'right bottom':
+      return {
+        left: $anchorDims.offset.left + $anchorDims.width + hOffset - $eleDims.width,
+        top: $anchorDims.offset.top + $anchorDims.height
+      };
+      break;
     default:
@@ -177,0 +189,0 @@ return {

js/foundation.util.mediaQuery.js

@@ -87,3 +87,3 @@ 'use strict';
 
-    for (var i in this.queries) {
+    for (var i = 0; i < this.queries.length; i++) {
       var query = this.queries[i];
@@ -90,0 +90,0 @@

package.json

 {
   "name": "foundation-sites",
-  "version": "6.2.0",
+  "version": "6.2.1",
   "main": "dist/foundation.js",
@@ -10,11 +10,16 @@ "description": "The most advanced responsive front-end framework in the world.",
     "start": "gulp",
-    "test": "gulp test",
-    "deploy": "gulp deploy"
+    "test": "npm run test:sass && npm run test:javascript",
+    "test:sass": "mocha test/sass/test_sass.js",
+    "test:javascript": "gulp sass:foundation && gulp test:transpile-js && mocha-phantomjs test/javascript/index.html",
+    "test:visual": "gulp test",
+    "deploy": "gulp deploy",
+    "deploy:docs": "gulp deploy:docs"
   },
   "dependencies": {
     "jquery": "^2.2.0",
-    "what-input": "^1.1.2"
+    "what-input": "^2.0.0"
   },
   "license": "MIT",
   "devDependencies": {
+    "array-uniq": "^1.0.2",
     "babel-core": "^6.3.26",
@@ -32,2 +37,3 @@ "babel-eslint": "^5.0.0",
     "browser-sync": "^2.8.2",
+    "chai-jquery": "^2.0.0",
     "chalk": "^1.1.1",
@@ -38,2 +44,3 @@ "clipboard": "^1.5.5",
     "gulp": "^3.8.10",
+    "gulp-add-src": "^0.2.0",
     "gulp-autoprefixer": "^2.3.1",
@@ -46,2 +53,3 @@ "gulp-babel": "^6.1.1",
     "gulp-filter": "^3.0.1",
+    "gulp-if": "^2.0.0",
     "gulp-load-plugins": "^1.2.0",
@@ -60,8 +68,13 @@ "gulp-mocha": "^2.2.0",
     "gulp-uglify": "^1.1.0",
-    "inquirer": "^0.11.2",
+    "gulp-zip": "^3.2.0",
+    "inquirer": "^0.11.4",
+    "is-empty-object": "^1.1.1",
+    "js-yaml": "^3.5.4",
     "mocha": "^2.3.3",
+    "mocha-phantomjs": "^4.0.2",
     "motion-ui": "^1.1.0",
+    "multiline": "^1.0.2",
     "octophant": "^1.0.0",
     "opener": "^1.4.1",
-    "panini": "^1.1.1",
+    "panini": "^1.3.0",
     "parker": "0.0.9",
@@ -73,3 +86,8 @@ "prettyjson": "^1.1.3",
     "sass-true": "^2.0.3",
-    "supercollider": "^1.4.0"
+    "sinon": "^1.17.3",
+    "supercollider": "^1.4.0",
+    "touch": "^1.0.0",
+    "vinyl": "^1.1.1",
+    "vinyl-source-stream": "^1.1.0",
+    "yargs": "^4.2.0"
   },
@@ -97,3 +115,5 @@ "repository": {
       "dist/foundation": {
-        "deps": ["jquery"]
+        "deps": [
+          "jquery"
+        ]
       }
@@ -100,0 +120,0 @@ }

README.md

@@ -17,3 +17,3 @@ # [Foundation for Sites](http://foundation.zurb.com)
 
-The documentation can be found at <https://foundation.zurb.com/sites/docs>. To run the documentation locally on your machine, you need [Node.js](https://nodejs.org/en/) and [Ruby](https://www.ruby-lang.org/en/) installed on your computer.
+The documentation can be found at <https://foundation.zurb.com/sites/docs>. To run the documentation locally on your machine, you need [Node.js](https://nodejs.org/en/) and [Ruby](https://www.ruby-lang.org/en/) installed on your computer. (Your Node.js version must be 0.12 or higher.)
 
@@ -31,2 +31,12 @@ Run these commands to set up the documentation:
 
+## Testing
+
+Foundation has three kinds of tests: JavaScript, Sass, and visual regression. Refer to our [testing guide](https://github.com/zurb/foundation-sites/wiki/Testing-Guide) for more details.
+
+These commands will run the various tests:
+
+- `npm run test:sass`
+- `npm run test:javascript`
+- `npm run test:visual`
+
 ## Contributing
@@ -33,0 +43,0 @@

New alerts

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Fixed alerts

NPM Shrinkwrap

Supply chain risk

Package contains a shrinkwrap file. This may allow the package to bypass normal install procedures.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

2210051

increased by53.76%

Number of package files

159

increased by2.58%

Lines of code

42146

increased by57.96%

Number of lines in readme file

45

increased by28.57%

Number of high supply chain risk alerts

0

decreased by-100%

Worsened metrics

Dev dependency count

64

increased by28%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Addedwhat-input@2.1.1(transitive)

• - Removedansi-gray@0.1.1(transitive)

• - Removedansi-regex@2.1.1(transitive)

• - Removedansi-styles@2.2.1(transitive)

• - Removedansi-wrap@0.1.0(transitive)

• - Removedarray-differ@1.0.0(transitive)

• - Removedarray-uniq@1.0.3(transitive)

• - Removedbeeper@1.1.1(transitive)

• - Removedchalk@1.1.3(transitive)

• - Removedclone@1.0.4(transitive)

• - Removedclone-stats@0.0.1(transitive)

• - Removedcolor-support@1.1.3(transitive)

• - Removedconcat-with-sourcemaps@1.1.0(transitive)

• - Removedcore-util-is@1.0.3(transitive)

• - Removeddateformat@2.2.0(transitive)

• - Removedduplexer2@0.0.2(transitive)

• - Removedescape-string-regexp@1.0.5(transitive)

• - Removedfancy-log@1.3.3(transitive)

• - Removedglogg@1.0.2(transitive)

• - Removedgulp-header@1.7.1(transitive)

• - Removedgulp-util@3.0.8(transitive)

• - Removedgulplog@1.0.0(transitive)

• - Removedhas-ansi@2.0.0(transitive)

• - Removedhas-gulplog@0.1.0(transitive)

• - Removedinherits@2.0.4(transitive)

• - Removedisarray@0.0.11.0.0(transitive)

• - Removedlodash._basecopy@3.0.1(transitive)

• - Removedlodash._basetostring@3.0.1(transitive)

• - Removedlodash._basevalues@3.0.0(transitive)

• - Removedlodash._getnative@3.9.1(transitive)

• - Removedlodash._isiterateecall@3.0.9(transitive)

• - Removedlodash._reescape@3.0.0(transitive)

• - Removedlodash._reevaluate@3.0.0(transitive)

• - Removedlodash._reinterpolate@3.0.0(transitive)

• - Removedlodash._root@3.0.1(transitive)

• - Removedlodash.escape@3.2.0(transitive)

• - Removedlodash.isarguments@3.1.0(transitive)

• - Removedlodash.isarray@3.0.4(transitive)

• - Removedlodash.keys@3.1.2(transitive)

• - Removedlodash.restparam@3.6.1(transitive)

• - Removedlodash.template@3.6.2(transitive)

• - Removedlodash.templatesettings@3.1.1(transitive)

• - Removedminimist@1.2.8(transitive)

• - Removedmultipipe@0.1.2(transitive)

• - Removedobject-assign@3.0.04.1.1(transitive)

• - Removedparse-node-version@1.0.1(transitive)

• - Removedprocess-nextick-args@2.0.1(transitive)

• - Removedreadable-stream@1.1.142.3.83.6.2(transitive)

• - Removedreplace-ext@0.0.1(transitive)

• - Removedsafe-buffer@5.1.25.2.1(transitive)

• - Removedsource-map@0.6.1(transitive)

• - Removedsparkles@1.0.1(transitive)

• - Removedstring_decoder@0.10.311.1.11.3.0(transitive)

• - Removedstrip-ansi@3.0.1(transitive)

• - Removedsupports-color@2.0.0(transitive)

• - Removedthrough2@2.0.54.0.2(transitive)

• - Removedtime-stamp@1.1.0(transitive)

• - Removedutil-deprecate@1.0.2(transitive)

• - Removedvinyl@0.5.3(transitive)

• - Removedwhat-input@1.2.5(transitive)

• - Removedxtend@4.0.2(transitive)

• Updatedwhat-input@^2.0.0