nuka-carousel - npm Package Compare versions

Comparing version 4.7.9 to 4.8.0

CHANGELOG.md

 # Nuka Changelog
 
+## 4.7.9 (2021-07-13)
+
+- [#791](https://github.com/FormidableLabs/nuka-carousel/pull/791) Fix: bind blockEvent method to `this`
+- [#785](https://github.com/FormidableLabs/nuka-carousel/pull/785) Fix: update react-move
+- [#781](https://github.com/FormidableLabs/nuka-carousel/pull/781) Fix: Improve SVG dot A11y
+- [#779](https://github.com/FormidableLabs/nuka-carousel/pull/779) Dep bumps
+- [#777](https://github.com/FormidableLabs/nuka-carousel/pull/777)
+- [#776](https://github.com/FormidableLabs/nuka-carousel/pull/776)
+
 ## 4.7.8 (2021-05-10)
@@ -4,0 +13,0 @@

es/announce-slide.js

@@ -7,7 +7,10 @@ import React from 'react';
     position: 'absolute',
-    left: '-10000px',
-    top: 'auto',
     width: '1px',
     height: '1px',
-    overflow: 'hidden'
+    overflow: 'hidden',
+    padding: 0,
+    margin: '-1px',
+    clip: 'rect(0, 0, 0, 0)',
+    whiteSpace: 'nowrap',
+    border: 0
   };
@@ -14,0 +17,0 @@ return /*#__PURE__*/React.createElement("div", {

es/default-controls.js

@@ -209,3 +209,4 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
       onClick: props.goToSlide.bind(null, index),
-      "aria-label": "slide ".concat(index + 1, " bullet")
+      "aria-label": "slide ".concat(index + 1, " bullet"),
+      "aria-selected": isActive
     }, /*#__PURE__*/React.createElement("svg", {
@@ -212,0 +213,0 @@ className: "paging-dot",

es/index.js

@@ -1123,3 +1123,4 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
           slideCount = _this$state4.slideCount,
-          frameWidth = _this$state4.frameWidth;
+          frameWidth = _this$state4.frameWidth,
+          hasInteraction = _this$state4.hasInteraction;
       var _this$props = this.props,
@@ -1132,3 +1133,3 @@ disableAnimation = _this$props.disableAnimation,
           vertical = _this$props.vertical;
-      var duration = this.state.dragging || !this.state.dragging && this.state.resetWrapAroundPosition && this.props.wrapAround || disableAnimation || !this.state.hasInteraction ? 0 : this.props.speed;
+      var duration = this.state.dragging || !this.state.dragging && this.state.resetWrapAroundPosition && this.props.wrapAround || disableAnimation || !hasInteraction ? 0 : this.props.speed;
       var frameStyles = getFrameStyles(frameOverflow, vertical, framePadding, frameWidth);
@@ -1146,5 +1147,7 @@ var touchEvents = this.getTouchEvents();
 
-      return /*#__PURE__*/React.createElement("div", {
+      return /*#__PURE__*/React.createElement("section", {
         className: ['slider', this.props.className || ''].join(' ').trim(),
         onFocus: this.handleFocus,
+        "aria-label": "carousel-slider",
+        role: "region",
         onBlur: this.handleBlur,
@@ -1151,0 +1154,0 @@ ref: this.props.innerRef,

es/transitions/3d-scroll-transition.js

@@ -84,6 +84,8 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
         var current = currentSlide === index;
-        return /*#__PURE__*/React.createElement("li", {
+        return /*#__PURE__*/React.createElement("div", {
           className: "slider-slide".concat(visible ? ' slide-visible' : '').concat(current ? ' slide-current' : ''),
           style: _this2.getSlideStyles(index, positionValue),
           key: index,
+          "aria-label": "slide ".concat(index + 1, " of ").concat(children.length),
+          role: "group",
           onClick: handleSelfFocus,
@@ -214,3 +216,3 @@ tabIndex: -1
       var children = this.formatChildren(this.props.children);
-      return /*#__PURE__*/React.createElement("ul", {
+      return /*#__PURE__*/React.createElement("div", {
         className: "slider-list",
@@ -217,0 +219,0 @@ style: this.getListStyles()

es/transitions/fade-transition.js

@@ -52,6 +52,8 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
       return React.Children.map(children, function (child, index) {
-        return /*#__PURE__*/React.createElement("li", {
+        return /*#__PURE__*/React.createElement("div", {
           className: "slider-slide".concat(getSlideClassName(index, currentSlide, slidesToShow)),
           style: _this2.getSlideStyles(index, opacity),
           key: index,
+          "aria-label": "slide ".concat(index + 1, " of ").concat(children.length),
+          role: "group",
           onClick: handleSelfFocus,
@@ -150,3 +152,3 @@ tabIndex: -1
       var children = this.formatChildren(this.props.children, opacityAndLeftMap);
-      return /*#__PURE__*/React.createElement("ul", {
+      return /*#__PURE__*/React.createElement("div", {
         className: "slider-list",
@@ -153,0 +155,0 @@ style: this.getContainerStyles()

es/transitions/scroll-transition.js

@@ -126,4 +126,6 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
         };
-        return /*#__PURE__*/React.createElement("li", _extends({
+        return /*#__PURE__*/React.createElement("div", _extends({
           className: "slider-slide".concat(getSlideClassName(index, currentSlide, slidesToShow)),
+          "aria-label": "slide ".concat(index + 1, " of ").concat(children.length),
+          role: "group",
           style: _this2.getSlideStyles(index, positionValue),
@@ -192,3 +194,3 @@ key: index,
       var deltaY = this.props.deltaY;
-      return /*#__PURE__*/React.createElement("ul", {
+      return /*#__PURE__*/React.createElement("div", {
         className: "slider-list",
@@ -195,0 +197,0 @@ style: this.getListStyles({

lib/announce-slide.js

@@ -16,7 +16,10 @@ "use strict";
     position: 'absolute',
-    left: '-10000px',
-    top: 'auto',
     width: '1px',
     height: '1px',
-    overflow: 'hidden'
+    overflow: 'hidden',
+    padding: 0,
+    margin: '-1px',
+    clip: 'rect(0, 0, 0, 0)',
+    whiteSpace: 'nowrap',
+    border: 0
   };
@@ -23,0 +26,0 @@ return /*#__PURE__*/_react["default"].createElement("div", {

lib/default-controls.js

@@ -230,3 +230,4 @@ "use strict";
       onClick: props.goToSlide.bind(null, index),
-      "aria-label": "slide ".concat(index + 1, " bullet")
+      "aria-label": "slide ".concat(index + 1, " bullet"),
+      "aria-selected": isActive
     }, /*#__PURE__*/_react["default"].createElement("svg", {
@@ -233,0 +234,0 @@ className: "paging-dot",

lib/index.js

@@ -1165,3 +1165,4 @@ "use strict";
           slideCount = _this$state4.slideCount,
-          frameWidth = _this$state4.frameWidth;
+          frameWidth = _this$state4.frameWidth,
+          hasInteraction = _this$state4.hasInteraction;
       var _this$props = this.props,
@@ -1174,3 +1175,3 @@ disableAnimation = _this$props.disableAnimation,
           vertical = _this$props.vertical;
-      var duration = this.state.dragging || !this.state.dragging && this.state.resetWrapAroundPosition && this.props.wrapAround || disableAnimation || !this.state.hasInteraction ? 0 : this.props.speed;
+      var duration = this.state.dragging || !this.state.dragging && this.state.resetWrapAroundPosition && this.props.wrapAround || disableAnimation || !hasInteraction ? 0 : this.props.speed;
       var frameStyles = (0, _styleUtilities.getFrameStyles)(frameOverflow, vertical, framePadding, frameWidth);
@@ -1188,5 +1189,7 @@ var touchEvents = this.getTouchEvents();
 
-      return /*#__PURE__*/_react["default"].createElement("div", {
+      return /*#__PURE__*/_react["default"].createElement("section", {
         className: ['slider', this.props.className || ''].join(' ').trim(),
         onFocus: this.handleFocus,
+        "aria-label": "carousel-slider",
+        role: "region",
         onBlur: this.handleBlur,
@@ -1193,0 +1196,0 @@ ref: this.props.innerRef,

lib/transitions/3d-scroll-transition.js

@@ -97,6 +97,8 @@ "use strict";
         var current = currentSlide === index;
-        return /*#__PURE__*/_react["default"].createElement("li", {
+        return /*#__PURE__*/_react["default"].createElement("div", {
           className: "slider-slide".concat(visible ? ' slide-visible' : '').concat(current ? ' slide-current' : ''),
           style: _this2.getSlideStyles(index, positionValue),
           key: index,
+          "aria-label": "slide ".concat(index + 1, " of ").concat(children.length),
+          role: "group",
           onClick: _utilities.handleSelfFocus,
@@ -229,3 +231,3 @@ tabIndex: -1
       var children = this.formatChildren(this.props.children);
-      return /*#__PURE__*/_react["default"].createElement("ul", {
+      return /*#__PURE__*/_react["default"].createElement("div", {
         className: "slider-list",
@@ -232,0 +234,0 @@ style: this.getListStyles()

lib/transitions/fade-transition.js

@@ -64,6 +64,8 @@ "use strict";
       return _react["default"].Children.map(children, function (child, index) {
-        return /*#__PURE__*/_react["default"].createElement("li", {
+        return /*#__PURE__*/_react["default"].createElement("div", {
           className: "slider-slide".concat((0, _utilities.getSlideClassName)(index, currentSlide, slidesToShow)),
           style: _this2.getSlideStyles(index, opacity),
           key: index,
+          "aria-label": "slide ".concat(index + 1, " of ").concat(children.length),
+          role: "group",
           onClick: _utilities.handleSelfFocus,
@@ -162,3 +164,3 @@ tabIndex: -1
       var children = this.formatChildren(this.props.children, opacityAndLeftMap);
-      return /*#__PURE__*/_react["default"].createElement("ul", {
+      return /*#__PURE__*/_react["default"].createElement("div", {
         className: "slider-list",
@@ -165,0 +167,0 @@ style: this.getContainerStyles()

lib/transitions/scroll-transition.js

@@ -139,4 +139,6 @@ "use strict";
         };
-        return /*#__PURE__*/_react["default"].createElement("li", _extends({
+        return /*#__PURE__*/_react["default"].createElement("div", _extends({
           className: "slider-slide".concat((0, _utilities.getSlideClassName)(index, currentSlide, slidesToShow)),
+          "aria-label": "slide ".concat(index + 1, " of ").concat(children.length),
+          role: "group",
           style: _this2.getSlideStyles(index, positionValue),
@@ -208,3 +210,3 @@ key: index,
       var deltaY = this.props.deltaY;
-      return /*#__PURE__*/_react["default"].createElement("ul", {
+      return /*#__PURE__*/_react["default"].createElement("div", {
         className: "slider-list",
@@ -211,0 +213,0 @@ style: this.getListStyles({

package.json

 {
   "name": "nuka-carousel",
-  "version": "4.7.9",
+  "version": "4.8.0",
   "description": "Pure React Carousel",
@@ -5,0 +5,0 @@ "main": "index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

301089

increased by0.54%

Lines of code

5638

increased by0.46%

No dependency changes